:root{--ink:#4b2e2a;--brown:#7d4834;--cream:#fff5d8;--paper:#ffedb5;--peach:#ef986e;--red:#d95b52;--yellow:#f4c75f;--green:#70965c;--line:#5f382d;--pixel:"Pixelify Sans",monospace;--dot:"DotGothic16",sans-serif}
*{box-sizing:border-box}body{margin:0;color:var(--ink);font-family:var(--pixel);background:#f8d993;min-height:100vh;background-image:linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px);background-size:8px 8px}.sun-glow{position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 15% 5%,#fff8cf 0,transparent 34%),radial-gradient(circle at 90% 85%,rgba(231,121,84,.22),transparent 35%)}main{width:min(1080px,calc(100% - 32px));margin:0 auto;padding:28px 0 40px}.masthead{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.brand{display:flex;align-items:center;gap:12px}.brand-mark{display:grid;place-items:center;width:44px;height:44px;color:#fff;background:var(--red);border:3px solid var(--line);box-shadow:4px 4px 0 var(--line);font-size:22px}.brand h1{font-size:clamp(25px,5vw,42px);line-height:.85;margin:0;letter-spacing:1px}.brand p{margin:6px 0 0;font-family:var(--dot);font-size:12px}.sound-button,.pick-button{font:700 14px var(--pixel);color:var(--ink);background:var(--cream);border:3px solid var(--line);box-shadow:4px 4px 0 var(--line);padding:10px 14px;cursor:pointer}.sound-button:active,.pick-button:active{translate:3px 3px;box-shadow:1px 1px 0 var(--line)}.game-shell{border:4px solid var(--line);box-shadow:8px 8px 0 rgba(95,56,45,.35);background:var(--ink)}.game-topbar{height:42px;padding:0 14px;color:var(--cream);display:flex;justify-content:space-between;align-items:center;font-size:14px}.status{display:flex;align-items:center;gap:8px}.status-heart{color:#ff776f}.meter{display:inline-block;width:90px;height:12px;border:2px solid var(--cream);padding:2px}.meter i{display:block;width:82%;height:100%;background:#ef7770}.room{height:520px;position:relative;overflow:hidden;outline:none;background:linear-gradient(#f7c97a 0 58%,#c88d59 58%);image-rendering:pixelated}.room:focus-visible{box-shadow:inset 0 0 0 4px #fff}.wall-pattern{position:absolute;inset:0 0 42% 0;background-image:linear-gradient(90deg,rgba(126,72,52,.12) 2px,transparent 2px),linear-gradient(rgba(255,255,255,.2) 2px,transparent 2px);background-size:32px 32px}.room:after{content:"";position:absolute;left:0;right:0;top:58%;height:10px;background:#9c5d3f;border-block:3px solid var(--line)}.window{position:absolute;left:38%;top:8%;width:23%;height:30%;background:#a8d7c2;border:7px solid #fff1c9;box-shadow:0 0 0 4px var(--line),8px 9px 0 rgba(85,54,42,.18)}.window:before,.window:after{content:"";position:absolute;background:var(--line);z-index:2}.window:before{width:4px;top:0;bottom:0;left:50%}.window:after{height:4px;left:0;right:0;top:50%}.window span{position:absolute;width:32px;height:32px;background:#fff0a4;right:12px;top:9px}.window i{position:absolute;left:10px;right:10px;bottom:8px;height:28px;background:linear-gradient(145deg,transparent 45%,#75a678 46% 70%,transparent 71%),linear-gradient(35deg,transparent 30%,#5f9366 31% 65%,transparent 66%)}.poster{position:absolute;left:5%;top:8%;padding:11px 8px;background:#ffe9a6;border:3px solid var(--line);box-shadow:4px 4px 0 rgba(95,56,45,.25);font-size:18px;rotate:-2deg}.poster span{display:block;text-align:center;color:var(--red)}.shelf{position:absolute;right:6%;top:10%;width:20%;height:16px;background:var(--brown);border:3px solid var(--line)}.jar{position:absolute;bottom:13px;width:25px;border:3px solid var(--line);border-bottom-width:5px}.jar-a{height:35px;left:10px;background:#d36c58}.jar-b{height:44px;left:48px;background:#89aa72}.jar-c{height:30px;left:88px;background:#f3e3a1}.table{position:absolute;left:31%;top:68%;width:38%;height:74px;background:#f0b66f;border:4px solid var(--line);z-index:2}.table:before,.table:after{content:"";position:absolute;top:70px;width:15px;height:65px;background:var(--brown);border:3px solid var(--line)}.table:before{left:12px}.table:after{right:12px}.table span{position:absolute;left:45%;top:-28px;font-size:35px}.plant{position:absolute;left:67%;top:39%;font-size:62px;color:var(--green);text-shadow:3px 3px 0 var(--line)}.plant b{position:absolute;width:44px;height:42px;left:8px;top:50px;background:#df7d57;border:3px solid var(--line)}.rug{position:absolute;width:35%;height:25%;left:33%;top:68%;background:#e9806c;border:4px solid var(--line);transform:skewX(-8deg)}.hotspot{position:absolute;left:var(--x);top:var(--y);width:94px;height:115px;border:4px solid var(--line);background:#f3e7bc;cursor:pointer;z-index:3;font:700 12px var(--pixel);color:var(--ink);box-shadow:4px 4px 0 rgba(95,56,45,.28)}.hotspot span{position:absolute;left:50%;bottom:-26px;translate:-50% 0;background:var(--ink);color:#fff4cf;padding:3px 6px;opacity:0;white-space:nowrap}.hotspot:hover span,.hotspot:focus-visible span{opacity:1}.hotspot.discovered{filter:saturate(1.2)}.hotspot.discovered:after{content:"★";position:absolute;right:-9px;top:-13px;color:#fff;background:var(--red);border:2px solid var(--line);padding:2px 5px}.fridge{background:linear-gradient(90deg,#bad9c8 0 48%,var(--line) 48% 52%,#bad9c8 52%)}.fridge:before{content:"";position:absolute;right:12px;top:28px;height:32px;border-left:4px solid var(--line)}.stove{height:75px;background:radial-gradient(circle at 28% 18%,var(--line) 0 7px,transparent 8px),radial-gradient(circle at 70% 18%,var(--line) 0 7px,transparent 8px),#df9164}.stove:before{content:"";position:absolute;left:10px;right:10px;top:38px;height:25px;background:#8d5541;border:3px solid var(--line)}.snackbox{height:62px;background:#f2c857}.snackbox:before{content:"SNAX";font-size:18px;position:absolute;inset:15px 0}.takeout{height:63px;background:#e47e64}.takeout:before{content:"☷";font-size:33px}.character{position:absolute;left:var(--cx);top:var(--cy);width:48px;height:68px;translate:-50% -50%;z-index:7;transition:left .08s linear,top .08s linear;filter:drop-shadow(3px 4px 0 rgba(95,56,45,.25))}.character.walking{animation:bob .16s steps(2) infinite}.name-tag{position:absolute;bottom:-18px;left:50%;translate:-50%;font-size:10px;background:var(--cream);border:2px solid var(--line);padding:1px 4px}.head{position:absolute;left:9px;top:9px;width:31px;height:30px;background:#efb181;border:3px solid var(--line);z-index:3}.head i,.head b{position:absolute;top:13px;width:4px;height:5px;background:var(--ink)}.head i{left:5px}.head b{right:5px}.hair{position:absolute;background:#5f392d;border:3px solid var(--line)}.hair.back{left:5px;top:2px;width:40px;height:44px}.hair.fringe{left:8px;top:5px;width:34px;height:13px;z-index:4;clip-path:polygon(0 0,100% 0,100% 45%,75% 100%,52% 43%,35% 100%,0 55%)}.body{position:absolute;left:8px;top:37px;width:34px;height:28px;background:#e96f67;border:3px solid var(--line)}.feet{position:absolute;left:9px;bottom:-2px;width:14px;height:7px;background:var(--ink);box-shadow:20px 0 var(--ink)}.speech{position:absolute;left:52%;top:48%;z-index:8;padding:7px 10px;background:#fff9df;border:3px solid var(--line);box-shadow:3px 3px 0 var(--line);font-size:12px;max-width:200px}.speech:after{content:"";position:absolute;left:16px;bottom:-10px;border:5px solid transparent;border-top-color:var(--line)}.room-hint{position:absolute;left:16px;bottom:12px;z-index:9;background:rgba(255,245,216,.92);border:3px solid var(--line);padding:6px 8px;font-size:11px}.key{display:inline-grid;place-items:center;width:18px;height:18px;background:#fff;border:2px solid var(--line);margin-right:2px}.picker{display:grid;grid-template-columns:1fr 1.2fr auto;align-items:center;gap:24px;padding:24px;margin-top:28px;background:#fff2c9;border:4px solid var(--line);box-shadow:7px 7px 0 rgba(95,56,45,.28)}h2{font-size:22px;margin:0 0 4px}.picker-copy p,.collection p{font-family:var(--dot);font-size:12px;margin:0}.result{display:flex;align-items:center;gap:12px;min-height:65px}.result-icon{display:grid;place-items:center;width:58px;height:58px;background:var(--yellow);border:3px solid var(--line);font-size:30px}.result small{font-size:10px;display:block}.result strong{display:block;font-size:19px;margin-top:3px}.result.rolling .result-icon{animation:shake .15s steps(2) infinite}.pick-button{background:var(--red);color:#fff9dc;padding:16px 18px;font-size:15px}.pick-button span{color:#ffe58c}.collection{margin-top:28px;display:grid;grid-template-columns:180px 1fr;gap:28px;align-items:start}.food-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.food-card{min-height:82px;display:grid;place-items:center;text-align:center;padding:6px;background:#ffedb8;border:3px solid var(--line);font-size:11px;position:relative}.food-card i{font-style:normal;font-size:25px}.food-card.locked{color:transparent;background:#d8af73}.food-card.locked:after{content:"?";color:#7d6045;font-size:25px;position:absolute}.food-card.new{animation:pop .45s steps(3)}footer{text-align:center;padding:18px;color:#6d4537;font-size:11px}footer span{color:var(--red)}.toast{position:fixed;left:50%;bottom:24px;translate:-50% 30px;z-index:20;background:var(--ink);color:#fff8d8;border:3px solid #fff0c0;padding:10px 14px;opacity:0;transition:.18s}.toast.show{opacity:1;translate:-50% 0}@keyframes bob{50%{translate:-50% calc(-50% - 3px)}}@keyframes shake{50%{translate:3px -2px}}@keyframes pop{0%{scale:.6}70%{scale:1.15}100%{scale:1}}
@media(max-width:800px){main{width:min(100% - 20px,680px);padding-top:18px}.sound-button{font-size:0}.sound-button:after{content:"♪";font-size:18px}.room{height:480px}.picker{grid-template-columns:1fr 1fr}.picker-copy{grid-column:1/-1}.pick-button{height:64px}.collection{grid-template-columns:1fr}.food-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:520px){.brand p{display:none}.game-topbar{font-size:11px}.meter{width:50px}.room{height:440px}.window{left:36%;width:28%}.hotspot{scale:.78;transform-origin:top left}.speech{top:50%;left:48%;max-width:150px}.room-hint{right:10px;left:auto}.picker{grid-template-columns:1fr;padding:18px;gap:16px}.picker-copy,.pick-button{grid-column:auto}.result{min-height:auto}.food-grid{grid-template-columns:repeat(3,1fr)}.collection{gap:14px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}