/* ============================================================
   BLACKWELL OS — DESIGN SYSTEM
   Institutional instrumentation. Dark only. No decoration.
   ============================================================ */

:root{
  /* surfaces */
  --bg:        #08090b;
  --surface:   #0d0f12;
  --surface-2: #12151a;
  --surface-3: #161a20;
  --border:    #1d2128;
  --border-2:  #262b33;

  /* text */
  --text:       #e8eaed;
  --text-dim:   #8b8f96;
  --text-faint: #565a61;

  /* semantic state */
  --green:      #2ecc71;
  --green-dim:  rgba(46,204,113,0.12);
  --green-bd:   rgba(46,204,113,0.28);
  --yellow:     #e8b339;
  --yellow-dim: rgba(232,179,57,0.12);
  --yellow-bd:  rgba(232,179,57,0.28);
  --red:        #e5484d;
  --red-dim:    rgba(229,72,77,0.12);
  --red-bd:     rgba(229,72,77,0.28);
  --blue:       #3b9eff;
  --blue-dim:   rgba(59,158,255,0.12);
  --blue-bd:    rgba(59,158,255,0.28);
  --idle:       #3a3f47;
  --idle-dim:   rgba(58,63,71,0.18);

  /* layout */
  --sidebar-w: 216px;
  --topbar-h:  44px;
  --radius:    3px;
  --gap:       1px;

  --mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Consolas, monospace;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html,body{background:var(--bg);}
body{
  color:var(--text);
  font-family:var(--mono);
  font-size:12.5px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
::selection{background:rgba(46,204,113,0.25);}
::-webkit-scrollbar{width:8px;height:8px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--border-2);}
::-webkit-scrollbar-thumb:hover{background:var(--text-faint);}

a{color:inherit;text-decoration:none;}
button{font-family:var(--mono);}

/* ============================================================
   SHELL — sidebar + topbar + content
   ============================================================ */
.shell{
  display:grid;
  grid-template-columns: var(--sidebar-w) 1fr;
  grid-template-rows: var(--topbar-h) 1fr;
  height:100vh;
}

.topbar{
  grid-column: 1 / -1;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 16px;
  background:var(--surface);
  border-bottom:1px solid var(--border);
  z-index:20;
}
.tb-left{display:flex;align-items:center;gap:12px;}
.tb-brand{font-weight:700;font-size:12.5px;letter-spacing:0.04em;color:var(--text);}
.tb-brand .accent{color:var(--green);}
.tb-sep{width:1px;height:14px;background:var(--border-2);}
.tb-crumb{font-size:11px;color:var(--text-faint);}
.tb-crumb .cur{color:var(--text-dim);}
.tb-right{display:flex;align-items:center;gap:16px;}
.tb-pulse{display:flex;align-items:center;gap:6px;font-size:10.5px;color:var(--text-faint);}
.tb-dot{width:5px;height:5px;border-radius:50%;background:var(--green);animation:breathe 2.4s ease-in-out infinite;}
.tb-clock{font-size:11px;color:var(--text-dim);min-width:108px;text-align:right;}
.tb-env{
  font-size:9.5px;letter-spacing:0.08em;text-transform:uppercase;
  padding:2px 7px;border-radius:var(--radius);
  color:var(--yellow);background:var(--yellow-dim);border:1px solid var(--yellow-bd);
}

@keyframes breathe{0%,100%{opacity:1;}50%{opacity:0.25;}}

.sidebar{
  background:var(--surface);
  border-right:1px solid var(--border);
  display:flex;flex-direction:column;
  overflow-y:auto;
}
.nav-group{padding:14px 8px 6px;}
.nav-group-label{
  font-size:9.5px;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--text-faint);padding:4px 10px 6px;
}
.nav-item{
  display:flex;align-items:center;gap:9px;
  padding:7px 10px;margin:1px 0;
  border-radius:var(--radius);
  color:var(--text-dim);font-size:12px;
  cursor:pointer;
  transition:background 0.12s, color 0.12s;
}
.nav-item:hover{background:var(--surface-2);color:var(--text);}
.nav-item.active{background:var(--surface-2);color:var(--text);}
.nav-item.disabled{color:var(--text-faint);cursor:default;opacity:0.55;}
.nav-item.disabled:hover{background:none;color:var(--text-faint);}
.nav-icon{width:14px;text-align:center;font-size:12px;flex-shrink:0;opacity:0.85;}
.nav-label{flex:1;}
.nav-badge{
  font-size:9px;padding:1px 5px;border-radius:2px;
  background:var(--idle-dim);color:var(--text-faint);
}
.nav-badge.red{background:var(--red-dim);color:var(--red);}
.nav-badge.yellow{background:var(--yellow-dim);color:var(--yellow);}
.sidebar-foot{
  margin-top:auto;padding:12px 14px;border-top:1px solid var(--border);
  font-size:10px;color:var(--text-faint);
}

