:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#8bd7ff;color:#f8fafc;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{min-height:100dvh;margin:0;background:radial-gradient(circle at 18% 12%,rgba(255,255,255,.74) 0 3.5rem,transparent 3.7rem),radial-gradient(circle at 75% 8%,rgba(255,255,255,.62) 0 2.8rem,transparent 3rem),linear-gradient(180deg,#8bd7ff,#a7f3d0 52%,#ffe08a);overflow:hidden}button{font:inherit;border:0;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:transform .1s cubic-bezier(.4,0,.2,1),filter .1s ease}button:active{filter:brightness(.9)}.shell{width:min(100vw,520px);min-height:100dvh;margin:0 auto;padding:max(18px,env(safe-area-inset-top)) 16px max(18px,env(safe-area-inset-bottom));display:grid;grid-template-rows:auto auto 1fr auto auto auto;gap:10px;position:relative}.shell:before,.shell:after{content:"";position:absolute;pointer-events:none;z-index:0}.shell:before{width:180px;height:76px;left:-44px;bottom:86px;border-radius:50% 50% 0 0;background:#7ddf64;box-shadow:150px 18px #5ccf8b,280px -6px #9be15d}.shell:after{width:86px;height:86px;right:22px;top:132px;border-radius:50%;background:#ffe66d;box-shadow:inset -9px -10px #f59e0b47,0 0 0 8px #fff3}.topbar,.progress-wrap,.board-wrap,.reserve-wrap,.tray-wrap,.actions{position:relative;z-index:1}.home-screen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;min-height:100dvh;padding:max(56px,env(safe-area-inset-top)) 22px max(28px,env(safe-area-inset-bottom));display:grid;align-content:center;justify-items:center;gap:18px;overflow:hidden;background:radial-gradient(circle at 18% 14%,rgba(255,255,255,.72) 0 4.3rem,transparent 4.5rem),radial-gradient(circle at 82% 18%,rgba(255,255,255,.62) 0 3.2rem,transparent 3.4rem),linear-gradient(180deg,#8bd7ff,#b7f4d0 58%,#ffe08a);transition:opacity .18s ease,transform .18s ease,visibility .18s ease}.home-screen.hidden{opacity:0;visibility:hidden;transform:scale(1.04);pointer-events:none}.loading-screen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;min-height:100dvh;display:grid;align-content:center;justify-items:center;gap:24px;background:radial-gradient(circle at 18% 14%,rgba(255,255,255,.72) 0 4.3rem,transparent 4.5rem),radial-gradient(circle at 82% 18%,rgba(255,255,255,.62) 0 3.2rem,transparent 3.4rem),linear-gradient(180deg,#8bd7ff,#b7f4d0 58%,#ffe08a);transition:opacity .4s ease,visibility .4s ease,transform .4s ease}.loading-screen.hidden{opacity:0;visibility:hidden;transform:scale(1.05);pointer-events:none}.loader{width:64px;height:64px;border:6px solid rgba(255,255,255,.8);border-bottom-color:#f59e0b;border-left-color:#ef4444;border-right-color:#16a34a;border-radius:50%;box-shadow:0 8px #0f172a26;animation:rotation 1s cubic-bezier(.68,-.55,.265,1.55) infinite}.loading-text{font-size:24px;font-weight:900;color:#fff;text-shadow:0 3px 0 #0f766e,0 6px 12px rgba(15,23,42,.2);letter-spacing:2px;animation:pulse 1.5s ease-in-out infinite}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.home-screen h1{font-size:clamp(48px,15vw,82px);max-width:9ch;text-align:center;line-height:.92;color:#fff;text-shadow:0 4px 0 #0f766e,0 9px 0 rgba(15,118,110,.32),0 18px 28px rgba(15,23,42,.2)}.home-screen .eyebrow{color:#0f766e;font-size:13px;padding:7px 12px;border:3px solid #ffffff;border-radius:999px;background:#fff7ad;box-shadow:0 5px #f59e0b}.home-cloud{position:absolute;width:148px;height:62px;border-radius:999px;background:#fffc;box-shadow:36px -22px #fffc,74px 0 #fffc}.cloud-a{left:-48px;top:102px}.cloud-b{right:-72px;bottom:168px;transform:scale(.86)}.home-mascot{position:relative;width:170px;height:142px;filter:drop-shadow(0 22px 22px rgba(15,23,42,.18))}.home-card{position:absolute;width:86px;height:86px;display:grid;place-items:center;border:3px solid #ffffff;border-radius:18px;box-shadow:0 7px #0f172a38}.home-card .food-icon{width:105%;height:105%}.home-card-a{left:10px;top:34px;background:#f59e0b;--rot: -12deg;animation:floatCard 3.2s ease-in-out infinite alternate}.home-card-b{left:72px;top:36px;background:#dc2626;--rot: 10deg;animation:floatCard 2.8s ease-in-out infinite alternate-reverse}.home-card-c{left:42px;top:4px;background:#eab308;--rot: -2deg;z-index:2;animation:floatCard 3.5s ease-in-out infinite alternate}@keyframes floatCard{0%{transform:translateY(0) rotate(var(--rot))}to{transform:translateY(-12px) rotate(var(--rot))}}.start-btn{min-width:min(78vw,310px);min-height:64px;border:4px solid #ffffff;border-radius:22px;color:#17324d;background:#b5f7ff;box-shadow:0 9px #06b6d4,0 18px 24px #0f172a2e;font-size:24px;font-weight:900}.start-btn:active{transform:translateY(5px);box-shadow:0 4px #06b6d4,0 12px 18px #0f172a29}.topbar{display:flex;align-items:center;justify-content:space-between;min-height:72px}.audio-controls{display:flex;gap:8px}.home-audio-controls{position:absolute;top:max(18px,env(safe-area-inset-top));right:18px;z-index:2}.audio-controls button{width:42px;height:42px;display:grid;place-items:center;border:3px solid #ffffff;border-radius:50%;color:#17324d;background:#b5f7ff;box-shadow:0 5px #06b6d4,0 9px 14px #0f172a29;font-size:20px;font-weight:900}.audio-controls button.off{color:#64748b;background:#e2e8f0;box-shadow:0 5px #94a3b8,0 9px 14px #0f172a1f}.eyebrow{margin:0 0 4px;color:#0f766e;font-size:12px;font-weight:800;letter-spacing:0;text-transform:uppercase}h1,h2{margin:0;letter-spacing:0}h1{font-size:30px;line-height:1;color:#fff;text-shadow:0 3px 0 #0f766e,0 6px 12px rgba(15,23,42,.2)}.progress-wrap{padding:2px 0}.progress{height:13px;overflow:hidden;border-radius:999px;border:3px solid #ffffff;background:#0f172a29;box-shadow:0 4px #0f172a2e}#progressFill{width:0%;height:100%;border-radius:inherit;background:repeating-linear-gradient(45deg,#22c55e 0,#22c55e 12px,#84cc16 12px,#84cc16 24px);transition:width .18s ease}.board-wrap{min-height:0;display:grid;place-items:center}.board{--cell: min(11.6vw, 54px);position:relative;width:calc(var(--cell) * var(--board-width));height:calc(var(--cell) * var(--board-height));max-width:100%;border-radius:28px;filter:drop-shadow(0 10px 14px rgba(15,23,42,.12))}.tile{--size: calc(var(--cell) * 1.1);position:absolute;left:calc(var(--x) * var(--cell));top:calc(var(--y) * var(--cell));z-index:var(--z);width:var(--size);height:var(--size);display:grid;place-items:center;border:2px solid rgba(255,255,255,.96);border-radius:14px;color:#fff;background:var(--tile-color);box-shadow:0 calc(4px + var(--layer) * 1px) 0 #0f172a33,0 7px 10px #0f172a21;font-size:calc(var(--cell) * .62);font-weight:900;text-shadow:none;transition:transform .13s ease,filter .13s ease,opacity .13s ease}.food-icon{position:relative;width:104%;height:104%;display:block;background:center / contain no-repeat}.food-icon:before,.food-icon:after{content:"";position:absolute;display:block}.food-burger:before{left:7%;right:7%;top:15%;height:30%;border-radius:999px 999px 8px 8px;background:#fbbf24;box-shadow:0 30% 0 #22c55e,0 48% 0 #ef4444,0 66% 0 #92400e}.food-burger:after{left:14%;right:14%;bottom:10%;height:18%;border-radius:7px 7px 999px 999px;background:#f59e0b}.food-fries:before{left:24%;top:6%;width:12%;height:58%;border-radius:4px;background:#fde047;box-shadow:12px -4px #facc15,24px 2px #fde047,36px -6px #facc15}.food-fries:after{left:18%;right:18%;bottom:6%;height:48%;border-radius:7px 7px 12px 12px;background:#ef4444;clip-path:polygon(0 0,100% 0,84% 100%,16% 100%)}.food-pizza:before{left:18%;top:8%;width:64%;height:78%;border-radius:10px;background:#facc15;clip-path:polygon(8% 0,100% 18%,32% 100%)}.food-pizza:after{left:39%;top:34%;width:10px;height:10px;border-radius:50%;background:#dc2626;box-shadow:16px 12px #dc2626,-8px 23px #16a34a}.food-hotdog:before{left:11%;right:11%;top:34%;height:34%;border-radius:999px;background:#fbbf24;transform:rotate(-14deg)}.food-hotdog:after{left:19%;right:19%;top:43%;height:15%;border-radius:999px;background:#dc2626;transform:rotate(-14deg)}.food-soda:before{left:28%;right:28%;top:15%;height:72%;border-radius:5px 5px 12px 12px;background:#f8fafc;clip-path:polygon(8% 0,92% 0,78% 100%,22% 100%)}.food-soda:after{left:31%;right:31%;top:39%;height:25%;background:#ef4444;clip-path:polygon(0 0,100% 0,82% 100%,18% 100%)}.food-donut:before{top:12%;right:12%;bottom:12%;left:12%;border-radius:50%;background:#f9a8d4;box-shadow:inset 0 0 0 9px #92400e}.food-donut:after{left:44%;top:20%;width:6px;height:6px;border-radius:50%;background:#fde047;box-shadow:13px 17px #f8fafc,-12px 20px #22c55e,3px 35px #60a5fa}.food-taco:before{left:15%;right:15%;top:22%;height:55%;border-radius:999px 999px 8px 8px;background:#facc15;box-shadow:inset 0 -11px #92400e}.food-taco:after{left:24%;right:24%;top:39%;height:12%;border-radius:999px;background:#22c55e;box-shadow:12px 9px #ef4444,-10px 12px #22c55e}.food-icecream:before{left:32%;right:32%;bottom:9%;height:44%;background:#f59e0b;clip-path:polygon(0 0,100% 0,50% 100%)}.food-icecream:after{left:24%;right:24%;top:10%;height:42%;border-radius:50% 50% 42% 42%;background:#f8fafc;box-shadow:11px 10px #f9a8d4,-9px 11px #bae6fd}.food-icon:before,.food-icon:after{content:none}.food-burger{background-image:url(/assets/burger-CG3_nkhC.png)}.food-fries{background-image:url(/assets/fries-D_tKfz7J.png)}.food-pizza{background-image:url(/assets/pizza-CB4YXPfK.png)}.food-hotdog{background-image:url(/assets/hotdog-BfSiKKZv.png)}.food-soda{background-image:url(/assets/soda-BbN3bI0J.png)}.food-donut{background-image:url(/assets/donut-DAzc2ma5.png)}.food-taco{background-image:url(/assets/taco-CzWT-Qc0.png)}.food-icecream{background-image:url(/assets/icecream-6CYjqK6x.png)}.food-chicken{background-image:url(/assets/chicken-CtxmKSOf.png)}.food-sandwich{background-image:url(/assets/sandwich-BTuebYmD.png)}.food-popcorn{background-image:url(/assets/popcorn-C9Eg_kae.png)}.food-cookie{background-image:url(/assets/cookie-Bt9mq6L3.png)}.food-cupcake{background-image:url(/assets/cupcake-CyC6Iye_.png)}.food-egg{background-image:url(/assets/egg-s4hXRb57.png)}.food-coffee{background-image:url(/assets/coffee-Bj_IxWAg.png)}.food-sushi{background-image:url(/assets/sushi-CdBcWcwn.png)}.tile:after{content:none}.tile.available:active{transform:translateY(3px) scale(.97)}.tile.blocked{cursor:default;color:#ffffffc2;background:linear-gradient(#64748ba8,#64748ba8),var(--tile-color);border-color:#e2e8f0e0;box-shadow:0 calc(4px + var(--layer) * 1px) 0 #4b5563ad,0 6px 9px #0f172a1f;text-shadow:none}.tile.blocked .food-icon{filter:grayscale(.7) brightness(.68) contrast(.9)}.reserve-wrap,.tray-wrap{padding:10px;border:4px solid rgba(255,255,255,.8);border-radius:18px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 8px #d9466fcc,0 15px 22px #0f172a33}.reserve-wrap{width:min(46vw,178px);justify-self:center;padding:7px;background:#c7f9ffa6;box-shadow:0 7px #06b6d4cc,0 12px 18px #0f172a29}.tray-wrap{background:#ff9fb2a6}.tray,.reserve{display:grid;gap:6px}.tray{grid-template-columns:repeat(7,1fr)}.reserve{grid-template-columns:repeat(3,1fr)}.slot{aspect-ratio:1;display:grid;place-items:center;border-radius:14px;border:1px dashed rgba(255,255,255,.78);background:var(--tile-color, rgba(255, 255, 255, .17));color:#fff;font-size:clamp(21px,6.4vw,31px);font-weight:900;text-shadow:none}.slot:not(:disabled){box-shadow:0 4px #0f172a33}.slot.selectable{outline:2px solid #fef08a;outline-offset:2px}.slot.selected{outline:3px solid #22c55e;transform:translateY(-3px)}.actions{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.actions button,.dialog button{min-height:48px;border:3px solid #ffffff;border-radius:16px;color:#17324d;background:#fff7ad;box-shadow:0 7px #f59e0b,0 12px 18px #0f172a2e;font-size:24px;font-weight:900}.actions button:nth-child(2){background:#b5f7ff;box-shadow:0 7px #06b6d4,0 12px 18px #0f172a2e}.actions button:nth-child(3){background:#d9f99d;box-shadow:0 7px #65a30d,0 12px 18px #0f172a2e}.actions button:nth-child(4){background:#fecdd3;box-shadow:0 7px #e11d48,0 12px 18px #0f172a2e}.actions button:disabled{opacity:.45}.actions button.active{outline:3px solid #fef08a;outline-offset:3px}.dialog{width:min(88vw,360px);border:4px solid rgba(255,255,255,.9);border-radius:22px;padding:0;color:#17324d;background:#fff7adb8;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:0 10px #f59e0b,0 26px 70px #00000047,inset 0 0 24px #ffffff80}.dialog::backdrop{background:#02061799;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.dialog form{padding:22px;display:grid;gap:14px}.dialog p{margin:0;color:#31516f}.dialog button{width:100%;margin-top:4px;background:#7dd3fc;box-shadow:0 7px #0284c7,0 12px 18px #0f172a2e}@keyframes pulse{0%{transform:translateY(-2px)}to{transform:translateY(2px)}}@media (max-width: 380px){.shell{padding-inline:12px;gap:10px}h1{font-size:26px}}