:root{--rarity-common:#b8b6c7;--rarity-uncommon:#9ce4bc;--rarity-rare:#8dc7ff;--rarity-epic:#c4a0ff;--rarity-legendary:#ffcf75;--rarity-exclusive:#ffa7cb}
#menuOv .home-account-bar{min-height:82px}
#menuOv .home-identity{min-height:62px;padding:8px 12px;border:1px solid #ffffff18;border-radius:14px;gap:12px;max-width:none}
#menuOv .home-avatar{width:48px;height:48px;border:0;background:#14142660;flex-shrink:0}
.identity-rank{display:flex;align-items:center;gap:6px;margin-top:4px;color:var(--rank-color,#d5ae79);font:600 10px var(--body)}
.identity-rank:before{content:'◆';font-size:9px}
.collection-shortcut{display:flex;align-items:center;gap:8px}
.collection-shortcut svg{width:22px;height:22px;flex-shrink:0}
#menuOv .home-account-buttons{flex-wrap:wrap}
.home-friends{width:100%;max-width:1360px;margin:0 auto;flex-shrink:0}
.social-section-heading{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.social-section-heading h2{font:600 16px var(--display);margin:0;color:#fff5e9}
.social-section-heading>span{font:500 12px var(--body);color:#a9bfb9}
.social-section-heading>button{margin-left:auto;padding:8px 0;background:none;color:#c1b6cf;border:0;font:500 12px var(--body);cursor:pointer;min-height:40px}
.home-friends-track{display:flex;gap:14px;overflow-x:auto;overscroll-behavior-x:contain;touch-action:pan-x;padding:4px 2px 8px;scrollbar-width:thin;scrollbar-color:#49445e transparent}
.friend-tile,.friend-strip-add{flex:0 0 90px;border:0;padding:4px;background:none;color:#f3edf8;display:flex;flex-direction:column;align-items:center;gap:6px;font:500 11px var(--body);cursor:pointer;min-height:118px;min-width:0}
.friend-tile b{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px;text-align:center}
.friend-tile small{font-size:10px;line-height:1.2}
.friend-portrait{width:66px;height:66px;border-radius:50%;border:1px solid #fff2;display:grid;place-items:center;position:relative}
.friend-portrait canvas{width:58px;height:58px}
.friend-online-dot{position:absolute;bottom:0;right:0;width:12px;height:12px;border:3px solid #171526;border-radius:50%;background:#726d85}
.friend-online-dot.is-online{background:#83e3b4;box-shadow:0 0 12px #83e3b440}
.friend-online-dot.unknown{background:#dab67b}
.friend-tile-status{font-size:9px;color:#b8aec5}
.friend-strip-add>span{display:grid;place-items:center;width:66px;height:66px;border:1px dashed #665a80;border-radius:22px;color:#cfbee8;font-size:26px;background:#211b35}
.friend-strip-add b{font-weight:500;line-height:1.5}
.friend-strip-signin{flex-basis:240px;flex-direction:row;min-height:80px;justify-content:flex-start;gap:14px}
@media(min-width:761px){#menuOv .home-feature-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}}
.social-empty{padding:18px 0;margin:0;color:#aaa2bb;font:400 13px/1.6 var(--body)}
#collectionOv .collection-panel{max-width:1100px;gap:18px}
#collectionCount{margin:10px 0 0}
.collection-tabs{display:flex;gap:8px;overflow-x:auto;touch-action:pan-x;flex-shrink:0;padding-bottom:8px;scrollbar-width:thin}
.collection-tabs button{display:flex;align-items:center;gap:10px;flex-shrink:0;border:1px solid #d0a4ec25;background:#1d1a30;color:#bcb3ca;border-radius:14px;min-height:48px;padding:12px 16px;font:500 13px var(--body);cursor:pointer}
.collection-tabs button[aria-selected=true]{color:#ffde98;border-color:#ffd16665;background:#ffd16610}
.collection-tabs small{padding:3px 7px;background:#ffffff0a;border-radius:6px;font-size:10px}
.inventory-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;align-items:stretch}
.inventory-item{display:flex;flex-direction:column;gap:14px;border:1px solid #d0a4ec20;border-radius:20px;background:linear-gradient(145deg,#25203988,#151426);padding:16px;min-width:0}
.inventory-item.equipped{border-color:#ffd16685;box-shadow:inset 0 0 0 1px #ffd16620}
.inventory-item-art{height:126px;display:flex;align-items:center;justify-content:center;position:relative;background:radial-gradient(ellipse,color-mix(in srgb,var(--rarity-color) 12%,transparent),transparent 70%);border-radius:14px}
.inventory-item-art canvas.skprev{width:96px;height:96px}
.inventory-item-art canvas.tileprev{max-width:100%;height:auto}
.inventory-equipped{position:absolute;bottom:-4px;left:50%;transform:translateX(-50%);border:1px solid #ffd16635;padding:5px 9px;border-radius:8px;font:600 9px var(--body);white-space:nowrap;background:#282131;color:#ffda8b}
.inventory-item-info h3{font:600 14px/1.5 var(--body);margin:6px 0 0}
.inventory-rarity{font:600 9px var(--body);letter-spacing:.13em;text-transform:uppercase;color:var(--rarity-color)}
.inventory-item-info p{font:400 12px/1.5 var(--body);color:#b5adbf;margin:6px 0 0}
.inventory-item-actions{display:grid;gap:8px;margin-top:auto}
.inventory-item-actions .btn{width:100%;min-height:44px;font-size:12px;padding:10px}
.inventory-banner-preview{width:100%;min-height:84px;border:1px solid #fff2;border-radius:12px;display:flex;align-items:center;gap:8px;padding:8px;box-sizing:border-box}
.inventory-banner-preview canvas.skprev{width:52px;height:52px;flex-shrink:0}
.inventory-banner-preview>span{font:600 11px var(--body);min-width:0;overflow-wrap:anywhere}
.inventory-banner-preview small{display:block;margin-top:5px;font-size:9px;color:#ffde98}
.inventory-glyph{--item-color:#b8f2e6;display:flex;align-items:center;justify-content:center;color:var(--item-color);position:relative}
.inventory-glyph>span{font-size:46px;text-shadow:0 0 25px color-mix(in srgb,var(--item-color) 40%,transparent)}
.effect-preview:before,.effect-preview:after{content:'';position:absolute;width:78px;height:78px;border:1px solid var(--item-color);border-radius:50%;opacity:.2;animation:inventoryPulse 2.5s infinite}
.effect-preview:after{animation-delay:-1.25s}
.sound-preview{gap:4px}
.sound-preview>span{margin-right:8px;font-size:30px}
.sound-preview i{width:4px;height:34px;background:var(--item-color);border-radius:5px;animation:soundWave 1s ease-in-out infinite alternate}
.sound-preview i:nth-child(2n){height:18px;animation-delay:-.5s}
@keyframes inventoryPulse{from{transform:scale(.65);opacity:.5}to{transform:scale(1.25);opacity:0}}
@keyframes soundWave{to{transform:scaleY(.4)}}
.collection-shop-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;flex-shrink:0}
.profile-loadout,#friendOv .fphero{display:flex;align-items:center;gap:20px;border:1px solid #ffffff22;border-radius:20px;padding:22px;position:relative;overflow:hidden;flex-shrink:0}
.profile-loadout>canvas{width:96px;height:96px;flex-shrink:0}
.profile-loadout>div{min-width:0;flex:1}
#profOv .profile-loadout h2{font:600 20px/1.5 var(--body);margin:0 0 4px;overflow-wrap:anywhere}
#profilePlayerRank{font:600 12px var(--body);text-shadow:0 1px 4px #0007}
#profileCosmetics{font:400 12px/1.6 var(--body);margin:8px 0 0;color:#f3edf8}
.profile-loadout .chip{background:#171526c9;flex-shrink:0}
#friendOv .fphero .fpskin{width:90px;height:90px;flex-shrink:0}
#friendOv .fphero>div{min-width:0}
#friendOv #fpName{overflow-wrap:anywhere}
#friendOv #fpSeen{white-space:normal;text-align:right;line-height:1.6}
.frlist li{border-radius:16px}
.frlist li>canvas{width:52px;height:52px;flex-shrink:0;border-radius:16px;background:#242039}
@media(max-width:1000px){.inventory-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
body.mobile-app #menuOv .home-account-bar{min-height:82px;padding:8px;gap:6px}
body.mobile-app #menuOv .home-identity{min-height:64px;padding:7px 8px;gap:8px;max-width:none}
body.mobile-app #menuOv .home-avatar{display:block;width:40px;height:40px}
body.mobile-app #menuOv .home-identity-text{min-width:0}
body.mobile-app .home-identity-text small{font-size:9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.mobile-app #menuOv #mCollection{width:40px;height:44px;min-height:44px;padding:0;display:grid;place-items:center;flex-shrink:0}
body.mobile-app #mCollection span{display:none}
body.mobile-app #menuOv #mShop{width:40px}
body.mobile-app .home-friends-track{gap:8px}
body.mobile-app .friend-tile,body.mobile-app .friend-strip-add{flex-basis:80px}
body.mobile-app .friend-strip-signin{flex-basis:230px}
body.mobile-app .social-section-heading{margin-bottom:5px}
body.mobile-app .social-section-heading h2{font:600 14px var(--body)}
body.mobile-app .social-section-heading>span,body.mobile-app .social-section-heading>button{font-size:11px}
body.mobile-app #collectionOv .collection-panel{max-width:1100px}
body.mobile-app .inventory-item{padding:12px;gap:12px}
body.mobile-app .inventory-item-art{height:110px}
body.mobile-app #collectionOv .inventory-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
body.mobile-app .collection-tabs button{min-height:48px}
body.mobile-app .profile-loadout{flex-wrap:wrap;padding:16px;gap:12px}
body.mobile-app .profile-loadout>canvas{width:72px;height:72px}
body.mobile-app #profileCollection{width:100%;min-height:48px}
body.mobile-app #profOv .profile-loadout h2{font-size:18px}
body.mobile-app #friendOv .fphero{padding:16px;gap:12px}
body.mobile-app #friendOv .fphero .fpskin{width:72px;height:72px}
@media(max-width:360px){body.mobile-app #menuOv .home-avatar{width:32px;height:32px}body.mobile-app .home-gem-balance{padding:8px 6px}body.mobile-app #menuOv .home-identity{padding:6px}body.mobile-app .identity-rank{font-size:9px}body.mobile-app .inventory-banner-preview{flex-direction:column;gap:0;padding:4px}body.mobile-app .inventory-item-info h3{font-size:12px}}
@media(prefers-reduced-motion:reduce){.effect-preview:before,.effect-preview:after,.sound-preview i{animation:none}}
#worldsOv .world-map-panel{padding:28px;max-width:1480px;background:radial-gradient(ellipse at 30% 80%,#29265588,transparent 70%),#131426}
.world-map-heading h2{font-size:clamp(24px,3vw,36px)}
.world-map-layout{grid-template-columns:minmax(0,1fr) 360px;gap:24px}
#worldList.world-map{grid-template-rows:repeat(var(--map-rows),260px) auto;gap:16px 8px;padding:18px 12px;background:radial-gradient(ellipse at 45% 50%,#54477730,transparent 70%)}
.world-island{gap:7px;border-radius:24px;background:radial-gradient(ellipse at 50% 38%,var(--island-high),transparent 74%)}
.world-island .island-scene{width:100%;max-width:245px;filter:drop-shadow(0 12px 15px #0004)}
.world-island.locked .island-scene{opacity:.68;filter:saturate(.65)}
.world-island b{font:600 13px/1.45 var(--body)}
.world-island small{font-size:11px}
.world-node-number{position:absolute;top:14px;left:16px;font:500 10px var(--display);color:#ffffff60}
.world-island[aria-pressed=true]{border-color:var(--island-color);background:radial-gradient(ellipse at 50% 38%,var(--island-high),transparent 90%);box-shadow:0 0 0 3px color-mix(in srgb,var(--island-color) 8%,transparent)}
.world-island:hover{transform:translateY(-3px);transition:transform .2s}
.world-map-viewport{max-height:65vh;min-height:400px}
.world-detail{padding:20px;overflow:hidden}
.world-hero-scene{height:210px;margin:-4px -4px 0;display:flex;align-items:center;justify-content:center;position:relative;border-radius:18px;background:radial-gradient(ellipse,var(--world-sky),var(--island-sky))}
.world-hero-scene .island-scene{width:100%;max-width:320px;height:100%;margin:auto}
.world-hero-scene>span{position:absolute;bottom:12px;left:16px;font:600 9px var(--body);letter-spacing:.16em;color:#fff5e9}
.world-detail h3{font-size:22px}
.world-water{animation:worldSway 5s ease-in-out infinite alternate;transform-origin:center}
.world-gear{animation:worldTurn 16s linear infinite;transform-box:fill-box;transform-origin:center}
.level-world-scene{border:1px solid #ffffff22;border-radius:20px;min-height:180px;display:grid;place-items:center;flex-shrink:0}
.level-world-scene .world-illustration{width:min(360px,90%);height:200px}
@keyframes worldSway{to{transform:translateY(-4px)}}
@keyframes worldTurn{to{transform:rotate(360deg)}}
@media(max-width:1100px){.world-map-layout{grid-template-columns:minmax(0,1fr) 300px}#worldList.world-map{grid-template-rows:repeat(var(--map-rows),230px) auto}.world-hero-scene{height:190px}}
@media(max-width:760px){.world-map-layout{grid-template-columns:minmax(0,1fr)}.world-map-viewport{min-height:340px;max-height:50vh}.world-detail{position:relative;top:0}.world-hero-scene{height:230px}#worldList.world-map{padding:10px;grid-template-columns:repeat(2,minmax(0,1fr))}}
body.mobile-app #worldList.world-map{grid-template-rows:repeat(var(--map-rows),220px) auto}
body.mobile-app .world-island .island-scene{width:100%;max-width:245px}
body.mobile-app .world-island b{font:600 12px/1.4 var(--body)}
body.mobile-app .world-map-viewport{max-height:50vh;min-height:340px}
body.mobile-app .level-world-scene{min-height:160px}
body.mobile-app .level-world-scene .world-illustration{height:180px}
@media(max-height:540px) and (orientation:landscape){body.mobile-app .world-map-viewport{min-height:170px;max-height:55vh}body.mobile-app .world-hero-scene{height:160px}}
@media(prefers-reduced-motion:reduce){.world-water,.world-gear,.world-island{animation:none;transition:none}.world-island:hover{transform:none}}

body.mobile-app #toast{top:auto;bottom:calc(var(--app-nav-height) + 16px + env(safe-area-inset-bottom,0px));}
body.mobile-app #menuOv .home-account-bar:has(#mAdmin:not([hidden])){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
body.mobile-app #menuOv .home-account-bar:has(#mAdmin:not([hidden])) .home-identity{grid-column:1/3;grid-row:1;width:100%;box-sizing:border-box}
body.mobile-app #menuOv .home-account-bar:has(#mAdmin:not([hidden])) .home-gem-balance{grid-column:3;grid-row:1;padding:8px 4px;gap:4px;justify-content:center}
body.mobile-app #menuOv .home-account-bar:has(#mAdmin:not([hidden])) .home-gem-balance small{display:none}
body.mobile-app #menuOv .home-account-bar:has(#mAdmin:not([hidden])) #mCollection{grid-column:1;grid-row:2;width:100%;display:flex;align-items:center;justify-content:center;gap:5px;font-size:10px}
body.mobile-app #menuOv .home-account-bar:has(#mAdmin:not([hidden])) #mCollection span{display:inline}
body.mobile-app #menuOv .home-account-bar:has(#mAdmin:not([hidden])) #mCollection svg{width:18px;height:18px}
body.mobile-app #menuOv .home-account-bar:has(#mAdmin:not([hidden])) #mShop{grid-column:2;grid-row:2;width:100%;font-size:10px;gap:5px}
body.mobile-app #menuOv .home-account-bar:has(#mAdmin:not([hidden])) #mAdmin{grid-column:3;grid-row:2;justify-content:center}
.identity-rank{white-space:nowrap}