/* 2026-05-18 professional dashboard refresh */
:root{
  --bg:#070a12;
  --panel:#0f1420;
  --panel-2:#141b2a;
  --soft:#0b101a;
  --soft-2:#111827;
  --border:rgba(148,163,184,.16);
  --border-strong:rgba(148,163,184,.28);
  --text:#f4f7fb;
  --muted:#a2aec4;
  --muted-2:#76849d;
  --accent:#5865f2;
  --accent2:#35c2ff;
  --green:#25d366;
  --yellow:#f5b14c;
  --red:#f05267;
  --shadow:0 22px 64px rgba(0,0,0,.34);
  --shadow-soft:0 14px 34px rgba(0,0,0,.22);
  --radius:18px;
  --radius-sm:12px;
  --content-max:1580px;
}

html,
body{
  background:
    linear-gradient(180deg, rgba(255,255,255,.025), transparent 230px),
    linear-gradient(135deg, rgba(88,101,242,.08), transparent 36%),
    #070a12;
}

body{
  color:var(--text);
  letter-spacing:0;
}

body::before{
  background:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size:72px 72px;
  opacity:.16;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.42), transparent 92%);
}

body::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg, rgba(88,101,242,.05), transparent 22%, transparent 78%, rgba(53,194,255,.035));
}

.sidebar{
  width:284px;
  padding:18px 14px;
  background:
    linear-gradient(180deg, rgba(12,17,28,.98), rgba(7,10,18,.96)),
    #0b101a;
  border-right:1px solid rgba(148,163,184,.14);
  box-shadow:12px 0 40px rgba(0,0,0,.18);
}

.brand{
  margin:0 0 18px;
  padding:14px 12px 18px;
  border:1px solid rgba(148,163,184,.14);
  border-radius:18px;
  background:linear-gradient(180deg, rgba(20,27,42,.86), rgba(12,17,28,.86));
}

.logo{
  width:48px;
  height:48px;
  border-radius:14px;
  border:1px solid rgba(148,163,184,.18);
  background:linear-gradient(180deg, rgba(88,101,242,.18), rgba(53,194,255,.08));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}

.brand h1,
.login-brandname,
.workspace-breadcrumb,
.section-header h3,
.workspace-copy h2,
.server-picker-head h2,
.server-card-name{
  letter-spacing:0;
}

.brand h1{
  font-size:20px;
  font-weight:850;
}

.brand p{
  color:#9aa8bf;
  font-size:11px;
  line-height:1.35;
  text-transform:uppercase;
  letter-spacing:0;
}

.nav{
  gap:5px;
}

.nav-group-label{
  margin:14px 8px 5px;
  color:#68758b;
  font-size:10px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.nav-group-label:first-child{
  margin-top:0;
}

.nav button{
  position:relative;
  display:flex;
  align-items:center;
  gap:10px;
  min-height:42px;
  padding:10px 12px;
  border-radius:12px;
  color:#9da9bd;
  font-size:14px;
  font-weight:760;
  letter-spacing:0;
}

.nav button::before{
  content:"";
  width:8px;
  height:8px;
  flex:0 0 8px;
  border-radius:999px;
  border:0;
  background:rgba(148,163,184,.28);
  box-shadow:0 0 0 5px rgba(148,163,184,.06);
}

.nav button:hover,
.nav button.active{
  color:#f7fbff;
  background:linear-gradient(90deg, rgba(88,101,242,.2), rgba(53,194,255,.07));
  border-color:rgba(88,101,242,.34);
  transform:none;
}

.nav button.active::before{
  background:#35c2ff;
  box-shadow:0 0 0 5px rgba(88,101,242,.18), 0 0 22px rgba(53,194,255,.28);
}

.box{
  padding:14px;
  border-radius:16px;
  background:linear-gradient(180deg, rgba(20,27,42,.72), rgba(12,17,28,.86));
  border:1px solid rgba(148,163,184,.14);
  box-shadow:none;
}

.box h3,
.topbar-kicker,
.workspace-kicker,
.server-picker-kicker,
.settings-card-note,
.table-tab-kpi small,
.dashboard-card-label,
.mini-label,
.case-label,
.downloads-kicker{
  letter-spacing:0;
}

.main{
  padding:20px 24px 32px;
}

.topbar,
.tab-section,
.workspace-hero,
.footer-brand{
  width:min(var(--content-max), 100%);
  margin-inline:auto;
}

.topbar{
  position:sticky;
  top:14px;
  z-index:35;
  margin-bottom:18px;
  padding:14px;
  border:1px solid rgba(148,163,184,.16);
  border-radius:18px;
  background:rgba(15,20,32,.86);
  backdrop-filter:blur(18px);
  box-shadow:0 16px 38px rgba(0,0,0,.24);
}

.topbar-controls{
  display:grid;
  grid-template-columns:minmax(270px,.7fr) minmax(0,1.3fr);
  gap:16px;
}

.topbar-copy{
  gap:5px;
}

.topbar-kicker{
  width:max-content;
  padding:5px 10px;
  min-height:28px;
  border-radius:999px;
  background:rgba(88,101,242,.12);
  border:1px solid rgba(88,101,242,.26);
  color:#c8d0ff;
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
}

.workspace-breadcrumb{
  font-size:18px;
  line-height:1.25;
}

.topbar-microcopy{
  max-width:58ch;
  color:#98a7bd;
  font-size:12px;
}

.toolbar{
  justify-content:flex-end;
  gap:8px;
}

.top-user,
.lang-switch,
.runtime-switch{
  border-radius:12px;
  border:1px solid rgba(148,163,184,.16);
  background:rgba(11,16,26,.72);
}

.btn,
.lang-btn,
.runtime-switch-btn{
  letter-spacing:0;
}

.btn{
  min-height:40px;
  padding:0 14px;
  border-radius:12px;
  background:linear-gradient(135deg, #5865f2, #35c2ff);
  border:1px solid rgba(157,170,255,.24);
  color:#fff;
  box-shadow:0 12px 24px rgba(88,101,242,.22);
}

.btn:hover{
  transform:translateY(-1px);
  box-shadow:0 16px 30px rgba(88,101,242,.26);
}

.btn.secondary,
.btn.ghost,
.login-top-link,
.login-inline-link{
  color:#e8eef8;
  background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025));
  border-color:rgba(148,163,184,.16);
  box-shadow:none;
}

