
:root{
  --bg:#050507;
  --bg-alt:#0a0a0d;
  --bg-soft:rgba(255,44,44,.05);
  --panel:linear-gradient(180deg,rgba(22,22,28,.72) 0%,rgba(10,10,14,.82) 100%);
  --panel-strong:rgba(20,20,26,.88);
  --panel-hover:rgba(255,58,58,.08);
  --border:rgba(255,255,255,.09);
  --border-strong:rgba(255,84,84,.34);
  --text:#f6f7fb;
  --text-soft:#d3d5de;
  --muted:#8f93a3;
  --accent:#ff4d4d;
  --accent-2:#ff7575;
  --accent-3:#ffa3a3;
  --accent-gradient:linear-gradient(90deg,#661313 0%,#b51f1f 48%,#ff4d4d 100%);
  --success:#46d68c;
  --warning:#ffc857;
  --danger:#ff6c6c;
  --radius-sm:12px;
  --radius-md:16px;
  --radius-lg:20px;
  --radius-xl:24px;
  --max:1280px;
  --shadow-panel:0 18px 54px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.03);
  --shadow-glow:0 0 26px rgba(255,76,76,.18);
  --shadow-line:0 0 0 1px rgba(255,255,255,.04), 0 0 18px rgba(255,76,76,.08);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;padding:0;min-height:100%}
body{
  color:var(--text);
  font-family:Inter,Arial,Helvetica,sans-serif;
  background:
    radial-gradient(circle at top,rgba(255,56,56,.10),transparent 28%),
    radial-gradient(circle at 82% 10%,rgba(255,120,120,.06),transparent 18%),
    linear-gradient(180deg,#050507 0%,#09090d 52%,#0d0d13 100%);
  position:relative;
}
body::before{
  content:"";
  position:fixed;
  inset:64px 0 0 0;
  pointer-events:none;
  background:
    linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px),
    linear-gradient(180deg,rgba(255,66,66,.06),transparent 32%);
  background-size:44px 44px,44px 44px,100% 100%;
  mask-image:linear-gradient(180deg,rgba(255,255,255,.65),transparent 75%);
  opacity:.7;
  z-index:0;
}
body::after{
  content:"";
  position:fixed;
  inset:64px 0 0 0;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(255,255,255,.02),transparent 28%),
    repeating-linear-gradient(180deg,rgba(255,255,255,.018) 0,rgba(255,255,255,.018) 1px,transparent 2px,transparent 4px);
  opacity:.22;
  z-index:0;
}

a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto}
button,input,select,textarea{font:inherit}

.container{width:min(var(--max),calc(100% - 32px));margin:0 auto}

.topbar{
  position:sticky;
  top:0;
  z-index:40;
  background:rgba(6,6,9,.82);
  border-bottom:1px solid var(--border);
  box-shadow:0 10px 35px rgba(0,0,0,.28);
}
.topbar::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,84,84,.35),transparent);
}
.topbar-inner{display:flex;align-items:center;gap:16px;justify-content:space-between;padding:16px 0;position:relative}
.brand{
  display:inline-flex;
  flex-direction:column;
  gap:2px;
  font-size:22px;
  font-weight:800;
  letter-spacing:.01em;
}
.brand small{display:block;color:var(--muted);font-size:12px;font-weight:500;letter-spacing:.04em;text-transform:uppercase}

.nav{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.nav a{
  padding:10px 14px;
  border:1px solid transparent;
  border-radius:999px;
  color:var(--muted);
}
.nav a:hover,
.nav a.active{
  background:var(--panel-hover);
  border-color:var(--border-strong);
  color:var(--text);
  transform:translateY(-1px);
}
.nav a.active{box-shadow:var(--shadow-line)}

.hero{padding:72px 0 36px;position:relative}
.hero::after,
.page::before{
  content:"";
  position:absolute;
  inset:auto auto 100% 0;
  width:180px;
  height:2px;
  background:linear-gradient(90deg,rgba(255,84,84,0),rgba(255,84,84,.92),rgba(255,84,84,0));
  box-shadow:0 0 22px rgba(255,84,84,.28);
}
.page{padding:40px 0 64px;position:relative}
.page-title{margin:0 0 10px;font-size:clamp(32px,4vw,40px);line-height:1.1;letter-spacing:.02em;text-transform:uppercase}
.page-subtitle{margin:0 0 24px;color:var(--text-soft);font-size:17px;line-height:1.6;max-width:900px}
.hero h1{font-size:clamp(38px,6vw,62px);line-height:1.03;margin:0 0 18px;max-width:980px;letter-spacing:.02em;text-transform:uppercase}
.hero p{color:var(--text-soft);font-size:18px;line-height:1.65;max-width:920px}

.pill,
.badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 14px;
  color:#ffe5e5;
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  background:linear-gradient(180deg,rgba(255,66,66,.16),rgba(120,16,16,.12));
  border:1px solid rgba(255,88,88,.22);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02),0 0 20px rgba(255,76,76,.08);
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
}
.pill{margin-bottom:16px}
.actions{display:flex;gap:12px;flex-wrap:wrap}

