/* ==========================================================================
   FENRIR — "GLEIPNIR / Binding Console" design system
   One iron instrument: command rail + telemetry strip + seam-joined plates,
   a single ledger-row grammar, and the Binding Ring as the signature.

   Interactive accent (frost): #5FC8E8 — everything touchable.
   Heat accent (ember): #FF6B3D — rationed: fang, fracture, progress hot end,
   staleness dot, live pulse. NEVER chrome, buttons, links or nav.
   Severity ramp (hot→cold quench): #FF4E3A #FF8B4A #F2C14E #5E87B0 #7C8FA3.
   Type: Big Shoulders (display) · IBM Plex Sans (body) · IBM Plex Mono (data).
   ========================================================================== */

:root {
  --bg:#0D1319; --surface:#121A23; --surface-2:#1A2530;
  --border:#26333F; --border-hover:#3A4A5A; --bevel:rgba(233,239,245,.06);
  --text:#E9EFF5; --text-muted:#8CA0B3; --text-dim:#63758A;

  --frost:#5FC8E8; --frost-hi:#8BDCF3; --frost-lo:#1F97C2; --frost-ink:#04202B;
  --frost-glow:rgba(95,200,232,.16);
  --ember:#FF6B3D; --ember-lo:#D8481C; --ember-glow:rgba(255,107,61,.20);

  --sev-critical:#FF4E3A; --sev-high:#FF8B4A; --sev-medium:#F2C14E;
  --sev-low:#5E87B0; --sev-info:#7C8FA3; --ok:#3DC48F;

  --sev-critical-bg:rgba(255,78,58,.14); --sev-high-bg:rgba(255,139,74,.14);
  --sev-medium-bg:rgba(242,193,78,.14); --sev-low-bg:rgba(94,135,176,.16);
  --sev-info-bg:rgba(124,143,163,.14);

  /* legacy aliases kept so existing templates keep resolving */
  --accent:var(--frost); --accent-hover:var(--frost-hi); --accent-glow:var(--frost-glow);
  --cyan:var(--frost); --emerald:var(--ok); --amber:var(--sev-medium);
  --rose:var(--sev-critical); --orange:var(--sev-high);

  --font-display:'Big Shoulders Display','Arial Narrow',system-ui,sans-serif;
  --font-body:'IBM Plex Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --font-mono:'IBM Plex Mono','SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;

  --radius:2px; --radius-lg:2px;
  --rail-w:64px; --strip-h:32px;
  --transition:130ms cubic-bezier(.4,0,.2,1);
}

