@font-face { font-family:'Fishman SOS SC'; src:url('assets/cjk-regular.woff') format('woff'); font-weight:400; font-display:swap; unicode-range:U+80-FFFF; }
@font-face { font-family:'Fishman SOS SC'; src:url('assets/cjk-bold.woff') format('woff'); font-weight:700; font-display:swap; unicode-range:U+80-FFFF; }
:root { --red:#af3038; --red-soft:#fff1ef; --sos-muted:#718092; }
body { font-family:'Fishman SOS SC',-apple-system,BlinkMacSystemFont,'PingFang SC',sans-serif; }
.app-shell { max-width:420px; padding-bottom:125px; }
.intro { margin:18px 12px; }
.intro h2 { font-size:27px; margin:7px 0; }
.subtitle { font-size:13px; color:var(--sos-muted); }
.preview-strip { display:flex; align-items:center; gap:7px; min-height:38px; margin:3px 0 8px; }
.preview-strip>span { font-size:10px; font-weight:700; color:#826431; background:#f8f0df; border-radius:5px; padding:4px 6px; white-space:nowrap; }
.preview-strip p { color:#8993a0; font-size:10px; margin:0; line-height:1.5; }
.embedded-help { display:none; margin-left:auto; }
.is-embedded .topbar,.is-embedded .intro { display:none; }
.is-embedded .embedded-help { display:flex; width:44px; height:44px; padding:11px; }
.is-embedded .preview-strip { margin-bottom:10px; }
.urgent-card { background:#fff; border-radius:16px; padding:15px 14px 14px; margin-bottom:12px; border:1px solid #ead6d6; }
.urgent-card>div { display:flex; align-items:center; gap:7px; font-size:14px; }
.urgent-dot { display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--red); flex-shrink:0; }
.urgent-card>p { font-size:12px; color:#8c7478; margin:7px 0 13px; }
.call-button { display:flex; align-items:center; justify-content:center; gap:8px; background:var(--red); color:#fff; width:100%; min-height:48px; padding:10px; border-radius:10px; font-weight:700; font-size:15px; }
.call-button img { filter:brightness(0) invert(1); width:20px; height:20px; }
.offline-card { display:flex; gap:10px; align-items:center; background:#ffffffc7; border-radius:12px; padding:12px; margin-bottom:16px; }
.offline-icon { display:grid; place-items:center; width:33px; height:36px; font-size:24px; background:#edf2e5; color:#778d44; border-radius:9px; flex-shrink:0; }
.offline-card>div { flex:1; min-width:0; }
.offline-card h3 { margin:0 0 3px; font-size:12px; }
.offline-card p { margin:0; font-size:10px; color:#7e8a9a; line-height:1.5; }
.small-button { min-height:44px; padding:8px 10px; background:#f0f3f7; border-radius:8px; font-size:12px; font-weight:700; flex-shrink:0; }
.small-button:disabled { color:#7f8a99; cursor:default; }
.offline-card.ready .offline-icon { background:var(--lime); color:#293d0f; }
.search-box { display:flex; align-items:center; gap:8px; background:#fff; border-radius:11px; padding:0 12px; min-height:46px; }
.search-box svg { width:17px; height:17px; fill:none; stroke:#83909f; stroke-width:1.6; flex-shrink:0; }
.search-box input { min-width:0; width:100%; border:0; background:transparent; font-size:14px; outline:none; min-height:46px; }
.search-box:focus-within { outline:2px solid #71913d; }
.search-box input::placeholder { font-size:12px; }
.section-heading { display:flex; align-items:center; justify-content:space-between; margin:18px 2px 10px; }
.section-heading h2 { font-size:16px; margin:0; }
.section-heading span { font-size:10px; color:#8e9aaa; }
.case-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.case-card { padding:0 0 12px; background:#fff; border-radius:13px; overflow:hidden; text-align:left; min-width:0; }
.case-card>img { width:100%; height:100px; object-fit:contain; object-position:center 48%; background:#f3f6fb; }
.case-card strong { display:block; margin:10px 11px 3px; font-size:13px; line-height:1.45; }
.case-card small { display:flex; align-items:center; justify-content:space-between; gap:4px; margin:0 11px; color:#8693a1; font-size:10px; }
.case-card small img { width:13px; height:13px; opacity:.5; }
.case-card:hover { box-shadow:0 0 0 1px #b8c5a5; }
.case-card:active { transform:translateY(1px); }
.location-card { display:flex; align-items:center; gap:11px; text-align:left; background:#fff; padding:11px 12px; border-radius:13px; width:100%; margin:15px 0; }
.location-card>img:first-child { width:54px; height:58px; border-radius:9px; object-fit:cover; }
.location-card>span { flex:1; min-width:0; }
.location-card strong { display:block; font-size:13px; }
.location-card small { display:block; font-size:10px; margin-top:5px; color:#8996a5; }
.location-card .chevron { width:17px; height:17px; opacity:.5; }
.scope-note { color:#8a97a6; font-size:11px; line-height:1.8; margin:13px 9px; }
.empty-search { background:#fff; border-radius:12px; padding:23px 15px; font-size:13px; color:#768393; }
.network-notice { color:#765328; background:#fbf0dd; border-radius:8px; padding:8px 10px; font-size:11px; margin:6px 0 12px; }
.guide-top { display:flex; align-items:center; justify-content:space-between; margin:-5px 0 6px; }
.guide-top .text-button { margin:0; padding:5px 0; min-height:44px; font-size:12px; color:#788797; }
.guide-top img { width:16px; height:16px; }
.guide-heading { margin:5px 3px 12px; }
.guide-heading h2 { margin:5px 0 0; font-size:24px; letter-spacing:-.4px; }
.priority-notice { display:flex; align-items:flex-start; gap:8px; background:#eef5e0; color:#526b33; padding:12px; border-radius:10px; margin-bottom:10px; }
.priority-notice .urgent-dot { background:#7e9e41; margin-top:7px; }
.priority-notice.danger { background:var(--red-soft); color:#933943; }
.priority-notice.danger .urgent-dot { background:var(--red); }
.priority-notice p { font-size:13px; font-weight:700; line-height:1.65; margin:0; }
.avoid-strip { border-left:2px solid #d7a7ab; padding:1px 0 1px 10px; margin:12px 3px 16px; }
.avoid-strip p { color:#7f686c; font-size:11px; margin:4px 0; line-height:1.7; }
.avoid-strip strong { color:#9b444b; }
.card { background:#fff; border-radius:15px; padding:15px 14px; margin-bottom:13px; }
.choice-card h3 { font-size:13px; margin:0 0 12px; }
.choice-field { border:0; margin:0 0 12px; padding:0; min-width:0; }
.choice-field:last-child { margin-bottom:0; }
.choice-field legend { font-size:11px; font-weight:700; color:#7f8d9c; margin-bottom:7px; padding:0; }
.choices { display:flex; flex-wrap:wrap; gap:6px; }
.choices button { min-height:44px; border-radius:8px; padding:9px 10px; font-size:12px; background:#f1f4f8; text-align:left; }
.choices button[aria-pressed=true] { background:#07080c; color:var(--lime); font-weight:700; }
.step-heading { display:flex; align-items:center; justify-content:space-between; margin:17px 1px 8px; }
.step-heading h3 { font-size:14px; margin:0; }
.step-heading .text-button { font-size:11px; margin:0; padding:6px 2px; min-height:44px; }
.step-nav { display:flex; gap:7px; margin-bottom:11px; }
.step-nav button { width:44px; height:44px; border-radius:9px; background:#e4eaf1; color:#7b8797; font:italic 800 20px Barlow,sans-serif; }
.step-nav button[aria-pressed=true] { background:#07080c; color:var(--lime); }
.step-title { display:flex; align-items:flex-start; gap:9px; margin-bottom:12px; }
.step-title>span { font:italic 800 26px/1.3 Barlow,sans-serif; color:#8c9b78; flex-shrink:0; }
.step-title h3 { margin:0; font-size:18px; line-height:1.5; }
.current-step figure { margin:0 0 14px; background:#f3f6fb; border-radius:10px; overflow:hidden; }
.current-step figure img { width:100%; height:184px; object-fit:contain; }
.current-step figcaption { color:#82909e; font-size:10px; text-align:center; padding:7px; line-height:1.5; }
.current-step>p { font-size:14px; line-height:1.95; color:#43515f; margin:10px 0 16px; }
.current-step .step-extra { background:#f2f6e9; color:#63754d; font-size:11px; padding:10px; border-radius:8px; }
.step-controls { display:flex; gap:8px; margin-top:16px; }
.step-controls>* { flex:1; font-size:13px; }
.primary-button,.secondary-button { min-height:46px; font-size:14px; border-radius:10px; }
.primary-button img { width:19px; height:19px; }
button:disabled { cursor:default; opacity:.5; }
.all-steps .card h3 { font-size:16px; margin:0 0 10px; }
.all-steps .card h3 span { font:italic 800 22px Barlow,sans-serif; color:#91a179; margin-right:8px; }
.all-steps .card p { font-size:14px; line-height:1.9; color:#43515f; margin:0; }
.handoff-card h3 { font-size:14px; margin:0 0 8px; }
.handoff-card p { font-size:12px; color:#8793a2; line-height:1.8; margin-bottom:14px; }
.checked-note { font-size:10px; color:#8b98a7; line-height:1.7; text-align:center; }
footer { text-align:center; margin:20px 10px 0; }
footer p { font-size:11px; color:#94a0af; }
footer .text-button { font-size:10px; margin-top:0; }
.action-dock { position:fixed; bottom:0; left:50%; transform:translateX(-50%); width:100%; max-width:420px; background:#edf1f7f2; backdrop-filter:blur(12px); border-top:1px solid #e0e5ec; display:flex; gap:9px; padding:11px 15px max(11px,env(safe-area-inset-bottom)); z-index:10; }
.action-dock>* { flex:1; min-width:0; }
.action-dock svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.dock-location { background:#fff; min-height:48px; border-radius:10px; display:flex; align-items:center; justify-content:center; gap:7px; font-size:14px; font-weight:700; }
dialog { border:0; border-radius:18px; padding:19px; width:min(380px,calc(100vw - 28px)); max-height:87dvh; color:var(--ink); }
dialog::backdrop { background:#13202b75; }
.dialog-top { display:flex; align-items:center; justify-content:space-between; margin:-4px -5px 8px 0; gap:8px; }
.dialog-top h2 { font-size:20px; margin:0; }
.close-button { width:44px; height:44px; font:25px sans-serif; border-radius:10px; background:#f1f4f8; flex-shrink:0; }
dialog p { font-size:13px; line-height:1.8; color:#6c7a8b; }
.dialog-notice { padding:11px; border-radius:9px; background:#fff3e3; color:#916c3b; font-size:12px; }
.phone-number { font:italic 800 64px Barlow,sans-serif; color:var(--red); text-align:center; margin:7px 0; }
.alternate-calls { display:flex; gap:8px; margin-top:12px; }
.alternate-calls button { flex:1; background:#f1f4f8; border-radius:9px; min-height:44px; padding:8px; font-size:12px; }
.muted { color:#8794a3; font-size:11px; line-height:1.75; }
.location-state { padding:12px; border-radius:10px; background:#f1f5e8; font-size:12px; line-height:1.9; color:#50633a; margin:14px 0; overflow-wrap:anywhere; }
.location-state.warning { background:#fff2e1; color:#8c622e; }
.two-buttons { display:flex; gap:8px; }
.two-buttons>* { flex:1; min-width:0; font-size:13px; }
.input-label { display:block; font-size:12px; font-weight:700; margin:14px 0; }
.input-label input,.input-label textarea { display:block; margin-top:7px; min-height:46px; width:100%; padding:10px 12px; border:1px solid #dfe6ed; border-radius:9px; background:#f6f8fb; font-size:13px; outline:0; }
.input-label textarea { min-height:80px; resize:vertical; line-height:1.7; }
.input-label input:focus,.input-label textarea:focus { outline:2px solid #8ba663; }
.input-label input::placeholder,.input-label textarea::placeholder { font-size:11px; color:#98a1ac; font-weight:400; }
#summaryText { min-height:230px; font-weight:400; }
.event-row { display:flex; gap:8px; align-items:center; justify-content:space-between; font-size:11px; color:#8693a2; margin:12px 0; }
#sourceLinks a { display:block; font-size:12px; line-height:1.7; text-decoration:underline; color:#526d30; padding:11px 0; border-bottom:1px solid #e8edf1; overflow-wrap:anywhere; }
.toast { position:fixed; bottom:max(88px,calc(env(safe-area-inset-bottom) + 70px)); left:50%; transform:translateX(-50%); background:#18212b; color:#fff; border-radius:10px; padding:11px 16px; font-size:12px; max-width:calc(100vw - 32px); width:max-content; z-index:30; }
@media(max-width:350px) { .preview-strip { gap:5px; } .preview-strip p { font-size:9px; } .urgent-card>div { font-size:12px; } .case-card strong { font-size:12px; margin-left:9px; } .case-card small { font-size:9px; margin-left:9px; } .case-card>img { height:88px; } .card { padding:14px 12px; } .choice-field button { font-size:11px; } }
@media(prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; } }

.old-location-check { display:flex; gap:8px; align-items:flex-start; padding:10px; font-size:11px; line-height:1.8; background:#fff5e6; border-radius:8px; margin:10px 0; }
.old-location-check input { width:18px; height:18px; accent-color:#69873a; flex-shrink:0; }
.related-guide { margin:12px 0; font-size:12px; background:#fff; }

.dialog-top { position:sticky; top:-19px; background:#fff; z-index:1; padding:4px 0; }

.dial-link { display:flex; align-items:center; justify-content:center; width:100%; margin:12px 0; text-decoration:none; }
