:root{--ink:#f7f0e1;--ink-dim:#b3a28a;--gold:#f2c14e;--red:#d9553f;--bg:#161210;--panel:#1a1410f0;--line:#b3a28a40}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);margin:0;font-family:ui-rounded,SF Pro Rounded,Nunito,system-ui,sans-serif;overflow:hidden}#app{background:var(--bg);position:fixed;inset:0}#game-mount{position:absolute;inset:0}#game-mount canvas{touch-action:none}#hud{pointer-events:none;flex-direction:column;justify-content:space-between;padding:14px 16px;display:flex;position:absolute;inset:0}#hud-top{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}#brand{text-shadow:0 2px 8px #0009;align-items:baseline;gap:10px;display:flex}#brand-name{letter-spacing:.18em;color:var(--gold);font-size:18px;font-weight:800}#order-label{color:var(--ink-dim);font-size:13px;font-weight:600}#chips{align-items:center;gap:8px;display:flex}#score{color:var(--ink-dim);border:1px solid var(--line);backdrop-filter:blur(4px);background:#1a141099;border-radius:999px;padding:6px 14px;font-size:14px;font-weight:600}#score b{color:var(--ink);font-size:15px}#butter-meter{border:1px solid var(--line);backdrop-filter:blur(4px);background:#1a141099;border-radius:999px;gap:4px;padding:8px 12px;display:flex}.pat-cube{background:linear-gradient(135deg,#ffefac,#e9b23a);border-radius:3px;width:12px;height:12px;transition:opacity .3s,filter .3s;box-shadow:0 0 6px #f2c14e80}.pat-cube.spent{opacity:.22;filter:grayscale();box-shadow:none}#challenge-banner{color:var(--gold);backdrop-filter:blur(4px);background:#f2c14e24;border:1px solid #f2c14e80;border-radius:999px;align-self:center;margin-top:2px;padding:8px 18px;font-size:14px;font-weight:700}#hud-bottom{justify-content:space-between;align-items:flex-end;gap:12px;display:flex}#hint{color:var(--ink-dim);border:1px solid var(--line);backdrop-filter:blur(4px);background:#1a141099;border-radius:999px;padding:6px 12px;font-size:13px;transition:opacity .4s}#hint.gone{opacity:0}#controls{gap:8px;display:flex}.chip{pointer-events:auto;color:var(--ink);border:1px solid var(--line);cursor:pointer;backdrop-filter:blur(4px);background:#1a1410b8;border-radius:999px;padding:9px 14px;font:700 13px/1 inherit;transition:border-color .15s,transform .1s}.chip:hover{border-color:var(--gold);transform:translateY(-1px)}.chip.muted{opacity:.55;text-decoration:line-through}#toasts{flex-direction:column;align-items:center;gap:6px;display:flex;position:absolute;bottom:74px;left:50%;transform:translate(-50%)}.toast{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:8px 16px;font-size:14px;font-weight:600;animation:.2s toast-in,.4s 2.2s forwards toast-out}.toast.gold{color:var(--gold);border-color:#f2c14e99}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}}@keyframes toast-out{to{opacity:0;transform:translateY(-6px)}}#melt-panel{backdrop-filter:blur(3px);z-index:9;background:#0a07058c;place-items:center;display:grid;position:absolute;inset:0}#melt-card{background:var(--panel);text-align:center;border:1px solid #d9553f8c;border-radius:16px;padding:22px 28px;box-shadow:0 24px 80px #0000008c}#melt-card h2{color:var(--red);letter-spacing:.16em;margin:0 0 4px;font-size:22px}#melt-card p{color:var(--ink-dim);margin:0 0 14px;font-size:14px;font-weight:600}#melt-actions{justify-content:center;gap:8px;display:flex}#share-panel{backdrop-filter:blur(5px);z-index:10;background:#0a0705a8;place-items:center;display:grid;position:absolute;inset:0}#share-panel.hidden,#melt-panel.hidden,#challenge-banner.hidden{display:none}#share-card{background:var(--panel);border:1px solid var(--line);text-align:center;border-radius:18px;width:min(560px,100vw - 32px);max-height:calc(100vh - 32px);padding:22px;position:relative;overflow:auto;box-shadow:0 24px 80px #0000008c}#share-close{color:var(--ink-dim);cursor:pointer;background:0 0;border:none;font-size:26px;line-height:1;position:absolute;top:10px;right:12px}#share-close:hover{color:var(--ink)}#share-title{color:var(--gold);letter-spacing:.14em;margin:4px 0 2px;font-size:22px}#share-sub{color:var(--ink-dim);margin:0 0 14px;font-size:14px;font-weight:600}#share-img{border:1px solid var(--line);border-radius:10px;width:100%}#share-actions,#share-next{flex-wrap:wrap;justify-content:center;gap:8px;margin-top:12px;display:flex}#share-next{border-top:1px solid var(--line);margin-top:16px;padding-top:14px}#cross-promo{text-align:left;background:#f2c14e12;border:1px dashed #f2c14e73;border-radius:12px;flex-direction:column;gap:3px;margin-top:14px;padding:12px 16px;text-decoration:none;transition:border-color .15s,background .15s;display:flex}#cross-promo:hover{border-color:var(--gold);background:#f2c14e24}#cross-promo .promo-kicker{text-transform:uppercase;letter-spacing:1.2px;color:var(--gold);font-size:11px;font-weight:800}#cross-promo .promo-body{color:var(--ink-dim);font-size:13.5px;line-height:1.45}#cross-promo .promo-body b{color:var(--ink);margin-right:4px;font-size:15px}.btn{color:var(--ink);border:1px solid var(--line);cursor:pointer;background:#b3a28a1f;border-radius:10px;padding:11px 16px;font:700 14px/1 inherit;transition:border-color .15s,background .15s}.btn:hover{border-color:var(--gold)}.btn.primary{background:var(--gold);border-color:var(--gold);color:#171406}.btn.primary:hover{background:#ffd76e}@media (width<=640px){#hint{display:none}#brand-name{font-size:15px}}#share-card>#share-actions{z-index:2;background:var(--panel);border-top:1px solid var(--line);margin:12px -22px 0;padding:8px 22px 12px;position:sticky;bottom:-22px}
