:root{color-scheme:light;--paper:#f5f4ed;--ink:#182d32;--muted:#687677;--coral:#f27659;--line:#d4d8ce;--mono:"Courier New",monospace;--sans:"Arial",sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:30px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;cursor:pointer}
button:disabled{cursor:default;opacity:.35}
button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid var(--coral);outline-offset:5px}
a{color:inherit;text-decoration:none}
.page-shell{max-width:1392px;margin:auto;padding:0 60px}
.site-header{height:104px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:9px;font-size:19px;letter-spacing:-.7px;font-weight:900}
.brand img{width:61px;height:39px;image-rendering:pixelated;object-fit:contain}
.brand-dot{font-size:9px;vertical-align:super;margin-left:3px}
.header-note,.instructions-link,.eyebrow,.edition,.free-label,.arcade-bar,.controls-bar,.character-tag,.game-eyebrow,.start-hint,.modal-hint,.stage-coordinates,.step-number,footer,.game-hud,.result-scores>div>span{font-family:var(--mono)}
.header-note{font-size:10px;letter-spacing:1.3px;display:flex;align-items:center;gap:10px}
.status-dot,.live-indicator{display:inline-block;width:7px;height:7px;background:#6c9b7c;border-radius:50%}
.instructions-link{font-size:11px;font-weight:bold}.instructions-link span{margin-left:12px;font-size:18px}
.intro{display:flex;justify-content:space-between;align-items:center;padding:48px 0 44px;gap:40px}
.eyebrow{font-size:10px;letter-spacing:1.7px;font-weight:bold;margin:0 0 20px;display:block}
.tiny-wave{font-size:24px;line-height:0;vertical-align:-3px;margin-right:10px;color:#528b80}
h1{font-size:clamp(48px,5.5vw,76px);font-weight:800;letter-spacing:-4.1px;line-height:1.02;margin:0;position:relative}
h1>span{color:var(--coral)}
.title-spark{height:33px;width:33px;stroke:var(--coral);stroke-width:2;position:absolute;right:-47px;bottom:49px}
.intro-side{padding-top:22px;padding-right:40px}
.edition{font-size:10px;letter-spacing:1.5px;color:#75817e}
.intro-side p{font-size:16px;line-height:1.65;margin:18px 0;color:#506265}
.free-label{font-size:10px;letter-spacing:.1px}.free-label>span{color:var(--coral);font-size:16px;margin-right:6px}
.arcade{border:1.5px solid var(--ink);border-radius:12px;overflow:hidden;background:var(--paper);box-shadow:0 5px 0 #243d3410}
.arcade-bar{height:51px;padding:0 23px;display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:1.3px;border-bottom:1.5px solid var(--ink)}
.arcade-name{display:flex;align-items:center;gap:10px;font-weight:bold}.live-indicator{width:6px;height:6px;background:var(--coral)}.version{color:#85918c;font-weight:normal;letter-spacing:0;margin-left:4px}
.personal-best{display:flex;align-items:center;gap:9px;font-size:9px;letter-spacing:1px}.personal-best svg{width:16px;height:16px;fill:none;stroke:var(--ink);stroke-width:1.6}.personal-best strong{font-size:16px;margin-left:5px;letter-spacing:0}
.game-stage{height:470px;position:relative;overflow:hidden;background:#083f4e;isolation:isolate}
#game-canvas{width:100%;height:100%;display:block;touch-action:none;outline-offset:-5px;image-rendering:pixelated}
.game-hud{position:absolute;inset:22px 26px auto;display:flex;justify-content:space-between;align-items:start;color:#d6e9d6;pointer-events:none;font-size:9px;letter-spacing:1.4px;opacity:.8}
.hud-score{position:absolute;left:50%;transform:translateX(-50%);font-size:35px;line-height:1;font-weight:bold;color:#edf4d9;letter-spacing:0;text-shadow:3px 3px #082e3d}
.hud-lives{text-align:right;font-size:8px;line-height:1.5;letter-spacing:1.1px}
.start-screen{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:66px;color:#fff7de;padding:30px 42px 39px;pointer-events:none}
.start-copy{position:relative;pointer-events:auto;min-width:275px}
.game-eyebrow{font-size:8px;letter-spacing:2px;color:#baded3;display:block;margin-bottom:15px}
.start-copy h2{font-family:var(--mono);font-size:63px;line-height:.91;letter-spacing:-3px;margin:0 0 17px;position:relative;width:max-content;font-weight:900;text-shadow:4px 4px #052e3c}
.start-copy h2>span:first-of-type{color:#edacb8}
.pixel-star{position:absolute;font-size:28px;right:-39px;top:17px;color:#f6d283;text-shadow:none}
.start-copy p{font-size:12px;line-height:1.7;color:#c0d6ce;margin:0 0 20px}
.play-button{background:#f4ce81;border:0;box-shadow:4px 4px 0 #052e3c;border-radius:2px;color:#193f43;min-height:45px;min-width:204px;padding:12px 19px;font:bold 12px var(--mono);letter-spacing:1px;display:flex;align-items:center;justify-content:center;gap:17px;transition:background .15s,transform .15s,box-shadow .15s}
.play-button:hover{background:#ffe6a2;transform:translate(-1px,-1px);box-shadow:5px 5px 0 #052e3c}.play-button:active{transform:translate(2px,2px);box-shadow:2px 2px 0 #052e3c}
.start-hint{display:block;margin-top:14px;font-size:9px;color:#a8c9c5;letter-spacing:.3px}.start-hint kbd{font:inherit;color:#e7e7c9;border-bottom:1px solid #90b4ae;padding-bottom:2px}
.character-intro{position:relative;width:360px;transform:translateY(7px)}
.character-intro img{width:100%;height:auto;image-rendering:pixelated;filter:drop-shadow(7px 9px 0 #042f3d66);animation:shark-float 3.3s ease-in-out infinite}
.character-spark{position:absolute;color:#e9b8d3;z-index:1;font:32px var(--mono)}.spark-one{right:40px;top:-5px}.spark-two{left:80px;bottom:35px;font-size:24px;color:#e8d99e}
.character-tag{display:block;text-align:right;color:#8ab4b5;font-size:8px;letter-spacing:1.8px;margin:7px 17px 0 0}
.stage-coordinates{position:absolute;bottom:14px;left:24px;color:#99bbb4;opacity:.65;font-size:7px;letter-spacing:1.3px;pointer-events:none}
.controls-bar{height:59px;display:flex;justify-content:space-between;align-items:center;padding:0 21px;border-top:1.5px solid var(--ink);gap:15px;font-size:9px;color:#74817c}
.control-tip{display:flex;align-items:center;gap:8px;color:#657772;white-space:nowrap}.control-tip kbd{font:9px var(--mono);border:1px solid #b8c3b9;padding:5px 7px;border-radius:3px;color:#2d4d4b;box-shadow:0 2px 0 #d2d8ce}.tap-icon{font-size:19px;color:#4d6963}.center-tip{font-size:9px;letter-spacing:.1px}
.game-tools{display:flex;gap:7px}.tool-button{display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid transparent;border-radius:4px;width:33px;height:33px;color:#4d6963}.tool-button:hover:not(:disabled){border-color:#b9c8bd;background:#e6eadf}.tool-button[aria-pressed="true"]{background:#e4e9dc}.tool-button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tool-button[hidden]{display:none}
.how-to{display:grid;grid-template-columns:1.22fr 1fr 1fr 1fr;gap:37px;padding:44px 0 45px}
.how-heading .eyebrow{font-size:8px;margin-bottom:12px;letter-spacing:1.3px;color:#7b8781}.how-heading h2{font-size:23px;letter-spacing:-.8px;margin:0 0 11px}.how-heading h2 em{font-family:Georgia,serif;color:#b86349;font-weight:normal}.how-heading p{font-size:11px;color:#7b8580;line-height:1.6;margin:0}
.instruction{position:relative;border-left:1px solid var(--line);padding:4px 0 0 24px}.step-number{font-size:10px;color:#bd6c55;display:block;margin-bottom:13px}.instruction h3{font-size:13px;margin:0 0 9px}.instruction p{font-size:11px;line-height:1.8;color:#76827e;margin:0;max-width:190px}
footer{border-top:1px solid var(--line);min-height:75px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#8a948b;font-size:8px;letter-spacing:.3px}.footer-brand{font-size:7px;font-weight:bold;letter-spacing:.8px;color:#526c62}.footer-brand>span{color:var(--coral);margin:0 8px}footer>a{font-size:7px;letter-spacing:1px;color:#526c62}
.modal-screen{position:absolute;inset:0;display:grid;place-items:center;background:#062f40aa;backdrop-filter:blur(4px);padding:20px;color:#fff3d9}.modal-screen[hidden],.start-screen[hidden]{display:none}.game-modal{text-align:center;max-width:420px;width:100%;padding:30px;background:#0a4652;border:1px solid #77a699;box-shadow:8px 8px #042a35;border-radius:4px}.game-modal .game-eyebrow{margin-bottom:15px;color:#f5ce81}.game-modal h2{font-size:31px;letter-spacing:-1px;margin:0 0 10px}.game-modal p{font-size:12px;line-height:1.7;color:#b8d3cd;margin:0 0 22px}.game-modal .play-button{margin:0 auto}.modal-hint{font-size:9px;display:block;margin-top:17px;color:#9fbfb8}.result-scores{display:flex;justify-content:center;gap:44px;margin:0 0 23px}.result-scores>div>span{display:block;font-size:9px;letter-spacing:1px;color:#b8d3cd}.result-scores strong{display:block;font:900 43px var(--mono);margin-top:4px;color:#f7d489}.screen-reader-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.arcade:fullscreen{border:0;border-radius:0;width:100%;height:100%;display:flex;flex-direction:column}.arcade:fullscreen .game-stage{flex:1;height:auto}.arcade:fullscreen .arcade-bar,.arcade:fullscreen .controls-bar{flex-shrink:0}
@keyframes shark-float{0%,100%{transform:translateY(-5px) rotate(-2deg)}50%{transform:translateY(7px) rotate(1deg)}}
@media(min-width:1600px){.page-shell{padding:0 70px}.intro{padding:54px 0 48px}.game-stage{height:510px}}
@media(max-width:1050px){.page-shell{padding:0 32px}.intro-side{padding-right:0}h1{font-size:62px}.title-spark{right:-32px;width:24px}.start-screen{gap:25px}.character-intro{width:300px}.how-to{gap:22px}.how-heading h2{font-size:21px}.instruction{padding-left:18px}.center-tip{display:none}footer>span:nth-child(2){display:none}}
@media(max-width:760px){.page-shell{padding:0 22px}.site-header{height:82px}.brand{font-size:16px}.brand img{width:49px}.header-note{display:none}.instructions-link{font-size:10px}.intro{padding:34px 0;gap:30px}.eyebrow{font-size:8px;letter-spacing:1px;margin-bottom:17px}h1{font-size:49px;letter-spacing:-2.7px}.title-spark{width:20px;right:-25px;bottom:38px}.intro-side{max-width:215px}.edition{font-size:8px;letter-spacing:.5px}.intro-side p{font-size:12px;margin:12px 0}.free-label{font-size:8px}.arcade-bar{padding:0 16px;font-size:9px}.personal-best{font-size:8px;gap:5px;letter-spacing:.4px}.version{display:none}.game-stage{height:440px}.start-screen{gap:15px;padding:36px 30px}.start-copy{min-width:225px}.start-copy h2{font-size:53px}.game-eyebrow{font-size:7px;letter-spacing:1.2px}.character-intro{width:230px}.character-tag{font-size:6px;letter-spacing:.8px}.spark-one{right:5px}.how-to{grid-template-columns:1fr 1fr;gap:28px;padding:35px 0}.how-heading{padding-top:6px}.instruction p{max-width:240px}.instruction:nth-child(3){border-left:0;padding-left:0}.controls-bar{padding:0 13px}.game-tools{gap:1px}footer{min-height:66px}.footer-brand{font-size:6px}.footer-brand>span{margin:0 4px}footer>a{font-size:6px}}
@media(max-width:540px){.page-shell{padding:0 15px}.site-header{height:73px}.instructions-link span{margin-left:4px}.intro{display:block;padding:28px 5px}.intro h1{font-size:54px;line-height:1.04;width:max-content}.title-spark{right:-28px;bottom:44px}.intro-side{padding-top:19px;max-width:100%}.edition{display:none}.intro-side p{font-size:12px;margin:0;line-height:1.65}.intro-side p br{display:none}.free-label{margin-top:10px;font-size:8px}.arcade{border-radius:9px}.arcade-bar{height:46px;padding:0 12px}.arcade-name{gap:7px;font-size:8px;letter-spacing:.8px}.personal-best{font-size:7px}.personal-best strong{font-size:14px}.personal-best svg{width:13px}.game-stage{height:515px}.game-hud{inset:18px 15px auto;font-size:7px}.hud-score{font-size:30px}.hud-lives{font-size:6px;letter-spacing:.5px}.start-screen{flex-direction:column-reverse;gap:4px;text-align:center;padding:42px 16px 33px;justify-content:center}.start-copy{min-width:0}.start-copy h2{font-size:48px;line-height:.94;margin:0 auto 12px}.game-eyebrow{font-size:6px;margin-bottom:13px;letter-spacing:1.5px}.start-copy p{font-size:10px;margin:0 0 16px}.play-button{min-height:43px;font-size:11px;margin:0 auto;min-width:210px}.start-hint{margin-top:12px;font-size:8px}.character-intro{width:210px;transform:translateY(0);margin-bottom:14px}.character-tag{display:none}.character-spark{font-size:20px}.spark-one{right:0;top:2px}.spark-two{bottom:10px;left:20px;font-size:17px}.pixel-star{font-size:22px;right:-30px}.stage-coordinates{font-size:5px;left:15px;letter-spacing:.7px}.controls-bar{height:55px}.control-tip{font-size:8px;gap:5px}.control-tip kbd{font-size:8px}.tap-icon{font-size:17px}.tool-button{width:30px;height:32px}.how-to{gap:26px 24px;padding:33px 5px}.how-heading h2{font-size:22px}.how-heading p{font-size:10px}.how-heading .eyebrow{font-size:7px}.instruction{padding-left:17px}.instruction h3{font-size:12px}.instruction p{font-size:10px;line-height:1.7}.step-number{font-size:9px;margin-bottom:10px}footer{gap:12px;align-items:center}.footer-brand{max-width:160px;font-size:6px;line-height:1.9}footer>a{font-size:6px;letter-spacing:.5px;white-space:nowrap}.game-modal{padding:27px 15px}.game-modal h2{font-size:27px}.game-modal p{font-size:11px}.result-scores{gap:30px}.result-scores>div>span{font-size:8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.character-intro img{animation:none}button{transition:none}}

html:has(.game-page){height:100%;overflow:hidden;overscroll-behavior:none}
.game-page{height:100%;overflow:hidden;overscroll-behavior:none;background:#083f4e}
.game-page .page-shell{max-width:none;margin:0;padding:0}
.game-page .site-header,.game-page .intro,.game-page .how-to,.game-page footer{display:none}
.game-page .arcade{position:fixed;inset:0;width:100%;height:100%;height:100dvh;display:flex;flex-direction:column;border:0;border-radius:0;box-shadow:none}
.game-page .game-stage{flex:1 1 0;min-height:0;height:auto}
.game-page .arcade-bar,.game-page .controls-bar{flex:0 0 auto;padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
.game-page .arcade-bar{height:calc(51px + env(safe-area-inset-top));padding-top:env(safe-area-inset-top)}
.game-page .controls-bar{height:calc(59px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom)}
.game-page .tool-button{width:44px;height:44px;touch-action:manipulation}
.game-page .play-button{touch-action:manipulation}
.game-page .game-hud{left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right))}
.game-page .modal-screen{padding:12px max(12px,env(safe-area-inset-right)) 12px max(12px,env(safe-area-inset-left))}
.game-page .game-modal{max-height:100%;overflow-y:auto}
@media(max-height:560px){
  .game-page .arcade-bar{height:calc(40px + env(safe-area-inset-top))}
  .game-page .controls-bar{height:calc(48px + env(safe-area-inset-bottom))}
  .game-page .start-screen{flex-direction:row;gap:28px;padding:15px max(25px,env(safe-area-inset-right)) 15px max(25px,env(safe-area-inset-left));text-align:left}
  .game-page .start-copy{min-width:0}
  .game-page .start-copy h2{font-size:38px;margin:0 0 10px}
  .game-page .start-copy p{font-size:10px;margin:0 0 12px}
  .game-page .start-copy .play-button{margin:0;min-height:40px;font-size:10px}
  .game-page .character-intro{width:clamp(120px,25vw,260px);margin:0}
  .game-page .game-eyebrow,.game-page .start-hint,.game-page .character-tag,.game-page .stage-coordinates{display:none}
  .game-page .game-modal{padding:14px 20px}
  .game-page .game-modal h2{font-size:24px;margin-bottom:6px}
  .game-page .game-modal p{font-size:10px;margin-bottom:12px}
  .game-page .result-scores{margin-bottom:12px}
  .game-page .result-scores strong{font-size:28px}
  .game-page .modal-hint{margin-top:10px;font-size:8px}
}