.btn.green{
  background:linear-gradient(135deg, #17b26a, #25d366);
  box-shadow:0 12px 24px rgba(37,211,102,.18);
}

.btn.red{
  background:linear-gradient(135deg, #f05267, #e43f5a);
}

.btn.yellow{
  background:linear-gradient(135deg, #f0a83a, #f5b14c);
}

.pill,
.server-picker-summary-pill,
.notif-pill,
.status-pill,
.runtime-switch{
  min-height:36px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.16);
  background:rgba(255,255,255,.045);
  color:#dbe5f3;
}

.panel,
.section,
.dashboard-overview-panel,
.dashboard-chart,
.setting-card,
.intel-hero,
.intel-panel,
.question-column,
.question-card,
.server-card,
.server-picker-head,
.workspace-hero,
.workspace-stage-surface,
.workspace-meta-card,
.dashboard-card,
.quick-action-btn,
.guide-card,
.downloads-platform-grid > *,
.downloads-detail-grid > *,
.footer-brand{
  border:1px solid rgba(148,163,184,.14);
  border-radius:18px;
  background:
    linear-gradient(180deg, rgba(20,27,42,.86), rgba(12,17,28,.94));
  box-shadow:0 18px 44px rgba(0,0,0,.2);
}

.panel::before,
.workspace-hero::before,
.server-card::before,
.table-tab-kpi::before{
  opacity:.55;
}

.panel{
  padding:20px;
}

.tab-section{
  gap:18px;
}

.section-header{
  gap:14px;
  padding-bottom:14px;
  margin-bottom:18px;
  border-bottom:1px solid rgba(148,163,184,.12);
}

.section-header h3{
  font-size:22px;
  font-weight:850;
  line-height:1.16;
}

.section-header p{
  max-width:68ch;
  color:#9da9bd;
  font-size:13px;
  line-height:1.6;
}

.workspace-hero{
  margin-bottom:18px;
  padding:22px;
  grid-template-columns:minmax(0,.9fr) minmax(360px,.78fr);
  gap:18px 22px;
  border-radius:20px;
  background:
    linear-gradient(180deg, rgba(20,27,42,.9), rgba(12,17,28,.96)),
    url('/discord-assets/vibe-welcome-bg.svg') center/cover no-repeat;
}

.workspace-copy h2{
  max-width:14ch;
  font-size:46px;
  line-height:1;
}

.workspace-copy p{
  max-width:62ch;
  color:#a4b0c5;
  font-size:14px;
  line-height:1.65;
}

.workspace-stage-surface{
  min-height:0;
  padding:18px;
  border-radius:18px;
}

.workspace-stage-avatar{
  width:58px;
  height:58px;
  border-radius:16px;
}

.workspace-stage-title{
  max-width:none;
  font-size:24px;
}

.workspace-stage-copy{
  max-width:54ch;
  color:#aab6ca;
}

.workspace-stage-chip,
.hero-stage-tags span,
.permission-chip,
.chip{
  border-radius:999px;
  border:1px solid rgba(148,163,184,.16);
  background:rgba(255,255,255,.05);
  color:#dbe5f3;
  letter-spacing:0;
}

.workspace-meta{
  gap:12px;
}

.workspace-meta-card{
  padding:14px;
  border-radius:16px;
}

.server-picker-head{
  padding:26px;
  border-radius:22px;
}

.server-picker-head h2{
  max-width:13ch;
  font-size:54px;
  line-height:1;
}

.server-picker-head p{
  max-width:64ch;
  color:#a4b0c5;
}

.server-picker-grid{
  gap:16px;
}

.server-card{
  min-height:320px;
  padding:20px;
  border-radius:20px;
}

.server-card-avatar{
  width:86px;
  height:86px;
}

.server-card-name{
  font-size:26px;
}

.dashboard-panels,
.settings-main-grid,
.settings-grid,
.dashboard-main-grid,
.table-tab-kpis,
.meta-grid,
.grid-stats,
.analytics-summary,
.analytics-trend-strip,
.staff-analytics-slider,
.downloads-platform-grid,
.downloads-detail-grid,
.question-default-grid{
  gap:14px;
}

.setting-card{
  padding:16px;
  border-radius:16px;
  box-shadow:none;
}

.setting-card h4,
.guide-card h4,
.question-column-head span{
  margin-top:0;
  color:#f4f7fb;
  font-size:14px;
  font-weight:820;
  line-height:1.25;
}

.settings-card-note,
.question-column-head small,
.downloads-steps,
.guide-card p,
.setting-card p{
  color:#9da9bd;
  font-size:12px;
  line-height:1.58;
}

.input,
select,
textarea{
  min-height:42px;
  padding:10px 12px;
  border-radius:12px;
  border-color:rgba(148,163,184,.18);
  background:rgba(7,10,18,.78);
  color:#f4f7fb;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}

.input:hover,
select:hover,
textarea:hover{
  border-color:rgba(148,163,184,.26);
}

.input:focus,
select:focus,
textarea:focus{
  border-color:rgba(88,101,242,.58);
  box-shadow:0 0 0 4px rgba(88,101,242,.13);
}

.table-wrap{
  border-radius:16px;
  border:1px solid rgba(148,163,184,.14);
  background:rgba(7,10,18,.62);
  box-shadow:none;
}

table{
  border-collapse:separate;
  border-spacing:0;
}

th{
  background:rgba(20,27,42,.94);
  color:#c2cada;
  font-size:11px;
  font-weight:850;
  letter-spacing:0;
  text-transform:uppercase;
}

td{
  border-color:rgba(148,163,184,.08);
  color:#dce5f2;
}

tbody tr:hover{
  background:rgba(88,101,242,.08);
}

.table-tab-kpi,
.intel-kpi,
.hero-fact,
.login-scene-panel-stat,
.workspace-stage-stat{
  border-radius:14px;
  border:1px solid rgba(148,163,184,.14);
  background:rgba(255,255,255,.045);
}

.table-tab-kpi{
  min-height:104px;
  padding:15px;
}

.table-tab-kpi strong{
  font-size:30px;
}

.quick-action-btn{
  text-align:left;
  padding:15px;
  color:#f4f7fb;
}

.modal-backdrop,
.modal-backdrop.action-modal,
.case-drawer-backdrop,
.notif-drawer-backdrop{
  background:rgba(3,6,12,.68);
  backdrop-filter:blur(10px);
}

.modal,
.action-modal-card,
.case-drawer,
.notif-drawer{
  border:1px solid rgba(148,163,184,.18);
  border-radius:20px;
  background:linear-gradient(180deg, rgba(20,27,42,.98), rgba(9,13,22,.98));
  box-shadow:0 28px 90px rgba(0,0,0,.44);
}

.close-btn{
  border-radius:12px;
  border:1px solid rgba(148,163,184,.16);
  background:rgba(255,255,255,.06);
  color:#dbe5f3;
}

.login-overlay{
  background:
    linear-gradient(180deg, rgba(255,255,255,.02), transparent 220px),
    #070a12;
}

.login-card{
  width:min(1280px, calc(100% - 32px));
  min-height:calc(100vh - 44px);
  padding:28px;
  border-radius:28px;
  border:1px solid rgba(148,163,184,.16);
  background:linear-gradient(180deg, rgba(15,20,32,.98), rgba(7,10,18,.98));
  box-shadow:0 28px 90px rgba(0,0,0,.38);
}

.login-topbar{
  align-items:center;
  padding-bottom:20px;
  border-bottom:1px solid rgba(148,163,184,.12);
}

.login-brandmark{
  width:52px;
  height:52px;
  border-radius:15px;
}

.login-kicker,
.login-detail-label,
.hero-stage-kicker,
.fact-label,
.sidebar-label,
.section-kicker{
  letter-spacing:0;
}

.login-brandname{
  margin-top:8px;
  font-size:28px;
}

.login-stage{
  grid-template-columns:minmax(0,.95fr) minmax(420px,1.05fr);
  gap:26px;
  align-items:center;
}

.login-card h2{
  max-width:800px;
  font-size:58px;
  line-height:1.02;
  letter-spacing:0;
}

.login-lead{
  max-width:68ch;
  font-size:16px;
  line-height:1.68;
}

.login-scene,
.login-detail-panel{
  border:1px solid rgba(148,163,184,.14);
  border-radius:20px;
  background:linear-gradient(180deg, rgba(20,27,42,.74), rgba(12,17,28,.92));
}

.login-detail-panel{
  padding:20px;
  box-shadow:none;
}

.login-detail-panel h3{
  font-size:22px;
  letter-spacing:0;
}

.login-step-index{
  border-radius:12px;
  background:linear-gradient(135deg, rgba(88,101,242,.26), rgba(53,194,255,.12));
  border:1px solid rgba(88,101,242,.26);
}

.login-mini-points div{
  border-radius:12px;
  border-color:rgba(148,163,184,.12);
  background:rgba(255,255,255,.045);
}

.login-overlay{
  align-items:center;
  justify-content:center;
  padding:24px;
}

.login-card{
  width:min(920px, calc(100% - 32px));
  min-height:auto;
}

.login-gate{
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(300px, .72fr);
  gap:18px;
  align-items:stretch;
}

.login-gate-copy,
.login-gate-panel{
  min-width:0;
  padding:22px;
  border-radius:20px;
  border:1px solid rgba(148,163,184,.14);
  background:linear-gradient(180deg, rgba(20,27,42,.74), rgba(12,17,28,.92));
}

.login-gate-copy{
  display:grid;
  align-content:center;
  gap:16px;
}

.login-gate-copy h2{
  margin:0;
  max-width:13ch;
  color:#f8fbff;
  font-size:42px;
  line-height:1.05;
  font-weight:900;
  letter-spacing:0;
}

.login-gate-copy .login-lead{
  max-width:58ch;
}

.login-gate-panel{
  display:grid;
  align-content:center;
  gap:14px;
}

.login-gate-panel strong{
  color:#f4f7fb;
  font-size:21px;
  line-height:1.2;
  font-weight:900;
}

.login-gate-panel p{
  margin:0;
  color:#9da9bd;
  font-size:13px;
  line-height:1.6;
}

.activation-preview-landing{
  display:grid;
  gap:18px;
}

.activation-preview-landing .login-stage{
  grid-template-columns:minmax(0, .95fr) minmax(420px, 1.05fr);
  gap:26px;
  align-items:center;
}

.activation-preview-landing .login-hero{
  gap:16px;
  padding:4px 0;
}

.activation-preview-landing .login-hero h2{
  margin:0;
  max-width:15ch;
  color:#f8fbff;
  font-size:52px;
  line-height:1.04;
  font-weight:900;
  letter-spacing:0;
}

.activation-preview-landing .login-lead{
  max-width:68ch;
  color:#aab6ca;
  font-size:15px;
  line-height:1.65;
}

.activation-preview-inline-note{
  margin:0;
  max-width:68ch;
  color:#8fa0ba;
  font-size:13px;
  line-height:1.6;
}

.activation-preview-landing .login-scene{
  min-height:420px;
  border-radius:20px;
  border-color:rgba(148,163,184,.14);
}

.activation-preview-landing .login-detail-row{
  grid-template-columns:minmax(0, 1fr) minmax(0, .94fr);
  gap:14px;
}

.activation-preview-landing .login-detail-panel{
  border-radius:18px;
  box-shadow:none;
}

@media(max-width:1320px){
  .topbar-controls,
  .workspace-hero,
  .login-stage{
    grid-template-columns:1fr;
  }

  .workspace-copy h2,
  .server-picker-head h2,
  .login-card h2{
    max-width:none;
  }
}

@media(max-width:1024px){
  .main{
    padding:18px 18px 42px;
  }

  .topbar{
    position:relative;
    top:auto;
  }

  .toolbar{
    justify-content:flex-start;
  }
}

@media(max-width:920px){
  body{
    display:block;
  }

  .sidebar{
    width:100%;
    height:auto;
    position:static;
    border-right:0;
    border-bottom:1px solid rgba(148,163,184,.14);
  }

  .nav{
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
}

@media(max-width:640px){
  .main{
    padding:14px 12px 34px;
  }

  .topbar,
  .panel,
  .workspace-hero,
  .server-picker-head,
  .login-card{
    border-radius:18px;
  }

  .workspace-copy h2,
  .server-picker-head h2,
  .login-card h2{
    font-size:34px;
  }

  .nav{
    grid-template-columns:1fr;
  }

  .toolbar .btn,
  .toolbar .pill{
    width:100%;
  }
}

/* Full surface redesign pass: tabs, tables, editors, and operational surfaces */
.tab-section{
  animation:surfaceIn .2s ease both;
}

@keyframes surfaceIn{
  from{opacity:.65; transform:translateY(4px)}
  to{opacity:1; transform:translateY(0)}
}

.dashboard-overview-panel{
  padding:22px;
  background:
    linear-gradient(180deg, rgba(20,27,42,.9), rgba(12,17,28,.96)),
    linear-gradient(135deg, rgba(88,101,242,.1), transparent 46%);
}

#tab-dashboard.is-activation-preview > .dashboard-overview-panel,
#tab-dashboard.is-activation-preview > .dashboard-main-grid{
  display:none;
}

.activation-preview-panel{
  display:grid;
  grid-template-columns:1fr;
  gap:15px;
  align-items:stretch;
  padding:22px;
  margin-bottom:18px;
  border-radius:20px;
  border:1px solid rgba(148,163,184,.14);
  background:
    linear-gradient(135deg, rgba(88,101,242,.12), transparent 42%),
    linear-gradient(180deg, rgba(20,27,42,.94), rgba(9,14,24,.98));
  overflow:hidden;
}

.activation-preview-intro{
  display:grid;
  grid-template-columns:minmax(0, .96fr) minmax(340px, .82fr);
  gap:18px;
  align-items:stretch;
  min-width:0;
}

.activation-preview-copy{
  display:grid;
  align-content:center;
  gap:14px;
  min-width:0;
  padding:4px 0;
}

.activation-preview-kicker{
  width:max-content;
  max-width:100%;
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:7px 12px;
  border-radius:999px;
  border:1px solid rgba(88,101,242,.28);
  background:rgba(88,101,242,.14);
  color:#c8d0ff;
  font-size:11px;
  font-weight:850;
  text-transform:uppercase;
}

.activation-preview-copy h4{
  margin:0;
  max-width:17ch;
  color:#f8fbff;
  font-size:44px;
  line-height:1.06;
  font-weight:900;
  letter-spacing:0;
}

.activation-preview-copy p{
  margin:0;
  max-width:68ch;
  color:#aab6ca;
  font-size:14px;
  line-height:1.65;
}

.activation-preview-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:4px;
}

.activation-preview-showcase{
  position:relative;
  display:grid;
  align-content:end;
  gap:16px;
  min-width:0;
  min-height:310px;
  padding:22px;
  border-radius:18px;
  border:1px solid rgba(148,163,184,.14);
  background:
    linear-gradient(180deg, rgba(12,23,38,.78), rgba(8,13,23,.96)),
    url('/discord-assets/vibe-welcome-bg.svg') center/cover no-repeat;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  overflow:hidden;
}

.activation-preview-showcase::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(53,194,255,.22), transparent 32%, rgba(88,101,242,.14));
  opacity:.55;
  pointer-events:none;
}