.button,
button,
.btn,
a.btn{
  appearance:none;
  border:1px solid rgba(255,94,94,.20);
  padding:12px 18px;
  font-weight:800;
  cursor:pointer;
  color:#fff4f4;
  background:var(--accent-gradient);
  box-shadow:var(--shadow-glow);
  clip-path:polygon(14px 0,100% 0,100% calc(100% - 12px),calc(100% - 14px) 100%,0 100%,0 12px);
  border-radius:0;
}
.button:hover,
button:hover,
.btn:hover,
a.btn:hover{transform:translateY(-1px);filter:brightness(1.04)}
.button:active,
button:active,
.btn:active,
a.btn:active{transform:translateY(0)}
.button.secondary,
button.secondary,
.btn-secondary,
.btn-small{
  background:linear-gradient(180deg,rgba(22,22,28,.82),rgba(9,9,13,.95));
  color:var(--text);
  border:1px solid var(--border);
  box-shadow:var(--shadow-line);
}
.button.secondary:hover,
button.secondary:hover,
.btn-secondary:hover,
.btn-small:hover{background:rgba(22,22,28,.96);border-color:var(--border-strong)}
.btn-small{padding:10px 14px;font-size:.85rem}
.btn[disabled],button[disabled]{cursor:not-allowed;opacity:.5}

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

.card,
.kpi,
.session-card,
.friend-card,
.result-card,
.telemetry-card,
.conversation-item,
.notice,
.panel-placeholder,
.glass{
  background:var(--panel);
  border:1px solid var(--border);
  box-shadow:var(--shadow-panel);
  position:relative;
  overflow:hidden;
  border-radius:0;
  clip-path:polygon(18px 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%,0 18px);
}
.card::before,
.kpi::before,
.session-card::before,
.friend-card::before,
.result-card::before,
.telemetry-card::before,
.conversation-item::before,
.notice::before,
.panel-placeholder::before,
.glass::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(255,76,76,0),rgba(255,76,76,.42),rgba(255,76,76,0)) top/100% 1px no-repeat,
    linear-gradient(180deg,rgba(255,255,255,.06),transparent 26%) top/100% 100% no-repeat,
    linear-gradient(90deg,transparent 0,transparent calc(100% - 42px),rgba(255,92,92,.18) calc(100% - 42px),rgba(255,92,92,.18) 100%) bottom right/100% 24px no-repeat;
  opacity:.9;
}
.card::after,
.kpi::after,
.session-card::after,
.friend-card::after,
.result-card::after,
.telemetry-card::after,
.conversation-item::after,
.notice::after,
.panel-placeholder::after,
.glass::after{
  content:"";
  position:absolute;
  inset:10px;
  pointer-events:none;
  border:1px solid rgba(255,255,255,.035);
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
}

