@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&family=VT323&display=swap');

:root{--ink:#19143a;--navy:#242052;--cream:#fff4cc;--yellow:#ffd84a;--orange:#ff8a3d;--red:#ef476f;--blue:#42b9e9;--green:#65d17a;--shadow:#0d0b23}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#100d29;color:var(--cream);font-family:'VT323',monospace}.hidden{display:none!important}button{font:inherit}button:focus-visible{outline:4px solid white;outline-offset:3px}
body{display:grid;place-items:center;background:radial-gradient(circle at 50% 15%,#3a3377,#100d29 70%)}
#game-shell{position:relative;width:min(100vw,1120px);aspect-ratio:16/9;max-height:100vh;overflow:hidden;background:var(--ink);box-shadow:0 0 0 5px #090718,0 24px 70px #05040dbf;image-rendering:pixelated}.screen-shake{animation:screenShake .3s linear}@keyframes screenShake{0%,100%{transform:translate(0)}20%{transform:translate(-4px,2px)}40%{transform:translate(4px,-2px)}60%{transform:translate(-3px,-1px)}80%{transform:translate(3px,2px)}}
.screen{position:absolute;inset:0;display:none}.screen.active{display:block}
.pixel-panel{background:var(--cream);color:var(--ink);border:5px solid var(--ink);box-shadow:8px 8px 0 #0005, inset 0 0 0 4px #f4dca4}
.pixel-btn{min-height:46px;padding:10px 18px;border:4px solid var(--ink);background:#fff9df;color:var(--ink);font:14px 'Press Start 2P',monospace;box-shadow:4px 4px 0 var(--shadow);cursor:pointer;transition:transform .08s}.pixel-btn:hover{background:var(--yellow);transform:translate(-1px,-1px);box-shadow:6px 6px 0 var(--shadow)}.pixel-btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--shadow)}.pixel-btn.primary{background:var(--yellow)}.pixel-btn.small{min-height:34px;font-size:9px;padding:8px 10px}
#menu-screen{background:linear-gradient(#55c8ef 0 66%,#9ee06b 66%)}.sun{position:absolute;width:90px;height:90px;border-radius:50%;right:10%;top:8%;background:#ffe66b;box-shadow:0 0 0 14px #fff2a344}.cloud{position:absolute;width:110px;height:28px;background:white;box-shadow:25px -22px white,55px -8px white}.cloud-a{left:7%;top:17%}.cloud-b{right:28%;top:32%;transform:scale(.65)}.menu-ground{position:absolute;z-index:0;bottom:0;width:100%;height:34%;background:#70bd54;border-top:8px solid #3d853b}.menu-ground i{position:relative;display:inline-block;width:20px;height:38px;background:#539f49;margin:18px 7%;transform:skew(-9deg)}
.menu-card{position:absolute;z-index:2;width:520px;max-width:88%;left:50%;top:50%;transform:translate(-50%,-50%);padding:28px 36px 24px;text-align:center}.eyebrow{font:9px 'Press Start 2P';color:#9b3d53;margin:0 0 12px}.menu-card h1{font:42px/1.25 'Press Start 2P';margin:0;text-shadow:5px 5px 0 #ef476f;color:#262059}.menu-card h1 span{color:#ef476f;text-shadow:5px 5px 0 #262059}.menu-actions{display:grid;gap:10px;width:280px;max-width:100%;margin:22px auto 0}.menu-hint{margin:18px 0 0;font-size:18px}.nick-portrait{position:absolute;width:82px;height:116px;left:-62px;bottom:18px;filter:drop-shadow(7px 7px #0004)}.portrait-hair{position:absolute;width:54px;height:31px;left:14px;top:0;background:#38203f;clip-path:polygon(0 32%,25% 0,44% 18%,67% 0,100% 40%,88% 100%,5% 100%)}.portrait-face{position:absolute;width:50px;height:50px;left:16px;top:23px;background:#efaa77;border:5px solid var(--ink)}.portrait-face:after{content:'';position:absolute;left:9px;top:14px;width:6px;height:6px;background:var(--ink);box-shadow:24px 0 var(--ink)}.portrait-shirt{position:absolute;width:72px;height:54px;left:5px;bottom:0;background:#ef476f;border:5px solid var(--ink);clip-path:polygon(18% 0,82% 0,100% 100%,0 100%)}
#game-screen{background:#181537}#world,#minigame{display:block;width:100%;height:calc(100% - 88px);margin-top:58px;image-rendering:pixelated;background:#292557}.mini-header+#minigame{margin-top:62px;height:calc(100% - 110px)}
#hud{position:absolute;z-index:4;top:0;left:0;right:0;height:62px;background:#171432;border-bottom:5px solid #09071d;display:flex;align-items:center;justify-content:space-between;padding:7px 18px}.hud-chip{display:flex;gap:12px;align-items:center;background:#302b62;padding:7px 13px;border:3px solid #5e58a0}.hud-chip small{font:8px 'Press Start 2P';color:#aaa5df}.hud-chip strong{font:15px 'Press Start 2P';color:var(--yellow)}.hud-title{font:11px 'Press Start 2P';letter-spacing:2px}.money strong{color:#7cef86}.money-bounce{animation:moneyBounce .45s ease-out}@keyframes moneyBounce{0%,100%{transform:scale(1)}40%{transform:scale(1.25);filter:brightness(1.6)}}
#task-card{position:absolute;z-index:3;left:17px;top:79px;width:220px;padding:11px;border-width:3px;box-shadow:5px 5px #0005}.panel-title{display:flex;justify-content:space-between;font:8px 'Press Start 2P';padding-bottom:8px;border-bottom:3px solid var(--ink)}#task-list{padding-top:6px}.task-row{display:flex;gap:7px;align-items:center;font-size:17px;line-height:1.1;margin:5px 0}.task-row.done{text-decoration:line-through;color:#69916d}.task-row i{display:grid;place-items:center;width:17px;height:17px;border:2px solid var(--ink);font-style:normal;font-size:12px;background:white}.task-row.done i{background:var(--green)}
#room-label{position:absolute;top:76px;right:20px;background:#19143ad9;border:3px solid #6b64a5;padding:7px 12px;font:9px 'Press Start 2P'}.bottom-bar{height:32px;position:absolute;bottom:0;left:0;right:0;z-index:4;display:flex;justify-content:space-between;align-items:center;background:#12102a;border-top:4px solid #09071d;padding:0 12px}.icon-btn{border:0;color:#fff;background:transparent;cursor:pointer;font-size:18px}.icon-btn span{font:8px 'Press Start 2P'}.control-tip{font-size:16px;color:#aaa5df}kbd{font:9px 'Press Start 2P';padding:4px;background:var(--cream);color:var(--ink);border:2px solid var(--ink);box-shadow:2px 2px #0007}#interact-prompt{position:absolute;z-index:5;left:50%;bottom:49px;transform:translateX(-50%);background:#19143a;border:3px solid white;padding:9px 13px;display:flex;align-items:center;gap:10px;font:9px 'Press Start 2P';animation:bob .7s infinite alternate}@keyframes bob{to{transform:translate(-50%,-4px)}}
.mini-header{position:absolute;z-index:3;left:0;right:0;height:64px;display:flex;align-items:center;justify-content:space-between;background:#181536;border-bottom:5px solid #09071d;padding:7px 16px}.mini-header>div:nth-child(2){text-align:center}.mini-header small{font:8px 'Press Start 2P';color:#aaa5df}.mini-header h2{font:13px 'Press Start 2P';margin:4px}.mini-stats{display:flex;align-items:center;gap:12px;font:9px 'Press Start 2P';color:#fff}.mini-stats span{color:#ffcf63}.mini-stats b{font:19px 'Press Start 2P';color:var(--yellow)}#mini-instruction{position:absolute;bottom:0;left:0;right:0;height:48px;display:grid;place-items:center;background:#181536;border-top:5px solid #09071d;font-size:22px}
.rank-card{position:absolute;z-index:8;inset:0;display:grid;place-content:center;text-align:center;background:#19143acc;color:var(--cream)}.rank-card strong{font:38px 'Press Start 2P';color:var(--yellow);text-shadow:4px 4px var(--red)}.rank-card span{font-size:22px;margin-top:10px}.npc-bubble{max-width:360px;text-align:left}.dialogue-speaker{font:11px 'Press Start 2P';color:#9b3d53}.dialogue-line{font-size:25px;line-height:1.1;margin:12px 0}.dialogue-actions{display:flex;gap:10px;flex-wrap:wrap}
.modal{position:fixed;z-index:20;inset:0;display:grid;place-items:center;background:#0a0825cf}.modal-card{position:relative;width:min(680px,90vw);max-height:82vh;overflow:auto;padding:25px}.close-btn{position:absolute;right:10px;top:8px;border:0;background:none;color:var(--ink);font-size:38px;cursor:pointer}.modal h2{font:18px 'Press Start 2P';margin:5px 0 20px}.modal h3{font:11px 'Press Start 2P';margin:14px 0 7px}.modal p{font-size:22px}.shop-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}.shop-item{padding:12px;background:#f1ddad;border:3px solid var(--ink);text-align:center}.item-icon{height:56px;display:grid;place-items:center;font-size:37px}.shop-item b{display:block;font:9px/1.4 'Press Start 2P'}.shop-item button{margin-top:8px;font-size:8px;min-height:35px;width:100%}.shop-item.equipped{background:#c6efbd}.shop-item.sold{opacity:.72}.modal-tabs{display:flex;gap:8px;margin-bottom:12px}.stats-line{font:11px 'Press Start 2P';color:#9b3d53}.how-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.key-list{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center}
.toast{position:fixed;z-index:30;top:24px;left:50%;transform:translateX(-50%);padding:13px 20px;background:var(--yellow);color:var(--ink);border:4px solid var(--ink);box-shadow:5px 5px #0008;font:10px 'Press Start 2P';animation:toastIn .25s}@keyframes toastIn{from{transform:translate(-50%,-20px);opacity:0}}.reward-pop{position:absolute;z-index:15;right:24px;top:68px;color:#fff4cc;font:13px 'Press Start 2P';text-shadow:3px 3px #19143a;pointer-events:none;animation:rewardPop .8s ease-out forwards}@keyframes rewardPop{from{transform:translateY(8px) scale(.7);opacity:0}35%{opacity:1;transform:translateY(-6px) scale(1.1)}to{transform:translateY(-35px) scale(1);opacity:0}}.sound-choice{display:grid;gap:10px}.sound-choice button{text-align:left}.sound-choice button.active{background:var(--green)}.sound-choice small{display:block;font:18px 'VT323';margin-top:5px}.day-transition{position:fixed;z-index:40;inset:0;display:grid;place-content:center;text-align:center;background:#0e0b27}.day-transition small{font:10px 'Press Start 2P';color:#8882bc}.day-transition strong{font:40px 'Press Start 2P';color:var(--yellow);margin-top:15px}
#ending-screen{background:#44bde8;text-align:center}#ending-art{height:48%;background:linear-gradient(#42c0eb 65%,#f4df8b 65%);position:relative}.ending-card{position:absolute;left:50%;bottom:5%;transform:translateX(-50%);width:min(620px,88%);padding:24px}.ending-card h2{font:25px 'Press Start 2P';color:#ef476f;text-shadow:3px 3px #262059;margin:12px}.ending-card p{font-size:22px;margin:8px}.ending-card #ending-stats{font:10px 'Press Start 2P';margin:15px}.ending-card button{margin-top:8px}
@media(max-width:700px){#game-shell{width:100vw;height:100vh;aspect-ratio:auto}.menu-card h1{font-size:30px}.nick-portrait{display:none}.control-tip{display:none}#task-card{transform:scale(.8);transform-origin:top left}.hud-title{display:none}.how-grid{grid-template-columns:1fr}.modal-card{padding:18px}.mini-header h2{font-size:9px}}
@media(max-height:650px){.menu-card{padding:16px 28px 14px}.menu-card h1{font-size:30px}.menu-actions{gap:7px;margin-top:12px}.pixel-btn{min-height:39px;padding:7px 14px}.menu-hint{margin-top:10px}.eyebrow{margin-bottom:7px}}
