:root{
  --green:#95d81e;
  --green-hi:#b6f13a;
  --green-dark:#5a8b0b;
  --txt:#f5f8f4;
  --muted:#8f9993;
  --panel:rgba(8,13,15,.88);
  --top:rgba(4,8,9,.90);
  --line:rgba(255,255,255,.10);
  --bgBright:.68;
  --danger:#ff5c65;
  --shadow:0 30px 90px rgba(0,0,0,.52);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--txt);background:#040708}
body{overflow-x:hidden}
button,input{font:inherit}
button{color:inherit}
.hidden{display:none!important}

.bg{
  position:fixed;inset:0;z-index:0;
  background:url("/assets/bg-zombie.png") center center/cover no-repeat;background-image:image-set(url("/assets/bg-zombie.webp") type("image/webp"),url("/assets/bg-zombie.png") type("image/png"));
  filter:brightness(var(--bgBright)) saturate(.88) contrast(1.04);
  transform:scale(1.025);
  transition:filter .35s ease;
}
.veil{
  position:fixed;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(circle at 50% 42%,rgba(12,21,22,.03) 0,rgba(0,0,0,.08) 31%,rgba(0,0,0,.37) 100%),
    linear-gradient(90deg,rgba(0,0,0,.19),transparent 28%,transparent 72%,rgba(0,0,0,.24)),
    linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.22));
}
.noise{
  position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.075;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E");
}

.topbar{
  position:relative;z-index:20;height:86px;
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:38px;
  padding:0 clamp(22px,5vw,84px);
  background:linear-gradient(180deg,rgba(5,9,10,.96),var(--top));
  border-bottom:1px solid rgba(255,255,255,.055);
  backdrop-filter:blur(20px);
}
.topbar:after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(149,216,30,.18),transparent);
}
.brand{display:flex;align-items:center;color:#fff;text-decoration:none;white-space:nowrap}
.brand-x{
  color:var(--green);font:700 58px/.72 Rajdhani,sans-serif;font-style:italic;margin-right:4px;
  text-shadow:0 0 22px rgba(149,216,30,.24);
}
.brand-copy{display:flex;flex-direction:column;line-height:1}
.brand-copy strong{font:700 27px/1 Rajdhani,sans-serif;letter-spacing:-.6px}
.brand-copy small{font-size:10px;color:var(--green-hi);letter-spacing:2.2px;font-weight:800;margin-top:4px}
nav{height:100%;display:flex;align-items:stretch;gap:30px}
nav a{
  position:relative;height:100%;display:flex;align-items:center;color:#e9ecea;
  text-decoration:none;font-size:12px;font-weight:650;letter-spacing:.15px;
}
nav a:hover,nav a.active{color:var(--green-hi)}
nav a.active:after{
  content:"";position:absolute;left:0;right:0;bottom:17px;height:2px;background:var(--green);
  box-shadow:0 0 12px rgba(149,216,30,.5);
}
.actions{display:flex;align-items:center;gap:23px;white-space:nowrap}
.play,.primary{
  border:0;color:#091004;font-weight:800;cursor:pointer;
  background:linear-gradient(180deg,var(--green-hi),#7fbd14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 8px 28px rgba(112,177,14,.16);
}
.play{padding:14px 24px;border-radius:6px;letter-spacing:.2px}
.play span{font-size:11px;margin-right:5px}
.online{font-size:12px;color:#dfe4e1}.online i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--green);margin-right:8px;box-shadow:0 0 11px rgba(149,216,30,.75)}
.theme,.menuBtn{border:1px solid var(--line);background:rgba(255,255,255,.045);border-radius:24px;cursor:pointer;color:#fff}
.theme{width:47px;height:39px;font-size:19px}.menuBtn{display:none;width:42px;height:42px}

.hero{
  position:relative;z-index:4;min-height:calc(100vh - 86px);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:34px 20px 34px;
}

.glass{
  background:linear-gradient(155deg,rgba(19,27,29,.92),rgba(7,11,13,.94));
  border:1px solid rgba(255,255,255,.13);
  box-shadow:var(--shadow);
  backdrop-filter:blur(18px);
}

.auth-shell{position:relative;width:min(520px,95vw)}
.auth-glow{
  position:absolute;inset:-36px;z-index:-1;opacity:.42;filter:blur(28px);
  background:radial-gradient(circle at 50% 28%,rgba(134,210,24,.18),transparent 42%);
  pointer-events:none;
}
.auth{
  position:relative;overflow:hidden;border-radius:10px;padding:0 38px 34px;
}
.auth:before{
  content:"";position:absolute;left:0;top:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent 3%,var(--green) 50%,transparent 97%);
  box-shadow:0 0 22px rgba(149,216,30,.65);
}
.auth:after{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.12;
  background:linear-gradient(120deg,transparent 0 46%,rgba(255,255,255,.06) 49%,transparent 52% 100%);
  transform:translateX(-60%);
  animation:panelSweep 8s ease-in-out infinite;
}
@keyframes panelSweep{0%,68%{transform:translateX(-70%)}88%,100%{transform:translateX(70%)}}

.terminal-line{
  height:44px;margin:0 -38px 0;padding:0 22px;
  display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid rgba(255,255,255,.07);
  background:rgba(0,0,0,.18);font-size:9px;letter-spacing:1.45px;color:#8f9994;
}
.terminal-line span{display:flex;align-items:center;gap:8px}
.terminal-line i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 9px var(--green)}
.terminal-line strong{font-size:9px;color:var(--green);font-weight:700}

.auth-heading{text-align:center;padding:25px 4px 20px}
.eyebrow{display:block;color:var(--green);font-size:9px;font-weight:800;letter-spacing:2.3px;margin-bottom:8px}
.auth-heading h1{
  margin:0;color:#fff;font:700 34px/1 Rajdhani,sans-serif;letter-spacing:.7px;
  text-shadow:0 5px 28px rgba(0,0,0,.4);
}
.auth-heading p{max-width:380px;margin:8px auto 0;color:#8f9893;font-size:11px;line-height:1.55}

.tabs{
  position:relative;display:grid;grid-template-columns:1fr 1fr;gap:4px;
  padding:4px;margin-bottom:20px;border:1px solid rgba(255,255,255,.075);
  border-radius:8px;background:rgba(0,0,0,.24);
}
.tab{
  height:43px;border:0;border-radius:6px;background:transparent;color:#7f8984;
  font-size:11px;font-weight:800;letter-spacing:.8px;cursor:pointer;transition:.2s ease;
}
.tab.active{
  color:#eaf5de;background:linear-gradient(180deg,rgba(149,216,30,.16),rgba(149,216,30,.075));
  box-shadow:inset 0 0 0 1px rgba(149,216,30,.19),0 6px 20px rgba(0,0,0,.16);
}
.panel{display:none}.panel.active{display:block}

.field{
  position:relative;height:64px;display:flex;align-items:center;margin-bottom:12px;
  border:1px solid rgba(255,255,255,.095);border-radius:7px;overflow:hidden;
  background:linear-gradient(180deg,rgba(0,0,0,.27),rgba(0,0,0,.18));
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
.field:hover{border-color:rgba(255,255,255,.16)}
.field:focus-within{
  border-color:rgba(149,216,30,.48);
  box-shadow:0 0 0 3px rgba(149,216,30,.055),0 8px 26px rgba(0,0,0,.12);
  background:rgba(3,7,8,.48);
}
.field-symbol{
  width:58px;height:100%;display:grid;place-items:center;flex:0 0 58px;
  border-right:1px solid rgba(255,255,255,.065);color:#808983;
}
.field:focus-within .field-symbol{color:var(--green)}
.field-symbol svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.field-content{display:flex;flex-direction:column;justify-content:center;flex:1;height:100%;min-width:0;padding:0 13px}
.field-content small{font-size:8px;letter-spacing:1.4px;font-weight:800;color:#66706a;margin-bottom:4px}
.field:focus-within .field-content small{color:#7da83d}
.field input{
  width:100%;height:25px;border:0;outline:0;background:transparent;color:#f5f7f5;
  padding:0;font-size:13px;font-weight:550;
}
.field input::placeholder{color:#646d68;font-weight:450}
.eye{height:100%;width:49px;border:0;background:none;color:#747d78;cursor:pointer;font-size:15px}
.eye:hover{color:var(--green)}

.row{display:flex;justify-content:space-between;align-items:center;font-size:10px;margin:2px 1px 18px;color:#aab1ad}
.remember,.terms{display:flex;gap:8px;align-items:center;cursor:pointer}
.remember input,.terms input{accent-color:var(--green)}
.link{border:0;background:none;color:#9ccc4c;font-size:10px;cursor:pointer;padding:5px 0}
.link:hover{color:var(--green-hi)}

.primary{
  position:relative;width:100%;height:52px;border-radius:6px;font-size:12px;letter-spacing:.7px;
  display:flex;align-items:center;justify-content:center;overflow:hidden;transition:.18s ease;
}
.primary:hover{transform:translateY(-1px);filter:brightness(1.06);box-shadow:0 10px 30px rgba(125,190,20,.24)}
.primary:active{transform:translateY(0)}
.primary:disabled{opacity:.58;cursor:wait;transform:none}
.button-arrow{position:absolute;right:18px;font-size:18px;font-weight:500}
.primary.mini{max-width:305px;margin:0 auto;height:48px}
.primary.mini span{margin-left:10px}

.or,.register-or{display:flex;align-items:center;gap:12px;color:#6f7873;font-size:8px;letter-spacing:1.35px;margin:20px 0 13px;font-weight:800}
.or:before,.or:after,.register-or:before,.register-or:after{content:"";height:1px;background:rgba(255,255,255,.075);flex:1}

.social{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.social-btn{
  position:relative;min-height:62px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;
  padding:8px 12px;border:1px solid rgba(255,255,255,.095);border-radius:7px;color:#e9edeb;
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018));
  cursor:pointer;text-align:left;transition:.2s ease;overflow:hidden;
}
.social-btn:before{content:"";position:absolute;inset:0;opacity:0;transition:.2s ease}
.steam-btn:before{background:radial-gradient(circle at 12% 50%,rgba(77,163,255,.15),transparent 55%)}
.google-btn:before{background:radial-gradient(circle at 12% 50%,rgba(255,255,255,.10),transparent 55%)}
.social-btn:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.19);box-shadow:0 12px 28px rgba(0,0,0,.18)}
.social-btn:hover:before{opacity:1}
.social-btn.busy{opacity:.6;pointer-events:none}
.provider-icon{position:relative;z-index:1;width:35px;height:35px;display:grid;place-items:center;flex:0 0 35px}
.steam-icon{color:#fff}.steam-icon svg{width:31px;height:31px}
.google-icon{
  border-radius:50%;background:#fff;font:800 21px/1 Arial,sans-serif;
  color:#4285f4;
  text-shadow:8px 0 0 transparent;
}
.provider-copy{position:relative;z-index:1;display:flex;flex-direction:column;gap:2px}
.provider-copy small{font-size:7px;color:#747d78;letter-spacing:1px}
.provider-copy strong{font-size:11px;letter-spacing:.9px}
.provider-arrow{position:relative;z-index:1;color:#707a74;font-size:14px}
.social.compact .social-btn{min-height:52px}
.social.compact .provider-copy{align-items:flex-start}

.secure-note{
  display:flex;align-items:flex-start;gap:10px;margin-top:17px;padding:11px 12px;
  border:1px solid rgba(149,216,30,.10);border-radius:6px;background:rgba(149,216,30,.035);
}
.secure-note>span{color:var(--green);font-size:10px;margin-top:1px}
.secure-note p{margin:0;color:#75807a;font-size:9px;line-height:1.5}

.password-meter{margin:-1px 1px 14px}
.meter-bars{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-bottom:6px}
.meter-bars i{height:3px;border-radius:2px;background:rgba(255,255,255,.08);transition:.2s ease}
.password-meter[data-level="1"] i:nth-child(-n+1){background:#e55c55}
.password-meter[data-level="2"] i:nth-child(-n+2){background:#e6ad35}
.password-meter[data-level="3"] i:nth-child(-n+3){background:#9fc832}
.password-meter[data-level="4"] i:nth-child(-n+4){background:var(--green)}
.password-meter span{font-size:8px;color:#707a74;letter-spacing:.2px}
.password-meter strong{color:#9ba59f}
.terms{font-size:10px;color:#9da6a1;margin:4px 1px 17px}


/* =========================================================
   X-SITES PLAYER CORE V8
   ========================================================= */

.player-dashboard{
  width:min(1060px,96vw);
  display:flex;
  flex-direction:column;
  gap:clamp(14px,1.35vw,19px);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

.player-core{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(210px,.75fr) minmax(260px,.9fr);
  align-items:stretch;
  gap:0;
  border-radius:14px;
  padding:0;
  background:
    radial-gradient(circle at 8% 0%,rgba(149,216,30,.085),transparent 27%),
    linear-gradient(145deg,rgba(15,23,25,.97),rgba(6,10,12,.985));
  border:1px solid rgba(255,255,255,.095);
  box-shadow:
    0 28px 78px rgba(0,0,0,.42),
    inset 0 1px 0 rgba(255,255,255,.025);
}

.core-sheen{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(110deg,transparent 0 44%,rgba(255,255,255,.018) 49%,transparent 54%),
    linear-gradient(90deg,rgba(149,216,30,.02),transparent 35%);
}

.profile-zone,
.xp-reactor-wrap,
.account-zone{
  position:relative;
  z-index:1;
  min-width:0;
  padding:clamp(20px,2vw,28px);
}

.profile-zone{
  display:flex;
  align-items:center;
  gap:clamp(16px,2vw,24px);
}

.profile-zone::after,
.xp-reactor-wrap::after{
  content:"";
  position:absolute;
  right:0;
  top:16%;
  bottom:16%;
  width:1px;
  background:linear-gradient(transparent,rgba(255,255,255,.08),transparent);
}

.avatar-stack{
  flex:0 0 auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
}

.profile-avatar{
  appearance:none;
  -webkit-appearance:none;
  width:clamp(78px,6vw,96px);
  height:clamp(78px,6vw,96px);
  position:relative;
  display:grid;
  place-items:center;
  overflow:hidden;
  padding:0;
  border-radius:24px;
  border:1px solid rgba(149,216,30,.18);
  outline:0;
  cursor:pointer;
  color:#0b1205;
  font:800 clamp(1.9rem,1.7vw,2.5rem)/1 Rajdhani,sans-serif;
  background:
    linear-gradient(145deg,rgba(185,242,65,.98),rgba(98,153,11,.98));
  box-shadow:
    0 0 0 4px rgba(149,216,30,.035),
    0 18px 38px rgba(0,0,0,.3);
  transition:.2s ease;
}

.profile-avatar:hover,
.profile-avatar:focus-visible{
  transform:translateY(-2px) scale(1.015);
  border-color:rgba(149,216,30,.38);
  box-shadow:
    0 0 0 5px rgba(149,216,30,.06),
    0 20px 44px rgba(0,0,0,.34);
}

.profile-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.avatar-edit-overlay{
  position:absolute;
  right:6px;
  bottom:6px;
  width:27px;
  height:27px;
  display:grid;
  place-items:center;
  border-radius:8px;
  color:#dff5b5;
  background:rgba(5,11,7,.88);
  border:1px solid rgba(149,216,30,.18);
  opacity:0;
  transform:scale(.9);
  transition:.18s ease;
}

.profile-avatar:hover .avatar-edit-overlay,
.profile-avatar:focus-visible .avatar-edit-overlay{
  opacity:1;
  transform:scale(1);
}

.avatar-edit-overlay svg{
  width:13px;
  height:13px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.avatar-loading{
  position:absolute;
  inset:0;
  z-index:5;
  background:rgba(4,9,7,.76);
}

.avatar-loading::after{
  content:"";
  width:23px;
  height:23px;
  position:absolute;
  left:50%;
  top:50%;
  margin:-11.5px 0 0 -11.5px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.12);
  border-top-color:var(--green);
  animation:avatarSpin .7s linear infinite;
}

@keyframes avatarSpin{to{transform:rotate(360deg)}}

.avatar-mini-note{
  color:#59645d;
  font-size:clamp(.42rem,.07vw + .4rem,.49rem);
  font-weight:800;
  letter-spacing:.1em;
}

.identity-copy{min-width:0;flex:1}

.identity-top{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:7px;
  margin-bottom:8px;
}

.player-online,
.online-status{
  display:flex;
  align-items:center;
  gap:6px;
  color:#a3d84a!important;
  font-size:clamp(.47rem,.08vw + .45rem,.55rem);
  font-weight:850;
  letter-spacing:.08em;
}

.player-online i,
.online-status i{
  width:6px;
  height:6px;
  flex:0 0 6px;
  border-radius:50%;
  background:var(--green);
  box-shadow:0 0 10px rgba(149,216,30,.82);
}

.provider-badge{
  min-height:23px;
  display:inline-flex;
  align-items:center;
  max-width:190px;
  padding:0 8px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  border-radius:99px;
  color:#7e8982;
  border:1px solid rgba(255,255,255,.065);
  background:rgba(255,255,255,.018);
  font-size:clamp(.43rem,.07vw + .41rem,.5rem);
  font-weight:800;
  letter-spacing:.075em;
}

.identity-eyebrow{
  display:block;
  margin-bottom:3px;
  color:#636e67;
  font-size:clamp(.46rem,.08vw + .44rem,.54rem);
  font-weight:850;
  letter-spacing:.16em;
}

.player-core h1{
  margin:0;
  max-width:100%;
  color:#f5f8f3;
  font:700 clamp(1.85rem,1.45vw + 1.1rem,2.95rem)/.94 Rajdhani,sans-serif;
  letter-spacing:-.027em;
  overflow:hidden;
  text-overflow:ellipsis;
}

.identity-meta{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:10px;
}

.membership,
.evip-pill{
  min-height:27px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:0 9px;
  border-radius:7px;
  font-size:clamp(.47rem,.08vw + .45rem,.55rem);
  font-weight:850;
  letter-spacing:.07em;
}

.membership.vip{
  color:#a8da50;
  border:1px solid rgba(149,216,30,.17);
  background:rgba(149,216,30,.055);
}

.membership-dot{
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--green);
  box-shadow:0 0 8px rgba(149,216,30,.68);
}

.evip-pill{
  color:#8c9690;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.018);
}

.evip-pill.active-status{
  color:#e0b860;
  border-color:rgba(224,184,96,.16);
  background:rgba(224,184,96,.045);
}

.identity-foot{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
  color:#646f68;
  font-size:clamp(.49rem,.09vw + .47rem,.58rem);
}

.identity-foot strong{
  color:#8f9992;
  font-weight:750;
}

.identity-separator{
  width:3px;
  height:3px;
  border-radius:50%;
  background:#4c554f;
}

.xp-reactor-wrap{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:clamp(14px,1.5vw,20px);
  background:rgba(255,255,255,.008);
}

.xp-reactor{
  --xp-progress:0deg;
  width:clamp(118px,9vw,145px);
  aspect-ratio:1;
  flex:0 0 auto;
  position:relative;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:
    radial-gradient(circle at center,#0a0f10 0 56%,transparent 57%),
    conic-gradient(
      from -90deg,
      var(--green) 0deg,
      var(--green-hi) var(--xp-progress),
      rgba(255,255,255,.065) var(--xp-progress),
      rgba(255,255,255,.065) 360deg
    );
  box-shadow:
    0 0 0 1px rgba(149,216,30,.07),
    0 0 35px rgba(149,216,30,.05),
    inset 0 0 30px rgba(0,0,0,.3);
}

.xp-reactor::before{
  content:"";
  position:absolute;
  inset:8px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.055);
  box-shadow:inset 0 0 22px rgba(149,216,30,.025);
}

.xp-reactor::after{
  content:"";
  position:absolute;
  inset:-5px;
  border-radius:50%;
  border:1px solid rgba(149,216,30,.08);
  opacity:.7;
}

.xp-reactor-inner{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}

.reactor-label{
  color:#68736c;
  font-size:clamp(.43rem,.07vw + .41rem,.5rem);
  font-weight:850;
  letter-spacing:.14em;
}

.xp-reactor strong{
  margin:2px 0 1px;
  color:#f6faf3;
  font:750 clamp(2rem,1.5vw + 1.2rem,2.8rem)/1 Rajdhani,sans-serif;
  text-shadow:0 0 18px rgba(149,216,30,.09);
}

.xp-reactor small{
  color:#727d76;
  font-size:clamp(.46rem,.08vw + .44rem,.53rem);
  font-weight:700;
}

.xp-reactor small b{color:#99c650}

.reactor-copy{
  min-width:95px;
  display:flex;
  flex-direction:column;
}

.reactor-copy>span{
  color:#626d66;
  font-size:clamp(.43rem,.07vw + .41rem,.5rem);
  font-weight:850;
  letter-spacing:.11em;
}

.reactor-copy>strong{
  margin:5px 0 4px;
  color:#b8df67;
  font:750 clamp(1.15rem,.55vw + .95rem,1.5rem)/1 Rajdhani,sans-serif;
}

.reactor-copy small{
  color:#747f78;
  font-size:clamp(.48rem,.08vw + .46rem,.56rem);
}

.account-zone{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:11px;
}

.wallet-feature{
  display:flex;
  align-items:center;
  gap:11px;
  padding:12px;
  border-radius:9px;
  border:1px solid rgba(149,216,30,.09);
  background:
    radial-gradient(circle at 100% 0%,rgba(149,216,30,.05),transparent 48%),
    rgba(255,255,255,.014);
}

.wallet-icon{
  width:36px;
  height:36px;
  flex:0 0 36px;
  display:grid;
  place-items:center;
  border-radius:11px;
  color:#201700;
  font-weight:900;
  background:linear-gradient(145deg,#ffd95a,#d99a0b);
  box-shadow:0 0 18px rgba(255,187,36,.12);
}

.wallet-feature span{
  display:block;
  margin-bottom:3px;
  color:#636e67;
  font-size:clamp(.44rem,.07vw + .42rem,.51rem);
  font-weight:850;
  letter-spacing:.11em;
}

.wallet-feature strong{
  color:#f1f5ef;
  font:750 clamp(1rem,.45vw + .86rem,1.3rem)/1 Rajdhani,sans-serif;
}

.account-quick-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
}

.quick-chip{
  min-width:0;
  padding:9px 10px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.055);
  background:rgba(255,255,255,.012);
}

.quick-chip span{
  display:block;
  margin-bottom:4px;
  color:#5f6963;
  font-size:clamp(.41rem,.07vw + .39rem,.48rem);
  font-weight:850;
  letter-spacing:.09em;
}

.quick-chip strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#8d9891;
  font-size:clamp(.49rem,.08vw + .47rem,.57rem);
}

.profile-tool-row{
  display:grid;
  grid-template-columns:1fr auto;
  gap:7px;
}

.profile-tool{
  min-height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:0 11px;
  border-radius:7px;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.018);
  color:#76817a;
  font-size:clamp(.46rem,.08vw + .44rem,.53rem);
  font-weight:850;
  letter-spacing:.075em;
  cursor:pointer;
  transition:.18s ease;
}

.profile-tool:hover{
  color:#e4ebe1;
  border-color:rgba(255,255,255,.11);
  background:rgba(255,255,255,.035);
}

.profile-tool.primary-tool{
  color:#acd65e;
  border-color:rgba(149,216,30,.12);
  background:rgba(149,216,30,.035);
}

.profile-tool svg{
  width:14px;
  height:14px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* =========================
   SHOP
   ========================= */

.yun-shop{
  overflow:hidden;
  border-radius:12px;
  padding:clamp(18px,2vw,25px);
  background:
    radial-gradient(circle at 0% 0%,rgba(149,216,30,.04),transparent 25%),
    linear-gradient(155deg,rgba(14,21,24,.96),rgba(6,10,12,.975));
  border:1px solid rgba(255,255,255,.09);
  box-shadow:0 24px 70px rgba(0,0,0,.34);
}

.shop-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  padding-bottom:15px;
  border-bottom:1px solid rgba(255,255,255,.06);
}

.shop-kicker{
  display:block;
  margin-bottom:3px;
  color:var(--green);
  font-size:clamp(.48rem,.09vw + .46rem,.56rem);
  font-weight:850;
  letter-spacing:.15em;
}

.shop-heading h2{
  margin:0;
  color:#f4f8f1;
  font:750 clamp(1.55rem,.9vw + 1.15rem,2.15rem)/1 Rajdhani,sans-serif;
  letter-spacing:.01em;
}

.shop-heading p{
  margin:6px 0 0;
  color:#77827b;
  font-size:clamp(.6rem,.15vw + .56rem,.7rem);
  line-height:1.45;
}

.shop-wallet{
  min-width:130px;
  padding:9px 12px;
  border:1px solid rgba(149,216,30,.1);
  border-radius:8px;
  text-align:right;
  background:rgba(149,216,30,.025);
}

.shop-wallet span{
  display:block;
  color:#69746d;
  font-size:.45rem;
  font-weight:850;
  letter-spacing:.11em;
}

.shop-wallet strong{
  display:block;
  margin-top:3px;
  color:#d9efb4;
  font-size:.78rem;
}

.shop-filters{
  display:flex;
  gap:7px;
  margin:14px 0;
  overflow-x:auto;
  scrollbar-width:none;
}

.shop-filters::-webkit-scrollbar{display:none}

.shop-filter{
  min-height:32px;
  flex:0 0 auto;
  padding:0 12px;
  border-radius:6px;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.018);
  color:#818c85;
  font-size:clamp(.47rem,.08vw + .45rem,.55rem);
  font-weight:800;
  letter-spacing:.07em;
  cursor:pointer;
  transition:.18s ease;
}

.shop-filter:hover,
.shop-filter.active{
  color:#dff4b9;
  border-color:rgba(149,216,30,.17);
  background:rgba(149,216,30,.06);
}

.shop-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:11px;
}

.shop-card{
  min-width:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  border-radius:9px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(7,12,15,.72);
  transition:
    transform .2s ease,
    border-color .2s ease,
    box-shadow .2s ease;
}

.shop-card:hover{
  transform:translateY(-3px);
  border-color:rgba(149,216,30,.16);
  box-shadow:0 16px 32px rgba(0,0,0,.2);
}

.shop-card.owned{border-color:rgba(149,216,30,.22)}
.shop-card.hidden-product{display:none}

.shop-art{
  height:clamp(112px,10vw,145px);
  position:relative;
  overflow:hidden;
  background:#0b1012;
}

.shop-art::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,transparent 55%,rgba(5,9,11,.72));
}

.shop-art img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  transition:transform .35s ease;
}

.shop-card:hover .shop-art img{transform:scale(1.035)}

.shop-tag{
  position:absolute;
  z-index:2;
  right:8px;
  top:8px;
  padding:4px 7px;
  border-radius:99px;
  color:#b9ddff;
  background:rgba(16,85,155,.86);
  border:1px solid rgba(130,194,255,.18);
  font-size:.42rem;
  font-weight:850;
  letter-spacing:.07em;
}

.shop-tag.hot{color:#f3fbe6;background:rgba(111,164,17,.88)}
.shop-tag.premium-tag{color:#f6eaff;background:rgba(126,37,176,.9)}
.shop-tag.legendary-tag{color:#fff0c0;background:rgba(166,91,8,.92)}

.shop-card-body{
  min-height:146px;
  display:flex;
  flex:1;
  flex-direction:column;
  justify-content:space-between;
  gap:12px;
  padding:11px 12px 12px;
}

.shop-type{
  color:#657069;
  font-size:.44rem;
  font-weight:850;
  letter-spacing:.11em;
}

.shop-card h3{
  margin:4px 0 4px;
  color:#eef3ec;
  font:700 clamp(.78rem,.3vw + .7rem,1rem)/1.08 Rajdhani,sans-serif;
  letter-spacing:.015em;
}

.shop-card p{
  margin:0;
  min-height:2.7em;
  color:#717c75;
  font-size:clamp(.53rem,.11vw + .5rem,.62rem);
  line-height:1.45;
}

.shop-card-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}

.shop-price{
  display:flex;
  align-items:center;
  gap:6px;
  color:#dce5da;
  font-size:clamp(.57rem,.13vw + .54rem,.68rem);
  white-space:nowrap;
}

.yun-mini{
  width:18px;
  height:18px;
  display:inline-grid;
  place-items:center;
  border-radius:50%;
  color:#211800;
  font-size:.48rem;
  font-weight:900;
  background:linear-gradient(145deg,#ffd95a,#d99a0b);
}

.shop-buy{
  min-height:31px;
  padding:0 11px;
  border-radius:5px;
  border:1px solid rgba(149,216,30,.18);
  background:linear-gradient(180deg,rgba(149,216,30,.14),rgba(149,216,30,.075));
  color:#bce273;
  font-size:clamp(.47rem,.08vw + .45rem,.55rem);
  font-weight:850;
  letter-spacing:.07em;
  cursor:pointer;
  transition:.18s ease;
}

.shop-buy:hover{
  background:linear-gradient(180deg,rgba(149,216,30,.22),rgba(149,216,30,.11));
  border-color:rgba(149,216,30,.3);
}

.shop-buy:disabled{
  cursor:default;
  color:#74806f;
  border-color:rgba(255,255,255,.06);
  background:rgba(255,255,255,.025);
}

/* =========================
   SETTINGS
   ========================= */

.settings-screen{
  position:fixed;
  inset:0;
  z-index:100;
  display:grid;
  place-items:center;
  padding:clamp(12px,2vw,28px);
}

.settings-screen.hidden{display:none}

.settings-backdrop{
  position:absolute;
  inset:0;
  background:rgba(1,4,5,.75);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

.settings-window{
  width:min(900px,96vw);
  max-height:min(780px,92vh);
  position:relative;
  z-index:1;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.11);
  background:
    radial-gradient(circle at 0% 0%,rgba(149,216,30,.055),transparent 27%),
    linear-gradient(155deg,rgba(14,22,24,.985),rgba(5,9,11,.99));
  box-shadow:0 35px 100px rgba(0,0,0,.58);
}

.settings-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  padding:clamp(20px,2.3vw,29px);
  border-bottom:1px solid rgba(255,255,255,.065);
}

.settings-kicker{
  display:block;
  margin-bottom:5px;
  color:var(--green);
  font-size:clamp(.46rem,.08vw + .44rem,.54rem);
  font-weight:850;
  letter-spacing:.15em;
}

.settings-header h2{
  margin:0;
  color:#f3f7f1;
  font:750 clamp(1.55rem,1vw + 1.1rem,2.2rem)/1 Rajdhani,sans-serif;
}

.settings-header p{
  margin:7px 0 0;
  color:#727d76;
  font-size:clamp(.59rem,.14vw + .56rem,.69rem);
  line-height:1.45;
}

.settings-close{
  width:36px;
  height:36px;
  flex:0 0 36px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.018);
  color:#87918b;
  font-size:1.35rem;
  cursor:pointer;
}

.settings-close:hover{
  color:#fff;
  background:rgba(255,255,255,.04);
}

.settings-layout{
  min-height:0;
  display:grid;
  grid-template-columns:200px minmax(0,1fr);
}

.settings-nav{
  padding:15px;
  border-right:1px solid rgba(255,255,255,.06);
  background:rgba(0,0,0,.12);
}

.settings-nav-item{
  width:100%;
  min-height:42px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 11px;
  border:1px solid transparent;
  border-radius:7px;
  background:transparent;
  color:#737e77;
  text-align:left;
  font-size:clamp(.5rem,.09vw + .48rem,.58rem);
  font-weight:850;
  letter-spacing:.08em;
  cursor:pointer;
}

.settings-nav-item span{
  color:#4f5953;
  font-size:.45rem;
}

.settings-nav-item:hover,
.settings-nav-item.active{
  color:#cfe9a2;
  border-color:rgba(149,216,30,.1);
  background:rgba(149,216,30,.04);
}

.settings-nav-item.active span{color:var(--green)}

.settings-content{
  min-height:0;
  overflow:auto;
  padding:clamp(18px,2.2vw,28px);
}

.settings-panel{display:none}
.settings-panel.active{display:block}

.settings-panel-head{
  margin-bottom:16px;
}

.settings-panel-head>span{
  display:block;
  margin-bottom:4px;
  color:#647069;
  font-size:clamp(.44rem,.07vw + .42rem,.51rem);
  font-weight:850;
  letter-spacing:.13em;
}

.settings-panel-head h3{
  margin:0;
  color:#eef3ec;
  font:700 clamp(1.15rem,.55vw + .95rem,1.5rem)/1 Rajdhani,sans-serif;
}

.setting-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.setting-row{
  min-height:70px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:16px;
  position:relative;
  padding:12px 13px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.055);
  background:rgba(255,255,255,.014);
  cursor:pointer;
}

.setting-row strong,
.setting-row small{
  display:block;
}

.setting-row strong{
  color:#e0e6de;
  font-size:clamp(.65rem,.16vw + .61rem,.75rem);
}

.setting-row small{
  margin-top:4px;
  color:#6e7972;
  font-size:clamp(.53rem,.11vw + .5rem,.62rem);
  line-height:1.42;
}

.setting-row input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.setting-switch{
  width:42px;
  height:23px;
  position:relative;
  flex:0 0 42px;
  border-radius:99px;
  background:#252d29;
  border:1px solid rgba(255,255,255,.07);
  transition:.2s ease;
}

.setting-switch::after{
  content:"";
  width:17px;
  height:17px;
  position:absolute;
  left:2px;
  top:2px;
  border-radius:50%;
  background:#77817b;
  transition:.2s ease;
}

.setting-row input:checked + .setting-switch{
  background:rgba(149,216,30,.12);
  border-color:rgba(149,216,30,.24);
}

.setting-row input:checked + .setting-switch::after{
  transform:translateX(19px);
  background:var(--green);
  box-shadow:0 0 10px rgba(149,216,30,.35);
}

.settings-save{
  min-height:38px;
  margin-top:14px;
  padding:0 15px;
  border-radius:6px;
  border:1px solid rgba(149,216,30,.18);
  background:linear-gradient(180deg,rgba(149,216,30,.13),rgba(149,216,30,.075));
  color:#bce173;
  font-size:clamp(.49rem,.09vw + .47rem,.57rem);
  font-weight:850;
  letter-spacing:.075em;
  cursor:pointer;
}

.settings-save:hover{
  border-color:rgba(149,216,30,.29);
  background:linear-gradient(180deg,rgba(149,216,30,.2),rgba(149,216,30,.1));
}

.settings-form{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.settings-form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.settings-form label>span{
  display:block;
  margin-bottom:6px;
  color:#657069;
  font-size:clamp(.44rem,.07vw + .42rem,.51rem);
  font-weight:850;
  letter-spacing:.1em;
}

.settings-form input{
  width:100%;
  height:44px;
  padding:0 12px;
  outline:0;
  border-radius:7px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(0,0,0,.18);
  color:#eef3ec;
  font-size:clamp(.62rem,.14vw + .59rem,.72rem);
}

.settings-form input:focus{
  border-color:rgba(149,216,30,.24);
  box-shadow:0 0 0 3px rgba(149,216,30,.035);
}

.settings-form input::placeholder{color:#5f6963}

.settings-divider{
  height:1px;
  margin:22px 0;
  background:rgba(255,255,255,.06);
}

.oauth-security-note{
  margin-top:15px;
  padding:12px 13px;
  border-radius:7px;
  border:1px solid rgba(255,193,74,.1);
  background:rgba(255,193,74,.035);
  color:#9b865e;
  font-size:clamp(.55rem,.11vw + .52rem,.64rem);
  line-height:1.45;
}

@media(max-width:960px){
  .player-core{
    grid-template-columns:minmax(0,1fr) minmax(220px,.75fr);
  }

  .account-zone{
    grid-column:1/-1;
    display:grid;
    grid-template-columns:1fr 1fr;
    border-top:1px solid rgba(255,255,255,.06);
  }

  .profile-zone::after{display:none}
  .xp-reactor-wrap::after{display:none}
}

@media(max-width:760px){
  .player-core{
    grid-template-columns:1fr;
  }

  .profile-zone,
  .xp-reactor-wrap,
  .account-zone{
    border-bottom:1px solid rgba(255,255,255,.06);
  }

  .xp-reactor-wrap{
    justify-content:flex-start;
  }

  .account-zone{
    grid-column:auto;
    grid-template-columns:1fr;
    border-top:0;
    border-bottom:0;
  }

  .settings-layout{
    grid-template-columns:1fr;
  }

  .settings-nav{
    display:flex;
    gap:6px;
    overflow-x:auto;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.06);
  }

  .settings-nav-item{
    width:auto;
    min-width:max-content;
  }
}

@media(max-width:560px){
  .player-dashboard{width:96vw}
  .profile-zone{align-items:flex-start}
  .profile-avatar{width:70px;height:70px;border-radius:20px}
  .identity-foot{align-items:flex-start;flex-direction:column;gap:4px}
  .identity-separator{display:none}
  .xp-reactor-wrap{flex-direction:column;align-items:flex-start}
  .account-quick-grid{grid-template-columns:1fr}
  .profile-tool-row{grid-template-columns:1fr}
  .settings-form-grid{grid-template-columns:1fr}
  .settings-window{max-height:94vh}
}

.server-stats{
  width:min(1080px,96vw);
  margin-top:clamp(28px,4vw,56px);
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  position:relative;
  overflow:hidden;
  border-radius:10px;
  padding:clamp(8px,.8vw,12px);
  background:
    linear-gradient(145deg,rgba(17,25,27,.93),rgba(6,10,12,.95));
  border:1px solid rgba(255,255,255,.11);
  box-shadow:
    0 22px 62px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

.server-stats:before{
  content:"";
  position:absolute;
  left:10%;
  right:10%;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(149,216,30,.75),transparent);
  box-shadow:0 0 18px rgba(149,216,30,.22);
}

.server-stat{
  position:relative;
  display:flex;
  align-items:center;
  gap:clamp(12px,1.25vw,18px);
  min-width:0;
  padding:
    clamp(12px,1.25vw,18px)
    clamp(13px,1.45vw,21px);
  border-radius:7px;
  transition:
    background .2s ease,
    transform .2s ease,
    box-shadow .2s ease;
}

.server-stat:not(:last-child):after{
  content:"";
  position:absolute;
  right:0;
  top:19%;
  bottom:19%;
  width:1px;
  background:linear-gradient(transparent,rgba(255,255,255,.12),transparent);
}

.server-stat:hover{
  transform:translateY(-1px);
  background:linear-gradient(135deg,rgba(149,216,30,.045),rgba(255,255,255,.018));
  box-shadow:inset 0 0 0 1px rgba(149,216,30,.035);
}

.server-stat-icon{
  width:clamp(42px,3.4vw,54px);
  height:clamp(42px,3.4vw,54px);
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border-radius:10px;
  color:var(--green);
  font-family:"Rajdhani",Inter,sans-serif;
  font-size:clamp(23px,1.2vw + 10px,31px);
  font-weight:600;
  line-height:1;
  background:
    linear-gradient(145deg,rgba(149,216,30,.10),rgba(149,216,30,.025));
  border:1px solid rgba(149,216,30,.13);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 0 22px rgba(149,216,30,.04);
  text-shadow:0 0 14px rgba(149,216,30,.28);
}

.server-stat-content{
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.server-stat-label{
  display:block;
  margin-bottom:clamp(4px,.3vw,6px);
  color:rgba(167,226,54,.72);
  font-size:clamp(.48rem,.19vw + .43rem,.64rem);
  font-weight:800;
  line-height:1.1;
  letter-spacing:clamp(.07em,.09vw,.15em);
  text-transform:uppercase;
  white-space:nowrap;
}

.server-stat-value{
  display:block;
  color:#f5f8f4;
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:clamp(.84rem,.34vw + .72rem,1.08rem);
  font-weight:750;
  line-height:1.2;
  letter-spacing:-.02em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.server-stat-desc{
  display:block;
  margin-top:clamp(4px,.26vw,6px);
  color:#8c9690;
  font-size:clamp(.61rem,.18vw + .56rem,.76rem);
  font-weight:450;
  line-height:1.35;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

@media(max-width:900px){
  .server-stats{
    width:min(760px,96vw);
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .server-stat:nth-child(2):after{
    display:none;
  }

  .server-stat:nth-child(-n+2){
    border-bottom:1px solid rgba(255,255,255,.065);
  }
}

@media(max-width:520px){
  .server-stats{
    width:100%;
    grid-template-columns:1fr;
    padding:6px;
    margin-top:24px;
  }

  .server-stat{
    min-height:76px;
    padding:12px 13px;
  }

  .server-stat:not(:last-child):after{
    display:none;
  }

  .server-stat:not(:last-child){
    border-bottom:1px solid rgba(255,255,255,.065);
  }

  .server-stat:nth-child(-n+2){
    border-bottom:1px solid rgba(255,255,255,.065);
  }

  .server-stat-value,
  .server-stat-desc{
    white-space:normal;
    overflow:visible;
  }
}

@media(min-width:1600px){
  .server-stats{
    width:min(1180px,92vw);
  }

  .server-stat{
    min-height:88px;
  }
}

.alerts{
  position:fixed;z-index:100;right:22px;top:104px;display:flex;flex-direction:column;gap:10px;
  width:min(390px,calc(100vw - 28px));pointer-events:none;
}
.alert{
  display:flex;gap:12px;align-items:flex-start;padding:14px 16px;
  border:1px solid rgba(255,255,255,.13);border-radius:8px;
  background:linear-gradient(160deg,rgba(14,20,21,.97),rgba(6,10,11,.97));
  backdrop-filter:blur(16px);box-shadow:0 18px 45px rgba(0,0,0,.42);
  transform:translateX(115%);opacity:0;animation:alertIn .3s cubic-bezier(.2,.8,.2,1) forwards;
}
.alert:after{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;border-radius:8px 0 0 8px}
.alert.success:after{background:var(--green)}.alert.error:after{background:var(--danger)}
.alert.out{animation:alertOut .28s ease forwards}
.alert-icon{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;flex:0 0 28px;font-weight:900}
.alert.success .alert-icon{background:rgba(149,216,30,.13);color:var(--green-hi)}
.alert.error .alert-icon{background:rgba(255,92,101,.12);color:#ff7a81}
.alert strong{display:block;font-size:12px;margin:1px 0 4px}.alert span{display:block;font-size:10px;color:#9aa49e;line-height:1.5}
@keyframes alertIn{to{transform:translateX(0);opacity:1}}@keyframes alertOut{to{transform:translateX(115%);opacity:0}}

.modal{position:fixed;inset:0;z-index:40;display:none;place-items:center;background:rgba(0,0,0,.68);padding:20px;backdrop-filter:blur(5px)}
.modal.show{display:grid}.modalbox{position:relative;width:min(430px,94vw);padding:31px;border-radius:9px}
.modalbox #close{position:absolute;right:13px;top:9px;background:none;border:0;color:#fff;font-size:26px;cursor:pointer}
.modalbox h2{margin:4px 0 7px;font:700 30px/1 Rajdhani,sans-serif}.modalbox p{color:#919b95;font-size:11px}
.modalbox input{width:100%;height:52px;margin:12px 0 15px;padding:0 14px;background:rgba(0,0,0,.3);border:1px solid var(--line);border-radius:6px;color:#fff;outline:0}

body.light{--top:rgba(10,15,16,.84);--bgBright:.88}
body.light .veil{background:radial-gradient(circle at 50% 42%,rgba(255,255,255,.02),rgba(0,0,0,.18) 78%)}

@media(max-width:1180px){
  .topbar{grid-template-columns:auto 1fr auto;gap:18px;padding:0 24px}
  nav{gap:18px}.online{display:none}
}
@media(max-width:980px){
  nav{
    position:absolute;left:0;right:0;top:86px;height:auto;display:none;flex-direction:column;gap:0;
    padding:12px 22px;background:rgba(5,9,10,.98);border-top:1px solid var(--line)
  }
  nav.open{display:flex}nav a{height:44px}nav a.active:after{display:none}.menuBtn{display:block}
}
@media(max-width:700px){
  .topbar{height:72px;padding:0 14px}.brand-x{font-size:47px}.brand-copy strong{font-size:22px}.brand-copy small{font-size:9px}
  .play{display:none}.theme{width:42px}.hero{min-height:calc(100vh - 72px);padding:22px 13px 26px}
  .auth{padding:0 20px 24px}.terminal-line{margin:0 -20px;padding:0 15px}.auth-heading{padding-top:21px}.auth-heading h1{font-size:30px}
  
  .alerts{top:84px;right:14px}.logged-card{padding:34px 23px 28px}
}
@media(max-width:480px){
  .social{grid-template-columns:1fr}
  .auth-shell{width:100%}.auth{border-radius:8px}.auth-heading p{font-size:10px}.row{gap:10px}.logged-card h1{font-size:35px}
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}


/* =========================================================
   X-SITES UI V3 — responsive type, premium auth, alerts
   ========================================================= */
html{
  font-size:clamp(14px,0.24vw + 13.1px,17px);
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  font-synthesis:none;
}
body,button,input{
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  font-kerning:normal;
}
body{letter-spacing:-.008em}
button,input{letter-spacing:normal}

.auth-shell{width:min(34.5rem,95vw)}
.auth{
  padding-inline:clamp(1.3rem,4vw,2.5rem);
  padding-bottom:clamp(1.5rem,3vw,2.2rem);
  border-color:rgba(255,255,255,.145);
  background:
    radial-gradient(circle at 50% -14%,rgba(149,216,30,.09),transparent 34%),
    linear-gradient(155deg,rgba(18,27,29,.95),rgba(6,10,12,.96));
  box-shadow:
    0 34px 105px rgba(0,0,0,.58),
    inset 0 1px 0 rgba(255,255,255,.045),
    inset 0 0 65px rgba(149,216,30,.018);
}
.auth-glow{
  inset:-4.2rem;
  opacity:.62;
  filter:blur(34px);
  background:
    radial-gradient(circle at 50% 27%,rgba(149,216,30,.20),transparent 36%),
    radial-gradient(circle at 50% 76%,rgba(57,98,16,.10),transparent 44%);
}
.frame-corner{position:absolute;z-index:3;width:1.35rem;height:1.35rem;pointer-events:none;opacity:.55}
.frame-corner:before,.frame-corner:after{content:"";position:absolute;background:var(--green)}
.frame-corner:before{width:100%;height:1px}.frame-corner:after{width:1px;height:100%}
.frame-corner--tl{left:.55rem;top:.55rem}.frame-corner--tl:before,.frame-corner--tl:after{left:0;top:0}
.frame-corner--tr{right:.55rem;top:.55rem;transform:scaleX(-1)}.frame-corner--tr:before,.frame-corner--tr:after{left:0;top:0}
.frame-corner--bl{left:.55rem;bottom:.55rem;transform:scaleY(-1)}.frame-corner--bl:before,.frame-corner--bl:after{left:0;top:0}
.frame-corner--br{right:.55rem;bottom:.55rem;transform:scale(-1)}.frame-corner--br:before,.frame-corner--br:after{left:0;top:0}

.terminal-line{
  height:clamp(2.55rem,5.3vw,2.9rem);
  margin-inline:calc(-1 * clamp(1.3rem,4vw,2.5rem));
  padding-inline:clamp(1rem,3vw,1.5rem);
  font-size:clamp(.52rem,.35vw + .48rem,.62rem);
}
.terminal-line strong{font-size:inherit}
.auth-heading{padding:clamp(1.25rem,3vw,1.75rem) .25rem clamp(1rem,2.4vw,1.35rem)}
.eyebrow{font-size:clamp(.52rem,.35vw + .48rem,.62rem);letter-spacing:.18em}
.auth-heading h1{font-size:clamp(2rem,4.6vw,2.65rem);letter-spacing:.025em}
.auth-heading p{max-width:27rem;font-size:clamp(.7rem,.45vw + .62rem,.82rem);line-height:1.62}
.security-strip{
  margin:1rem auto 0;display:flex;justify-content:center;align-items:center;gap:clamp(.55rem,2.4vw,1.05rem);
  flex-wrap:wrap;color:#657069;font-size:clamp(.47rem,.3vw + .43rem,.56rem);font-weight:800;letter-spacing:.11em
}
.security-strip span{display:flex;align-items:center;gap:.38rem;white-space:nowrap}
.security-strip i{width:.32rem;height:.32rem;border-radius:50%;background:var(--green);box-shadow:0 0 .55rem rgba(149,216,30,.8)}

.tabs{margin-bottom:clamp(1rem,2.7vw,1.35rem);padding:.25rem;border-radius:.55rem}
.tab{height:clamp(2.55rem,6vw,2.95rem);font-size:clamp(.66rem,.38vw + .61rem,.76rem);letter-spacing:.065em}
.field{
  height:clamp(3.8rem,8vw,4.25rem);
  margin-bottom:clamp(.65rem,1.8vw,.8rem);
  border-radius:.55rem;
}
.field-symbol{width:clamp(3.3rem,7vw,3.8rem);flex-basis:clamp(3.3rem,7vw,3.8rem)}
.field-symbol svg{width:clamp(1.15rem,2.8vw,1.32rem);height:clamp(1.15rem,2.8vw,1.32rem)}
.field-content{padding-inline:clamp(.75rem,2vw,.95rem)}
.field-content small{font-size:clamp(.5rem,.32vw + .46rem,.59rem);letter-spacing:.13em}
.field input{font-size:clamp(.78rem,.48vw + .7rem,.9rem);line-height:1.35}
.eye{width:clamp(2.8rem,6vw,3.15rem);font-size:clamp(.85rem,1.7vw,1rem)}
.row{font-size:clamp(.62rem,.4vw + .56rem,.72rem);margin-bottom:clamp(1rem,2.8vw,1.3rem)}
.link{font-size:inherit}
.primary{height:clamp(3rem,7vw,3.45rem);font-size:clamp(.7rem,.42vw + .64rem,.8rem)}
.or,.register-or{font-size:clamp(.5rem,.3vw + .46rem,.58rem);letter-spacing:.12em}
.social-btn{min-height:clamp(3.7rem,8vw,4.15rem)}
.provider-copy small{font-size:clamp(.48rem,.24vw + .45rem,.54rem)}
.provider-copy strong{font-size:clamp(.67rem,.35vw + .62rem,.76rem)}
.secure-note p{font-size:clamp(.56rem,.32vw + .51rem,.64rem)}
.terms{font-size:clamp(.62rem,.4vw + .56rem,.72rem)}

/* Premium checkbox */
.premium-check{position:relative;display:inline-flex;align-items:center;gap:.62rem;cursor:pointer;user-select:none}
.premium-check input{
  position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;
  pointer-events:none!important;margin:0!important
}
.check-ui{
  position:relative;width:1.2rem;height:1.2rem;flex:0 0 1.2rem;border-radius:.32rem;
  display:grid;place-items:center;border:1px solid rgba(255,255,255,.16);
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.015));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 5px 13px rgba(0,0,0,.16);
  transition:.18s ease
}
.check-ui:before{
  content:"";position:absolute;inset:2px;border-radius:.2rem;
  background:linear-gradient(145deg,var(--green-hi),#73ad13);
  transform:scale(.25);opacity:0;transition:.18s cubic-bezier(.2,.8,.2,1)
}
.check-ui svg{position:relative;z-index:2;width:.72rem;height:.72rem;fill:none;stroke:#0a1105;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;opacity:0;transform:scale(.55);transition:.18s ease}
.premium-check:hover .check-ui{border-color:rgba(149,216,30,.38);box-shadow:0 0 0 3px rgba(149,216,30,.04)}
.premium-check input:focus-visible + .check-ui{outline:2px solid rgba(149,216,30,.55);outline-offset:3px}
.premium-check input:checked + .check-ui{border-color:rgba(149,216,30,.62);box-shadow:0 0 16px rgba(149,216,30,.13)}
.premium-check input:checked + .check-ui:before{transform:scale(1);opacity:1}
.premium-check input:checked + .check-ui svg{opacity:1;transform:scale(1)}
.check-label{color:#aeb7b2;line-height:1.35}

/* Alert lifecycle progress */
.alert{position:relative;overflow:hidden;padding-bottom:1.02rem;pointer-events:auto}
.alert-progress{
  position:absolute;left:0;right:0;bottom:0;height:3px;transform-origin:left center;
  background:linear-gradient(90deg,var(--green-dark),var(--green-hi));
  box-shadow:0 0 13px rgba(149,216,30,.48);
  animation:alertCountdown var(--alert-duration,4300ms) linear forwards
}
.alert.error .alert-progress{
  background:linear-gradient(90deg,#aa3038,#ff7a81);
  box-shadow:0 0 13px rgba(255,92,101,.38)
}
@keyframes alertCountdown{from{transform:scaleX(1)}to{transform:scaleX(0)}}

/* More fluid top navigation */
nav a{font-size:clamp(.68rem,.32vw + .62rem,.78rem)}
.online{font-size:clamp(.67rem,.3vw + .62rem,.76rem)}
.play{font-size:clamp(.68rem,.3vw + .63rem,.77rem)}
.brand-copy strong{font-size:clamp(1.42rem,2.1vw,1.75rem)}
.brand-copy small{font-size:clamp(.54rem,.28vw + .5rem,.64rem)}

/* System-driven light mode remains cinematic, not washed out */
body.light{--bgBright:.9;--top:rgba(12,18,19,.80)}
body.light .bg{filter:brightness(var(--bgBright)) saturate(.94) contrast(1.01)}
body.light .veil{
  background:radial-gradient(circle at 50% 42%,rgba(255,255,255,.035),rgba(0,0,0,.15) 76%),linear-gradient(180deg,rgba(255,255,255,.025),rgba(0,0,0,.11))
}
body.light .auth{background:radial-gradient(circle at 50% -12%,rgba(166,226,50,.09),transparent 34%),linear-gradient(155deg,rgba(25,34,35,.89),rgba(10,15,16,.91))}

@media(max-width:700px){
  .security-strip span:nth-child(2){display:none}
  .auth-glow{inset:-2.2rem}
  .row{align-items:flex-start}
  .premium-check{gap:.52rem}
}
@media(max-width:420px){
  .security-strip{gap:.55rem}
  .security-strip span:last-child{display:none}
  .row{flex-direction:column;gap:.6rem}
  .link{align-self:flex-end}
}

/* Theme can be applied before body paints. */
html[data-theme="light"] body{--bgBright:.9;--top:rgba(12,18,19,.80)}
html[data-theme="light"] .bg{filter:brightness(var(--bgBright)) saturate(.94) contrast(1.01)}
html[data-theme="light"] .veil{background:radial-gradient(circle at 50% 42%,rgba(255,255,255,.035),rgba(0,0,0,.15) 76%),linear-gradient(180deg,rgba(255,255,255,.025),rgba(0,0,0,.11))}
html[data-theme="light"] .auth{background:radial-gradient(circle at 50% -12%,rgba(166,226,50,.09),transparent 34%),linear-gradient(155deg,rgba(25,34,35,.89),rgba(10,15,16,.91))}


/* =========================================================
   V9 TOPBAR + PLAY CTA
   ========================================================= */

.topbar{
  grid-template-columns:auto 1fr!important;
}

.actions{
  justify-self:end;
  gap:clamp(12px,1.5vw,24px);
}

.menuBtn{display:none!important}

.play{
  --play-green:#b7ff28;
  min-width:clamp(230px,20vw,320px);
  min-height:58px;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:8px 18px;
  border:1px solid rgba(183,255,40,.48);
  border-radius:10px;
  color:#0b1304;
  background:
    linear-gradient(180deg,#c5ff3d 0%,#92dd12 52%,#68ad08 100%);
  box-shadow:
    0 0 0 1px rgba(183,255,40,.12),
    0 0 28px rgba(149,216,30,.26),
    0 9px 25px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.52);
  transform:translateZ(0);
  cursor:pointer;
}

.play:not(:disabled){
  animation:playBreath 2.2s ease-in-out infinite;
}

.play:not(:disabled)::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:-65% -35%;
  background:linear-gradient(110deg,transparent 38%,rgba(255,255,255,.8) 48%,transparent 58%);
  transform:translateX(-55%) rotate(4deg);
  animation:playSweep 2.7s ease-in-out infinite;
}

.play:not(:disabled)::after{
  content:"";
  position:absolute;
  inset:3px;
  z-index:-1;
  border-radius:7px;
  border:1px solid rgba(255,255,255,.27);
  pointer-events:none;
}

.play-energy{
  position:absolute;
  inset:0;
  z-index:-2;
  background:
    radial-gradient(circle at 18% 50%,rgba(255,255,255,.27),transparent 21%),
    radial-gradient(circle at 82% 50%,rgba(255,255,255,.23),transparent 19%);
}

.play-copy{
  display:flex;
  flex-direction:column;
  align-items:center;
  min-width:0;
  line-height:1;
}

.play-copy strong{
  font:800 clamp(1rem,.55vw + .84rem,1.35rem)/1 Rajdhani,sans-serif;
  letter-spacing:.06em;
}

.play-copy small{
  max-width:220px;
  margin-top:4px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:clamp(.42rem,.07vw + .4rem,.5rem);
  font-weight:850;
  letter-spacing:.085em;
  opacity:.73;
}

.play-chevrons{
  font:800 clamp(.85rem,.35vw + .75rem,1.05rem)/1 Rajdhani,sans-serif;
  letter-spacing:-.15em;
  animation:chevronPulse .8s ease-in-out infinite alternate;
}

.play-locked,
.play:disabled{
  cursor:not-allowed;
  color:#737b73;
  border-color:rgba(255,255,255,.075);
  background:linear-gradient(180deg,#202723,#151a17);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 8px 22px rgba(0,0,0,.24);
  filter:saturate(.2);
  animation:none!important;
}

.play:disabled .play-chevrons{
  color:#59615b;
  animation:none;
}

.play-ready .play-copy strong{
  text-shadow:0 1px 0 rgba(255,255,255,.25);
}

@keyframes playBreath{
  0%,100%{transform:translateY(0) scale(1);box-shadow:0 0 0 1px rgba(183,255,40,.12),0 0 22px rgba(149,216,30,.22),0 9px 25px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.52)}
  50%{transform:translateY(-1px) scale(1.018);box-shadow:0 0 0 1px rgba(183,255,40,.19),0 0 42px rgba(149,216,30,.38),0 12px 30px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.58)}
}

@keyframes playSweep{
  0%,42%{transform:translateX(-58%) rotate(4deg)}
  76%,100%{transform:translateX(58%) rotate(4deg)}
}

@keyframes chevronPulse{
  from{transform:translateX(-2px);opacity:.6}
  to{transform:translateX(2px);opacity:1}
}

.play-chevrons-left{
  animation-direction:alternate-reverse;
}

/* =========================================================
   V9 PROFILE PORTAL TOOLS
   ========================================================= */

.portal-tool-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}

.profile-tool{
  position:relative;
}

.tool-badge{
  min-width:18px;
  height:18px;
  display:inline-grid;
  place-items:center;
  margin-left:auto;
  padding:0 5px;
  border-radius:99px;
  color:#0d1406;
  background:var(--green);
  font-size:.46rem;
  font-weight:900;
}

.tool-badge.hidden{display:none}

/* =========================================================
   V9 PORTAL WORKSPACES
   ========================================================= */

.portal-workspace{
  width:min(1120px,96vw);
  min-height:min(690px,calc(100vh - 150px));
  position:relative;
  overflow:hidden;
  border-radius:14px;
  background:
    radial-gradient(circle at 0 0,rgba(149,216,30,.045),transparent 24%),
    linear-gradient(150deg,rgba(13,20,23,.975),rgba(5,9,11,.988));
  border:1px solid rgba(255,255,255,.095);
  box-shadow:0 30px 90px rgba(0,0,0,.48);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

.workspace-header{
  min-height:92px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:clamp(17px,2vw,25px);
  border-bottom:1px solid rgba(255,255,255,.065);
}

.workspace-title{
  min-width:0;
  display:flex;
  align-items:center;
  gap:13px;
}

.workspace-title>div{min-width:0}

.workspace-title span,
.workspace-section-label,
.dialog-head span{
  display:block;
  color:#68736c;
  font-size:clamp(.43rem,.07vw + .41rem,.5rem);
  font-weight:850;
  letter-spacing:.13em;
}

.workspace-title h2{
  margin:3px 0 0;
  color:#f4f8f1;
  font:750 clamp(1.35rem,.75vw + 1rem,1.9rem)/1 Rajdhani,sans-serif;
}

.workspace-title p{
  margin:4px 0 0;
  color:#707b74;
  font-size:clamp(.55rem,.1vw + .52rem,.64rem);
  line-height:1.45;
}

.workspace-back,
.thread-back{
  min-height:35px;
  border-radius:7px;
  border:1px solid rgba(255,255,255,.065);
  background:rgba(255,255,255,.018);
  color:#87918b;
  cursor:pointer;
}

.workspace-back{
  width:35px;
  flex:0 0 35px;
  font-size:1rem;
}

.thread-back{
  padding:0 10px;
  font-size:.5rem;
  font-weight:850;
  letter-spacing:.07em;
}

.workspace-back:hover,
.thread-back:hover{
  color:#dff3bd;
  border-color:rgba(149,216,30,.15);
  background:rgba(149,216,30,.035);
}

.workspace-primary{
  min-height:38px;
  padding:0 14px;
  border-radius:7px;
  border:1px solid rgba(149,216,30,.2);
  background:linear-gradient(180deg,rgba(149,216,30,.17),rgba(149,216,30,.09));
  color:#bfe572;
  font-size:clamp(.48rem,.08vw + .46rem,.56rem);
  font-weight:850;
  letter-spacing:.075em;
  cursor:pointer;
}

.workspace-primary:hover{
  border-color:rgba(149,216,30,.34);
  background:linear-gradient(180deg,rgba(149,216,30,.25),rgba(149,216,30,.12));
}

.workspace-empty{
  padding:28px 16px;
  color:#657069;
  text-align:center;
  font-size:clamp(.56rem,.1vw + .53rem,.65rem);
  line-height:1.5;
}

/* FORUM */

.forum-browser{
  min-height:590px;
  display:grid;
  grid-template-columns:220px minmax(0,1fr);
}

.forum-sidebar{
  padding:16px;
  border-right:1px solid rgba(255,255,255,.055);
  background:rgba(0,0,0,.1);
}

.forum-categories{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-top:11px;
}

.forum-category{
  width:100%;
  min-height:53px;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  padding:8px;
  border-radius:8px;
  border:1px solid transparent;
  background:transparent;
  color:#7a857e;
  text-align:left;
  cursor:pointer;
  transition:.18s ease;
}

.forum-category:hover,
.forum-category.active{
  color:#dcebd0;
  border-color:rgba(149,216,30,.1);
  background:rgba(149,216,30,.035);
}

.forum-category-icon{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:8px;
  color:#9bc94a;
  background:rgba(149,216,30,.05);
  border:1px solid rgba(149,216,30,.08);
  font-size:.8rem;
}

.forum-category strong,
.forum-category small{
  display:block;
}

.forum-category strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:inherit;
  font-size:clamp(.54rem,.1vw + .51rem,.63rem);
}

.forum-category small{
  margin-top:3px;
  color:#5f6963;
  font-size:clamp(.44rem,.07vw + .42rem,.51rem);
}

.forum-category-count{
  min-width:22px;
  height:20px;
  display:grid;
  place-items:center;
  padding:0 5px;
  border-radius:99px;
  color:#728078;
  background:rgba(255,255,255,.03);
  font-size:.44rem;
  font-weight:800;
}

.forum-main{
  min-width:0;
  padding:16px;
}

.forum-toolbar{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  margin-bottom:12px;
}

.workspace-search{
  height:39px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 11px;
  border-radius:7px;
  border:1px solid rgba(255,255,255,.065);
  background:rgba(0,0,0,.15);
}

.workspace-search>span{
  color:#68736c;
  font-size:.8rem;
}

.workspace-search input{
  min-width:0;
  width:100%;
  height:100%;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:#e4eae2;
  font-size:clamp(.58rem,.12vw + .55rem,.67rem);
}

.workspace-search input::placeholder{color:#5f6963}

.forum-current-category{
  color:#6e7972;
  font-size:clamp(.46rem,.08vw + .44rem,.54rem);
  font-weight:850;
  letter-spacing:.08em;
}

.forum-table-head{
  min-height:30px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 85px 105px;
  align-items:center;
  padding:0 11px;
  color:#59645d;
  font-size:clamp(.42rem,.07vw + .4rem,.49rem);
  font-weight:850;
  letter-spacing:.09em;
}

.forum-thread-list{
  display:flex;
  flex-direction:column;
  gap:5px;
}

.forum-thread{
  min-height:67px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 85px 105px;
  align-items:center;
  gap:0;
  padding:9px 11px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.05);
  background:rgba(255,255,255,.012);
  cursor:pointer;
  transition:.18s ease;
}

.forum-thread:hover{
  transform:translateX(2px);
  border-color:rgba(149,216,30,.12);
  background:rgba(149,216,30,.022);
}

.forum-thread-main{
  min-width:0;
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  align-items:center;
  gap:10px;
}

.forum-thread-main img,
.thread-avatar,
.reply-avatar,
.search-user-avatar,
.conversation-avatar,
.chat-user img{
  object-fit:cover;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.08);
  background:#101615;
}

.forum-thread-main img{
  width:42px;
  height:42px;
}

.forum-thread-title{
  min-width:0;
}

.forum-thread-title strong,
.forum-thread-title small{
  display:block;
}

.forum-thread-title strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#e4eae2;
  font-size:clamp(.63rem,.15vw + .59rem,.73rem);
}

.forum-thread-title small{
  margin-top:4px;
  color:#626d66;
  font-size:clamp(.46rem,.08vw + .44rem,.54rem);
}

.forum-thread-stat{
  color:#758078;
  font-size:clamp(.5rem,.09vw + .48rem,.58rem);
}

.forum-thread-stat.activity{color:#71866a}

/* Thread detail */
.forum-thread-detail{
  min-height:590px;
  padding:clamp(17px,2vw,24px);
  overflow:auto;
}

.thread-detail-head{
  padding-bottom:14px;
  border-bottom:1px solid rgba(255,255,255,.06);
}

.thread-detail-head>span{
  display:block;
  margin-top:12px;
  color:var(--green);
  font-size:.47rem;
  font-weight:850;
  letter-spacing:.1em;
}

.thread-detail-head h3{
  margin:4px 0 0;
  color:#f2f6ef;
  font:700 clamp(1.35rem,.85vw + .98rem,2rem)/1.08 Rajdhani,sans-serif;
}

.thread-origin,
.thread-reply{
  display:grid;
  grid-template-columns:56px minmax(0,1fr);
  gap:13px;
  margin-top:12px;
  padding:14px;
  border-radius:9px;
  border:1px solid rgba(255,255,255,.055);
  background:rgba(255,255,255,.014);
}

.thread-origin{
  border-color:rgba(149,216,30,.09);
  background:rgba(149,216,30,.02);
}

.thread-avatar,
.reply-avatar{
  width:52px;
  height:52px;
}

.thread-post-head{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:7px;
}

.thread-post-head strong{
  color:#dfe7dc;
  font-size:clamp(.62rem,.14vw + .59rem,.72rem);
}

.thread-post-head time{
  color:#59645d;
  font-size:clamp(.45rem,.07vw + .43rem,.52rem);
}

.thread-post-body{
  color:#a3ada6;
  font-size:clamp(.59rem,.13vw + .56rem,.68rem);
  line-height:1.62;
  word-break:break-word;
}

.thread-replies{
  display:flex;
  flex-direction:column;
}

.thread-reply-form{
  margin-top:15px;
  padding-top:15px;
  border-top:1px solid rgba(255,255,255,.06);
}

.thread-reply-form label>span,
.workspace-form label>span{
  display:block;
  margin-bottom:6px;
  color:#646f68;
  font-size:clamp(.44rem,.07vw + .42rem,.51rem);
  font-weight:850;
  letter-spacing:.1em;
}

.thread-reply-form textarea,
.workspace-form textarea,
.workspace-form input,
.workspace-form select{
  width:100%;
  outline:0;
  border-radius:7px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(0,0,0,.18);
  color:#e8eee6;
  font-size:clamp(.6rem,.13vw + .57rem,.7rem);
}

.thread-reply-form textarea,
.workspace-form textarea{
  min-height:110px;
  resize:vertical;
  padding:11px 12px;
  line-height:1.5;
}

.thread-reply-form button{
  min-height:38px;
  margin-top:9px;
  padding:0 14px;
  border-radius:6px;
  border:1px solid rgba(149,216,30,.18);
  background:rgba(149,216,30,.08);
  color:#b9e06e;
  font-size:.52rem;
  font-weight:850;
  letter-spacing:.07em;
  cursor:pointer;
}

/* Dialog */
.workspace-dialog{
  position:absolute;
  inset:0;
  z-index:10;
  display:grid;
  place-items:center;
  padding:18px;
  background:rgba(1,4,5,.72);
  backdrop-filter:blur(8px);
}

.workspace-dialog-card{
  width:min(570px,95%);
  padding:18px;
  border-radius:11px;
  border:1px solid rgba(255,255,255,.1);
  background:linear-gradient(150deg,#11191b,#080d0f);
  box-shadow:0 25px 70px rgba(0,0,0,.5);
}

.dialog-head{
  display:flex;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}

.dialog-head h3{
  margin:3px 0 0;
  color:#eef4ec;
  font:700 1.35rem/1 Rajdhani,sans-serif;
}

.dialog-head button{
  width:33px;
  height:33px;
  border-radius:7px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.02);
  color:#8a948e;
  font-size:1.2rem;
  cursor:pointer;
}

.workspace-form{
  display:flex;
  flex-direction:column;
  gap:11px;
}

.workspace-form input,
.workspace-form select{
  height:43px;
  padding:0 11px;
}

.workspace-form select{
  color-scheme:dark;
}

/* MESSAGES */

.messages-layout{
  min-height:590px;
  display:grid;
  grid-template-columns:300px minmax(0,1fr);
}

.conversation-sidebar{
  min-width:0;
  position:relative;
  padding:14px;
  border-right:1px solid rgba(255,255,255,.055);
  background:rgba(0,0,0,.1);
}

.user-search-box{
  margin-bottom:13px;
}

.user-search-results{
  position:absolute;
  z-index:8;
  left:14px;
  right:14px;
  top:61px;
  max-height:285px;
  overflow:auto;
  padding:6px;
  border-radius:9px;
  border:1px solid rgba(255,255,255,.09);
  background:#0c1315;
  box-shadow:0 18px 45px rgba(0,0,0,.42);
}

.search-user{
  width:100%;
  min-height:54px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  padding:7px;
  border:0;
  border-radius:7px;
  background:transparent;
  color:#dce4da;
  text-align:left;
  cursor:pointer;
}

.search-user:hover{
  background:rgba(149,216,30,.035);
}

.search-user:disabled{
  cursor:not-allowed;
  opacity:.52;
}

.search-user-avatar{
  width:38px;
  height:38px;
}

.search-user strong,
.search-user small{
  display:block;
}

.search-user strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.62rem;
}

.search-user small{
  margin-top:3px;
  color:#69746d;
  font-size:.48rem;
}

.search-user-state{
  color:#829075;
  font-size:.44rem;
  font-weight:800;
}

.conversation-list{
  display:flex;
  flex-direction:column;
  gap:5px;
  margin-top:10px;
}

.conversation-item{
  width:100%;
  min-height:63px;
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  padding:8px;
  border-radius:8px;
  border:1px solid transparent;
  background:transparent;
  color:#dfe6dd;
  text-align:left;
  cursor:pointer;
}

.conversation-item:hover,
.conversation-item.active{
  border-color:rgba(149,216,30,.09);
  background:rgba(149,216,30,.03);
}

.conversation-avatar{
  width:42px;
  height:42px;
}

.conversation-copy{
  min-width:0;
}

.conversation-copy strong,
.conversation-copy small{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.conversation-copy strong{
  font-size:.61rem;
}

.conversation-copy small{
  margin-top:4px;
  color:#657069;
  font-size:.47rem;
}

.conversation-time{
  color:#59645d;
  font-size:.43rem;
}

.chat-panel{
  min-width:0;
  min-height:590px;
  display:flex;
  flex-direction:column;
}

.chat-placeholder{
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  color:#5f6963;
  text-align:center;
}

.chat-placeholder-icon{
  width:62px;
  height:62px;
  display:grid;
  place-items:center;
  margin-bottom:12px;
  border-radius:18px;
  color:#90bd45;
  border:1px solid rgba(149,216,30,.1);
  background:rgba(149,216,30,.035);
  font-size:1.35rem;
}

.chat-placeholder strong{
  color:#8e9992;
  font-size:.72rem;
  letter-spacing:.07em;
}

.chat-placeholder span{
  margin-top:5px;
  font-size:.55rem;
}

.chat-active{
  min-height:590px;
  flex:1;
  display:flex;
  flex-direction:column;
}

.chat-header{
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:11px 14px;
  border-bottom:1px solid rgba(255,255,255,.06);
}

.chat-user{
  min-width:0;
  display:flex;
  align-items:center;
  gap:10px;
}

.chat-user img{
  width:42px;
  height:42px;
}

.chat-user strong,
.chat-user span{
  display:block;
}

.chat-user strong{
  color:#e8eee6;
  font-size:.67rem;
}

.chat-user span{
  margin-top:3px;
  color:#6b766f;
  font-size:.49rem;
}

.chat-actions{
  display:flex;
  gap:6px;
}

.chat-actions button{
  min-height:31px;
  padding:0 9px;
  border-radius:6px;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.018);
  color:#758078;
  font-size:.45rem;
  font-weight:800;
  cursor:pointer;
}

.chat-actions button:hover{
  color:#e1e8df;
}

.chat-actions button.danger{
  color:#b87979;
  border-color:rgba(213,77,77,.1);
  background:rgba(213,77,77,.025);
}

.chat-stream{
  flex:1;
  min-height:0;
  max-height:455px;
  overflow:auto;
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:16px;
  scroll-behavior:smooth;
}

.chat-row{
  display:flex;
  align-items:flex-end;
  gap:7px;
}

.chat-row.mine{
  justify-content:flex-end;
}

.chat-bubble-avatar{
  width:28px;
  height:28px;
  flex:0 0 28px;
  object-fit:cover;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.07);
}

.chat-bubble-wrap{
  max-width:min(72%,560px);
}

.chat-bubble{
  padding:9px 11px;
  border-radius:12px 12px 12px 4px;
  color:#c8d0c7;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.055);
  font-size:clamp(.57rem,.11vw + .54rem,.66rem);
  line-height:1.48;
  word-break:break-word;
}

.chat-row.mine .chat-bubble{
  border-radius:12px 12px 4px 12px;
  color:#142007;
  background:linear-gradient(180deg,#a9e63c,#7eb61b);
  border-color:rgba(188,243,85,.26);
}

.chat-message-time{
  display:block;
  margin-top:3px;
  color:#59645d;
  font-size:.41rem;
}

.chat-row.mine .chat-message-time{
  text-align:right;
}

.chat-composer{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  padding:12px 14px;
  border-top:1px solid rgba(255,255,255,.06);
}

.chat-composer textarea{
  min-height:42px;
  max-height:120px;
  resize:none;
  padding:11px 12px;
  outline:0;
  border-radius:9px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(0,0,0,.18);
  color:#e6ece4;
  font-size:.62rem;
  line-height:1.4;
}

.chat-composer button{
  min-height:42px;
  padding:0 13px;
  border-radius:8px;
  border:1px solid rgba(149,216,30,.18);
  background:rgba(149,216,30,.08);
  color:#bce171;
  font-size:.49rem;
  font-weight:850;
  letter-spacing:.07em;
  cursor:pointer;
}

.chat-disabled{
  margin:0 14px 12px;
  padding:10px 12px;
  border-radius:7px;
  border:1px solid rgba(209,90,90,.1);
  background:rgba(209,90,90,.025);
  color:#a47676;
  font-size:.53rem;
  line-height:1.45;
}

/* Responsive */
@media(max-width:980px){
  .online{display:none}
  .play{min-width:220px}
  .forum-browser{grid-template-columns:190px minmax(0,1fr)}
  .messages-layout{grid-template-columns:265px minmax(0,1fr)}
}

@media(max-width:760px){
  .topbar{
    grid-template-columns:auto 1fr!important;
    padding-inline:14px!important;
  }

  .actions{
    gap:8px;
  }

  .theme{display:none}
  .play{min-width:180px;min-height:52px;padding-inline:12px}
  .play-chevrons{display:none}
  .play-copy small{max-width:150px}

  .portal-workspace{
    min-height:calc(100vh - 112px);
  }

  .forum-browser,
  .messages-layout{
    grid-template-columns:1fr;
  }

  .forum-sidebar{
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.055);
  }

  .forum-categories{
    flex-direction:row;
    overflow-x:auto;
  }

  .forum-category{
    min-width:180px;
  }

  .forum-table-head{
    grid-template-columns:minmax(0,1fr) 70px;
  }

  .forum-table-head span:nth-child(3){display:none}

  .forum-thread{
    grid-template-columns:minmax(0,1fr) 70px;
  }

  .forum-thread>.activity{display:none}

  .conversation-sidebar{
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.055);
  }

  .conversation-list{
    max-height:220px;
    overflow:auto;
  }

  .chat-panel,
  .chat-active{
    min-height:500px;
  }
}

@media(max-width:540px){
  .brand-copy small{display:none}
  .play{
    min-width:142px;
    min-height:48px;
  }
  .play-copy strong{font-size:.9rem}
  .play-copy small{max-width:128px;font-size:.38rem}

  .workspace-header{
    align-items:flex-start;
    flex-direction:column;
  }

  .workspace-primary{width:100%}
  .forum-toolbar{grid-template-columns:1fr}
  .forum-table-head{display:none}

  .forum-thread{
    grid-template-columns:1fr;
    gap:7px;
  }

  .forum-thread-stat{
    display:none;
  }

  .thread-origin,
  .thread-reply{
    grid-template-columns:40px minmax(0,1fr);
  }

  .thread-avatar,
  .reply-avatar{
    width:38px;
    height:38px;
  }

  .chat-header{
    align-items:flex-start;
    flex-direction:column;
  }

  .chat-actions{
    width:100%;
  }

  .chat-actions button{
    flex:1;
  }

  .chat-bubble-wrap{max-width:82%}
}

@media(prefers-reduced-motion:reduce){
  .play,
  .play::before,
  .play-chevrons{
    animation:none!important;
  }
}


/* =========================================================
   V10 — RED PREMIUM PORTAL
   Inspired by the approved X-Sites red dashboard direction
   ========================================================= */

:root{
  --xred:#ff304f;
  --xred-hot:#ff536e;
  --xred-deep:#a90d29;
  --xred-dark:#560816;
  --xpurple:#a44cff;
  --xgold:#ffbd35;
}

/* Overall atmosphere */
.veil{
  background:
    radial-gradient(circle at 50% 34%,rgba(115,5,31,.10),transparent 36%),
    linear-gradient(90deg,rgba(5,0,4,.30),transparent 30%,transparent 68%,rgba(12,0,6,.38)),
    linear-gradient(180deg,rgba(20,0,8,.05),rgba(0,0,0,.30));
}

.topbar{
  background:linear-gradient(180deg,rgba(8,8,14,.97),rgba(5,8,12,.93));
  border-bottom-color:rgba(255,48,79,.10);
}

.topbar:after{
  background:linear-gradient(90deg,transparent,rgba(255,48,79,.38),transparent);
}

.brand-x{
  color:var(--xred);
  text-shadow:0 0 24px rgba(255,48,79,.34);
}

.brand-copy small{color:#ffc42f}

/* Login / register now matches the red portal */
.auth{
  border-color:rgba(255,48,79,.12)!important;
  background:
    radial-gradient(circle at 10% 0%,rgba(255,48,79,.055),transparent 30%),
    linear-gradient(160deg,rgba(17,18,25,.96),rgba(7,10,14,.975))!important;
  box-shadow:0 28px 85px rgba(0,0,0,.48),0 0 0 1px rgba(255,48,79,.025);
}

.tab.active{color:#ff7085!important}
.tab.active:after{
  background:linear-gradient(90deg,var(--xred),var(--xred-hot))!important;
  box-shadow:0 0 16px rgba(255,48,79,.30);
}

.field:focus-within{
  border-color:rgba(255,48,79,.28)!important;
  box-shadow:0 0 0 3px rgba(255,48,79,.035)!important;
}

.field:focus-within .field-symbol,
.field:focus-within small{color:#ff6e83!important}

.primary{
  color:#fff!important;
  background:linear-gradient(180deg,var(--xred-hot),#d9193d)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    0 12px 30px rgba(221,25,61,.20)!important;
}

.primary:hover{
  filter:brightness(1.08);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.25),
    0 14px 36px rgba(255,48,79,.28)!important;
}

/* Main CTA - red, impossible to miss, but still disabled when logged out */
.play{
  --play-green:var(--xred);
  color:#fff;
  border-color:rgba(255,83,110,.64);
  background:
    linear-gradient(180deg,#ff5b73 0%,#f3264c 50%,#b9082a 100%);
  box-shadow:
    0 0 0 1px rgba(255,48,79,.14),
    0 0 32px rgba(255,48,79,.35),
    0 12px 30px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.42);
}

.play-energy{
  background:
    radial-gradient(circle at 15% 50%,rgba(255,210,220,.32),transparent 23%),
    radial-gradient(circle at 85% 50%,rgba(255,210,220,.26),transparent 21%),
    repeating-linear-gradient(115deg,transparent 0 18px,rgba(255,255,255,.025) 18px 19px);
}

.play-copy strong{
  text-shadow:0 0 14px rgba(255,255,255,.18),0 2px 2px rgba(80,0,18,.5);
}

.play:not(:disabled){
  animation:redPlayBreath 1.85s ease-in-out infinite;
}

.play:not(:disabled)::before{
  background:linear-gradient(110deg,transparent 36%,rgba(255,255,255,.88) 48%,transparent 60%);
}

.play-locked,
.play:disabled{
  color:#74747b;
  border-color:rgba(255,255,255,.07);
  background:linear-gradient(180deg,#25252c,#15161c);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 8px 22px rgba(0,0,0,.24);
  filter:saturate(.1);
}

@keyframes redPlayBreath{
  0%,100%{
    transform:translateY(0) scale(1);
    box-shadow:0 0 0 1px rgba(255,48,79,.15),0 0 26px rgba(255,48,79,.32),0 12px 30px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.42)
  }
  50%{
    transform:translateY(-2px) scale(1.025);
    box-shadow:0 0 0 1px rgba(255,83,110,.26),0 0 54px rgba(255,48,79,.52),0 16px 38px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.5)
  }
}

/* =========================================================
   V10 PLAYER HEADER
   ========================================================= */

.player-dashboard{
  width:min(1120px,96vw);
  gap:16px;
}

.player-core-red{
  display:block!important;
  overflow:hidden;
  padding:0!important;
  border-radius:15px;
  border:1px solid rgba(255,48,79,.12)!important;
  background:
    radial-gradient(circle at 13% 0%,rgba(255,48,79,.07),transparent 30%),
    radial-gradient(circle at 90% 0%,rgba(164,76,255,.045),transparent 26%),
    linear-gradient(150deg,rgba(14,18,25,.975),rgba(6,9,14,.987))!important;
  box-shadow:
    0 32px 90px rgba(0,0,0,.46),
    inset 0 1px 0 rgba(255,255,255,.026)!important;
}

.profile-hero-panel{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:clamp(18px,2.5vw,34px);
  padding:clamp(22px,2.5vw,32px);
  position:relative;
}

.profile-hero-panel::after{
  content:"";
  position:absolute;
  left:3%;
  right:3%;
  bottom:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,48,79,.14),rgba(255,255,255,.05),rgba(255,48,79,.14),transparent);
}

.profile-avatar-block{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:9px;
}

.red-avatar{
  width:clamp(96px,8vw,124px)!important;
  height:clamp(96px,8vw,124px)!important;
  border-radius:50%!important;
  padding:6px!important;
  border:2px solid rgba(255,48,79,.82)!important;
  background:#090d13!important;
  box-shadow:
    0 0 0 5px rgba(255,48,79,.055),
    0 0 28px rgba(255,48,79,.24),
    0 18px 40px rgba(0,0,0,.38)!important;
}

.red-avatar::before{
  content:"";
  position:absolute;
  inset:4px;
  border-radius:50%;
  border:1px solid rgba(255,189,53,.32);
  pointer-events:none;
  z-index:2;
}

.red-avatar img{
  border-radius:50%;
}

.avatar-state{
  display:flex;
  align-items:center;
  gap:6px;
  color:#6ee789;
  font-size:clamp(.46rem,.08vw + .44rem,.54rem);
  font-weight:850;
  letter-spacing:.09em;
}

.avatar-state i{
  width:6px;height:6px;border-radius:50%;
  background:#35db67;
  box-shadow:0 0 10px rgba(53,219,103,.75);
}

.profile-main-copy{min-width:0}

.profile-welcome-line{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:9px;
  margin-bottom:7px;
  color:#717987;
  font-size:clamp(.46rem,.08vw + .44rem,.54rem);
  font-weight:850;
  letter-spacing:.13em;
}

.provider-badge{
  color:#a68e94!important;
  border-color:rgba(255,48,79,.09)!important;
  background:rgba(255,48,79,.025)!important;
}

.profile-name-row{
  display:flex;
  align-items:center;
  gap:9px;
}

.profile-name-row h1{
  margin:0;
  color:#f8f5f6;
  font:750 clamp(2rem,1.65vw + 1.15rem,3.3rem)/.95 Rajdhani,sans-serif;
  letter-spacing:-.025em;
  overflow:hidden;
  text-overflow:ellipsis;
}

.verified-mark{
  width:22px;height:22px;
  display:grid;place-items:center;
  flex:0 0 22px;
  border-radius:50%;
  color:#081308;
  background:#5de46f;
  box-shadow:0 0 14px rgba(93,228,111,.25);
  font-size:.7rem;font-weight:900;
}

.profile-badges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
}

.membership.vip{
  color:#ffd36e!important;
  border-color:rgba(255,189,53,.16)!important;
  background:rgba(255,189,53,.045)!important;
}

.membership-dot{
  background:#ffc03a!important;
  box-shadow:0 0 10px rgba(255,192,58,.55)!important;
}

.evip-pill{
  color:#b992d9!important;
  border-color:rgba(164,76,255,.13)!important;
  background:rgba(164,76,255,.035)!important;
}

.evip-pill.active-status{
  color:#e3b7ff!important;
  border-color:rgba(164,76,255,.26)!important;
  background:rgba(164,76,255,.08)!important;
}

.profile-meta-strip{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:15px;
  max-width:620px;
}

.profile-meta-strip>div{
  min-width:0;
  padding:10px 11px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.055);
  background:rgba(255,255,255,.014);
}

.profile-meta-strip span{
  display:block;
  margin-bottom:5px;
  color:#616a76;
  font-size:clamp(.41rem,.07vw + .39rem,.48rem);
  font-weight:850;
  letter-spacing:.1em;
}

.profile-meta-strip strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#d8dde1;
  font-size:clamp(.56rem,.11vw + .53rem,.65rem);
}

.profile-resource-cards{
  min-width:245px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
}

.resource-card{
  min-width:0;
  min-height:78px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px;
  border-radius:11px;
  border:1px solid rgba(255,255,255,.06);
  background:linear-gradient(155deg,rgba(255,255,255,.025),rgba(255,255,255,.012));
}

.resource-card span{
  display:block;
  margin-bottom:3px;
  color:#68717d;
  font-size:.45rem;
  font-weight:850;
  letter-spacing:.1em;
}

.resource-card strong{
  display:block;
  color:#f2f4f5;
  font:750 clamp(1.2rem,.65vw + 1rem,1.6rem)/1 Rajdhani,sans-serif;
}

.resource-icon{
  width:38px;height:38px;
  flex:0 0 38px;
  display:grid;place-items:center;
  border-radius:50%;
  color:#271700;
  background:linear-gradient(145deg,#ffd85b,#e19b08);
  box-shadow:0 0 20px rgba(255,189,53,.16);
  font-weight:900;
}

.level-icon{
  color:#fff;
  background:linear-gradient(145deg,#c066ff,#7136d4);
  box-shadow:0 0 20px rgba(164,76,255,.16);
  font-size:.55rem;
}

/* XP line like the mockup */
.profile-xp-line{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:16px;
  padding:14px clamp(22px,2.5vw,32px);
  background:rgba(0,0,0,.13);
  border-bottom:1px solid rgba(255,255,255,.055);
}

.xp-line-label span,
.xp-reward-chip span{
  display:block;
  color:#626b76;
  font-size:.41rem;
  font-weight:850;
  letter-spacing:.1em;
}

.xp-line-label strong{
  display:block;
  margin-top:3px;
  color:#dfe2e5;
  font-size:.57rem;
}

.xp-line-track{
  height:8px;
  position:relative;
  overflow:hidden;
  border-radius:99px;
  border:1px solid rgba(255,255,255,.055);
  background:#171c25;
  box-shadow:inset 0 2px 4px rgba(0,0,0,.3);
}

.xp-line-fill{
  width:0%;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#c41034,var(--xred),#ff6a82);
  box-shadow:0 0 18px rgba(255,48,79,.36);
  transition:width .7s cubic-bezier(.2,.8,.2,1);
}

.xp-line-glow{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.13),transparent);
  transform:translateX(-100%);
  animation:redXpSweep 3.8s ease-in-out infinite;
}

@keyframes redXpSweep{
  0%,58%{transform:translateX(-100%)}
  84%,100%{transform:translateX(100%)}
}

.xp-line-caption{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-top:6px;
  color:#646e79;
  font-size:clamp(.43rem,.07vw + .41rem,.5rem);
  font-weight:750;
}

.xp-line-caption b{color:#aeb4bb}

.xp-reward-chip{
  min-width:92px;
  padding:8px 10px;
  text-align:center;
  border-radius:8px;
  border:1px solid rgba(255,189,53,.11);
  background:rgba(255,189,53,.03);
}

.xp-reward-chip strong{
  display:block;
  margin-top:3px;
  color:#ffc24b;
  font:750 .82rem/1 Rajdhani,sans-serif;
}

/* Internal portal nav */
.profile-nav-red{
  height:auto!important;
  display:flex!important;
  align-items:stretch!important;
  gap:0!important;
  padding:0 clamp(10px,2vw,24px);
  overflow-x:auto;
  background:rgba(4,7,12,.46);
  border-bottom:1px solid rgba(255,255,255,.055);
  scrollbar-width:none;
}

.profile-nav-red::-webkit-scrollbar{display:none}

.profile-nav-item{
  min-height:52px;
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  position:relative;
  padding:0 clamp(11px,1.35vw,18px);
  border:0;
  background:transparent;
  color:#717986;
  font-size:clamp(.48rem,.08vw + .46rem,.56rem);
  font-weight:850;
  letter-spacing:.07em;
  cursor:pointer;
  transition:.18s ease;
}

.profile-nav-item>span{
  color:#69717d;
  font-size:.68rem;
}

.profile-nav-item:hover,
.profile-nav-item.active{
  color:#ff697e;
  background:rgba(255,48,79,.025);
}

.profile-nav-item:hover>span,
.profile-nav-item.active>span{color:var(--xred)}

.profile-nav-item.active::after{
  content:"";
  position:absolute;
  left:18%;
  right:18%;
  bottom:0;
  height:2px;
  background:linear-gradient(90deg,var(--xred),var(--xred-hot));
  box-shadow:0 0 14px rgba(255,48,79,.4);
}

.logout-nav{margin-left:auto}

.nav-unread{
  min-width:18px;
  height:18px;
  display:grid;
  place-items:center;
  padding:0 5px;
  border-radius:99px;
  color:#fff;
  background:var(--xred);
  box-shadow:0 0 12px rgba(255,48,79,.28);
  font-size:.43rem;
}

/* Overview cards */
.profile-overview-red{
  display:grid;
  grid-template-columns:.9fr 1.15fr 1.05fr;
  gap:11px;
  padding:clamp(16px,2vw,23px);
}

.overview-card{
  min-width:0;
  border-radius:11px;
  padding:15px;
  border:1px solid rgba(255,255,255,.055);
  background:
    linear-gradient(155deg,rgba(255,255,255,.018),rgba(255,255,255,.008));
}

.overview-card-title{
  margin-bottom:12px;
}

.overview-card-title span,
.overview-card-title small{
  display:block;
}

.overview-card-title span{
  color:#dfe3e6;
  font-size:clamp(.58rem,.11vw + .55rem,.67rem);
  font-weight:850;
  letter-spacing:.06em;
}

.overview-card-title small{
  margin-top:3px;
  color:#606a75;
  font-size:clamp(.44rem,.07vw + .42rem,.51rem);
}

.progress-card{
  display:flex;
  flex-direction:column;
  align-items:center;
}

.progress-card .overview-card-title{
  width:100%;
}

.xp-reactor-red{
  width:clamp(130px,10vw,165px)!important;
  background:
    radial-gradient(circle at center,#0c1118 0 56%,transparent 57%),
    conic-gradient(
      from -90deg,
      var(--xred) 0deg,
      #ff667d var(--xp-progress),
      rgba(255,255,255,.06) var(--xp-progress),
      rgba(255,255,255,.06) 360deg
    )!important;
  box-shadow:
    0 0 0 1px rgba(255,48,79,.08),
    0 0 36px rgba(255,48,79,.07),
    inset 0 0 30px rgba(0,0,0,.32)!important;
}

.xp-reactor-red::after{border-color:rgba(255,48,79,.09)!important}
.xp-reactor-red small b{color:#ff7085!important}

.progress-bottom{
  width:100%;
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-top:12px;
  padding-top:11px;
  border-top:1px solid rgba(255,255,255,.055);
}

.progress-bottom span{
  color:#5f6873;
  font-size:.43rem;
  font-weight:850;
  letter-spacing:.08em;
}

.progress-bottom strong{
  color:#9ea5ac;
  font-size:.55rem;
}

.account-stat-list{
  display:flex;
  flex-direction:column;
  gap:7px;
}

.account-stat-list>div{
  min-height:39px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:0 10px;
  border-radius:7px;
  background:rgba(255,255,255,.012);
  border:1px solid rgba(255,255,255,.035);
}

.account-stat-list span{
  color:#69727d;
  font-size:clamp(.48rem,.08vw + .46rem,.55rem);
}

.account-stat-list strong{
  color:#d9dde0;
  font-size:clamp(.52rem,.09vw + .5rem,.6rem);
}

.red-vip-text{color:#ffbf45!important}

.quick-action-list{
  display:flex;
  flex-direction:column;
  gap:7px;
}

.quick-action{
  min-height:47px;
  display:grid;
  grid-template-columns:32px minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  padding:7px 9px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.045);
  background:rgba(255,255,255,.012);
  color:#818995;
  text-align:left;
  cursor:pointer;
  transition:.18s ease;
}

.quick-action:hover{
  transform:translateX(2px);
  color:#e7eaed;
  border-color:rgba(255,48,79,.11);
  background:rgba(255,48,79,.025);
}

.quick-action.primary-quick{
  border-color:rgba(255,48,79,.13);
  background:linear-gradient(90deg,rgba(255,48,79,.08),rgba(255,48,79,.02));
}

.quick-action.primary-quick .quick-icon{
  color:#fff;
  background:linear-gradient(145deg,var(--xred-hot),#c51035);
  border-color:rgba(255,83,110,.22);
  box-shadow:0 0 16px rgba(255,48,79,.12);
}

.quick-icon{
  width:32px;height:32px;
  display:grid;place-items:center;
  border-radius:8px;
  color:#c0c5ca;
  border:1px solid rgba(255,255,255,.055);
  background:rgba(255,255,255,.02);
}

.quick-action strong,
.quick-action small{
  display:block;
}

.quick-action strong{
  color:#dfe3e6;
  font-size:clamp(.51rem,.09vw + .49rem,.59rem);
}

.quick-action small{
  margin-top:3px;
  color:#626b76;
  font-size:clamp(.43rem,.07vw + .41rem,.5rem);
}

.quick-action>b{
  color:#7a838e;
  font-size:1rem;
}

/* =========================================================
   RED SHOP
   ========================================================= */

.yun-shop{
  border-color:rgba(255,48,79,.11)!important;
  background:
    radial-gradient(circle at 0 0,rgba(255,48,79,.045),transparent 26%),
    linear-gradient(155deg,rgba(14,18,25,.97),rgba(6,9,14,.985))!important;
}

.shop-kicker{color:#ff6178!important}

.shop-wallet{
  border-color:rgba(255,48,79,.10)!important;
  background:rgba(255,48,79,.025)!important;
}

.shop-wallet strong{color:#ff9dab!important}

.shop-filter:hover,
.shop-filter.active{
  color:#ff8a9a!important;
  border-color:rgba(255,48,79,.17)!important;
  background:rgba(255,48,79,.055)!important;
}

.shop-card:hover{
  border-color:rgba(255,48,79,.18)!important;
  box-shadow:0 18px 38px rgba(0,0,0,.24),0 0 24px rgba(255,48,79,.035)!important;
}

.shop-card.owned{border-color:rgba(255,48,79,.24)!important}

.shop-buy{
  color:#ff93a2!important;
  border-color:rgba(255,48,79,.18)!important;
  background:linear-gradient(180deg,rgba(255,48,79,.13),rgba(255,48,79,.065))!important;
}

.shop-buy:hover{
  color:#fff!important;
  border-color:rgba(255,48,79,.32)!important;
  background:linear-gradient(180deg,rgba(255,48,79,.25),rgba(255,48,79,.11))!important;
}

/* =========================================================
   RED FORUM
   ========================================================= */

.portal-workspace{
  border-color:rgba(255,48,79,.12)!important;
  background:
    radial-gradient(circle at 0 0,rgba(255,48,79,.05),transparent 25%),
    linear-gradient(150deg,rgba(13,17,24,.985),rgba(5,8,13,.99))!important;
}

.workspace-primary{
  color:#fff!important;
  border-color:rgba(255,48,79,.22)!important;
  background:linear-gradient(180deg,#ef3552,#b91435)!important;
  box-shadow:0 8px 20px rgba(255,48,79,.12);
}

.workspace-primary:hover{
  border-color:rgba(255,83,110,.4)!important;
  background:linear-gradient(180deg,#ff4a66,#cd173b)!important;
}

.workspace-back:hover,
.thread-back:hover{
  color:#ff8797!important;
  border-color:rgba(255,48,79,.15)!important;
  background:rgba(255,48,79,.035)!important;
}

.forum-category-icon{
  color:#ff6c81!important;
  background:rgba(255,48,79,.05)!important;
  border-color:rgba(255,48,79,.08)!important;
}

.forum-category:hover,
.forum-category.active{
  color:#f2dce0!important;
  border-color:rgba(255,48,79,.11)!important;
  background:rgba(255,48,79,.035)!important;
}

.forum-thread:hover{
  border-color:rgba(255,48,79,.12)!important;
  background:rgba(255,48,79,.025)!important;
}

.thread-detail-head>span{color:#ff6379!important}

.thread-origin{
  border-color:rgba(255,48,79,.1)!important;
  background:rgba(255,48,79,.02)!important;
}

.thread-reply-form button{
  color:#ff91a0!important;
  border-color:rgba(255,48,79,.18)!important;
  background:rgba(255,48,79,.07)!important;
}

.workspace-form input:focus,
.workspace-form textarea:focus,
.workspace-form select:focus,
.thread-reply-form textarea:focus{
  border-color:rgba(255,48,79,.25)!important;
  box-shadow:0 0 0 3px rgba(255,48,79,.035);
}

/* =========================================================
   RED DIRECT MESSAGES
   ========================================================= */

.search-user:hover,
.conversation-item:hover,
.conversation-item.active{
  border-color:rgba(255,48,79,.10)!important;
  background:rgba(255,48,79,.03)!important;
}

.chat-placeholder-icon{
  color:#ff7187!important;
  border-color:rgba(255,48,79,.10)!important;
  background:rgba(255,48,79,.035)!important;
}

.chat-row.mine .chat-bubble{
  color:#fff!important;
  background:linear-gradient(180deg,#f43b59,#bd1737)!important;
  border-color:rgba(255,93,116,.28)!important;
  box-shadow:0 8px 20px rgba(255,48,79,.10);
}

.chat-composer button{
  color:#fff!important;
  border-color:rgba(255,48,79,.2)!important;
  background:linear-gradient(180deg,#ef3552,#b91435)!important;
}

.chat-composer textarea:focus{
  border-color:rgba(255,48,79,.24)!important;
  box-shadow:0 0 0 3px rgba(255,48,79,.035);
}

/* =========================================================
   RED SETTINGS
   ========================================================= */

.settings-window{
  border-color:rgba(255,48,79,.12)!important;
  background:
    radial-gradient(circle at 0 0,rgba(255,48,79,.055),transparent 27%),
    linear-gradient(155deg,rgba(14,18,25,.99),rgba(5,8,13,.995))!important;
}

.settings-kicker{color:#ff6077!important}

.settings-nav-item:hover,
.settings-nav-item.active{
  color:#ff8a9b!important;
  border-color:rgba(255,48,79,.1)!important;
  background:rgba(255,48,79,.04)!important;
}

.settings-nav-item.active span{color:var(--xred)!important}

.setting-row input:checked + .setting-switch{
  background:rgba(255,48,79,.13)!important;
  border-color:rgba(255,48,79,.26)!important;
}

.setting-row input:checked + .setting-switch::after{
  background:var(--xred)!important;
  box-shadow:0 0 11px rgba(255,48,79,.34)!important;
}

.settings-save{
  color:#fff!important;
  border-color:rgba(255,48,79,.18)!important;
  background:linear-gradient(180deg,#e9314d,#b71434)!important;
}

.settings-form input:focus{
  border-color:rgba(255,48,79,.25)!important;
  box-shadow:0 0 0 3px rgba(255,48,79,.035)!important;
}

/* Improve all text readability */
.player-core-red,
.yun-shop,
.portal-workspace,
.settings-window{
  text-shadow:none;
}

.player-core-red p,
.yun-shop p,
.portal-workspace p,
.settings-window p,
.player-core-red small,
.yun-shop small,
.portal-workspace small,
.settings-window small{
  line-height:1.5;
}

@media(max-width:980px){
  .profile-hero-panel{
    grid-template-columns:auto minmax(0,1fr);
  }

  .profile-resource-cards{
    grid-column:1/-1;
    min-width:0;
    width:100%;
  }

  .profile-resource-cards{
    grid-template-columns:1fr 1fr;
  }

  .profile-overview-red{
    grid-template-columns:1fr 1fr;
  }

  .quick-actions-card{
    grid-column:1/-1;
  }
}

@media(max-width:720px){
  .profile-hero-panel{
    grid-template-columns:1fr;
    justify-items:center;
    text-align:center;
  }

  .profile-main-copy{width:100%}
  .profile-welcome-line,
  .profile-name-row,
  .profile-badges{
    justify-content:center;
  }

  .profile-meta-strip{
    grid-template-columns:1fr 1fr;
    max-width:none;
  }

  .profile-meta-strip>div:last-child{
    grid-column:1/-1;
  }

  .profile-xp-line{
    grid-template-columns:1fr;
  }

  .xp-reward-chip{
    text-align:left;
  }

  .xp-line-caption{
    flex-wrap:wrap;
  }

  .profile-overview-red{
    grid-template-columns:1fr;
  }

  .quick-actions-card{grid-column:auto}

  .logout-nav{margin-left:0}
}

@media(max-width:500px){
  .profile-resource-cards{
    grid-template-columns:1fr;
  }

  .profile-meta-strip{
    grid-template-columns:1fr;
  }

  .profile-meta-strip>div:last-child{
    grid-column:auto;
  }

  .profile-nav-red{
    padding-inline:4px;
  }
}


/* =========================================================
   V12 — CENTERED FLOATING NAVBAR
   V10 design restored, only the upper bar is redesigned.
   ========================================================= */

.topbar{
  width:min(1120px,96vw)!important;
  min-height:74px!important;
  height:auto!important;
  margin:16px auto 0!important;
  padding:10px 14px 10px 18px!important;

  position:relative!important;
  z-index:30!important;

  display:grid!important;
  grid-template-columns:auto minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:clamp(14px,2.4vw,32px)!important;

  border:1px solid rgba(255,255,255,.075)!important;
  border-radius:22px!important;

  background:
    radial-gradient(circle at 10% 0%,rgba(255,48,79,.055),transparent 33%),
    linear-gradient(180deg,rgba(11,13,20,.92),rgba(6,9,14,.94))!important;

  box-shadow:
    0 22px 58px rgba(0,0,0,.34),
    0 0 0 1px rgba(255,48,79,.018),
    inset 0 1px 0 rgba(255,255,255,.035)!important;

  backdrop-filter:blur(22px)!important;
  -webkit-backdrop-filter:blur(22px)!important;
}

.topbar::before{
  content:"";
  position:absolute;
  left:11%;
  right:11%;
  top:0;
  height:1px;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,48,79,.16),
    rgba(255,83,110,.58),
    rgba(255,48,79,.16),
    transparent
  );
  pointer-events:none;
}

.topbar::after{
  content:""!important;
  position:absolute!important;
  left:24px!important;
  right:24px!important;
  bottom:-1px!important;
  height:1px!important;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,48,79,.16),
    transparent
  )!important;
}

.topbar .brand{
  min-width:0;
  display:flex!important;
  align-items:center!important;
  gap:4px;
  padding:5px 7px 5px 2px;
}

.topbar .brand-x{
  font-size:clamp(42px,4vw,53px)!important;
  line-height:.72!important;
}

.topbar .brand-copy strong{
  font-size:clamp(1.2rem,1.25vw + .85rem,1.65rem)!important;
}

.topbar .brand-copy small{
  margin-top:3px!important;
  font-size:clamp(.47rem,.11vw + .44rem,.56rem)!important;
  letter-spacing:.16em!important;
}

.topbar .actions{
  grid-column:3!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:10px!important;
  min-width:0;
}

.topbar .online{
  justify-self:center;
  display:inline-flex!important;
  align-items:center!important;
  gap:7px;
  min-height:34px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.055);
  background:rgba(255,255,255,.018);
  color:#9da6a1!important;
  font-size:clamp(.48rem,.09vw + .46rem,.57rem)!important;
  font-weight:750;
  letter-spacing:.035em;
}

.topbar .online i{
  width:7px!important;
  height:7px!important;
  margin:0!important;
  background:#54e46f!important;
  box-shadow:0 0 11px rgba(84,228,111,.65)!important;
}

.topbar .play{
  min-width:clamp(190px,17vw,255px)!important;
  min-height:50px!important;
  padding:7px 16px!important;
  border-radius:14px!important;
}

.topbar .play-copy strong{
  font-size:clamp(.88rem,.34vw + .8rem,1.05rem)!important;
}

.topbar .play-copy small{
  max-width:190px!important;
  margin-top:3px!important;
  font-size:clamp(.38rem,.07vw + .36rem,.45rem)!important;
}

.topbar .play-chevrons{
  font-size:.75rem!important;
}

.topbar .theme{
  width:42px!important;
  height:42px!important;
  flex:0 0 42px!important;
  border-radius:13px!important;
  background:rgba(255,255,255,.025)!important;
  border-color:rgba(255,255,255,.07)!important;
}

.hero{
  min-height:calc(100vh - 106px)!important;
  padding-top:24px!important;
}

/* Navbar aligns visually with the logged-in panel width. */
.player-dashboard{
  width:min(1120px,96vw)!important;
}

/* Keep the login intentionally narrower and centered under the same navbar. */
.auth-shell{
  margin-inline:auto;
}

/* tablet */
@media(max-width:820px){
  .topbar{
    width:min(96vw,1120px)!important;
    grid-template-columns:auto 1fr auto!important;
    gap:10px!important;
    padding:9px 10px 9px 14px!important;
    border-radius:18px!important;
  }

  .topbar .online{
    display:none!important;
  }

  .topbar .actions{
    gap:7px!important;
  }

  .topbar .play{
    min-width:176px!important;
  }
}

/* phone */
@media(max-width:570px){
  .topbar{
    margin-top:10px!important;
    min-height:64px!important;
    grid-template-columns:minmax(0,1fr) auto!important;
  }

  .topbar .brand-x{
    font-size:39px!important;
  }

  .topbar .brand-copy strong{
    font-size:1.05rem!important;
  }

  .topbar .brand-copy small{
    display:block!important;
    font-size:.39rem!important;
    letter-spacing:.11em!important;
  }

  .topbar .actions{
    grid-column:2!important;
  }

  .topbar .theme{
    display:none!important;
  }

  .topbar .play{
    min-width:142px!important;
    min-height:45px!important;
    padding-inline:10px!important;
    border-radius:12px!important;
  }

  .topbar .play-copy strong{
    font-size:.77rem!important;
  }

  .topbar .play-copy small{
    max-width:122px!important;
    font-size:.33rem!important;
  }

  .topbar .play-chevrons{
    display:none!important;
  }

  .hero{
    min-height:calc(100vh - 82px)!important;
    padding-top:18px!important;
  }
}


/* =========================================================
   V13 — CODED FROM THE APPROVED PORTAL MOCKUP
   ========================================================= */

:root{
  --v13-red:#ff334f;
  --v13-red-hot:#ff5a73;
  --v13-red-dark:#a60d2a;
  --v13-panel:#090f18;
  --v13-panel-2:#0d141f;
  --v13-line:rgba(255,255,255,.075);
  --v13-text:#eef1f5;
  --v13-muted:#7d8793;
  --v13-gold:#ffc342;
  --v13-green:#49df72;
}

html,body{
  min-height:100%;
}

body{
  color:var(--v13-text);
  background:#05080d;
}

.bg{
  position:fixed!important;
  inset:0!important;
  background-image:
    linear-gradient(90deg,rgba(2,5,10,.22),rgba(3,5,10,.06) 45%,rgba(2,5,10,.24)),
    linear-gradient(180deg,rgba(1,3,7,.30),rgba(3,5,10,.62)),
    url('/assets/bg-portal-v13.webp')!important;
  background-position:center!important;
  background-size:cover!important;
  filter:saturate(1.05) contrast(1.05) brightness(.78)!important;
}

.veil{
  background:
    radial-gradient(circle at 50% 22%,rgba(255,41,72,.10),transparent 32%),
    linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.22) 45%,rgba(0,0,0,.48))!important;
}

.noise{opacity:.08!important}

/* ---------------- TOP PILL NAV ---------------- */

.portal-topbar{
  width:min(1040px,94vw)!important;
  min-height:70px!important;
  position:relative!important;
  z-index:40!important;
  margin:22px auto 0!important;
  padding:9px 12px 9px 17px!important;

  display:grid!important;
  grid-template-columns:auto minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:18px!important;

  border:1px solid rgba(255,255,255,.11)!important;
  border-radius:999px!important;
  background:
    radial-gradient(circle at 6% 0%,rgba(255,48,79,.055),transparent 30%),
    linear-gradient(180deg,rgba(8,12,18,.94),rgba(4,8,13,.94))!important;

  box-shadow:
    0 25px 55px rgba(0,0,0,.36),
    inset 0 1px 0 rgba(255,255,255,.035)!important;

  backdrop-filter:blur(22px)!important;
  -webkit-backdrop-filter:blur(22px)!important;
}

.portal-topbar::before{
  content:"";
  position:absolute;
  inset:-1px 16% auto;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,70,100,.44),transparent);
}

.portal-topbar::after{display:none!important}

.portal-topbar .brand{
  min-width:max-content;
  padding:4px 8px 4px 0;
}

.portal-topbar .brand-x{
  color:#ff324e!important;
  font-size:47px!important;
  line-height:.68!important;
}

.portal-topbar .brand-copy strong{
  color:#f6f6f7;
  font-size:1.25rem!important;
}

.portal-topbar .brand-copy small{
  color:#e2b732!important;
  font-size:.42rem!important;
  letter-spacing:.10em!important;
}

.portal-statusbar{
  min-width:0;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:8px;
}

.portal-status{
  min-width:0;
  display:grid;
  grid-template-columns:auto auto;
  gap:1px 7px;
  align-items:center;

  padding:7px 10px;
  border-right:1px solid rgba(255,255,255,.06);
}

.portal-status:last-child{border-right:0}

.portal-status>i{
  width:7px;
  height:7px;
  grid-row:1/3;
  border-radius:50%;
  background:var(--v13-green);
  box-shadow:0 0 11px rgba(73,223,114,.65);
}

.portal-status>span:not(.status-icon):not(.status-coin):not(.status-level){
  color:#929ba6;
  font-size:.42rem;
  font-weight:800;
  letter-spacing:.07em;
}

.portal-status>strong{
  color:#eef1f4;
  font-size:.55rem;
  font-weight:750;
  white-space:nowrap;
}

.status-icon{
  grid-row:1/3;
  color:#8e99a5;
  font-size:.8rem;
}

.status-coin,
.status-level{
  grid-row:1/3;
  width:27px;
  height:27px;
  display:grid;
  place-items:center;
  border-radius:50%;
  font-size:.48rem;
  font-weight:900;
}

.status-coin{
  color:#291b00;
  background:linear-gradient(145deg,#ffd95d,#e6a10d);
  box-shadow:0 0 13px rgba(255,195,66,.17);
}

.status-level{
  color:#fff;
  background:linear-gradient(145deg,#b55cff,#6830c6);
  box-shadow:0 0 13px rgba(157,73,255,.17);
}

.portal-top-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
}

.top-play{
  min-height:46px;
  padding:0 19px;
  display:inline-flex;
  align-items:center;
  gap:8px;

  border:1px solid rgba(255,86,110,.55);
  border-radius:15px;

  color:#fff;
  background:linear-gradient(180deg,#ff536e,#d91b40);

  font-size:.68rem;
  font-weight:850;
  letter-spacing:.045em;
  cursor:pointer;

  box-shadow:
    0 0 23px rgba(255,48,79,.25),
    inset 0 1px 0 rgba(255,255,255,.23);

  transition:.18s ease;
}

.top-play:hover{
  transform:translateY(-1px);
  box-shadow:
    0 0 34px rgba(255,48,79,.39),
    inset 0 1px 0 rgba(255,255,255,.26);
}

.top-guest-actions{
  display:flex;
  gap:5px;
}

.top-guest-actions button{
  min-height:37px;
  padding:0 10px;
  border-radius:11px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.025);
  color:#c9cfd5;
  font-size:.43rem;
  font-weight:850;
  cursor:pointer;
}

.top-guest-actions button.accent{
  color:#ff7b8e;
  border-color:rgba(255,48,79,.13);
  background:rgba(255,48,79,.035);
}

.top-user{
  min-height:47px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:4px 8px 4px 4px;

  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.025);
  color:#e5e8eb;
  cursor:pointer;
}

.top-user img{
  width:37px;
  height:37px;
  border-radius:50%;
  object-fit:cover;
  border:2px solid rgba(255,195,66,.55);
}

.top-user span{
  max-width:100px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.55rem;
  font-weight:800;
}

.top-user b{
  color:#6e7781;
  font-size:.54rem;
}

.portal-topbar .theme{
  width:38px!important;
  height:38px!important;
  border-radius:50%!important;
}

/* ---------------- PAGE / HERO ---------------- */

.portal-main{
  width:min(1120px,94vw)!important;
  min-height:calc(100vh - 112px)!important;
  margin:0 auto!important;
  padding:24px 0 28px!important;

  display:grid!important;
  grid-template-columns:minmax(0,1fr) 315px!important;
  align-items:start!important;
  gap:17px!important;
}

.index-hero{
  grid-column:1;
  min-height:395px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  overflow:hidden;
}

.hero-smoke{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 50% 58%,rgba(255,38,71,.11),transparent 34%),
    radial-gradient(circle at 50% 20%,rgba(255,255,255,.035),transparent 23%);
}

.hero-title-block{
  width:min(690px,100%);
  position:relative;
  z-index:2;
  padding:10px 8px;
}

.hero-overline{
  display:block;
  margin-bottom:3px;
  color:#ff3d59;
  font-size:clamp(.65rem,.55vw,.83rem);
  font-weight:800;
  letter-spacing:.52em;
}

.hero-title-block h1{
  margin:0;
  color:#e7e8e8;
  text-transform:uppercase;
  font:800 clamp(3.7rem,5.35vw,5.8rem)/.86 Rajdhani,sans-serif;
  letter-spacing:-.035em;

  text-shadow:
    0 3px 0 rgba(255,255,255,.09),
    0 13px 24px rgba(0,0,0,.38);
}

.hero-title-block h2{
  margin:4px 0 6px;
  color:#ff344f;
  font:800 clamp(1.8rem,2.7vw,3.05rem)/.95 Rajdhani,sans-serif;
  font-style:italic;
  letter-spacing:-.02em;
  transform:rotate(-2deg);
  text-shadow:0 10px 22px rgba(158,10,38,.30);
}

.hero-title-block>p{
  margin:8px 0 15px;
  color:#b9c0c8;
  font-size:.8rem;
}

.index-play{
  width:min(440px,92%)!important;
  min-height:83px!important;
  margin:0 auto!important;
  border-radius:18px!important;
}

.index-play:not(:disabled){
  animation:v13PlayPulse 1.85s ease-in-out infinite!important;
}

.index-play .play-copy strong{
  font-size:clamp(1.55rem,2.3vw,2.2rem)!important;
  letter-spacing:-.015em!important;
}

.index-play .play-copy small{
  max-width:270px!important;
  font-size:.46rem!important;
  letter-spacing:.13em!important;
}

@keyframes v13PlayPulse{
  0%,100%{
    transform:translateY(0) scale(1);
    box-shadow:0 0 0 1px rgba(255,48,79,.14),0 0 28px rgba(255,48,79,.27),0 12px 30px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.42)
  }
  50%{
    transform:translateY(-1px) scale(1.018);
    box-shadow:0 0 0 1px rgba(255,82,108,.24),0 0 48px rgba(255,48,79,.44),0 15px 37px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.5)
  }
}

.index-server-badges{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:6px;
  margin-top:11px;
}

.index-server-badges span{
  min-height:26px;
  display:inline-flex;
  align-items:center;
  padding:0 9px;

  border:1px solid rgba(255,255,255,.055);
  border-radius:7px;
  background:rgba(6,10,16,.62);

  color:#a4adb7;
  font-size:.44rem;
  font-weight:700;
}

/* ---------------- LOGIN CARD RIGHT ---------------- */

.portal-main>.auth-shell{
  grid-column:2!important;
  grid-row:1!important;
  width:315px!important;
  margin:78px 0 0!important;
  position:relative!important;
}

.portal-main .auth{
  width:100%!important;
  min-height:0!important;
  padding:17px!important;
  border-radius:16px!important;

  border:1px solid rgba(255,255,255,.09)!important;
  background:
    radial-gradient(circle at 0 0,rgba(255,48,79,.045),transparent 28%),
    linear-gradient(160deg,rgba(12,17,24,.96),rgba(6,10,15,.98))!important;

  box-shadow:
    0 25px 55px rgba(0,0,0,.38),
    inset 0 1px 0 rgba(255,255,255,.025)!important;
}

.portal-main .auth-glow,
.portal-main .frame-corner,
.portal-main .terminal-line,
.portal-main .security-strip,
.portal-main .secure-note{
  display:none!important;
}

.portal-main .auth-heading{
  margin-bottom:10px!important;
}

.portal-main .auth-heading .eyebrow{
  color:#777f8a!important;
  font-size:.44rem!important;
}

.portal-main .auth-heading h1{
  margin-top:3px!important;
  color:#e9edf0!important;
  font-size:1rem!important;
  font-family:Inter,sans-serif!important;
  letter-spacing:.03em!important;
}

.portal-main .auth-heading p{
  display:none!important;
}

.portal-main .tabs{
  margin-bottom:10px!important;
}

.portal-main .tab{
  min-height:31px!important;
  font-size:.46rem!important;
}

.portal-main .panel{
  gap:9px!important;
}

.portal-main .field{
  min-height:49px!important;
  border-radius:8px!important;
}

.portal-main .field-content small{
  display:none!important;
}

.portal-main .field-content input{
  font-size:.58rem!important;
}

.portal-main .field-symbol{
  width:35px!important;
}

.portal-main .row{
  margin:0!important;
}

.portal-main .check-label,
.portal-main .link{
  font-size:.44rem!important;
}

.portal-main .primary{
  min-height:42px!important;
  border-radius:7px!important;
  font-size:.55rem!important;
}

.portal-main .or{
  margin:3px 0!important;
}

.portal-main .or span{
  font-size:.39rem!important;
}

.portal-main .social{
  grid-template-columns:1fr 1fr!important;
  gap:7px!important;
}

.portal-main .social-btn{
  min-height:40px!important;
  border-radius:7px!important;
  padding:6px 8px!important;
}

.portal-main .provider-copy small,
.portal-main .provider-arrow{
  display:none!important;
}

.portal-main .provider-copy strong{
  font-size:.5rem!important;
}

.portal-main .provider-icon{
  width:25px!important;
  height:25px!important;
  flex:0 0 25px!important;
}

.portal-main .password-meter,
.portal-main .terms{
  font-size:.46rem!important;
}

.is-authenticated .portal-main>.auth-shell{
  display:none!important;
}

.is-authenticated .index-hero{
  grid-column:1/-1!important;
}

/* ---------------- LOWER CONTENT PANEL ---------------- */

.player-dashboard,
.portal-workspace{
  grid-column:1/-1!important;
  width:100%!important;
  margin:5px 0 0!important;
}

.player-dashboard{
  gap:10px!important;
}

.player-core-red,
.yun-shop,
.portal-workspace{
  border-radius:18px!important;
  border:1px solid rgba(255,68,96,.13)!important;
  background:
    radial-gradient(circle at 0 0,rgba(255,48,79,.035),transparent 24%),
    linear-gradient(160deg,rgba(9,14,22,.97),rgba(5,9,15,.985))!important;

  box-shadow:
    0 27px 58px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.025)!important;
}

/* Profile becomes the content that appears above the bottom PROFIL tab. */
.profile-hero-panel{
  padding:18px 20px 14px!important;
}

.red-avatar{
  width:78px!important;
  height:78px!important;
}

.profile-name-row h1{
  font-size:1.65rem!important;
}

.profile-resource-cards{
  min-width:205px!important;
}

.resource-card{
  min-height:58px!important;
  padding:9px!important;
}

.profile-meta-strip{
  margin-top:10px!important;
}

.profile-xp-line{
  padding:10px 20px!important;
}

.profile-panel-tools{
  display:flex;
  justify-content:flex-end;
  gap:6px;
  padding:9px 18px;
  border-bottom:1px solid rgba(255,255,255,.055);
}

.profile-panel-tools button{
  min-height:31px;
  padding:0 10px;
  border:1px solid rgba(255,255,255,.055);
  border-radius:7px;
  background:rgba(255,255,255,.018);
  color:#77818d;
  font-size:.45rem;
  font-weight:850;
  cursor:pointer;
}

.profile-panel-tools button:hover{
  color:#ff788c;
  border-color:rgba(255,48,79,.13);
  background:rgba(255,48,79,.025);
}

.profile-overview-red{
  grid-template-columns:.9fr 1fr 1fr!important;
  padding:12px!important;
}

.overview-card{
  padding:12px!important;
}

.yun-shop{
  margin-top:10px;
}

/* Forum = categories / discussions / information, like reference */
.portal-workspace{
  min-height:0!important;
  overflow:visible!important;
}

.workspace-header{
  min-height:58px!important;
  padding:11px 14px!important;
  margin:0!important;
}

.workspace-title h2{
  font-size:1rem!important;
}

.workspace-title p{
  display:none;
}

.workspace-primary{
  min-height:33px!important;
}

.forum-browser{
  min-height:410px!important;
  display:grid!important;
  grid-template-columns:205px minmax(0,1fr) 205px!important;
  gap:0!important;
}

.forum-sidebar,
.forum-main,
.forum-side-info{
  min-width:0;
  border-radius:0!important;
  border:0!important;
  background:transparent!important;
}

.forum-sidebar{
  padding:11px!important;
  border-right:1px solid rgba(255,255,255,.055)!important;
}

.forum-main{
  padding:11px!important;
}

.forum-side-info{
  padding:11px;
  border-left:1px solid rgba(255,255,255,.055)!important;
}

.forum-category{
  min-height:45px!important;
  padding:6px!important;
}

.forum-category-icon{
  width:29px!important;
  height:29px!important;
}

.forum-thread{
  min-height:57px!important;
  border-radius:7px!important;
}

.forum-thread-main{
  grid-template-columns:35px minmax(0,1fr)!important;
}

.forum-thread-main img{
  width:35px!important;
  height:35px!important;
}

.forum-side-info{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.forum-info-card{
  padding:10px;
  border:1px solid rgba(255,255,255,.05);
  border-radius:8px;
  background:rgba(255,255,255,.012);
}

.forum-info-card span,
.forum-info-card strong,
.forum-info-card small{
  display:block;
}

.forum-info-card span{
  color:#5e6873;
  font-size:.4rem;
  font-weight:850;
  letter-spacing:.09em;
}

.forum-info-card strong{
  margin-top:4px;
  color:#d7dce0;
  font-size:.56rem;
}

.forum-info-card small{
  margin-top:4px;
  color:#69737d;
  font-size:.46rem;
  line-height:1.45;
}

.forum-info-card.rules{
  border-color:rgba(255,48,79,.07);
  background:rgba(255,48,79,.018);
}

.forum-side-create{
  min-height:34px;
  margin-top:auto;
  border-radius:7px;
  border:1px solid rgba(255,48,79,.17);
  background:linear-gradient(180deg,#ed3652,#bb1535);
  color:#fff;
  font-size:.46rem;
  font-weight:850;
  cursor:pointer;
}

/* Messages panel closely follows Messenger-like part of reference */
.messages-layout{
  min-height:420px!important;
  grid-template-columns:260px minmax(0,1fr)!important;
}

.conversation-sidebar{
  padding:10px!important;
}

.chat-panel,
.chat-active{
  min-height:420px!important;
}

.chat-stream{
  max-height:310px!important;
}

.chat-row.mine .chat-bubble{
  background:linear-gradient(180deg,#f43d58,#bd1736)!important;
}

/* ---------------- BOTTOM TABS ---------------- */

.portal-bottom-tabs{
  grid-column:1/-1!important;
  width:100%;
  min-height:62px;

  position:relative;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  align-items:stretch;

  margin-top:8px;

  border:1px solid rgba(255,68,96,.18);
  border-radius:16px;
  background:
    linear-gradient(180deg,rgba(14,17,25,.97),rgba(8,11,17,.985));

  box-shadow:
    0 24px 50px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.025);

  overflow:visible;
}

.bottom-tab{
  min-width:0;
  position:relative;

  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  border:0;
  border-right:1px solid rgba(255,255,255,.055);
  background:transparent;

  color:#8a939d;
  font-size:.56rem;
  font-weight:750;
  cursor:pointer;
  transition:.18s ease;
}

.bottom-tab:last-of-type{border-right:0}

.bottom-tab>span{
  color:#78818c;
  font-size:.85rem;
}

.bottom-tab:hover{
  color:#e4e7ea;
  background:rgba(255,255,255,.015);
}

.bottom-tab.active{
  color:#ff415d;
}

.bottom-tab.active>span{
  color:#ff415d;
  text-shadow:0 0 13px rgba(255,48,79,.33);
}

.bottom-tab.active::after{
  content:"";
  position:absolute;
  left:12%;
  right:12%;
  bottom:0;
  height:2px;
  background:linear-gradient(90deg,transparent,#ff334f,#ff5a73,#ff334f,transparent);
  box-shadow:0 0 12px rgba(255,48,79,.43);
}

.dock-badge{
  min-width:18px;
  height:18px;
  display:grid;
  place-items:center;
  padding:0 4px;

  border-radius:99px;
  background:#d51d3d;
  color:#fff;
  font-size:.42rem;
}

.dock-notch{
  width:64px;
  height:28px;
  position:absolute;
  left:50%;
  top:-22px;
  transform:translateX(-50%);

  display:grid;
  place-items:center;

  border:1px solid rgba(255,68,96,.16);
  border-bottom:0;
  border-radius:35px 35px 0 0;

  background:#0b1018;
  color:#ff405d;
  font-size:.7rem;
}

/* Old static server panel is replaced by badges under HRÁT NYNÍ. */
#serverStats{
  display:none!important;
}

/* Settings keeps same backend, only visually matches new portal. */
.settings-window{
  border-radius:17px!important;
}

/* ---------------- RESPONSIVE ---------------- */

@media(max-width:1000px){
  .portal-topbar{
    width:min(96vw,1040px)!important;
  }

  .portal-status.server{
    display:none;
  }

  .portal-main{
    width:min(96vw,1120px)!important;
    grid-template-columns:minmax(0,1fr) 285px!important;
  }

  .portal-main>.auth-shell{
    width:285px!important;
  }

  .forum-browser{
    grid-template-columns:190px minmax(0,1fr)!important;
  }

  .forum-side-info{
    display:none!important;
  }
}

@media(max-width:800px){
  .portal-topbar{
    grid-template-columns:auto minmax(0,1fr) auto!important;
    gap:9px!important;
  }

  .portal-statusbar{
    justify-content:flex-end;
  }

  .portal-status:not(.user-stat){
    display:none;
  }

  .top-guest-actions{
    display:none;
  }

  .top-user span{
    display:none;
  }

  .portal-main{
    grid-template-columns:1fr!important;
  }

  .index-hero{
    grid-column:1!important;
  }

  .portal-main>.auth-shell{
    grid-column:1!important;
    grid-row:auto!important;
    width:min(420px,100%)!important;
    margin:0 auto!important;
  }

  .profile-overview-red{
    grid-template-columns:1fr!important;
  }

  .forum-browser{
    grid-template-columns:1fr!important;
  }

  .forum-sidebar{
    border-right:0!important;
    border-bottom:1px solid rgba(255,255,255,.055)!important;
  }

  .forum-categories{
    flex-direction:row!important;
    overflow-x:auto!important;
  }

  .forum-category{
    min-width:175px!important;
  }
}

@media(max-width:560px){
  .portal-topbar{
    min-height:60px!important;
    margin-top:10px!important;
    padding:8px 9px 8px 13px!important;
  }

  .portal-topbar .brand-x{
    font-size:38px!important;
  }

  .portal-topbar .brand-copy strong{
    font-size:1rem!important;
  }

  .portal-statusbar{
    display:none!important;
  }

  .top-play{
    min-height:40px;
    padding-inline:12px;
    font-size:.55rem;
  }

  .portal-topbar .theme{
    display:none!important;
  }

  .portal-main{
    padding-top:14px!important;
  }

  .index-hero{
    min-height:340px;
  }

  .hero-overline{
    letter-spacing:.25em;
  }

  .hero-title-block h1{
    font-size:clamp(2.75rem,14vw,4.3rem);
  }

  .hero-title-block h2{
    font-size:clamp(1.55rem,8vw,2.25rem);
  }

  .index-play{
    min-height:71px!important;
  }

  .index-server-badges span:nth-child(n+3){
    display:none;
  }

  .profile-hero-panel{
    grid-template-columns:1fr!important;
  }

  .profile-resource-cards{
    min-width:0!important;
    width:100%;
  }

  .profile-meta-strip{
    grid-template-columns:1fr!important;
  }

  .bottom-tab{
    flex-direction:column;
    gap:3px;
    padding:8px 4px;
    font-size:.42rem;
  }

  .bottom-tab>span{
    font-size:.72rem;
  }

  .messages-layout{
    grid-template-columns:1fr!important;
  }

  .conversation-sidebar{
    border-right:0!important;
    border-bottom:1px solid rgba(255,255,255,.055)!important;
  }
}


/* =========================================================
   V14 — pixel-close coded reconstruction of approved mockup
   ========================================================= */

body{
  overflow-x:hidden;
}

.bg{
  background-image:
    linear-gradient(90deg,rgba(1,4,8,.12),rgba(0,0,0,.02) 44%,rgba(1,4,8,.14)),
    linear-gradient(180deg,rgba(1,3,6,.22),rgba(2,4,8,.43)),
    url('/assets/bg-portal-v13.webp')!important;
  background-position:center top!important;
  background-size:cover!important;
  filter:saturate(1.08) contrast(1.06) brightness(.86)!important;
}

.veil{
  background:
    radial-gradient(circle at 49% 38%,rgba(255,35,69,.10),transparent 26%),
    linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.13) 55%,rgba(0,0,0,.38))!important;
}

/* exact-ish top pill proportions */
.portal-topbar{
  width:min(1060px,92vw)!important;
  min-height:74px!important;
  margin-top:18px!important;
  padding:10px 11px 10px 18px!important;
  border-radius:38px!important;
  border-color:rgba(255,255,255,.13)!important;
  background:linear-gradient(180deg,rgba(5,9,14,.96),rgba(4,7,12,.93))!important;
  box-shadow:0 20px 44px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.035)!important;
}

.portal-topbar .brand-x{
  font-size:49px!important;
}

.portal-topbar .brand-copy strong{
  font-size:1.42rem!important;
  letter-spacing:-.02em!important;
}

.portal-topbar .brand-copy small{
  font-size:.40rem!important;
  color:#f0c52f!important;
}

.portal-statusbar{
  gap:2px!important;
}

.portal-status{
  padding-inline:12px!important;
}

.portal-status>span:not(.status-icon):not(.status-coin):not(.status-level){
  font-size:.41rem!important;
}

.portal-status>strong{
  font-size:.57rem!important;
}

.top-play{
  min-height:52px!important;
  padding-inline:23px!important;
  border-radius:14px!important;
  font-size:.72rem!important;
}

.top-user{
  width:56px!important;
  padding:4px!important;
  justify-content:center!important;
}
.top-user span,.top-user b{display:none!important}
.top-user img{width:43px!important;height:43px!important}

/* overall main canvas */
.portal-main{
  width:min(1140px,92vw)!important;
  padding-top:18px!important;
  gap:14px!important;
  grid-template-columns:minmax(0,1fr) 300px!important;
}

.index-hero{
  min-height:345px!important;
}

.hero-title-block{
  transform:translateY(-3px);
}

.hero-overline{
  margin-bottom:4px!important;
  font-size:.72rem!important;
  letter-spacing:.49em!important;
}

.hero-title-block h1{
  font-size:clamp(4.35rem,6vw,6.4rem)!important;
  line-height:.82!important;
  letter-spacing:-.045em!important;
  color:#ececec!important;
  text-shadow:
    0 2px 0 rgba(255,255,255,.10),
    0 12px 23px rgba(0,0,0,.44)!important;
}

.hero-title-block h2{
  margin-top:5px!important;
  font-size:clamp(2.0rem,3vw,3.35rem)!important;
  line-height:.90!important;
  color:#ff334e!important;
  text-shadow:0 8px 18px rgba(188,12,43,.34)!important;
}

.hero-title-block>p{
  margin:8px 0 12px!important;
  font-size:.77rem!important;
}

.index-play{
  width:430px!important;
  min-height:81px!important;
  border-radius:13px!important;
  border:1px solid rgba(255,104,127,.68)!important;
  background:
    linear-gradient(180deg,rgba(255,58,84,.95),rgba(185,15,48,.98)),
    repeating-linear-gradient(122deg,rgba(255,255,255,.05) 0 1px,transparent 1px 16px)!important;
  box-shadow:
    0 0 0 1px rgba(255,50,78,.18),
    0 0 29px rgba(255,44,74,.43),
    inset 0 0 26px rgba(255,130,145,.12),
    inset 0 1px 0 rgba(255,255,255,.30)!important;
}

.index-play::after{
  content:"";
  position:absolute;
  inset:8px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:8px;
  clip-path:polygon(0 14%,9% 0,91% 0,100% 14%,100% 86%,91% 100%,9% 100%,0 86%);
  pointer-events:none;
}

.index-play .play-copy strong{
  font-size:2.15rem!important;
  font-style:italic;
  letter-spacing:-.035em!important;
}

.index-play .play-copy small{
  display:none!important;
}

.index-server-badges{
  margin-top:9px!important;
}

.index-server-badges span{
  min-height:24px!important;
  border-radius:5px!important;
  padding-inline:9px!important;
  font-size:.42rem!important;
  background:rgba(7,11,16,.75)!important;
}

/* right login exact compact card */
.portal-main>.auth-shell{
  width:300px!important;
  margin-top:55px!important;
}

.portal-main .auth{
  padding:15px!important;
  border-radius:14px!important;
  background:linear-gradient(160deg,rgba(9,14,21,.96),rgba(5,9,14,.98))!important;
}

.portal-main .auth-heading{
  margin-bottom:8px!important;
}

.portal-main .auth-heading h1{
  font-size:.78rem!important;
  color:#9da4ad!important;
  text-transform:uppercase;
}

.portal-main .tabs{
  margin-bottom:8px!important;
}

.portal-main .field{
  min-height:43px!important;
}

.portal-main .primary{
  min-height:39px!important;
  background:linear-gradient(180deg,#ef394f,#c71635)!important;
}

.portal-main .social{
  display:none!important;
}

.portal-main .or{
  display:none!important;
}

.portal-main .terms{
  margin-top:5px!important;
}

/* panel directly under hero */
.player-dashboard,
.portal-workspace{
  margin-top:0!important;
}

.portal-workspace{
  border-radius:13px!important;
  border-color:rgba(255,255,255,.10)!important;
  overflow:hidden!important;
}

.workspace-header{
  min-height:43px!important;
  padding:8px 12px!important;
  border-bottom:1px solid rgba(255,255,255,.055)!important;
}

.workspace-title h2{
  font-size:.82rem!important;
}

.workspace-title>button{
  width:29px!important;
  height:29px!important;
}

.workspace-primary{
  min-height:29px!important;
  padding-inline:10px!important;
  font-size:.41rem!important;
}

.forum-browser{
  min-height:365px!important;
  grid-template-columns:220px minmax(0,1fr) 220px!important;
}

.forum-sidebar{
  padding:10px!important;
}

.workspace-section-label{
  font-size:.42rem!important;
}

.forum-categories{
  gap:4px!important;
}

.forum-category{
  min-height:48px!important;
  border-radius:7px!important;
}

.forum-category.active{
  border-color:rgba(255,51,79,.24)!important;
  background:linear-gradient(90deg,rgba(255,42,73,.16),rgba(255,42,73,.035))!important;
  box-shadow:inset 2px 0 0 #ff334f;
}

.forum-category strong{
  font-size:.51rem!important;
}

.forum-category small{
  font-size:.41rem!important;
}

.forum-main{
  padding:0!important;
}

.forum-breadcrumb{
  min-height:40px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 12px;
  border-bottom:1px solid rgba(255,255,255,.055);
  color:#aab1b8;
  font-size:.48rem;
}

.forum-breadcrumb span{
  color:#ff536b;
  font-weight:800;
}

.forum-breadcrumb b{
  color:#5f6872;
}

.forum-breadcrumb strong{
  font-weight:600;
  color:#e5e8ea;
}

.forum-toolbar{
  display:none!important;
}

.forum-table-head{
  display:none!important;
}

.forum-thread-list{
  padding:8px 10px 10px!important;
  gap:6px!important;
}

.forum-thread{
  min-height:59px!important;
  grid-template-columns:minmax(0,1fr) 64px 76px!important;
  border-radius:6px!important;
  background:rgba(255,255,255,.010)!important;
}

.forum-thread:hover{
  background:rgba(255,48,79,.025)!important;
}

.forum-thread-main{
  grid-template-columns:38px minmax(0,1fr)!important;
}

.forum-thread-main img{
  width:38px!important;
  height:38px!important;
  border-radius:50%!important;
}

.forum-thread-title strong{
  font-size:.61rem!important;
}

.forum-thread-title small{
  font-size:.43rem!important;
}

.forum-thread-stat{
  font-size:.43rem!important;
}

/* forum side like screenshot */
.forum-side-info{
  padding:10px!important;
  gap:7px!important;
}

.topic-info-list{
  display:flex;
  flex-direction:column;
  gap:0;
  margin-top:6px;
  border-bottom:1px solid rgba(255,255,255,.055);
}

.topic-info-list>div{
  min-height:27px;
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:8px;
  border-bottom:1px solid rgba(255,255,255,.035);
}

.topic-info-list span{
  color:#727b84;
  font-size:.41rem;
}

.topic-info-list strong{
  color:#bfc5cb;
  font-size:.42rem;
  font-weight:650;
}

.topic-info-list .fresh{
  color:#5ee578;
}

.forum-reply-cta{
  min-height:34px;
  border:1px solid rgba(255,70,95,.28);
  border-radius:6px;
  background:linear-gradient(180deg,#ec3850,#c31636);
  color:#fff;
  font-size:.44rem;
  font-weight:850;
  cursor:pointer;
}

.forum-top-users{
  padding-top:7px;
}

.forum-top-users>span{
  color:#727b84;
  font-size:.42rem;
  font-weight:850;
}

.forum-top-users>div{
  min-height:38px;
  display:grid;
  grid-template-columns:29px minmax(0,1fr) auto;
  align-items:center;
  gap:7px;
}

.forum-top-users img{
  width:28px;
  height:28px;
  border-radius:50%;
  object-fit:cover;
  border:1px solid rgba(255,255,255,.08);
}

.forum-top-users strong{
  color:#d5dade;
  font-size:.45rem;
}

.forum-top-users b{
  padding:2px 4px;
  border-radius:4px;
  background:#9e7200;
  color:#ffd96b;
  font-size:.35rem;
}

.forum-top-users small{
  grid-column:3;
  color:#69727c;
  font-size:.39rem;
}

.side-secondary-label,
.forum-side-info>.forum-info-card,
.forum-side-create{
  display:none!important;
}

/* bottom dock exactly closer */
.portal-bottom-tabs{
  min-height:66px!important;
  margin-top:11px!important;
  border-radius:16px!important;
}

.bottom-tab{
  font-size:.58rem!important;
}

.bottom-tab.active{
  color:#ff3e58!important;
}

.bottom-tab.active::after{
  left:14%!important;
  right:14%!important;
  height:2px!important;
}

.dock-notch{
  width:70px!important;
  height:26px!important;
  top:-21px!important;
  border-radius:35px 35px 0 0!important;
}

/* profile should be more compact when selected */
.player-core-red{
  border-radius:13px!important;
}

.profile-hero-panel{
  padding:15px 17px 12px!important;
}

.profile-overview-red{
  padding:10px!important;
  gap:8px!important;
}

.yun-shop{
  border-radius:13px!important;
}

/* responsive */
@media(max-width:980px){
  .portal-main{
    grid-template-columns:1fr!important;
  }

  .portal-main>.auth-shell{
    grid-column:1!important;
    width:min(390px,100%)!important;
    margin:0 auto!important;
  }

  .index-hero{
    min-height:320px!important;
  }

  .forum-browser{
    grid-template-columns:190px minmax(0,1fr)!important;
  }

  .forum-side-info{
    display:none!important;
  }
}

@media(max-width:760px){
  .portal-topbar{
    width:min(96vw,1060px)!important;
    border-radius:22px!important;
  }

  .portal-statusbar{
    display:none!important;
  }

  .top-guest-actions{
    display:none!important;
  }

  .hero-title-block h1{
    font-size:clamp(3rem,13vw,4.5rem)!important;
  }

  .index-play{
    width:min(94%,430px)!important;
  }

  .forum-browser{
    grid-template-columns:1fr!important;
  }

  .forum-sidebar{
    border-bottom:1px solid rgba(255,255,255,.055)!important;
  }

  .forum-categories{
    flex-direction:row!important;
    overflow-x:auto!important;
  }
}


/* =========================================================
   V15 — screenshot-calibrated reconstruction
   ========================================================= */

/*
  The real Safari screenshots showed V14 much smaller than the target.
  V15 deliberately increases the desktop canvas to match the target's
  proportions instead of keeping the old 1060/1140px caps.
*/

.portal-topbar{
  width:min(1380px,94vw)!important;
  min-height:82px!important;
  padding:10px 14px 10px 22px!important;
  border-radius:44px!important;
}

.portal-main{
  width:min(1460px,94vw)!important;
  grid-template-columns:minmax(0,1fr) 325px!important;
  gap:20px!important;
  padding-top:4px!important;
}

.portal-main>.auth-shell{
  width:325px!important;
  margin-top:34px!important;
}

/* ---------------------------------------------------------
   Exact-ish title treatment
   --------------------------------------------------------- */

.index-hero{
  min-height:360px!important;
  align-items:flex-start!important;
  padding-top:46px!important;
}

.hero-title-block{
  width:min(780px,100%)!important;
  transform:none!important;
}

.hero-overline{
  margin-bottom:7px!important;
  font-size:clamp(.76rem,.7vw,.96rem)!important;
  letter-spacing:.50em!important;
}

.hero-title-block h1{
  margin:0!important;
  color:#ececec!important;
  font-family:Impact,Haettenschweiler,"Arial Narrow Bold","Arial Narrow",sans-serif!important;
  font-size:clamp(4.9rem,6.3vw,7.2rem)!important;
  font-weight:900!important;
  line-height:.82!important;
  letter-spacing:.005em!important;
  transform:scaleX(.91)!important;
  transform-origin:center!important;
  text-shadow:
    0 2px 0 rgba(255,255,255,.14),
    0 4px 0 rgba(0,0,0,.32),
    0 17px 28px rgba(0,0,0,.45)!important;
}

.hero-title-block h2{
  margin:-2px 0 5px!important;
  color:#ff334e!important;
  font-family:"Brush Script MT","Marker Felt","Noteworthy",cursive!important;
  font-size:clamp(2.5rem,3.65vw,4.25rem)!important;
  font-weight:800!important;
  line-height:.83!important;
  letter-spacing:-.02em!important;
  transform:rotate(-3deg)!important;
  text-shadow:0 10px 22px rgba(184,11,42,.38)!important;
}

.hero-title-block>p{
  margin:12px 0 14px!important;
  font-size:.88rem!important;
  color:#c0c6cc!important;
}

.index-play{
  width:min(520px,92%)!important;
  min-height:94px!important;
  border-radius:15px!important;
}

.index-play .play-copy strong{
  font-family:Impact,Haettenschweiler,"Arial Narrow Bold","Arial Narrow",sans-serif!important;
  font-size:clamp(2.35rem,2.8vw,3.05rem)!important;
  font-weight:900!important;
  font-style:italic!important;
  transform:scaleX(.90);
}

.index-server-badges span{
  font-size:.48rem!important;
  min-height:28px!important;
  padding-inline:11px!important;
}

/* ---------------------------------------------------------
   Login card: remove the old terminal look entirely
   --------------------------------------------------------- */

.portal-main .auth{
  padding:17px 18px 18px!important;
  border-radius:15px!important;
  border:1px solid rgba(255,255,255,.105)!important;
  background:
    linear-gradient(160deg,rgba(8,13,20,.97),rgba(4,8,13,.99))!important;
}

.portal-main .terminal-line,
.portal-main .security-strip,
.portal-main .secure-note,
.portal-main .auth-heading .eyebrow,
.portal-main .auth-heading p{
  display:none!important;
}

.portal-main .auth-heading{
  margin:0 0 10px!important;
  padding:0!important;
}

.portal-main .auth-heading h1{
  margin:0!important;
  color:#8c949d!important;
  font-family:Inter,sans-serif!important;
  font-size:.64rem!important;
  font-weight:800!important;
  letter-spacing:.045em!important;
}

.portal-main .auth-heading h1::before{
  content:"♙ ";
  color:#646d77;
}

.portal-main .tabs{
  height:auto!important;
  margin:0 0 9px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}

.portal-main .tab{
  display:none!important;
}

/* Login panel receives the exact small card title. */
.portal-main #loginForm::before{
  content:"PŘIHLÁŠENÍ";
  display:block;
  margin:0 0 10px;
  color:#a7afb7;
  font-size:.57rem;
  font-weight:850;
  letter-spacing:.06em;
}

.portal-main #registerForm::before{
  content:"REGISTRACE";
  display:block;
  margin:0 0 10px;
  color:#a7afb7;
  font-size:.57rem;
  font-weight:850;
  letter-spacing:.06em;
}

.portal-main .panel{
  gap:9px!important;
}

.portal-main .field{
  min-height:46px!important;
  border-radius:7px!important;
  border-color:rgba(255,255,255,.09)!important;
  background:rgba(3,7,11,.47)!important;
}

.portal-main .field:focus-within{
  border-color:rgba(255,50,78,.28)!important;
  box-shadow:0 0 0 2px rgba(255,50,78,.028)!important;
}

.portal-main .field-symbol{
  width:42px!important;
  border-right:1px solid rgba(255,255,255,.055);
}

.portal-main .field-symbol svg{
  width:17px!important;
  height:17px!important;
  stroke:#7f8992!important;
}

.portal-main .field-content input{
  padding-left:10px!important;
  font-size:.55rem!important;
}

.portal-main .row{
  min-height:25px!important;
}

.portal-main .premium-check .check-ui{
  border-color:rgba(255,255,255,.16)!important;
  background:#10151b!important;
}

.portal-main .premium-check input:checked + .check-ui{
  border-color:#c82945!important;
  background:#d92543!important;
  box-shadow:0 0 9px rgba(255,48,79,.22)!important;
}

.portal-main .check-label,
.portal-main .link{
  font-size:.41rem!important;
}

.portal-main .link{
  color:#747d86!important;
}

.portal-main .primary{
  min-height:43px!important;
  margin-top:2px!important;
  border-radius:6px!important;
  color:#fff!important;
  background:linear-gradient(180deg,#f13750,#ca1737)!important;
  box-shadow:0 8px 19px rgba(210,22,55,.15),inset 0 1px 0 rgba(255,255,255,.20)!important;
}

.auth-switch-line{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  margin-top:2px;
  color:#747d86;
  font-size:.43rem;
}

.auth-switch-line button{
  padding:0;
  border:0;
  background:transparent;
  color:#ff415b;
  font-size:.43rem;
  font-weight:850;
  cursor:pointer;
}

.portal-main .or{
  display:block!important;
  margin:2px 0 0!important;
}

.portal-main .or::before,
.portal-main .or::after{
  opacity:.35;
}

.portal-main .or span{
  font-size:.34rem!important;
  color:#606973!important;
}

.portal-main .social{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:6px!important;
}

.portal-main .social-btn{
  min-height:34px!important;
  padding:4px 6px!important;
  border-radius:6px!important;
  opacity:.72;
}

.portal-main .provider-icon{
  width:20px!important;
  height:20px!important;
  flex:0 0 20px!important;
}

.portal-main .provider-copy strong{
  font-size:.42rem!important;
}

.portal-main .provider-copy small,
.portal-main .provider-arrow{
  display:none!important;
}

.portal-main .register-grid{
  grid-template-columns:1fr!important;
  gap:8px!important;
}

.portal-main .password-meter{
  margin:0!important;
}

.portal-main .terms{
  margin:0!important;
}

/* ---------------------------------------------------------
   Forum opens by default after login and must fill the width
   --------------------------------------------------------- */

.is-authenticated .index-hero{
  min-height:330px!important;
  padding-top:31px!important;
}

.portal-workspace,
.player-dashboard{
  width:100%!important;
}

.portal-workspace{
  min-height:390px!important;
}

.forum-browser{
  grid-template-columns:230px minmax(0,1fr) 230px!important;
  min-height:395px!important;
}

.forum-thread-list{
  padding:8px 10px 11px!important;
}

.forum-thread{
  min-height:61px!important;
}

/* Forum content is visually tighter, like the reference. */
.workspace-header{
  min-height:0!important;
  height:0!important;
  padding:0!important;
  border:0!important;
  overflow:visible!important;
}

.workspace-header .workspace-title,
.workspace-header>.workspace-primary{
  display:none!important;
}

.forum-breadcrumb{
  min-height:42px!important;
}

.forum-side-info{
  padding:11px 12px!important;
}

/* ---------------------------------------------------------
   Bottom dock stays accessible instead of disappearing below shop
   --------------------------------------------------------- */

.portal-bottom-tabs{
  position:sticky!important;
  bottom:12px!important;
  z-index:35!important;
  min-height:70px!important;
  margin:12px 0 0!important;
  background:
    linear-gradient(180deg,rgba(12,16,24,.97),rgba(7,10,16,.985))!important;
  backdrop-filter:blur(20px)!important;
  -webkit-backdrop-filter:blur(20px)!important;
}

.bottom-tab{
  font-size:.63rem!important;
}

.bottom-tab>span{
  font-size:.91rem!important;
}

/* ---------------------------------------------------------
   PROFILE is one panel now; SHOP replaces it instead of making
   a huge long page.
   --------------------------------------------------------- */

.player-core-red,
.yun-shop{
  min-height:390px;
}

.yun-shop{
  margin-top:0!important;
}

.shop-back-v15{
  min-height:34px;
  flex:0 0 auto;
  padding:0 11px;
  border-radius:7px;
  border:1px solid rgba(255,48,79,.13);
  background:rgba(255,48,79,.025);
  color:#ff7488;
  font-size:.44rem;
  font-weight:850;
  cursor:pointer;
}

.shop-back-v15:hover{
  border-color:rgba(255,48,79,.24);
  background:rgba(255,48,79,.055);
}

.shop-heading{
  align-items:center!important;
}

/* ---------------------------------------------------------
   DESKTOP proportions calibrated to the 2048px Safari screenshots
   --------------------------------------------------------- */

@media(min-width:1400px){
  .portal-topbar{
    width:min(1380px,94vw)!important;
  }

  .portal-main{
    width:min(1460px,94vw)!important;
  }
}

@media(max-width:1080px){
  .portal-topbar{
    width:min(96vw,1380px)!important;
  }

  .portal-main{
    width:min(96vw,1460px)!important;
    grid-template-columns:minmax(0,1fr) 300px!important;
  }

  .portal-main>.auth-shell{
    width:300px!important;
  }

  .portal-status.user-stat{
    display:none!important;
  }
}

@media(max-width:850px){
  .portal-main{
    grid-template-columns:1fr!important;
  }

  .portal-main>.auth-shell{
    grid-column:1!important;
    width:min(390px,100%)!important;
    margin:0 auto!important;
  }

  .index-hero{
    min-height:335px!important;
  }

  .forum-browser{
    grid-template-columns:1fr!important;
  }

  .forum-side-info{
    display:none!important;
  }
}

@media(max-width:560px){
  .hero-title-block h1{
    font-size:clamp(3rem,14vw,4.2rem)!important;
  }

  .hero-title-block h2{
    font-size:clamp(2rem,9vw,2.8rem)!important;
  }

  .index-play{
    min-height:78px!important;
  }

  .portal-bottom-tabs{
    bottom:7px!important;
  }
}


/* =========================================================
   V16 — functional repair + closer reference proportions
   ========================================================= */

/* Navbar from the reference is not full-screen wide. */
.portal-topbar{
  width:min(1290px,calc(100vw - 72px))!important;
  min-height:76px!important;
  border-radius:38px!important;
}

/* Main forum/content panel is wider than navbar, like the reference. */
.portal-main{
  width:min(1415px,calc(100vw - 72px))!important;
  grid-template-columns:minmax(0,1fr) 292px!important;
  gap:13px!important;
}

/* Hero calibrated back toward the supplied reference. */
.index-hero{
  min-height:344px!important;
  padding-top:23px!important;
}

.hero-title-block{
  width:min(680px,100%)!important;
}

.hero-title-block h1{
  font-size:clamp(4.05rem,5.15vw,5.95rem)!important;
  transform:scaleX(.90)!important;
}

.hero-title-block h2{
  font-size:clamp(2.05rem,3vw,3.45rem)!important;
}

.index-play{
  width:min(455px,92%)!important;
  min-height:82px!important;
}

/* Login width/proportions from target. */
.portal-main>.auth-shell{
  width:292px!important;
  margin-top:28px!important;
}

.portal-main .auth{
  padding:14px!important;
  border-radius:13px!important;
}

.portal-main .social-btn{
  text-decoration:none!important;
  opacity:1!important;
  pointer-events:auto!important;
}

.portal-main .social-btn:visited{
  color:#e9edeb!important;
}

.portal-main .social-btn.busy{
  opacity:.62!important;
}

/* Forum reference: left categories / center discussion / right info. */
.portal-workspace{
  min-height:420px!important;
}

#forumView>.workspace-header{
  display:none!important;
}

.forum-browser{
  min-height:420px!important;
  grid-template-columns:215px minmax(0,1fr) 220px!important;
}

.forum-sidebar{
  position:relative;
  padding-bottom:51px!important;
}

.forum-new-topic-side{
  position:absolute;
  left:10px;
  right:10px;
  bottom:10px;

  min-height:31px;
  border:1px solid rgba(255,48,79,.16);
  border-radius:6px;
  background:rgba(255,48,79,.03);
  color:#ff667c;

  font-size:.42rem;
  font-weight:850;
  cursor:pointer;
}

.forum-new-topic-side:hover{
  color:#fff;
  background:linear-gradient(180deg,#ee3951,#bd1636);
}

.forum-inline-error{
  margin:22px;
  padding:22px 18px;

  border:1px solid rgba(255,57,82,.16);
  border-radius:8px;
  background:rgba(255,48,79,.025);

  text-align:center;
}

.forum-inline-error strong,
.forum-inline-error span{
  display:block;
}

.forum-inline-error strong{
  color:#e6eaed;
  font-size:.64rem;
}

.forum-inline-error span{
  margin-top:6px;
  color:#a47179;
  font-size:.50rem;
}

.forum-inline-error button{
  min-height:31px;
  margin-top:11px;
  padding:0 12px;

  border:1px solid rgba(255,48,79,.18);
  border-radius:6px;
  background:rgba(255,48,79,.055);
  color:#ff7185;

  font-size:.42rem;
  font-weight:850;
  cursor:pointer;
}

.workspace-empty.error-state{
  display:flex;
  flex-direction:column;
  gap:6px;
  color:#a8737b;
}

.workspace-empty.error-state strong{
  color:#e3e7ea;
}

/* Private messages get the same usable footprint as forum. */
.messages-workspace{
  min-height:420px!important;
}

.messages-layout{
  min-height:420px!important;
  grid-template-columns:290px minmax(0,1fr)!important;
}

.chat-panel,
.chat-active{
  min-height:420px!important;
}

/* The dock in the reference is BELOW the panel, never covering it. */
.portal-bottom-tabs{
  position:relative!important;
  bottom:auto!important;
  z-index:15!important;
  margin-top:13px!important;
  min-height:69px!important;
}

/* Profile stays compact. */
.player-core-red{
  min-height:420px!important;
}

/* Shop is a separate bounded panel. */
.yun-shop{
  min-height:420px!important;
  max-height:620px;
  overflow:auto!important;
}

/* Desktop target */
@media(min-width:1500px){
  .portal-topbar{
    width:1290px!important;
  }

  .portal-main{
    width:1415px!important;
  }
}

@media(max-width:900px){
  .portal-topbar,
  .portal-main{
    width:min(96vw,1415px)!important;
  }

  .portal-main{
    grid-template-columns:1fr!important;
  }

  .portal-main>.auth-shell{
    width:min(390px,100%)!important;
    margin:0 auto!important;
  }

  .forum-browser,
  .messages-layout{
    grid-template-columns:1fr!important;
  }

  .forum-side-info{
    display:none!important;
  }
}


/* =========================================================
   V17 — NAV / THEME / AUTH UX / AUTOFILL / OAUTH
   ========================================================= */

/* Navbar: no play CTA, clean auth controls */
.portal-top-actions{
  gap:9px!important;
}

.top-guest-actions{
  gap:7px!important;
}

.top-guest-actions button{
  min-height:40px!important;
  padding:0 13px!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;

  border-radius:12px!important;
  border:1px solid rgba(255,255,255,.075)!important;

  color:#b9c1c9!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.018))!important;

  font-size:.45rem!important;
  font-weight:850!important;
  letter-spacing:.045em!important;

  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
  transition:.18s ease!important;
}

.top-guest-actions button>span{
  color:#6d7781;
  font-size:.61rem;
}

.top-guest-actions button:hover{
  transform:translateY(-1px);
  color:#eef1f3!important;
  border-color:rgba(255,255,255,.13)!important;
  background:rgba(255,255,255,.055)!important;
}

.top-guest-actions .nav-auth-register{
  color:#ff8394!important;
  border-color:rgba(255,57,83,.14)!important;
  background:
    linear-gradient(180deg,rgba(255,48,79,.075),rgba(255,48,79,.028))!important;
}

.top-guest-actions .nav-auth-register>span{
  color:#ff4d68;
}

.top-guest-actions .nav-auth-register:hover{
  color:#fff!important;
  border-color:rgba(255,69,96,.25)!important;
  background:rgba(255,48,79,.11)!important;
}

/* Real theme switch */
.theme-switch-v17{
  width:auto!important;
  min-width:88px!important;
  height:40px!important;
  padding:0 11px!important;

  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;

  border-radius:12px!important;
  border:1px solid rgba(255,255,255,.075)!important;

  color:#aeb6be!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.018))!important;

  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}

.theme-switch-icon{
  width:21px;
  height:21px;
  display:grid;
  place-items:center;

  border-radius:7px;
  color:#d7dde2;
  background:rgba(255,255,255,.045);

  font-size:.67rem;
}

.theme-switch-label{
  font-size:.40rem;
  font-weight:850;
  letter-spacing:.07em;
}

.theme-switch-v17:hover{
  color:#fff!important;
  border-color:rgba(255,255,255,.13)!important;
}

/* ---------------------------------------------------------
   Locked PLAY UX
   --------------------------------------------------------- */

.index-play.play-locked{
  position:relative;
  overflow:hidden;
  opacity:.92!important;

  color:#8f969d!important;
  border-color:rgba(255,255,255,.09)!important;

  background:
    linear-gradient(180deg,rgba(32,36,43,.96),rgba(15,19,25,.98))!important;

  box-shadow:
    0 11px 25px rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.035)!important;
}

.index-play.play-locked::before{
  display:none!important;
}

.play-lock-mark{
  width:34px;
  height:34px;
  position:absolute;
  left:19px;
  top:50%;
  transform:translateY(-50%);

  display:grid;
  place-items:center;

  border-radius:10px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(0,0,0,.17);
  color:#7b838b;
}

.play-lock-mark svg,
.play-auth-bubble-icon svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.play-auth-bubble{
  width:min(455px,92%);
  min-height:58px;

  position:relative;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;

  margin:10px auto 0;
  padding:8px 9px 8px 10px;

  border-radius:13px;
  border:1px solid rgba(255,57,83,.12);

  background:
    radial-gradient(circle at 0 50%,rgba(255,48,79,.045),transparent 34%),
    linear-gradient(180deg,rgba(12,16,22,.90),rgba(7,11,17,.94));

  box-shadow:
    0 13px 28px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.025);
}

.play-auth-bubble::before{
  content:"";
  width:10px;
  height:10px;
  position:absolute;
  left:50%;
  top:-6px;
  transform:translateX(-50%) rotate(45deg);

  border-left:1px solid rgba(255,57,83,.12);
  border-top:1px solid rgba(255,57,83,.12);
  background:#0b0f16;
}

.play-auth-bubble-icon{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;

  border-radius:10px;
  color:#ff6b80;
  border:1px solid rgba(255,48,79,.12);
  background:rgba(255,48,79,.035);
}

.play-auth-bubble-copy{
  min-width:0;
  text-align:left;
}

.play-auth-bubble-copy strong,
.play-auth-bubble-copy small{
  display:block;
}

.play-auth-bubble-copy strong{
  color:#e6e9ec;
  font-size:.49rem;
  font-weight:850;
  letter-spacing:.055em;
}

.play-auth-bubble-copy small{
  margin-top:3px;
  color:#747e88;
  font-size:.43rem;
  line-height:1.35;
}

.play-auth-bubble button{
  min-height:34px;
  padding:0 10px;

  border-radius:8px;
  border:1px solid rgba(255,48,79,.16);

  color:#ff7589;
  background:rgba(255,48,79,.045);

  font-size:.40rem;
  font-weight:850;
  cursor:pointer;
}

.play-auth-bubble button:hover{
  color:#fff;
  background:linear-gradient(180deg,#ef3851,#bd1636);
}

/* ---------------------------------------------------------
   Remember me — red, compact, premium
   --------------------------------------------------------- */

.portal-main .remember.premium-check{
  min-height:30px;
  gap:8px!important;
  padding:0 9px 0 5px;

  border-radius:9px;
  border:1px solid transparent;

  color:#929aa3;
  transition:.18s ease;
}

.portal-main .remember.premium-check:hover{
  border-color:rgba(255,48,79,.07);
  background:rgba(255,48,79,.018);
}

.portal-main .premium-check .check-ui{
  width:19px!important;
  height:19px!important;
  flex:0 0 19px!important;

  border-radius:6px!important;
  border:1px solid rgba(255,255,255,.14)!important;

  background:
    linear-gradient(180deg,#171c23,#0c1016)!important;

  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}

.portal-main .premium-check .check-ui::before{
  background:linear-gradient(145deg,#ff526c,#c91638)!important;
}

.portal-main .premium-check:hover .check-ui{
  border-color:rgba(255,65,91,.30)!important;
  box-shadow:0 0 0 3px rgba(255,48,79,.025)!important;
}

.portal-main .premium-check input:focus-visible + .check-ui{
  outline:2px solid rgba(255,61,87,.48)!important;
  outline-offset:2px!important;
}

.portal-main .premium-check input:checked + .check-ui{
  border-color:rgba(255,61,87,.58)!important;
  box-shadow:0 0 13px rgba(255,48,79,.11)!important;
}

.portal-main .premium-check input:checked + .check-ui svg{
  color:#fff!important;
}

.portal-main .remember .check-label{
  color:#8f98a1!important;
  font-size:.43rem!important;
  font-weight:650!important;
}

/* ---------------------------------------------------------
   Browser autofill — no ugly yellow/blue field
   --------------------------------------------------------- */

.portal-main input:-webkit-autofill,
.portal-main input:-webkit-autofill:hover,
.portal-main input:-webkit-autofill:focus,
.portal-main input:-webkit-autofill:active{
  -webkit-text-fill-color:#e6eaed!important;
  caret-color:#e6eaed!important;

  -webkit-box-shadow:
    0 0 0 1000px #090e15 inset!important;

  box-shadow:
    0 0 0 1000px #090e15 inset!important;

  transition:background-color 9999s ease-out 0s!important;
  border-radius:0!important;
}

.portal-main input:autofill{
  color:#e6eaed!important;
  background:#090e15!important;
}

/* OAuth controls must be unmistakably clickable */
.portal-main .social{
  position:relative;
  z-index:5;
}

.portal-main .social-btn{
  pointer-events:auto!important;
  cursor:pointer!important;
  user-select:none;
  -webkit-user-select:none;
}

.portal-main .steam-btn,
.portal-main .google-btn{
  min-height:39px!important;
  border-color:rgba(255,255,255,.08)!important;
  background:rgba(255,255,255,.025)!important;
}

.portal-main .steam-btn:hover{
  border-color:rgba(111,157,201,.24)!important;
  background:rgba(81,123,163,.06)!important;
}

.portal-main .google-btn:hover{
  border-color:rgba(255,255,255,.16)!important;
  background:rgba(255,255,255,.055)!important;
}

/* =========================================================
   ACTUAL LIGHT MODE
   ========================================================= */

html[data-theme="light"]{
  color-scheme:light;
}

html[data-theme="light"] body{
  color:#202731!important;
  background:#dfe3e8!important;
}

html[data-theme="light"] .bg{
  filter:
    saturate(.58)
    contrast(.92)
    brightness(1.24)!important;
}

html[data-theme="light"] .veil{
  background:
    linear-gradient(180deg,rgba(235,239,243,.42),rgba(223,227,232,.53)),
    radial-gradient(circle at 50% 30%,rgba(255,255,255,.25),transparent 42%)!important;
}

html[data-theme="light"] .noise{
  opacity:.025!important;
}

/* Navbar */
html[data-theme="light"] .portal-topbar{
  border-color:rgba(31,40,52,.10)!important;
  background:
    linear-gradient(180deg,rgba(249,250,251,.94),rgba(235,238,242,.93))!important;

  box-shadow:
    0 20px 48px rgba(43,51,62,.15),
    inset 0 1px 0 rgba(255,255,255,.86)!important;
}

html[data-theme="light"] .portal-topbar .brand-copy strong{
  color:#202631!important;
}

html[data-theme="light"] .portal-status{
  border-color:rgba(28,36,47,.08)!important;
}

html[data-theme="light"] .portal-status>span:not(.status-icon):not(.status-coin):not(.status-level){
  color:#727c87!important;
}

html[data-theme="light"] .portal-status>strong{
  color:#343c46!important;
}

html[data-theme="light"] .top-guest-actions button,
html[data-theme="light"] .theme-switch-v17{
  color:#555f69!important;
  border-color:rgba(27,36,47,.10)!important;

  background:
    linear-gradient(180deg,rgba(255,255,255,.72),rgba(225,229,234,.64))!important;
}

html[data-theme="light"] .top-guest-actions button:hover,
html[data-theme="light"] .theme-switch-v17:hover{
  color:#202731!important;
  border-color:rgba(27,36,47,.16)!important;
  background:#fff!important;
}

html[data-theme="light"] .theme-switch-icon{
  color:#9a6b00;
  background:rgba(255,190,35,.12);
}

/* Hero remains readable */
html[data-theme="light"] .hero-title-block h1{
  color:#20242a!important;
  text-shadow:
    0 2px 0 rgba(255,255,255,.65),
    0 12px 22px rgba(255,255,255,.12)!important;
}

html[data-theme="light"] .hero-title-block>p{
  color:#59636d!important;
}

html[data-theme="light"] .index-server-badges span{
  color:#49535e!important;
  border-color:rgba(28,36,47,.09)!important;
  background:rgba(247,249,251,.76)!important;
}

html[data-theme="light"] .index-play.play-locked{
  color:#7e8790!important;
  border-color:rgba(28,36,47,.10)!important;

  background:
    linear-gradient(180deg,rgba(240,243,246,.96),rgba(218,222,227,.97))!important;

  box-shadow:
    0 12px 25px rgba(53,61,72,.12),
    inset 0 1px 0 rgba(255,255,255,.88)!important;
}

html[data-theme="light"] .play-lock-mark{
  color:#68727d;
  border-color:rgba(28,36,47,.09);
  background:rgba(255,255,255,.55);
}

html[data-theme="light"] .play-auth-bubble{
  border-color:rgba(207,34,65,.13)!important;

  background:
    radial-gradient(circle at 0 50%,rgba(255,48,79,.035),transparent 34%),
    linear-gradient(180deg,rgba(249,250,251,.93),rgba(232,235,239,.95))!important;

  box-shadow:
    0 14px 28px rgba(45,53,64,.12),
    inset 0 1px 0 rgba(255,255,255,.86)!important;
}

html[data-theme="light"] .play-auth-bubble::before{
  background:#f2f4f6;
}

html[data-theme="light"] .play-auth-bubble-copy strong{
  color:#343c45;
}

html[data-theme="light"] .play-auth-bubble-copy small{
  color:#727c86;
}

/* Main cards */
html[data-theme="light"] .auth,
html[data-theme="light"] .portal-workspace,
html[data-theme="light"] .player-core-red,
html[data-theme="light"] .yun-shop,
html[data-theme="light"] .settings-window{
  color:#27303a!important;
  border-color:rgba(31,40,52,.10)!important;

  background:
    radial-gradient(circle at 0 0,rgba(255,48,79,.025),transparent 25%),
    linear-gradient(160deg,rgba(248,249,250,.96),rgba(228,232,236,.97))!important;

  box-shadow:
    0 24px 50px rgba(49,57,68,.14),
    inset 0 1px 0 rgba(255,255,255,.86)!important;
}

/* Auth text and fields */
html[data-theme="light"] .portal-main #loginForm::before,
html[data-theme="light"] .portal-main #registerForm::before{
  color:#59636e!important;
}

html[data-theme="light"] .portal-main .field{
  border-color:rgba(31,40,52,.10)!important;
  background:rgba(255,255,255,.62)!important;
}

html[data-theme="light"] .portal-main .field-symbol{
  border-color:rgba(31,40,52,.08)!important;
}

html[data-theme="light"] .portal-main .field-symbol svg{
  stroke:#65717c!important;
}

html[data-theme="light"] .portal-main input{
  color:#28313b!important;
  caret-color:#28313b!important;
}

html[data-theme="light"] .portal-main input::placeholder{
  color:#8a949e!important;
}

html[data-theme="light"] .portal-main input:-webkit-autofill,
html[data-theme="light"] .portal-main input:-webkit-autofill:hover,
html[data-theme="light"] .portal-main input:-webkit-autofill:focus,
html[data-theme="light"] .portal-main input:-webkit-autofill:active{
  -webkit-text-fill-color:#28313b!important;
  caret-color:#28313b!important;
  -webkit-box-shadow:0 0 0 1000px #f5f7f8 inset!important;
  box-shadow:0 0 0 1000px #f5f7f8 inset!important;
}

html[data-theme="light"] .portal-main .premium-check .check-ui{
  border-color:rgba(31,40,52,.16)!important;
  background:linear-gradient(180deg,#fff,#e5e9ed)!important;
}

html[data-theme="light"] .portal-main .remember .check-label,
html[data-theme="light"] .portal-main .link,
html[data-theme="light"] .auth-switch-line{
  color:#69747f!important;
}

html[data-theme="light"] .portal-main .social-btn{
  color:#39434d!important;
  border-color:rgba(31,40,52,.10)!important;
  background:rgba(255,255,255,.58)!important;
}

/* Forum/messages */
html[data-theme="light"] .forum-sidebar,
html[data-theme="light"] .forum-main,
html[data-theme="light"] .forum-side-info,
html[data-theme="light"] .conversation-sidebar,
html[data-theme="light"] .chat-panel{
  background:rgba(255,255,255,.26)!important;
  border-color:rgba(31,40,52,.08)!important;
}

html[data-theme="light"] .forum-category,
html[data-theme="light"] .forum-thread,
html[data-theme="light"] .conversation-item{
  color:#515b66!important;
}

html[data-theme="light"] .forum-thread-title strong,
html[data-theme="light"] .conversation-copy strong,
html[data-theme="light"] .chat-user strong,
html[data-theme="light"] .thread-post-head strong{
  color:#2d3540!important;
}

html[data-theme="light"] .forum-thread-title small,
html[data-theme="light"] .conversation-copy small,
html[data-theme="light"] .chat-user span,
html[data-theme="light"] .thread-post-body{
  color:#6d7782!important;
}

html[data-theme="light"] .forum-thread,
html[data-theme="light"] .conversation-item,
html[data-theme="light"] .thread-origin,
html[data-theme="light"] .thread-reply{
  border-color:rgba(31,40,52,.075)!important;
  background:rgba(255,255,255,.35)!important;
}

html[data-theme="light"] .chat-row:not(.mine) .chat-bubble{
  color:#3f4852!important;
  border-color:rgba(31,40,52,.08)!important;
  background:#f8f9fa!important;
}

/* Bottom dock */
html[data-theme="light"] .portal-bottom-tabs{
  border-color:rgba(31,40,52,.10)!important;

  background:
    linear-gradient(180deg,rgba(247,249,250,.97),rgba(225,229,233,.98))!important;

  box-shadow:
    0 22px 45px rgba(46,54,65,.15),
    inset 0 1px 0 rgba(255,255,255,.85)!important;
}

html[data-theme="light"] .bottom-tab{
  color:#6a7480!important;
  border-color:rgba(31,40,52,.08)!important;
}

html[data-theme="light"] .dock-notch{
  background:#eef1f4!important;
}

/* Settings */
html[data-theme="light"] .settings-header,
html[data-theme="light"] .settings-nav{
  border-color:rgba(31,40,52,.08)!important;
}

html[data-theme="light"] .settings-nav{
  background:rgba(221,225,229,.35)!important;
}

html[data-theme="light"] .settings-header h2,
html[data-theme="light"] .settings-panel-head h3,
html[data-theme="light"] .setting-row strong{
  color:#303943!important;
}

html[data-theme="light"] .settings-header p,
html[data-theme="light"] .setting-row small{
  color:#727c87!important;
}

html[data-theme="light"] .setting-row{
  border-color:rgba(31,40,52,.08)!important;
  background:rgba(255,255,255,.38)!important;
}

@media(max-width:760px){
  .theme-switch-v17{
    min-width:40px!important;
    width:40px!important;
    padding:0!important;
  }

  .theme-switch-label{
    display:none;
  }

  .play-auth-bubble{
    grid-template-columns:35px minmax(0,1fr)!important;
  }

  .play-auth-bubble button{
    grid-column:1/-1;
    width:100%;
  }
}


/* =========================================================
   V18 — OAuth login fix + minimalist play notice
   ========================================================= */

.play-auth-bubble.play-auth-minimal{
  width:auto!important;
  min-height:0!important;
  display:inline-flex!important;
  grid-template-columns:none!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  margin:8px auto 0!important;
  padding:5px 9px!important;
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.055)!important;
  color:#747d86!important;
  background:rgba(7,10,15,.44)!important;
  box-shadow:none!important;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  font-size:.40rem!important;
  line-height:1!important;
}

.play-auth-bubble.play-auth-minimal::before{display:none!important}

.play-auth-mini-lock{
  width:15px;
  height:15px;
  display:grid;
  place-items:center;
  color:#69727b;
}

.play-auth-mini-lock svg{
  width:12px;
  height:12px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.play-auth-bubble.play-auth-minimal>span:not(.play-auth-mini-lock){
  white-space:nowrap;
}

.play-auth-bubble.play-auth-minimal button{
  min-height:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  color:#c6cbd0!important;
  background:transparent!important;
  font-size:.40rem!important;
  font-weight:750!important;
  text-decoration:underline;
  text-decoration-color:rgba(198,203,208,.28);
  text-underline-offset:2px;
  cursor:pointer;
}

.play-auth-bubble.play-auth-minimal button:hover{
  color:#ff6379!important;
  background:transparent!important;
  text-decoration-color:rgba(255,99,121,.48);
}

.oauth-inline-status{
  min-height:34px;
  display:grid;
  grid-template-columns:20px minmax(0,1fr);
  align-items:center;
  gap:7px;
  margin:2px 0 6px;
  padding:6px 8px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.065);
  background:rgba(255,255,255,.018);
}

.oauth-inline-status.hidden{display:none!important}

.oauth-inline-icon{
  width:19px;
  height:19px;
  display:grid;
  place-items:center;
  border-radius:6px;
  font-size:.42rem;
  font-weight:900;
}

.oauth-inline-copy{
  min-width:0;
  color:#8d969f;
  font-size:.41rem;
  line-height:1.35;
}

.oauth-inline-status.error{
  border-color:rgba(255,59,85,.11);
  background:rgba(255,48,79,.025);
}

.oauth-inline-status.error .oauth-inline-icon{
  color:#ff7084;
  background:rgba(255,48,79,.07);
}

.oauth-inline-status.success{
  border-color:rgba(83,190,124,.10);
  background:rgba(83,190,124,.018);
}

.oauth-inline-status.success .oauth-inline-icon{
  color:#74d899;
  background:rgba(83,190,124,.06);
}

html[data-theme="light"] .play-auth-bubble.play-auth-minimal{
  color:#707984!important;
  border-color:rgba(31,40,52,.075)!important;
  background:rgba(248,249,250,.64)!important;
}

html[data-theme="light"] .play-auth-bubble.play-auth-minimal button{
  color:#515b66!important;
}

html[data-theme="light"] .oauth-inline-status{
  border-color:rgba(31,40,52,.08);
  background:rgba(255,255,255,.38);
}

@media(max-width:560px){
  .play-auth-bubble.play-auth-minimal{
    width:min(92%,455px)!important;
    flex-wrap:wrap;
    line-height:1.25!important;
  }

  .play-auth-bubble.play-auth-minimal>span:not(.play-auth-mini-lock){
    white-space:normal;
  }
}


/* =========================================================
   V19 — navigation repair + readable responsive community UI
   ========================================================= */

/* Authenticated workspaces should not stretch across an ultra-wide display. */
.is-authenticated #forumView,
.is-authenticated #messagesView,
.is-authenticated #loggedCard,
.is-authenticated #portalBottomTabs{
  width:min(1160px,100%)!important;
  max-width:1160px!important;
  justify-self:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Forum is intentionally denser and more readable. */
#forumView{
  border-radius:16px!important;
  overflow:hidden!important;
}

.forum-browser{
  grid-template-columns:190px minmax(0,1fr) 205px!important;
  min-height:430px!important;
}

.forum-sidebar{
  padding:13px 11px 52px!important;
}

.workspace-section-label{
  font-size:.48rem!important;
  letter-spacing:.09em!important;
}

.forum-category{
  min-height:52px!important;
  padding:9px 10px!important;
}

.forum-category strong{
  font-size:.58rem!important;
  line-height:1.2!important;
}

.forum-category small{
  margin-top:3px!important;
  font-size:.45rem!important;
  line-height:1.3!important;
}

/* Restore useful toolbar/search that older visual overrides had hidden. */
.forum-toolbar{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  min-height:52px!important;
  padding:8px 12px!important;
  border-bottom:1px solid rgba(255,255,255,.05)!important;
}

.workspace-search{
  flex:1 1 320px!important;
  max-width:430px!important;
}

.workspace-search input{
  min-height:34px!important;
  font-size:.53rem!important;
}

.forum-current-category{
  font-size:.45rem!important;
  color:#737d87!important;
}

.forum-breadcrumb{
  min-height:44px!important;
  padding:0 13px!important;
  font-size:.50rem!important;
}

.forum-table-head{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 68px 82px!important;
  gap:8px!important;
  padding:8px 14px!important;
  color:#68727c!important;
  border-bottom:1px solid rgba(255,255,255,.045)!important;
  font-size:.40rem!important;
  font-weight:800!important;
  letter-spacing:.07em!important;
}

.forum-thread-list{
  padding:6px 9px 10px!important;
}

.forum-thread{
  min-height:66px!important;
  grid-template-columns:minmax(0,1fr) 68px 82px!important;
  border-radius:8px!important;
}

.forum-thread-main{
  grid-template-columns:40px minmax(0,1fr)!important;
  gap:10px!important;
}

.forum-thread-main img{
  width:40px!important;
  height:40px!important;
}

.forum-thread-title strong{
  color:#e7eaed!important;
  font-size:.61rem!important;
  line-height:1.28!important;
}

.forum-thread-title small{
  margin-top:4px!important;
  color:#7d8791!important;
  font-size:.46rem!important;
  line-height:1.3!important;
}

.forum-thread-stat{
  font-size:.44rem!important;
  line-height:1.3!important;
}

.forum-side-info{
  padding:13px 11px!important;
}

.topic-info-list span,
.topic-info-list strong{
  font-size:.44rem!important;
}

/* Topic detail gets a comfortable reading column. */
.forum-thread-detail{
  max-width:900px!important;
  margin:0 auto!important;
  padding:16px!important;
}

.thread-origin,
.thread-reply{
  border-radius:10px!important;
}

.thread-post-body{
  font-size:.60rem!important;
  line-height:1.65!important;
}

/* Messages follow the same centered footprint. */
.messages-layout{
  grid-template-columns:280px minmax(0,1fr)!important;
  min-height:430px!important;
}

.conversation-copy strong{
  font-size:.56rem!important;
}

.conversation-copy small,
.chat-user span{
  font-size:.45rem!important;
}

.chat-bubble{
  max-width:min(72%,620px)!important;
  font-size:.58rem!important;
  line-height:1.5!important;
}

/* Bottom navigation is always a stable sibling under the current card. */
#portalBottomTabs{
  position:relative!important;
  bottom:auto!important;
  z-index:20!important;
}

.bottom-tab{
  cursor:pointer!important;
  pointer-events:auto!important;
}

.bottom-tab.active{
  color:#ff536a!important;
}

/* Tablet: hide the tertiary info column, preserve category navigation. */
@media(max-width:1100px){
  .is-authenticated #forumView,
  .is-authenticated #messagesView,
  .is-authenticated #loggedCard,
  .is-authenticated #portalBottomTabs{
    width:min(94vw,980px)!important;
  }

  .forum-browser{
    grid-template-columns:190px minmax(0,1fr)!important;
  }

  .forum-side-info{
    display:none!important;
  }

  .messages-layout{
    grid-template-columns:250px minmax(0,1fr)!important;
  }
}

/* Mobile/tablet: categories become a horizontal strip. */
@media(max-width:760px){
  .is-authenticated #forumView,
  .is-authenticated #messagesView,
  .is-authenticated #loggedCard,
  .is-authenticated #portalBottomTabs{
    width:min(96vw,680px)!important;
  }

  .forum-browser{
    display:block!important;
    min-height:0!important;
  }

  .forum-sidebar{
    padding:10px!important;
    border-right:0!important;
    border-bottom:1px solid rgba(255,255,255,.055)!important;
  }

  .forum-sidebar>.workspace-section-label{
    display:none!important;
  }

  .forum-categories{
    display:flex!important;
    flex-direction:row!important;
    gap:7px!important;
    overflow-x:auto!important;
    padding-bottom:4px!important;
    scrollbar-width:thin;
  }

  .forum-category{
    flex:0 0 auto!important;
    min-width:145px!important;
    min-height:44px!important;
  }

  .forum-new-topic-side{
    position:static!important;
    width:100%!important;
    margin-top:7px!important;
  }

  .forum-toolbar{
    align-items:stretch!important;
    flex-direction:column!important;
  }

  .workspace-search{
    max-width:none!important;
  }

  .forum-current-category{
    display:none!important;
  }

  .forum-table-head{
    display:none!important;
  }

  .forum-thread{
    grid-template-columns:1fr!important;
    min-height:72px!important;
  }

  .forum-thread-stat{
    display:none!important;
  }

  .messages-layout{
    display:block!important;
  }

  .conversation-sidebar{
    min-height:auto!important;
    border-right:0!important;
    border-bottom:1px solid rgba(255,255,255,.055)!important;
  }

  .chat-panel{
    min-height:390px!important;
  }

  .bottom-tab{
    font-size:.50rem!important;
  }
}

@media(max-width:480px){
  .forum-thread-main{
    grid-template-columns:34px minmax(0,1fr)!important;
  }

  .forum-thread-main img{
    width:34px!important;
    height:34px!important;
  }

  .chat-bubble{
    max-width:88%!important;
  }
}

/* Light-mode readability for restored forum toolbar/table. */
html[data-theme="light"] .forum-toolbar,
html[data-theme="light"] .forum-table-head{
  border-color:rgba(31,40,52,.075)!important;
}

html[data-theme="light"] .forum-thread-title strong{
  color:#29323b!important;
}

html[data-theme="light"] .forum-current-category,
html[data-theme="light"] .forum-table-head{
  color:#6f7984!important;
}


/* =========================================================
   V20 — UX / TYPOGRAPHY / ACCOUNT POPOVER / CHAT FIX
   ========================================================= */

/* Always dark. Theme UI/functionality was removed in V20. */
html{
  color-scheme:dark;
  font-size:clamp(15px, .15vw + 14.4px, 18px);
}

body{
  font-size:1rem;
}

/* Guarantee authenticated login hint never remains visible. */
.is-authenticated #playAuthBubble,
.is-authenticated #playLockMark{
  display:none!important;
}

/* ---------------------------------------------------------
   Steam — genuine Simple Icons brand mark
   --------------------------------------------------------- */

.steam-brand-icon{
  overflow:visible!important;
  border:0!important;
  background:transparent!important;
}

.steam-brand-icon img{
  width:22px!important;
  height:22px!important;
  display:block;
  object-fit:contain;
  filter:invert(1) brightness(1.12);
}

/* ---------------------------------------------------------
   NAVBAR ACCOUNT STATS
   --------------------------------------------------------- */

.portal-status.account-stat{
  min-width:auto!important;
  padding:.42rem .70rem!important;
  gap:.48rem!important;
  border-radius:.75rem!important;
  border:1px solid rgba(255,255,255,.055)!important;
  background:rgba(255,255,255,.018)!important;
}

.account-stat .stat-copy{
  display:flex!important;
  flex-direction:column;
  align-items:flex-start;
  line-height:1.05;
}

.account-stat .stat-copy small{
  color:#6f7882!important;
  font-size:clamp(.56rem,.53rem + .08vw,.64rem)!important;
  font-weight:750;
  letter-spacing:.065em;
}

.account-stat .stat-copy strong{
  margin-top:.18rem;
  color:#d7dce0!important;
  font-size:clamp(.72rem,.68rem + .10vw,.82rem)!important;
  font-weight:850;
}

.status-coin,
.status-level,
.status-vip,
.status-id{
  min-width:1.70rem;
  height:1.70rem;
  display:grid;
  place-items:center;
  border-radius:.55rem;
  font-size:.62rem!important;
  font-weight:900;
}

.status-coin{
  color:#ffd365;
  border:1px solid rgba(255,195,56,.15);
  background:rgba(255,195,56,.055);
}

.status-level{
  color:#ff6e83;
  border:1px solid rgba(255,48,79,.14);
  background:rgba(255,48,79,.05);
}

.status-vip{
  color:#ffd45c;
  border:1px solid rgba(255,199,58,.14);
  background:rgba(255,199,58,.045);
}

.status-id{
  color:#9ba5af;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.025);
}

.vip-stat.inactive .status-vip,
.vip-stat.inactive strong{
  color:#747d86!important;
}

/* ---------------------------------------------------------
   AVATAR ACCOUNT POPOVER
   --------------------------------------------------------- */

.portal-top-actions{
  position:relative;
}

.top-user{
  width:auto!important;
  min-width:3.10rem!important;
  height:3.10rem!important;
  padding:.25rem!important;
  border-radius:1rem!important;
  border:1px solid rgba(255,255,255,.075)!important;
  background:rgba(255,255,255,.025)!important;
  transition:.18s ease;
}

.top-user:hover,
.top-user.active{
  border-color:rgba(255,69,96,.18)!important;
  background:rgba(255,48,79,.04)!important;
}

.top-user img{
  width:2.55rem!important;
  height:2.55rem!important;
  border-radius:.80rem!important;
}

.account-popover{
  width:min(23rem, calc(100vw - 1.5rem));
  position:absolute;
  z-index:120;
  right:0;
  top:calc(100% + .75rem);

  padding:.85rem;

  border:1px solid rgba(255,255,255,.085);
  border-radius:1.05rem;

  background:
    radial-gradient(circle at 85% 0,rgba(255,48,79,.075),transparent 30%),
    linear-gradient(160deg,rgba(12,17,24,.985),rgba(6,10,16,.99));

  box-shadow:
    0 1.6rem 3.5rem rgba(0,0,0,.46),
    inset 0 1px 0 rgba(255,255,255,.035);

  backdrop-filter:blur(22px);
  -webkit-backdrop-filter:blur(22px);
}

.account-popover.hidden{
  display:none!important;
}

.account-popover-arrow{
  width:.72rem;
  height:.72rem;
  position:absolute;
  right:1.22rem;
  top:-.39rem;
  transform:rotate(45deg);
  border-left:1px solid rgba(255,255,255,.085);
  border-top:1px solid rgba(255,255,255,.085);
  background:#0b1017;
}

.account-popover-head{
  display:grid;
  grid-template-columns:3.25rem minmax(0,1fr);
  align-items:center;
  gap:.72rem;
  padding:.10rem .10rem .72rem;
  border-bottom:1px solid rgba(255,255,255,.055);
}

.account-popover-avatar{
  width:3.25rem;
  height:3.25rem;
  position:relative;
  padding:0;
  border-radius:.90rem;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.09);
  background:#10161e;
  cursor:pointer;
}

.account-popover-avatar img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.account-popover-avatar #profileInitial{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:1rem;
  font-weight:900;
}

.avatar-edit-mini{
  width:1.15rem;
  height:1.15rem;
  position:absolute;
  right:.18rem;
  bottom:.18rem;
  display:grid;
  place-items:center;
  border-radius:.38rem;
  color:#fff;
  background:#d91f42;
  font-size:.58rem;
  box-shadow:0 .22rem .55rem rgba(0,0,0,.35);
}

.account-popover-user{
  min-width:0;
}

.account-popover-name-row{
  display:flex;
  align-items:center;
  gap:.42rem;
}

.account-popover-name-row strong{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#f0f2f4;
  font-size:clamp(.95rem,.90rem + .12vw,1.08rem);
  font-weight:850;
}

.account-online-dot{
  width:.43rem;
  height:.43rem;
  flex:0 0 .43rem;
  border-radius:50%;
  background:#54d67a;
  box-shadow:0 0 .60rem rgba(84,214,122,.45);
}

#providerPill{
  display:inline-flex;
  margin-top:.28rem;
  padding:.20rem .42rem;
  border-radius:.42rem;
  color:#ff8294;
  background:rgba(255,48,79,.045);
  border:1px solid rgba(255,48,79,.09);
  font-size:.60rem;
  font-weight:800;
  letter-spacing:.045em;
}

.account-popover-user>small{
  display:block;
  margin-top:.28rem;
  color:#737d87;
  font-size:.69rem;
}

.account-progress{
  padding:.75rem .15rem .68rem;
  border-bottom:1px solid rgba(255,255,255,.055);
}

.account-progress-top,
.account-progress-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
}

.account-progress-top span{
  color:#d9dde1;
  font-size:.74rem;
  font-weight:800;
}

.account-progress-top small,
.account-progress-foot{
  color:#727c86;
  font-size:.66rem;
}

.account-progress-foot strong{
  color:#a7afb7;
}

.account-progress-track{
  height:.40rem;
  margin:.48rem 0 .42rem;
  overflow:hidden;
  border-radius:999px;
  background:rgba(255,255,255,.055);
}

.account-progress-track>span{
  width:0;
  height:100%;
  display:block;
  border-radius:inherit;
  background:linear-gradient(90deg,#d7193d,#ff4b66);
  box-shadow:0 0 .65rem rgba(255,48,79,.25);
  transition:width .28s ease;
}

.account-popover-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.42rem;
  padding:.68rem 0;
}

.account-popover-stats>div{
  min-width:0;
  padding:.58rem .52rem;
  border-radius:.65rem;
  border:1px solid rgba(255,255,255,.055);
  background:rgba(255,255,255,.018);
}

.account-popover-stats span,
.account-popover-stats strong{
  display:block;
}

.account-popover-stats span{
  color:#6e7882;
  font-size:.58rem;
  font-weight:750;
  letter-spacing:.055em;
}

.account-popover-stats strong{
  margin-top:.20rem;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#d8dde1;
  font-size:.70rem;
}

#accountPopoverVip{
  color:#ffd05b;
}

.account-quick-actions{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.42rem;
}

.account-action{
  min-height:2.55rem;
  padding:0 .66rem;
  display:flex;
  align-items:center;
  gap:.48rem;
  border:1px solid rgba(255,255,255,.06);
  border-radius:.66rem;
  color:#9fa8b1;
  background:rgba(255,255,255,.018);
  cursor:pointer;
  transition:.16s ease;
}

.account-action>span{
  width:1.25rem;
  color:#727c85;
  font-size:.70rem;
}

.account-action strong{
  font-size:.68rem;
  font-weight:800;
}

.account-action:hover{
  color:#e9ecef;
  border-color:rgba(255,255,255,.11);
  background:rgba(255,255,255,.038);
  transform:translateY(-1px);
}

.account-action.primary{
  color:#ff8596;
  border-color:rgba(255,48,79,.13);
  background:rgba(255,48,79,.035);
}

.account-action.primary>span{
  color:#ff536c;
}

.account-logout{
  width:100%;
  min-height:2.35rem;
  margin-top:.52rem;
  border:1px solid rgba(255,48,79,.08);
  border-radius:.65rem;
  color:#8a7075;
  background:rgba(255,48,79,.015);
  font-size:.64rem;
  font-weight:800;
  cursor:pointer;
}

.account-logout:hover{
  color:#ff8294;
  border-color:rgba(255,48,79,.15);
  background:rgba(255,48,79,.035);
}

/* ---------------------------------------------------------
   TWO-TAB DOCK
   --------------------------------------------------------- */

.portal-bottom-tabs-two{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}

.portal-bottom-tabs-two .bottom-tab{
  min-height:4.3rem!important;
}

.bottom-tab strong{
  font-size:clamp(.76rem,.70rem + .14vw,.90rem)!important;
  line-height:1.15!important;
}

.bottom-tab>span{
  font-size:clamp(1rem,.94rem + .14vw,1.15rem)!important;
}

/* ---------------------------------------------------------
   RESPONSIVE / READABLE TYPOGRAPHY
   --------------------------------------------------------- */

.portal-main .auth{
  font-size:1rem;
}

.portal-main #loginForm::before,
.portal-main #registerForm::before{
  font-size:clamp(.72rem,.68rem + .10vw,.82rem)!important;
}

.portal-main .field-content input{
  font-size:clamp(.78rem,.73rem + .12vw,.90rem)!important;
}

.portal-main .check-label,
.portal-main .link,
.auth-switch-line,
.oauth-inline-copy{
  font-size:clamp(.68rem,.64rem + .10vw,.78rem)!important;
}

.portal-main .primary .button-label,
.portal-main .provider-copy strong{
  font-size:clamp(.72rem,.68rem + .10vw,.82rem)!important;
}

/* Forum is deliberately larger than V19. */
.is-authenticated #forumView,
.is-authenticated #messagesView,
.is-authenticated #loggedCard,
.is-authenticated #portalBottomTabs{
  width:min(1240px,96vw)!important;
  max-width:1240px!important;
}

.forum-browser{
  grid-template-columns:220px minmax(0,1fr) 225px!important;
}

.workspace-section-label{
  font-size:clamp(.68rem,.63rem + .12vw,.78rem)!important;
}

.forum-category strong{
  font-size:clamp(.78rem,.72rem + .14vw,.91rem)!important;
}

.forum-category small{
  font-size:clamp(.66rem,.61rem + .11vw,.76rem)!important;
  line-height:1.35!important;
}

.forum-breadcrumb{
  font-size:clamp(.72rem,.67rem + .11vw,.82rem)!important;
}

.workspace-search input{
  font-size:clamp(.74rem,.69rem + .11vw,.84rem)!important;
}

.forum-current-category,
.forum-table-head{
  font-size:clamp(.64rem,.60rem + .09vw,.73rem)!important;
}

.forum-thread-title strong{
  font-size:clamp(.82rem,.76rem + .14vw,.96rem)!important;
  line-height:1.35!important;
}

.forum-thread-title small{
  font-size:clamp(.68rem,.63rem + .11vw,.79rem)!important;
  line-height:1.4!important;
}

.forum-thread-stat,
.topic-info-list span,
.topic-info-list strong,
.forum-top-users strong,
.forum-top-users small{
  font-size:clamp(.65rem,.60rem + .10vw,.75rem)!important;
}

.thread-post-head strong{
  font-size:clamp(.80rem,.74rem + .13vw,.93rem)!important;
}

.thread-post-body{
  font-size:clamp(.78rem,.72rem + .13vw,.92rem)!important;
  line-height:1.65!important;
}

/* Messages / chat readability */
.conversation-copy strong{
  font-size:clamp(.78rem,.72rem + .13vw,.91rem)!important;
}

.conversation-copy small,
.chat-user span{
  font-size:clamp(.66rem,.61rem + .10vw,.76rem)!important;
}

.chat-user strong{
  font-size:clamp(.82rem,.76rem + .13vw,.96rem)!important;
}

.chat-stream{
  gap:.65rem!important;
  padding:1rem!important;
}

.chat-row{
  width:100%!important;
  min-width:0!important;
}

.chat-row.mine{
  justify-content:flex-end!important;
}

.chat-bubble-wrap{
  width:max-content!important;
  min-width:0!important;
  max-width:min(78%,42rem)!important;
  flex:0 1 auto!important;
}

.chat-bubble{
  width:max-content!important;
  min-width:4.25rem!important;
  max-width:100%!important;
  display:block!important;

  padding:.62rem .78rem!important;

  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  hyphens:none!important;

  font-size:clamp(.78rem,.72rem + .13vw,.92rem)!important;
  line-height:1.48!important;
}

.chat-message-time{
  font-size:clamp(.59rem,.55rem + .08vw,.68rem)!important;
}

.chat-composer textarea{
  min-width:0!important;
  font-size:clamp(.78rem,.72rem + .13vw,.92rem)!important;
  line-height:1.4!important;
}

.chat-composer button{
  font-size:clamp(.68rem,.63rem + .10vw,.78rem)!important;
}

/* ---------------------------------------------------------
   RESPONSIVE BREAKPOINTS
   --------------------------------------------------------- */

@media(max-width:1280px){
  .id-stat{
    display:none!important;
  }

  .forum-browser{
    grid-template-columns:210px minmax(0,1fr)!important;
  }

  .forum-side-info{
    display:none!important;
  }
}

@media(max-width:1050px){
  .portal-status.server{
    display:none!important;
  }

  .vip-stat .stat-copy small,
  .level-stat .stat-copy small,
  .yun-stat .stat-copy small{
    display:none;
  }

  .account-stat{
    padding:.36rem .48rem!important;
  }
}

@media(max-width:820px){
  .portal-topbar{
    width:min(96vw,1290px)!important;
    padding:.55rem .65rem!important;
  }

  .portal-statusbar{
    gap:.25rem!important;
  }

  .portal-status:not(.user-stat):not(:first-child){
    display:none!important;
  }

  .vip-stat{
    display:none!important;
  }

  .forum-browser{
    display:block!important;
  }

  .forum-sidebar{
    border-right:0!important;
    border-bottom:1px solid rgba(255,255,255,.055)!important;
  }

  .forum-categories{
    display:flex!important;
    flex-direction:row!important;
    overflow-x:auto!important;
    gap:.45rem!important;
    padding-bottom:.25rem!important;
  }

  .forum-category{
    min-width:10.5rem!important;
    flex:0 0 auto!important;
  }

  .forum-new-topic-side{
    position:static!important;
    width:100%!important;
    margin-top:.45rem!important;
  }

  .messages-layout{
    grid-template-columns:220px minmax(0,1fr)!important;
  }
}

@media(max-width:640px){
  html{
    font-size:15px;
  }

  .portal-statusbar{
    display:none!important;
  }

  .top-user{
    min-width:2.75rem!important;
    height:2.75rem!important;
  }

  .top-user img{
    width:2.25rem!important;
    height:2.25rem!important;
  }

  .account-popover{
    position:fixed!important;
    top:5.2rem!important;
    right:.75rem!important;
    left:.75rem!important;
    width:auto!important;
    max-height:calc(100vh - 6rem);
    overflow:auto;
  }

  .account-popover-arrow{
    right:1.5rem;
  }

  .messages-layout{
    display:block!important;
  }

  .conversation-sidebar{
    max-height:16rem;
    overflow:auto;
    border-right:0!important;
    border-bottom:1px solid rgba(255,255,255,.055)!important;
  }

  .chat-bubble-wrap{
    max-width:88%!important;
  }

  .chat-composer{
    grid-template-columns:minmax(0,1fr)!important;
  }

  .chat-composer button{
    min-height:2.5rem;
  }
}

@media(max-width:430px){
  .account-popover-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .account-popover-stats>div:last-child{
    grid-column:1/-1;
  }

  .account-quick-actions{
    grid-template-columns:1fr;
  }

  .bottom-tab strong{
    font-size:.72rem!important;
  }
}


/* =========================================================
   V21 — FORUM PRO / ADMIN / BIOCOINS
   ========================================================= */

/* BIOCOINS navbar token */
.yun-stat .status-coin{
  color:#64f0c5!important;
  border-color:rgba(73,232,190,.18)!important;
  background:
    radial-gradient(circle at 35% 30%,rgba(105,255,214,.20),transparent 28%),
    rgba(73,232,190,.055)!important;
  box-shadow:0 0 1rem rgba(73,232,190,.07);
}

.yun-stat .stat-copy small{
  color:#65bda5!important;
}

/* Premium VIP navbar */
.vip-stat{
  position:relative;
  overflow:hidden;
  border-color:rgba(255,202,65,.17)!important;
  background:
    radial-gradient(circle at 18% 18%,rgba(255,218,89,.12),transparent 30%),
    linear-gradient(180deg,rgba(112,77,8,.10),rgba(255,197,49,.025))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,231,149,.08),
    0 0 1.1rem rgba(255,198,48,.045)!important;
}

.vip-stat .status-vip{
  color:#ffd660!important;
  border-color:rgba(255,207,77,.20)!important;
  background:rgba(255,203,63,.075)!important;
  text-shadow:0 0 .65rem rgba(255,202,68,.30);
}

.vip-stat .stat-copy small{
  color:#9e8551!important;
}

.vip-stat .stat-copy strong{
  color:#ffd66b!important;
}

.vip-sheen{
  width:2.4rem;
  height:160%;
  position:absolute;
  top:-30%;
  left:-3rem;
  transform:rotate(18deg);
  background:linear-gradient(90deg,transparent,rgba(255,239,180,.08),transparent);
  animation:vipSheen 5.5s ease-in-out infinite;
  pointer-events:none;
}

@keyframes vipSheen{
  0%,72%{left:-3rem}
  100%{left:calc(100% + 3rem)}
}

/* Account popover is now focused only on account/community actions */
.account-quick-actions{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}

.account-action{
  justify-content:center;
  flex-direction:column;
  gap:.28rem!important;
  min-height:3.35rem!important;
  padding:.45rem!important;
}

.account-action>span{
  width:auto!important;
  font-size:.82rem!important;
}

.account-action strong{
  font-size:.64rem!important;
}

/* ---------------------------------------------------------
   FORUM SHELL
   --------------------------------------------------------- */

.is-authenticated #forumView{
  width:min(1280px,96vw)!important;
  max-width:1280px!important;
}

.forum-v21{
  overflow:hidden!important;
  border-radius:1rem!important;
}

.forum-v21-header{
  min-height:4.4rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.8rem 1rem;
  border-bottom:1px solid rgba(255,255,255,.055);
  background:
    linear-gradient(180deg,rgba(255,255,255,.018),transparent);
}

.forum-v21-header>div>span{
  color:#6b7580;
  font-size:.63rem;
  font-weight:800;
  letter-spacing:.11em;
}

.forum-v21-header h2{
  margin:.18rem 0 0;
  color:#edf0f2;
  font-size:clamp(1rem,.92rem + .22vw,1.24rem);
  letter-spacing:.035em;
}

.forum-browser-v21{
  min-height:34rem!important;
  grid-template-columns:14.2rem minmax(0,1fr) 15.3rem!important;
  background:rgba(4,8,13,.18);
}

.forum-sidebar-v21,
.forum-side-info-v21{
  background:rgba(3,7,12,.28)!important;
}

.forum-sidebar-v21{
  padding:.82rem .72rem 3.6rem!important;
}

.forum-side-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
  margin-bottom:.55rem;
}

.forum-side-heading>small{
  color:#606a74;
  font-size:.62rem;
}

.forum-side-heading.compact{
  margin-bottom:.45rem;
}

.forum-side-heading.compact>span{
  color:#707a84;
  font-size:.62rem;
  font-weight:850;
  letter-spacing:.07em;
}

.forum-main-v21{
  min-width:0;
  padding:0!important;
  background:
    radial-gradient(circle at 50% -10%,rgba(255,48,79,.025),transparent 30%);
}

.forum-list-heading{
  min-height:4.6rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.72rem .9rem;
  border-bottom:1px solid rgba(255,255,255,.05);
}

.forum-list-heading>div>span{
  color:#737d87;
  font-size:.61rem;
  font-weight:800;
  letter-spacing:.09em;
}

.forum-list-heading h3{
  margin:.2rem 0 0;
  color:#e8ebee;
  font-size:clamp(.95rem,.88rem + .18vw,1.12rem);
}

.forum-search-v21{
  width:min(19rem,46%);
}

.forum-table-head-v21{
  grid-template-columns:minmax(0,1fr) 5.5rem 6.4rem!important;
  padding:.55rem .9rem!important;
  font-size:.61rem!important;
}

.forum-thread-list{
  padding:.45rem .55rem .65rem!important;
}

.forum-thread-v21{
  min-height:4.8rem!important;
  grid-template-columns:minmax(0,1fr) 5.5rem 6.4rem!important;
  gap:.5rem!important;
  margin-bottom:.34rem;
  padding:.48rem .62rem!important;
  border:1px solid transparent!important;
  border-radius:.72rem!important;
  background:rgba(255,255,255,.008)!important;
  transition:.16s ease!important;
}

.forum-thread-v21:hover{
  transform:translateY(-1px);
  border-color:rgba(255,255,255,.065)!important;
  background:rgba(255,255,255,.025)!important;
}

.forum-thread-v21.pinned{
  border-color:rgba(255,202,60,.10)!important;
  background:
    linear-gradient(90deg,rgba(255,201,59,.032),transparent 38%),
    rgba(255,255,255,.009)!important;
}

.thread-list-avatar-wrap{
  position:relative;
  width:2.62rem;
  height:2.62rem;
  flex:0 0 2.62rem;
}

.thread-list-avatar-wrap img{
  width:100%!important;
  height:100%!important;
  border-radius:.72rem!important;
  object-fit:cover;
}

.avatar-admin-dot{
  width:.58rem;
  height:.58rem;
  position:absolute;
  right:-.05rem;
  bottom:-.05rem;
  border:.12rem solid #0b1016;
  border-radius:50%;
  background:#ff425e;
  box-shadow:0 0 .55rem rgba(255,55,83,.42);
}

.thread-title-line{
  min-width:0;
  display:flex;
  align-items:center;
  gap:.42rem;
}

.thread-title-line>strong{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.thread-pin-icon{
  width:1.05rem;
  height:1.05rem;
  flex:0 0 1.05rem;
  display:grid;
  place-items:center;
}

.thread-pin-icon svg{
  width:100%;
  height:100%;
  fill:rgba(255,204,68,.15);
  stroke:#ffd15b;
  stroke-width:1.55;
  stroke-linejoin:round;
  filter:drop-shadow(0 0 .3rem rgba(255,205,66,.24));
}

.thread-list-meta{
  min-width:0;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.28rem;
  margin-top:.32rem;
  color:#727c86;
  font-size:clamp(.65rem,.61rem + .08vw,.73rem);
}

.admin-mini-badge{
  display:inline-flex;
  align-items:center;
  min-height:1.15rem;
  padding:0 .32rem;
  border:1px solid rgba(255,66,92,.16);
  border-radius:.34rem;
  color:#ff7084;
  background:rgba(255,48,79,.045);
  font-size:.52rem;
  font-weight:900;
  letter-spacing:.06em;
}

.thread-state{
  display:inline-flex;
  align-items:center;
  min-height:1.18rem;
  padding:0 .34rem;
  border-radius:.34rem;
  font-size:.52rem;
  font-weight:850;
  letter-spacing:.045em;
}

.thread-state.solved{
  color:#72d99c;
  border:1px solid rgba(83,205,132,.15);
  background:rgba(83,205,132,.045);
}

.thread-state.locked{
  color:#9fa8b2;
  border:1px solid rgba(255,255,255,.075);
  background:rgba(255,255,255,.025);
}

.thread-state.unresolved{
  color:#ff9d70;
  border:1px solid rgba(255,139,92,.14);
  background:rgba(255,139,92,.04);
}

.forum-thread-stat{
  height:100%;
  display:flex!important;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.12rem;
  color:#b4bbc2!important;
}

.forum-thread-stat b{
  font-size:.76rem;
}

.forum-thread-stat small{
  color:#626c76;
  font-size:.57rem;
  font-weight:650;
}

/* ---------------------------------------------------------
   THREAD DETAIL IN THE CENTER COLUMN
   --------------------------------------------------------- */

.forum-thread-detail-v21{
  max-width:none!important;
  margin:0!important;
  padding:.85rem!important;
}

.thread-detail-head-v21{
  padding:.15rem .1rem .8rem!important;
  border-bottom:1px solid rgba(255,255,255,.055);
}

.thread-back{
  min-height:2rem!important;
  padding:0 .62rem!important;
  border:1px solid rgba(255,255,255,.065)!important;
  border-radius:.52rem!important;
  color:#89939c!important;
  background:rgba(255,255,255,.018)!important;
  font-size:.62rem!important;
  cursor:pointer;
}

.thread-back:hover{
  color:#e6e9ec!important;
  border-color:rgba(255,255,255,.11)!important;
}

.thread-detail-kicker{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.7rem;
  margin-top:.75rem;
}

.thread-detail-kicker>span{
  color:#ff6077;
  font-size:.62rem;
  font-weight:850;
  letter-spacing:.075em;
}

.thread-status-badges{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:.28rem;
}

.thread-detail-head-v21 h3{
  margin:.45rem 0 0!important;
  color:#f0f2f4!important;
  font-size:clamp(1.16rem,1.02rem + .34vw,1.48rem)!important;
  line-height:1.22!important;
}

.thread-origin,
.thread-reply{
  display:grid!important;
  grid-template-columns:4.15rem minmax(0,1fr)!important;
  gap:.75rem!important;
  padding:.8rem!important;
  border:1px solid rgba(255,255,255,.055)!important;
  border-radius:.8rem!important;
}

.thread-origin{
  margin-top:.78rem!important;
  background:
    linear-gradient(90deg,rgba(255,48,79,.025),transparent 30%),
    rgba(255,255,255,.012)!important;
}

.thread-reply{
  margin-top:.48rem!important;
  background:rgba(255,255,255,.009)!important;
}

.thread-user-column{
  min-width:0;
  text-align:center;
}

.thread-avatar-wrap{
  width:3rem;
  height:3rem;
  position:relative;
  margin:0 auto;
}

.thread-avatar,
.reply-avatar{
  width:3rem!important;
  height:3rem!important;
  object-fit:cover;
  border-radius:.78rem!important;
  border:1px solid rgba(255,255,255,.075);
}

.thread-user-column>small{
  display:block;
  margin-top:.38rem;
  color:#616b75;
  font-size:.56rem;
  line-height:1.25;
}

.thread-post-content{
  min-width:0;
}

.thread-post-head{
  min-height:1.8rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.7rem;
  border-bottom:1px solid rgba(255,255,255,.04);
}

.thread-post-head>span{
  min-width:0;
  display:flex;
  align-items:center;
  gap:.4rem;
}

.thread-post-head strong{
  color:#e9ecef!important;
  font-size:clamp(.78rem,.73rem + .12vw,.90rem)!important;
}

.thread-author-role{
  padding:.16rem .34rem;
  border-radius:.32rem;
  font-size:.51rem;
  font-weight:900;
  letter-spacing:.055em;
}

.thread-author-role.admin{
  color:#ff7185;
  border:1px solid rgba(255,55,83,.16);
  background:rgba(255,48,79,.045);
}

.thread-post-head time{
  flex:0 0 auto;
  color:#636d77!important;
  font-size:.59rem!important;
}

.thread-post-body{
  padding-top:.58rem;
  color:#c2c8ce!important;
  font-size:clamp(.78rem,.73rem + .11vw,.90rem)!important;
  line-height:1.65!important;
  overflow-wrap:anywhere;
}

/* Reply composer */
.thread-reply-form-v21{
  margin-top:.8rem!important;
  padding:.78rem!important;
  border:1px solid rgba(255,255,255,.06)!important;
  border-radius:.8rem!important;
  background:rgba(255,255,255,.012)!important;
}

.thread-reply-form-v21 label>span{
  color:#7c8690;
  font-size:.62rem;
  font-weight:850;
  letter-spacing:.07em;
}

.thread-reply-form-v21 textarea{
  min-height:7rem!important;
  margin-top:.45rem!important;
  padding:.72rem!important;
  border:1px solid rgba(255,255,255,.075)!important;
  border-radius:.64rem!important;
  color:#e1e5e8!important;
  background:#080d13!important;
  font-size:.80rem!important;
  line-height:1.5!important;
  resize:vertical;
}

.emoji-reply-bar{
  display:flex;
  align-items:center;
  gap:.6rem;
  margin-top:.55rem;
}

.emoji-reply-bar>span{
  color:#626c76;
  font-size:.57rem;
  font-weight:850;
  letter-spacing:.075em;
}

.emoji-reply-bar>div{
  display:flex;
  flex-wrap:wrap;
  gap:.26rem;
}

.emoji-reply-bar button{
  width:1.8rem;
  height:1.8rem;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(255,255,255,.06);
  border-radius:.48rem;
  background:rgba(255,255,255,.018);
  font-size:.92rem;
  cursor:pointer;
  transition:.14s ease;
}

.emoji-reply-bar button:hover{
  transform:translateY(-1px) scale(1.05);
  border-color:rgba(255,255,255,.13);
  background:rgba(255,255,255,.045);
}

.thread-send-v21{
  width:100%;
  min-height:2.55rem;
  margin-top:.62rem;
  border:1px solid rgba(255,64,91,.18);
  border-radius:.62rem;
  color:#fff;
  background:linear-gradient(180deg,#ec3650,#be1737);
  font-size:.67rem;
  font-weight:850;
  cursor:pointer;
  box-shadow:0 .5rem 1.1rem rgba(195,19,54,.10);
}

.thread-locked-notice{
  display:grid;
  grid-template-columns:2.3rem minmax(0,1fr);
  align-items:center;
  gap:.65rem;
  margin-top:.8rem;
  padding:.72rem;
  border:1px solid rgba(255,156,87,.10);
  border-radius:.72rem;
  background:rgba(255,135,71,.025);
}

.thread-locked-notice>span{
  width:2.2rem;
  height:2.2rem;
  display:grid;
  place-items:center;
  border-radius:.58rem;
  background:rgba(255,255,255,.025);
}

.thread-locked-notice strong,
.thread-locked-notice small{
  display:block;
}

.thread-locked-notice strong{
  color:#d6dadd;
  font-size:.68rem;
}

.thread-locked-notice small{
  margin-top:.2rem;
  color:#737d87;
  font-size:.64rem;
}

/* ---------------------------------------------------------
   RIGHT SIDE — REAL INFO + ADMIN
   --------------------------------------------------------- */

.forum-side-info-v21{
  padding:.82rem .72rem!important;
  gap:.7rem!important;
}

.forum-info-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
}

.forum-info-live{
  width:.42rem;
  height:.42rem;
  border-radius:50%;
  background:#55d77b;
  box-shadow:0 0 .55rem rgba(85,215,123,.35);
}

.topic-info-list{
  margin-top:0!important;
  border-top:1px solid rgba(255,255,255,.045);
}

.topic-info-list>div{
  min-height:2.25rem!important;
  grid-template-columns:minmax(0,1fr) auto!important;
}

.topic-info-list span{
  color:#66717b!important;
  font-size:.62rem!important;
}

.topic-info-list strong{
  max-width:8rem;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#bac1c7!important;
  font-size:.64rem!important;
}

.thread-moderation-panel{
  padding:.62rem;
  border:1px solid rgba(255,55,83,.10);
  border-radius:.7rem;
  background:
    linear-gradient(145deg,rgba(255,48,79,.035),rgba(255,255,255,.008));
}

.moderation-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
  margin-bottom:.5rem;
}

.moderation-heading>span{
  color:#737d87;
  font-size:.59rem;
  font-weight:850;
  letter-spacing:.075em;
}

.moderation-heading>strong{
  padding:.18rem .36rem;
  border-radius:.34rem;
  color:#ff6e83;
  background:rgba(255,48,79,.05);
  font-size:.52rem;
  letter-spacing:.06em;
}

.moderation-actions{
  display:grid;
  grid-template-columns:1fr;
  gap:.34rem;
}

.moderation-actions button,
.forum-author-close{
  min-height:2.15rem;
  padding:0 .6rem;
  border:1px solid rgba(255,255,255,.065);
  border-radius:.52rem;
  color:#9fa8b1;
  background:rgba(255,255,255,.018);
  font-size:.61rem;
  font-weight:800;
  cursor:pointer;
  transition:.14s ease;
}

.moderation-actions button:hover,
.forum-author-close:hover{
  color:#e9ecef;
  border-color:rgba(255,255,255,.11);
  background:rgba(255,255,255,.035);
}

.moderation-actions button.solve{
  color:#79d9a0;
  border-color:rgba(82,205,132,.11);
  background:rgba(82,205,132,.025);
}

.moderation-actions button.reopen{
  color:#7fb7ee;
}

.forum-author-close{
  width:100%;
  color:#e49d76;
  border-color:rgba(255,149,91,.10);
  background:rgba(255,136,77,.022);
}

.forum-reply-cta{
  width:100%;
  min-height:2.35rem!important;
}

.forum-top-users{
  padding-top:.15rem!important;
}

.forum-top-user{
  min-height:3.1rem;
  display:grid;
  grid-template-columns:1.35rem 2.35rem minmax(0,1fr);
  align-items:center;
  gap:.42rem;
  border-bottom:1px solid rgba(255,255,255,.035);
}

.top-user-rank{
  color:#5e6872;
  font-size:.62rem;
  font-weight:850;
  text-align:center;
}

.forum-top-user:nth-child(1) .top-user-rank{
  color:#ffd158;
}

.forum-top-user img{
  width:2.2rem!important;
  height:2.2rem!important;
  object-fit:cover;
  border-radius:.62rem!important;
}

.forum-top-user-copy{
  min-width:0;
}

.forum-top-user-copy strong{
  min-width:0;
  display:flex;
  align-items:center;
  gap:.28rem;
  color:#c9ced3;
  font-size:.64rem;
}

.forum-top-user-copy small{
  display:block;
  margin-top:.17rem;
  color:#5f6973;
  font-size:.58rem!important;
}

.forum-community-card{
  padding:.62rem;
  border:1px solid rgba(255,255,255,.05);
  border-radius:.66rem;
  background:rgba(255,255,255,.012);
}

.forum-community-card span,
.forum-community-card strong,
.forum-community-card small{
  display:block;
}

.forum-community-card span{
  color:#5f6973;
  font-size:.55rem;
  font-weight:850;
  letter-spacing:.07em;
}

.forum-community-card strong{
  margin-top:.22rem;
  color:#bfc5ca;
  font-size:.67rem;
}

.forum-community-card small{
  margin-top:.2rem;
  color:#68727c;
  font-size:.59rem;
  line-height:1.4;
}

.workspace-empty.compact{
  min-height:3rem!important;
  padding:.5rem!important;
  font-size:.62rem!important;
}

.forum-empty-v21{
  min-height:8rem!important;
}

/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media(max-width:1160px){
  .forum-browser-v21{
    grid-template-columns:13rem minmax(0,1fr)!important;
  }

  .forum-side-info-v21{
    display:none!important;
  }

  .forum-thread-detail-v21{
    padding:1rem!important;
  }
}

@media(max-width:820px){
  .forum-v21-header{
    min-height:auto;
    align-items:flex-start;
  }

  .forum-browser-v21{
    display:block!important;
    min-height:0!important;
  }

  .forum-sidebar-v21{
    padding:.65rem!important;
    border-right:0!important;
    border-bottom:1px solid rgba(255,255,255,.055)!important;
  }

  .forum-categories{
    display:flex!important;
    flex-direction:row!important;
    gap:.42rem!important;
    overflow-x:auto!important;
  }

  .forum-category{
    min-width:11rem!important;
  }

  .forum-new-topic-side{
    position:static!important;
    width:100%!important;
    margin-top:.5rem!important;
  }

  .forum-list-heading{
    align-items:stretch;
    flex-direction:column;
  }

  .forum-search-v21{
    width:100%;
    max-width:none!important;
  }

  .forum-table-head-v21{
    display:none!important;
  }

  .forum-thread-v21{
    grid-template-columns:minmax(0,1fr) 4.8rem!important;
  }

  .forum-thread-v21>.forum-thread-stat.activity{
    display:none!important;
  }
}

@media(max-width:560px){
  .forum-v21-header{
    padding:.7rem;
  }

  .forum-v21-header .workspace-primary{
    min-height:2.25rem!important;
    padding:0 .6rem!important;
  }

  .forum-thread-v21{
    grid-template-columns:1fr!important;
    min-height:auto!important;
    padding:.65rem!important;
  }

  .forum-thread-v21>.forum-thread-stat{
    display:none!important;
  }

  .thread-title-line>strong{
    white-space:normal;
  }

  .thread-origin,
  .thread-reply{
    grid-template-columns:3rem minmax(0,1fr)!important;
    gap:.55rem!important;
    padding:.65rem!important;
  }

  .thread-avatar-wrap,
  .thread-avatar,
  .reply-avatar{
    width:2.55rem!important;
    height:2.55rem!important;
  }

  .thread-user-column>small{
    display:none;
  }

  .thread-post-head{
    align-items:flex-start;
    flex-direction:column;
    gap:.2rem;
    padding-bottom:.35rem;
  }

  .thread-post-head time{
    font-size:.55rem!important;
  }

  .thread-detail-kicker{
    align-items:flex-start;
    flex-direction:column;
  }

  .thread-status-badges{
    justify-content:flex-start;
  }

  .emoji-reply-bar{
    align-items:flex-start;
    flex-direction:column;
  }

  .emoji-reply-bar button{
    width:2rem;
    height:2rem;
  }

  .account-quick-actions{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}


/* =========================================================
   V22 — FORUM READABILITY / USER LEVELS / NOTIFICATION BELL
   ========================================================= */

/* Currency rebrand */
.yun-stat .stat-copy small{
  color:#65bda5!important;
  letter-spacing:.10em!important;
}

/* ---------------------------------------------------------
   Navbar avatar: exactly ONE visual ring
   --------------------------------------------------------- */

.top-user{
  min-width:3rem!important;
  width:3rem!important;
  height:3rem!important;
  padding:0!important;

  border:0!important;
  border-radius:50%!important;
  background:transparent!important;

  box-shadow:none!important;
  outline:0!important;
}

.top-user:hover,
.top-user.active{
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

.top-user img{
  width:2.62rem!important;
  height:2.62rem!important;

  display:block;
  margin:auto;

  border:1px solid rgba(255,255,255,.11)!important;
  border-radius:50%!important;

  background:#0d1218;
  box-shadow:0 .3rem .9rem rgba(0,0,0,.28)!important;
  outline:0!important;
}

.top-user:hover img,
.top-user.active img{
  border-color:rgba(255,76,101,.25)!important;
  box-shadow:
    0 .3rem .9rem rgba(0,0,0,.28),
    0 0 .75rem rgba(255,48,79,.10)!important;
}

/* ---------------------------------------------------------
   Private message notification bell
   --------------------------------------------------------- */

.top-message-bell{
  width:2.55rem;
  height:2.55rem;
  position:relative;

  display:grid;
  place-items:center;

  padding:0;
  margin-right:.12rem;

  border:1px solid rgba(255,255,255,.075);
  border-radius:.82rem;

  color:#aab2ba;
  background:rgba(255,255,255,.022);

  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);

  cursor:pointer;
  transition:.16s ease;
}

.top-message-bell.hidden{
  display:none!important;
}

.top-message-bell svg{
  width:1.06rem;
  height:1.06rem;

  fill:none;
  stroke:currentColor;
  stroke-width:1.75;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.top-message-bell.has-unread{
  color:#ff7488;
  border-color:rgba(255,56,83,.16);

  background:
    radial-gradient(circle at 50% 30%,rgba(255,64,91,.08),transparent 60%),
    rgba(255,48,79,.028);

  animation:messageBellSoftPulse 2.7s ease-in-out infinite;
}

.top-message-bell:hover{
  transform:translateY(-1px);
  color:#fff;
  border-color:rgba(255,255,255,.13);
}

.top-message-badge{
  min-width:1rem;
  height:1rem;

  position:absolute;
  right:-.28rem;
  top:-.28rem;

  display:grid;
  place-items:center;

  padding:0 .22rem;

  border:.12rem solid #090d13;
  border-radius:999px;

  color:#fff;
  background:#e52d4e;

  font-size:.53rem;
  font-weight:900;

  box-shadow:0 .2rem .55rem rgba(226,39,72,.28);
}

@keyframes messageBellSoftPulse{
  0%,100%{box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 0 0 rgba(255,48,79,0)}
  50%{box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 0 1rem rgba(255,48,79,.10)}
}

/* ---------------------------------------------------------
   Thread avatar + beautiful level badge
   --------------------------------------------------------- */

.thread-list-avatar-wrap{
  width:2.85rem!important;
  height:3.22rem!important;

  position:relative;

  display:flex;
  align-items:flex-start;
  justify-content:center;

  flex:0 0 2.85rem!important;
}

.thread-list-avatar-wrap img{
  width:2.55rem!important;
  height:2.55rem!important;

  border-radius:.72rem!important;
  border:1px solid rgba(255,255,255,.075);

  object-fit:cover;
}

.thread-list-level{
  min-width:2.05rem;
  height:1.04rem;

  position:absolute;
  left:50%;
  bottom:.05rem;
  transform:translateX(-50%);

  display:grid;
  place-items:center;

  padding:0 .30rem;

  border:1px solid rgba(255,61,88,.16);
  border-radius:999px;

  color:#ff8093;
  background:
    linear-gradient(180deg,rgba(50,16,25,.98),rgba(21,11,17,.98));

  font-size:.49rem;
  font-weight:900;
  letter-spacing:.045em;

  box-shadow:
    0 .22rem .55rem rgba(0,0,0,.26),
    0 0 .55rem rgba(255,48,79,.08);
}

.thread-user-column{
  width:4.8rem!important;
  min-width:4.8rem!important;

  display:flex!important;
  flex-direction:column;
  align-items:center;

  text-align:center;
}

.thread-avatar-wrap{
  width:3.25rem!important;
  height:3.25rem!important;
  margin:0 auto!important;
}

.thread-avatar{
  width:3.25rem!important;
  height:3.25rem!important;

  display:block;
  object-fit:cover;

  border:1px solid rgba(255,255,255,.08)!important;
  border-radius:.84rem!important;
}

.forum-user-level{
  min-height:1.26rem;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.18rem;

  margin-top:.40rem;
  padding:0 .44rem;

  border:1px solid rgba(255,62,89,.17);
  border-radius:999px;

  color:#ff8194;
  background:
    linear-gradient(180deg,rgba(255,48,79,.055),rgba(255,48,79,.020));

  font-size:.57rem;
  font-weight:800;
  letter-spacing:.045em;

  box-shadow:0 0 .65rem rgba(255,48,79,.045);
}

.forum-user-level b{
  color:#ffdbe1;
  font-size:.62rem;
}

/* Roles */
.forum-role-badge{
  min-height:1.18rem;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  margin-top:.28rem;
  padding:0 .38rem;

  border-radius:.38rem;

  font-size:.51rem;
  font-weight:900;
  letter-spacing:.065em;
}

.forum-role-badge.admin{
  color:#ff7286;
  border:1px solid rgba(255,61,88,.17);
  background:rgba(255,48,79,.045);
}

.forum-role-badge.moderator{
  color:#73b9ff;
  border:1px solid rgba(89,163,235,.17);
  background:rgba(78,145,216,.045);
}

.forum-role-badge.compact{
  min-height:1.05rem;
  margin-top:0;
  padding:0 .31rem;
  font-size:.47rem;
}

.thread-user-column>small{
  margin-top:.34rem!important;
  color:#606b75!important;
  font-size:.55rem!important;
  line-height:1.25!important;
}

/* ---------------------------------------------------------
   CRITICAL: post text can never collapse to one-character width
   --------------------------------------------------------- */

.thread-origin,
.thread-reply{
  width:100%!important;
  min-width:0!important;

  display:grid!important;
  grid-template-columns:4.8rem minmax(0,1fr)!important;
  align-items:start!important;

  gap:.85rem!important;
}

.thread-post-content{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;

  display:block!important;
}

.thread-post-head{
  width:100%!important;
  min-width:0!important;
}

.thread-post-body{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;

  display:block!important;

  white-space:pre-wrap!important;
  word-break:normal!important;
  overflow-wrap:break-word!important;
  hyphens:auto!important;

  writing-mode:horizontal-tb!important;
  text-orientation:mixed!important;

  letter-spacing:normal!important;

  color:#c5cbd0!important;
  font-size:clamp(.80rem,.75rem + .11vw,.93rem)!important;
  line-height:1.68!important;
}

.thread-post-body *{
  max-width:100%!important;
}

/* ---------------------------------------------------------
   Top contributors — clean compact cards
   --------------------------------------------------------- */

.forum-top-users{
  padding-top:.10rem!important;
}

#forumTopContributors{
  display:flex;
  flex-direction:column;
  gap:.38rem;
}

.forum-top-contributor{
  min-width:0;

  display:grid;
  grid-template-columns:1.35rem 2.75rem minmax(0,1fr);
  align-items:center;
  gap:.46rem;

  padding:.48rem .44rem;

  border:1px solid rgba(255,255,255,.045);
  border-radius:.66rem;

  background:
    linear-gradient(180deg,rgba(255,255,255,.014),rgba(255,255,255,.007));
}

.forum-top-contributor.first{
  border-color:rgba(255,204,74,.10);
  background:
    linear-gradient(90deg,rgba(255,203,65,.025),transparent 70%),
    rgba(255,255,255,.008);
}

.contributor-rank{
  width:1.25rem;
  height:1.25rem;

  display:grid;
  place-items:center;

  border-radius:.40rem;

  color:#68727c;
  background:rgba(255,255,255,.018);

  font-size:.58rem;
  font-weight:900;
}

.forum-top-contributor.first .contributor-rank{
  color:#ffd15c;
  background:rgba(255,204,68,.055);
}

.contributor-avatar-wrap{
  width:2.55rem;
  height:2.95rem;
  position:relative;
}

.contributor-avatar-wrap img{
  width:2.55rem!important;
  height:2.55rem!important;

  display:block;
  object-fit:cover;

  border:1px solid rgba(255,255,255,.065);
  border-radius:.68rem!important;
}

.contributor-level{
  min-width:1.85rem;
  height:.95rem;

  position:absolute;
  left:50%;
  bottom:0;
  transform:translateX(-50%);

  display:grid;
  place-items:center;

  padding:0 .25rem;

  border:1px solid rgba(255,59,86,.13);
  border-radius:999px;

  color:#ff7d91;
  background:#121017;

  font-size:.45rem;
  font-weight:900;
}

.contributor-copy{
  min-width:0;
}

.contributor-name{
  min-width:0;

  display:flex;
  align-items:center;
  gap:.30rem;
}

.contributor-name>strong{
  min-width:0;

  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  color:#c9cfd4;
  font-size:.65rem;
}

.contributor-meta{
  min-width:0;

  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.20rem;

  margin-top:.22rem;

  color:#606b75;
  font-size:.55rem;
}

/* Make the right panel less visually scattered */
.forum-side-info-v21{
  gap:.62rem!important;
}

.forum-top-users{
  padding:.62rem!important;

  border:1px solid rgba(255,255,255,.045);
  border-radius:.72rem;

  background:rgba(255,255,255,.008);
}

.forum-community-card{
  margin-top:0!important;
}

/* ---------------------------------------------------------
   Responsive forum/user identity
   --------------------------------------------------------- */

@media(max-width:1160px){
  .top-message-bell{
    width:2.4rem;
    height:2.4rem;
  }
}

@media(max-width:700px){
  .thread-origin,
  .thread-reply{
    grid-template-columns:4rem minmax(0,1fr)!important;
    gap:.62rem!important;
  }

  .thread-user-column{
    width:4rem!important;
    min-width:4rem!important;
  }

  .thread-avatar-wrap,
  .thread-avatar{
    width:2.7rem!important;
    height:2.7rem!important;
  }

  .forum-user-level{
    padding:0 .34rem;
    font-size:.51rem;
  }

  .thread-user-column>small{
    display:none!important;
  }
}

@media(max-width:470px){
  .thread-origin,
  .thread-reply{
    grid-template-columns:3.45rem minmax(0,1fr)!important;
    gap:.50rem!important;
    padding:.58rem!important;
  }

  .thread-user-column{
    width:3.45rem!important;
    min-width:3.45rem!important;
  }

  .thread-avatar-wrap,
  .thread-avatar{
    width:2.42rem!important;
    height:2.42rem!important;
  }

  .forum-user-level{
    min-height:1.08rem;
    padding:0 .25rem;
    font-size:.46rem;
  }

  .forum-role-badge:not(.compact){
    font-size:.44rem;
    padding:0 .25rem;
  }

  .thread-post-head{
    gap:.22rem!important;
  }

  .thread-post-body{
    font-size:.80rem!important;
    line-height:1.62!important;
  }
}


/* =========================================================
   V23 — PUBLIC PROFILES / ANTI-BOT / READABILITY POLISH
   ========================================================= */

/* VIAL currency identity */
.yun-stat .status-coin{
  color:#a8ff72!important;
  border-color:rgba(154,246,95,.18)!important;
  background:
    radial-gradient(circle at 35% 30%,rgba(186,255,128,.17),transparent 30%),
    rgba(138,228,75,.045)!important;
}

.yun-stat .stat-copy small{
  color:#83b968!important;
}

/* Requested server marketing metrics */
.index-server-badges span{
  white-space:nowrap;
}

/* ---------------------------------------------------------
   AUTH READABILITY
   --------------------------------------------------------- */

.play-auth-bubble.play-auth-minimal{
  min-height:2rem!important;
  gap:.52rem!important;
  margin-top:.70rem!important;
  padding:.43rem .72rem!important;

  font-size:clamp(.66rem,.62rem + .10vw,.76rem)!important;
  line-height:1.25!important;
}

.play-auth-bubble.play-auth-minimal button{
  font-size:clamp(.66rem,.62rem + .10vw,.76rem)!important;
  font-weight:800!important;
}

.auth-switch-line{
  min-height:2.2rem!important;
  gap:.42rem!important;
}

.auth-switch-line span,
.auth-switch-line button{
  font-size:clamp(.70rem,.66rem + .10vw,.80rem)!important;
  line-height:1.3!important;
}

.auth-switch-line button{
  font-weight:850!important;
}

.auth .or,
.auth .register-or{
  min-height:2rem!important;
}

.auth .or span,
.auth .register-or span{
  padding:0 .55rem!important;
  font-size:clamp(.65rem,.61rem + .09vw,.74rem)!important;
  font-weight:850!important;
  letter-spacing:.075em!important;
}

.password-meter{
  min-height:2.2rem!important;
}

.password-meter>span{
  font-size:clamp(.68rem,.64rem + .09vw,.77rem)!important;
  line-height:1.25!important;
}

.password-meter>span strong{
  font-size:inherit!important;
}

/* ---------------------------------------------------------
   DARK SERVER-VERIFIED "NEJSEM ROBOT"
   --------------------------------------------------------- */

.antibot-widget{
  width:100%;
  position:relative;
  margin:.62rem 0;

  overflow:hidden;

  border:1px solid rgba(255,255,255,.075);
  border-radius:.78rem;

  background:
    radial-gradient(circle at 92% 18%,rgba(255,48,79,.04),transparent 35%),
    linear-gradient(180deg,rgba(255,255,255,.022),rgba(255,255,255,.008));

  transition:.16s ease;
}

.antibot-widget.loading{
  opacity:.76;
}

.antibot-widget.verified{
  border-color:rgba(87,213,130,.17);
  background:
    radial-gradient(circle at 90% 20%,rgba(87,213,130,.05),transparent 36%),
    rgba(87,213,130,.012);
}

.antibot-widget.error{
  border-color:rgba(255,77,100,.16);
}

.antibot-check{
  min-height:3.65rem;

  display:grid;
  grid-template-columns:1.55rem minmax(0,1fr) 1.8rem;
  align-items:center;
  gap:.66rem;

  padding:.60rem .72rem;

  cursor:pointer;
  user-select:none;
}

.antibot-check>input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.antibot-check-ui{
  width:1.42rem;
  height:1.42rem;

  display:grid;
  place-items:center;

  border:1px solid rgba(255,255,255,.14);
  border-radius:.40rem;

  color:transparent;
  background:#080d13;

  transition:.14s ease;
}

.antibot-check-ui svg{
  width:.92rem;
  height:.92rem;

  fill:none;
  stroke:currentColor;
  stroke-width:2.1;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.antibot-check>input:checked + .antibot-check-ui{
  color:#8be2aa;
  border-color:rgba(83,213,132,.34);
  background:rgba(72,190,113,.08);
  box-shadow:0 0 .8rem rgba(76,203,119,.08);
}

.antibot-check>input:disabled + .antibot-check-ui{
  opacity:.45;
}

.antibot-copy{
  min-width:0;
}

.antibot-copy strong,
.antibot-copy small{
  display:block;
}

.antibot-copy strong{
  color:#cbd1d6;
  font-size:clamp(.72rem,.68rem + .10vw,.82rem);
  font-weight:850;
  letter-spacing:.055em;
}

.antibot-copy small{
  margin-top:.19rem;
  color:#66717b;
  font-size:clamp(.61rem,.57rem + .08vw,.69rem);
  line-height:1.3;
}

.antibot-widget.verified .antibot-copy small{
  color:#6f9e7f;
}

.antibot-shield{
  width:1.75rem;
  height:1.75rem;

  display:grid;
  place-items:center;

  border:1px solid rgba(255,70,95,.09);
  border-radius:.52rem;

  color:#6d4f58;
  background:rgba(255,48,79,.018);

  font-size:.66rem;
}

.antibot-widget.verified .antibot-shield{
  color:#72b289;
  border-color:rgba(83,213,132,.09);
  background:rgba(83,213,132,.018);
}

.antibot-honeypot{
  position:absolute!important;
  left:-9999px!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
}

.antibot-forum{
  margin-top:.72rem;
}

.emoji-topic-bar{
  margin-top:.58rem!important;
  padding:.55rem .60rem;

  border:1px solid rgba(255,255,255,.05);
  border-radius:.62rem;

  background:rgba(255,255,255,.008);
}

/* ---------------------------------------------------------
   CLICKABLE PLAYER IDENTITY
   --------------------------------------------------------- */

.profile-trigger{
  cursor:pointer!important;
}

.profile-trigger:hover{
  filter:brightness(1.08);
}

.forum-thread-title .profile-trigger,
.thread-post-head .profile-trigger{
  transition:color .14s ease;
}

.forum-thread-title .profile-trigger:hover,
.thread-post-head .profile-trigger:hover{
  color:#ff8093!important;
}

/* ---------------------------------------------------------
   PUBLIC PLAYER PROFILE
   --------------------------------------------------------- */

.public-profile-screen{
  position:fixed;
  inset:0;
  z-index:260;

  display:grid;
  place-items:center;

  padding:1rem;
}

.public-profile-screen.hidden{
  display:none!important;
}

.public-profile-backdrop{
  position:absolute;
  inset:0;

  background:rgba(1,4,8,.76);
  backdrop-filter:blur(.55rem);
  -webkit-backdrop-filter:blur(.55rem);
}

.public-profile-card{
  width:min(35rem,96vw);
  max-height:min(48rem,92vh);

  position:relative;
  z-index:1;

  overflow:auto;

  padding:1rem;

  border:1px solid rgba(255,255,255,.085)!important;
  border-radius:1.05rem!important;

  background:
    radial-gradient(circle at 86% -5%,rgba(255,48,79,.075),transparent 31%),
    radial-gradient(circle at 5% 95%,rgba(85,135,170,.035),transparent 34%),
    linear-gradient(155deg,rgba(13,18,25,.985),rgba(5,9,14,.995))!important;

  box-shadow:
    0 2rem 5rem rgba(0,0,0,.52),
    inset 0 1px 0 rgba(255,255,255,.035)!important;
}

.public-profile-close{
  width:2.1rem;
  height:2.1rem;

  position:absolute;
  right:.75rem;
  top:.75rem;
  z-index:4;

  display:grid;
  place-items:center;

  padding:0;

  border:1px solid rgba(255,255,255,.07);
  border-radius:.58rem;

  color:#7d8790;
  background:rgba(255,255,255,.018);

  font-size:1.1rem;
  cursor:pointer;
}

.public-profile-close:hover{
  color:#fff;
  background:rgba(255,255,255,.035);
}

.public-profile-loading{
  min-height:18rem;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.75rem;

  color:#727c86;
}

.public-profile-loading strong{
  font-size:.66rem;
  letter-spacing:.08em;
}

.profile-loader{
  width:2rem;
  height:2rem;

  border:.14rem solid rgba(255,255,255,.07);
  border-top-color:#e73553;
  border-radius:50%;

  animation:profileSpin .8s linear infinite;
}

@keyframes profileSpin{to{transform:rotate(360deg)}}

.public-profile-hero{
  display:grid;
  grid-template-columns:5.25rem minmax(0,1fr);
  align-items:center;
  gap:.9rem;

  padding:.45rem 2.6rem .9rem .3rem;

  border-bottom:1px solid rgba(255,255,255,.055);
}

.public-profile-avatar-shell{
  width:5rem;
  height:5.55rem;

  position:relative;
}

.public-profile-avatar-shell img{
  width:5rem;
  height:5rem;

  display:block;
  object-fit:cover;

  border:1px solid rgba(255,255,255,.10);
  border-radius:1rem;

  background:#0d1218;

  box-shadow:0 .7rem 1.4rem rgba(0,0,0,.25);
}

.public-profile-level{
  min-width:2.65rem;
  height:1.35rem;

  position:absolute;
  left:50%;
  bottom:.05rem;
  transform:translateX(-50%);

  display:grid;
  place-items:center;

  padding:0 .45rem;

  border:1px solid rgba(255,57,85,.18);
  border-radius:999px;

  color:#ff8496;
  background:#151018;

  font-size:.58rem;
  font-weight:900;

  box-shadow:0 .25rem .65rem rgba(0,0,0,.30);
}

.public-profile-name-line{
  min-width:0;

  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.48rem;
}

.public-profile-name-line h2{
  min-width:0;

  margin:0;

  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  color:#eff2f4;
  font-size:clamp(1.2rem,1.08rem + .28vw,1.48rem);
  line-height:1.1;
}

.public-profile-role{
  min-height:1.35rem;

  display:inline-flex;
  align-items:center;

  padding:0 .40rem;

  border-radius:.38rem;

  font-size:.53rem;
  font-weight:900;
  letter-spacing:.065em;
}

.public-profile-role.admin{
  color:#ff7185;
  border:1px solid rgba(255,58,85,.17);
  background:rgba(255,48,79,.045);
}

.public-profile-role.moderator{
  color:#79bdff;
  border:1px solid rgba(82,157,235,.17);
  background:rgba(75,147,220,.045);
}

.public-profile-handle{
  display:block;

  margin-top:.30rem;

  color:#69737d;
  font-size:.70rem;
}

.public-profile-membership,
.locked-membership{
  width:max-content;
  min-height:1.55rem;

  display:inline-flex;
  align-items:center;

  margin-top:.48rem;
  padding:0 .55rem;

  border-radius:.45rem;

  font-size:.60rem;
  font-weight:900;
  letter-spacing:.075em;
}

.public-profile-membership.vip,
.locked-membership.vip{
  color:#ffd668;
  border:1px solid rgba(255,206,75,.17);
  background:rgba(255,201,56,.04);
}

.public-profile-membership.evip,
.locked-membership.evip{
  color:#d7adff;
  border:1px solid rgba(189,113,255,.17);
  background:rgba(174,88,255,.045);
  box-shadow:0 0 .8rem rgba(179,91,255,.045);
}

.public-profile-membership.player,
.locked-membership.player{
  color:#8d969f;
  border:1px solid rgba(255,255,255,.065);
  background:rgba(255,255,255,.018);
}

.public-profile-xp{
  padding:.82rem .2rem .72rem;

  border-bottom:1px solid rgba(255,255,255,.05);
}

.public-profile-xp>div:first-child{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.8rem;
}

.public-profile-xp span,
.public-profile-xp strong{
  font-size:.63rem;
}

.public-profile-xp span{
  color:#6d7781;
  font-weight:800;
  letter-spacing:.07em;
}

.public-profile-xp strong{
  color:#aab1b8;
}

.public-profile-xp-track{
  height:.38rem;

  margin-top:.48rem;

  overflow:hidden;

  border-radius:999px;

  background:rgba(255,255,255,.055);
}

.public-profile-xp-track span{
  width:0;
  height:100%;

  display:block;

  border-radius:inherit;

  background:linear-gradient(90deg,#cf193a,#ff536a);

  transition:width .25s ease;
}

.public-profile-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.48rem;

  padding:.72rem 0;
}

.public-profile-stats>div{
  min-width:0;

  padding:.62rem;

  border:1px solid rgba(255,255,255,.05);
  border-radius:.68rem;

  background:rgba(255,255,255,.012);
}

.public-profile-stats span,
.public-profile-stats strong{
  display:block;
}

.public-profile-stats span{
  color:#68727c;
  font-size:.58rem;
  font-weight:800;
  letter-spacing:.065em;
}

.public-profile-stats strong{
  margin-top:.25rem;

  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  color:#d2d7db;
  font-size:.78rem;
}

.public-profile-about{
  padding:.72rem;

  border:1px solid rgba(255,255,255,.05);
  border-radius:.72rem;

  background:rgba(255,255,255,.010);
}

.public-profile-about>span{
  color:#69737d;
  font-size:.59rem;
  font-weight:850;
  letter-spacing:.07em;
}

.public-profile-about p{
  margin:.42rem 0 0;

  color:#aeb6bd;
  font-size:clamp(.73rem,.69rem + .09vw,.82rem);
  line-height:1.6;

  white-space:pre-wrap;
  overflow-wrap:anywhere;
}

.public-profile-link{
  min-height:3.45rem;

  display:grid;
  grid-template-columns:2.2rem minmax(0,1fr);
  align-items:center;
  gap:.58rem;

  margin-top:.56rem;
  padding:.55rem .65rem;

  border:1px solid rgba(97,153,218,.09);
  border-radius:.70rem;

  color:#97bce3;
  background:rgba(75,137,202,.018);

  text-decoration:none;
}

.public-profile-link>span{
  width:2rem;
  height:2rem;

  display:grid;
  place-items:center;

  border-radius:.55rem;

  background:rgba(92,151,216,.04);

  font-size:.88rem;
}

.public-profile-link small,
.public-profile-link strong{
  display:block;
}

.public-profile-link small{
  color:#63798f;
  font-size:.55rem;
  font-weight:800;
  letter-spacing:.065em;
}

.public-profile-link strong{
  margin-top:.16rem;

  color:#9bc5ec;
  font-size:.69rem;
}

.public-profile-actions{
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);
  gap:.48rem;

  margin-top:.62rem;
}

.profile-message-action,
.profile-block-action{
  min-height:3rem;

  display:flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;

  padding:.48rem .65rem;

  border-radius:.68rem;

  cursor:pointer;
}

.profile-message-action{
  border:1px solid rgba(255,60,87,.14);
  color:#ff8093;
  background:rgba(255,48,79,.035);
}

.profile-message-action svg{
  width:1.15rem;
  height:1.15rem;

  flex:0 0 1.15rem;

  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
  stroke-linejoin:round;
}

.profile-message-action span{
  min-width:0;
}

.profile-message-action small,
.profile-message-action strong{
  display:block;
  text-align:left;
}

.profile-message-action small{
  color:#8c6670;
  font-size:.52rem;
  font-weight:800;
  letter-spacing:.06em;
}

.profile-message-action strong{
  margin-top:.12rem;

  color:#e9b0ba;
  font-size:.65rem;
}

.profile-message-action:disabled{
  opacity:.48;
  cursor:not-allowed;
}

.profile-block-action{
  border:1px solid rgba(255,255,255,.06);
  color:#8d969f;
  background:rgba(255,255,255,.014);
}

.profile-block-action>span{
  font-size:.90rem;
}

.profile-block-action strong{
  font-size:.61rem;
}

.profile-block-action.is-blocked{
  color:#ff9f7b;
  border-color:rgba(255,139,91,.10);
  background:rgba(255,131,75,.022);
}

/* Locked profile sends no private data to the browser */
.public-profile-locked{
  min-height:23rem;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  padding:2rem 1.2rem;

  text-align:center;
}

.locked-profile-icon{
  width:4.4rem;
  height:4.4rem;

  display:grid;
  place-items:center;

  border:1px solid rgba(255,255,255,.07);
  border-radius:1.1rem;

  color:#7f8992;
  background:rgba(255,255,255,.018);

  box-shadow:0 1rem 2.2rem rgba(0,0,0,.18);
}

.locked-profile-icon svg{
  width:1.8rem;
  height:1.8rem;

  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
  stroke-linejoin:round;
}

.public-profile-locked>span{
  margin-top:.85rem;

  color:#74616a;
  font-size:.58rem;
  font-weight:900;
  letter-spacing:.10em;
}

.public-profile-locked h2{
  margin:.30rem 0 0;

  color:#e0e4e7;
  font-size:1.28rem;
}

.public-profile-locked p{
  max-width:25rem;

  margin:.52rem 0 0;

  color:#737d87;
  font-size:.71rem;
  line-height:1.55;
}

.public-profile-locked .locked-membership{
  margin-top:.72rem;
}

.locked-block{
  min-width:12rem;
  margin-top:.72rem;
}

/* ---------------------------------------------------------
   Profile settings
   --------------------------------------------------------- */

.settings-profile-fields{
  display:grid;
  gap:.62rem;

  margin:1rem 0;

  padding-top:.9rem;

  border-top:1px solid rgba(255,255,255,.05);
}

.settings-profile-fields label>span{
  display:block;

  color:#818b95;
  font-size:.64rem;
  font-weight:850;
  letter-spacing:.065em;
}

.settings-profile-fields textarea,
.settings-profile-fields input{
  width:100%;

  margin-top:.36rem;
  padding:.68rem .72rem;

  border:1px solid rgba(255,255,255,.07);
  border-radius:.62rem;

  color:#dbe0e4;
  background:#080d13;

  font:inherit;
  font-size:.76rem;

  outline:none;
}

.settings-profile-fields textarea{
  min-height:6.2rem;
  resize:vertical;
  line-height:1.5;
}

.settings-profile-fields textarea:focus,
.settings-profile-fields input:focus{
  border-color:rgba(255,64,91,.18);
  box-shadow:0 0 0 .18rem rgba(255,48,79,.025);
}

.settings-profile-fields label>small{
  display:block;

  margin-top:.28rem;

  color:#606a74;
  font-size:.59rem;
  line-height:1.35;
}

.profile-minutes-note{
  min-height:3rem;

  display:grid;
  grid-template-columns:2rem minmax(0,1fr);
  align-items:center;
  gap:.6rem;

  padding:.58rem .65rem;

  border:1px solid rgba(255,255,255,.045);
  border-radius:.62rem;

  background:rgba(255,255,255,.009);
}

.profile-minutes-note>span{
  width:1.85rem;
  height:1.85rem;

  display:grid;
  place-items:center;

  border-radius:.5rem;

  color:#75818c;
  background:rgba(255,255,255,.02);
}

.profile-minutes-note strong,
.profile-minutes-note small{
  display:block;
}

.profile-minutes-note strong{
  color:#9da6ae;
  font-size:.60rem;
}

.profile-minutes-note small{
  margin-top:.16rem;
  color:#616b75;
  font-size:.58rem;
}

/* ---------------------------------------------------------
   Messages: profile opener + visible message icon
   --------------------------------------------------------- */

.search-user-v23{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:.35rem!important;

  padding:.30rem!important;

  border:1px solid rgba(255,255,255,.045);
  border-radius:.62rem;

  background:rgba(255,255,255,.008);
}

.search-user-profile{
  min-width:0;

  display:grid;
  grid-template-columns:2.3rem minmax(0,1fr);
  align-items:center;
  gap:.48rem;

  padding:.32rem;

  border:0;
  color:inherit;
  background:transparent;

  text-align:left;
  cursor:pointer;
}

.search-user-message{
  min-width:4.5rem;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.18rem;

  padding:.30rem .45rem;

  border:1px solid rgba(255,62,89,.10);
  border-radius:.52rem;

  color:#d47687;
  background:rgba(255,48,79,.018);

  cursor:pointer;
}

.search-user-message svg{
  width:.92rem;
  height:.92rem;

  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
  stroke-linejoin:round;
}

.search-user-message span{
  font-size:.50rem;
  font-weight:850;
}

.search-user-message:disabled{
  opacity:.38;
  cursor:not-allowed;
}

.chat-user.profile-trigger{
  padding:.22rem .30rem;
  margin:-.22rem -.30rem;

  border-radius:.55rem;

  transition:background .14s ease;
}

.chat-user.profile-trigger:hover{
  background:rgba(255,255,255,.022);
}

/* ---------------------------------------------------------
   Responsive
   --------------------------------------------------------- */

@media(max-width:640px){
  .public-profile-card{
    width:min(100%,35rem);
    max-height:94vh;
    padding:.78rem;
  }

  .public-profile-hero{
    grid-template-columns:4.45rem minmax(0,1fr);
    gap:.70rem;

    padding:.4rem 2.35rem .8rem .15rem;
  }

  .public-profile-avatar-shell{
    width:4.25rem;
    height:4.8rem;
  }

  .public-profile-avatar-shell img{
    width:4.25rem;
    height:4.25rem;
  }

  .public-profile-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .public-profile-stats>div:last-child{
    grid-column:1/-1;
  }

  .public-profile-actions{
    grid-template-columns:1fr;
  }

  .antibot-check{
    min-height:3.45rem;
  }
}

@media(max-width:430px){
  .public-profile-name-line h2{
    white-space:normal;
  }

  .public-profile-hero{
    align-items:start;
  }

  .public-profile-stats strong{
    font-size:.72rem;
  }

  .search-user-v23{
    grid-template-columns:1fr!important;
  }

  .search-user-message{
    min-height:2.25rem;
    flex-direction:row;
  }
}


/* =========================================================
   V24 — NAV POLISH / TERMS / SETTINGS / OFFICIAL NEWS
   ========================================================= */

/* ---------------------------------------------------------
   HERO BADGES — larger and easier to read
   --------------------------------------------------------- */

.index-server-badges{
  gap:.48rem!important;
  margin-top:.95rem!important;
  flex-wrap:wrap!important;
}

.index-server-badges span{
  min-height:2.05rem!important;

  display:inline-flex!important;
  align-items:center!important;

  padding:.40rem .72rem!important;

  border:1px solid rgba(255,255,255,.07)!important;
  border-radius:.62rem!important;

  color:#aab2ba!important;
  background:rgba(5,9,14,.48)!important;

  font-size:clamp(.69rem,.64rem + .11vw,.80rem)!important;
  font-weight:750!important;
  line-height:1.15!important;

  backdrop-filter:blur(.45rem);
  -webkit-backdrop-filter:blur(.45rem);
}

/* ---------------------------------------------------------
   NAVBAR SERVER METRICS — same visual weight as account items
   --------------------------------------------------------- */

.portal-statusbar{
  gap:.42rem!important;
}

.portal-statusbar>.portal-status:not(.user-stat){
  min-height:2.85rem!important;

  padding:.42rem .72rem!important;

  border:1px solid rgba(255,255,255,.055)!important;
  border-radius:.74rem!important;

  background:rgba(255,255,255,.016)!important;
}

.portal-statusbar>.portal-status:not(.user-stat)>span:not(.status-icon){
  color:#717b85!important;

  font-size:clamp(.60rem,.56rem + .09vw,.69rem)!important;
  font-weight:800!important;
  letter-spacing:.065em!important;
}

.portal-statusbar>.portal-status:not(.user-stat)>strong{
  color:#d1d6da!important;

  font-size:clamp(.72rem,.67rem + .10vw,.82rem)!important;
  font-weight:850!important;
}

.portal-statusbar>.portal-status>i{
  width:.48rem!important;
  height:.48rem!important;

  box-shadow:0 0 .65rem rgba(65,220,119,.42)!important;
}

.portal-status.server .status-icon{
  width:1.65rem;
  height:1.65rem;

  display:grid;
  place-items:center;

  border-radius:.52rem;

  color:#ff7387;
  background:rgba(255,48,79,.04);

  font-size:.72rem!important;
}

/* ---------------------------------------------------------
   DISCORD FUTURE BADGE
   --------------------------------------------------------- */

.discord-nav-badge{
  min-height:2.82rem;

  display:grid;
  grid-template-columns:1.65rem auto auto;
  align-items:center;
  gap:.48rem;

  margin-right:.38rem;
  padding:.34rem .50rem;

  border:1px solid rgba(116,128,255,.12);
  border-radius:.78rem;

  color:#9ba7ff;
  background:
    radial-gradient(circle at 18% 35%,rgba(104,116,255,.09),transparent 35%),
    rgba(90,104,210,.018);

  cursor:pointer;
  transition:.16s ease;
}

.discord-nav-badge svg{
  width:1.35rem;
  height:1.35rem;

  fill:currentColor;
}

.discord-nav-badge>span{
  display:flex;
  flex-direction:column;
  align-items:flex-start;

  line-height:1.05;
}

.discord-nav-badge small{
  color:#747da5;

  font-size:.51rem;
  font-weight:850;
  letter-spacing:.075em;
}

.discord-nav-badge strong{
  margin-top:.15rem;

  color:#a9b3ff;

  font-size:.64rem;
  font-weight:850;
}

.discord-nav-badge>b{
  min-height:1.16rem;

  display:inline-flex;
  align-items:center;

  padding:0 .34rem;

  border:1px solid rgba(124,137,255,.13);
  border-radius:.38rem;

  color:#8d98da;
  background:rgba(108,121,240,.035);

  font-size:.47rem;
  letter-spacing:.055em;
}

.discord-nav-badge:hover{
  transform:translateY(-1px);

  border-color:rgba(124,138,255,.22);
  background:rgba(102,116,235,.04);
}

/* ---------------------------------------------------------
   ACCOUNT POPOVER — obvious, readable quick-action icons
   --------------------------------------------------------- */

.account-quick-actions{
  gap:.48rem!important;
}

.account-action{
  min-height:4.35rem!important;

  gap:.40rem!important;

  padding:.55rem .38rem!important;
}

.account-action>span{
  width:2rem!important;
  height:2rem!important;

  display:grid!important;
  place-items:center!important;

  border:1px solid rgba(255,255,255,.06);
  border-radius:.58rem;

  color:#a3abb3!important;
  background:rgba(255,255,255,.018);

  font-size:1.08rem!important;
  line-height:1!important;
}

.account-action strong{
  color:#aeb5bc!important;

  font-size:.68rem!important;
  letter-spacing:.035em;
}

.account-action:hover>span{
  color:#ff7c8f!important;
  border-color:rgba(255,60,87,.13);
  background:rgba(255,48,79,.035);
}

/* ---------------------------------------------------------
   SETTINGS — deterministic layout, no scattered content
   --------------------------------------------------------- */

.settings-screen{
  padding:1rem!important;
}

.settings-window{
  width:min(59rem,96vw)!important;
  max-height:min(48rem,92vh)!important;

  overflow:hidden!important;

  border-radius:1rem!important;

  background:
    radial-gradient(circle at 92% -8%,rgba(255,48,79,.05),transparent 28%),
    linear-gradient(155deg,rgba(13,18,24,.995),rgba(5,9,14,.998))!important;
}

.settings-header{
  min-height:5.2rem!important;

  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:1rem!important;

  padding:.85rem 1rem!important;

  border-bottom:1px solid rgba(255,255,255,.055)!important;
}

.settings-header>div{
  min-width:0;
}

.settings-header h2{
  margin:.17rem 0 0!important;

  font-size:1.18rem!important;
}

.settings-header p{
  margin:.22rem 0 0!important;

  color:#6e7882!important;

  font-size:.67rem!important;
}

.settings-kicker{
  color:#7a646c!important;

  font-size:.56rem!important;
  letter-spacing:.09em!important;
}

.settings-layout{
  min-height:0!important;
  height:min(38rem,calc(92vh - 6.5rem))!important;

  display:grid!important;
  grid-template-columns:12.5rem minmax(0,1fr)!important;

  overflow:hidden!important;
}

.settings-nav{
  min-width:0!important;

  display:flex!important;
  flex-direction:column!important;
  gap:.38rem!important;

  padding:.8rem!important;

  overflow:auto!important;

  border-right:1px solid rgba(255,255,255,.055)!important;
  border-bottom:0!important;

  background:rgba(2,6,11,.22)!important;
}

.settings-nav-item{
  width:100%!important;
  min-height:3.25rem!important;

  display:grid!important;
  grid-template-columns:2rem minmax(0,1fr)!important;
  align-items:center!important;
  gap:.55rem!important;

  padding:.50rem .58rem!important;

  border:1px solid transparent!important;
  border-radius:.65rem!important;

  color:#747e87!important;
  background:transparent!important;

  font-size:.67rem!important;
  font-weight:800!important;
  text-align:left!important;

  cursor:pointer;
}

.settings-nav-item span{
  width:1.85rem!important;
  height:1.85rem!important;

  display:grid!important;
  place-items:center!important;

  border-radius:.52rem!important;

  color:#6a737c!important;
  background:rgba(255,255,255,.018)!important;

  font-size:.57rem!important;
}

.settings-nav-item:hover{
  color:#c5cbd0!important;

  background:rgba(255,255,255,.018)!important;
}

.settings-nav-item.active{
  color:#f0dfe3!important;

  border-color:rgba(255,55,83,.11)!important;

  background:
    linear-gradient(90deg,rgba(255,48,79,.045),transparent)!important;
}

.settings-nav-item.active span{
  color:#ff778b!important;

  background:rgba(255,48,79,.05)!important;
}

.settings-content{
  min-width:0!important;

  padding:0!important;

  overflow:auto!important;

  background:transparent!important;
}

.settings-panel{
  width:100%!important;
  min-height:100%!important;

  padding:1rem 1.05rem 1.4rem!important;
}

.settings-panel:not(.active){
  display:none!important;
}

.settings-panel-head{
  margin:0 0 .75rem!important;
  padding:0 0 .7rem!important;

  border-bottom:1px solid rgba(255,255,255,.045)!important;
}

.settings-panel-head span{
  color:#716168!important;

  font-size:.56rem!important;
  font-weight:850!important;
  letter-spacing:.08em!important;
}

.settings-panel-head h3{
  margin:.20rem 0 0!important;

  color:#dfe3e6!important;

  font-size:.91rem!important;
}

.setting-list{
  display:grid!important;
  gap:.42rem!important;
}

.setting-row{
  min-height:4rem!important;

  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:.8rem!important;

  padding:.62rem .70rem!important;

  border:1px solid rgba(255,255,255,.045)!important;
  border-radius:.68rem!important;

  background:rgba(255,255,255,.009)!important;
}

.setting-row>div{
  min-width:0;
}

.setting-row strong{
  color:#bfc6cc!important;

  font-size:.72rem!important;
}

.setting-row small{
  display:block!important;

  margin-top:.20rem!important;

  color:#646f78!important;

  font-size:.62rem!important;
  line-height:1.35!important;
}

.settings-profile-fields{
  margin:.8rem 0!important;

  padding:.8rem!important;

  border:1px solid rgba(255,255,255,.045)!important;
  border-radius:.72rem!important;

  background:rgba(255,255,255,.008)!important;
}

.settings-profile-fields textarea,
.settings-profile-fields input,
.settings-form input{
  min-height:2.75rem!important;

  box-sizing:border-box!important;
}

.settings-profile-fields textarea{
  min-height:6.5rem!important;
}

.settings-save{
  min-height:2.75rem!important;

  border-radius:.62rem!important;

  font-size:.67rem!important;
  font-weight:850!important;
}

.settings-form{
  display:grid!important;
  gap:.62rem!important;
}

.settings-form-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:.62rem!important;
}

.settings-form label{
  min-width:0!important;
}

.settings-divider{
  margin:1rem 0!important;
}

/* ---------------------------------------------------------
   BOTTOM DOCK — 3 stable sections
   --------------------------------------------------------- */

.portal-bottom-tabs-three{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}

.portal-bottom-tabs-three .bottom-tab{
  min-height:4.3rem!important;
}

/* ---------------------------------------------------------
   TERMS & RULES
   --------------------------------------------------------- */

.is-authenticated #termsView{
  width:min(1180px,96vw)!important;
  max-width:1180px!important;

  justify-self:center!important;

  margin-left:auto!important;
  margin-right:auto!important;
}

.terms-workspace{
  overflow:hidden!important;

  border-radius:1rem!important;
}

.terms-header{
  min-height:6rem;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.2rem;

  padding:.95rem 1.1rem;

  border-bottom:1px solid rgba(255,255,255,.055);

  background:
    radial-gradient(circle at 82% -20%,rgba(255,48,79,.06),transparent 33%);
}

.terms-header-copy>span{
  color:#77626a;

  font-size:.58rem;
  font-weight:900;
  letter-spacing:.10em;
}

.terms-header h2{
  margin:.24rem 0 0;

  color:#edf0f2;

  font-size:clamp(1rem,.92rem + .22vw,1.23rem);
}

.terms-header p{
  margin:.30rem 0 0;

  color:#707a84;

  font-size:.69rem;
}

.terms-version{
  flex:0 0 auto;

  padding:.55rem .65rem;

  border:1px solid rgba(255,255,255,.055);
  border-radius:.62rem;

  background:rgba(255,255,255,.012);

  text-align:right;
}

.terms-version span,
.terms-version strong{
  display:block;
}

.terms-version span{
  color:#636d76;

  font-size:.52rem;
  font-weight:850;
  letter-spacing:.08em;
}

.terms-version strong{
  margin-top:.17rem;

  color:#b7bec4;

  font-size:.67rem;
}

.terms-layout{
  display:grid;
  grid-template-columns:13.5rem minmax(0,1fr);

  min-height:35rem;
}

.terms-index{
  padding:.8rem;

  border-right:1px solid rgba(255,255,255,.05);

  background:rgba(2,6,10,.23);
}

.terms-index>span{
  display:block;

  margin:0 .35rem .55rem;

  color:#626c76;

  font-size:.56rem;
  font-weight:850;
  letter-spacing:.08em;
}

.terms-index button{
  width:100%;
  min-height:2.65rem;

  display:grid;
  grid-template-columns:1.65rem minmax(0,1fr);
  align-items:center;
  gap:.42rem;

  margin-bottom:.28rem;
  padding:.42rem .5rem;

  border:1px solid transparent;
  border-radius:.56rem;

  color:#6d7780;
  background:transparent;

  font-size:.59rem;
  text-align:left;

  cursor:pointer;
}

.terms-index button strong{
  font-size:.65rem;
}

.terms-index button:hover,
.terms-index button.active{
  color:#c5cbd0;

  border-color:rgba(255,255,255,.05);

  background:rgba(255,255,255,.014);
}

.terms-index button.active{
  color:#efb5bf;

  border-color:rgba(255,52,82,.09);

  background:rgba(255,48,79,.025);
}

.terms-content{
  min-width:0;

  padding:.85rem;

  background:rgba(4,8,13,.12);
}

.terms-rule-card{
  display:grid;
  grid-template-columns:3.1rem minmax(0,1fr);
  gap:.72rem;

  margin-bottom:.58rem;
  padding:.78rem;

  border:1px solid rgba(255,255,255,.05);
  border-radius:.72rem;

  background:rgba(255,255,255,.008);

  scroll-margin-top:1rem;
}

.terms-rule-card.accent{
  border-color:rgba(255,58,85,.08);

  background:
    linear-gradient(90deg,rgba(255,48,79,.026),transparent 38%),
    rgba(255,255,255,.007);
}

.terms-rule-card.warning{
  border-color:rgba(255,156,80,.08);

  background:
    linear-gradient(90deg,rgba(255,144,76,.018),transparent 40%);
}

.terms-rule-number{
  width:2.75rem;
  height:2.75rem;

  display:grid;
  place-items:center;

  border:1px solid rgba(255,255,255,.055);
  border-radius:.65rem;

  color:#6a737c;
  background:rgba(255,255,255,.014);

  font-size:.65rem;
  font-weight:900;
}

.terms-rule-card>div:last-child>span{
  color:#6f5961;

  font-size:.54rem;
  font-weight:900;
  letter-spacing:.085em;
}

.terms-rule-card h3{
  margin:.18rem 0 .48rem;

  color:#cfd5d9;

  font-size:.78rem;
}

.terms-rule-card ul{
  margin:0;
  padding-left:1.05rem;

  color:#89929a;

  font-size:.68rem;
  line-height:1.57;
}

.terms-rule-card li+li{
  margin-top:.33rem;
}

.terms-rule-card p{
  margin:.35rem 0 0;

  color:#89929a;

  font-size:.68rem;
  line-height:1.6;
}

.terms-appeal{
  margin-top:.65rem;
  padding:.55rem;

  border:1px solid rgba(255,255,255,.045);
  border-radius:.56rem;

  background:rgba(255,255,255,.008);
}

.terms-appeal span,
.terms-appeal strong{
  display:block;
}

.terms-appeal span{
  color:#6a737c;

  font-size:.52rem;
  font-weight:850;
  letter-spacing:.07em;
}

.terms-appeal strong{
  margin-top:.17rem;

  color:#c2c8cd;

  font-size:.65rem;
}

.terms-footer-note{
  display:grid;
  grid-template-columns:2rem minmax(0,1fr);
  align-items:center;
  gap:.55rem;

  padding:.65rem;

  border:1px solid rgba(255,255,255,.045);
  border-radius:.65rem;

  background:rgba(255,255,255,.008);
}

.terms-footer-note>span{
  width:1.8rem;
  height:1.8rem;

  display:grid;
  place-items:center;

  border-radius:.5rem;

  color:#76808a;
  background:rgba(255,255,255,.016);
}

.terms-footer-note p{
  margin:0;

  color:#69737c;

  font-size:.61rem;
  line-height:1.5;
}

/* ---------------------------------------------------------
   OFFICIAL X-SITES.CZ NEWS CHANNEL
   --------------------------------------------------------- */

.system-conversation{
  position:relative;

  min-height:4.6rem!important;

  grid-template-columns:3rem minmax(0,1fr) auto!important;

  margin-bottom:.55rem!important;

  border:1px solid rgba(255,61,88,.10)!important;

  background:
    radial-gradient(circle at 8% 40%,rgba(255,48,79,.06),transparent 34%),
    linear-gradient(90deg,rgba(255,48,79,.025),rgba(255,255,255,.006))!important;

  box-shadow:
    inset .16rem 0 0 rgba(255,57,85,.45);
}

.system-conversation:hover,
.system-conversation.active{
  border-color:rgba(255,61,88,.17)!important;

  background:
    radial-gradient(circle at 8% 40%,rgba(255,48,79,.085),transparent 35%),
    rgba(255,48,79,.027)!important;
}

.system-conversation-avatar{
  width:2.65rem;
  height:2.65rem;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  border:1px solid rgba(255,65,91,.14);
  border-radius:.72rem;

  color:#fff;
  background:
    linear-gradient(145deg,#ac1735,#4f101d);

  box-shadow:
    0 .35rem .75rem rgba(0,0,0,.22),
    0 0 .8rem rgba(255,48,79,.07);
}

.system-conversation-avatar strong{
  font-size:1rem;
  line-height:1;
}

.system-conversation-avatar small{
  margin-top:.13rem;

  color:#ffacb9;

  font-size:.39rem;
  font-weight:900;
  letter-spacing:.08em;
}

.system-name-row{
  min-width:0;

  display:flex;
  align-items:center;
  gap:.34rem;
}

.system-name-row strong{
  min-width:0;

  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  color:#e7dadd!important;
}

.system-name-row b,
.chat-official-badge{
  min-height:1.12rem;

  display:inline-flex;
  align-items:center;

  padding:0 .30rem;

  border:1px solid rgba(255,56,84,.15);
  border-radius:.34rem;

  color:#ff788b;
  background:rgba(255,48,79,.04);

  font-size:.46rem;
  font-weight:900;
  letter-spacing:.055em;
}

.system-copy>small{
  color:#7d6970!important;
}

.system-time{
  min-width:1.5rem!important;

  display:grid!important;
  place-items:center!important;
}

.system-unread-dot{
  min-width:1.25rem;
  height:1.25rem;

  display:grid;
  place-items:center;

  padding:0 .24rem;

  border-radius:999px;

  color:#fff;
  background:#df2c4b;

  font-size:.51rem;

  box-shadow:0 .22rem .55rem rgba(218,34,68,.24);
}

.messages-private-empty{
  min-height:3.6rem!important;

  font-size:.60rem!important;
}

.chat-name-row{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.36rem;
}

.chat-official-badge.hidden{
  display:none!important;
}

.system-channel-active .chat-header{
  border-bottom-color:rgba(255,57,84,.07)!important;

  background:
    linear-gradient(90deg,rgba(255,48,79,.025),transparent);
}

.system-channel-active .chat-user{
  cursor:default!important;
}

.system-chat-avatar{
  border:1px solid rgba(255,58,85,.18)!important;

  background:#161016!important;
}

.system-news-card{
  width:min(100%,45rem);

  align-self:center;

  margin:.28rem auto;
  padding:.78rem;

  border:1px solid rgba(255,58,85,.075);
  border-radius:.78rem;

  background:
    radial-gradient(circle at 93% 0,rgba(255,48,79,.04),transparent 32%),
    rgba(255,255,255,.010);

  box-shadow:0 .5rem 1.2rem rgba(0,0,0,.08);
}

.system-news-card>header{
  display:grid;
  grid-template-columns:2.25rem minmax(0,1fr) auto;
  align-items:center;
  gap:.55rem;

  padding-bottom:.55rem;

  border-bottom:1px solid rgba(255,255,255,.045);
}

.system-news-logo{
  width:2.15rem;
  height:2.15rem;

  display:grid;
  place-items:center;

  border-radius:.58rem;

  color:#fff;
  background:linear-gradient(145deg,#a91834,#54101e);

  font-size:.85rem;
  font-weight:900;
}

.system-news-card header strong,
.system-news-card header small{
  display:block;
}

.system-news-card header strong{
  color:#d8dde1;

  font-size:.71rem;
}

.system-news-card header small{
  margin-top:.15rem;

  color:#686f78;

  font-size:.56rem;
}

.system-news-card header>b{
  padding:.20rem .34rem;

  border:1px solid rgba(255,59,86,.12);
  border-radius:.36rem;

  color:#ff778b;
  background:rgba(255,48,79,.032);

  font-size:.47rem;
}

.system-news-body{
  padding-top:.62rem;

  color:#b9c0c6;

  font-size:clamp(.76rem,.71rem + .10vw,.86rem);
  line-height:1.65;

  white-space:pre-wrap;
  overflow-wrap:anywhere;
}

.system-channel-empty{
  min-height:18rem;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  text-align:center;
}

.system-channel-empty>span{
  width:3.5rem;
  height:3.5rem;

  display:grid;
  place-items:center;

  border:1px solid rgba(255,61,87,.09);
  border-radius:.9rem;

  color:#9c4655;
  background:rgba(255,48,79,.018);

  font-size:1.2rem;
  font-weight:900;
}

.system-channel-empty strong{
  margin-top:.65rem;

  color:#8d959d;

  font-size:.68rem;
  letter-spacing:.065em;
}

.system-channel-empty small{
  margin-top:.25rem;

  color:#5f6972;

  font-size:.60rem;
}

.chat-disabled:has(.system-chat-lock){
  min-height:3.5rem!important;

  display:grid!important;
  grid-template-columns:2.25rem minmax(0,1fr)!important;
  align-items:center!important;
  gap:.62rem!important;

  padding:.62rem!important;

  border-top:1px solid rgba(255,255,255,.045)!important;

  color:inherit!important;
  background:rgba(2,6,10,.24)!important;
}

.system-chat-lock{
  width:2.15rem;
  height:2.15rem;

  display:grid;
  place-items:center;

  border:1px solid rgba(255,255,255,.05);
  border-radius:.58rem;

  background:rgba(255,255,255,.012);
}

.chat-disabled:has(.system-chat-lock) strong,
.chat-disabled:has(.system-chat-lock) small{
  display:block;
}

.chat-disabled:has(.system-chat-lock) strong{
  color:#8e979f;

  font-size:.62rem;
}

.chat-disabled:has(.system-chat-lock) small{
  margin-top:.18rem;

  color:#5e6871;

  font-size:.57rem;
}

/* ---------------------------------------------------------
   ADMIN PUBLIC PROFILE — never looks like VIP
   --------------------------------------------------------- */

.public-profile-membership.admin,
.locked-membership.admin{
  color:#ff7a8e;

  border:1px solid rgba(255,58,85,.16);

  background:
    linear-gradient(180deg,rgba(255,48,79,.05),rgba(255,48,79,.02));
}

.public-profile-role.admin + *{
  position:relative;
}

/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media(max-width:1280px){
  .discord-nav-badge>span{
    display:none;
  }

  .discord-nav-badge{
    grid-template-columns:1.5rem auto;

    padding:.35rem .45rem;
  }
}

@media(max-width:1080px){
  .discord-nav-badge{
    display:none!important;
  }
}

@media(max-width:760px){
  .portal-bottom-tabs-three{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }

  .portal-bottom-tabs-three .bottom-tab{
    min-width:0!important;
    padding:.42rem .25rem!important;
  }

  .portal-bottom-tabs-three .bottom-tab strong{
    font-size:.59rem!important;
  }

  .settings-layout{
    height:min(40rem,calc(94vh - 6rem))!important;

    display:block!important;

    overflow:auto!important;
  }

  .settings-nav{
    position:sticky;
    top:0;
    z-index:3;

    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:.32rem!important;

    padding:.55rem!important;

    overflow:visible!important;

    border-right:0!important;
    border-bottom:1px solid rgba(255,255,255,.055)!important;

    background:rgba(8,12,18,.98)!important;
  }

  .settings-nav-item{
    min-height:2.65rem!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    padding:.40rem!important;

    text-align:center!important;
  }

  .settings-nav-item span{
    display:none!important;
  }

  .settings-content{
    overflow:visible!important;
  }

  .settings-form-grid{
    grid-template-columns:1fr!important;
  }

  .terms-layout{
    display:block;
  }

  .terms-index{
    display:flex;
    gap:.34rem;

    overflow-x:auto;

    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.05);
  }

  .terms-index>span{
    display:none;
  }

  .terms-index button{
    min-width:8.5rem;

    margin:0;

    flex:0 0 auto;
  }
}

@media(max-width:520px){
  .terms-header{
    align-items:flex-start;
    flex-direction:column;
  }

  .terms-version{
    width:100%;

    text-align:left;
  }

  .terms-rule-card{
    grid-template-columns:2.5rem minmax(0,1fr);

    padding:.62rem;
  }

  .terms-rule-number{
    width:2.25rem;
    height:2.25rem;
  }

  .system-news-card>header{
    grid-template-columns:2.1rem minmax(0,1fr);
  }

  .system-news-card header>b{
    display:none;
  }

  .portal-bottom-tabs-three .bottom-tab strong{
    font-size:.53rem!important;
  }
}


/* =========================================================
   V25 — VOTES / LIVE ACTIVITY / ADMIN BANLIST
   ========================================================= */

/* ---------------------------------------------------------
   Live activity
   --------------------------------------------------------- */

.live-relative-time{
  white-space:nowrap;
  font:inherit;
  color:inherit;
}

.conversation-time{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-end!important;
  justify-content:center!important;
  gap:.22rem!important;
}

.conversation-live-time{
  color:#69737d!important;
  font-size:.55rem!important;
  font-weight:700!important;
}

.private-unread-mini{
  min-width:1.15rem;
  height:1.15rem;

  display:grid;
  place-items:center;

  padding:0 .22rem;

  border-radius:999px;

  color:#fff;
  background:#df2c4b;

  font-size:.49rem;
}

.system-time{
  min-width:4.2rem!important;
}

.system-lock-mini{
  color:#665d62;
  font-size:.58rem;
}

.chat-live-time,
.thread-post-time,
.system-news-time{
  color:inherit!important;
}

/* ---------------------------------------------------------
   Thread thumbs up / down
   --------------------------------------------------------- */

.thread-votes{
  display:flex;
  align-items:center;
  gap:.25rem;
}

.thread-votes.compact{
  margin-left:.26rem;
  padding-left:.35rem;

  border-left:1px solid rgba(255,255,255,.045);
}

.thread-vote-button{
  min-width:2rem;
  height:1.65rem;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.27rem;

  padding:0 .36rem;

  border:1px solid rgba(255,255,255,.055);
  border-radius:.48rem;

  color:#707b85;
  background:rgba(255,255,255,.012);

  font-size:.57rem;
  font-weight:850;

  cursor:pointer;
  transition:.14s ease;
}

.thread-vote-button svg{
  width:.82rem;
  height:.82rem;

  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
  stroke-linejoin:round;
}

.thread-vote-button:hover{
  transform:translateY(-1px);

  color:#b9c0c6;
  border-color:rgba(255,255,255,.10);
  background:rgba(255,255,255,.026);
}

.thread-vote-button.up.active{
  color:#71d89a;
  border-color:rgba(79,204,129,.16);
  background:rgba(79,204,129,.045);

  box-shadow:0 0 .6rem rgba(79,204,129,.04);
}

.thread-vote-button.down.active{
  color:#ff7b8e;
  border-color:rgba(255,57,85,.16);
  background:rgba(255,48,79,.045);

  box-shadow:0 0 .6rem rgba(255,48,79,.04);
}

.thread-vote-score{
  min-width:1.6rem;

  color:#7e8992;

  font-size:.56rem;
  font-weight:900;

  text-align:center;
}

.thread-vote-score.negative{
  color:#a86d78;
}

.thread-reaction-detail{
  min-height:4.1rem;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.8rem;

  margin-top:.58rem;
  padding:.62rem .72rem;

  border:1px solid rgba(255,255,255,.05);
  border-radius:.72rem;

  background:
    radial-gradient(circle at 92% 50%,rgba(255,48,79,.025),transparent 30%),
    rgba(255,255,255,.008);
}

.thread-reaction-copy span,
.thread-reaction-copy strong{
  display:block;
}

.thread-reaction-copy span{
  color:#626c76;

  font-size:.54rem;
  font-weight:850;
  letter-spacing:.075em;
}

.thread-reaction-copy strong{
  margin-top:.18rem;

  color:#abb3ba;

  font-size:.69rem;
}

.thread-votes.detail{
  flex:0 0 auto;
}

.thread-votes.detail .thread-vote-button{
  min-width:3.25rem;
  height:2.15rem;

  font-size:.66rem;
}

.thread-votes.detail .thread-vote-button svg{
  width:1rem;
  height:1rem;
}

.thread-votes.detail .thread-vote-score{
  min-width:2.25rem;

  font-size:.66rem;
}

/* ---------------------------------------------------------
   Account popover admin Banlist tile
   --------------------------------------------------------- */

.account-stat-adminable{
  min-width:0;

  padding:.58rem .52rem;

  border:1px solid rgba(255,255,255,.055);
  border-radius:.65rem;

  color:inherit;
  background:rgba(255,255,255,.018);

  text-align:left;
}

.account-stat-adminable:disabled{
  opacity:1;
  cursor:default;
}

.account-stat-adminable span,
.account-stat-adminable strong{
  display:block;
}

.account-stat-adminable span{
  color:#6e7882;

  font-size:.58rem;
  font-weight:750;
  letter-spacing:.055em;
}

.account-stat-adminable strong{
  margin-top:.20rem;

  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  color:#ffd05b;

  font-size:.70rem;
}

.account-stat-adminable.admin-banlist-tile{
  cursor:pointer;

  border-color:rgba(255,62,90,.12);

  background:
    radial-gradient(circle at 85% 15%,rgba(255,48,79,.06),transparent 38%),
    rgba(255,48,79,.018);

  transition:.15s ease;
}

.account-stat-adminable.admin-banlist-tile span{
  color:#9d6570;
}

.account-stat-adminable.admin-banlist-tile strong{
  color:#ff8294;
}

.account-stat-adminable.admin-banlist-tile:hover{
  transform:translateY(-1px);

  border-color:rgba(255,62,90,.20);
  background:rgba(255,48,79,.035);
}

/* ---------------------------------------------------------
   Admin Banlist modal
   --------------------------------------------------------- */

.banlist-screen{
  position:fixed;
  inset:0;
  z-index:320;

  display:grid;
  place-items:center;

  padding:1rem;
}

.banlist-screen.hidden{
  display:none!important;
}

.banlist-backdrop{
  position:absolute;
  inset:0;

  background:rgba(1,4,8,.82);

  backdrop-filter:blur(.65rem);
  -webkit-backdrop-filter:blur(.65rem);
}

.banlist-window{
  width:min(68rem,97vw);
  max-height:min(49rem,94vh);

  position:relative;
  z-index:1;

  overflow:hidden;

  border:1px solid rgba(255,255,255,.085)!important;
  border-radius:1rem!important;

  background:
    radial-gradient(circle at 90% -8%,rgba(255,48,79,.06),transparent 31%),
    linear-gradient(155deg,rgba(13,18,25,.995),rgba(4,8,13,.998))!important;

  box-shadow:
    0 2.2rem 5rem rgba(0,0,0,.55),
    inset 0 1px 0 rgba(255,255,255,.03)!important;
}

.banlist-header{
  min-height:5.1rem;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;

  padding:.78rem .95rem;

  border-bottom:1px solid rgba(255,255,255,.055);
}

.banlist-header>div>span{
  color:#795f68;

  font-size:.55rem;
  font-weight:900;
  letter-spacing:.09em;
}

.banlist-header h2{
  margin:.16rem 0 0;

  color:#eef1f3;

  font-size:1.12rem;
}

.banlist-header p{
  margin:.18rem 0 0;

  color:#67717b;

  font-size:.63rem;
}

.banlist-header>button{
  width:2.1rem;
  height:2.1rem;

  display:grid;
  place-items:center;

  padding:0;

  border:1px solid rgba(255,255,255,.065);
  border-radius:.56rem;

  color:#858f98;
  background:rgba(255,255,255,.016);

  font-size:1.05rem;

  cursor:pointer;
}

.banlist-layout{
  height:min(40rem,calc(94vh - 6.5rem));

  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);

  overflow:hidden;
}

.banlist-create,
.banlist-active{
  min-width:0;

  padding:.85rem;

  overflow:auto;
}

.banlist-create{
  border-right:1px solid rgba(255,255,255,.05);

  background:rgba(2,6,10,.18);
}

.banlist-section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.7rem;

  margin-bottom:.58rem;
}

.banlist-section-head>span{
  color:#707a84;

  font-size:.59rem;
  font-weight:850;
  letter-spacing:.08em;
}

.banlist-section-head>strong{
  min-width:1.45rem;
  height:1.45rem;

  display:grid;
  place-items:center;

  border:1px solid rgba(255,255,255,.055);
  border-radius:.46rem;

  color:#7f8992;
  background:rgba(255,255,255,.014);

  font-size:.57rem;
}

.banlist-search{
  min-height:3rem;

  display:grid;
  grid-template-columns:1.8rem minmax(0,1fr);
  align-items:center;

  padding:0 .62rem;

  border:1px solid rgba(255,255,255,.065);
  border-radius:.66rem;

  background:#080d13;
}

.banlist-search>span{
  color:#65707a;

  font-size:.9rem;
}

.banlist-search input{
  width:100%;

  border:0;
  outline:0;

  color:#dde2e5;
  background:transparent;

  font:inherit;
  font-size:.74rem;
}

.banlist-search-results{
  max-height:13rem;

  display:flex;
  flex-direction:column;
  gap:.30rem;

  margin-top:.42rem;

  overflow:auto;
}

.banlist-search-results.hidden{
  display:none!important;
}

.banlist-user-result{
  min-height:3.25rem;

  display:grid;
  grid-template-columns:2.35rem minmax(0,1fr) auto;
  align-items:center;
  gap:.48rem;

  padding:.40rem .46rem;

  border:1px solid rgba(255,255,255,.045);
  border-radius:.62rem;

  color:inherit;
  background:rgba(255,255,255,.008);

  text-align:left;

  cursor:pointer;
}

.banlist-user-result:hover{
  border-color:rgba(255,255,255,.085);

  background:rgba(255,255,255,.022);
}

.banlist-user-result img{
  width:2.25rem;
  height:2.25rem;

  object-fit:cover;

  border-radius:.60rem;
}

.banlist-user-result strong,
.banlist-user-result small{
  display:block;
}

.banlist-user-result strong{
  color:#c4cbd0;

  font-size:.67rem;
}

.banlist-user-result small{
  margin-top:.16rem;

  color:#606b74;

  font-size:.55rem;
}

.banlist-user-ip{
  color:#6a737d;

  font-size:.56rem;
}

.banlist-selected{
  min-height:4rem;

  display:grid;
  grid-template-columns:3rem minmax(0,1fr) 1.7rem;
  align-items:center;
  gap:.55rem;

  margin-top:.55rem;
  padding:.50rem .55rem;

  border:1px solid rgba(255,57,85,.10);
  border-radius:.68rem;

  background:
    linear-gradient(90deg,rgba(255,48,79,.028),transparent),
    rgba(255,255,255,.006);
}

.banlist-selected img{
  width:2.8rem;
  height:2.8rem;

  object-fit:cover;

  border-radius:.70rem;
}

.banlist-selected>div>span,
.banlist-selected>div>strong,
.banlist-selected>div>small{
  display:block;
}

.banlist-selected>div>span{
  color:#765d66;

  font-size:.52rem;
  font-weight:850;
  letter-spacing:.07em;
}

.banlist-selected>div>strong{
  margin-top:.12rem;

  color:#d7dbdf;

  font-size:.72rem;
}

.banlist-selected>div>small{
  margin-top:.15rem;

  color:#68727b;

  font-size:.56rem;
}

.banlist-selected>button{
  width:1.65rem;
  height:1.65rem;

  display:grid;
  place-items:center;

  padding:0;

  border:1px solid rgba(255,255,255,.055);
  border-radius:.45rem;

  color:#6d7780;
  background:rgba(255,255,255,.012);

  cursor:pointer;
}

.banlist-form{
  display:grid;
  gap:.56rem;

  margin-top:.65rem;
}

.banlist-form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.48rem;
}

.banlist-form label>span{
  display:block;

  margin-bottom:.28rem;

  color:#6f7982;

  font-size:.56rem;
  font-weight:850;
  letter-spacing:.07em;
}

.banlist-form select,
.banlist-form textarea{
  width:100%;

  box-sizing:border-box;

  border:1px solid rgba(255,255,255,.065);
  border-radius:.60rem;

  color:#cbd1d5;
  background:#080d13;

  font:inherit;
  font-size:.68rem;

  outline:0;
}

.banlist-form select{
  min-height:2.65rem;

  padding:0 .58rem;
}

.banlist-form textarea{
  min-height:5.6rem;

  padding:.62rem;

  line-height:1.5;

  resize:vertical;
}

.banlist-impact{
  min-height:3.2rem;

  display:grid;
  grid-template-columns:2.1rem minmax(0,1fr);
  align-items:center;
  gap:.55rem;

  padding:.55rem .60rem;

  border:1px solid rgba(255,149,82,.075);
  border-radius:.62rem;

  background:rgba(255,135,72,.012);
}

.banlist-impact>span{
  width:1.95rem;
  height:1.95rem;

  display:grid;
  place-items:center;

  border-radius:.52rem;

  color:#a8785e;
  background:rgba(255,139,79,.025);
}

.banlist-impact strong,
.banlist-impact small{
  display:block;
}

.banlist-impact strong{
  color:#b79a88;

  font-size:.59rem;
}

.banlist-impact small{
  margin-top:.14rem;

  color:#675f5c;

  font-size:.54rem;
  line-height:1.35;
}

.banlist-submit{
  min-height:2.75rem;

  border:1px solid rgba(255,56,84,.18);
  border-radius:.62rem;

  color:#fff;
  background:linear-gradient(180deg,#e42d4b,#ad1530);

  font-size:.65rem;
  font-weight:900;
  letter-spacing:.045em;

  cursor:pointer;
}

.banlist-submit:disabled{
  opacity:.38;

  cursor:not-allowed;
}

.banlist-active-list{
  display:flex;
  flex-direction:column;
  gap:.42rem;
}

.banlist-row{
  min-width:0;

  display:grid;
  grid-template-columns:2.55rem minmax(0,1fr) auto;
  align-items:start;
  gap:.55rem;

  padding:.58rem;

  border:1px solid rgba(255,255,255,.045);
  border-radius:.68rem;

  background:rgba(255,255,255,.007);
}

.banlist-row-icon{
  width:2.35rem;
  height:2.35rem;

  display:grid;
  place-items:center;

  border-radius:.60rem;

  font-size:.62rem;
  font-weight:900;
}

.banlist-row-icon.name{
  color:#ff788c;

  border:1px solid rgba(255,57,85,.11);
  background:rgba(255,48,79,.025);
}

.banlist-row-icon.ip{
  color:#f0a36e;

  border:1px solid rgba(255,145,79,.11);
  background:rgba(255,131,69,.022);
}

.banlist-row-main{
  min-width:0;
}

.banlist-row-title{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.35rem;
}

.banlist-row-title strong{
  min-width:0;

  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  color:#cdd2d6;

  font-size:.69rem;
}

.banlist-row-title span{
  min-height:1.14rem;

  display:inline-flex;
  align-items:center;

  padding:0 .30rem;

  border:1px solid rgba(255,255,255,.055);
  border-radius:.34rem;

  color:#777f88;
  background:rgba(255,255,255,.012);

  font-size:.48rem;
  font-weight:850;
}

.banlist-row p{
  margin:.28rem 0 0;

  color:#858e96;

  font-size:.62rem;
  line-height:1.42;

  overflow-wrap:anywhere;
}

.banlist-row-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.25rem;

  margin-top:.34rem;

  color:#5f6972;

  font-size:.54rem;
}

.banlist-row-meta i{
  opacity:.45;
}

.banlist-unban{
  min-height:1.9rem;

  padding:0 .46rem;

  border:1px solid rgba(94,190,132,.10);
  border-radius:.50rem;

  color:#72bd8f;
  background:rgba(73,184,113,.018);

  font-size:.54rem;
  font-weight:850;

  cursor:pointer;
}

.banlist-unban:hover{
  color:#96dbaf;

  border-color:rgba(94,201,138,.18);
  background:rgba(73,184,113,.035);
}

.banlist-empty{
  min-height:3rem;

  display:grid;
  place-items:center;

  padding:.65rem;

  color:#606a74;

  border:1px dashed rgba(255,255,255,.045);
  border-radius:.62rem;

  font-size:.59rem;
  text-align:center;
}

.banlist-empty-active{
  min-height:10rem;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}

.banlist-empty-active>span{
  width:2.5rem;
  height:2.5rem;

  display:grid;
  place-items:center;

  margin-bottom:.45rem;

  border-radius:.65rem;

  color:#6db98a;
  background:rgba(69,180,109,.025);
}

.banlist-empty-active strong,
.banlist-empty-active small{
  display:block;
}

.banlist-empty-active strong{
  color:#8e979e;

  font-size:.62rem;
}

.banlist-empty-active small{
  margin-top:.18rem;

  color:#5c6670;

  font-size:.55rem;
}

/* ---------------------------------------------------------
   Banned web access screen
   --------------------------------------------------------- */

.ban-enforcement-screen{
  position:fixed;
  inset:0;
  z-index:500;

  display:grid;
  place-items:center;

  padding:1rem;
}

.ban-enforcement-screen.hidden{
  display:none!important;
}

.ban-enforcement-backdrop{
  position:absolute;
  inset:0;

  background:rgba(1,3,6,.93);

  backdrop-filter:blur(.8rem);
  -webkit-backdrop-filter:blur(.8rem);
}

.ban-enforcement-card{
  width:min(31rem,95vw);

  position:relative;
  z-index:1;

  padding:1.25rem;

  border:1px solid rgba(255,58,85,.12);
  border-radius:1rem;

  background:
    radial-gradient(circle at 50% -5%,rgba(255,48,79,.08),transparent 35%),
    linear-gradient(155deg,#10151c,#06090e);

  box-shadow:0 2rem 5rem rgba(0,0,0,.58);

  text-align:center;
}

.ban-enforcement-icon{
  width:4rem;
  height:4rem;

  display:grid;
  place-items:center;

  margin:0 auto;

  border:1px solid rgba(255,60,87,.15);
  border-radius:1rem;

  color:#ff768a;
  background:rgba(255,48,79,.035);

  font-size:1.45rem;
}

.ban-enforcement-kicker{
  display:block;

  margin-top:.82rem;

  color:#795d66;

  font-size:.56rem;
  font-weight:900;
  letter-spacing:.10em;
}

.ban-enforcement-card h2{
  margin:.28rem 0 0;

  color:#edf0f2;

  font-size:1.15rem;
}

.ban-enforcement-card>p{
  margin:.48rem 0 0;

  color:#9da5ac;

  font-size:.72rem;
  line-height:1.55;
}

.ban-enforcement-meta{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.48rem;

  margin-top:.8rem;
}

.ban-enforcement-meta>div{
  padding:.58rem;

  border:1px solid rgba(255,255,255,.05);
  border-radius:.62rem;

  background:rgba(255,255,255,.008);
}

.ban-enforcement-meta span,
.ban-enforcement-meta strong{
  display:block;
}

.ban-enforcement-meta span{
  color:#626c75;

  font-size:.53rem;
  font-weight:850;
  letter-spacing:.07em;
}

.ban-enforcement-meta strong{
  margin-top:.18rem;

  color:#c7cdd2;

  font-size:.65rem;
}

.ban-enforcement-card>small{
  display:block;

  margin-top:.78rem;

  color:#5f6972;

  font-size:.59rem;
  line-height:1.5;
}

/* ---------------------------------------------------------
   Official lock copy ONLY inside official X-Sites channel
   --------------------------------------------------------- */

.chat-disabled.system-readonly-notice{
  min-height:3.5rem!important;

  display:grid!important;
  grid-template-columns:2.25rem minmax(0,1fr)!important;
  align-items:center!important;
  gap:.62rem!important;

  padding:.62rem!important;

  border-top:1px solid rgba(255,255,255,.045)!important;

  color:inherit!important;
  background:rgba(2,6,10,.24)!important;
}

.chat-disabled:not(.system-readonly-notice) .system-chat-lock{
  display:none!important;
}

/* ---------------------------------------------------------
   Security settings buttons: normal compact width
   --------------------------------------------------------- */

.settings-panel[data-settings-panel="security"] .settings-save{
  width:max-content!important;
  min-width:9rem!important;
  max-width:100%!important;

  justify-self:start!important;

  padding:0 .85rem!important;
}

/* ---------------------------------------------------------
   Responsive
   --------------------------------------------------------- */

@media(max-width:820px){
  .thread-votes.compact{
    width:max-content;

    margin:.25rem 0 0!important;
    padding:0!important;

    border-left:0!important;
  }

  .thread-reaction-detail{
    align-items:flex-start;
    flex-direction:column;
  }

  .banlist-layout{
    display:block;

    overflow:auto;
  }

  .banlist-create{
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.05);
  }

  .banlist-create,
  .banlist-active{
    overflow:visible;
  }
}

@media(max-width:520px){
  .thread-votes.detail{
    width:100%;

    justify-content:space-between;
  }

  .thread-votes.detail .thread-vote-button{
    flex:1;
  }

  .banlist-form-grid{
    grid-template-columns:1fr;
  }

  .banlist-row{
    grid-template-columns:2.3rem minmax(0,1fr);
  }

  .banlist-unban{
    grid-column:1/-1;

    width:100%;
  }

  .banlist-user-result{
    grid-template-columns:2.35rem minmax(0,1fr);
  }

  .banlist-user-ip{
    display:none;
  }
}


/* =========================================================
   V26 — FINAL NIGHT UPGRADE
   ========================================================= */
.portal-statusbar{justify-content:flex-start!important}.portal-statusbar>.portal-status:not(.user-stat){min-width:6.9rem!important}.portal-statusbar>.portal-status:not(.user-stat)>strong{color:#dce1e4!important;font-size:.83rem!important;letter-spacing:.045em!important}
.account-action-svg svg{width:1.2rem;height:1.2rem;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}.account-action-svg{display:grid!important;place-items:center!important}.admin-reports-action{border-color:rgba(255,58,85,.075)!important}.admin-reports-action .account-action-svg{color:#ff7a8d!important;border-color:rgba(255,58,85,.11)!important;background:rgba(255,48,79,.028)!important}
.admin-report-bell{width:2.55rem;height:2.55rem;position:relative;display:grid;place-items:center;padding:0;border:1px solid rgba(255,58,85,.17);border-radius:.82rem;color:#ff7287;background:radial-gradient(circle at 50% 35%,rgba(255,48,79,.10),transparent 65%),rgba(255,48,79,.025);box-shadow:0 0 1rem rgba(255,48,79,.07);cursor:pointer;animation:adminReportPulse 2.3s ease-in-out infinite}.admin-report-bell.hidden{display:none!important}.admin-report-bell svg{width:1.1rem;height:1.1rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.admin-report-bell>span{min-width:1rem;height:1rem;position:absolute;right:-.28rem;top:-.28rem;display:grid;place-items:center;padding:0 .22rem;border:.12rem solid #090d13;border-radius:999px;color:#fff;background:#dc2949;font-size:.51rem;font-weight:900}@keyframes adminReportPulse{0%,100%{box-shadow:0 0 .45rem rgba(255,48,79,.04)}50%{box-shadow:0 0 1.25rem rgba(255,48,79,.14)}}
.forum-thread-v21{position:relative}.forum-list-delete{width:2rem;height:2rem;position:absolute;right:.32rem;top:.30rem;display:grid;place-items:center;padding:0;border:1px solid rgba(255,59,86,.075);border-radius:.48rem;color:#7f545c;background:rgba(255,48,79,.012);opacity:.28;cursor:pointer;transition:.15s ease}.forum-thread-v21:hover .forum-list-delete,.forum-list-delete:hover,.forum-list-delete.confirming{opacity:1}.forum-list-delete svg{width:.85rem;height:.85rem;fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round}.forum-list-delete:hover,.forum-list-delete.confirming{color:#ff788b;border-color:rgba(255,58,85,.16);background:rgba(255,48,79,.035)}.thread-votes.compact{display:none!important}.moderation-actions .danger-admin{color:#ff8294!important;border-color:rgba(255,59,86,.12)!important;background:rgba(255,48,79,.024)!important}.moderation-actions .danger-admin.confirming{color:#fff!important;border-color:rgba(255,59,86,.28)!important;background:rgba(194,24,53,.18)!important}.forum-report-topic{width:100%;min-height:2.2rem;border:1px solid rgba(255,255,255,.055);border-radius:.52rem;color:#818b94;background:rgba(255,255,255,.012);font-size:.60rem;font-weight:800;cursor:pointer}.forum-report-topic:hover{color:#ff8798;border-color:rgba(255,61,88,.10);background:rgba(255,48,79,.018)}
.new-topic-button{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:.45rem!important;font-weight:850!important}.new-topic-button>span{width:1.75rem;height:1.75rem;display:grid;place-items:center;border:1px solid rgba(255,255,255,.09);border-radius:.48rem;background:rgba(255,255,255,.025);font-size:1.15rem;font-weight:500;line-height:1}.new-topic-button>strong{font-size:.70rem;letter-spacing:.035em}.antibot-check-ui{display:flex!important;align-items:center!important;justify-content:center!important;padding:0!important}.antibot-check-ui svg{display:block!important;margin:0!important;transform:none!important}
.chat-actions{gap:.42rem!important}.chat-actions button{min-height:2.35rem!important;padding:0 .68rem!important;border-radius:.55rem!important;font-size:clamp(.63rem,.59rem + .08vw,.71rem)!important;font-weight:850!important;letter-spacing:.025em!important}#chatReportBtn{color:#d2a174!important;border-color:rgba(233,153,85,.08)!important}.chat-disabled-prominent{min-height:4.3rem!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:.8rem 1rem!important;color:#aab2b9!important;background:rgba(255,255,255,.009)!important;font-size:clamp(.76rem,.70rem + .12vw,.90rem)!important;font-weight:750!important;line-height:1.45!important;text-align:center!important}
.search-user-avatar-button{width:2.35rem;height:2.35rem;display:grid;place-items:center;padding:0;border:0;border-radius:.62rem;background:transparent;cursor:pointer}.search-user-avatar-button:hover{box-shadow:0 0 0 .14rem rgba(255,58,85,.08)}.conversation-avatar.profile-trigger,.thread-avatar-wrap.profile-trigger,.thread-list-avatar-wrap.profile-trigger,.contributor-avatar-wrap.profile-trigger,#chatUserAvatar.profile-trigger{cursor:pointer!important}
.alerts{width:min(28rem,calc(100vw - 1.2rem))!important;right:.75rem!important;top:5.4rem!important;display:flex!important;flex-direction:column!important;gap:.55rem!important}.alert-v26{min-height:5.1rem!important;position:relative!important;display:grid!important;grid-template-columns:2.8rem minmax(0,1fr) 1.7rem!important;align-items:center!important;gap:.65rem!important;padding:.68rem .72rem .82rem!important;overflow:hidden!important;border:1px solid rgba(255,65,91,.15)!important;border-radius:.85rem!important;color:#fff!important;background:radial-gradient(circle at 6% 30%,rgba(255,48,79,.12),transparent 28%),linear-gradient(155deg,rgba(20,18,24,.97),rgba(8,11,16,.985))!important;box-shadow:0 1rem 2.4rem rgba(0,0,0,.32),0 0 1.4rem rgba(255,48,79,.045),inset 0 1px 0 rgba(255,255,255,.035)!important;backdrop-filter:blur(.75rem)!important;-webkit-backdrop-filter:blur(.75rem)!important;animation:alertV26In .26s cubic-bezier(.2,.8,.2,1)!important}.alert-v26:after{display:none!important}.alert-v26-glow{width:3.2rem;height:3.2rem;position:absolute;left:-.8rem;top:50%;transform:translateY(-50%);border-radius:50%;background:rgba(255,48,79,.16);filter:blur(1.25rem);pointer-events:none}.alert-v26-icon{width:2.55rem;height:2.55rem;position:relative;display:grid;place-items:center;border:1px solid rgba(255,61,88,.16);border-radius:.72rem;color:#ff7388;background:rgba(255,48,79,.04);box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}.alert-v26.success .alert-v26-icon,.alert-v26.error .alert-v26-icon{color:#ff7388!important;background:rgba(255,48,79,.04)!important}.alert-v26-icon svg{width:1.12rem;height:1.12rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.alert-v26-copy{min-width:0}.alert-v26-copy small,.alert-v26-copy strong,.alert-v26-copy span{display:block!important}.alert-v26-copy small{color:#845f67!important;font-size:.51rem!important;font-weight:900!important;letter-spacing:.09em!important}.alert-v26-copy strong{margin:.15rem 0 0!important;color:#f0e9eb!important;font-size:clamp(.72rem,.67rem + .10vw,.82rem)!important;font-weight:850!important}.alert-v26-copy span{margin-top:.22rem!important;color:#929ba3!important;font-size:clamp(.62rem,.58rem + .08vw,.70rem)!important;line-height:1.42!important}.alert-v26-close{width:1.65rem;height:1.65rem;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.05);border-radius:.45rem;color:#777f87;background:rgba(255,255,255,.012);font-size:.86rem;cursor:pointer}.alert-v26-progress{height:.13rem;position:absolute;left:.72rem;right:.72rem;bottom:.36rem;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.04)}.alert-v26-progress:after{content:"";width:100%;height:100%;display:block;border-radius:inherit;background:linear-gradient(90deg,#a41430,#ff4e68);transform-origin:left center;animation:alertV26Progress var(--alert-duration) linear forwards}.alert-v26.out{animation:alertOut .28s ease forwards!important}@keyframes alertV26In{from{opacity:0;transform:translateY(-.45rem) scale(.98)}to{opacity:1;transform:none}}@keyframes alertV26Progress{to{transform:scaleX(0)}}
.report-dialog,.admin-reports-screen{position:fixed;inset:0;z-index:340;display:grid;place-items:center;padding:1rem}.report-dialog.hidden,.admin-reports-screen.hidden{display:none!important}.report-dialog-backdrop,.admin-reports-backdrop{position:absolute;inset:0;background:rgba(1,4,8,.82);backdrop-filter:blur(.65rem);-webkit-backdrop-filter:blur(.65rem)}.report-dialog-card{width:min(31rem,95vw);position:relative;z-index:1;padding:1rem;border:1px solid rgba(255,58,85,.12);border-radius:.95rem;background:radial-gradient(circle at 90% -8%,rgba(255,48,79,.07),transparent 34%),linear-gradient(155deg,#11171e,#060a0f);box-shadow:0 1.8rem 4.5rem rgba(0,0,0,.50)}.report-dialog-close{width:1.9rem;height:1.9rem;position:absolute;right:.65rem;top:.65rem;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.06);border-radius:.5rem;color:#7c858e;background:rgba(255,255,255,.012);cursor:pointer}.report-dialog-kicker{color:#7a5c65;font-size:.54rem;font-weight:900;letter-spacing:.09em}.report-dialog-card h2{margin:.25rem 2.3rem 0 0;color:#edf0f2;font-size:1rem}.report-dialog-card>p{margin:.34rem 0 0;color:#737d86;font-size:.68rem;line-height:1.45}.report-dialog-card textarea{width:100%;min-height:7rem;box-sizing:border-box;margin-top:.72rem;padding:.68rem;border:1px solid rgba(255,255,255,.07);border-radius:.65rem;color:#dce1e4;background:#080d13;font:inherit;font-size:.75rem;line-height:1.5;outline:0;resize:vertical}.report-dialog-card>small{display:block;margin-top:.26rem;color:#5f6972;font-size:.55rem;text-align:right}.report-dialog-note{display:grid;grid-template-columns:1.8rem minmax(0,1fr);align-items:center;gap:.48rem;margin-top:.55rem;padding:.52rem;border:1px solid rgba(255,255,255,.045);border-radius:.58rem;background:rgba(255,255,255,.007)}.report-dialog-note>span{width:1.7rem;height:1.7rem;display:grid;place-items:center;border-radius:.45rem;color:#807078;background:rgba(255,255,255,.014)}.report-dialog-note p{margin:0;color:#656f78;font-size:.58rem;line-height:1.4}.report-dialog-submit{width:100%;min-height:2.65rem;margin-top:.62rem;border:1px solid rgba(255,58,85,.17);border-radius:.62rem;color:#fff;background:linear-gradient(180deg,#de2c4a,#a71530);font-size:.65rem;font-weight:900;letter-spacing:.04em;cursor:pointer}
.admin-reports-screen{z-index:350}.admin-reports-window{width:min(72rem,97vw);max-height:min(50rem,94vh);position:relative;z-index:1;overflow:hidden;border-radius:1rem!important}.admin-reports-header{min-height:5rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.78rem .95rem;border-bottom:1px solid rgba(255,255,255,.055)}.admin-reports-header>div>span{color:#795e67;font-size:.54rem;font-weight:900;letter-spacing:.09em}.admin-reports-header h2{margin:.15rem 0 0;color:#edf0f2;font-size:1.05rem}.admin-reports-header p{margin:.20rem 0 0;color:#68727b;font-size:.62rem}.admin-reports-header>button{width:2rem;height:2rem;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.06);border-radius:.52rem;color:#7c858e;background:rgba(255,255,255,.012);cursor:pointer}.admin-reports-layout{height:min(41rem,calc(94vh - 6rem));display:grid;grid-template-columns:19rem minmax(0,1fr);overflow:hidden}.admin-reports-list{min-width:0;display:flex;flex-direction:column;gap:.34rem;padding:.7rem;overflow:auto;border-right:1px solid rgba(255,255,255,.05);background:rgba(2,6,10,.22)}.admin-report-row{min-width:0;min-height:4rem;display:grid;grid-template-columns:2rem minmax(0,1fr) auto;align-items:center;gap:.45rem;padding:.46rem;border:1px solid rgba(255,255,255,.045);border-radius:.62rem;color:inherit;background:rgba(255,255,255,.008);text-align:left;cursor:pointer}.admin-report-row:hover,.admin-report-row.open{border-color:rgba(255,58,85,.09);background:rgba(255,48,79,.018)}.admin-report-row-icon{width:1.85rem;height:1.85rem;display:grid;place-items:center;border-radius:.50rem;color:#98606b;background:rgba(255,48,79,.025);font-size:.67rem}.admin-report-row-copy{min-width:0}.admin-report-row-copy strong,.admin-report-row-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-report-row-copy strong{color:#c7cdd1;font-size:.64rem}.admin-report-row-copy small{margin-top:.17rem;color:#606a73;font-size:.54rem}.admin-report-status{min-height:1.2rem;display:inline-flex;align-items:center;padding:0 .32rem;border-radius:.35rem;color:#ff7e91;background:rgba(255,48,79,.035);font-size:.46rem;font-weight:900}.admin-report-detail{min-width:0;padding:.78rem;overflow:auto;background:rgba(5,9,14,.14)}.admin-report-placeholder,.admin-report-empty{min-height:15rem;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.admin-report-placeholder>span,.admin-report-empty>span{width:2.8rem;height:2.8rem;display:grid;place-items:center;margin-bottom:.48rem;border-radius:.70rem;color:#7d6870;background:rgba(255,48,79,.018)}.admin-report-placeholder strong,.admin-report-empty strong{color:#858e96;font-size:.65rem}.admin-report-placeholder small,.admin-report-empty small{margin-top:.18rem;color:#5d6770;font-size:.56rem}.admin-report-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.7rem;padding-bottom:.65rem;border-bottom:1px solid rgba(255,255,255,.05)}.admin-report-detail-head span{color:#755f67;font-size:.53rem;font-weight:900;letter-spacing:.08em}.admin-report-detail-head h3{margin:.18rem 0 0;color:#e1e5e8;font-size:.91rem}.admin-report-reason,.admin-report-thread-preview,.admin-report-chat-context{margin-top:.65rem;padding:.65rem;border:1px solid rgba(255,255,255,.05);border-radius:.65rem;background:rgba(255,255,255,.008)}.admin-report-reason span,.admin-report-reason strong,.admin-report-reason small{display:block}.admin-report-reason span{color:#626c75;font-size:.53rem;font-weight:850;letter-spacing:.07em}.admin-report-reason strong{margin-top:.24rem;color:#babfc4;font-size:.69rem;line-height:1.45}.admin-report-reason small{margin-top:.32rem;color:#606a72;font-size:.55rem}.admin-report-thread-preview>span{color:#626b74;font-size:.52rem;font-weight:850;letter-spacing:.075em}.admin-report-thread-preview h3{margin:.18rem 0 .42rem;color:#cbd1d5;font-size:.78rem}.admin-report-thread-preview p{margin:0;color:#8e979e;font-size:.65rem;line-height:1.55;white-space:pre-wrap}.admin-report-chat-context{padding:0;overflow:hidden}.admin-report-context-head{min-height:2.8rem;display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.55rem .65rem;border-bottom:1px solid rgba(255,255,255,.045)}.admin-report-context-head span{color:#71626a;font-size:.53rem;font-weight:850;letter-spacing:.07em}.admin-report-context-head small{color:#606a73;font-size:.54rem}.admin-report-chat-stream{max-height:24rem;padding:.55rem;overflow:auto}.admin-report-chat-line{margin-bottom:.42rem;padding:.52rem .58rem;border:1px solid rgba(255,255,255,.04);border-radius:.58rem;background:rgba(255,255,255,.008)}.admin-report-chat-line header{display:flex;align-items:center;justify-content:space-between;gap:.6rem}.admin-report-chat-line header strong{color:#bfc5ca;font-size:.62rem}.admin-report-chat-line header time{color:#606a72;font-size:.52rem}.admin-report-chat-line p{margin:.28rem 0 0;color:#919aa2;font-size:.64rem;line-height:1.5;white-space:pre-wrap}.admin-report-detail-actions{display:flex;flex-wrap:wrap;gap:.42rem;margin-top:.65rem}.admin-report-detail-actions button{min-height:2.35rem;padding:0 .66rem;border-radius:.55rem;font-size:.59rem;font-weight:850;cursor:pointer}.admin-report-detail-actions .open-target{color:#aeb6bd;border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.012)}.admin-report-detail-actions .resolve{color:#d4e0d8;border:1px solid rgba(91,200,133,.08);background:rgba(79,188,120,.018)}.admin-report-detail-actions .dismiss{color:#d29ca6;border:1px solid rgba(255,58,85,.08);background:rgba(255,48,79,.015)}
.radio-krokodyl-player{position:fixed;left:.72rem;bottom:.72rem;z-index:180;display:flex;align-items:center;gap:.38rem}.radio-krokodyl-main{min-height:3.25rem;display:grid;grid-template-columns:2.25rem auto .55rem;align-items:center;gap:.52rem;padding:.42rem .58rem;border:1px solid rgba(255,255,255,.08);border-radius:.82rem;color:#abb3ba;background:radial-gradient(circle at 8% 35%,rgba(80,190,103,.055),transparent 34%),rgba(8,13,18,.93);box-shadow:0 .65rem 1.6rem rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.025);backdrop-filter:blur(.7rem);-webkit-backdrop-filter:blur(.7rem);cursor:pointer;transition:.16s ease}.radio-krokodyl-main:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.13)}.radio-krokodyl-icon{width:2.15rem;height:2.15rem;display:grid;place-items:center;border:1px solid rgba(255,255,255,.06);border-radius:.62rem;color:#8bbd90;background:rgba(70,168,89,.025)}.radio-krokodyl-icon svg{width:1.08rem;height:1.08rem;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}.radio-krokodyl-copy{display:flex;flex-direction:column;align-items:flex-start;line-height:1.08}.radio-krokodyl-copy small{color:#627566;font-size:.48rem;font-weight:900;letter-spacing:.075em}.radio-krokodyl-copy strong{margin-top:.16rem;color:#9eaaa1;font-size:.62rem}.radio-live-dot{width:.45rem;height:.45rem;border-radius:50%;background:#6a7272}.radio-krokodyl-player.playing .radio-live-dot{background:#67d483;box-shadow:0 0 .7rem rgba(83,210,122,.45);animation:radioLivePulse 1.5s ease-in-out infinite}.radio-krokodyl-player.playing .radio-krokodyl-main{border-color:rgba(83,210,122,.10);background:radial-gradient(circle at 8% 35%,rgba(75,199,105,.075),transparent 35%),rgba(8,13,18,.94)}.radio-krokodyl-player.playing .radio-krokodyl-copy strong{color:#9ed7ad}.radio-krokodyl-volume{min-height:3.25rem;display:flex;align-items:center;gap:.38rem;padding:0 .52rem;border:1px solid rgba(255,255,255,.065);border-radius:.72rem;background:rgba(8,13,18,.92);box-shadow:0 .55rem 1.4rem rgba(0,0,0,.22)}.radio-krokodyl-volume.hidden{display:none!important}.radio-krokodyl-volume button{width:1.7rem;height:1.7rem;display:grid;place-items:center;padding:0;border:0;color:#7d878f;background:transparent;cursor:pointer}.radio-krokodyl-volume input{width:5rem;accent-color:#cf2343}@keyframes radioLivePulse{0%,100%{opacity:.6}50%{opacity:1}}
@media(max-width:760px){.admin-reports-layout{display:block;height:min(43rem,calc(94vh - 6rem));overflow:auto}.admin-reports-list{max-height:15rem;border-right:0;border-bottom:1px solid rgba(255,255,255,.05)}.admin-report-detail{overflow:visible}.radio-krokodyl-copy{display:none}.radio-krokodyl-main{grid-template-columns:2.25rem .55rem;padding:.42rem .48rem}.radio-krokodyl-volume{display:none!important}}@media(max-width:560px){.chat-actions{flex-wrap:wrap!important;justify-content:flex-end!important}.chat-actions button{min-height:2.15rem!important;padding:0 .52rem!important;font-size:.58rem!important}.forum-list-delete{opacity:.72}}


/* =========================================================
   V27 — FINAL POLISH / MULTI RADIO / SEARCH / PAGINATION
   ========================================================= */

/* Admin navbar role + infinite VIAL */
#topbarVipBox.admin-mode{
  border-color:rgba(255,58,85,.14)!important;
  background:radial-gradient(circle at 20% 30%,rgba(255,48,79,.07),transparent 40%),rgba(255,48,79,.018)!important;
}
#topbarVipBox.admin-mode .status-vip{color:#ff758a!important;background:rgba(255,48,79,.05)!important}
#topbarVipBox.admin-mode .stat-copy small{color:#8d5f68!important}
#topbarVipBox.admin-mode .stat-copy strong{color:#ff8295!important}
#topbarYunBox .stat-copy strong{font-variant-numeric:tabular-nums}

/* Search mode + deep result context */
.forum-search-mode{
  min-height:3.3rem;display:grid;grid-template-columns:2.1rem minmax(0,1fr) auto;align-items:center;gap:.55rem;
  margin:.5rem 0 .55rem;padding:.52rem .62rem;border:1px solid rgba(255,58,85,.09);border-radius:.67rem;
  background:linear-gradient(90deg,rgba(255,48,79,.027),transparent 55%),rgba(255,255,255,.006)
}
.forum-search-mode.hidden{display:none!important}
.forum-search-mode-icon{width:1.95rem;height:1.95rem;display:grid;place-items:center;border-radius:.53rem;color:#ff7a8d;background:rgba(255,48,79,.035);font-size:.83rem}
.forum-search-mode span,.forum-search-mode strong{display:block}
.forum-search-mode span{color:#815e67;font-size:.50rem;font-weight:900;letter-spacing:.08em}
.forum-search-mode strong{margin-top:.13rem;color:#9fa8af;font-size:.62rem;font-weight:700}
.forum-search-mode button{min-height:1.9rem;padding:0 .5rem;border:1px solid rgba(255,255,255,.055);border-radius:.48rem;color:#7d878f;background:rgba(255,255,255,.01);font-size:.52rem;font-weight:850;cursor:pointer}
.forum-search-mode button:hover{color:#ff8496;border-color:rgba(255,58,85,.10)}
.forum-thread-v21.search-result{align-items:start!important}
.forum-search-hit{margin-top:.38rem;padding:.38rem .45rem;border-left:.12rem solid rgba(255,61,88,.30);border-radius:.18rem .45rem .45rem .18rem;background:rgba(255,48,79,.013)}
.forum-search-hit>span{display:block;color:#8a6069;font-size:.48rem;font-weight:900;letter-spacing:.075em}
.forum-search-hit p{margin:.18rem 0 0;color:#828c94;font-size:.59rem;line-height:1.42;white-space:normal;overflow-wrap:anywhere}
.forum-search-hit mark,.forum-thread-title mark{padding:.02rem .10rem;border-radius:.18rem;color:#ffd9df;background:rgba(255,48,79,.16)}
.forum-search-empty{min-height:8rem!important}

/* 10 topics/page pagination */
.forum-pagination{min-height:3rem;display:flex;align-items:center;justify-content:center;gap:.45rem;margin:.65rem 0 .2rem;padding:.48rem;border-top:1px solid rgba(255,255,255,.045)}
.forum-pagination.hidden{display:none!important}
.forum-page-numbers{display:flex;align-items:center;gap:.28rem}
.forum-page-number,.forum-page-arrow{min-width:2.2rem;height:2.1rem;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.055);border-radius:.53rem;color:#77818a;background:rgba(255,255,255,.009);font-size:.61rem;font-weight:850;cursor:pointer;transition:.14s ease}
.forum-page-number:hover,.forum-page-arrow:hover:not(:disabled){color:#d7dce0;border-color:rgba(255,255,255,.10);background:rgba(255,255,255,.02)}
.forum-page-number.active{color:#ff8294;border-color:rgba(255,58,85,.15);background:rgba(255,48,79,.04);box-shadow:0 0 .65rem rgba(255,48,79,.04)}
.forum-page-arrow:disabled{opacity:.3;cursor:not-allowed}
.forum-page-dots{min-width:1.4rem;text-align:center;color:#58626b;font-size:.64rem}

/* Stable V27 toast: no legacy alert animations */
.alerts{pointer-events:none!important}
.x-toast-v27{
  width:100%;min-height:5.2rem;position:relative;display:grid;grid-template-columns:2.75rem minmax(0,1fr) 1.65rem;align-items:center;gap:.62rem;
  padding:.68rem .72rem .82rem;box-sizing:border-box;overflow:hidden;border:1px solid rgba(255,61,88,.15);border-radius:.86rem;
  opacity:0;transform:translateY(-.45rem) scale(.985);pointer-events:auto;
  color:#fff;background:radial-gradient(circle at 5% 30%,rgba(255,48,79,.13),transparent 28%),linear-gradient(155deg,rgba(19,18,24,.985),rgba(7,10,15,.99));
  box-shadow:0 1rem 2.5rem rgba(0,0,0,.34),0 0 1.4rem rgba(255,48,79,.05),inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter:blur(.8rem);-webkit-backdrop-filter:blur(.8rem);transition:opacity .24s ease,transform .24s ease
}
.x-toast-v27.visible{opacity:1;transform:none}
.x-toast-v27-accent{width:.18rem;position:absolute;left:0;top:.55rem;bottom:.55rem;border-radius:999px;background:linear-gradient(#ff5b72,#a91331)}
.x-toast-v27-icon{width:2.5rem;height:2.5rem;display:grid;place-items:center;border:1px solid rgba(255,58,85,.14);border-radius:.69rem;color:#ff768a;background:rgba(255,48,79,.035)}
.x-toast-v27-icon svg{width:1.1rem;height:1.1rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.x-toast-v27-copy{min-width:0}.x-toast-v27-copy small,.x-toast-v27-copy strong,.x-toast-v27-copy span{display:block}
.x-toast-v27-copy small{color:#835f67;font-size:.50rem;font-weight:900;letter-spacing:.09em}.x-toast-v27-copy strong{margin-top:.13rem;color:#f1eaec;font-size:.76rem;font-weight:850}.x-toast-v27-copy span{margin-top:.2rem;color:#949ca4;font-size:.65rem;line-height:1.42}
.x-toast-v27-close{width:1.6rem;height:1.6rem;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.05);border-radius:.43rem;color:#747d85;background:rgba(255,255,255,.01);cursor:pointer}
.x-toast-v27-timer{height:.12rem;position:absolute;left:.72rem;right:.72rem;bottom:.34rem;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.035)}
.x-toast-v27-timer span{width:100%;height:100%;display:block;border-radius:inherit;background:linear-gradient(90deg,#a71330,#ff526b);transform:scaleX(1);transform-origin:left center;transition-property:transform;transition-timing-function:linear}

/* Settings always below navbar + popover is closed in JS */
.settings-screen{align-items:flex-start!important;justify-content:center!important;padding-top:6.8rem!important;padding-bottom:1rem!important}
.settings-window{max-height:calc(100vh - 8rem)!important}
.settings-layout{height:min(36rem,calc(100vh - 14.5rem))!important}

/* Smaller centered admin windows */
.banlist-screen,.admin-reports-screen{display:grid!important;place-items:center!important;padding:1rem!important}
.banlist-window{width:min(44rem,92vw)!important;max-height:min(34rem,80vh)!important;margin:auto!important}
.banlist-header{min-height:4.25rem!important;padding:.62rem .72rem!important}.banlist-header h2{font-size:.92rem!important}.banlist-header p{font-size:.58rem!important}
.banlist-layout{height:min(28rem,calc(80vh - 5.2rem))!important;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr)!important}.banlist-create,.banlist-active{padding:.65rem!important}.banlist-user-result{min-height:2.8rem!important}.banlist-form textarea{min-height:4rem!important}
.admin-reports-window{width:min(48rem,92vw)!important;max-height:min(35rem,82vh)!important;margin:auto!important}
.admin-reports-header{min-height:4.2rem!important;padding:.62rem .72rem!important}.admin-reports-header h2{font-size:.91rem!important}.admin-reports-header p{font-size:.57rem!important}
.admin-reports-layout{height:min(29rem,calc(82vh - 5rem))!important;grid-template-columns:14rem minmax(0,1fr)!important}.admin-reports-list{padding:.5rem!important}.admin-report-row{min-height:3.35rem!important}.admin-report-detail{padding:.62rem!important}.admin-report-chat-stream{max-height:16rem!important}

/* Empty PM copy */
.messages-private-empty{min-height:4.6rem!important;padding:.8rem!important;color:#7d878f!important;font-size:.70rem!important;font-weight:700!important;line-height:1.45!important}

/* Multi-radio hub */
.radio-hub{position:fixed;left:.72rem;bottom:.72rem;z-index:180;display:flex;flex-direction:column;align-items:flex-start;gap:.38rem;max-width:calc(100vw - 1.44rem)}
.radio-station-picker{width:19rem;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.28rem;padding:.34rem;border:1px solid rgba(255,255,255,.065);border-radius:.72rem;background:rgba(7,11,16,.96);box-shadow:0 .8rem 2rem rgba(0,0,0,.30);backdrop-filter:blur(.7rem);-webkit-backdrop-filter:blur(.7rem)}
.radio-station-picker.hidden{display:none!important}
.radio-station-option{min-width:0;min-height:3.35rem;display:grid;grid-template-columns:1.65rem minmax(0,1fr);grid-template-rows:auto auto;align-items:center;gap:0 .38rem;padding:.38rem;border:1px solid transparent;border-radius:.58rem;color:#7a838b;background:transparent;text-align:left;cursor:pointer}
.radio-station-option>span{grid-row:1/3;width:1.6rem;height:1.6rem;display:grid;place-items:center;border-radius:.46rem;color:#8a6069;background:rgba(255,48,79,.025);font-size:.54rem;font-weight:900}.radio-station-option strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#929ba3;font-size:.57rem}.radio-station-option small{color:#59636c;font-size:.45rem}.radio-station-option:hover,.radio-station-option.active{border-color:rgba(255,58,85,.10);background:rgba(255,48,79,.022)}.radio-station-option.active strong{color:#ff8899}.radio-station-option.active>span{color:#ff7a8d;background:rgba(255,48,79,.05)}
.radio-console{display:flex;align-items:center;gap:.32rem}.radio-main-toggle{min-height:3.45rem;display:grid;grid-template-columns:2.2rem minmax(0,1fr) .5rem;align-items:center;gap:.48rem;padding:.42rem .55rem;border:1px solid rgba(255,255,255,.075);border-radius:.80rem;color:#a5adb4;background:radial-gradient(circle at 7% 35%,rgba(255,48,79,.045),transparent 34%),rgba(7,12,17,.95);box-shadow:0 .65rem 1.6rem rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.025);backdrop-filter:blur(.7rem);-webkit-backdrop-filter:blur(.7rem);cursor:pointer}
.radio-main-icon{width:2.05rem;height:2.05rem;display:grid;place-items:center;border:1px solid rgba(255,255,255,.055);border-radius:.58rem;color:#9b6570;background:rgba(255,48,79,.02)}.radio-main-icon svg{width:1.03rem;height:1.03rem;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}.radio-main-copy{display:flex;flex-direction:column;align-items:flex-start;min-width:7rem;line-height:1.05}.radio-main-copy small{color:#655c61;font-size:.44rem;font-weight:900;letter-spacing:.075em}.radio-main-copy strong{margin-top:.14rem;color:#aeb5bb;font-size:.60rem}.radio-main-copy b{margin-top:.15rem;color:#6e7780;font-size:.46rem;font-weight:800}.radio-live-dot{width:.43rem;height:.43rem;border-radius:50%;background:#666d72}.radio-hub.playing .radio-live-dot{background:#ff5068;box-shadow:0 0 .7rem rgba(255,48,79,.45);animation:radioLivePulse 1.5s ease-in-out infinite}.radio-hub.playing .radio-main-copy b{color:#ff788b}.radio-hub.playing .radio-main-toggle{border-color:rgba(255,58,85,.11)}
.radio-picker-toggle{width:2.4rem;height:3.45rem;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.065);border-radius:.7rem;color:#747d85;background:rgba(7,12,17,.94);font-size:.72rem;cursor:pointer}.radio-picker-toggle.active{color:#ff7b8f;border-color:rgba(255,58,85,.12);transform:rotate(180deg)}
.radio-volume{height:3.45rem;display:flex;align-items:center;gap:.32rem;padding:0 .46rem;border:1px solid rgba(255,255,255,.06);border-radius:.7rem;background:rgba(7,12,17,.94)}.radio-volume.hidden{display:none!important}.radio-volume button{width:1.6rem;height:1.6rem;display:grid;place-items:center;padding:0;border:0;color:#737d85;background:transparent;cursor:pointer}.radio-volume input{width:4.6rem;accent-color:#cf2343}

@media(max-width:760px){
  .settings-screen{padding-top:5.8rem!important}.settings-window{max-height:calc(100vh - 6.7rem)!important}.settings-layout{height:auto!important}
  .banlist-window,.admin-reports-window{width:min(94vw,35rem)!important;max-height:82vh!important}.banlist-layout,.admin-reports-layout{height:auto!important;max-height:calc(82vh - 4.8rem)!important;display:block!important;overflow:auto!important}.banlist-create{border-right:0!important;border-bottom:1px solid rgba(255,255,255,.05)!important}.admin-reports-list{max-height:12rem!important}
  .radio-station-picker{width:min(19rem,calc(100vw - 1.44rem));grid-template-columns:1fr}.radio-console{max-width:calc(100vw - 1.44rem)}.radio-volume{display:none!important}.radio-main-copy{min-width:6rem}.forum-search-mode{grid-template-columns:1.9rem minmax(0,1fr)}.forum-search-mode button{grid-column:1/-1;width:100%}.forum-page-number,.forum-page-arrow{min-width:2rem;height:2rem}
}


/* =========================================================
   V28 HOTFIX — RADIO REBUILD + ADMIN WINDOWS OFFSET
   ========================================================= */

/* Banlist + Reports: exactly a little lower under the navbar */
.banlist-window,
.admin-reports-window{
  transform:translateY(50px)!important;
}

@media(max-width:760px){
  .banlist-window,
  .admin-reports-window{
    transform:translateY(28px)!important;
    max-height:calc(100vh - 7.2rem)!important;
  }
}

/* Disable all previous V26/V27 radio layouts */
.radio-hub,
.radio-console,
.radio-station-picker{
  all:unset;
}

/* ---------------------------------------------------------
   V28 radio dock
   --------------------------------------------------------- */

.radio-v28{
  width:21.5rem;

  position:fixed;
  left:.72rem;
  bottom:.72rem;
  z-index:180;

  display:flex;
  flex-direction:column;
  gap:.34rem;

  box-sizing:border-box;

  font-family:inherit;
}

.radio-v28 audio{
  display:none;
}

.radio-v28-stations{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.25rem;

  padding:.28rem;

  border:1px solid rgba(255,255,255,.07);
  border-radius:.75rem;

  background:
    linear-gradient(180deg,rgba(10,15,21,.97),rgba(6,10,15,.97));

  box-shadow:
    0 .55rem 1.4rem rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.025);

  backdrop-filter:blur(.75rem);
  -webkit-backdrop-filter:blur(.75rem);
}

.radio-v28-station{
  min-width:0;
  min-height:2.65rem;

  display:grid;
  grid-template-columns:1.65rem minmax(0,1fr);
  align-items:center;
  gap:.40rem;

  padding:.30rem .38rem;

  border:1px solid transparent;
  border-radius:.58rem;

  color:#727d86;
  background:transparent;

  text-align:left;
  cursor:pointer;

  transition:
    border-color .15s ease,
    background .15s ease,
    transform .15s ease;
}

.radio-v28-station:hover{
  transform:translateY(-1px);

  border-color:rgba(255,255,255,.07);
  background:rgba(255,255,255,.014);
}

.radio-v28-station.active{
  border-color:rgba(255,58,85,.14);

  background:
    linear-gradient(180deg,rgba(255,48,79,.045),rgba(255,48,79,.016));

  box-shadow:inset 0 1px 0 rgba(255,255,255,.018);
}

.radio-v28-station-mark{
  width:1.58rem;
  height:1.58rem;

  display:grid;
  place-items:center;

  border:1px solid rgba(255,255,255,.055);
  border-radius:.48rem;

  color:#8a6570;
  background:rgba(255,48,79,.02);

  font-size:.56rem;
  font-weight:950;
  line-height:1;
}

.radio-v28-station-mark.e2{
  font-size:.48rem;
}

.radio-v28-station.active .radio-v28-station-mark{
  color:#ff7f91;

  border-color:rgba(255,58,85,.10);
  background:rgba(255,48,79,.045);
}

.radio-v28-station>span:last-child{
  min-width:0;

  display:flex;
  flex-direction:column;

  line-height:1.08;
}

.radio-v28-station strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  color:#9da6ae;

  font-size:.54rem;
  font-weight:850;
}

.radio-v28-station.active strong{
  color:#e0c4ca;
}

.radio-v28-station small{
  margin-top:.15rem;

  color:#56616a;

  font-size:.42rem;
  font-weight:750;
  letter-spacing:.045em;
}

/* Main player */
.radio-v28-player{
  min-height:4.15rem;

  display:grid;
  grid-template-columns:2.9rem minmax(0,1fr) 5.7rem;
  align-items:center;
  gap:.58rem;

  padding:.48rem .58rem;

  border:1px solid rgba(255,255,255,.075);
  border-radius:.86rem;

  background:
    radial-gradient(circle at 5% 40%,rgba(255,48,79,.06),transparent 30%),
    linear-gradient(155deg,rgba(10,15,21,.98),rgba(5,9,14,.98));

  box-shadow:
    0 .8rem 1.9rem rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.028);

  backdrop-filter:blur(.8rem);
  -webkit-backdrop-filter:blur(.8rem);
}

.radio-v28-play{
  width:2.75rem;
  height:2.75rem;

  display:grid;
  place-items:center;

  padding:0;

  border:1px solid rgba(255,58,85,.16);
  border-radius:.76rem;

  color:#ff7488;
  background:
    radial-gradient(circle at 50% 35%,rgba(255,76,101,.12),transparent 62%),
    rgba(255,48,79,.035);

  box-shadow:
    0 .3rem .8rem rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.025);

  cursor:pointer;
  transition:.15s ease;
}

.radio-v28-play:hover{
  transform:translateY(-1px);

  border-color:rgba(255,58,85,.26);
  background:rgba(255,48,79,.065);
}

.radio-v28-play svg{
  width:1.15rem;
  height:1.15rem;

  fill:currentColor;
  stroke:none;
}

.radio-pause-icon{
  display:none;
}

.radio-v28.playing .radio-play-icon{
  display:none;
}

.radio-v28.playing .radio-pause-icon{
  display:block;
}

.radio-v28-now{
  min-width:0;

  display:flex;
  flex-direction:column;

  line-height:1.06;
}

.radio-v28-title-row{
  display:flex;
  align-items:center;
  gap:.30rem;
}

.radio-v28-title-row small{
  color:#795e67;

  font-size:.45rem;
  font-weight:900;
  letter-spacing:.085em;
}

.radio-v28-live-dot{
  width:.42rem;
  height:.42rem;

  border-radius:50%;

  background:#665e61;
}

.radio-v28.playing .radio-v28-live-dot{
  background:#ff526b;

  box-shadow:0 0 .72rem rgba(255,48,79,.50);

  animation:radioV28Pulse 1.45s ease-in-out infinite;
}

.radio-v28.connecting .radio-v28-live-dot{
  background:#b87682;
}

.radio-v28-now>strong{
  margin-top:.24rem;

  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  color:#c5cbd0;

  font-size:.68rem;
  font-weight:850;
}

.radio-v28-now>span{
  margin-top:.20rem;

  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  color:#6f7881;

  font-size:.49rem;
  font-weight:800;
}

.radio-v28.playing .radio-v28-now>span{
  color:#d26d7d;
}

/* Volume */
.radio-v28-volume{
  display:flex;
  align-items:center;
  gap:.34rem;
}

.radio-v28-volume button{
  width:1.75rem;
  height:1.75rem;

  flex:0 0 1.75rem;

  display:grid;
  place-items:center;

  padding:0;

  border:1px solid rgba(255,255,255,.05);
  border-radius:.48rem;

  color:#707a83;
  background:rgba(255,255,255,.008);

  cursor:pointer;
}

.radio-v28-volume button:hover{
  color:#bcc3c9;
  background:rgba(255,255,255,.02);
}

.radio-v28-volume button svg{
  width:.9rem;
  height:.9rem;

  fill:none;
  stroke:currentColor;
  stroke-width:1.55;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.radio-v28.muted .radio-v28-volume button{
  color:#ff7589;
  border-color:rgba(255,58,85,.10);
}

.radio-v28-volume input{
  width:3.45rem;
  min-width:0;

  accent-color:#d52a49;

  cursor:pointer;
}

@keyframes radioV28Pulse{
  0%,100%{opacity:.58}
  50%{opacity:1}
}

@media(max-width:620px){
  .radio-v28{
    width:min(20rem,calc(100vw - 1.44rem));
  }

  .radio-v28-station{
    grid-template-columns:1.45rem minmax(0,1fr);
    gap:.28rem;
    padding:.26rem;
  }

  .radio-v28-station-mark{
    width:1.4rem;
    height:1.4rem;
  }

  .radio-v28-station small{
    display:none;
  }

  .radio-v28-player{
    grid-template-columns:2.7rem minmax(0,1fr);
  }

  .radio-v28-volume{
    display:none;
  }
}


/* =========================================================
   V29 — FORUM COMMUNITY + MICRO SHOP + RADIO COMPACT
   ========================================================= */

/* ---------------------------------------------------------
   Bottom nav: 4 tabs
   --------------------------------------------------------- */

.portal-bottom-tabs-three,
.portal-bottom-tabs-four{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}

.mini-shop-bottom-tab>span{
  color:#d99b47!important;
}

/* ---------------------------------------------------------
   Forum category admin controls
   --------------------------------------------------------- */

.forum-category-admin-heading>div{
  display:flex;
  align-items:center;
  gap:.35rem;
}

.forum-category-add{
  width:1.65rem;
  height:1.65rem;

  display:grid;
  place-items:center;

  padding:0;

  border:1px solid rgba(255,58,85,.13);
  border-radius:.46rem;

  color:#ff778b;
  background:rgba(255,48,79,.025);

  font-size:1rem;
  line-height:1;

  cursor:pointer;
  transition:.15s ease;
}

.forum-category-add:hover{
  transform:translateY(-1px);
  border-color:rgba(255,58,85,.22);
  background:rgba(255,48,79,.05);
}

.forum-category-row{
  position:relative;

  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:.25rem;

  margin-bottom:.28rem;
}

.forum-category-row .forum-category{
  margin:0!important;
}

.forum-category-delete{
  width:1.72rem;
  height:1.72rem;

  display:grid;
  place-items:center;

  padding:0;

  border:1px solid rgba(255,58,85,.07);
  border-radius:.45rem;

  color:#79545c;
  background:rgba(255,48,79,.008);

  opacity:.30;

  cursor:pointer;
  transition:.14s ease;
}

.forum-category-row:hover .forum-category-delete,
.forum-category-delete:hover,
.forum-category-delete.confirming{
  opacity:1;
}

.forum-category-delete:hover,
.forum-category-delete.confirming{
  color:#ff7a8e;
  border-color:rgba(255,58,85,.16);
  background:rgba(255,48,79,.035);
}

.forum-category-delete svg{
  width:.78rem;
  height:.78rem;

  fill:none;
  stroke:currentColor;
  stroke-width:1.55;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* category create dialog */
.forum-category-dialog{
  position:fixed;
  inset:0;
  z-index:335;

  display:grid;
  place-items:center;

  padding:5.5rem 1rem 1rem;
}

.forum-category-dialog.hidden{
  display:none!important;
}

.forum-category-dialog-backdrop{
  position:absolute;
  inset:0;

  background:rgba(1,4,8,.78);

  backdrop-filter:blur(.55rem);
  -webkit-backdrop-filter:blur(.55rem);
}

.forum-category-dialog>section{
  width:min(27rem,94vw);

  position:relative;
  z-index:1;

  padding:.95rem;

  border:1px solid rgba(255,255,255,.075);
  border-radius:.9rem;

  background:
    radial-gradient(circle at 90% -5%,rgba(255,48,79,.06),transparent 35%),
    linear-gradient(155deg,#11171e,#060a0f);

  box-shadow:0 1.5rem 4rem rgba(0,0,0,.48);
}

.forum-category-dialog>section>button{
  width:1.9rem;
  height:1.9rem;

  position:absolute;
  right:.65rem;
  top:.65rem;

  display:grid;
  place-items:center;

  padding:0;

  border:1px solid rgba(255,255,255,.06);
  border-radius:.48rem;

  color:#7a848d;
  background:rgba(255,255,255,.012);

  cursor:pointer;
}

.forum-category-dialog>section>span{
  color:#795e67;

  font-size:.53rem;
  font-weight:900;
  letter-spacing:.085em;
}

.forum-category-dialog h3{
  margin:.2rem 2.3rem 0 0;

  color:#e9edef;

  font-size:.95rem;
}

.forum-category-dialog p{
  margin:.24rem 0 .7rem;

  color:#68727b;

  font-size:.62rem;
}

#forumCategoryForm{
  display:grid;
  gap:.48rem;
}

#forumCategoryForm label>span{
  display:block;

  margin-bottom:.25rem;

  color:#69737c;

  font-size:.54rem;
  font-weight:850;
  letter-spacing:.06em;
}

#forumCategoryForm input{
  width:100%;
  min-height:2.55rem;

  box-sizing:border-box;

  padding:0 .58rem;

  border:1px solid rgba(255,255,255,.065);
  border-radius:.58rem;

  color:#d8dde1;
  background:#080d13;

  font:inherit;
  font-size:.68rem;

  outline:0;
}

#forumCategoryForm input:focus{
  border-color:rgba(255,58,85,.16);
}

.forum-category-icon-field{
  display:grid;
  grid-template-columns:5rem minmax(0,1fr);
  align-items:end;
  gap:.48rem;
}

.forum-category-icon-field>span{
  grid-column:1/-1;
}

.forum-category-icon-field input{
  text-align:center;
}

.forum-category-icon-field small{
  align-self:center;

  color:#606a73;

  font-size:.54rem;
}

#forumCategoryForm>button{
  min-height:2.6rem;

  margin-top:.16rem;

  border:1px solid rgba(255,58,85,.17);
  border-radius:.6rem;

  color:#fff;
  background:linear-gradient(180deg,#dc2c4a,#a51530);

  font-size:.62rem;
  font-weight:900;
  letter-spacing:.04em;

  cursor:pointer;
}

/* ---------------------------------------------------------
   WHO IS ONLINE
   --------------------------------------------------------- */

.forum-online-v29{
  margin:.72rem .78rem .85rem;
  padding:.72rem;

  border:1px solid rgba(255,255,255,.05);
  border-radius:.76rem;

  background:
    radial-gradient(circle at 92% 20%,rgba(255,48,79,.025),transparent 30%),
    rgba(255,255,255,.006);
}

.forum-online-v29>header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.7rem;

  padding-bottom:.52rem;

  border-bottom:1px solid rgba(255,255,255,.045);
}

.forum-online-v29>header>div{
  display:flex;
  align-items:center;
  gap:.4rem;
}

.forum-online-v29>header strong{
  color:#9ca5ad;

  font-size:.61rem;
  letter-spacing:.05em;
}

.forum-online-v29>header small{
  color:#7f6068;

  font-size:.50rem;
  font-weight:850;
  letter-spacing:.065em;
}

.forum-online-dot{
  width:.46rem;
  height:.46rem;

  border-radius:50%;

  background:#59d47d;

  box-shadow:0 0 .65rem rgba(71,212,116,.38);
}

.forum-online-body{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:.8rem;

  padding-top:.6rem;
}

.forum-online-copy>span{
  display:block;

  margin-bottom:.42rem;

  color:#646f78;

  font-size:.57rem;
}

#forumOnlineUsers{
  display:flex;
  flex-wrap:wrap;
  gap:.38rem;
}

#forumOnlineUsers>small{
  color:#68727b;

  font-size:.60rem;
}

.forum-online-user{
  min-height:2.25rem;

  display:inline-grid;
  grid-template-columns:1.8rem auto auto;
  align-items:center;
  gap:.34rem;

  padding:.24rem .42rem .24rem .25rem;

  border:1px solid rgba(255,255,255,.045);
  border-radius:.58rem;

  background:rgba(255,255,255,.008);
}

.forum-online-user.admin{
  border-color:rgba(255,58,85,.09);
  background:rgba(255,48,79,.014);
}

.forum-online-avatar{
  width:1.75rem;
  height:1.75rem;

  position:relative;

  display:block;

  padding:0;

  border:0;
  border-radius:.48rem;

  background:transparent;

  cursor:pointer;
}

.forum-online-avatar img{
  width:100%;
  height:100%;

  object-fit:cover;

  border-radius:inherit;
}

.forum-online-avatar i{
  width:.42rem;
  height:.42rem;

  position:absolute;
  right:-.08rem;
  bottom:-.04rem;

  border:.10rem solid #0b1016;
  border-radius:50%;

  background:#58d57d;
}

.forum-online-user strong{
  color:#b2bac1;

  font-size:.60rem;
}

.forum-online-user>b{
  color:#ff7a8e;

  font-size:.47rem;
  letter-spacing:.045em;
}

.forum-online-user>small{
  color:#626d76;

  font-size:.50rem;
}

.forum-online-visitors{
  min-width:5.5rem;

  text-align:right;
}

.forum-online-visitors strong,
.forum-online-visitors span,
.forum-online-visitors small{
  display:block;
}

.forum-online-visitors strong{
  color:#c4cbd0;

  font-size:1rem;
}

.forum-online-visitors span{
  color:#6c767f;

  font-size:.47rem;
  font-weight:850;
  letter-spacing:.07em;
}

.forum-online-visitors small{
  margin-top:.15rem;

  color:#626c75;

  font-size:.52rem;
}

/* ---------------------------------------------------------
   New topic dialog centered below navbar
   --------------------------------------------------------- */

.forum-new-thread-dialog{
  position:fixed!important;
  inset:0!important;
  z-index:325!important;

  display:grid!important;
  place-items:center!important;

  padding:5.5rem 1rem 1rem!important;

  background:rgba(1,4,8,.62)!important;

  backdrop-filter:blur(.35rem);
  -webkit-backdrop-filter:blur(.35rem);
}

.forum-new-thread-dialog.hidden{
  display:none!important;
}

.forum-new-thread-dialog .workspace-dialog-card{
  width:min(35rem,94vw)!important;
  max-height:calc(100vh - 7rem)!important;

  overflow:auto!important;

  margin:0!important;
}

/* ---------------------------------------------------------
   MINI SHOP
   --------------------------------------------------------- */

.mini-shop-v29{
  width:min(58rem,95vw);

  margin:0 auto;

  overflow:hidden;

  border-radius:1rem!important;
}

.mini-shop-v29-head{
  min-height:5.4rem;

  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:.8rem;

  padding:.78rem .9rem;

  border-bottom:1px solid rgba(255,255,255,.055);

  background:
    radial-gradient(circle at 88% -10%,rgba(220,164,74,.05),transparent 32%);
}

.mini-shop-back{
  min-height:2.2rem;

  padding:0 .58rem;

  border:1px solid rgba(255,255,255,.055);
  border-radius:.52rem;

  color:#77818a;
  background:rgba(255,255,255,.012);

  font-size:.56rem;
  font-weight:800;

  cursor:pointer;
}

.mini-shop-v29-head>div:nth-child(2)>span{
  color:#806848;

  font-size:.52rem;
  font-weight:900;
  letter-spacing:.09em;
}

.mini-shop-v29-head h2{
  margin:.16rem 0 0;

  color:#ebeef0;

  font-size:1.05rem;
}

.mini-shop-v29-head p{
  margin:.18rem 0 0;

  color:#68727b;

  font-size:.62rem;
}

.mini-shop-wallet{
  min-width:7.5rem;

  padding:.48rem .58rem;

  border:1px solid rgba(214,164,75,.08);
  border-radius:.6rem;

  background:rgba(213,156,61,.012);

  text-align:right;
}

.mini-shop-wallet span,
.mini-shop-wallet strong{
  display:block;
}

.mini-shop-wallet span{
  color:#716652;

  font-size:.48rem;
  font-weight:850;
  letter-spacing:.06em;
}

.mini-shop-wallet strong{
  margin-top:.16rem;

  color:#d5ae69;

  font-size:.68rem;
}

.mini-shop-stage{
  display:grid;
  grid-template-columns:minmax(0,1fr) 13rem;
  gap:.72rem;

  padding:.78rem;
}

.mini-shop-product{
  min-height:18rem;

  display:grid;
  grid-template-columns:13rem minmax(0,1fr);

  overflow:hidden;

  border:1px solid rgba(217,169,85,.08);
  border-radius:.82rem;

  background:
    radial-gradient(circle at 14% 45%,rgba(220,167,73,.055),transparent 34%),
    rgba(255,255,255,.007);
}

.mini-shop-product-art{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  border-right:1px solid rgba(255,255,255,.045);

  background:
    radial-gradient(circle at 50% 45%,rgba(219,167,76,.06),transparent 45%);
}

.evip-orb{
  width:7.4rem;
  height:7.4rem;

  position:relative;

  display:grid;
  place-items:center;

  border:1px solid rgba(225,177,91,.12);
  border-radius:50%;

  color:#d6aa61;
  background:
    radial-gradient(circle at 50% 35%,rgba(231,185,98,.07),rgba(81,59,29,.018) 62%,transparent);

  box-shadow:
    0 0 2rem rgba(215,161,67,.06),
    inset 0 0 1.5rem rgba(255,214,133,.025);
}

.evip-orb svg{
  width:3.6rem;
  height:3.6rem;

  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linejoin:round;
}

.evip-orb>span{
  position:absolute;
  bottom:1rem;

  color:#a7834a;

  font-size:.52rem;
  font-weight:900;
  letter-spacing:.08em;
}

.mini-shop-product-art>b{
  margin-top:.55rem;

  color:#e0bb78;

  font-family:Rajdhani,Inter,sans-serif;
  font-size:1.25rem;
  letter-spacing:.13em;
}

.mini-shop-product-copy{
  padding:.82rem;
}

.mini-shop-eyebrow{
  color:#78684c;

  font-size:.51rem;
  font-weight:900;
  letter-spacing:.085em;
}

.mini-shop-product-copy h3{
  margin:.22rem 0 0;

  color:#e4e7e9;

  font-size:1rem;
}

.mini-shop-product-copy>p{
  margin:.35rem 0 0;

  color:#818b94;

  font-size:.66rem;
  line-height:1.52;
}

.mini-shop-benefits{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.36rem;

  margin-top:.7rem;
}

.mini-shop-benefits>div{
  min-height:2.25rem;

  display:grid;
  grid-template-columns:1.35rem minmax(0,1fr);
  align-items:center;
  gap:.35rem;

  padding:.35rem .42rem;

  border:1px solid rgba(255,255,255,.04);
  border-radius:.52rem;

  background:rgba(255,255,255,.006);
}

.mini-shop-benefits span{
  width:1.2rem;
  height:1.2rem;

  display:grid;
  place-items:center;

  border-radius:.34rem;

  color:#cba45f;
  background:rgba(217,168,83,.025);

  font-size:.52rem;
}

.mini-shop-benefits strong{
  color:#929ba3;

  font-size:.55rem;
  font-weight:750;
}

.mini-shop-purchase{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:.6rem;

  margin-top:.8rem;
  padding-top:.65rem;

  border-top:1px solid rgba(255,255,255,.045);
}

.mini-shop-price small,
.mini-shop-price strong{
  display:block;
}

.mini-shop-price small{
  color:#667079;

  font-size:.50rem;
  font-weight:850;
  letter-spacing:.07em;
}

.mini-shop-price strong{
  margin-top:.15rem;

  color:#dfb976;

  font-size:.80rem;
}

.mini-shop-price strong>span{
  width:1.28rem;
  height:1.28rem;

  display:inline-grid;
  place-items:center;

  margin-right:.22rem;

  border:1px solid rgba(219,169,83,.10);
  border-radius:.38rem;

  background:rgba(217,164,75,.025);

  font-size:.55rem;
}

.mini-shop-buy{
  min-height:2.65rem!important;

  padding:0 .8rem!important;

  border:1px solid rgba(221,170,78,.15)!important;
  border-radius:.58rem!important;

  color:#f1dfbf!important;
  background:
    linear-gradient(180deg,rgba(177,121,42,.28),rgba(109,72,26,.22))!important;

  font-size:.60rem!important;
  font-weight:900!important;

  cursor:pointer!important;
}

.mini-shop-info{
  padding:.7rem;

  border:1px solid rgba(255,255,255,.045);
  border-radius:.72rem;

  background:rgba(255,255,255,.006);
}

.mini-shop-info>span{
  color:#716650;

  font-size:.50rem;
  font-weight:900;
  letter-spacing:.075em;
}

.mini-shop-info>strong{
  display:block;

  margin-top:.2rem;

  color:#c2a46d;

  font-size:.72rem;
}

.mini-shop-info>p{
  margin:.4rem 0 0;

  color:#6f7982;

  font-size:.59rem;
  line-height:1.52;
}

.mini-shop-info>div{
  margin-top:.75rem;
  padding:.55rem;

  border:1px solid rgba(217,166,79,.06);
  border-radius:.54rem;

  background:rgba(216,164,75,.012);
}

.mini-shop-info small,
.mini-shop-info b{
  display:block;
}

.mini-shop-info small{
  color:#68604f;

  font-size:.48rem;
}

.mini-shop-info b{
  margin-top:.12rem;

  color:#d1ad6b;

  font-size:.66rem;
}

/* ---------------------------------------------------------
   Mini footer
   --------------------------------------------------------- */

.portal-mini-footer{
  width:min(74rem,95vw);

  margin:.6rem auto 6.2rem;
  padding:.58rem .7rem;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.8rem;

  border-top:1px solid rgba(255,255,255,.04);

  color:#59636c;

  font-size:.52rem;
  line-height:1.4;
}

.portal-mini-footer p{
  margin:0;
}

.portal-mini-footer>span{
  flex:0 0 auto;

  color:#626c75;
}

.portal-mini-footer strong{
  color:#8b7379;
}

/* ---------------------------------------------------------
   RADIO V29 — one compact selector + minimize
   --------------------------------------------------------- */

.radio-v29{
  width:15.3rem;

  position:fixed;
  left:.72rem;
  bottom:.72rem;
  z-index:180;

  font-family:inherit;
}

.radio-v29 audio{
  display:none;
}

.radio-v29-shell{
  position:relative;

  border:1px solid rgba(255,255,255,.075);
  border-radius:.82rem;

  background:
    radial-gradient(circle at 7% 35%,rgba(255,48,79,.055),transparent 30%),
    linear-gradient(155deg,rgba(10,15,21,.98),rgba(5,9,14,.98));

  box-shadow:
    0 .7rem 1.8rem rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.026);

  backdrop-filter:blur(.75rem);
  -webkit-backdrop-filter:blur(.75rem);
}

.radio-v29-main{
  min-height:3.7rem;

  display:grid;
  grid-template-columns:2.55rem minmax(0,1fr) 1.55rem;
  align-items:center;
  gap:.4rem;

  padding:.4rem;
}

.radio-v29-play{
  width:2.45rem;
  height:2.45rem;

  display:grid;
  place-items:center;

  padding:0;

  border:1px solid rgba(255,58,85,.15);
  border-radius:.68rem;

  color:#ff7488;
  background:rgba(255,48,79,.035);

  cursor:pointer;
}

.radio-v29-play svg{
  width:1.02rem;
  height:1.02rem;

  fill:currentColor;
}

.radio-pause-icon{
  display:none;
}

.radio-v29.playing .radio-play-icon{
  display:none;
}

.radio-v29.playing .radio-pause-icon{
  display:block;
}

.radio-v29-station-select{
  min-width:0;
  min-height:2.65rem;

  display:grid;
  grid-template-columns:1.55rem minmax(0,1fr) .7rem;
  align-items:center;
  gap:.35rem;

  padding:.3rem .34rem;

  border:1px solid transparent;
  border-radius:.58rem;

  color:inherit;
  background:transparent;

  text-align:left;

  cursor:pointer;
}

.radio-v29-station-select:hover,
.radio-v29-station-select[aria-expanded="true"]{
  border-color:rgba(255,255,255,.055);
  background:rgba(255,255,255,.012);
}

.radio-v29-mark{
  width:1.48rem;
  height:1.48rem;

  display:grid;
  place-items:center;

  border:1px solid rgba(255,58,85,.08);
  border-radius:.44rem;

  color:#b76e7b;
  background:rgba(255,48,79,.02);

  font-size:.50rem;
  font-weight:950;
}

.radio-v29-station-select>span:nth-child(2){
  min-width:0;

  display:flex;
  flex-direction:column;
}

.radio-v29-station-select small{
  color:#765d65;

  font-size:.40rem;
  font-weight:900;
  letter-spacing:.075em;
}

.radio-v29-station-select strong{
  margin-top:.08rem;

  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  color:#b9c0c6;

  font-size:.56rem;
}

.radio-v29-station-select b{
  margin-top:.09rem;

  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  color:#68727b;

  font-size:.42rem;
  font-weight:800;
}

.radio-v29.playing .radio-v29-station-select b{
  color:#d16979;
}

.radio-v29-station-select>i{
  color:#69737c;

  font-size:.58rem;
  font-style:normal;
}

.radio-v29-minimize{
  width:1.45rem;
  height:1.45rem;

  display:grid;
  place-items:center;

  padding:0;

  border:1px solid rgba(255,255,255,.05);
  border-radius:.42rem;

  color:#69737c;
  background:rgba(255,255,255,.008);

  cursor:pointer;
}

.radio-v29-volume{
  height:2rem;

  display:flex;
  align-items:center;
  gap:.38rem;

  padding:0 .48rem;

  border-top:1px solid rgba(255,255,255,.04);
}

.radio-v29-volume button{
  width:1.55rem;
  height:1.55rem;

  display:grid;
  place-items:center;

  padding:0;

  border:0;

  color:#6f7982;
  background:transparent;

  cursor:pointer;
}

.radio-v29-volume button svg{
  width:.82rem;
  height:.82rem;

  fill:none;
  stroke:currentColor;
  stroke-width:1.55;
  stroke-linecap:round;
}

.radio-v29-volume input{
  width:100%;

  accent-color:#d22a49;
}

.radio-v29-station-menu{
  width:calc(100% - .8rem);

  position:absolute;
  left:.4rem;
  bottom:3.96rem;
  z-index:3;

  display:flex;
  flex-direction:column;
  gap:.23rem;

  padding:.28rem;

  border:1px solid rgba(255,255,255,.075);
  border-radius:.68rem;

  background:rgba(7,11,16,.985);

  box-shadow:0 .75rem 1.8rem rgba(0,0,0,.35);

  backdrop-filter:blur(.7rem);
  -webkit-backdrop-filter:blur(.7rem);
}

.radio-v29-station-menu.hidden{
  display:none!important;
}

.radio-v29-station-menu button{
  min-height:2.3rem;

  display:grid;
  grid-template-columns:1.6rem minmax(0,1fr) auto;
  align-items:center;
  gap:.35rem;

  padding:.28rem .35rem;

  border:1px solid transparent;
  border-radius:.5rem;

  color:inherit;
  background:transparent;

  text-align:left;

  cursor:pointer;
}

.radio-v29-station-menu button:hover,
.radio-v29-station-menu button.active{
  border-color:rgba(255,58,85,.08);
  background:rgba(255,48,79,.018);
}

.radio-v29-station-menu button>span{
  width:1.48rem;
  height:1.48rem;

  display:grid;
  place-items:center;

  border-radius:.42rem;

  color:#9c6670;
  background:rgba(255,48,79,.022);

  font-size:.46rem;
  font-weight:900;
}

.radio-v29-station-menu strong{
  color:#aeb6bd;

  font-size:.54rem;
}

.radio-v29-station-menu small{
  color:#5e6871;

  font-size:.43rem;
}

.radio-v29-mini{
  width:3rem;
  height:3rem;

  position:relative;

  display:grid;
  place-items:center;

  padding:0;

  border:1px solid rgba(255,58,85,.11);
  border-radius:.78rem;

  color:#b66876;
  background:
    radial-gradient(circle at 50% 35%,rgba(255,48,79,.07),transparent 62%),
    rgba(8,13,18,.96);

  box-shadow:0 .6rem 1.5rem rgba(0,0,0,.28);

  cursor:pointer;
}

.radio-v29-mini svg{
  width:1.15rem;
  height:1.15rem;

  fill:none;
  stroke:currentColor;
  stroke-width:1.55;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.radio-v29-mini>span{
  width:.46rem;
  height:.46rem;

  position:absolute;
  right:.35rem;
  bottom:.35rem;

  border:.09rem solid #0b1016;
  border-radius:50%;

  background:#686e70;
}

.radio-v29.playing .radio-v29-mini>span{
  background:#ff506a;
  box-shadow:0 0 .6rem rgba(255,48,79,.45);
}

.radio-v29.minimized .radio-v29-shell{
  display:none!important;
}

.radio-v29.minimized .radio-v29-mini{
  display:grid!important;
}

/* ---------------------------------------------------------
   Responsive
   --------------------------------------------------------- */

@media(max-width:850px){
  .mini-shop-stage{
    grid-template-columns:1fr;
  }

  .mini-shop-info{
    display:none;
  }

  .mini-shop-product{
    grid-template-columns:10rem minmax(0,1fr);
  }

  .portal-mini-footer{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media(max-width:650px){
  .portal-bottom-tabs-three,
  .portal-bottom-tabs-four{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .forum-online-body{
    align-items:flex-start;
    grid-template-columns:1fr;
  }

  .forum-online-visitors{
    text-align:left;
  }

  .mini-shop-v29-head{
    grid-template-columns:auto minmax(0,1fr);
  }

  .mini-shop-wallet{
    grid-column:1/-1;

    text-align:left;
  }

  .mini-shop-product{
    grid-template-columns:1fr;
  }

  .mini-shop-product-art{
    min-height:10rem;

    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.045);
  }

  .mini-shop-benefits{
    grid-template-columns:1fr;
  }

  .mini-shop-purchase{
    align-items:stretch;
    flex-direction:column;
  }

  .radio-v29{
    width:13.8rem;
  }
}


/* =========================================================
   V30 — MINI SHOP 2.0 / EVIP TIMER / ZOMBIE CLASS / RADIO
   ========================================================= */

/* ---------------------------------------------------------
   EVIP portal status
   --------------------------------------------------------- */

#topbarVipBox.evip-mode{
  border-color:rgba(209,156,55,.12)!important;
  background:rgba(201,144,45,.018)!important;
}

#topbarVipBox.evip-mode strong{
  color:#e0b35f!important;
}

/* ---------------------------------------------------------
   MINI SHOP V30
   --------------------------------------------------------- */

.mini-shop-v30{
  width:min(64rem,96vw);

  margin:0 auto;

  overflow:hidden;

  border-radius:1rem!important;

  background:
    radial-gradient(circle at 88% -8%,rgba(208,151,50,.045),transparent 29%),
    rgba(6,10,15,.94)!important;
}

.mini-shop-v30-head{
  min-height:5.4rem;

  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:.85rem;

  padding:.76rem .88rem;

  border-bottom:1px solid rgba(255,255,255,.052);
}

.mini-shop-title>span{
  color:#80684b;

  font-size:.50rem;
  font-weight:900;
  letter-spacing:.09em;
}

.mini-shop-title h2{
  margin:.14rem 0 0;

  color:#eef0f2;

  font-size:1.06rem;
}

.mini-shop-title p{
  margin:.16rem 0 0;

  color:#69737c;

  font-size:.60rem;
}

.mini-shop-active-banner{
  min-height:4.25rem;

  display:grid;
  grid-template-columns:2.7rem minmax(0,1fr) auto;
  align-items:center;
  gap:.65rem;

  margin:.65rem .75rem 0;
  padding:.55rem .68rem;

  border:1px solid rgba(88,207,119,.13);
  border-radius:.72rem;

  background:
    radial-gradient(circle at 6% 50%,rgba(77,213,115,.08),transparent 27%),
    rgba(70,188,102,.018);
}

.mini-shop-active-icon{
  width:2.45rem;
  height:2.45rem;

  display:grid;
  place-items:center;

  border:1px solid rgba(97,218,130,.11);
  border-radius:.62rem;

  color:#74d994;
  background:rgba(71,196,106,.025);
}

.mini-shop-active-icon svg{
  width:1.3rem;
  height:1.3rem;

  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linejoin:round;
}

.mini-shop-active-banner>div:nth-child(2)>span,
.mini-shop-active-banner>div:nth-child(2)>strong,
.mini-shop-active-banner>div:nth-child(2)>small{
  display:block;
}

.mini-shop-active-banner>div:nth-child(2)>span{
  color:#63816b;

  font-size:.48rem;
  font-weight:900;
  letter-spacing:.08em;
}

.mini-shop-active-banner>div:nth-child(2)>strong{
  margin-top:.10rem;

  color:#a8d8b5;

  font-size:.70rem;
}

.mini-shop-active-banner>div:nth-child(2)>small{
  margin-top:.13rem;

  color:#73877a;

  font-size:.54rem;
}

.mini-shop-active-banner>div:nth-child(2)>small b{
  color:#73d892;
}

.mini-shop-active-live{
  min-height:1.45rem;

  display:inline-flex;
  align-items:center;

  padding:0 .4rem;

  border:1px solid rgba(93,210,124,.10);
  border-radius:.38rem;

  color:#73d892;
  background:rgba(70,191,103,.022);

  font-size:.48rem;
  font-weight:900;
  letter-spacing:.04em;
}

.mini-shop-filterbar{
  display:flex;
  align-items:center;
  gap:.30rem;

  margin:.58rem .75rem 0;
  padding:.27rem;

  border:1px solid rgba(255,255,255,.05);
  border-radius:.64rem;

  background:rgba(255,255,255,.006);
}

.mini-shop-filterbar .shop-filter{
  min-height:2.1rem;

  flex:0 1 auto;

  padding:0 .62rem;

  border:1px solid transparent;
  border-radius:.48rem;

  color:#747e87;
  background:transparent;

  font-size:.56rem;
  font-weight:850;

  cursor:pointer;
}

.mini-shop-filterbar .shop-filter:hover{
  color:#aeb6bd;

  background:rgba(255,255,255,.012);
}

.mini-shop-filterbar .shop-filter.active{
  color:#f0d4d9;

  border-color:rgba(255,58,85,.11);

  background:
    linear-gradient(180deg,rgba(210,37,68,.18),rgba(147,20,44,.11));
}

.mini-shop-v30-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 15.5rem;
  gap:.7rem;

  padding:.7rem .75rem .78rem;
}

.mini-shop-products{
  min-width:0;

  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.62rem;
}

.mini-shop-card{
  min-width:0;

  display:flex;
  flex-direction:column;

  overflow:hidden;

  border:1px solid rgba(255,255,255,.05);
  border-radius:.76rem;

  background:
    linear-gradient(155deg,rgba(255,255,255,.009),rgba(255,255,255,.003));

  transition:.15s ease;
}

.mini-shop-card:hover{
  transform:translateY(-1px);

  border-color:rgba(255,255,255,.075);
}

.mini-shop-card.hidden-product{
  display:none!important;
}

.mini-shop-card.owned{
  border-color:rgba(115,82,156,.12);
}

.mini-shop-card-media{
  height:10.4rem;

  position:relative;

  display:grid;
  place-items:center;

  overflow:hidden;

  border-bottom:1px solid rgba(255,255,255,.045);
}

.evip-media{
  background:
    radial-gradient(circle at 50% 48%,rgba(212,164,77,.105),rgba(52,37,19,.02) 55%,transparent 74%);
}

.evip-orb-v30{
  width:6.8rem;
  height:6.8rem;

  position:relative;

  display:grid;
  place-items:center;

  border:1px solid rgba(222,174,88,.12);
  border-radius:50%;

  color:#d9ac60;
  background:
    radial-gradient(circle at 50% 35%,rgba(235,189,101,.07),transparent 66%);

  box-shadow:
    0 0 2rem rgba(218,163,64,.06),
    inset 0 0 1.3rem rgba(255,219,148,.025);
}

.evip-orb-v30 svg{
  width:3.4rem;
  height:3.4rem;

  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linejoin:round;
}

.evip-orb-v30 span{
  position:absolute;
  bottom:.85rem;

  color:#a7844a;

  font-size:.48rem;
  font-weight:900;
  letter-spacing:.08em;
}

.evip-media>b{
  position:absolute;
  bottom:.58rem;

  color:#d8b270;

  font-size:.70rem;
  letter-spacing:.16em;
}

.zombie-media{
  background:
    radial-gradient(circle at 50% 38%,rgba(111,52,139,.08),transparent 55%),
    #080a0f;
}

.zombie-media img{
  width:100%;
  height:100%;

  object-fit:cover;
  object-position:center 18%;

  filter:saturate(.85) contrast(1.08) brightness(.82);
}

.zombie-media:after{
  content:"";

  position:absolute;
  inset:0;

  background:
    linear-gradient(180deg,transparent 45%,rgba(5,7,11,.72) 100%);

  pointer-events:none;
}

.zombie-permanent-badge{
  position:absolute;
  right:.55rem;
  top:.5rem;
  z-index:2;

  min-height:1.35rem;

  display:inline-flex;
  align-items:center;

  padding:0 .38rem;

  border:1px solid rgba(179,101,222,.15);
  border-radius:.4rem;

  color:#d69af5;
  background:rgba(111,44,151,.11);

  font-size:.46rem;
  font-weight:900;
  letter-spacing:.05em;
}

.mini-shop-card-body{
  flex:1;

  display:flex;
  flex-direction:column;

  padding:.68rem;
}

.mini-shop-card-topline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
}

.mini-shop-card-topline>span{
  color:#686f78;

  font-size:.47rem;
  font-weight:850;
  letter-spacing:.07em;
}

.mini-shop-card-topline>b{
  color:#d5ac68;

  font-size:.58rem;
}

.zombie-card .mini-shop-card-topline>b{
  color:#c586e6;
}

.mini-shop-card-body h3{
  margin:.24rem 0 0;

  color:#e2e6e8;

  font-size:.88rem;
}

.zombie-card .mini-shop-card-body h3{
  color:#d9a0f4;
}

.mini-shop-card-body>p{
  min-height:3rem;

  margin:.34rem 0 0;

  color:#838c94;

  font-size:.61rem;
  line-height:1.48;
}

.mini-shop-feature-list{
  display:grid;
  gap:.28rem;

  margin-top:.58rem;
}

.mini-shop-feature-list>span{
  color:#848e96;

  font-size:.56rem;
  line-height:1.35;
}

.mini-shop-feature-list>span::first-letter{
  color:#d0a65f;
}

.zombie-features>span::first-letter{
  color:#bc74e1;
}

.mini-shop-buy{
  min-height:3rem!important;

  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:.6rem!important;

  margin-top:auto!important;
  padding:.48rem .58rem!important;

  border:1px solid rgba(211,158,67,.12)!important;
  border-radius:.58rem!important;

  color:#e6c98f!important;
  background:
    linear-gradient(180deg,rgba(177,122,40,.17),rgba(93,62,23,.11))!important;

  text-align:left!important;

  cursor:pointer!important;
}

.zombie-buy{
  border-color:rgba(171,85,219,.13)!important;

  color:#d6a1f0!important;

  background:
    linear-gradient(180deg,rgba(116,52,153,.17),rgba(67,28,91,.11))!important;
}

.mini-shop-buy span,
.mini-shop-buy small{
  display:block;
}

.mini-shop-buy span{
  font-size:.58rem;
  font-weight:900;
}

.mini-shop-buy small{
  color:#897b65;

  font-size:.47rem;
  font-weight:750;
}

.zombie-buy small{
  color:#827088;
}

.mini-shop-buy.membership-active{
  border-color:rgba(80,200,113,.12)!important;

  color:#8cd9a1!important;

  background:rgba(67,184,99,.025)!important;

  cursor:default!important;
}

.mini-shop-buy.membership-active small{
  color:#658b70!important;
}

.mini-shop-buy.permanent-owned{
  border-color:rgba(164,88,204,.12)!important;

  color:#c994e3!important;

  background:rgba(105,48,136,.025)!important;

  cursor:default!important;
}

.mini-shop-buy:disabled{
  opacity:1!important;
}

.mini-shop-active-products{
  min-width:0;

  padding:.62rem;

  border:1px solid rgba(255,255,255,.045);
  border-radius:.72rem;

  background:rgba(255,255,255,.005);
}

.mini-shop-active-products>header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;

  padding-bottom:.45rem;

  border-bottom:1px solid rgba(255,255,255,.04);
}

.mini-shop-active-products>header>span{
  color:#6a747d;

  font-size:.50rem;
  font-weight:900;
  letter-spacing:.07em;
}

.mini-shop-active-products>header>strong{
  min-width:1.4rem;
  height:1.4rem;

  display:grid;
  place-items:center;

  border:1px solid rgba(255,255,255,.05);
  border-radius:.4rem;

  color:#77818a;
  background:rgba(255,255,255,.008);

  font-size:.50rem;
}

#miniShopActiveProducts{
  display:grid;
  gap:.38rem;

  margin-top:.48rem;
}

.mini-shop-active-item{
  min-height:3.2rem;

  display:grid;
  grid-template-columns:2.15rem minmax(0,1fr) auto;
  align-items:center;
  gap:.42rem;

  padding:.4rem;

  border:1px solid rgba(255,255,255,.04);
  border-radius:.56rem;

  background:rgba(255,255,255,.006);
}

.mini-shop-active-item-icon{
  width:2rem;
  height:2rem;

  display:grid;
  place-items:center;

  border-radius:.5rem;

  color:#d9ae64;
  background:rgba(214,162,69,.025);

  font-size:.83rem;
}

.mini-shop-active-item img{
  width:2rem;
  height:2rem;

  object-fit:cover;
  object-position:center 15%;

  border-radius:.5rem;
}

.mini-shop-active-item>div{
  min-width:0;
}

.mini-shop-active-item strong,
.mini-shop-active-item small{
  display:block;
}

.mini-shop-active-item strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  color:#aeb6bc;

  font-size:.57rem;
}

.mini-shop-active-item small{
  margin-top:.14rem;

  color:#626c74;

  font-size:.49rem;
}

.mini-shop-active-item.evip small b{
  color:#72cb8a;
}

.mini-shop-active-item>i{
  color:#6c8b74;

  font-size:.43rem;
  font-style:normal;
  font-weight:900;
}

.mini-shop-active-item.zombie>i{
  color:#9b72ac;
}

.mini-shop-active-empty{
  min-height:7rem;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  color:#5e6870;

  text-align:center;
}

.mini-shop-active-empty>span{
  font-size:1.1rem;
}

.mini-shop-active-empty strong{
  margin-top:.3rem;

  color:#768088;

  font-size:.58rem;
}

.mini-shop-active-empty small{
  margin-top:.15rem;

  color:#5d676f;

  font-size:.50rem;
}

.mini-shop-server-note{
  margin-top:.55rem;
  padding:.52rem;

  border:1px solid rgba(255,255,255,.04);
  border-radius:.55rem;

  background:rgba(255,255,255,.005);
}

.mini-shop-server-note>span{
  color:#665c6d;

  font-size:.45rem;
  font-weight:900;
  letter-spacing:.07em;
}

.mini-shop-server-note>strong{
  display:block;

  margin-top:.15rem;

  color:#8e8593;

  font-size:.57rem;
}

.mini-shop-server-note>p{
  margin:.25rem 0 0;

  color:#606971;

  font-size:.50rem;
  line-height:1.45;
}

.mini-shop-empty-category{
  grid-column:1/-1;

  min-height:16rem;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  border:1px dashed rgba(255,255,255,.05);
  border-radius:.72rem;

  color:#626c74;

  text-align:center;
}

.mini-shop-empty-category>span{
  font-size:1.4rem;
}

.mini-shop-empty-category strong{
  margin-top:.35rem;

  color:#79828a;

  font-size:.62rem;
}

.mini-shop-empty-category small{
  margin-top:.15rem;

  color:#606970;

  font-size:.53rem;
}

/* ---------------------------------------------------------
   RADIO V30 — more minimal
   --------------------------------------------------------- */

.radio-v29,
.radio-v29-shell,
.radio-v29-main,
.radio-v29-station-menu,
.radio-v29-volume{
  display:none!important;
}

.radio-v30{
  width:13.8rem;

  position:fixed;
  left:.72rem;
  bottom:.72rem;
  z-index:180;

  font-family:inherit;
}

.radio-v30 audio{
  display:none;
}

.radio-v30-shell{
  position:relative;

  display:grid;
  grid-template-columns:2.45rem minmax(0,1fr) 1.8rem 1.5rem;
  align-items:center;
  gap:.28rem;

  min-height:3.15rem;
  padding:.34rem;

  border:1px solid rgba(255,255,255,.07);
  border-radius:.74rem;

  background:
    linear-gradient(155deg,rgba(9,14,19,.96),rgba(5,9,13,.97));

  box-shadow:
    0 .55rem 1.45rem rgba(0,0,0,.27),
    inset 0 1px 0 rgba(255,255,255,.022);

  backdrop-filter:blur(.68rem);
  -webkit-backdrop-filter:blur(.68rem);
}

.radio-v30-play{
  width:2.35rem;
  height:2.35rem;

  display:grid;
  place-items:center;

  padding:0;

  border:1px solid rgba(255,58,85,.13);
  border-radius:.62rem;

  color:#ff7488;
  background:rgba(255,48,79,.026);

  cursor:pointer;
}

.radio-v30-play svg{
  width:.95rem;
  height:.95rem;

  fill:currentColor;
}

.radio-v30-station{
  min-width:0;

  display:grid;
  grid-template-columns:minmax(0,1fr) .6rem;
  align-items:center;
  gap:.20rem;

  padding:.25rem .28rem;

  border:0;
  border-radius:.48rem;

  color:inherit;
  background:transparent;

  text-align:left;

  cursor:pointer;
}

.radio-v30-station:hover,
.radio-v30-station[aria-expanded="true"]{
  background:rgba(255,255,255,.012);
}

.radio-v30-station>span{
  min-width:0;

  display:flex;
  flex-direction:column;
}

.radio-v30-station small{
  color:#765d65;

  font-size:.39rem;
  font-weight:900;
  letter-spacing:.08em;
}

.radio-v30-station strong{
  margin-top:.08rem;

  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  color:#adb5bb;

  font-size:.53rem;
}

.radio-v30-station b{
  margin-top:.08rem;

  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  color:#626d75;

  font-size:.40rem;
  font-weight:800;
}

.radio-v30.playing .radio-v30-station b{
  color:#d36b7b;
}

.radio-v30-station>i{
  color:#69737b;

  font-size:.55rem;
  font-style:normal;
}

.radio-v30-volume-btn,
.radio-v30-minimize{
  width:1.65rem;
  height:1.65rem;

  display:grid;
  place-items:center;

  padding:0;

  border:1px solid rgba(255,255,255,.045);
  border-radius:.44rem;

  color:#6c767e;
  background:rgba(255,255,255,.006);

  cursor:pointer;
}

.radio-v30-volume-btn svg{
  width:.82rem;
  height:.82rem;

  fill:none;
  stroke:currentColor;
  stroke-width:1.5;
  stroke-linecap:round;
}

.radio-v30-station-menu{
  width:calc(100% - .68rem);

  position:absolute;
  left:.34rem;
  bottom:3.45rem;
  z-index:4;

  display:grid;
  gap:.18rem;

  padding:.26rem;

  border:1px solid rgba(255,255,255,.07);
  border-radius:.62rem;

  background:rgba(6,10,14,.985);

  box-shadow:0 .65rem 1.55rem rgba(0,0,0,.32);
}

.radio-v30-station-menu button{
  min-height:2.1rem;

  display:grid;
  grid-template-columns:1.45rem minmax(0,1fr) auto;
  align-items:center;
  gap:.3rem;

  padding:.25rem .3rem;

  border:1px solid transparent;
  border-radius:.45rem;

  color:inherit;
  background:transparent;

  text-align:left;

  cursor:pointer;
}

.radio-v30-station-menu button:hover{
  border-color:rgba(255,58,85,.07);

  background:rgba(255,48,79,.014);
}

.radio-v30-station-menu button>span{
  width:1.35rem;
  height:1.35rem;

  display:grid;
  place-items:center;

  border-radius:.38rem;

  color:#9e6671;
  background:rgba(255,48,79,.02);

  font-size:.43rem;
  font-weight:900;
}

.radio-v30-station-menu strong{
  color:#a7afb6;

  font-size:.50rem;
}

.radio-v30-station-menu small{
  color:#59636b;

  font-size:.40rem;
}

.radio-v30-volume-popover{
  width:6.2rem;

  position:absolute;
  right:.8rem;
  bottom:3.45rem;
  z-index:4;

  padding:.45rem;

  border:1px solid rgba(255,255,255,.07);
  border-radius:.58rem;

  background:rgba(6,10,14,.985);

  box-shadow:0 .55rem 1.4rem rgba(0,0,0,.30);
}

.radio-v30-volume-popover input{
  width:100%;

  accent-color:#d02a48;
}

.radio-v30-mini{
  width:2.75rem;
  height:2.75rem;

  position:relative;

  display:grid;
  place-items:center;

  padding:0;

  border:1px solid rgba(255,58,85,.10);
  border-radius:.7rem;

  color:#b66877;
  background:rgba(8,13,18,.96);

  box-shadow:0 .5rem 1.3rem rgba(0,0,0,.26);

  cursor:pointer;
}

.radio-v30-mini svg{
  width:1.05rem;
  height:1.05rem;

  fill:none;
  stroke:currentColor;
  stroke-width:1.5;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.radio-v30-mini>i{
  width:.42rem;
  height:.42rem;

  position:absolute;
  right:.32rem;
  bottom:.32rem;

  border:.08rem solid #0b1015;
  border-radius:50%;

  background:#686e70;
}

.radio-v30.playing .radio-v30-mini>i{
  background:#ff5069;

  box-shadow:0 0 .55rem rgba(255,48,79,.42);
}

.radio-v30.minimized .radio-v30-shell{
  display:none!important;
}

.radio-v30.minimized .radio-v30-mini{
  display:grid!important;
}

/* ---------------------------------------------------------
   Responsive
   --------------------------------------------------------- */

@media(max-width:850px){
  .mini-shop-v30-grid{
    grid-template-columns:1fr;
  }

  .mini-shop-active-products{
    order:-1;
  }
}

@media(max-width:650px){
  .mini-shop-v30-head{
    grid-template-columns:auto minmax(0,1fr);
  }

  .mini-shop-wallet{
    grid-column:1/-1;
  }

  .mini-shop-active-banner{
    grid-template-columns:2.5rem minmax(0,1fr);
  }

  .mini-shop-active-live{
    display:none;
  }

  .mini-shop-filterbar{
    overflow-x:auto;
  }

  .mini-shop-filterbar .shop-filter{
    flex:0 0 auto;
  }

  .mini-shop-products{
    grid-template-columns:1fr;
  }

  .mini-shop-card-media{
    height:11.5rem;
  }
}


/* =========================================================
   V31 — SHOP POLISH / VIAL STORE / SINGLE TOAST
   ========================================================= */

.x-toast-v27{display:none!important}

.x-toast-v31{
  width:min(26rem,calc(100vw - 1.2rem));
  position:relative;
  display:grid;
  grid-template-columns:2.65rem minmax(0,1fr) 1.6rem;
  align-items:center;
  gap:.62rem;
  padding:.62rem .66rem .75rem;
  overflow:hidden;
  border:1px solid rgba(255,62,89,.14);
  border-radius:.78rem;
  color:#fff;
  background:radial-gradient(circle at 7% 30%,rgba(255,48,79,.105),transparent 29%),linear-gradient(155deg,rgba(18,17,22,.975),rgba(7,10,15,.985));
  box-shadow:0 .9rem 2rem rgba(0,0,0,.30),0 0 1rem rgba(255,48,79,.035),inset 0 1px 0 rgba(255,255,255,.03);
  backdrop-filter:blur(.72rem);
  -webkit-backdrop-filter:blur(.72rem);
  opacity:0;
  transform:translateY(-.3rem) scale(.985);
  transition:opacity .18s ease,transform .18s ease;
}
.x-toast-v31.visible{opacity:1;transform:none}
.x-toast-v31-accent{width:.15rem;position:absolute;left:0;top:.45rem;bottom:.45rem;border-radius:999px;background:#e12b4a}
.x-toast-v31-icon{width:2.45rem;height:2.45rem;display:grid;place-items:center;border:1px solid rgba(255,59,86,.14);border-radius:.66rem;color:#ff7187;background:rgba(255,48,79,.032)}
.x-toast-v31.success .x-toast-v31-icon{color:#f0f3f5;border-color:rgba(255,255,255,.09);background:radial-gradient(circle,rgba(255,48,79,.08),rgba(255,48,79,.025))}
.x-toast-v31-icon svg{width:1.08rem;height:1.08rem;fill:none;stroke:currentColor;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round}
.x-toast-v31-copy{min-width:0}
.x-toast-v31-copy small,.x-toast-v31-copy strong,.x-toast-v31-copy span{display:block}
.x-toast-v31-copy small{color:#845f68;font-size:.49rem;font-weight:900;letter-spacing:.085em}
.x-toast-v31-copy strong{margin-top:.12rem;color:#f0ecee;font-size:.75rem;font-weight:850}
.x-toast-v31-copy span{margin-top:.17rem;color:#929ba2;font-size:.63rem;line-height:1.38}
.x-toast-v31-close{width:1.55rem;height:1.55rem;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.045);border-radius:.42rem;color:#727b83;background:rgba(255,255,255,.008);cursor:pointer}
.x-toast-v31-timer{height:.12rem;position:absolute;left:.65rem;right:.65rem;bottom:.32rem;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.035)}
.x-toast-v31-timer>span{width:100%;height:100%;display:block;transform-origin:left center;background:linear-gradient(90deg,#9d1730,#ef3d5a);transition-property:transform;transition-timing-function:linear}

/* Shop readability */
.mini-shop-v30{width:min(68rem,97vw)!important}
.mini-shop-title p{max-width:44rem;color:#7e8992!important;font-size:.66rem!important;line-height:1.45!important}
.mini-shop-wallet{min-width:9rem!important}
.mini-shop-wallet>button{min-height:1.75rem;margin-top:.38rem;padding:0 .45rem;border:1px solid rgba(255,58,85,.10);border-radius:.42rem;color:#d47b89;background:rgba(255,48,79,.018);font-size:.48rem;font-weight:900;cursor:pointer}
.mini-shop-wallet>button:hover{color:#ff8799;border-color:rgba(255,58,85,.18);background:rgba(255,48,79,.035)}

.mini-shop-active-banner{
  width:max-content!important;
  max-width:calc(100% - 1.5rem)!important;
  grid-template-columns:2.7rem minmax(10rem,auto) auto!important;
  margin-right:auto!important;
  padding-right:.55rem!important;
}
.mini-shop-active-banner>div:nth-child(2)>strong{font-size:.76rem!important}
.mini-shop-active-banner>div:nth-child(2)>small{font-size:.59rem!important}
.mini-shop-active-live{width:max-content!important;white-space:nowrap}

.mini-shop-filterbar .shop-filter{font-size:.61rem!important}
.mini-shop-filterbar .vial-filter{margin-left:auto;color:#d99c65}

.mini-shop-v30-grid{grid-template-columns:minmax(0,1fr) 16.5rem!important}
.mini-shop-card-body{padding:.78rem!important}
.mini-shop-card-topline>span{font-size:.51rem!important}
.mini-shop-card-topline>div{display:flex;align-items:center;gap:.38rem}
.mini-shop-card-topline>div>b{color:#d5ac68;font-size:.63rem}
.zombie-card .mini-shop-card-topline>div>b{color:#c586e6}

.mini-shop-info-button{min-height:1.45rem;padding:0 .38rem;border:1px solid rgba(255,255,255,.055);border-radius:.38rem;color:#7d8790;background:rgba(255,255,255,.009);font-size:.45rem;font-weight:900;cursor:pointer}
.mini-shop-info-button:hover{color:#c9cfd4;border-color:rgba(255,255,255,.10);background:rgba(255,255,255,.02)}

.mini-shop-card-body h3{margin-top:.30rem!important;font-size:1rem!important;letter-spacing:.015em}
.mini-shop-card-body>p{min-height:0!important;margin-top:.40rem!important;color:#9ca5ad!important;font-size:.68rem!important;line-height:1.58!important}
.mini-shop-feature-list{gap:.34rem!important;margin-top:.68rem!important}
.mini-shop-feature-list>span{color:#929ca4!important;font-size:.62rem!important;line-height:1.42!important}
.mini-shop-buy span{font-size:.64rem!important}
.mini-shop-buy small{font-size:.51rem!important}

.mini-shop-buy.membership-active{
  width:max-content!important;
  max-width:100%!important;
  align-self:flex-start!important;
  padding:.48rem .65rem!important;
}

.zombie-media{
  min-height:11.8rem!important;
  background-color:#090a0e!important;
  background-image:url('/assets/shop-zombie-tank.webp')!important;
  background-repeat:no-repeat!important;
  background-position:center 18%!important;
  background-size:cover!important;
}
.zombie-media img{display:none!important}
.zombie-media:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 48%,rgba(5,7,11,.74) 100%);pointer-events:none}
.zombie-media:after{display:none!important}

/* VIAL store */
.vial-store-v31{grid-column:1/-1;min-width:0;padding:.74rem;border:1px solid rgba(255,255,255,.05);border-radius:.78rem;background:radial-gradient(circle at 90% 0%,rgba(255,49,80,.05),transparent 30%),rgba(255,255,255,.005)}
.vial-store-head{min-height:7rem;display:grid;grid-template-columns:minmax(0,1fr) 5.6rem;align-items:center;gap:.8rem;padding:.45rem .5rem .72rem;border-bottom:1px solid rgba(255,255,255,.045)}
.vial-store-head>div>span{color:#865f69;font-size:.52rem;font-weight:900;letter-spacing:.09em}
.vial-store-head h3{margin:.18rem 0 0;color:#eef0f2;font-size:1.12rem}
.vial-store-head p{max-width:46rem;margin:.25rem 0 0;color:#89939b;font-size:.67rem;line-height:1.52}
.vial-store-head>img{width:4.8rem;height:6.2rem;justify-self:end;object-fit:contain;filter:drop-shadow(0 0 1rem rgba(255,48,79,.18))}

.vial-package-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.48rem;margin-top:.7rem}
.vial-package-card{min-width:0;display:flex;flex-direction:column;align-items:center;padding:.62rem .52rem .56rem;border:1px solid rgba(255,255,255,.05);border-radius:.68rem;background:radial-gradient(circle at 50% 15%,rgba(255,48,79,.045),transparent 37%),rgba(255,255,255,.006);text-align:center;transition:.15s ease}
.vial-package-card:hover{transform:translateY(-2px);border-color:rgba(255,68,94,.10)}
.vial-package-card.featured{border-color:rgba(255,65,91,.11);background:radial-gradient(circle at 50% 12%,rgba(255,48,79,.075),transparent 42%),rgba(255,48,79,.010)}
.vial-package-card.legendary{border-color:rgba(190,104,230,.10);background:radial-gradient(circle at 50% 12%,rgba(166,78,211,.065),transparent 42%),rgba(99,41,130,.008)}
.vial-package-art{width:5.1rem;height:6.3rem;display:grid;place-items:center;margin-bottom:.1rem}
.vial-package-art img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 .8rem rgba(255,48,79,.20))}
.vial-package-card>span{color:#805f68;font-size:.47rem;font-weight:900;letter-spacing:.10em}
.vial-package-card>strong{margin-top:.20rem;color:#e2e6e8;font-size:.84rem}
.vial-package-card>small{min-height:2rem;margin-top:.20rem;color:#737d85;font-size:.54rem;line-height:1.38}
.vial-package-price{margin-top:.46rem;color:#ff8da0;font-size:.78rem;font-weight:900}
.vial-package-actions{width:100%;display:grid;grid-template-columns:auto minmax(0,1fr);gap:.28rem;margin-top:.5rem}
.vial-package-actions button{min-height:2.1rem;padding:0 .4rem;border:1px solid rgba(255,255,255,.055);border-radius:.48rem;color:#818b93;background:rgba(255,255,255,.008);font-size:.48rem;font-weight:900;cursor:pointer}
.vial-package-actions .vial-buy-disabled{color:#b76c79;border-color:rgba(255,58,85,.09);background:rgba(255,48,79,.016)}
.vial-store-note{display:grid;grid-template-columns:1.9rem minmax(0,1fr);align-items:center;gap:.48rem;margin-top:.58rem;padding:.5rem;border:1px solid rgba(255,255,255,.04);border-radius:.55rem;background:rgba(255,255,255,.005)}
.vial-store-note>span{width:1.75rem;height:1.75rem;display:grid;place-items:center;border-radius:.45rem;color:#8c6a72;background:rgba(255,48,79,.018)}
.vial-store-note p{margin:0;color:#68727a;font-size:.56rem;line-height:1.45}

/* Info popup */
.shop-info-screen{position:fixed;inset:0;z-index:365;display:grid;place-items:center;padding:5.6rem 1rem 1rem}
.shop-info-screen.hidden{display:none!important}
.shop-info-backdrop{position:absolute;inset:0;background:rgba(1,4,8,.82);backdrop-filter:blur(.65rem);-webkit-backdrop-filter:blur(.65rem)}
.shop-info-window{width:min(42rem,95vw);max-height:calc(100vh - 7rem);position:relative;z-index:1;display:grid;grid-template-columns:12rem minmax(0,1fr);overflow:auto;border:1px solid rgba(255,255,255,.075);border-radius:.9rem;background:radial-gradient(circle at 85% -5%,rgba(255,48,79,.055),transparent 32%),linear-gradient(155deg,#10161d,#060a0f);box-shadow:0 1.8rem 4.5rem rgba(0,0,0,.52)}
.shop-info-close{width:1.9rem;height:1.9rem;position:absolute;right:.62rem;top:.62rem;z-index:3;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.06);border-radius:.5rem;color:#79838b;background:rgba(8,12,17,.72);cursor:pointer}
.shop-info-visual{min-height:23rem;display:grid;place-items:center;padding:.8rem;overflow:hidden;border-right:1px solid rgba(255,255,255,.045);background:radial-gradient(circle at 50% 38%,rgba(255,48,79,.055),transparent 52%)}
.shop-info-visual img{width:100%;max-height:21rem;object-fit:contain;border-radius:.65rem;filter:drop-shadow(0 0 1.2rem rgba(255,48,79,.12))}
.shop-info-content{padding:.9rem}
.shop-info-content>span{color:#805f68;font-size:.51rem;font-weight:900;letter-spacing:.09em}
.shop-info-content h2{margin:.22rem 2rem 0 0;color:#edf0f2;font-size:1.05rem}
.shop-info-content>p{margin:.38rem 0 0;color:#96a0a8;font-size:.68rem;line-height:1.58}
.shop-info-section{margin-top:.72rem;padding-top:.62rem;border-top:1px solid rgba(255,255,255,.045)}
.shop-info-section>span{color:#6d777f;font-size:.50rem;font-weight:900;letter-spacing:.075em}
#shopInfoBenefits{display:grid;gap:.34rem;margin-top:.42rem}
#shopInfoBenefits>span{display:grid;grid-template-columns:1.25rem minmax(0,1fr);align-items:center;gap:.3rem;color:#909aa2;font-size:.62rem}
#shopInfoBenefits i{width:1.15rem;height:1.15rem;display:grid;place-items:center;border-radius:.34rem;color:#d07b8a;background:rgba(255,48,79,.018);font-style:normal;font-size:.48rem}
#shopInfoFineprint{margin:.38rem 0 0;color:#717b83;font-size:.59rem;line-height:1.5}
.shop-info-footer{display:flex;align-items:center;justify-content:space-between;gap:.7rem;margin-top:.75rem;padding:.58rem;border:1px solid rgba(255,255,255,.045);border-radius:.56rem;background:rgba(255,255,255,.006)}
.shop-info-footer strong{color:#e0a1ac;font-size:.75rem}
.shop-info-footer small{color:#6e7880;font-size:.49rem;font-weight:850}

/* Radio just a bit larger */
.radio-v30{width:15.6rem!important}
.radio-v30-shell{grid-template-columns:2.65rem minmax(0,1fr) 1.95rem 1.65rem!important;min-height:3.55rem!important;gap:.34rem!important;padding:.39rem!important}
.radio-v30-play{width:2.55rem!important;height:2.55rem!important}
.radio-v30-play svg{width:1.05rem!important;height:1.05rem!important}
.radio-v30-station{padding:.30rem .34rem!important}
.radio-v30-station small{font-size:.43rem!important}
.radio-v30-station strong{font-size:.59rem!important}
.radio-v30-station b{font-size:.45rem!important}
.radio-v30-volume-btn,.radio-v30-minimize{width:1.8rem!important;height:1.8rem!important}
.radio-v30-station-menu,.radio-v30-volume-popover{bottom:3.88rem!important}

@media(max-width:920px){
  .vial-package-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  .mini-shop-active-banner{width:calc(100% - 1.5rem)!important}
  .mini-shop-v30-grid{grid-template-columns:1fr!important}
  .vial-store-head{grid-template-columns:minmax(0,1fr) 4.2rem}
  .vial-store-head>img{width:3.7rem;height:5rem}
  .shop-info-window{grid-template-columns:1fr}
  .shop-info-visual{min-height:10rem;border-right:0;border-bottom:1px solid rgba(255,255,255,.045)}
  .shop-info-visual img{max-height:9rem}
}
@media(max-width:480px){
  .vial-package-grid{grid-template-columns:1fr}
  .radio-v30{width:min(15.6rem,calc(100vw - 1.44rem))!important}
}


/* =========================================================
   V32 — SHOP ADMIN / PROFILE BENEFITS / AVATAR DISCOVERY
   ========================================================= */

/* OAuth provider text centered */
.portal-main .social-btn{
  grid-template-columns:2.4rem minmax(0,1fr) 2.4rem!important;
  text-align:center!important;
}
.portal-main .social-btn .provider-copy{
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
}
.portal-main .social.compact .provider-copy{
  align-items:center!important;
}
.portal-main .social-btn .provider-arrow{
  justify-self:center!important;
}

/* ---------------------------------------------------------
   Avatar menu discoverability
   --------------------------------------------------------- */

.top-user{
  position:relative!important;
}

.topbar-avatar-shell{
  width:2rem;
  height:2rem;
  position:relative;
  display:block;
  flex:0 0 2rem;
}

.topbar-avatar-shell>img{
  width:100%!important;
  height:100%!important;
  object-fit:cover;
  border-radius:50%;
}

.avatar-menu-dot{
  width:.46rem;
  height:.46rem;
  position:absolute;
  right:-.08rem;
  bottom:-.04rem;
  border:.1rem solid #090d12;
  border-radius:50%;
  background:#e5314f;
  box-shadow:0 0 .55rem rgba(229,49,79,.46);
}

.topbar-user-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}

.topbar-user-copy>strong{
  max-width:8rem;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.66rem;
}

.topbar-user-copy>small{
  margin-top:.06rem;
  color:#735d63;
  font-size:.39rem;
  font-weight:900;
  letter-spacing:.08em;
}

.avatar-menu-hint{
  position:absolute;
  right:-.15rem;
  top:calc(100% + .7rem);
  z-index:30;
  min-width:10.7rem;
  padding:.48rem .58rem;
  border:1px solid rgba(255,58,85,.14);
  border-radius:.58rem;
  color:#e6c9cf;
  background:rgba(8,12,17,.98);
  box-shadow:0 .7rem 1.6rem rgba(0,0,0,.34);
  font-size:.49rem;
  font-weight:900;
  letter-spacing:.035em;
  text-align:center;
  pointer-events:none;
  animation:avatarHintPulse 1.8s ease-in-out infinite;
}

.avatar-menu-hint:before{
  content:"";
  position:absolute;
  right:1.2rem;
  bottom:100%;
  border:.38rem solid transparent;
  border-bottom-color:rgba(255,58,85,.14);
}

.avatar-menu-hint i{
  margin-right:.25rem;
  color:#ff6e84;
  font-style:normal;
}

@keyframes avatarHintPulse{
  0%,100%{transform:translateY(0);box-shadow:0 .7rem 1.6rem rgba(0,0,0,.34)}
  50%{transform:translateY(.12rem);box-shadow:0 .8rem 1.9rem rgba(0,0,0,.38),0 0 .9rem rgba(255,48,79,.05)}
}

/* VIAL plus in navbar and account menu */
.yun-stat{
  grid-template-columns:auto minmax(0,1fr) auto!important;
}

.topbar-vial-plus{
  width:1.45rem;
  height:1.45rem;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(222,167,70,.12);
  border-radius:.42rem;
  color:#e0b461;
  background:rgba(212,155,56,.018);
  font-size:.82rem;
  font-weight:800;
  cursor:pointer;
}

.topbar-vial-plus:hover{
  border-color:rgba(222,167,70,.22);
  background:rgba(212,155,56,.04);
}

.account-popover-stats .account-vial-stat{
  text-align:left;
  cursor:pointer;
}

.account-popover-stats .account-vial-stat strong{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.3rem;
}

.account-popover-stats .account-vial-stat strong i{
  width:1.15rem;
  height:1.15rem;
  display:grid;
  place-items:center;
  border-radius:.34rem;
  color:#dcb25f;
  background:rgba(215,161,65,.035);
  font-style:normal;
}

/* ---------------------------------------------------------
   Shop readability + new badge + weapon
   --------------------------------------------------------- */

.mini-shop-head-actions{
  display:flex;
  align-items:stretch;
  gap:.4rem;
}

.mini-shop-admin-button{
  min-width:7.5rem;
  border:1px solid rgba(255,58,85,.10);
  border-radius:.58rem;
  color:#c57885;
  background:rgba(255,48,79,.015);
  font-size:.50rem;
  font-weight:900;
  letter-spacing:.04em;
  cursor:pointer;
}

.mini-shop-admin-button:hover{
  color:#ff8497;
  border-color:rgba(255,58,85,.18);
  background:rgba(255,48,79,.032);
}

.mini-shop-card{
  position:relative;
}

.shop-new-badge{
  position:absolute;
  left:.55rem;
  top:.5rem;
  z-index:6;
  min-height:1.38rem;
  display:inline-flex;
  align-items:center;
  padding:0 .42rem;
  border:1px solid rgba(255,73,100,.16);
  border-radius:.4rem;
  color:#ff9aab;
  background:rgba(158,22,49,.48);
  box-shadow:0 .25rem .8rem rgba(0,0,0,.28);
  font-size:.44rem;
  font-weight:950;
  letter-spacing:.06em;
}

.weapon-media{
  height:11.8rem!important;
  background:
    radial-gradient(circle at 45% 45%,rgba(44,114,199,.08),transparent 54%),
    #070a0f;
}

.weapon-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

.weapon-permanent-badge{
  position:absolute;
  right:.55rem;
  top:.5rem;
  z-index:3;
  min-height:1.35rem;
  display:inline-flex;
  align-items:center;
  padding:0 .38rem;
  border:1px solid rgba(70,145,238,.15);
  border-radius:.4rem;
  color:#84bafa;
  background:rgba(31,85,151,.12);
  font-size:.46rem;
  font-weight:900;
}

.weapon-card .mini-shop-card-body h3{
  color:#7fb7f6!important;
}

.weapon-card .mini-shop-card-topline>div>b{
  color:#75afea!important;
}

.weapon-buy{
  border-color:rgba(67,139,224,.13)!important;
  color:#94c4fb!important;
  background:linear-gradient(180deg,rgba(39,92,157,.18),rgba(21,52,92,.11))!important;
}

.mini-shop-card-body>p{
  font-size:.70rem!important;
  line-height:1.62!important;
}

.mini-shop-feature-list>span{
  font-size:.63rem!important;
  line-height:1.46!important;
}

/* Tank image corrected: contain, no stretch */
.zombie-media{
  background:
    radial-gradient(circle at 50% 35%,rgba(110,53,140,.08),transparent 58%),
    #07090d!important;
  background-image:none!important;
}

.zombie-media img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center bottom!important;
  filter:saturate(.92) contrast(1.05) brightness(.92);
}

.zombie-media:before{
  background:linear-gradient(180deg,transparent 52%,rgba(5,7,11,.36) 100%)!important;
}

/* ---------------------------------------------------------
   VIAL reward explainer
   --------------------------------------------------------- */

.vial-reward-guide{
  margin:.58rem .75rem 0;
  padding:.66rem .72rem;
  border:1px solid rgba(77,200,111,.08);
  border-radius:.68rem;
  background:
    radial-gradient(circle at 10% 30%,rgba(72,195,106,.045),transparent 31%),
    rgba(255,255,255,.004);
}

.vial-reward-copy>span{
  color:#63816b;
  font-size:.48rem;
  font-weight:900;
  letter-spacing:.08em;
}

.vial-reward-copy h3{
  margin:.16rem 0 0;
  color:#b9d2bf;
  font-size:.72rem;
}

.vial-reward-copy p{
  margin:.23rem 0 0;
  color:#7f8a92;
  font-size:.61rem;
  line-height:1.5;
}

.vial-reward-copy p strong{
  color:#74d991;
}

.vial-reward-flow{
  display:grid;
  grid-template-columns:repeat(5,auto);
  align-items:center;
  justify-content:start;
  gap:.36rem;
  margin-top:.55rem;
}

.vial-reward-flow>div{
  min-width:7.2rem;
  padding:.4rem .48rem;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.5rem;
  background:rgba(255,255,255,.006);
}

.vial-reward-flow b,
.vial-reward-flow span{
  display:block;
}

.vial-reward-flow b{
  color:#b4bdc4;
  font-size:.62rem;
}

.vial-reward-flow span{
  margin-top:.08rem;
  color:#67717a;
  font-size:.50rem;
}

.vial-reward-flow>div.accent{
  border-color:rgba(216,168,79,.09);
}

.vial-reward-flow>div.accent b{
  color:#dab265;
}

.vial-reward-flow>i{
  color:#57616a;
  font-style:normal;
}

.vial-reward-guide>small{
  display:block;
  margin-top:.42rem;
  color:#657078;
  font-size:.52rem;
}

/* ---------------------------------------------------------
   Shop Admin
   --------------------------------------------------------- */

.shop-admin-screen{
  position:fixed;
  inset:0;
  z-index:390;
  display:grid;
  place-items:center;
  padding:5.5rem 1rem 1rem;
}

.shop-admin-screen.hidden{display:none!important}

.shop-admin-backdrop{
  position:absolute;
  inset:0;
  background:rgba(1,4,8,.84);
  backdrop-filter:blur(.7rem);
  -webkit-backdrop-filter:blur(.7rem);
}

.shop-admin-window{
  width:min(60rem,96vw);
  max-height:calc(100vh - 7rem);
  position:relative;
  z-index:1;
  overflow:auto;
  border:1px solid rgba(255,255,255,.075);
  border-radius:.95rem;
  background:
    radial-gradient(circle at 90% -8%,rgba(255,48,79,.05),transparent 32%),
    linear-gradient(155deg,#10161d,#060a0f);
  box-shadow:0 2rem 5rem rgba(0,0,0,.55);
}

.shop-admin-window>header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.8rem;
  padding:.78rem .9rem;
  border-bottom:1px solid rgba(255,255,255,.05);
}

.shop-admin-window>header span{
  color:#7e5d66;
  font-size:.50rem;
  font-weight:900;
  letter-spacing:.09em;
}

.shop-admin-window>header h2{
  margin:.14rem 0 0;
  color:#edf0f2;
  font-size:1rem;
}

.shop-admin-window>header p{
  margin:.15rem 0 0;
  color:#69737b;
  font-size:.58rem;
}

.shop-admin-window>header>button{
  width:2rem;
  height:2rem;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(255,255,255,.055);
  border-radius:.48rem;
  color:#7a848d;
  background:rgba(255,255,255,.008);
  cursor:pointer;
}

.shop-admin-tabs{
  display:flex;
  gap:.25rem;
  padding:.42rem .65rem;
  border-bottom:1px solid rgba(255,255,255,.045);
}

.shop-admin-tabs button{
  min-height:2.15rem;
  padding:0 .65rem;
  border:1px solid transparent;
  border-radius:.45rem;
  color:#6f7981;
  background:transparent;
  font-size:.53rem;
  font-weight:900;
  cursor:pointer;
}

.shop-admin-tabs button.active{
  color:#e6cbd0;
  border-color:rgba(255,58,85,.10);
  background:rgba(255,48,79,.02);
}

.shop-admin-body{
  padding:.65rem;
}

.shop-admin-pane[data-shop-admin-pane="items"]{
  display:grid;
  grid-template-columns:15rem minmax(0,1fr);
  gap:.65rem;
}

.shop-admin-pane.hidden{display:none!important}

.shop-admin-item-list{
  display:grid;
  align-content:start;
  gap:.3rem;
}

.shop-admin-item-list>button{
  min-height:3.7rem;
  display:grid;
  grid-template-columns:3rem minmax(0,1fr) auto;
  align-items:center;
  gap:.42rem;
  padding:.35rem;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.55rem;
  color:inherit;
  background:rgba(255,255,255,.005);
  text-align:left;
  cursor:pointer;
}

.shop-admin-item-list>button.active{
  border-color:rgba(255,58,85,.11);
  background:rgba(255,48,79,.015);
}

.shop-admin-item-list img{
  width:2.8rem;
  height:2.8rem;
  object-fit:cover;
  border-radius:.48rem;
}

.shop-admin-item-list strong,
.shop-admin-item-list small{
  display:block;
}

.shop-admin-item-list strong{
  color:#aeb6bd;
  font-size:.58rem;
}

.shop-admin-item-list small{
  margin-top:.12rem;
  color:#616b73;
  font-size:.47rem;
}

.shop-admin-item-list b{
  color:#d17888;
  font-size:.42rem;
}

.shop-admin-item-form{
  display:grid;
  gap:.48rem;
  padding:.6rem;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.62rem;
  background:rgba(255,255,255,.004);
}

.shop-admin-edit-head{
  display:grid;
  grid-template-columns:3.5rem minmax(0,1fr);
  align-items:center;
  gap:.52rem;
  padding-bottom:.5rem;
  border-bottom:1px solid rgba(255,255,255,.04);
}

.shop-admin-edit-head img{
  width:3.4rem;
  height:3.4rem;
  object-fit:cover;
  border-radius:.55rem;
}

.shop-admin-edit-head span,
.shop-admin-edit-head strong{
  display:block;
}

.shop-admin-edit-head span{
  color:#6e5c62;
  font-size:.46rem;
  font-weight:900;
}

.shop-admin-edit-head strong{
  margin-top:.12rem;
  color:#c8ced3;
  font-size:.66rem;
}

.shop-admin-item-form label>span,
.admin-vial-grant label>span{
  display:block;
  margin-bottom:.2rem;
  color:#69737b;
  font-size:.49rem;
  font-weight:850;
  letter-spacing:.05em;
}

.shop-admin-item-form input,
.shop-admin-item-form select,
.shop-admin-item-form textarea,
.admin-vial-grant input{
  width:100%;
  box-sizing:border-box;
  border:1px solid rgba(255,255,255,.06);
  border-radius:.5rem;
  color:#d6dce0;
  background:#080d12;
  font:inherit;
  font-size:.61rem;
  outline:0;
}

.shop-admin-item-form input,
.shop-admin-item-form select,
.admin-vial-grant input{
  min-height:2.4rem;
  padding:0 .48rem;
}

.shop-admin-item-form textarea{
  padding:.48rem;
  resize:vertical;
  line-height:1.5;
}

.shop-admin-grid-two{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.45rem;
}

.shop-admin-switches{
  display:flex;
  flex-wrap:wrap;
  gap:.35rem;
}

.shop-admin-switches label{
  display:flex;
  align-items:center;
  gap:.3rem;
  min-height:2rem;
  padding:0 .45rem;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.45rem;
  background:rgba(255,255,255,.005);
}

.shop-admin-switches input{width:auto;min-height:0}

.shop-admin-switches label>span{
  margin:0;
  font-size:.46rem;
}

.shop-admin-item-form>button,
#adminVialGrantForm>button{
  min-height:2.55rem;
  border:1px solid rgba(255,58,85,.13);
  border-radius:.52rem;
  color:#f2e6e9;
  background:linear-gradient(180deg,rgba(195,35,65,.72),rgba(126,17,39,.72));
  font-size:.55rem;
  font-weight:900;
  cursor:pointer;
}

/* VIAL grant */
.admin-vial-grant{
  width:min(42rem,100%);
  margin:0 auto;
  padding:.65rem;
}

.admin-vial-grant>header span{
  color:#776068;
  font-size:.48rem;
  font-weight:900;
  letter-spacing:.08em;
}

.admin-vial-grant>header h3{
  margin:.15rem 0 0;
  color:#e0e4e7;
  font-size:.9rem;
}

.admin-vial-grant>header p{
  margin:.2rem 0 .7rem;
  color:#6d7780;
  font-size:.59rem;
}

.admin-vial-results{
  display:grid;
  gap:.25rem;
  margin:.35rem 0 .55rem;
}

.admin-vial-results>button{
  min-height:2.8rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
  padding:.36rem .48rem;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.5rem;
  color:inherit;
  background:rgba(255,255,255,.005);
  text-align:left;
  cursor:pointer;
}

.admin-vial-results strong,
.admin-vial-results small{
  display:block;
}

.admin-vial-results strong{color:#aeb6bd;font-size:.58rem}
.admin-vial-results small{color:#626c74;font-size:.48rem}
.admin-vial-results b{color:#d8ad62;font-size:.55rem}

.admin-vial-selected{
  margin:.48rem 0;
  padding:.5rem;
  border:1px solid rgba(216,166,77,.08);
  border-radius:.5rem;
  background:rgba(212,160,69,.01);
}

.admin-vial-selected span,
.admin-vial-selected strong,
.admin-vial-selected small{display:block}
.admin-vial-selected span{color:#746650;font-size:.45rem;font-weight:900}
.admin-vial-selected strong{margin-top:.1rem;color:#c9ad78;font-size:.64rem}
.admin-vial-selected small{margin-top:.08rem;color:#6b747c;font-size:.50rem}

/* History */
.shop-history-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.6rem;
  margin-bottom:.45rem;
}

.shop-history-head span{color:#756067;font-size:.47rem;font-weight:900}
.shop-history-head h3{margin:.1rem 0 0;color:#dfe3e6;font-size:.8rem}
.shop-history-head button{
  min-height:2rem;
  padding:0 .5rem;
  border:1px solid rgba(255,255,255,.05);
  border-radius:.44rem;
  color:#78828a;
  background:rgba(255,255,255,.005);
  font-size:.48rem;
  cursor:pointer;
}

.shop-history-list{
  display:grid;
  gap:.26rem;
}

.shop-history-list>article{
  min-height:3.2rem;
  display:grid;
  grid-template-columns:2rem minmax(0,1fr) auto;
  align-items:center;
  gap:.45rem;
  padding:.38rem .45rem;
  border:1px solid rgba(255,255,255,.04);
  border-radius:.5rem;
  background:rgba(255,255,255,.004);
}

.shop-history-icon{
  width:1.85rem;
  height:1.85rem;
  display:grid;
  place-items:center;
  border-radius:.45rem;
  font-size:.7rem;
  font-weight:900;
}

.shop-history-icon.plus{color:#75d992;background:rgba(72,192,104,.025)}
.shop-history-icon.minus{color:#e8798b;background:rgba(255,48,79,.025)}

.shop-history-list article span,
.shop-history-list article strong,
.shop-history-list article small,
.shop-history-list article b{display:block}

.shop-history-list article span{color:#6d747d;font-size:.43rem;font-weight:900}
.shop-history-list article strong{margin-top:.08rem;color:#aab2b9;font-size:.58rem}
.shop-history-list article small{margin-top:.08rem;color:#5f6870;font-size:.47rem}

.shop-history-value{text-align:right}
.shop-history-value>strong{color:#d6ae67!important}
.shop-history-value>b{margin-top:.08rem;color:#6c7580;font-size:.41rem;font-weight:700}

.shop-paid-orders{
  margin-top:.7rem;
  padding-top:.6rem;
  border-top:1px solid rgba(255,255,255,.045);
}

.shop-paid-orders>span{
  color:#74616a;
  font-size:.48rem;
  font-weight:900;
}

#shopAdminOrders{
  display:grid;
  gap:.25rem;
  margin-top:.35rem;
}

#shopAdminOrders>article{
  display:grid;
  grid-template-columns:7rem minmax(0,1fr) auto;
  gap:.4rem;
  padding:.4rem;
  border:1px solid rgba(255,255,255,.04);
  border-radius:.48rem;
  background:rgba(255,255,255,.004);
}

#shopAdminOrders span{color:#70616a;font-size:.44rem;font-weight:900}
#shopAdminOrders strong{color:#a9b1b8;font-size:.55rem}
#shopAdminOrders small{color:#68727a;font-size:.49rem}

.shop-history-empty{
  padding:.7rem;
  color:#657078;
  font-size:.55rem;
  text-align:center;
}

/* ---------------------------------------------------------
   Public profile purchased benefits
   --------------------------------------------------------- */

.public-profile-benefits{
  margin-top:.6rem;
  padding:.58rem;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.58rem;
  background:rgba(255,255,255,.004);
}

.public-profile-benefits-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
  margin-bottom:.4rem;
}

.public-profile-benefits-head>span{
  color:#6d777f;
  font-size:.49rem;
  font-weight:900;
  letter-spacing:.07em;
}

.public-profile-benefits-head>small{
  min-width:1.35rem;
  height:1.35rem;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.38rem;
  color:#7d8790;
  background:rgba(255,255,255,.005);
  font-size:.48rem;
}

.public-profile-benefits-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.35rem;
}

.public-profile-benefit-card{
  min-height:3.7rem;
  display:grid;
  grid-template-columns:3rem minmax(0,1fr) auto;
  align-items:center;
  gap:.4rem;
  padding:.35rem;
  border:1px solid rgba(255,255,255,.04);
  border-radius:.5rem;
  background:rgba(255,255,255,.004);
}

.public-profile-benefit-card img{
  width:2.85rem;
  height:2.85rem;
  object-fit:cover;
  border-radius:.45rem;
}

.public-profile-benefit-card span,
.public-profile-benefit-card strong,
.public-profile-benefit-card small{display:block}

.public-profile-benefit-card span{color:#6e6065;font-size:.41rem;font-weight:900}
.public-profile-benefit-card strong{margin-top:.08rem;color:#aeb6bd;font-size:.56rem}
.public-profile-benefit-card small{margin-top:.09rem;color:#69737b;font-size:.47rem}
.public-profile-benefit-card>b{color:#d37d8b;font-size:.65rem}

.public-profile-benefits-empty{
  grid-column:1/-1;
  padding:.6rem;
  color:#657078;
  font-size:.53rem;
  text-align:center;
}

/* ---------------------------------------------------------
   Terms legal/payment readability
   --------------------------------------------------------- */

#termsVirtual .terms-appeal strong{
  line-height:1.5;
}

#termsDigital,
#termsConsumer{
  scroll-margin-top:7rem;
}

/* ---------------------------------------------------------
   Responsive
   --------------------------------------------------------- */

@media(max-width:900px){
  .shop-admin-pane[data-shop-admin-pane="items"]{
    grid-template-columns:1fr;
  }

  .shop-admin-item-list{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .mini-shop-head-actions{
    flex-direction:column;
  }
}

@media(max-width:680px){
  .avatar-menu-hint{
    display:none!important;
  }

  .vial-reward-flow{
    grid-template-columns:1fr;
  }

  .vial-reward-flow>i{
    transform:rotate(90deg);
    justify-self:center;
  }

  .shop-admin-grid-two,
  .public-profile-benefits-grid{
    grid-template-columns:1fr;
  }

  .shop-admin-item-list{
    grid-template-columns:1fr;
  }

  #shopAdminOrders{
    overflow-x:auto;
  }
}


/* =========================================================
   V33 — NAVBAR AVATAR FIX / SHOP POLISH / MINI SHOP CHANNEL
   ========================================================= */

/* ---------------------------------------------------------
   Hard override for old navbar CSS that hid ALL spans.
   --------------------------------------------------------- */

.top-user{
  width:auto!important;
  min-width:7.8rem!important;
  height:3.05rem!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:.42rem!important;
  padding:.18rem .42rem .18rem .2rem!important;
  border:1px solid rgba(255,255,255,.045)!important;
  border-radius:1rem!important;
  background:rgba(255,255,255,.005)!important;
}

.top-user:hover,
.top-user.active{
  border-color:rgba(255,58,85,.10)!important;
  background:rgba(255,48,79,.012)!important;
}

.top-user .topbar-avatar-shell{
  width:2.5rem!important;
  height:2.5rem!important;
  display:block!important;
  flex:0 0 2.5rem!important;
}

.top-user .topbar-avatar-shell>img{
  width:2.5rem!important;
  height:2.5rem!important;
  display:block!important;
  margin:0!important;
  border:1px solid rgba(255,255,255,.10)!important;
  border-radius:50%!important;
}

.top-user .topbar-user-copy{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
}

.top-user .topbar-user-copy>strong{
  display:block!important;
  max-width:7rem!important;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#d9dde0;
  font-size:.61rem!important;
}

.top-user .topbar-user-copy>small{
  display:block!important;
  margin-top:.07rem;
  color:#755d64;
  font-size:.39rem!important;
  font-weight:900;
  letter-spacing:.08em;
}

.top-user>b{
  display:block!important;
  color:#657078!important;
  font-size:.52rem!important;
}

.top-user .avatar-menu-hint:not(.hidden){
  display:block!important;
}

.avatar-menu-hint{
  right:.35rem!important;
  top:calc(100% + .72rem)!important;
  min-width:11.6rem!important;
  padding:.52rem .62rem!important;
  color:#f0d7dc!important;
  border-color:rgba(255,58,85,.18)!important;
  background:rgba(7,11,16,.99)!important;
  font-size:.51rem!important;
}

@media(max-width:780px){
  .top-user{
    width:3rem!important;
    min-width:3rem!important;
    padding:.2rem!important;
  }
  .top-user .topbar-user-copy,
  .top-user>b{
    display:none!important;
  }
}

/* ---------------------------------------------------------
   Floating VIAL wallet — only visible in shop view
   --------------------------------------------------------- */

.shop-floating-wallet{
  width:6.6rem;
  position:fixed;
  left:max(.6rem,calc(50vw - 41.2rem));
  top:7.1rem;
  z-index:150;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:.55rem .45rem;
  border:1px solid rgba(214,166,78,.10);
  border-radius:.75rem;
  background:
    radial-gradient(circle at 50% 12%,rgba(218,165,66,.065),transparent 36%),
    rgba(6,10,14,.965);
  box-shadow:0 .8rem 2rem rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.022);
  backdrop-filter:blur(.65rem);
  -webkit-backdrop-filter:blur(.65rem);
}

.shop-floating-vial-mark{
  width:3.15rem;
  height:3.65rem;
  display:grid;
  place-items:center;
}

.shop-floating-vial-mark img{
  width:100%;
  height:100%;
  object-fit:contain;
  filter:drop-shadow(0 0 .75rem rgba(255,48,79,.14));
}

.shop-floating-wallet>span{
  margin-top:.12rem;
  color:#716653;
  font-size:.41rem;
  font-weight:900;
  letter-spacing:.07em;
}

.shop-floating-wallet>strong{
  margin-top:.12rem;
  color:#deb45f;
  font-size:.76rem;
}

.shop-floating-wallet>button{
  width:100%;
  min-height:2rem;
  margin-top:.44rem;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.25rem;
  border:1px solid rgba(221,169,77,.12);
  border-radius:.48rem;
  color:#dcb361;
  background:rgba(213,161,69,.018);
  font-size:.45rem;
  font-weight:900;
  cursor:pointer;
}

.shop-floating-wallet>button i{
  font-size:.72rem;
  font-style:normal;
}

.shop-floating-wallet>button:hover{
  border-color:rgba(221,169,77,.20);
  background:rgba(213,161,69,.035);
}

@media(max-width:1330px){
  .shop-floating-wallet{
    left:.65rem;
    top:auto;
    bottom:5.1rem;
  }
}

@media(max-width:760px){
  .shop-floating-wallet{
    width:auto;
    left:.7rem;
    right:.7rem;
    bottom:4.8rem;
    top:auto;
    flex-direction:row;
    justify-content:center;
    gap:.45rem;
    padding:.34rem .45rem;
  }
  .shop-floating-vial-mark{width:1.8rem;height:2rem}
  .shop-floating-wallet>span{display:none}
  .shop-floating-wallet>button{width:auto;margin:0;padding:0 .5rem}
}

/* ---------------------------------------------------------
   Shop economy / Game Sync redesign
   --------------------------------------------------------- */

.shop-economy-v33{
  display:grid;
  grid-template-columns:minmax(0,1.65fr) minmax(15rem,.85fr);
  gap:.52rem;
  margin:.62rem .75rem 0;
}

.shop-economy-main,
.shop-game-sync-v33{
  border:1px solid rgba(255,255,255,.05);
  border-radius:.72rem;
  background:rgba(255,255,255,.005);
}

.shop-economy-main{
  padding:.7rem .74rem;
  background:
    radial-gradient(circle at 8% 18%,rgba(80,202,114,.045),transparent 31%),
    rgba(255,255,255,.005);
}

.shop-economy-title>span{
  color:#709078;
  font-size:.49rem;
  font-weight:900;
  letter-spacing:.08em;
}

.shop-economy-title h3{
  margin:.15rem 0 0;
  color:#c4d3c8;
  font-size:.80rem;
}

.shop-economy-title p{
  margin:.22rem 0 0;
  color:#8b959d;
  font-size:.64rem;
  line-height:1.52;
}

.shop-economy-steps{
  display:grid;
  grid-template-columns:auto auto auto auto minmax(10rem,1fr);
  align-items:center;
  gap:.36rem;
  margin-top:.58rem;
}

.shop-economy-steps>div{
  min-height:3.55rem;
  display:grid;
  grid-template-columns:1.7rem auto;
  grid-template-rows:auto auto;
  align-items:center;
  column-gap:.36rem;
  padding:.4rem .48rem;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.54rem;
  background:rgba(255,255,255,.005);
}

.shop-economy-steps .economy-icon{
  grid-row:1/3;
  width:1.55rem;
  height:1.55rem;
  display:grid;
  place-items:center;
  border-radius:.44rem;
  color:#c99964;
  background:rgba(201,141,68,.025);
  font-size:.68rem;
}

.shop-economy-steps .economy-icon.infect{
  color:#d46a77;
  background:rgba(214,67,86,.025);
}

.shop-economy-steps .economy-icon.vial{
  color:#e0b35f;
  background:rgba(213,163,69,.03);
  font-weight:950;
}

.shop-economy-steps strong{
  color:#c8cfd4;
  font-size:.62rem;
}

.shop-economy-steps small{
  color:#69737b;
  font-size:.49rem;
}

.shop-economy-steps>i{
  color:#535d65;
  font-size:.72rem;
  font-style:normal;
}

.shop-economy-steps .economy-result{
  border-color:rgba(216,169,80,.09);
}

.shop-economy-steps .economy-result strong{
  color:#dfb562;
}

.shop-game-sync-v33{
  display:grid;
  grid-template-columns:2.8rem minmax(0,1fr);
  align-content:center;
  gap:.58rem;
  padding:.72rem;
  border-color:rgba(87,201,118,.07);
  background:
    radial-gradient(circle at 12% 20%,rgba(76,198,109,.04),transparent 34%),
    rgba(255,255,255,.004);
}

.game-sync-icon{
  width:2.6rem;
  height:2.6rem;
  display:grid;
  place-items:center;
  border:1px solid rgba(83,209,118,.10);
  border-radius:.64rem;
  color:#73d792;
  background:rgba(70,192,103,.02);
}

.game-sync-icon svg{
  width:1.35rem;
  height:1.35rem;
  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.shop-game-sync-v33 span{
  color:#63816b;
  font-size:.50rem;
  font-weight:950;
  letter-spacing:.085em;
}

.shop-game-sync-v33 h3{
  margin:.12rem 0 0;
  color:#b7d5bf;
  font-size:.82rem;
}

.shop-game-sync-v33 p{
  margin:.26rem 0 0;
  color:#929ca4;
  font-size:.65rem;
  line-height:1.58;
}

.shop-game-sync-v33 small{
  display:block;
  margin-top:.28rem;
  color:#68727b;
  font-size:.53rem;
  line-height:1.45;
}

/* ---------------------------------------------------------
   Product art: no stretching
   --------------------------------------------------------- */

.zombie-media{
  height:13rem!important;
  min-height:13rem!important;
  display:flex!important;
  align-items:flex-end!important;
  justify-content:center!important;
  background:
    radial-gradient(circle at 50% 38%,rgba(104,49,135,.085),transparent 58%),
    #06080c!important;
  overflow:hidden!important;
}

.zombie-media img{
  display:block!important;
  width:auto!important;
  height:100%!important;
  max-width:100%!important;
  object-fit:contain!important;
  object-position:center bottom!important;
  transform:none!important;
  filter:none!important;
}

.weapon-media{
  height:13rem!important;
  min-height:13rem!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:.8rem!important;
  box-sizing:border-box!important;
  background:
    radial-gradient(circle at 50% 46%,rgba(49,105,168,.065),transparent 58%),
    #06090d!important;
}

.weapon-media img{
  width:100%!important;
  height:auto!important;
  max-height:8rem!important;
  object-fit:contain!important;
  object-position:center!important;
  filter:none!important;
  transform:none!important;
}

.weapon-card .mini-shop-card-body h3{
  color:#82baf4!important;
}

/* ---------------------------------------------------------
   Recent purchases — remembered collapse
   --------------------------------------------------------- */

.shop-recent-purchases{
  margin-top:.55rem;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.58rem;
  background:rgba(255,255,255,.004);
  overflow:hidden;
}

.shop-recent-purchases>header{
  min-height:2.75rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.45rem;
  padding:.4rem .48rem;
}

.shop-recent-purchases>header span,
.shop-recent-purchases>header strong{
  display:block;
}

.shop-recent-purchases>header span{
  color:#765f66;
  font-size:.43rem;
  font-weight:900;
  letter-spacing:.07em;
}

.shop-recent-purchases>header strong{
  margin-top:.06rem;
  color:#aeb5bb;
  font-size:.54rem;
}

.shop-recent-purchases>header button{
  width:1.55rem;
  height:1.55rem;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.42rem;
  color:#78828a;
  background:rgba(255,255,255,.005);
  cursor:pointer;
}

#shopRecentPurchasesBody{
  display:grid;
  gap:.25rem;
  padding:.05rem .4rem .4rem;
}

.shop-recent-purchases.collapsed #shopRecentPurchasesBody{
  display:none!important;
}

.shop-recent-row{
  min-height:3.45rem;
  display:grid;
  grid-template-columns:2.5rem minmax(0,1fr) 2.4rem;
  align-items:center;
  gap:.4rem;
  padding:.34rem;
  border:1px solid rgba(255,255,255,.035);
  border-radius:.48rem;
  background:rgba(255,255,255,.004);
}

.shop-recent-avatar{
  width:2.35rem;
  height:2.35rem;
  padding:0;
  border:0;
  border-radius:.48rem;
  overflow:hidden;
  background:transparent;
  cursor:pointer;
}

.shop-recent-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.shop-recent-row>div{
  min-width:0;
}

.shop-recent-row strong,
.shop-recent-row span,
.shop-recent-row small{
  display:block;
}

.shop-recent-row strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#aeb6bd;
  font-size:.55rem;
}

.shop-recent-row span{
  margin-top:.09rem;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#bc7890;
  font-size:.49rem;
  font-weight:750;
}

.shop-recent-row small{
  margin-top:.08rem;
  color:#626d75;
  font-size:.45rem;
}

.shop-recent-product{
  width:2.3rem;
  height:2.3rem;
  object-fit:contain;
  border-radius:.42rem;
  background:#080b10;
}

.shop-recent-empty{
  padding:.55rem;
  color:#68727a;
  font-size:.51rem;
  line-height:1.45;
  text-align:center;
}

/* ---------------------------------------------------------
   Mini Shop read-only message channel
   --------------------------------------------------------- */

.shop-system-conversation{
  border-color:rgba(214,165,75,.045)!important;
}

.shop-channel-avatar{
  color:#deb45f!important;
  background:
    radial-gradient(circle,rgba(213,164,72,.07),rgba(213,164,72,.015))!important;
}

.shop-chat-avatar{
  object-fit:contain!important;
  padding:.28rem!important;
  box-sizing:border-box!important;
  background:#0a0d11!important;
}

.shop-notification-card{
  display:grid;
  grid-template-columns:3rem minmax(0,1fr) auto;
  align-items:start;
  gap:.62rem;
  margin:.45rem;
  padding:.62rem;
  border:1px solid rgba(214,165,75,.075);
  border-radius:.68rem;
  background:
    radial-gradient(circle at 8% 20%,rgba(218,168,78,.05),transparent 28%),
    rgba(255,255,255,.005);
}

.shop-notification-icon{
  width:2.8rem;
  height:2.8rem;
  display:grid;
  place-items:center;
  border:1px solid rgba(219,169,77,.10);
  border-radius:.64rem;
  color:#dfb562;
  background:rgba(214,161,69,.025);
  font-size:.9rem;
  font-weight:950;
}

.shop-notification-copy>span,
.shop-notification-copy>strong,
.shop-notification-copy>small,
.shop-notification-copy>time{
  display:block;
}

.shop-notification-copy>span{
  color:#796750;
  font-size:.45rem;
  font-weight:900;
  letter-spacing:.075em;
}

.shop-notification-copy>strong{
  margin-top:.12rem;
  color:#d8c9aa;
  font-size:.72rem;
}

.shop-notification-copy>p{
  margin:.26rem 0 0;
  color:#919ba3;
  font-size:.62rem;
  line-height:1.52;
}

.shop-notification-copy>small{
  margin-top:.26rem;
  color:#796d5a;
  font-size:.49rem;
  font-weight:800;
}

.shop-notification-copy>time{
  margin-top:.22rem;
  color:#606a72;
  font-size:.46rem;
}

.shop-notification-card>b{
  color:#e0b45f;
  font-size:.64rem;
  white-space:nowrap;
}

.shop-channel-empty>span{
  color:#deb45f!important;
}

/* Make Mini Shop text generally easier to read */
.mini-shop-v30{
  font-size:1.04em;
}

.mini-shop-card-body h3{
  font-size:1.04rem!important;
}

.mini-shop-card-body>p{
  color:#a0a8af!important;
  font-size:.71rem!important;
  line-height:1.66!important;
}

.mini-shop-feature-list>span{
  color:#99a2a9!important;
  font-size:.64rem!important;
}

.mini-shop-active-products>header>span{
  font-size:.54rem!important;
}

.mini-shop-active-item strong{
  font-size:.61rem!important;
}

.mini-shop-active-item small{
  font-size:.52rem!important;
}

/* Floating wallet removed from header means admin button can breathe */
.mini-shop-head-actions{
  justify-self:end;
}

@media(max-width:950px){
  .shop-economy-v33{
    grid-template-columns:1fr;
  }
}

@media(max-width:720px){
  .shop-economy-steps{
    grid-template-columns:1fr;
  }
  .shop-economy-steps>i{
    justify-self:center;
    transform:rotate(90deg);
  }
}


/* =========================================================
   V34 — MOBILE REBUILD / BANLIST 2.0 / BENEFIT CANCEL
   ========================================================= */

/* Guest safety: legacy display overrides must never expose account UI. */
.top-user.hidden,
body:not(.is-authenticated) #topbarUserButton,
body:not(.is-authenticated) #accountPopover,
.shop-floating-wallet.hidden,
body:not(.is-authenticated) #shopFloatingWallet,
body:not(.is-authenticated) #topbarYunBox,
body:not(.is-authenticated) #topbarLevelBox,
body:not(.is-authenticated) #topbarVipBox,
body:not(.is-authenticated) #topbarPlayerIdBox{
  display:none!important;
}

/* ---------------------------------------------------------
   VIAL package progression
   --------------------------------------------------------- */

.vial-tier-10{
  border-color:rgba(80,218,113,.09)!important;
  background:radial-gradient(circle at 50% 12%,rgba(70,216,106,.055),transparent 42%),rgba(255,255,255,.005)!important;
}
.vial-tier-10 .vial-package-price{color:#75dc92!important}
.vial-tier-10 .vial-package-art img{filter:drop-shadow(0 0 .85rem rgba(58,220,104,.23))!important}

.vial-tier-100{
  border-color:rgba(71,155,244,.10)!important;
  background:radial-gradient(circle at 50% 12%,rgba(54,145,244,.065),transparent 42%),rgba(255,255,255,.005)!important;
}
.vial-tier-100 .vial-package-price{color:#78b9ff!important}
.vial-tier-100 .vial-package-art img{filter:drop-shadow(0 0 .9rem rgba(56,151,255,.24))!important}

.vial-tier-300{
  border-color:rgba(172,87,229,.11)!important;
  background:radial-gradient(circle at 50% 12%,rgba(157,70,220,.075),transparent 42%),rgba(255,255,255,.005)!important;
}
.vial-tier-300 .vial-package-price{color:#cc91f5!important}
.vial-tier-300 .vial-package-art img{filter:drop-shadow(0 0 .95rem rgba(174,77,234,.27))!important}

.vial-tier-500{
  border-color:rgba(230,179,69,.13)!important;
  background:radial-gradient(circle at 50% 12%,rgba(225,167,52,.09),transparent 42%),rgba(255,255,255,.005)!important;
}
.vial-tier-500 .vial-package-price{color:#f0c35e!important}
.vial-tier-500 .vial-package-art img{filter:drop-shadow(0 0 1rem rgba(239,181,55,.30))!important}

/* ---------------------------------------------------------
   Active benefits: cancel + 5/page
   --------------------------------------------------------- */

.mini-shop-active-item{
  grid-template-columns:2.15rem minmax(0,1fr) auto!important;
}

.mini-shop-active-actions{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:.24rem;
}

.mini-shop-active-actions>i{
  color:#71887a;
  font-size:.43rem;
  font-style:normal;
  font-weight:900;
}

.mini-shop-active-actions>button{
  min-height:1.55rem;
  max-width:8.2rem;
  padding:0 .35rem;
  border:1px solid rgba(255,74,98,.075);
  border-radius:.38rem;
  color:#85626a;
  background:rgba(255,48,79,.008);
  font-size:.39rem;
  font-weight:900;
  line-height:1.12;
  cursor:pointer;
  transition:.14s ease;
}

.mini-shop-active-actions>button:hover{
  color:#e08796;
  border-color:rgba(255,74,98,.14);
  background:rgba(255,48,79,.02);
}

.mini-shop-active-actions>button.confirming{
  color:#ff899b;
  border-color:rgba(255,74,98,.22);
  background:rgba(255,48,79,.045);
}

.mini-shop-benefits-pagination{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.22rem;
  margin-top:.42rem;
}

.mini-shop-benefits-pagination button,
.mini-shop-benefits-pagination span{
  min-width:1.55rem;
  height:1.55rem;
  display:grid;
  place-items:center;
  padding:0 .25rem;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.4rem;
  color:#707a82;
  background:rgba(255,255,255,.005);
  font-size:.47rem;
}

.mini-shop-benefits-pagination button{
  cursor:pointer;
}

.mini-shop-benefits-pagination button.active{
  color:#f1d5da;
  border-color:rgba(255,58,85,.12);
  background:rgba(255,48,79,.025);
}

/* ---------------------------------------------------------
   Banlist V34
   --------------------------------------------------------- */

.banlist-v34{
  width:min(58rem,94vw)!important;
  max-height:min(46rem,86vh)!important;
}

.banlist-v34-body{
  overflow:auto;
  padding:.68rem;
}

.banlist-me-status{
  min-height:4.6rem;
  display:grid;
  grid-template-columns:3rem minmax(0,1fr) auto;
  align-items:center;
  gap:.58rem;
  padding:.58rem .65rem;
  border:1px solid rgba(77,205,111,.10);
  border-radius:.68rem;
  background:radial-gradient(circle at 4% 50%,rgba(70,198,104,.055),transparent 27%),rgba(255,255,255,.004);
}

.banlist-me-status.banned{
  border-color:rgba(255,69,95,.12);
  background:radial-gradient(circle at 4% 50%,rgba(255,48,79,.06),transparent 27%),rgba(255,255,255,.004);
}

.banlist-me-icon{
  width:2.7rem;
  height:2.7rem;
  display:grid;
  place-items:center;
  border:1px solid rgba(79,211,115,.11);
  border-radius:.6rem;
  color:#76dc94;
  background:rgba(69,190,103,.025);
  font-size:.9rem;
  font-weight:900;
}

.banlist-me-status.banned .banlist-me-icon{
  color:#ff7288;
  border-color:rgba(255,58,85,.13);
  background:rgba(255,48,79,.025);
}

.banlist-me-status>div:nth-child(2)>span,
.banlist-me-status>div:nth-child(2)>strong,
.banlist-me-status>div:nth-child(2)>small{
  display:block;
}

.banlist-me-status>div:nth-child(2)>span{
  color:#66806d;
  font-size:.47rem;
  font-weight:900;
  letter-spacing:.075em;
}

.banlist-me-status>div:nth-child(2)>strong{
  margin-top:.12rem;
  color:#b8d5bf;
  font-size:.70rem;
}

.banlist-me-status>div:nth-child(2)>small{
  margin-top:.12rem;
  color:#738078;
  font-size:.54rem;
}

.banlist-me-status>button{
  min-height:2.25rem;
  padding:0 .58rem;
  border:1px solid rgba(255,58,85,.10);
  border-radius:.5rem;
  color:#cf7b89;
  background:rgba(255,48,79,.014);
  font-size:.50rem;
  font-weight:900;
  cursor:pointer;
}

.banlist-public-panel,
.banlist-admin-panel{
  margin-top:.58rem;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.68rem;
  background:rgba(255,255,255,.003);
  overflow:hidden;
}

.banlist-public-toolbar{
  min-height:4rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.7rem;
  padding:.55rem .65rem;
  border-bottom:1px solid rgba(255,255,255,.04);
}

.banlist-public-toolbar>div>span,
.banlist-public-toolbar>div>strong{
  display:block;
}

.banlist-public-toolbar>div>span{
  color:#756168;
  font-size:.47rem;
  font-weight:900;
  letter-spacing:.075em;
}

.banlist-public-toolbar>div>strong{
  margin-top:.1rem;
  color:#9da6ad;
  font-size:.59rem;
}

.banlist-public-search{
  width:min(23rem,58%);
  min-height:2.35rem;
  display:grid;
  grid-template-columns:1.7rem minmax(0,1fr);
  align-items:center;
  border:1px solid rgba(255,255,255,.055);
  border-radius:.52rem;
  background:#080d12;
}

.banlist-public-search>span{
  display:grid;
  place-items:center;
  color:#69737b;
}

.banlist-public-search input{
  width:100%;
  min-width:0;
  height:100%;
  padding:0 .45rem 0 0;
  border:0;
  outline:0;
  color:#d5dbe0;
  background:transparent;
  font:inherit;
  font-size:.59rem;
}

.banlist-public-list{
  display:grid;
  gap:.28rem;
  padding:.5rem;
}

.banlist-history-row{
  min-height:5.7rem;
  display:grid;
  grid-template-columns:5rem minmax(0,1fr) auto;
  align-items:center;
  gap:.55rem;
  padding:.48rem;
  border:1px solid rgba(255,255,255,.04);
  border-radius:.58rem;
  background:rgba(255,255,255,.004);
}

.banlist-history-row.active{
  border-color:rgba(255,65,90,.075);
}

.banlist-history-status{
  min-height:3.6rem;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.04);
  border-radius:.5rem;
  background:rgba(255,255,255,.004);
}

.banlist-history-status span{
  color:#818a92;
  font-size:.48rem;
  font-weight:900;
}

.banlist-history-row.active .banlist-history-status span{color:#e47687}
.banlist-history-row.expired .banlist-history-status span{color:#b29465}
.banlist-history-row.revoked .banlist-history-status span{color:#6f9479}

.banlist-history-status small{
  margin-top:.12rem;
  color:#5c666e;
  font-size:.43rem;
}

.banlist-history-main{
  min-width:0;
}

.banlist-history-title{
  display:flex;
  align-items:center;
  gap:.35rem;
}

.banlist-history-title strong{
  color:#b7bec4;
  font-size:.65rem;
}

.banlist-history-title span{
  min-height:1.3rem;
  display:inline-flex;
  align-items:center;
  padding:0 .3rem;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.35rem;
  color:#6e7880;
  font-size:.42rem;
  font-weight:900;
}

.banlist-history-main p{
  margin:.23rem 0 0;
  color:#929ca4;
  font-size:.58rem;
  line-height:1.45;
}

.banlist-history-meta{
  display:flex;
  flex-wrap:wrap;
  gap:.22rem .52rem;
  margin-top:.3rem;
}

.banlist-history-meta span{
  color:#667078;
  font-size:.47rem;
}

.banlist-history-meta b{
  color:#7c858d;
  font-weight:850;
}

.banlist-pagination{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.22rem;
  padding:.2rem .5rem .58rem;
}

.banlist-pagination button,
.banlist-pagination span{
  min-width:1.7rem;
  height:1.7rem;
  display:grid;
  place-items:center;
  padding:0 .28rem;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.42rem;
  color:#717b83;
  background:rgba(255,255,255,.005);
  font-size:.48rem;
}

.banlist-pagination button{cursor:pointer}
.banlist-pagination button:disabled{opacity:.32;cursor:default}
.banlist-pagination button.active{
  color:#edd6da;
  border-color:rgba(255,58,85,.11);
  background:rgba(255,48,79,.022);
}

.banlist-admin-panel>header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
  padding:.5rem .65rem;
  border-bottom:1px solid rgba(255,255,255,.04);
}

.banlist-admin-panel>header span,
.banlist-admin-panel>header strong{
  display:block;
}

.banlist-admin-panel>header span{
  color:#765f67;
  font-size:.44rem;
  font-weight:900;
  letter-spacing:.08em;
}

.banlist-admin-panel>header strong{
  margin-top:.08rem;
  color:#aab2b9;
  font-size:.59rem;
}

.banlist-admin-panel>header small{
  color:#606a72;
  font-size:.48rem;
}

.banlist-admin-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);
  gap:.55rem;
  padding:.55rem;
}

/* ---------------------------------------------------------
   COMPLETE MOBILE PASS
   --------------------------------------------------------- */

html,body{
  max-width:100%;
  overflow-x:hidden;
}

@media(max-width:900px){
  body{
    padding-bottom:calc(5rem + env(safe-area-inset-bottom));
  }

  .portal-topbar{
    min-height:4.25rem!important;
    height:auto!important;
    padding:.42rem .55rem!important;
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:.4rem!important;
  }

  .portal-topbar .brand{
    min-width:0!important;
  }

  .portal-topbar .brand-x{
    font-size:2rem!important;
  }

  .portal-topbar .brand-copy strong{
    font-size:.72rem!important;
  }

  .portal-topbar .brand-copy small{
    font-size:.40rem!important;
  }

  .portal-statusbar{
    grid-column:1/-1!important;
    grid-row:2!important;
    width:100%!important;
    display:flex!important;
    overflow-x:auto!important;
    gap:.3rem!important;
    padding:.2rem 0 0!important;
    scrollbar-width:none;
  }

  .portal-statusbar::-webkit-scrollbar{display:none}

  body:not(.is-authenticated) .portal-statusbar{
    grid-column:1/2!important;
    grid-row:1!important;
    justify-self:end!important;
    width:auto!important;
    overflow:visible!important;
    padding:0!important;
  }

  body:not(.is-authenticated) .portal-statusbar .portal-status{
    min-height:2.1rem!important;
  }

  .portal-status{
    flex:0 0 auto!important;
  }

  .portal-top-actions{
    min-width:0!important;
    justify-self:end!important;
    gap:.3rem!important;
  }

  .discord-nav-badge{
    display:none!important;
  }

  .top-guest-actions{
    display:flex!important;
    gap:.25rem!important;
  }

  .nav-auth-login,
  .nav-auth-register{
    min-height:2.15rem!important;
    padding:0 .48rem!important;
    font-size:.48rem!important;
  }

  .nav-auth-login>span,
  .nav-auth-register>span{
    display:none!important;
  }

  .top-user{
    min-width:3.1rem!important;
    width:auto!important;
    height:2.75rem!important;
  }

  .top-user .topbar-avatar-shell,
  .top-user .topbar-avatar-shell>img{
    width:2.25rem!important;
    height:2.25rem!important;
  }

  .top-user .topbar-user-copy{
    display:none!important;
  }

  .account-popover{
    width:calc(100vw - 1rem)!important;
    max-width:none!important;
    position:fixed!important;
    left:.5rem!important;
    right:.5rem!important;
    top:4.4rem!important;
    max-height:calc(100vh - 5.2rem)!important;
    overflow:auto!important;
    border-radius:.78rem!important;
  }

  .account-popover-arrow{
    display:none!important;
  }

  .account-quick-actions{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .portal-main{
    width:100%!important;
    max-width:none!important;
    box-sizing:border-box!important;
    padding-left:.55rem!important;
    padding-right:.55rem!important;
  }

  .index-hero{
    min-height:25rem!important;
    height:auto!important;
    padding:4.2rem .4rem 2rem!important;
  }

  .hero-title-block{
    width:100%!important;
    max-width:34rem!important;
  }

  .hero-title-block h1{
    font-size:clamp(2.35rem,14vw,4.2rem)!important;
    line-height:.9!important;
  }

  .hero-title-block h2{
    font-size:clamp(1.1rem,6vw,1.7rem)!important;
  }

  .hero-title-block>p{
    max-width:27rem!important;
    font-size:.72rem!important;
    line-height:1.55!important;
  }

  .index-play{
    width:min(100%,24rem)!important;
  }

  .index-server-badges{
    justify-content:center!important;
    gap:.28rem!important;
  }

  .index-server-badges>span{
    font-size:.48rem!important;
  }

  .portal-main>.auth-shell{
    width:100%!important;
    max-width:32rem!important;
  }

  .portal-main .auth{
    width:100%!important;
    box-sizing:border-box!important;
    padding-left:.75rem!important;
    padding-right:.75rem!important;
  }

  .portal-main .auth-heading h1{
    font-size:clamp(1.7rem,9vw,2.35rem)!important;
  }

  .portal-main .field{
    min-height:3.25rem!important;
  }

  .portal-main .social{
    grid-template-columns:1fr!important;
  }

  .player-dashboard,
  .portal-workspace,
  .mini-shop-v30{
    width:100%!important;
    max-width:none!important;
    box-sizing:border-box!important;
  }

  .mini-shop-v30-head{
    grid-template-columns:auto minmax(0,1fr)!important;
    gap:.5rem!important;
  }

  .mini-shop-head-actions{
    grid-column:1/-1!important;
    width:100%!important;
  }

  .mini-shop-admin-button{
    width:100%!important;
    min-height:2.3rem!important;
  }

  .mini-shop-active-banner{
    width:calc(100% - 1.5rem)!important;
    max-width:none!important;
    box-sizing:border-box!important;
  }

  .mini-shop-v30-grid{
    grid-template-columns:1fr!important;
    padding:.55rem!important;
  }

  .mini-shop-products{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .mini-shop-active-products{
    order:-1;
  }

  .vial-package-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .shop-economy-v33{
    grid-template-columns:1fr!important;
    margin:.55rem!important;
  }

  .shop-economy-steps{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }

  .shop-economy-steps>i{
    display:none!important;
  }

  .shop-economy-steps .economy-result{
    grid-column:1/-1!important;
  }

  .forum-browser,
  .forum-browser-v21{
    display:block!important;
  }

  .forum-sidebar,
  .forum-sidebar-v21{
    width:100%!important;
    border-right:0!important;
    border-bottom:1px solid rgba(255,255,255,.045)!important;
  }

  .forum-categories{
    display:flex!important;
    gap:.3rem!important;
    overflow-x:auto!important;
    padding-bottom:.3rem!important;
    scrollbar-width:none;
  }

  .forum-categories::-webkit-scrollbar{display:none}

  .forum-category-row{
    flex:0 0 min(15rem,78vw)!important;
    margin:0!important;
  }

  .forum-new-topic-side{
    display:none!important;
  }

  .forum-main,
  .forum-main-v21{
    width:100%!important;
  }

  .forum-list-heading{
    align-items:stretch!important;
    flex-direction:column!important;
    gap:.48rem!important;
  }

  .workspace-search,
  .forum-search-v21{
    width:100%!important;
    max-width:none!important;
  }

  .forum-table-head{
    display:none!important;
  }

  .forum-thread,
  .forum-thread-v21{
    grid-template-columns:minmax(0,1fr)!important;
    gap:.4rem!important;
    padding:.55rem!important;
  }

  .forum-thread-stat{
    display:inline-flex!important;
    align-items:center!important;
    gap:.25rem!important;
    margin-right:.4rem!important;
  }

  .forum-thread-stat.activity{
    display:inline-flex!important;
  }

  .thread-origin,
  .thread-reply{
    grid-template-columns:1fr!important;
  }

  .thread-user-column{
    min-height:auto!important;
    display:grid!important;
    grid-template-columns:3rem auto auto!important;
    align-items:center!important;
    justify-content:start!important;
    gap:.45rem!important;
  }

  .thread-post-content{
    border-left:0!important;
    border-top:1px solid rgba(255,255,255,.04)!important;
  }

  .messages-layout{
    grid-template-columns:1fr!important;
    min-height:auto!important;
  }

  .conversation-list{
    max-height:16rem!important;
    border-right:0!important;
    border-bottom:1px solid rgba(255,255,255,.045)!important;
  }

  .chat-active{
    min-height:32rem!important;
  }

  .terms-layout{
    grid-template-columns:1fr!important;
  }

  .terms-sidebar{
    position:static!important;
    max-height:none!important;
  }

  .terms-index{
    display:flex!important;
    overflow-x:auto!important;
    gap:.28rem!important;
    scrollbar-width:none;
  }

  .terms-index::-webkit-scrollbar{display:none}

  .terms-index button{
    flex:0 0 auto!important;
  }

  .settings-window,
  .admin-reports-window,
  .shop-admin-window,
  .shop-info-window{
    width:calc(100vw - 1rem)!important;
    max-width:none!important;
    max-height:calc(100vh - 1rem)!important;
    border-radius:.8rem!important;
  }

  .settings-screen,
  .admin-reports-screen,
  .shop-admin-screen,
  .shop-info-screen,
  .banlist-screen{
    padding:.5rem!important;
  }

  .radio-v30{
    left:.55rem!important;
    bottom:calc(4.65rem + env(safe-area-inset-bottom))!important;
  }

  .portal-bottom-tabs{
    width:100%!important;
    max-width:none!important;
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    z-index:250!important;
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    gap:0!important;
    padding:.28rem .25rem calc(.28rem + env(safe-area-inset-bottom))!important;
    border-radius:0!important;
    border-left:0!important;
    border-right:0!important;
    border-bottom:0!important;
    background:rgba(6,10,14,.97)!important;
    backdrop-filter:blur(.8rem)!important;
    -webkit-backdrop-filter:blur(.8rem)!important;
  }

  .portal-bottom-tabs.hidden{
    display:none!important;
  }

  .bottom-tab{
    min-width:0!important;
    min-height:3.45rem!important;
    padding:.28rem .15rem!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    gap:.13rem!important;
    border-radius:.48rem!important;
  }

  .bottom-tab>span{
    font-size:.78rem!important;
  }

  .bottom-tab>strong{
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:.40rem!important;
  }

  .dock-notch{
    display:none!important;
  }

  .portal-mini-footer{
    margin-bottom:5.4rem!important;
  }

  .shop-floating-wallet{
    left:.55rem!important;
    right:.55rem!important;
    bottom:calc(4.85rem + env(safe-area-inset-bottom))!important;
    z-index:245!important;
  }

  .banlist-v34{
    width:calc(100vw - 1rem)!important;
    max-width:none!important;
    max-height:calc(100vh - 1rem)!important;
  }

  .banlist-me-status{
    grid-template-columns:2.6rem minmax(0,1fr)!important;
  }

  .banlist-me-status>button{
    grid-column:1/-1!important;
    width:100%!important;
  }

  .banlist-public-toolbar{
    align-items:stretch!important;
    flex-direction:column!important;
  }

  .banlist-public-search{
    width:100%!important;
  }

  .banlist-history-row{
    grid-template-columns:4.3rem minmax(0,1fr)!important;
  }

  .banlist-history-row>.banlist-unban{
    grid-column:1/-1!important;
    width:100%!important;
  }

  .banlist-admin-grid{
    grid-template-columns:1fr!important;
  }
}

@media(max-width:620px){
  .portal-topbar{
    grid-template-columns:auto 1fr auto!important;
  }

  body:not(.is-authenticated) .portal-statusbar{
    display:none!important;
  }

  .brand-copy small{
    display:none!important;
  }

  .top-message-bell,
  .admin-report-bell{
    width:2.2rem!important;
    height:2.2rem!important;
  }

  .mini-shop-v30-head{
    display:flex!important;
    align-items:flex-start!important;
    flex-wrap:wrap!important;
  }

  .mini-shop-back{
    order:2!important;
  }

  .mini-shop-title{
    width:calc(100% - 4.2rem)!important;
  }

  .mini-shop-title h2{
    font-size:1rem!important;
  }

  .mini-shop-title p{
    font-size:.62rem!important;
  }

  .mini-shop-products{
    grid-template-columns:1fr!important;
  }

  .mini-shop-card-media{
    height:12rem!important;
  }

  .mini-shop-filterbar{
    margin:.5rem!important;
    overflow-x:auto!important;
    scrollbar-width:none;
  }

  .mini-shop-filterbar::-webkit-scrollbar{display:none}

  .mini-shop-filterbar .shop-filter{
    flex:0 0 auto!important;
  }

  .vial-package-grid{
    grid-template-columns:1fr!important;
  }

  .vial-store-head{
    grid-template-columns:minmax(0,1fr) 3.8rem!important;
  }

  .shop-economy-steps{
    grid-template-columns:1fr!important;
  }

  .shop-economy-steps .economy-result{
    grid-column:auto!important;
  }

  .mini-shop-active-item{
    grid-template-columns:2.15rem minmax(0,1fr)!important;
  }

  .mini-shop-active-actions{
    grid-column:1/-1!important;
    width:100%!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:space-between!important;
  }

  .mini-shop-active-actions>button{
    max-width:none!important;
  }

  .forum-v21-header{
    align-items:stretch!important;
    flex-direction:column!important;
    gap:.45rem!important;
  }

  .new-topic-button{
    width:100%!important;
  }

  .forum-online-body{
    grid-template-columns:1fr!important;
  }

  .thread-post-head{
    align-items:flex-start!important;
    flex-direction:column!important;
    gap:.18rem!important;
  }

  .messages-workspace{
    padding:0!important;
  }

  .messages-layout{
    border-radius:.65rem!important;
  }

  .chat-header{
    padding:.48rem!important;
  }

  .chat-actions{
    flex-wrap:wrap!important;
    gap:.2rem!important;
  }

  .chat-actions button{
    font-size:.43rem!important;
  }

  .chat-stream{
    padding:.45rem!important;
  }

  .shop-notification-card{
    grid-template-columns:2.6rem minmax(0,1fr)!important;
  }

  .shop-notification-card>b{
    grid-column:2!important;
  }

  .public-profile-window{
    width:calc(100vw - 1rem)!important;
    max-height:calc(100vh - 1rem)!important;
  }

  .public-profile-stats,
  .public-profile-benefits-grid{
    grid-template-columns:1fr!important;
  }

  .shop-admin-pane[data-shop-admin-pane="items"]{
    grid-template-columns:1fr!important;
  }

  .shop-admin-grid-two{
    grid-template-columns:1fr!important;
  }

  .banlist-history-row{
    grid-template-columns:1fr!important;
  }

  .banlist-history-status{
    min-height:2.5rem!important;
    align-items:flex-start!important;
    padding:.35rem .45rem!important;
  }

  .banlist-history-meta{
    flex-direction:column!important;
    gap:.18rem!important;
  }

  .banlist-pagination{
    flex-wrap:wrap!important;
  }

  .x-toast-v31{
    width:calc(100vw - .8rem)!important;
    grid-template-columns:2.3rem minmax(0,1fr) 1.45rem!important;
  }
}

@media(max-width:420px){
  .portal-topbar{
    padding:.35rem .42rem!important;
  }

  .portal-topbar .brand-x{
    font-size:1.75rem!important;
  }

  .portal-topbar .brand-copy strong{
    font-size:.62rem!important;
  }

  .nav-auth-login,
  .nav-auth-register{
    padding:0 .36rem!important;
    font-size:.43rem!important;
  }

  .portal-main{
    padding-left:.38rem!important;
    padding-right:.38rem!important;
  }

  .auth-switch-line{
    align-items:flex-start!important;
    flex-direction:column!important;
  }

  .row{
    align-items:flex-start!important;
    flex-direction:column!important;
    gap:.35rem!important;
  }

  .bottom-tab>strong{
    font-size:.36rem!important;
  }

  .shop-floating-wallet>strong{
    font-size:.66rem!important;
  }
}


/* =========================================================
   V35 — MOBILE NAV AUTH FIX / BANLIST COMPACT REDESIGN
   ========================================================= */

/* ---------------------------------------------------------
   AUTH NAVBAR FIX
   Mobile V34 used display:flex!important on guest actions,
   which could win over the normal hidden state.
   --------------------------------------------------------- */

#topbarGuestActions.hidden,
body.is-authenticated #topbarGuestActions,
body.is-authenticated .top-guest-actions{
  display:none!important;
}

body:not(.is-authenticated) #topbarGuestActions:not(.hidden){
  display:flex!important;
}

/* On authenticated mobile navbar, only account controls remain. */
@media(max-width:900px){
  body.is-authenticated .top-guest-actions,
  body.is-authenticated .nav-auth-login,
  body.is-authenticated .nav-auth-register{
    display:none!important;
  }
}

/* ---------------------------------------------------------
   Bottom dock goes back to 4 sections.
   Banlist is intentionally ONLY inside avatar/account menu.
   --------------------------------------------------------- */

.portal-bottom-tabs-four,
.portal-bottom-tabs-five{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}

@media(max-width:900px){
  .portal-bottom-tabs{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }

  .bottom-tab{
    min-height:3.55rem!important;
  }

  .bottom-tab>strong{
    font-size:.43rem!important;
  }
}

/* ---------------------------------------------------------
   BANLIST V35 — smaller window, much larger readable text
   --------------------------------------------------------- */

.banlist-v34{
  width:min(49rem,92vw)!important;
  max-height:min(41rem,82vh)!important;
  border-radius:.82rem!important;
}

.banlist-header{
  min-height:4.5rem!important;
  padding:.66rem .78rem!important;
}

.banlist-header>div>span{
  font-size:.54rem!important;
  letter-spacing:.08em!important;
}

.banlist-header h2{
  margin-top:.12rem!important;
  font-size:1.18rem!important;
}

.banlist-header p{
  margin-top:.16rem!important;
  color:#849098!important;
  font-size:.66rem!important;
  line-height:1.45!important;
}

.banlist-header>button{
  width:2rem!important;
  height:2rem!important;
  font-size:.86rem!important;
}

.banlist-v34-body{
  padding:.55rem!important;
}

/* My status: compact but clear */
.banlist-me-status{
  min-height:4.15rem!important;
  grid-template-columns:2.65rem minmax(0,1fr) auto!important;
  gap:.55rem!important;
  padding:.5rem .58rem!important;
  border-radius:.6rem!important;
}

.banlist-me-icon{
  width:2.42rem!important;
  height:2.42rem!important;
  border-radius:.54rem!important;
  font-size:.86rem!important;
}

.banlist-me-status>div:nth-child(2)>span{
  font-size:.52rem!important;
}

.banlist-me-status>div:nth-child(2)>strong{
  margin-top:.10rem!important;
  font-size:.75rem!important;
}

.banlist-me-status>div:nth-child(2)>small{
  margin-top:.12rem!important;
  color:#859089!important;
  font-size:.60rem!important;
  line-height:1.35!important;
}

.banlist-me-status>button{
  min-height:2.15rem!important;
  padding:0 .52rem!important;
  font-size:.54rem!important;
}

/* Public panel */
.banlist-public-panel,
.banlist-admin-panel{
  margin-top:.48rem!important;
  border-radius:.6rem!important;
}

.banlist-public-toolbar{
  min-height:3.7rem!important;
  padding:.48rem .56rem!important;
}

.banlist-public-toolbar>div>span{
  font-size:.52rem!important;
}

.banlist-public-toolbar>div>strong{
  margin-top:.08rem!important;
  font-size:.64rem!important;
}

.banlist-public-search{
  width:min(21rem,58%)!important;
  min-height:2.3rem!important;
}

.banlist-public-search input{
  font-size:.64rem!important;
}

.banlist-public-list{
  gap:.34rem!important;
  padding:.44rem!important;
}

/* Ban rows: smaller card, larger copy */
.banlist-history-row{
  min-height:4.85rem!important;
  grid-template-columns:4.25rem minmax(0,1fr) auto!important;
  gap:.48rem!important;
  padding:.44rem!important;
  border-radius:.52rem!important;
}

.banlist-history-status{
  min-height:3.1rem!important;
  border-radius:.46rem!important;
}

.banlist-history-status span{
  font-size:.53rem!important;
}

.banlist-history-status small{
  margin-top:.10rem!important;
  font-size:.47rem!important;
}

.banlist-history-title{
  gap:.3rem!important;
}

.banlist-history-title strong{
  font-size:.72rem!important;
}

.banlist-history-title span{
  min-height:1.35rem!important;
  padding:0 .32rem!important;
  font-size:.46rem!important;
}

.banlist-history-main p{
  margin-top:.22rem!important;
  color:#9ea7ae!important;
  font-size:.64rem!important;
  line-height:1.48!important;
}

.banlist-history-meta{
  gap:.18rem .48rem!important;
  margin-top:.28rem!important;
}

.banlist-history-meta span{
  color:#758088!important;
  font-size:.52rem!important;
  line-height:1.35!important;
}

.banlist-history-meta b{
  color:#939ca3!important;
}

.banlist-unban{
  min-height:2rem!important;
  padding:0 .48rem!important;
  font-size:.50rem!important;
}

.banlist-pagination{
  gap:.24rem!important;
  padding:.18rem .4rem .48rem!important;
}

.banlist-pagination button,
.banlist-pagination span{
  min-width:1.82rem!important;
  height:1.82rem!important;
  font-size:.53rem!important;
}

/* Admin area also more readable */
.banlist-admin-panel>header{
  padding:.48rem .56rem!important;
}

.banlist-admin-panel>header span{
  font-size:.49rem!important;
}

.banlist-admin-panel>header strong{
  font-size:.64rem!important;
}

.banlist-admin-panel>header small{
  font-size:.53rem!important;
}

.banlist-admin-grid{
  gap:.48rem!important;
  padding:.5rem!important;
}

.banlist-search input,
.banlist-form input,
.banlist-form textarea,
.banlist-form select{
  font-size:.64rem!important;
}

.banlist-form label>span{
  font-size:.52rem!important;
}

.banlist-user-result strong{
  font-size:.63rem!important;
}

.banlist-user-result small,
.banlist-user-ip{
  font-size:.51rem!important;
}

.banlist-selected strong{
  font-size:.66rem!important;
}

.banlist-selected small{
  font-size:.53rem!important;
}

/* ---------------------------------------------------------
   Mobile Banlist
   --------------------------------------------------------- */

@media(max-width:720px){
  .banlist-screen{
    align-items:flex-end!important;
    padding:.35rem!important;
  }

  .banlist-v34{
    width:100%!important;
    max-width:none!important;
    max-height:calc(100dvh - .7rem)!important;
    border-radius:.78rem!important;
  }

  .banlist-header{
    min-height:auto!important;
    padding:.58rem .62rem!important;
  }

  .banlist-header h2{
    font-size:1.08rem!important;
  }

  .banlist-header p{
    max-width:24rem!important;
    font-size:.61rem!important;
  }

  .banlist-v34-body{
    padding:.46rem!important;
  }

  .banlist-me-status{
    grid-template-columns:2.45rem minmax(0,1fr)!important;
    gap:.45rem!important;
    padding:.46rem!important;
  }

  .banlist-me-status>button{
    grid-column:1/-1!important;
    width:100%!important;
    min-height:2.35rem!important;
  }

  .banlist-public-toolbar{
    flex-direction:column!important;
    align-items:stretch!important;
    gap:.4rem!important;
    padding:.48rem!important;
  }

  .banlist-public-search{
    width:100%!important;
    min-height:2.55rem!important;
  }

  .banlist-public-search input{
    font-size:.68rem!important;
  }

  .banlist-public-list{
    padding:.38rem!important;
  }

  .banlist-history-row{
    min-height:0!important;
    grid-template-columns:3.9rem minmax(0,1fr)!important;
    gap:.42rem!important;
    padding:.44rem!important;
  }

  .banlist-history-status{
    min-height:3.2rem!important;
  }

  .banlist-history-main p{
    font-size:.67rem!important;
  }

  .banlist-history-title strong{
    font-size:.75rem!important;
  }

  .banlist-history-meta{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:.14rem!important;
  }

  .banlist-history-meta span{
    font-size:.55rem!important;
  }

  .banlist-history-row>.banlist-unban{
    grid-column:1/-1!important;
    width:100%!important;
    min-height:2.25rem!important;
  }

  .banlist-admin-grid{
    grid-template-columns:1fr!important;
  }
}

@media(max-width:470px){
  .banlist-header p{
    display:none!important;
  }

  .banlist-header h2{
    font-size:1.02rem!important;
  }

  .banlist-me-status>div:nth-child(2)>strong{
    font-size:.70rem!important;
  }

  .banlist-me-status>div:nth-child(2)>small{
    font-size:.57rem!important;
  }

  .banlist-history-row{
    grid-template-columns:1fr!important;
  }

  .banlist-history-status{
    min-height:2.1rem!important;
    flex-direction:row!important;
    justify-content:flex-start!important;
    gap:.35rem!important;
    padding:0 .4rem!important;
  }

  .banlist-history-status small{
    margin:0!important;
  }

  .banlist-history-title{
    flex-wrap:wrap!important;
  }

  .banlist-pagination{
    flex-wrap:wrap!important;
  }
}


/* =========================================================
   V36 — MOBILE FORUM / GLOBAL PRESENCE / MOBILE PLAY / BANLIST
   ========================================================= */

/* ---------------------------------------------------------
   Mobile forum search: compact instead of giant full-width box
   --------------------------------------------------------- */
@media(max-width:900px){
  .forum-list-heading{
    align-items:flex-start!important;
  }

  .workspace-search.forum-search-v21{
    width:min(13rem,58vw)!important;
    max-width:13rem!important;
    min-height:2.18rem!important;
    align-self:flex-end!important;
    grid-template-columns:1.6rem minmax(0,1fr)!important;
    border-radius:.48rem!important;
  }

  .forum-search-v21>span{
    font-size:.68rem!important;
  }

  .forum-search-v21 input{
    min-height:2.1rem!important;
    padding:0 .42rem 0 0!important;
    font-size:.55rem!important;
  }
}

@media(max-width:480px){
  .workspace-search.forum-search-v21{
    width:min(11rem,58vw)!important;
    max-width:11rem!important;
  }

  .forum-search-v21 input{
    font-size:.52rem!important;
  }
}

/* ---------------------------------------------------------
   Online members: only 4 overlapping avatars + remaining count
   --------------------------------------------------------- */
#forumOnlineUsers{
  min-height:2.7rem;
  display:flex!important;
  align-items:center!important;
  flex-wrap:nowrap!important;
  gap:.65rem!important;
}

.forum-online-avatar-stack{
  display:flex;
  align-items:center;
  min-width:6.3rem;
  padding-left:.08rem;
}

.forum-online-stack-avatar{
  width:2.35rem!important;
  height:2.35rem!important;
  margin-left:-.58rem;
  z-index:calc(10 - var(--stack-index));
  border:.16rem solid #0a0f14!important;
  border-radius:50%!important;
  box-shadow:0 .25rem .75rem rgba(0,0,0,.22);
  transition:transform .15s ease,z-index .15s ease;
}

.forum-online-stack-avatar:first-child{
  margin-left:0;
}

.forum-online-stack-avatar:hover{
  z-index:20;
  transform:translateY(-.12rem) scale(1.06);
}

.forum-online-stack-avatar img{
  border-radius:50%!important;
}

.forum-online-stack-avatar.admin{
  box-shadow:0 0 0 1px rgba(255,68,96,.18),0 .25rem .75rem rgba(0,0,0,.22);
}

.forum-online-stack-avatar i{
  width:.48rem!important;
  height:.48rem!important;
  right:-.02rem!important;
  bottom:.02rem!important;
  border:.10rem solid #0a0f14!important;
}

.forum-online-stack-avatar i.web{
  background:#58d57d!important;
}

.forum-online-stack-avatar i.game{
  background:#e0aa47!important;
  box-shadow:0 0 .65rem rgba(224,170,71,.42)!important;
}

.forum-online-more{
  color:#88939b;
  font-size:.62rem;
  font-weight:750;
}

.forum-online-visitors small{
  color:#7c858d!important;
}

@media(max-width:620px){
  .forum-online-v29{
    margin:.55rem .4rem .72rem!important;
    padding:.55rem!important;
  }

  .forum-online-body{
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:.5rem!important;
  }

  .forum-online-copy>span{
    font-size:.53rem!important;
  }

  .forum-online-stack-avatar{
    width:2.15rem!important;
    height:2.15rem!important;
  }

  .forum-online-more{
    font-size:.53rem!important;
    line-height:1.3;
  }

  .forum-online-visitors{
    min-width:4.4rem!important;
  }
}

/* ---------------------------------------------------------
   Mobile Play lock
   --------------------------------------------------------- */
.play-mobile-unavailable{
  cursor:pointer!important;
  filter:grayscale(.72) saturate(.35)!important;
  opacity:.72!important;
  background:linear-gradient(180deg,#54585d,#33373b)!important;
  border-color:rgba(255,255,255,.10)!important;
  box-shadow:none!important;
}

.play-mobile-unavailable:hover{
  transform:none!important;
  opacity:.82!important;
}

.mobile-play-screen{
  position:fixed;
  inset:0;
  z-index:520;
  display:grid;
  place-items:center;
  padding:1rem;
}

.mobile-play-screen.hidden{
  display:none!important;
}

.mobile-play-backdrop{
  position:absolute;
  inset:0;
  background:rgba(2,5,8,.84);
  backdrop-filter:blur(.65rem);
  -webkit-backdrop-filter:blur(.65rem);
}

.mobile-play-card{
  width:min(28rem,calc(100vw - 1.1rem));
  position:relative;
  z-index:1;
  padding:1rem;
  border:1px solid rgba(255,255,255,.075);
  border-radius:.9rem;
  background:
    radial-gradient(circle at 50% 0%,rgba(255,62,88,.055),transparent 35%),
    linear-gradient(155deg,#11171e,#070b10);
  box-shadow:0 2rem 5rem rgba(0,0,0,.55);
  text-align:center;
}

.mobile-play-close{
  width:2rem;
  height:2rem;
  position:absolute;
  right:.55rem;
  top:.55rem;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(255,255,255,.05);
  border-radius:.46rem;
  color:#7b858d;
  background:rgba(255,255,255,.006);
  font-size:.8rem;
}

.mobile-play-sad{
  width:4.4rem;
  height:4.4rem;
  display:grid;
  place-items:center;
  margin:.3rem auto .65rem;
  border:1px solid rgba(255,80,102,.09);
  border-radius:1.2rem;
  color:#d77a88;
  background:rgba(255,48,79,.018);
  font-size:2rem;
  line-height:1;
}

.mobile-play-card>span{
  color:#805e65;
  font-size:.52rem;
  font-weight:900;
  letter-spacing:.09em;
}

.mobile-play-card h2{
  margin:.16rem 0 0;
  color:#e3e7e9;
  font-size:1.05rem;
}

.mobile-play-card>p{
  max-width:23rem;
  margin:.35rem auto 0;
  color:#929ca4;
  font-size:.66rem;
  line-height:1.58;
}

.mobile-play-reason{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.3rem;
  margin-top:.72rem;
}

.mobile-play-reason>div{
  min-height:4rem;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.2rem;
  padding:.35rem;
  border:1px solid rgba(255,255,255,.04);
  border-radius:.55rem;
  background:rgba(255,255,255,.004);
}

.mobile-play-reason b{
  color:#a9b2b9;
  font-size:.9rem;
}

.mobile-play-reason span{
  color:#768088;
  font-size:.50rem;
  line-height:1.3;
}

.mobile-play-tip{
  display:block;
  margin-top:.65rem;
  color:#78838b;
  font-size:.55rem;
  line-height:1.45;
}

.mobile-play-ok{
  width:100%;
  min-height:2.65rem;
  margin-top:.7rem;
  border:1px solid rgba(255,66,93,.12);
  border-radius:.54rem;
  color:#f0dfe2;
  background:linear-gradient(180deg,rgba(174,35,59,.64),rgba(110,18,35,.66));
  font-size:.58rem;
  font-weight:900;
}

@media(max-width:470px){
  .mobile-play-card{
    padding:.8rem .65rem .7rem;
  }

  .mobile-play-reason{
    grid-template-columns:1fr;
  }

  .mobile-play-reason>div{
    min-height:2.6rem;
    flex-direction:row;
  }
}

/* ---------------------------------------------------------
   BANLIST V36 — security-log redesign + guaranteed scrolling
   --------------------------------------------------------- */
.banlist-v36{
  width:min(46rem,92vw)!important;
  height:min(39rem,82vh)!important;
  max-height:82vh!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border-radius:.88rem!important;
  background:
    radial-gradient(circle at 88% -8%,rgba(193,47,70,.045),transparent 30%),
    linear-gradient(160deg,#10161c,#060a0f)!important;
}

.banlist-v36 .banlist-header{
  flex:0 0 auto;
  padding:.62rem .7rem!important;
  background:rgba(255,255,255,.004);
}

.banlist-v36 .banlist-v34-body{
  flex:1 1 auto;
  min-height:0!important;
  max-height:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  -webkit-overflow-scrolling:touch;
  padding:.5rem!important;
}

.banlist-v36 .banlist-v34-body::-webkit-scrollbar{
  width:.42rem;
}

.banlist-v36 .banlist-v34-body::-webkit-scrollbar-thumb{
  border-radius:1rem;
  background:rgba(255,255,255,.10);
}

.banlist-v36 .banlist-me-status{
  min-height:auto!important;
  grid-template-columns:2.45rem minmax(0,1fr) auto!important;
  padding:.45rem .5rem!important;
  border-radius:.55rem!important;
}

.banlist-v36 .banlist-public-panel{
  overflow:visible!important;
}

.banlist-v36 .banlist-public-toolbar{
  position:sticky;
  top:-.5rem;
  z-index:5;
  min-height:3.5rem!important;
  padding:.45rem .5rem!important;
  background:rgba(8,12,17,.96);
  backdrop-filter:blur(.55rem);
  -webkit-backdrop-filter:blur(.55rem);
}

.banlist-v36 .banlist-public-list{
  gap:.34rem!important;
  padding:.38rem!important;
}

/* Completely different ban row presentation */
.ban-v36-card{
  position:relative;
  display:grid;
  grid-template-columns:2.6rem minmax(0,1fr) auto;
  align-items:stretch;
  gap:.5rem;
  padding:.5rem;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.58rem;
  background:rgba(255,255,255,.004);
}

.ban-v36-card:before{
  content:"";
  width:.17rem;
  position:absolute;
  left:0;
  top:.45rem;
  bottom:.45rem;
  border-radius:1rem;
  background:#6f7780;
}

.ban-v36-card.active:before{background:#d95b70}
.ban-v36-card.expired:before{background:#aa8853}
.ban-v36-card.revoked:before{background:#57956b}

.ban-v36-mark{
  min-height:3.4rem;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.04);
  border-radius:.48rem;
  background:rgba(255,255,255,.004);
}

.ban-v36-mark>span{
  color:#7a838a;
  font-size:.78rem;
  font-weight:900;
}

.ban-v36-card.active .ban-v36-mark>span{color:#e5798b}
.ban-v36-card.expired .ban-v36-mark>span{color:#c6a36a}
.ban-v36-card.revoked .ban-v36-mark>span{color:#75b187}

.ban-v36-mark>small{
  margin-top:.08rem;
  color:#59636b;
  font-size:.43rem;
}

.ban-v36-content{
  min-width:0;
}

.ban-v36-content>header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.4rem;
}

.ban-v36-content>header>div>span,
.ban-v36-content>header>div>strong{
  display:block;
}

.ban-v36-content>header>div>span{
  color:#6d5d62;
  font-size:.45rem;
  font-weight:900;
  letter-spacing:.06em;
}

.ban-v36-content>header>div>strong{
  margin-top:.05rem;
  color:#c1c7cc;
  font-size:.71rem;
}

.ban-v36-status{
  min-height:1.45rem;
  display:inline-flex;
  align-items:center;
  padding:0 .36rem;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.38rem;
  color:#8a939a;
  background:rgba(255,255,255,.004);
  font-size:.44rem;
  white-space:nowrap;
}

.ban-v36-card.active .ban-v36-status{
  color:#db7485;
  border-color:rgba(255,65,92,.08);
}

.ban-v36-content>p{
  margin:.24rem 0 0;
  color:#9ca5ac;
  font-size:.62rem;
  line-height:1.47;
}

.ban-v36-facts{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.24rem;
  margin-top:.34rem;
}

.ban-v36-facts>span{
  min-width:0;
  padding:.28rem .32rem;
  border:1px solid rgba(255,255,255,.035);
  border-radius:.4rem;
  background:rgba(255,255,255,.003);
}

.ban-v36-facts small,
.ban-v36-facts strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.ban-v36-facts small{
  color:#5f6870;
  font-size:.39rem;
  font-weight:850;
}

.ban-v36-facts strong{
  margin-top:.06rem;
  color:#7f8991;
  font-size:.48rem;
}

.ban-v36-unban{
  align-self:center;
  min-height:2rem!important;
  padding:0 .42rem!important;
  white-space:nowrap;
}

@media(max-width:720px){
  .banlist-screen{
    align-items:flex-end!important;
    padding:.3rem!important;
  }

  .banlist-v36{
    width:100%!important;
    height:min(88dvh,44rem)!important;
    max-height:88dvh!important;
    border-radius:.8rem .8rem .6rem .6rem!important;
  }

  .banlist-v36 .banlist-header p{
    display:none!important;
  }

  .banlist-v36 .banlist-public-toolbar{
    top:-.5rem;
  }

  .ban-v36-card{
    grid-template-columns:2.4rem minmax(0,1fr)!important;
  }

  .ban-v36-unban{
    grid-column:1/-1;
    width:100%;
  }

  .ban-v36-facts{
    grid-template-columns:1fr!important;
  }

  .ban-v36-facts strong{
    font-size:.53rem!important;
    white-space:normal;
  }
}

@media(max-width:430px){
  .banlist-v36{
    height:91dvh!important;
    max-height:91dvh!important;
  }

  .banlist-v36 .banlist-me-status{
    grid-template-columns:2.25rem minmax(0,1fr)!important;
  }

  .banlist-v36 .banlist-me-status>button{
    grid-column:1/-1!important;
  }

  .ban-v36-card{
    grid-template-columns:1fr!important;
  }

  .ban-v36-mark{
    min-height:2rem;
    flex-direction:row;
    justify-content:flex-start;
    gap:.3rem;
    padding:0 .4rem;
  }

  .ban-v36-mark>small{
    margin:0;
  }
}


/* =========================================================
   V37 — XP ECONOMY / NOTIFICATIONS / PROFILE COMPACT / MOBILE
   ========================================================= */

/* Mobile: Forum search is intentionally removed completely. */
@media(max-width:900px){
  .workspace-search.forum-search-v21,
  .forum-search-v21{
    display:none!important;
  }
}

/* ---------------------------------------------------------
   Success toast = restrained green check
   --------------------------------------------------------- */
.x-toast-v31.success .x-toast-v31-accent{
  background:#48b96a!important;
}
.x-toast-v31.success .x-toast-v31-icon{
  color:#76d995!important;
  border-color:rgba(85,210,120,.13)!important;
  background:rgba(70,187,101,.025)!important;
}
.x-toast-v31.success .x-toast-v31-copy small{
  color:#6f8f77!important;
}
.x-toast-v31.success .x-toast-v31-timer>span{
  background:linear-gradient(90deg,#3c9857,#67c982)!important;
}

/* ---------------------------------------------------------
   Brutal LIVE XP bar in avatar/account dropdown
   --------------------------------------------------------- */
.account-xp-live{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,51,79,.09)!important;
  background:
    radial-gradient(circle at 12% 0%,rgba(255,48,79,.055),transparent 38%),
    linear-gradient(145deg,rgba(30,7,13,.28),rgba(8,11,15,.75))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.018);
}

.account-xp-live:before{
  content:"";
  width:4.2rem;
  height:4.2rem;
  position:absolute;
  right:-1.1rem;
  top:-1.35rem;
  border:1px solid rgba(255,61,88,.035);
  border-radius:50%;
  box-shadow:0 0 2.2rem rgba(255,48,79,.04);
}

.account-progress-top>span{
  display:flex!important;
  align-items:center;
  gap:.22rem;
}

.account-progress-top em{
  min-height:1.15rem;
  display:inline-flex;
  align-items:center;
  padding:0 .28rem;
  border:1px solid rgba(255,61,88,.10);
  border-radius:.32rem;
  color:#cf6879;
  background:rgba(255,48,79,.018);
  font-size:.37rem;
  font-style:normal;
  font-weight:950;
  letter-spacing:.06em;
}

.xp-live-dot{
  width:.42rem;
  height:.42rem;
  display:inline-block;
  border-radius:50%;
  background:#e73c58;
  box-shadow:0 0 .65rem rgba(231,60,88,.58);
  animation:xpLivePulse 1.8s ease-in-out infinite;
}

.account-xp-live .account-progress-track{
  height:.48rem!important;
  padding:.06rem!important;
  border:1px solid rgba(255,62,89,.07)!important;
  background:#090b0f!important;
  box-shadow:inset 0 0 .55rem rgba(0,0,0,.65);
}

.account-xp-live .account-progress-track>span{
  position:relative;
  height:100%!important;
  border-radius:999px!important;
  background:
    repeating-linear-gradient(90deg,transparent 0,transparent .72rem,rgba(255,255,255,.11) .73rem,rgba(255,255,255,.11) .77rem),
    linear-gradient(90deg,#721026,#c82040 48%,#ff3d59)!important;
  box-shadow:0 0 .72rem rgba(231,42,73,.31);
  transition:width .45s cubic-bezier(.2,.8,.2,1)!important;
}

.account-xp-live .account-progress-track>span:after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.15),transparent);
  transform:translateX(-100%);
  animation:xpScan 2.4s linear infinite;
}

.account-xp-formula{
  display:block;
  margin-top:.35rem;
  color:#66555a;
  font-size:.42rem;
  line-height:1.35;
}

.account-xp-live.xp-gained{
  animation:xpGainFlash .9s ease-out;
}

.vial-gained-live{
  animation:vialLiveFlash .95s ease-out!important;
}

@keyframes xpLivePulse{
  0%,100%{opacity:.58;transform:scale(.88)}
  50%{opacity:1;transform:scale(1.12)}
}
@keyframes xpScan{
  to{transform:translateX(100%)}
}
@keyframes xpGainFlash{
  0%{box-shadow:0 0 0 rgba(255,48,79,0)}
  35%{box-shadow:0 0 1.5rem rgba(255,48,79,.22),inset 0 0 1rem rgba(255,48,79,.08)}
  100%{box-shadow:inset 0 1px 0 rgba(255,255,255,.018)}
}
@keyframes vialLiveFlash{
  35%{filter:drop-shadow(0 0 .9rem rgba(224,178,82,.42))}
}

/* Provider identity icon in account popover */
#providerPill,
#accountPopoverProvider{
  display:inline-flex!important;
  align-items:center!important;
  gap:.28rem!important;
}

.provider-mini-svg{
  width:.92rem;
  height:.92rem;
  flex:0 0 .92rem;
  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.provider-mini-svg.steam{
  color:#aeb9c2;
}

.provider-mini-google{
  width:.92rem;
  height:.92rem;
  display:inline-grid;
  place-items:center;
  flex:0 0 .92rem;
  border:1px solid rgba(255,255,255,.08);
  border-radius:50%;
  color:#d8dde1;
  font-size:.48rem;
  font-weight:950;
  background:rgba(255,255,255,.012);
}

/* ---------------------------------------------------------
   Public profile: max 4 benefits, no expand spam
   --------------------------------------------------------- */
.public-profile-benefits-more{
  grid-column:1/-1;
  min-height:2.3rem;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.2rem;
  border:1px dashed rgba(255,255,255,.045);
  border-radius:.48rem;
  color:#68727a;
  background:rgba(255,255,255,.003);
  font-size:.49rem;
  font-weight:850;
}
.public-profile-benefits-more b{
  color:#b47b86;
}

/* ---------------------------------------------------------
   Admin XP
   --------------------------------------------------------- */
.admin-xp-divider{
  margin-top:.8rem;
  padding:.7rem 0 .5rem;
  border-top:1px solid rgba(255,255,255,.045);
}
.admin-xp-divider span,
.admin-xp-divider strong,
.admin-xp-divider small{
  display:block;
}
.admin-xp-divider span{
  color:#765d64;
  font-size:.47rem;
  font-weight:900;
  letter-spacing:.08em;
}
.admin-xp-divider strong{
  margin-top:.1rem;
  color:#c8cdd1;
  font-size:.72rem;
}
.admin-xp-divider small{
  margin-top:.15rem;
  color:#68727a;
  font-size:.53rem;
}
.admin-xp-grant-form{
  display:grid;
  gap:.45rem;
}
.admin-xp-grant-form>button{
  min-height:2.55rem;
  border:1px solid rgba(255,58,85,.13);
  border-radius:.52rem;
  color:#f2e6e9;
  background:linear-gradient(180deg,rgba(178,31,59,.65),rgba(108,15,34,.68));
  font-size:.55rem;
  font-weight:900;
  cursor:pointer;
}

.shop-xp-history{
  margin-top:.7rem;
  padding-top:.6rem;
  border-top:1px solid rgba(255,255,255,.045);
}
.shop-xp-history>span{
  color:#74616a;
  font-size:.48rem;
  font-weight:900;
}
#shopAdminXpHistory{
  display:grid;
  gap:.25rem;
  margin-top:.35rem;
}
#shopAdminXpHistory>article{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:.5rem;
  padding:.42rem;
  border:1px solid rgba(255,255,255,.04);
  border-radius:.48rem;
  background:rgba(255,255,255,.004);
}
#shopAdminXpHistory span,
#shopAdminXpHistory strong,
#shopAdminXpHistory small{
  display:block;
}
#shopAdminXpHistory span{color:#735e65;font-size:.43rem;font-weight:900}
#shopAdminXpHistory strong{margin-top:.06rem;color:#aab2b9;font-size:.57rem}
#shopAdminXpHistory small{margin-top:.06rem;color:#657078;font-size:.47rem}
#shopAdminXpHistory>article>div:last-child{text-align:right}
#shopAdminXpHistory>article>div:last-child>strong{color:#cf6a7c}

/* ---------------------------------------------------------
   Third-party settings lock
   --------------------------------------------------------- */
.settings-form.third-party-locked{
  position:relative;
  opacity:.43;
  filter:grayscale(.55);
  pointer-events:none;
}
.settings-form.third-party-locked input,
.settings-form.third-party-locked button{
  cursor:not-allowed!important;
}

.oauth-security-note-v37{
  display:grid!important;
  grid-template-columns:2.7rem minmax(0,1fr);
  gap:.55rem;
  align-items:start;
  margin-top:.65rem;
  padding:.62rem;
  border:1px solid rgba(95,150,215,.08);
  border-radius:.58rem;
  background:rgba(58,112,176,.012);
}
.oauth-security-note-v37.hidden{
  display:none!important;
}
.oauth-security-provider-icon{
  width:2.55rem;
  height:2.55rem;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.06);
  border-radius:.55rem;
  color:#aab7c1;
  background:rgba(255,255,255,.005);
}
.oauth-security-provider-icon .provider-mini-svg,
.oauth-security-provider-icon .provider-mini-google{
  width:1.3rem!important;
  height:1.3rem!important;
}
.oauth-security-note-v37 strong,
.oauth-security-note-v37 p,
.oauth-security-note-v37 small{
  display:block;
}
.oauth-security-note-v37 strong{
  color:#aab8c3;
  font-size:.59rem;
}
.oauth-security-note-v37 p{
  margin:.16rem 0 0;
  color:#7d8992;
  font-size:.54rem;
  line-height:1.48;
}
.oauth-security-note-v37 small{
  margin-top:.15rem;
  color:#65717a;
  font-size:.48rem;
}

.setting-row-disabled{
  opacity:.48;
}
.setting-row-disabled .setting-coming-soon{
  display:inline-flex;
  align-items:center;
  min-height:1.15rem;
  margin-left:.28rem;
  padding:0 .3rem;
  border:1px solid rgba(255,255,255,.05);
  border-radius:.3rem;
  color:#7a848c;
  font-size:.38rem;
  font-weight:900;
  vertical-align:middle;
}

/* Shop copy highlights new XP values cleanly */
.shop-economy-title p strong{
  color:#77cf8d;
}

/* Five-minute online window note */
.forum-online-copy>small:after{
  content:" • stav zůstává viditelný max. 5 min od poslední aktivity";
}

@media(max-width:620px){
  .account-xp-live{
    padding:.58rem!important;
  }

  .account-progress-top{
    gap:.35rem!important;
  }

  .account-progress-top>span{
    flex-wrap:wrap;
  }

  #shopAdminXpHistory>article{
    grid-template-columns:1fr;
  }

  #shopAdminXpHistory>article>div:last-child{
    text-align:left;
  }

  .oauth-security-note-v37{
    grid-template-columns:2.35rem minmax(0,1fr);
  }
}


/* =========================================================
   V38 — HUMAN LEVEL / ACCOUNT POLISH / MOBILE SHOP NOTICE
   ========================================================= */

.chat-disabled.shop-readonly-notice{
  min-height:3.9rem!important;
  grid-template-columns:2.45rem minmax(0,1fr)!important;
  gap:.55rem!important;
  padding:.58rem .68rem!important;
  align-items:center!important;
}
.shop-readonly-notice .system-chat-lock{
  width:2.35rem!important;height:2.35rem!important;display:grid!important;place-items:center!important;
  border:1px solid rgba(218,168,78,.11)!important;border-radius:.52rem!important;color:#deb45f!important;
  background:rgba(214,161,69,.025)!important;font-size:.72rem!important;font-weight:950!important;
}
.shop-readonly-copy{min-width:0;display:grid;gap:.10rem}
.shop-readonly-copy strong,.shop-readonly-copy small,.shop-readonly-copy span{
  display:block!important;white-space:normal!important;word-break:normal!important;overflow-wrap:break-word!important;
}
.shop-readonly-copy strong{color:#cdbf9f!important;font-size:.60rem!important;line-height:1.25!important}
.shop-readonly-copy small{color:#879098!important;font-size:.54rem!important;line-height:1.35!important}
.shop-readonly-copy span{color:#766b58!important;font-size:.42rem!important;font-weight:900!important;line-height:1.35!important;letter-spacing:.035em!important}
@media(max-width:620px){
  .chat-disabled.shop-readonly-notice{min-height:auto!important;grid-template-columns:2.25rem minmax(0,1fr)!important;gap:.46rem!important;padding:.52rem!important}
  .shop-readonly-notice .system-chat-lock{width:2.12rem!important;height:2.12rem!important}
  .shop-readonly-copy strong{font-size:.64rem!important}
  .shop-readonly-copy small{font-size:.58rem!important}
  .shop-readonly-copy span{margin-top:.03rem;font-size:.43rem!important}
}

#providerPill.provider-third-party{
  min-width:2rem!important;width:2rem!important;height:1.7rem!important;display:grid!important;place-items:center!important;padding:0!important;margin-top:.18rem!important;
}
.provider-icon-only{width:100%;height:100%;display:grid!important;place-items:center!important}
.provider-icon-only .provider-mini-svg,.provider-icon-only .provider-mini-google{width:1.12rem!important;height:1.12rem!important;flex:0 0 1.12rem!important}
.account-provider-stat{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important}
.account-provider-stat>span{text-align:center!important}
#accountPopoverProvider{min-height:1.45rem;display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important}
#accountPopoverProvider.provider-third-party{width:100%}
#accountPopoverProvider.provider-third-party .provider-icon-only{width:2rem;height:1.5rem}
#accountPopoverProvider.provider-third-party .provider-mini-svg,#accountPopoverProvider.provider-third-party .provider-mini-google{width:1.2rem!important;height:1.2rem!important}

.account-xp-live{cursor:pointer;padding:.68rem!important}
.account-xp-live:hover{
  border-color:rgba(255,61,88,.14)!important;
  background:radial-gradient(circle at 12% 0%,rgba(255,48,79,.075),transparent 38%),linear-gradient(145deg,rgba(35,8,15,.36),rgba(8,11,15,.78))!important;
}
.account-xp-live:focus-visible{outline:1px solid rgba(255,77,103,.36);outline-offset:2px}
.account-xp-live .account-progress-top>span{font-size:.59rem!important}
.account-xp-live .account-progress-top>span>strong{font-size:.78rem!important}
.account-xp-live .account-progress-top>small{font-size:.58rem!important}
.account-xp-live .account-progress-track{height:.56rem!important;margin-top:.42rem!important}
.account-xp-live .account-progress-foot{margin-top:.38rem!important}
.account-xp-live .account-progress-foot span,.account-xp-live .account-progress-foot strong{font-size:.49rem!important}
.account-xp-formula{
  margin-top:.48rem!important;padding-top:.38rem;border-top:1px solid rgba(255,255,255,.035);
  color:#8a7279!important;font-size:.54rem!important;line-height:1.45!important;
}
.account-xp-formula b{color:#bb6b79;font-size:.48rem;letter-spacing:.06em}
.account-xp-formula strong{color:#ec7388;font-size:.62rem}

.account-human-level-card{
  width:100%;min-height:4rem;display:grid;grid-template-columns:2.7rem minmax(0,1fr) 1rem;align-items:center;gap:.5rem;
  margin:.48rem 0;padding:.48rem .55rem;border:1px solid rgba(255,56,84,.075);border-radius:.62rem;color:inherit;
  background:radial-gradient(circle at 10% 50%,rgba(255,48,79,.055),transparent 30%),rgba(255,255,255,.004);text-align:left;cursor:pointer;transition:.16s ease;
}
.account-human-level-card:hover{border-color:rgba(255,60,88,.14);transform:translateY(-1px)}
.account-human-level-icon{
  width:2.55rem;height:2.55rem;display:grid;place-items:center;border:1px solid rgba(255,64,91,.11);border-radius:.56rem;
  color:#df6c7f;background:rgba(255,48,79,.025);font-size:.8rem;font-weight:950;
}
.account-human-level-card>span:nth-child(2){min-width:0}
.account-human-level-card small,.account-human-level-card strong,.account-human-level-card em{display:block}
.account-human-level-card small{color:#7c5961;font-size:.43rem;font-weight:900;letter-spacing:.07em}
.account-human-level-card strong{margin-top:.07rem;color:#c9ced2;font-size:.68rem}
.account-human-level-card em{margin-top:.10rem;color:#6f7981;font-size:.48rem;font-style:normal}
.account-human-level-card>i{color:#7d4852;font-size:1rem;font-style:normal}

#topbarLevelBox.human-level-trigger{cursor:pointer!important;transition:.15s ease}
#topbarLevelBox.human-level-trigger:hover{border-color:rgba(255,64,91,.13)!important;background:rgba(255,48,79,.018)!important}

.human-system-screen{position:fixed;inset:0;z-index:540;display:grid;place-items:center;padding:.7rem}
.human-system-screen.hidden{display:none!important}
.human-system-backdrop{position:absolute;inset:0;background:rgba(2,5,8,.88);backdrop-filter:blur(.85rem);-webkit-backdrop-filter:blur(.85rem)}
.human-system-window{
  width:min(78rem,96vw);max-height:min(48rem,92vh);position:relative;z-index:1;display:flex;flex-direction:column;overflow:hidden;
  border:1px solid rgba(255,255,255,.065);border-radius:.92rem;
  background:radial-gradient(circle at 10% -10%,rgba(255,50,80,.065),transparent 35%),linear-gradient(150deg,#10161d,#06090d);
  box-shadow:0 2rem 6rem rgba(0,0,0,.62);
}
.human-system-header{flex:0 0 auto;display:grid;grid-template-columns:minmax(0,1fr) auto 2.2rem;align-items:center;gap:.75rem;padding:.72rem .8rem;border-bottom:1px solid rgba(255,255,255,.045)}
.human-system-title>span{color:#77535c;font-size:.48rem;font-weight:900;letter-spacing:.09em}
.human-system-title h2{margin:.08rem 0 0;color:#e2e6e8;font-size:1.1rem}
.human-system-title p{max-width:42rem;margin:.12rem 0 0;color:#77828a;font-size:.56rem;line-height:1.45}
.human-system-progress{min-width:8.3rem;padding:.45rem .52rem;border:1px solid rgba(255,62,89,.07);border-radius:.56rem;background:rgba(255,48,79,.012);text-align:center}
.human-system-progress span,.human-system-progress strong,.human-system-progress small{display:block}
.human-system-progress span{color:#73535b;font-size:.42rem;font-weight:900}
.human-system-progress strong{margin-top:.05rem;color:#e17185;font-size:.83rem}
.human-system-progress small{margin-top:.05rem;color:#78828a;font-size:.47rem}
.human-system-close{width:2.1rem;height:2.1rem;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.05);border-radius:.46rem;color:#79838b;background:rgba(255,255,255,.004);font-size:.85rem;cursor:pointer}

.human-system-current{flex:0 0 auto;display:grid;grid-template-columns:9rem minmax(16rem,1fr) auto;align-items:center;gap:.6rem;padding:.52rem .8rem;border-bottom:1px solid rgba(255,255,255,.04);background:rgba(0,0,0,.10)}
.human-system-current>div:first-child span,.human-system-current>div:first-child strong{display:block}
.human-system-current>div:first-child span{color:#685058;font-size:.43rem;font-weight:900}
.human-system-current>div:first-child strong{margin-top:.06rem;color:#bac1c6;font-size:.68rem}
.human-system-next>span{display:block;color:#636e76;font-size:.42rem;font-weight:850}
.human-system-next>div{height:.42rem;margin-top:.16rem;overflow:hidden;border:1px solid rgba(255,59,87,.06);border-radius:999px;background:#080b0f}
.human-system-next>div>i{width:0;height:100%;display:block;border-radius:inherit;background:linear-gradient(90deg,#751126,#bf1e3b,#ee3b58);box-shadow:0 0 .6rem rgba(232,52,81,.25);transition:width .35s ease}
.human-system-next>small{display:block;margin-top:.13rem;color:#69747c;font-size:.44rem}
.human-system-sync{max-width:15rem;color:#64585b;font-size:.43rem;line-height:1.4;text-align:right}

.human-class-track-wrap{min-height:0;flex:1 1 auto;overflow:hidden;padding:.65rem}
.human-class-track{
  height:100%;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(11.5rem,1fr);gap:.48rem;overflow-x:auto;overflow-y:hidden;padding-bottom:.3rem;
  scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.11) transparent;scroll-snap-type:x proximity;overscroll-behavior-x:contain;
}
.human-class-track::-webkit-scrollbar{height:.42rem}
.human-class-track::-webkit-scrollbar-thumb{border-radius:1rem;background:rgba(255,255,255,.10)}
.human-class-card{
  min-width:0;display:flex;flex-direction:column;overflow:hidden;scroll-snap-align:start;border:1px solid rgba(255,255,255,.045);
  border-radius:.7rem;background:rgba(255,255,255,.004);transition:.16s ease;
}
.human-class-card.active{border-color:rgba(255,65,92,.18);box-shadow:0 0 1.2rem rgba(255,48,79,.055)}
.human-class-card.locked{opacity:.58}
.human-class-card:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.075)}
.human-class-model{height:14.8rem;position:relative;overflow:hidden;background:#080b0f}
.human-class-model img{width:100%;height:100%;display:block;object-fit:cover}
.human-class-card.locked .human-class-model img{filter:grayscale(.88) brightness(.62)}
.human-class-model>span{
  position:absolute;left:.42rem;top:.42rem;min-height:1.45rem;display:flex;align-items:center;padding:0 .38rem;border:1px solid rgba(255,255,255,.06);
  border-radius:.38rem;color:#bbc2c7;background:rgba(5,8,11,.78);font-size:.48rem;font-weight:900;backdrop-filter:blur(.35rem);
}
.human-class-model>b{
  position:absolute;right:.42rem;top:.42rem;min-height:1.45rem;display:flex;align-items:center;padding:0 .38rem;border:1px solid rgba(255,66,93,.12);
  border-radius:.38rem;color:#e07586;background:rgba(58,7,17,.76);font-size:.42rem;font-weight:900;
}
.human-class-model>b.ready{color:#7bc58e;border-color:rgba(80,195,111,.10);background:rgba(8,47,19,.70)}
.human-class-model>b.locked{color:#858d94;border-color:rgba(255,255,255,.05);background:rgba(5,8,11,.78)}
.human-class-copy{min-height:0;flex:1 1 auto;display:flex;flex-direction:column;padding:.55rem}
.human-class-copy>span{color:#72545c;font-size:.43rem;font-weight:900;letter-spacing:.06em}
.human-class-copy>strong{margin-top:.08rem;color:#d1d6d9;font-size:.76rem}
.human-class-copy>p{min-height:2.35rem;margin:.22rem 0 0;color:#7d878e;font-size:.51rem;line-height:1.45}
.human-class-perks{display:grid;grid-template-columns:1fr;gap:.2rem;margin-top:.4rem}
.human-class-perks>div{min-height:2rem;display:flex;align-items:center;justify-content:space-between;gap:.3rem;padding:.27rem .34rem;border:1px solid rgba(255,255,255,.035);border-radius:.4rem;background:rgba(255,255,255,.003)}
.human-class-perks small{color:#646e76;font-size:.39rem;font-weight:850}
.human-class-perks b{color:#9aa3aa;font-size:.47rem}
.human-class-copy>button{
  width:100%;min-height:2.35rem;margin-top:auto;padding:.3rem;border:1px solid rgba(255,61,88,.10);border-radius:.46rem;color:#eadbdd;
  background:linear-gradient(180deg,rgba(154,26,50,.50),rgba(91,13,29,.54));font-size:.49rem;font-weight:900;cursor:pointer;
}
.human-class-copy>button:disabled{color:#687179;border-color:rgba(255,255,255,.04);background:rgba(255,255,255,.004);cursor:default}
.human-class-card.active .human-class-copy>button:disabled{color:#d86f81;border-color:rgba(255,61,88,.11);background:rgba(255,48,79,.016)}
.human-system-loading{min-width:18rem;display:grid;place-items:center;color:#768088;font-size:.6rem}
.human-system-loading.error{color:#d16f7e}
.human-system-footer{flex:0 0 auto;min-height:2.6rem;display:flex;align-items:center;justify-content:center;gap:.3rem;padding:.4rem .7rem;border-top:1px solid rgba(255,255,255,.04);color:#6e7880}
.human-system-footer span{font-size:.43rem;font-weight:900}
.human-system-footer i{width:2.2rem;height:1px;background:linear-gradient(90deg,rgba(255,55,84,.14),rgba(255,255,255,.04))}
body.human-system-open{overflow:hidden}

@media(max-width:900px){
  .human-system-window{width:calc(100vw - .7rem);max-height:92dvh}
  .human-system-header{grid-template-columns:minmax(0,1fr) 2.1rem}
  .human-system-progress{grid-column:1/-1;grid-row:2;width:100%;display:grid;grid-template-columns:auto auto auto;align-items:center;text-align:left}
  .human-system-close{grid-column:2;grid-row:1}
  .human-system-current{grid-template-columns:1fr;gap:.4rem}
  .human-system-sync{max-width:none;text-align:left}
  .human-class-track{grid-auto-columns:minmax(12.8rem,72vw)}
  .human-system-footer{overflow-x:auto;justify-content:flex-start}
}
@media(max-width:520px){
  .human-system-screen{align-items:flex-end;padding:.3rem}
  .human-system-window{width:100%;max-height:94dvh;border-radius:.82rem .82rem .5rem .5rem}
  .human-system-title p{display:none}
  .human-system-title h2{font-size:.96rem}
  .human-system-progress{grid-template-columns:1fr 1fr}
  .human-system-progress small{grid-column:1/-1}
  .human-class-track-wrap{padding:.45rem}
  .human-class-track{grid-auto-columns:82vw;gap:.38rem}
  .human-class-model{height:16rem}
  .human-system-footer{display:none}
  .account-xp-live .account-progress-top>span{font-size:.62rem!important}
  .account-xp-formula{font-size:.58rem!important}
}


/* ===== V39 HUMAN SYSTEM REDESIGN ===== */
.human-system-screen{position:fixed;inset:0;z-index:540;display:grid;place-items:center;padding:1rem}
.human-system-screen.hidden{display:none!important}
.human-system-window{position:relative;width:min(72rem,calc(100vw - 2rem));max-height:min(92dvh,56rem);display:flex;flex-direction:column;overflow:hidden;border:1px solid rgba(255,255,255,.06);border-radius:1.1rem;background:linear-gradient(180deg,rgba(7,11,18,.98),rgba(5,8,14,.98));box-shadow:0 2rem 5rem rgba(0,0,0,.55)}
.human-system-header{display:grid;grid-template-columns:minmax(0,1fr) auto 2.6rem;align-items:center;gap:1rem;padding:1rem 1.05rem;border-bottom:1px solid rgba(255,255,255,.055)}
.human-system-title>span{color:#8e5967;font-size:.62rem;font-weight:900;letter-spacing:.18em}
.human-system-title h2{margin:.15rem 0 0;color:#f2f4f7;font-size:1.5rem;line-height:1.05}
.human-system-title p{margin:.38rem 0 0;max-width:43rem;color:#a7b0b9;font-size:.92rem;line-height:1.55}
.human-system-progress{min-width:10rem;padding:.75rem .9rem;border:1px solid rgba(255,62,89,.08);border-radius:.9rem;background:linear-gradient(180deg,rgba(255,61,92,.06),rgba(255,61,92,.015));text-align:center}
.human-system-progress span,.human-system-progress strong,.human-system-progress small{display:block}
.human-system-progress span{color:#ae8690;font-size:.63rem;font-weight:900;letter-spacing:.08em}
.human-system-progress strong{margin-top:.12rem;color:#ffdbe2;font-size:1.15rem}
.human-system-progress small{margin-top:.12rem;color:#b5bec6;font-size:.78rem}
.human-system-close{width:2.45rem;height:2.45rem;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.08);border-radius:.7rem;color:#c4ccd4;background:rgba(255,255,255,.03);font-size:1.1rem;cursor:pointer;transition:transform .16s ease,border-color .16s ease}
.human-system-close:hover{transform:translateY(-1px);border-color:rgba(255,77,108,.3)}
.human-system-current.compact{display:grid;grid-template-columns:12rem minmax(12rem,1fr) minmax(14rem,18rem);align-items:center;gap:1rem;padding:.85rem 1.05rem;border-bottom:1px solid rgba(255,255,255,.05);background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,.005))}
.human-system-current.compact>div:first-child span,.human-system-current.compact>div:first-child strong{display:block}
.human-system-current.compact>div:first-child span{color:#aa7d86;font-size:.62rem;font-weight:900;letter-spacing:.08em}
.human-system-current.compact>div:first-child strong{margin-top:.15rem;color:#fff;font-size:1rem}
.human-system-next>span{display:block;color:#a2abb4;font-size:.66rem;font-weight:850;letter-spacing:.05em}
.human-system-next>div{height:.55rem;margin-top:.28rem;overflow:hidden;border:1px solid rgba(255,59,87,.08);border-radius:999px;background:#090d12}
.human-system-next>div>i{width:0;height:100%;display:block;border-radius:inherit;background:linear-gradient(90deg,#83162d,#df2d4b,#ff637d);box-shadow:0 0 1rem rgba(232,52,81,.28);transition:width .35s ease}
.human-system-next>small{display:block;margin-top:.18rem;color:#b3bbc3;font-size:.78rem}
.human-system-sync{color:#b0b7be;font-size:.76rem;line-height:1.45}
.human-system-body{min-height:0;flex:1 1 auto;display:grid;grid-template-columns:minmax(20rem,1.05fr) minmax(18rem,.95fr);gap:1rem;padding:1rem;overflow:hidden}
.human-viewer-panel{min-height:0;display:grid;grid-template-columns:minmax(13rem,15rem) minmax(0,1fr);gap:1rem;padding:1rem;border:1px solid rgba(255,255,255,.05);border-radius:1rem;background:linear-gradient(180deg,rgba(11,15,23,.95),rgba(8,11,18,.98));overflow:hidden}
.human-viewer-stage{--tilt-x:0deg;--tilt-y:0deg;--move-x:0px;--move-y:0px;--viewer-scale:1;position:relative;min-height:25rem;border:1px solid rgba(255,255,255,.05);border-radius:.95rem;background:radial-gradient(circle at 50% 18%,rgba(255,70,105,.16),transparent 45%),linear-gradient(180deg,#090d13,#070a10);overflow:hidden;perspective:1200px;cursor:grab}
.human-viewer-stage:active{cursor:grabbing}
.human-viewer-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:1.8rem 1.8rem;mask-image:linear-gradient(180deg,rgba(0,0,0,.45),transparent 88%);opacity:.33}
.human-viewer-glow{position:absolute;inset:auto 12% 0;height:6rem;border-radius:50%;background:radial-gradient(circle,rgba(255,64,98,.3),transparent 72%);filter:blur(1rem)}
.human-viewer-stage>img{position:absolute;left:50%;bottom:.25rem;width:auto;max-width:108%;height:94%;object-fit:contain;transform:translate3d(calc(-50% + var(--move-x)),var(--move-y),0) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) scale(var(--viewer-scale));transform-style:preserve-3d;transition:transform .14s ease}
.human-viewer-badge-row{position:absolute;top:.75rem;left:.75rem;right:.75rem;display:flex;align-items:center;justify-content:space-between;gap:.6rem}
.human-viewer-role,.human-viewer-level{display:inline-flex;align-items:center;gap:.3rem;padding:.4rem .65rem;border-radius:999px;border:1px solid rgba(255,255,255,.07);background:rgba(4,7,12,.76);backdrop-filter:blur(.3rem);-webkit-backdrop-filter:blur(.3rem);font-size:.68rem;font-weight:900;letter-spacing:.06em}
.human-viewer-role{color:#ff90a4}
.human-viewer-level{color:#e4eaf0}
.human-viewer-copy{min-height:0;display:flex;flex-direction:column;gap:.85rem}
.human-viewer-copy-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.7rem}
.human-viewer-copy-head span{display:block;color:#ac7883;font-size:.64rem;font-weight:900;letter-spacing:.14em}
.human-viewer-copy-head h3{margin:.18rem 0 0;color:#fff;font-size:1.4rem;line-height:1.05}
.human-viewer-copy-head strong{display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;padding:.46rem .7rem;border-radius:.75rem;border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.03);color:#eef2f6;font-size:.75rem;font-weight:900;text-align:center}
#humanSystemActiveDesc{margin:0;color:#b8c0c8;font-size:.92rem;line-height:1.6}
.human-viewer-perks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem}
.human-viewer-perks>div{min-height:4.1rem;display:flex;flex-direction:column;justify-content:center;gap:.25rem;padding:.7rem .72rem;border:1px solid rgba(255,255,255,.045);border-radius:.85rem;background:rgba(255,255,255,.02)}
.human-viewer-perks small{color:#9ca6af;font-size:.67rem;font-weight:850;letter-spacing:.08em}
.human-viewer-perks b{color:#fff;font-size:1rem;line-height:1.2}
.human-viewer-tips{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.human-viewer-tips>div{padding:.72rem .78rem;border:1px solid rgba(255,255,255,.045);border-radius:.85rem;background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,.008))}
.human-viewer-tips span{display:block;color:#9a6b76;font-size:.62rem;font-weight:900;letter-spacing:.11em}
.human-viewer-tips strong{display:block;margin-top:.14rem;color:#fff;font-size:.92rem}
.human-viewer-tips small{display:block;margin-top:.25rem;color:#aab3bc;font-size:.79rem;line-height:1.45}
.human-viewer-action{margin-top:auto}
.human-viewer-activate{min-height:3.3rem;width:100%;padding:.9rem 1rem;border:1px solid rgba(255,83,113,.18);border-radius:.95rem;background:linear-gradient(180deg,#ff5678,#df2647);box-shadow:0 .8rem 2rem rgba(223,38,71,.22);color:#fff;font-size:.95rem;font-weight:900;letter-spacing:.06em;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease}
.human-viewer-activate:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 1rem 2.2rem rgba(223,38,71,.28)}
.human-viewer-activate:disabled{opacity:.62;cursor:default;box-shadow:none;background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.05);color:#cad1d8}
.human-class-track-wrap.compact{min-height:0;display:flex;flex-direction:column;gap:.8rem;padding:1rem;border:1px solid rgba(255,255,255,.05);border-radius:1rem;background:linear-gradient(180deg,rgba(9,13,20,.95),rgba(7,10,17,.99));overflow:hidden}
.human-class-list-head{display:flex;align-items:flex-end;justify-content:space-between;gap:.7rem}
.human-class-list-head span{display:block;color:#a66d7b;font-size:.62rem;font-weight:900;letter-spacing:.14em}
.human-class-list-head strong{display:block;margin-top:.14rem;color:#fff;font-size:1rem;line-height:1.2}
.human-class-list-head small{max-width:15rem;color:#aeb6be;font-size:.76rem;line-height:1.45;text-align:right}
.human-class-track.compact{min-height:0;flex:1 1 auto;display:grid;grid-template-columns:1fr;gap:.6rem;overflow:auto;padding-right:.1rem}
.human-class-track.compact::-webkit-scrollbar{width:.48rem}
.human-class-track.compact::-webkit-scrollbar-thumb{border-radius:999px;background:rgba(255,255,255,.12)}
.human-class-card.compact{display:grid;grid-template-columns:5.6rem minmax(0,1fr);align-items:center;gap:.8rem;padding:.65rem;border:1px solid rgba(255,255,255,.05);border-radius:.95rem;background:rgba(255,255,255,.018);cursor:pointer;transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease}
.human-class-card.compact:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.1)}
.human-class-card.compact.selected{border-color:rgba(255,84,115,.35);background:linear-gradient(180deg,rgba(255,76,106,.11),rgba(255,76,106,.04));box-shadow:0 .8rem 1.8rem rgba(0,0,0,.22)}
.human-class-card.compact.locked{opacity:.72}
.human-class-card.compact.active{border-color:rgba(255,84,115,.22)}
.human-class-thumb{height:6rem;border-radius:.75rem;border:1px solid rgba(255,255,255,.04);background:radial-gradient(circle at 50% 10%,rgba(255,74,107,.13),transparent 45%),#080c12;overflow:hidden}
.human-class-thumb img{width:100%;height:100%;display:block;object-fit:contain;object-position:center bottom}
.human-class-card.compact.locked .human-class-thumb img{filter:grayscale(.8) brightness(.72)}
.human-class-mini-copy{min-width:0;display:flex;flex-direction:column;gap:.35rem}
.human-class-mini-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.6rem}
.human-class-mini-head small{display:block;color:#b07987;font-size:.6rem;font-weight:900;letter-spacing:.09em}
.human-class-mini-head strong{display:block;margin-top:.12rem;color:#fff;font-size:1rem;line-height:1.1}
.human-class-mini-head span{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;padding:.35rem .55rem;border-radius:999px;border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.03);color:#e5eaf0;font-size:.69rem;font-weight:900}
.human-class-mini-copy p{margin:0;color:#b7c0c7;font-size:.81rem;line-height:1.48}
.human-class-mini-meta{display:flex;flex-direction:column;gap:.28rem}
.human-class-mini-meta b{display:inline-flex;align-items:center;align-self:flex-start;padding:.28rem .5rem;border-radius:999px;border:1px solid rgba(255,255,255,.06);font-size:.66rem;font-weight:900;letter-spacing:.05em}
.human-class-mini-meta b.is-active{color:#ff9bb0;background:rgba(255,76,106,.12);border-color:rgba(255,76,106,.2)}
.human-class-mini-meta b.is-ready{color:#82d89b;background:rgba(10,64,24,.5);border-color:rgba(69,204,109,.18)}
.human-class-mini-meta b.is-locked{color:#c9d0d7;background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.05)}
.human-class-mini-meta small{color:#97a1aa;font-size:.74rem;line-height:1.45}
.human-system-loading{min-height:10rem;display:grid;place-items:center;color:#c1cad2;font-size:.95rem;text-align:center}
.human-system-loading.error{color:#ff9bad}
.human-system-footer.compact{min-height:3rem;display:flex;align-items:center;justify-content:center;gap:.45rem;padding:.7rem 1rem;border-top:1px solid rgba(255,255,255,.05);color:#9ba5ae}
.human-system-footer.compact span{font-size:.72rem;font-weight:900;letter-spacing:.07em}
.human-system-footer.compact i{width:2.8rem;height:1px;background:linear-gradient(90deg,rgba(255,55,84,.18),rgba(255,255,255,.08))}
body.human-system-open{overflow:hidden}
@media (max-width: 1100px){
  .human-system-window{width:min(94vw,64rem)}
  .human-system-body{grid-template-columns:1fr;overflow:auto}
  .human-viewer-panel{grid-template-columns:minmax(12rem,14rem) minmax(0,1fr)}
  .human-class-track-wrap.compact{min-height:18rem}
}
@media (max-width: 760px){
  .human-system-screen{align-items:flex-end;padding:.4rem}
  .human-system-window{width:100%;max-height:95dvh;border-radius:1rem 1rem .75rem .75rem}
  .human-system-header{grid-template-columns:minmax(0,1fr) 2.4rem;gap:.8rem}
  .human-system-progress{grid-column:1/-1;grid-row:2;width:100%}
  .human-system-close{grid-column:2;grid-row:1}
  .human-system-title h2{font-size:1.18rem}
  .human-system-title p{font-size:.84rem}
  .human-system-current.compact{grid-template-columns:1fr;gap:.7rem}
  .human-system-body{padding:.75rem;gap:.75rem}
  .human-viewer-panel{grid-template-columns:1fr;padding:.75rem}
  .human-viewer-stage{min-height:18rem}
  .human-viewer-stage>img{height:88%;max-width:100%}
  .human-viewer-copy-head{flex-direction:column;align-items:flex-start}
  .human-viewer-copy-head h3{font-size:1.18rem}
  #humanSystemActiveDesc{font-size:.9rem}
  .human-viewer-perks{grid-template-columns:1fr 1fr 1fr}
  .human-viewer-perks>div{min-height:auto;padding:.65rem}
  .human-viewer-perks b{font-size:.9rem}
  .human-viewer-tips{grid-template-columns:1fr}
  .human-class-track-wrap.compact{padding:.75rem}
  .human-class-list-head{flex-direction:column;align-items:flex-start}
  .human-class-list-head small{text-align:left;max-width:none}
  .human-class-card.compact{grid-template-columns:4.6rem minmax(0,1fr);gap:.65rem;padding:.58rem}
  .human-class-thumb{height:5rem}
  .human-class-mini-head strong{font-size:.95rem}
  .human-class-mini-copy p{font-size:.78rem}
  .human-system-footer.compact{overflow-x:auto;justify-content:flex-start}
}
@media (max-width: 480px){
  .human-system-title p{display:none}
  .human-system-current.compact{padding:.75rem}
  .human-viewer-perks{grid-template-columns:1fr}
  .human-viewer-role,.human-viewer-level{font-size:.62rem;padding:.35rem .55rem}
  .human-viewer-stage{min-height:16rem}
  .human-class-card.compact{grid-template-columns:4.2rem minmax(0,1fr)}
  .human-class-thumb{height:4.6rem}
}


/* =========================================================
   V40 — COMPACT HUMAN LEVEL SYSTEM
   ========================================================= */

.human-system-window.human-v40{
  width:min(60rem,calc(100vw - 1.2rem))!important;
  height:min(42rem,88dvh)!important;
  max-height:88dvh!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border-radius:.9rem!important;
  background:
    radial-gradient(circle at 7% -10%,rgba(222,43,73,.055),transparent 32%),
    linear-gradient(160deg,#0d1319,#06090e)!important;
}

.human-v40-head{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) 7.8rem 2rem;
  align-items:center;
  gap:.65rem;
  padding:.6rem .7rem;
  border-bottom:1px solid rgba(255,255,255,.045);
}

.human-v40-head>div:first-child>span{
  color:#76545c;
  font-size:.44rem;
  font-weight:900;
  letter-spacing:.10em;
}
.human-v40-head h2{
  margin:.06rem 0 0;
  color:#e8ebed;
  font-size:1.02rem;
}
.human-v40-head p{
  margin:.08rem 0 0;
  color:#7c878f;
  font-size:.54rem;
  line-height:1.4;
}

.human-v40-head-level{
  padding:.34rem .42rem;
  border:1px solid rgba(255,59,88,.07);
  border-radius:.48rem;
  background:rgba(255,48,79,.01);
  text-align:center;
}
.human-v40-head-level small,
.human-v40-head-level strong,
.human-v40-head-level span{
  display:block;
}
.human-v40-head-level small{
  color:#725961;
  font-size:.38rem;
  font-weight:900;
}
.human-v40-head-level strong{
  margin-top:.03rem;
  color:#db7081;
  font-size:.70rem;
}
.human-v40-head-level span{
  margin-top:.02rem;
  color:#747f87;
  font-size:.39rem;
}

.human-v40-how{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:1fr auto 1fr auto 1fr;
  align-items:center;
  gap:.3rem;
  padding:.42rem .7rem;
  border-bottom:1px solid rgba(255,255,255,.04);
  background:rgba(255,255,255,.002);
}
.human-v40-how>div{
  min-width:0;
  display:grid;
  grid-template-columns:1.55rem minmax(0,1fr);
  align-items:center;
  gap:.35rem;
}
.human-v40-how>div>b{
  width:1.45rem;
  height:1.45rem;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,60,88,.08);
  border-radius:.38rem;
  color:#c86b7a;
  background:rgba(255,48,79,.015);
  font-size:.47rem;
}
.human-v40-how strong,
.human-v40-how small{
  display:block;
}
.human-v40-how strong{
  color:#aeb6bc;
  font-size:.48rem;
}
.human-v40-how small{
  margin-top:.02rem;
  color:#68737b;
  font-size:.40rem;
  line-height:1.3;
}
.human-v40-how>i{
  color:#52474a;
  font-size:.55rem;
  font-style:normal;
}

.human-v40-progress{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:8.2rem minmax(12rem,1fr) minmax(12rem,15rem);
  align-items:center;
  gap:.6rem;
  padding:.42rem .7rem;
  border-bottom:1px solid rgba(255,255,255,.04);
}
.human-v40-progress>div:first-child>span,
.human-v40-progress>div:first-child>strong{
  display:block;
}
.human-v40-progress>div:first-child>span{
  color:#685159;
  font-size:.38rem;
  font-weight:900;
}
.human-v40-progress>div:first-child>strong{
  margin-top:.04rem;
  color:#bac1c6;
  font-size:.58rem;
}
.human-v40-progressbar>span{
  display:block;
  color:#657078;
  font-size:.38rem;
  font-weight:850;
}
.human-v40-progressbar>div{
  height:.34rem;
  margin-top:.09rem;
  overflow:hidden;
  border-radius:999px;
  background:#070a0e;
}
.human-v40-progressbar>div>i{
  width:0;
  height:100%;
  display:block;
  border-radius:inherit;
  background:linear-gradient(90deg,#7c1328,#c72140,#ef3e5a);
  transition:width .3s ease;
}
.human-v40-progressbar>small{
  display:block;
  margin-top:.08rem;
  color:#68737b;
  font-size:.39rem;
}
.human-v40-server-note{
  color:#65575a;
  font-size:.40rem;
  line-height:1.35;
  text-align:right;
}

.human-v40-body{
  min-height:0;
  flex:1 1 auto;
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(16rem,.88fr);
  gap:.55rem;
  padding:.55rem;
  overflow:hidden;
}

.human-v40-viewer{
  min-height:0;
  display:grid;
  grid-template-columns:13rem minmax(0,1fr);
  gap:.55rem;
  padding:.48rem;
  border:1px solid rgba(255,255,255,.04);
  border-radius:.62rem;
  background:rgba(255,255,255,.002);
}

.human-v40-model{
  position:relative;
  min-height:0;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.58rem;
  background:
    radial-gradient(circle at 50% 18%,rgba(204,41,70,.10),transparent 40%),
    #070b10;
  perspective:1000px;
  cursor:grab;
  touch-action:none;
}
.human-v40-model.dragging{
  cursor:grabbing;
}
.human-v40-grid{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:1.4rem 1.4rem;
  opacity:.24;
}
.human-v40-floor{
  position:absolute;
  left:10%;
  right:10%;
  bottom:.55rem;
  height:2rem;
  border-radius:50%;
  background:radial-gradient(circle,rgba(220,48,78,.20),transparent 72%);
  filter:blur(.5rem);
}
.human-v40-model>img{
  position:absolute;
  left:50%;
  bottom:.25rem;
  width:auto;
  max-width:112%;
  height:91%;
  object-fit:contain;
  transform:
    translate3d(-50%,0,0)
    rotateX(0deg)
    rotateY(0deg)
    scale(1);
  transform-style:preserve-3d;
  transition:transform .10s ease;
  user-select:none;
  pointer-events:none;
}
.human-v40-model-top{
  position:absolute;
  left:.35rem;
  right:.35rem;
  top:.35rem;
  display:flex;
  justify-content:space-between;
  gap:.25rem;
}
.human-v40-model-top span,
.human-v40-model-top b{
  min-height:1.25rem;
  display:flex;
  align-items:center;
  padding:0 .3rem;
  border:1px solid rgba(255,255,255,.055);
  border-radius:.3rem;
  background:rgba(4,7,11,.74);
  color:#9ca6ad;
  font-size:.36rem;
  font-weight:900;
}
.human-v40-model-top span{color:#c66b79}

.human-v40-inspect{
  position:absolute;
  left:.35rem;
  right:.35rem;
  bottom:.35rem;
  display:flex;
  align-items:center;
  gap:.2rem;
  padding:.22rem;
  border:1px solid rgba(255,255,255,.04);
  border-radius:.38rem;
  background:rgba(4,7,11,.76);
}
.human-v40-inspect span{
  color:#67727a;
  font-size:.31rem;
  font-weight:850;
}
.human-v40-inspect button{
  margin-left:auto;
  min-height:1.2rem;
  padding:0 .26rem;
  border:1px solid rgba(255,255,255,.05);
  border-radius:.25rem;
  color:#7d878e;
  background:rgba(255,255,255,.004);
  font-size:.31rem;
  font-weight:900;
  cursor:pointer;
}

.human-v40-detail{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:.38rem;
}
.human-v40-detail-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:.4rem;
}
.human-v40-detail-head span{
  display:block;
  color:#72545c;
  font-size:.38rem;
  font-weight:900;
  letter-spacing:.07em;
}
.human-v40-detail-head h3{
  margin:.04rem 0 0;
  color:#dce1e4;
  font-size:.82rem;
}
.human-v40-detail-head>strong{
  min-height:1.4rem;
  display:flex;
  align-items:center;
  padding:0 .34rem;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.32rem;
  color:#9fa8af;
  background:rgba(255,255,255,.003);
  font-size:.37rem;
}
#humanSystemActiveDesc{
  margin:0;
  color:#89939a;
  font-size:.52rem;
  line-height:1.48;
}

.human-v40-perks{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.25rem;
}
.human-v40-perks>div{
  min-width:0;
  padding:.35rem;
  border:1px solid rgba(255,255,255,.035);
  border-radius:.38rem;
  background:rgba(255,255,255,.002);
}
.human-v40-perks small,
.human-v40-perks b{
  display:block;
}
.human-v40-perks small{
  color:#616c74;
  font-size:.33rem;
  font-weight:850;
}
.human-v40-perks b{
  margin-top:.04rem;
  color:#9ba4ab;
  font-size:.45rem;
}

.human-v40-model-link{
  padding:.38rem;
  border:1px solid rgba(255,255,255,.035);
  border-radius:.4rem;
  background:rgba(255,255,255,.002);
}
.human-v40-model-link span,
.human-v40-model-link strong,
.human-v40-model-link small{
  display:block;
}
.human-v40-model-link span{
  color:#665157;
  font-size:.32rem;
  font-weight:900;
}
.human-v40-model-link strong{
  margin-top:.05rem;
  color:#b36b78;
  font-size:.48rem;
}
.human-v40-model-link small{
  margin-top:.05rem;
  color:#657078;
  font-size:.36rem;
  line-height:1.35;
}

.human-v40-activate{
  width:100%;
  min-height:2.2rem;
  margin-top:auto;
  border:1px solid rgba(255,61,88,.11);
  border-radius:.42rem;
  color:#e8dadd;
  background:linear-gradient(180deg,rgba(159,25,49,.54),rgba(91,11,28,.60));
  font-size:.45rem;
  font-weight:900;
  cursor:pointer;
}
.human-v40-activate:disabled{
  color:#69737b;
  border-color:rgba(255,255,255,.04);
  background:rgba(255,255,255,.002);
  cursor:default;
}

.human-v40-classes{
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:.35rem;
  padding:.48rem;
  border:1px solid rgba(255,255,255,.04);
  border-radius:.62rem;
  background:rgba(255,255,255,.002);
  overflow:hidden;
}
.human-v40-classes>header{
  display:flex;
  justify-content:space-between;
  gap:.35rem;
  padding:.08rem .08rem .3rem;
}
.human-v40-classes>header span,
.human-v40-classes>header strong{
  display:block;
}
.human-v40-classes>header span{
  color:#72535b;
  font-size:.37rem;
  font-weight:900;
}
.human-v40-classes>header strong{
  margin-top:.04rem;
  color:#a7afb5;
  font-size:.48rem;
}
.human-v40-classes>header small{
  max-width:9rem;
  color:#626d74;
  font-size:.34rem;
  line-height:1.3;
  text-align:right;
}

.human-v40-list{
  min-height:0;
  flex:1 1 auto;
  display:grid;
  grid-template-columns:1fr;
  gap:.27rem;
  overflow-y:auto;
  padding-right:.08rem;
}
.human-v40-list::-webkit-scrollbar{
  width:.32rem;
}
.human-v40-list::-webkit-scrollbar-thumb{
  border-radius:999px;
  background:rgba(255,255,255,.08);
}

.human-v40-class{
  min-height:4.55rem;
  display:grid;
  grid-template-columns:3.45rem minmax(0,1fr) 3rem;
  align-items:center;
  gap:.35rem;
  padding:.30rem;
  border:1px solid rgba(255,255,255,.035);
  border-radius:.46rem;
  background:rgba(255,255,255,.002);
  cursor:pointer;
  transition:.13s ease;
}
.human-v40-class:hover{
  border-color:rgba(255,255,255,.07);
}
.human-v40-class.selected{
  border-color:rgba(255,61,88,.13);
  background:rgba(255,48,79,.014);
}
.human-v40-class.locked{
  opacity:.60;
}
.human-v40-class-thumb{
  height:3.9rem;
  overflow:hidden;
  border-radius:.35rem;
  background:
    radial-gradient(circle at 50% 8%,rgba(255,52,82,.08),transparent 40%),
    #070a0e;
}
.human-v40-class-thumb img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  object-position:center bottom;
}
.human-v40-class.locked .human-v40-class-thumb img{
  filter:grayscale(.9) brightness(.6);
}
.human-v40-class-copy{
  min-width:0;
}
.human-v40-class-copy>div>span,
.human-v40-class-copy>div>strong,
.human-v40-class-copy>small{
  display:block;
}
.human-v40-class-copy>div>span{
  color:#664f56;
  font-size:.31rem;
  font-weight:900;
}
.human-v40-class-copy>div>strong{
  margin-top:.02rem;
  color:#b7bec3;
  font-size:.52rem;
}
.human-v40-class-copy>small{
  margin-top:.12rem;
  overflow:hidden;
  color:#69747c;
  font-size:.35rem;
  line-height:1.32;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.human-v40-class-level{
  text-align:right;
}
.human-v40-class-level b,
.human-v40-class-level small{
  display:block;
}
.human-v40-class-level b{
  color:#8e989f;
  font-size:.39rem;
}
.human-v40-class-level small{
  margin-top:.05rem;
  color:#5f6870;
  font-size:.29rem;
  font-weight:900;
}
.human-v40-class.active .human-v40-class-level b{
  color:#d46d7e;
}
.human-v40-class.unlocked:not(.active) .human-v40-class-level b{
  color:#6ea27b;
}

@media(max-width:900px){
  .human-system-window.human-v40{
    width:calc(100vw - .6rem)!important;
    height:92dvh!important;
    max-height:92dvh!important;
  }

  .human-v40-head{
    grid-template-columns:minmax(0,1fr) 2rem;
  }
  .human-v40-head-level{
    grid-column:1/-1;
    grid-row:2;
    display:grid;
    grid-template-columns:auto auto auto;
    align-items:center;
    text-align:left;
  }

  .human-v40-how{
    grid-template-columns:1fr;
    gap:.28rem;
  }
  .human-v40-how>i{
    display:none;
  }

  .human-v40-progress{
    grid-template-columns:1fr;
    gap:.3rem;
  }
  .human-v40-server-note{
    text-align:left;
  }

  .human-v40-body{
    grid-template-columns:1fr;
    overflow-y:auto;
  }

  .human-v40-viewer{
    grid-template-columns:10rem minmax(0,1fr);
    min-height:20rem;
  }

  .human-v40-classes{
    min-height:17rem;
  }
}

@media(max-width:560px){
  .human-system-screen{
    align-items:flex-end!important;
    padding:.3rem!important;
  }

  .human-system-window.human-v40{
    width:100%!important;
    height:94dvh!important;
    max-height:94dvh!important;
    border-radius:.78rem .78rem .45rem .45rem!important;
  }

  .human-v40-head p{
    display:none;
  }

  .human-v40-viewer{
    grid-template-columns:1fr;
  }

  .human-v40-model{
    min-height:15rem;
  }

  .human-v40-model>img{
    height:88%;
    max-width:100%;
  }

  .human-v40-perks{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .human-v40-class{
    grid-template-columns:3.1rem minmax(0,1fr) 2.8rem;
  }

  .human-v40-class-thumb{
    height:3.45rem;
  }
}


/* =========================================================
   V41 — HUMAN LEVEL PREMIUM REDESIGN
   ========================================================= */

/* Keep the Human window below the fixed top navbar. */
.human-system-screen{
  align-items:start!important;
  padding:5.7rem .7rem .7rem!important;
}

.human-v41-window{
  width:min(58rem,calc(100vw - 1.4rem));
  height:min(40rem,calc(100dvh - 6.5rem));
  max-height:calc(100dvh - 6.5rem);
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.065);
  border-radius:.95rem;
  background:
    radial-gradient(circle at 7% -5%,rgba(208,39,68,.085),transparent 31%),
    radial-gradient(circle at 92% 0%,rgba(112,19,39,.055),transparent 27%),
    linear-gradient(158deg,#10161d,#070a0f 58%,#06090d);
  box-shadow:
    0 2rem 5rem rgba(0,0,0,.58),
    inset 0 1px 0 rgba(255,255,255,.025);
}

.human-v41-window:before{
  content:"";
  height:.16rem;
  position:absolute;
  left:1rem;
  right:1rem;
  top:0;
  border-radius:0 0 1rem 1rem;
  background:linear-gradient(90deg,transparent,#b6223e 35%,#ec3e5d 50%,#b6223e 65%,transparent);
  opacity:.56;
}

/* HEADER */
.human-v41-header{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) 8.4rem 2.25rem;
  align-items:center;
  gap:.8rem;
  padding:.75rem .8rem .68rem;
  border-bottom:1px solid rgba(255,255,255,.045);
}

.human-v41-brand>span{
  color:#9f626f;
  font-size:.61rem;
  font-weight:900;
  letter-spacing:.14em;
}
.human-v41-brand h2{
  margin:.08rem 0 0;
  color:#f0f2f4;
  font-size:1.32rem;
  line-height:1.1;
}
.human-v41-brand p{
  margin:.19rem 0 0;
  color:#9ba5ad;
  font-size:.76rem;
  line-height:1.45;
}

.human-v41-account{
  padding:.52rem .55rem;
  border:1px solid rgba(255,62,90,.08);
  border-radius:.62rem;
  background:
    linear-gradient(180deg,rgba(255,50,80,.04),rgba(255,50,80,.006));
  text-align:center;
}
.human-v41-account span,
.human-v41-account strong,
.human-v41-account small{
  display:block;
}
.human-v41-account>span{
  color:#8e646c;
  font-size:.50rem;
  font-weight:900;
}
.human-v41-account strong{
  margin-top:.04rem;
  color:#e87d8f;
  font-size:.88rem;
}
.human-v41-account small{
  margin-top:.05rem;
  color:#9ca5ac;
  font-size:.55rem;
}

.human-v41-close{
  width:2.15rem!important;
  height:2.15rem!important;
  border-radius:.5rem!important;
  font-size:.9rem!important;
}

/* HOW IT WORKS */
.human-v41-roadmap{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(15rem,.7fr);
  align-items:center;
  gap:.8rem;
  padding:.56rem .8rem;
  border-bottom:1px solid rgba(255,255,255,.04);
  background:rgba(255,255,255,.002);
}

.human-v41-roadmap-copy{
  display:flex;
  align-items:center;
  gap:.36rem;
  min-width:0;
}
.human-v41-roadmap-copy>strong{
  color:#8f636c;
  font-size:.56rem;
  white-space:nowrap;
}
.human-v41-roadmap-copy>span{
  display:inline-flex;
  align-items:center;
  gap:.28rem;
  color:#aab2b8;
  font-size:.58rem;
  font-weight:750;
  white-space:nowrap;
}
.human-v41-roadmap-copy>span>b{
  width:1.25rem;
  height:1.25rem;
  display:grid;
  place-items:center;
  flex:0 0 1.25rem;
  border:1px solid rgba(255,63,92,.09);
  border-radius:.34rem;
  color:#d37382;
  background:rgba(255,48,79,.015);
  font-size:.48rem;
}
.human-v41-roadmap-copy>i{
  color:#53484b;
  font-size:.52rem;
  font-style:normal;
}

.human-v41-xpbar>div:first-child{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
}
.human-v41-xpbar span{
  color:#7c858d;
  font-size:.52rem;
  font-weight:850;
}
.human-v41-xpbar strong{
  color:#adb5bc;
  font-size:.57rem;
}
.human-v41-xptrack{
  height:.44rem;
  margin-top:.24rem;
  overflow:hidden;
  border:1px solid rgba(255,58,88,.055);
  border-radius:999px;
  background:#070a0e;
}
.human-v41-xptrack>i{
  width:0;
  height:100%;
  display:block;
  border-radius:inherit;
  background:linear-gradient(90deg,#721126,#c52140 55%,#ef4763);
  box-shadow:0 0 .7rem rgba(224,45,75,.22);
  transition:width .32s ease;
}

/* MAIN */
.human-v41-content{
  min-height:0;
  flex:1 1 auto;
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(17rem,.88fr);
  gap:.6rem;
  padding:.6rem;
  overflow:hidden;
}

.human-v41-showcase{
  min-height:0;
  display:grid;
  grid-template-columns:14rem minmax(0,1fr);
  gap:.62rem;
  padding:.55rem;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.042);
  border-radius:.72rem;
  background:
    linear-gradient(180deg,rgba(255,255,255,.007),rgba(255,255,255,.002));
}

/* MODEL */
.human-v41-stage{
  position:relative;
  min-height:0;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.048);
  border-radius:.64rem;
  background:
    radial-gradient(circle at 50% 20%,rgba(215,42,72,.13),transparent 40%),
    linear-gradient(180deg,#080c12,#070a0f);
  perspective:1050px;
  cursor:grab;
  touch-action:none;
}
.human-v41-stage.dragging{cursor:grabbing}

.human-v41-stage-grid{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:1.45rem 1.45rem;
  opacity:.25;
}
.human-v41-stage-haze{
  position:absolute;
  width:11rem;
  height:11rem;
  left:50%;
  top:17%;
  transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(circle,rgba(203,44,72,.18),transparent 70%);
  filter:blur(1rem);
}
.human-v41-stage-floor{
  position:absolute;
  left:8%;
  right:8%;
  bottom:.55rem;
  height:2.2rem;
  border-radius:50%;
  background:radial-gradient(circle,rgba(214,48,76,.22),transparent 72%);
  filter:blur(.58rem);
}
.human-v41-stage>img{
  position:absolute;
  left:50%;
  bottom:.25rem;
  width:auto;
  max-width:112%;
  height:92%;
  object-fit:contain;
  transform:translate3d(-50%,0,0) scale(1);
  transform-style:preserve-3d;
  transition:transform .10s ease;
  user-select:none;
  pointer-events:none;
}

.human-v41-stage-top{
  position:absolute;
  left:.42rem;
  right:.42rem;
  top:.42rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.35rem;
}
.human-v41-stage-top span,
.human-v41-stage-top strong{
  min-height:1.4rem;
  display:flex;
  align-items:center;
  padding:0 .4rem;
  border:1px solid rgba(255,255,255,.06);
  border-radius:.36rem;
  background:rgba(5,8,12,.74);
  backdrop-filter:blur(.3rem);
  -webkit-backdrop-filter:blur(.3rem);
  font-size:.48rem;
  font-weight:900;
}
.human-v41-stage-top span{color:#d07181}
.human-v41-stage-top strong{color:#d3d9dd}

.human-v41-stage-controls{
  position:absolute;
  left:.4rem;
  right:.4rem;
  bottom:.4rem;
  display:flex;
  align-items:center;
  gap:.4rem;
  padding:.35rem .4rem;
  border:1px solid rgba(255,255,255,.045);
  border-radius:.42rem;
  background:rgba(4,7,11,.80);
}
.human-v41-stage-controls span{
  color:#79838a;
  font-size:.40rem;
  font-weight:850;
}
.human-v41-stage-controls button{
  margin-left:auto;
  min-height:1.45rem;
  padding:0 .38rem;
  border:1px solid rgba(255,255,255,.055);
  border-radius:.30rem;
  color:#89939a;
  background:rgba(255,255,255,.004);
  font-size:.40rem;
  font-weight:900;
  cursor:pointer;
}

/* INFO */
.human-v41-info{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:.48rem;
}
.human-v41-info-title{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:.5rem;
}
.human-v41-info-title span{
  display:block;
  color:#89606a;
  font-size:.53rem;
  font-weight:900;
  letter-spacing:.09em;
}
.human-v41-info-title h3{
  margin:.08rem 0 0;
  color:#e5e9eb;
  font-size:1.05rem;
}
.human-v41-info-title>strong{
  min-height:1.7rem;
  display:flex;
  align-items:center;
  padding:0 .48rem;
  border:1px solid rgba(255,255,255,.05);
  border-radius:.42rem;
  color:#a7afb5;
  background:rgba(255,255,255,.003);
  font-size:.48rem;
}
#humanSystemActiveDesc{
  margin:0!important;
  color:#9ea7ae!important;
  font-size:.70rem!important;
  line-height:1.50!important;
}

.human-v41-perks{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.3rem;
}
.human-v41-perks>div{
  min-width:0;
  padding:.48rem;
  border:1px solid rgba(255,255,255,.038);
  border-radius:.46rem;
  background:rgba(255,255,255,.002);
}
.human-v41-perks small,
.human-v41-perks b{
  display:block;
}
.human-v41-perks small{
  color:#737d84;
  font-size:.47rem;
  font-weight:850;
}
.human-v41-perks b{
  margin-top:.06rem;
  color:#b7bec3;
  font-size:.64rem;
}

.human-v41-explain{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.3rem;
}
.human-v41-explain>div{
  padding:.43rem .46rem;
  border:1px solid rgba(255,255,255,.036);
  border-radius:.44rem;
  background:rgba(255,255,255,.002);
}
.human-v41-explain span,
.human-v41-explain strong{
  display:block;
}
.human-v41-explain span{
  color:#6d777e;
  font-size:.44rem;
  font-weight:850;
}
.human-v41-explain strong{
  margin-top:.05rem;
  color:#a2abb2;
  font-size:.58rem;
}

.human-v41-active{
  padding:.45rem .48rem;
  border-left:.13rem solid rgba(218,55,83,.54);
  border-radius:0 .42rem .42rem 0;
  background:linear-gradient(90deg,rgba(210,39,70,.045),transparent);
}
.human-v41-active span,
.human-v41-active strong,
.human-v41-active small{
  display:block;
}
.human-v41-active span{
  color:#89606a;
  font-size:.44rem;
  font-weight:900;
}
.human-v41-active strong{
  margin-top:.04rem;
  color:#d77a89;
  font-size:.65rem;
}
.human-v41-active small{
  margin-top:.06rem;
  color:#717b82;
  font-size:.48rem;
  line-height:1.4;
}

.human-v41-action{
  margin-top:auto;
}
.human-v40-activate{
  min-height:2.6rem!important;
  border-radius:.48rem!important;
  font-size:.58rem!important;
}

/* CLASS SELECTOR */
.human-v41-selector{
  min-height:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.042);
  border-radius:.72rem;
  background:
    radial-gradient(circle at 100% 0%,rgba(187,34,62,.035),transparent 30%),
    rgba(255,255,255,.002);
}
.human-v41-selector>header{
  flex:0 0 auto;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:.5rem;
  padding:.58rem .62rem .48rem;
  border-bottom:1px solid rgba(255,255,255,.035);
}
.human-v41-selector>header span,
.human-v41-selector>header strong{
  display:block;
}
.human-v41-selector>header span{
  color:#8e606b;
  font-size:.52rem;
  font-weight:900;
  letter-spacing:.08em;
}
.human-v41-selector>header strong{
  margin-top:.05rem;
  color:#b9c0c5;
  font-size:.62rem;
}
.human-v41-selector>header small{
  max-width:9rem;
  color:#727c83;
  font-size:.48rem;
  line-height:1.35;
  text-align:right;
}

.human-v41-list{
  min-height:0;
  flex:1 1 auto;
  display:grid;
  grid-template-columns:1fr;
  gap:.32rem;
  overflow-y:auto;
  padding:.42rem;
}
.human-v41-list::-webkit-scrollbar{width:.34rem}
.human-v41-list::-webkit-scrollbar-thumb{
  border-radius:999px;
  background:rgba(255,255,255,.09);
}

.human-v41-card{
  min-height:4.65rem;
  display:grid;
  grid-template-columns:3.8rem minmax(0,1fr) 3.6rem;
  align-items:center;
  gap:.42rem;
  padding:.34rem;
  border:1px solid rgba(255,255,255,.038);
  border-radius:.52rem;
  background:rgba(255,255,255,.002);
  cursor:pointer;
  transition:.14s ease;
}
.human-v41-card:hover{
  transform:translateX(-.08rem);
  border-color:rgba(255,255,255,.075);
}
.human-v41-card.selected{
  border-color:rgba(223,55,84,.18);
  background:
    linear-gradient(90deg,rgba(209,38,69,.055),rgba(209,38,69,.005));
}
.human-v41-card.locked{
  opacity:.58;
}
.human-v41-card-model{
  height:4rem;
  overflow:hidden;
  border-radius:.40rem;
  background:
    radial-gradient(circle at 50% 10%,rgba(214,45,74,.09),transparent 45%),
    #070a0f;
}
.human-v41-card-model img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  object-position:center bottom;
}
.human-v41-card.locked .human-v41-card-model img{
  filter:grayscale(.9) brightness(.62);
}
.human-v41-card-copy{
  min-width:0;
}
.human-v41-card-copy span,
.human-v41-card-copy strong,
.human-v41-card-copy small{
  display:block;
}
.human-v41-card-copy span{
  color:#75545c;
  font-size:.43rem;
  font-weight:900;
}
.human-v41-card-copy strong{
  margin-top:.03rem;
  color:#b8c0c5;
  font-size:.61rem;
}
.human-v41-card-copy small{
  margin-top:.12rem;
  overflow:hidden;
  color:#737d84;
  font-size:.45rem;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.human-v41-card-state{
  text-align:right;
}
.human-v41-card-state b,
.human-v41-card-state span{
  display:block;
}
.human-v41-card-state b{
  color:#9aa3aa;
  font-size:.52rem;
}
.human-v41-card-state span{
  margin-top:.05rem;
  color:#636d74;
  font-size:.35rem;
  font-weight:900;
}
.human-v41-card.active .human-v41-card-state span{color:#cc6878}
.human-v41-card.unlocked:not(.active) .human-v41-card-state span{color:#6ea37b}

.human-v41-selector>footer{
  flex:0 0 auto;
  min-height:2rem;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.26rem;
  padding:.36rem;
  border-top:1px solid rgba(255,255,255,.035);
}
.human-v41-selector>footer span{
  color:#747e85;
  font-size:.39rem;
  font-weight:900;
}
.human-v41-selector>footer i{
  width:1.2rem;
  height:1px;
  background:rgba(255,255,255,.055);
}

/* =========================================================
   Avatar menu miniature active Human
   ========================================================= */
.account-human-level-v41{
  min-height:4.6rem!important;
  grid-template-columns:3.2rem minmax(0,1fr) 1rem!important;
  gap:.55rem!important;
  padding:.4rem .5rem!important;
  overflow:hidden;
}
.account-human-preview{
  width:3.05rem;
  height:3.7rem;
  position:relative;
  display:block;
  overflow:hidden;
  border:1px solid rgba(255,63,92,.085);
  border-radius:.5rem;
  background:
    radial-gradient(circle at 50% 20%,rgba(219,48,77,.11),transparent 45%),
    #080c11;
}
.account-human-preview-glow{
  position:absolute;
  left:.3rem;
  right:.3rem;
  bottom:.15rem;
  height:.6rem;
  border-radius:50%;
  background:rgba(215,46,76,.16);
  filter:blur(.25rem);
}
.account-human-preview img{
  width:100%;
  height:100%;
  position:relative;
  z-index:1;
  display:block;
  object-fit:contain;
  object-position:center bottom;
}
.account-human-copy{
  min-width:0;
}
.account-human-copy small,
.account-human-copy strong,
.account-human-copy em{
  display:block;
}
.account-human-copy small{
  color:#95616d!important;
  font-size:.48rem!important;
  letter-spacing:.08em!important;
}
.account-human-copy strong{
  margin-top:.06rem!important;
  color:#d0d5d8!important;
  font-size:.73rem!important;
}
.account-human-copy em{
  margin-top:.10rem!important;
  color:#78828a!important;
  font-size:.50rem!important;
}
.account-human-chevron{
  color:#8b5360;
  font-size:1rem;
}

/* =========================================================
   Mobile private messages:
   hide ONLY official X-Sites read-only notice.
   Mini Shop transactional notice remains visible.
   ========================================================= */
@media(max-width:620px){
  .chat-disabled.system-readonly-notice:not(.shop-readonly-notice){
    display:none!important;
  }
}

/* RESPONSIVE HUMAN V41 */
@media(max-width:980px){
  .human-v41-window{
    width:calc(100vw - 1rem);
    height:calc(100dvh - 6.1rem);
    max-height:calc(100dvh - 6.1rem);
  }

  .human-v41-roadmap{
    grid-template-columns:1fr;
  }

  .human-v41-roadmap-copy{
    overflow-x:auto;
    padding-bottom:.08rem;
  }

  .human-v41-content{
    grid-template-columns:1fr;
    overflow-y:auto;
  }

  .human-v41-showcase{
    min-height:23rem;
  }

  .human-v41-selector{
    min-height:18rem;
  }
}

@media(max-width:650px){
  .human-system-screen{
    padding:5.25rem .3rem .3rem!important;
  }

  .human-v41-window{
    width:100%;
    height:calc(100dvh - 5.55rem);
    max-height:calc(100dvh - 5.55rem);
    border-radius:.72rem .72rem .45rem .45rem;
  }

  .human-v41-header{
    grid-template-columns:minmax(0,1fr) 2.1rem;
    padding:.62rem;
  }

  .human-v41-account{
    grid-column:1/-1;
    grid-row:2;
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    align-items:center;
    text-align:left;
  }

  .human-v41-brand h2{
    font-size:1.1rem;
  }
  .human-v41-brand p{
    font-size:.69rem;
  }

  .human-v41-roadmap-copy{
    gap:.3rem;
  }
  .human-v41-roadmap-copy>strong{
    display:none;
  }
  .human-v41-roadmap-copy>span{
    font-size:.52rem;
  }

  .human-v41-showcase{
    grid-template-columns:1fr;
    min-height:auto;
  }

  .human-v41-stage{
    min-height:17rem;
  }

  .human-v41-stage>img{
    height:88%;
    max-width:100%;
  }

  .human-v41-info-title h3{
    font-size:.95rem;
  }

  #humanSystemActiveDesc{
    font-size:.67rem!important;
  }

  .human-v41-selector{
    min-height:19rem;
  }
}


/* =========================================================
   V42 — 360 TURNAROUND / MOBILE / PROFILE HUMAN / VIAL
   ========================================================= */

/* Frames already include the viewer background. */
.human-v41-stage>img{
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  bottom:0!important;
  object-fit:cover!important;
  object-position:center!important;
}

.human-v42-controls b{
  margin-left:auto;
  color:#d17a89;
  font-size:.45rem;
  font-weight:900;
}
.human-v42-controls button{margin-left:0!important}

/* readability */
.human-v41-brand h2{font-size:1.40rem!important}
.human-v41-brand p{color:#b3bbc2!important;font-size:.80rem!important}
.human-v41-roadmap-copy>span{color:#b6bec4!important;font-size:.62rem!important}
.human-v41-card-copy strong{color:#cdd2d6!important;font-size:.66rem!important}
.human-v41-card-copy small{color:#8d979e!important;font-size:.48rem!important}
.human-v41-stage-controls span{color:#929ca3!important}

/* Public profile Human */
.public-profile-human{
  display:grid;
  grid-template-columns:4.15rem minmax(0,1fr) auto;
  align-items:center;
  gap:.55rem;
  margin-top:.55rem;
  padding:.48rem;
  overflow:hidden;
  border:1px solid rgba(255,65,93,.065);
  border-radius:.62rem;
  background:radial-gradient(circle at 6% 50%,rgba(220,46,76,.055),transparent 28%),rgba(255,255,255,.003);
}
.public-profile-human.hidden{display:none!important}
.public-profile-human-model{
  width:4rem;height:4.8rem;position:relative;overflow:hidden;
  border:1px solid rgba(255,59,88,.07);border-radius:.5rem;
  background:radial-gradient(circle at 50% 20%,rgba(218,45,75,.10),transparent 45%),#080c11;
}
.public-profile-human-model>span{
  position:absolute;left:.45rem;right:.45rem;bottom:.18rem;height:.55rem;
  border-radius:50%;background:rgba(215,46,76,.13);filter:blur(.22rem)
}
.public-profile-human-model img{
  width:100%;height:100%;position:relative;z-index:1;display:block;object-fit:contain;object-position:center bottom
}
.public-profile-human-copy{min-width:0}
.public-profile-human-copy span,.public-profile-human-copy strong,.public-profile-human-copy small{display:block}
.public-profile-human-copy span{color:#8d606a;font-size:.49rem;font-weight:900;letter-spacing:.08em}
.public-profile-human-copy strong{margin-top:.05rem;color:#d2d7da;font-size:.73rem}
.public-profile-human-copy small{margin-top:.10rem;color:#818b92;font-size:.48rem;line-height:1.35}
.public-profile-human-perks{display:grid;gap:.18rem;min-width:5rem}
.public-profile-human-perks>span{
  display:flex;align-items:center;justify-content:space-between;gap:.35rem;
  min-height:1.25rem;padding:0 .3rem;border:1px solid rgba(255,255,255,.035);
  border-radius:.32rem;background:rgba(255,255,255,.002)
}
.public-profile-human-perks small{color:#69747b;font-size:.36rem;font-weight:850}
.public-profile-human-perks b{color:#a4adb3;font-size:.40rem}

/* VIAL: same neutral stat tile + tiny green V */
.account-popover-stats .account-vial-v42{
  min-width:0;padding:.58rem .52rem!important;
  border:1px solid rgba(255,255,255,.055)!important;border-radius:.65rem!important;
  color:inherit!important;background:rgba(255,255,255,.018)!important;box-shadow:none!important;text-align:left
}
.account-popover-stats .account-vial-v42>span{color:#6e7882!important}
.account-popover-stats .account-vial-v42>strong{
  display:flex!important;align-items:center!important;justify-content:space-between!important;margin-top:.20rem!important
}
.account-vial-value{display:inline-flex!important;align-items:center!important;gap:.20rem!important;min-width:0}
.account-vial-value>i.account-vial-v{
  width:.92rem!important;height:.92rem!important;display:grid!important;place-items:center!important;flex:0 0 .92rem;
  border-radius:.27rem!important;color:#58d879!important;background:rgba(64,191,95,.045)!important;
  box-shadow:0 0 .45rem rgba(64,191,95,.10);font-size:.46rem!important;font-style:normal!important;font-weight:950!important
}
.account-vial-value>b{color:#d8dde1!important;font-size:.70rem!important}
.account-vial-plus{
  width:1.05rem!important;height:1.05rem!important;display:grid!important;place-items:center!important;
  border-radius:.31rem!important;color:#778188!important;background:rgba(255,255,255,.018)!important;
  font-size:.45rem!important;font-style:normal!important
}

/* Phones: hide both official and Mini Shop readonly notices. */
@media(max-width:620px){
  .chat-disabled.system-readonly-notice,
  .chat-disabled.shop-readonly-notice{display:none!important}
}

/* Mobile Human optimization */
@media(max-width:650px){
  .human-system-screen{padding:4.9rem .22rem .22rem!important}
  .human-v41-window{
    width:100%!important;height:calc(100dvh - 5.15rem)!important;
    max-height:calc(100dvh - 5.15rem)!important;border-radius:.74rem .74rem .42rem .42rem!important
  }
  .human-v41-header{padding:.50rem!important}
  .human-v41-brand>span{font-size:.49rem!important}
  .human-v41-brand h2{font-size:1.08rem!important}
  .human-v41-brand p{display:block!important;font-size:.64rem!important;line-height:1.38!important}
  .human-v41-account{padding:.35rem!important}
  .human-v41-roadmap{padding:.38rem .48rem!important}
  .human-v41-roadmap-copy{
    display:grid!important;grid-template-columns:1fr!important;gap:.16rem!important;overflow:visible!important
  }
  .human-v41-roadmap-copy>span{font-size:.52rem!important;white-space:normal!important}
  .human-v41-roadmap-copy>i{display:none!important}
  .human-v41-content{padding:.38rem!important;gap:.38rem!important}
  .human-v41-showcase{grid-template-columns:1fr!important;gap:.4rem!important;padding:.38rem!important}

  /* Main mobile fix: real space for the model. */
  .human-v41-stage{min-height:22rem!important;height:48dvh!important;max-height:27rem!important}
  .human-v41-stage>img{width:100%!important;height:100%!important;object-fit:cover!important}

  .human-v41-stage-controls{gap:.20rem!important;padding:.28rem!important}
  .human-v41-stage-controls span{font-size:.34rem!important}
  .human-v42-controls b{font-size:.38rem!important}
  #humanSystemActiveDesc{font-size:.64rem!important}
  .human-v41-selector{min-height:20rem!important}
  .human-v41-card{min-height:4rem!important}

  .public-profile-human{grid-template-columns:3.7rem minmax(0,1fr)!important}
  .public-profile-human-model{width:3.55rem!important;height:4.25rem!important}
  .public-profile-human-perks{grid-column:1/-1;grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:420px){
  .human-v41-stage{min-height:20rem!important;height:45dvh!important}
  .human-v41-stage-controls span:nth-child(2){display:none!important}
}


/* =========================================================
   V43 — HUMAN READABILITY / MOBILE MINI MODELS / AVATAR FX
   ========================================================= */

/* Back to one front Human model; no 360 turnaround. */
.human-v41-stage>img{
  width:auto!important;max-width:112%!important;height:92%!important;left:50%!important;
  bottom:.25rem!important;object-fit:contain!important;object-position:center bottom!important
}

/* Human Level readability */
.human-v41-brand>span{font-size:.64rem!important}
.human-v41-brand h2{font-size:1.46rem!important}
.human-v41-brand p{font-size:.84rem!important;line-height:1.5!important;color:#b9c1c7!important}
.human-v41-account>span{font-size:.56rem!important}
.human-v41-account strong{font-size:.96rem!important}
.human-v41-account small{font-size:.61rem!important}
.human-v41-roadmap-copy>strong{font-size:.62rem!important}
.human-v41-roadmap-copy>span{font-size:.66rem!important;color:#c0c6cb!important}
.human-v41-xpbar span{font-size:.57rem!important}.human-v41-xpbar strong{font-size:.64rem!important}
.human-v41-info-title span{font-size:.59rem!important}.human-v41-info-title h3{font-size:1.12rem!important}
.human-v41-info-title>strong{font-size:.54rem!important}
#humanSystemActiveDesc{font-size:.76rem!important;color:#adb5bb!important;line-height:1.55!important}
.human-v41-perks small{font-size:.52rem!important}.human-v41-perks b{font-size:.70rem!important}
.human-v41-explain span{font-size:.49rem!important}.human-v41-explain strong{font-size:.64rem!important}
.human-v41-active span{font-size:.49rem!important}.human-v41-active strong{font-size:.72rem!important}.human-v41-active small{font-size:.54rem!important}
.human-v41-selector>header span{font-size:.58rem!important}.human-v41-selector>header strong{font-size:.69rem!important}.human-v41-selector>header small{font-size:.53rem!important}
.human-v41-card-copy span{font-size:.48rem!important}.human-v41-card-copy strong{font-size:.70rem!important}.human-v41-card-copy small{font-size:.52rem!important;color:#929ba1!important}
.human-v41-card-state b{font-size:.57rem!important}.human-v41-card-state span{font-size:.40rem!important}

/* Phone: hide big model completely; class miniatures are the model UI. */
@media(max-width:650px){
  .human-v41-stage{display:none!important}
  .human-v41-content{display:flex!important;flex-direction:column!important}
  .human-v41-selector{order:-1;min-height:21rem!important}
  .human-v41-showcase{display:block!important;min-height:0!important}
  .human-v41-info{padding:.18rem!important}
  .human-v41-info-title h3{font-size:1.03rem!important}
  #humanSystemActiveDesc{font-size:.72rem!important}
  .human-v41-perks small{font-size:.55rem!important}.human-v41-perks b{font-size:.72rem!important}
  .human-v41-card{min-height:4.75rem!important;grid-template-columns:4.1rem minmax(0,1fr) 3.65rem!important}
  .human-v41-card-model{height:4.15rem!important}
  .human-v41-card-copy span{font-size:.50rem!important}.human-v41-card-copy strong{font-size:.72rem!important}.human-v41-card-copy small{font-size:.54rem!important}
}

/* Public profile: Human Class + Active Benefits readability */
.public-profile-human{grid-template-columns:4.8rem minmax(0,1fr) minmax(7rem,auto)!important;gap:.7rem!important;padding:.62rem!important}
.public-profile-human-model{width:4.65rem!important;height:5.45rem!important}
.public-profile-human-copy span{font-size:.58rem!important}.public-profile-human-copy strong{font-size:.90rem!important}
.public-profile-human-copy small{font-size:.62rem!important;color:#9aa4ab!important}
.public-profile-human-perks{gap:.26rem!important}
.public-profile-human-perks>span{min-height:1.55rem!important;padding:0 .42rem!important}
.public-profile-human-perks small{font-size:.46rem!important}.public-profile-human-perks b{font-size:.54rem!important}
.public-profile-benefits-head>span{font-size:.64rem!important}.public-profile-benefits-head>small{font-size:.58rem!important}
.public-profile-benefit-card{min-height:4.4rem!important;padding:.52rem!important;gap:.48rem!important}
.public-profile-benefit-card img{width:3.25rem!important;height:3.25rem!important}
.public-profile-benefit-card span{font-size:.50rem!important}.public-profile-benefit-card strong{font-size:.69rem!important;color:#c4cbd0!important}
.public-profile-benefit-card small{font-size:.57rem!important;color:#858f96!important}.public-profile-benefit-card>b{font-size:.74rem!important}
.public-profile-benefits-more{font-size:.60rem!important;min-height:2.6rem!important}
@media(max-width:620px){
  .public-profile-human{grid-template-columns:4.15rem minmax(0,1fr)!important}
  .public-profile-human-model{width:4rem!important;height:4.7rem!important}
  .public-profile-human-copy span{font-size:.57rem!important}.public-profile-human-copy strong{font-size:.84rem!important}.public-profile-human-copy small{font-size:.59rem!important}
  .public-profile-human-perks{grid-column:1/-1!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .public-profile-benefit-card span{font-size:.53rem!important}.public-profile-benefit-card strong{font-size:.72rem!important}.public-profile-benefit-card small{font-size:.60rem!important}
}

/* Animated avatar cosmetics */
.avatar-fx{position:relative!important;overflow:visible!important;isolation:isolate}
.avatar-fx>img,.avatar-fx>span,.avatar-fx>i,.avatar-fx>b{position:relative;z-index:2}
.avatar-fx-fire::before{
  content:"";position:absolute;inset:-.32rem;z-index:0;border-radius:50%;
  background:conic-gradient(from 0deg,transparent,#ff3b12 10%,#ffd34a 18%,#ff310d 27%,transparent 36%,#ff2e09 48%,#ffda55 58%,#ff350b 70%,transparent 81%,#ff7616 91%,transparent);
  filter:blur(.08rem) drop-shadow(0 0 .35rem rgba(255,70,15,.55));
  animation:avatarFireSpin 1.55s linear infinite,avatarFirePulse .72s ease-in-out infinite alternate;pointer-events:none
}
.avatar-fx-fire::after{
  content:"";position:absolute;inset:-.48rem;z-index:0;border-radius:50%;
  background:radial-gradient(circle at 18% 78%,rgba(255,190,42,.82) 0 .08rem,transparent .13rem),radial-gradient(circle at 76% 8%,rgba(255,74,18,.90) 0 .11rem,transparent .17rem),radial-gradient(circle at 90% 63%,rgba(255,218,80,.80) 0 .07rem,transparent .12rem),radial-gradient(circle at 38% 0%,rgba(255,62,10,.90) 0 .09rem,transparent .15rem);
  filter:drop-shadow(0 0 .25rem rgba(255,73,10,.8));animation:avatarFireParticles 1.1s ease-in-out infinite alternate;pointer-events:none
}
.avatar-fx-infected::after{
  content:"";position:absolute;inset:-.45rem;z-index:3;border-radius:50%;
  background:radial-gradient(circle at 50% 0%,#74ff7d 0 .09rem,transparent .14rem),radial-gradient(circle at 98% 47%,#38dc59 0 .12rem,transparent .18rem),radial-gradient(circle at 66% 96%,#93ff72 0 .08rem,transparent .14rem),radial-gradient(circle at 6% 67%,#32cd4d 0 .11rem,transparent .17rem),radial-gradient(circle at 17% 17%,#6cff79 0 .07rem,transparent .13rem);
  filter:drop-shadow(0 0 .24rem rgba(77,255,103,.75)) drop-shadow(0 0 .45rem rgba(32,188,64,.35));
  animation:avatarInfectedOrbit 2.35s linear infinite;pointer-events:none
}
.avatar-fx-infected:not(.avatar-fx-fire)::before{
  content:"";position:absolute;inset:-.22rem;z-index:0;border-radius:50%;border:.10rem solid rgba(80,255,101,.26);
  box-shadow:0 0 .45rem rgba(70,255,94,.28),inset 0 0 .35rem rgba(61,218,83,.14);
  animation:avatarInfectedPulse 1.5s ease-in-out infinite alternate;pointer-events:none
}
@keyframes avatarFireSpin{to{transform:rotate(360deg)}}
@keyframes avatarFirePulse{from{transform:scale(.95);opacity:.68}to{transform:scale(1.06);opacity:1}}
@keyframes avatarFireParticles{from{transform:translateY(.07rem) scale(.94);opacity:.62}to{transform:translateY(-.08rem) scale(1.06);opacity:1}}
@keyframes avatarInfectedOrbit{to{transform:rotate(360deg)}}
@keyframes avatarInfectedPulse{from{opacity:.45;transform:scale(.96)}to{opacity:1;transform:scale(1.05)}}
.topbar-avatar-shell.avatar-fx>img,.account-popover-avatar.avatar-fx>img,.thread-list-avatar-wrap.avatar-fx>img,.thread-avatar-wrap.avatar-fx>img,.contributor-avatar-wrap.avatar-fx>img,.forum-online-avatar.avatar-fx>img,.public-profile-avatar-shell.avatar-fx>img{border-radius:50%!important}

/* Mini Shop avatar cosmetic cards */
.avatar-effect-media{
  min-height:13rem!important;display:grid!important;place-items:center!important;position:relative;
  background:radial-gradient(circle at 50% 46%,rgba(188,43,64,.07),transparent 34%),linear-gradient(160deg,#0c1117,#070a0e)!important
}
.avatar-effect-media.infected{background:radial-gradient(circle at 50% 46%,rgba(55,205,80,.075),transparent 34%),linear-gradient(160deg,#0b1210,#070a0e)!important}
.shop-avatar-demo{width:6.6rem;height:6.6rem;border-radius:50%}
.shop-avatar-demo img{width:100%;height:100%;display:block;object-fit:cover;border-radius:50%}
.avatar-effect-permanent{position:absolute;right:.55rem;top:.55rem;min-height:1.55rem;display:flex;align-items:center;padding:0 .45rem;border:1px solid rgba(255,255,255,.05);border-radius:.38rem;color:#9da6ad;background:rgba(5,8,12,.70);font-size:.46rem;font-weight:900}
.infected-buy{border-color:rgba(70,218,96,.14)!important;background:linear-gradient(180deg,rgba(31,125,51,.52),rgba(12,71,27,.60))!important}
.mini-shop-permanent-cosmetic{min-height:1.55rem;display:inline-flex;align-items:center;padding:0 .42rem;border:1px solid rgba(83,205,106,.08);border-radius:.34rem;color:#76b983;background:rgba(41,137,59,.018);font-size:.42rem;font-weight:900}
@media(max-width:620px){.avatar-effect-media{min-height:11rem!important}.shop-avatar-demo{width:5.8rem;height:5.8rem}}


/* =========================================================
   V44 — ONE AVATAR EFFECT / CENTERING / LOW-END PC MODE
   ========================================================= */

/* Center every cosmetic effect on the actual avatar wrapper.
   V43 used inset + competing transform animations, which could visually drift
   on rectangular forum wrappers. */
.avatar-fx-fire::before,
.avatar-fx-fire::after,
.avatar-fx-infected::before,
.avatar-fx-infected::after{
  inset:auto!important;
  left:50%!important;
  top:50%!important;
  width:calc(100% + .62rem)!important;
  height:calc(100% + .62rem)!important;
  transform-origin:50% 50%!important;
  margin:0!important;
}

.avatar-fx-fire::before{
  animation:avatarFireSpinV44 1.55s linear infinite,avatarFireOpacityV44 .72s ease-in-out infinite alternate!important;
}
.avatar-fx-fire::after{
  animation:avatarFireParticlesV44 1.1s ease-in-out infinite alternate!important;
}
.avatar-fx-infected::after{
  animation:avatarInfectedOrbitV44 2.35s linear infinite!important;
}
.avatar-fx-infected:not(.avatar-fx-fire)::before{
  animation:avatarInfectedPulseV44 1.5s ease-in-out infinite alternate!important;
}

@keyframes avatarFireSpinV44{
  from{transform:translate(-50%,-50%) rotate(0deg)}
  to{transform:translate(-50%,-50%) rotate(360deg)}
}
@keyframes avatarFireOpacityV44{
  from{opacity:.68;filter:blur(.08rem) drop-shadow(0 0 .26rem rgba(255,70,15,.45))}
  to{opacity:1;filter:blur(.08rem) drop-shadow(0 0 .42rem rgba(255,70,15,.72))}
}
@keyframes avatarFireParticlesV44{
  from{transform:translate(-50%,-50%) scale(.96);opacity:.64}
  to{transform:translate(-50%,-50%) scale(1.04);opacity:1}
}
@keyframes avatarInfectedOrbitV44{
  from{transform:translate(-50%,-50%) rotate(0deg)}
  to{transform:translate(-50%,-50%) rotate(360deg)}
}
@keyframes avatarInfectedPulseV44{
  from{transform:translate(-50%,-50%) scale(.96);opacity:.46}
  to{transform:translate(-50%,-50%) scale(1.04);opacity:1}
}

/* Forum avatar wrappers: the effect is always centered around the photo itself. */
.thread-list-avatar-wrap.avatar-fx,
.thread-avatar-wrap.avatar-fx,
.forum-online-avatar.avatar-fx{
  display:grid!important;
  place-items:center!important;
}
.contributor-avatar-wrap.avatar-fx::before,
.contributor-avatar-wrap.avatar-fx::after{
  width:3.12rem!important;
  height:3.12rem!important;
  top:1.28rem!important;
}
.contributor-avatar-wrap.avatar-fx img{
  position:relative!important;
  z-index:2!important;
}

/* Mini Shop preview avatar: true center for Fire/Infected demos. */
.avatar-effect-media{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.shop-avatar-demo{
  position:relative!important;
  display:grid!important;
  place-items:center!important;
  flex:0 0 auto!important;
  margin:auto!important;
}
.shop-avatar-demo>img{
  width:100%!important;
  height:100%!important;
  position:relative!important;
  inset:auto!important;
  transform:none!important;
  object-fit:cover!important;
  object-position:center!important;
  margin:0!important;
}

/* Effect state controls in Active Benefits. */
.avatar-effect-toggle{
  min-height:1.65rem;
  padding:0 .48rem;
  border:1px solid rgba(255,73,99,.09);
  border-radius:.36rem;
  color:#d48693;
  background:rgba(194,40,67,.025);
  font-size:.42rem;
  font-weight:900;
  cursor:pointer;
}
.avatar-effect-toggle.active{
  color:#9da6ad;
  border-color:rgba(255,255,255,.055);
  background:rgba(255,255,255,.008);
}
.avatar-effect-toggle.blocked{
  max-width:8rem;
  color:#646e75;
  border-color:rgba(255,255,255,.035);
  background:rgba(255,255,255,.002);
  cursor:not-allowed;
  white-space:normal;
  line-height:1.25;
}

/* Settings performance option. */
.setting-performance-row{
  background:
    linear-gradient(90deg,rgba(255,255,255,.006),rgba(255,255,255,.001))!important;
}
.setting-performance-badge{
  display:inline-flex;
  align-items:center;
  min-height:1.2rem;
  margin-left:.28rem;
  padding:0 .32rem;
  border:1px solid rgba(116,175,128,.10);
  border-radius:.3rem;
  color:#78a984;
  background:rgba(65,128,77,.025);
  font-size:.39rem;
  vertical-align:middle;
}

/* User-controlled low-end mode:
   keep decorative states visible but freeze animation and transitions. */
body.reduce-animations *,
body.reduce-animations *::before,
body.reduce-animations *::after{
  animation-play-state:paused!important;
  transition-duration:0s!important;
  scroll-behavior:auto!important;
}

/* Static Fire/Infected still stay visible and centered when animations are paused. */
body.reduce-animations .avatar-fx-fire::before{
  transform:translate(-50%,-50%) rotate(18deg)!important;
  opacity:.92!important;
}
body.reduce-animations .avatar-fx-fire::after{
  transform:translate(-50%,-50%) scale(1)!important;
  opacity:.88!important;
}
body.reduce-animations .avatar-fx-infected::after{
  transform:translate(-50%,-50%) rotate(20deg)!important;
  opacity:.92!important;
}
body.reduce-animations .avatar-fx-infected:not(.avatar-fx-fire)::before{
  transform:translate(-50%,-50%) scale(1)!important;
  opacity:.78!important;
}

@media(max-width:620px){
  .avatar-effect-toggle{
    min-height:1.9rem;
    font-size:.46rem;
  }
}


/* =========================================================
   V45 — LIVE CS SERVER STATUS
   ========================================================= */
#topbarServerStatus.is-offline > i{
  background:#ef5f6c!important;
  box-shadow:0 0 .65rem rgba(239,95,108,.45)!important;
}
#topbarServerStatus.is-offline > span{
  color:#b98287!important;
}
#topbarServerStatus.is-offline > strong{
  color:#bdc2c6!important;
}
#topbarServerStatus.is-online > i{
  animation:xsites-server-pulse 1.8s ease-in-out infinite;
}
@keyframes xsites-server-pulse{
  0%,100%{opacity:1;transform:scale(1)}
  50%{opacity:.62;transform:scale(.82)}
}
@media (prefers-reduced-motion: reduce){
  #topbarServerStatus.is-online > i{animation:none}
}

/* V46 — complete phone layout and touch-ready play */
@media (max-width:900px){
  .portal-topbar{position:sticky!important;top:0!important;z-index:400!important;grid-template-columns:auto minmax(0,1fr) auto!important;grid-template-rows:auto!important;min-height:3.65rem!important;padding:max(.45rem,env(safe-area-inset-top)) .55rem .45rem!important;background:rgba(7,10,13,.94)!important;backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important}
  .portal-topbar .brand{grid-column:1!important;grid-row:1!important}.portal-statusbar,body:not(.is-authenticated) .portal-statusbar{grid-column:2!important;grid-row:1!important;display:flex!important;width:auto!important;min-width:0!important;overflow:visible!important;justify-content:center!important;padding:0!important}
  #topbarServerStatus{display:flex!important;min-width:0!important;max-width:9.3rem!important;min-height:2.35rem!important;padding:.38rem .55rem!important;border-radius:.62rem!important;border:1px solid rgba(255,255,255,.07)!important;background:rgba(255,255,255,.025)!important;touch-action:manipulation!important}
  #topbarServerStatus>span{font-size:.52rem!important}#topbarServerStatus>strong{font-size:.62rem!important}.portal-statusbar>.portal-status.user-stat{display:none!important}.portal-top-actions{grid-column:3!important;grid-row:1!important}.play-mobile-unavailable{filter:none!important;opacity:1!important}.play-button,.play-ready{touch-action:manipulation!important}.portal-main{padding-top:.7rem!important}
}
@media(max-width:520px){
  .portal-topbar .brand-copy{display:none!important}.portal-topbar .brand-x{font-size:1.9rem!important}#topbarServerStatus{max-width:8.4rem!important;padding:.34rem .46rem!important}#topbarServerStatus>span{font-size:.48rem!important}#topbarServerStatus>strong{font-size:.56rem!important}.portal-main{padding-left:.45rem!important;padding-right:.45rem!important}.workspace,.glass,.forum-card,.logged-card{max-width:100%!important}.forum-grid,.server-stats,.shop-grid{grid-template-columns:1fr!important}
}


/* Performance: remove viewport-sized GPU filters left by the former browser game UI. */
html{scroll-behavior:auto!important}
.bg{filter:none!important;transform:none!important;transition:none!important}
.noise{display:none!important}
*,*::before,*::after{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.auth:after,.play:before,.play:after{animation:none!important}