.content{
  overflow-y:auto;
  background:var(--bg);
}
.page{display:none;padding:18px 20px 60px;}
.page.active{display:block;}

.page-head{
  display:flex;align-items:baseline;justify-content:space-between;
  margin-bottom:16px;flex-wrap:wrap;gap:8px;
}
.page-title{font-size:14px;font-weight:600;color:var(--text);letter-spacing:0.01em;}
.page-sub{font-size:11px;color:var(--text-faint);}

.section{margin-bottom:28px;}
.section-head{
  display:flex;align-items:baseline;justify-content:space-between;
  margin-bottom:10px;
}
.section-title{
  font-size:10.5px;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--text-faint);
}
.section-meta{font-size:10.5px;color:var(--text-faint);}

/* ============================================================
   GRID
   ============================================================ */
.grid{
  display:grid;
  gap:var(--gap);
  background:var(--border);
  border:1px solid var(--border);
}
.grid > *{background:var(--surface);}
.g-1{grid-template-columns:1fr;}
.g-2{grid-template-columns:repeat(2,1fr);}
.g-3{grid-template-columns:repeat(3,1fr);}
.g-4{grid-template-columns:repeat(4,1fr);}
.g-5{grid-template-columns:repeat(5,1fr);}
.g-6{grid-template-columns:repeat(6,1fr);}

/* ============================================================
   CARD
   ============================================================ */
.card{
  position:relative;
  padding:13px 15px 11px 17px;
  min-height:96px;
  display:flex;flex-direction:column;justify-content:space-between;
  transition:background 0.12s;
}
.card:hover{background:var(--surface-2);}
.card::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--idle);
}
.card.h-sm{min-height:72px;}
.card.h-lg{min-height:148px;}
.card.h-xl{min-height:220px;}

.card.ok::before{background:var(--green);}
.card.ok.live::before{animation:rail 2.2s ease-in-out infinite;}
.card.warn::before{background:var(--yellow);}
.card.warn.live::before{animation:rail 1.4s ease-in-out infinite;}
.card.crit::before{background:var(--red);}
.card.info::before{background:var(--blue);}
.card.idle::before{background:var(--idle);}
@keyframes rail{0%,100%{opacity:1;}50%{opacity:0.3;}}

.card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;}
.card-label{
  font-size:10px;letter-spacing:0.07em;text-transform:uppercase;
  color:var(--text-faint);
}
.card-value{font-size:19px;font-weight:600;color:var(--text);letter-spacing:-0.01em;margin-top:4px;}
.card-value.sm{font-size:14px;font-weight:500;}
.card-value.xl{font-size:26px;}
.card-sub{font-size:10.5px;color:var(--text-faint);margin-top:4px;}
.card-sub .hl{color:var(--text-dim);}
.card-divider{height:1px;background:var(--border);margin:8px 0;}
.card-row{display:flex;justify-content:space-between;font-size:10.5px;color:var(--text-faint);margin-top:3px;}
.card-row .v{color:var(--text-dim);}
.card-row .v.hl{color:var(--text);}

.pill{
  font-size:9px;letter-spacing:0.05em;text-transform:uppercase;
  padding:2px 6px;border-radius:2px;white-space:nowrap;flex-shrink:0;
}
.pill.ok{color:var(--green);background:var(--green-dim);}
.pill.warn{color:var(--yellow);background:var(--yellow-dim);}
.pill.crit{color:var(--red);background:var(--red-dim);}
.pill.info{color:var(--blue);background:var(--blue-dim);}
.pill.idle{color:var(--text-faint);background:var(--idle-dim);}

/* ============================================================
   TABLE
   ============================================================ */