.card{padding:20px}
.card h2,.card h3{margin-top:0}
.card p,.muted,.helper{color:var(--muted)}
.helper{display:block;margin-top:-8px;margin-bottom:14px}
.dashboard-stat{display:block;font-size:2rem;line-height:1.05;font-weight:900;color:#fff;letter-spacing:.02em;text-shadow:0 0 18px rgba(255,76,76,.18)}

label{display:block;margin-bottom:8px;font-weight:700;color:var(--text-soft);letter-spacing:.03em;text-transform:uppercase;font-size:.82rem}
input,select,textarea{
  width:100%;
  padding:12px 14px;
  margin-bottom:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(9,9,13,.58);
  color:var(--text);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 0 0 1px rgba(255,255,255,.01);
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
  border-radius:0;
}
input::placeholder,textarea::placeholder{color:#72778a}
input:focus,select:focus,textarea:focus{
  outline:none;
  border-color:rgba(255,88,88,.7);
  box-shadow:0 0 0 3px rgba(255,76,76,.11), 0 0 18px rgba(255,76,76,.08);
}
input[type="checkbox"]{width:auto;margin-right:10px;accent-color:var(--accent)}
.accent-primary{accent-color:var(--accent)}

.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:12px 10px;border-bottom:1px solid rgba(255,255,255,.07)}
th{color:#a7aab6;font-size:13px;letter-spacing:.1em;text-transform:uppercase}
tr:hover td{background:rgba(255,76,76,.04)}

.panel-placeholder{
  min-height:220px;
  display:grid;
  place-items:center;
  color:var(--muted);
  border-style:dashed;
  background:rgba(12,12,16,.68);
}

.notice{padding:12px 14px;color:var(--text-soft)}
.footer{border-top:1px solid var(--border);color:var(--muted);padding:24px 0 40px;background:rgba(7,7,10,.42);margin-top:36px}

.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.kpi{padding:16px}
.kpi strong{display:block;font-size:26px;margin-top:6px}

.friend-card,
.result-card,
.session-card,
.telemetry-card,
.conversation-item,
.glass{padding:14px;background:linear-gradient(180deg,rgba(24,24,31,.64),rgba(10,10,14,.78))}
.friend-card{display:flex;justify-content:space-between;gap:12px;align-items:center}
.friend-actions,.row-actions{display:flex;gap:10px;flex-wrap:wrap}
.list-stack,.conversation-list{display:flex;flex-direction:column;gap:10px}
.conversation-item{cursor:pointer;}
.conversation-item:hover{transform:translateY(-1px);background:linear-gradient(180deg,rgba(28,28,36,.86),rgba(11,11,15,.95));box-shadow:var(--shadow-panel),0 0 0 1px rgba(255,76,76,.08)}
.conversation-item.active{border-color:rgba(255,76,76,.42);background:rgba(255,76,76,.07)}
.conversation-item .title{font-weight:700;margin-bottom:4px}
.conversation-item .meta,.message-meta{font-size:12px;color:var(--muted)}

.chat-layout{display:grid;grid-template-columns:340px 1fr;gap:18px;min-height:70vh}
.thread-shell{display:grid;grid-template-rows:auto 1fr auto;min-height:70vh}
.thread-header{padding-bottom:14px;border-bottom:1px solid var(--border)}
.thread-messages{padding:18px 0;display:flex;flex-direction:column;gap:12px;overflow:auto}
.message-bubble{max-width:78%;padding:12px 14px;border:1px solid var(--border);background:rgba(18,18,24,.72);clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.message-bubble.mine{align-self:flex-end;background:rgba(255,76,76,.10);border-color:rgba(255,76,76,.24)}
.thread-compose{padding-top:14px;border-top:1px solid var(--border)}

.hidden{display:none!important}
.bg-primary{background:linear-gradient(90deg,#7a1717 0%,#ba2323 55%,#ff5050 100%)!important}
.shadow-soft{box-shadow:0 0 22px rgba(255,76,76,.14)}
.glass{background:linear-gradient(180deg,rgba(21,21,27,.55),rgba(9,9,13,.72))}

a i[data-lucide],button i[data-lucide],.card svg,.kpi svg,.glass svg,.badge svg,.pill svg{
  filter:drop-shadow(0 0 8px rgba(255,76,76,.18));
}

main .grid[style*="margin-top:18px"],
main .card[style*="margin-top:18px"],
main .table-wrap[style*="margin-top:18px"],
main [data-detail-panel][style*="margin-top:18px"],
main [data-session-detail][style*="margin-top:18px"]{margin-top:18px!important}
main .grid[style*="margin-bottom:18px"]{margin-bottom:18px!important}
main [style*="align-self:end"]{align-self:end!important}
main [style*="display:flex"][style*="justify-content:space-between"]{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:12px;
  flex-wrap:wrap;
}
main h2[style*="margin-bottom:6px"]{margin-bottom:6px!important}
label[style*="margin-top:18px"]{margin-top:18px!important}

@media (max-width: 1024px){
  .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .chat-layout{grid-template-columns:1fr}
}

@media (max-width: 640px){
  .container{width:min(var(--max),calc(100% - 20px))}
  .hero{padding:56px 0 28px}
  .page{padding:28px 0 48px}
  .kpi-grid{grid-template-columns:1fr}
}


:root{
  --hud-red: rgba(255,86,86,.82);
  --hud-red-soft: rgba(255,86,86,.18);
  --hud-white-soft: rgba(255,255,255,.08);
}





body .content-wrap{
  position: relative;
}
body .content-wrap::before{
  content:"";
  position: fixed;
  inset: 64px 0 0 0;
  pointer-events:none;
  background:
    radial-gradient(circle at 16% 18%, rgba(255,70,70,.08), transparent 0 16%),
    radial-gradient(circle at 84% 22%, rgba(255,255,255,.03), transparent 0 12%),
    linear-gradient(135deg, transparent 0 48%, rgba(255,255,255,.025) 49%, transparent 50%) 0 0/160px 160px;
  opacity:.55;
  z-index:0;
}

.page-title,
.hero h1{
  text-shadow: 0 0 22px rgba(255,76,76,.10), 0 0 1px rgba(255,255,255,.12);
}

.page-subtitle,
.hero p{
  max-width: 980px;
}

.card,
.kpi,
.session-card,
.friend-card,
.result-card,
.telemetry-card,
.conversation-item,
.notice,
.panel-placeholder,
.glass{
  isolation:isolate;
}

.card:hover,
.kpi:hover,
.session-card:hover,
.friend-card:hover,
.result-card:hover,
.telemetry-card:hover,
.conversation-item:hover,
.glass:hover{
  border-color: rgba(255,90,90,.22);
  box-shadow: 0 22px 60px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.05), 0 0 24px rgba(255,76,76,.08);
}

.card > * , .glass > * , .notice > * , .kpi > * { position:relative; z-index:2; }

.card::before,
.kpi::before,
.session-card::before,
.friend-card::before,
.result-card::before,
.telemetry-card::before,
.conversation-item::before,
.notice::before,
.panel-placeholder::before,
.glass::before{
  background:
    linear-gradient(90deg,rgba(255,76,76,0),rgba(255,76,76,.52),rgba(255,76,76,0)) top/100% 1px no-repeat,
    linear-gradient(180deg,rgba(255,255,255,.08),transparent 24%) top/100% 100% no-repeat,
    linear-gradient(90deg,transparent 0,transparent calc(100% - 46px),rgba(255,92,92,.18) calc(100% - 46px),rgba(255,92,92,.18) 100%) bottom right/100% 28px no-repeat,
    radial-gradient(circle at top right, rgba(255,90,90,.12), transparent 0 26%),
    linear-gradient(135deg, transparent 0 84%, rgba(255,255,255,.035) 85%, transparent 86%) 0 0/22px 22px;
}

.card::after,
.kpi::after,
.session-card::after,
.friend-card::after,
.result-card::after,
.telemetry-card::after,
.conversation-item::after,
.notice::after,
.panel-placeholder::after,
.glass::after{
  inset: 10px;
  border: 1px solid rgba(255,255,255,.04);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.015);
}

.card .section-kicker,
.hud-kicker,
.hud-meta-label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 12px;
  margin-bottom:12px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#ffd8d8;
  background:linear-gradient(180deg,rgba(255,60,60,.16),rgba(255,60,60,.06));
  border:1px solid rgba(255,84,84,.22);
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.02), 0 0 18px rgba(255,76,76,.08);
}

.hud-shell{
  position:relative;
}
.hud-shell::after{content:none!important;display:none!important}

.hud-grid{
  display:grid;
  gap:18px;
}

.hud-hero{
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);
  gap:20px;
  align-items:stretch;
}