.activation-preview-showcase > *{
  position:relative;
  z-index:1;
}

.activation-preview-showcase-head{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr);
  gap:14px;
  align-items:center;
  max-width:520px;
}

.activation-preview-showcase-mark{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  border-radius:17px;
  border:1px solid rgba(148,163,184,.18);
  background:linear-gradient(180deg, rgba(88,101,242,.2), rgba(10,15,25,.86));
}

.activation-preview-showcase-mark img{
  width:34px;
  height:34px;
  display:block;
}

.activation-preview-showcase small,
.activation-preview-showcase-grid small,
.activation-preview-step-index{
  display:block;
  color:#9eb0cc;
  font-size:11px;
  line-height:1.2;
  font-weight:850;
  text-transform:uppercase;
}

.activation-preview-showcase-head strong{
  display:block;
  margin-top:5px;
  color:#f8fbff;
  font-size:20px;
  line-height:1.25;
  font-weight:900;
}

.activation-preview-showcase p{
  margin:0;
  max-width:560px;
  color:#afbdd2;
  font-size:13px;
  line-height:1.6;
}

.activation-preview-showcase-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
}

.activation-preview-showcase-grid > div,
.activation-preview-step{
  min-width:0;
  padding:13px;
  border-radius:14px;
  border:1px solid rgba(148,163,184,.13);
  background:rgba(9,14,24,.72);
}

