@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;600;700;800;900&family=Nunito:wght@700;800;900&display=swap');
.digital-creature{display:inline-block;width:56px;height:48px;position:relative;vertical-align:middle;isolation:isolate;}
.digital-creature .creature-body{width:100%;height:100%;object-fit:contain;filter:none;image-rendering:auto;animation:digitalSwim 2.5s ease-in-out infinite;}
.creature-accessory{position:absolute;object-fit:contain;pointer-events:none;animation:accessorySwim 2.5s ease-in-out infinite;z-index:2;}
.accessory-bandana{width:62%;height:48%;left:29%;top:5%;}
.accessory-goggles{width:46%;height:35%;left:48%;top:27%;}
.accessory-captain{width:56%;height:43%;left:36%;top:0%;}
.model-shrimp .accessory-bandana{left:48%;top:12%;width:46%;}
.model-shrimp .accessory-captain{left:53%;top:9%;width:44%;}
.model-shrimp .accessory-goggles{left:58%;top:32%;width:35%;}
.model-squid .accessory-bandana{left:34%;top:4%;width:52%;}
.model-squid .accessory-goggles{left:46%;top:26%;width:42%;}
@keyframes digitalSwim{0%,100%{transform:translateY(0) rotate(-1.4deg)}50%{transform:translateY(-4px) rotate(1.4deg)}}
@keyframes accessorySwim{0%,100%{transform:translateY(0) rotate(-1.4deg)}50%{transform:translateY(-4px) rotate(1.4deg)}}
.ambient-shop-fish .digital-creature{width:76px;height:62px;}
.seat-avatar-icon .digital-creature{width:46px;height:38px;}
.pixel-puffer>.digital-creature{width:96%;height:96%;}
#appearanceModal{position:fixed;inset:0;z-index:300;background:#06344a url('art/ocean.png') center/cover no-repeat;backdrop-filter:none;padding:0;overflow:auto;font-family:'Nunito Sans',sans-serif;color:#f3fbfc;}
#appearanceModal[style*="flex"]{display:grid!important;grid-template-columns:190px minmax(280px,1fr) minmax(420px,42%);grid-template-rows:112px minmax(0,1fr);gap:0;align-items:stretch;justify-content:stretch;}
.wardrobe-brand{grid-column:1/-1;padding:24px 38px;display:flex;align-items:flex-start;justify-content:space-between;}
.wardrobe-wordmark{font-family:'Nunito',sans-serif;font-style:italic;font-weight:1000;letter-spacing:-2px;font-size:38px;color:#fff;text-shadow:2px 3px #f4777d;line-height:1;text-decoration:none;}
.wardrobe-close{border:1px solid #8cd0dd55;border-radius:25px;background:#062b3dd9;color:#fff;padding:10px 20px;font:700 14px 'Nunito Sans',sans-serif;cursor:pointer;}
.wardrobe-sidebar{padding:24px 10px 24px 22px;display:flex;flex-direction:column;gap:12px;align-self:start;}
.wardrobe-sidebar button{width:100%;border:0;background:transparent;color:#f7fdff;text-align:left;border-radius:14px;padding:15px 12px;font:800 16px 'Nunito Sans',sans-serif;cursor:pointer;display:flex;align-items:center;gap:10px;}
.wardrobe-sidebar button img{width:26px;height:26px;flex:0 0 26px;filter:brightness(0) invert(1);}
.wardrobe-sidebar .active{background:#007c91d9;border-left:5px solid #ff7f83;}
.wardrobe-sidebar button:hover{background:#087d9166;}
.wardrobe-stage{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:500px;padding:0 12px 42px;}
#appearancePreview{width:100%;display:grid;place-items:center;flex:1;min-height:0;}
.wardrobe-stage .digital-creature{width:165%;height:min(80vh,820px);max-width:920px;}
.wardrobe-stage .digital-creature .creature-body{animation-duration:3.3s;filter:drop-shadow(0 25px 30px #00132344);}
.appearance-caption{color:#c9eaf0;font-size:14px;letter-spacing:.5px;text-align:center;margin-top:4px;}
.wardrobe-editor{align-self:start;margin:12px 24px 24px 4px;padding:22px 25px 20px;background:#032c40e8;border:1px solid #25839888;border-radius:30px;max-height:calc(100dvh - 140px);overflow:auto;scrollbar-width:thin;scrollbar-color:#258398 transparent;}
.wardrobe-editor h1{font-family:'Nunito',sans-serif;font-size:clamp(23px,2.25vw,34px);font-weight:900;font-style:italic;line-height:1.17;letter-spacing:-.5px;margin:0 0 22px;}
.appearance-tabs{display:flex;justify-content:space-between;border-bottom:2px solid #1a7f95;margin-bottom:18px;gap:4px;}
.appearance-tabs button{background:none;border:0;border-bottom:5px solid transparent;color:#d1e9ee;padding:5px 9px 12px;font:700 17px 'Nunito Sans',sans-serif;cursor:pointer;}
.appearance-tabs button[aria-selected="true"]{border-color:#ff7778;color:#fff;}
.model-picker,.accessory-picker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;}
.art-tile{border:2px solid #207d98;background:#04334870;border-radius:16px;min-width:0;padding:5px;color:#d7eff2;font:700 13px 'Nunito Sans',sans-serif;cursor:pointer;transition:background .15s,border-color .15s;}
.art-tile img{display:block;width:100%;height:76px;object-fit:contain;pointer-events:none;transform:scale(1.18);}
.art-tile span{display:block;line-height:1.15;margin:5px 0 3px;}
.art-tile.selected{border-color:#20e8ec;background:#08637c7d;color:#48f5f4;box-shadow:0 0 0 1px #20e8ec;}
.art-tile:hover{background:#11607877;}
.appearance-color-section{border-top:1px solid #227287;margin-top:18px;padding-top:13px;}
.appearance-color-section h2,.appearance-accessory-section h2{font:800 20px 'Nunito Sans',sans-serif;margin:0 0 9px;}
.swatch-line{display:flex;align-items:center;gap:9px;justify-content:space-between;}
.swatches{display:flex;gap:10px;flex:1;justify-content:space-between;}
.color-swatch{width:37px;height:37px;flex:0 0 37px;border:2px solid #ffffff4a;border-radius:50%;background:var(--swatch);cursor:pointer;}
.color-swatch.selected{outline:3px solid #27ebf0;outline-offset:3px;}
.custom-color{position:relative;display:block;flex:0 0 34px;width:34px;height:34px;}
.custom-color input{width:34px;height:34px;padding:2px;border:1px solid #5ba8b7;background:#164d60;border-radius:7px;cursor:pointer;}
.custom-color-label{font-size:10px;color:#a8dce4;display:block;margin-top:5px;text-align:right;}
.appearance-accessory-section{margin-top:18px;padding-top:13px;border-top:1px solid #227287;}
.accessory-tile{font-size:11px;min-height:100px;}
.accessory-tile img{height:62px;transform:scale(1.45);}
.no-accessory-label{height:62px;display:grid!important;place-content:center;font-size:14px;color:#b1d6e0;}
.appearance-save{margin-top:22px;width:100%;background:#fa787e;border:0;border-bottom:4px solid #d45565;border-radius:35px;padding:14px 15px;color:#fff;font:900 23px 'Nunito',sans-serif;cursor:pointer;}
.appearance-save:hover{background:#ff8d91;}
.appearance-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;}
.appearance-state{font-size:11px;line-height:1.4;color:#b8dbe3;}
.appearance-reset{color:#c9e5e9;background:none;border:0;text-decoration:underline;cursor:pointer;font:12px 'Nunito Sans',sans-serif;}
#appearanceModal :focus-visible{outline:3px solid #fff5b2;outline-offset:3px;}
body:has(#appearanceModal[style*="flex"]) .crt-overlay{display:none;}
@media(min-width:1450px){.wardrobe-editor{padding:26px 32px;}.art-tile img{height:96px}.accessory-tile img{height:80px}.color-swatch{width:44px;height:44px;flex-basis:44px}.wardrobe-stage .digital-creature{width:100%;height:66vh}.wardrobe-sidebar{padding-top:30px}}
@media(max-width:1000px){#appearanceModal[style*="flex"]{grid-template-columns:120px minmax(220px,1fr) minmax(350px,46%);grid-template-rows:100px 1fr}.wardrobe-sidebar{padding-left:5px}.wardrobe-sidebar button{font-size:15px;padding:13px 10px}.wardrobe-editor{margin-right:14px;padding:20px 16px}.wardrobe-stage{min-height:420px;padding:0}.art-tile img{height:61px}.swatches{gap:7px}.color-swatch{width:30px;height:30px;flex-basis:30px}.appearance-tabs button{font-size:15px}.wardrobe-brand{padding:24px}.wardrobe-wordmark{font-size:31px}}
@media(max-width:720px){#appearanceModal[style*="flex"]{grid-template-columns:1fr;grid-template-rows:82px auto 240px auto;gap:0;background-position:30% top}.wardrobe-brand{grid-column:1;padding:22px}.wardrobe-sidebar{flex-direction:row;padding:0 16px;gap:5px}.wardrobe-sidebar button{font-size:14px;padding:10px 12px;text-align:center}.wardrobe-stage{min-height:240px;padding:0}.wardrobe-stage .digital-creature{width:290px;height:235px}.appearance-caption{display:none}.wardrobe-editor{margin:8px 14px 24px;padding:22px;max-height:none;border-radius:24px}.wardrobe-editor h1{font-size:27px}.color-swatch{width:34px;height:34px;flex-basis:34px}.art-tile img{height:66px}.appearance-save{font-size:22px}}
@media(prefers-reduced-motion:reduce){.digital-creature img{animation:none!important}.art-tile{transition:none}}

.vehicle-personalized{position:relative;display:block;width:100%;height:100%;min-height:90px}.vehicle-personalized .boat-thumbnail{width:100%;height:100%;object-fit:contain}.vehicle-insignia{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.vehicle-customization{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0;padding:14px;border:1px solid #43717e;border-radius:12px;background:#0d3040}.vehicle-customization[hidden]{display:none}.vehicle-customization label{display:grid;gap:5px;color:#c5e9eb}.vehicle-customization input,.vehicle-customization select{min-width:0;width:100%;box-sizing:border-box;background:#082330;color:#e3f4f3;border:1px solid #517f8b;border-radius:8px;padding:10px}.vehicle-customization button{background:#195567;color:#e8fcf7;border:1px solid #74c4c7;border-radius:8px;padding:10px;font-weight:700}.vehicle-customization small{align-self:center;color:#9ee3d9}@media(max-width:540px){.vehicle-customization{grid-template-columns:1fr}.vehicle-customization button{min-height:44px}}

.variant-card .vehicle-personalized{height:105px;min-height:0}.wardrobe-stage #appearancePreview>.vehicle-personalized{max-width:420px;height:100%}.variant-card.locked .vehicle-insignia{filter:brightness(.33) saturate(.55)}