.table{width:100%;border-collapse:collapse;background:var(--surface);}
.table th{
  text-align:left;font-size:10px;letter-spacing:0.07em;text-transform:uppercase;
  color:var(--text-faint);font-weight:500;
  padding:9px 14px;border-bottom:1px solid var(--border);
  background:var(--surface-2);
}
.table td{
  padding:10px 14px;font-size:12px;color:var(--text-dim);
  border-bottom:1px solid var(--border);
}
.table tr:hover td{background:var(--surface-2);}
.table tr:last-child td{border-bottom:none;}
.table .num{font-family:var(--mono);}
.table .hl{color:var(--text);}
.table tr{cursor:pointer;}
.table tr.strat-row-active td{background:var(--surface-3);border-left:2px solid var(--green);}

/* ============================================================
   PIPELINE
   ============================================================ */
.pipeline{
  display:flex;align-items:stretch;gap:0;
  background:var(--surface);border:1px solid var(--border);
  overflow-x:auto;
}
.pipe-node{
  flex:1;min-width:118px;padding:16px 12px;text-align:center;
  border-right:1px solid var(--border);position:relative;
}
.pipe-node:last-child{border-right:none;}
.pipe-dot{
  width:9px;height:9px;border-radius:50%;margin:0 auto 10px;
  background:var(--idle);
}
.pipe-node.ok .pipe-dot{background:var(--green);box-shadow:0 0 8px rgba(46,204,113,0.5);animation:pulse2 2.2s ease-in-out infinite;}
.pipe-node.warn .pipe-dot{background:var(--yellow);box-shadow:0 0 8px rgba(232,179,57,0.5);animation:pulse2 1.2s ease-in-out infinite;}
.pipe-node.crit .pipe-dot{background:var(--red);box-shadow:0 0 8px rgba(229,72,77,0.5);}
@keyframes pulse2{0%,100%{transform:scale(1);opacity:1;}50%{transform:scale(1.3);opacity:0.7;}}
.pipe-label{font-size:9.5px;letter-spacing:0.06em;text-transform:uppercase;color:var(--text-faint);margin-bottom:3px;}
.pipe-val{font-size:11px;color:var(--text-dim);}
.pipe-arrow{
  display:flex;align-items:center;justify-content:center;
  width:26px;flex-shrink:0;color:var(--text-faint);font-size:13px;
}

/* ============================================================
   UTILITIES
   ============================================================ */
.flex{display:flex;}
.flex-col{display:flex;flex-direction:column;}
.items-center{align-items:center;}
.justify-between{justify-content:space-between;}
.gap-1{gap:4px;}
.gap-2{gap:8px;}
.gap-3{gap:12px;}
.mt-1{margin-top:4px;}
.mt-2{margin-top:8px;}
.mt-3{margin-top:12px;}
.text-dim{color:var(--text-dim);}
.text-faint{color:var(--text-faint);}
.text-green{color:var(--green);}
.text-yellow{color:var(--yellow);}
.text-red{color:var(--red);}
.text-blue{color:var(--blue);}
.w-full{width:100%;}
.btn{
  font-family:var(--mono);font-size:11px;letter-spacing:0.03em;
  padding:7px 13px;border-radius:var(--radius);
  background:var(--surface-2);border:1px solid var(--border-2);
  color:var(--text-dim);cursor:pointer;transition:all 0.12s;
}
.btn:hover{color:var(--text);border-color:var(--text-faint);}
.btn.primary{background:var(--green-dim);border-color:var(--green-bd);color:var(--green);}
.btn.btn-active{background:var(--blue-dim);border-color:var(--blue-bd);color:var(--blue);}
.input{
  font-family:var(--mono);font-size:12px;
  background:var(--surface-2);border:1px solid var(--border-2);
  color:var(--text);padding:7px 10px;border-radius:var(--radius);
  outline:none;
}
.input:focus{border-color:var(--green-bd);}
.input::placeholder{color:var(--text-faint);}

.bar-track{height:4px;background:var(--surface-3);border-radius:2px;overflow:hidden;}
.bar-fill{height:100%;border-radius:2px;}
.bar-fill.green{background:var(--green);}
.bar-fill.yellow{background:var(--yellow);}
.bar-fill.red{background:var(--red);}
.bar-fill.blue{background:var(--blue);}

.ro-banner{
  background:var(--yellow-dim);border-bottom:1px solid var(--yellow-bd);
  color:var(--yellow);font-size:10.5px;letter-spacing:0.03em;
  text-align:center;padding:5px 14px;
}