/* ---------- reset ---------- */
*{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:var(--font-body); font-size:14px; line-height:1.5;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
a{color:var(--frost); text-decoration:none; transition:color var(--transition);}
a:hover,a:focus{color:var(--frost-hi);}
::selection{background:rgba(95,200,232,.28); color:#fff;}
img{max-width:100%;}
p{color:var(--text-muted);}
hr{border:0;border-top:1px solid var(--border);}

h1,h2,h3,h4,h5,h6{font-family:var(--font-display);color:var(--text);font-weight:700;letter-spacing:-.005em;line-height:1.1;}
h1{font-size:28px;text-transform:uppercase;} h2{font-size:24px;} h3{font-size:19px;}
h4{font-size:17px;} h5{font-size:15px;} h6{font-size:13px;}

/* mono facts */
code,pre,.mono,.font-monospace{font-family:var(--font-mono);}
pre,code{background:var(--bg);color:var(--frost-hi);border-radius:var(--radius);font-size:12.5px;}
pre{padding:14px;border:1px solid var(--border);overflow:auto;}
.tnum{font-variant-numeric:tabular-nums;}

/* eyebrow — the console's labeling voice */
.eyebrow{
  font-family:var(--font-mono);font-size:11px;text-transform:uppercase;
  letter-spacing:.14em;color:var(--text-muted);display:inline-flex;align-items:center;gap:.5rem;
}
.eyebrow--ember::before{content:"";width:6px;height:6px;transform:rotate(45deg);
  background:var(--ember);box-shadow:0 0 6px var(--ember-glow);}

/* seam divider */
.seam{height:1px;background:linear-gradient(90deg,var(--border-hover),var(--border) 60%,transparent);margin:1rem 0 1.25rem;position:relative;}
.seam::before{content:"";position:absolute;left:0;top:50%;width:6px;height:6px;transform:translateY(-50%) rotate(45deg);background:var(--ember);box-shadow:0 0 7px var(--ember-glow);}

/* ==========================================================================
   APP SHELL — command rail + status strip + content
   ========================================================================== */
.app{min-height:100vh;}

/* --- command rail --- */
.rail{
  position:fixed;top:0;left:0;width:var(--rail-w);height:100vh;background:var(--surface);
  border-right:1px solid var(--border);display:flex;flex-direction:column;
  align-items:center;padding:14px 0;gap:2px;z-index:40;
}
.rail .fang{width:0;height:0;border-left:11px solid transparent;border-right:11px solid transparent;
  border-top:19px solid var(--ember);filter:drop-shadow(0 0 6px var(--ember-glow));margin-bottom:16px;}
.rail-link{width:44px;height:40px;display:flex;align-items:center;justify-content:center;color:var(--text-muted);
  font-size:20px;border-radius:var(--radius);position:relative;transition:all var(--transition);}
.rail-link:hover{background:var(--surface-2);color:var(--text);}
.rail-link.active{color:var(--frost);}
.rail-link.active::before{content:"";position:absolute;left:-14px;top:8px;bottom:8px;width:3px;background:var(--frost);border-radius:2px;}
.rail-link .rl-badge{position:absolute;top:3px;right:5px;min-width:15px;height:15px;padding:0 3px;border-radius:99px;
  background:var(--sev-critical);color:#fff;font-family:var(--font-mono);font-size:9px;font-weight:600;
  display:flex;align-items:center;justify-content:center;line-height:1;}
.rail-link .rl-pulse{position:absolute;top:4px;right:6px;width:7px;height:7px;border-radius:50%;
  background:var(--ember);box-shadow:0 0 6px var(--ember);animation:pulse 2.4s infinite;}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.rail .spacer{flex:1;}
.rail .rail-user{width:32px;height:32px;border-radius:50%;background:var(--frost);color:var(--frost-ink);
  font-weight:700;font-size:12px;display:flex;align-items:center;justify-content:center;margin-top:6px;text-decoration:none;}

/* --- content column --- */
.appmain{margin-left:var(--rail-w);display:flex;flex-direction:column;min-height:100vh;min-width:0;}
.status-strip{
  height:var(--strip-h);background:var(--bg);border-bottom:1px solid var(--border);
  display:flex;align-items:center;gap:22px;padding:0 18px;position:sticky;top:0;z-index:35;
  font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);
}
.status-strip .ss-ctx{color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.status-strip .ss-tel{display:flex;gap:18px;margin:0 auto;white-space:nowrap;}
.status-strip .ss-right{display:flex;gap:14px;align-items:center;margin-left:auto;}
.status-strip .dot{color:var(--ok);} .status-strip .dot.warn{color:var(--sev-high);} .status-strip .dot.down{color:var(--sev-critical);}
.status-strip.scanning::after{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:var(--scan-pct,40%);
  background:linear-gradient(90deg,var(--frost),var(--ember));transition:width .4s ease;}
.status-strip a{color:var(--text-muted);} .status-strip a:hover{color:var(--text);}

.appcontent{flex:1;min-width:0;}
.page-pad{padding:20px 24px;}
footer.appfoot{border-top:1px solid var(--border);padding:12px 24px;color:var(--text-dim);font-size:12px;
  font-family:var(--font-mono);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;}
footer.appfoot a{color:var(--text-dim);} footer.appfoot a:hover{color:var(--text-muted);}

/* ==========================================================================
   PLATES & SEAMS — the only surface primitive (replaces .card)
   ========================================================================== */
.plate-grid{display:grid;gap:1px;background:var(--border);}
.plate{background:var(--surface);padding:22px 24px;min-width:0;}
.plate.raised{background:var(--surface-2);box-shadow:inset 0 1px 0 var(--bevel);}
.plate-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;}
.plate-head .eyebrow{margin:0;}

/* page header block */
.page-head{padding:18px 24px 0;}
.page-head .title{margin:.35rem 0 0;}
.page-head + .seam,.page-head .seam{margin-top:.9rem;}

/* ==========================================================================
   BOOTSTRAP CARD -> PLATE (so un-ported pages inherit the look)
   ========================================================================== */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);
  box-shadow:none;margin-bottom:20px;}
.card + .card{margin-top:0;}
.card-header{background:var(--surface);border-bottom:1px solid var(--border);padding:14px 20px;color:var(--text);
  font-weight:600;border-radius:0;}
.card-header h5,.card-header h6{color:var(--text);margin:0;font-family:var(--font-display);letter-spacing:0;}
.card-body{padding:20px;color:var(--text);}
.card-footer{background:var(--surface);border-top:1px solid var(--border);padding:12px 20px;}
.card-title{color:var(--text);font-weight:600;}

/* ==========================================================================
   LEDGER — the one list grammar
   ========================================================================== */
