.nav-tab[data-view="social"] { --nav-color:#8F76E8; }
.nav-tab[data-view="social"] .social-nav-badge {
  position:absolute;top:5px;right:5px;width:7px;height:7px;border-radius:50%;
  background:#D8C9FF;box-shadow:0 0 0 3px rgba(143,118,232,.15),0 0 10px #8F76E8;
}

.social-root {
  --social:#A58AF0;--social-bright:#D8C9FF;--social-cyan:#78D8E8;
  --social-green:#7EDAA5;--social-panel:rgba(16,20,31,.92);
  min-height:calc(100vh - 90px);color:var(--text,#E6E7EB);
}
.social-root * { box-sizing:border-box; }
.social-root button,.social-root input,.social-root select { font:inherit; }

.social-loading-shell,.social-offline-shell {
  min-height:300px;display:flex;align-items:center;justify-content:center;gap:18px;
  border:1px solid rgba(165,138,240,.24);border-radius:13px;
  background:radial-gradient(circle at 15% 35%,rgba(125,93,206,.12),transparent 38%),rgba(13,17,26,.72);
}
.social-loading-shell strong,.social-offline-shell strong { display:block;font-family:var(--font-display,Cinzel,serif);font-size:16px;color:#EFE8FF; }
.social-loading-shell span:not(.social-loading-emblem),.social-offline-shell span { display:block;margin-top:5px;font-size:10px;line-height:1.6;color:#AEB6C9; }
.social-loading-emblem {
  width:54px;height:54px;border:1px solid rgba(165,138,240,.55);border-radius:50%;
  background:radial-gradient(circle,rgba(216,201,255,.8) 0 3px,rgba(165,138,240,.18) 4px 11px,transparent 12px),
    conic-gradient(from 45deg,transparent,rgba(120,216,232,.35),transparent,rgba(165,138,240,.35),transparent);
  box-shadow:0 0 24px rgba(143,118,232,.18),inset 0 0 18px rgba(120,216,232,.08);
  animation:socialEmblemTurn 8s linear infinite;
}
@keyframes socialEmblemTurn { to { transform:rotate(360deg); } }

.social-hero {
  position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:20px;
  min-height:122px;padding:22px 24px;border:1px solid rgba(165,138,240,.34);border-radius:13px;
  background:linear-gradient(118deg,rgba(49,34,82,.78),rgba(19,25,39,.94) 53%,rgba(14,34,42,.84));
  box-shadow:0 14px 38px rgba(0,0,0,.19),inset 0 1px rgba(255,255,255,.035);
}
.social-hero::before { content:"";position:absolute;inset:-70% 28% -70% auto;width:280px;transform:rotate(18deg);background:linear-gradient(90deg,transparent,rgba(195,177,255,.08),transparent);pointer-events:none; }
.social-hero-copy { position:relative;z-index:1;max-width:720px; }
.social-hero-actions { position:relative;z-index:1;display:grid;justify-items:end;gap:8px; }
.social-hero-sync{min-width:190px;display:flex;align-items:center;gap:9px;padding:8px 11px;border:1px solid rgba(120,216,232,.32);border-radius:9px;background:linear-gradient(135deg,rgba(29,63,73,.34),rgba(61,41,90,.32));color:#DDF7F7;text-align:left;cursor:pointer;box-shadow:inset 0 0 18px rgba(120,216,232,.035);transition:border-color .2s,box-shadow .2s,transform .2s}.social-hero-sync:hover{transform:translateY(-1px);border-color:rgba(120,216,232,.62);box-shadow:0 0 18px rgba(120,216,232,.1)}.social-hero-sync:disabled{cursor:default;opacity:.62;transform:none}.social-sync-glyph{width:28px;height:28px;display:grid;place-items:center;flex:0 0 auto;border:1px solid currentColor;border-radius:50%;color:#78D8E8;font-size:17px}.social-hero-sync strong,.social-hero-sync small{display:block}.social-hero-sync strong{font-size:10px;letter-spacing:.025em}.social-hero-sync small{max-width:180px;margin-top:2px;color:#9EB2BF;font-size:9.5px;line-height:1.25}.social-hero-sync.stale{border-color:rgba(226,177,88,.55);background:linear-gradient(135deg,rgba(108,72,22,.25),rgba(67,39,81,.32));box-shadow:0 0 18px rgba(226,177,88,.08)}.social-hero-sync.stale .social-sync-glyph{color:#E2B158}.social-hero-sync.warning{border-color:rgba(232,111,121,.56);background:rgba(105,32,46,.2)}.social-hero-sync.warning .social-sync-glyph{color:#EF7C86}
.social-discord-link { display:inline-flex;align-items:center;gap:7px;min-height:34px;padding:7px 11px;border:1px solid rgba(137,111,222,.48);border-radius:999px;background:linear-gradient(135deg,rgba(88,66,156,.32),rgba(48,43,89,.34));box-shadow:0 0 14px rgba(125,94,210,.12);color:#E9E0FF;text-decoration:none;font-size:9.5px;font-weight:850;letter-spacing:.035em; }
.social-discord-link:hover,.social-discord-link:focus-visible { border-color:#BEAAFF;background:linear-gradient(135deg,rgba(108,78,191,.45),rgba(61,49,111,.44));box-shadow:0 0 18px rgba(146,111,230,.24);outline:none; }
.social-kicker { color:#BCA9F3;font-size:9.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase; }
.social-hero h1 { margin:5px 0 6px;font-family:var(--font-display,Cinzel,serif);font-size:22px;letter-spacing:.025em;color:#F5F1FF; }
.social-hero p { margin:0;max-width:650px;color:#B7BED0;font-size:10px;line-height:1.65; }
.social-connection { position:relative;z-index:1;display:flex;align-items:center;gap:8px;flex:0 0 auto;padding:8px 11px;border:1px solid rgba(126,218,165,.32);border-radius:999px;background:rgba(8,20,18,.5);font-size:9.5px;font-weight:750;color:#AEEBC7; }
.social-connection i { width:7px;height:7px;border-radius:50%;background:#7EDAA5;box-shadow:0 0 9px #7EDAA5; }
.social-connection.offline { border-color:rgba(224,158,103,.35);color:#E8BD93;background:rgba(31,21,16,.56); }
.social-connection.offline i { background:#D79560;box-shadow:0 0 8px #D79560; }

.social-notice { display:flex;align-items:flex-start;gap:10px;margin-top:10px;padding:10px 12px;border:1px solid rgba(224,158,103,.28);border-radius:8px;background:rgba(62,38,20,.2);color:#D9C4B1;font-size:9.5px;line-height:1.55; }
.social-notice strong { color:#F0C79D; }
.social-notice.info { border-color:rgba(120,216,232,.28);background:rgba(18,50,61,.18);color:#BAD5DC; }
.social-notice.info strong { color:#9DE9F4; }
.social-notice.error { border-color:rgba(225,92,106,.35);background:rgba(72,22,31,.2);color:#F0B7BE; }

.social-grid { display:grid;grid-template-columns:minmax(0,1.12fr) minmax(300px,.88fr);gap:12px;margin-top:12px; }
.social-panel { border:1px solid rgba(138,151,180,.22);border-radius:11px;background:linear-gradient(145deg,rgba(22,27,40,.94),rgba(12,16,25,.9));box-shadow:0 10px 25px rgba(0,0,0,.13);overflow:hidden; }
.social-panel-head { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 15px;border-bottom:1px solid rgba(138,151,180,.17);background:rgba(255,255,255,.018); }
.social-panel-head h2 { margin:0;font-family:var(--font-display,Cinzel,serif);font-size:13px;color:#EDE7FF; }
.social-panel-head span { color:#8F9AAF;font-size:9.5px; }
.social-panel-body { padding:15px; }

.social-local-profile { display:grid;grid-template-columns:70px 1fr;gap:14px;align-items:center; }
.social-avatar { width:70px;height:70px;display:grid;place-items:center;border:1px solid rgba(165,138,240,.48);border-radius:16px;background:radial-gradient(circle,rgba(165,138,240,.2),rgba(11,15,24,.92) 68%);box-shadow:0 0 22px rgba(143,118,232,.13),inset 0 0 18px rgba(165,138,240,.08);font-family:var(--font-display,Cinzel,serif);font-size:24px;color:#D8C9FF; }
.social-avatar-v2 { --avatar-size:34px;--avatar-primary:#8F76E8;--avatar-secondary:#78D8E8;position:relative;width:var(--avatar-size)!important;height:var(--avatar-size)!important;min-width:var(--avatar-size);max-width:var(--avatar-size);min-height:var(--avatar-size);max-height:var(--avatar-size);aspect-ratio:1/1;display:inline-grid;place-items:center;flex:0 0 var(--avatar-size);overflow:hidden;isolation:isolate;border:1px solid color-mix(in srgb,var(--avatar-primary) 72%,white 8%);border-radius:50%;background:radial-gradient(circle,var(--avatar-primary),var(--avatar-secondary));box-shadow:0 0 14px color-mix(in srgb,var(--avatar-primary) 35%,transparent),inset 0 0 12px rgba(255,255,255,.08);vertical-align:middle; }
.social-avatar-v2::before { content:"";position:absolute;z-index:0;inset:3px;border:1px solid rgba(255,255,255,.18);border-radius:inherit;pointer-events:none; }
.social-avatar-v2.avatar-gradient-solid { background:var(--avatar-primary); }
.social-avatar-v2.avatar-gradient-radial { background:radial-gradient(circle at 36% 28%,color-mix(in srgb,var(--avatar-secondary) 88%,white 12%),var(--avatar-primary) 58%,color-mix(in srgb,var(--avatar-primary) 72%,black 28%)); }
.social-avatar-v2.avatar-gradient-diagonal { background:linear-gradient(135deg,var(--avatar-primary),var(--avatar-secondary)); }
.social-avatar-v2.avatar-gradient-vertical { background:linear-gradient(180deg,var(--avatar-secondary),var(--avatar-primary)); }
.social-avatar-v2.avatar-gradient-conic { background:conic-gradient(from 35deg,var(--avatar-primary),var(--avatar-secondary),var(--avatar-primary)); }
.social-avatar-image { position:absolute;z-index:1;inset:4px;display:grid;place-items:center;overflow:hidden;border-radius:inherit;background:rgba(7,11,18,.48); }
.social-avatar-image img,.social-avatar-image svg { width:100%;height:100%;display:block;object-fit:cover; }
.social-avatar-image svg { padding:8%;overflow:visible; }
.social-avatar-image .social-avatar-sprite-crop { position:absolute;inset:0;display:block;overflow:hidden; }
.social-avatar-image .social-avatar-sprite-crop img { width:calc(var(--avatar-sprite-frames) * 100%)!important;max-width:none!important;height:100%!important;object-fit:fill!important;object-position:left center!important; }
.social-avatar-image svg.social-mining-avatar-art { padding:0;object-fit:contain; }
.social-avatar-fallback { display:grid;place-items:center;width:100%;height:100%;color:#F2ECFF;font-family:var(--font-display,Cinzel,serif);font-size:calc(var(--avatar-size) * .4); }
.social-avatar-fx,.social-avatar-fx i { position:absolute;z-index:2;inset:0;border-radius:inherit;pointer-events:none; }
.social-avatar-fx i { width:4px;height:4px;inset:auto;background:white;box-shadow:0 0 7px white;opacity:0; }
.social-avatar--profile { --avatar-size:58px; }
.social-avatar--hall { --avatar-size:58px; }
.social-avatar--friend { --avatar-size:36px; }
.social-avatar--leaderboard { --avatar-size:34px; }
.social-avatar--builder { --avatar-size:128px;border-width:2px;box-shadow:0 0 42px color-mix(in srgb,var(--avatar-primary) 48%,transparent),inset 0 0 24px rgba(255,255,255,.11); }
.social-avatar--choice { --avatar-size:54px; }
.social-avatar--builder .social-avatar-image { inset:8px; }
.social-avatar--builder::before { inset:6px; }

.avatar-effect-spirit_pulse { animation:socialAvatarPulse 2.8s ease-in-out infinite; }
.avatar-effect-spirit_pulse .social-avatar-image { animation:socialAvatarImagePulse 2.8s ease-in-out infinite; }
.avatar-effect-celestial_orbit .social-avatar-fx i:nth-child(-n+2) { left:calc(50% - 2px);top:calc(50% - 2px);opacity:.9;animation:socialAvatarOrbit 3.2s linear infinite; }
.avatar-effect-celestial_orbit .social-avatar-fx i:nth-child(2) { animation-delay:-1.6s;background:var(--avatar-secondary); }
.avatar-effect-starlit_glints .social-avatar-fx i,.avatar-effect-frost_halo .social-avatar-fx i { width:3px;height:3px;border-radius:0;transform:rotate(45deg);animation:socialAvatarGlint 2.7s ease-in-out infinite; }
.avatar-effect-starlit_glints .social-avatar-image { animation:socialAvatarSweep 3.4s ease-in-out infinite; }
.social-avatar-fx i:nth-child(1) { left:18%;top:22%;animation-delay:-.1s; }.social-avatar-fx i:nth-child(2) { left:72%;top:18%;animation-delay:-.7s; }.social-avatar-fx i:nth-child(3) { left:81%;top:58%;animation-delay:-1.3s; }.social-avatar-fx i:nth-child(4) { left:22%;top:74%;animation-delay:-1.9s; }.social-avatar-fx i:nth-child(5) { left:48%;top:9%;animation-delay:-2.3s; }.social-avatar-fx i:nth-child(6) { left:53%;top:82%;animation-delay:-2.6s; }
.avatar-effect-verdant_drift .social-avatar-fx i { width:5px;height:3px;border-radius:90% 10% 90% 10%;background:#C7F58B;box-shadow:0 0 6px #6DD89A;animation:socialAvatarRise 3.8s ease-in infinite; }
.avatar-effect-ember_halo .social-avatar-fx i { width:3px;height:5px;border-radius:50% 50% 45% 45%;background:#FFD477;box-shadow:0 0 7px #F06B36;animation:socialAvatarRise 2.8s ease-in infinite; }
.avatar-effect-frost_halo .social-avatar-fx i { background:#E8FAFF;box-shadow:0 0 8px #7EDCF5; }
.avatar-effect-hallowed_rise .social-avatar-fx i { width:10px;height:10px;border:2px solid rgba(255,255,255,.82);border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.08),transparent 65%);box-shadow:0 0 8px color-mix(in srgb,var(--avatar-secondary) 65%,white 35%);animation:socialAvatarBubble 4.2s ease-out infinite; }
.avatar-effect-verdant_drift .social-avatar-fx i:nth-child(n),.avatar-effect-ember_halo .social-avatar-fx i:nth-child(n),.avatar-effect-hallowed_rise .social-avatar-fx i:nth-child(n) { top:auto;bottom:-12px; }
.avatar-effect-hallowed_rise .social-avatar-image { animation:socialAvatarImageFloat 4.6s ease-in-out infinite; }
.avatar-paused,.avatar-paused * { animation-play-state:paused!important; }
body.battery-saver .social-avatar-v2,body.battery-saver .social-avatar-v2 * { animation:none!important; }
body.battery-saver .social-avatar-fx { display:none!important; }

@keyframes socialAvatarPulse { 0%,100%{box-shadow:0 0 10px color-mix(in srgb,var(--avatar-primary) 25%,transparent)}50%{box-shadow:0 0 25px color-mix(in srgb,var(--avatar-primary) 70%,transparent)} }
@keyframes socialAvatarImagePulse { 0%,100%{filter:brightness(.95)}50%{filter:brightness(1.2)} }
@keyframes socialAvatarOrbit { from{transform:rotate(0deg) translateX(calc(var(--avatar-size) * .42)) rotate(0deg)}to{transform:rotate(360deg) translateX(calc(var(--avatar-size) * .42)) rotate(-360deg)} }
@keyframes socialAvatarGlint { 0%,72%,100%{opacity:0;transform:scale(.25) rotate(45deg)}82%{opacity:1;transform:scale(1.5) rotate(45deg)} }
@keyframes socialAvatarSweep { 0%,100%{filter:brightness(.95)}48%{filter:brightness(1)}58%{filter:brightness(1.22)}68%{filter:brightness(1)} }
@keyframes socialAvatarRise { 0%{opacity:0;transform:translateY(0) rotate(0deg)}22%{opacity:.9}100%{opacity:0;transform:translateY(calc(var(--avatar-size) * -.95)) rotate(150deg)} }
@keyframes socialAvatarBubble { 0%{opacity:0;transform:translateY(0) scale(.45)}18%{opacity:.85}100%{opacity:0;transform:translateY(calc(var(--avatar-size) * -.78)) scale(1.1)} }
@keyframes socialAvatarImageFloat { 0%,100%{transform:translateY(0);filter:brightness(1)}50%{transform:translateY(-2%);filter:brightness(1.08)} }
.social-profile-name { font-family:var(--font-display,Cinzel,serif);font-size:16px;color:#F1ECFF; }
.social-profile-sub { margin-top:3px;color:#9AA5BA;font-size:9.5px; }
.social-stat-row { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:12px; }
.social-stat { padding:9px;border:1px solid rgba(132,147,176,.18);border-radius:7px;background:rgba(8,12,20,.42); }
.social-stat strong { display:block;color:#E7EAF2;font-size:12px; }
.social-stat span { display:block;margin-top:2px;color:#A5AFC0;font-size:9.5px;font-weight:700;letter-spacing:.045em;text-transform:uppercase; }

.social-auth-choice { display:grid;gap:10px; }
.social-auth-choice h3 { margin:0;font-family:var(--font-display,Cinzel,serif);font-size:14px;color:#EFE9FF; }
.social-auth-choice p { margin:0;color:#A6B0C2;font-size:9.5px;line-height:1.6; }
.social-form { display:grid;gap:9px;margin-top:12px; }
.social-field { display:grid;gap:5px; }
.social-field label { color:#B6BFD1;font-size:9.5px;font-weight:700; }
.social-field input,.social-field select { width:100%;min-height:38px;padding:9px 10px;border:1px solid rgba(143,118,232,.3);border-radius:7px;outline:none;background:#0E131E;color:#E6E9F0;font-size:10px; }
.social-field input:focus,.social-field select:focus { border-color:#A58AF0;box-shadow:0 0 0 3px rgba(165,138,240,.1); }
.social-field small { color:#98A3B5;font-size:9.5px;line-height:1.45; }
.social-actions { display:flex;flex-wrap:wrap;gap:7px;margin-top:11px; }
.social-button { min-height:36px;padding:8px 13px;border:1px solid rgba(165,138,240,.5);border-radius:7px;background:linear-gradient(135deg,rgba(116,83,190,.35),rgba(67,51,111,.25));color:#ECE5FF;font-size:9.5px;font-weight:800;cursor:pointer;transition:border-color .18s ease,background .18s ease,transform .18s ease; }
.social-button:hover:not(:disabled) { transform:translateY(-1px);border-color:#C7B2FF;background:linear-gradient(135deg,rgba(129,91,211,.48),rgba(68,54,112,.32)); }
.social-button.secondary { border-color:rgba(128,147,176,.32);background:rgba(25,31,44,.6);color:#C0C7D6; }
.social-button.danger { border-color:rgba(220,89,105,.38);background:rgba(79,28,37,.3);color:#F0B2BA; }
.social-button:disabled { opacity:.42;cursor:not-allowed; }

.social-divider { display:flex;align-items:center;gap:8px;margin:13px 0;color:#929EB2;font-size:9.5px;text-transform:uppercase;letter-spacing:.1em; }
.social-divider::before,.social-divider::after { content:"";height:1px;flex:1;background:rgba(138,151,180,.17); }
.social-google-slot { min-height:40px;display:flex;align-items:center; }

.social-account-card { display:grid;gap:12px; }
.social-account-top { display:flex;align-items:center;gap:12px; }
.social-friend-code { display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 12px;border:1px solid rgba(120,216,232,.25);border-radius:8px;background:rgba(14,39,49,.22); }
.social-friend-code span { display:block;color:#9CB0C0;font-size:9.5px;text-transform:uppercase;letter-spacing:.1em; }
.social-friend-code strong { display:block;margin-top:2px;color:#AEEAF2;font-family:var(--font-display,Cinzel,serif);font-size:14px;letter-spacing:.09em; }
.social-provider-list { display:grid;gap:6px; }
.social-provider { display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;border:1px solid rgba(138,151,180,.17);border-radius:7px;color:#B7C0D1;font-size:9.5px; }
.social-provider em { color:#7EDAA5;font-style:normal;font-size:9.5px;font-weight:800;text-transform:uppercase; }
.social-provider em.unlinked { color:#8791A4; }

.social-recovery { border:1px solid rgba(220,183,89,.42);border-radius:10px;padding:15px;background:radial-gradient(circle at top right,rgba(220,183,89,.12),transparent 38%),rgba(31,25,14,.58); }
.social-recovery h3 { margin:0 0 6px;font-family:var(--font-display,Cinzel,serif);font-size:14px;color:#F1D48B; }
.social-recovery p { margin:0;color:#C8B993;font-size:9.5px;line-height:1.55; }
.social-recovery-code { margin:12px 0;padding:12px;border:1px dashed rgba(235,202,114,.58);border-radius:7px;background:rgba(8,10,14,.55);text-align:center;color:#FFE7A4;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:13px;font-weight:800;letter-spacing:.07em;user-select:all; }

.social-tabs { display:flex;gap:5px;margin-top:12px;padding:5px;border:1px solid rgba(138,151,180,.18);border-radius:9px;background:rgba(8,12,19,.5); }
.social-tab { position:relative;display:flex;align-items:center;justify-content:center;gap:7px;flex:1;padding:8px;border:0;border-radius:6px;background:transparent;color:#8792A6;font-size:9.5px;font-weight:800;cursor:pointer;transition:color .18s ease,background .18s ease,box-shadow .18s ease; }
.social-tab-icon { display:grid;place-items:center;width:20px;height:20px;border-radius:6px;color:#93A1BC;background:rgba(137,151,183,.08);box-shadow:inset 0 0 0 1px rgba(150,164,198,.12); }
.social-tab-icon svg { width:15px;height:15px; }
.social-tab b { display:grid;place-items:center;min-width:17px;height:17px;padding:0 4px;border-radius:999px;background:#B987EE;color:#100D18;font-size:9.5px;box-shadow:0 0 12px rgba(185,135,238,.45); }
.social-tab:hover { color:#D9D1ED;background:rgba(117,101,164,.12); }
.social-tab.active { background:linear-gradient(135deg,rgba(126,94,207,.38),rgba(46,42,74,.45));color:#E8E0FF;box-shadow:inset 0 0 0 1px rgba(165,138,240,.26),0 8px 20px rgba(25,19,48,.18); }
.social-tab.active .social-tab-icon { color:#EEDFFF;background:linear-gradient(145deg,rgba(176,139,240,.28),rgba(94,200,213,.13));box-shadow:inset 0 0 0 1px rgba(192,162,248,.28),0 0 15px rgba(153,116,222,.18); }
.social-coming-soon { margin-top:12px;padding:24px;border:1px dashed rgba(138,151,180,.22);border-radius:9px;text-align:center;color:#8E99AD;font-size:9.5px;line-height:1.6; }
.social-coming-soon strong { display:block;margin-bottom:4px;color:#C3CBDA;font-family:var(--font-display,Cinzel,serif);font-size:12px; }

.social-stack { display:grid;gap:12px;margin-top:12px; }
.social-empty { display:grid;justify-items:start;gap:9px;color:#A7B1C3;font-size:10px;line-height:1.6; }
.social-empty h3,.social-empty p { margin:0; }
.social-empty h3 { color:#E8E1F8;font-family:var(--font-display,Cinzel,serif);font-size:14px; }
.social-field { color:#BFC7D5;font-size:9.5px;font-weight:700; }
.social-field-row { display:grid;grid-template-columns:1fr 1fr;gap:8px; }
.social-toggle { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 10px;border:1px solid rgba(138,151,180,.17);border-radius:7px;color:#C0C8D6;font-size:9.5px; }
.social-settings { margin:0;border-color:rgba(165,138,240,.31); }
.social-settings > summary { display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 15px;cursor:pointer;list-style:none;background:linear-gradient(100deg,rgba(86,63,144,.22),rgba(14,21,33,.38));transition:background .18s ease,border-color .18s ease; }
.social-settings > summary::-webkit-details-marker { display:none; }
.social-settings > summary:hover { background:linear-gradient(100deg,rgba(106,76,178,.3),rgba(17,26,40,.48)); }
.social-settings > summary:focus-visible { outline:2px solid rgba(189,168,248,.75);outline-offset:-3px; }
.social-settings-summary-copy strong,.social-settings-summary-copy small { display:block; }
.social-settings-summary-copy strong { color:#F0E9FF;font-family:var(--font-display,Cinzel,serif);font-size:12px;letter-spacing:.025em; }
.social-settings-summary-copy small { margin-top:4px;color:#A8B2C4;font-family:var(--font-ui,sans-serif);font-size:9.5px;line-height:1.4; }
.social-settings-summary-action { display:flex;align-items:center;gap:9px;flex:0 0 auto;color:#CFC1F5;font-size:9.5px;font-weight:800; }
.social-settings-summary-action em { font-style:normal; }
.social-settings-summary-action i { width:25px;height:25px;display:grid;place-items:center;border:1px solid rgba(165,138,240,.42);border-radius:50%;background:rgba(62,43,105,.36);box-shadow:0 0 12px rgba(143,118,232,.1); }
.social-settings-summary-action i::before { content:"⌄";font-style:normal;font-size:16px;line-height:1;transform:translateY(-2px);transition:transform .2s ease; }
.social-settings[open] > summary { border-bottom:1px solid rgba(165,138,240,.2); }
.social-settings[open] .social-settings-summary-action i::before { transform:rotate(180deg) translateY(-2px); }
.social-settings .when-open { display:none; }
.social-settings[open] .when-open { display:inline; }
.social-settings[open] .when-closed { display:none; }
.social-provider-link { margin-top:12px;padding-top:12px;border-top:1px solid rgba(138,151,180,.17);color:#A8B2C4;font-size:9.5px; }
.social-avatar-setting { display:grid;grid-template-columns:58px 1fr auto;gap:12px;align-items:center;padding:11px;border:1px solid rgba(165,138,240,.23);border-radius:9px;background:linear-gradient(100deg,rgba(72,53,119,.17),rgba(8,14,23,.35)); }
.social-avatar-setting strong,.social-avatar-setting span { display:block; }
.social-avatar-setting strong { color:#ECE5FF;font-family:var(--font-display,Cinzel,serif);font-size:11px; }
.social-avatar-setting span { margin-top:3px;color:#9FAABC;font-size:9.5px;line-height:1.4; }
.social-avatar-builder { scroll-margin-top:14px;overflow:visible;border:1px solid rgba(165,138,240,.4);border-radius:13px;background:radial-gradient(circle at 8% 0,rgba(125,91,207,.15),transparent 28%),linear-gradient(145deg,rgba(21,26,40,.98),rgba(8,12,20,.97));box-shadow:0 18px 42px rgba(0,0,0,.24),0 0 30px rgba(126,94,207,.08); }
.avatar-builder-head { display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:17px 19px;border-bottom:1px solid rgba(165,138,240,.2);background:linear-gradient(100deg,rgba(91,66,154,.25),rgba(12,19,29,.35)); }
.avatar-builder-head { border-radius:12px 12px 0 0; }
.avatar-unlock-message { position:sticky;z-index:12;top:0;display:flex;align-items:center;gap:10px;padding:10px 18px;border:1px solid rgba(224,183,89,.32);border-width:0 0 1px;background:linear-gradient(90deg,rgba(103,73,21,.96),rgba(26,22,27,.98));box-shadow:0 8px 18px rgba(0,0,0,.22);color:#D8C69D;font-size:9.5px;line-height:1.5; }
.avatar-unlock-message b { flex:0 0 auto;color:#F2D784;font-family:var(--font-display,Cinzel,serif);letter-spacing:.06em;text-transform:uppercase; }
.avatar-builder-head span { color:#BCA7F3;font-size:9.5px;font-weight:850;letter-spacing:.11em;text-transform:uppercase; }
.avatar-builder-head h3 { margin:3px 0;color:#F2ECFF;font-family:var(--font-display,Cinzel,serif);font-size:18px; }
.avatar-builder-head p { margin:4px 0 0;color:#A9B3C4;font-size:9.5px;line-height:1.5; }
.social-close-inline { min-height:34px;padding:7px 11px;border:1px solid rgba(165,138,240,.3);border-radius:7px;background:rgba(18,24,36,.72);color:#C9C1DA;font-size:9.5px;font-weight:800;cursor:pointer; }
.avatar-builder-layout { display:grid;grid-template-columns:230px minmax(0,1fr);min-height:560px; }
.avatar-builder-preview { position:sticky;top:10px;align-self:start;display:grid;justify-items:center;gap:18px;padding:30px 20px;text-align:center; }
.avatar-builder-preview::after { content:"";position:absolute;z-index:-1;inset:10px;border:1px solid rgba(165,138,240,.15);border-radius:90px 90px 14px 14px;background:radial-gradient(circle at 50% 18%,rgba(143,118,232,.16),transparent 38%),rgba(8,12,20,.28); }
.avatar-builder-preview > div > span { display:block;margin-bottom:7px;color:#AAB4C6;font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.07em; }
.avatar-builder-preview > small { color:#929EB1;font-size:9.5px;line-height:1.5; }
.avatar-mini-preview { display:flex;align-items:center;gap:9px;padding:8px 11px;border:1px solid rgba(138,151,180,.19);border-radius:8px;background:rgba(7,11,18,.65); }
.avatar-mini-preview strong { color:#E7EAF2;font-size:10px; }
.avatar-builder-controls { display:grid;gap:12px;padding:15px 17px 18px;border-left:1px solid rgba(165,138,240,.16); }
.avatar-builder-step { padding:14px;border:1px solid rgba(138,151,180,.18);border-radius:10px;background:rgba(8,13,22,.38); }
.avatar-builder-step > header { display:flex;align-items:center;gap:10px;margin-bottom:13px; }
.avatar-builder-step > header b { width:29px;height:29px;display:grid;place-items:center;border:1px solid rgba(165,138,240,.48);border-radius:50%;background:rgba(88,62,148,.32);color:#D9CCFF;font-family:var(--font-display,Cinzel,serif); }
.avatar-builder-step > header strong,.avatar-builder-step > header span { display:block; }
.avatar-builder-step > header strong { color:#ECE6FA;font-family:var(--font-display,Cinzel,serif);font-size:11px; }
.avatar-builder-step > header span { margin-top:2px;color:#97A3B6;font-size:9.5px; }
.avatar-choice-group + .avatar-choice-group { margin-top:13px; }
.avatar-choice-group h4 { margin:0 0 7px;color:#B9C3D4;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase; }
.avatar-graphic-grid { display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px; }
.avatar-graphic-choice { min-width:0;display:grid;justify-items:center;gap:5px;padding:8px 5px;border:1px solid rgba(138,151,180,.17);border-radius:8px;background:rgba(16,22,33,.75);color:#ADB7C8;font-size:9.5px;cursor:pointer;transition:border-color .18s ease,background .18s ease,transform .18s ease; }
.avatar-graphic-choice > .social-avatar-v2 { width:54px!important;height:54px!important;min-width:54px;max-width:54px;min-height:54px;max-height:54px;justify-self:center;contain:layout paint; }
.avatar-graphic-choice:hover:not(:disabled) { transform:translateY(-1px);border-color:rgba(165,138,240,.54);background:rgba(57,43,92,.38); }
.avatar-graphic-choice:focus-visible,.avatar-effect-choice:focus-visible,.avatar-preset:focus-visible,.social-close-inline:focus-visible { outline:2px solid #C8B7F8;outline-offset:2px; }
.avatar-graphic-choice.selected { border-color:#BCA7F3;background:linear-gradient(145deg,rgba(102,73,174,.38),rgba(22,25,41,.78));box-shadow:0 0 15px rgba(143,118,232,.12);color:#F0EAFF; }
.avatar-graphic-choice.locked { opacity:.5;filter:saturate(.28);cursor:help; }
.avatar-graphic-choice.locked:hover { opacity:.72;border-color:rgba(224,183,89,.48);background:rgba(73,57,27,.24); }
.avatar-graphic-choice > .avatar-choice-label { width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.avatar-graphic-choice > small { color:#C6A86C;font-size:9.5px; }
.avatar-effect-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px; }
.avatar-effect-choice { min-height:70px;padding:10px;border:1px solid rgba(138,151,180,.17);border-radius:8px;background:rgba(16,22,33,.72);text-align:left;cursor:pointer; }
.avatar-effect-choice strong,.avatar-effect-choice span { display:block; }
.avatar-effect-choice strong { color:#DDD6EC;font-size:9.5px; }
.avatar-effect-choice span { margin-top:5px;color:#929EB1;font-size:9.5px;line-height:1.4; }
.avatar-effect-choice.selected { border-color:rgba(120,216,232,.58);background:linear-gradient(145deg,rgba(35,91,103,.3),rgba(30,29,57,.45));box-shadow:inset 0 0 18px rgba(120,216,232,.05); }
.avatar-effect-choice.locked { cursor:help;border-color:rgba(194,157,77,.22);opacity:.62; }
.avatar-effect-choice.locked:hover { opacity:.85;border-color:rgba(224,183,89,.5); }
.avatar-effect-choice > small { display:block;margin-top:6px;color:#D2B66F;font-size:9.5px;line-height:1.35; }
.avatar-preset-grid { display:flex;flex-wrap:wrap;gap:7px;margin-bottom:11px; }
.avatar-preset { display:flex;align-items:center;gap:7px;padding:7px 9px;border:1px solid rgba(138,151,180,.18);border-radius:999px;background:rgba(15,21,32,.74);color:#B8C1D0;font-size:9.5px;cursor:pointer; }
.avatar-preset i { width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,var(--preset-a),var(--preset-b));box-shadow:0 0 7px color-mix(in srgb,var(--preset-a) 40%,transparent); }
.avatar-colour-controls { display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:8px; }
.avatar-colour-controls label { display:grid;gap:5px;color:#AAB4C5;font-size:9.5px;font-weight:800; }
.avatar-colour-controls input,.avatar-colour-controls select { width:100%;min-height:38px;padding:5px;border:1px solid rgba(143,118,232,.29);border-radius:7px;background:#0E131E;color:#E4E8F0; }
.avatar-builder-actions { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-top:1px solid rgba(165,138,240,.18);background:rgba(8,12,20,.42); }
.avatar-builder-actions > div { display:flex;gap:7px; }
.social-sync { display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border:1px solid rgba(120,216,232,.26);border-radius:9px;background:linear-gradient(100deg,rgba(17,48,60,.34),rgba(28,24,51,.28)); }
.social-sync strong,.social-sync span { display:block; }
.social-sync strong { color:#C8F4FA;font-family:var(--font-display,Cinzel,serif);font-size:11px; }
.social-sync span { margin-top:3px;color:#9DABB9;font-size:9.5px;line-height:1.45; }
.social-hall { overflow:hidden;border:1px solid rgba(165,138,240,.27);border-radius:11px;background:radial-gradient(circle at 10% 0,rgba(141,105,224,.12),transparent 32%),linear-gradient(145deg,rgba(20,25,39,.96),rgba(10,14,23,.92)); }
.social-hall-head { display:grid;grid-template-columns:60px 1fr auto;gap:13px;align-items:center;padding:15px;border-bottom:1px solid rgba(165,138,240,.18); }
.social-hall > .social-hall-head { width:100%; }
.social-hall-head .social-avatar { width:58px;height:58px;font-size:20px; }
.social-avatar-builder-launch { display:grid;place-items:center;width:max-content;padding:0;border:0;border-radius:50%;background:transparent;color:inherit;cursor:pointer; }
.social-avatar-builder-launch:hover .social-avatar,.social-avatar-builder-launch:focus-visible .social-avatar { box-shadow:0 0 0 2px rgba(120,216,232,.52),0 0 22px rgba(165,138,240,.3);transform:translateY(-1px); }
.social-avatar-builder-launch:focus-visible { outline:2px solid #78D8E8;outline-offset:3px; }
.social-hall-head span,.social-hall-head p { display:block;margin:0;color:#9EA9BC;font-size:9.5px; }
.social-hall-head h3 { margin:3px 0;color:#F0E9FF;font-family:var(--font-display,Cinzel,serif);font-size:16px; }
.social-hall-total { text-align:right; }
.social-hall-total strong,.social-hall-total span { display:block; }
.social-hall-total strong { color:#D9CCFF;font-family:var(--font-display,Cinzel,serif);font-size:20px; }
.social-hall-total span { color:#9EA9BC;font-size:9.5px;text-transform:uppercase; }
.social-hall-identity { min-width:0; }
.social-hall-identity > span,.social-hall-identity > strong,.social-hall-identity > small { display:block; }
.social-hall-identity > span,.social-hall-identity > small { margin:0;color:#9EA9BC;font-size:9.5px; }
.social-hall-identity > strong { margin:3px 0;color:#F0E9FF;font-family:var(--font-display,Cinzel,serif);font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.social-hall-collapsible > summary { display:block;list-style:none;cursor:pointer; }
.social-hall-collapsible > summary::-webkit-details-marker { display:none; }
.social-hall-collapsible > summary:hover,.social-hall-collapsible > summary:focus-visible { outline:none;background:rgba(165,138,240,.055); }
.social-hall-collapsible > summary .social-hall-head { grid-template-columns:60px minmax(0,1fr) auto 20px;border-bottom:0; }
.social-hall-collapsible[open] > summary .social-hall-head { border-bottom:1px solid rgba(165,138,240,.18); }
.social-hall-chevron { position:relative;width:19px;height:19px;border:1px solid rgba(181,155,238,.3);border-radius:50%; }
.social-hall-chevron::before { content:"";position:absolute;left:5px;top:4px;width:6px;height:6px;border-right:1.5px solid #C9B6EF;border-bottom:1.5px solid #C9B6EF;transform:rotate(45deg);transition:transform .16s ease,top .16s ease; }
.social-hall-collapsible[open] .social-hall-chevron::before { top:7px;transform:rotate(225deg); }
.social-hall-summary { display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:10px 15px; }
.social-hall-summary div { padding:8px;border:1px solid rgba(138,151,180,.16);border-radius:7px;background:rgba(7,11,19,.38); }
.social-hall-summary strong,.social-hall-summary span { display:block; }
.social-hall-summary strong { color:#E5E8F1;font-size:11px; }
.social-hall-summary span { margin-top:2px;color:#98A4B8;font-size:9.5px; }
.social-skill-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;padding:5px 15px 15px; }
.social-skill-grid div { position:relative;overflow:hidden;padding:9px;border:1px solid rgba(138,151,180,.16);border-radius:7px;background:linear-gradient(135deg,rgba(29,35,50,.76),rgba(10,14,22,.7)); }
.social-skill-grid span,.social-skill-grid strong,.social-skill-grid small { display:block; }
.social-skill-grid span { color:#AEB7C8;font-size:9.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.social-skill-grid strong { margin-top:4px;color:#E7DFFF;font-size:11px; }
.social-skill-grid small { margin-top:2px;color:#8F9AAF;font-size:9.5px; }
.social-hall-skill-grid { grid-template-columns:repeat(4,minmax(0,1fr));gap:7px; }
.social-hall-skill-grid .social-hall-skill-card { --skill-color:#9AA3AF;position:relative;overflow:hidden;min-width:0;padding:9px;border:1px solid color-mix(in srgb,var(--skill-color) 28%,rgba(138,151,180,.18));border-radius:9px;background:radial-gradient(circle at 20% 0,color-mix(in srgb,var(--skill-color) 10%,transparent),transparent 48%),rgba(9,14,23,.82);cursor:default; }
.social-hall-skill-grid .hall-skill-main { display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:6px;align-items:center; }
.social-hall-skill-grid .hall-skill-icon { width:30px;height:30px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--skill-color) 52%,rgba(138,151,180,.2));border-radius:50%;color:var(--skill-color);background:color-mix(in srgb,var(--skill-color) 10%,#0B1019);box-shadow:0 0 10px color-mix(in srgb,var(--skill-color) 18%,transparent),inset 0 0 8px color-mix(in srgb,var(--skill-color) 6%,transparent); }
.social-hall-skill-grid .hall-skill-icon svg { width:19px;height:19px; }
.social-hall-skill-grid .skill-chronicle-name { display:block;overflow:hidden;color:#D9DDE2;font-size:9.5px;font-weight:800;line-height:1.25;text-overflow:ellipsis;white-space:nowrap; }
.social-hall-skill-grid .skill-chronicle-meta { display:block;margin-top:2px;color:#929DAC;font-size:9.5px; }
.social-hall-skill-grid .skill-chronicle-level { color:#F0F2F4;font-size:17px;font-weight:900;line-height:1;font-variant-numeric:tabular-nums; }
.social-hall-skill-grid .hall-mastery-bar { display:block;height:3px;margin-top:8px;overflow:hidden;border-radius:99px;background:rgba(255,255,255,.055); }
.social-hall-skill-grid .hall-mastery-bar i { display:block;height:100%;border-radius:inherit;background:var(--skill-color);box-shadow:0 0 7px var(--skill-color); }
.social-hall-skill-grid .hall-milestone { position:absolute;right:6px;top:5px;padding:2px 4px;border:1px solid rgba(112,207,234,.42);border-radius:99px;background:rgba(112,207,234,.08);color:#8FE1F3;font-size:9.5px;font-weight:900;letter-spacing:.05em; }
.social-hall-showcase { margin:0 15px 15px;border:1px solid rgba(217,180,74,.25);border-radius:9px;background:radial-gradient(circle at 8% 0,rgba(217,180,74,.08),transparent 45%),rgba(7,11,19,.38); }
.social-hall-showcase > summary { min-height:54px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;list-style:none;cursor:pointer; }
.social-hall-showcase > summary::-webkit-details-marker { display:none; }
.social-hall-showcase > summary:hover,.social-hall-showcase > summary:focus-visible { outline:none;background:rgba(217,180,74,.045); }
.social-hall-showcase > summary strong,.social-hall-showcase > summary small { display:block; }
.social-hall-showcase > summary strong { color:#E7CE80;font-family:var(--font-display,Cinzel,serif);font-size:11px; }
.social-hall-showcase > summary small { margin-top:3px;color:#9CA7B7;font-size:9.5px;line-height:1.45; }
.social-hall-showcase > summary > i { position:relative;flex:0 0 20px;width:20px;height:20px;border:1px solid rgba(217,180,74,.27);border-radius:50%; }
.social-hall-showcase > summary > i::before { content:"";position:absolute;left:6px;top:5px;width:6px;height:6px;border-right:1px solid #DCC778;border-bottom:1px solid #DCC778;transform:rotate(45deg);transition:transform .16s ease,top .16s ease; }
.social-hall-showcase[open] > summary > i::before { top:8px;transform:rotate(225deg); }
.social-hall-showcase > .social-showcase-grid { padding:0 12px 12px; }
.social-showcase-grid { display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin-top:10px; }
.social-showcase-item { min-width:0;padding:8px 5px;border:1px solid rgba(138,151,180,.16);border-radius:8px;background:rgba(9,14,23,.72);text-align:center; }
.social-showcase-item.legendary { border-color:rgba(217,180,74,.46);box-shadow:inset 0 0 12px rgba(217,180,74,.07); }
.social-showcase-icon { width:34px;height:34px;display:grid;place-items:center;margin:0 auto 5px;border:1px solid rgba(217,180,74,.24);border-radius:8px;color:#E0C66F;background:rgba(217,180,74,.05); }
.social-showcase-icon svg { width:27px;height:27px; }
.social-showcase-item strong,.social-showcase-item small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.social-showcase-item strong { color:#D9DEE7;font-size:9.5px; }
.social-showcase-item small { margin-top:2px;color:#8F9AAA;font-size:9.5px; }
.social-record-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;padding:0 15px 15px; }
.social-record-grid div { display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px;border:1px solid rgba(120,216,232,.16);border-radius:7px;color:#9FADBD;font-size:9.5px; }
.social-record-grid strong { color:#BCEBF0; }
.social-fishing-achievements { margin:0 15px 15px;padding:12px;border:1px solid rgba(103,207,232,.25);border-radius:9px;background:radial-gradient(circle at 8% 0,rgba(66,187,220,.1),transparent 42%),linear-gradient(135deg,rgba(8,31,40,.46),rgba(7,11,19,.42)); }
.social-fishing-achievements > header { display:flex;align-items:center;gap:9px;margin-bottom:9px; }
.social-fishing-achievement-icon { flex:0 0 35px;width:35px;height:35px;display:grid;place-items:center;border:1px solid rgba(103,207,232,.38);border-radius:50%;background:rgba(38,118,139,.12);color:#73D6E9;box-shadow:0 0 12px rgba(75,197,221,.1); }
.social-fishing-achievement-icon svg { width:21px;height:21px; }
.social-fishing-achievements > header strong,.social-fishing-achievements > header small { display:block; }
.social-fishing-achievements > header strong { color:#A9EDF5;font-family:var(--font-display,Cinzel,serif);font-size:11px; }
.social-fishing-achievements > header small { margin-top:2px;color:#91A8B5;font-size:9.5px; }
.social-fishing-summary { display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px; }
.social-fishing-summary > div { min-width:0;padding:8px;border:1px solid rgba(102,202,224,.15);border-radius:7px;background:rgba(4,13,20,.46); }
.social-fishing-summary strong,.social-fishing-summary span { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.social-fishing-summary strong { color:#D4F5F6;font-size:10.5px;font-variant-numeric:tabular-nums; }
.social-fishing-summary span { margin-top:3px;color:#819AA8;font-size:9.5px; }
.social-fishing-species-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(116px,1fr));gap:5px;margin-top:7px;padding-top:7px;border-top:1px solid rgba(103,207,232,.12); }
.social-fishing-species { min-width:0;display:grid;grid-template-columns:25px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;gap:1px 7px;padding:6px 7px;border:1px solid rgba(102,202,224,.13);border-radius:7px;background:rgba(4,13,20,.34); }
.social-fishing-species > span { grid-row:1 / 3;width:25px;height:25px;display:grid;place-items:center;color:#66CBDF; }
.social-fishing-species > span svg { max-width:23px;max-height:23px; }
.social-fishing-species small,.social-fishing-species strong { display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.social-fishing-species small { color:#8AA3B1;font-size:9.5px; }
.social-fishing-species strong { color:#BFEAF0;font-size:9.5px; }
.social-hall > .social-actions { padding:0 15px 15px; }
.social-filter-row { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-bottom:10px; }
.social-filter-row select,.social-inline-form input { min-height:38px;padding:8px 10px;border:1px solid rgba(143,118,232,.3);border-radius:7px;background:#0E131E;color:#E2E6EF;font-size:9.5px; }
.leaderboard-mastery-nav { position:relative;isolation:isolate;display:grid;gap:10px;margin:0 0 11px;padding:11px;overflow:hidden;border:1px solid color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 28%,rgba(138,151,180,.18));border-radius:11px;background:radial-gradient(circle at 5% 0,color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 11%,transparent),transparent 35%),linear-gradient(145deg,rgba(15,20,31,.96),rgba(8,12,20,.92));box-shadow:inset 0 1px rgba(255,255,255,.025); }
.leaderboard-mastery-nav::after { content:"";position:absolute;z-index:-1;right:-70px;top:-90px;width:190px;height:190px;border:1px solid color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 12%,transparent);border-radius:50%;box-shadow:0 0 0 28px color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 3%,transparent),0 0 0 58px color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 2%,transparent);pointer-events:none; }
.leaderboard-mastery-heading { display:grid;grid-template-columns:38px 1fr;gap:9px;align-items:center;padding-bottom:9px;border-bottom:1px solid rgba(138,151,180,.13); }
.leaderboard-mastery-mark { width:36px;height:36px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 52%,transparent);border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 20%,#111722),#0C111A 72%);box-shadow:0 0 15px color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 16%,transparent);color:color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 76%,white);font-size:17px; }
.leaderboard-mastery-heading strong,.leaderboard-mastery-heading span { display:block; }
.leaderboard-mastery-heading strong { color:#EEE8FA;font-family:var(--font-display,Cinzel,serif);font-size:12px;letter-spacing:.025em; }
.leaderboard-mastery-heading div > span { margin-top:2px;color:#9EA9BA;font-size:9.5px;line-height:1.35; }
.leaderboard-category-group { display:grid;gap:6px;min-width:0; }
.leaderboard-category-group > header { display:flex;align-items:end;justify-content:space-between;gap:10px; }
.leaderboard-category-group > header h4 { margin:0;color:#D8DDE8;font-family:var(--font-display,Cinzel,serif);font-size:10px;letter-spacing:.035em; }
.leaderboard-category-group > header span,.leaderboard-category-group > header small { color:#8793A6;font-size:9.5px;line-height:1.3; }
.leaderboard-category-group > header span { display:block;margin-top:1px; }
.leaderboard-category-group > header small { white-space:nowrap; }
.leaderboard-category-grid { display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px; }
.leaderboard-category-group.is-overall .leaderboard-category-grid,.leaderboard-category-group.is-records .leaderboard-category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.leaderboard-category-seal { --category-accent:#A98CF2;position:relative;min-width:0;min-height:68px;display:grid;place-items:center;align-content:center;gap:4px;padding:7px 5px;border:1px solid color-mix(in srgb,var(--category-accent) 24%,rgba(138,151,180,.16));border-radius:8px;background:radial-gradient(circle at 50% 27%,color-mix(in srgb,var(--category-accent) 10%,transparent),transparent 49%),rgba(8,13,21,.7);color:#9CA7B7;cursor:pointer;text-align:center;transition:border-color .18s ease,background .18s ease,box-shadow .18s ease,transform .18s ease; }
.leaderboard-category-seal:hover,.leaderboard-category-seal:focus-visible { border-color:color-mix(in srgb,var(--category-accent) 65%,white);background:radial-gradient(circle at 50% 27%,color-mix(in srgb,var(--category-accent) 18%,transparent),transparent 52%),rgba(11,17,27,.9);box-shadow:0 0 13px color-mix(in srgb,var(--category-accent) 14%,transparent);outline:none;transform:translateY(-1px); }
.leaderboard-category-seal.selected { border-color:color-mix(in srgb,var(--category-accent) 76%,white);background:radial-gradient(circle at 50% 22%,color-mix(in srgb,var(--category-accent) 25%,transparent),transparent 55%),linear-gradient(150deg,color-mix(in srgb,var(--category-accent) 9%,#121927),#0A1019);box-shadow:0 0 15px color-mix(in srgb,var(--category-accent) 18%,transparent),inset 0 -2px color-mix(in srgb,var(--category-accent) 70%,white);color:#ECF1F7; }
.leaderboard-category-icon { width:29px;height:29px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--category-accent) 46%,transparent);border-radius:50%;background:color-mix(in srgb,var(--category-accent) 9%,#0B111A);color:var(--category-accent);box-shadow:inset 0 0 8px color-mix(in srgb,var(--category-accent) 7%,transparent); }
.leaderboard-category-seal.selected .leaderboard-category-icon { box-shadow:0 0 10px color-mix(in srgb,var(--category-accent) 30%,transparent),inset 0 0 9px color-mix(in srgb,var(--category-accent) 12%,transparent);color:color-mix(in srgb,var(--category-accent) 78%,white); }
.leaderboard-category-icon svg { width:19px;height:19px;display:block; }
.leaderboard-category-label { width:100%;overflow:hidden;color:inherit;font-size:9.5px;font-weight:800;line-height:1.15;text-overflow:ellipsis;white-space:nowrap; }
.leaderboard-category-selected { position:absolute;right:4px;top:4px;width:6px;height:6px;overflow:hidden;border-radius:50%;background:color-mix(in srgb,var(--category-accent) 76%,white);box-shadow:0 0 7px var(--category-accent);color:transparent; }
.leaderboard-category-group.is-overall .leaderboard-category-seal,.leaderboard-category-group.is-records .leaderboard-category-seal { min-height:54px;grid-template-columns:34px minmax(0,1fr);justify-items:start;align-content:center;padding:7px 9px;text-align:left; }
.leaderboard-category-group.is-overall .leaderboard-category-label,.leaderboard-category-group.is-records .leaderboard-category-label { font-family:var(--font-display,Cinzel,serif);font-size:10px; }
.leaderboard-category-banner { position:relative;isolation:isolate;display:grid;grid-template-columns:50px minmax(0,1fr) auto;gap:11px;align-items:center;min-height:76px;margin:0 0 8px;padding:11px 13px;overflow:hidden;border:1px solid color-mix(in srgb,var(--category-accent) 45%,rgba(138,151,180,.18));border-radius:10px;background:radial-gradient(circle at 8% 50%,color-mix(in srgb,var(--category-accent) 18%,transparent),transparent 32%),linear-gradient(105deg,color-mix(in srgb,var(--category-accent) 8%,#111A25),#0C121C 64%);box-shadow:inset 3px 0 color-mix(in srgb,var(--category-accent) 64%,white),inset 0 0 22px color-mix(in srgb,var(--category-accent) 4%,transparent);animation:leaderboardCategoryArrive .28s ease-out both; }
.leaderboard-category-banner::after { content:"";position:absolute;z-index:-1;right:43px;top:-44px;width:120px;height:120px;border:1px solid color-mix(in srgb,var(--category-accent) 14%,transparent);border-radius:50%;box-shadow:0 0 0 18px color-mix(in srgb,var(--category-accent) 3%,transparent); }
.leaderboard-category-banner-icon { width:46px;height:46px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--category-accent) 58%,transparent);border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--category-accent) 18%,#111722),#0A1019 74%);color:color-mix(in srgb,var(--category-accent) 80%,white);box-shadow:0 0 16px color-mix(in srgb,var(--category-accent) 24%,transparent),inset 0 0 11px color-mix(in srgb,var(--category-accent) 8%,transparent); }
.leaderboard-category-banner-icon svg { width:27px;height:27px; }
.leaderboard-category-banner small,.leaderboard-category-banner h3,.leaderboard-category-banner p { display:block;margin:0; }
.leaderboard-category-banner small { color:color-mix(in srgb,var(--category-accent) 62%,white);font-size:9.5px;font-weight:800;letter-spacing:.085em;text-transform:uppercase; }
.leaderboard-category-banner h3 { margin-top:2px;color:#F0ECF7;font-family:var(--font-display,Cinzel,serif);font-size:14px;letter-spacing:.015em; }
.leaderboard-category-banner p { margin-top:3px;color:#A5B0C0;font-size:9.5px;line-height:1.35; }
.leaderboard-category-crown { padding:0 8px;color:color-mix(in srgb,var(--category-accent) 60%,#F2D17A);font-size:29px;opacity:.48;filter:drop-shadow(0 0 8px color-mix(in srgb,var(--category-accent) 27%,transparent)); }
.leaderboard-rank-loading { min-height:126px;display:grid;grid-template-columns:42px minmax(0,1fr);gap:11px;place-content:center;align-items:center;padding:22px;border:1px dashed color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 30%,rgba(138,151,180,.18));border-radius:9px;background:color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 3%,rgba(8,12,20,.56)); }
.leaderboard-rank-loading i { width:38px;height:38px;border:1px solid color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 48%,transparent);border-radius:50%;background:conic-gradient(transparent,color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 72%,white),transparent);animation:socialEmblemTurn 2.4s linear infinite; }
.leaderboard-rank-loading strong,.leaderboard-rank-loading span { display:block; }
.leaderboard-rank-loading strong { color:#DFE4ED;font-family:var(--font-display,Cinzel,serif);font-size:11px; }
.leaderboard-rank-loading span { margin-top:4px;color:#94A0B3;font-size:9.5px; }
@keyframes leaderboardCategoryArrive { from { opacity:.35;transform:translateY(3px); } to { opacity:1;transform:none; } }
.social-rank-summary { margin-bottom:8px;padding:9px 11px;border:1px solid rgba(120,216,232,.2);border-radius:7px;background:rgba(14,39,49,.18);color:#AEBAC8;font-size:9.5px; }
.social-rank-summary strong { color:#BBEDF3; }
.social-rank-summary.unpublished { display:flex;align-items:center;justify-content:space-between;gap:14px;border-color:rgba(220,183,89,.32);background:linear-gradient(100deg,rgba(71,52,20,.24),rgba(28,24,51,.2)); }
.social-rank-summary.unpublished strong,.social-rank-summary.unpublished span { display:block; }
.social-rank-summary.unpublished strong { color:#F0D58D;font-family:var(--font-display,Cinzel,serif);font-size:10.5px; }
.social-rank-summary.unpublished span { margin-top:3px;color:#B6AD95;line-height:1.45; }
.leaderboard-list-heading { display:flex;align-items:end;justify-content:space-between;gap:10px;margin:11px 0 7px;padding:0 2px; }
.leaderboard-list-heading strong,.leaderboard-list-heading span { display:block; }
.leaderboard-list-heading strong { color:#E0E4EC;font-family:var(--font-display,Cinzel,serif);font-size:10.5px; }
.leaderboard-list-heading span,.leaderboard-list-heading small { margin-top:2px;color:#8D99AB;font-size:9.5px; }
.leaderboard-list-heading small { white-space:nowrap; }
.social-leaderboard { display:grid;gap:5px; }
.social-leaderboard-layout { display:grid;grid-template-columns:minmax(360px,.82fr) minmax(520px,1.18fr);gap:12px;align-items:start; }
.social-leaderboard-preview { position:sticky;top:10px;min-width:0; }
.social-leaderboard-preview > .social-panel-body { padding:10px; }
.social-preview-close { padding:6px 10px;border:1px solid rgba(165,138,240,.34);border-radius:6px;background:rgba(65,47,103,.24);color:#D8CAFA;font-size:9.5px;cursor:pointer; }
.social-leaderboard-empty { min-height:300px;display:grid;place-items:center;align-content:center;padding:28px;text-align:center;color:#9CA7B8; }
.social-leaderboard-empty-mark { width:58px;height:58px;display:grid;place-items:center;margin-bottom:10px;border:1px solid rgba(165,138,240,.32);border-radius:50%;background:radial-gradient(circle,rgba(165,138,240,.14),transparent 68%);color:#C7B4F7;font-size:22px; }
.social-leaderboard-empty strong { color:#E3DDF1;font-family:var(--font-display,Cinzel,serif);font-size:13px; }
.social-leaderboard-empty p { max-width:350px;margin:6px 0 0;font-size:9.5px;line-height:1.55; }
.social-rank.selected { border-color:rgba(120,216,232,.62);box-shadow:inset 3px 0 0 rgba(120,216,232,.72); }
.social-hall.compact .social-hall-head { grid-template-columns:52px 1fr auto;padding:12px; }
.social-hall.compact .social-hall-head .social-avatar { width:50px;height:50px; }
.social-hall.compact .social-hall-summary { padding:8px 12px; }
.social-hall.compact .social-hall-skill-grid { grid-template-columns:repeat(3,minmax(0,1fr));padding:4px 12px 12px; }
.social-hall.compact .social-hall-showcase { margin:0 12px 12px; }
.social-hall.compact .social-showcase-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.social-rank { width:100%;display:grid;grid-template-columns:45px 34px minmax(0,1fr) auto;gap:9px;align-items:center;padding:9px 11px;border:1px solid rgba(138,151,180,.17);border-radius:8px;background:rgba(12,17,27,.7);color:#C6CDDA;text-align:left;cursor:pointer;transition:border-color .18s ease,background .18s ease,box-shadow .18s ease,transform .18s ease; }
.social-rank:hover,.social-rank.me { border-color:color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 54%,rgba(165,138,240,.54));background:linear-gradient(90deg,color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 12%,rgba(38,28,66,.62)),rgba(12,17,27,.76)); }
.social-rank:not(:disabled):hover { transform:translateX(2px); }
.social-rank-position { color:#BCA9F3;font-size:11px;font-weight:900; }
.social-rank-player { min-width:0; }
.social-rank-player strong,.social-rank-player small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.social-rank-player strong { color:#E5E8EF;font-size:10px; }
.social-rank-player small { margin-top:2px;color:#8F9AAF;font-size:9.5px; }
.social-rank-player .social-rank-honour { color:var(--medal-light,#C6B0F6);font-family:var(--font-display,Cinzel,serif);font-weight:800;letter-spacing:.045em; }
.social-rank em { color:color-mix(in srgb,var(--leaderboard-accent,#78D8E8) 65%,white);font-style:normal;font-size:11px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap; }
.social-rank.podium { --medal:#D9C278;--medal-light:#F6E6A7;position:relative;isolation:isolate;grid-template-columns:54px 40px minmax(0,1fr) auto;min-height:74px;padding:10px 12px;overflow:hidden;border-color:color-mix(in srgb,var(--medal) 48%,rgba(138,151,180,.2));background:radial-gradient(circle at 4% 50%,color-mix(in srgb,var(--medal) 17%,transparent),transparent 25%),linear-gradient(100deg,color-mix(in srgb,var(--medal) 8%,#141923),rgba(8,13,21,.88));box-shadow:inset 3px 0 color-mix(in srgb,var(--medal) 70%,white),inset 0 0 20px color-mix(in srgb,var(--medal) 4%,transparent); }
.social-rank.podium::after { content:"";position:absolute;z-index:-1;right:-20px;top:-46px;width:112px;height:112px;border:1px solid color-mix(in srgb,var(--medal) 10%,transparent);border-radius:50%;box-shadow:0 0 0 15px color-mix(in srgb,var(--medal) 2%,transparent); }
.social-rank.place-gold { --medal:#E6C456;--medal-light:#FFF0A9;min-height:82px;border-color:rgba(230,196,86,.66);background:radial-gradient(circle at 5% 48%,rgba(230,196,86,.23),transparent 27%),radial-gradient(circle at 78% 0%,rgba(255,234,157,.08),transparent 34%),linear-gradient(102deg,#282313,#171A21 43%,#0D131D);box-shadow:inset 3px 0 #F1D575,inset 0 0 28px rgba(230,196,86,.07),0 0 15px rgba(230,196,86,.09); }
.social-rank.place-silver { --medal:#B8C5D4;--medal-light:#E6F0FA; }
.social-rank.place-bronze { --medal:#BE7A50;--medal-light:#EDB58D; }
.social-rank-seal { position:relative;width:50px;height:50px;display:grid;place-items:center;color:var(--medal);filter:drop-shadow(0 0 7px color-mix(in srgb,var(--medal) 32%,transparent)); }
.social-rank-seal::before { content:"";position:absolute;inset:8px;border:1px solid color-mix(in srgb,var(--medal) 72%,white);border-radius:50%;background:radial-gradient(circle at 36% 30%,color-mix(in srgb,var(--medal-light) 45%,transparent),color-mix(in srgb,var(--medal) 16%,#10151D) 62%,#0B1018);box-shadow:inset 0 0 8px color-mix(in srgb,var(--medal) 22%,transparent),0 0 0 2px color-mix(in srgb,var(--medal) 8%,transparent); }
.social-rank-seal svg { position:absolute;inset:0;width:100%;height:100%;stroke:currentColor; }
.social-rank-seal strong { position:relative;z-index:2;color:var(--medal-light);font-family:var(--font-display,Cinzel,serif);font-size:14px;text-shadow:0 0 7px color-mix(in srgb,var(--medal) 52%,transparent); }
.social-avatar--podium { --avatar-size:40px; }
.social-rank:disabled { cursor:default; }
.social-mini-avatar { width:32px;height:32px;display:grid;place-items:center;border:1px solid rgba(165,138,240,.32);border-radius:50%;background:radial-gradient(circle,rgba(165,138,240,.18),rgba(10,14,22,.9));color:#D7CAFF;font-family:var(--font-display,Cinzel,serif);font-size:11px; }
.social-inline-form { display:grid;grid-template-columns:1fr auto;gap:8px; }
.social-friend-code-grid { display:grid;grid-template-columns:minmax(260px,.8fr) minmax(320px,1.2fr);gap:12px; }
.social-own-friend-code,.social-add-friend { min-height:132px;padding:14px;border:1px solid rgba(138,151,180,.17);border-radius:9px;background:rgba(8,12,20,.38); }
.social-own-friend-code { display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:12px;border-color:rgba(120,216,232,.26);background:radial-gradient(circle at 8% 0,rgba(120,216,232,.11),transparent 48%),rgba(8,17,24,.48); }
.social-own-friend-code > span { color:#9CB0C0;font-size:9.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase; }
.social-own-friend-code > strong { grid-column:1 / -1;color:#BDF1F6;font-family:var(--font-display,Cinzel,serif);font-size:17px;letter-spacing:.1em;user-select:all; }
.social-own-friend-code > small { color:#9AA8B8;font-size:9.5px;line-height:1.45; }
.social-own-friend-code > .social-button { justify-self:end; }
.social-add-friend { display:grid;align-content:center;gap:6px; }
.social-add-friend > label { color:#EAE3FA;font-family:var(--font-display,Cinzel,serif);font-size:11px;font-weight:800; }
.social-add-friend > p { margin:0 0 3px;color:#9AA6B8;font-size:9.5px; }
.social-friend { display:grid;grid-template-columns:38px 1fr auto;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid rgba(138,151,180,.12); }
.social-friend:last-child { border-bottom:0; }
.social-friend > div:nth-child(2) strong,.social-friend > div:nth-child(2) span { display:block; }
.social-friend > div:nth-child(2) strong { color:#E2E6EF;font-size:10px; }
.social-friend > div:nth-child(2) span { margin-top:2px;color:#96A2B5;font-size:9.5px; }
.social-friend-actions { display:flex;align-items:center;gap:5px; }
.social-button.gift { border-color:rgba(220,183,89,.42);background:rgba(74,55,20,.28);color:#F2D58B; }
.social-button.companion { display:inline-flex;align-items:center;gap:5px;border-color:rgba(181,140,255,.48);background:linear-gradient(135deg,rgba(116,75,174,.22),rgba(70,50,113,.16));color:#DDC9FF; }
.social-button.companion svg { width:14px;height:14px;filter:drop-shadow(0 0 5px rgba(181,140,255,.38)); }
.social-icon-button,.social-close { border:1px solid rgba(220,89,105,.3);border-radius:6px;background:rgba(70,23,31,.26);color:#E9A7B1;cursor:pointer; }
.social-icon-button { width:32px;height:32px;font-size:16px; }
.social-modal-card { position:relative;margin-top:12px; }
.social-close { position:absolute;z-index:2;top:10px;right:10px;padding:6px 9px;font-size:9.5px; }
.social-modal-card .social-hall-head { padding-right:92px; }
.social-loading { min-height:170px;display:grid;place-items:center;align-content:center;gap:10px;margin-top:12px;border:1px dashed rgba(165,138,240,.24);border-radius:10px;color:#B9C2D1;font-size:10px; }
.social-loading i { width:36px;height:36px;border:1px solid rgba(165,138,240,.45);border-radius:50%;background:conic-gradient(transparent,rgba(165,138,240,.7),transparent);animation:socialEmblemTurn 3s linear infinite; }
.gift-vault .social-panel-body { text-align:center; }
.gift-vault h3 { margin:9px 0 4px;color:#F0D58D;font-family:var(--font-display,Cinzel,serif);font-size:14px; }
.gift-vault p { color:#A9B2C2;font-size:9.5px;line-height:1.55; }
.gift-orb { width:94px;height:94px;display:grid;place-items:center;align-content:center;margin:0 auto;border:1px solid rgba(220,183,89,.48);border-radius:50%;background:radial-gradient(circle,rgba(242,211,129,.22),rgba(77,56,20,.18) 45%,transparent 68%);box-shadow:0 0 28px rgba(220,183,89,.15); }
.gift-orb strong,.gift-orb span { display:block; }
.gift-orb strong { color:#FFE39A;font-family:var(--font-display,Cinzel,serif);font-size:24px; }
.gift-orb span { color:#C8B47D;font-size:9.5px; }
.gift-cap { height:7px;margin:12px 0 5px;overflow:hidden;border:1px solid rgba(138,151,180,.19);border-radius:999px;background:#090D15; }
.gift-cap span { display:block;height:100%;background:linear-gradient(90deg,#8D70D5,#E0B95D); }
.gift-vault small { display:block;margin-bottom:12px;color:#97A3B6;font-size:9.5px; }
.gift-today .social-panel-body { display:grid;gap:14px; }
.gift-today-intro { display:grid;grid-template-columns:56px 1fr;gap:12px;align-items:center;padding:12px;border:1px solid rgba(165,138,240,.19);border-radius:9px;background:linear-gradient(110deg,rgba(85,62,143,.18),rgba(9,14,23,.28)); }
.gift-day-emblem { width:54px;height:54px;display:grid;place-items:center;border:1px solid rgba(220,183,89,.4);border-radius:50%;background:radial-gradient(circle,rgba(235,203,113,.19),rgba(65,47,18,.12) 58%,transparent 60%);box-shadow:0 0 20px rgba(220,183,89,.1);color:#F1D58C;font-size:22px; }
.gift-today-intro h3 { margin:0;color:#EEE7FF;font-family:var(--font-display,Cinzel,serif);font-size:13px; }
.gift-today-intro p { margin:5px 0 0;color:#ABB4C4;font-size:9.5px;line-height:1.55; }
.gift-today-stats { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px; }
.gift-today-stat { position:relative;overflow:hidden;min-height:84px;padding:12px;border:1px solid rgba(138,151,180,.19);border-radius:9px;background:linear-gradient(145deg,rgba(19,25,38,.88),rgba(8,12,20,.72)); }
.gift-today-stat::after { content:"";position:absolute;right:-18px;bottom:-28px;width:62px;height:62px;border:1px solid rgba(165,138,240,.12);border-radius:50%; }
.gift-today-stat strong,.gift-today-stat span,.gift-today-stat small { position:relative;z-index:1;display:block; }
.gift-today-stat strong { color:#F4DE9F;font-family:var(--font-display,Cinzel,serif);font-size:18px; }
.gift-today-stat span { margin-top:4px;color:#D8DDE8;font-size:9.5px;font-weight:800;letter-spacing:.045em;text-transform:uppercase; }
.gift-today-stat small { margin-top:3px;color:#8F9AAF;font-size:9.5px; }
.gift-today-action { display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:12px;border-top:1px solid rgba(138,151,180,.14); }
.gift-today-action > span { color:#A7B1C1;font-size:9.5px;line-height:1.45; }

/* Friends-page gift exchange */
.gift-reserve-compact { position:relative;display:grid;grid-template-columns:82px minmax(0,1fr);gap:15px;align-items:center;min-height:126px;padding:15px;overflow:hidden;border-color:rgba(205,174,93,.35);background:radial-gradient(circle at 8% 50%,rgba(154,112,225,.15),transparent 31%),linear-gradient(118deg,rgba(21,20,35,.96),rgba(24,28,37,.9) 55%,rgba(54,42,19,.38)); }
.gift-reserve-compact::before { content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 20%,rgba(242,210,126,.045) 47%,transparent 72%);pointer-events:none; }
.gift-reserve-emblem { position:relative;width:72px;height:72px;display:grid;place-items:center;border:1px solid rgba(217,185,99,.42);border-radius:50%;background:radial-gradient(circle,rgba(220,187,101,.17),rgba(76,53,23,.12) 48%,rgba(17,15,27,.55) 70%);box-shadow:inset 0 0 22px rgba(164,119,231,.12),0 0 24px rgba(214,176,82,.08);color:#E8CC80; }
.gift-reserve-emblem::before,.gift-reserve-emblem::after { content:"";position:absolute;border:1px solid rgba(181,145,232,.22);border-radius:50%;inset:7px; }
.gift-reserve-emblem::after { inset:-6px;border-color:rgba(216,184,98,.13);border-style:dashed; }
.gift-reserve-emblem svg { position:relative;z-index:2;width:32px;height:32px;filter:drop-shadow(0 0 7px rgba(229,196,105,.3)); }
.gift-reserve-emblem > i { position:absolute;z-index:1;width:8px;height:8px;border-radius:50%;background:#F4DB94;box-shadow:0 0 12px rgba(244,219,148,.8);opacity:.46; }
.gift-reserve-copy { position:relative;z-index:1;min-width:0; }
.gift-reserve-heading { display:flex;align-items:flex-start;justify-content:space-between;gap:12px; }
.gift-reserve-heading small { display:block;color:#B79AE7;font-size:9.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase; }
.gift-reserve-heading h2 { margin:2px 0 0;color:#F2E8CF;font-family:var(--font-display,Cinzel,serif);font-size:14px; }
.gift-reserve-heading > span { flex:0 0 auto;padding:4px 7px;border:1px solid rgba(134,151,178,.2);border-radius:999px;background:rgba(8,12,19,.44);color:#AAB5C7;font-size:9.5px;white-space:nowrap; }
.gift-reserve-reading { display:flex;align-items:baseline;gap:8px;margin-top:8px; }
.gift-reserve-reading strong { color:#FFE39A;font-family:var(--font-display,Cinzel,serif);font-size:20px;letter-spacing:.025em; }
.gift-reserve-reading span { color:#CBD1DC;font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.065em; }
.gift-reserve-progress { position:relative;height:8px;margin-top:5px;overflow:hidden;border:1px solid rgba(151,158,181,.23);border-radius:999px;background:rgba(5,8,14,.76);box-shadow:inset 0 1px 3px rgba(0,0,0,.55); }
.gift-reserve-progress > i { display:block;width:var(--gift-progress);height:100%;border-radius:inherit;background:linear-gradient(90deg,#8F6ED2 0%,#B18BDD 42%,#DFC05E 78%,#F0D888 100%);box-shadow:0 0 12px rgba(213,177,84,.32); }
.gift-reserve-copy > p { margin:7px 0 0;color:#9DA9BA;font-size:9.5px;line-height:1.45; }
.gift-reserve-compact.is-complete { border-color:rgba(226,194,105,.51);box-shadow:inset 0 0 30px rgba(202,162,65,.045); }
.gift-reserve-credit .gift-reserve-emblem { animation:giftReserveSealCredit 1s ease-out both; }
.gift-reserve-credit .gift-reserve-emblem::after { animation:giftReserveRingCredit 1s ease-out both; }
.gift-reserve-credit .gift-reserve-reading strong { animation:giftReserveNumberCredit .75s .12s ease-out both; }
.gift-reserve-credit .gift-reserve-progress > i { animation:giftReserveFillCredit .72s .15s ease-out both; }

.social-fellowship-list .social-panel-body { display:grid;gap:7px; }
.social-friend--exchange { position:relative;isolation:isolate;grid-template-columns:42px minmax(180px,1fr) minmax(310px,auto);gap:11px;min-height:86px;padding:10px;border:1px solid rgba(137,150,177,.15);border-radius:9px;background:linear-gradient(115deg,rgba(14,20,30,.76),rgba(8,12,19,.54));transition:border-color .15s ease,background .15s ease,box-shadow .15s ease; }
.social-friend--exchange:last-child { border-bottom:1px solid rgba(137,150,177,.15); }
.social-friend--exchange::before { content:"";position:absolute;z-index:-1;left:0;top:10px;bottom:10px;width:2px;border-radius:0 2px 2px 0;background:rgba(142,157,183,.3); }
.social-friend--exchange.state-incoming { border-color:rgba(220,183,89,.42);background:radial-gradient(circle at 88% 28%,rgba(222,181,76,.095),transparent 27%),linear-gradient(115deg,rgba(18,22,31,.86),rgba(39,30,14,.34));box-shadow:inset 0 0 20px rgba(218,179,79,.025); }
.social-friend--exchange.state-incoming::before { background:#E0BC5D;box-shadow:0 0 9px rgba(224,188,93,.46); }
.social-friend--exchange.state-outgoing { border-color:rgba(92,170,183,.26);background:linear-gradient(115deg,rgba(9,26,31,.48),rgba(10,14,22,.67)); }
.social-friend--exchange.state-outgoing::before { background:#62AEB7; }
.social-friend--exchange:focus-visible { outline:1px solid #D6C0F4;outline-offset:2px; }
.social-friend-identity { min-width:0; }
.social-friend--exchange .social-friend-identity > strong { color:#E9E5EF;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.social-friend--exchange .social-friend-identity > span { color:#8997AA;font-size:9.5px; }
.social-gift-history { display:flex;align-items:center;gap:6px;margin-top:7px;color:#AAA0C0;font-size:9.5px; }
.social-friend--exchange .social-gift-history > span { display:inline-flex;align-items:center;gap:3px;margin:0;padding:3px 6px;border:1px solid rgba(168,139,231,.17);border-radius:999px;background:rgba(84,59,130,.12);color:#AAA0C0; }
.social-gift-history i { color:#C0A8EE;font-style:normal; }
.social-gift-history b { color:#DCD1F0;font-variant-numeric:tabular-nums; }
.social-gift-history em { color:#C4A85F;font-size:8px;font-style:normal;opacity:.75; }
.social-gift-state { display:block;margin-top:6px;color:#9DA8B9;font-size:9.5px;line-height:1.35; }
.state-incoming .social-gift-state { color:#D8C58F; }
.state-outgoing .social-gift-state { color:#8FB8C1; }
.social-friend--exchange .social-friend-actions { min-width:0;display:grid;grid-template-rows:auto auto;justify-items:end;gap:6px; }
.social-gift-actions,.social-friend-utilities { display:flex;align-items:center;justify-content:flex-end;gap:5px; }
.social-friend--exchange .social-button { min-height:34px;white-space:nowrap; }
.social-button.gift.claim { border-color:rgba(232,198,105,.62);background:linear-gradient(135deg,rgba(115,81,23,.58),rgba(72,47,14,.38));box-shadow:inset 0 0 12px rgba(244,212,119,.07);color:#FFE19A; }
.social-button.gift.claim:hover:not(:disabled),.social-button.gift.claim:focus-visible { border-color:#F0D17D;background:linear-gradient(135deg,rgba(139,98,27,.68),rgba(87,56,15,.48));box-shadow:0 0 12px rgba(223,184,81,.13); }
.social-button.gift.send { border-color:rgba(175,142,229,.4);background:linear-gradient(135deg,rgba(85,60,130,.26),rgba(39,31,67,.22));color:#D9C5F6; }
.social-button.gift:disabled { border-color:rgba(126,139,160,.17);background:rgba(35,42,53,.24);box-shadow:none;color:#778394; }
.social-gift-claim-fx { position:absolute;z-index:8;inset:0;display:grid;place-items:center;overflow:hidden;border-radius:inherit;pointer-events:none;animation:giftClaimVeil 1.35s ease-out both; }
.social-gift-open-seal { position:relative;width:56px;height:56px;display:grid;place-items:center;border:1px solid rgba(240,207,116,.6);border-radius:50%;background:radial-gradient(circle,rgba(237,200,99,.3),rgba(77,48,114,.38) 55%,rgba(20,14,31,.85));box-shadow:0 0 28px rgba(222,180,79,.35);color:#FFE09A;animation:giftSealOpen 1.1s cubic-bezier(.2,.76,.24,1) both; }
.social-gift-open-seal svg { width:27px;height:27px; }
.social-gift-open-seal > i,.social-gift-open-seal > b { position:absolute;inset:-1px;border:1px solid rgba(238,202,105,.62);border-radius:50%;animation:giftClaimRing 1s .16s ease-out both; }
.social-gift-open-seal > b { animation-delay:.3s; }
.social-gift-claim-fx > strong { position:absolute;left:calc(50% + 38px);color:#FFE29B;font-family:var(--font-display,Cinzel,serif);font-size:15px;text-shadow:0 0 12px rgba(225,183,78,.55);animation:giftValueCredit 1.25s .16s ease-out both; }
.social-gift-sparks { position:absolute;left:50%;top:50%; }
.social-gift-sparks i { position:absolute;width:3px;height:3px;border-radius:50%;background:#F3D06F;box-shadow:0 0 7px rgba(243,208,111,.9);animation:giftSpark 1s .18s ease-out both; }
.social-gift-sparks i:nth-child(1){--spark-x:-58px;--spark-y:-20px}.social-gift-sparks i:nth-child(2){--spark-x:-35px;--spark-y:37px}.social-gift-sparks i:nth-child(3){--spark-x:8px;--spark-y:-47px}.social-gift-sparks i:nth-child(4){--spark-x:47px;--spark-y:-25px}.social-gift-sparks i:nth-child(5){--spark-x:58px;--spark-y:25px}.social-gift-sparks i:nth-child(6){--spark-x:17px;--spark-y:45px}.social-gift-sparks i:nth-child(7){--spark-x:-52px;--spark-y:12px}
.social-orphaned-gifts .social-panel-body { display:grid;gap:7px; }
.social-orphaned-gifts .social-panel-body > p { margin:0 0 3px;color:#929EB0;font-size:9.5px;line-height:1.45; }
.social-orphaned-gift { display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:9px;padding:9px;border:1px solid rgba(176,143,230,.2);border-radius:8px;background:rgba(31,23,48,.22); }
.social-orphaned-gift:focus-visible { outline:1px solid #C7B1EE;outline-offset:2px; }
.social-orphaned-seal { width:36px;height:36px;display:grid;place-items:center;border:1px solid rgba(208,177,94,.35);border-radius:50%;color:#DABC69;background:rgba(89,61,23,.18); }
.social-orphaned-seal svg { width:19px;height:19px; }
.social-orphaned-gift strong,.social-orphaned-gift small { display:block; }
.social-orphaned-gift strong { color:#DCD5E8;font-size:10px; }
.social-orphaned-gift small { margin-top:2px;color:#929DB0;font-size:9.5px; }

@keyframes giftReserveSealCredit { 0% { transform:scale(.88);filter:brightness(.9); } 42% { transform:scale(1.1);filter:brightness(1.35);box-shadow:0 0 34px rgba(224,184,81,.25); } 100% { transform:none;filter:none; } }
@keyframes giftReserveRingCredit { 0% { transform:scale(.7);opacity:0; } 45% { opacity:.7; } 100% { transform:scale(1.28) rotate(24deg);opacity:0; } }
@keyframes giftReserveNumberCredit { 0% { transform:translateY(6px);opacity:.25; } 55% { color:#FFF1BE;text-shadow:0 0 12px rgba(235,199,99,.55); } 100% { transform:none;opacity:1; } }
@keyframes giftReserveFillCredit { from { width:var(--gift-progress-from);filter:brightness(1.45); } to { width:var(--gift-progress);filter:none; } }
@keyframes giftClaimVeil { 0% { opacity:0;background:rgba(38,25,59,0); } 16% { opacity:1;background:rgba(38,25,59,.42); } 76% { opacity:1;background:rgba(38,25,59,.25); } 100% { opacity:0;background:transparent;visibility:hidden; } }
@keyframes giftSealOpen { 0% { opacity:0;transform:scale(.42) rotate(-12deg); } 33% { opacity:1;transform:scale(1.08) rotate(0); } 62% { transform:scale(.98); } 100% { opacity:0;transform:scale(1.08); } }
@keyframes giftClaimRing { 0% { transform:scale(.45);opacity:0; } 35% { opacity:.85; } 100% { transform:scale(2.05);opacity:0; } }
@keyframes giftValueCredit { 0% { opacity:0;transform:translate(-8px,7px); } 32% { opacity:1;transform:translate(0,0); } 74% { opacity:1; } 100% { opacity:0;transform:translate(8px,-8px); } }
@keyframes giftSpark { 0% { opacity:0;transform:translate(0,0) scale(.3); } 28% { opacity:1; } 100% { opacity:0;transform:translate(var(--spark-x),var(--spark-y)) scale(1.2); } }

body.reduced-motion .gift-reserve-credit .gift-reserve-emblem,body.reduced-motion .gift-reserve-credit .gift-reserve-emblem::after,body.reduced-motion .gift-reserve-credit .gift-reserve-reading strong,body.reduced-motion .gift-reserve-credit .gift-reserve-progress > i { animation:none; }
body.reduced-motion .social-gift-claim-fx { animation:giftClaimReduced .7s ease-out both; }
body.reduced-motion .social-gift-open-seal,body.reduced-motion .social-gift-open-seal > i,body.reduced-motion .social-gift-open-seal > b,body.reduced-motion .social-gift-sparks i { animation:none; }
body.reduced-motion .social-gift-sparks { display:none; }
body.reduced-motion .social-gift-claim-fx > strong { animation:giftValueReduced .7s ease-out both; }
body.battery-saver .social-gift-sparks,body.battery-saver .social-gift-open-seal > i,body.battery-saver .social-gift-open-seal > b { display:none; }
body.battery-saver .gift-reserve-emblem,body.battery-saver .social-gift-open-seal { filter:none;box-shadow:none; }
@keyframes giftClaimReduced { 0%,70% { opacity:1;background:rgba(38,25,59,.36); } 100% { opacity:0;visibility:hidden; } }
@keyframes giftValueReduced { 0%,70% { opacity:1; } 100% { opacity:0; } }
body.battery-saver .social-loading i { animation:none; }
body.battery-saver .leaderboard-category-banner,body.battery-saver .leaderboard-rank-loading i { animation:none; }
body.battery-saver .leaderboard-category-seal,body.battery-saver .social-rank { transition:none; }
body.battery-saver .leaderboard-category-seal:hover,body.battery-saver .social-rank:not(:disabled):hover { transform:none; }

.social-sr-only { position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important; }

body.battery-saver .social-loading-emblem { animation:none; }
body.reduced-motion .social-hall-chevron::before,body.reduced-motion .social-hall-showcase > summary > i::before,body.battery-saver .social-hall-chevron::before,body.battery-saver .social-hall-showcase > summary > i::before { transition:none; }

@media (max-width:820px) {
  .social-grid { grid-template-columns:1fr; }
  .social-hero { align-items:flex-start;flex-direction:column; }
  .social-hero-actions { justify-items:start; }
  .social-hero-sync{width:100%;min-width:0}.social-hero-sync small{max-width:none}
  .social-stat-row { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .social-skill-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .social-friend-code-grid { grid-template-columns:1fr; }
  .avatar-builder-layout { grid-template-columns:1fr; }
  .avatar-builder-preview { position:sticky;z-index:14;top:8px;grid-template-columns:auto 1fr;justify-items:start;align-items:center;text-align:left;background:linear-gradient(110deg,rgba(22,27,43,.985),rgba(11,17,28,.985));border-bottom:1px solid rgba(165,138,240,.28);box-shadow:0 12px 24px rgba(0,0,0,.34); }
  .avatar-builder-preview::after { border-radius:14px; }
  .avatar-builder-controls { border-left:0;border-top:1px solid rgba(165,138,240,.16); }
  .avatar-graphic-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .avatar-effect-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .social-leaderboard-layout { grid-template-columns:1fr; }
  .social-leaderboard-preview { position:relative;top:auto; }
  .leaderboard-category-grid { grid-template-columns:repeat(7,minmax(0,1fr)); }
  .social-showcase-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .social-hall-collapsible > summary .social-hall-head { grid-template-columns:50px minmax(0,1fr) auto 20px; }
  .social-fishing-summary { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .social-friend--exchange { grid-template-columns:42px minmax(0,1fr); }
  .social-friend--exchange .social-friend-actions { grid-column:1 / -1;grid-template-columns:1fr auto;grid-template-rows:auto;align-items:center;justify-items:stretch;padding-left:53px; }
}
@media (max-width:520px) {
  .social-hero { padding:18px; }
  .social-hero h1 { font-size:18px; }
  .social-local-profile { grid-template-columns:54px 1fr; }
  .social-avatar { width:54px;height:54px;border-radius:13px;font-size:18px; }
  .social-tabs { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible;gap:6px;padding:6px; }
  .social-tab { min-width:0;min-height:44px;justify-content:flex-start;padding:8px 11px;border:1px solid rgba(138,151,180,.1); }
  .social-tab.active { border-color:rgba(165,138,240,.3); }
  .social-field-row,.social-filter-row { grid-template-columns:1fr; }
  .social-hall-head { grid-template-columns:50px 1fr; }
  .social-hall-total { grid-column:1 / -1;text-align:left; }
  .social-hall-summary,.social-skill-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .social-hall.compact .social-hall-skill-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .social-showcase-grid,.social-hall.compact .social-showcase-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .social-record-grid { grid-template-columns:1fr; }
  .social-friend { grid-template-columns:36px 1fr; }
  .social-friend-actions { grid-column:1 / -1;flex-wrap:wrap; }
  .gift-reserve-compact { grid-template-columns:56px minmax(0,1fr);gap:10px;min-height:118px;padding:12px; }
  .gift-reserve-emblem { width:52px;height:52px; }
  .gift-reserve-emblem svg { width:25px;height:25px; }
  .gift-reserve-heading { gap:7px; }
  .gift-reserve-heading h2 { font-size:13px; }
  .gift-reserve-heading > span { padding:3px 5px; }
  .gift-reserve-reading { margin-top:6px; }
  .gift-reserve-reading strong { font-size:17px; }
  .social-friend--exchange { grid-template-columns:36px minmax(0,1fr);padding:10px 8px; }
  .social-friend--exchange .social-friend-actions { padding-left:0;grid-template-columns:1fr;gap:7px; }
  .social-gift-actions { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%; }
  .social-gift-actions > :only-child { grid-column:1 / -1; }
  .social-gift-actions .social-button { min-width:0;min-height:44px;justify-content:center;white-space:normal; }
  .social-friend-utilities { width:100%;justify-content:flex-start;flex-wrap:wrap; }
  .social-friend-utilities .social-button { min-height:40px; }
  .social-friend-utilities .social-icon-button { min-width:40px;min-height:40px;margin-left:auto; }
  .social-friend-utilities .social-icon-button + .social-icon-button { margin-left:0; }
  .social-orphaned-gift { grid-template-columns:36px minmax(0,1fr); }
  .social-orphaned-gift .social-button { grid-column:1 / -1;min-height:44px; }
  .social-gift-claim-fx > strong { left:calc(50% + 30px);font-size:13px; }
  .social-sync { align-items:flex-start;flex-direction:column; }
  .social-rank-summary.unpublished,.gift-today-action { align-items:flex-start;flex-direction:column; }
  .leaderboard-mastery-nav { padding:9px; }
  .leaderboard-category-group > header small { display:none; }
  .leaderboard-category-grid,.leaderboard-category-group.is-overall .leaderboard-category-grid,.leaderboard-category-group.is-records .leaderboard-category-grid { display:flex;grid-template-columns:none;gap:6px;overflow-x:auto;padding:1px 1px 6px;scroll-padding:1px;scroll-snap-type:x proximity;scrollbar-width:thin; }
  .leaderboard-category-seal { flex:0 0 76px;min-height:68px;scroll-snap-align:start; }
  .leaderboard-category-group.is-overall .leaderboard-category-seal,.leaderboard-category-group.is-records .leaderboard-category-seal { flex-basis:156px;min-height:54px; }
  .leaderboard-category-banner { grid-template-columns:44px minmax(0,1fr);min-height:72px;padding:10px; }
  .leaderboard-category-banner-icon { width:40px;height:40px; }
  .leaderboard-category-banner-icon svg { width:24px;height:24px; }
  .leaderboard-category-crown { display:none; }
  .leaderboard-list-heading { align-items:start; }
  .social-rank,.social-rank.podium { grid-template-columns:50px 38px minmax(0,1fr);min-height:72px;padding:9px; }
  .social-rank-position,.social-rank-seal,.social-rank > .social-avatar-v2 { grid-row:1 / 3; }
  .social-rank-seal { width:48px;height:48px; }
  .social-rank em { grid-column:3;justify-self:start;margin-top:-2px; }
  .gift-today-stats { grid-template-columns:1fr; }
  .social-own-friend-code { grid-template-columns:1fr; }
  .social-own-friend-code > .social-button { justify-self:start; }
  .social-avatar-setting { grid-template-columns:58px 1fr; }
  .social-avatar-setting > .social-button { grid-column:1 / -1; }
  .social-hall-collapsible > summary .social-hall-head { grid-template-columns:46px minmax(0,1fr) auto 19px;gap:8px;padding:11px; }
  .social-hall-collapsible > summary .social-avatar-v2 { --avatar-size:44px; }
  .social-hall-collapsible .social-hall-total { grid-column:auto;text-align:right; }
  .social-hall-collapsible .social-hall-total strong { font-size:15px; }
  .social-hall-collapsible .social-hall-identity > strong { font-size:13px; }
  .social-fishing-achievements { margin-inline:10px;padding:10px; }
  .social-fishing-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .social-fishing-species-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .avatar-builder-preview { grid-template-columns:96px minmax(0,1fr);justify-items:start;gap:10px;padding:12px;text-align:left; }
  .avatar-builder-preview .social-avatar--builder { --avatar-size:92px; }
  .avatar-builder-preview > small { grid-column:1 / -1; }
  .avatar-graphic-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .avatar-colour-controls { grid-template-columns:1fr; }
  .avatar-builder-actions { align-items:stretch;flex-direction:column; }
  .avatar-builder-actions > div { display:grid;grid-template-columns:1fr 1fr; }
}

/* Social Leaderboard Revitalization */
.social-leaderboard-layout { display:block;min-width:0; }
.social-leaderboard-panel { position:relative;overflow:visible; }
.leaderboard-panel-head { min-height:55px;align-items:center; }
.leaderboard-panel-head > div > small,.leaderboard-panel-head > div > h2 { display:block;margin:0; }
.leaderboard-panel-head > div > small { color:#A995D9;font-size:9.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase; }
.leaderboard-panel-head > div > h2 { margin-top:2px;font-size:15px; }
.leaderboard-control-bar { position:relative;z-index:12;display:grid;grid-template-columns:minmax(360px,1fr) minmax(145px,.24fr) minmax(165px,.28fr);gap:9px;align-items:stretch;margin-bottom:11px; }
.leaderboard-selector-shell { position:relative;min-width:0; }
.leaderboard-category-trigger { --category-accent:#A98CF2;width:100%;min-height:67px;display:grid;grid-template-columns:46px minmax(0,1fr) 24px;gap:11px;align-items:center;padding:8px 12px;border:1px solid color-mix(in srgb,var(--category-accent) 46%,rgba(138,151,180,.24));border-radius:10px;background:radial-gradient(circle at 7% 50%,color-mix(in srgb,var(--category-accent) 16%,transparent),transparent 31%),linear-gradient(110deg,color-mix(in srgb,var(--category-accent) 7%,#141925),#0B111B 70%);box-shadow:inset 3px 0 color-mix(in srgb,var(--category-accent) 70%,white),inset 0 0 20px color-mix(in srgb,var(--category-accent) 4%,transparent);color:#E9E5F2;cursor:pointer;text-align:left;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease; }
.leaderboard-category-trigger:hover,.leaderboard-category-trigger:focus-visible,.leaderboard-category-trigger[aria-expanded="true"] { border-color:color-mix(in srgb,var(--category-accent) 76%,white);box-shadow:inset 3px 0 color-mix(in srgb,var(--category-accent) 82%,white),0 0 18px color-mix(in srgb,var(--category-accent) 16%,transparent);outline:none; }
.leaderboard-category-trigger-icon { width:43px;height:43px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--category-accent) 54%,transparent);border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--category-accent) 20%,#111722),#090F18 74%);color:color-mix(in srgb,var(--category-accent) 82%,white);box-shadow:0 0 14px color-mix(in srgb,var(--category-accent) 20%,transparent); }
.leaderboard-category-trigger-icon svg { width:25px;height:25px; }
.leaderboard-category-trigger-copy { min-width:0; }
.leaderboard-category-trigger-copy small,.leaderboard-category-trigger-copy strong,.leaderboard-category-trigger-copy em { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.leaderboard-category-trigger-copy small { color:color-mix(in srgb,var(--category-accent) 62%,white);font-size:9.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase; }
.leaderboard-category-trigger-copy strong { margin-top:2px;color:#F1EDF8;font-family:var(--font-display,Cinzel,serif);font-size:13px; }
.leaderboard-category-trigger-copy em { margin-top:2px;color:#98A5B7;font-size:9.5px;font-style:normal; }
.leaderboard-category-trigger-chevron { position:relative;width:20px;height:20px;border:1px solid color-mix(in srgb,var(--category-accent) 28%,rgba(138,151,180,.2));border-radius:50%;background:rgba(4,8,14,.28); }
.leaderboard-category-trigger-chevron::before { content:"";position:absolute;left:6px;top:5px;width:6px;height:6px;border-right:1.5px solid color-mix(in srgb,var(--category-accent) 72%,white);border-bottom:1.5px solid color-mix(in srgb,var(--category-accent) 72%,white);transform:rotate(45deg);transition:transform .18s ease,top .18s ease; }
.leaderboard-category-trigger[aria-expanded="true"] .leaderboard-category-trigger-chevron::before { top:8px;transform:rotate(225deg); }
.leaderboard-filter { min-width:0;display:grid;align-content:center;gap:5px;padding:8px 10px;border:1px solid rgba(138,151,180,.19);border-radius:10px;background:linear-gradient(145deg,rgba(17,23,35,.9),rgba(8,12,20,.75)); }
.leaderboard-filter > span { color:#8F9BAD;font-size:9.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase; }
.leaderboard-filter > select { width:100%;min-height:34px;padding:6px 27px 6px 8px;border:1px solid rgba(165,138,240,.24);border-radius:6px;background:#0B111B;color:#E0E5EE;font-size:10px;cursor:pointer; }
.leaderboard-filter > select:focus-visible { border-color:#A98CF2;outline:1px solid rgba(169,140,242,.36);outline-offset:1px; }
.leaderboard-selector-layer { position:fixed;z-index:10040;inset:0;isolation:isolate;color:var(--text,#E6E7EB); }
.leaderboard-selector-layer * { box-sizing:border-box; }
.leaderboard-selector-layer button { font-family:inherit;touch-action:manipulation; }
.leaderboard-selector-backdrop { position:absolute;z-index:0;inset:0;background:rgba(2,5,10,.62);backdrop-filter:blur(2px); }
.leaderboard-selector-popover { position:absolute;z-index:900;left:0;top:calc(100% + 8px);width:min(540px,calc(100vw - 105px));max-height:min(620px,72vh);display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden;border:1px solid color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 55%,rgba(138,151,180,.26));border-radius:12px;background:linear-gradient(155deg,#151B29,#090E17 64%);box-shadow:0 24px 68px rgba(0,0,0,.58),inset 0 1px rgba(255,255,255,.035);animation:leaderboardSelectorReveal .2s ease-out both; }
.leaderboard-selector-layer .leaderboard-selector-popover { z-index:1;left:var(--selector-left,16px);top:var(--selector-top,80px);width:min(540px,calc(100vw - 32px));max-height:var(--selector-max-height,min(620px,72vh)); }
.leaderboard-selector-head { display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:14px 15px 12px;border-bottom:1px solid rgba(138,151,180,.16);background:radial-gradient(circle at 0 0,color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 15%,transparent),transparent 48%); }
.leaderboard-selector-head small,.leaderboard-selector-head h3,.leaderboard-selector-head p { display:block;margin:0; }
.leaderboard-selector-head small { color:color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 64%,white);font-size:9.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase; }
.leaderboard-selector-head h3 { margin-top:2px;color:#F0EAFB;font-family:var(--font-display,Cinzel,serif);font-size:14px; }
.leaderboard-selector-head p { margin-top:4px;color:#99A5B6;font-size:9.5px;line-height:1.4; }
.leaderboard-selector-head button { flex:0 0 34px;width:34px;height:34px;border:1px solid rgba(193,170,249,.32);border-radius:50%;background:rgba(49,35,80,.28);color:#E0D3FA;font-size:20px;line-height:1;cursor:pointer; }
.leaderboard-selector-head button:hover,.leaderboard-selector-head button:focus-visible { border-color:#C5B0F5;background:rgba(79,56,126,.42);outline:none;box-shadow:0 0 12px rgba(169,140,242,.18); }
.leaderboard-selector-scroll { min-height:0;display:flex;flex-direction:column;gap:13px;padding:12px;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-color:rgba(169,140,242,.48) rgba(7,11,18,.5); }
.leaderboard-selector-group { display:grid;flex:0 0 auto;gap:6px;min-width:0; }
.leaderboard-selector-group + .leaderboard-selector-group { padding-top:12px;border-top:1px solid rgba(138,151,180,.12); }
.leaderboard-selector-group > header { position:static;display:flex;align-items:end;justify-content:space-between;gap:10px;padding:6px 3px; }
.leaderboard-selector-group > header h4,.leaderboard-selector-group > header span,.leaderboard-selector-group > header small { display:block;margin:0; }
.leaderboard-selector-group > header h4 { color:#DDE2EB;font-family:var(--font-display,Cinzel,serif);font-size:10.5px; }
.leaderboard-selector-group > header span,.leaderboard-selector-group > header small { margin-top:2px;color:#8491A4;font-size:9.5px; }
.leaderboard-category-option { --category-accent:#A98CF2;width:100%;min-height:52px;display:grid;grid-template-columns:38px minmax(0,1fr) 24px;gap:10px;align-items:center;padding:7px 9px;border:1px solid color-mix(in srgb,var(--category-accent) 20%,rgba(138,151,180,.15));border-radius:8px;background:radial-gradient(circle at 4% 50%,color-mix(in srgb,var(--category-accent) 8%,transparent),transparent 25%),rgba(8,13,21,.72);color:#B6BFCC;cursor:pointer;text-align:left;transition:border-color .16s ease,background .16s ease,transform .16s ease; }
.leaderboard-category-option + .leaderboard-category-option { margin-top:5px; }
.leaderboard-category-option:hover,.leaderboard-category-option:focus-visible { border-color:color-mix(in srgb,var(--category-accent) 62%,white);background:radial-gradient(circle at 4% 50%,color-mix(in srgb,var(--category-accent) 16%,transparent),transparent 28%),rgba(13,19,29,.96);outline:none;transform:translateX(2px); }
.leaderboard-category-option.selected { border-color:color-mix(in srgb,var(--category-accent) 72%,white);background:linear-gradient(90deg,color-mix(in srgb,var(--category-accent) 16%,#111722),#0A1019);box-shadow:inset 3px 0 color-mix(in srgb,var(--category-accent) 76%,white); }
.leaderboard-category-option-icon { width:36px;height:36px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--category-accent) 43%,transparent);border-radius:50%;background:color-mix(in srgb,var(--category-accent) 8%,#0A1019);color:var(--category-accent); }
.leaderboard-category-option-icon svg { width:22px;height:22px; }
.leaderboard-category-option-copy { min-width:0; }
.leaderboard-category-option-copy strong,.leaderboard-category-option-copy small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.leaderboard-category-option-copy strong { color:#E6EAF1;font-size:10.5px; }
.leaderboard-category-option-copy small { margin-top:2px;color:#8995A8;font-size:9.5px; }
.leaderboard-category-option-check { color:color-mix(in srgb,var(--category-accent) 72%,white);font-size:15px;text-align:center; }
@keyframes leaderboardSelectorReveal { from { opacity:.4;transform:translateY(-5px) scale(.985); } to { opacity:1;transform:none; } }

.leaderboard-category-banner { min-height:96px;margin-bottom:13px;padding:15px 18px;grid-template-columns:62px minmax(0,1fr) auto;gap:15px;border-radius:12px; }
.leaderboard-category-banner-icon { width:58px;height:58px; }
.leaderboard-category-banner-icon svg { width:34px;height:34px; }
.leaderboard-category-banner small { font-size:9.5px; }
.leaderboard-category-banner h3 { font-size:18px; }
.leaderboard-category-banner p { font-size:10px; }
.leaderboard-category-crown { font-size:40px;opacity:.4; }
.leaderboard-refreshing { position:absolute;right:14px;bottom:9px;color:color-mix(in srgb,var(--category-accent) 60%,white);font-size:9.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;animation:leaderboardRefreshPulse 1.2s ease-in-out infinite; }
@keyframes leaderboardRefreshPulse { 50% { opacity:.45; } }

.leaderboard-podium { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:end;margin:0 0 13px;padding:12px 8px 7px;border:1px solid rgba(138,151,180,.15);border-radius:12px;background:radial-gradient(ellipse at 50% 0,color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 10%,transparent),transparent 53%),linear-gradient(180deg,rgba(14,19,29,.82),rgba(7,11,18,.54)); }
.leaderboard-podium.podium-count-1 { grid-template-columns:minmax(260px,480px);justify-content:center; }
.leaderboard-podium.podium-count-2 { grid-template-columns:repeat(2,minmax(240px,420px));justify-content:center; }
.leaderboard-podium-card { --medal:#D9C278;--medal-light:#F6E6A7;position:relative;isolation:isolate;min-width:0;min-height:190px;display:grid;grid-template-columns:76px minmax(0,1fr);grid-template-rows:auto auto 1fr auto;gap:7px 12px;align-items:center;padding:17px 15px 13px;overflow:hidden;border:1px solid color-mix(in srgb,var(--medal) 50%,rgba(138,151,180,.2));border-radius:11px;background:radial-gradient(circle at 16% 23%,color-mix(in srgb,var(--medal) 18%,transparent),transparent 30%),linear-gradient(150deg,color-mix(in srgb,var(--medal) 8%,#171C26),#0A1019 72%);box-shadow:inset 0 3px color-mix(in srgb,var(--medal) 60%,white),inset 0 0 25px color-mix(in srgb,var(--medal) 5%,transparent);color:#DCE1E9;text-align:left;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease; }
button.leaderboard-podium-card { font:inherit;cursor:pointer; }
.leaderboard-podium-card::after { content:"";position:absolute;z-index:-1;right:-42px;bottom:-62px;width:150px;height:150px;border:1px solid color-mix(in srgb,var(--medal) 12%,transparent);border-radius:50%;box-shadow:0 0 0 21px color-mix(in srgb,var(--medal) 3%,transparent),0 0 0 43px color-mix(in srgb,var(--medal) 2%,transparent); }
.leaderboard-podium-card:hover,.leaderboard-podium-card:focus-visible,.leaderboard-podium-card.selected { border-color:color-mix(in srgb,var(--medal) 82%,white);box-shadow:inset 0 3px color-mix(in srgb,var(--medal) 75%,white),0 0 18px color-mix(in srgb,var(--medal) 16%,transparent);outline:none;transform:translateY(-2px); }
.leaderboard-podium-card.place-gold { --medal:#E6C456;--medal-light:#FFF0A9;min-height:210px;background:radial-gradient(circle at 16% 23%,rgba(255,230,130,.24),transparent 31%),radial-gradient(circle at 85% 0,rgba(255,243,186,.1),transparent 31%),linear-gradient(150deg,#2A2414,#141820 54%,#0A1019);box-shadow:inset 0 3px #F2D775,inset 0 0 34px rgba(230,196,86,.08),0 0 22px rgba(230,196,86,.08); }
.leaderboard-podium-card.place-silver { --medal:#B8C5D4;--medal-light:#EDF5FC; }
.leaderboard-podium-card.place-bronze { --medal:#BE7A50;--medal-light:#F1BD98; }
.leaderboard-podium-card > .social-rank-seal { position:absolute;right:10px;top:9px;width:54px;height:54px; }
.leaderboard-podium-card.place-gold > .social-rank-seal { width:62px;height:62px; }
.social-avatar--champion { --avatar-size:72px;grid-row:1 / 4;align-self:center;box-shadow:0 0 20px color-mix(in srgb,var(--medal) 20%,transparent); }
.leaderboard-podium-card.place-gold .social-avatar--champion { --avatar-size:78px; }
.leaderboard-podium-copy { min-width:0;padding-right:46px; }
.leaderboard-podium-copy small,.leaderboard-podium-copy strong,.leaderboard-podium-copy em { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.leaderboard-podium-copy small { color:var(--medal-light);font-family:var(--font-display,Cinzel,serif);font-size:9.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase; }
.leaderboard-podium-copy strong { margin-top:4px;color:#F1EDF7;font-family:var(--font-display,Cinzel,serif);font-size:13px; }
.leaderboard-podium-copy em { margin-top:3px;color:#939FB0;font-size:9.5px;font-style:normal; }
.leaderboard-podium-value { grid-column:2;color:color-mix(in srgb,var(--leaderboard-accent,#78D8E8) 64%,white);font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap; }
.leaderboard-podium-hall { grid-column:2;align-self:end;color:#8995A7;font-size:9.5px;font-weight:700; }
.leaderboard-podium-card.hall-available .leaderboard-podium-hall { color:#B8A6EA; }
.leaderboard-podium-card.hall-private { cursor:default; }
.leaderboard-podium-card.me { box-shadow:inset 0 3px color-mix(in srgb,var(--medal) 70%,white),inset 4px 0 color-mix(in srgb,var(--leaderboard-accent,#78D8E8) 72%,white); }
.leaderboard-podium-empty { grid-column:1 / -1;min-height:150px;display:grid;place-items:center;align-content:center;padding:25px;color:#8F9AAC;text-align:center; }
.leaderboard-podium-empty > span { color:#D9C36F;font-size:30px;opacity:.62; }
.leaderboard-podium-empty strong { margin-top:7px;color:#E8E0F4;font-family:var(--font-display,Cinzel,serif);font-size:12px; }
.leaderboard-podium-empty p { margin:5px 0 0;font-size:9.5px; }

.leaderboard-personal-standing { display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;min-height:72px;margin-bottom:14px;padding:11px 13px;border:1px solid color-mix(in srgb,var(--leaderboard-accent,#78D8E8) 27%,rgba(138,151,180,.18));border-radius:10px;background:radial-gradient(circle at 2% 50%,color-mix(in srgb,var(--leaderboard-accent,#78D8E8) 12%,transparent),transparent 24%),rgba(9,15,24,.74); }
.leaderboard-standing-mark { width:42px;height:42px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--leaderboard-accent,#78D8E8) 43%,transparent);border-radius:50%;background:color-mix(in srgb,var(--leaderboard-accent,#78D8E8) 8%,#0B111A);color:color-mix(in srgb,var(--leaderboard-accent,#78D8E8) 72%,white);font-size:17px; }
.leaderboard-personal-standing small,.leaderboard-personal-standing strong,.leaderboard-personal-standing p { display:block;margin:0; }
.leaderboard-personal-standing small { color:color-mix(in srgb,var(--leaderboard-accent,#78D8E8) 62%,white);font-size:9.5px;font-weight:800;letter-spacing:.085em;text-transform:uppercase; }
.leaderboard-personal-standing strong { margin-top:2px;color:#E8ECF3;font-family:var(--font-display,Cinzel,serif);font-size:11.5px; }
.leaderboard-personal-standing p { margin-top:3px;color:#95A1B3;font-size:9.5px;line-height:1.4; }
.leaderboard-personal-standing > b { color:color-mix(in srgb,var(--leaderboard-accent,#78D8E8) 68%,white);font-size:14px;font-variant-numeric:tabular-nums;white-space:nowrap; }
.leaderboard-personal-standing.unpublished { border-color:rgba(220,183,89,.34);background:linear-gradient(100deg,rgba(71,52,20,.22),rgba(18,19,30,.74)); }
.leaderboard-personal-standing.unpublished .leaderboard-standing-mark { border-color:rgba(220,183,89,.44);color:#EAD184;background:rgba(73,52,18,.26); }
.leaderboard-list-heading { margin-top:2px;padding:0 4px 4px; }
.leaderboard-list-heading strong { font-size:12px; }
.leaderboard-list-heading span,.leaderboard-list-heading small { font-size:9.5px; }
.social-leaderboard { gap:7px; }
.social-rank { grid-template-columns:54px 42px minmax(180px,1fr) minmax(110px,auto) 84px;gap:11px;min-height:68px;padding:10px 13px;border-radius:9px; }
article.social-rank { box-sizing:border-box; }
.social-rank.hall-available:hover,.social-rank.hall-available:focus-visible { border-color:color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 62%,white);box-shadow:inset 3px 0 color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 65%,white);outline:none;transform:translateX(2px); }
.social-rank.hall-private { cursor:default; }
.social-rank.hall-private:hover { transform:none; }
.social-rank-position { font-family:var(--font-display,Cinzel,serif);font-size:13px; }
.social-rank-player strong { color:#E9ECF2;font-size:11px; }
.social-rank-player small { font-size:9.5px; }
.social-rank-you { display:inline-block;margin-left:7px;padding:2px 5px;border:1px solid color-mix(in srgb,var(--leaderboard-accent,#78D8E8) 44%,transparent);border-radius:999px;color:color-mix(in srgb,var(--leaderboard-accent,#78D8E8) 68%,white);font-size:9.5px;line-height:1;vertical-align:1px; }
.social-rank em { justify-self:end;font-size:12px; }
.social-rank-hall-state { justify-self:end;color:#7F8A9C;font-size:9.5px;font-weight:700;white-space:nowrap; }
.social-rank.hall-available .social-rank-hall-state { color:#AE9ADE; }
.leaderboard-list-complete { min-height:82px;display:flex;align-items:center;justify-content:center;gap:8px;padding:18px;border:1px dashed rgba(138,151,180,.18);border-radius:9px;background:rgba(7,11,18,.34);color:#8D99AB;text-align:center; }
.leaderboard-list-complete span { color:color-mix(in srgb,var(--leaderboard-accent,#A98CF2) 62%,white);font-size:15px; }
.leaderboard-list-complete p { margin:0;font-size:9.5px; }

.leaderboard-inspector-layer { position:fixed;z-index:10040;inset:0;isolation:isolate;pointer-events:auto; }
.leaderboard-inspector-backdrop { position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:rgba(2,5,10,.62);backdrop-filter:blur(3px);cursor:pointer;pointer-events:auto; }
.leaderboard-inspector { position:absolute;right:0;top:0;width:min(690px,92vw);height:100dvh;display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden;border-left:1px solid rgba(169,140,242,.46);background:linear-gradient(155deg,#161C2A,#080D16 62%);box-shadow:-26px 0 72px rgba(0,0,0,.58);animation:leaderboardInspectorEnter .24s ease-out both; }
.leaderboard-inspector > header { position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:68px;padding:12px max(18px,env(safe-area-inset-right)) 12px 15px;border-bottom:1px solid rgba(138,151,180,.16);background:radial-gradient(circle at 100% 0,rgba(169,140,242,.13),transparent 50%); }
.leaderboard-inspector > header small,.leaderboard-inspector > header h2 { display:block;margin:0; }
.leaderboard-inspector > header small { color:#AD98E3;font-size:9.5px;font-weight:800;letter-spacing:.11em;text-transform:uppercase; }
.leaderboard-inspector > header h2 { margin-top:2px;color:#F0EBF8;font-family:var(--font-display,Cinzel,serif);font-size:15px; }
.leaderboard-inspector-close { position:relative;z-index:3;flex:0 0 40px;width:40px;height:40px;border:1px solid rgba(193,170,249,.38);border-radius:50%;background:rgba(63,44,103,.3);color:#E4D9FA;font-size:23px;line-height:1;cursor:pointer; }
.leaderboard-inspector-close:hover,.leaderboard-inspector-close:focus-visible { border-color:#CEBDF6;background:rgba(88,62,139,.44);outline:none;box-shadow:0 0 14px rgba(169,140,242,.2); }
.leaderboard-inspector-scroll { min-height:0;padding:12px 12px calc(18px + env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain; }
.leaderboard-inspector-scroll > .social-loading { margin-top:0; }
.leaderboard-inspector-scroll .social-leaderboard-empty { min-height:calc(100dvh - 110px); }
.leaderboard-podium-card.hall-available,.social-rank.hall-available { touch-action:manipulation;-webkit-tap-highlight-color:rgba(169,140,242,.18); }
@keyframes leaderboardInspectorEnter { from { opacity:.55;transform:translateX(28px); } to { opacity:1;transform:none; } }
body.social-leaderboard-selector-open,body.social-hall-inspector-open { overflow:hidden; }

body.battery-saver .leaderboard-selector-popover,body.battery-saver .leaderboard-category-banner,body.battery-saver .leaderboard-refreshing,body.battery-saver .leaderboard-inspector { animation:none; }
body.battery-saver .leaderboard-category-trigger,body.battery-saver .leaderboard-category-option,body.battery-saver .leaderboard-podium-card,body.battery-saver .social-rank { transition:none; }
body.battery-saver .leaderboard-selector-backdrop,body.battery-saver .leaderboard-inspector-backdrop { backdrop-filter:none; }
body.battery-saver .leaderboard-podium-card:hover,body.battery-saver .leaderboard-category-option:hover,body.battery-saver .social-rank.hall-available:hover { transform:none; }
body.reduced-motion .leaderboard-selector-popover,body.reduced-motion .leaderboard-category-banner,body.reduced-motion .leaderboard-refreshing,body.reduced-motion .leaderboard-inspector { animation:none; }
body.reduced-motion .leaderboard-category-trigger,body.reduced-motion .leaderboard-category-option,body.reduced-motion .leaderboard-podium-card,body.reduced-motion .social-rank { transition:background .08s ease,border-color .08s ease; }
body.reduced-motion .leaderboard-podium-card:hover,body.reduced-motion .leaderboard-category-option:hover,body.reduced-motion .social-rank.hall-available:hover { transform:none; }

@media (max-width:820px) {
  .leaderboard-control-bar { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .leaderboard-selector-shell { grid-column:1 / -1; }
  .leaderboard-category-banner { min-height:88px;grid-template-columns:54px minmax(0,1fr);padding:13px; }
  .leaderboard-category-banner-icon { width:50px;height:50px; }
  .leaderboard-category-crown { display:none; }
  .leaderboard-refreshing { right:10px;bottom:7px; }
  .leaderboard-podium { gap:7px;padding-inline:6px; }
  .leaderboard-podium-card { min-height:178px;grid-template-columns:60px minmax(0,1fr);padding:13px 10px 11px; }
  .leaderboard-podium-card.place-gold { min-height:190px; }
  .social-avatar--champion { --avatar-size:58px; }
  .leaderboard-podium-card.place-gold .social-avatar--champion { --avatar-size:64px; }
  .leaderboard-podium-copy { padding-right:34px; }
  .leaderboard-podium-card > .social-rank-seal { right:5px;top:6px;width:45px;height:45px; }
  .leaderboard-podium-card.place-gold > .social-rank-seal { width:50px;height:50px; }
  .leaderboard-podium-value { font-size:11px; }
  .social-rank { grid-template-columns:48px 38px minmax(130px,1fr) auto 78px; }
  .leaderboard-inspector { width:min(650px,96vw); }
}

@media (max-width:600px) {
  .leaderboard-panel-head { align-items:flex-start;flex-direction:column;gap:3px; }
  .leaderboard-control-bar { grid-template-columns:1fr 1fr; }
  .leaderboard-category-trigger { min-height:64px; }
  .leaderboard-selector-layer .leaderboard-selector-popover { position:absolute;left:0;right:0;top:auto;bottom:0;width:100%;max-height:min(78vh,650px);max-height:min(78dvh,650px);border-right:0;border-bottom:0;border-left:0;border-radius:17px 17px 0 0;padding-bottom:env(safe-area-inset-bottom);animation:leaderboardSelectorSheetEnter .22s ease-out both; }
  @keyframes leaderboardSelectorSheetEnter { from { opacity:.65;transform:translateY(28px); } to { opacity:1;transform:none; } }
  .leaderboard-selector-head { gap:10px;padding:12px max(12px,env(safe-area-inset-right)) 10px max(12px,env(safe-area-inset-left));align-items:center; }
  .leaderboard-selector-head > div { min-width:0; }
  .leaderboard-selector-head h3 { font-size:14px;line-height:1.35; }
  .leaderboard-selector-head p { display:none; }
  .leaderboard-selector-head button { flex-basis:44px;width:44px;height:44px; }
  .leaderboard-selector-scroll { gap:10px;padding:8px max(12px,env(safe-area-inset-right)) 12px max(12px,env(safe-area-inset-left)); }
  .leaderboard-selector-group { gap:5px; }
  .leaderboard-selector-group + .leaderboard-selector-group { padding-top:8px; }
  .leaderboard-selector-group > header { position:static;padding:4px 2px;background:none;align-items:center; }
  .leaderboard-selector-group > header span { display:none; }
  .leaderboard-category-option { min-height:44px;grid-template-columns:28px minmax(0,1fr) 18px;gap:9px;padding:6px 9px; }
  .leaderboard-category-option-icon { width:28px;height:28px; }
  .leaderboard-category-option-icon svg { width:18px;height:18px; }
  .leaderboard-category-option-copy strong { font-size:12px;line-height:1.35;white-space:normal;overflow-wrap:anywhere; }
  .leaderboard-category-option-copy small { display:none; }
  .leaderboard-category-option:hover,.leaderboard-category-option:focus-visible { transform:none; }
  .leaderboard-category-banner { min-height:80px;margin-bottom:10px;grid-template-columns:47px minmax(0,1fr);gap:10px; }
  .leaderboard-category-banner-icon { width:44px;height:44px; }
  .leaderboard-category-banner-icon svg { width:26px;height:26px; }
  .leaderboard-category-banner h3 { font-size:15px; }
  .leaderboard-category-banner p { font-size:9.5px; }
  .leaderboard-podium { grid-template-columns:1fr;margin-bottom:10px;padding:7px; }
  .leaderboard-podium.podium-count-1,.leaderboard-podium.podium-count-2 { grid-template-columns:1fr; }
  .leaderboard-podium-card,.leaderboard-podium-card.place-gold { min-height:112px;grid-template-columns:64px minmax(0,1fr) 52px;grid-template-rows:auto auto auto;padding:11px 10px; }
  .leaderboard-podium-card.place-gold { order:-3; }
  .leaderboard-podium-card.place-silver { order:-2; }
  .leaderboard-podium-card.place-bronze { order:-1; }
  .social-avatar--champion,.leaderboard-podium-card.place-gold .social-avatar--champion { --avatar-size:60px;grid-row:1 / 4; }
  .leaderboard-podium-card > .social-rank-seal,.leaderboard-podium-card.place-gold > .social-rank-seal { position:relative;right:auto;top:auto;grid-column:3;grid-row:1 / 3;align-self:start;width:48px;height:48px; }
  .leaderboard-podium-copy { grid-column:2;padding-right:0; }
  .leaderboard-podium-copy strong { font-size:12px; }
  .leaderboard-podium-value { grid-column:2;font-size:11px; }
  .leaderboard-podium-hall { grid-column:3;grid-row:3;align-self:end;justify-self:end; }
  .leaderboard-personal-standing { grid-template-columns:42px minmax(0,1fr);padding:10px; }
  .leaderboard-personal-standing > b,.leaderboard-personal-standing > .social-button { grid-column:2;justify-self:start;margin-left:0; }
  .leaderboard-list-heading { align-items:flex-start; }
  .leaderboard-list-heading small { text-align:right; }
  .social-rank { grid-template-columns:43px 37px minmax(0,1fr) auto;grid-template-rows:auto auto;gap:5px 8px;min-height:72px;padding:9px; }
  .social-rank-position,.social-rank > .social-avatar-v2 { grid-row:1 / 3; }
  .social-rank-player { grid-column:3;grid-row:1;padding-right:0; }
  .social-rank em { grid-column:3 / 5;grid-row:2;justify-self:start;font-size:10.5px; }
  .social-rank-hall-state { grid-column:4;grid-row:1;justify-self:end;align-self:start;margin-top:0; }
  .leaderboard-inspector { left:0;right:0;top:auto;bottom:0;width:100%;height:min(91dvh,820px);border-top:1px solid rgba(169,140,242,.48);border-left:0;border-radius:17px 17px 0 0;animation:leaderboardInspectorSheetEnter .24s ease-out both; }
  @keyframes leaderboardInspectorSheetEnter { from { opacity:.6;transform:translateY(32px); } to { opacity:1;transform:none; } }
  .leaderboard-inspector > header { padding-top:max(12px,env(safe-area-inset-top)); }
}

@media (max-width:390px) {
  .leaderboard-filter { padding:7px; }
  .leaderboard-category-trigger { grid-template-columns:42px minmax(0,1fr) 22px;padding-inline:9px; }
  .leaderboard-category-trigger-icon { width:39px;height:39px; }
  .social-rank-hall-state { font-size:9.5px; }
}

@media (max-height:600px) and (orientation:landscape) {
  .leaderboard-selector-layer .leaderboard-selector-popover { max-height:min(88dvh,var(--selector-max-height,88dvh)); }
  .leaderboard-inspector { height:96dvh; }
  .leaderboard-inspector > header { min-height:58px; }
}

.leaderboard-catch-meta{display:flex;align-items:center;gap:5px;margin-top:4px;color:#9fdce7;min-width:0}.leaderboard-catch-meta i{display:grid;place-items:center;width:21px;height:21px;flex:0 0 21px}.leaderboard-catch-meta i svg{width:100%;height:100%}.leaderboard-catch-meta small{font-size:9.5px;line-height:1.3;white-space:normal}.leaderboard-podium-copy .leaderboard-catch-meta{justify-content:center;max-width:220px}.leaderboard-category-option-icon img,.leaderboard-category-option-icon svg{max-width:100%;max-height:100%}
@media(max-width:600px){.leaderboard-catch-meta{grid-column:1/-1}.leaderboard-podium-copy .leaderboard-catch-meta{justify-content:flex-start}.leaderboard-selector-scroll{padding-bottom:max(18px,env(safe-area-inset-bottom))}}