a:focus-visible,button:focus-visible,.nav-item:focus-visible{
  outline:2px solid var(--green);outline-offset:1px;
}

@media (prefers-reduced-motion: reduce){
  .tb-dot,.card.live::before,.pipe-node .pipe-dot{animation:none!important;}
}

/* ============================================================
   STORY CARD — multi-fact card, "every card tells a story"
   ============================================================ */
.story-card{padding:13px 15px 13px 17px;}
.story-grid{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:10px 16px;margin-top:10px;
}
.story-row-label{font-size:9.5px;letter-spacing:0.06em;text-transform:uppercase;color:var(--text-faint);}
.story-row-value{font-size:13px;color:var(--text-dim);margin-top:2px;font-weight:500;}
.story-row-value.hl{color:var(--text);font-weight:600;}

/* ============================================================
   WAITING STATE — honest empty state, no fake numbers
   ============================================================ */
.waiting-note{font-size:10.5px;color:var(--text-faint);font-style:normal;}

/* ============================================================
   HOME — "Good Morning" mission control, single screen
   ============================================================ */
.home-greeting{
  font-size:20px;font-weight:700;letter-spacing:0.01em;color:var(--text);
  margin-bottom:2px;
}
.home-greeting .accent{color:var(--green);}
.home-greeting-sub{font-size:11px;color:var(--text-faint);margin-bottom:20px;}

.briefing-rail{
  display:flex;flex-direction:column;
  background:var(--surface);border:1px solid var(--border);
}
.briefing-line{
  padding:14px 18px;border-bottom:1px solid var(--border);
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;
}
.briefing-line:last-child{border-bottom:none;}
.briefing-label{
  font-size:10px;letter-spacing:0.08em;text-transform:uppercase;color:var(--text-faint);
  min-width:200px;flex-shrink:0;
}
.briefing-value{font-size:13.5px;color:var(--text-dim);font-weight:500;text-align:right;flex:1;}
.briefing-detail{
  width:100%;font-size:11px;color:var(--text-faint);text-align:right;margin-top:2px;
}

/* ============================================================
   OPERATIONS TIMELINE — vertical event replay
   ============================================================ */
.tl-wrap{display:flex;flex-direction:column;}
.tl-event{display:grid;grid-template-columns:74px 20px 1fr;gap:0;align-items:flex-start;}
.tl-time{
  font-size:10.5px;color:var(--text-faint);padding:9px 10px 9px 0;text-align:right;
  font-variant-numeric:tabular-nums;
}
.tl-rail{display:flex;flex-direction:column;align-items:center;}
.tl-dot{width:7px;height:7px;border-radius:50%;background:var(--idle);margin-top:11px;flex-shrink:0;}
.tl-dot.ok{background:var(--green);}
.tl-dot.warn{background:var(--yellow);}
.tl-dot.crit{background:var(--red);}
.tl-dot.info{background:var(--blue);}
.tl-line{width:1px;flex:1;background:var(--border-2);min-height:8px;}
.tl-event:last-child .tl-line{display:none;}
.tl-body{padding:9px 0 9px 10px;font-size:12px;}
.tl-actor{color:var(--text);font-weight:600;}
.tl-arrow{color:var(--text-faint);margin:0 6px;}
.tl-event-text{color:var(--text-dim);}

/* ============================================================
   LIVE FLASH — "Living Information." A value just ticked.
   ============================================================ */
[data-live]{
  display:inline-block;
  border-radius:2px;
  padding:0 2px;
  margin:0 -2px;
}
.live-flash{
  animation: liveFlash 900ms ease-out;
}
@keyframes liveFlash{
  0%{ background:rgba(46,204,113,0.32); color:var(--text); }
  100%{ background:transparent; }
}
@media (prefers-reduced-motion: reduce){
  .live-flash{ animation:none; }
}

/* ============================================================
   GITHUB-STYLE ISSUE ROW (Incident Center v2)
   ============================================================ */