.hud-rail,
.hud-sidebar-panel{
  display:grid;
  gap:12px;
}

.hud-readout,
.hud-stat-card,
.hud-mini-panel{
  position:relative;
  padding:16px 18px;
  background:linear-gradient(180deg,rgba(21,21,28,.74),rgba(8,8,12,.88));
  border:1px solid rgba(255,255,255,.08);
  clip-path:polygon(16px 0,100% 0,100% calc(100% - 14px),calc(100% - 16px) 100%,0 100%,0 14px);
  box-shadow:0 12px 28px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.03);
  overflow:hidden;
}
.hud-readout::before,
.hud-stat-card::before,
.hud-mini-panel::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(255,88,88,.55), rgba(255,88,88,0)) top left/120px 1px no-repeat,
    linear-gradient(180deg, rgba(255,255,255,.06), transparent 34%) top/100% 100% no-repeat,
    radial-gradient(circle at top right, rgba(255,76,76,.12), transparent 0 24%);
}
.hud-readout::after,
.hud-stat-card::after,
.hud-mini-panel::after{
  content:"";
  position:absolute;
  right:14px;
  top:14px;
  width:9px;
  height:9px;
  border-radius:999px;
  background:rgba(255,96,96,.8);
  box-shadow:0 0 12px rgba(255,96,96,.4);
}

.hud-icon-chip{
  width:44px;
  height:44px;
  display:inline-grid;
  place-items:center;
  border:1px solid rgba(255,88,88,.18);
  background:linear-gradient(180deg,rgba(255,62,62,.14),rgba(255,255,255,.03));
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.03), 0 0 20px rgba(255,76,76,.09);
}
.hud-icon-chip svg, .hud-icon-chip i[data-lucide]{
  width:20px;
  height:20px;
  color:#ffb2b2;
}

.hud-split-title{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}
.hud-split-title h1,
.hud-split-title h2,
.hud-split-title h3,
.hud-title-row h1,
.hud-title-row h2,
.hud-title-row h3{
  margin:0;
}
.hud-title-row{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}
.hud-title-row .hud-icon-chip{ flex: 0 0 auto; }
.hud-subgrid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.hud-meta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.hud-meta span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 12px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#f5c9c9;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
}
.hud-meta strong{
  color:#fff;
  font-weight:800;
}
.hud-readout strong,
.hud-stat-card strong{
  display:block;
  font-size:clamp(1.35rem,2vw,2rem);
  line-height:1;
  margin-top:6px;
  color:#fff;
  text-shadow: 0 0 18px rgba(255,76,76,.18);
}
.hud-readout small,
.hud-stat-card small,
.hud-mini-panel small{
  display:block;
  margin-top:10px;
  color:var(--muted);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.12em;
}

.hud-divider{
  height:1px;
  margin:18px 0;
  background:linear-gradient(90deg,transparent,rgba(255,86,86,.45),rgba(255,255,255,.06),transparent);
}

.hud-empty{
  min-height:100%;
  display:grid;
  place-items:center;
  text-align:left;
}

.league-table th,
th{
  position:relative;
}
.league-table th::after,
th::after{
  content:"";
  position:absolute;
  left:10px;
  right:10px;
  bottom:6px;
  height:1px;
  background:linear-gradient(90deg,rgba(255,86,86,.35),transparent);
  opacity:.5;
}

@media (max-width: 1024px){
  .hud-hero{ grid-template-columns:1fr; }
  .hud-subgrid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 640px){
  .hud-subgrid{ grid-template-columns:1fr; }
  .hud-title-row{ align-items:flex-start; }
}

