:root{--cream:#fffaf3;--cream-deep:#f7eee4;--ink:#63412e;--muted:#897968;--accent:#a36a3f;--line:#e2d3bf;--line-soft:#eadfce;--room:#f3e8d8;--room-deep:#e8d7c2;--lamp:#ffb978;--font-sans:"PingFang SC","Hiragino Sans GB","Noto Sans SC","Microsoft YaHei", -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;--font-serif:Georgia,"Songti SC","Noto Serif SC","Times New Roman",serif;--font-mono:"SF Mono",Menlo,Consolas,"Courier New",monospace;--room-bg:radial-gradient(120% 80% at 18% 12%,#fff6e8 0%,transparent 55%), radial-gradient(90% 70% at 88% 8%,#ffd9b055 0%,transparent 50%), linear-gradient(165deg,var(--room) 0%,var(--room-deep) 55%,#e2c9a8 100%);font-family:var(--font-sans);color:#3a342e;background:var(--room);font-synthesis:none;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:15px;line-height:1.5}*{box-sizing:border-box}body{background:var(--room-bg);min-height:100svh;margin:0}button,input,summary,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{cursor:pointer;color:inherit;transition:background .2s,transform .2s,border-color .2s}button:disabled{cursor:wait;opacity:.5}button:focus-visible,input:focus-visible,summary:focus-visible,a:focus-visible{outline-offset:4px;outline:2px solid #96713e}button:active{transform:translateY(1px)}[hidden]{display:none!important}html{scrollbar-width:none;background:var(--room)}html::-webkit-scrollbar{display:none}#app{background:0 0;min-height:100svh;position:relative;overflow:hidden}.masthead{z-index:5;padding:max(14px,env(safe-area-inset-top,0px)) 0 0 5%;pointer-events:none;letter-spacing:.12em;color:#5c4634;text-shadow:0 1px #fff4;align-items:center;gap:10px;font-size:11px;font-weight:600;transition:opacity .3s,transform .38s cubic-bezier(.32,.9,.35,1);display:flex;position:fixed;top:0;left:0}.masthead i{color:#8a6f52;letter-spacing:0;margin:0 5px;font-style:normal}.status{letter-spacing:.06em;color:#5c4634;align-items:center;gap:7px;font-size:10px;display:flex}.status b{background:#b4a079;border-radius:50%;flex:none;width:6px;height:6px;box-shadow:0 0 0 3px #b4a07918}.status.live b{background:#609078;box-shadow:0 0 0 3px #60907818}.status.failed b{background:#bd7859}.readings{top:max(28px,calc(env(safe-area-inset-top,0px) + 18px));z-index:5;pointer-events:none;background:linear-gradient(#fff9f0 0%,#f6ebdc 100%);border:3px solid #b8895a;border-radius:4px 4px 6px 6px;width:168px;padding:14px 12px 12px;transition:opacity .3s,transform .38s cubic-bezier(.32,.9,.35,1);position:fixed;right:max(14px,3.5%);transform:rotate(1.5deg);box-shadow:0 10px 22px #5a3d2218,inset 0 0 0 1px #e8d4b8,inset 0 1px #fff8}.readings-nail{background:radial-gradient(circle at 35% 30%,#e8e0d4,#8a7a68 55%,#5c4e40);border-radius:50%;width:10px;height:10px;margin-left:-5px;position:absolute;top:-10px;left:50%;box-shadow:0 1px 2px #0003}.readings-cord{opacity:.7;border:1.5px solid #9a7a58;border-bottom:0;border-radius:22px 22px 0 0;width:44px;height:18px;margin-left:-22px;position:absolute;top:-22px;left:50%}.readings-title{text-align:center;font-family:var(--font-serif);letter-spacing:.12em;color:#8a6b4f;margin:0 0 8px;font-size:12px;font-weight:400;display:block}.readings-grid{grid-template-columns:1fr 1fr;gap:8px 10px;display:grid}.readings-grid>div{flex-direction:column;align-items:center;gap:2px;min-width:0;display:flex}.readings output{font-family:var(--font-mono);letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums;font-size:13px;line-height:1.2}.readings small{letter-spacing:.08em;color:#9a8168;font-size:9px;font-family:var(--font-sans)}.readings #state{font-family:var(--font-sans);font-size:11px;font-weight:600}.intro{z-index:4;pointer-events:none;max-width:min(640px,70vw);padding:0 5%;transition:opacity .3s,transform .38s cubic-bezier(.32,.9,.35,1);position:fixed;top:44px;left:0}.intro h1{font-family:var(--font-serif);letter-spacing:-.04em;color:var(--ink);text-shadow:0 1px #fff6;margin:0;font-size:clamp(40px,9.5vw,60px);font-weight:400;line-height:.92}.intro h1 em{letter-spacing:-.05em;color:#ad7d53;font-style:italic;font-weight:400}.intro p{color:#5c4634;letter-spacing:.02em;text-shadow:0 1px #fff4;max-width:16em;margin:14px 0 0;font-size:13px;line-height:1.65}#stage{z-index:0;background:var(--room-bg);width:100%;position:fixed;inset:0}#scene{touch-action:none;cursor:grab;width:100%;height:100%;display:block}#scene.grabbing{cursor:grabbing}#scene.spoon,#scene.knife{cursor:none}#scene-message{text-align:center;color:#7a756c;letter-spacing:.04em;pointer-events:none;max-width:280px;font-size:14px;line-height:1.7;position:absolute;top:55%;left:50%;transform:translate(-50%,-50%)}#scene-message span{background:#a7854a;width:28px;height:1px;margin:14px auto;animation:1s ease-in-out infinite alternate pulse;display:block}#retry{background:#f5f3ed;border:1px solid #b8b7af;border-radius:22px;padding:11px 26px;font-size:14px;position:absolute;top:65%;left:50%;transform:translate(-50%)}#zzz{z-index:4;pointer-events:none;filter:drop-shadow(0 2px 6px #fff8);align-items:flex-end;gap:1px;margin:0;display:flex;position:absolute;top:40%;left:50%;transform:translate(-10%,-100%)}#zzz[hidden]{display:none}#zzz i{font-style:italic;font-family:var(--font-serif);color:#8a6b4f;opacity:0;font-weight:700;line-height:1;animation:2.4s ease-in-out infinite zzzrise}#zzz i:first-child{font-size:14px;animation-delay:0s}#zzz i:nth-child(2){font-size:18px;animation-delay:.4s}#zzz i:nth-child(3){font-size:24px;animation-delay:.8s}@keyframes pulse{to{opacity:.3;transform:scaleX(.45)}}@keyframes zzzrise{0%{opacity:0;transform:translateY(10px)rotate(-12deg)scale(.7)}25%{opacity:.95}70%{opacity:.55}to{opacity:0;transform:translate(10px,-28px)rotate(14deg)scale(1.15)}}.caption{left:0;right:0;bottom:calc(92px + env(safe-area-inset-bottom,0px));text-align:center;z-index:4;pointer-events:none;padding:0 24px;transition:opacity .28s,transform .38s cubic-bezier(.32,.9,.35,1);position:fixed}.caption p{color:var(--ink);letter-spacing:.04em;text-shadow:0 1px #fff6;margin:0;font-size:14px;font-weight:500;line-height:1.5}.mobile-playbar{z-index:7;padding:0 14px calc(10px + env(safe-area-inset-bottom,0px));box-shadow:none;pointer-events:auto;background:0 0;border:0;transition:opacity .28s,transform .38s cubic-bezier(.32,.9,.35,1);display:block;position:fixed;bottom:0;left:0;right:0}.mobile-playbar p{display:none}.mobile-playbar>div{background:linear-gradient(#c9a778 0%,#b88955 48%,#a67948 100%);border:1px solid #8f6540;border-radius:18px 18px 14px 14px;grid-template-columns:repeat(4,1fr);gap:8px;max-width:460px;margin:0 auto;padding:10px 10px 11px;display:grid;box-shadow:inset 0 -2px #d4b08a,0 8px 20px #3d2a1c22,0 1px #5c3d2410}.mobile-playbar button[hidden]{display:none!important}.mobile-playbar button{color:#5c4030;background:#fff8ee;border:1px solid #e8d5b8;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:4px;min-height:56px;padding:7px 2px;display:flex;box-shadow:inset 0 1px #fff8,0 2px 4px #5a3d2210}.mobile-playbar button strong{letter-spacing:.02em;font-size:12px;font-weight:600;line-height:1.2;display:block}.mobile-playbar button[aria-pressed=true]{color:#fff6ea;background:#7a4f2e;border-color:#6a4326;box-shadow:inset 0 2px 4px #0002}#mobile-reset{background:#f3e6d4;border-color:#dcc5a4}.play-icon{flex:none;width:26px;height:26px;margin:0;display:block}.controls{z-index:61;width:100%;max-width:100%;height:40dvh;max-height:40dvh;padding:0 0 calc(14px + env(safe-area-inset-bottom,0px));will-change:transform;pointer-events:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:#d4b896 transparent;background:linear-gradient(#fffdf9 0%,#fff8f0 40%,#f4ebe0 100%);border:0;border-top:1px solid #e6d7c6;border-radius:20px 20px 0 0;margin:0;transition:transform .38s cubic-bezier(.32,.9,.35,1);position:fixed;bottom:0;left:0;right:0;overflow:hidden auto;transform:translateY(0);box-shadow:0 -16px 40px #63412e20}body:not(.settings-open) .controls{pointer-events:none;transform:translateY(110%)}body.settings-open{overflow:hidden}body.settings-open .caption,body.settings-open .intro{opacity:0;pointer-events:none;transform:translateY(-8px)}body.settings-open .readings{opacity:0;pointer-events:none;transform:rotate(1.5deg)translateY(-6px)}body.settings-open .masthead{opacity:0;pointer-events:none;transform:translateY(-6px)}body.settings-open .mobile-playbar{opacity:0;pointer-events:none;transform:translateY(16px)}.controls:before{content:"";opacity:.85;background:#d8c4ad;border-radius:99px;width:36px;height:4px;margin:8px auto 0;display:block}.controls .panel-heading{z-index:5;border-bottom:1px solid var(--line-soft);background:linear-gradient(#fffdf9 75%,#fffdf900);justify-content:space-between;align-items:center;gap:12px;margin:0;padding:8px 14px;display:flex;position:sticky;top:0}.panel-heading-text{align-items:baseline;gap:8px;min-width:0;display:flex}.controls .panel-heading h2{font-family:var(--font-serif);letter-spacing:-.02em;color:var(--ink);margin:0;font-size:17px;font-weight:400}.controls .panel-heading-text>span,#flavor-number{color:#a07a55;letter-spacing:.06em;background:#f4e8d8;border-radius:999px;flex:none;padding:3px 8px;font-size:10px}#drawer-close{background:var(--accent);color:#fffaf2;cursor:pointer;border:0;border-radius:999px;flex:none;justify-content:center;align-items:center;min-height:32px;padding:0 14px;font-size:13px;font-weight:600;display:inline-flex;box-shadow:0 2px 8px #63412e22}#drawer-close:hover{background:#885431}.settings-grid{grid-template-columns:repeat(6,minmax(0,1fr));align-items:stretch;gap:10px;padding:10px 12px 4px;display:grid}@media (width<=1200px){.settings-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}@media (width<=1000px){.settings-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (width<=800px){.settings-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=560px){.settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=380px){.settings-grid{grid-template-columns:1fr}}.setting-card{background:#fffaf3ee;border:1px solid #eadfce;border-radius:14px;flex-direction:column;gap:6px;min-width:0;padding:10px 10px 8px;display:flex;box-shadow:inset 0 1px #fff8}.setting-card--wide{grid-column:1/-1}.play-heading{color:var(--ink);justify-content:space-between;align-items:center;gap:8px;margin:0;padding:0 2px;font-size:12px;font-weight:650;display:flex}.play-heading>span{color:var(--muted);letter-spacing:.01em;flex:none;font-size:10px;font-weight:400}.play-heading>b{font-weight:650}.flavors{background:0 0;border:0;border-radius:0;flex-wrap:wrap;gap:4px;margin:0;padding:0;display:flex}.flavors button{min-width:56px;min-height:52px;color:var(--ink);background:0 0;border:0;border-radius:10px;flex-direction:column;flex:calc(33.333% - 4px);justify-content:center;align-items:center;gap:4px;padding:6px 2px;font-size:11px;display:flex}.flavors i{background:#fff6dc;border:1px solid #b8a48a70;border-radius:50%;width:28px;height:28px;display:block;position:relative;box-shadow:0 2px 5px #63412e10}.flavors [data-flavor=berry] i{background:#dfa0aa}.flavors [data-flavor=matcha] i{background:#a9bd86}.flavors [data-flavor=oreo] i{background:radial-gradient(circle at 50% 42%,#f4efe6 42%,#2c2622 44%)}.flavors [data-flavor=peach] i{background:#ffd4b8}.flavors [data-flavor=watermelon] i{background:radial-gradient(circle at 50% 55%,#f5a8b0 55%,#3d8b5a 58%)}.flavors [data-flavor=mango] i{background:#ffd89a}.flavors [data-flavor=taro] i{background:#e8d4ef}.flavors [data-flavor=chocolate] i{background:#d4b896}.flavors button[aria-pressed=true]{background:#f4e5d1}.flavors button[aria-pressed=true] i{outline-offset:2px;outline:2px solid #8c603e}.flavors button[aria-pressed=true] i:after{content:"✓";color:var(--ink);place-items:center;font-size:14px;display:grid;position:absolute;inset:0}.flavors.ears button{color:#7a5f48;background:#fff;border:1px solid #eadfce;border-radius:12px;flex:calc(25% - 6px);gap:5px;min-width:52px;min-height:58px;padding:8px 4px 6px;font-size:10px;font-weight:600;box-shadow:inset 0 1px #fff8}.flavors.ears button img,.flavors.ears .ear-icon,.flavors.ears .eye-icon{object-fit:contain;color:#8a6b4f;filter:drop-shadow(0 1px 1px #63412e18);flex:none;width:30px;height:30px;display:block}.flavors.ears button span{letter-spacing:.02em;line-height:1.1}.flavors.ears button[aria-pressed=true]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),0 1px 0 #fff6 inset;color:var(--ink);background:#f4e5d1;outline:none}.flavors.ears button[aria-pressed=true] .ear-icon,.flavors.ears button[aria-pressed=true] .eye-icon{color:var(--accent)}.flavors.ears button[data-ear=crown] .ear-icon{color:#b8893a}.flavors.ears button[data-ear=crown][aria-pressed=true] .ear-icon{color:#9a6f28}.flavors.ears button[data-ear=sprout] .ear-icon{color:#6a9a4a}.flavors.ears button[data-ear=sprout][aria-pressed=true] .ear-icon{color:#4f7a34}.flavors.ears button[data-ear=bow] .ear-icon{color:#d47898}.flavors.ears button[data-ear=bow][aria-pressed=true] .ear-icon{color:#c45a7e}.flavors.eyes button[data-eye=heart] .eye-icon{color:#d46a6a}.flavors.eyes button[data-eye=heart][aria-pressed=true] .eye-icon{color:#c44e4e}.flavors.eyes button[data-eye=star] .eye-icon,.flavors.eyes button[data-eye=sparkle] .eye-icon{color:#c9a24a}.flavors.eyes button[data-eye=sleepy] .eye-icon{color:#8a6a4a}.flavors.custom-colors{gap:6px}.flavors.custom-colors .custom-color{flex:calc(50% - 4px)}.custom-color{cursor:pointer;color:#8a6b4f;border:1px solid var(--line);background:var(--cream);border-radius:10px;justify-content:center;align-items:center;gap:6px;padding:8px 10px;font-size:12px;display:flex}.custom-color input{cursor:pointer;background:0 0;border:none;border-radius:50%;width:28px;height:28px;padding:0}.custom-color input::-webkit-color-swatch-wrapper{padding:0}.custom-color input::-webkit-color-swatch{border:1px solid var(--line);border-radius:50%}.tools{flex-wrap:wrap;gap:6px;margin:0;display:flex}.tools button[hidden]{display:none!important}.tools button{border:1px solid var(--line);white-space:normal;min-width:0;min-height:52px;color:var(--ink);background:#fff;border-radius:12px;flex:calc(50% - 4px);padding:8px 6px;position:relative}.tools button .play-icon{width:22px;height:22px;margin:0 auto 4px}.tools button strong{font-size:12px;font-weight:600;display:block}.tools button[aria-pressed=true]{border:2px solid var(--accent);background:#f4e5d1;padding:7px 5px}.tools button:hover{background:#f4e5d1}.actions{flex-wrap:wrap;gap:6px;margin:0;display:flex}.actions button{min-height:40px;color:var(--ink);background:#fff;border:1px solid #e0d0bc;border-radius:12px;flex:calc(50% - 4px);font-size:13px;font-weight:500}.actions #nudge{background:var(--accent);border-color:var(--accent);color:var(--cream)}.actions #nudge:hover{background:#885431}.actions #nudge span{opacity:.65;margin-left:6px}.toggles{color:#7a5f48;background:0 0;border:0;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0;padding:0;font-size:12px;display:flex}.toggles label{cursor:pointer;white-space:nowrap;flex:auto;align-items:center;gap:6px;min-height:32px;display:flex}.toggles input{width:15px;height:15px;accent-color:var(--accent);cursor:pointer;margin:0}.toggles button{border:1px solid var(--line);min-height:34px;color:var(--ink);background:#fff;border-radius:10px;flex:100%;padding:8px 12px;font-size:12px}.toggles button[aria-pressed=true]{background:#f4e5d1}.tool-hint{color:#796957;background:#f7efe4;border-radius:8px;min-height:0;margin:0;padding:6px 8px;font-size:11px;line-height:1.5}.bite-button{border:1px solid var(--accent);background:var(--accent);color:#fffaf2;border-radius:12px;justify-content:space-between;align-items:center;width:100%;min-height:40px;margin:0;padding:8px 10px;display:flex}.bite-button strong{font-size:13px;font-weight:600}.bite-button span{opacity:.9;font-size:10px}.bite-button:hover{background:#885431}.tuning{box-shadow:none;background:0 0;border:0;border-radius:0;margin:0;padding:0}.tuning .play-heading{margin:0 0 4px;padding:0}.slider-label{justify-content:space-between;align-items:center;margin-bottom:0;font-size:12px;display:flex}.slider-label output{color:#83552f;font-variant-numeric:tabular-nums;font-size:11px;font-family:var(--font-mono);text-align:center;background:#fff;border:1px solid #eadfce;border-radius:6px;min-width:64px;padding:3px 7px}.controls input[type=range]{appearance:none;cursor:ew-resize;touch-action:pan-y;border-radius:0;width:100%;height:32px;margin:0;background:linear-gradient(to right,var(--accent) var(--fill,50%),#d3c5b3 var(--fill,50%)) center/100% 7px no-repeat!important}.controls input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--cream);border:3px solid var(--accent);border-radius:50%;width:22px;height:22px;box-shadow:0 2px 5px #63412e30}.controls input[type=range]::-moz-range-thumb{background:var(--cream);border:3px solid var(--accent);border-radius:50%;width:18px;height:18px}.range-ends{color:var(--muted);justify-content:space-between;margin:-2px 0 8px;font-size:10px;display:flex}.squish{width:100%;min-height:38px;color:var(--ink);font:inherit;cursor:pointer;background:#efe3d3;border:1px solid #d6bea2;border-radius:10px;margin:0;padding:10px 8px;font-size:13px;display:block}.squish:hover{background:#e5d3ba}.setting-card details{color:#7a5f48;background:0 0;border:0;border-radius:0;margin:0;padding:0;font-size:12px;line-height:1.6}details{color:#7a5f48;margin:0;padding:0;font-size:12px;line-height:1.6}summary{cursor:pointer;color:var(--ink);justify-content:space-between;align-items:center;font-size:14px;list-style:none;display:flex}summary::-webkit-details-marker{display:none}summary span{color:var(--muted);font-size:18px;line-height:12px}details[open] summary span{transform:rotate(45deg)}details p{margin:12px 0;line-height:1.7}details small{letter-spacing:.1em;font-size:10px}.inspect-link{color:#68745f;margin-top:12px;font-size:12px;text-decoration:none;display:block}#diagnostics{z-index:5;background:#fafbf7;border-radius:16px;max-width:min(430px,100vw - 48px);max-height:75vh;margin:0;padding:24px;position:fixed;top:80px;left:24px;overflow:auto;box-shadow:0 8px 40px #30352a20}#diagnostics pre{white-space:pre-wrap;font-size:12px;font-family:var(--font-mono)}#diagnostics button{border:1px solid #aab59f;border-radius:8px;margin:5px;padding:9px;font-size:13px}#benchmark-status{padding:12px}#inspector-toggle{z-index:6;background:#fafaf2;border:1px solid #b5baa9;border-radius:12px;padding:6px 10px;font-size:11px;position:fixed;top:58px;right:4%}@media (width<=380px){.intro h1{font-size:clamp(34px,10vw,46px)}.intro p{max-width:12em;font-size:12px}.readings{width:142px;padding:12px 10px 10px;right:10px}.readings output{font-size:12px}.readings small{font-size:8px}.mobile-playbar button{gap:3px;min-height:56px}.mobile-playbar .play-icon{width:22px;height:22px}.mobile-playbar button strong{font-size:11px}}@media (width>=900px){.intro{max-width:680px}.intro h1{font-size:56px}.intro p{font-size:14px}.readings{width:178px;right:28px}.mobile-playbar>div{max-width:440px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}#stage,.controls,.mobile-playbar,.intro,.caption,.readings,.masthead{transition:none!important}}.profile{flex-direction:column;gap:10px;padding:2px 0 4px;display:flex}.profile-name{color:var(--ink-soft);align-items:center;gap:8px;font-size:13px;display:flex}.profile-name input{border:1px solid var(--line);min-width:0;color:var(--ink);background:#fff;border-radius:10px;outline:none;flex:1;padding:8px 10px;font-size:14px}.profile-name input:focus{border-color:var(--caramel)}.profile-stats{gap:8px;display:flex}.profile-stats span{background:var(--card);border:1px solid var(--line);text-align:center;border-radius:10px;flex-direction:column;flex:1;gap:2px;padding:6px 4px;display:flex}.profile-stats b{color:var(--ink);font-size:16px}.profile-stats i{color:var(--ink-soft);font-size:11px;font-style:normal}#lang-toggle{border:1px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer;border-radius:999px;margin-left:auto;padding:4px 12px;font-size:12px;font-weight:600}#lang-toggle:hover{border-color:var(--caramel)}#greet-bubble{border:2px solid var(--caramel);color:var(--ink);opacity:0;z-index:1000;pointer-events:none;white-space:nowrap;background:#fff;border-radius:18px;padding:10px 18px;font-size:15px;font-weight:600;transition:all .4s cubic-bezier(.34,1.56,.64,1);position:fixed;top:18%;left:50%;transform:translate(-50%,-10px)scale(.9);box-shadow:0 8px 24px #0000001f}#greet-bubble.show{opacity:1;transform:translate(-50%)scale(1)}#greet-bubble:after{content:"";border-right:2px solid var(--caramel);border-bottom:2px solid var(--caramel);background:#fff;width:14px;height:14px;position:absolute;bottom:-8px;left:50%;transform:translate(-50%)rotate(45deg)}