@font-face{font-family:DoubleQ;src:url("ui-font.woff2?dqv=5bc54cb375f63cc6") format("woff2");font-display:swap}
:root{color-scheme:dark;font-family:DoubleQ,-apple-system,BlinkMacSystemFont,"PingFang TC",sans-serif;color:#fff4dc;background:#162b47;font-synthesis:none;-webkit-text-size-adjust:100%}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{display:grid;place-items:center;height:100dvh;background:#162b47}[hidden]{display:none!important}
#stage{position:relative;width:100%;height:100%;overflow:hidden;background:#162b47}#canvas{display:block;width:100%;height:100%;outline:none;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.overlay{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;background:radial-gradient(ellipse at 36% 60%,#465775,#182e4b 80%);overflow:auto;overscroll-behavior:contain}.panel{position:relative;display:flex;flex-direction:column;align-items:center;gap:20px;width:min(480px,100%);margin:auto;flex-shrink:0}.panel p{line-height:1.6;color:#dbd6ca;font-size:15px}h1,h2,p{margin:0}h1{font-size:clamp(34px,4vw,60px);font-weight:400;letter-spacing:.18em;line-height:1.3}h2{font-size:28px;font-weight:400;letter-spacing:.12em}
#welcome{overflow:hidden;background:radial-gradient(ellipse at 25% 58%,#61718a55,transparent 55%),linear-gradient(#172d4c,#485c78 72%,#9e8069)}#welcome:before{content:"";position:absolute;width:90vw;height:28%;left:-20%;bottom:-14%;border-radius:50%;background:linear-gradient(#fff8de,#dcb98a);box-shadow:55vw 4vh 0 1vh #f6e7c7}#welcome:after{content:"";position:absolute;right:13%;top:14%;width:36px;height:36px;border-radius:50%;background:#ffedbb;box-shadow:0 0 45px #f9e7b325;pointer-events:none}
#welcome .panel{width:min(860px,88%);display:grid;grid-template-columns:1fr 1fr;column-gap:70px;row-gap:16px;text-align:left;align-content:center;z-index:1}.hero-portrait{grid-column:1;grid-row:1/6;width:100%;height:auto;max-height:330px;overflow:visible;filter:drop-shadow(0 14px 10px #17223645);transform-origin:50% 90%;animation:arrive 500ms ease-out both}.eyebrow{font-size:14px!important;letter-spacing:.4em;color:#f5daa8!important}#welcome h1{white-space:nowrap}.hint{font-size:12px!important;letter-spacing:.08em;color:#f0e6d4!important}#welcome .tagline{font-size:15px;letter-spacing:.08em}
button{font:inherit;cursor:pointer;min-width:48px;min-height:48px;touch-action:manipulation;color:#fff2d9;background:transparent;border:0;padding:12px 24px;transition:transform 150ms ease-out;line-height:1.4}button:disabled{opacity:.45;cursor:wait}button:focus-visible{outline:2px solid #ffe3a0;outline-offset:8px}button:active{transform:none}
#play{position:relative;justify-self:start;width:122px;height:128px;padding:0;margin:8px 0 4px;color:#fff4dc}.food-art{display:block;width:100%;height:100%;pointer-events:none;transform-origin:50% 90%;filter:drop-shadow(0 6px 5px #12223855);will-change:transform}#play .food-art{height:104px}#play .play-label{display:block;font-size:15px;letter-spacing:.14em;text-shadow:0 1px 2px #15263e}#play span[aria-hidden]{display:none}

button.secondary{border-bottom:1px solid #d7bd8f66}progress{width:min(260px,100%);height:5px;accent-color:#efc279;margin:12px 0}.loading-food{display:block;width:76px;height:62px;transform-origin:50% 90%;filter:drop-shadow(0 5px 5px #13253f55)}#loading .loading-food{animation:breathe 1.4s ease-in-out infinite}#failure .panel{gap:24px}#retry-load{position:relative;width:110px;height:124px;padding:0;font-size:14px;white-space:nowrap}#retry-load .food-art{height:96px}#retry-load span{display:block;margin-top:5px;letter-spacing:.08em}#cache-note{position:absolute;left:50%;bottom:max(14px,var(--safe-bottom,0px));transform:translateX(-50%);max-width:calc(100% - 40px);text-align:center;padding:10px 16px;background:#152b46ec;color:#f4e3c1;opacity:0;pointer-events:none;transition:opacity .2s;z-index:6}#cache-note.visible{opacity:1}
.freshness{z-index:9;flex-direction:column;gap:24px;font-size:13px;letter-spacing:.16em;transition:opacity .18s,visibility .18s}.fresh-mark{position:relative;width:76px;height:62px}.fresh-mark i{position:absolute;bottom:54px;width:10px;height:24px;border:2px solid;border-color:#fff1d766 transparent transparent;border-radius:50%;animation:steam 1.8s ease-in-out infinite}.fresh-mark i:nth-child(1){left:12px}.fresh-mark i:nth-child(2){left:27px;animation-delay:-.6s}.fresh-mark i:nth-child(3){left:42px;animation-delay:-1.2s}html[data-freshness=ready] .freshness{opacity:0;visibility:hidden;pointer-events:none}
#safe-area{position:fixed;visibility:hidden;pointer-events:none;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}html[data-input=touch] body{padding:0;display:block}html[data-input=touch] #stage{position:fixed;left:0;top:0;max-height:none;transform-origin:0 0}html[data-input=touch] .overlay{padding:max(16px,var(--safe-top,0px)) max(24px,var(--safe-right,0px)) max(16px,var(--safe-bottom,0px)) max(24px,var(--safe-left,0px))}
#stage.compact #welcome .panel{width:min(620px,92%);column-gap:36px;row-gap:9px}#stage.compact .hero-portrait{max-height:220px}#stage.compact h1{font-size:34px}#stage.compact #play{width:96px;height:103px;margin:2px 0}#stage.compact #play .food-art{height:80px}#stage.compact #play .play-label{font-size:14px}#stage.compact .tagline{display:none}
@media(max-height:320px){#welcome .panel{row-gap:6px!important}.hero-portrait{max-height:170px!important}#welcome h1{font-size:28px!important}.hint{font-size:11px!important}.panel{gap:12px}h2{font-size:23px}}
@media(hover:hover) and (pointer:fine){button:hover .food-art{filter:drop-shadow(0 7px 6px #12223865) brightness(1.025)}}
@keyframes steam{0%,100%{transform:translateY(4px);opacity:.15}50%{transform:translateY(-5px);opacity:.7}}@keyframes arrive{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}@keyframes breathe{50%{transform:scale(1.04,.96)}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}button:active{transform:none}}