/* Streampex flat performance skin v36: no animated gloss, sheen, sweep, or moving overlays. */
:root{
  --panel:#111218;
  --panel-gloss:none;
  --shadow-glow:none;
  --shadow-line:none;
}
.button,button,.btn,a.btn,.button.secondary,button.secondary,.btn-secondary,.btn-small{
  box-shadow:none;
  filter:none;
}
.card,.kpi,.session-card,.friend-card,.result-card,.telemetry-card,.conversation-item,.notice,.panel-placeholder,.glass,.hud-readout,.hud-stat-card,.hud-mini-panel{
  background:#111218;
  border-color:rgba(255,255,255,.10);
  box-shadow:0 8px 22px rgba(0,0,0,.28);
  filter:none;
}
.hud-shell,.card,.glass,.hud-readout,.hud-stat-card,.hud-mini-panel{position:relative}
.card .section-kicker,.hud-kicker,.hud-meta-label{
  display:inline-flex;align-items:center;gap:8px;padding:7px 12px;margin-bottom:12px;
  font-size:11px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;
  color:#ffd8d8;background:rgba(255,60,60,.10);border:1px solid rgba(255,84,84,.22);
  box-shadow:none;filter:none;
}
.hud-icon-chip{
  background:rgba(255,70,70,.12);
  border-color:rgba(255,110,110,.30);
  box-shadow:none;filter:none;
}
.hud-readout strong,.hud-stat-card strong,.hud-mini-panel strong{font-size:1.05rem;color:#fff}
.dashboard-section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.dashboard-league-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.dashboard-league-card,.dashboard-action-card{display:block;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,rgba(22,22,28,.92),rgba(10,10,14,.96));border-radius:18px;padding:16px;text-decoration:none;color:inherit;}
.dashboard-league-card:hover,.dashboard-action-card:hover{transform:translateY(-1px);border-color:rgba(255,76,76,.3);box-shadow:0 18px 40px rgba(0,0,0,.28)}
.dashboard-league-top,.dashboard-league-footer{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.dashboard-league-title-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.dashboard-league-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px}
.dashboard-league-metric{padding:12px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.05)}
.dashboard-league-metric strong{display:block;margin-top:4px;font-size:1rem;color:#fff}
.dashboard-label{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.dashboard-league-footer{margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.08);align-items:center}
.dashboard-inline-link{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:#ffd0d0}
.dashboard-action-stack{display:grid;gap:12px}
.dashboard-action-card strong{display:block;font-size:1rem;margin-bottom:4px}
.dashboard-quick-actions .dashboard-action-card{padding:14px 16px}
@media (max-width: 900px){
  .dashboard-league-metrics{grid-template-columns:1fr}
}
@media (max-width: 640px){
  .dashboard-section-head .button{width:100%;justify-content:center}
  .dashboard-league-card,.dashboard-action-card{padding:14px}
  .dashboard-league-top,.dashboard-league-footer{flex-direction:column;align-items:flex-start}
  .dashboard-inline-link{width:100%;justify-content:space-between}
}

/* Streampex global no-motion performance mode.
   Heavy gloss sweeps, sheen passes, moving highlights, blur glass, and transitions are disabled site-wide. */
*, *::before, *::after {
  animation: none !important;
  transition: none !important;
  scroll-behavior: auto !important;
}
body::before,
body::after,
.site-shell::before,
.site-shell::after,
.panel::before,
.card::before,
.league-card::before,
.dashboard-league-card::before,
.dashboard-action-card::before,
.result-card::before,
.recommendation-card::before,
[class*="sheen"]::before,
[class*="gloss"]::before,
[class*="sweep"]::before {
  animation: none !important;
}
[style*="backdrop-filter"],
[style*="-webkit-backdrop-filter"] {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* hard no-motion/no-sheen override v35 */
*,*::before,*::after{
  animation:none!important;
  transition:none!important;
  scroll-behavior:auto!important;
}
body::before,
body::after,
body .content-wrap::before,
.hero::after,
.page::before,
.topbar::after,
.hud-shell::before,
.hud-shell::after,
.card::before,
.card::after,
.kpi::before,
.kpi::after,
.session-card::before,
.session-card::after,
.friend-card::before,
.friend-card::after,
.result-card::before,
.result-card::after,
.telemetry-card::before,
.telemetry-card::after,
.conversation-item::before,
.conversation-item::after,
.notice::before,
.notice::after,
.panel-placeholder::before,
.panel-placeholder::after,
.glass::before,
.glass::after,
.hud-readout::before,
.hud-readout::after,
.hud-stat-card::before,
.hud-stat-card::after,
.hud-mini-panel::before,
.hud-mini-panel::after,
.hud-icon-chip::before,
.button::before,
button::before,
.btn::before,
a.btn::before,
.card .section-kicker::after,
.hud-meta-label::after,
.league-table th::after,
th::after,
.table-wrap::after{
  content:none!important;
  display:none!important;
  background:none!important;
  box-shadow:none!important;
  filter:none!important;
  transform:none!important;
}
body{
  background:#08090d!important;
}
.card,
.kpi,
.session-card,
.friend-card,
.result-card,
.telemetry-card,
.conversation-item,
.notice,
.panel-placeholder,
.glass,
.hud-readout,
.hud-stat-card,
.hud-mini-panel,
.dashboard-league-card,
.dashboard-action-card{
  background:#111218!important;
  box-shadow:0 8px 22px rgba(0,0,0,.28)!important;
  filter:none!important;
}
.card:hover,
.kpi:hover,
.session-card:hover,
.friend-card:hover,
.result-card:hover,
.telemetry-card:hover,
.conversation-item:hover,
.glass:hover,
.hud-readout:hover,
.hud-stat-card:hover,
.hud-mini-panel:hover,
.dashboard-league-card:hover,
.dashboard-action-card:hover,
a.btn:hover,
button:hover,
.button:hover{
  transform:none!important;
  filter:none!important;
  box-shadow:0 8px 22px rgba(0,0,0,.28)!important;
}
.page-title,
.hero h1,
.dashboard-stat,
.hud-readout strong,
.hud-stat-card strong,
.hud-icon-chip svg,
.hud-icon-chip i[data-lucide]{
  text-shadow:none!important;
  filter:none!important;
}
.button,
button,
.btn,
a.btn,
.button.secondary,
button.secondary,
.btn-secondary,
.btn-small,
.pill,
.badge,
.card .section-kicker,
.hud-kicker,
.hud-meta-label,
.hud-icon-chip,
input,
select,
textarea{
  box-shadow:none!important;
  filter:none!important;
}


/* absolute final no-sheen override v36 */
*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important;}
body::before,body::after,.site-shell::before,.site-shell::after,.content-wrap::before,.content-wrap::after,.page::before,.page::after,.hero::before,.hero::after,.topbar::before,.topbar::after,.card::before,.card::after,.hud-shell::before,.hud-shell::after,.hud-readout::before,.hud-readout::after,.hud-stat-card::before,.hud-stat-card::after,.hud-mini-panel::before,.hud-mini-panel::after,.hud-icon-chip::before,.hud-icon-chip::after,.dashboard-league-card::before,.dashboard-league-card::after,.dashboard-action-card::before,.dashboard-action-card::after,.dashboard-league-metric::before,.dashboard-league-metric::after,.glass::before,.glass::after,.kpi::before,.kpi::after,.session-card::before,.session-card::after,.friend-card::before,.friend-card::after,.result-card::before,.result-card::after,.telemetry-card::before,.telemetry-card::after,.conversation-item::before,.conversation-item::after,.notice::before,.notice::after,.panel-placeholder::before,.panel-placeholder::after,.button::before,.button::after,button::before,button::after,.btn::before,.btn::after,a.btn::before,a.btn::after,.section-kicker::before,.section-kicker::after,.hud-meta-label::before,.hud-meta-label::after{content:none!important;display:none!important;background:none!important;box-shadow:none!important;filter:none!important;transform:none!important;opacity:0!important;}
.card,.hud-shell,.hud-readout,.hud-stat-card,.hud-mini-panel,.glass,.dashboard-league-card,.dashboard-action-card,.dashboard-league-metric{background:#111218!important;box-shadow:0 8px 22px rgba(0,0,0,.28)!important;filter:none!important;transform:none!important;}
.card:hover,.hud-shell:hover,.hud-readout:hover,.hud-stat-card:hover,.hud-mini-panel:hover,.glass:hover,.dashboard-league-card:hover,.dashboard-action-card:hover,.dashboard-league-metric:hover{background:#111218!important;box-shadow:0 8px 22px rgba(0,0,0,.28)!important;filter:none!important;transform:none!important;}

.dashboard-action-card[type="button"]{width:100%;text-align:left;font:inherit;cursor:pointer;}

/* Dashboard stat cards: compact horizontal row with fitted labels. */
.dashboard-stats-grid{
  display:grid;
  grid-template-columns:repeat(7,minmax(118px,1fr));
  gap:12px;
  align-items:stretch;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  padding-bottom:4px;
}
.dashboard-stats-grid .hud-stat-card{
  min-width:118px;
  overflow:hidden;
  padding:12px 10px;
  min-height:108px;
}
.dashboard-stats-grid .hud-title-row{
  display:flex;
  align-items:flex-start;
  gap:8px;
  margin-bottom:0;
}
.dashboard-stats-grid .hud-title-row > div{
  min-width:0;
  flex:1 1 auto;
  overflow:hidden;
}
.dashboard-stats-grid .hud-icon-chip{
  flex:0 0 28px;
  width:28px;
  height:28px;
}
.dashboard-stats-grid .hud-icon-chip svg{
  width:15px;
  height:15px;
}
.dashboard-stats-grid .muted{
  display:block;
  max-width:100%;
  white-space:normal;
  overflow-wrap:anywhere;
  line-height:1.1;
  font-size:.68rem;
  letter-spacing:.035em;
}
.dashboard-stats-grid .dashboard-stat{
  font-size:1.55rem;
  line-height:1;
  margin-top:5px;
}
.dashboard-stats-grid .hud-stat-card small{
  display:block;
  max-width:100%;
  white-space:normal;
  overflow-wrap:anywhere;
  line-height:1.12;
  margin-top:6px;
  font-size:.62rem;
  letter-spacing:.03em;
}
@media (max-width:900px){
  .dashboard-stats-grid{grid-template-columns:repeat(7,minmax(112px,112px));}
  .dashboard-stats-grid .hud-stat-card{min-width:112px;}
}
.dashboard-session-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.dashboard-session-main{
  min-width:0;
}
.dashboard-session-main strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.dashboard-session-best{
  flex:0 0 auto;
  text-align:right;
}
.dashboard-session-best strong{
  display:block;
  margin-top:2px;
}
@media (max-width: 640px){
  .dashboard-session-row{align-items:flex-start;}
  .dashboard-session-main strong{white-space:normal;}
}


/* v155: force dashboard stats back to compact horizontal cards on mobile/desktop. */
.dashboard-stats-grid{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  gap:10px!important;
  align-items:stretch!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  padding:0 0 8px 0!important;
  scroll-snap-type:x proximity;
}
.dashboard-stats-grid .hud-stat-card{
  flex:0 0 118px!important;
  width:118px!important;
  min-width:118px!important;
  max-width:118px!important;
  min-height:104px!important;
  padding:12px 10px!important;
  box-sizing:border-box!important;
  scroll-snap-align:start;
}
.dashboard-stats-grid .hud-title-row{
  display:flex!important;
  flex-direction:row!important;
  align-items:flex-start!important;
  gap:8px!important;
  margin:0!important;
}
.dashboard-stats-grid .hud-title-row > div{min-width:0!important;flex:1 1 auto!important;}
.dashboard-stats-grid .hud-icon-chip{flex:0 0 28px!important;width:28px!important;height:28px!important;}
.dashboard-stats-grid .hud-icon-chip svg,.dashboard-stats-grid .hud-icon-chip i[data-lucide]{width:15px!important;height:15px!important;}
.dashboard-stats-grid .muted{display:block!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere!important;line-height:1.1!important;font-size:.68rem!important;letter-spacing:.02em!important;}
.dashboard-stats-grid .dashboard-stat{font-size:1.45rem!important;line-height:1!important;margin-top:5px!important;}
.dashboard-stats-grid .hud-stat-card small{display:block!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere!important;line-height:1.12!important;margin-top:6px!important;font-size:.58rem!important;letter-spacing:.025em!important;}
@media (min-width:1100px){.dashboard-stats-grid{overflow-x:visible!important;}.dashboard-stats-grid .hud-stat-card{flex:1 1 0!important;width:auto!important;max-width:none!important;min-width:0!important;}}


/* v156 cache-busted layout repair: do not depend on Tailwind arbitrary grid utilities for core pages. */
.sessions-page-grid{display:grid!important;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr)!important;gap:1.5rem!important;align-items:start!important;}
.dashboard-stats-grid{display:grid!important;grid-template-columns:repeat(7,minmax(92px,1fr))!important;gap:10px!important;align-items:stretch!important;overflow:visible!important;}
.dashboard-stats-grid>.hud-stat-card{width:auto!important;min-width:0!important;max-width:none!important;min-height:96px!important;padding:10px 8px!important;box-sizing:border-box!important;}
.dashboard-stats-grid .hud-title-row{display:flex!important;align-items:flex-start!important;gap:7px!important;margin:0!important;}
.dashboard-stats-grid .hud-title-row>div{min-width:0!important;overflow:visible!important;}
.dashboard-stats-grid .hud-icon-chip{flex:0 0 26px!important;width:26px!important;height:26px!important;}
.dashboard-stats-grid .hud-icon-chip svg,.dashboard-stats-grid .hud-icon-chip i{width:14px!important;height:14px!important;}
.dashboard-stats-grid .muted{display:block!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;line-height:1.08!important;font-size:.66rem!important;letter-spacing:.01em!important;}
.dashboard-stats-grid .dashboard-stat{display:block!important;font-size:1.35rem!important;line-height:1!important;margin:.25rem 0 0!important;}
.dashboard-stats-grid .hud-stat-card small{display:block!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;line-height:1.1!important;font-size:.54rem!important;letter-spacing:.025em!important;margin-top:.35rem!important;}
@media(max-width:760px){.sessions-page-grid{grid-template-columns:1fr!important;}.dashboard-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;}.dashboard-stats-grid>.hud-stat-card{min-height:88px!important;padding:9px 8px!important;}.dashboard-stats-grid .muted{font-size:.68rem!important}.dashboard-stats-grid .hud-stat-card small{font-size:.55rem!important}}
@media(max-width:380px){.dashboard-stats-grid .hud-icon-chip{display:none!important}}


/* v156 final stat strip override. */
.dashboard-stats-grid{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;gap:10px!important;align-items:stretch!important;overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch!important;padding-bottom:8px!important;}
.dashboard-stats-grid>.hud-stat-card{flex:0 0 116px!important;width:116px!important;min-width:116px!important;max-width:116px!important;min-height:96px!important;padding:10px 8px!important;box-sizing:border-box!important;}
.dashboard-stats-grid .hud-title-row{display:flex!important;align-items:flex-start!important;gap:7px!important;margin:0!important;}
.dashboard-stats-grid .hud-title-row>div{min-width:0!important;overflow:visible!important;}
.dashboard-stats-grid .hud-icon-chip{flex:0 0 26px!important;width:26px!important;height:26px!important;}
.dashboard-stats-grid .hud-icon-chip svg,.dashboard-stats-grid .hud-icon-chip i{width:14px!important;height:14px!important;}
.dashboard-stats-grid .muted{display:block!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;line-height:1.08!important;font-size:.66rem!important;letter-spacing:.01em!important;}
.dashboard-stats-grid .dashboard-stat{display:block!important;font-size:1.35rem!important;line-height:1!important;margin:.25rem 0 0!important;}
.dashboard-stats-grid .hud-stat-card small{display:block!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;line-height:1.1!important;font-size:.54rem!important;letter-spacing:.025em!important;margin-top:.35rem!important;}
@media(min-width:1100px){.dashboard-stats-grid{overflow-x:visible!important}.dashboard-stats-grid>.hud-stat-card{flex:1 1 0!important;width:auto!important;min-width:0!important;max-width:none!important;}}
@media(max-width:380px){.dashboard-stats-grid .hud-icon-chip{display:none!important}.dashboard-stats-grid>.hud-stat-card{flex-basis:108px!important;width:108px!important;min-width:108px!important}}


/* v157: restore lower dashboard/session-detail panel grids without relying on Tailwind arbitrary utility classes. */
.dashboard-panel-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(190px,1fr))!important;
  gap:1.5rem!important;
  align-items:start!important;
}
.session-detail-summary-grid,
.session-detail-lower-grid{
  display:grid!important;
  grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr)!important;
  gap:1.5rem!important;
  align-items:start!important;
}
.session-detail-lower-grid{grid-template-columns:minmax(0,1fr) minmax(280px,.85fr)!important;}
@media(max-width:720px){
  .dashboard-panel-grid{
    grid-template-columns:repeat(3,minmax(190px,1fr))!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    padding-bottom:.5rem!important;
  }
  .dashboard-panel-grid>.card{min-width:190px!important;}
  .session-detail-summary-grid,
  .session-detail-lower-grid{
    grid-template-columns:repeat(2,minmax(280px,1fr))!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    padding-bottom:.5rem!important;
  }
  .session-detail-summary-grid>.card,
  .session-detail-lower-grid>.card,
  .session-detail-lower-grid>section.card{min-width:280px!important;}
}
@media(max-width:430px){
  .dashboard-panel-grid{grid-template-columns:repeat(3,minmax(175px,1fr))!important;}
  .dashboard-panel-grid>.card{min-width:175px!important;}
}

