/* © 2026 All rights reserved. */
.streamSide{display:none}.layoutToggle{position:fixed;right:16px;top:14px;z-index:20;border:1px solid #ffffff35;border-radius:6px;background:#143c49d9;color:#d3eceb;font-size:11px;padding:8px 12px}
:root{--navy:#0f2a44;--sea:#4fb2d6;--foam:#eaf7fb;--sun:#ffd34d;--coral:#ff6b6b;
  --font:"Hiragino Sans","Yu Gothic",system-ui,sans-serif}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;position:fixed;inset:0;width:100%;background:#0b1f33;color:#fff;font-family:var(--font);overflow:hidden;
  user-select:none;-webkit-user-select:none;overscroll-behavior:none;touch-action:none}
button{font:inherit;cursor:pointer;touch-action:manipulation}
a{color:inherit}
/* スマホは全画面、PCは縦長の画面を中央に */
.stage{position:relative;height:100vh;height:100dvh;width:min(100vw,calc(100dvh * 0.56));margin:0 auto;overflow:hidden}
#game{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}
.screen[hidden]{display:none!important}

/* ---- プレイ中 */
.hud{position:absolute;left:0;right:0;top:0;padding:calc(10px + env(safe-area-inset-top)) 14px 0;display:none;pointer-events:none;
  text-shadow:0 2px 0 rgba(15,42,68,.6)}