.issue-row{
  display:flex;align-items:flex-start;gap:12px;
  padding:14px 18px;border-bottom:1px solid var(--border);
  background:var(--surface);cursor:pointer;transition:background 0.12s;
}
.issue-row:hover{background:var(--surface-2);}
.issue-row:last-child{border-bottom:none;}
.issue-icon{font-size:13px;margin-top:1px;flex-shrink:0;width:14px;text-align:center;}
.issue-icon.open{color:var(--red);}
.issue-icon.resolved{color:var(--green);}
.issue-icon.ignored{color:var(--text-faint);}
.issue-body{flex:1;min-width:0;}
.issue-title-row{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:3px;}
.issue-title{font-size:12.5px;color:var(--text);font-weight:500;}
.issue-meta{font-size:10.5px;color:var(--text-faint);}
.issue-meta b{color:var(--text-dim);font-weight:500;}
.issue-fields{
  display:grid;grid-template-columns:repeat(4,1fr);gap:8px 16px;
  margin-top:8px;padding-top:8px;border-top:1px solid var(--border);
}
.issue-field-label{font-size:9px;letter-spacing:0.06em;text-transform:uppercase;color:var(--text-faint);}
.issue-field-value{font-size:11px;color:var(--text-dim);margin-top:2px;}
.issue-field-value.mono{font-family:var(--mono);}
.issue-expand-toggle{font-size:10px;color:var(--text-faint);margin-left:auto;flex-shrink:0;cursor:pointer;}

@media(max-width:1100px){
  .g-4{grid-template-columns:repeat(2,1fr);}
  .g-5{grid-template-columns:repeat(3,1fr);}
  .g-6{grid-template-columns:repeat(3,1fr);}
  .issue-fields{grid-template-columns:repeat(2,1fr);}
}

/* ============================================================
   RECOMMENDATION CARD — "what happened" -> "what should I do"
   ============================================================ */
.rec-card{padding:14px 16px 12px 18px;}
.rec-metrics{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:8px 14px;margin-top:10px;
}
.rec-metric-label{font-size:9px;letter-spacing:0.06em;text-transform:uppercase;color:var(--text-faint);}
.rec-metric-value{font-size:13px;color:var(--text-dim);margin-top:2px;font-weight:500;}
.rec-line{
  margin-top:10px;padding:9px 11px;border-radius:2px;
  border-left:2px solid var(--idle);background:var(--surface-2);
}
.rec-line-label{font-size:9px;letter-spacing:0.08em;text-transform:uppercase;color:var(--text-faint);margin-bottom:3px;}
.rec-line-text{font-size:11px;color:var(--text-dim);line-height:1.5;}
.rec-line.rec-ok{border-left-color:var(--green);}
.rec-line.rec-ok .rec-line-text{color:var(--text-dim);}
.rec-line.rec-warn{border-left-color:var(--yellow);background:var(--yellow-dim);}
.rec-line.rec-warn .rec-line-text{color:var(--yellow);}
.rec-line.rec-crit{border-left-color:var(--red);background:var(--red-dim);}
.rec-line.rec-crit .rec-line-text{color:var(--red);}

/* ============================================================
   HOME v3 — mission control checklist + AI block
   ============================================================ */
.checklist{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);}
.checklist-item{
  display:flex;align-items:center;gap:10px;padding:10px 16px;
  border-bottom:1px solid var(--border);font-size:12px;
}
.checklist-item:last-child{border-bottom:none;}
.checklist-check{color:var(--green);font-size:12px;flex-shrink:0;}
.checklist-check.fail{color:var(--red);}
.checklist-label{color:var(--text-dim);}
.checklist-label.fail{color:var(--text);}

.ai-rec-block{
  background:var(--surface);border:1px solid var(--blue-bd);
  padding:16px 18px;
}
.ai-rec-title{
  font-size:10px;letter-spacing:0.08em;text-transform:uppercase;color:var(--blue);
  margin-bottom:8px;display:flex;align-items:center;gap:6px;
}
.ai-rec-body{font-size:12.5px;color:var(--text-dim);line-height:1.7;}

/* ============================================================
   COMMAND CENTER — ⌘K search overlay
   ============================================================ */
