/* Calamari RPG art v8: illustrated scenery, rounded panels, crisp pictorial controls. */
:root{--ui-ink:#071a39;--ui-cyan:#a9ecff;--ui-gold:#ffdf9c;--ui-coral:#ff8b91}
body{background-image:linear-gradient(180deg,rgba(4,12,32,.64),rgba(4,12,32,.91) 58%),url("../assets/arcade-reef-rpg-v8.webp")}
main{gap:14px}
.topbar{min-height:64px}
.page-shell{width:min(1540px,calc(100% - 42px))}

/* The original hero is now a compact illustrated game banner. */
.masthead{position:relative;isolation:isolate;min-height:206px;align-items:center;overflow:hidden;padding:19px 34px;border:1px solid #76c9e5;border-radius:22px;background:linear-gradient(90deg,rgba(4,18,46,.97) 0%,rgba(5,27,62,.91) 48%,rgba(4,28,65,.35) 100%),url("../assets/arcade-reef-rpg-v8.webp") center 34%/cover;box-shadow:0 13px 27px rgba(0,9,31,.45),inset 0 1px 0 rgba(223,250,255,.32)}
.masthead::after{content:"";position:absolute;z-index:-1;inset:0;border:1px solid rgba(255,219,155,.26);border-radius:21px;pointer-events:none}
.masthead>div{position:relative;z-index:2;max-width:calc(100% - 230px)}
.masthead h1{font-size:clamp(42px,4.3vw,63px);line-height:.84;text-shadow:0 4px 12px rgba(0,10,36,.66)}
.masthead h1 em{text-shadow:4px 5px 0 #593069,0 6px 14px #07142f}
.masthead .eyebrow{margin-bottom:10px;color:#d9f4ff}
.masthead-sub{margin-top:12px;color:#e2edff;font-size:13px}
.masthead .leaderboard-jump{margin-top:10px}
.masthead-hero{position:absolute;right:7%;bottom:-43px;width:215px;height:215px;object-fit:contain;filter:drop-shadow(0 16px 12px rgba(0,4,28,.62));animation:hero-float 4.5s ease-in-out infinite;pointer-events:none}

/* Rounded cards use native borders and clip their artwork at every size. */
.room-nav{top:7px;gap:6px;padding:7px;background:linear-gradient(90deg,rgba(4,20,47,.96),rgba(14,47,82,.93)),url("../assets/arcade-reef-rpg-v8.webp") center/cover;box-shadow:0 12px 30px rgba(0,4,25,.48)}
.room-tab{min-height:62px;color:#def4ff;font-size:13px;text-shadow:0 2px 4px #061a3c}
.room-tab[aria-selected="true"]{border-color:#ffd59c;background:linear-gradient(180deg,#267caa,#145585);box-shadow:inset 0 2px 0 rgba(247,254,255,.34),0 5px 0 rgba(5,20,49,.48),0 0 19px rgba(95,212,255,.2)}
.room-tab-art{width:42px;height:42px;image-rendering:auto}
.room-tab[aria-selected="true"] .room-tab-art{animation:selected-icon 2.8s ease-in-out infinite}
.room-heading{min-height:96px;padding:14px 24px;background-size:cover;box-shadow:0 9px 24px rgba(0,7,28,.32)}
.room-heading h2{color:#fff8e8;font-size:clamp(29px,3vw,40px);text-shadow:0 3px 7px #06152f}
.room-wallet{border-color:#a4e6f6;border-radius:13px;box-shadow:inset 0 1px 0 #c8f5ff55,0 4px 10px #0009}
.room-wallet strong{color:var(--ui-gold);font-size:27px;font-variant-numeric:tabular-nums;text-shadow:0 2px 0 #533967}
.room-wallet>.sprite{filter:drop-shadow(0 2px 3px #061a38)}

.panel,.lower-panel,.prestige-panel,.leaderboard-panel{border-color:#6bbbd7;box-shadow:0 13px 30px rgba(1,8,30,.42),inset 0 1px 0 rgba(232,251,255,.12)}
.panel-heading,.lower-heading>span,.click-topline{color:#b7e9ff;font-size:11px;letter-spacing:.12em}
.lower-heading h2,.shop-head h2{color:#fff8e9;text-shadow:0 3px 7px #051734}
.shop-head img{width:87px;height:87px;object-fit:contain;animation:crew-bob 4.5s ease-in-out infinite}

/* HUD and arena use landscape art at its intended aspect ratio. */
.shot-zone{padding:17px 21px 21px;background:linear-gradient(180deg,rgba(7,23,53,.7),rgba(6,18,43,.85)),url("../assets/arcade-reef-rpg-v8.webp") center/cover}
.shot-board{background-image:url("../assets/swag-shot-board-rpg-v8.webp");background-position:center;background-size:cover;border-color:#a8e9f4;box-shadow:0 0 0 4px #0a3154,0 0 0 7px #5ca9c5,0 15px 26px rgba(0,5,27,.64),inset 0 0 23px rgba(5,24,60,.27)}
.shot-board::before{opacity:.6;will-change:transform}
.shot-scorebar>div{min-height:62px;border-color:#78cce9;background:linear-gradient(170deg,rgba(38,111,158,.83),rgba(13,43,87,.94));box-shadow:inset 0 2px 0 rgba(215,248,255,.13)}
.shot-scorebar small{color:#c8eeff;font-size:11px;letter-spacing:.12em}
.shot-scorebar strong{color:#fff4d8;font-size:27px;line-height:1.05;text-shadow:0 2px 0 #173e6c}
.shot-modebar{border-color:#78c8e7;background:linear-gradient(90deg,#1d648f,#113a71);box-shadow:inset 0 1px 0 #d4f6ff33}
.shot-modebar strong{color:var(--ui-gold)}
.shot-switch button,.quantity-picker button,.mission-action button,.nickname-controls button{border:1px solid #79cbe1;border-radius:11px;background:linear-gradient(180deg,#287ca5,#113c6c);color:#f8fbff;text-shadow:0 2px 2px #052249;box-shadow:inset 0 1px 0 #ffffff55,0 4px 0 #072a50}
.shot-switch button[aria-pressed="true"],.quantity-picker button.selected{border-color:#ffe0aa;background:linear-gradient(180deg,#fbb99d,#da6988);color:#fff8e8;text-shadow:0 2px 2px #693b6a;box-shadow:inset 0 1px 0 #fff7dc88,0 4px 0 #783d5b}
.shot-switch button:hover,.quantity-picker button:hover,.mission-action button:hover:not(:disabled){filter:brightness(1.17);transform:translateY(-2px)}
.shot-field-guide span,.shot-instruction{border-color:#5ca9d0;background:rgba(6,33,71,.85)}
.shot-field-guide span{min-height:49px;color:#edf7ff;font-size:11px}
.shot-guide-art{width:34px;height:34px}
.shot-instruction p{font-size:13px}
.shot-instruction-icon{width:34px;height:34px}

/* Real sprite ornaments sit inside rounded controls without stretching. */
.dive-button,.surge-button,.prestige-actions button,.shot-result button{min-height:68px;border:1px solid #9be8ef;border-radius:14px;background:linear-gradient(180deg,#2c91ae,#125179);color:#fff8e8;text-shadow:0 2px 3px #102447;box-shadow:inset 0 2px 0 #c5fbff66,0 5px 0 #092c53;font-size:14px}
.dive-button,.prestige-actions button,.shot-result button{display:flex;align-items:center;justify-content:center;gap:10px}
.dive-button::before,.prestige-actions button::before,.shot-result button::before{content:"";position:relative;z-index:1;inset:auto;display:block;flex:none;width:36px;height:36px;border:0;border-image:none;background:url("../assets/ocean-ui-rpg-v8.webp") 0% 100%/300% 300% no-repeat;pointer-events:none}
.prestige-actions button::before{background-position:0% 100%}
.shot-result button::before{background-position:0% 0%}
.surge-button::before{display:none}
.dive-button,.shot-result button{border-color:#ffdfad;background:linear-gradient(180deg,#f9a68d,#c75f83);box-shadow:inset 0 2px 0 #fff5d088,0 5px 0 #763e61}
.surge-button{width:100%;min-height:75px;gap:12px;margin-top:13px;padding:7px 29px;font-size:15px;letter-spacing:.05em}
.surge-button .surge-art{width:57px;height:57px;flex:none;object-fit:contain;filter:drop-shadow(0 3px 5px #032346)}
.surge-button span{position:relative;z-index:1;overflow-wrap:anywhere}
.surge-button:not(:disabled) .surge-art{animation:tide-pulse 2.3s ease-in-out infinite}
.surge-button:disabled,.dive-button:disabled,.prestige-actions button:disabled{opacity:.78;filter:saturate(.65);cursor:not-allowed}
.shot-choices button{min-height:88px;padding:11px 22px;border:1px solid #8ddbed;border-radius:14px;background:linear-gradient(180deg,#1c668e,#123b6d);color:#fff8e8;box-shadow:inset 0 1px 0 #ffffff33,0 4px 0 #08294b}
.shot-choices button::before{display:none}
.shot-choices button small{color:#e9f8ff}
.shot-result strong{color:#ffe0a4}

/* Crew, research and reward cards now read as inventory objects. */
.shop-list{gap:11px}
.shop-item{min-height:140px;grid-template-columns:82px minmax(0,1fr) minmax(135px,155px);gap:16px;padding:15px;border-color:#76c7d8;background-size:cover;box-shadow:0 6px 14px #04152c99,inset 0 1px 0 #ffffff22}
.shop-item:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 12px 20px #04152cb3,inset 0 1px 0 #ffffff33}
.shop-item .shop-icon,.shop-art{width:78px;height:78px}
.shop-item .shop-icon{background:rgba(9,38,83,.62);border:1px solid #91d2e3;box-shadow:0 5px 10px #06152999}
.shop-info strong{color:#fff8e8;font-size:20px;text-shadow:0 2px 3px #041630}
.shop-info small{color:#d9efff;font-size:13px}
.shop-info .milestone{font-size:11px;color:#a2e9ff}
.shop-price{min-width:135px;padding:10px;border-color:#90d9e9;background:#071c3de8}
.price-row{font-size:26px;color:#ffe0a6}
.price-art{width:29px;height:29px}
.shop-price-detail{font-size:12px}
.shop-buy-state{min-height:29px;background:#70c9e8;color:#062148;font-size:12px}
.shop-item:disabled .shop-buy-state{background:#425b7e;color:#f2f7ff}
.quantity-picker button{min-height:48px;font-size:13px}
.upgrade-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
.upgrade-item{min-height:119px;padding:14px;border-color:#73bfd9;background:linear-gradient(90deg,#0b2757eb,#09204eeb),url("../assets/room-lab-rpg-v8.webp") center/cover}
.upgrade-symbol,.upgrade-art{width:64px;height:64px}
.upgrade-item strong{color:#fff7e7;font-size:19px}
.upgrade-item small{color:#d9eaff;font-size:13px}
.upgrade-level{font-size:10px}
.upgrade-cost{min-width:92px;padding:8px;color:#ffe0a8;font-size:19px}
.upgrade-cost .price-art{width:29px;height:29px}
.mission-item{min-height:105px;padding:13px;border-color:#72bcd7;background:#09234fda}
.mission-item.mission-active{background:#30355fdc}
.mission-icon,.mission-art{width:55px;height:55px}
.mission-info strong{color:#fff7e8;font-size:17px}
.mission-info small,.mission-action small{font-size:12px}
.mission-action button{min-height:40px;padding:6px 16px;color:#fff8e8;font-size:12px}
.dive-art{background:linear-gradient(110deg,#173c70dd,#112759e8),url("../assets/room-expedition-rpg-v8.webp") center/cover}
.dive-art>.sprite{animation:crew-bob 4.5s ease-in-out infinite}
.achievement-list{grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.achievement{min-height:120px;padding:12px;border-color:#77b6d2;background:linear-gradient(180deg,#1e385c,#132344)}
.achievement-icon,.achievement-art{width:55px;height:55px}
.achievement strong{font-size:12px!important;color:#f9f3e9}
.achievement-progress{font-size:11px!important;color:#a7e6ff!important}
.achievement.unlocked{background:linear-gradient(180deg,#5b4a74,#282e59);box-shadow:0 0 15px #f8b98533}
.leaderboard-board{border-color:#71bed5;background:#071c3cdb}
.leaderboard-board td{font-size:15px}
.nickname-controls button{min-width:155px;font-size:12px}
.prestige-actions strong{color:#ffe0a7;font-size:27px}
.prestige-actions button{font-size:13px}
.stats-grid>div{border-color:#7fc1d8;background:linear-gradient(150deg,#21416f,#122a55)}
.stats-grid strong{color:#fff5de;font-size:27px}
.status-panel{background-image:linear-gradient(180deg,rgba(13,33,72,.88),rgba(8,21,51,.97)),url("../assets/room-hall-rpg-v8.webp");background-position:center;background-size:cover}
.depth-card{border:1px solid #79bfda;background:linear-gradient(130deg,#2a4879,#172f59)}
.depth-top strong{color:#ffca8e}

@keyframes hero-float{50%{transform:translateY(-8px) rotate(2deg)}}
@keyframes crew-bob{50%{transform:translateY(-5px) rotate(-2deg)}}
@keyframes selected-icon{50%{transform:translateY(-3px) scale(1.12) rotate(-5deg)}}
@keyframes tide-pulse{50%{transform:scale(1.1) rotate(5deg);filter:drop-shadow(0 0 8px #84efff)}}

@media(max-width:1000px){.masthead-hero{right:3%;width:170px;height:170px}.masthead>div{max-width:calc(100% - 155px)}.upgrade-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){.page-shell{width:min(100% - 24px,620px)}.masthead{min-height:180px;padding:18px 22px}.masthead h1{font-size:clamp(39px,7.5vw,59px)}.masthead-hero{right:0;bottom:-22px;width:165px;height:165px}.shop-list{grid-template-columns:1fr}.achievement-list{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){
  .page-shell{width:calc(100% - 14px)}
  .topbar{min-height:52px}
  .masthead{min-height:150px;padding:14px 15px}.masthead h1{font-size:clamp(35px,9vw,50px)}.masthead-sub{max-width:250px;margin-top:8px;font-size:10px}.masthead .eyebrow{margin-bottom:7px;font-size:8px}.masthead .leaderboard-jump{margin-top:7px;min-height:34px;font-size:8px}.masthead-hero{right:-5px;bottom:-9px;width:125px;height:125px}.masthead>div{max-width:calc(100% - 85px)}
  .room-heading{min-height:86px;padding:11px 14px}.room-heading h2{font-size:26px}.room-wallet{min-width:110px;padding:6px}.room-wallet strong{font-size:20px}
  .room-nav{top:auto;background:#071d3dec}.room-tab{min-height:57px;font-size:9px}.room-tab-art{width:32px;height:32px}
  .shot-zone{padding:11px}.shot-board{background-position:center}.shot-scorebar>div{min-height:55px}.shot-scorebar strong{font-size:21px}.shot-scorebar small{font-size:9px}
  .shot-board:has(.shot-result:not([hidden])){min-height:390px;aspect-ratio:auto}
  .shot-field-guide span{min-height:44px;font-size:9px}.shot-guide-art{width:26px;height:26px}.shot-instruction p{font-size:11px}
  .shot-result{gap:7px;padding:12px}.shot-result strong{font-size:29px}.shot-result p{font-size:10px}.shot-choices{grid-template-columns:1fr;gap:6px;width:min(100%,310px)}.shot-choices button{min-height:52px;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:9px;margin:0;padding:6px 12px;border:1px solid #8ddbed;border-radius:12px;background:#14507c;color:#fff8e8;text-align:left}.shot-choices button b{font-size:12px;white-space:nowrap}.shot-choices button small{font-size:10px;text-align:right}
  .surge-button{min-height:64px;gap:6px;padding:6px 25px;font-size:12px}.surge-button .surge-art{width:45px;height:45px}
  .dive-button,.prestige-actions button,.shot-result button{min-height:59px;font-size:12px}
  .shop-item{min-height:149px;grid-template-columns:64px minmax(0,1fr);gap:8px 10px;padding:12px}.shop-item .shop-icon,.shop-art{width:61px;height:61px}.shop-info strong{font-size:17px}.shop-info small{font-size:11px}.shop-price{grid-column:1/-1;min-width:0;width:100%}.price-row{font-size:22px}.shop-price-detail{font-size:11px}.shop-buy-state{font-size:11px}
  .upgrade-list{grid-template-columns:1fr}.upgrade-item{min-height:116px}.upgrade-item strong{font-size:17px}.upgrade-item small{font-size:12px}.upgrade-symbol,.upgrade-art{width:53px;height:53px}.upgrade-cost{min-width:75px;font-size:16px}
  .mission-icon,.mission-art{width:42px;height:42px}.mission-info strong{font-size:15px}.mission-action button{min-height:38px}
  .mission-action button{min-width:102px;font-size:11px}
  .shop-list,.upgrade-list,.mission-list,.side-mission-list,.achievement-list{max-height:none;overflow:visible}
  .achievement{min-height:106px;padding:7px}.achievement-icon,.achievement-art{width:42px;height:42px}.achievement strong{font-size:10px!important}.achievement-progress{font-size:9px!important}
}
@media(max-width:370px){.masthead-hero{width:105px;height:105px}.masthead h1{font-size:35px}.room-tab{font-size:8px}.room-tab-art{width:29px;height:29px}.surge-button{font-size:11px}}
@media(prefers-reduced-motion:reduce){.masthead-hero,.room-tab[aria-selected="true"] .room-tab-art,.shop-head img,.dive-art>.sprite,.surge-button:not(:disabled) .surge-art{animation:none!important}}

/* Panel geometry: the image and highlights end exactly at the rounded corners. */
.room-nav,.room-heading,.panel,.lower-panel,.prestige-panel,.leaderboard-panel,.shop-item,.upgrade-item,.mission-item,.achievement,.shot-scorebar>div,.stats-grid>div,.depth-card,.dive-art,.leaderboard-board,.shot-choices button{border-image:none;overflow:hidden;background-clip:padding-box}
.panel,.lower-panel,.prestige-panel,.leaderboard-panel{border-radius:20px}
.room-heading{border-radius:20px}.room-nav{border-radius:20px}.shop-item,.upgrade-item,.mission-item,.achievement,.depth-card,.dive-art{border-radius:14px}
.room-nav,.room-heading,.panel,.lower-panel,.prestige-panel,.leaderboard-panel{box-shadow:inset 0 1px 0 #ffffff2b,0 12px 27px #010b2699}
.room-heading::after,.panel::after,.lower-panel::after,.prestige-panel::after{border-radius:inherit}
.dive-button::before,.prestige-actions button::before,.shot-result button::before{border-image:none}
@media(max-width:650px){.shot-choices button{border-image:none;border-radius:12px}.room-nav,.room-heading,.panel,.lower-panel,.prestige-panel,.leaderboard-panel{border-radius:16px}}

/* The approved comic direction: bold silhouettes, flat color steps and sprite ornaments. */
:root{--ui-ink:#07183b;--ui-cyan:#4ce4e9;--ui-gold:#ffda69;--ui-coral:#ff777e}
body{background-color:#071636;background-image:linear-gradient(180deg,#07183bcb,#07142df0 62%),url("../assets/arcade-reef-rpg-v8.webp")}
.topbar{border-bottom:3px solid #051334;background:#09244df2;box-shadow:0 4px 0 #2aaac655}
.wordmark,.topbar-actions{filter:drop-shadow(0 2px 0 #061634)}
.masthead{border:3px solid #07183b;border-radius:23px;background-image:linear-gradient(90deg,#082956f5 0%,#0b3971df 47%,#0b39715c 100%),url("../assets/arcade-reef-rpg-v8.webp");box-shadow:inset 0 0 0 3px #3cd4e488,0 10px 0 #061634,0 19px 28px #010a20a6}
.masthead::after{inset:5px;border:2px solid #ffdc6e77;border-radius:15px}
.masthead h1,.room-heading h2,.shop-head h2,.lower-heading h2{color:#fff7e5;text-shadow:3px 4px 0 #07183b,0 6px 0 #07183b}
.masthead-hero{filter:drop-shadow(0 9px 0 #061836a8);animation:hero-float 3.2s ease-in-out infinite}
.room-nav,.room-heading,.panel,.lower-panel,.prestige-panel,.leaderboard-panel{border:3px solid #06183b;border-image:none;box-shadow:inset 0 0 0 2px #54dce67d,0 8px 0 #05152f,0 17px 25px #010a23a3}
.room-nav{background:linear-gradient(90deg,#0c3e74f7,#10325df7),url("../assets/arcade-reef-rpg-v8.webp") center/cover;overflow:hidden}
.room-tab{border:2px solid #173963;border-radius:13px;background:#1b4b7b;color:#e8faff;text-shadow:1px 2px 0 #07183b;box-shadow:inset 0 2px 0 #79e6eb5c,0 4px 0 #061a3b;transition:transform .18s cubic-bezier(.2,1.5,.4,1),filter .18s,background .18s}
.room-tab:hover{transform:translateY(-3px);background:#236293;filter:brightness(1.08)}
.room-tab[aria-selected="true"]{border-color:#ffe89d;background:#ef7890;color:#fff8da;box-shadow:inset 0 2px 0 #fff6df80,0 5px 0 #713c66,0 0 0 2px #091e45}
.room-tab-art{filter:drop-shadow(0 3px 0 #07183b91)}
.room-heading{background-color:#143f71;animation:room-enter .34s cubic-bezier(.2,.9,.2,1) both}
.room-heading p{color:#e8f7fc}
.room-eyebrow,.panel-heading,.lower-heading>span,.click-topline{color:#80f4f4}
.room-wallet{border:2px solid #ffda69;border-radius:13px;background:#082b59;box-shadow:inset 0 2px 0 #58cbdca1,0 5px 0 #061b40}
.room-wallet strong{color:#ffe18b;text-shadow:2px 2px 0 #663c58}
.panel,.lower-panel,.prestige-panel,.leaderboard-panel{background-color:#123d6b}
.shot-zone{background-image:linear-gradient(180deg,#0a3b6bed,#082b55ed),url("../assets/arcade-reef-rpg-v8.webp")}
.shot-board{border:4px solid #092752;border-radius:22px;outline:3px solid #58dce0;outline-offset:0;box-shadow:0 0 0 6px #0c2b55,0 10px 0 #051632,0 18px 25px #020c29bb;background-color:#0d77ac;background-image:url("../assets/swag-shot-board-rpg-v8.webp")}
.shot-board:focus-visible{outline-color:#ffe88d;box-shadow:0 0 0 6px #0c2b55,0 0 0 10px #ffe88d,0 12px 22px #020c29bb}
.shot-scorebar>div,.stats-grid>div,.depth-card{border:2px solid #092047;border-radius:12px;background:#1b5887;box-shadow:inset 0 2px 0 #80e5ee6b,0 4px 0 #071e44}
.shot-scorebar small{color:#baf9f6}.shot-scorebar strong,.stats-grid strong{color:#fff4ca;text-shadow:2px 3px 0 #0a315d}
.shot-modebar,.shot-field-guide span,.shot-instruction{border:2px solid #082249;border-radius:11px;background:#165788;color:#eaffff;box-shadow:inset 0 1px 0 #70e3ee75,0 3px 0 #061d40}
.shot-modebar strong{color:#ffe07d}
.shot-switch button,.quantity-picker button,.mission-action button,.nickname-controls button{border:2px solid #071e42;border-radius:11px;background:#2c86b4;color:#fff9dd;box-shadow:inset 0 2px 0 #a5f1f899,0 4px 0 #071b3d;text-shadow:1px 2px 0 #0a3a65;transition:transform .16s,filter .16s}
.shot-switch button[aria-pressed="true"],.quantity-picker button.selected{border-color:#492849;background:#f57686;color:#fff8de;box-shadow:inset 0 2px 0 #ffe9ce99,0 4px 0 #7c3b62}
.shot-switch button:active,.quantity-picker button:active,.mission-action button:active,.nickname-controls button:active{transform:translateY(3px);box-shadow:inset 0 1px 0 #ffffff66,0 1px 0 #071b3d}
.dive-button,.surge-button,.prestige-actions button,.shot-result button{border:3px solid #071d40;border-radius:15px;background:#31a9b8;color:#fff8d9;box-shadow:inset 0 3px 0 #bdffff8c,0 5px 0 #082b4b;text-shadow:2px 2px 0 #0b4266;transition:transform .17s cubic-bezier(.2,1.5,.4,1),filter .17s,box-shadow .17s}
.dive-button,.shot-result button{background:#ef7887;box-shadow:inset 0 3px 0 #ffe7d698,0 5px 0 #793657;text-shadow:2px 2px 0 #7b3d62}
.surge-button{background:#1daab9;border-color:#062849;justify-content:center}
.surge-button .surge-art{width:58px;height:58px;object-fit:contain;image-rendering:auto;filter:drop-shadow(0 3px 0 #073f5c)}
.dive-button:active,.surge-button:active,.prestige-actions button:active,.shot-result button:active{transform:translateY(4px);box-shadow:inset 0 1px 0 #fff8d588,0 1px 0 #071b3d}
.shot-choices button,.shop-item,.upgrade-item,.mission-item,.achievement,.leaderboard-board,.dive-art{border:2px solid #071c3e;border-image:none;border-radius:13px;box-shadow:inset 0 2px 0 #77e4ee66,0 4px 0 #071936}
.shot-choices button{background:#225e8a}
.shop-item{background-image:linear-gradient(90deg,#103762eb,#12497dcf),var(--habitat);background-size:cover}
.shop-item:hover:not(:disabled),.upgrade-item:hover:not(:disabled),.mission-item:hover,.achievement.unlocked:hover{transform:translateY(-3px);box-shadow:inset 0 2px 0 #aefaff99,0 7px 0 #071936}
.shop-item .shop-icon{border:2px solid #06234c;border-radius:15px;background:#1d5985;box-shadow:inset 0 2px 0 #8ceaf38a,0 4px 0 #071934}
.shop-price,.upgrade-cost{border:2px solid #09234a;border-radius:11px;background:#092d56;box-shadow:inset 0 2px 0 #56bdd075}
.shop-info strong,.upgrade-item strong,.mission-info strong{color:#fff5d3;text-shadow:1px 2px 0 #082044}
.price-row,.upgrade-cost{color:#ffda75}
.shop-buy-state{border-radius:8px;background:#4bd0d3;color:#092b4a}
.achievement{background:#19466e}.achievement.unlocked{background:#365b85;border-color:#ffd168;box-shadow:inset 0 2px 0 #fff3ba99,0 4px 0 #4d315a}
.status-panel{background-image:linear-gradient(180deg,#133d70e8,#0a2d57f4),url("../assets/room-hall-rpg-v8.webp")}
.shot-result{background:linear-gradient(180deg,#0b4d87ed,#071d43f5)}
.shot-mascot{transform-origin:50% 85%;filter:drop-shadow(0 5px 0 #0928538c)}
.shot-mascot.is-aiming{animation:mascot-aim .85s ease-in-out infinite}
.shot-scorebar strong.hud-pop{animation:hud-pop .28s cubic-bezier(.2,1.6,.3,1)}
.achievement.unlocked .achievement-icon{animation:trophy-bob 3.2s ease-in-out infinite}
@keyframes mascot-aim{50%{transform:translateY(-3px) rotate(-2deg) scale(1.04)}}
@keyframes hud-pop{0%{transform:scale(.72)}65%{transform:scale(1.17)}100%{transform:scale(1)}}
@keyframes trophy-bob{50%{transform:translateY(-3px) rotate(4deg)}}
@media(max-width:650px){.room-nav,.room-heading,.panel,.lower-panel,.prestige-panel,.leaderboard-panel{border-width:2px;box-shadow:inset 0 0 0 1px #54dce67d,0 5px 0 #05152f,0 10px 16px #010a23a3}.room-tab{border-width:1px;border-radius:10px}.shot-board{border-width:3px;outline-width:2px}.shot-scorebar>div{border-width:1px}.shot-choices button{border-radius:10px}}
@media(prefers-reduced-motion:reduce){.shot-mascot.is-aiming,.achievement.unlocked .achievement-icon,.shot-scorebar strong.hud-pop{animation:none!important}}

/* Keep costs and goals legible before they can be purchased. */
.upgrade-item:disabled{opacity:1;background:#14345ee8}
.upgrade-item:disabled strong{color:#fff2d2}
.upgrade-item:disabled small{color:#d6ebf7}
.upgrade-item:disabled .upgrade-cost{color:#ffda75}
.mission-item.mission-locked{opacity:1;background:#12365ee8}
.mission-item.mission-locked .mission-info strong{color:#fff0d1}
.shot-mascot{right:auto;left:1%;max-width:190px}
@media(max-width:650px){.shot-mascot{left:0;width:22%}}