.activation-preview-showcase-grid strong{
  display:block;
  margin-top:7px;
  color:#f4f7fb;
  font-size:13px;
  line-height:1.35;
  font-weight:850;
}

.activation-preview-steps{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
}

.activation-preview-step{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr);
  gap:12px;
  align-items:start;
}

.activation-preview-step-index{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:12px;
  border:1px solid rgba(53,194,255,.2);
  background:rgba(53,194,255,.09);
  color:#d8f4ff;
}

.activation-preview-step strong{
  display:block;
  color:#f4f7fb;
  font-size:14px;
  line-height:1.25;
  font-weight:850;
}

.activation-preview-step p{
  margin:5px 0 0;
  color:#8e9bb2;
  font-size:12px;
  line-height:1.45;
}

.activation-preview-stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:12px;
  min-width:0;
}

.activation-preview-stat{
  min-width:0;
  padding:16px;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.14);
  background:linear-gradient(180deg, rgba(17,24,39,.78), rgba(10,15,25,.94));
}

.activation-preview-stat small,
.activation-preview-network small{
  display:block;
  margin-bottom:10px;
  color:#8fa0ba;
  font-size:11px;
  line-height:1.2;
  font-weight:850;
  text-transform:uppercase;
}

.activation-preview-stat strong{
  display:block;
  color:#f8fbff;
  font-size:34px;
  line-height:1;
  font-weight:900;
}

