:root{font-family:'Courier New',ui-monospace,monospace;color:#e8fff4;background:#071927;color-scheme:dark;--mint:#94efc0;--ink:#082334;--gold:#ffdc88}*{box-sizing:border-box}body{margin:0;min-height:100vh;isolation:isolate}button,input{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #ffdf8d;outline-offset:4px}button{transition:filter .1s}button:hover:not(:disabled){filter:brightness(1.15)}.sea{position:fixed;inset:0;z-index:-1;background:#061a2d url('assets/world/ocean-pixel.png') center/cover no-repeat;image-rendering:pixelated}.sea:after{content:'';position:absolute;inset:0;background:#04142144}.game{width:min(850px,calc(100% - 32px));margin:22px auto;filter:drop-shadow(0 10px 20px #0006)}header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;background:#0c2b3eed;border:3px solid #537c89;box-shadow:inset 0 0 0 3px #10202d,4px 4px 0 #031420}.logo{font-size:28px;font-weight:900;letter-spacing:5px;color:#e3ffe9;text-decoration:none;text-shadow:3px 3px #193c49}.logo small{display:block;font-size:8px;letter-spacing:3px;margin-top:5px;color:#a0ccca}.wallet{display:grid;grid-template-columns:1fr 22px;align-items:center;text-align:right;gap:2px 8px}.wallet small{font-size:9px;letter-spacing:1px;color:#b6d3cf}.wallet strong{font-size:24px;color:var(--gold);font-variant-numeric:tabular-nums}.wallet>span{grid-column:2;grid-row:1/3;font-size:24px;color:var(--gold);text-shadow:2px 2px #795838}nav{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0}nav button{padding:13px 8px;border:2px solid #71939a;background:#163b4ded;color:#d0e2e0;font-weight:700;font-size:12px;box-shadow:3px 3px 0 #061723}nav button.active{background:#315747;border-color:#b8e6bd;color:#e0ffd7;box-shadow:inset 0 -4px #1b3b35,3px 3px 0 #061723}main{border:3px solid #608594;background:#092337ee;padding:20px;box-shadow:inset 0 0 0 3px #061825,4px 4px 0 #04121d}.heading{margin-bottom:18px}.heading h1{font-size:23px;margin:0 0 7px;text-shadow:2px 2px #06202c;letter-spacing:-.7px}.heading p{font-size:11px;line-height:1.6;color:#bed6d9;margin:0}.regions{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:12px}.regions button{background:#133749;border:2px solid #426675;color:#c6e0e0;font-size:11px;padding:9px 4px}.selected{background:#325b51!important;border-color:#a8dfb9!important;color:#ecffdf!important}.viewport{position:relative;height:345px;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#052239 url('assets/world/ocean-pixel.png') center/cover;image-rendering:pixelated;border:4px solid #577d89;box-shadow:inset 0 0 0 3px #092133;overflow:hidden}.viewport:before{content:'';position:absolute;inset:4px;border:1px solid #a5d6cf55;pointer-events:none}.sector{position:absolute;top:18px;left:19px;right:19px;display:flex;justify-content:space-between;font-size:10px;font-weight:700;letter-spacing:1px;color:#c0ffdc;text-shadow:2px 2px #062036}.sector span{color:#b0d2dc;font-size:9px}.sonar{position:relative;width:126px;height:126px;overflow:hidden;border:4px solid #9ad7b7;clip-path:polygon(20% 0,80% 0,80% 7%,93% 7%,93% 20%,100% 20%,100% 80%,93% 80%,93% 93%,80% 93%,80% 100%,20% 100%,20% 93%,7% 93%,7% 80%,0 80%,0 20%,7% 20%,7% 7%,20% 7%);background:repeating-linear-gradient(0deg,transparent 0 23px,#65c49933 23px 25px),repeating-linear-gradient(90deg,transparent 0 23px,#65c49933 23px 25px),#082f35;box-shadow:inset 0 0 0 6px #143c43;margin-top:-40px}.sonar b{font-size:45px;font-weight:400;color:#ceffcd;position:relative;z-index:1}.sweep{position:absolute;inset:0;background:conic-gradient(transparent 0 270deg,#9be9aa66 360deg);animation:sweep 5s steps(32) infinite}.sonar:active{transform:scale(.96)}.sonar.ping{animation:ping .25s steps(3)}.tap-label{font-size:10px;letter-spacing:1px;text-shadow:2px 2px #051629;background:#07273bce;padding:7px 10px;margin:12px 0 0}.tap-label small{display:block;text-align:center;color:#c2efd3;letter-spacing:0;font-size:10px;margin-top:4px}.meter{position:absolute;bottom:18px;left:20px;right:20px;padding:11px 13px;background:#082334e8;border:2px solid #58868b}.meter>div:first-child{display:flex;justify-content:space-between;gap:8px;font-size:10px;margin-bottom:8px}.meter strong{color:var(--mint)}.track{height:13px;background:#061622;border:2px solid #3f626e}.track i{height:100%;display:block;background:repeating-linear-gradient(90deg,#a4ebb8 0 10px,#70b9a0 10px 12px);width:0;transition:width .15s}.gain{position:absolute;top:40%;left:50%;font-weight:bold;font-size:14px;color:#f0ffc9;text-shadow:2px 2px #123526;animation:gain .7s steps(8) forwards;pointer-events:none;white-space:nowrap}.shop{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.shop-item{background:#14374a;border:2px solid #5c8190;padding:21px 10px 13px;text-align:center;box-shadow:inset 0 -5px #0c2535}.shop-item h2{font-size:12px;margin:23px 0 13px;min-height:28px}.chest{--chest:#65d8bd;width:96px;height:72px;position:relative;margin:auto;filter:drop-shadow(4px 5px 0 #03132188)}.lid{position:absolute;left:0;right:0;top:0;height:27px;border:4px solid #061c2a;background:var(--chest);box-shadow:inset 0 5px #ffffff44,inset 0 -5px #08283755;z-index:2}.box{position:absolute;left:4px;right:4px;bottom:0;height:47px;border:4px solid #061c2a;background:linear-gradient(90deg,var(--chest) 0 10%,#23495b 10% 90%,var(--chest) 90%);box-shadow:inset 0 -6px #061c2a55}.chest i{position:absolute;top:24px;left:36px;width:24px;height:22px;display:grid;place-items:center;background:var(--gold);color:#604a2b;border:3px solid #102c38;z-index:3;font-style:normal;font-size:12px}.btn{display:inline-flex;justify-content:center;align-items:center;text-decoration:none;background:#a1e3b8;color:#0a3036;border:2px solid #d4ffce;padding:11px 12px;font-size:11px;font-weight:700;box-shadow:inset 0 -4px #70af94,3px 3px 0 #061723}.btn:active:not(:disabled){transform:translate(2px,2px);box-shadow:inset 0 -2px #70af94,1px 1px 0 #061723}.btn.secondary{background:#284a5c;border-color:#789ba9;color:#e0eef0;box-shadow:inset 0 -4px #183646,3px 3px 0 #061723}.shop-item .btn{width:100%;padding:10px 3px;font-size:10px}.cargo{display:grid;grid-template-columns:1fr 1.2fr;gap:16px}.inventory{display:flex;flex-direction:column;gap:8px}.inventory button{display:flex;align-items:center;gap:10px;padding:13px 11px;background:#14394a;border:2px solid #587986;color:#dceef0;text-align:left;min-width:0}.inventory .chest{transform:scale(.5);width:96px;flex-shrink:0;margin:-17px -23px}.inventory span{font-size:11px;flex:1}.inventory b{font-size:16px;color:#fff0b8}.opening{text-align:center;padding:19px 16px;background:#102d40;border:2px solid #59818f}.opening h2{font-size:16px;margin:0}.pedestal{height:178px;display:grid;place-items:center;background:repeating-linear-gradient(0deg,transparent 0 17px,#7dc6b012 17px 19px),#062335;margin:14px 0;border:2px solid #2d5768}.pedestal .chest{transform:scale(1.3)}.opening .btn{width:100%}.text-btn{background:none;border:0;color:#b8ded2;font-size:10px;text-decoration:underline;padding:5px;cursor:pointer}.saved-link{margin-top:14px}footer{display:flex;justify-content:space-between;align-items:center;padding:13px 5px;font-size:8px;color:#c4dfdb;text-shadow:2px 2px #072335;letter-spacing:1px}dialog{color:#e8fff4;background:#102e43;border:4px solid #80a6af;box-shadow:inset 0 0 0 3px #061c2c,7px 7px 0 #020e19;padding:28px 24px;width:450px;max-width:calc(100% - 28px);max-height:90vh;overflow:auto}dialog::backdrop{background:#020d1bc7}.close{position:absolute;right:8px;top:5px;background:none;border:0;color:#bde6e1;font-size:24px;z-index:5}.close:disabled{opacity:0}dialog h2{font-size:20px;margin:0 0 14px}dialog p{color:#c5d9df;font-size:11px;line-height:1.7}.actions{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap}.actions>*{flex:1}.sprite{object-fit:contain;image-rendering:pixelated;display:block}.sprite.lum{filter:hue-rotate(35deg) saturate(1.3)}.reveal{text-align:center}.reveal>small{font-size:10px;letter-spacing:2px;color:#c7f2df}.sprite-stage{display:grid;place-items:center;height:220px;margin:12px 0;background:repeating-linear-gradient(0deg,transparent 0 19px,#8fdbc312 19px 20px),#082235;border:2px solid #456e80}.sprite-stage img{width:192px;height:192px;animation:reveal .35s steps(5)}.reveal h2{margin:12px 0;font-size:24px}.tier2 .sprite-stage{border-color:#b08bdd}.tier3 .sprite-stage{border-color:#e9c580}.type{display:inline-block;font-size:10px;color:var(--type);border:2px solid var(--type);padding:5px 10px;background:#062032}.opening-fx{position:relative;height:290px;display:flex;align-items:center;justify-content:center;background:#062438;overflow:hidden}.opening-fx h2{position:absolute;top:25px;font-size:13px;letter-spacing:2px;text-align:center;left:10px;right:10px}.fx-chest{transform:scale(1.5);animation:shake .65s steps(6)}.burst .lid{transform:translate(-8px,-50px) rotate(-10deg);opacity:0;transition:.35s steps(5)}.burst .box{transform:translateY(30px);opacity:0;transition:.35s steps(5)}.burst .chest i{opacity:0}.pixel-burst{position:absolute;inset:0;pointer-events:none}.pixel-burst i{position:absolute;left:50%;top:50%;width:8px;height:8px;background:#b7ffe0;opacity:0;box-shadow:4px 4px #69c7c7}.burst .pixel-burst i{animation:burst .6s steps(6) forwards}.opening-modal{width:470px;padding:12px}.saved-list{max-height:55vh;overflow:auto;margin:15px 0}.saved-list>div{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #426373}.saved-list .sprite{width:50px;height:50px}.saved-list span{font-size:11px;flex:1}.btn.tiny{font-size:9px;padding:8px}.setting{display:flex;justify-content:space-between;align-items:center;font-size:12px;margin:20px 0}.setting input{accent-color:#91dcb7}.download{display:flex;margin-top:15px}.toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,15px);background:#16394d;border:2px solid #b0d8be;color:#e4ffdd;padding:12px 16px;z-index:20;opacity:0;pointer-events:none;font-size:11px;text-align:center;max-width:90vw;box-shadow:4px 4px #051623;transition:.15s}.toast.visible{opacity:1;transform:translate(-50%,0)}.no-motion *{animation:none!important;transition:none!important}.no-motion .gain{transform:translate(-50%,-45px)}
@keyframes sweep{to{transform:rotate(360deg)}}@keyframes ping{50%{background-color:#64aa7c;filter:brightness(1.5)}}@keyframes gain{from{opacity:1;transform:translate(-50%,-10px)}to{opacity:0;transform:translate(-50%,-65px)}}@keyframes shake{0%,100%{transform:scale(1.5)}30%{transform:scale(1.5) rotate(-5deg)}60%{transform:scale(1.5) rotate(5deg)}}@keyframes burst{0%{opacity:1;transform:translate(0,0)}100%{opacity:0;transform:translate(var(--x),var(--y))}}@keyframes reveal{from{transform:translateY(15px);opacity:0}to{transform:translateY(0);opacity:1}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.gain{transform:translate(-50%,-45px)}}
@media(max-width:600px){.game{width:calc(100% - 20px);margin:10px auto}header{padding:13px 14px}.logo{font-size:24px;letter-spacing:4px}.wallet strong{font-size:21px}nav{gap:6px;margin:12px 0}nav button{font-size:10px;padding:12px 4px}main{padding:14px 12px}.heading h1{font-size:20px}.heading p{font-size:10px}.regions{gap:4px}.regions button{font-size:9px;padding:9px 2px}.viewport{height:345px}.sector{font-size:9px;left:14px;right:14px}.sector span{font-size:8px}.meter{left:12px;right:12px;padding:10px}.meter>div:first-child{font-size:9px}.shop{grid-template-columns:repeat(2,1fr);gap:10px}.shop-item{padding:20px 10px 14px}.shop-item h2{min-height:0;margin:20px 0 12px}.cargo{grid-template-columns:1fr;gap:12px}.inventory{display:grid;grid-template-columns:repeat(2,1fr)}.inventory button{padding:12px 8px;gap:6px}.inventory span{font-size:9px}.inventory b{font-size:14px}.inventory .chest{transform:scale(.4);margin:-20px -28px}.opening{padding:14px}.pedestal{height:150px}.actions .btn{font-size:10px;padding:11px 8px}.sprite-stage{height:200px}.sprite-stage img{width:176px;height:176px}dialog{padding:27px 17px}.saved-list>div{gap:5px}.saved-list .sprite{width:38px;height:38px}.saved-list span{font-size:10px}.saved-list .btn{font-size:8px;padding:8px 5px}}
/* 3.1: stepped expedition capsules; existing lid burst animation is retained. */
.chest{height:80px;filter:drop-shadow(4px 5px 0 #03132188)}.lid{height:40px;clip-path:polygon(18% 0,82% 0,82% 10%,92% 10%,92% 25%,100% 25%,100% 100%,0 100%,0 25%,8% 25%,8% 10%,18% 10%);border:4px solid #061c2a;border-bottom:7px solid #061c2a;background:var(--chest);box-shadow:inset 0 5px #ffffff55,inset 0 -5px #08283744}.lid:after{content:'';position:absolute;left:13px;top:7px;width:18px;height:7px;background:#ffffff66;box-shadow:0 7px #ffffff33}.box{height:43px;left:0;right:0;clip-path:polygon(0 0,100% 0,100% 65%,92% 65%,92% 85%,82% 85%,82% 100%,18% 100%,18% 85%,8% 85%,8% 65%,0 65%);background:#d8e9dd;border:4px solid #061c2a;box-shadow:inset 0 -7px #8aaab0,inset 7px 0 #f5fff1}.chest i{width:28px;height:28px;left:34px;top:28px;border:4px solid #061c2a;background:#efffec;color:#163746;font-size:13px;box-shadow:inset 0 -4px #8ab0a3}.chest i:after{content:'';position:absolute;width:6px;height:6px;right:0;bottom:0;background:#8ab0a3}.locked{filter:grayscale(.7);opacity:.65}.shop-item:has([data-lock]) .chest{opacity:.45}.shop-item .btn{min-height:38px}.unlock-view{text-align:center}.unlock-view>.chest{margin:7px auto 22px}.unlock-view h2{font-size:23px}.unlock-view .btn{width:100%;margin-top:10px}.unlock-or{margin:17px 0;font-size:10px;color:#aecaca}.unlock-goal{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px;border:2px solid #618a83;background:#173c41;text-align:left}.unlock-goal strong{font-size:12px}.unlock-goal span{font-size:13px;color:#dcf9b8;white-space:nowrap}.unlock-view .unlock-hint{font-size:10px}.locked-note{padding:10px;background:#473637;border:1px solid #b68665;color:#ffddb6!important}.cargo-links{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.lines-modal{width:760px}.line-filters{display:flex;flex-wrap:wrap;gap:6px;margin:17px 0}.line-filters button{padding:7px 9px;border:2px solid #5f8591;background:#133748;color:#d4e9e5;font-size:10px}.family-list{max-height:56vh;overflow:auto;scrollbar-width:thin;scrollbar-color:#7bb6a0 #0c2638}.family-list>section{padding:12px 14px;border:2px solid #406d7c;background:#082538;margin-bottom:10px}.family-heading{display:flex;justify-content:space-between;font-size:10px;gap:8px}.family-heading small{color:#b0ccce;font-size:9px}.evo-line{display:flex;align-items:center;justify-content:center;gap:10px;padding-top:10px}.evo-form{flex:1;min-width:0;text-align:center;position:relative}.evo-form img{width:96px;height:96px;margin:auto}.evo-form strong{display:block;font-size:11px;margin-top:5px;overflow-wrap:anywhere}.evo-form small{display:block;font-size:8px;margin-top:4px;color:#96b5c1}.evo-form.discovered:after{content:'✓';position:absolute;top:5px;right:10%;color:#a1e7bb;font-size:12px}.evo-arrow{color:#97c9ba;font-size:20px;flex:none}.compact{margin-top:15px;padding:10px 5px;border-top:1px solid #466573;border-bottom:1px solid #466573;gap:5px}.compact .evo-form img{width:64px;height:64px}.compact .evo-form strong{font-size:9px}.compact .evo-form small{font-size:7px}.compact .evo-arrow{font-size:16px}.compact .evo-form.discovered:after{display:none}@media(max-width:600px){.evo-line{gap:5px}.evo-form img{width:72px;height:72px}.evo-form strong{font-size:9px}.evo-arrow{font-size:17px}.family-list>section{padding:10px 6px}.compact .evo-form img{width:56px;height:56px}.compact .evo-form strong{font-size:8px}.line-filters button{font-size:9px;padding:7px}.unlock-goal strong{font-size:11px}}

.btn.danger{background:#d75d69;color:#fff;border-color:#862e48}.btn.danger:hover{background:#ed7180}#resetBtn{margin-left:auto;color:#e9a5aa}

.sprite.silhouette{filter:brightness(0);opacity:1}.undiscovered strong{color:#89a5b0}.collection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.collection-family{min-width:0;padding:10px 5px 14px;border:2px solid #406d7c;background:#082538}.collection-family .evo-form img{width:80px;height:80px}.collection-family .evo-line{gap:4px}.collection-family .evo-form strong{font-size:10px}.collection-family .evo-form small{font-size:7px}@media(max-width:600px){.collection-grid{grid-template-columns:1fr}.collection-family .evo-form img{width:80px;height:80px}nav{gap:4px}nav button{font-size:9px}}

.sprite.lum{filter:hue-rotate(155deg) saturate(1.4)}.variant-banner{color:#fff0ae;background:#4c385d;border:2px solid #edc66e;padding:9px 5px;margin:0 0 14px;font-size:11px;font-weight:bold}.variant-reveal .sprite-stage{position:relative;background:radial-gradient(ellipse,#72558277,transparent 65%)}.variant-reveal .sprite-stage:after{content:'✦';position:absolute;color:#ffe9a0;font-size:26px;top:20px;right:15%;text-shadow:-200px 105px #a2e8fc,15px 145px #ffe9a0;animation:variant-spark 1.4s steps(4) infinite;pointer-events:none}.variant-value{color:#ffdfa1!important;font-size:10px!important}.variant-badge{display:block;color:#ffe8a5;font-size:8px;margin-top:4px}.ideal-gain{color:#ffe09b;font-size:11px;max-width:94%;white-space:normal;text-align:center}.sonar.ideal-ping{border-color:#ffe595;animation:ideal-ping .45s steps(4)}@keyframes ideal-ping{50%{background-color:#938248;filter:brightness(1.5);transform:scale(1.04)}}@keyframes variant-spark{50%{opacity:.35;transform:scale(.8)}}

.collection-tabs{display:flex;gap:8px;margin-bottom:16px}.collection-tabs button{flex:1;background:#133749;border:2px solid #577d89;color:#c6e0e0;padding:10px;font-size:11px;font-weight:bold}.shop-item{position:relative}.crate-info{width:25px;height:25px;border:2px solid #86a9b8;background:#16374d;color:#e1f5f1;font-weight:bold;font-size:13px;flex:none;padding:0}.shop-item>.crate-info{position:absolute;right:5px;top:5px}.crate-source{display:block;min-height:27px;color:#bcd0d4;font-size:8px;line-height:1.5}.inventory-row{display:flex;align-items:center;gap:5px}.inventory-row>[data-chest]{flex:1}.inventory-row>.crate-info{margin:0}.special-chest .box{background:#d5c5e3;box-shadow:inset 0 -7px #7e86ab,inset 7px 0 #f3edff}.special-chest i{background:#ffe5a4}.inventory{max-height:430px;overflow:auto;padding:0 3px 3px 0}.odds-modal{width:680px}.rarity-odds{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}.rarity-odds span{display:flex;justify-content:space-between;gap:6px;padding:9px;border:1px solid #638292;font-size:10px}.rarity-odds b{color:#ffe3a0}.drop-table-wrap{overflow:auto;max-height:48vh}.drop-table{width:100%;border-collapse:collapse;font-size:10px}.drop-table thead{position:sticky;top:0;background:#16394c;z-index:1}.drop-table th,.drop-table td{padding:8px 5px;border-bottom:1px solid #395c70;text-align:right;white-space:nowrap}.drop-table th:first-child{text-align:left}.drop-table tbody th{display:flex;align-items:center;gap:7px}.drop-table .sprite{width:40px;height:40px}.drop-table small{display:block;color:#a6c8d0;font-size:8px;margin-top:4px}@media(max-width:600px){.inventory{grid-template-columns:1fr;max-height:260px}.drop-table{font-size:9px}.drop-table .sprite{width:30px;height:30px}.drop-table th,.drop-table td{padding:8px 3px}}

.inventory .crate-info{display:grid;place-items:center;padding:0;width:25px;min-width:25px;flex:none}.drop-table tbody th{display:table-cell}.drop-table th .sprite{vertical-align:middle;margin-right:7px}.drop-table th span{display:inline-block;vertical-align:middle}
/* Distinct pixel constructions. Ornaments belong to lid/body and follow the burst. */
.chest .crate-top,.chest .crate-accent,.chest .crate-band,.chest .crate-studs{position:absolute;display:block;pointer-events:none}
.chest .crate-top{z-index:1}.chest .crate-accent{z-index:2}.chest .crate-band{z-index:1}.chest .crate-studs{z-index:2}
.chest .lid:after{display:none}
/* Reef: rounded coral ribs and a scalloped wave band. */
.crate-0 .crate-top{left:16px;top:5px;width:5px;height:20px;background:#d4ffee;box-shadow:13px -3px #c5ffea,26px -5px #c5ffea,39px -3px #c5ffea,52px 0 #c5ffea;opacity:.6}
.crate-0 .crate-band{left:8px;right:8px;top:5px;height:8px;background:repeating-linear-gradient(90deg,#62aa9c 0 8px,#eaffde 8px 16px);clip-path:polygon(0 0,100% 0,100% 50%,88% 50%,88% 100%,75% 100%,75% 50%,62% 50%,62% 100%,50% 100%,50% 50%,38% 50%,38% 100%,25% 100%,25% 50%,12% 50%,12% 100%,0 100%)}
/* Wreck: squarer riveted steel shell with diagonal armor panels. */
.crate-1 .lid{clip-path:polygon(8% 0,92% 0,92% 12%,100% 12%,100% 100%,0 100%,0 12%,8% 12%)}
.crate-1 .box{clip-path:polygon(0 0,100% 0,100% 85%,92% 85%,92% 100%,8% 100%,8% 85%,0 85%);background:#819a9d}
.crate-1 .crate-top{inset:5px 9px;background:repeating-linear-gradient(135deg,transparent 0 12px,#573a3266 12px 18px)}
.crate-1 .crate-band{left:14px;top:0;width:6px;height:35px;background:#4e666b;box-shadow:48px 0 #4e666b}
.crate-1 .crate-studs{left:5px;top:5px;width:5px;height:5px;background:#f6dcc1;box-shadow:72px 0 #f6dcc1,0 18px #f6dcc1,72px 18px #f6dcc1}
/* Abyss: angular hexagonal dome, segmented chevrons. */
.crate-2 .lid{clip-path:polygon(25% 0,75% 0,100% 45%,100% 100%,0 100%,0 45%);height:43px;top:-3px}
.crate-2 .box{clip-path:polygon(0 0,100% 0,100% 50%,75% 100%,25% 100%,0 50%);background:#a3b0d8}
.crate-2 .crate-top{left:16px;top:7px;width:56px;height:19px;background:#ddd7ff;clip-path:polygon(0 0,40% 0,50% 35%,60% 0,100% 0,70% 100%,50% 55%,30% 100%)}
.crate-2 .crate-band{left:13px;right:13px;top:9px;height:14px;border-left:6px solid #534d83;border-right:6px solid #534d83}
.crate-2 i{background:#d9d1ff;clip-path:polygon(25% 0,75% 0,100% 25%,100% 75%,75% 100%,25% 100%,0 75%,0 25%)}
/* Vents: thick shoulders and a bank of ventilation slots. */
.crate-3 .lid{clip-path:polygon(10% 0,90% 0,90% 18%,100% 18%,100% 100%,0 100%,0 18%,10% 18%)}
.crate-3 .crate-top{left:12px;top:7px;width:7px;height:15px;background:#4c3435;box-shadow:14px 0 #4c3435,28px 0 #4c3435,42px 0 #4c3435,56px 0 #4c3435}
.crate-3 .box{background:#b69e88}
.crate-3 .crate-band{left:12px;top:7px;width:6px;height:20px;background:#574545;box-shadow:57px 0 #574545}
.crate-3 i{background:#ffca7e;border-width:5px}
/* Pearl: shell fan canopy with a row of stepped pearl beads. */
.crate-4 .lid{top:-5px;height:45px;clip-path:polygon(0 45%,8% 45%,8% 22%,20% 22%,20% 10%,35% 10%,35% 0,65% 0,65% 10%,80% 10%,80% 22%,92% 22%,92% 45%,100% 45%,100% 100%,0 100%)}
.crate-4 .crate-top{left:12px;top:7px;width:5px;height:27px;background:#fff3d6;box-shadow:13px -4px #fff3d6,26px -7px #fff3d6,39px -4px #fff3d6,52px 0 #fff3d6;opacity:.85}
.crate-4 .box{background:#f4e8ce;box-shadow:inset 0 -7px #c1a780,inset 7px 0 #fff9eb}
.crate-4 .crate-studs{left:10px;top:15px;width:7px;height:7px;background:#fffefa;box-shadow:13px 5px #fffefa,43px 5px #fffefa,56px 0 #fffefa;border-bottom:2px solid #cfb3b5}
.crate-4 i{background:#fff9f2;color:#ab7796;border-color:#624e62}
/* Relic: rectangular ancient casing, double straps and square seal. */
.crate-5 .lid{clip-path:polygon(5% 0,95% 0,95% 10%,100% 10%,100% 100%,0 100%,0 10%,5% 10%)}
.crate-5 .box{clip-path:polygon(0 0,100% 0,100% 90%,95% 90%,95% 100%,5% 100%,5% 90%,0 90%);background:#89aaa0;box-shadow:inset 0 -7px #476a67,inset 7px 0 #bfe0c1}
.crate-5 .crate-top{left:12px;top:0;width:9px;height:33px;background:#e0bb6b;border-left:3px solid #775b36;box-shadow:53px 0 #e0bb6b}
.crate-5 .crate-band{left:12px;top:0;width:9px;height:34px;background:#bf9957;border-left:3px solid #775b36;box-shadow:53px 0 #bf9957}
.crate-5 i{width:32px;height:30px;left:32px;top:27px;background:#d6ae69;color:#5b3b42;box-shadow:inset 0 0 0 3px #b67c50}
/* Crystal: jagged crown; discrete icy facets on the lower shell. */
.crate-6 .lid{top:-8px;height:48px;clip-path:polygon(0 50%,8% 50%,8% 28%,20% 45%,28% 12%,38% 32%,50% 0,62% 32%,72% 12%,80% 45%,92% 28%,92% 50%,100% 50%,100% 100%,0 100%)}
.crate-6 .crate-top{inset:0;background:repeating-linear-gradient(90deg,transparent 0 13px,#e5ffff 13px 17px,#5d94c5 17px 22px)}
.crate-6 .box{background:#b6e9ed;clip-path:polygon(0 0,100% 0,100% 50%,80% 85%,65% 100%,35% 100%,20% 85%,0 50%);box-shadow:inset 0 -7px #6babc3,inset 7px 0 #e5fcff}
.crate-6 .crate-band{left:7px;right:7px;top:10px;height:19px;background:repeating-linear-gradient(135deg,transparent 0 10px,#61a4be 10px 14px)}
.crate-6 i{background:#e1ffff;color:#397a9c;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
/* Magma: fractured basalt panels, exposed lava channels and rugged edges. */
.crate-7 .lid{top:-4px;height:44px;clip-path:polygon(0 28%,10% 28%,10% 10%,30% 18%,40% 0,65% 10%,78% 0,90% 23%,100% 23%,100% 100%,0 100%);background:#574751;box-shadow:inset 0 5px #89716b,inset 0 -5px #292b3d}
.crate-7 .crate-top{left:15px;top:4px;width:6px;height:11px;background:#ffce7c;box-shadow:6px 9px #ff975c,12px 18px #ff975c,46px 0 #ffce7c,40px 9px #ff975c,34px 18px #ff975c}
.crate-7 .box{background:#6d5862;box-shadow:inset 0 -7px #343241,inset 7px 0 #917779;clip-path:polygon(0 0,100% 0,100% 65%,88% 65%,88% 90%,70% 90%,70% 100%,25% 100%,25% 90%,10% 90%,10% 70%,0 70%)}
.crate-7 .crate-band{left:11px;top:5px;width:5px;height:10px;background:#ffac6a;box-shadow:5px 9px #ffac6a,10px 18px #ffac6a,58px 1px #ffac6a,53px 10px #ffac6a,48px 19px #ffac6a}
.crate-7 i{background:#ffbb63;border-color:#342c3c;color:#903d39;box-shadow:inset 0 -4px #f47e57}

.page-bar{display:flex;align-items:center;gap:16px;margin:14px 0;color:#b6d3cf;font-size:12px;font-weight:bold;letter-spacing:1px}.page-bar button{padding:12px 18px;border:2px solid #71939a;background:#163b4ded;color:#e8fff4;box-shadow:3px 3px #061723}#menuDrawer{position:fixed;inset:0 auto 0 0;margin:0;width:min(310px,88vw);max-width:none;height:100dvh;max-height:100dvh;border:0;border-right:4px solid #71939a;padding:26px 20px;background:#092536;color:#e8fff4;box-shadow:8px 0 #0004}#menuDrawer::backdrop{background:#020e1bcc;backdrop-filter:blur(2px)}.drawer-head{display:flex;align-items:center;justify-content:space-between}.drawer-head h2{letter-spacing:4px;font-size:22px}.drawer-head button{background:transparent;border:2px solid #71939a;color:#fff;padding:5px 12px;font-size:24px}#menuDrawer p,#menuDrawer>small{color:#abc9c8;font-size:12px;line-height:1.8}#menuDrawer nav{display:flex;flex-direction:column;gap:12px;margin:26px 0}#menuDrawer nav button{text-align:left;padding:18px;font-size:13px}#menuDrawer nav button.active{background:#24564f;color:#adffd1;border-color:#94efc0}.upgrade-guide{padding:14px;border:2px solid #496e79;background:#0d3040;font-size:12px;line-height:1.7;margin-bottom:18px}.upgrade-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}.upgrade-filters button{padding:9px 12px;border:2px solid #537c89;background:#143746;color:#cde7df;font-size:11px}.upgrade-filters button.selected{background:#28594e;border-color:#94efc0;color:#bfffd8}.upgrade-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.upgrade-card{display:flex;flex-direction:column;padding:16px;background:#0c2938e8;border:2px solid #456575;box-shadow:3px 3px #04141d}.upgrade-card.ready{border-color:#d4b76d}.upgrade-card.purchased{border-color:#79b494;background:#103a38}.upgrade-top{display:flex;justify-content:space-between;gap:8px;color:#a4c7c5;font-size:9px}.upgrade-top span{color:var(--gold)}.purchased .upgrade-top span{color:var(--mint)}.upgrade-card h2{font-size:15px;line-height:1.5;margin:15px 0 8px}.upgrade-effect{font-size:12px;line-height:1.6;color:#c0ebdd;margin:0 0 16px;min-height:58px}.achievement{padding:12px;background:#051e2b;border:1px solid #395866;font-size:11px;line-height:1.7;margin-top:auto;margin-bottom:14px}.achievement strong,.achievement span{display:block}.achievement .track{height:8px;margin-top:8px}.achievement .track i{display:block;height:100%;background:var(--mint)}.upgrade-prerequisite,.missing-money{font-size:10px;line-height:1.6;color:#d8c994;margin:0 0 10px}.missing-money{text-align:center;margin:8px 0 0}.upgrade-card .btn{font-size:11px;width:100%;margin-top:0}@media(max-width:600px){.upgrade-grid{grid-template-columns:1fr}.upgrade-effect{min-height:0}.upgrade-card{padding:14px}.page-bar{margin:12px 0}.tap-label small{line-height:1.7}}
.upgrade-guide small{display:block;color:#96b7b6;font-size:10px;margin-top:8px}

@keyframes menu-enter{from{transform:translateX(-102%)}to{transform:translateX(0)}}@keyframes menu-exit{from{transform:translateX(0)}to{transform:translateX(-102%)}}@keyframes menu-dim-in{from{opacity:0}to{opacity:1}}@keyframes menu-dim-out{from{opacity:1}to{opacity:0}}#menuDrawer[open]{animation:menu-enter .28s cubic-bezier(.2,.8,.2,1) both}#menuDrawer[open]::backdrop{animation:menu-dim-in .28s ease-out both}#menuDrawer[open].menu-closing{animation:menu-exit .22s ease-in both;pointer-events:none}#menuDrawer[open].menu-closing::backdrop{animation:menu-dim-out .22s ease-in both}.no-motion #menuDrawer[open],.no-motion #menuDrawer[open]::backdrop{animation:none}@media(prefers-reduced-motion:reduce){#menuDrawer[open],#menuDrawer[open]::backdrop{animation:none}}

.favorite-btn{background:#143b48;color:#d4e8d9;border:2px solid #6c9193;min-width:42px;min-height:42px;padding:7px 10px;font-size:22px;line-height:1;flex-shrink:0}.favorite-btn.is-favorite{color:var(--gold);border-color:#d6b96f;background:#4a402d}.favorite-action{margin:18px 0 10px}.favorite-action .favorite-btn{font-size:12px;padding:12px 16px}.favorites-hint{font-size:11px;line-height:1.7;color:#bad4ce}.saved-list .favorite-row{background:#51432322}.saved-list span small{display:block;color:var(--gold);font-size:8px;margin-top:5px}.saved-list .favorite-btn{font-size:22px}.empty-favorites{font-size:12px;line-height:1.8;color:#bad4ce;padding:12px 0}.saved-filters button{font-size:10px}.saved-list .btn{min-height:42px}@media(max-width:420px){.saved-list .favorite-btn{min-width:36px;padding:6px}.saved-list .btn{max-width:95px;white-space:normal}}
.specimen-link{font-size:11px;text-align:left;color:#e5fff1;background:none;border:0;padding:4px 0;text-decoration:underline;text-underline-offset:3px}.specimen-summary{max-width:390px;padding:13px;background:#071e2d;border:2px solid #517d86;margin:16px auto;text-align:left;display:grid;grid-template-columns:1fr auto;gap:9px;font-size:11px}.specimen-summary strong{color:var(--gold)}.specimen-summary .track,.specimen-summary small{grid-column:1/-1}.move-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:500px;margin:16px auto}.move-cards>div{background:#153b4b;border:2px solid #547785;padding:12px;text-align:left;line-height:1.7}.move-cards small,.move-cards strong,.move-cards span{display:block}.move-cards small{font-size:9px;color:var(--gold)}.move-cards strong{font-size:13px}.move-cards span{font-size:10px;color:#bdd6d0}.specimen-detail{text-align:center}.specimen-detail>.sprite,.training-preview>.sprite{width:144px;height:144px}.specimen-detail p,.training-preview p{font-size:11px;line-height:1.8;color:#bdd6d0}.specimen-detail>.text-btn{display:block;margin:18px auto 0}.training-select{display:flex;flex-direction:column;gap:10px;font-size:11px;color:#bfd6d5;margin-bottom:18px}.training-select select{font:inherit;color:#e5ffec;background:#0c2e40;border:2px solid #638a91;padding:12px;width:100%}.training-preview{padding:20px;background:#0b2c3c;border:2px solid #58828a;text-align:center}.training-preview h2{font-size:19px}.battle-arena{display:grid;grid-template-columns:1fr 1fr;gap:16px;background:#062239 url('assets/world/ocean-pixel.png') center/cover;image-rendering:pixelated;border:3px solid #567c87;padding:16px}.fighter{min-width:0;text-align:center;background:#082635dc;border:2px solid #648993;padding:16px 12px}.fighter>small{font-size:9px;color:#c0d7d6}.fighter h2{font-size:16px;margin:12px 0}.fighter>.sprite{display:block;width:144px;height:144px;margin:8px auto;max-width:100%;object-fit:contain}.enemy>.sprite{transform:scaleX(-1)}.battle-meter{text-align:left;font-size:10px;margin:12px 0}.battle-meter span{display:block;margin-bottom:7px}.battle-meter.energy .track i{background:#e3c969}.battle-log{border:2px solid #476e7b;background:#061e2c;padding:14px;margin:16px 0;min-height:90px;font-size:12px;line-height:1.7}.battle-log p{margin:3px 0}.battle-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.battle-actions button{font-size:12px;white-space:normal;line-height:1.5;min-height:74px}.battle-actions button small{display:block;margin-top:6px;font-size:9px}.battle-actions .charge-btn{background:#eed39d;color:#302d24;border-color:#b09b6b}.battle-result{background:#123c3a;border:2px solid #9acda7;text-align:center;padding:20px}.battle-result h2{font-size:20px;color:var(--gold)}.battle-result p{font-size:12px}@media(max-width:520px){.battle-arena{gap:8px;padding:8px}.fighter{padding:12px 7px}.fighter h2{font-size:12px}.fighter>small{font-size:8px}.fighter>.sprite{width:112px;height:112px}.battle-actions{gap:8px}.battle-actions button{padding:10px 6px;font-size:11px}.move-cards{grid-template-columns:1fr}.specimen-summary{font-size:10px}.battle-log{font-size:11px}.training-preview{padding:14px}}

@keyframes training-hit{0%{opacity:.45;translate:5px 0}50%{opacity:1;translate:-3px 0}100%{translate:0 0}}.battle-hit .fighter>.sprite{animation:training-hit .22s steps(3)}.no-motion .battle-hit .fighter>.sprite{animation:none}@media(prefers-reduced-motion:reduce){.battle-hit .fighter>.sprite{animation:none}}
.team-panel{background:#0e2e3d;border:2px solid #71979a;padding:16px;margin-bottom:20px}.team-panel h2{font-size:15px;margin:0 0 8px;color:var(--gold)}.team-panel>p{font-size:11px;line-height:1.7;color:#bdd6d0;margin:0 0 16px}.team-slots{display:grid;grid-template-columns:repeat(5,minmax(110px,1fr));gap:9px;overflow-x:auto;padding-bottom:6px}.team-slot{display:flex;flex-direction:column;align-items:center;text-align:center;background:#082130;border:2px solid #4f7882;padding:10px 6px;min-height:210px}.team-slot>small{font-size:9px;color:#9ebcba}.team-slot strong{font-size:10px;margin:5px 0;overflow-wrap:anywhere}.team-slot>span{font-size:9px;color:#cbe6db}.team-portrait{padding:0;border:0;background:transparent}.team-portrait .sprite{width:72px;height:72px}.team-order{display:flex;gap:7px;margin-top:8px}.team-order button{width:36px;height:36px;border:1px solid #688991;background:#173e4c;color:#e3ffed}.team-slot .text-btn{font-size:9px;min-height:36px}.team-slot.empty{border-style:dashed;justify-content:center;gap:22px;color:#73949b}.team-slot.empty>b{font-size:32px}.owned-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.owned-card{min-width:0;background:#0f3041;border:2px solid #507a86;padding:13px;display:flex;flex-direction:column;gap:10px}.owned-art{position:relative;text-align:center}.owned-art>.sprite{width:112px;height:112px}.owned-art>.favorite-btn{position:absolute;top:0;right:0}.owned-card>.specimen-link{font-size:14px;font-weight:bold;min-height:30px;text-align:center}.owned-card>small{font-size:9px;line-height:1.7;text-align:center;color:#b6d5cc}.owned-card .specimen-summary{width:100%;margin:0;font-size:9px;grid-template-columns:1fr;padding:10px}.owned-card .btn{width:100%;font-size:9px;padding:11px 6px;min-height:40px;white-space:normal}.owned-filters{margin-bottom:18px;flex-wrap:wrap}.owned-filters button{font-size:10px}.empty-owned{font-size:12px;line-height:1.8;grid-column:1/-1}.auto-battle-status{display:flex;align-items:center;justify-content:center;gap:10px;padding:14px;margin-bottom:14px;border:2px solid #527d83;background:#0b303a;color:#baffd5;font-size:11px;line-height:1.6}.auto-dot{width:9px;height:9px;background:#a3ffbd;animation:auto-pulse .8s steps(2) infinite}@keyframes auto-pulse{50%{opacity:.3}}.no-motion .auto-dot{animation:none}@media(prefers-reduced-motion:reduce){.auto-dot{animation:none}}@media(max-width:650px){.owned-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.team-panel{padding:12px}.team-slots{grid-template-columns:repeat(5,110px)}}@media(max-width:380px){.owned-grid{grid-template-columns:1fr}.owned-art>.sprite{width:128px;height:128px}.owned-card .btn{font-size:11px}}

.type-badge{display:inline-flex;align-items:center;justify-content:center;gap:6px;vertical-align:middle;padding:4px 7px;white-space:nowrap;line-height:1.2}.type-icon{width:20px;height:20px;flex-shrink:0;display:block}.owned-type{text-align:center}.evo-form .type-badge{margin-top:7px;font-size:8px;padding:3px 5px;gap:4px;border-width:1px}.evo-form .type-icon{width:16px;height:16px}.team-slot .type-badge{margin-top:7px;font-size:8px;padding:3px 5px;border-width:1px;gap:4px}.team-slot .type-icon{width:16px;height:16px}.compact .type-badge{font-size:7px;padding:2px 3px;gap:3px}.compact .type-icon{width:14px;height:14px}@media(max-width:420px){.evo-form .type-badge{font-size:7px;padding:3px;gap:3px}.evo-form .type-icon{width:14px;height:14px}}
.training-label{font-size:12px;letter-spacing:1px;margin:20px 0 12px;color:#c3dfd7}.training-team{display:grid;grid-template-columns:repeat(5,minmax(110px,1fr));gap:10px;overflow-x:auto;padding:0 0 8px}.training-member{display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 7px;border:2px solid #587b84;background:#0d3040;color:#d2eee0;min-height:170px}.training-member>.sprite{width:72px;height:72px}.training-member strong{font-size:10px;overflow-wrap:anywhere}.training-member>small{font-size:9px}.training-member .type-badge{font-size:8px;padding:3px 5px;gap:4px}.training-member .type-icon{width:16px;height:16px}.training-paths{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.training-paths>button{display:flex;flex-direction:column;align-items:center;gap:8px;padding:10px 6px;border:2px solid #537985;background:#103344;color:#cde8df}.training-paths>button>small{font-size:9px}.training-paths .type-badge{border:0;background:transparent;padding:0}.stage-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}.stage-heading>small{font-size:10px;line-height:1.6;color:#a8c5c1}.training-stages{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:7px;margin-bottom:20px}.training-stages button{min-height:40px;background:#0e3040;border:2px solid #527985;color:#d7ece3;font-size:10px;padding:8px 3px}.training-stages button.cleared{color:#a8efb6;border-color:#669976}.training-matchup{display:grid;grid-template-columns:1fr 36px 1fr;gap:10px;align-items:center}.training-matchup>div{min-width:0;display:flex;flex-direction:column;align-items:center;gap:8px}.training-matchup .sprite{width:112px;height:112px}.training-matchup h2{font-size:15px;line-height:1.4;margin:0}.training-matchup small{font-size:9px;color:#b8d5cf}.training-matchup>b{color:var(--gold);font-size:18px}@media(max-width:650px){.training-team{grid-template-columns:repeat(5,110px)}.training-paths{grid-template-columns:repeat(2,minmax(0,1fr))}.training-stages{grid-template-columns:repeat(5,minmax(0,1fr))}.stage-heading{align-items:flex-start;flex-direction:column;gap:0;margin-bottom:12px}.training-matchup{grid-template-columns:1fr 24px 1fr;gap:5px}.training-matchup .sprite{width:96px;height:96px}.training-matchup h2{font-size:12px}}
.owned-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:14px;background:#0d2d3c;border:2px solid #496e79;margin:16px 0 10px}.owned-controls label{display:flex;flex-direction:column;gap:7px;color:#b7d3cc;font-size:9px;min-width:0}.owned-controls select{width:100%;font:inherit;font-size:11px;color:#e0faeb;background:#082335;border:2px solid #557c86;padding:10px 7px;min-height:40px}.owned-results{font-size:10px;color:#a8c8c0;margin:10px 0 16px}.family-reward{display:flex;justify-content:space-between;align-items:center;gap:8px;border-top:1px solid #365d6e;margin-top:12px;padding-top:10px}.family-reward>small{font-size:9px;color:#b5d7ca}.family-reward .btn{font-size:9px;padding:9px 8px;min-height:35px}.daily-bonus{font-size:11px;line-height:1.7;color:var(--gold);background:#313528;border:2px solid #a79763;padding:12px;margin:0 0 16px}.daily-bonus small{display:block;color:#c2c7a8;font-size:9px}.battle-report{margin:16px 0;border:2px solid #5d8788;background:#0b2d36;padding:14px;text-align:left;font-size:11px;line-height:1.8}.battle-report summary{cursor:pointer;font-weight:bold;color:var(--gold)}.battle-report>div{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}.battle-report>div>span{padding:8px;background:#09232f;color:#bcd8cf;font-size:10px}.battle-report b{color:#e0ffe5}.battle-report>div b{display:block;font-size:17px}.battle-report>small{font-size:10px;color:#b0cac5}.battle-report p{color:#d2e9df}.clear-owned{font-size:10px;margin-left:auto;align-self:end;min-height:40px}@media(max-width:550px){.owned-controls{grid-template-columns:repeat(2,minmax(0,1fr));padding:12px}.family-reward .btn{font-size:8px}.battle-report{padding:12px}}

/* Group expeditions */
.exp-intro,.exp-wave,.exp-arena{border:3px solid #244e60;background:#0c2636;padding:18px;margin-bottom:16px;box-shadow:4px 4px 0 #05121f}.exp-intro p{line-height:1.65}.exp-requirements{list-style:none;padding:0;color:#b1b9c3;line-height:1.9}.exp-requirements .met{color:#8dd6a0}.exp-intro>.btn{display:block;margin-top:14px}.exp-group{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin:12px 0 20px}.exp-unit{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 6px;background:#081b2b;border:2px solid #28576a;text-align:center;min-width:0}.exp-unit .sprite{width:88px;height:88px;object-fit:contain}.exp-unit strong{font-size:12px;overflow-wrap:anywhere}.exp-unit small{font-size:10px;color:#b9d2da}.exp-unit.knocked-out{opacity:.45;filter:grayscale(1)}.exp-hp{height:9px;width:100%;background:#361c2c;border:1px solid #51727e}.exp-hp i{display:block;height:100%;background:#75dca1;transition:width .2s steps(4)}.exp-progress{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}.exp-progress span{border:2px solid #2c5062;padding:9px;color:#a4bac5;font-size:11px}.exp-progress .selected{border-color:#e9c775;color:#ffe4a1}.exp-progress .cleared{color:#88d9ac}.exp-loot{display:flex;flex-direction:column;align-items:center;gap:12px;margin:20px auto}.exp-waves{display:grid;gap:12px}.exp-wave h3{font-size:14px;color:#e9c775}.exp-wave .exp-group{margin-bottom:0}.exp-arena h2{font-size:12px;color:#a6d2e4}.exp-arena .enemies .exp-unit{border-color:#73505b}.no-motion .exp-hp i{transition:none}@media(min-width:850px){.exp-waves{grid-template-columns:1fr 1fr}.exp-wave:last-child{grid-column:1/-1}}@media(max-width:540px){.exp-group{grid-template-columns:repeat(2,minmax(0,1fr))}.exp-intro,.exp-wave,.exp-arena{padding:12px}.exp-unit .type-badge{font-size:9px}}@media(prefers-reduced-motion:reduce){.exp-hp i{transition:none}}

.exp-routes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:18px}.exp-routes button{display:flex;flex-direction:column;gap:8px;text-align:left;border:2px solid #507886;background:#103344;color:#d0ebe0;padding:12px}.exp-routes strong{font-size:12px}.exp-routes small{font-size:9px;color:#aac8c8}.stage-pages{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}.stage-pages button{background:#123547;border:2px solid #537583;color:#cee7df;padding:7px;font-size:10px}@media(max-width:420px){.exp-routes{grid-template-columns:1fr}}

.trait-tag{display:flex;flex-direction:column;gap:3px;background:#1b3040;border:1px solid #597b83;padding:5px 7px;font-size:10px;color:#ead395;max-width:100%;text-align:center}.trait-tag small{font-size:9px;color:#b5cfd1}.team-bonus{font-size:11px;line-height:1.6;color:#adc9cc;border:2px dashed #436572;padding:10px}.team-bonus.bonus-active{color:#a2ecb6;border-color:#81b390;background:#153b35}.recycle-btn{font-size:10px;color:#ebd290}.recycle-error{color:#e6b897}.fighter,.exp-unit{position:relative;overflow:hidden}.damage-pop{position:absolute;top:38%;left:50%;z-index:4;color:#ffdda0;font-size:18px;font-weight:bold;text-shadow:2px 2px #601c31;pointer-events:none;animation:damage-float .65s steps(6) both}.fx-hit{animation:combat-shake .3s steps(4)}.fx-quick .sprite{animation:combat-lunge .35s steps(4)}.fx-charge .sprite{animation:charge-flash .55s steps(5);filter:drop-shadow(0 0 7px var(--type,#b5ffff))}.knocked-out .sprite{filter:grayscale(1);opacity:.4}.battle-result{animation:victory-glow .6s steps(5)}@keyframes damage-float{0%{transform:translate(-50%,0);opacity:1}100%{transform:translate(-50%,-40px);opacity:0}}@keyframes combat-shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}@keyframes combat-lunge{50%{transform:translateX(7px)}}@keyframes charge-flash{30%,70%{transform:scale(1.08);opacity:.65}}@keyframes victory-glow{50%{box-shadow:0 0 15px #b3ffd866}}.no-motion .fx-hit,.no-motion .fx-quick .sprite,.no-motion .fx-charge .sprite,.no-motion .damage-pop,.no-motion .battle-result{animation:none}.no-motion .damage-pop{display:none}@media(prefers-reduced-motion:reduce){.fx-hit,.fx-quick .sprite,.fx-charge .sprite,.damage-pop,.battle-result{animation:none}.damage-pop{display:none}}

.options-card{border:2px solid #527a88;padding:18px;background:#0a293a;margin-bottom:16px}.options-card h2{font-size:14px;color:#d0eadc}.options-card p,.achievement-note{font-size:11px;line-height:1.65;color:#b3ced0}.volume-setting{display:grid;grid-template-columns:1fr auto;gap:8px;font-size:12px;margin:12px 0 20px}.volume-setting input{grid-column:1/-1;width:100%;accent-color:#a5efbd}.volume-setting span{color:#edda99}.danger-zone{border-color:#ac6c73}.achievement-tools{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}.achievement-tools label{display:flex;flex-direction:column;gap:7px;font-size:10px}.achievement-tools select,.achievement-tools input{font:inherit;padding:10px;background:#102f40;color:#d1ebdd;border:2px solid #5a7d89;width:100%;min-width:0}.achievement-collect{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:2px solid #a4b878;background:#1e3a35;font-size:11px}.achievement-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.achievement-card{border:2px solid #486979;background:#0e2b3d;padding:14px;display:flex;flex-direction:column;gap:9px}.achievement-card h2{font-size:14px;margin:0;color:#e5e7c1}.achievement-card p{font-size:11px;line-height:1.6;margin:0;flex:1}.achievement-card>small{font-size:9px;line-height:1.6;color:#a9c8cb}.achievement-card .sprite{height:64px;width:64px;align-self:center}.achievement-card.ready{border-color:#dcc686}.achievement-card.claimed{border-color:#77a98c}.achievement-progress{font-size:10px;line-height:1.6;color:#c5d8c3}.achievement-pagination{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:18px;font-size:11px}.achievement-pagination .btn{min-width:48px}.achievement-note{border-left:2px solid #697c85;padding:10px 12px}#achievementBadge{color:#ffe38d;font-size:10px}#menuDrawer nav{max-height:70vh;overflow-y:auto}@media(max-width:540px){.achievement-grid{grid-template-columns:1fr}.achievement-tools{grid-template-columns:1fr}.achievement-collect{align-items:stretch;flex-direction:column}.options-card{padding:14px}}

.comparison-modal{width:min(760px,calc(100% - 24px));max-width:760px}.compare-picker{display:flex;flex-direction:column;gap:8px;font-size:11px;margin:18px 0}.compare-picker select{width:100%;min-width:0;font:inherit;padding:12px;background:#102f40;color:#d1ebdd;border:2px solid #5a7d89}.compare-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.compare-card{min-width:0;border:2px solid #527a88;background:#0a293a;padding:14px;text-align:center}.compare-card .sprite{width:96px;height:96px}.compare-card h3{font-size:12px}.compare-card p,.compare-note{font-size:10px;line-height:1.7;color:#b3ced0}.compare-card dl{font-size:11px;text-align:left}.compare-card dl>div{display:flex;justify-content:space-between;gap:8px;padding:9px 0;border-bottom:1px solid #345566}.compare-card dd{margin:0;text-align:right}.compare-delta{display:block;color:#b6c9cd;font-size:9px;margin-top:5px}.compare-delta.higher{color:#a1e6b4}.compare-delta.lower{color:#f0b6ad}@media(max-width:420px){.compare-card{padding:8px}.compare-card h3{font-size:10px}.compare-card .sprite{width:80px;height:80px}.compare-card dl>div{flex-direction:column;gap:3px}.compare-card dd{text-align:left}}
.effect-tags{display:flex;gap:4px;flex-wrap:wrap;justify-content:center;margin:5px 0}.effect-tags span{font-size:8px;padding:4px;border:1px solid #8295ac;background:#263446;color:#f0dcb0}.effect-poison{color:#c3ed99!important}.effect-burn{color:#ffb78d!important}.effect-shield{color:#acd9ed!important}.hunt-panel{display:flex;align-items:center;gap:16px;border:2px solid #a58b62;background:#172b36;padding:16px;margin-bottom:18px}.hunt-panel>.sprite{width:96px;height:96px;flex-shrink:0}.hunt-panel h2{font-size:14px;color:#f0d19c}.hunt-panel p,.hunt-panel small,.trial-panel p,.bond-panel p{font-size:10px;line-height:1.8;color:#c7d8cf}.hunt-panel small{font-size:9px}.trial-panel,.bond-panel{border:2px dashed #507888;background:#102d3c;padding:14px;margin:14px 0}.trial-panel summary,.bond-panel summary{cursor:pointer;font-size:12px;color:#e9d39f}.bond-panel small{font-size:9px;line-height:1.7}.boss-reward{text-align:center;margin:18px 0;border:2px solid #e5cd82;padding:16px;background:#163a36}.boss-reward .sprite{width:128px;height:128px}.boss-reward h3{font-size:15px}.boss-reward p{font-size:10px}.evolution-preview{display:flex;justify-content:center;align-items:center;gap:16px}.evolution-preview .sprite{width:112px;height:112px}.evolution-preview>b{font-size:24px;color:#e7cd8c}.evolution-donors{max-height:250px;overflow-y:auto;display:grid;gap:7px;margin:14px 0}.evolution-donors label{display:flex;gap:10px;align-items:center;padding:12px;border:2px solid #4f7381;font-size:11px;background:#0d2c3d}.evolution-donors input{width:20px;height:20px;accent-color:#a5efbd}.move-cards small{line-height:1.7}@media(max-width:500px){.hunt-panel{align-items:flex-start;gap:8px;padding:10px}.hunt-panel>.sprite{width:72px;height:72px}.hunt-panel h2{font-size:11px}.trial-panel,.bond-panel{padding:10px}}

#onlineBar{position:relative;z-index:1;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;max-width:1120px;margin:10px auto 0;padding:10px 18px;color:#d4e9c8;background:#0c2636;border:2px solid #416578;font-size:10px;line-height:1.7}#onlineStatus{color:#e9d091}#onlineGate{position:relative;z-index:2;max-width:560px;margin:12vh auto;padding:28px;background:#102c3a;border:3px solid #94ad83;box-shadow:8px 8px #071522;color:#d2e9db;text-align:center}#onlineGate h1{font-size:22px;color:#edd18a}#onlineGate p{font-size:12px;line-height:1.8}#onlineGate[hidden],#onlineNicknameForm[hidden],#onlineLogin[hidden],#onlineLogout[hidden]{display:none!important}.online-locked .game{display:none}#onlineNicknameForm label{display:flex;flex-direction:column;gap:10px;font-size:12px}#onlineNickname{width:100%;padding:12px;color:#dbeed9;background:#092335;border:2px solid #718992;font:inherit}#onlineGate .btn{margin:12px auto;max-width:100%}@media(max-width:560px){#onlineGate{margin:12vh 12px;padding:20px}#onlineGate h1{font-size:18px}#onlineBar{margin:8px 12px 0;padding:9px}}