/* Hallmark · shape: app screen · theme: WanMiles original brand · posture: ink green, rice paper, restrained coin geometry · finish-review: subagent, ship · nav: five persistent bottom tabs · footer: none · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H5 E4 S4 R5 V4 · weakest: S, replaced generic shortcuts with bilingual service panels and a locally bundled Song display face. */
/* Hallmark · copy: verbatim · owner-supplied brand positioning retained in metadata. */
@import url('tokens.css');
@font-face{font-family:'WanMiles Song';font-style:normal;font-weight:500;font-display:swap;src:url('../assets/fonts/wanmiles-song.ttf') format('truetype')}
html,body{overflow-x:clip}
body{background:var(--refined-celadon);color:var(--refined-ink);font-family:var(--font-body)}
.app-shell{max-width:1080px;background:var(--paper);color:var(--refined-ink);border-radius:0;box-shadow:none;padding-bottom:calc(var(--space-100) + env(safe-area-inset-bottom))}
.app-header{background:var(--paper);color:var(--green);padding:var(--space-12) var(--space-20);padding-top:max(var(--space-12),env(safe-area-inset-top));min-height:64px;border-bottom:1px solid var(--refined-rule)}
.wordmark{font-family:var(--font-body);font-size:24px;font-weight:650;letter-spacing:-.8px;gap:var(--space-10);color:var(--green)}
.wordmark img{width:34px;height:34px;border-radius:8px;object-fit:cover}
.wordmark span{font-family:var(--font-song);font-weight:500;font-size:19px;letter-spacing:2px;color:var(--green);padding-left:var(--space-10);border-left-color:var(--refined-rule)}
.avatar{width:36px;height:36px;background:var(--refined-celadon);color:var(--green);font-family:var(--font-body);font-weight:600;border:0;font-size:13px}
.view{padding:0 var(--space-20)}
.page-heading,.intro{padding:var(--space-24) 0}
.page-heading h1,.intro h1{font-family:var(--font-body);font-size:30px;line-height:1.15;letter-spacing:-.8px;font-weight:600;color:var(--green);margin:0 0 var(--space-12)}
.page-heading p,.intro p{font-size:14px;line-height:1.7;color:var(--refined-subtle)}
.small-title{font-family:var(--font-body);font-size:21px;font-weight:600;line-height:1.3;margin:var(--space-32) 0 var(--space-16);color:var(--green)}
.section-title h2{font-family:var(--font-body);font-size:19px;font-weight:600;letter-spacing:-.4px;color:var(--green)}
.section-title>span,.section-hanzi,.seal,.note-stamp{font-family:var(--font-song);font-weight:500}
.section-title>span{font-size:13px;color:var(--refined-subtle)}
.primary,.quiet{font-weight:500;font-size:14px;min-height:48px;padding:var(--space-12) var(--space-16);border-radius:8px}
.primary{background:var(--green);border-color:var(--green);color:var(--surface)}
.quiet{color:var(--green);border-color:var(--color-form-border)}
.field{font-size:13px;line-height:1.5;margin-bottom:var(--space-20);font-weight:500}
.field input,.field select{background:var(--surface);border-color:var(--color-form-border);border-radius:7px;font-size:15px;min-height:48px}
.home-greeting{padding-top:var(--space-8);min-height:40px;font-size:12px;color:var(--refined-subtle);gap:var(--space-8)}
.home-greeting .text-control{font-size:12px;min-height:36px;padding:var(--space-8) 0}
.home-intro{position:relative;isolation:isolate;background:var(--green);color:var(--surface);padding:var(--space-16);border-radius:9px;overflow:hidden}
.home-intro h1{font-family:var(--font-song);font-weight:500;font-size:27px;line-height:1.4;letter-spacing:0;margin:0 0 var(--space-8);color:var(--paper);text-wrap:initial}
.home-intro p{font-size:13px;line-height:1.6;color:var(--paper);margin:0}
.home-intro .journey-strip{padding:0;margin-top:var(--space-12);gap:var(--space-12);font-size:11px;color:var(--paper);justify-content:flex-start;flex-wrap:wrap}
.home-intro .journey-strip>span:first-child{color:var(--paper);font-weight:500;gap:var(--space-4)}
.home-intro .journey-strip svg{width:15px;height:15px}
.home-coin{position:absolute;right:-24px;bottom:-36px;width:136px;height:136px;border:24px solid var(--gold);border-radius:50%;opacity:.12;z-index:-1}
.home-coin:after{content:'';position:absolute;inset:16px;border:10px solid var(--gold)}
.service-title{margin:var(--space-20) 0 var(--space-12)}
.shortcut-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-10);border:0}
.shortcut-grid .service-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:var(--space-4);min-height:106px;padding:var(--space-12) var(--space-16);border:1px solid var(--refined-rule);border-radius:9px;background:var(--surface);color:var(--green);text-align:left}
.service-icons{display:flex;align-items:center;justify-content:space-between;width:100%;margin-bottom:var(--space-4);color:var(--green)}
.service-icons svg:first-child{width:26px;height:26px;stroke-width:1.6}
.service-icons svg:last-child{width:16px;height:16px;opacity:.65}
.service-card strong{font-family:var(--font-body);font-size:15px;line-height:1.35;font-weight:600;letter-spacing:normal}
.service-card .service-chinese{font-family:var(--font-song);font-size:13px;line-height:1.4;font-weight:500;color:var(--refined-subtle)}
.shortcut-grid .service-entry{background:var(--green);border-color:var(--green);color:var(--surface)}
.service-entry .service-icons,.service-entry .service-chinese{color:var(--paper)}
.shortcut-grid .service-payments,.shortcut-grid .service-translate{background:var(--refined-celadon)}
.shortcut-grid .service-transport,.shortcut-grid .service-connectivity{background:var(--refined-sand)}
.shortcut-grid .service-emergency{background:var(--refined-clay);color:var(--simulation-ink)}
.service-emergency .service-icons,.service-emergency .service-chinese{color:var(--simulation-ink)}
.shortcut-grid .service-card:hover{filter:none;border-color:var(--green)}
.readiness{margin-top:var(--space-24);padding:var(--space-20);background:var(--refined-celadon);color:var(--green);border-radius:9px}
.readiness-head{color:var(--refined-subtle);font-size:12px}
.readiness h2{font-family:var(--font-body);font-size:21px;line-height:1.25;font-weight:500;letter-spacing:-.4px;max-width:23ch;margin:var(--space-16) 0 var(--space-20)}
.readiness>button{color:var(--green);font-size:13px;font-weight:500}
.readiness-steps{max-width:none;gap:var(--space-8)}
.readiness-steps span{background:var(--color-disabled-border);height:3px}
.readiness-steps .done{background:var(--green)}
.next-action{margin-top:var(--space-24);padding:var(--space-20) 0;border-top-color:var(--refined-rule)}
.next-action h2{font-family:var(--font-body);font-size:16px;font-weight:600;letter-spacing:normal;color:var(--green);line-height:1.4}
.next-action p{font-size:13px;line-height:1.7}
.access-prompt{background:var(--refined-sand);color:var(--green);border-radius:9px;padding:var(--space-16);min-height:88px;gap:var(--space-12)}
.access-prompt strong{font-family:var(--font-body);font-size:16px;font-weight:600;letter-spacing:normal}
.access-prompt small{color:var(--refined-subtle);font-size:12px;line-height:1.6}
.bottom-nav{max-width:1080px;width:100%;background:var(--paper);border-top:1px solid var(--refined-rule);box-shadow:none;border-radius:0;gap:var(--space-4);padding:var(--space-8) var(--space-8) max(var(--space-12),env(safe-area-inset-bottom));backdrop-filter:none}
.bottom-nav button{padding:var(--space-8) var(--space-4);min-height:52px;font-size:11px;font-weight:400;gap:var(--space-4);color:var(--refined-subtle);border-radius:10px}
.bottom-nav button.active{background:var(--refined-celadon);color:var(--green);font-weight:600}
.bottom-nav button[data-view=access]>svg{padding:0;margin:0;width:23px;height:23px;background:transparent;color:inherit;border-radius:0}
.bottom-nav svg{width:22px;height:22px;stroke-width:1.5}
.bottom-nav .active:after{display:none}
.hero-card{height:290px;border-radius:10px}
.hero-copy h2{font-family:var(--font-body);font-size:31px;font-weight:550;line-height:1.15;letter-spacing:-.7px}
.hero-link{font-size:13px}
.section-heading h2{font-family:var(--font-body);font-size:24px;line-height:1.2;font-weight:550;color:var(--green)}
.section-hanzi{font-size:32px;color:var(--celadon)}
.destination-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-24) var(--space-12)}
.place-photo{height:210px;border-radius:9px}
.place-title strong{font-family:var(--font-body);font-size:17px;font-weight:550}
.place-title span{font-family:var(--font-song);font-size:14px;font-weight:500;color:var(--refined-subtle)}
.place p{font-size:12px;line-height:1.6;color:var(--refined-subtle)}
.place-meta{font-size:11px;color:var(--refined-subtle)}
.editor-note{background:var(--refined-celadon);border-radius:6px}
.editor-note>p{font-family:var(--font-body);font-size:27px;line-height:1.2;font-weight:500;color:var(--green)}
.editor-note>span{font-size:12px;color:var(--refined-subtle)}
.note-stamp{font-size:13px}
.detail-name{font-family:var(--font-body);font-size:32px;font-weight:600;letter-spacing:-.7px;line-height:1.2}
.detail-name span{font-family:var(--font-song);font-size:25px;font-weight:500}
.entry-result{background:var(--refined-sand);border-radius:9px;padding:var(--space-24)}
.entry-result.positive{background:var(--refined-celadon)}
.entry-result h2{font-family:var(--font-body);font-size:25px;font-weight:600;line-height:1.2;letter-spacing:-.5px;color:var(--green)}
.stepper li>span{width:30px;height:30px}
.stepper [aria-current=step]>span{background:var(--green);color:var(--paper);border-color:var(--green)}
.source-link{font-size:13px;font-weight:400}
.scan-window{background:var(--deep);border-radius:12px;height:300px}
.scan-corners{border:1px solid var(--gold);border-radius:18px;width:172px;height:172px}
.access-object h2{font-family:var(--font-body);font-size:28px;font-weight:600;letter-spacing:-.5px}
.payment-amount{font-family:var(--font-body);font-size:38px;font-weight:500}
.demo-choices button{font-size:14px;font-weight:500;min-height:60px}
.translation-switch{background:var(--refined-celadon);color:var(--green);border-radius:8px}
.translation-switch>button{color:var(--green)}
.communication-card{background:var(--surface);border-color:var(--refined-rule);border-radius:10px}
.communication-card>div{font-family:var(--font-chinese);font-size:31px;font-weight:400;line-height:1.7;color:var(--green)}
.phrase-large{font-family:var(--font-chinese);font-size:36px;line-height:1.7}
.address-card{background:var(--refined-celadon);border-radius:9px}
.address-card>span{font-family:var(--font-chinese);font-size:26px}
.profile-identity>span{background:var(--refined-celadon);color:var(--green);width:60px;height:60px;font-family:var(--font-body);font-size:24px;font-weight:500}
.profile-identity h2{font-family:var(--font-body);font-weight:550;font-size:20px}
.daily-plan h3{font-family:var(--font-body);font-size:20px;font-weight:550;letter-spacing:normal}
.task strong{font-size:14px;font-weight:500}
.mode-tabs .selected,.trip-stage .selected,.day-tabs .selected{background:var(--green);border-color:var(--green);color:var(--surface)}
.emergency-lines strong{font-family:var(--font-body);font-size:36px;font-weight:500;color:var(--simulation-ink)}
dialog{border-radius:14px;background:var(--paper)}
.close{color:var(--green);background:var(--paper);width:44px;height:44px}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--color-focus);outline-offset:3px;transition:none}
.home-intro :focus-visible,.service-entry:focus-visible{outline-color:var(--gold)}
button:active:not(:disabled){transform:translateY(1px)}
button:disabled,.primary:disabled{background:var(--color-disabled-fill);color:var(--color-disabled-ink);border-color:var(--color-disabled-border);cursor:not-allowed}
@media(min-width:600px){body{padding:0}.app-shell{padding-top:0;border-radius:0}.app-header{margin:0;border-radius:0;padding-left:var(--space-32);padding-right:var(--space-32);min-height:76px}.view{padding-left:var(--space-32);padding-right:var(--space-32)}.home-greeting{min-height:52px}.home-intro{padding:var(--space-24)}.home-intro h1{font-size:33px}.home-intro p{font-size:15px}.home-intro .journey-strip{font-size:13px}.home-coin{width:180px;height:180px;border-width:32px;right:20px;bottom:-60px}.shortcut-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-16)}.shortcut-grid .service-card{min-height:132px;padding:var(--space-20);gap:var(--space-8)}.service-card strong{font-size:18px}.service-card .service-chinese{font-size:15px}.service-icons svg:first-child{width:31px;height:31px}.bottom-nav{border-radius:0;bottom:0}.bottom-nav button{flex-direction:row;align-items:center;justify-content:center;gap:var(--space-10);font-size:13px;min-height:52px}.page-heading h1,.intro h1{font-size:38px}.hero-card{height:360px}.hero-copy h2{font-size:42px}.place-photo{height:300px}.service-title h2{font-size:23px}.service-title{margin-top:var(--space-24);margin-bottom:var(--space-16)}}
@media(min-width:900px){.app-header{padding-left:var(--space-48);padding-right:var(--space-48)}.view{padding-left:var(--space-48);padding-right:var(--space-48)}.home-greeting{padding-top:var(--space-12);min-height:60px}.home-intro{padding:var(--space-28) var(--space-32)}.home-intro h1{font-size:36px}.home-intro .journey-strip{position:absolute;right:32px;bottom:28px}.home-coin{right:200px;width:200px;height:200px}.shortcut-grid .service-card{min-height:144px;padding:var(--space-24)}.service-card strong{font-size:19px}.service-title{margin-top:var(--space-32)}.readiness{margin-top:var(--space-32)}.destination-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-32) var(--space-20)}.hero-card{height:420px}.hero-copy h2{font-size:46px;max-width:16ch}.page-heading,.intro{padding-top:var(--space-32);padding-bottom:var(--space-32)}.field,.entry-result,.task-list,.communication-card,.translation-switch,.address-card{max-width:760px}.scan-window,#qrForm,.demo-choices{max-width:680px}.scan-window{height:360px}.emergency-lines{max-width:760px}}
@media(max-width:360px){.view{padding:0 var(--space-16)}.app-header{padding-left:var(--space-16);padding-right:var(--space-16)}.wordmark{font-size:22px;gap:var(--space-8)}.wordmark span{font-size:18px;padding-left:var(--space-8)}.wordmark img{width:30px;height:30px}.home-intro{padding:var(--space-16)}.home-intro h1{font-size:23px}.home-intro p{font-size:12px}.home-intro .journey-strip{font-size:11px;flex-direction:row;margin-top:var(--space-8)}.service-title{margin:var(--space-16) 0 var(--space-12)}.service-title h2{font-size:18px}.shortcut-grid{gap:var(--space-8)}.shortcut-grid .service-card{padding:var(--space-12);min-height:98px;gap:var(--space-4)}.service-card strong{font-size:14px}.service-card .service-chinese{font-size:12px}.service-icons svg:first-child{width:24px;height:24px}.service-icons{margin-bottom:0}.home-greeting{font-size:11px;min-height:36px}.home-greeting .text-control{font-size:11px}.page-heading h1,.intro h1{font-size:28px}.bottom-nav button{font-size:10px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

#main:focus{outline:none}
