:root{--page:#EDF0F3;--surface:#FAFBFC;--ink:#263B50;--muted:#596B7D;--line:#CDD7E0;--focus:#334C63;--accent:#D4D48A;color:var(--ink);background:var(--page);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;font-synthesis:none;color-scheme:light}
:root[data-theme="dark"]{--page:#172430;--surface:#223545;--ink:#F2F7FB;--muted:#BDCDD9;--line:#486174;--focus:#C0D7E9;color-scheme:dark}
*{box-sizing:border-box}body{margin:0;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,select{font:inherit;color:inherit}button,a,select{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default}button:active,a.destination:active{transform:scale(.98)}:focus-visible{outline:2px solid var(--focus);outline-offset:5px}h1,h2,p{margin:0}h1,h2{text-wrap:balance}p{text-wrap:pretty}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.skip{position:fixed;left:1rem;top:1rem;z-index:30;transform:translateY(-200%);padding:1rem;background:var(--surface)}.skip:focus{transform:none}
.preview-header,footer,.banner-bottom{width:min(100% - 3rem,76rem);margin:auto;display:flex;align-items:center;justify-content:space-between;gap:1rem}.preview-header{min-height:88px}.wordmark{font-size:24px;font-weight:650;letter-spacing:-.025em;min-height:44px;display:flex;align-items:center}.preview-label{font-size:12px;color:var(--muted)}.theme select{border:0;background:transparent;padding:.6rem;min-height:44px;font-size:13px}.theme option{background:var(--surface)}
.studio-banner{max-width:1600px;margin:auto;padding-top:clamp(1.5rem,3vh,2.5rem)}h1{text-align:center;font-size:clamp(2.1rem,4vw,3.8rem);font-weight:600;line-height:1.2;padding-inline:1.25rem}h1 [lang]{letter-spacing:-.03em}h1>span{display:inline-block}.stage{position:relative;height:clamp(420px,57vh,590px);margin-top:1rem}.scene{position:absolute;inset:0}.scene canvas{display:block;width:100%;height:100%;touch-action:pan-y}.scene-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block;pointer-events:none}.rendered .scene-poster{display:none}.scene-poster:not([src]){display:none}
.destinations{position:absolute;inset:0;pointer-events:none}.destination{position:absolute;left:0;top:0;pointer-events:auto;min-width:160px;display:flex;flex-direction:column;align-items:center;gap:5px;border:0;background:transparent;border-radius:8px;padding:8px 12px;line-height:1.4;transition:background-color 140ms,color 140ms;will-change:transform}.destination-title{font-size:18px;font-weight:600;display:flex;gap:18px;align-items:center}.destination-title>span{font-size:17px;color:var(--muted)}.destination-title small{font-size:11px;font-weight:400;color:var(--muted)}.destination-detail{font-size:12px;color:var(--muted)}.destination:hover,.destination.is-active{background:var(--surface)}.destination.is-active .destination-title>span{color:var(--ink)}
.banner-bottom{font-size:12px;color:var(--muted);min-height:60px}.banner-bottom button{min-height:44px;border:0;background:none;padding:8px 0 8px 12px;display:flex;gap:12px;align-items:center;font-size:12px}.banner-bottom button:hover{color:var(--ink)}footer{border-top:1px solid var(--line);font-size:11px;color:var(--muted);padding-block:20px;margin-top:12px}
dialog{border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:32px;border-radius:12px;max-width:min(440px,calc(100% - 32px))}dialog::backdrop{background:rgb(23 36 48 / .55)}dialog h2{font-size:24px;margin:20px 0}dialog p{font-size:16px;line-height:1.8;color:var(--muted)}.close{position:absolute;right:8px;top:8px;border:0;background:none;width:44px;height:44px;font-size:26px}.confirm{margin-top:24px;padding:12px 18px;background:var(--accent);color:#263B50;border:0;border-radius:8px;min-height:44px}
.stage:not(.rendered) .destinations{inset:auto 5% 4%;display:flex;justify-content:space-around;gap:8px}.stage:not(.rendered) .destination{position:relative;transform:none!important}.stage:not(.rendered) .destination-detail{display:none}
@media(max-width:650px){.preview-header,footer,.banner-bottom{width:calc(100% - 40px)}.preview-header{min-height:72px}.preview-label{display:none}.studio-banner{padding-top:22px}h1{font-size:clamp(2rem,7.8vw,2.6rem)}h1>span{display:block}.stage{height:auto;margin-top:12px;padding-top:300px}.scene,.scene-poster{height:300px}.destinations,.stage:not(.rendered) .destinations{position:relative;inset:auto;display:grid;grid-template-columns:1fr 1fr;gap:16px 10px;margin:0 20px;pointer-events:auto}.destination,.stage:not(.rendered) .destination{position:relative;inset:auto;min-width:0;transform:none!important;align-items:flex-start;padding:12px 4px;border-radius:0;background:none;border-bottom:1px solid var(--line);will-change:auto}.destination-title{font-size:18px;gap:10px}.destination-detail,.stage:not(.rendered) .destination-detail{display:block;font-size:11px}.destination-title small{font-size:10px}.banner-bottom{align-items:center;gap:12px;padding-top:16px;font-size:11px}.banner-bottom button{font-size:11px;flex-shrink:0}footer{align-items:flex-start;font-size:10px;line-height:1.6;padding-block:16px;margin-top:10px}footer span:last-child{max-width:120px;text-align:right}}
@media(min-width:651px) and (max-width:950px){.destination{min-width:135px}.destination-title{font-size:16px}.destination-detail{font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}button:active,a.destination:active{transform:none}}
@media(prefers-contrast:more){.destination{outline:1px solid var(--focus)}.destination-detail,.preview-label,footer{color:var(--ink)}}
.poster-capture .destinations{visibility:hidden}
.character-controls{width:min(100% - 3rem,76rem);margin:0 auto;display:flex;align-items:center;gap:16px;min-height:48px;font-size:12px;color:var(--muted)}
.character-controls button{min-height:44px;border:1px solid var(--line);background:transparent;border-radius:8px;padding:8px 14px;flex-shrink:0;transition:background-color 140ms,color 140ms}
.character-controls button:hover,.character-controls button.is-greeting{background:var(--accent);color:#263B50}
.character-controls button:disabled{opacity:.6}.character-controls p{line-height:1.6}
@media(max-width:650px){.character-controls{width:calc(100% - 40px);gap:12px;font-size:11px;align-items:flex-start}.character-controls p{padding-top:8px}}
[hidden]{display:none!important}
.world-home{min-height:100svh;display:flex;flex-direction:column}
.world-home main{flex:1;width:100%}
.world-home .preview-header{min-height:68px}
.world-home .studio-banner{padding-top:12px}
.world-home .stage{height:clamp(340px,calc(100svh - 332px),660px)}
.world-home footer{padding-block:14px;margin-top:auto;border:0}
.no-script{max-width:48rem;margin:12px auto;padding-inline:20px;font-size:12px;color:var(--muted)}
@media(max-width:650px){.world-home .preview-header{min-height:64px}.world-home .stage{height:auto;padding-top:clamp(230px,35svh,300px)}.world-home .scene,.world-home .scene-poster{height:clamp(230px,35svh,300px)}.world-home .destinations{gap:10px}.world-home footer{padding-block:16px}.world-home .character-controls{min-height:52px}}
@media(min-width:651px){.stage:not(.rendered) .destinations{flex-wrap:wrap}.stage:not(.rendered) .destination{min-width:120px}}
