:root{--deep:#061f32;--ocean:#087b96;--cyan:#67d7e8;--lime:#d5ff5f;--paper:#eff2eb;--ink:#0a2638;--line:#d7dedb;--muted:#688087}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,sans-serif}.eyebrow{margin:0;color:#2f8fa0;font-size:10px;letter-spacing:2px;text-transform:uppercase;font-weight:900}.flap-page{overflow:hidden}.flap-hero{min-height:300px;padding:56px 7vw;display:flex;align-items:center;justify-content:space-between;gap:40px;background:linear-gradient(135deg,#061f32,#0b4b62);color:white}.flap-hero h1{margin:13px 0 10px;font:900 clamp(48px,7vw,88px)/.95 Arial,sans-serif;letter-spacing:-5px}.flap-hero h1 em{color:var(--lime);font-style:normal}.flap-hero p:last-child{color:#b9d2da;font-size:17px}.flap-hero-fish{position:relative;width:240px;height:130px;flex:0 0 auto;border-radius:54% 46% 48% 52%;background:linear-gradient(#6be1f0 0 55%,#28a4c0 56%);box-shadow:0 25px 45px #001c2788;animation:flapHero 2.7s ease-in-out infinite}.flap-hero-fish:before{content:"";position:absolute;width:72px;height:88px;left:-49px;top:20px;background:#39bfd4;clip-path:polygon(100% 50%,0 0,13% 50%,0 100%)}.flap-hero-fish:after{content:"";position:absolute;width:38px;height:18px;right:26px;top:48px;border-radius:50%;background:white;box-shadow:inset -10px 0 #112e40}.flap-hero-fish i{position:absolute;width:45px;height:30px;left:100px;top:-17px;background:#48cadf;clip-path:polygon(0 100%,45% 0,100% 100%)}.flap-hero-fish b{position:absolute;width:52px;height:29px;left:86px;bottom:-9px;background:#1594b2;clip-path:polygon(0 0,100% 0,55% 100%)}.flap-hero-fish span{position:absolute;width:45px;height:28px;right:60px;bottom:16px;border-radius:60% 20% 60% 20%;background:#1ba1bd;transform:rotate(-18deg)}@keyframes flapHero{50%{transform:translateY(-12px) rotate(-2deg)}}
.flap-shell{width:min(1040px,94vw);margin:-34px auto 70px;position:relative}.flap-toolbar{display:grid;grid-template-columns:repeat(3,1fr);background:white;border:1px solid var(--line);border-radius:20px 20px 0 0;overflow:hidden}.flap-toolbar span{padding:15px 18px;text-align:center;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:1.3px}.flap-toolbar span+span{border-left:1px solid var(--line)}.flap-toolbar strong{display:block;margin-top:5px;color:var(--ink);font-size:23px;letter-spacing:0}.flap-stage{position:relative;height:min(68vh,620px);min-height:470px;background:#087b96;border:1px solid #0c6075;border-top:0;border-radius:0 0 24px 24px;overflow:hidden;box-shadow:0 24px 55px #08243522;touch-action:none;user-select:none}.flap-stage canvas{display:block;width:100%;height:100%;touch-action:none}.flap-pause{position:absolute;z-index:5;top:14px;right:14px;min-width:76px;min-height:44px;border:1px solid #a8dfe8;background:#062c3bdd;color:white;border-radius:99px;font-weight:800}.flap-pause:disabled{opacity:.45}.flap-current{position:absolute;z-index:4;top:18px;left:18px;min-height:24px;padding:6px 10px;border-radius:99px;background:#063447cc;color:#d7f6fa;font-size:10px;font-weight:800;letter-spacing:.7px;opacity:0;transition:opacity .2s}.flap-current.show{opacity:1}.flap-overlay{position:absolute;z-index:6;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;text-align:center;background:linear-gradient(#052c3bbb,#041d2add);backdrop-filter:blur(3px);color:white}.flap-overlay.hidden{display:none}.flap-overlay h2{margin:10px 0;font-size:clamp(30px,6vw,52px);letter-spacing:-2px}.flap-overlay>p:not(.eyebrow){max-width:540px;color:#c4dce2;line-height:1.6}.flap-overlay kbd{padding:3px 6px;border:1px solid #87b8c2;border-radius:5px;background:#062b3b}.flap-overlay button{min-width:190px;min-height:52px;margin-top:18px;border:0;border-radius:14px;background:var(--lime);color:#071f2f;font-weight:900;font-size:15px}.flap-overlay>a{margin-top:14px;color:#d7ebee;font-weight:800}.flap-daily{margin-top:10px;padding:12px 18px;border:1px solid #4b8190;border-radius:14px;background:#082d3bcc}.flap-daily span{display:block;color:#7ed8e6;font-size:9px;text-transform:uppercase;letter-spacing:1.4px;font-weight:900}.flap-daily strong{display:block;margin-top:5px;font-size:13px}.flap-result-stats{display:flex;gap:8px;margin-top:10px}.flap-result-stats span{min-width:110px;padding:11px;border:1px solid #548895;border-radius:12px;color:#9fc5cd;font-size:9px;text-transform:uppercase}.flap-result-stats strong{display:block;color:white;font-size:22px}.flap-options{display:flex;align-items:center;gap:10px;padding:18px 20px;background:white;border:1px solid var(--line);border-radius:18px;margin-top:16px}.flap-options button{min-height:44px;border:1px solid #9aaea9;border-radius:99px;background:white;color:var(--ink);padding:0 15px;font-weight:800}.flap-options p{margin:0 0 0 auto;color:var(--muted);font-size:12px}.flap-scores,.flap-how{margin-top:18px;padding:30px;background:white;border:1px solid var(--line);border-radius:20px}.flap-scores h2,.flap-how h2{margin:7px 0 0;font-size:28px}.flap-scores ol{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;padding:0;list-style:none}.flap-scores li{padding:14px;border-radius:12px;background:#edf3f1;color:#5f7479;font-size:12px}.flap-scores li b{display:block;color:var(--ink);font-size:17px}.flap-how>div{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:22px}.flap-how article{padding:20px;border-radius:15px;background:#edf6f4}.flap-how article>b{color:#218ba0;font-size:11px}.flap-how h3{margin:12px 0 7px}.flap-how article p{margin:0;color:#647a7c;line-height:1.55;font-size:13px}
.flap-tile{background:linear-gradient(145deg,#0b5670,#063348)!important;color:white!important}.flap-tile p{color:#70e2ee!important}.flap-tile strong{color:#b9d2d9!important}.flap-tile em{color:#d5ff5f!important}.flap-preview{--preview-scale:1;position:absolute;right:8%;bottom:32%;width:104px;height:72px;border-radius:50%;background:linear-gradient(180deg,#69deeb 0 58%,#1fa5c0 59%,#1688a8 100%);filter:drop-shadow(0 12px 13px #001d2c55);transform:scale(var(--preview-scale));transform-origin:right center;animation:flapPreviewSwim 2.8s ease-in-out infinite}.flap-preview:before{content:"";position:absolute;z-index:-1;width:38px;height:72px;left:-31px;top:0;background:#30b9d3;clip-path:polygon(100% 50%,0 0,11% 50%,0 100%)}.flap-preview:after{content:"";position:absolute;width:11px;height:11px;right:21px;top:20px;border:5px solid white;border-radius:50%;background:#102f3d}.flap-preview i{position:absolute;width:38px;height:30px;left:42px;top:-20px;background:#4bd0df;clip-path:polygon(0 100%,32% 0,100% 100%)}.flap-preview b{position:absolute;width:36px;height:25px;left:46px;bottom:-17px;background:#177e9d;clip-path:polygon(0 0,100% 0,33% 100%)}.flap-preview span{position:absolute;width:14px;height:9px;right:8px;top:42px;border-right:2px solid #0a5269;border-bottom:2px solid #0a5269;border-radius:0 0 100% 0;transform:rotate(10deg)}@keyframes flapPreviewSwim{50%{transform:translateY(-5px) rotate(-2deg) scale(var(--preview-scale))}}
@media(max-width:720px){.flap-hero{min-height:225px;padding:38px 20px 52px}.flap-hero h1{font-size:48px;letter-spacing:-3px}.flap-hero-fish{display:none}.flap-shell{width:auto;margin:-25px 10px 50px}.flap-toolbar span{padding:12px 7px}.flap-stage{height:calc(100dvh - 235px);min-height:430px;max-height:650px}.flap-overlay{justify-content:flex-start;overflow-y:auto;padding:50px 18px 24px}.flap-overlay#flapPaused{justify-content:center}.flap-overlay h2{font-size:34px}.flap-options{align-items:stretch;flex-wrap:wrap}.flap-options button{flex:1}.flap-options p{flex-basis:100%;margin:5px 0 0}.flap-scores,.flap-how{padding:22px 18px}.flap-scores ol{grid-template-columns:1fr 1fr}.flap-how>div{grid-template-columns:1fr}.flap-current{left:10px;top:10px}.flap-pause{right:10px;top:10px}.flap-preview{--preview-scale:.86;right:9%;bottom:34%}.flap-preview:before{left:-31px}}
.flap-power{position:absolute;z-index:5;left:18px;bottom:16px;display:flex;gap:7px;pointer-events:none}.flap-power span{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:7px 10px;border:1px solid #9be5ed;border-radius:999px;background:#042d3ee8;color:white;font-size:10px;font-weight:900;box-shadow:0 7px 18px #001e2c55;animation:powerPop .24s ease-out}.flap-power span[data-power="shield"]{border-color:#a9f1ff;background:#155069e8}.flap-power span[data-power="boost"]{border-color:#e4ff8b;background:#36571de8}.flap-power span[data-power="magnet"]{border-color:#ffb9e9;background:#693458e8}.flap-power-key{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:10px}.flap-power-key span{display:grid;grid-template-columns:35px 1fr;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:#f8fbf8}.flap-power-key i{grid-row:1/3;display:grid;place-items:center;width:30px;height:30px;border:2px solid #71cdd9;border-radius:50%;color:#168ca0;font-style:normal;font-weight:900}.flap-power-key span[data-power="boost"] i{border-color:#b7dc45;color:#6b8c0c}.flap-power-key span[data-power="magnet"] i{border-color:#e48bc7;color:#a33c84}.flap-power-key b{font-size:11px}.flap-power-key small{color:var(--muted);font-size:9px}@keyframes powerPop{from{opacity:0;transform:translateY(7px) scale(.92)}}
@media(max-width:720px){.flap-power{left:10px;bottom:10px;max-width:calc(100% - 20px);flex-wrap:wrap}.flap-power span{min-height:28px;padding:5px 8px;font-size:9px}.flap-power-key{grid-template-columns:1fr}.flap-power-key span{min-height:54px}.flap-overlay .arcade-result-card{max-height:none;overflow:visible}}
@media(prefers-reduced-motion:reduce){.flap-hero-fish,.flap-preview{animation:none}.flap-current{transition:none}.flap-power span{animation:none}}

/* Shared BiteLah fish renderer: the hub card, hero and playable fish now use one visual language. */
.flap-preview{right:8%;bottom:29%;width:112px;height:78px;border-radius:0;background:transparent;filter:drop-shadow(0 12px 13px #001d2c55)}
.flap-preview canvas{display:block;width:112px;height:75px}
.flap-preview::before,.flap-preview::after{content:none}
.flap-preview i,.flap-preview b,.flap-preview span{display:none}
.flap-hero-fish{width:220px;height:140px;border:0;border-radius:0;background:transparent;box-shadow:none}
.flap-hero-fish canvas{display:block;width:220px;height:140px;filter:drop-shadow(0 22px 24px #001c2777)}
.flap-hero-fish::before,.flap-hero-fish::after{content:none}
.flap-hero-fish i,.flap-hero-fish b,.flap-hero-fish span{display:none}

/* Streamlined BiteLah tuna — shared visual language with the canvas fish. */
.flap-hero-fish{width:184px;height:120px;border:2px solid #0d728d;border-radius:60% 52% 53% 61%;background:linear-gradient(180deg,#98f0f2 0 48%,#54d5e1 49% 69%,#1ba0ba 70% 100%);box-shadow:0 22px 38px #001c2766;transform-origin:45% 50%}
.flap-hero-fish:before{width:64px;height:96px;left:-46px;top:12px;background:#37c4d8;clip-path:polygon(100% 45%,5% 8%,20% 50%,5% 92%,100% 56%)}
.flap-hero-fish:after{width:34px;height:34px;right:20px;top:27px;border:3px solid #07556d;border-radius:50%;background:radial-gradient(circle at 39% 34%,#fff 0 13%,#092f40 15% 45%,#fff 47% 100%);box-shadow:none}
.flap-hero-fish i{width:45px;height:31px;left:61px;top:-21px;background:#68dfe7;clip-path:polygon(0 100%,45% 5%,100% 100%)}
.flap-hero-fish b{width:43px;height:27px;left:68px;bottom:-16px;background:#238dab;clip-path:polygon(0 0,100% 0,65% 100%,24% 72%)}
.flap-hero-fish span{width:44px;height:28px;right:56px;bottom:22px;border:1px solid #11809b;border-radius:70% 22% 70% 22%;background:#a9f4f2;transform:rotate(-14deg)}
@keyframes flapHero{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-7px) rotate(-1deg)}}
.flap-run-hud{position:absolute;z-index:4;left:14px;right:104px;top:14px;display:flex;justify-content:space-between;gap:8px;pointer-events:none}.flap-run-hud span{min-width:132px;padding:7px 10px;border:1px solid #9be5ed88;border-radius:12px;background:#052d3de8;color:#fff;box-shadow:0 7px 18px #001e2c45}.flap-run-hud span:last-child{text-align:right}.flap-run-hud small{display:block;color:#79dce8;font-size:8px;font-weight:900;letter-spacing:1px;text-transform:uppercase}.flap-run-hud b{display:block;margin-top:2px;font-size:11px}.flap-fish-select{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:min(650px,100%);margin:10px 0 4px}.flap-fish-select button{display:grid;grid-template-columns:48px 1fr;grid-template-rows:auto auto;align-items:center;min-width:0!important;min-height:68px!important;margin:0!important;padding:9px!important;border:1px solid #6d9da8!important;border-radius:14px!important;background:#072f3dcc!important;color:#fff!important;text-align:left}.flap-fish-select button.selected{border-color:#d5ff5f!important;background:#164756ee!important;box-shadow:inset 0 0 0 2px #d5ff5f55}.flap-fish-select button i{grid-row:1/3;position:relative;width:37px;height:24px;border-radius:55% 45% 48% 52%;background:#5cd7e8}.flap-fish-select button i:before{content:"";position:absolute;left:-13px;top:4px;border-top:8px solid transparent;border-bottom:8px solid transparent;border-right:14px solid #34b7ce}.flap-fish-select button i:after{content:"";position:absolute;right:6px;top:6px;width:6px;height:6px;border:2px solid #fff;border-radius:50%;background:#08283a}.flap-fish-select button[data-fish="puffer"] i{width:29px;height:29px;border-radius:50%;background:#f5b94a}.flap-fish-select button[data-fish="puffer"] i:before{left:-8px;top:8px;border-right-color:#e89b37}.flap-fish-select button[data-fish="flying"] i{background:#8f91ee}.flap-fish-select button[data-fish="flying"] i:before{border-right-color:#7478d7}.flap-fish-select button b{font-size:11px}.flap-fish-select button small{color:#a9cbd1;font-size:8px;line-height:1.2}.flap-stage[data-zone="harbour"]{background:#286d7b}.flap-stage[data-zone="open"]{background:#075d84}.flap-stage[data-zone="night"]{background:#071f46}.flap-stage.dare-flash:after{content:"CLOSE SHAVE!";position:absolute;z-index:3;left:50%;top:36%;transform:translate(-50%,-50%);color:#d5ff5f;font-size:clamp(18px,4vw,34px);font-weight:1000;letter-spacing:2px;text-shadow:0 3px #08283a;pointer-events:none;animation:dareFlash .42s ease-out both}@keyframes dareFlash{from{opacity:0;transform:translate(-50%,-20%) scale(.72)}45%{opacity:1}to{opacity:0;transform:translate(-50%,-80%) scale(1.12)}}@media(max-width:720px){.flap-run-hud{left:8px;right:88px;top:8px}.flap-run-hud span{min-width:0;width:40vw;padding:6px 8px}.flap-run-hud b{font-size:9px}.flap-fish-select{grid-template-columns:1fr;gap:6px}.flap-fish-select button{min-height:52px!important}.flap-start-powers{margin-top:6px}.flap-overlay#flapStart{padding-top:34px}.flap-overlay#flapStart h2{margin:5px 0}.flap-overlay#flapStart>p:not(.eyebrow){margin:2px 0 6px;line-height:1.35}}

/* Final renderer overrides must follow the legacy CSS fish rules above. */
.flap-preview{right:8%;bottom:29%;width:112px;height:78px;border:0;border-radius:0;background:transparent;filter:drop-shadow(0 12px 13px #001d2c55)}
.flap-preview canvas{display:block;width:112px;height:75px}
.flap-preview::before,.flap-preview::after{content:none}
.flap-preview i,.flap-preview b,.flap-preview span{display:none}
.flap-hero-fish{width:220px;height:140px;border:0;border-radius:0;background:transparent;box-shadow:none}
.flap-hero-fish canvas{display:block;width:220px;height:140px;filter:drop-shadow(0 22px 24px #001c2777)}
.flap-hero-fish::before,.flap-hero-fish::after{content:none}
.flap-hero-fish i,.flap-hero-fish b,.flap-hero-fish span{display:none}