.ledger{display:flex;flex-direction:column;}
.ledger-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 24px 10px;}
.lrow{
  display:flex;align-items:center;gap:14px;min-height:56px;padding:6px 18px 6px 0;
  background:var(--surface);border-top:1px solid var(--border);cursor:pointer;text-decoration:none;color:var(--text);
  transition:background var(--transition);
}
.lrow:last-child{border-bottom:1px solid var(--border);}
.lrow:hover{background:var(--surface-2);}
.lrow .lr-rail{align-self:stretch;width:4px;border-radius:0 2px 2px 0;background:var(--border);transition:width var(--transition);}
.lrow:hover .lr-rail{width:6px;}
.lrow .lr-rail.sev-critical{background:var(--sev-critical);} .lrow .lr-rail.sev-high{background:var(--sev-high);}
.lrow .lr-rail.sev-medium{background:var(--sev-medium);} .lrow .lr-rail.sev-low{background:var(--sev-low);}
.lrow .lr-rail.sev-info{background:var(--sev-info);}
.lrow .lr-host,.lrow .lr-mono{font-family:var(--font-mono);font-size:13px;color:var(--text);}
.lrow .lr-name{font-size:14px;font-weight:500;}
.lrow .lr-dim{font-family:var(--font-mono);font-size:11px;color:var(--text-muted);}
.lrow .lr-grade{font-family:var(--font-display);font-weight:700;font-size:22px;}
.lrow .grow{flex:1;min-width:0;}
.lrow .lr-glyph{flex-shrink:0;width:26px;display:flex;justify-content:center;}

/* ==========================================================================
   SEVERITY SYSTEM — single source of truth
   ========================================================================== */
.sev-chip{display:inline-flex;align-items:center;gap:.4em;padding:.22em .6em;font-family:var(--font-mono);
  font-size:.68rem;font-weight:500;letter-spacing:.05em;text-transform:uppercase;border-radius:var(--radius);
  border:1px solid transparent;white-space:nowrap;line-height:1.25;}
.sev-chip::before{content:"";width:.5em;height:.5em;border-radius:50%;background:currentColor;box-shadow:0 0 5px currentColor;}
.sev-chip.sev-critical{color:var(--sev-critical);background:var(--sev-critical-bg);border-color:rgba(255,78,58,.3);}
.sev-chip.sev-high{color:var(--sev-high);background:var(--sev-high-bg);border-color:rgba(255,139,74,.3);}
.sev-chip.sev-medium{color:var(--sev-medium);background:var(--sev-medium-bg);border-color:rgba(242,193,78,.3);}
.sev-chip.sev-low{color:var(--sev-low);background:var(--sev-low-bg);border-color:rgba(94,135,176,.32);}
.sev-chip.sev-info{color:var(--sev-info);background:var(--sev-info-bg);border-color:rgba(124,143,163,.3);}
.sev-text-critical{color:var(--sev-critical)!important;} .sev-text-high{color:var(--sev-high)!important;}
.sev-text-medium{color:var(--sev-medium)!important;} .sev-text-low{color:var(--sev-low)!important;}
.sev-text-info{color:var(--sev-info)!important;}
.sev-rail{border-left:3px solid var(--border);}
.sev-rail.sev-critical{border-left-color:var(--sev-critical);} .sev-rail.sev-high{border-left-color:var(--sev-high);}
.sev-rail.sev-medium{border-left-color:var(--sev-medium);} .sev-rail.sev-low{border-left-color:var(--sev-low);}
.sev-rail.sev-info{border-left-color:var(--sev-info);}

/* tally cell (big numerals) */
.tally-grid{display:grid;gap:1px;background:var(--border);grid-template-columns:repeat(5,1fr) 2fr;}
.tally-cell{background:var(--surface);padding:18px 22px;}
.tally-cell .n{font-family:var(--font-display);font-weight:700;font-size:56px;line-height:.85;letter-spacing:-.01em;font-variant-numeric:tabular-nums;}
.tally-cell .n.zero{color:var(--text-muted);}
.tally-cell .lbl{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.12em;margin-top:8px;}

/* stacked severity bar */
.sevbar{display:flex;height:10px;border-radius:var(--radius);overflow:hidden;}
.sevbar>span{display:block;}
.sevbar .b-critical{background:var(--sev-critical);} .sevbar .b-high{background:var(--sev-high);}
.sevbar .b-medium{background:var(--sev-medium);} .sevbar .b-low{background:var(--sev-low);} .sevbar .b-info{background:var(--sev-info);}

/* ==========================================================================
   BUTTONS
   ========================================================================== */
.btn{font-family:var(--font-body);font-size:13px;font-weight:600;padding:.5rem .85rem;border-radius:var(--radius);
  border:1px solid transparent;letter-spacing:.005em;transition:all var(--transition);display:inline-flex;align-items:center;gap:.4rem;}
