:root {
  --bg: #090b0e;
  --panel: #12161b;
  --panel2: #181d23;
  --line: #30343b;
  --line2: #272c33;
  --orange: #ff7046;
  --orange2: #ff9b69;
  --green: #4ad697;
  --muted: #9ba2ac;
  --text: #f7f8fa;
}

/* Account registry: stable columns across rows and neutral data colors. */
@media (min-width: 761px) {
  :is(.registry-panel,.diagnostic-list) .account-row {
    grid-template-columns:minmax(180px,1fr) 96px 112px 100px 72px 156px 430px;
    column-gap:14px;
    min-height:74px;
  }
  :is(.registry-panel,.diagnostic-list) .account-row > div:nth-child(n+2):nth-child(-n+6) {
    min-width:0;
    display:grid;
    grid-template-rows:13px 21px;
    align-content:center;
  }
  :is(.registry-panel,.diagnostic-list) .account-row .label {
    margin:0;
    line-height:13px;
  }
  :is(.registry-panel,.diagnostic-list) .account-row .metric {
    display:block;
    overflow:hidden;
    line-height:21px;
    text-overflow:ellipsis;
  }
  :is(.registry-panel,.diagnostic-list) .account-row .actions {
    width:430px;
    display:grid;
    grid-template-columns:92px 76px 82px 80px 72px;
    align-items:center;
    justify-content:end;
    gap:7px;
  }
  :is(.registry-panel,.diagnostic-list) .account-row .actions .status,
  :is(.registry-panel,.diagnostic-list) .account-row .actions .btn {
    min-width:0;
    width:100%;
    white-space:nowrap;
  }
  :is(.registry-panel,.diagnostic-list) .account-row .actions .status {
    overflow:hidden;
    text-overflow:ellipsis;
  }
}

:is(.registry-panel,.diagnostic-list) .account-row .health-good,
:is(.registry-panel,.diagnostic-list) .account-row .health-warn,
:is(.registry-panel,.diagnostic-list) .account-row .health-bad,
:is(.registry-panel,.diagnostic-list) .account-row .health-muted,
:is(.registry-panel,.diagnostic-list) .account-row .mmr-value,
.account-score-grid .health-good,
.account-score-grid .health-warn,
.account-score-grid .health-bad,
.account-score-grid .health-muted {
  color:#f4f6fb !important;
}

@media (min-width:1181px) and (max-width:1450px) {
  :is(.registry-panel,.diagnostic-list) .account-row {
    grid-template-columns:minmax(130px,1fr) 72px 88px 82px 58px 400px;
    column-gap:12px;
  }
  :is(.registry-panel,.diagnostic-list) .account-row > div:nth-child(6) { display:none; }
  :is(.registry-panel,.diagnostic-list) .account-row .actions { width:400px; grid-template-columns:82px 70px 76px 75px 69px; gap:7px; }
}

@media (min-width:761px) and (max-width:1180px) {
  :is(.registry-panel,.diagnostic-list) .account-row {
    grid-template-columns:minmax(145px,1fr) 94px 88px 400px;
    column-gap:12px;
  }
  :is(.registry-panel,.diagnostic-list) .account-row > div:nth-child(2),
  :is(.registry-panel,.diagnostic-list) .account-row > div:nth-child(5),
  :is(.registry-panel,.diagnostic-list) .account-row > div:nth-child(6) { display:none; }
  :is(.registry-panel,.diagnostic-list) .account-row .actions { width:400px; grid-template-columns:82px 70px 76px 75px 69px; gap:7px; }
}

