/* Console stage 2 · Domains (/admin/domains). Approved round-5 Domains mockup, rebuilt on the
   Console Home layer (console_reference.css + console_home.css): register, flagship modules
   first, then per-app banks on a 1–10K log scale. HTML carries every value; the WebGL scene and
   the SVG fallback only draw behind it. */
.console-domains .rack--doms { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.console-domains .mod--dsum { padding-bottom: 14px; }
.console-domains .dsum { align-items: flex-end; gap: 18px 30px; }
.console-domains .dsum .ro { min-width: 0; }
/* Home's .ro-note treatment: the register units sat at 4.50–4.65:1 on lit plate (no margin). */
.console-domains .dsum .ro-u { text-transform: uppercase; color: var(--leg); text-shadow: 0 1px 1px #000; }
.console-domains .dsum-l { width: 132px; }
.console-domains .dsum-l .lamp-lens { min-height: 58px; }
/* The provenance strip between the head plate and the rack uses the shared
   .console-home .console-provenance rule in console_home.css (same values). */
/* APP knob: real radios in a fieldset; option labels sit radially as the mockup's knob() draws them. */
.console-domains .console-app { display: flex; align-items: flex-end; gap: 8px 14px; margin: 0 0 0 auto; }
.console-domains .knob--app .knob-body { position: relative; width: var(--ks); height: var(--ks); margin: calc(var(--ks) * .2 + 26px) calc(var(--ks) * .18 + 52px) 4px; }
.console-domains .knob--app .knob-hw { position: absolute; inset: 0; }
.console-domains .knob--app .knob-opt { position: absolute; z-index: 4; min-width: 44px; min-height: 44px; }
.console-domains .knob--app .knob-opt input { width: 100%; height: 100%; }
.console-domains .knob--app legend, .console-domains .console-app .key { position: relative; z-index: 4; }
/* Rendered-pixel AA: option legends sit on lit brushed metal; a dark inlay (as Home's OWNER pill). */
.console-domains .knob--app .knob-opt span { padding: 3px 5px; border-radius: 2px; background: rgba(8, 8, 9, .78); }
.console-domains .ro-w.is-unavailable { font: 400 22px/1 var(--rof); color: var(--leg); }

/* flagship modules: VU + side readouts, two per row */
.console-domains .flags { gap: 16px; }
.console-domains .mod--flag .mod-h a.flag-link { color: var(--leg); text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; }
.console-domains .mod--flag .mod-h a.flag-link:hover { color: #ffd481; }
.console-domains .mod--flag .mod-h { align-items: center; }
.console-domains .fc { grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 20px; }
.console-domains .inst--vu-flag { width: 100%; max-width: 310px; height: 162px; margin: 6px 0 0; }
.console-domains .fc-side { gap: 10px; }
.console-domains .fc-lamps { gap: 10px; }
.console-domains .fc-lamps .lamp-lens { min-height: 58px; margin: 2px 2px 14px; }
.console-domains .mod--flag .mod-f { text-transform: uppercase; }

/* banks: vertical channel strips on wide screens, horizontal rows on phones */
.console-domains .mod--bank .bank { grid-template-columns: 44px minmax(0, 1fr); }
.console-domains .bank-scale { height: 150px; margin-top: 24px; }
.console-domains .chs { flex-wrap: wrap; overflow: visible; row-gap: 14px; }
.console-domains .ch { position: relative; z-index: 4; }
.console-domains .ch .inst--lv { width: 20px; height: 150px; }
.console-domains .ch .inst--lh { display: none; }
.console-home.console-domains .ch > a.ch-tape[href] { position: relative; z-index: 4; display: block; min-height: 44px; color: #161616; }
.console-domains .ch-tape:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.console-domains .ch-own { font-weight: 800; }
/* capture_workflow.css (body.capture-workflow on /admin/domains) sets display on a[href] at
   specificity 0,3,1; these show/hide rules out-rank it on this page only. */
.console-home.console-domains .ch > a.ch-name[href] { display: none; }
.console-domains .ch-v .is-unavailable { color: var(--leg); }
.console-domains .mod--bank:not(.is-expanded) .ch:nth-child(n+23) { display: none; }
.console-domains .mod-go { position: relative; z-index: 4; margin: 4px 0 0; }
.console-domains .mod-go.is-phone-only { display: none; }
.console-domains .mod-go .key { padding: 0 16px; }
.console-domains .bank--tenant .mod-id { color: var(--amber); }
.console-domains .mod--bank .mod-f { text-transform: uppercase; }

/* tenant site registry, filters and the exact-values register stay real HTML above the canvas */
.console-domains section[aria-label="Tenant sites"] { position: relative; z-index: 4; margin: 16px 0 0; display: grid; gap: 8px; }
.console-domains section[aria-label="Tenant sites"] details { background: #18181a; border: 1px solid #625b4e; color: #eee9dd; }
.console-domains section[aria-label="Tenant sites"] summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; padding: 0 14px; font: 700 13px/1.2 var(--legf); letter-spacing: .08em; cursor: pointer; }
.console-domains section[aria-label="Tenant sites"] summary span:last-child { font: 400 12px/1 var(--rof); color: #d2cabc; }
.console-domains section[aria-label="Tenant sites"] table { width: 100%; border-collapse: collapse; font: 400 13px/1.4 var(--rof); color: #eee9dd; }
.console-domains section[aria-label="Tenant sites"] th, .console-domains section[aria-label="Tenant sites"] td { padding: 6px 12px; text-align: left; border-top: 1px solid #3b3a37; }
.console-domains section[aria-label="Tenant sites"] thead th { color: #d2cabc; font: 600 12px/1.2 var(--legf); letter-spacing: .06em; }
.console-domains section[aria-label="Tenant sites"] tr.text-gray-500 { color: #c5bdae; }
.console-domains section[aria-label="Tenant sites"] td a { color: #f6c879; }
.console-domains section[aria-label="Tenant sites"] td span { color: #8ff0b4; border: 1px solid #4c8a64; margin-left: 4px; padding: 0 4px; font-size: 11.5px; text-transform: uppercase; }
.console-domains section[aria-label="Tenant sites"] .overflow-x-auto { overflow-x: auto; }
.console-domains .console-strategy { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 0 12px; }
.console-domains .console-strategy .key { min-height: 44px; padding: 0 12px; font-size: 12px; letter-spacing: .1em; }
.console-domains .console-strategy .key-n { font-size: 13px; }
.console-domains .console-filters input[type=text] { min-height: 44px; width: 100%; background: #292728; color: #f3edde; border: 1px solid #827565; padding: 0 10px; font: 400 14px var(--rof); }
.console-domains .console-filters input[type=text]::placeholder { color: #b6ae9f; }
.console-domains .console-filters .mod-f { border-top: 1px solid rgba(255,255,255,.09); padding: 9px 0 14px; text-transform: none; }
.console-domains .console-register { margin-top: 16px; padding: 0 18px; background: #18181a; border: 1px solid #625b4e; }
.console-domains .console-register .traffic-table-wrap { max-height: none; overflow-x: auto; }
.console-domains .console-register table { font-size: 13px; }
.console-domains .console-register th a { color: #f6c879; }
.console-domains .console-register td, .console-domains .console-register th { vertical-align: top; }
.console-domains .reg-app, .console-domains .reg-sub { display: block; font: 600 11.5px/1.4 var(--legf); letter-spacing: .06em; color: #d2cabc; text-transform: uppercase; }
.console-domains .reg-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; margin: 0 0 6px; }
.console-domains .reg-form select { min-height: 44px; min-width: 0; background: #292728; color: #f3edde; border: 1px solid #827565; }
.console-domains .is-unavailable { cursor: help; }

@media (max-width: 1100px) {
  .console-domains .flags { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .console-domains .dsum { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; }
  .console-domains .dsum .ro-w { font-size: 30px; }
  .console-domains .dsum .ro-w.is-unavailable { font-size: 20px; }
  .console-domains .dsum-l, .console-domains .console-app { grid-column: 1 / -1; margin-left: 0; }
  .console-domains .console-app { justify-content: flex-start; }
  .console-domains .knob--app { --ks: 84px !important; }
  .console-domains .dsum-l { width: 50%; }
  .console-domains .fc { grid-template-columns: 1fr; }
  .console-domains .inst--vu-flag { max-width: none; height: 170px; }
  .console-domains .rack--doms > .mod--bank { grid-column: 1 / -1 !important; }
  .console-domains .mod--bank .bank { display: block; }
  .console-domains .bank-scale { display: none; }
  .console-domains .chs { display: grid; gap: 4px; }
  .console-domains .ch { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "tape value" "lad lad"; width: auto; justify-items: stretch; gap: 2px 10px; }
  .console-domains .ch .inst--lv { display: none; }
  .console-domains .ch .inst--lh { display: block; grid-area: lad; width: 100%; height: 11px; margin: 0 0 8px; }
  .console-domains .ch-v { grid-area: value; align-self: center; font-size: 18px; height: auto; }
  .console-home.console-domains .ch > a.ch-tape[href] { display: none; }
  .console-home.console-domains .ch > a.ch-name[href] { display: flex; }
  .console-domains .ch-name { grid-area: tape; position: relative; z-index: 4; display: flex; align-items: center; min-width: 0; min-height: 44px; color: var(--leg); text-decoration: none; font: 600 14px/1.2 var(--bodyf); overflow-wrap: anywhere; }
  .console-domains .ch-name:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
  .console-domains .mod--bank:not(.is-expanded) .ch:nth-child(n+9) { display: none; }
  .console-domains .mod-go.is-phone-only { display: block; }
  .console-domains .console-register { padding: 0 12px; }
  .console-domains .console-register thead { display: none; }
  .console-domains .console-register tr { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px 8px; padding: 8px 0; border-top: 1px solid #3b3a37; }
  .console-domains .console-register tr > th, .console-domains .console-register tr > td:nth-child(5), .console-domains .console-register tr > td:nth-child(6) { grid-column: 1 / -1; }
  .console-domains .console-register td, .console-domains .console-register th { border: 0; padding: 0; }
  .console-domains section[aria-label="Tenant sites"] summary { padding: 0 10px; }
}
