.pwa-guide { max-width: 26em; margin: 14px auto 0; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: rgba(4, 7, 15, 0.6); text-align: left; }
.pwa-guide .pg-line { margin: 0; font-size: 0.86rem; color: var(--fg); line-height: 1.7; }
.pwa-guide .pg-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin: 10px 0 0; }
.pwa-guide .pg-install { padding: 0.6em 1.4em; font-size: 0.9rem; cursor: pointer; }
.pwa-guide .pg-open, .pwa-guide .pg-close { padding: 4px 2px; background: none; border: 0; font: inherit; font-size: 0.84rem; letter-spacing: 0.04em; color: var(--gold-light); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.pwa-guide .pg-close { color: var(--fg-muted); margin-left: auto; }
.pwa-guide .pg-panel > .pg-close { display: block; margin: 8px 0 0 auto; } 
.pwa-guide .pg-panel { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.pwa-guide .pg-panel[hidden] { display: none; }
.pwa-guide .pg-title { margin: 0 0 6px; font-size: 0.86rem; color: var(--gold); letter-spacing: 0.06em; }
.pwa-guide .pg-steps { margin: 14px 0 0; padding-left: 1.4em; font-size: 0.88rem; color: var(--fg); line-height: 1.8; }
.pwa-guide .pg-share { display: inline-block; width: 1.35em; height: 1.35em; margin-left: 6px; vertical-align: -0.3em; fill: none; stroke: #4aa3ff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; background: #fff; border-radius: 4px; padding: 1px; }

.handoff-code .hc-lead, .handoff-code .hc-caution, .handoff-import .hi-lead { margin: 0 0 8px; font-size: 0.84rem; line-height: 1.7; color: var(--fg); text-align: left; }
.handoff-code .hc-caution { color: var(--gold-light); }
.handoff-code .hc-text, .handoff-import .hi-text { box-sizing: border-box; width: 100%; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: rgba(0, 0, 0, 0.45); color: var(--fg); font: 0.78rem/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; word-break: break-all; resize: vertical; }
.handoff-code .hc-actions, .handoff-import .hi-actions { margin: 8px 0 0; text-align: center; }
.handoff-code .hc-copy, .handoff-import .hi-go { padding: 0.55em 1.6em; font-size: 0.88rem; cursor: pointer; }
.handoff-import .hi-open, .handoff .mine-handoff { padding: 4px 2px; background: none; border: 0; font: inherit; font-size: 0.82rem; letter-spacing: 0.04em; color: var(--fg-muted); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.handoff-import .hi-form { margin-top: 10px; }
.handoff-import .hi-form[hidden], .handoff-import .hi-error[hidden], .handoff-import .hi-confirm[hidden], .handoff .handoff-panel[hidden] { display: none; }
.handoff-import .hi-error { margin: 6px 0 0; font-size: 0.84rem; color: #ffb4a8; }
.handoff-import .hi-confirm { margin-top: 10px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; }
.handoff-import .hi-confirm p { margin: 0; font-size: 0.86rem; color: var(--fg); }
.handoff-import .hi-confirm-row { display: flex; justify-content: center; align-items: center; gap: 16px; margin-top: 10px !important; }
.handoff-import .hi-confirm-row .btn-gold { padding: 0.5em 1.4em; font: inherit; font-size: 0.86rem; cursor: pointer; }
.handoff-import .hi-no { background: none; border: 0; font: inherit; font-size: 0.84rem; color: var(--fg-muted); text-decoration: underline; cursor: pointer; }

.hero-import { max-width: 26em; margin: 14px auto 0; }
.hero-import .hi-open { padding: 6px 14px; border-radius: 999px; background: rgba(4, 7, 15, 0.72); color: var(--fg); text-wrap: balance; } 
.hero-import .hi-form { padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: rgba(4, 7, 15, 0.7); }

.mine .handoff { margin-top: 14px; }
.mine .handoff-panel { max-width: 26em; margin: 10px auto 0; padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; background: rgba(4, 7, 15, 0.55); }
.mine .handoff-panel .handoff-import { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); }
.mine .pwa-guide { margin: 0 auto 18px; }

@media (min-width: 900px) and (min-height: 600px) and (orientation: landscape) {
  .hero-import, #hero-pwa .pwa-guide { margin-left: 0; }
}

.inapp-gate .inapp-title { margin: 0 0 10px; font-family: var(--font-serif); font-size: 1.15rem; font-weight: 500; letter-spacing: 0.04em; color: var(--gold-light); line-height: 1.6; text-wrap: balance; }
.inapp-gate .inapp-body, .inapp-result .inapp-body { margin: 0; font-size: 0.92rem; line-height: 1.85; color: var(--fg); text-align: left; text-wrap: pretty; }
.inapp-title .seg { display: inline-block; }
.inapp-actions { margin: 16px 0 0; text-align: center; }
.inapp-actions:empty { display: none; }
.inapp-open { padding: 0.75em 1.6em; font-size: 0.95rem; cursor: pointer; }
.inapp-fallback { margin: 14px 0 0; padding: 10px 12px; border: 1px solid var(--gold-dim); border-radius: 10px; font-size: 0.86rem; line-height: 1.75; color: var(--gold-light); text-align: left; }
.inapp-fallback[hidden] { display: none; }
.inapp-continue-row { margin: 14px 0 0; text-align: center; }
.inapp-continue { padding: 6px 4px; background: none; border: 0; font: inherit; font-size: 0.84rem; letter-spacing: 0.04em; color: var(--fg-muted); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

.inapp-result { margin: 0 0 18px; padding: 16px 16px 14px; border: 1px solid var(--gold-dim); border-radius: 14px; background: rgba(212, 175, 55, 0.08); }
.inapp-result .inapp-title { margin: 0 0 8px; font-family: var(--font-serif); font-size: 1.02rem; font-weight: 500; color: var(--gold-light); line-height: 1.6; text-wrap: balance; }

.inapp-toast { position: fixed; left: 50%; width: max-content; white-space: nowrap; bottom: calc(18px + env(safe-area-inset-bottom)); z-index: 60; transform: translateX(-50%); max-width: calc(100vw - 32px); padding: 10px 18px; border: 1px solid var(--gold-dim); border-radius: 999px; background: rgba(4, 7, 15, 0.94); color: var(--gold-light); font-size: 0.88rem; letter-spacing: 0.04em; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5); transition: opacity 0.5s; }
.inapp-toast.is-out { opacity: 0; }
.inapp-confirm { position: fixed; left: 16px; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 60; max-width: 28em; margin: 0 auto; padding: 14px 16px; border: 1px solid var(--gold-dim); border-radius: 14px; background: rgba(4, 7, 15, 0.96); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6); }
.inapp-confirm p { margin: 0; font-size: 0.9rem; line-height: 1.75; color: var(--fg); }
.inapp-confirm .inapp-confirm-row { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; margin-top: 12px; }
.inapp-confirm .btn-gold { padding: 0.55em 1.3em; font-size: 0.9rem; cursor: pointer; }
.inapp-confirm .inapp-no { padding: 4px 2px; background: none; border: 0; font: inherit; font-size: 0.86rem; color: var(--fg-muted); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

.handoff-code .hc-again { margin: 8px 0 0; font-size: 0.8rem; line-height: 1.6; color: var(--fg-muted); text-align: left; }
.paste-import { max-width: 26em; margin: 14px auto 0; padding: 14px 16px; border: 1px solid var(--gold-dim); border-radius: 14px; background: rgba(4, 7, 15, 0.78); text-align: left; }
.paste-import .pi-lead { margin: 0; font-size: 0.9rem; line-height: 1.8; color: var(--fg); text-wrap: pretty; }
.paste-import .pi-actions { margin: 12px 0 0; text-align: center; }
.paste-import .pi-go { padding: 0.75em 1.6em; font-size: 0.95rem; white-space: nowrap; cursor: pointer; }
@media (max-width: 360px) { .paste-import .pi-go { padding: 0.75em 1.1em; font-size: 0.9rem; } }
.paste-import .hi-error { margin: 10px 0 0; font-size: 0.84rem; line-height: 1.7; color: var(--gold-light); }
.paste-import .hi-error[hidden], .paste-import .hi-confirm[hidden] { display: none; }
.paste-import .hi-confirm { margin-top: 10px; font-size: 0.88rem; line-height: 1.7; color: var(--fg); }
.paste-import .hi-confirm-row { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; margin-top: 10px; }
.paste-import .hi-no { padding: 4px 2px; background: none; border: 0; font: inherit; font-size: 0.86rem; color: var(--fg-muted); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.paste-import + .handoff-import { margin-top: 10px; }

.self-line { margin: 0 0 18px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: rgba(4, 7, 15, 0.6); text-align: left; }
.self-line .self-line-lead { margin: 0 0 10px; font-size: 0.84rem; line-height: 1.7; color: var(--fg-muted); text-wrap: pretty; }
.self-line .self-line-open { display: block; width: 100%; padding: 10px 14px; border: 1px solid #06c755; border-radius: 999px; background: rgba(6, 199, 85, 0.12); color: var(--fg); font: inherit; font-size: 0.9rem; letter-spacing: 0.04em; cursor: pointer; }
.self-line .self-line-open[hidden], .self-line .self-line-panel[hidden] { display: none; }
.self-line .self-line-caution { margin: 0; padding: 10px 12px; border: 1px solid var(--gold-dim); border-radius: 10px; font-size: 0.84rem; line-height: 1.75; color: var(--gold-light); text-wrap: pretty; }
.self-line .self-line-actions { display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: center; justify-content: center; margin: 12px 0 0; }
.self-line .self-line-send { padding: 0.6em 1.4em; font-size: 0.9rem; }
.self-line .self-line-cancel { padding: 4px 2px; background: none; border: 0; font: inherit; font-size: 0.86rem; color: var(--fg-muted); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.hero-self-line { width: min(100%, 25em); margin: 12px auto 0; }
.hero-self-line[hidden] { display: none; }
.hero-self-line .self-line { margin: 0; background: rgba(4, 7, 15, 0.82); }
#self-line[hidden] { display: none; }