html, body { font-family: Manrope, "Segoe UI", sans-serif; color: var(--text); }
body { background: #090b0e; }
body::before { background: radial-gradient(circle at 80% 0, #261813 0, transparent 38%), #090b0e; }
.ambient { display: none; }
button, input, select, textarea { font-family: inherit; }
button { transition: background .16s ease, border-color .16s ease, transform .16s ease; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid #ff966e; outline-offset: 3px; }

.app-shell { max-width: 1920px; grid-template-columns: 238px minmax(0,1fr); gap: 18px; padding: 0 18px 32px; }
.rental-topbar { min-height: 72px; border-color: #282b30; background: rgba(9,11,14,.94); box-shadow: 0 10px 30px rgba(0,0,0,.14); }
.rental-brand b { font-size: 17px; font-weight: 800; letter-spacing: -.03em; }
.rental-brand i { color: #a5aab1; font-size: 10px; }
.rental-topnav { gap: 28px; }
.rental-topnav a, .rental-topnav span { color: #a5aab1; font-size: 12px; font-weight: 700; }
.rental-topnav .active { color: #fff; }
.rental-user { border-color: #49403c; background: linear-gradient(150deg,#3a211b,#14161a); }
.sidebar { top: 90px; height: calc(100vh - 108px); padding: 0; border: 1px solid #2a2d32; border-radius: 16px; background: #111418; box-shadow: 0 16px 45px rgba(0,0,0,.18); overflow: hidden; }
.brand { min-height: 88px; padding: 16px; background: #15191e; border-color: #2a2f35; }
.brand-mark { width: 44px; height: 44px; border-radius: 12px; background: linear-gradient(135deg,#ff885b,#dc4c2f); color: #16110f; box-shadow: none; }
.brand b { font-size: 16px; font-weight: 800; letter-spacing: -.035em; }
.brand small { font-size: 11px; color: #939ba5; }
.seller-pill { margin: 0; padding: 13px 17px; border-bottom: 1px solid #252a30; font-size: 10px; }
.seller-pill b { font-size: 9px; }
.sidebar nav { padding: 10px 8px; }
.sidebar nav button { min-height: 42px; margin: 2px 0; padding: 0 13px; gap: 13px; border: 0; border-radius: 9px; color: #aab0b8; font-size: 12px; font-weight: 650; }
.sidebar nav button.active { background: #302019; color: #fff; box-shadow: inset 3px 0 #ff7046; }
.sidebar nav button:hover { background: #20252b; color: #fff; }
.sidebar nav button em { color: #c9cbd0; background: #2a2e34; }
.nav-label { padding: 17px 13px 6px; color: #7f8790; font-size: 9px; letter-spacing: .12em; }
.back-link { margin: auto 12px 14px; border-color: #363b42; color: #d1d3d7; font-size: 12px; }
.back-link:hover { border-color: #ff7046; color: #fff; }
main { padding: 0 0 35px; }

.command-cover { display: block; min-height: 310px; border: 1px solid #343037; border-radius: 16px; overflow: hidden; background: linear-gradient(90deg,rgba(9,11,14,.95) 0%,rgba(9,11,14,.84) 32%,rgba(9,11,14,.2) 70%), url("./dota-hero-v2.webp") center 44%/cover no-repeat; box-shadow: 0 18px 50px rgba(0,0,0,.22); }
.command-cover::before { display: none; }
.cover-copy { display: flex; flex-direction: column; justify-content: center; min-height: 310px; max-width: 790px; padding: 28px 42px 72px; }
.cover-copy .eyebrow { margin: 0 0 12px; }
.cover-copy h2 { margin: 0 0 6px; font: 800 clamp(38px,3.4vw,58px)/1.08 Manrope,sans-serif; letter-spacing: -.06em; text-transform: none; text-wrap: balance; }
.cover-copy h3 { color: #d0d3d9; font-size: clamp(16px,1.35vw,21px); font-weight: 600; letter-spacing: -.02em; }
.cover-art { display: none; }
.cover-rail { left: 42px; right: 34px; bottom: 26px; max-width: 690px; padding-top: 13px; border-color: rgba(255,255,255,.25); }
.cover-rail::before { height: 2px; width: 36px; background: #ff7046; transform: none; }
.cover-rail b, .cover-rail span { color: #c7c9ce; font: 700 10px/1.35 Manrope,sans-serif; letter-spacing: .08em; }
.eyebrow { color: #ff946e !important; font-size: 10px !important; font-weight: 800; letter-spacing: .11em; }

.control-strip { min-height: 130px; grid-template-columns: 1fr auto; margin-top: 16px; border: 1px solid #2d3238; border-radius: 14px; background: #13171c; }
.control-strip::before,.control-strip::after,.panel::before,.panel::after,.page-lead::before,.page-lead::after,.observer-lead::before,.observer-lead::after { display: none; }
.control-strip > div { padding: 23px 30px; }
.control-strip h2 { margin: 5px 0; font: 800 clamp(22px,2vw,31px)/1.12 Manrope,sans-serif; letter-spacing: -.045em; text-transform: none; }
.control-strip p:not(.eyebrow) { color: #b1b7bf; font-size: 12px; }
.control-strip aside { min-width: 104px; padding: 18px; border-color: #292e34; color: #858e99; font-size: 9px; }
.system-flags { gap: 7px; margin-top: 15px; }
.system-flags span { border-color: #343a41; border-radius: 6px; padding: 7px 9px; color: #bac0c8; font: 700 9px Manrope,sans-serif; letter-spacing: .04em; }
.system-flags span:before { width: 6px; height: 6px; margin-right: 6px; }
.system-flags .on { color: #79e4b1; border-color: #315a46; }

.command-stats { gap: 14px; margin: 16px 0; }
.command-stat,.finance-card,.stat { min-height: 112px; grid-template-columns: 66px minmax(0,1fr); border: 1px solid #2d3238; border-radius: 13px; background: #14181e; }
.command-stat.is-zero { grid-template-columns: 66px minmax(0,1fr); opacity: 1; }
.command-stat > span { margin: 15px; width: 42px; height: 42px; align-self: center; border: 1px solid #504039; border-radius: 11px; background: #241b18; color: #ff956e; }
.stat-glyph::before,.stat-glyph::after { display: none !important; }
.stat-glyph svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.command-stat small { color: #a8afb8; font: 750 10px Manrope,sans-serif; letter-spacing: .025em; }
.command-stat b,.command-stat.is-zero b { margin-top: 4px; color: #f8f9fa; font: 800 32px/1.05 Manrope,sans-serif; letter-spacing: -.055em; }
.command-stat em { color: #79838e; font: 700 9px Manrope,sans-serif; letter-spacing: .04em; }
.command-stat.danger b { color: #ff9188; }
.micro-bars { display: none; }

.overview-command-grid,.overview-command-grid.is-empty { gap: 14px; }
.overview-command-grid .panel,.panel,.observer-lead,.page-lead,.diagnostic-strip,.issue-protocol,.category-card { border: 1px solid #2d3239; border-radius: 14px; background-color: #14181e; box-shadow: 0 8px 26px rgba(0,0,0,.09); }
.panel-head { padding: 18px 20px; border-color: #2d3239; }
.panel-head h3 { font: 800 15px/1.2 Manrope,sans-serif; letter-spacing: -.025em; }
.panel-head small { display: block; margin-top: 5px; color: #8a929c; font: 700 9px Manrope,sans-serif; letter-spacing: .04em; }
.panel-body { padding: 18px 20px; }
.text-action { font: 800 11px Manrope,sans-serif; color: #ff9a72; }
.ops-row { font-size: 12px; }
.ops-row small { font-size: 10px; }
.ops-row time { font: 700 11px Manrope,sans-serif; }
.ops-row .status { font-size: 10px; }
.ops-empty,.pool-empty { gap: 18px; padding: 20px 10px; }
.ops-empty b,.pool-empty b { font-size: 15px; }
.ops-empty p,.pool-empty p { color: #a0a8b1; font-size: 11px; }
.empty-mark { width: 44px; height: 44px; border-color: #514037; border-radius: 8px; transform: none; }
.empty-mark::before,.empty-mark::after { left: 11px; right: 11px; top: 21px; }
.empty-ring { width: 78px; height: 78px; border: 8px solid #323941; }
.empty-ring b,.pool-ring b { font: 800 25px Manrope,sans-serif; }
.pool-ring { width: 105px; height: 105px; }
.pool-layout { grid-template-columns: 105px 1fr; }
.pool-legend p { font-size: 10px; }
.pool-distribution > span { font: 750 9px Manrope,sans-serif; color: #a0a8b1; letter-spacing: .05em; }
.distribution-track { height: 7px; border-radius: 7px; }
.distribution-track i { border-radius: 5px; }
.event-row { font-size: 12px; }
.empty { color: #9ba2ac; }
.empty b { color: #f1f3f5; font-size: 14px; }

.btn,.btn.primary,.icon-btn { min-height: 38px; border-radius: 9px; font-size: 12px; font-weight: 800; box-shadow: none; }
.btn.primary { background: linear-gradient(135deg,#ff885a,#fa6842); color: #1a110d; border-color: #ff936b; }
.btn.primary:hover { background: #ffa27c; transform: translateY(-1px); }
.btn.small { font-size: 11px; }
.status { font-size: 11px; font-weight: 750; }
.label { color: #929ba6; font-size: 10px; }
.muted { color: #9da6b1; }

.page-lead { min-height: 154px; padding: 26px 30px; background: radial-gradient(circle at 91% 0,rgba(255,112,70,.09),transparent 35%), #15191f; }
.page-lead h2 { font: 800 clamp(28px,2.8vw,40px)/1.1 Manrope,sans-serif; letter-spacing: -.05em; }
.page-lead-copy > p:last-child { color: #b0b7c0; font-size: 12px; line-height: 1.55; }
.page-lead-code { color: #89929d; font: 700 10px Manrope,sans-serif; }
.page-lead-code b { font: 800 19px Manrope,sans-serif; }
.page-lead.registry,.page-lead.analytics,.page-lead.dispatch,.page-lead.issue,.page-lead.links,.page-lead.categories,.page-lead.diagnostics,.page-lead.comms,.page-lead.events,.page-lead.config,.page-lead.watch { background: radial-gradient(circle at 91% 0,rgba(255,112,70,.09),transparent 35%), #15191f; }
.finance-card { padding: 20px; }
.finance-card small,.finance-card span { color: #a0a9b3; font-size: 11px; }
.finance-card b { font: 800 27px Manrope,sans-serif; }
.panel-number { font: 800 18px Manrope,sans-serif; letter-spacing: -.04em; }
.pool-ring small { color: #aeb6bf; font: 700 9px Manrope,sans-serif; }
.category-card { min-height: 224px; }
.category-card::after { display: none; }
.category-card h3 { font: 800 17px Manrope,sans-serif; }
.category-card p,.category-card dt { color: #9aa3ae; font-size: 10px; }
.category-card dd { font: 800 19px Manrope,sans-serif; }
.category-emblem { transform: none; border-radius: 10px; font: 800 16px Manrope,sans-serif; }
.issue-protocol > strong,.diagnostic-strip > strong { font: 800 33px Manrope,sans-serif; }
.diagnostic-strip > div:nth-child(2) b { font: 800 17px Manrope,sans-serif; }
.observer-lead h2,.observer-command h3 { font-family: Manrope,sans-serif; font-weight: 800; letter-spacing: -.04em; }
.observer-command,.observer-table { border-radius: 14px; }
.observer-radar.off { border-color: #48515b; background: repeating-radial-gradient(circle,transparent 0 11px,rgba(154,165,177,.12) 12px 13px); }
.observer-radar.off i { display: none; }
.observer-radar.off b { color: #a8b0ba; }
.account-row,.binding-row,.presence-row { font-size: 12px; }
.data-table { font-size: 12px; }
.data-table th { color: #a8b0b9; font-size: 10px; }
.data-table td { color: #e5e8ec; }
.field span,.settings-numbers label { color: #bdc3cb; font-size: 11px; font-weight: 700; }
.field input,.field select,.field textarea,.toolbar input,.toolbar select,.settings-numbers input { min-height: 42px; border-color: #3a414a; border-radius: 9px; background: #0e1217; color: #f8f9fa; font-size: 12px; }
.modal-card { border: 1px solid #343a43; border-radius: 16px; background: #15191e; }
.sidebar nav { scrollbar-width: none; }
.sidebar nav::-webkit-scrollbar { display: none; }
.cover-copy .eyebrow,.control-strip .eyebrow,.page-lead .eyebrow { font-size: 11px !important; }
.cover-rail b,.cover-rail span,.system-flags span,.panel-head small,.command-stat small,.command-stat em,.pool-distribution > span { font-size: 11px; }
.sidebar nav button { font-size: 13px; }
.event-row small,.ops-row small { color: #9aa3ae; font-size: 10px; }
.template-field > span,.setting b,.issue-protocol b { font-size: 12px; }
.issue-protocol li span,.diagnostic-strip p { color: #a0a9b3; font-size: 11px; }

@media(max-width:1450px) {
  .overview-command-grid.is-empty { grid-template-columns: 1.15fr .85fr; }
  .command-stat,.command-stat.is-zero { grid-template-columns: 58px 1fr; }
  .command-stat > span { margin: 11px; }
}
@media(max-width:1100px) {
  .app-shell { grid-template-columns: 78px minmax(0,1fr); }
  .overview-command-grid,.overview-command-grid.is-empty { grid-template-columns: 1fr; }
  .sidebar { top: 90px; }
  .sidebar nav button { justify-content: center; }
  .cover-copy h2 { font-size: clamp(37px,4.5vw,52px); }
}
@media(max-width:720px) {
  .app-shell { display: block; padding: 0 10px 80px; }
  .rental-topbar { min-height: 62px; }
  .sidebar { position: fixed; z-index: 30; top: auto; bottom: 10px; left: 10px; right: 10px; width: auto; height: 60px; padding: 6px; border-radius: 13px; background: #171b20; }
  .sidebar nav { display: flex; padding: 0; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
  .sidebar nav::-webkit-scrollbar { display: none; }
  .sidebar nav button,.sidebar nav button:not(.active) { flex: none; width: auto; min-width: 48px; min-height: 46px; margin: 0; padding: 0 12px; font-size: 0; }
  .sidebar nav button .line-icon { margin: 0; }
  .command-cover { min-height: 280px; background-position: 66% center; background-image: linear-gradient(90deg,rgba(9,11,14,.97),rgba(9,11,14,.76) 60%,rgba(9,11,14,.43)),url("./dota-hero-v2.webp"); }
  .cover-copy { min-height: 280px; padding: 27px 23px 65px; }
  .cover-copy h2 { font-size: clamp(34px,9vw,44px); }
  .cover-copy h3 { font-size: 16px; }
  .cover-rail { left: 23px; right: 23px; bottom: 20px; }
  .cover-rail b { font-size: 8px; }
  .control-strip { min-height: 0; }
  .control-strip > div { padding: 23px; }
  .control-strip h2 { font-size: 24px; }
  .control-strip p:not(.eyebrow) { font-size: 11px; line-height: 1.5; }
  .command-stats { gap: 8px; }
  .command-stat,.command-stat.is-zero { min-height: 91px; grid-template-columns: 42px 1fr; }
  .command-stat > span { width: 30px; height: 30px; margin: 6px; border-radius: 8px; }
  .stat-glyph svg { width: 18px; height: 18px; }
  .command-stat small { font-size: 8px; }
  .command-stat b,.command-stat.is-zero b { font-size: 24px; }
  .command-stat em { font-size: 7px; }
  .finance-card { min-height: 138px; }
  .finance-card b { font-size: clamp(18px,4.8vw,24px); white-space: nowrap; letter-spacing: -.05em; }
  .overview-command-grid,.overview-command-grid.is-empty { display: block; }
  .overview-command-grid .panel { margin-top: 10px; }
  .ops-empty,.pool-empty { display: grid; justify-items: start; gap: 9px; }
  .empty-mark { display: none; }
  .page-lead { min-height: 132px; padding: 21px; }
  .page-lead h2 { font-size: 27px; }
  .page-lead-copy > p:last-child { font-size: 11px; }
  .panel-head { padding: 16px; }
  .panel-body { padding: 16px; }
  :is(.registry-panel,.diagnostic-list) .account-row { grid-template-columns: minmax(0,1fr); gap: 12px; padding: 16px 3px; }
  :is(.registry-panel,.diagnostic-list) .account-row .row-name { min-width: 0; }
  :is(.registry-panel,.diagnostic-list) .account-row .row-name > div:last-child { min-width: 0; }
  :is(.registry-panel,.diagnostic-list) .account-row .actions { grid-column: 1; width: 100%; justify-content: stretch; flex-wrap: nowrap; gap: 7px; }
  :is(.registry-panel,.diagnostic-list) .account-row .actions .btn { flex: 1 1 0; min-width: 0; padding: 9px 5px; font-size: 10px; }
}