.cmdk-overlay{
  display:none;position:fixed;inset:0;z-index:200;
  background:rgba(5,6,8,0.7);backdrop-filter:blur(2px);
  align-items:flex-start;justify-content:center;padding-top:14vh;
}
.cmdk-overlay.open{display:flex;}
.cmdk-box{
  width:560px;max-width:90vw;max-height:60vh;
  background:var(--surface);border:1px solid var(--border-2);
  border-radius:6px;overflow:hidden;
  box-shadow:0 16px 48px rgba(0,0,0,0.6);
  display:flex;flex-direction:column;
}
.cmdk-input-row{
  display:flex;align-items:center;gap:10px;
  padding:12px 16px;border-bottom:1px solid var(--border);
}
.cmdk-input-icon{color:var(--text-faint);font-size:13px;}
.cmdk-input{
  flex:1;background:none;border:none;outline:none;
  font-family:var(--mono);font-size:13px;color:var(--text);
}
.cmdk-input::placeholder{color:var(--text-faint);}
.cmdk-kbd{
  font-size:9.5px;color:var(--text-faint);
  border:1px solid var(--border-2);border-radius:3px;padding:1px 5px;
}
.cmdk-results{overflow-y:auto;max-height:46vh;}
.cmdk-group-label{
  font-size:9.5px;letter-spacing:0.08em;text-transform:uppercase;
  color:var(--text-faint);padding:8px 16px 4px;
}
.cmdk-item{
  display:flex;align-items:center;gap:10px;
  padding:9px 16px;cursor:pointer;font-size:12.5px;color:var(--text-dim);
}
.cmdk-item:hover, .cmdk-item.active{background:var(--surface-2);color:var(--text);}
.cmdk-item-icon{width:14px;text-align:center;color:var(--text-faint);flex-shrink:0;}
.cmdk-item-label{flex:1;}
.cmdk-item-meta{font-size:10.5px;color:var(--text-faint);}
.cmdk-empty{padding:24px;text-align:center;color:var(--text-faint);font-size:12px;}
.cmdk-item-noop .cmdk-item-meta{color:var(--text-faint);font-style:italic;}
.cmdk-item-flash{background:var(--yellow-dim)!important;}

/* ============================================================
   NOTIFICATION BELL
   ============================================================ */
.notif-wrap{position:relative;}
.notif-btn{
  display:flex;align-items:center;gap:6px;
  font-size:11px;color:var(--text-dim);cursor:pointer;
  background:none;border:none;padding:0;
}
.notif-btn:hover{color:var(--text);}
.notif-dot-count{
  font-size:9.5px;background:var(--red);color:#fff;
  border-radius:8px;padding:0 5px;min-width:14px;text-align:center;
  line-height:14px;font-weight:600;
}
.notif-dropdown{
  display:none;position:absolute;right:0;top:100%;margin-top:8px;
  width:300px;background:var(--surface);border:1px solid var(--border-2);
  border-radius:4px;box-shadow:0 8px 28px rgba(0,0,0,0.5);z-index:120;
}
.notif-dropdown.open{display:block;}
.notif-header{
  padding:10px 14px;border-bottom:1px solid var(--border);
  font-size:10px;letter-spacing:0.06em;text-transform:uppercase;color:var(--text-faint);
}
.notif-item{
  padding:10px 14px;border-bottom:1px solid var(--border);
  display:flex;gap:8px;align-items:flex-start;font-size:11.5px;
}
.notif-item:last-child{border-bottom:none;}
.notif-item-dot{width:6px;height:6px;border-radius:50%;margin-top:4px;flex-shrink:0;}
.notif-item-text{color:var(--text-dim);}
.notif-item-time{font-size:10px;color:var(--text-faint);margin-top:2px;}

/* ============================================================
   ENVIRONMENT SELECTOR
   ============================================================ */
.env-wrap{position:relative;}
.env-btn{
  font-size:9.5px;letter-spacing:0.08em;text-transform:uppercase;
  padding:2px 8px;border-radius:3px;cursor:pointer;
  border:1px solid var(--yellow-bd);color:var(--yellow);background:var(--yellow-dim);
  display:flex;align-items:center;gap:5px;
}
.env-btn.prod{border-color:var(--green-bd);color:var(--green);background:var(--green-dim);}
.env-dropdown{
  display:none;position:absolute;right:0;top:100%;margin-top:8px;
  width:170px;background:var(--surface);border:1px solid var(--border-2);
  border-radius:4px;box-shadow:0 8px 28px rgba(0,0,0,0.5);z-index:120;
}
.env-dropdown.open{display:block;}
.env-option{
  padding:8px 12px;font-size:11px;color:var(--text-dim);cursor:pointer;
  display:flex;align-items:center;gap:8px;
}
.env-option:hover{background:var(--surface-2);color:var(--text);}
.env-option-dot{width:6px;height:6px;border-radius:50%;}