.btn:focus-visible{outline:2px solid var(--frost);outline-offset:2px;box-shadow:none;}
.btn-lg{padding:.7rem 1.2rem;font-size:15px;}
.btn-sm{padding:.32rem .6rem;font-size:12px;}
.btn-primary{background:var(--frost);border-color:var(--frost);color:var(--frost-ink);}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active{background:var(--frost-hi);border-color:var(--frost-hi);color:var(--frost-ink);}
.btn-ember{background:linear-gradient(135deg,var(--ember),var(--ember-lo));border-color:var(--ember-lo);color:#fff;}
.btn-ember:hover,.btn-ember:focus{color:#fff;box-shadow:0 0 0 3px var(--ember-glow),0 6px 16px rgba(255,107,61,.3);transform:translateY(-1px);}
.btn-secondary,.btn-outline-secondary{background:var(--surface-2);border-color:var(--border);color:var(--text-muted);}
.btn-secondary:hover,.btn-outline-secondary:hover,.btn-secondary:focus,.btn-outline-secondary:focus{background:var(--surface-2);border-color:var(--border-hover);color:var(--text);}
.btn-outline-primary{background:transparent;border-color:rgba(95,200,232,.4);color:var(--frost);}
.btn-outline-primary:hover,.btn-outline-primary:focus{background:var(--frost);border-color:var(--frost);color:var(--frost-ink);}
.btn-success{background:var(--ok);border-color:var(--ok);color:var(--frost-ink);}
.btn-success:hover,.btn-success:focus{background:#4fd6a1;border-color:#4fd6a1;color:var(--frost-ink);}
.btn-danger{background:transparent;border-color:rgba(255,78,58,.5);color:var(--sev-critical);}
.btn-danger:hover,.btn-danger:focus{background:var(--sev-critical);border-color:var(--sev-critical);color:#fff;}
.btn-warning{background:var(--sev-medium);border-color:var(--sev-medium);color:#241a00;}
.btn-info{background:var(--frost);border-color:var(--frost);color:var(--frost-ink);}
.btn-outline-light{background:transparent;border-color:rgba(233,239,245,.25);color:var(--text);}
.btn-outline-light:hover,.btn-outline-light:focus{background:rgba(233,239,245,.08);border-color:rgba(233,239,245,.45);color:#fff;}
.btn-outline-danger{background:transparent;border-color:rgba(255,78,58,.4);color:var(--sev-critical);}
.btn-outline-danger:hover{background:var(--sev-critical);border-color:var(--sev-critical);color:#fff;}
.btn-outline-success{background:transparent;border-color:rgba(61,196,143,.4);color:var(--ok);}
.btn-outline-success:hover{background:var(--ok);border-color:var(--ok);color:var(--frost-ink);}
.btn-link{color:var(--frost);}
.btn-group .btn{border-radius:var(--radius);}

/* ==========================================================================
   FORMS
   ========================================================================== */
.form-control,.form-select{background:var(--surface);color:var(--text);border:1px solid var(--border);
  border-radius:var(--radius);padding:.55rem .75rem;font-size:13px;transition:border-color var(--transition),box-shadow var(--transition);}
.form-control:focus,.form-select:focus{background:var(--surface-2);color:var(--text);border-color:var(--frost);box-shadow:0 0 0 3px var(--frost-glow);}
.form-control::placeholder{color:var(--text-dim);}
.form-control:disabled,.form-select:disabled{background:var(--bg);opacity:.6;}
.form-control.mono,input.mono{font-family:var(--font-mono);}
label.form-label{color:var(--text-muted);font-weight:500;font-size:11px;margin-bottom:.35rem;text-transform:uppercase;letter-spacing:.1em;font-family:var(--font-mono);}
.form-text{color:var(--text-dim);font-size:12px;}
.form-check-input{background:var(--surface);border-color:var(--border);}
.form-check-input:checked{background:var(--frost);border-color:var(--frost);}
.form-check-label{color:var(--text);}
.invalid-feedback{color:var(--sev-critical);font-size:12px;}
.input-group-text{background:var(--surface-2);border-color:var(--border);color:var(--text-muted);font-family:var(--font-mono);}

/* ==========================================================================
   TABLES (generic, ledger-flavored)
   ========================================================================== */
.table{color:var(--text);border-color:var(--border);font-size:13px;}
.table th,.table td{border-color:var(--border);padding:.7rem 1rem;vertical-align:middle;}
.table thead th{background:var(--surface);border-bottom:1px solid var(--border);color:var(--text-muted);
  font-family:var(--font-mono);font-weight:500;font-size:11px;text-transform:uppercase;letter-spacing:.1em;}
.table-hover tbody tr{transition:background var(--transition);}
.table-hover tbody tr:hover{background:var(--surface-2);}
.table-hover tbody tr:hover td{color:var(--text)!important;}
.table td .text-muted,.table small{font-family:var(--font-mono);}

/* ==========================================================================
   BADGES (map Bootstrap to sev/tokens)
   ========================================================================== */
.badge{padding:.28em .6em;font-family:var(--font-mono);font-size:.68rem;font-weight:500;letter-spacing:.04em;
  border-radius:var(--radius);text-transform:uppercase;}
.badge.bg-primary{background:var(--frost-glow)!important;color:var(--frost-hi)!important;}
.badge.bg-success{background:rgba(61,196,143,.16)!important;color:#7fe0bd!important;}
.badge.bg-info{background:var(--sev-info-bg)!important;color:var(--frost-hi)!important;}
.badge.bg-warning{background:var(--sev-medium-bg)!important;color:var(--sev-medium)!important;}
.badge.bg-danger{background:var(--sev-critical-bg)!important;color:var(--sev-critical)!important;}
.badge.bg-secondary{background:rgba(124,143,163,.14)!important;color:var(--text-muted)!important;}
.badge.bg-dark{background:var(--surface-2)!important;color:var(--text-muted)!important;}
.badge-plan-trial{background:var(--sev-medium-bg)!important;color:var(--sev-medium)!important;}
.badge-plan-starter{background:var(--sev-info-bg)!important;color:var(--frost-hi)!important;}
.badge-plan-pro{background:var(--frost-glow)!important;color:var(--frost-hi)!important;}
.badge-plan-business{background:rgba(61,196,143,.16)!important;color:#7fe0bd!important;}
.badge-plan-admin{background:var(--ember-glow)!important;color:var(--ember)!important;}
.cve-badge,.chip-mono{font-family:var(--font-mono);font-size:11px;padding:.15em .5em;border-radius:var(--radius);
  border:1px solid var(--border);color:var(--frost);background:var(--bg);margin-right:.25rem;display:inline-block;}

/* ==========================================================================
   PROGRESS — frost -> ember (the hunt heating up)
   ========================================================================== */
.progress{background:var(--surface-2);height:6px;border-radius:var(--radius);overflow:hidden;}
.progress-bar{background:linear-gradient(90deg,var(--frost),var(--ember));transition:width .4s ease;}

/* ==========================================================================
   ALERTS / FLASH
   ========================================================================== */
.alert{border-radius:var(--radius);padding:.7rem 1rem;font-size:13px;border:1px solid;}
.alert .btn-close{filter:invert(1) grayscale(100%) brightness(160%);}
.alert-success,.bg-success{background:rgba(61,196,143,.12)!important;color:#7fe0bd!important;border-color:rgba(61,196,143,.28)!important;}
.alert-info,.bg-info{background:var(--sev-info-bg)!important;color:var(--frost-hi)!important;border-color:rgba(95,200,232,.25)!important;}
.alert-warning,.bg-warning{background:var(--sev-medium-bg)!important;color:var(--sev-medium)!important;border-color:rgba(242,193,78,.28)!important;}
.alert-danger,.bg-danger{background:var(--sev-critical-bg)!important;color:#ffb3aa!important;border-color:rgba(255,78,58,.3)!important;}

/* ==========================================================================
   DROPDOWN / MODAL / ACCORDION / TABS / PAGINATION / TOOLTIP
   ========================================================================== */
.dropdown-menu{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  box-shadow:0 10px 28px rgba(0,0,0,.5);padding:.35rem;margin-top:.3rem;}
.dropdown-item{color:var(--text-muted);font-size:13px;padding:.5rem .75rem;border-radius:var(--radius);}
.dropdown-item:hover,.dropdown-item:focus{color:var(--text);background:var(--surface-2);}
.dropdown-item i{opacity:.7;} .dropdown-divider{border-top-color:var(--border);}

.modal-content{background:var(--surface);border:1px solid var(--border);color:var(--text);border-radius:var(--radius);box-shadow:0 24px 60px rgba(0,0,0,.6);}
.modal-header{background:var(--surface);border-bottom:1px solid var(--border);padding:1rem 1.25rem;border-radius:0;}
.modal-header .btn-close{filter:invert(1) grayscale(100%) brightness(200%);opacity:.6;}
.modal-header .btn-close:hover{opacity:1;}
.modal-title{color:var(--text);font-family:var(--font-display);}
.modal-body{padding:1.25rem;} .modal-footer{border-top:1px solid var(--border);padding:.85rem 1.25rem;}

.accordion-button{background:var(--surface);color:var(--text);border:none;font-weight:500;}
.accordion-button:not(.collapsed){background:var(--surface-2);color:var(--frost);box-shadow:none;}
.accordion-button:focus{box-shadow:0 0 0 3px var(--frost-glow);}
.accordion-button::after{filter:invert(1);}
.accordion-body{background:var(--surface);color:var(--text);}
.accordion-item{border-color:var(--border);background:var(--surface);}

.nav-tabs{border-bottom-color:var(--border);}
.nav-tabs .nav-link{border:1px solid transparent;border-radius:var(--radius) var(--radius) 0 0;color:var(--text-muted);
  font-family:var(--font-mono);font-size:12px;text-transform:uppercase;letter-spacing:.08em;padding:.5rem 1rem;}
.nav-tabs .nav-link:hover{border-color:transparent;color:var(--text);background:var(--surface-2);}
.nav-tabs .nav-link.active{background:var(--surface);border-color:var(--border) var(--border) var(--surface);color:var(--frost);}

.page-link{background:var(--surface);border-color:var(--border);color:var(--text-muted);}
.page-link:hover{background:var(--surface-2);border-color:var(--border-hover);color:var(--text);}
.page-item.active .page-link{background:var(--frost);border-color:var(--frost);color:var(--frost-ink);}

.breadcrumb{background:transparent;padding:0;font-family:var(--font-mono);font-size:12px;}
.breadcrumb-item a{color:var(--text-muted);} .breadcrumb-item.active{color:var(--text-dim);}
.breadcrumb-item+.breadcrumb-item::before{color:var(--text-dim);content:"/";}

.tooltip-inner{background:var(--surface-2);border:1px solid var(--border);color:var(--text);font-family:var(--font-mono);font-size:12px;border-radius:var(--radius);box-shadow:inset 0 1px 0 var(--bevel);}

.list-group-item{background:var(--surface);border-color:var(--border);color:var(--text);}
.list-group-item.bg-transparent{background:transparent!important;border-color:var(--border)!important;}

/* ==========================================================================
   SCROLLBAR / FOCUS / UTIL
   ========================================================================== */
::-webkit-scrollbar{width:9px;height:9px;} ::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--border-hover);border-radius:99px;} ::-webkit-scrollbar-thumb:hover{background:var(--text-dim);}
*:focus-visible{outline:2px solid var(--frost);outline-offset:2px;}
.text-muted{color:var(--text-muted)!important;} .text-dim{color:var(--text-dim)!important;}
.text-accent,.text-frost{color:var(--frost)!important;} .text-ember{color:var(--ember)!important;}
.mono-sm{font-family:var(--font-mono);font-size:11px;color:var(--text-muted);}
.divider-seam{height:1px;background:var(--border);}

/* ==========================================================================
   BINDING RING container + posture line
   ========================================================================== */
.binding-wrap{display:flex;flex-direction:column;align-items:center;}
.binding-wrap svg{display:block;max-width:100%;height:auto;}
.posture{font-size:13px;color:var(--text-muted);margin-top:8px;text-align:center;}
.posture b{color:var(--text);font-weight:600;}
.posture .p-brk{color:var(--sev-critical);} .posture .p-str{color:var(--sev-medium);} .posture .p-ok{color:var(--ok);}
.break-label{font-family:var(--font-mono);font-size:11px;letter-spacing:.05em;color:var(--ember);text-align:center;margin-top:2px;}

/* sparkline */
.sparkline svg{width:100%;height:52px;display:block;}

/* filter pills */
.filter-bar{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;}
.filter-pills{display:flex;gap:.375rem;flex-wrap:wrap;}
.filter-pill{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em;
  padding:.35rem .7rem;color:var(--text-muted);background:var(--surface);border:1px solid var(--border);
  border-radius:99px;cursor:pointer;text-decoration:none;transition:all var(--transition);}
.filter-pill:hover{color:var(--text);border-color:var(--border-hover);background:var(--surface-2);}
.filter-pill.active{color:var(--frost-ink);background:var(--frost);border-color:var(--frost);}
.lr-actions{display:flex;gap:6px;align-items:center;}
.lr-icon{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);
  border-radius:var(--radius);color:var(--text-muted);background:transparent;transition:all var(--transition);text-decoration:none;}
.lr-icon:hover{color:var(--text);border-color:var(--border-hover);background:var(--surface-2);}
.lr-icon.danger:hover{color:var(--sev-critical);border-color:rgba(255,78,58,.4);}

/* password strength */
.password-strength{height:4px;background:var(--surface-2);border-radius:99px;overflow:hidden;margin-top:.5rem;}
.password-strength-bar{height:100%;border-radius:99px;transition:width .3s,background-color .3s;width:0;}
.password-strength-bar.weak{width:25%;background:var(--sev-critical);}
.password-strength-bar.fair{width:50%;background:var(--sev-medium);}
.password-strength-bar.strong{width:75%;background:var(--frost);}
.password-strength-bar.excellent{width:100%;background:var(--ok);}

/* recon rows (dossier) */
.recon{display:flex;flex-direction:column;}
.recon .r{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-top:1px solid var(--border);font-family:var(--font-mono);font-size:12px;}
.recon .r .k{color:var(--text-muted);} .recon .r .v{color:var(--text);}
.recon .ok{color:var(--ok);} .recon .warn{color:var(--sev-high);}

/* dossier + work split */
.split{display:grid;grid-template-columns:340px 1fr;}
.dossier{background:var(--surface);border-right:1px solid var(--border);padding:20px;}
.worksurface{min-width:0;}

/* empty state */
.empty-state{text-align:center;padding:3rem 1.5rem;max-width:440px;margin:0 auto;}
.empty-state img{max-width:220px;width:100%;height:auto;border-radius:var(--radius);margin-bottom:1.25rem;opacity:.85;}
.empty-state h5{color:var(--text);font-weight:600;margin-bottom:.5rem;}
.empty-state p{color:var(--text-muted);margin-bottom:1.25rem;}

/* ==========================================================================
   AUTH (unauthenticated — the one brand moment; no rail)
   ========================================================================== */
.auth-page{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr;background:var(--bg);}
.auth-brand{background:var(--bg);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:18px;padding:3rem;position:relative;border-right:1px solid var(--border);}
.auth-brand .wm{font-family:var(--font-display);font-weight:700;font-size:2rem;letter-spacing:.06em;text-transform:uppercase;display:flex;align-items:center;gap:.5rem;}
.auth-brand .wm .fang{width:0;height:0;border-left:12px solid transparent;border-right:12px solid transparent;border-top:20px solid var(--ember);filter:drop-shadow(0 0 6px var(--ember-glow));}
.auth-brand .tag{color:var(--text-muted);font-size:15px;text-align:center;max-width:34ch;}
.auth-side{display:flex;align-items:center;justify-content:center;padding:2rem;background:var(--surface);}
.auth-card{width:100%;max-width:380px;}
.auth-card .auth-eyebrow{margin-bottom:.4rem;}
.auth-card .auth-heading{font-family:var(--font-display);font-size:26px;text-transform:uppercase;margin:0 0 1.25rem;}
.auth-divider{display:flex;align-items:center;gap:1rem;margin:1.1rem 0;color:var(--text-dim);font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.1em;}
.auth-divider::before,.auth-divider::after{content:"";flex:1;height:1px;background:var(--border);}
.btn-oidc{background:var(--surface-2);border:1px solid var(--border);color:var(--text);font-weight:600;padding:.6rem 1rem;border-radius:var(--radius);width:100%;}
.btn-oidc:hover,.btn-oidc:focus{border-color:var(--frost);color:#fff;box-shadow:0 0 0 3px var(--frost-glow);}
.badge-auth-keycloak{background:var(--frost-glow)!important;color:var(--frost-hi)!important;}
@media (max-width:820px){.auth-page{grid-template-columns:1fr;} .auth-brand{display:none;}}

/* ==========================================================================
   NOTIFICATIONS dropdown (kept from before, re-skinned)
   ========================================================================== */
.notification-badge{position:absolute;top:2px;right:2px;background:var(--sev-critical);color:#fff;font-family:var(--font-mono);
  font-size:.62rem;font-weight:600;min-width:16px;height:16px;border-radius:99px;display:flex;align-items:center;justify-content:center;padding:0 4px;line-height:1;}
.notification-dropdown{width:360px;max-width:calc(100vw - 1rem);max-height:460px;overflow:hidden;padding:0;}
.notification-dropdown.show{display:flex;flex-direction:column;}
.notification-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;border-bottom:1px solid var(--border);}
.notification-header h6{margin:0;font-size:13px;color:var(--text);font-family:var(--font-display);}
.notification-list{overflow-y:auto;max-height:340px;}
.notification-item{display:flex;gap:.75rem;padding:.7rem 1rem;border-bottom:1px solid var(--border);cursor:pointer;}
.notification-item:hover{background:var(--surface-2);}
.notification-item.unread{background:rgba(95,200,232,.06);border-left:3px solid var(--frost);}
.notification-item .notification-icon{flex-shrink:0;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--surface-2);color:var(--frost);}
.notification-item .notification-title{font-size:13px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.notification-item .notification-text{font-size:12px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.notification-item .notification-time{font-family:var(--font-mono);font-size:10px;color:var(--text-dim);margin-top:2px;}
.notification-footer{padding:.6rem 1rem;border-top:1px solid var(--border);text-align:center;}

/* pricing (billing) as plates */
.pricing-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.75rem 1.5rem;position:relative;text-align:left;}
.pricing-card.highlighted{border-color:var(--frost);box-shadow:0 0 0 1px var(--frost);}
.pricing-badge{position:absolute;top:-10px;left:1.5rem;background:var(--frost);color:var(--frost-ink);font-family:var(--font-mono);font-size:11px;font-weight:600;padding:.2rem .7rem;border-radius:99px;text-transform:uppercase;}
.pricing-name{font-family:var(--font-display);font-size:20px;text-transform:uppercase;color:var(--text);}
.pricing-desc{font-size:13px;color:var(--text-muted);margin-bottom:1rem;}
.pricing-price{font-family:var(--font-display);font-size:44px;font-weight:700;color:var(--text);line-height:1;}
.pricing-period{font-family:var(--font-mono);font-size:13px;color:var(--text-muted);}
.pricing-card ul{list-style:none;padding:0;margin:1.25rem 0;}
.pricing-card ul li{padding:.35rem 0;font-size:13px;color:var(--text-muted);display:flex;align-items:center;gap:.5rem;}
.pricing-card ul li i{color:var(--ok);}

/* health summary (dashboard, legacy) */
.health-summary{border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem 1.5rem;margin-bottom:1.25rem;background:var(--surface);}
.health-summary.healthy{border-left:3px solid var(--ok);} .health-summary.warning{border-left:3px solid var(--sev-medium);} .health-summary.danger{border-left:3px solid var(--sev-critical);}
.health-summary .health-icon{font-size:1.5rem;} .health-summary.healthy .health-icon{color:var(--ok);} .health-summary.warning .health-icon{color:var(--sev-medium);} .health-summary.danger .health-icon{color:var(--sev-critical);}

/* quick-action / feature cards (landing + dashboard, legacy) */
.quick-action-card,.feature-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem;text-decoration:none;color:var(--text);display:block;transition:all var(--transition);}
.quick-action-card:hover,.feature-card:hover{border-color:var(--border-hover);background:var(--surface-2);color:var(--text);}
.quick-action-card .action-icon,.feature-card .feature-icon-box{color:var(--frost);font-size:1.4rem;margin-bottom:.5rem;}
.feature-card .feature-icon-box{width:44px;height:44px;border-radius:var(--radius);background:var(--frost-glow);display:flex;align-items:center;justify-content:center;}
.action-label,.feature-card h5{font-weight:600;} .action-desc,.feature-card p{font-size:13px;color:var(--text-muted);}

/* scan mode radio cards */
.scan-mode-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.75rem;}
.scan-mode-card{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.1rem;cursor:pointer;text-align:center;transition:all var(--transition);}
.scan-mode-card:hover{border-color:var(--border-hover);background:var(--surface-2);}
.scan-mode-card:has(input:checked){border-color:var(--frost);background:var(--frost-glow);}
.scan-mode-card input{position:absolute;opacity:0;pointer-events:none;}
.scan-mode-card .card-icon{font-size:1.4rem;color:var(--frost);margin-bottom:.4rem;}
.scan-mode-card .card-label{font-weight:600;display:block;} .scan-mode-card .card-desc{font-size:12px;color:var(--text-muted);}

/* landing hero (unauth) */
.hero-section{padding:5rem 1.5rem 3rem;text-align:center;}
.hero-section h1{font-size:3rem;line-height:1.05;background:linear-gradient(120deg,var(--text) 0%,var(--frost) 72%,var(--frost-hi) 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:1rem;}
.hero-section .hero-subtitle{font-size:1.15rem;color:var(--text-muted);max-width:620px;margin:0 auto 2rem;}
.hero-section .hero-actions{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap;}
.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1px;background:var(--border);border:1px solid var(--border);}
.feature-grid .feature-card{border:none;border-radius:0;margin:0;}
.how-it-works-step{text-align:center;padding:1rem;}
.step-number{width:44px;height:44px;border-radius:50%;background:var(--frost-glow);color:var(--frost);border:1px solid var(--frost);display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;font-size:1.1rem;margin-bottom:1rem;}

/* error pages */
.error-page{min-height:60vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:2rem 1rem;}
.error-page .error-code{font-family:var(--font-display);font-size:4rem;font-weight:700;color:var(--frost);line-height:1;}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:900px){
  .split{grid-template-columns:1fr;}
  .dossier{border-right:none;border-bottom:1px solid var(--border);}
  .tally-grid{grid-template-columns:repeat(5,1fr);} .tally-grid .sparkline-cell{display:none;}
}
@media (max-width:768px){
  :root{--rail-w:0px;}
  .app{grid-template-columns:1fr;}
  .rail{position:fixed;bottom:0;left:0;top:auto;flex-direction:row;height:56px;width:100%;
    border-right:none;border-top:1px solid var(--border);justify-content:space-around;padding:0;gap:0;}
  .rail .fang,.rail .spacer{display:none;}
  .rail-link.active::before{left:8px;right:8px;top:auto;bottom:-0;width:auto;height:3px;}
  .appmain{padding-bottom:56px;}
  .status-strip .ss-tel{display:none;}
  .tally-grid{grid-template-columns:repeat(3,1fr);} .tally-cell .n{font-size:40px;}
  .hero-section h1{font-size:2rem;}
  .page-pad{padding:16px;}
}

/* reduced motion */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;}
}