.activation-preview-stat span{
  display:block;
  margin-top:10px;
  color:#93a1b6;
  font-size:12px;
  line-height:1.45;
}

.activation-preview-network{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:minmax(260px, auto) minmax(0, 1fr);
  gap:16px;
  align-items:center;
  padding:14px;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.12);
  background:rgba(255,255,255,.035);
}

.activation-preview-emblems{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.activation-preview-emblem{
  width:42px;
  height:42px;
  border-radius:14px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px solid rgba(148,163,184,.16);
  background:linear-gradient(180deg, rgba(88,101,242,.18), rgba(53,194,255,.08));
  color:#f8fbff;
  font-size:12px;
  font-weight:900;
}

.activation-preview-emblem img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.activation-preview-network p{
  margin:0;
  color:#aab6ca;
  font-size:13px;
  line-height:1.55;
}

.dashboard-overview-head,
.dashboard-card-head,
.settings-group-head,
.download-card-head,
.download-guide-head,
.preview-header,
.questions-header,
.case-drawer .drawer-head,
.modal-header{
  border-bottom:1px solid rgba(148,163,184,.1);
  padding-bottom:12px;
  margin-bottom:14px;
}

.dashboard-overview-head h3,
.dashboard-card-head h4,
.settings-group-head h4,
.download-card-head h4,
.download-guide-head h4,
.questions-header h4,
.modal-header h3{
  margin:0;
  color:#f4f7fb;
  font-size:18px;
  line-height:1.2;
  font-weight:850;
  letter-spacing:0;
}

.dashboard-overview-head p,
.dashboard-card-head p,
.settings-group-head p,
.download-card-head p,
.download-guide-head p,
.questions-header p{
  margin:5px 0 0;
  color:#9da9bd;
  font-size:13px;
  line-height:1.55;
}

.dashboard-stat-grid,
.server-pulse-grid,
.today-grid,
.dashboard-severity-grid,
.dashboard-chart-grid,
.dashboard-main-grid{
  gap:14px;
}

.dashboard-stat-card,
.dashboard-inline-card,
.server-pulse-item,
.today-mini,
.severity-card,
.info-item,
.drawer-card,
.notes-panel,
.lookup-selection-card,
.lookup-console-card,
.quick-lookup-card,
.quick-status-inline,
.preview-metric,
.download-card,
.download-guide-card,
.ticket-preview-card,
.ticket-category-editor,
.settings-overview-card,
.question-answer-guide,
.questions-box{
  border:1px solid rgba(148,163,184,.14);
  border-radius:14px;
  background:linear-gradient(180deg, rgba(17,24,39,.72), rgba(10,15,25,.9));
  box-shadow:none;
}

.dashboard-stat-card,
.server-pulse-item,
.today-mini,
.severity-card,
.settings-overview-card{
  padding:15px;
}

.dashboard-stat-card strong,
.server-pulse-item strong,
.today-mini strong,
.settings-overview-card strong,
.preview-metric strong{
  color:#f8fbff;
  font-size:26px;
  line-height:1.05;
}

.dashboard-stat-card span,
.server-pulse-item span,
.today-mini span,
.settings-overview-card small,
.preview-metric span{
  color:#8e9bb2;
  font-size:12px;
  line-height:1.45;
}

.dashboard-filter-row,
.filter-row,
.filter-chip-row,
.dashboard-action-row,
.settings-actions,
.download-card-actions,
.lookup-search-actions,
.mini-actions,
.drawer-actions{
  gap:8px;
}

.filter-chip,
.radio-wrap,
.runtime-switch-btn,
.q-toolbar button{
  min-height:36px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.14);
  background:rgba(255,255,255,.04);
  color:#aeb9ca;
  font-weight:760;
}