/* ============================================================
   ALLOCATION BAR — strategy / regime / capital allocation
   ============================================================ */
.alloc-row{
  display:grid;grid-template-columns:140px 1fr 56px;gap:12px;
  align-items:center;padding:9px 0;
}
.alloc-label{font-size:12px;color:var(--text-dim);}
.alloc-bar-track{height:8px;background:var(--surface-3);border-radius:2px;overflow:hidden;}
.alloc-bar-fill{height:100%;border-radius:2px;transition:width 0.3s ease;}
.alloc-bar-fill.green{background:var(--green);}
.alloc-bar-fill.blue{background:var(--blue);}
.alloc-bar-fill.yellow{background:var(--yellow);}
.alloc-bar-fill.idle{background:var(--idle);}
.alloc-pct{font-size:11.5px;color:var(--text-dim);text-align:right;font-variant-numeric:tabular-nums;}
.alloc-disabled .alloc-label,.alloc-disabled .alloc-pct{color:var(--text-faint);}

/* ============================================================
   BIG SCORE — single composite health score
   ============================================================ */
.bigscore-wrap{display:flex;gap:32px;align-items:center;flex-wrap:wrap;}
.bigscore-main{text-align:center;flex-shrink:0;}
.bigscore-num{font-size:56px;font-weight:700;color:var(--green);line-height:1;letter-spacing:-0.02em;}
.bigscore-grade{font-size:14px;color:var(--text-faint);margin-top:4px;letter-spacing:0.06em;}
.bigscore-comps{flex:1;display:flex;flex-direction:column;gap:10px;min-width:240px;}
.score-comp{display:grid;grid-template-columns:110px 1fr 32px;gap:10px;align-items:center;}
.score-comp-label{font-size:10.5px;color:var(--text-faint);letter-spacing:0.04em;}
.score-comp-bar-track{height:5px;background:var(--surface-3);border-radius:2px;overflow:hidden;}
.score-comp-bar-fill{height:100%;border-radius:2px;}
.score-comp-bar-fill.green{background:var(--green);}
.score-comp-bar-fill.blue{background:var(--blue);}
.score-comp-bar-fill.yellow{background:var(--yellow);}
.score-comp-val{font-size:11px;color:var(--text-dim);text-align:right;}

/* ============================================================
   HEAT BAR — segmented risk heat
   ============================================================ */
.heat-bar{display:flex;gap:3px;height:18px;}
.heat-seg{flex:1;border-radius:2px;}
.heat-seg.green{background:var(--green);}
.heat-seg.yellow{background:var(--yellow);}
.heat-seg.red{background:var(--red);}
.heat-seg.empty{background:var(--surface-3);}

/* ============================================================
   REGIME HISTORY ROW
   ============================================================ */
.regime-hist-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:10px 16px;border-bottom:1px solid var(--border);font-size:12px;
}
.regime-hist-row:last-child{border-bottom:none;}
.regime-hist-name{color:var(--text);}
.regime-hist-meta{color:var(--text-faint);font-size:10.5px;}

@media(max-width:760px){
  :root{--sidebar-w:0px;}
  .shell{grid-template-columns:1fr;}
  .sidebar{display:none;}
  .g-2,.g-3,.g-4,.g-5,.g-6{grid-template-columns:1fr;}
  .cmdk-box{width:94vw;}
  .bigscore-wrap{flex-direction:column;align-items:flex-start;}
  .alloc-row{grid-template-columns:90px 1fr 48px;}
}

/* ============================================================
   MISSION CONTROL CARD — Home hero panel.
   Deliberately the most visually dominant element on the page.
   ============================================================ */
.mc-card{
  background:var(--surface);border:1px solid var(--green-bd);
  border-radius:4px;padding:20px 24px 22px;
  box-shadow:0 0 0 1px rgba(46,204,113,0.05), 0 8px 28px rgba(0,0,0,0.35);
}
.mc-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}
.mc-card-title{font-size:13px;font-weight:700;letter-spacing:0.04em;color:var(--text);text-transform:uppercase;}
.mc-card-live{display:flex;align-items:center;gap:6px;font-size:10.5px;color:var(--text-faint);}
.mc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);}
.mc-cell{background:var(--surface);padding:16px 18px;}
.mc-cell.mc-primary{background:var(--surface-2);}
.mc-cell-label{font-size:10px;letter-spacing:0.06em;text-transform:uppercase;color:var(--text-faint);margin-bottom:8px;}
.mc-cell-value{font-size:32px;font-weight:700;letter-spacing:-0.02em;color:var(--text);}
.mc-primary .mc-cell-value{font-size:36px;}
.mc-cell-value-sm{font-size:18px!important;font-weight:600!important;}
@media(max-width:900px){
  .mc-grid{grid-template-columns:repeat(2,1fr);}
}

