:root{--ink:#071326;--deep:#0a2851;--ocean:#075b85;--foam:#d9f7e8;--sun:#ffd15c;--coral:#ff654f;--mint:#55e0aa;--cream:#fff8d7;--panel:#051730db;--line:#d9f7e852;--app-height:100dvh}*{box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden}body{color:var(--cream);background:linear-gradient(#071326eb,#071326fa),repeating-linear-gradient(0deg,#0000 0 7px,#ffffff0a 7px 8px),#071326;margin:0;font-family:Silkscreen,monospace;overflow-x:hidden}body:before{content:"";pointer-events:none;opacity:.12;background-image:linear-gradient(90deg,#0000 50%,#ffffff14 50%),linear-gradient(#0000 50%,#00000024 50%);background-size:4px 4px;position:fixed;inset:0}button{font:inherit}.shell{width:min(1440px,100%);height:var(--app-height);grid-template-rows:auto minmax(0,1fr) auto;gap:18px;min-width:0;margin:0 auto;padding:28px clamp(18px,3vw,48px) 22px;display:grid}.masthead{justify-content:space-between;align-items:flex-end;min-width:0;display:flex}.brand-lockup{align-items:flex-end;gap:18px;min-width:0;display:flex}.mini-label{color:var(--mint);letter-spacing:.12em;writing-mode:vertical-rl;font-size:clamp(8px,.9vw,11px);transform:rotate(180deg)}h1{color:var(--cream);letter-spacing:.025em;text-shadow:5px 5px 0 var(--ocean);margin:0;font-family:"Micro 5",monospace;font-size:clamp(62px,8vw,108px);font-weight:400;line-height:.62}.day-box{border:3px solid var(--foam);background:var(--deep);min-width:112px;box-shadow:6px 6px 0 var(--coral);align-items:center;display:flex}.day-box span,.day-box strong{padding:9px 11px}.day-box span{color:var(--deep);background:var(--foam);font-size:10px}.day-box strong{font-size:15px}.header-controls{align-items:center;gap:14px;display:flex}.github-link{width:42px;height:42px;color:var(--cream);border:3px solid var(--foam);background:var(--deep);box-shadow:5px 5px 0 var(--coral);place-items:center;display:grid}.github-link svg{fill:currentColor;width:23px}.github-link:hover,.github-link:focus-visible{color:var(--ink);background:var(--mint);outline:none}.sound-toggle{color:var(--cream);border:3px solid var(--foam);background:var(--deep);box-shadow:5px 5px 0 var(--coral);cursor:pointer;padding:10px 12px;font-size:9px}.sound-toggle:hover,.sound-toggle:focus-visible{color:var(--ink);background:var(--mint);outline:none}.sound-toggle[aria-pressed=false]{color:var(--ink);background:var(--coral)}.costume-button{z-index:6;min-height:42px;color:var(--ink);border:3px solid var(--ink);background:var(--sun);box-shadow:5px 5px 0 var(--ink);cursor:pointer;align-items:center;gap:7px;padding:7px 10px;font-size:8px;display:flex;position:absolute;top:18px;right:22px}.costume-button svg{fill:currentColor;width:25px;height:23px}.costume-button:hover,.costume-button:focus-visible,.costume-button[aria-expanded=true]{color:var(--ink);background:var(--mint);outline:none}.costume-button:active{box-shadow:1px 1px 0 var(--ink);transform:translate(4px,4px)}.costume-panel{z-index:7;width:278px;color:var(--cream);border:3px solid var(--foam);box-shadow:7px 7px 0 var(--ink);background:#051730f5;padding:12px;position:absolute;top:74px;right:22px}.costume-panel[hidden]{display:none}.closet-heading{color:var(--sun);justify-content:space-between;align-items:center;margin-bottom:11px;font-size:10px;display:flex}.closet-heading button{width:27px;height:27px;color:var(--cream);border:2px solid var(--foam);background:var(--deep);cursor:pointer;padding:0;font-size:18px;line-height:1}.closet-heading button:hover,.closet-heading button:focus-visible{color:var(--ink);background:var(--coral);outline:none}.costume-panel fieldset{border:2px solid var(--line);min-width:0;margin:0;padding:8px}.costume-panel fieldset+fieldset{margin-top:10px}.costume-panel legend{color:var(--mint);padding:0 6px;font-size:8px}.costume-options{gap:5px;display:grid}.coat-options{grid-template-columns:repeat(3,minmax(0,1fr))}.hat-options{grid-template-columns:repeat(2,minmax(0,1fr))}.costume-option{min-width:0;min-height:32px;color:var(--cream);border:2px solid var(--line);background:var(--deep);cursor:pointer;padding:5px;font-size:6px;line-height:1.35}.costume-option:hover,.costume-option:focus-visible{border-color:var(--mint);outline:none}.costume-option[aria-checked=true]{color:var(--ink);border-color:var(--ink);background:var(--sun);box-shadow:3px 3px 0 var(--coral)}.costume-option i{border:2px solid var(--cream);width:12px;height:12px;margin:0 auto 4px;display:block}.brown-swatch{background:#6c4637}.gray-swatch{background:#737d79}.white-swatch{background:#d9d2c0}.game-frame{border:4px solid var(--cream);background:var(--coral);min-width:0;min-height:0;padding:8px;box-shadow:10px 10px #0006}.scene-wrap{border:4px solid var(--ink);isolation:isolate;background:#75cee0;width:100%;min-width:0;height:100%;min-height:0;position:relative;overflow:hidden}#ocean-canvas{width:100%;height:100%;image-rendering:pixelated;cursor:grab;position:absolute;inset:0}#ocean-canvas:active{cursor:grabbing}.scanlines{pointer-events:none;z-index:2;opacity:.12;background:repeating-linear-gradient(0deg,#0000 0 3px,#071326 3px 4px);position:absolute;inset:0}.sun-label{z-index:3;color:var(--ink);border:2px solid var(--ink);background:var(--sun);box-shadow:4px 4px 0 var(--ink);letter-spacing:.1em;padding:6px 10px;font-size:9px;position:absolute;top:18px;left:50%;transform:translate(-50%)}.stats-panel,.actions-panel{z-index:4;border:3px solid var(--foam);background:var(--panel);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);width:190px;padding:16px;position:absolute;top:50%;box-shadow:7px 7px #071326b3}.stats-panel{left:22px;transform:translateY(-50%)}.actions-panel{right:22px;transform:translateY(-50%)}.stat+.stat{margin-top:18px}.stat-heading{justify-content:space-between;align-items:center;margin-bottom:7px;font-size:10px;display:flex}.stat-heading strong{color:var(--sun);font-size:11px}.meter{border:2px solid var(--ink);background:var(--cream);height:16px;box-shadow:3px 3px 0 var(--ink);padding:2px}.meter i{background:repeating-linear-gradient(90deg, transparent 0 10px, #0713264d 10px 12px), var(--mint);width:50%;height:100%;transition:width .35s steps(8,end),background-color .2s;display:block}.panel-title{width:max-content;color:var(--ink);border:2px solid var(--ink);background:var(--sun);box-shadow:3px 3px 0 var(--ink);margin:-28px auto 12px;padding:5px 9px;font-size:10px;display:block}.action-button{width:100%;min-height:50px;color:var(--cream);border:2px solid var(--foam);background:var(--deep);text-align:left;cursor:pointer;box-shadow:4px 4px 0 var(--ink);align-items:center;gap:10px;padding:8px;font-size:9px;line-height:1.4;transition:transform 80ms steps(2,end),color 80ms,background 80ms;display:flex}.action-button+.action-button{margin-top:8px}.action-button[aria-pressed=true]{color:var(--ink);border-color:var(--sun);background:var(--sun)}.action-button[aria-pressed=true] svg{fill:var(--ink)}.action-button svg{width:29px;min-width:29px;fill:var(--sun);image-rendering:pixelated}.action-button:hover,.action-button:focus-visible{color:var(--ink);background:var(--mint);outline:none}.action-button:hover svg,.action-button:focus-visible svg{fill:var(--ink)}.action-button:active{box-shadow:0 0 0 var(--ink);transform:translate(4px,4px)}.action-button:disabled{opacity:.5;cursor:wait}.speech{z-index:4;width:min(390px,40%);color:var(--ink);border:3px solid var(--ink);background:var(--cream);box-shadow:6px 6px 0 var(--ink);text-align:center;padding:14px 17px;font-size:10px;line-height:1.5;position:absolute;bottom:40px;left:50%;transform:translate(-50%)}.speech:before{content:"";border-top:3px solid var(--ink);border-left:3px solid var(--ink);background:var(--cream);width:20px;height:20px;position:absolute;top:-15px;left:50%;transform:translate(-50%)rotate(45deg)}.weight-tag{z-index:4;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);font-size:9px;display:flex;position:absolute;bottom:22px;left:22px}.weight-tag span,.weight-tag strong{padding:7px 9px}.weight-tag span{color:var(--ink);background:var(--mint)}.weight-tag strong{color:var(--cream);background:var(--deep)}.achievement{z-index:8;width:min(440px,100% - 40px);color:var(--ink);border:5px solid var(--ink);background:var(--sun);box-shadow:12px 12px 0 var(--coral), 18px 18px 0 var(--ink);text-align:center;visibility:hidden;opacity:0;pointer-events:none;padding:24px;transition:transform .24s steps(4,end),opacity 50ms;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(0)}.achievement.visible{visibility:visible;opacity:1;transform:translate(-50%,-50%)scale(1)}.achievement span,.achievement small{font-size:9px;display:block}.achievement strong{color:var(--coral);text-shadow:4px 4px 0 var(--ink);margin:8px 0;font-family:"Micro 5",monospace;font-size:clamp(58px,8vw,86px);font-weight:400;line-height:.75;display:block}.confetti-layer{z-index:9;pointer-events:none;position:absolute;inset:0;overflow:hidden}.confetti{top:-20px;left:var(--x);width:var(--size);height:var(--height);background:var(--color);animation:confetti-fall var(--duration) steps(30) var(--delay) forwards;display:block;position:absolute;box-shadow:2px 2px #07132661}@keyframes confetti-fall{0%{opacity:1;transform:translateY(-8vh)rotate(0)}38%{transform:translate3d(var(--sway), 42vh, 0) rotate(var(--turn-mid))}72%{transform:translate3d(var(--sway-back), 78vh, 0) rotate(var(--turn-late))}to{opacity:0;transform:translate3d(var(--sway), 112vh, 0) rotate(var(--turn))}}.heart-layer{z-index:7;pointer-events:none;position:absolute;inset:0;overflow:hidden}.heart{color:var(--coral);text-shadow:3px 3px 0 var(--ink);font-size:34px;animation:1.2s steps(6,end) forwards float-heart;position:absolute;top:48%;left:50%}@keyframes float-heart{0%{opacity:0;transform:translateY(10px)scale(.4)}15%{opacity:1}to{opacity:0;transform:translate(var(--drift), -150px) scale(1.2)}}.footer-strip{letter-spacing:.05em;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;font-size:9px;display:grid}.footer-strip p{margin:0}.footer-strip p:nth-child(2){color:var(--mint);text-align:center}.footer-strip p:last-child{text-align:right}.live-dot{background:var(--coral);width:8px;height:8px;box-shadow:0 0 0 2px var(--ink), 0 0 0 3px var(--coral);margin-right:6px;animation:1.4s steps(2,end) infinite blink;display:inline-block}@keyframes blink{50%{opacity:.3}}@media (width<=860px){.shell{gap:10px;padding:14px 12px 10px}.scene-wrap{height:100%;min-height:0}.stats-panel,.actions-panel{width:calc(50% - 30px);top:auto;bottom:84px;transform:none}.stats-panel{left:16px}.actions-panel{right:16px}.speech{width:min(360px,100% - 130px);top:38px;bottom:auto}.weight-tag{bottom:18px;left:16px}}.mobile-layout .shell{padding:max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));grid-template-rows:auto minmax(0,1fr);gap:8px}.mobile-layout .game-frame,.mobile-layout .scene-wrap{min-height:0}.mobile-layout .footer-strip{display:none}@media (width<=570px){.shell{padding:max(6px, env(safe-area-inset-top)) max(6px, env(safe-area-inset-right)) max(6px, env(safe-area-inset-bottom)) max(6px, env(safe-area-inset-left));grid-template-rows:auto minmax(0,1fr);gap:6px}.masthead{align-items:center}h1{text-shadow:3px 3px 0 var(--ocean);font-size:clamp(34px,11vw,42px)}.mini-label{display:none}.day-box{min-width:auto}.day-box span{display:none}.day-box strong{padding:7px;font-size:11px}.header-controls{gap:5px}.sound-toggle{height:30px;box-shadow:2px 2px 0 var(--coral);border-width:2px;padding:5px 6px;font-size:6px}.github-link{width:30px;height:30px;box-shadow:2px 2px 0 var(--coral);border-width:2px}.github-link svg{width:16px}.scene-wrap{height:100%;min-height:0}.stats-panel{width:auto;min-width:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border:0;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;padding:0;display:grid;inset:8px 8px auto;transform:none}.stat{border:2px solid var(--foam);min-width:0;box-shadow:3px 3px 0 var(--ink);background:#051730e6;padding:6px}.stat+.stat{margin-top:0}.stat-heading{letter-spacing:.04em;margin-bottom:4px;font-size:6px}.stat-heading strong{font-size:7px}.meter{height:8px;box-shadow:2px 2px 0 var(--ink);border-width:1px;padding:1px}.meter i{background:repeating-linear-gradient(90deg, transparent 0 6px, #07132659 6px 7px), var(--mint)}.actions-panel{width:auto;min-width:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border:0;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;padding:0;display:grid;inset:auto 8px 8px;transform:none}.panel-title{display:none}.action-button{text-align:center;min-width:0;min-height:46px;box-shadow:3px 3px 0 var(--ink);border-width:2px;flex-direction:column;justify-content:center;gap:2px;padding:5px 3px;font-size:5.5px;line-height:1}.action-button+.action-button{margin-top:0}.action-button svg{width:20px;min-width:20px;height:17px}.action-button:first-of-type{border-color:var(--sun)}.action-button:nth-of-type(2){border-color:var(--coral)}.action-button:nth-of-type(3){color:var(--ink);border-color:var(--mint);background:var(--mint)}.action-button:nth-of-type(3) svg{fill:var(--ink)}.action-button:nth-of-type(4){border-color:#75cee0}.action-button:nth-of-type(5){border-color:var(--sun)}.costume-button{width:38px;min-height:34px;box-shadow:3px 3px 0 var(--ink);border-width:2px;justify-content:center;padding:4px;top:68px;right:8px}.costume-button svg{width:22px;height:20px}.costume-button span{display:none}.costume-panel{width:min(300px,100% - 16px);max-height:calc(100% - 174px);box-shadow:4px 4px 0 var(--ink);border-width:2px;padding:9px;top:108px;right:8px;overflow-y:auto}.costume-panel fieldset{padding:6px}.costume-option{min-height:30px;font-size:5.5px}.speech{width:min(220px,100% - 150px);box-shadow:3px 3px 0 var(--ink);border-width:2px;padding:8px 10px;font-size:7px;line-height:1.35;top:70px}.speech:before{border-width:2px 0 0 2px;width:12px;height:12px;top:-9px}.sun-label,.footer-strip{display:none}.weight-tag{box-shadow:2px 2px 0 var(--ink);font-size:6px;top:69px;bottom:auto;left:8px}.weight-tag span,.weight-tag strong{padding:5px 6px}.game-frame{border-width:3px;padding:4px;box-shadow:5px 5px #0006}.scene-wrap{border-width:3px}.achievement{width:calc(100% - 28px);box-shadow:6px 6px 0 var(--coral), 10px 10px 0 var(--ink);border-width:3px;padding:16px 10px}.achievement strong{font-size:54px}.achievement span,.achievement small{font-size:7px}}@media (width<=570px) and (height<=650px){.speech{top:64px}.weight-tag{top:63px}.action-button{min-height:42px}.action-button svg{width:18px;min-width:18px;height:15px}}@media (height<=560px) and (width<=1024px){.shell{padding:max(4px, env(safe-area-inset-top)) max(6px, env(safe-area-inset-right)) max(4px, env(safe-area-inset-bottom)) max(6px, env(safe-area-inset-left));gap:4px}.masthead{align-items:center}h1{font-size:42px}.mini-label,.sun-label,.footer-strip{display:none}.header-controls{gap:6px}.github-link{width:32px;height:32px;box-shadow:3px 3px 0 var(--coral);border-width:2px}.github-link svg{width:18px}.sound-toggle{box-shadow:3px 3px 0 var(--coral);border-width:2px;padding:7px 6px;font-size:7px}.day-box{min-width:auto;box-shadow:3px 3px 0 var(--coral);border-width:2px}.day-box span,.day-box strong{padding:7px}.stats-panel,.actions-panel{width:150px;padding:10px;top:50%;bottom:auto;transform:translateY(-50%)}.stats-panel{left:8px;right:auto}.actions-panel{left:auto;right:8px}.stat+.stat{margin-top:8px}.stat-heading{margin-bottom:4px;font-size:8px}.meter{height:12px}.panel-title{margin:-20px auto 6px;font-size:8px}.action-button{gap:6px;min-height:42px;padding:5px;font-size:7px}.action-button+.action-button{margin-top:6px}.action-button svg{width:23px;min-width:23px}.speech{width:min(280px,100% - 328px);min-width:180px;padding:8px 10px;font-size:7px;top:8px;bottom:auto}.weight-tag{top:auto;bottom:8px;left:50%;transform:translate(-50%)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}