.filter-chip.active,
.radio-wrap.active,
.runtime-switch-btn.active,
.q-toolbar button.active{
  color:#fff;
  border-color:rgba(88,101,242,.42);
  background:linear-gradient(135deg, rgba(88,101,242,.28), rgba(53,194,255,.12));
}

.settings-group,
.downloads-shell,
.questions-editor,
.lookup-workspace,
.lookup-profile-workspace,
.ticket-preview-stack,
.ticket-preview-grid,
.preview-grid{
  border:1px solid rgba(148,163,184,.12);
  border-radius:16px;
  background:rgba(7,10,18,.24);
}

.settings-group{
  padding:16px;
  margin-bottom:14px;
}

.settings-stack{
  gap:14px;
}

.settings-group-head{
  align-items:flex-start;
}

.settings-main-grid{
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
}

.settings-span-full,
.settings-span-3{
  grid-column:1 / -1;
}

.settings-span-2{
  grid-column:span 2;
}

.settings-overview{
  gap:12px;
  margin-bottom:14px;
}

.settings-lock-pill,
.download-badge,
.question-badge,
.notes-meta,
.guild-rank,
.status-clear,
.status-watch,
.status-review,
.status-critical{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.16);
  background:rgba(255,255,255,.045);
  color:#c7d2e3;
  font-size:11px;
  font-weight:820;
  letter-spacing:0;
  text-transform:none;
}