/* v158: dashboard lower-card league snapshot is league-only; keep rows compact and readable. */
.dashboard-league-snapshot-card .button{align-self:flex-start;}
.dashboard-league-snapshot-row{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:14px!important;}
.dashboard-league-snapshot-main{min-width:0!important;}
.dashboard-league-snapshot-main strong{display:block;white-space:normal;overflow-wrap:anywhere;}
.dashboard-league-snapshot-next{text-align:right;min-width:118px;max-width:48%;}
.dashboard-league-snapshot-next strong{display:block;line-height:1.15;white-space:normal;overflow-wrap:anywhere;}
@media(max-width:520px){.dashboard-league-snapshot-row{align-items:flex-start!important;}.dashboard-league-snapshot-next{min-width:105px;max-width:50%;}}


/* v160: dashboard quick access cards should stay compact like stat cards, not full-width list rows. */
.dashboard-action-stack{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  gap:10px!important;
  align-items:stretch!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  padding-bottom:8px!important;
}
.dashboard-action-stack>.dashboard-action-card{
  flex:0 0 176px!important;
  width:176px!important;
  min-width:176px!important;
  max-width:176px!important;
  min-height:92px!important;
  padding:12px 12px!important;
  box-sizing:border-box!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
}
.dashboard-action-stack>.dashboard-action-card strong{
  display:block!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:anywhere!important;
  line-height:1.12!important;
  font-size:.9rem!important;
  margin-bottom:6px!important;
}
.dashboard-action-stack>.dashboard-action-card .message-meta{
  display:block!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:anywhere!important;
  line-height:1.15!important;
  font-size:.66rem!important;
}
@media(min-width:900px){
  .dashboard-action-stack{overflow-x:visible!important;}
  .dashboard-action-stack>.dashboard-action-card{flex:0 1 210px!important;width:210px!important;min-width:0!important;max-width:210px!important;}
}
@media(max-width:380px){
  .dashboard-action-stack>.dashboard-action-card{flex-basis:162px!important;width:162px!important;min-width:162px!important;}
}

/* v236 community ranked rows */
.community-result-row.clickable-row { cursor: pointer; }
.community-result-row.clickable-row:hover,
.community-result-row.clickable-row:focus { outline: none; background: rgba(255,255,255,.06); }
