:root{color-scheme:dark;--deep:#080e22;--navy:#10183b;--panel:#151e43;--panel-2:#1c2753;--line:#53639c;--lilac:#b8c7ff;--blue:#76d7ff;--coral:#ff777d;--cream:#fff8ec;--muted:#aab8db}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-width:300px;background:radial-gradient(circle at 52% 24%,#2b235f 0,transparent 32%),radial-gradient(circle at 97% 1%,#193e79 0,transparent 25%),var(--deep);color:var(--cream);font-family:"Trebuchet MS","Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased}
button{font:inherit;cursor:pointer}a{color:inherit}img{display:block;max-width:100%}::selection{background:var(--coral);color:var(--deep)}:focus-visible{outline:3px solid var(--blue);outline-offset:4px}
.skip-link{position:absolute;z-index:100;top:-80px;left:20px;padding:12px 18px;border-radius:10px;background:var(--cream);color:var(--deep)}.skip-link:focus{top:12px}
.page-shell{position:relative;z-index:1;width:min(1540px,calc(100% - 64px));margin:auto}
.ocean-bubbles{position:fixed;inset:0;overflow:hidden;pointer-events:none}.ocean-bubbles i{position:absolute;bottom:-60px;width:var(--size);height:var(--size);border:2px solid rgba(118,215,255,.35);border-radius:50%;background:radial-gradient(circle at 30% 28%,rgba(255,255,255,.45),transparent 58%);box-shadow:inset -4px -6px 9px rgba(76,134,231,.12);animation:bubble-up var(--time) linear infinite;left:var(--left);animation-delay:var(--delay)}.ocean-bubbles i:nth-child(1){--size:26px;--time:19s;--left:4%;--delay:-7s}.ocean-bubbles i:nth-child(2){--size:12px;--time:14s;--left:17%;--delay:-10s}.ocean-bubbles i:nth-child(3){--size:38px;--time:24s;--left:29%;--delay:-16s}.ocean-bubbles i:nth-child(4){--size:18px;--time:17s;--left:42%;--delay:-4s}.ocean-bubbles i:nth-child(5){--size:31px;--time:22s;--left:61%;--delay:-12s}.ocean-bubbles i:nth-child(6){--size:11px;--time:15s;--left:75%;--delay:-2s}.ocean-bubbles i:nth-child(7){--size:43px;--time:26s;--left:89%;--delay:-17s}.ocean-bubbles i:nth-child(8){--size:18px;--time:20s;--left:97%;--delay:-8s}
.topbar{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:18px;border-bottom:1px solid rgba(184,199,255,.2)}.back-link,.wordmark{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-size:12px;font-weight:900;letter-spacing:.1em}.back-link{color:var(--lilac)}.back-link span{font-size:22px;line-height:0;transition:translate .2s}.back-link:hover span{translate:-5px 0}.wordmark{font-size:15px}.wordmark strong{color:var(--coral)}.save-badge{display:flex;align-items:center;gap:9px;color:var(--blue);font-size:11px;font-weight:900;letter-spacing:.12em}.save-dot{width:8px;height:8px;border-radius:50%;background:var(--blue);box-shadow:0 0 10px var(--blue);animation:dot-pulse 2s ease-in-out infinite}.save-badge.is-error{color:var(--coral)}.save-badge.is-error .save-dot{background:var(--coral);box-shadow:0 0 10px var(--coral);animation:none}
.masthead{display:flex;align-items:end;justify-content:space-between;gap:30px;padding:56px 0 46px}.eyebrow,.tiny-label{color:var(--lilac);font-size:11px;font-weight:900;letter-spacing:.18em}.eyebrow{margin:0 0 16px}.eyebrow span{color:var(--coral);padding:0 7px}.masthead h1{margin:0;font-size:clamp(62px,7.7vw,128px);font-weight:1000;line-height:.84;letter-spacing:-.09em}.masthead h1 em{font-style:normal;color:var(--coral);text-shadow:6px 7px 0 #58306d}.masthead h1 em span{color:var(--lilac)}.masthead-sub{margin:26px 0 0;color:var(--muted);font-size:clamp(14px,1.35vw,18px);font-weight:800}.masthead-stamp{width:148px;height:148px;flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;border:4px solid var(--navy);border-radius:50%;background:var(--lilac);color:var(--navy);box-shadow:8px 9px 0 var(--coral);transform:rotate(12deg);animation:stamp-bob 4s ease-in-out infinite}.masthead-stamp span{font-size:39px;font-weight:1000;line-height:.9}.masthead-stamp b{font-size:13px;letter-spacing:.06em}.masthead-stamp small{margin-top:6px;font-size:8px;font-weight:900}
.game-layout{display:grid;grid-template-columns:minmax(250px,.9fr) minmax(390px,1.5fr) minmax(300px,1.04fr);gap:18px;align-items:stretch}.panel,.click-zone,.lower-panel{border:1px solid rgba(184,199,255,.27);border-radius:25px;background:linear-gradient(150deg,rgba(28,39,83,.94),rgba(14,22,51,.96));box-shadow:0 20px 50px rgba(0,0,0,.17),inset 0 1px 0 rgba(255,255,255,.06)}.panel{padding:22px}.panel-heading,.click-topline{display:flex;justify-content:space-between;gap:9px;color:var(--lilac);font-size:10px;font-weight:900;letter-spacing:.13em}.panel-heading span:last-child{color:var(--coral);font-size:20px;line-height:.5}.balance-block{margin:45px 0 29px}.balance-line{display:flex;align-items:center;gap:12px;margin:8px 0 5px}.balance-line strong{font-size:clamp(41px,4vw,64px);line-height:1;letter-spacing:-.08em;overflow-wrap:anywhere}.shell-icon{width:39px;height:39px;flex:none;display:grid;place-items:center;border-radius:50%;background:var(--coral);color:var(--deep);font-size:33px;line-height:1;transform:rotate(-35deg);box-shadow:3px 4px 0 #ad495e}.balance-block p{margin:8px 0 0;color:var(--blue);font-size:12px;font-weight:900}.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.stats-grid>div{min-height:77px;padding:13px;border:1px solid rgba(184,199,255,.18);border-radius:13px;background:rgba(184,199,255,.05)}.stats-grid span,.depth-top span{display:block;color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.08em}.stats-grid strong{display:block;margin-top:7px;font-size:23px;letter-spacing:-.06em;overflow-wrap:anywhere}.depth-card{margin-top:28px;padding:18px;border-radius:15px;background:#273261}.depth-top{display:flex;justify-content:space-between;gap:8px;align-items:baseline}.depth-top strong{color:var(--coral);font-size:15px;text-align:right}.depth-track{height:13px;overflow:hidden;margin:14px 0 9px;padding:2px;border:1px solid var(--lilac);border-radius:99px;background:#11193d}.depth-track span{display:block;width:0;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--coral),#ffb192);transition:width .3s}.depth-card small{color:var(--muted);font-size:11px}.status-note{display:flex;gap:13px;align-items:flex-start;margin-top:24px}.note-star{color:var(--coral);font-size:25px}.status-note p{margin:0;color:var(--muted);font-size:12px;line-height:1.55}
.click-zone{position:relative;min-height:610px;overflow:hidden;display:flex;flex-direction:column;padding:22px;background:radial-gradient(circle at 50% 40%,#423b87 0,#222c66 33%,#111b42 76%)}.click-zone::before{content:"";position:absolute;inset:0;opacity:.11;background-image:linear-gradient(#aec3ff 1px,transparent 1px),linear-gradient(90deg,#aec3ff 1px,transparent 1px);background-size:40px 40px;mask-image:radial-gradient(circle,#000 5%,transparent 76%)}.click-topline,.click-bottom{position:relative;z-index:2}.click-topline span:last-child{color:var(--coral)}.squid-stage{position:relative;flex:1;min-height:435px;display:grid;place-items:center;isolation:isolate}.stage-glow{position:absolute;width:min(90%,480px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(255,116,146,.23),rgba(93,74,200,.31) 38%,transparent 72%);filter:blur(7px);animation:glow-pulse 5s ease-in-out infinite}.stage-ring{position:absolute;width:min(85%,440px);aspect-ratio:1;border:2px dashed rgba(184,199,255,.37);border-radius:50%;animation:spin 35s linear infinite}.ring-b{width:min(97%,510px);border:1px dotted rgba(118,215,255,.23);animation-direction:reverse;animation-duration:48s}.stage-star{position:absolute;color:var(--lilac);font-size:42px;animation:star-spin 12s linear infinite}.star-a{top:14%;left:8%}.star-b{top:21%;right:5%;color:var(--coral);font-size:61px;animation-direction:reverse}.star-c{bottom:8%;left:12%;font-size:29px}.squid-button{position:relative;z-index:2;width:min(95%,480px);aspect-ratio:1;padding:0;border:0;background:transparent;filter:drop-shadow(0 28px 25px rgba(0,4,26,.55)) drop-shadow(0 0 18px rgba(255,115,130,.27));touch-action:manipulation;animation:squid-float 5s ease-in-out infinite;transition:filter .2s,scale .12s}.squid-button:hover{scale:1.045;filter:drop-shadow(0 34px 28px rgba(0,4,26,.58)) drop-shadow(0 0 35px rgba(255,115,130,.45))}.squid-button:active,.squid-button.popped{scale:.93}.squid-button img{width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none;pointer-events:none}.tap-hint{position:absolute;right:7%;bottom:9%;z-index:3;padding:8px 11px;border-radius:5px;background:var(--coral);color:var(--navy);font-size:11px;font-weight:1000;letter-spacing:.1em;transform:rotate(-9deg);pointer-events:none;animation:hint-bob 3s ease-in-out infinite}.floating-layer{position:absolute;inset:0;pointer-events:none;z-index:5}.float-number{position:absolute;color:var(--cream);font-size:29px;font-weight:1000;white-space:nowrap;text-shadow:3px 4px 0 #733d8d;animation:float-away 1.1s ease-out forwards}.float-number.critical{color:var(--blue);font-size:38px}.sparkle{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--blue);box-shadow:0 0 12px var(--blue);animation:spark-away .8s ease-out forwards}.click-bottom{display:flex;justify-content:space-between;gap:10px;color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.08em}.click-bottom span:last-child{color:var(--blue);white-space:nowrap}.lucky-squid{position:absolute;z-index:6;left:50%;bottom:64px;transform:translateX(-50%) rotate(-3deg);width:max-content;max-width:95%;padding:13px 15px;border:2px solid var(--cream);border-radius:13px;background:#ffd170;color:var(--navy);box-shadow:5px 6px 0 #b25a78;font-size:12px;font-weight:1000;letter-spacing:.04em;animation:lucky-bounce 1.2s ease-in-out infinite}.lucky-squid[hidden]{display:none}
.shop-panel{display:flex;flex-direction:column;min-height:610px}.shop-head{display:flex;justify-content:space-between;align-items:center;margin:28px 0 16px}.shop-head h2,.lower-heading h2{margin:4px 0 0;font-size:clamp(28px,2.8vw,42px);line-height:1;letter-spacing:-.07em}.shop-head img{width:68px;height:68px;object-fit:contain;filter:drop-shadow(0 6px 6px rgba(0,0,0,.4))}.quantity-picker{display:flex;gap:7px;margin-bottom:13px}.quantity-picker button{flex:1;min-height:34px;border:1px solid rgba(184,199,255,.36);border-radius:9px;background:#1d2753;color:var(--lilac);font-size:11px;font-weight:900}.quantity-picker button.selected{background:var(--lilac);color:var(--navy)}.shop-list{display:flex;flex-direction:column;gap:9px;max-height:440px;overflow-y:auto;padding:1px 4px 4px 1px;scrollbar-color:#53639c transparent;scrollbar-width:thin}.shop-item{width:100%;min-height:81px;display:flex;align-items:center;gap:11px;padding:9px 10px;border:1px solid rgba(184,199,255,.24);border-radius:13px;background:#26325d;color:var(--cream);text-align:left;transition:transform .16s,background .16s,border-color .16s}.shop-item:hover:not(:disabled){transform:translateX(-3px);border-color:var(--blue);background:#34427b}.shop-item:active:not(:disabled){transform:scale(.985)}.shop-item:disabled{cursor:not-allowed;opacity:.55}.shop-icon{width:52px;height:52px;flex:none;display:grid;place-items:center;border-radius:12px;background:var(--tile,#4b5e9e);font-size:29px;box-shadow:3px 4px 0 rgba(0,0,0,.2)}.shop-info{min-width:0;flex:1}.shop-info strong{display:block;font-size:14px}.shop-info small{display:block;margin-top:3px;color:var(--muted);font-size:10px;line-height:1.25}.shop-price{display:flex;flex-direction:column;align-items:end;gap:4px;flex:none;color:var(--blue);font-size:12px;font-weight:1000}.shop-price small{color:var(--cream);font-size:10px}.shop-price em{font-style:normal;color:var(--coral)}.shop-locked{filter:grayscale(.5)}
.lower-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.lower-panel{min-height:345px;padding:24px}.lower-heading>span{color:var(--lilac);font-size:10px;font-weight:900;letter-spacing:.15em}.lower-heading h2{margin-top:9px}.upgrade-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:24px}.upgrade-item{min-height:82px;display:flex;align-items:center;gap:11px;padding:10px 12px;border:1px solid rgba(184,199,255,.25);border-radius:13px;background:#25315e;color:var(--cream);text-align:left}.upgrade-item:hover:not(:disabled){border-color:var(--coral);background:#344077}.upgrade-item:disabled{opacity:.52;cursor:not-allowed}.upgrade-item.purchased{border-color:rgba(118,215,255,.5);background:#183c58;opacity:.8}.upgrade-symbol{width:39px;height:39px;flex:none;display:grid;place-items:center;border-radius:9px;background:var(--coral);color:var(--navy);font-size:22px;font-weight:1000}.upgrade-item strong,.upgrade-item small{display:block}.upgrade-item strong{font-size:13px}.upgrade-item small{margin-top:4px;color:var(--muted);font-size:10px}.upgrade-cost{margin-left:auto;color:var(--blue);font-size:11px;font-weight:900;white-space:nowrap}.upgrade-item.purchased .upgrade-cost{color:var(--blue)}.achievement-count{margin:13px 0 0;color:var(--blue);font-size:11px;font-weight:900;letter-spacing:.1em}.achievement-list{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:17px}.achievement{min-height:86px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:8px;border:1px solid rgba(184,199,255,.2);border-radius:13px;background:#222b56;text-align:center}.achievement:not(.unlocked){filter:grayscale(1);opacity:.38}.achievement span{font-size:25px}.achievement strong{font-size:10px;line-height:1.15}.achievement.unlocked{border-color:var(--coral);background:#49305e;box-shadow:inset 0 0 20px rgba(255,119,125,.11)}.bottom-strip{display:flex;justify-content:space-between;gap:20px;align-items:center;margin:18px 0 0;padding:23px 4px;border-top:1px solid rgba(184,199,255,.2);color:var(--lilac);font-size:13px;font-weight:900;letter-spacing:.1em}.bottom-strip button{padding:6px 0;border:0;border-bottom:1px dashed var(--muted);background:transparent;color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.08em}.bottom-strip button:hover{color:var(--coral);border-color:var(--coral)}footer{display:flex;justify-content:space-between;gap:20px;padding:19px 0 35px;border-top:1px solid rgba(184,199,255,.15);color:var(--muted);font-size:11px;font-weight:900;letter-spacing:.08em}footer a{text-decoration:none;color:var(--lilac)}footer a:hover{color:var(--blue)}.toast{position:fixed;z-index:20;left:50%;bottom:26px;max-width:min(90vw,500px);padding:13px 18px;border:2px solid var(--navy);border-radius:14px;background:var(--cream);color:var(--navy);box-shadow:7px 7px 0 var(--coral);font-size:13px;font-weight:900;text-align:center;transform:translate(-50%,140px);opacity:0;transition:transform .3s,opacity .3s;pointer-events:none}.toast.show{transform:translate(-50%,0);opacity:1}
@keyframes bubble-up{to{transform:translateY(calc(-100vh - 120px)) translateX(80px)}}@keyframes dot-pulse{50%{opacity:.42;box-shadow:0 0 2px var(--blue)}}@keyframes stamp-bob{50%{transform:rotate(5deg) translateY(-11px)}}@keyframes glow-pulse{50%{scale:1.1;opacity:.64}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes star-spin{to{transform:rotate(360deg)}}@keyframes squid-float{50%{transform:translateY(-13px) rotate(2deg)}}@keyframes hint-bob{50%{transform:rotate(-5deg) translateY(-9px)}}@keyframes float-away{0%{transform:translate(-50%,0) scale(.65);opacity:0}20%{opacity:1;transform:translate(-50%,-20px) scale(1.08)}100%{transform:translate(-50%,-115px) scale(.85);opacity:0}}@keyframes spark-away{to{transform:translate(var(--dx),var(--dy)) scale(.15);opacity:0}}@keyframes lucky-bounce{50%{transform:translateX(-50%) rotate(3deg) translateY(-8px)}}
@media(max-width:1190px){.game-layout{grid-template-columns:minmax(250px,.8fr) minmax(400px,1.2fr)}.shop-panel{grid-column:1/-1;min-height:0}.shop-list{display:grid;grid-template-columns:repeat(2,1fr);max-height:none}.shop-head{margin-top:15px}}
@media(max-width:800px){.page-shell{width:min(100% - 30px,620px)}.topbar{min-height:70px}.wordmark{font-size:12px}.save-badge{display:none}.masthead{padding:44px 0 32px}.masthead h1{font-size:clamp(63px,11vw,89px)}.masthead-stamp{width:102px;height:102px;border-width:3px;box-shadow:5px 6px 0 var(--coral)}.masthead-stamp span{font-size:26px}.masthead-stamp b{font-size:9px}.masthead-stamp small{font-size:6px}.game-layout{grid-template-columns:1fr}.status-panel{order:2}.click-zone{order:1;min-height:0}.shop-panel{order:3;grid-column:auto}.squid-stage{min-height:420px}.lower-grid{grid-template-columns:1fr}.balance-block{margin:26px 0}.status-note{margin-top:16px}}
@media(max-width:500px){.page-shell{width:calc(100% - 20px)}.back-link{font-size:9px;letter-spacing:.04em}.back-link span{font-size:17px}.wordmark{gap:4px;font-size:10px;letter-spacing:.04em}.wordmark img{width:26px;height:26px}.masthead{align-items:flex-start;gap:5px;padding:34px 4px 26px}.masthead h1{font-size:clamp(52px,12.7vw,68px)}.masthead-sub{max-width:300px;margin-top:20px;font-size:13px;line-height:1.5}.masthead-stamp{width:78px;height:78px;margin-top:12px;transform:rotate(12deg)}.masthead-stamp span{font-size:21px}.masthead-stamp b{font-size:7px}.masthead-stamp small{display:none}.game-layout,.lower-grid{gap:12px}.panel,.click-zone,.lower-panel{border-radius:18px}.panel,.click-zone,.lower-panel{padding:17px}.click-topline,.click-bottom{font-size:8px}.squid-stage{min-height:310px}.squid-button{width:min(93%,340px)}.tap-hint{right:2%;bottom:4%;font-size:9px}.shop-list{grid-template-columns:1fr}.upgrade-list{grid-template-columns:1fr}.achievement-list{grid-template-columns:repeat(4,1fr);gap:5px}.achievement{min-height:75px;padding:5px}.achievement span{font-size:21px}.achievement strong{font-size:8px}.bottom-strip{align-items:flex-start;flex-direction:column}.lucky-squid{bottom:44px;font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.ocean-bubbles,.floating-layer{display:none}}

.prestige-panel{position:relative;overflow:hidden;display:grid;grid-template-columns:125px 1fr minmax(230px,.45fr);align-items:center;gap:26px;margin-top:18px;padding:28px 34px;border:1px solid rgba(184,199,255,.38);border-radius:25px;background:radial-gradient(circle at 8% 50%,rgba(255,119,125,.26),transparent 29%),linear-gradient(115deg,#302052,#182855 75%);box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}
.prestige-panel::after{content:"";position:absolute;right:19%;top:-55px;pointer-events:none}
.prestige-pearl{position:relative;z-index:1;width:118px;height:118px;display:grid;place-items:center;border:3px solid var(--cream);border-radius:50%;background:radial-gradient(circle at 33% 25%,#fff,#c6d8ff 36%,#8178d5 74%);color:#5c548f;box-shadow:8px 9px 0 #6e4388,0 0 35px rgba(184,199,255,.3);font-size:65px;line-height:1;animation:pearl-float 5s ease-in-out infinite}
.prestige-copy,.prestige-actions{position:relative;z-index:1}.prestige-copy>span{color:var(--lilac);font-size:10px;font-weight:900;letter-spacing:.15em}.prestige-copy h2{margin:8px 0 10px;font-size:clamp(27px,3vw,44px);line-height:1;letter-spacing:-.07em}.prestige-copy p{max-width:540px;margin:0;color:var(--muted);font-size:13px;line-height:1.6}
.prestige-actions{display:flex;flex-direction:column;align-items:stretch;gap:5px}.prestige-actions strong{color:var(--cream);font-size:22px;letter-spacing:-.04em}.prestige-actions small{color:var(--lilac);font-size:10px;font-weight:900}.prestige-actions button{min-height:48px;margin:10px 0 4px;padding:10px 13px;border:0;border-radius:11px;background:var(--lilac);color:var(--navy);box-shadow:0 5px 0 #7181bb;font-size:11px;font-weight:1000;letter-spacing:.05em;transition:transform .18s}.prestige-actions button:hover:not(:disabled){transform:translateY(-3px)}.prestige-actions button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.prestige-actions small:last-child{color:var(--muted);line-height:1.35}
@keyframes pearl-float{50%{transform:translateY(-8px) rotate(7deg)}}
@media(max-width:800px){.prestige-panel{grid-template-columns:85px 1fr;gap:18px;padding:22px}.prestige-pearl{width:78px;height:78px;font-size:46px}.prestige-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;align-items:center}.prestige-actions button{grid-column:1/-1}.prestige-actions small:last-child{grid-column:1/-1}}
@media(max-width:500px){.prestige-panel{grid-template-columns:70px 1fr;gap:13px;margin-top:12px;padding:18px;border-radius:18px}.prestige-pearl{width:67px;height:67px;font-size:39px}.prestige-copy h2{font-size:27px}.prestige-copy p{font-size:11px}.prestige-actions strong{font-size:18px}}
/* Every pictorial UI element uses the generated, transparent asset atlases. */
.sprite{display:inline-block;flex:none;background-repeat:no-repeat;background-size:300% 300%}
.crew-art{background-image:url("../assets/ocean-crew-rpg-v8.webp")}
.ui-art{background-image:url("../assets/ocean-ui-rpg-v8.webp")}
.pos-0{background-position:0% 0%}.pos-1{background-position:50% 0%}.pos-2{background-position:100% 0%}
.pos-3{background-position:0% 50%}.pos-4{background-position:50% 50%}.pos-5{background-position:100% 50%}
.pos-6{background-position:0% 100%}.pos-7{background-position:50% 100%}.pos-8{background-position:100% 100%}
.eyebrow{display:flex;align-items:center;gap:8px}.eyebrow-pearl{width:19px;height:19px;padding:0!important}
.heading-art{width:29px;height:29px;margin-top:-10px}
.shell-icon{width:54px;height:54px;border:0;background-color:transparent;background-image:url("../assets/ocean-ui-rpg-v8.webp");box-shadow:none;transform:none}
.note-art{width:32px;height:32px}
.stage-star{width:53px;height:53px}.star-b{width:66px;height:66px}.star-c{width:41px;height:41px}
.price-row{display:flex;align-items:center;justify-content:flex-end;gap:2px}.price-art{width:18px;height:18px}.shop-art{width:52px;height:52px}
.shop-icon{overflow:visible}.shop-info .milestone{color:#90ddff;font-size:9px;font-weight:900}.shop-item:disabled .milestone{color:#b8c7ff}
.upgrade-symbol{background:transparent;box-shadow:none}.upgrade-art{width:44px;height:44px}.upgrade-info{min-width:0}.upgrade-cost{display:inline-flex;align-items:center;gap:1px}.upgrade-item.maxed .price-art,.upgrade-item.upgrade-locked .price-art{display:none}
.achievement-icon{display:block;width:37px;height:37px}.achievement-art{width:37px;height:37px}
.prestige-pearl{background-color:transparent;background-image:url("../assets/ocean-ui-rpg-v8.webp");background-size:300% 300%;border-color:rgba(255,255,255,.72)}
.lucky-squid{display:flex;align-items:center;gap:7px}.lucky-art{width:34px;height:34px}.lucky-squid[hidden]{display:none}
.combo-bar{position:relative;z-index:2;margin-top:23px;padding:12px 14px;border:1px solid rgba(184,199,255,.25);border-radius:13px;background:rgba(14,24,55,.6)}
.combo-label{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--lilac);font-size:10px;font-weight:900;letter-spacing:.08em}.combo-label strong{color:var(--cream);font-size:12px}.combo-track{height:10px;overflow:hidden;margin:9px 0 4px;border:1px solid rgba(184,199,255,.55);border-radius:99px;background:#10183b}.combo-track span{display:block;width:0;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--blue),var(--coral));transition:width .16s}.combo-bar small{color:var(--muted);font-size:10px}
.surge-button{position:relative;z-index:2;width:100%;min-height:48px;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:10px;padding:8px 15px;border:1px solid var(--blue);border-radius:12px;background:#a9e6ff;color:var(--navy);box-shadow:0 5px 0 #477cb0;font-size:11px;font-weight:1000;letter-spacing:.06em;transition:transform .2s,filter .2s}.surge-button:hover:not(:disabled){transform:translateY(-3px);filter:brightness(1.09)}.surge-button:disabled{cursor:not-allowed;opacity:.55;box-shadow:none}.surge-art{width:31px;height:31px}
.activity-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:18px;margin-top:18px}.activity-intro{margin:12px 0 20px;color:var(--muted);font-size:13px;line-height:1.5}
.mission-list{display:flex;flex-direction:column;gap:9px;max-height:475px;overflow-y:auto;padding-right:5px;scrollbar-color:#53639c transparent;scrollbar-width:thin}.mission-item{display:flex;align-items:center;gap:12px;min-height:95px;padding:12px;border:1px solid rgba(184,199,255,.23);border-radius:13px;background:#24305e}.mission-item.mission-active{border-color:var(--coral);background:#35325f}.mission-item.mission-locked{opacity:.45}.mission-item.mission-done{border-color:rgba(118,215,255,.35);background:#1d3a56}.mission-art{flex:none;width:48px;height:48px}.mission-icon{width:48px;height:48px}.mission-info{min-width:0;flex:1}.mission-info strong,.mission-info small{display:block}.mission-info strong{font-size:13px}.mission-info small{margin-top:3px;color:var(--muted);font-size:10px}.mission-track{display:block;height:7px;overflow:hidden;margin-top:8px;border-radius:99px;background:#10183b}.mission-fill{display:block;width:0;height:100%;border-radius:99px;background:var(--coral)}.mission-action{display:flex;flex-direction:column;align-items:end;gap:7px;flex:none}.mission-action small{color:var(--blue);font-size:9px;font-weight:900}.mission-action button{min-height:28px;padding:5px 8px;border:0;border-radius:7px;background:var(--lilac);color:var(--navy);font-size:9px;font-weight:900}.mission-action button:disabled{opacity:.48;cursor:not-allowed}
.dive-panel{display:flex;flex-direction:column}.dive-art{flex:1;display:flex;align-items:center;gap:22px;min-height:160px;margin-top:18px;padding:18px;border-radius:17px;background:radial-gradient(circle at 20% 50%,rgba(91,137,231,.32),transparent 58%),#202b58}.dive-art>.sprite{width:145px;height:145px;filter:drop-shadow(0 12px 15px rgba(0,0,0,.36));animation:pearl-float 5s ease-in-out infinite}.dive-art p{max-width:250px;margin:0;color:var(--muted);font-size:14px;font-weight:800;line-height:1.5}.dive-button{min-height:49px;margin-top:17px;padding:12px;border:0;border-radius:11px;background:var(--coral);color:var(--navy);box-shadow:0 5px 0 #ad536a;font-size:11px;font-weight:1000;letter-spacing:.06em}.dive-button:disabled{opacity:.52;cursor:not-allowed;box-shadow:none}.dive-choices{display:flex;justify-content:center;gap:12px;margin-top:17px}.dive-choices[hidden]{display:none}.dive-choices button{width:82px;height:82px;padding:4px;border:1px solid rgba(184,199,255,.5);border-radius:14px;background:#334072;transition:transform .2s,background .2s}.dive-choices button:hover{transform:translateY(-8px);background:#4b5598}.dive-choices .sprite{width:70px;height:70px}.dive-status{min-height:34px;margin:13px 0 0;color:var(--blue);font-size:12px;font-weight:900;line-height:1.4}
@media(max-width:800px){.activity-grid{grid-template-columns:1fr}.dive-art>.sprite{width:110px;height:110px}.mission-list{max-height:none}}
@media(max-width:500px){.activity-grid{gap:12px;margin-top:12px}.shop-art{width:50px;height:50px}.shop-info .milestone{font-size:8px}.mission-item{display:grid;grid-template-columns:42px 1fr;gap:8px}.mission-art,.mission-icon{width:42px;height:42px}.mission-action{grid-column:2;flex-direction:row;justify-content:space-between;align-items:center}.dive-art{gap:12px;min-height:130px}.dive-art>.sprite{width:90px;height:90px}.dive-art p{font-size:12px}.dive-choices button{width:71px;height:71px}.dive-choices .sprite{width:60px;height:60px}.stage-star{width:40px;height:40px}.star-b{width:49px;height:49px}.star-c{width:32px;height:32px}.combo-bar{margin-top:15px}}
.shop-item:disabled{opacity:.76}.shop-locked{filter:none}
.prestige-panel::after{content:"";width:180px;height:180px;right:18%;top:-25px;background-image:url("../assets/ocean-ui-rpg-v8.webp");background-size:300% 300%;background-position:100% 50%;opacity:.08}
@media(max-width:500px){.achievement-list{grid-template-columns:repeat(3,1fr)}.achievement strong{font-size:10px}}

.leaderboard-panel{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:26px;margin-top:18px;padding:30px;border:1px solid rgba(184,199,255,.38);border-radius:25px;background:radial-gradient(circle at 5% 5%,rgba(255,119,125,.19),transparent 35%),linear-gradient(130deg,#1c2857,#101b40);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 22px 44px rgba(0,5,30,.17)}
.leaderboard-jump{display:inline-flex;align-items:center;gap:8px;min-height:41px;margin-top:17px;padding:4px 14px 4px 5px;border:1px solid rgba(118,215,255,.65);border-radius:10px;background:#20305e;color:#a9e6ff;font-size:10px;font-weight:1000;letter-spacing:.08em;text-decoration:none;box-shadow:0 4px 0 #0a1432;transition:transform .2s,background .2s}.leaderboard-jump:hover{transform:translateY(-3px);background:#314379}.leaderboard-jump>.sprite{width:32px;height:32px}.leaderboard-panel{scroll-margin-top:20px}
.leaderboard-title{display:flex;align-items:center;gap:13px}.leaderboard-title>.sprite{width:80px;height:80px;filter:drop-shadow(0 8px 11px rgba(0,0,0,.3))}.leaderboard-title h2{margin:5px 0 0;font-size:clamp(28px,3vw,42px);line-height:1;letter-spacing:-.065em}.leaderboard-intro>p:not(.leaderboard-status){max-width:470px;margin:13px 0 20px;color:var(--muted);font-size:13px;line-height:1.55}
.nickname-form{display:grid;gap:8px;max-width:480px}.nickname-form label{color:var(--lilac);font-size:10px;font-weight:900;letter-spacing:.13em}.nickname-controls{display:flex;gap:8px}.nickname-controls input{flex:1;min-width:0;height:47px;padding:0 13px;border:1px solid rgba(184,199,255,.55);border-radius:10px;outline:none;background:#111b40;color:var(--cream);font-family:inherit;font-size:14px;font-weight:800}.nickname-controls input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(118,215,255,.18)}.nickname-controls input::placeholder{color:#8292c4}.nickname-controls button{min-width:145px;padding:0 12px;border:0;border-radius:10px;background:var(--coral);color:var(--navy);font-size:10px;font-weight:1000;letter-spacing:.04em;cursor:pointer}.nickname-controls button:hover:not(:disabled){filter:brightness(1.12)}.nickname-controls button:disabled{opacity:.55;cursor:wait}.nickname-form>small{color:var(--muted);font-size:10px;line-height:1.4}
.leaderboard-self{display:flex;flex-wrap:wrap;align-items:baseline;gap:5px 12px;max-width:480px;margin-top:20px;padding:13px 15px;border:1px solid rgba(118,215,255,.32);border-radius:11px;background:#202f5e}.leaderboard-self span{color:var(--blue);font-size:10px;font-weight:900;letter-spacing:.1em}.leaderboard-self strong{color:var(--cream);font-size:16px;font-weight:1000}.leaderboard-self small{flex-basis:100%;color:var(--muted);font-size:11px}.leaderboard-status{min-height:17px;margin:14px 0 0;color:var(--blue);font-size:11px;font-weight:800;line-height:1.4}.leaderboard-status.error{color:#ffb5bd}
.leaderboard-board{min-width:0;padding:17px;border:1px solid rgba(184,199,255,.3);border-radius:17px;background:rgba(7,15,39,.45)}.leaderboard-board-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:9px}.leaderboard-board-head span{color:var(--lilac);font-size:10px;font-weight:900;letter-spacing:.12em}.leaderboard-board-head button{padding:6px 0;border:0;border-bottom:1px dashed var(--blue);background:none;color:var(--blue);font-size:9px;font-weight:900;letter-spacing:.06em;cursor:pointer}.leaderboard-board-head button:disabled{opacity:.5;cursor:wait}.leaderboard-scroll{max-height:370px;overflow:auto;scrollbar-color:#53639c transparent}.leaderboard-board table{width:100%;border-collapse:collapse;text-align:left}.leaderboard-board th{padding:9px 8px;color:var(--muted);font-size:9px;font-weight:900;letter-spacing:.1em}.leaderboard-board td{padding:9px 8px;border-top:1px solid rgba(184,199,255,.12);color:var(--cream);font-size:12px;font-weight:800}.leaderboard-board td:first-child{width:35px;color:var(--blue);font-weight:1000}.leaderboard-board td:last-child,.leaderboard-board th:last-child{text-align:right;font-variant-numeric:tabular-nums}.leaderboard-board tr.is-me td{background:rgba(118,215,255,.13);color:#bcecff}.leaderboard-board tr:nth-child(1) td:first-child,.leaderboard-board tr:nth-child(2) td:first-child,.leaderboard-board tr:nth-child(3) td:first-child{color:var(--coral)}.leaderboard-board td.leaderboard-empty{padding:30px 8px;color:var(--muted);font-size:12px;text-align:center}.leaderboard-count{margin:12px 2px 0;color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.06em}
@media(max-width:800px){.leaderboard-panel{grid-template-columns:1fr;gap:20px;padding:22px}}
@media(max-width:500px){.leaderboard-panel{margin-top:12px;padding:17px;border-radius:18px}.leaderboard-title>.sprite{width:58px;height:58px}.leaderboard-title h2{font-size:29px}.nickname-controls{flex-direction:column}.nickname-controls button{min-height:43px}.leaderboard-board{padding:12px}}
.fairplay-status{display:flex;align-items:center;gap:10px;margin-top:12px;padding:8px 11px;border:1px solid rgba(118,215,255,.35);border-radius:11px;background:rgba(17,40,78,.72);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.fairplay-art{width:36px;height:36px;filter:drop-shadow(0 2px 6px rgba(118,215,255,.26))}
.fairplay-status strong,.fairplay-status small{display:block;line-height:1.3}.fairplay-status strong{color:var(--blue);font-size:10px;font-weight:1000;letter-spacing:.08em}.fairplay-status small{margin-top:2px;color:var(--muted);font-size:10px;font-weight:800}
.fairplay-status.paused{border-color:rgba(255,119,125,.75);background:rgba(86,33,67,.79);animation:fairplay-pulse 1.2s ease-in-out infinite}.fairplay-status.paused strong{color:#ffb9bb}.fairplay-status.paused small{color:var(--cream)}
.topbar-actions{display:flex;align-items:center;gap:15px}.language-switch{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:68px;min-height:39px;padding:5px 7px;border:1px solid rgba(184,199,255,.55);border-radius:10px;background:#23335e;color:var(--cream);font-size:11px;font-weight:900;letter-spacing:.05em;text-decoration:none;transition:transform .2s,background .2s}.language-switch:hover{transform:translateY(-2px);background:#344778}.language-switch img{width:30px;height:20px;border-radius:3px;box-shadow:0 1px 6px rgba(0,0,0,.3)}
@keyframes fairplay-pulse{50%{box-shadow:0 0 19px rgba(255,119,125,.22),inset 0 1px 0 rgba(255,255,255,.06)}}
@media(max-width:500px){.fairplay-status{margin-top:10px}.fairplay-status small{font-size:9px}}
@media(max-width:500px){.topbar .back-link{display:none}}
.trophy-sprite{background-image:url("../assets/trophy-atlas-rpg-v8.webp")}
.job-sprite{background-image:url("../assets/job-atlas-rpg-v8.webp")}
.achievement:not(.unlocked){filter:grayscale(.45);opacity:.8}

/* Five compact game rooms share the live economy and replace the long page. */
main{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:18px;align-items:start}
main>.masthead,main>.room-nav,main>.room-heading,main>.bottom-strip{grid-column:1/-1}
main>.game-layout,main>.lower-grid,main>.activity-grid{display:contents!important}
body[data-room] main section{display:none!important}
body[data-room="reef"] .click-zone,body[data-room="reef"] .status-panel,body[data-room="gang"] .shop-panel,body[data-room="lab"] .prestige-panel,body[data-room="lab"] .lower-grid>.lower-panel:first-child,body[data-room="expedition"] .mission-panel,body[data-room="expedition"] .dive-panel,body[data-room="expedition"] .side-mission-panel,body[data-room="hall"] .achievements-panel,body[data-room="hall"] .leaderboard-panel{animation:room-enter .38s ease both}
body[data-room="reef"] .click-zone{display:flex!important;grid-column:1;grid-row:4}
body[data-room="reef"] .status-panel{display:block!important;grid-column:2;grid-row:4}
body[data-room="gang"] .shop-panel{display:flex!important;grid-column:1/-1;min-height:0}
body[data-room="lab"] .lower-grid>.lower-panel:first-child{display:block!important;grid-column:1/-1}
body[data-room="lab"] .prestige-panel{display:grid!important;grid-column:1/-1;margin-top:0}
body[data-room="expedition"] .mission-panel{display:block!important;grid-column:1}
body[data-room="expedition"] .dive-panel{display:flex!important;grid-column:2}
body[data-room="expedition"] .side-mission-panel{display:block!important;grid-column:1/-1;margin-top:0}
body[data-room="hall"] .achievements-panel{display:block!important;grid-column:1}
body[data-room="hall"] .leaderboard-panel{display:grid!important;grid-column:2;grid-template-columns:1fr;margin-top:0}
.masthead{padding:25px 0 5px;align-items:center}
.masthead h1{font-size:clamp(43px,5.2vw,75px)}
.masthead-sub{margin-top:12px;font-size:13px}
.masthead-stamp{width:94px;height:94px;border-width:3px;box-shadow:5px 6px 0 var(--coral)}
.masthead-stamp span{font-size:26px}.masthead-stamp b{font-size:8px}.masthead-stamp small{font-size:6px}
.leaderboard-jump{margin-top:10px}
.room-nav{position:sticky;top:8px;z-index:15;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:8px;border:1px solid rgba(184,199,255,.28);border-radius:23px;background:rgba(9,17,44,.86);backdrop-filter:blur(20px);box-shadow:0 18px 35px rgba(0,0,0,.28)}
.room-tab{min-width:0;min-height:74px;display:flex;align-items:center;justify-content:center;gap:10px;padding:7px 12px;border:1px solid transparent;border-radius:17px;background:transparent;color:var(--muted);font-size:12px;font-weight:1000;letter-spacing:.1em;transition:background .2s,transform .2s,box-shadow .2s,color .2s}
.room-tab:hover{transform:translateY(-2px);background:#263865;color:var(--cream)}
.room-tab[aria-selected="true"]{border-color:rgba(118,215,255,.52);background:linear-gradient(130deg,#245c8e,#243973);color:var(--cream);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 0 18px rgba(61,161,255,.22)}
.room-tab-art{width:43px;height:43px;flex:none;background-image:url("../assets/job-atlas-rpg-v8.webp");background-repeat:no-repeat;background-size:500% 400%;filter:drop-shadow(0 5px 4px rgba(0,0,0,.28));transition:transform .25s}
.room-tab:hover .room-tab-art,.room-tab[aria-selected="true"] .room-tab-art{transform:scale(1.13) rotate(-6deg)}
.art-reef{background-position:25% 0%}.art-gang{background-position:50% 0%}.art-lab{background-position:25% 33.333%}.art-expedition{background-position:100% 66.667%}.art-hall{background-position:50% 33.333%}
.room-heading{position:relative;min-height:112px;display:flex;align-items:center;justify-content:space-between;overflow:hidden;padding:17px 25px;border:1px solid rgba(118,215,255,.27);border-radius:20px;background:radial-gradient(circle at 87% 0%,rgba(255,119,125,.19),transparent 31%),linear-gradient(115deg,#24376b,#152047);scroll-margin-top:100px}
.room-eyebrow{color:var(--blue);font-size:10px;font-weight:1000;letter-spacing:.18em}
.room-heading h2{margin:5px 0 2px;font-size:clamp(28px,3vw,43px);line-height:1;letter-spacing:-.06em}
.room-heading p{margin:4px 0 0;color:var(--muted);font-size:12px;font-weight:800}
.room-heading-bubble{position:absolute;right:6%;top:-34px;width:150px;height:150px;border:2px solid rgba(118,215,255,.25);border-radius:50%;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.25),transparent 50%);box-shadow:inset -18px -20px 30px rgba(75,121,216,.12);animation:room-bubble 5s ease-in-out infinite}
.click-zone{min-height:0;background:linear-gradient(180deg,rgba(20,29,66,.16),rgba(11,18,42,.64)),url("../assets/arcade-reef-rpg-v8.webp") center/cover no-repeat}
.click-zone::before{opacity:.055}.squid-stage{min-height:370px}
.shop-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));max-height:none}
.upgrade-list{grid-template-columns:repeat(3,minmax(0,1fr))}
.achievement-list{grid-template-columns:repeat(5,minmax(0,1fr));max-height:650px}
.leaderboard-panel{gap:18px}.leaderboard-panel .leaderboard-board{align-self:start}
.bottom-strip{margin-top:0}.toast{bottom:25px}
@keyframes room-enter{from{opacity:0;transform:translateY(13px) scale(.987)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes room-bubble{50%{transform:translateY(13px) scale(.94);opacity:.65}}
@media(max-width:800px){main{grid-template-columns:1fr}main>.masthead{grid-row:1}main>.room-nav{grid-row:2}main>.room-heading{grid-row:3}main>.bottom-strip{grid-row:20}.room-heading,.shop-panel,.prestige-panel,.mission-panel,.dive-panel,.side-mission-panel,.achievements-panel,.leaderboard-panel{grid-column:1/-1!important}body[data-room="reef"] .click-zone{grid-column:1;grid-row:4}body[data-room="reef"] .status-panel{grid-column:1;grid-row:5}.shop-list{grid-template-columns:repeat(2,minmax(0,1fr))}.upgrade-list{grid-template-columns:repeat(2,minmax(0,1fr))}.room-tab{font-size:10px;padding:5px}.room-tab-art{width:35px;height:35px}}
@media(max-width:650px){body{padding-bottom:88px}.page-shell{width:calc(100% - 20px)}main{display:flex;flex-direction:column;gap:12px}main>.masthead,main>.room-heading,main>.bottom-strip{width:100%}.masthead{order:0;padding:23px 3px 7px}.masthead h1{font-size:clamp(43px,11vw,64px)}.masthead-sub{max-width:265px;font-size:11px;line-height:1.45}.masthead-stamp{width:69px;height:69px}.masthead-stamp span{font-size:19px}.masthead-stamp b{font-size:6px}.masthead-stamp small{display:none}.leaderboard-jump{font-size:8px}.room-heading{order:1;min-height:82px;padding:12px 17px;scroll-margin-top:10px}.room-heading h2{font-size:29px}.room-heading p{font-size:11px}.room-heading-bubble{width:90px;height:90px;right:-10px}.room-nav{position:fixed;top:auto;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));z-index:30;order:99;gap:2px;padding:5px;border-radius:18px}.room-tab{min-height:60px;flex-direction:column;gap:0;padding:3px 1px;border-radius:13px;font-size:8px;letter-spacing:.02em}.room-tab-art{width:36px;height:36px}.click-zone,.status-panel,.shop-panel,.lower-panel,.mission-panel,.dive-panel,.side-mission-panel,.leaderboard-panel,.prestige-panel{order:2;width:100%;min-width:0}.status-panel{order:3}.bottom-strip{order:10}.click-zone{min-height:0}.squid-stage{min-height:300px}.shop-list,.upgrade-list,.side-mission-list{grid-template-columns:1fr}.achievement-list{grid-template-columns:repeat(3,minmax(0,1fr));max-height:none}.leaderboard-panel{grid-template-columns:1fr!important}.toast{bottom:93px}}
@media(prefers-reduced-motion:reduce){.room-heading-bubble{animation:none}}
@media(max-width:650px){.achievement-list{max-height:min(58vh,490px);overflow-y:auto;overscroll-behavior:contain}.upgrade-list,.mission-list,.side-mission-list{max-height:min(55vh,470px);overflow-y:auto;overscroll-behavior:contain;padding-right:4px}.shop-list{max-height:min(62vh,530px);overflow-y:auto;overscroll-behavior:contain}.dive-art{min-height:118px}}
.upgrade-hint{margin:11px 0 0;color:var(--muted);font-size:11px;font-weight:800;line-height:1.45}.upgrade-list{margin-top:17px}.upgrade-item{min-height:105px}.upgrade-item.purchased{opacity:1}.upgrade-item.maxed:disabled{opacity:.78;border-color:rgba(255,119,125,.55)}.upgrade-info{flex:1;min-width:0}.upgrade-level{display:block;width:max-content;max-width:100%;margin-top:7px;padding:3px 6px;border-radius:5px;background:rgba(118,215,255,.16);color:var(--blue);font-size:9px;font-weight:1000;letter-spacing:.06em}.upgrade-progress{display:block;height:4px;margin-top:6px;overflow:hidden;border-radius:99px;background:rgba(184,199,255,.2)}.upgrade-progress span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--blue),var(--coral));transition:width .25s}
.achievements-panel{align-self:start}.achievement-list{max-height:570px;overflow-y:auto;padding-right:5px;scrollbar-color:#53639c transparent;scrollbar-width:thin}.achievement{min-height:98px}.achievement:not(.unlocked){filter:grayscale(.85);opacity:.62}.achievement-progress{color:var(--blue)!important;font-size:9px!important;font-weight:1000;letter-spacing:.04em}.achievement.unlocked .achievement-progress{color:var(--cream)!important}
.side-mission-panel{margin-top:18px}.side-mission-panel .activity-intro{margin-bottom:8px}.side-mission-count{margin:0;color:var(--blue);font-size:11px;font-weight:1000;letter-spacing:.1em}.side-mission-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:16px}.side-mission-list .mission-item{min-width:0}.side-mission-list .mission-item:not(.mission-done):not(.mission-active){opacity:.82}
@media(max-width:800px){.side-mission-list{grid-template-columns:1fr}}@media(max-width:500px){.side-mission-panel{margin-top:12px}.achievement{min-height:95px}.achievement-progress{font-size:8px!important}}
.achievement:not(.unlocked){filter:grayscale(.45);opacity:.8}
.achievement{min-height:118px}.achievement-icon,.achievement-art{width:53px;height:53px}
@media(max-width:650px){.achievement-list{max-height:min(58vh,490px)}.upgrade-list,.mission-list,.side-mission-list{max-height:min(55vh,470px);overflow-y:auto;overscroll-behavior:contain;padding-right:4px}.shop-list{max-height:min(62vh,530px);overflow-y:auto;overscroll-behavior:contain}.side-mission-list{grid-template-columns:1fr}}

/* Painted rooms keep their own visual identity without covering the controls. */
body[data-room="gang"] .room-heading,body[data-room="gang"] .shop-panel{--room-image:url("../assets/room-gang-rpg-v8.webp")}
body[data-room="lab"] .room-heading,body[data-room="lab"] .lower-grid>.lower-panel:first-child,body[data-room="lab"] .prestige-panel{--room-image:url("../assets/room-lab-rpg-v8.webp")}
body[data-room="expedition"] .room-heading,body[data-room="expedition"] .mission-panel,body[data-room="expedition"] .dive-panel,body[data-room="expedition"] .side-mission-panel{--room-image:url("../assets/room-expedition-rpg-v8.webp")}
body[data-room="hall"] .room-heading,body[data-room="hall"] .achievements-panel,body[data-room="hall"] .leaderboard-panel{--room-image:url("../assets/room-hall-rpg-v8.webp")}
body[data-room="gang"] .room-heading,body[data-room="lab"] .room-heading,body[data-room="expedition"] .room-heading,body[data-room="hall"] .room-heading{background-image:linear-gradient(90deg,rgba(10,19,47,.96) 0%,rgba(10,19,47,.80) 48%,rgba(10,19,47,.20) 100%),var(--room-image);background-position:center;background-size:cover;animation:room-pan 16s ease-in-out infinite alternate}
body[data-room="gang"] .shop-panel,body[data-room="lab"] .lower-grid>.lower-panel:first-child,body[data-room="lab"] .prestige-panel,body[data-room="expedition"] .mission-panel,body[data-room="expedition"] .dive-panel,body[data-room="expedition"] .side-mission-panel,body[data-room="hall"] .achievements-panel,body[data-room="hall"] .leaderboard-panel{background-image:linear-gradient(110deg,rgba(12,22,51,.93),rgba(12,22,51,.84)),var(--room-image);background-position:center;background-size:cover}
body[data-room="gang"] .shop-panel{background-image:linear-gradient(180deg,rgba(12,22,51,.28) 0,rgba(12,22,51,.78) 180px,rgba(12,22,51,.91) 100%),var(--room-image);background-position:center top;background-size:cover}
.shop-head{min-height:130px;align-items:flex-start}.shop-head img{width:91px;height:91px;filter:drop-shadow(0 8px 12px rgba(0,0,0,.55));animation:creature-sway 5s ease-in-out infinite}
.shop-item{position:relative;isolation:isolate;min-height:101px;overflow:hidden;border-color:rgba(195,218,252,.28);background-image:linear-gradient(90deg,rgba(8,19,45,.63),rgba(8,19,45,.83) 45%,rgba(8,19,45,.95)),var(--habitat);background-position:center;background-size:cover;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 5px 12px rgba(1,8,26,.18);transition:transform .2s,border-color .2s,box-shadow .2s,filter .2s}
.shop-item[data-creature="plankton"]{--habitat:url("../assets/habitat-plankton-rpg-v8.webp")}.shop-item[data-creature="crab"]{--habitat:url("../assets/habitat-crab-rpg-v8.webp")}.shop-item[data-creature="jelly"]{--habitat:url("../assets/habitat-jelly-rpg-v8.webp")}.shop-item[data-creature="coral"]{--habitat:url("../assets/habitat-coral-rpg-v8.webp")}.shop-item[data-creature="dolphin"]{--habitat:url("../assets/habitat-dolphin-rpg-v8.webp")}.shop-item[data-creature="octopus"]{--habitat:url("../assets/habitat-octopus-rpg-v8.webp")}.shop-item[data-creature="whale"]{--habitat:url("../assets/habitat-whale-rpg-v8.webp")}.shop-item[data-creature="leviathan"]{--habitat:url("../assets/habitat-leviathan-rpg-v8.webp")}
.shop-item:hover:not(:disabled){transform:translateY(-3px) rotate(-.25deg);border-color:rgba(123,216,255,.88);background-image:linear-gradient(90deg,rgba(8,19,45,.46),rgba(8,19,45,.74) 45%,rgba(8,19,45,.90)),var(--habitat);box-shadow:0 10px 22px rgba(1,8,26,.36),0 0 0 1px rgba(123,216,255,.21)}
.shop-item:disabled{opacity:.88}.shop-item .shop-icon{background:rgba(20,46,85,.43);border:1px solid rgba(190,225,255,.45);backdrop-filter:blur(5px);box-shadow:0 7px 13px rgba(0,0,0,.32)}
.shop-item .shop-icon .sprite{animation:creature-sway 4.4s ease-in-out infinite}.shop-item:nth-child(even) .shop-icon .sprite{animation-delay:-2.2s}.shop-item:hover .shop-icon .sprite{animation:creature-pop .46s ease both}
.shop-item .shop-info strong,.shop-item .shop-price{filter:drop-shadow(0 2px 3px rgba(0,0,0,.75))}.shop-item .shop-info small{color:#d4e6f8}.shop-item .shop-info .milestone{color:#a7e6ff}
.upgrade-item,.mission-item,.achievement,.room-tab{transition:transform .22s,box-shadow .22s,border-color .22s,background .22s}.upgrade-item:hover:not(:disabled),.mission-item:hover,.achievement.unlocked:hover{transform:translateY(-3px);box-shadow:0 11px 21px rgba(1,8,26,.28)}
.upgrade-item:disabled{opacity:.83;background:rgba(14,25,59,.91)}.upgrade-item:disabled strong{color:#d2e0f6}.upgrade-item:disabled small{color:#b3c6e7}.mission-item.mission-locked{opacity:.75;background:rgba(14,25,59,.9)}
.upgrade-item:hover .upgrade-symbol .sprite,.mission-item:hover .mission-icon,.achievement.unlocked:hover .achievement-art{transform:translateY(-3px) rotate(-7deg) scale(1.08)}
.upgrade-symbol .sprite,.mission-icon,.achievement-art{transition:transform .25s}.achievement.unlocked .achievement-icon{filter:drop-shadow(0 0 9px rgba(118,215,255,.36))}
.celebrate{animation:reward-pop .6s cubic-bezier(.2,.8,.2,1) both!important}
@keyframes creature-sway{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-5px) rotate(4deg)}}
@keyframes creature-pop{40%{transform:translateY(-6px) rotate(-11deg) scale(1.16)}100%{transform:translateY(0) rotate(0) scale(1)}}
@keyframes reward-pop{0%{filter:brightness(1);transform:scale(1)}36%{filter:brightness(1.35);transform:scale(1.035)}100%{filter:brightness(1);transform:scale(1)}}
@keyframes room-pan{from{background-position:50% 50%}to{background-position:56% 50%}}

/* The squid changes drawn pose and body motion on each accepted click. */
.squid-button:active{scale:1}.squid-button.reaction-a{animation:squid-swipe-a .39s cubic-bezier(.2,.8,.2,1) both}.squid-button.reaction-b{animation:squid-swipe-b .39s cubic-bezier(.2,.8,.2,1) both}.squid-button.reaction-critical{animation:squid-critical .49s cubic-bezier(.15,.75,.2,1) both}
@keyframes squid-swipe-a{0%{transform:translateY(0) rotate(0) scale(1)}23%{transform:translateY(16px) rotate(-8deg) scale(.88,1.03)}52%{transform:translateY(-17px) rotate(7deg) scale(1.12,.94)}78%{transform:translateY(-4px) rotate(-3deg) scale(.98,1.02)}100%{transform:translateY(0) rotate(0) scale(1)}}
@keyframes squid-swipe-b{0%{transform:translateY(0) rotate(0) scale(1)}22%{transform:translateY(14px) rotate(8deg) scale(.89,1.04)}50%{transform:translateY(-19px) rotate(-8deg) scale(1.1,.94)}77%{transform:translateY(-3px) rotate(3deg) scale(.99,1.02)}100%{transform:translateY(0) rotate(0) scale(1)}}
@keyframes squid-critical{0%{transform:translateY(0) rotate(0) scale(1)}16%{transform:translateY(20px) rotate(-6deg) scale(.82,1.12)}42%{transform:translateY(-29px) rotate(10deg) scale(1.23,.9)}68%{transform:translateY(4px) rotate(-8deg) scale(.94,1.07)}85%{transform:translateY(-10px) rotate(4deg) scale(1.08,.96)}100%{transform:translateY(0) rotate(0) scale(1)}}
.water-burst,.water-bubble{position:absolute;display:block;pointer-events:none;background-image:url("../assets/water-vfx-rpg-v8.svg");background-repeat:no-repeat;background-size:200% 100%;will-change:transform,opacity}
.water-burst{width:clamp(100px,17vw,220px);aspect-ratio:1;background-position:0 0;transform:translate(-50%,-50%);animation:water-crown .62s ease-out forwards;filter:drop-shadow(0 0 9px rgba(89,210,255,.7))}.water-burst.critical{width:clamp(160px,24vw,310px);animation-duration:.76s}
.water-bubble{width:27px;aspect-ratio:1;background-position:100% 0;animation:water-bubble .8s ease-out var(--delay) forwards}
.leaderboard-title{min-width:0}.leaderboard-title h2{min-width:0;overflow-wrap:anywhere}
@media(max-width:1200px){body[data-room="hall"] .achievements-panel,body[data-room="hall"] .leaderboard-panel{grid-column:1/-1}body[data-room="hall"] .leaderboard-panel{grid-row:5}}
@keyframes water-crown{0%{opacity:0;transform:translate(-50%,-50%) scale(.22) rotate(-12deg)}22%{opacity:1}70%{opacity:.9}100%{opacity:0;transform:translate(-50%,-50%) scale(1.35) rotate(12deg)}}
@keyframes water-bubble{0%{opacity:0;transform:translate(-50%,-50%) scale(.35)}18%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(.7)}}
@media(max-width:650px){.shop-head{min-height:105px}.shop-head img{width:65px;height:65px}.shop-item{min-height:94px}.water-burst{width:140px}.water-burst.critical{width:210px}}
@media(prefers-reduced-motion:reduce){.shop-head img,.shop-item .shop-icon .sprite,.squid-button.reaction-a,.squid-button.reaction-b,.squid-button.reaction-critical,.celebrate,body[data-room] .room-heading{animation:none!important}.water-burst,.water-bubble{display:none}}

/* Swag-Shot: a painted, single-finger arcade board in the existing rooms. */
.shot-zone{align-items:stretch;gap:0;padding:18px;background:linear-gradient(150deg,#152b54,#0b1739 70%);overflow:visible}
.shot-zone::before{display:none}
.shot-zone .click-topline{padding:2px 4px 13px}
.shot-scorebar{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:10px}
.shot-scorebar>div{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:57px;border:1px solid rgba(181,231,255,.35);border-radius:12px;background:linear-gradient(180deg,rgba(41,81,135,.85),rgba(15,35,79,.94));box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 4px 11px rgba(2,10,30,.3)}
.shot-scorebar small{color:#a8e3ff;font-size:9px;font-weight:1000;letter-spacing:.13em}.shot-scorebar strong{margin-top:3px;color:#fff4db;font-size:20px;font-weight:1000;line-height:1;font-variant-numeric:tabular-nums;text-shadow:0 3px 0 #142849}
.shot-board{position:relative;isolation:isolate;width:min(100%,420px);aspect-ratio:3/4;margin:0 auto;border:3px solid #b8efff;border-radius:27px;outline:none;overflow:hidden;background:#0b2c54 url("../assets/swag-shot-board-rpg-v8.webp") center/cover no-repeat;box-shadow:0 0 0 5px #173a65,0 0 0 7px #5e9cbd,0 19px 30px rgba(1,8,28,.6),inset 0 0 45px rgba(7,35,78,.3);touch-action:none;user-select:none;cursor:crosshair}
.shot-board:focus-visible{box-shadow:0 0 0 5px #ffe5a3,0 0 0 8px #7bbff0,0 19px 30px rgba(1,8,28,.6)}
.shot-board::before{content:"";position:absolute;z-index:0;inset:-30%;pointer-events:none;background:linear-gradient(110deg,transparent 42%,rgba(225,250,255,.13) 50%,transparent 58%);animation:shot-sheen 8s linear infinite}
.shot-board canvas{position:relative;z-index:2;display:block;width:100%;height:100%;pointer-events:none}
.shot-mascot{position:absolute;z-index:1;bottom:-8%;left:36%;width:28%;height:auto;filter:drop-shadow(0 5px 10px #001739);pointer-events:none;animation:shot-mascot-idle 3.2s ease-in-out infinite}
.shot-mascot.is-firing{animation:shot-mascot-fire .55s cubic-bezier(.2,.8,.2,1) both}
.shot-mascot.is-hit{animation:shot-mascot-hit .6s cubic-bezier(.2,.8,.2,1) both}
.shot-result{position:absolute;z-index:5;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;padding:28px;background:radial-gradient(circle at 50% 40%,rgba(54,122,175,.86),rgba(4,20,55,.94) 60%);text-align:center;animation:room-enter .3s ease both}
.shot-result[hidden]{display:none}.shot-result span{color:#b4e9ff;font-size:13px;font-weight:1000;letter-spacing:.2em}.shot-result strong{max-width:100%;color:#ffe4a6;font-size:clamp(31px,7vw,49px);line-height:1;letter-spacing:-.07em;text-shadow:0 5px 0 #163b70}.shot-result small{color:#e6f7ff;font-size:15px;font-weight:900}.shot-result button{min-height:52px;margin-top:10px;padding:10px 24px;border:2px solid #fff2cc;border-radius:13px;background:linear-gradient(180deg,#ffbabc,#ff7f91);color:#102448;box-shadow:0 6px 0 #8d4564;font-size:13px;font-weight:1000;letter-spacing:.07em;cursor:pointer;transition:transform .16s}.shot-result button:hover{transform:translateY(-3px)}
.shot-instruction{display:flex;align-items:center;gap:10px;max-width:420px;min-height:51px;margin:11px auto 0;padding:8px 12px;border:1px solid rgba(138,219,255,.44);border-radius:11px;background:rgba(18,48,91,.89)}
.shot-instruction-icon{flex:none;width:30px;height:30px;background:url("../assets/swag-shot-atlas-rpg-v8.webp") 100% 100%/300% 200% no-repeat;filter:drop-shadow(0 2px 5px rgba(1,10,31,.5))}.shot-instruction p{margin:0;color:#d9efff;font-size:11px;font-weight:850;line-height:1.4}
.shot-zone .click-bottom{max-width:420px;width:100%;margin:10px auto 0;gap:10px}.shot-zone .click-bottom span{font-size:10px}.shot-zone .click-bottom span:last-child{white-space:nowrap}
.shot-zone .surge-button,.shot-zone .lucky-squid{max-width:420px;margin-left:auto;margin-right:auto}
@keyframes shot-sheen{from{transform:translateX(-55%) rotate(4deg)}to{transform:translateX(55%) rotate(4deg)}}
@keyframes shot-mascot-idle{50%{transform:translateY(-5px) rotate(3deg)}}
@keyframes shot-mascot-fire{20%{transform:translateY(9px) scale(.9) rotate(-7deg)}55%{transform:translateY(-17px) scale(1.15) rotate(10deg)}100%{transform:translateY(0) scale(1)}}
@keyframes shot-mascot-hit{30%{transform:translateY(-15px) rotate(-12deg) scale(1.1)}65%{transform:rotate(8deg) scale(1.06)}100%{transform:none}}
@media(max-width:650px){.shot-zone{padding:12px}.shot-board{width:min(100%,420px);border-radius:20px}.shot-scorebar>div{min-height:51px}.shot-scorebar strong{font-size:18px}.shot-instruction p{font-size:10px}.shot-zone .click-bottom{flex-wrap:wrap}}
@media(max-width:650px){body[data-room="reef"] .masthead,body[data-room="reef"] .room-heading{display:none}.shot-zone .click-topline{padding-bottom:8px}.shot-scorebar{margin-bottom:7px}.shot-instruction{margin-top:8px}}
@media(prefers-reduced-motion:reduce){.shot-board::before,.shot-mascot,.shot-mascot.is-firing,.shot-mascot.is-hit{animation:none!important}}

/* Swag-Shot's larger arena keeps the playfield aligned with its HUD. */
@media(min-width:1000px){body[data-room="reef"] main{grid-template-columns:minmax(0,1.55fr) minmax(285px,.45fr)}}
.shot-zone .click-topline,.shot-scorebar,.shot-modebar{width:min(100%,960px);margin-left:auto;margin-right:auto}
.shot-modebar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:37px;margin-bottom:12px;padding:7px 13px;border:1px solid rgba(126,218,255,.45);border-radius:10px;background:linear-gradient(90deg,rgba(40,93,143,.82),rgba(17,47,91,.82));color:#d9f2ff;font-size:10px;font-weight:1000;letter-spacing:.13em}
.shot-modebar strong{color:#ffe7ae;font-size:12px;letter-spacing:.1em}.shot-modebar span{white-space:nowrap}
.shot-board{width:min(100%,960px);aspect-ratio:19/13;background-size:cover}
.shot-instruction,.shot-zone .click-bottom,.shot-zone .surge-button,.shot-zone .lucky-squid{max-width:960px}
.shot-instruction{width:100%}
.shot-mascot{left:auto;right:1%;bottom:-5%;width:20%;max-width:180px}
.shot-power{position:absolute;z-index:3;top:16px;left:17px;padding:8px 12px;border:1px solid rgba(209,250,255,.8);border-radius:99px;background:rgba(10,48,96,.87);color:#e3faff;font-size:10px;font-weight:1000;letter-spacing:.1em;box-shadow:0 0 19px rgba(79,209,255,.42);pointer-events:none}
.shot-power[hidden]{display:none}
.shot-field-guide{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;width:min(100%,960px);margin:8px auto 0}
.shot-field-guide span{min-width:0;display:flex;align-items:center;justify-content:center;gap:7px;min-height:36px;padding:4px 6px;border:1px solid rgba(138,219,255,.35);border-radius:9px;background:rgba(17,48,91,.67);color:#cfeeff;font-size:9px;font-weight:1000;letter-spacing:.03em;text-align:center}
.shot-guide-art{display:block;flex:none;width:27px;height:27px;background-repeat:no-repeat;background-size:300% 300%;filter:drop-shadow(0 2px 3px rgba(0,7,25,.5))}
.shot-guide-jelly,.shot-guide-crab{background-image:url("../assets/ocean-crew-rpg-v8.webp")}.shot-guide-jelly{background-position:100% 0}.shot-guide-crab{background-position:50% 0}
.shot-guide-bubble{background-image:url("../assets/ocean-ui-rpg-v8.webp");background-position:0 100%}
.shot-guide-puffer,.shot-guide-star{background-size:contain;background-position:center}.shot-guide-puffer{background-image:url("../assets/swag-puffer-rpg-v8.webp")}.shot-guide-star{background-image:url("../assets/swag-star-rpg-v8.webp")}
.shot-field-guide{grid-template-columns:repeat(5,minmax(0,1fr))}
.shot-switch{display:flex;align-items:center;gap:8px;width:min(100%,960px);margin:0 auto 10px}.shot-switch button{min-height:38px;padding:7px 16px;border:1px solid #83ccea;border-radius:9px;background:linear-gradient(180deg,#285785,#16365f);color:#e6f7ff;font-size:11px;font-weight:1000;letter-spacing:.07em;cursor:pointer}.shot-switch button[aria-pressed="true"]{border-color:#ffe8a6;background:linear-gradient(180deg,#ffbd87,#ea7891);color:#1f3157;box-shadow:0 3px 0 #7d4f78}.shot-switch span{margin-left:auto;color:#b8def2;font-size:11px;font-weight:850;white-space:nowrap}.shot-modebar span:nth-child(2){color:#b6ebff}
.shot-result{overflow:auto}.shot-result p{margin:0;color:#e6f7ff;font-size:11px;font-weight:1000;letter-spacing:.08em}.shot-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:min(100%,620px)}.shot-choices button{display:flex;flex-direction:column;justify-content:center;gap:5px;min-width:0;min-height:77px;margin:0;padding:8px;border-radius:10px;font-size:11px;line-height:1.15;letter-spacing:0}.shot-choices button b{font-size:12px}.shot-choices button small{font-size:10px;font-weight:750;color:#293d64}.shot-result #shot-back-main[hidden]{display:none}
.shot-choices[hidden],.shot-result #shot-choice-title[hidden],.shot-zone .surge-button[hidden]{display:none}
.daily-leaderboard{width:min(100%,960px);margin:13px auto 0;padding:12px 16px;border:1px solid rgba(138,219,255,.45);border-radius:12px;background:linear-gradient(135deg,rgba(32,83,130,.95),rgba(13,41,83,.95));color:#e7f5ff}.daily-leaderboard[hidden]{display:none}.daily-leaderboard>strong{color:#ffe5a7;font-size:13px;letter-spacing:.1em}.daily-leaderboard p{margin:4px 0 8px;color:#beddf2;font-size:11px}.daily-leaderboard ol{display:grid;gap:5px;margin:0;padding-left:27px}.daily-leaderboard li{padding:4px 2px;font-size:12px;font-weight:850}.daily-leaderboard li span{float:right;color:#ffe5a7;font-variant-numeric:tabular-nums}.daily-leaderboard li.is-me{color:#80ebff}
@media(max-width:650px){.shot-board{width:100%;aspect-ratio:5/4}.shot-modebar{margin-bottom:8px;font-size:9px}.shot-modebar strong{font-size:10px}}
@media(max-width:650px){.shot-field-guide{gap:4px}.shot-field-guide span{gap:3px;padding:3px;font-size:7px;line-height:1.1}.shot-guide-art{width:23px;height:23px}}
@media(max-width:650px){.shot-field-guide{grid-template-columns:repeat(3,minmax(0,1fr))}.shot-switch{gap:5px}.shot-switch button{min-height:34px;padding:5px 8px;font-size:9px}.shot-switch span{font-size:9px}.shot-modebar{flex-wrap:wrap;gap:4px}.shot-modebar span:nth-child(2){order:3;flex-basis:100%;text-align:center}.shot-result{justify-content:flex-start;gap:5px;padding:10px}.shot-result strong{font-size:25px}.shot-result p{font-size:9px}.shot-choices{gap:4px}.shot-choices button{min-height:60px;padding:4px 2px}.shot-choices button b{font-size:9px}.shot-choices button small{font-size:8px}.shot-result span{font-size:10px}.shot-result small{font-size:10px}}

/* Visual pass: keep painted scenery visible and make every purchase readable. */
body{
  background-image:linear-gradient(180deg,rgba(5,12,34,.78),rgba(5,12,34,.92)),url("../assets/arcade-reef-rpg-v8.webp");
  background-position:center top;
  background-size:cover;
  background-attachment:fixed;
}
.room-nav{
  border-color:rgba(120,215,255,.42);
  background:linear-gradient(90deg,rgba(5,17,42,.94),rgba(16,38,73,.9)),url("../assets/arcade-reef-rpg-v8.webp") center/cover;
  box-shadow:0 12px 32px rgba(0,8,31,.38),inset 0 1px 0 rgba(198,241,255,.12);
}
.room-tab{font-size:13px;color:#d6e9ff}
.room-tab[aria-selected="true"]{background:linear-gradient(180deg,rgba(37,112,161,.95),rgba(23,64,118,.95));border-color:#85dfff;box-shadow:inset 0 2px 0 rgba(231,254,255,.22),0 0 18px rgba(74,196,255,.23)}
.room-heading{gap:16px;background-image:linear-gradient(90deg,rgba(7,20,49,.93),rgba(7,20,49,.62) 52%,rgba(7,20,49,.12)),url("../assets/arcade-reef-rpg-v8.webp");background-position:center;background-size:cover}
body[data-room="gang"] .room-heading,body[data-room="lab"] .room-heading,body[data-room="expedition"] .room-heading,body[data-room="hall"] .room-heading{background-image:linear-gradient(90deg,rgba(7,20,49,.91),rgba(7,20,49,.6) 50%,rgba(7,20,49,.15)),var(--room-image)}
.room-heading-copy{position:relative;z-index:1;min-width:0}
.room-heading p{color:#d4e8ff;font-size:14px}
.room-wallet{position:relative;z-index:1;display:flex;align-items:center;gap:10px;flex:none;min-width:164px;padding:9px 14px;border:1px solid rgba(160,224,255,.72);border-radius:14px;background:linear-gradient(120deg,rgba(16,47,91,.94),rgba(7,24,58,.94));box-shadow:0 5px 14px rgba(0,6,28,.38),inset 0 1px 0 rgba(255,255,255,.12)}
.room-wallet>.sprite{width:42px;height:42px}
.room-wallet small,.room-wallet strong{display:block}
.room-wallet small{color:#afe5ff;font-size:10px;font-weight:1000;letter-spacing:.13em}
.room-wallet strong{max-width:180px;margin-top:2px;overflow-wrap:anywhere;color:#ffe4a9;font-size:25px;font-weight:1000;font-variant-numeric:tabular-nums;line-height:1}
.shop-panel{border-color:rgba(123,218,255,.48)}
body[data-room="gang"] .shop-panel{background-image:linear-gradient(180deg,rgba(8,23,52,.20),rgba(8,23,52,.72) 185px,rgba(8,23,52,.9) 100%),var(--room-image)}
.shop-head{min-height:118px}
.quantity-picker{gap:9px;margin-bottom:15px}
.quantity-picker button{min-height:44px;border-color:rgba(167,224,255,.48);background:rgba(9,32,70,.86);color:#d3ebff;font-size:12px}
.quantity-picker button.selected{border-color:#b7eeff;background:linear-gradient(180deg,#b4eaff,#7bc9ed);color:#092348;box-shadow:0 4px 0 #235988}
.shop-list{gap:12px}
.shop-item{min-height:130px;display:grid;grid-template-columns:72px minmax(0,1fr) minmax(130px,145px);gap:14px;padding:13px 15px;border:1px solid rgba(162,218,254,.44);border-radius:16px;background-image:linear-gradient(90deg,rgba(5,21,48,.52),rgba(5,21,48,.82) 52%,rgba(5,21,48,.96)),var(--habitat);box-shadow:inset 0 1px 0 rgba(238,251,255,.13),0 7px 16px rgba(0,9,32,.3)}
.shop-item:hover:not(:disabled){background-image:linear-gradient(90deg,rgba(5,21,48,.38),rgba(5,21,48,.7) 52%,rgba(5,21,48,.92)),var(--habitat)}
.shop-item:disabled{opacity:1}
.shop-item .shop-icon{width:68px;height:68px;border-radius:14px;background:rgba(15,48,91,.55);box-shadow:0 8px 14px rgba(0,6,24,.45)}
.shop-art{width:68px;height:68px}
.shop-info strong{font-size:18px;line-height:1.12}
.shop-info small{margin-top:5px;font-size:12px;line-height:1.25}
.shop-info .milestone{font-size:11px;font-weight:900}
.shop-price{align-self:center;align-items:stretch;gap:8px;min-width:130px;padding:9px 10px;border:1px solid rgba(142,216,255,.38);border-radius:12px;background:rgba(3,19,47,.82);color:#ffe4a9;filter:none!important}
.price-row{justify-content:center;gap:4px;min-width:0;font-size:23px;font-variant-numeric:tabular-nums;line-height:1.05}
.price{overflow-wrap:anywhere}
.price-art{width:27px;height:27px}
.shop-price-detail{display:flex;justify-content:space-between;gap:4px;color:#d8ecff;font-size:11px;font-weight:900;line-height:1.15}
.shop-price-detail em{color:#fff0c6;font-style:normal}
.shop-buy-state{display:flex;justify-content:space-between;align-items:center;gap:5px;padding:6px 8px;border-radius:7px;background:#8ddcff;color:#0c3158;font-size:11px;font-weight:1000;letter-spacing:.04em}
.shop-buy-state b{font-size:11px;font-weight:1000}
.shop-item:disabled .shop-buy-state{background:#4b5d7d;color:#ebf4ff}
.shop-item:focus-visible{outline-color:#ffe4a9}
.upgrade-item{min-height:128px;gap:12px;padding:14px;border-color:rgba(146,211,253,.4);background:linear-gradient(100deg,rgba(12,32,69,.88),rgba(12,32,69,.96)),url("../assets/room-lab-rpg-v8.webp") center/cover}
.upgrade-symbol,.upgrade-art{width:52px;height:52px}
.upgrade-item strong{font-size:17px;line-height:1.1}
.upgrade-item small{font-size:12px;line-height:1.25}
.upgrade-level{font-size:10px}
.upgrade-progress{height:6px}
.upgrade-cost{display:flex;flex-direction:column-reverse;align-items:center;justify-content:center;gap:3px;min-width:76px;margin-left:2px;padding:7px;border:1px solid rgba(120,215,255,.4);border-radius:10px;background:rgba(5,23,54,.8);color:#ffe4a9;font-size:18px;font-variant-numeric:tabular-nums;white-space:normal;text-align:center;overflow-wrap:anywhere}
.upgrade-cost .price-art{width:25px;height:25px}
.upgrade-hint{font-size:13px;color:#d0e5fc}
.mission-item{border-color:rgba(162,218,254,.38);background:rgba(11,35,73,.86)}
.mission-info strong{font-size:16px}.mission-info small{font-size:12px;line-height:1.3}
.mission-action small{font-size:12px;text-align:right}
.mission-action button{min-height:38px;padding:7px 13px;border:1px solid #c5efff;border-radius:9px;background:#a4e5ff;color:#0a2a53;font-size:12px}
.mission-action button:disabled{opacity:1;border-color:rgba(151,199,236,.34);background:#304b72;color:#e3f3ff;cursor:not-allowed}
.dive-button,.surge-button,.prestige-actions button,.shot-result button{
  position:relative;
  isolation:isolate;
  min-height:62px;
  padding:10px 34px;
  border:0;
  border-radius:0;
  background:none;
  color:#fff5dc;
  box-shadow:none;
  text-shadow:0 2px 3px rgba(0,9,35,.8);
  font-size:13px;
  font-weight:1000;
  letter-spacing:.055em;
}
.dive-button::before,.surge-button::before,.prestige-actions button::before,.shot-result button::before{
  display:none;
}
.dive-button:hover:not(:disabled),.surge-button:hover:not(:disabled),.prestige-actions button:hover:not(:disabled),.shot-result button:hover:not(:disabled){filter:brightness(1.16);transform:translateY(-2px)}
.dive-button:disabled,.surge-button:disabled,.prestige-actions button:disabled{opacity:.68;filter:saturate(.55);box-shadow:none}
.nickname-controls button{min-height:47px;border:1px solid #bbecff;border-radius:10px;background:linear-gradient(180deg,#a7e5ff,#6db6e3);color:#0a2a53;box-shadow:0 4px 0 #1d557f;font-size:12px;font-weight:1000}
.nickname-controls button:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-2px)}
.shot-result button{min-width:250px}
.shot-scorebar small{font-size:11px}.shot-scorebar strong{font-size:24px}
.shot-modebar{min-height:44px;font-size:12px}.shot-modebar strong{font-size:14px}
.shot-instruction p{font-size:13px}
.shot-field-guide span{min-height:44px;padding:6px;font-size:11px}
.shot-guide-art{width:31px;height:31px}
.shot-zone .click-topline,.shot-zone .click-bottom{font-size:12px}
.stats-grid span,.depth-top span{font-size:11px}
.stats-grid strong{font-size:25px}
.depth-card small,.status-note p{font-size:12px}
.dive-art p,.activity-intro,.prestige-copy p,.leaderboard-intro>p:not(.leaderboard-status){color:#d6e9ff}
.achievement strong,.achievement-progress{font-size:11px!important}
.leaderboard-board th,.leaderboard-board-head span{font-size:11px}
.leaderboard-board td{font-size:14px}
.nickname-form label,.nickname-form>small,.leaderboard-count{font-size:11px}
@media(max-width:800px){
  .upgrade-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .room-wallet{min-width:145px}
}
@media(max-width:650px){
  body{background-attachment:scroll}
  .room-nav{gap:3px}
  .room-tab{font-size:10px;letter-spacing:0}
  .room-tab-art{width:34px;height:34px}
  .room-heading{min-height:102px;padding:12px 14px}
  .room-heading h2{font-size:27px}
  .room-heading p{max-width:190px;font-size:11px;line-height:1.3}
  .room-wallet{min-width:105px;gap:5px;padding:7px}
  .room-wallet>.sprite{width:31px;height:31px}
  .room-wallet small{font-size:8px}
  .room-wallet strong{font-size:19px}
  .shop-head{min-height:114px}
  .shop-list{max-height:min(63vh,560px)}
  .shop-item{min-height:143px;grid-template-columns:60px minmax(0,1fr);gap:8px 11px;padding:10px}
  .shop-item .shop-icon,.shop-art{width:58px;height:58px}
  .shop-info strong{font-size:17px}
  .shop-info small{font-size:11px}
  .shop-info .milestone{font-size:10px}
  .shop-price{grid-column:1/-1;display:grid;grid-template-columns:minmax(65px,auto) 1fr auto;align-items:center;gap:7px;min-width:0;width:100%;padding:5px 7px}
  .price-row{justify-content:flex-start;font-size:20px}
  .price-art{width:23px;height:23px}
  .shop-price-detail{flex-direction:column;gap:2px;font-size:10px}
  .shop-buy-state{min-width:74px;flex-direction:column;gap:0;padding:5px;font-size:10px}
  .upgrade-list{grid-template-columns:1fr}
  .upgrade-item{min-height:125px}
  .upgrade-cost{min-width:70px;font-size:17px}
  .shot-scorebar small{font-size:10px}.shot-scorebar strong{font-size:21px}
  .shot-modebar{min-height:41px;font-size:10px;letter-spacing:.03em}.shot-modebar strong{font-size:12px}
  .shot-instruction p{font-size:12px}
  .shot-field-guide{grid-template-columns:repeat(3,minmax(0,1fr))}
  .shot-field-guide span{min-height:43px;gap:3px;padding:4px 2px;font-size:9px}
  .shot-guide-art{width:25px;height:25px}
  .shot-zone .click-topline,.shot-zone .click-bottom{font-size:10px}
  .dive-button,.surge-button,.prestige-actions button,.shot-result button{min-height:58px;padding:8px 26px;font-size:12px}
  .dive-button::before,.surge-button::before,.prestige-actions button::before,.shot-result button::before{border-image-width:20px 36px}
  .mission-action small{font-size:11px}
  .mission-item{flex:0 0 auto;min-height:132px;grid-template-rows:auto auto;align-items:start;padding:12px}
  .mission-info{grid-column:2;grid-row:1}
  .mission-progress{font-size:11px!important}
  .mission-action{grid-column:1/-1;grid-row:2;display:flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%;margin-top:2px;padding-top:9px;border-top:1px solid rgba(160,220,255,.23)}
  .mission-action button{min-height:37px}
}

/* Compact reward cards have their own frame, separate from the large illustrated buttons. */
.shot-result .shot-choices button{position:relative;min-width:0;min-height:78px;width:100%;margin:0;padding:8px;border:2px solid #9bd8f4;border-radius:11px;background:linear-gradient(160deg,#3977a6,#1b4578 55%,#162d5a);box-shadow:inset 0 1px 0 #b8efff,0 4px 0 #0c234b;color:#fff6d9;transform:none}
.shot-result .shot-choices button::before{display:none}
.shot-result .shot-choices button:hover{border-color:#ffe6a5;background:linear-gradient(160deg,#6099bc,#275d90 55%,#1d3d72);transform:translateY(-2px)}
.shot-result .shot-choices button b{font-size:12px;letter-spacing:.03em}.shot-result .shot-choices button small{color:#d8efff;font-size:10px;line-height:1.2}
.shot-result .shot-choices button:disabled{opacity:.6;cursor:wait}
@media(max-width:650px){.shot-result .shot-choices button{min-height:65px;padding:5px 3px}.shot-result .shot-choices button b{font-size:9px}.shot-result .shot-choices button small{font-size:8px}}