.status-clear{color:#b7f7d3; border-color:rgba(37,211,102,.28); background:rgba(37,211,102,.09)}
.status-watch{color:#ffe1a3; border-color:rgba(245,177,76,.28); background:rgba(245,177,76,.09)}
.status-review{color:#c8d0ff; border-color:rgba(88,101,242,.3); background:rgba(88,101,242,.12)}
.status-critical{color:#ffbac4; border-color:rgba(240,82,103,.3); background:rgba(240,82,103,.12)}

.guild-rank{
  display:grid;
  align-items:stretch;
  gap:10px;
  width:100%;
  min-height:0;
  padding:0;
  border:0;
  background:transparent;
}

.guild-rank-row{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr) auto;
  align-items:center;
  gap:12px;
  width:100%;
  min-width:0;
  padding:12px 13px;
  border-radius:14px;
  border:1px solid rgba(148,163,184,.14);
  background:linear-gradient(180deg, rgba(17,24,39,.72), rgba(10,15,25,.9));
}

.guild-rank-badge{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:12px;
  border:1px solid rgba(53,194,255,.18);
  background:linear-gradient(180deg, rgba(53,194,255,.14), rgba(88,101,242,.1));
  color:#e9f8ff;
  font-size:11px;
  font-weight:900;
}

.guild-rank-main{
  display:grid;
  gap:4px;
  min-width:0;
}

.guild-rank-name{
  display:block;
  min-width:0;
  color:#f4f7fb;
  font-size:13px;
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.guild-rank-id{
  display:block;
  min-width:0;
  color:#8e9bb2;
  font-size:11px;
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.guild-rank-total{
  min-width:46px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  padding:0 10px;
  border-radius:12px;
  border:1px solid rgba(53,194,255,.2);
  background:rgba(53,194,255,.09);
  color:#f8fbff;
  font-size:13px;
  line-height:1.05;
}

.guild-rank-total small{
  color:#9eb0cc;
  font-size:8px;
  line-height:1;
  font-weight:850;
}

.severity-card.status-clear,
.severity-card.status-watch,
.severity-card.status-review,
.severity-card.status-critical{
  display:grid;
  align-items:start;
  gap:5px;
  min-height:0;
  padding:13px 14px;
  border-radius:14px;
  text-transform:none;
}

.severity-card small,
.severity-card strong,
.severity-card span{
  display:block;
  min-width:0;
}

.severity-card small{
  margin:0;
  color:#9da9bd;
  font-size:11px;
  line-height:1.15;
  font-weight:850;
  letter-spacing:0;
  text-transform:uppercase;
}

.severity-card strong{
  margin:0;
  color:#f4f7fb;
  font-size:14px;
  line-height:1.25;
  font-weight:850;
}

.severity-card span{
  color:#9da9bd;
  font-size:12px;
  line-height:1.35;
}

.lookup-layout,
.case-main,
.lookup-main-grid,
.tickets-layout{
  gap:14px;
}

.lookup-console-card{
  padding:16px;
  background:
    linear-gradient(180deg, rgba(20,27,42,.86), rgba(12,17,28,.96)),
    linear-gradient(135deg, rgba(88,101,242,.1), transparent 48%);
}

.lookup-console-card h4,
.intel-panel h4,
.lookup-selection-card h4,
.notes-panel h4,
.drawer-card h4{
  margin:0 0 8px;
  color:#f4f7fb;
  font-size:16px;
  line-height:1.25;
  font-weight:850;
}

.lookup-console-copy,
.lookup-note,
.lookup-dossier-body,
.lookup-staff-notes-copy,
.drawer-card p,
.intel-panel p{
  color:#9da9bd;
  font-size:13px;
  line-height:1.58;
}

.lookup-search-results,
.lookup-staff-note-list,
.lookup-history-list,
.command-results,
.watchlist-list,
.insight-list,
.info-list,
.timeline-list{
  display:grid;
  gap:10px;
}

.lookup-search-empty,
.muted{
  color:#8f9bb0;
}

.intel-panel{
  padding:16px;
  border-radius:14px;
  border-color:rgba(148,163,184,.14);
  background:linear-gradient(180deg, rgba(17,24,39,.72), rgba(10,15,25,.9));
}

.action-chip-btn{
  border-radius:12px;
  border-color:rgba(148,163,184,.14);
  background:linear-gradient(180deg, rgba(88,101,242,.13), rgba(255,255,255,.035));
}

.action-chip-btn:hover,
.quick-action-btn:hover,
.download-card:hover,
.server-card:hover{
  transform:translateY(-1px);
  border-color:rgba(88,101,242,.34);
  box-shadow:0 18px 40px rgba(0,0,0,.2);
}

.downloads-shell{
  padding:16px;
}

.download-card,
.download-guide-card{
  padding:16px;
}

.download-feature-list,
.download-note-list{
  display:grid;
  gap:9px;
  color:#aab6c9;
  font-size:13px;
  line-height:1.55;
}

.download-snippet,
pre,
code{
  border-radius:12px;
  border-color:rgba(148,163,184,.14);
  background:rgba(2,6,12,.55);
}

.ticket-preview-card,
.ticket-category-editor{
  padding:16px;
}

.ticket-preview-grid,
.preview-grid{
  padding:14px;
  gap:12px;
}

.questions-editor{
  padding:16px;
}

.question-default-grid,
.settings-questions-intro{
  gap:12px;
}

.question-editor-single,
.question-card,
.questions-box{
  padding:14px;
  border-radius:14px;
  border:1px solid rgba(148,163,184,.14);
  background:linear-gradient(180deg, rgba(17,24,39,.68), rgba(10,15,25,.88));
}

.question-card-title,
.question-card-subtitle,
.question-card-id{
  letter-spacing:0;
}

.question-fields{
  gap:10px;
}

.timeline-item,
.drawer-event{
  border:1px solid rgba(148,163,184,.12);
  border-radius:14px;
  background:rgba(255,255,255,.035);
  padding:12px;
}

.timeline-item::before{
  background:#35c2ff;
  box-shadow:0 0 0 5px rgba(53,194,255,.12);
}

.case-drawer{
  width:min(620px, 100vw);
}

.drawer-hero{
  border-radius:16px;
  border:1px solid rgba(148,163,184,.14);
  background:
    linear-gradient(180deg, rgba(20,27,42,.9), rgba(12,17,28,.95)),
    linear-gradient(135deg, rgba(88,101,242,.12), transparent 48%);
}

.command-palette{
  border-radius:18px;
  border:1px solid rgba(148,163,184,.18);
  background:linear-gradient(180deg, rgba(20,27,42,.98), rgba(9,13,22,.98));
}

.footer-brand{
  margin-top:20px;
}

.signature-footer{
  color:#7f8da3;
}

@media(max-width:1180px){
  .activation-preview-stats{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media(max-width:1100px){
  .settings-span-2{
    grid-column:1 / -1;
  }

  .login-gate,
  .activation-preview-landing .login-stage,
  .activation-preview-landing .login-detail-row,
  .dashboard-main-grid,
  .activation-preview-panel,
  .lookup-layout,
  .lookup-main-grid,
  .tickets-layout,
  .downloads-detail-grid{
    grid-template-columns:1fr;
  }

  .login-gate-copy h2,
  .activation-preview-landing .login-hero h2{
    max-width:none;
    font-size:36px;
  }

  .activation-preview-intro{
    grid-template-columns:1fr;
  }

  .activation-preview-copy h4{
    max-width:18ch;
    font-size:36px;
  }

  .activation-preview-showcase{
    min-height:260px;
  }

  .activation-preview-network{
    grid-template-columns:1fr;
  }
}

@media(max-width:680px){
  .activation-preview-panel{
    padding:18px;
  }

  .activation-preview-stats{
    grid-template-columns:1fr;
  }

  .activation-preview-steps,
  .activation-preview-showcase-grid{
    grid-template-columns:1fr;
  }

  .activation-preview-copy h4{
    font-size:30px;
  }

  .activation-preview-showcase{
    min-height:auto;
    padding:18px;
  }

  .activation-preview-actions .btn{
    width:100%;
  }

  .login-gate{
    gap:14px;
  }

  .login-gate-copy,
  .login-gate-panel{
    padding:18px;
  }
}