:root{font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Noto Sans TC",sans-serif;color:#deded7;background:#0c1116}
*{box-sizing:border-box}body{margin:0;overflow:hidden}#scene{width:100vw;height:100dvh;display:block;touch-action:none}
#vignette{pointer-events:none;position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 50% 46%,transparent 34%,#03070c80 100%)}
header{position:absolute;top:0;left:0;right:0;padding:calc(env(safe-area-inset-top) + 23px) 22px 16px;display:flex;justify-content:space-between;gap:14px;align-items:start;pointer-events:none;background:linear-gradient(#0c1116b3,transparent)}
.brand{font-size:10px;letter-spacing:.34em;font-weight:700;color:#aab5b7}.product{font-family:Georgia,serif;font-size:24px;letter-spacing:.035em;color:#ecece5;margin-top:6px}.tag{font-size:10px;letter-spacing:.14em;padding:8px 9px;border:1px solid #8490976c;color:#a2b1b8}
footer{position:absolute;bottom:0;left:0;right:0;padding:22px 18px calc(env(safe-area-inset-bottom) + 22px);background:linear-gradient(transparent,#071016dd 55%);display:flex;gap:12px;align-items:end;justify-content:space-between;flex-wrap:wrap}
.guide{max-width:330px}.number{font-size:10px;letter-spacing:.25em;color:#93a5a8;margin-bottom:8px}.guide-title{font-size:16px;color:#f3f1e8;line-height:1.45;margin-bottom:4px}.guide-text{font-size:12px;line-height:1.5;color:#b3c2c4;max-width:330px}
.controls{display:flex;gap:8px;align-items:center}button{background:#d2d0bd;color:#162027;border:0;border-radius:3px;font-size:13px;font-weight:650;letter-spacing:.04em;padding:13px 16px;min-height:44px;cursor:pointer}button.secondary{background:#1e2b34;color:#e2e5e2;border:1px solid #67778288}button[disabled]{opacity:.38;cursor:default}
#status{position:absolute;top:calc(env(safe-area-inset-top) + 100px);left:22px;color:#afbbb9;font:11px/1.8 ui-monospace,monospace;pointer-events:none;text-shadow:0 1px 2px #000}
#inspect-label{position:absolute;top:calc(env(safe-area-inset-top) + 100px);left:0;right:0;text-align:center;font-size:11px;letter-spacing:.25em;color:#d5c9b8;pointer-events:none;opacity:0;transition:opacity .3s}
#inspect-label.active{opacity:1}#err{position:absolute;inset:30% 5%;padding:15px;color:#ecc;text-align:center;display:none;background:#111b}
@media(max-width:430px){.product{font-size:20px}.tag{font-size:9px}.controls{width:100%;justify-content:stretch}.controls button{flex:1}.guide{max-width:100%}footer{gap:16px}.guide-title{font-size:15px}}