/* ============================================================
   VISUAL HIERARCHY — secondary stat cards on Home are
   deliberately muted relative to the Mission Control card above.
   ============================================================ */
.home-secondary{opacity:0.92;}
.home-secondary .card-value{font-size:16px;}
.home-secondary .card-label{font-size:9.5px;}

/* ============================================================
   EXPLANATION FACTORS — AI Center "why" bullets
   ============================================================ */
.explain-box{
  margin-top:10px;padding-top:10px;border-top:1px solid var(--border);
}
.explain-title{font-size:9.5px;letter-spacing:0.06em;text-transform:uppercase;color:var(--text-faint);margin-bottom:6px;}
.explain-list{display:flex;flex-direction:column;gap:5px;}
.explain-item{display:flex;gap:8px;align-items:flex-start;font-size:11px;color:var(--text-dim);line-height:1.5;}
.explain-bullet{color:var(--blue);flex-shrink:0;}

/* ============================================================
   STRATEGY "EMPLOYEE" CARD — Strategy Center list upgrade
   ============================================================ */
.emp-card{
  background:var(--surface);border:1px solid var(--border);
  padding:16px 18px 14px;cursor:pointer;transition:all 0.15s;
  position:relative;
}
.emp-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--idle);}
.emp-card.ok::before{background:var(--green);}
.emp-card.warn::before{background:var(--yellow);}
.emp-card.idle::before{background:var(--idle);}
.emp-card:hover{background:var(--surface-2);}
.emp-card.selected{background:var(--surface-2);border-color:var(--green-bd);}
.emp-card-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px;}
.emp-card-name{font-size:14px;font-weight:600;color:var(--text);}
.emp-fields{display:grid;grid-template-columns:repeat(4,1fr);gap:10px 14px;}
.emp-field-label{font-size:9px;letter-spacing:0.05em;text-transform:uppercase;color:var(--text-faint);}
.emp-field-value{font-size:13px;color:var(--text-dim);margin-top:2px;font-weight:500;}
.emp-field-value.hl{color:var(--text);font-weight:600;}
@media(max-width:900px){
  .emp-fields{grid-template-columns:repeat(2,1fr);}
}

/* ============================================================
   ACCOUNT ALLOCATION DASHBOARD — Accounts page upgrade
   ============================================================ */
.acct-alloc-row{
  display:grid;grid-template-columns:140px 1fr 160px;gap:16px;
  align-items:center;padding:14px 0;border-bottom:1px solid var(--border);
}
.acct-alloc-row:last-child{border-bottom:none;}
.acct-alloc-name{font-size:13px;font-weight:600;color:var(--text);}
.acct-alloc-meta{display:flex;gap:14px;font-size:10.5px;color:var(--text-faint);}

/* ============================================================
   REPORT STAT GRID — fund-manager style metrics
   ============================================================ */
.fund-stat{padding:16px 18px;}
.fund-stat-label{font-size:9.5px;letter-spacing:0.06em;text-transform:uppercase;color:var(--text-faint);margin-bottom:6px;}
.fund-stat-value{font-size:20px;font-weight:700;color:var(--text);}
.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;}
.calendar-cell{
  aspect-ratio:1;display:flex;align-items:center;justify-content:center;
  font-size:10px;border-radius:2px;color:var(--text-faint);
}
.calendar-cell.pos{background:rgba(46,204,113,0.18);color:var(--green);}
.calendar-cell.neg{background:rgba(229,72,77,0.18);color:var(--red);}
.calendar-cell.empty{background:transparent;}
.montecarlo-bar-row{display:flex;align-items:center;gap:10px;padding:4px 0;}
.montecarlo-label{width:90px;font-size:10px;color:var(--text-faint);flex-shrink:0;}
.montecarlo-track{flex:1;height:14px;background:var(--surface-3);border-radius:2px;overflow:hidden;}
.montecarlo-fill{height:100%;}