body[data-screen="play"] .hud{display:grid;grid-template-columns:1fr auto;align-items:end}
.dist b{font-size:46px;font-weight:900;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.dist small,.speed small{font-size:15px;font-weight:800;margin-left:4px}
.speed{text-align:right}
.speed b{font-size:22px;font-weight:900;font-variant-numeric:tabular-nums}
.tier{grid-column:1 / -1;font-size:13px;font-weight:800;opacity:.9}
.banner{position:absolute;left:0;right:0;top:26%;text-align:center;font-size:clamp(26px,8vw,40px);font-weight:900;opacity:0;pointer-events:none;
  text-shadow:0 3px 0 var(--navy),0 0 18px rgba(255,255,255,.4)}
.banner.show{animation:ban 1.3s ease-out forwards}
@keyframes ban{0%{opacity:0;transform:scale(1.5)}12%{opacity:1;transform:scale(1)}75%{opacity:1}100%{opacity:0;transform:translateY(-14px)}}
.snd{position:absolute;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:5;font-size:11px;font-weight:800;color:#fff;
  background:rgba(15,42,68,.35);border:1px solid rgba(255,255,255,.5);border-radius:20px;padding:4px 10px}

/* ---- タイトル */
.title{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:calc(14px + env(safe-area-inset-top)) 20px calc(18px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,rgba(15,42,68,.15),rgba(15,42,68,0) 40%,rgba(15,42,68,.55))}
.tTop{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:800}
.back{text-decoration:none;border-bottom:1px solid rgba(255,255,255,.6)}
.brand{letter-spacing:.22em;font-size:10px;opacity:.8}
.tMain{text-align:center;margin-top:4vh}
.tSub{margin:0;font-weight:800;letter-spacing:.2em;opacity:.9}
.tLogo{margin:6px 0 0;font-size:clamp(64px,22vw,96px);font-weight:900;line-height:.95;letter-spacing:-.03em;
  color:#fff;text-shadow:0 5px 0 var(--navy),0 0 30px rgba(255,255,255,.25);transform:skewX(-8deg)}
.tLogo span{display:block;font-size:.62em;color:var(--sun);letter-spacing:.05em}
.tLead{font-weight:700;line-height:1.7;margin:12px 0 0;text-shadow:0 2px 0 rgba(15,42,68,.6)}
.how{list-style:none;padding:12px 14px;margin:0 0 14px;background:rgba(15,42,68,.45);border-radius:12px;font-size:13px;line-height:1.9;font-weight:600}
.how b{color:var(--sun)}
.go{display:block;width:100%;border:0;border-radius:40px;background:var(--sun);color:var(--navy);font-size:24px;font-weight:900;padding:16px;
  box-shadow:0 5px 0 #c79a15;letter-spacing:.08em}
.go:active{transform:translateY(4px);box-shadow:0 1px 0 #c79a15}
.tBest{text-align:center;font-size:12px;font-weight:800;margin:10px 0 0;opacity:.9}
.foot{text-align:center;font-size:10px;opacity:.7;margin:8px 0 0;line-height:1.7}

/* ---- 結果 */
.result{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(11,31,51,.6);overflow:auto}
.rCard{width:100%;max-width:400px;background:var(--foam);color:var(--navy);border-radius:18px;padding:20px 18px;text-align:center;animation:up .35s ease-out}
@keyframes up{from{transform:translateY(30px);opacity:0}to{transform:none;opacity:1}}
.rHead{font-size:12px;font-weight:800;letter-spacing:.2em;opacity:.7}
.rKm b{font-size:72px;font-weight:900;letter-spacing:-.03em;line-height:1.05}
.rKm span{font-size:24px;font-weight:900;margin-left:4px}
.rSub{font-weight:800}
.rTitle{display:inline-block;margin:10px 0;padding:4px 14px;border-radius:20px;background:var(--navy);color:var(--sun);font-weight:900}
.rCause{background:#fff;border-radius:12px;padding:10px 12px;margin:4px 0 8px}
.rCause small{font-size:11px;font-weight:900;color:var(--coral);letter-spacing:.2em}
.rCause p{margin:2px 0 0;font-size:17px;font-weight:900;line-height:1.45}
.rBest{font-size:12px;font-weight:800;color:#c0392b;margin:6px 0 12px}
.rActs{display:flex;gap:8px;margin-top:10px}
.sub{flex:1;border:1.5px solid var(--navy);background:#fff;color:var(--navy);border-radius:30px;font-weight:800;padding:10px}
.shareMsg{font-size:11px;min-height:14px;margin:6px 0}
.rImg{width:100%;border-radius:10px;margin-top:4px}

/* ---- ジャンプ・クラゲ */
.jumpBox{grid-column:1 / -1;display:flex;align-items:center;gap:6px;margin-top:4px}
.jumpBox small{font-size:11px;font-weight:800}
.jumps{display:flex;gap:4px}
.jumps i{width:16px;height:16px;border-radius:50%;border:2px solid #fff;background:transparent}
.jumps i.on{background:var(--sun);border-color:var(--sun)}
.jumps.empty i{border-color:var(--coral);animation:blink .5s infinite alternate}
@keyframes blink{to{opacity:.35}}
.pop{position:absolute;left:0;right:0;top:44%;text-align:center;font-weight:900;font-size:22px;color:#ffd1e6;opacity:0;pointer-events:none;text-shadow:0 2px 0 var(--navy)}
.pop.show{animation:popUp .7s ease-out forwards}
@keyframes popUp{0%{opacity:0;transform:translateY(10px)}20%{opacity:1}100%{opacity:0;transform:translateY(-24px)}}
.rEat{font-size:12px;font-weight:800;margin:0 0 4px;opacity:.75}

/* 仕上げ: 余白のある海の画面と、小さな計器。 */
:root{--navy:#183749;--green:#246e53;--foam:#f3f8f5;--sun:#ffe06b}html,body{background:#102a38;background-image:radial-gradient(ellipse at 50% 25%,#31657580,transparent 65%)}.stage{box-shadow:0 0 80px #041a2477}.screen{touch-action:pan-y}.tTop{border-bottom:1px solid #ffffff40;padding-bottom:12px;gap:10px}.brand{font-size:8px;letter-spacing:.12em;text-align:right}.brand i{font:500 7px system-ui;display:block;letter-spacing:.11em;opacity:.65;margin-top:4px}.back{font-size:10px;font-weight:600;border:0}.title{padding:calc(14px + env(safe-area-inset-top)) 22px calc(16px + env(safe-area-inset-bottom));background:linear-gradient(180deg,#123a4915,transparent 45%,#153a4aaa)}.tMain{margin:20px 0 auto;text-align:left;position:relative;z-index:1;pointer-events:none}.tSub{font-size:10px;letter-spacing:.14em;display:flex;gap:7px;align-items:center}.tSub>i{width:5px;height:5px;border-radius:50%;background:#c5ffdf}.tLogo{font-size:clamp(52px,18vw,78px);line-height:1;letter-spacing:-.07em;margin:12px 0 0;transform:skewX(-7deg);transform-origin:left center;text-shadow:0 3px #143944,2px 0 #143944,-2px 0 #143944}.tLogo span{font-size:.67em;margin-top:7px;letter-spacing:.03em;color:#fff1a0}.tLead{font-size:11px;line-height:1.8;font-weight:600;margin-top:13px;opacity:.9;text-shadow:none}.tBottom{position:relative;z-index:2}.howQuick{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}.howQuick>div{background:#fffffff0;border:1px solid #ffffff75;border-radius:5px;padding:9px 8px;display:flex;align-items:center;gap:7px;color:var(--navy)}.howQuick>div>span{font:800 19px/1 system-ui;color:var(--green);white-space:nowrap;letter-spacing:-.14em}.howQuick p{margin:0;min-width:0}.howQuick b{display:block;font-size:10px;line-height:1.5;white-space:nowrap}.howQuick small{display:block;font-size:8px;line-height:1.5;color:#647e7f;margin-top:2px}.foodGuide{display:flex;justify-content:space-between;gap:5px;font-size:9px;padding:0 2px;line-height:1.8}.foodGuide span{display:flex;align-items:center;gap:5px}.foodDot,.poisonDot{width:7px;height:7px;border-radius:50%;display:inline-block;background:#ffbfda;box-shadow:0 0 8px #ffb0d0aa}.poisonDot{background:#b877ff;box-shadow:none}.howMore{font-size:9px;margin:8px 0 12px;color:#e5f4f1}.howMore summary{cursor:pointer;min-height:24px;display:flex;align-items:center;gap:10px;list-style:none}.howMore summary::-webkit-details-marker{display:none}.howMore summary:after{content:'＋';color:#a5edc9}.howMore[open] summary:after{content:'−'}.how{margin:0 0 8px;padding:8px 11px;font-size:10px;line-height:1.8;border-radius:4px;background:#163b49e8;max-height:105px;overflow:auto;touch-action:pan-y}.go{border-radius:5px;background:#f2ffef;color:#174d38;border:1px solid #c6f1d2;box-shadow:0 4px #153c38;font-size:17px;min-height:54px;padding:12px 18px;letter-spacing:.04em}.go:after{content:'→';float:right;font:500 21px system-ui}.go:active{box-shadow:0 1px #153c38}.tBest{font-size:9px;margin-top:10px;letter-spacing:.02em}.foot{font-size:8px;margin-top:10px;line-height:1.8;opacity:.7}.foot span{padding:0 3px}.snd{font-size:9px;min-height:32px;min-width:58px;padding:7px 10px;border-radius:5px;background:#193e4bb8;right:10px;bottom:calc(9px + env(safe-area-inset-bottom))}body:not([data-screen="play"]) .snd{top:calc(63px + env(safe-area-inset-top));bottom:auto;right:20px;z-index:5}.hud{padding:calc(12px + env(safe-area-inset-top)) 12px 0;gap:0 8px;text-shadow:none}.dist,.speed{background:#f6fff5ed;border-top:2px solid #246e53;border-radius:3px;color:var(--navy);padding:9px 11px}.dist{width:max-content;min-width:128px}.hudLabel{display:block;font-size:8px;font-weight:600;color:#55766b;margin-bottom:2px;letter-spacing:.06em}.dist b{font:850 34px/1.15 system-ui;letter-spacing:-.04em}.dist small,.speed small{font-size:10px;margin-left:5px}.speed{min-width:99px}.speed b{font:800 23px/1.4 system-ui}.tier{grid-column:1/-1;font-size:10px;line-height:1.5;font-weight:700;background:#163a49d9;padding:5px 9px;justify-self:start;border-radius:0 0 3px 3px;color:#edffef;letter-spacing:.03em}.jumpBox{margin-top:7px;gap:7px;filter:drop-shadow(0 1px 2px #15333a99)}.jumpBox small{font-size:9px}.jumps{gap:5px}.jumps i{width:13px;height:13px;border-width:1px}.jumps i.on{background:#e4ffdb;border-color:#fff}.jumps.empty i{border-color:#ffa0ac}.banner{font-size:clamp(22px,6vw,31px);letter-spacing:-.03em}.pop{font-size:19px}.result{background:#0d2a3a9e;backdrop-filter:blur(5px);padding:16px;align-items:center;touch-action:pan-y}.rCard{position:relative;background:#f6faf6;border-radius:6px;border-top:4px solid #60d59c;max-width:390px;padding:17px 19px;text-align:left;box-shadow:0 20px 60px #09283844;max-height:calc(100dvh - 32px);overflow:auto;touch-action:pan-y}.resultMast{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #d8e2d8;padding-bottom:12px}.rHead{font-size:10px;letter-spacing:.06em;color:var(--green)}.resultMast>span{font:600 7px system-ui;letter-spacing:.12em;color:#759387}.resultFish{position:absolute;right:15px;top:47px;width:100px;height:100px;object-fit:contain;transform:rotate(14deg);pointer-events:none}.rKm{position:relative;z-index:1;margin-top:14px}.rKm b{font:850 62px/1.1 system-ui;letter-spacing:-.06em}.rKm span{font-size:17px}.rSub{font-size:11px;color:#71877b;margin-top:6px}.rSub b{color:#244638}.rTitle{border-radius:3px;font-size:11px;background:#e0f1e4;color:var(--green);margin:12px 0;padding:6px 10px}.rCause{border-radius:4px;border:1px solid #ead6cc;border-left:3px solid #e99d86;background:#fffaf5;padding:10px 12px;margin:2px 0 10px}.rCause small{font-size:8px;color:#b9654c;letter-spacing:.05em}.rCause p{font-size:15px;line-height:1.6;margin-top:3px}.rEat{font-size:10px;color:#70857b}.rBest{font-size:10px;color:var(--green);margin:8px 0 13px}.rCard .go{background:#246e53;border-color:#246e53;color:#fff;box-shadow:0 3px #164a37;min-height:47px;font-size:14px}.rActs{gap:8px;margin-top:10px}.sub{border:1px solid #b8cdbf;border-radius:4px;font-size:11px;padding:11px 7px;min-height:43px;font-weight:650}.shareMsg{font-size:9px;line-height:1.7;min-height:0;margin:7px 0}.shareMsg:empty{display:none}.resultPreview{font-size:9px;color:#6f8378;margin-top:13px}.resultPreview summary{cursor:pointer;min-height:28px;display:flex;align-items:center;gap:8px}.resultPreview summary:after{content:'＋'}.resultPreview[open] summary:after{content:'−'}.resultPreview summary::-webkit-details-marker{display:none}.rImg{border-radius:4px;border:1px solid #dde8dc}.companyMark{display:block;width:103px;height:auto;mix-blend-mode:multiply;margin:10px auto 0;opacity:.65}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #ffe16c;outline-offset:3px}
@media(max-height:720px){.title{padding:calc(11px + env(safe-area-inset-top)) 17px calc(12px + env(safe-area-inset-bottom))}.tTop{padding-bottom:8px}.tMain{margin-top:15px}.tLogo{font-size:clamp(43px,16vw,64px);margin-top:9px}.tLead{font-size:10px;margin-top:8px}.tSub{font-size:9px}.howQuick>div{padding:7px}.howQuick b{font-size:9px}.howQuick small{font-size:7px}.howQuick{margin-bottom:6px;gap:6px}.foodGuide{font-size:8px}.howMore{margin:5px 0 7px}.go{font-size:15px;min-height:47px;padding:10px 15px}.tBest{font-size:8px;margin-top:7px}.foot{font-size:7px;margin-top:7px}.rCard{padding:13px 16px}.rKm b{font-size:53px}.resultFish{width:85px;height:85px;top:40px}.resultMast{padding-bottom:10px}.rTitle{margin:9px 0}.rCause{padding:8px 10px;margin-bottom:8px}.rCause p{font-size:13px}.rBest{margin-bottom:10px}.companyMark{margin-top:6px;width:90px}}
@media(orientation:landscape) and (max-height:500px){.stage{width:min(100vw,calc(100dvh * .78))}.title{overflow:auto;justify-content:flex-start;gap:12px;touch-action:pan-y}.tMain{margin:0}.tLogo{font-size:44px}.tLead{font-size:9px}.tBottom{margin-top:65px}.result{align-items:flex-start}.rCard{max-height:calc(100dvh - 24px)}}
@media(prefers-reduced-motion:reduce){.rCard,.banner.show,.pop.show,.jumps.empty i{animation:none}.banner.show,.pop.show{opacity:1}}

body[data-screen="resultScreen"] .snd{display:none}.go:disabled{opacity:.7;cursor:wait}.go:disabled:after{content:"…"}

/* タイトル: 海から跳び出す主役と、遊び方のチケット。 */
.title{background:radial-gradient(ellipse at 68% 39%,#59c3ce55 0,transparent 55%),linear-gradient(160deg,#073449 0%,#0d6885 47%,#6acbd0 100%);isolation:isolate}.title:before{content:'';position:absolute;inset:0;z-index:-1;background:repeating-linear-gradient(115deg,transparent 0 62px,#dcffff05 63px 64px,transparent 65px 120px);mask-image:linear-gradient(#000,transparent 70%)}.tTop{position:relative;z-index:4;border-color:#d4ffff35}.tMain{margin:20px 0 auto;flex-shrink:0;z-index:3}.tSub{font-size:10px;color:#d0f4e8;letter-spacing:.12em}.tLogo{font-family:"Manbo Display",var(--font);font-weight:400;font-size:clamp(56px,19vw,83px);line-height:1.02;letter-spacing:-.06em;color:#ffed92;text-shadow:0 5px #073e50,3px 0 #073e50,-3px 0 #073e50;filter:drop-shadow(0 7px 10px #032b4544);transform:rotate(-5deg);transform-origin:left center}.tLogo span{font-size:.57em;letter-spacing:.015em;color:#fffef2;margin-top:4px;text-shadow:0 3px #073e50,2px 0 #073e50,-2px 0 #073e50}.tLead{font-size:10px;margin-top:14px;font-weight:600;color:#c2e9e9;letter-spacing:.015em}.titleOcean{position:absolute;inset:218px 0 250px;z-index:1;pointer-events:none}.oceanHalo{position:absolute;width:360px;height:360px;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(ellipse,#84ecec45,transparent 65%);filter:blur(8px)}.orbit{position:absolute;left:50%;top:50%;border:1px solid #b8ffff22;border-radius:50%;transform:translate(-50%,-50%) rotate(-25deg);width:290px;height:170px;box-shadow:0 0 0 18px #a7ffff03,0 0 0 40px #a7ffff03}.orbitTwo{width:360px;height:230px;border-color:#b8ffff11;transform:translate(-50%,-50%) rotate(-25deg)}.titleFish{position:absolute;left:50%;top:46%;width:280px;height:280px;object-fit:contain;transform:translate(-50%,-50%) rotate(13deg);filter:drop-shadow(12px 24px 10px #063c5366);animation:titleFloat 5s ease-in-out infinite}.titleJelly,.titlePoison{position:absolute;object-fit:contain;filter:drop-shadow(0 4px 7px #173c5e22);opacity:.83;animation:jellyDrift 6s ease-in-out infinite}.titleJelly{width:73px;height:105px;left:12px;top:6%;transform:rotate(-15deg)}.titlePoison{width:55px;height:85px;right:5px;bottom:4%;transform:rotate(15deg);opacity:.48;animation-delay:-2s}.titleStreaks{position:absolute;inset:-15px 0;transform:rotate(22deg);opacity:.25}.titleStreaks i{position:absolute;width:2px;height:75px;background:linear-gradient(transparent,#c2ffff,transparent);left:17%;top:30%;border-radius:2px}.titleStreaks i:nth-child(2){left:26%;top:4%;height:40px}.titleStreaks i:nth-child(3){left:81%;top:4%;height:115px}.titleStreaks i:nth-child(4){left:76%;top:65%;height:47px}.titleStreaks i:nth-child(5){left:12%;top:75%;height:54px}.speedTicket{position:absolute;bottom:5%;left:22px;transform:rotate(-7deg);border-left:2px solid #ffed92;padding:4px 10px;color:#f7ffea;text-shadow:0 2px #0a4e6380}.speedTicket>small{display:block;font-size:8px;letter-spacing:.04em;color:#b9e6df;margin-bottom:4px}.speedTicket>b{font:800 22px system-ui;letter-spacing:-.03em;white-space:nowrap}.speedTicket b i{font:600 8px system-ui;letter-spacing:0}.speedTicket b span{font-size:16px;color:#ffed92;margin:0 8px}.oceanBubbles{position:absolute;inset:0}.oceanBubbles i{position:absolute;border:1px solid #d6ffff77;border-radius:50%;width:7px;height:7px;left:80%;top:45%}.oceanBubbles i:nth-child(2){width:4px;height:4px;left:86%;top:37%;opacity:.6}.oceanBubbles i:nth-child(3){width:10px;height:10px;left:20%;top:70%;opacity:.5}.oceanBubbles i:nth-child(4){width:4px;height:4px;left:14%;top:81%;opacity:.7}.tBottom{background:#f4fbef;color:#173f3b;border-radius:12px 12px 5px 5px;border:1px solid #fffbe4;box-shadow:0 12px 30px #06394b33;padding:12px 14px 11px;z-index:4;flex-shrink:0;position:relative}.tBottom:before,.tBottom:after{content:'';position:absolute;top:36px;width:13px;height:13px;border-radius:50%;background:#298a9d;box-shadow:inset 0 1px 3px #0c566345}.tBottom:before{left:-7px}.tBottom:after{right:-7px}.ticketHead{display:flex;justify-content:space-between;align-items:center;border-bottom:1px dashed #bbcec3;padding-bottom:10px;margin-bottom:11px}.ticketHead span{font:750 8px system-ui;letter-spacing:.14em;color:#4a7f6d}.ticketHead i{font-style:normal;font-size:8px;color:#6c8a7c}.howQuick{gap:8px;margin-bottom:10px}.howQuick>div{border:0;padding:0;background:none;gap:7px;align-items:flex-start}.howQuick>div:first-child{border-right:1px solid #d6e2d7;padding-right:6px}.howQuick>div>span{font-size:19px;min-width:22px;padding-top:3px}.howQuick b{font-size:9px;white-space:normal}.howQuick small{font-size:7px;color:#739082;line-height:1.5}.foodGuide{font-size:8px;color:#5b7d71;gap:7px;justify-content:flex-start;flex-wrap:wrap}.foodGuide span:last-child{margin-left:auto}.foodDot{background:#ed92b7;box-shadow:none}.poisonDot{background:#8a54b6}.howMore{color:#547767;margin:6px 0 9px}.howMore summary{min-height:19px;font-size:8px}.howMore summary:after{color:#598a74}.howMore .how{background:#e2ece1;color:#486b5a;border:1px solid #ccddcb;max-height:94px;font-size:9px;padding:7px 10px}.tBottom .go{background:#1e6752;color:#f2ffe9;border:1px solid #1b5a47;box-shadow:0 4px #0d4438;font-family:"Manbo Display",var(--font);font-weight:400;font-size:17px;border-radius:5px;min-height:51px;padding:11px 15px}.tBest{color:#547c65;font-size:8px;margin-top:10px;font-weight:650}.foot{font-size:7px;color:#718d7d;margin-top:8px;line-height:1.6;opacity:1}.tTop .brand i{color:#8db4bc}.title+.snd{color:#fff}.snd{backdrop-filter:blur(4px)}body[data-screen="titleScreen"] .snd{top:calc(64px + env(safe-area-inset-top));right:22px;background:#0a425266;border-color:#a2d8dc55;color:#c8ece5;font-size:8px;min-height:28px;padding:5px 8px}
@keyframes titleFloat{0%,100%{transform:translate(-50%,-50%) rotate(13deg)}50%{transform:translate(-50%,-53%) rotate(8deg)}}@keyframes jellyDrift{0%,100%{translate:0 0}50%{translate:0 -9px}}
@media(max-height:720px){.title{padding:calc(10px + env(safe-area-inset-top)) 17px calc(12px + env(safe-area-inset-bottom))}.tMain{margin-top:13px}.tLogo{font-size:clamp(46px,17vw,63px);margin-top:9px}.tSub{font-size:8px}.tLead{font-size:8px;margin-top:9px}.titleOcean{inset:173px 0 220px}.titleFish{width:210px;height:210px;top:44%;left:56%}.titleJelly{width:47px;height:74px;left:9px;top:4%}.titlePoison{width:36px;height:60px;right:6px;bottom:5%}.oceanHalo{width:260px;height:260px}.orbitOne{width:220px;height:120px}.orbitTwo{width:280px;height:155px}.speedTicket{bottom:3%;left:17px;padding:2px 7px}.speedTicket>b{font-size:16px}.speedTicket>small{font-size:7px}.speedTicket b span{margin:0 5px;font-size:13px}.tBottom{padding:10px 12px 9px;border-radius:10px 10px 4px 4px}.ticketHead{padding-bottom:7px;margin-bottom:9px}.ticketHead span,.ticketHead i{font-size:7px}.howQuick{margin-bottom:6px}.howQuick>div{padding:0;gap:5px}.howQuick>div>span{font-size:16px;min-width:19px}.howQuick b{font-size:8px}.howQuick small{font-size:6.5px}.foodGuide{font-size:7px}.howMore{margin:4px 0 6px}.howMore summary{font-size:7px;min-height:18px}.tBottom .go{min-height:43px;font-size:15px;padding:8px 12px}.tBest{font-size:7px;margin-top:8px}.foot{font-size:6px;margin-top:6px}.tBottom:before,.tBottom:after{top:29px;width:10px;height:10px}.tBottom:before{left:-5px}.tBottom:after{right:-5px}}
@media(max-height:600px) and (orientation:portrait){.titleOcean{inset:157px 0 210px}.titleFish{width:170px;height:170px;top:44%;left:57%}.titleJelly{width:36px;height:57px}.titlePoison{width:30px;height:47px}.speedTicket{bottom:2%;left:13px}.speedTicket>b{font-size:13px}.speedTicket>small{font-size:6px}.speedTicket b i{font-size:6px}.speedTicket b span{font-size:10px}.orbitOne{width:180px;height:100px}.orbitTwo{width:230px;height:125px}.tLogo{font-size:47px}.tLead{font-size:7px}}
@media(orientation:landscape) and (max-height:500px){.title{gap:10px;overflow:auto}.tMain{margin:0}.tLogo{font-size:45px}.titleOcean{top:135px;bottom:auto;height:115px}.titleFish{width:160px;height:160px;left:62%;top:45%}.titleJelly,.titlePoison{display:none}.speedTicket{left:20px;bottom:15%;font-size:12px}.speedTicket>b{font-size:12px}.tBottom{margin-top:115px}.orbitOne{width:180px;height:90px}.orbitTwo{width:230px;height:120px}}
@media(prefers-reduced-motion:reduce){.titleFish,.titleJelly,.titlePoison{animation:none}}
@font-face{font-family:"Manbo Display";src:url(fonts/manbo-display.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
[hidden]{display:none!important}.srOnly{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.powerHud{grid-column:1/-1;display:flex;align-items:center;gap:7px;margin-top:9px;background:#153c49e8;border:1px solid #ffe393b8;border-radius:6px;padding:7px 10px;max-width:220px;box-shadow:0 0 18px #ffd96a20}.powerHud>img{width:28px;height:37px;object-fit:contain}.powerHud>div{flex:1;display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:5px 12px}.powerHud span{font:400 10px "Manbo Display",var(--font);background:linear-gradient(90deg,#ffc9ca,#fff096,#a3ffdd,#b9d9ff,#ebbbff);background-clip:text;-webkit-background-clip:text;color:transparent;white-space:nowrap}.powerHud b{font:800 12px system-ui;color:#fff6bd;white-space:nowrap}.powerTrack{grid-column:1/-1;height:5px;background:#ffffff18;border-radius:4px;overflow:hidden}.powerTrack i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#ff91aa,#ffe16a,#8dffbf,#78ddff,#d5a1ff);border-radius:4px}.powerHud.ending{border-color:#ffd78c}.powerHud.ending span{background:none;color:#ffe0a2}.powerHud.ending .powerTrack{animation:powerEnding .4s steps(1) infinite}.goldDot{display:inline-block;width:7px;height:7px;background:#f3c53d;border:1px solid #bf8c23;border-radius:50%}.foodGuide .goldGuide{color:#946c19;margin-left:0;white-space:nowrap}.foodGuide span:last-child{margin-left:0}.foodGuide{column-gap:10px;row-gap:3px}.titleFish{filter:drop-shadow(10px 20px 12px #073e4655)}@keyframes powerEnding{50%{opacity:.35}}@media(max-height:720px){.foodGuide{font-size:7px;column-gap:6px}.powerHud{padding:5px 8px;max-width:205px}.powerHud>img{width:24px;height:31px}.powerHud span{font-size:9px}}@media(prefers-reduced-motion:reduce){.powerHud.ending .powerTrack{animation:none}}
.powerHud{position:absolute;left:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:3;min-width:205px;margin:0;pointer-events:none}.titleFish{top:51%}.titleJelly{top:12%}@media(max-height:720px){.titleFish{top:51%}.titleJelly{top:12%}}@media(max-height:600px) and (orientation:portrait){.titleFish{top:52%}}@media(orientation:landscape) and (max-height:500px){.powerHud{left:12px;bottom:10px;min-width:190px}.titleFish{top:45%}}