:root{font-family:Courier New,monospace;color:#f3f0dd;background:#13242b}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;background:linear-gradient(180deg,#203740,#122129)}button{font:inherit}.app-shell{min-height:100vh;display:grid;place-items:center;padding:16px}.game-column{width:min(100%,1080px);display:grid;gap:14px}.title-block{text-align:center;display:grid;gap:10px}.eyebrow{margin:0;color:#f0c266;font-size:.85rem;letter-spacing:.22em}.title-block h1{margin:0;color:#f3f0dd;font-size:clamp(1.8rem,5vw,3.6rem);line-height:1.05;text-shadow:3px 0 #18252d,0 3px #18252d}.subtitle{margin:0 auto;max-width:780px;color:#cfccb9;line-height:1.6;font-size:.96rem}.instruction-strip{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.instruction-strip span{padding:8px 12px;background:#18252d;border:3px solid #4d6b70;color:#f3f0dd;box-shadow:4px 4px #0d1a20;font-size:.82rem}.music-toggle{padding:8px 12px;background:#18252d;border:3px solid #4d6b70;color:#f3f0dd;box-shadow:4px 4px #0d1a20;font-size:.82rem;cursor:pointer}.game-frame{display:inline-block;cursor:pointer;outline:none}.game-world{position:relative;overflow:hidden;border:4px solid var(--panel-border);background:linear-gradient(180deg,var(--sky-1) 0 24%,var(--sky-2) 24% 50%,var(--sky-3) 50% 62%,var(--water-1) 62% 70%,var(--water-2) 70% 86%,var(--water-3) 86% 100%);box-shadow:0 0 0 4px #0d1a20,10px 10px #0d1a20}.pixel-sky,.water-band,.quay-strip,.ground-band,.scanlines,.skyline-strip,.treeline,.nemo-base,.nemo-building,.bridge-span,.bridge-truss,.museum-facade,.museum-ship,.harbor-pier,.steam-boat,.channel-post,.pixel-cloud,.water-tiles,.pixel-plane,.pixel-entity,.overlay,.hud-panel{position:absolute}.pixel-sky{inset:0;background:linear-gradient(180deg,transparent 0 68%,rgba(255,255,255,.12) 68% 70%,transparent 70% 100%)}.pixel-cloud{height:28px;background:#ecede4;box-shadow:28px 0 #ecede4,56px 0 #ecede4,14px -14px #ecede4,42px -14px #ecede4,70px -14px #ecede4}.pixel-cloud-a{top:84px;left:88px;width:28px}.pixel-cloud-b{top:130px;left:540px;width:28px}.pixel-plane{z-index:2}.pixel-plane-a{transform:rotate(-3deg)}.pixel-plane-b{transform:rotate(2deg);opacity:.85}.mode-banner{top:60px;left:50%;transform:translate(-50%);z-index:5;padding:6px 10px;background:#18252d;border:3px solid #4d6b70;box-shadow:4px 4px #0d1a20;color:#f3f0dd;font-size:.75rem}.skyline-strip{left:70px;right:70px;bottom:312px;height:68px;background:linear-gradient(90deg,transparent 0 24px,#5e8a95 24px 58px,transparent 58px 84px,#5e8a95 84px 110px,transparent 110px 138px,#6f98a2 138px 172px,transparent 172px 212px,#5e8a95 212px 256px,transparent 256px 308px,#6f98a2 308px 346px,transparent 346px 410px,#5e8a95 410px 448px,transparent 448px 492px,#6f98a2 492px 540px,transparent 540px 100%);opacity:.65}.treeline{left:0;right:0;bottom:248px;height:76px;background:radial-gradient(circle at 10% 60%,#5e7f47 0 24px,transparent 25px),radial-gradient(circle at 18% 52%,#6a8b52 0 28px,transparent 29px),radial-gradient(circle at 28% 58%,#5e7f47 0 26px,transparent 27px),radial-gradient(circle at 66% 56%,#5e7f47 0 26px,transparent 27px),radial-gradient(circle at 76% 50%,#6a8b52 0 30px,transparent 31px),radial-gradient(circle at 87% 58%,#5e7f47 0 24px,transparent 25px);opacity:.95}.nemo-base{left:248px;bottom:206px;width:248px;height:48px;background:linear-gradient(180deg,#965d43 0 54%,#6d412f 54% 100%);box-shadow:0 4px #41322a}.nemo-base:before{content:"";position:absolute;left:102px;bottom:0;width:42px;height:34px;background:linear-gradient(180deg,#13242b 0 72%,#3d6157 72% 100%)}.nemo-base:after{content:"";position:absolute;left:116px;top:8px;width:14px;height:18px;background:linear-gradient(180deg,#9be6dd 0 50%,#2f6675 50% 100%)}.nemo-building{bottom:254px;background:repeating-linear-gradient(90deg,#6ea79d 0 6px,#5f9087 6px 10px);box-shadow:inset -6px 0 #4d756d}.nemo-main{left:202px;width:192px;height:128px;clip-path:polygon(0 100%,16% 14%,92% 3%,92% 100%)}.nemo-main:before{content:"";position:absolute;left:44px;top:42px;width:56px;height:18px;background:linear-gradient(90deg,#24423f 0 12px,transparent 12px 18px,#24423f 18px 30px,transparent 30px 36px,#24423f 36px 48px,transparent 48px 100%)}.nemo-wing{left:360px;width:220px;height:112px;clip-path:polygon(0 100%,10% 20%,92% 14%,100% 100%)}.nemo-wing:before{content:"";position:absolute;left:78px;top:34px;width:58px;height:20px;background:linear-gradient(90deg,#24423f 0 10px,transparent 10px 18px,#24423f 18px 28px,transparent 28px 36px,#24423f 36px 46px,transparent 46px 100%)}.bridge-span{left:505px;bottom:202px;width:186px;height:58px;border-top:6px solid #d8ddd8;border-left:6px solid #d8ddd8;border-right:6px solid #d8ddd8;border-radius:100px 100px 0 0}.bridge-truss{left:514px;bottom:202px;width:170px;height:48px;background:linear-gradient(90deg,transparent 0 8px,#d8ddd8 8px 12px,transparent 12px 24px,#d8ddd8 24px 28px,transparent 28px 40px,#d8ddd8 40px 44px,transparent 44px 56px,#d8ddd8 56px 60px,transparent 60px 72px,#d8ddd8 72px 76px,transparent 76px 88px,#d8ddd8 88px 92px,transparent 92px 104px,#d8ddd8 104px 108px,transparent 108px 120px,#d8ddd8 120px 124px,transparent 124px 136px,#d8ddd8 136px 140px,transparent 140px 152px,#d8ddd8 152px 156px,transparent 156px 100%);clip-path:polygon(0 100%,0 56%,16% 28%,34% 12%,50% 6%,66% 14%,84% 32%,100% 60%,100% 100%)}.bridge-truss:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0 12%,#bcc4bf 12% 15%,transparent 15% 24%,#bcc4bf 24% 27%,transparent 27% 36%,#bcc4bf 36% 39%,transparent 39% 48%,#bcc4bf 48% 51%,transparent 51% 60%,#bcc4bf 60% 63%,transparent 63% 72%,#bcc4bf 72% 75%,transparent 75% 84%,#bcc4bf 84% 87%,transparent 87% 100%)}.museum-facade{left:666px;bottom:208px;width:170px;height:102px;background:linear-gradient(180deg,#ede6d9 0 82%,#d4cab7 82% 100%);box-shadow:inset 0 -6px #b9ad95}.museum-facade:before{content:"";position:absolute;inset:16px 16px 12px;background:linear-gradient(90deg,#ede6d9 0 18px,#6b7b83 18px 26px,#ede6d9 26px 42px,#6b7b83 42px 50px,#ede6d9 50px 66px,#6b7b83 66px 74px,#ede6d9 74px 90px,#6b7b83 90px 98px,#ede6d9 98px 114px,#6b7b83 114px 122px,#ede6d9 122px 100%),linear-gradient(180deg,transparent 0 12px,#6b7b83 12px 20px,transparent 20px 34px,#6b7b83 34px 42px,transparent 42px 56px,#6b7b83 56px 64px,transparent 64px 100%)}.museum-facade:after{content:"";position:absolute;left:72px;bottom:0;width:26px;height:32px;background:linear-gradient(180deg,#d8d0c1 0 18px,#475962 18px 100%)}.museum-ship{left:596px;bottom:202px;width:92px;height:128px}.museum-ship:before{content:"";position:absolute;left:10px;right:10px;bottom:0;height:24px;background:linear-gradient(180deg,#7b4b38 0 56%,#4f2d21 56% 100%);clip-path:polygon(8% 0,100% 0,82% 100%,0 100%)}.museum-ship:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0 14px,#39271f 14px 17px,transparent 17px 34px,#39271f 34px 37px,transparent 37px 58px,#39271f 58px 61px,transparent 61px 100%),linear-gradient(180deg,transparent 0 18px,#efe7d5 18px 20px,transparent 20px 44px,#efe7d5 44px 46px,transparent 46px 100%)}.harbor-pier{left:0;right:0;bottom:170px;height:18px;background:linear-gradient(90deg,transparent 0 84px,#c3b48f 84px 318px,transparent 318px 100%)}.harbor-pier:before{content:"";position:absolute;left:106px;bottom:-34px;width:188px;height:34px;background:repeating-linear-gradient(90deg,#4d5961 0 6px,transparent 6px 34px)}.steam-boat{right:82px;bottom:122px;width:116px;height:96px}.steam-boat:before{content:"";position:absolute;left:12px;right:10px;bottom:18px;height:34px;background:linear-gradient(180deg,#c9c0a1 0 22%,#7b4b38 22% 72%,#4f2d21 72% 100%);clip-path:polygon(10% 0,100% 0,82% 100%,0 100%)}.steam-boat:after{content:"";position:absolute;left:56px;bottom:46px;width:18px;height:40px;background:linear-gradient(180deg,#3b312f 0 20%,#5a4d47 20% 100%);box-shadow:-18px 10px 0 -4px #6b5848,0 -10px 0 -6px #d8d0c1}.channel-post{bottom:130px;width:14px;height:66px;background:linear-gradient(180deg,#2a3640 0 22px,#e3e7e6 22px 38px,#2a3640 38px 100%)}.channel-post-a{left:94px}.channel-post-b{left:742px}.water-band{left:0;right:0;bottom:96px;height:208px}.underwater-wash,.underwater-light,.bubble,.sea-column,.underwater-cityline,.sea-floor,.sea-floor-ridge,.sea-columns{position:absolute}.underwater-wash{inset:0;background:linear-gradient(180deg,var(--water-1) 0 18%,#3b7c88 18% 42%,var(--underwater-mid, #255665) 42% 74%,var(--underwater-bottom, #173944) 74% 100%)}.underwater-light{inset:0;background:radial-gradient(circle at 50% -4%,rgba(214,242,247,.34) 0 18%,transparent 19%),linear-gradient(180deg,rgba(207,233,239,.12),transparent 30%)}.bubble{border-radius:50%;border:2px solid rgba(207,233,239,.45);background:#cfe9ef14}.bubble-a{width:18px;height:18px;left:140px;top:92px}.bubble-b{width:12px;height:12px;right:220px;top:170px}.bubble-c{width:22px;height:22px;left:720px;top:126px}.sea-column{inset:0 0 84px;background:repeating-linear-gradient(90deg,transparent 0 80px,rgba(207,233,239,.05) 80px 96px,transparent 96px 160px)}.underwater-cityline{left:78px;right:88px;bottom:132px;height:144px;opacity:.24;background:linear-gradient(90deg,transparent 0 36px,#8fb4b8 36px 72px,transparent 72px 118px,#8fb4b8 118px 168px,transparent 168px 214px,#8fb4b8 214px 284px,transparent 284px 330px,#8fb4b8 330px 388px,transparent 388px 456px,#8fb4b8 456px 514px,transparent 514px 100%)}.sea-floor{left:0;right:0;bottom:0;height:92px;background:linear-gradient(180deg,#b5aa7d 0 30%,#857a57 30% 100%)}.sea-floor:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 26px,rgba(0,0,0,.08) 26px 30px,transparent 30px 60px)}.sea-floor-ridge{bottom:72px;height:18px;background:#6e684c}.ridge-a{left:70px;width:180px}.ridge-b{right:140px;width:210px}.sea-columns{bottom:92px;width:40px;background:#547784}.columns-a{left:180px;height:92px}.columns-b{right:230px;height:76px}.water-tiles{left:0;right:-64px;bottom:110px;height:120px;background:linear-gradient(180deg,transparent 0 12px,rgba(255,255,255,.12) 12px 16px,transparent 16px 28px,rgba(255,255,255,.08) 28px 32px,transparent 32px 100%),repeating-linear-gradient(90deg,transparent 0 14px,rgba(255,255,255,.08) 14px 20px,transparent 20px 38px);opacity:.9}.quay-strip{left:0;right:0;bottom:96px;height:12px;background:linear-gradient(180deg,#c3b48f 0 50%,#928362 50% 100%)}.ground-band{left:0;right:0;bottom:0;height:96px;background:linear-gradient(180deg,var(--ground-1) 0 38%,var(--ground-2) 38% 100%)}.ground-band:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 18px,rgba(0,0,0,.08) 18px 22px,transparent 22px 46px)}.scanlines{inset:0;pointer-events:none;background:repeating-linear-gradient(180deg,transparent 0 4px,rgba(8,16,22,.08) 4px 8px);opacity:.85}.pixel-entity{z-index:3;transform-origin:center}.scene-coot{filter:drop-shadow(4px 4px 0 #0d1a20)}.coot-explosion{z-index:6;pointer-events:none;animation:explosion-burst .42s steps(4,end) forwards}.pixel-svg,.scene-svg{display:block;width:100%;height:100%;image-rendering:pixelated}.hud-panel{top:18px;display:flex;gap:12px;padding:10px 12px;background:var(--panel-bg);border:3px solid var(--panel-border);box-shadow:4px 4px #0d1a20;z-index:5}.hud-left{left:18px}.hud-right{right:18px}.hud-item{display:grid;gap:4px}.hud-label{color:var(--text-dim);font-size:.75rem;letter-spacing:.12em}.hud-item strong{color:var(--text-main);font-size:1.2rem}.overlay{inset:0;z-index:8;display:grid;place-items:center;background:#070e127a}.overlay-card{width:min(90%,520px);padding:20px;background:#18252d;border:4px solid #4d6b70;box-shadow:0 0 0 4px #0d1a20,10px 10px #0d1a20;text-align:center}.panel-header{display:inline-block;margin-bottom:16px;padding:6px 10px;color:#18252d;background:#f0c266}.panel-header.danger{background:#dd6b59;color:#f3f0dd}.overlay-card h2{margin:0 0 12px;color:#f3f0dd;font-size:clamp(1.2rem,4vw,2.3rem)}.overlay-card p{margin:0;color:#cfccb9;line-height:1.7}.overlay-button{margin-top:18px;padding:12px 18px;border:3px solid #8d6c2e;background:#f0c266;color:#18252d;cursor:pointer;box-shadow:4px 4px #8d6c2e}.result-grid{margin-top:18px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.result-grid div{padding:12px 10px;background:#22333d;border:3px solid #4d6b70}.result-grid span{display:block;color:#cfccb9;font-size:.75rem;margin-bottom:8px}.result-grid strong{color:#f3f0dd;font-size:1.2rem}@media(max-width:720px){.app-shell{padding:10px}.instruction-strip{gap:6px}.instruction-strip span{font-size:.7rem}.hud-panel{top:10px;gap:8px;padding:8px 10px}.mode-banner{top:52px}.hud-left{left:10px}.hud-right{right:10px}.result-grid{grid-template-columns:1fr}}@keyframes explosion-burst{0%{opacity:1;transform:scale(.45)}70%{opacity:1;transform:scale(1.12)}to{opacity:0;transform:scale(1.28)}}