/* =========================================================================
   EMPIRIUM OS - OPERATOR LAYER
   Final, intentionally small override layer for the simplified operating
   system navigation and the guided Command / Today / Mind / Review surfaces.
   Four-pixel spacing grid. Borders, not shadow, carry depth.
   ========================================================================= */

/* ----- Primary operating-system rail ----- */
.eo-primary-nav{
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:4px 6px 10px;
}
.eo-primary-nav .nav-sec{ padding:4px 8px 8px; }
.eo-primary-nav .app-nav-tab{
  min-height:40px;
  padding:0 9px;
  border:1px solid transparent;
  background:transparent;
}
.eo-primary-nav .app-nav-tab:hover{
  border-color:var(--line-soft);
  background:rgba(var(--text-rgb),.025);
}
.eo-primary-nav .app-nav-tab.active{
  border-color:rgba(var(--accent-rgb),.24);
  background:rgba(var(--accent-rgb),.075);
}
.eo-primary-nav .app-nav-tab kbd{
  flex:none;
  min-width:22px;
  padding:2px 3px;
  border:1px solid var(--line-soft);
  color:var(--faint);
  background:var(--card-subtle);
  font:500 8px/1 var(--font-mono);
  letter-spacing:.08em;
  text-align:center;
}
.eo-primary-nav .app-nav-tab.active kbd{
  border-color:rgba(var(--accent-rgb),.32);
  color:var(--accent);
}
.eo-advanced-nav{
  display:block;
  margin:3px 6px 10px;
  border-top:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
}
.eo-advanced-nav > summary{
  display:flex;
  min-height:44px;
  padding:8px 10px;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:2px;
  cursor:pointer;
  color:var(--muted);
  list-style:none;
  transition:color var(--t-snap) var(--ease), background var(--t-snap) var(--ease);
}
.eo-advanced-nav > summary::-webkit-details-marker{ display:none; }
.eo-advanced-nav > summary:hover{ color:var(--text); background:rgba(var(--text-rgb),.025); }
.eo-advanced-nav > summary span{
  width:100%;
  font:600 10px/1.2 var(--font-mono);
  letter-spacing:.12em;
  text-transform:uppercase;
}
.eo-advanced-nav > summary small{
  width:100%;
  color:var(--faint);
  font:400 9px/1.2 var(--font-body);
}
.eo-advanced-nav > summary span::before{ content:'+ '; color:var(--accent); }
.eo-advanced-nav[open] > summary span::before{ content:'- '; }
.eo-advanced-nav-body{ padding:4px 0 8px; }
.eo-advanced-nav-body > .nav-sec:first-child{ padding-top:8px; }

/* Topbar: regulation is the persistent emergency affordance. */
.topbar #eoRegulateBtn{
  border-color:rgba(var(--warn-rgb),.28);
  background:rgba(var(--warn-rgb),.07);
  color:var(--warn);
}
.topbar #eoRegulateBtn:hover{
  border-color:rgba(var(--warn-rgb),.5);
  background:rgba(var(--warn-rgb),.12);
}

/* The prior broad visual pass numbered/glowed every card. Ordinary cards now
   recede; only explicit hero/live surfaces keep the earned signal. */
.eo-panel .eo-card:not(.eo-card-hero)::before,
.eo-panel .eo-card:not(.eo-card-hero)::after{ display:none; }
.eo-panel .eo-card:not(.eo-card-hero){ box-shadow:none; }
.eo-panel .eo-card:not(.eo-card-hero):hover{ transform:none; border-color:var(--line); }

/* =========================================================================
   COMMAND CENTRE
   Two columns: a wide working column (hero → levels → direction → things to
   look forward to) and a 360px rail of measures (counters, revenue, routine,
   tasks-closed heatmap). Cards are separated by weight, not by chrome: the
   hero and the rail cards take the raised navy gradient, supporting panels sit
   flat on --panel. Every colour here is a token; nothing is hard-coded.
   ========================================================================= */
/* The two-column shell itself now lives in command-layout.css: the working
   column and the rail are a 21/9 split of a 30-column widget canvas rather
   than a hard-coded 1fr + 360px grid. Everything below this line — the rail
   vocabulary, the cards, the counters, the gauges — is unchanged, and is what
   the canvas arranges. */

/* ----- Shared rail vocabulary ----- */
.eo-rail-kicker{
  font:600 10px/1 var(--font-mono);
  letter-spacing:.14em;
  color:var(--muted);
  text-transform:uppercase;
}
.eo-rail-kicker.is-accent{ color:var(--accent); }
.eo-rail-card{
  background:linear-gradient(160deg,var(--card-2),var(--card));
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  padding:15px 16px;
}
.eo-rail-head{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; flex-wrap:wrap; }
.eo-rail-meta{ display:flex; align-items:center; gap:10px; }
.eo-pill-toggle{
  flex:none;
  height:22px; padding:0 10px;
  border:1px solid var(--line-bright); border-radius:12px;
  background:transparent; color:var(--muted);
  font:600 9px/1 var(--font-mono); letter-spacing:.1em;
  white-space:nowrap; cursor:pointer;
  transition:color var(--t-snap) var(--ease), border-color var(--t-snap) var(--ease);
}
.eo-pill-toggle:hover{ color:var(--text); border-color:var(--accent); }

/* ----- Hero ----- */
.eo-cmd-hero{
  position:relative;
  background:linear-gradient(160deg,var(--card-2),var(--card));
  border:1px solid var(--line-strong);
  border-radius:var(--r-lg);
  padding:19px 21px;
  overflow:hidden;
}
.eo-cmd-hero::before{
  content:''; position:absolute; left:0; top:0;
  width:3px; height:100%; background:var(--accent);
}
.eo-cmd-hero-main{ position:relative; z-index:2; padding-right:34%; }
.eo-cmd-hero-kicker{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
.eo-cmd-hero-kicker .eo-rail-kicker{ font-size:11px; letter-spacing:.18em; }
.eo-cmd-dot{ flex:none; width:5px; height:5px; border-radius:50%; background:var(--accent); }
.eo-cmd-hero-date{
  margin-top:11px;
  color:var(--text);
  font:600 26px/1.2 var(--font-display);
  letter-spacing:-.025em;
}
.eo-cmd-hero-actions{ display:flex; flex-wrap:wrap; gap:9px; margin-top:16px; }
.eo-cmd-btn{
  height:34px; padding:0 15px; white-space:nowrap;
  border:1px solid var(--line-bright); border-radius:7px;
  background:transparent; color:var(--muted);
  font:600 12px/1 var(--font-body); cursor:pointer;
  transition:color var(--t-snap) var(--ease), border-color var(--t-snap) var(--ease), background var(--t-snap) var(--ease);
}
.eo-cmd-btn:hover{ color:var(--text); border-color:rgba(var(--accent-rgb),.4); }
.eo-cmd-btn.is-primary{ background:rgba(var(--accent-rgb),.06); color:var(--text); }
.eo-cmd-btn.is-primary:hover{ border-color:var(--accent); color:var(--accent); }
.eo-cmd-hero-clock{ margin-top:13px; }
.eo-cmd-hero-clock > b{
  color:var(--accent);
  font:600 13px/1 var(--font-mono);
  font-variant-numeric:tabular-nums;
  letter-spacing:.06em;
}
.eo-cmd-hero-quote{
  max-width:480px;
  padding-left:14px;
  border-left:2px solid rgba(var(--accent-rgb),.5);
  color:var(--muted);
  font:italic 500 14px/1.5 var(--font-body, Georgia, serif);
  letter-spacing:.01em;
}

/* Binaural beats transport — one-click play/pause + program picker so the
   synth in js/binaural-player.js can be started without leaving Command for
   the Music fly-out. Card glows accent when Engine.playing is true. */
.eo-bin-card{ padding:14px 16px; transition:border-color var(--t-snap) var(--ease); }
.eo-bin-card.is-live{ border-color:rgba(var(--accent-rgb),.4); }
.eo-bin-card .eo-rail-meta{ font-size:9.5px; color:var(--faint); text-transform:uppercase; letter-spacing:.1em; }
.eo-bin-body{ display:flex; align-items:center; gap:12px; margin-top:11px; }
.eo-bin-play{
  flex:none; width:42px; height:42px; border-radius:50%; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(var(--accent-rgb),.5); background:var(--card); color:var(--accent-soft);
  transition:background var(--t-snap) var(--ease), color var(--t-snap) var(--ease), box-shadow var(--t-snap) var(--ease);
}
.eo-bin-play svg{ width:17px; height:17px; }
.eo-bin-play:hover{ background:var(--accent); color:#fff; }
.eo-bin-card.is-live .eo-bin-play{ background:var(--accent); color:#fff; box-shadow:0 0 0 4px rgba(var(--accent-rgb),.16); }
.eo-bin-info{ min-width:0; flex:1; }
.eo-bin-title{ color:var(--text); font:600 13px/1.3 var(--font-body); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.eo-bin-sub{ display:flex; align-items:center; gap:6px; margin-top:3px; color:var(--faint); font:500 10.5px/1 var(--font-mono); letter-spacing:.02em; }
.eo-bin-dot{ flex:none; width:6px; height:6px; border-radius:50%; background:var(--line-bright); }
.eo-bin-card.is-live .eo-bin-dot{
  background:var(--good); box-shadow:0 0 0 3px rgba(var(--good-rgb),.18);
  animation:eoBinPulse 1.6s ease-in-out infinite;
}
@keyframes eoBinPulse{ 0%,100%{ opacity:1; } 50%{ opacity:.35; } }
.eo-bin-chips{ display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.eo-bin-chip{
  height:23px; padding:0 10px; white-space:nowrap;
  border:1px solid var(--line-bright); border-radius:12px;
  background:transparent; color:var(--muted); cursor:pointer;
  font:600 9.5px/1 var(--font-mono); letter-spacing:.04em;
  transition:color var(--t-snap) var(--ease), border-color var(--t-snap) var(--ease), background var(--t-snap) var(--ease);
}
.eo-bin-chip:hover{ color:var(--text); border-color:var(--accent); }
.eo-bin-chip.is-active{ border-color:var(--accent); color:var(--accent); background:rgba(var(--accent-rgb),.08); }

/* Auto-suggestion narration widget — deliberately the slimmest card in the
   rail (tighter padding than .eo-rail-card's default) since it only shows up
   when the active sprint actually has a clip attached. */
.eo-audio-rail{ padding:11px 14px; }
.eo-audio-rail .eo-rail-meta{ font-size:var(--fs-caption); color:var(--muted); max-width:60%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.eo-audio-rail .eo-as-audio{ margin-top:9px; padding:0; border:none; background:none; }
/* The hero visual bleeds off the right edge behind a left-to-right mask, so
   it fades in rather than butting against the copy. */
.eo-cmd-hero-visual{
  position:absolute; top:0; right:0; bottom:0;
  width:46%; z-index:1;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.5) 35%,rgba(0,0,0,.95) 100%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.5) 35%,rgba(0,0,0,.95) 100%);
}

/* ----- Levels of a successful day ----- */
.eo-levels-card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  padding:14px 16px;
}
.eo-levels-head{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; flex-wrap:wrap; }
.eo-levels-meta{ display:flex; align-items:center; gap:12px; }

/* Live block card — reuses the .eo-levels-card shell (this column's card idiom)
   and adds only the live-specific rows. */
.eo-cmd-live-body{ margin-top:12px; display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 16px; }
.eo-cmd-live-title{ font:600 15px/1.35 var(--font-body); color:var(--text); }
.eo-cmd-live-elapsed{ display:flex; align-items:baseline; gap:7px; }
.eo-cmd-live-elapsed > b{
  color:var(--accent);
  font:600 13px/1 var(--font-mono);
  font-variant-numeric:tabular-nums;
  letter-spacing:.06em;
}
.eo-cmd-live-elapsed > span{
  color:var(--faint);
  font:600 9px/1.4 var(--font-mono);
  letter-spacing:.08em; text-transform:uppercase;
}
.eo-cmd-live-next{ margin:10px 0 0; color:var(--muted); font-size:13px; }
.eo-cmd-live-next b{ color:var(--text); }
.eo-cmd-live-actions{ display:flex; flex-wrap:wrap; gap:9px; margin-top:12px; }
.eo-cmd-live-empty{ margin-top:2px; }

/* The rescue door is the one button on Command that should read as a brake. */
.eo-cmd-btn.is-rescue:hover{ border-color:var(--danger); color:var(--danger); }
.eo-levels-scale{ font:500 9.5px/1 var(--font-mono); letter-spacing:.1em; color:var(--faint); }
.eo-levels-count{
  padding:2px 7px; border-radius:4px;
  background:rgba(var(--accent-rgb),.08); color:var(--faint);
  font:600 9px/1.4 var(--font-mono);
}
/* auto-fit rather than a fixed count: the working column's real width depends
   on the nav rail, which the user can collapse and resize, so a viewport
   breakpoint would reflow at the wrong moment. */
.eo-levels-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:12px; margin-top:12px; }
.eo-level{
  display:block; text-align:left; cursor:pointer;
  padding:11px 13px;
  border:1px solid var(--line-soft);
  border-top:2px solid var(--line-bright);
  border-radius:0 0 var(--r-sm) var(--r-sm);
  background:transparent;
  transition:background var(--t-snap) var(--ease);
}
.eo-level:hover{ background:rgba(var(--text-rgb),.03); }
.eo-level-label{ display:block; font:600 10px/1 var(--font-mono); letter-spacing:.1em; }
.eo-level-text{ display:block; margin-top:8px; color:var(--text); font:400 12px/1.5 var(--font-body); }
.eo-level.is-empty .eo-level-text{ color:var(--faint); }
.eo-level-min{ border-top-color:var(--warn); }
.eo-level-min .eo-level-label{ color:var(--warn); }
.eo-level-strong{ border-top-color:var(--accent); }
.eo-level-strong .eo-level-label{ color:var(--accent); }
.eo-level-elite{ border-top-color:var(--good); }
.eo-level-elite .eo-level-label{ color:var(--good); }

/* ----- Weekly Direction / Today's Command ----- */
.eo-dir-row{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:14px; align-items:start; }

/* Mini trend cards — fixed multi-line charts, a third of the main column
   each. The chart is the widget: no metric picker, just a title, a legend
   naming each line, and a range chip row that never competes with the plot
   for space. */
.eo-mini-trend-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; align-items:start; }
.eo-mini-trend{ display:flex; flex-direction:column; gap:8px; min-width:0; }
.eo-mini-trend-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.eo-mini-trend-head .eo-rail-kicker{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.eo-mini-trend-ranges{ display:flex; gap:2px; flex:none; }
.eo-mini-trend-range{
  appearance:none; border:0; background:transparent; cursor:pointer;
  font-size:10px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--faint); padding:2px 5px; border-radius:3px;
  transition:color .15s var(--ease), background .15s var(--ease);
}
.eo-mini-trend-range:hover{ color:var(--text); background:var(--card-subtle); }
.eo-mini-trend-range.is-on{ color:var(--on-accent); background:rgba(var(--accent-rgb),.85); }

.eo-mini-trend-legend{ display:flex; flex-wrap:wrap; gap:12px 14px; }
.eo-mini-trend-legend-item{
  display:flex; align-items:baseline; gap:6px;
  font-size:11px; color:var(--faint); white-space:nowrap;
}
.eo-mini-trend-legend-item i{
  width:8px; height:8px; border-radius:50%; flex:none;
  align-self:center; display:inline-block;
}
.eo-mini-trend-legend-item b{
  font-size:15px; font-weight:600; color:var(--text);
  font-variant-numeric:tabular-nums; letter-spacing:-.01em;
}

.eo-mini-trend-plot{ margin-top:2px; }
.eo-mini-trend-svg{ display:block; width:100%; height:104px; overflow:visible; }
.eo-mtc-base{ stroke:var(--line); stroke-width:1; vector-effect:non-scaling-stroke; }
.eo-mtc-line{
  fill:none; stroke-width:2;
  stroke-linejoin:round; stroke-linecap:round; vector-effect:non-scaling-stroke;
}
.eo-mtc-dot{ stroke:var(--card); stroke-width:1.5; vector-effect:non-scaling-stroke; }
.eo-mini-trend-svg rect{ cursor:crosshair; }

.eo-mini-trend-empty{ display:block; padding:28px 0; font-size:var(--fs-small); color:var(--faint); text-align:center; }
.eo-mini-trend-foot{ font-size:11px; color:var(--faint); }

@media (max-width:1400px){
  .eo-mini-trend-row{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:1100px){
  .eo-mini-trend-row{ grid-template-columns:1fr; }
}
.eo-dir-card{
  display:flex; flex-direction:column; align-items:flex-start;
  background:var(--card-2);
  border:1px solid var(--line-strong);
  border-radius:var(--r-lg);
  padding:16px 18px 15px;
}
.eo-dir-kicker{ letter-spacing:.16em; }
.eo-dir-box{
  width:100%; margin-top:12px; padding:13px 15px;
  background:var(--card-subtle);
  border:1px solid var(--line);
  border-radius:var(--r-md);
}
.eo-dir-empty .eo-empty-kicker{
  display:block; color:var(--faint);
  font:600 9.5px/1 var(--font-mono); letter-spacing:.14em; text-transform:uppercase;
}
.eo-dir-empty p{ margin:8px 0 0; color:var(--muted); font:400 12.5px/1.5 var(--font-body); }
.eo-dir-lede{ color:var(--text); font:650 14px/1.45 var(--font-body); text-wrap:balance; }
.eo-dir-box .eo-focus-list{ margin:8px 0 0; }
.eo-dir-more{ width:100%; }
.eo-dir-more-btn{
  margin-top:10px; padding:0; border:0; background:none;
  color:var(--faint); font:600 9.5px/1 var(--font-mono); letter-spacing:.14em; cursor:pointer;
}
.eo-dir-more-btn:hover{ color:var(--accent); }
.eo-dir-extra{ display:flex; flex-direction:column; gap:8px; margin-top:10px; }
.eo-dir-link{
  margin-top:12px; padding:0; border:0; background:none;
  color:var(--muted); font:600 10px/1 var(--font-mono); letter-spacing:.14em;
  text-align:left; cursor:pointer;
}
.eo-dir-link:hover{ color:var(--accent); }

/* ----- Things to look forward to ----- */
.eo-ltf{ margin-top:2px; }
.eo-ltf-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.eo-ltf-kicker{ font-weight:500; letter-spacing:.18em; }
.eo-ltf-add{
  height:22px; padding:0 9px; white-space:nowrap; cursor:pointer;
  border:1px solid rgba(var(--accent-rgb),.44); border-radius:5px;
  background:rgba(var(--accent-rgb),.1); color:var(--accent);
  font:600 9.5px/1 var(--font-mono); letter-spacing:.06em;
}
.eo-ltf-add:hover{ background:rgba(var(--accent-rgb),.2); }
.eo-ltf-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(205px,1fr)); gap:14px; margin-top:12px; }
.eo-ltf-card{
  position:relative;
  display:flex; align-items:stretch; min-height:120px; overflow:hidden;
  background:rgba(var(--panel-rgb),.72);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
}
.eo-ltf-del{
  position:absolute; top:5px; right:5px; z-index:2;
  width:18px; height:18px; padding:0; border-radius:50%;
  border:1px solid var(--line-bright); background:var(--glass); backdrop-filter:var(--glass-blur);
  color:var(--text); font:600 12px/1 var(--font-body); cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.eo-ltf-del:hover{ border-color:var(--danger); color:var(--danger); }
.eo-ltf-del:disabled{ opacity:.28; cursor:not-allowed; }
.eo-ltf-del:disabled:hover{ border-color:var(--line-bright); color:var(--text); }
.eo-ltf-body{ flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; padding:11px 13px; }
.eo-ltf-title,
.eo-ltf-text{ width:100%; padding:0; border:0; background:transparent; font-family:var(--font-body); }
.eo-ltf-title{ color:var(--text); font-size:13px; font-weight:600; }
.eo-ltf-text{ flex:1; color:var(--faint); font-size:11.5px; line-height:1.45; resize:none; }
.eo-ltf-title:focus,
.eo-ltf-text:focus{ outline:none; color:var(--text); }
.eo-ltf-title::placeholder,
.eo-ltf-text::placeholder{ color:var(--faint); opacity:.65; }
.eo-ltf-extras{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; margin-top:14px; }

/* ----- Rail: day / inbox counters ----- */
.eo-rail-top{ display:flex; gap:11px; }
.eo-count-tile{
  flex:none; width:104px; height:112px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;
  padding:12px 6px;
  background:linear-gradient(160deg,var(--card-2),var(--card));
  border:1px solid var(--line);
  border-radius:var(--r-lg);
}
.eo-count-num{ font:700 34px/1 var(--font-display); font-variant-numeric:tabular-nums; }
.eo-count-num.is-warn{ color:var(--warn); text-shadow:0 2px 18px rgba(var(--warn-rgb),.24); }
.eo-count-num.is-good{ color:var(--good); text-shadow:0 2px 18px rgba(var(--good-rgb),.24); }
.eo-count-label{ color:var(--muted); font:600 9px/1 var(--font-mono); letter-spacing:.14em; }
.eo-count-btn{
  margin-top:3px; height:23px; padding:0 9px; white-space:nowrap;
  border-radius:5px; font:600 9.5px/1 var(--font-body); cursor:pointer;
}
.eo-count-btn.is-danger{ border:1px solid rgba(var(--danger-rgb),.44); background:rgba(var(--danger-rgb),.1); color:var(--danger); }
.eo-count-btn.is-danger:hover{ background:rgba(var(--danger-rgb),.2); }
.eo-count-btn.is-good{ border:1px solid rgba(var(--good-rgb),.44); background:rgba(var(--good-rgb),.1); color:var(--good); }
.eo-count-btn.is-good:hover{ background:rgba(var(--good-rgb),.2); }
.eo-count-btn.is-accent{ border:1px solid rgba(var(--accent-rgb),.44); background:rgba(var(--accent-rgb),.1); color:var(--accent); }
.eo-count-btn.is-accent:hover{ background:rgba(var(--accent-rgb),.2); }

/* Second rail row — the mirror of the first: countdowns left, visual right.
   The mirroring is DOM order; the slot's flex:1 makes it take what is left. */
.eo-count-num.is-accent{ color:var(--accent); text-shadow:0 2px 18px rgba(var(--accent-rgb),.24); }
.eo-count-tile-cd{ padding-inline:8px; }
/* The goal text is user-written and can be any length; one clipped line keeps
   the tile the same size as every other counter (full text is on the title). */
.eo-count-goal{
  max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  color:var(--text); letter-spacing:.08em;
}

/* ----- Image / GIF slots -----
   One component, several shapes. A slot is click-to-browse when empty and
   drag-and-drop always; the tools row surfaces on hover so a filled slot reads
   as artwork rather than as a form control. */
.eo-cslot{
  position:relative; display:flex; align-items:center; justify-content:center;
  overflow:hidden; cursor:pointer;
  background:var(--card-subtle);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  transition:border-color var(--t-snap) var(--ease), box-shadow var(--t-snap) var(--ease);
}
.eo-cslot.has-img{ cursor:default; }
.eo-cslot-img{ display:block; width:100%; height:100%; object-fit:cover; }
.eo-cslot-ph{
  padding:8px; text-align:center; pointer-events:none;
  color:var(--faint); font:500 9.5px/1.5 var(--font-mono);
  letter-spacing:.1em; text-transform:uppercase;
}
.eo-cslot-tools{
  position:absolute; right:6px; bottom:6px; left:6px;
  display:flex; flex-wrap:wrap; justify-content:flex-end; gap:5px; opacity:0;
  transition:opacity var(--t-base) var(--ease);
}
.eo-cslot:not(.has-img) .eo-cslot-tools{ opacity:.6; }
.eo-cslot:hover .eo-cslot-tools,
.eo-cslot:focus-within .eo-cslot-tools{ opacity:1; }
.eo-cslot-btn{
  height:22px; padding:0 8px; white-space:nowrap; cursor:pointer;
  border:1px solid var(--line-bright); border-radius:5px;
  background:var(--glass); backdrop-filter:var(--glass-blur);
  color:var(--text); font:600 9.5px/1 var(--font-mono); letter-spacing:.06em;
}
.eo-cslot-btn:hover{ border-color:var(--accent); color:var(--accent); }
.eo-cslot.is-drop{ border-color:var(--accent); box-shadow:var(--glow-accent); }
.eo-cslot-bleed{ width:100%; height:100%; border:0; border-radius:0; background:transparent; }
.eo-cslot-tile{ flex:1; min-width:0; height:112px; }
.eo-cslot-thumb{ flex:none; width:120px; border:0; border-radius:0; }
.eo-cslot-banner{ width:100%; height:150px; }
.eo-cslot-wide{ height:120px; }

/* ----- Rail: revenue gauge — caliper ruler -----
   Fixed start jaw at £0, a fine-ruled track, and a moving jaw at the
   current total with the reading badge above it — same instrument as
   mobile's cmd-money-ruler (mobile-command.css), so the two platforms read
   as one design. */
.eo-money-summary{ color:var(--faint); font:500 10.5px/1 var(--font-body); }
/* margin-top only needs to clear the jaw's own overshoot (9px) now that
   the badge is centred on the track instead of floating above it. */
.eo-money-gauge{ position:relative; margin-top:12px; padding-bottom:4px; }
.eo-money-track{
  position:relative; height:22px;
  border:1px solid var(--line-bright); background:var(--card-subtle);
}
.eo-money-fill{
  position:absolute; left:0; top:0; bottom:0; width:0;
  background:rgba(var(--good-rgb),.18); transition:width 300ms linear;
}
.eo-money-ticks-minor{
  position:absolute; left:0; right:0; bottom:0; height:8px;
  background-image:repeating-linear-gradient(90deg, var(--line-bright) 0, var(--line-bright) 1px, transparent 1px, transparent 3.125%);
}
.eo-money-ticks-major{
  position:absolute; left:0; right:0; bottom:0; height:14px;
  background-image:repeating-linear-gradient(90deg, var(--muted) 0, var(--muted) 1px, transparent 1px, transparent 16.6667%);
  opacity:.55;
}
/* Jaws bracket the full ruled area (track + scale row below), not just the
   track. */
.eo-money-start{
  position:absolute; left:0; top:-9px; width:8px; height:50px;
  background:var(--text);
}
.eo-money-marker{ position:absolute; top:-16px; transition:left 300ms linear; }
.eo-money-marker-bar{ width:8px; height:57px; background:var(--good); margin-left:-4px; }
/* transform is set per render so the badge can clamp to the track at
   0% / 100% instead of hanging off the card — see moneyCounterSection in
   eo-command.js. */
/* Centred on the track's own height (not floating above it) — top:27px is
   the track's vertical mid-line in the marker's local frame (marker itself
   sits at top:-16px, track spans 0..22, so 22/2 - (-16) = 27); translateY
   does the actual centring so it stays correct if the badge's own height
   ever changes. */
.eo-money-marker-tag{
  position:absolute; left:50%; top:27px; transform:translateX(-50%) translateY(-50%);
  padding:2px 7px; white-space:nowrap;
  border:1px solid var(--good); background:var(--card-2);
  font:700 12.5px/1.3 var(--font-mono); color:var(--good);
}
.eo-money-scale{
  display:flex; justify-content:space-between; margin-top:5px;
  color:var(--faint); font:500 9px/1 var(--font-mono); letter-spacing:.04em;
}
.eo-money-foot{
  display:flex; align-items:flex-end; gap:18px;
  margin-top:14px; padding-top:12px; border-top:1px solid var(--line);
}
.eo-money-stat{
  display:flex; flex-direction:column-reverse; gap:2px;
  color:var(--faint); font:400 9.5px/1.3 var(--font-body);
}
.eo-money-stat b{ color:var(--text); font:700 14px/1 var(--font-display); }
.eo-money-stat.is-accent b{ color:var(--accent); }
.eo-money-spark{ margin-left:auto; display:flex; align-items:flex-end; gap:3px; height:24px; }
.eo-money-spark i{ width:7px; min-height:2px; border-radius:1px; background:rgba(var(--accent-rgb),.28); }
.eo-money-spark i.is-reached{ background:var(--good); }
/* Nothing logged yet: a quiet line, not an empty stats row with a stray rule
   above it and a band of dead space below. */
.eo-money-none{
  margin-top:14px; padding-top:12px; border-top:1px solid var(--line);
  color:var(--faint); font:400 11px/1.4 var(--font-body);
}
/* date ·········· amount — dotted leader between them, same log style as
   mobile (mobile-command.css .cmd-money-entries). */
.eo-money-entries{ margin-top:14px; padding-top:12px; border-top:1px solid var(--line); display:flex; flex-direction:column; }
.eo-money-entry{
  display:flex; align-items:baseline; padding:6px 0; border-bottom:1px solid var(--line-soft);
  font:400 12px/1.4 var(--font-body); cursor:pointer;
}
.eo-money-entry:last-child{ border-bottom:0; }
.eo-money-entry:hover{ background:rgba(var(--accent-rgb),.05); }
.eo-money-entry:hover .eo-money-entry-date{ color:var(--muted); }
.eo-money-entry-date{ flex:none; font-family:var(--font-mono); font-size:10.5px; letter-spacing:.06em; color:var(--faint); }
.eo-money-entry-leader{ flex:1; margin:0 8px; align-self:flex-end; height:5px; border-bottom:1px dotted var(--line-bright); }
.eo-money-entry b{ flex:none; font-weight:650; color:var(--text); }

.eo-money-log{
  display:block; width:100%; height:32px; margin-top:13px;
  border:0; border-radius:6px; cursor:pointer;
  background:var(--accent); color:var(--on-accent);
  font:700 11px/1 var(--font-body); letter-spacing:.02em;
}
.eo-money-log:hover{ background:var(--accent-soft); }
.eo-money-goal{
  display:block; width:100%; margin-top:9px; padding:0;
  border:0; background:none; cursor:pointer;
  color:var(--faint); font:600 9.5px/1 var(--font-mono); letter-spacing:.14em;
}
.eo-money-goal:hover{ color:var(--accent); }

/* ----- Rail: to play with — liquidity cell -----
   The collapsed state is one figure and one bar, because the figure is the
   only thing worth glancing at. The bar is a POWER CELL, not a progress bar:
   there is no goal to fill, so each source is a segment sized by its share of
   the total headroom, drawn-down sources hatched in red on the same track.
   Expanded, the sheet and the trail of readings drop in underneath. */
.eo-funds-rail{ position:relative; overflow:hidden; padding:12px 13px; }
/* This card carries a lot of rows in a 360px rail, so its own header runs
   tighter than the shared rail default: the toggle sits hard against the right
   edge with only its label's worth of padding. */
.eo-funds-rail .eo-rail-head{ gap:6px; }
.eo-funds-rail .eo-pill-toggle{ height:18px; padding:0 7px; border-radius:9px; }
/* Faint scanline wash across the card — the same cyberpunk instrument grammar
   as the revenue ruler above it, without competing with it for attention. */
.eo-funds-rail::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:repeating-linear-gradient(180deg, rgba(var(--accent-rgb),.035) 0 1px, transparent 1px 4px);
  opacity:.6;
}
.eo-funds-rail > *{ position:relative; z-index:1; }

.eo-funds-delta{
  padding:2px 7px; border:1px solid var(--line-bright); border-radius:10px;
  color:var(--faint); font:600 9px/1 var(--font-mono); letter-spacing:.08em; white-space:nowrap;
}
.eo-funds-delta.is-up{ color:var(--good); border-color:rgba(var(--good-rgb),.45); }
.eo-funds-delta.is-down{ color:var(--danger); border-color:rgba(var(--danger-rgb),.45); }

.eo-funds-readout{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin-top:9px; }
.eo-funds-total{
  font:700 30px/1 var(--font-display); letter-spacing:-.01em;
  color:var(--good); text-shadow:0 2px 22px rgba(var(--good-rgb),.28);
  font-variant-numeric:tabular-nums;
}
.eo-funds-total.is-neg{ color:var(--danger); text-shadow:0 2px 22px rgba(var(--danger-rgb),.28); }
/* Debt rides the same baseline as the headroom figure: two readings, one
   line, so the pair is taken in at a glance without a second row of height. */
.eo-funds-debt-slot{ display:inline-flex; align-items:baseline; }
.eo-funds-debt{
  display:inline-flex; align-items:baseline; gap:5px;
  color:var(--danger); font:700 15px/1 var(--font-mono);
  font-variant-numeric:tabular-nums;
}

.eo-funds-bar{
  display:flex; gap:2px; height:9px; margin-top:9px;
  border:1px solid var(--line-bright); padding:1px;
  background:var(--card-subtle);
}
.eo-funds-seg{
  min-width:3px;
  background:linear-gradient(180deg, var(--good), rgba(var(--good-rgb),.42));
  box-shadow:0 0 8px rgba(var(--good-rgb),.35) inset;
}
/* Overdrawn: same track, hatched so it reads as debt at a glance rather than
   as just another colour of the same quantity. */
.eo-funds-seg.is-neg{
  background:repeating-linear-gradient(135deg,
    var(--danger) 0 3px, rgba(var(--danger-rgb),.32) 3px 6px);
  box-shadow:none;
}
.eo-funds-seg.is-empty{
  background:repeating-linear-gradient(90deg, var(--line-bright) 0 1px, transparent 1px 6px);
}

/* ----- The sheet ----- */
.eo-funds-sheet{ margin-top:12px; padding-top:10px; border-top:1px solid var(--line); }
.eo-funds-row{
  display:grid; grid-template-columns:minmax(0,1fr) 62px 62px 16px;
  align-items:center; gap:6px;
}
.eo-funds-row.is-head{
  margin-bottom:4px;
  color:var(--faint); font:600 8.5px/1 var(--font-mono); letter-spacing:.12em;
}
.eo-funds-row.is-head span:nth-child(2),
.eo-funds-row.is-head span:nth-child(3){ text-align:right; }
.eo-funds-in{
  min-width:0; height:26px; padding:0 4px;
  border:0; border-bottom:1px solid var(--line); border-radius:0;
  background:transparent; color:var(--text);
  font:500 12px/1 var(--font-body);
  transition:border-color var(--t-snap) var(--ease), background var(--t-snap) var(--ease);
}
.eo-funds-in::placeholder{ color:var(--faint); opacity:.7; }
.eo-funds-in:focus{
  outline:none; border-bottom-color:var(--accent);
  background:rgba(var(--accent-rgb),.06);
}
.eo-funds-in.is-num{
  text-align:right; font-family:var(--font-mono); font-size:11.5px;
  font-variant-numeric:tabular-nums;
}
.eo-funds-in.is-play{ color:var(--good); font-weight:650; }
.eo-funds-in.is-play.is-neg,
.eo-funds-in.is-num.is-neg{ color:var(--danger); }
.eo-funds-del{
  width:16px; height:16px; padding:0; cursor:pointer;
  border:0; background:none; color:var(--faint);
  font:400 10px/1 var(--font-body); opacity:0;
  transition:opacity var(--t-snap) var(--ease), color var(--t-snap) var(--ease);
}
.eo-funds-row:hover .eo-funds-del,
.eo-funds-row:focus-within .eo-funds-del{ opacity:1; }
.eo-funds-del:hover{ color:var(--danger); }
.eo-funds-fixed{
  min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  padding:0 4px; color:var(--accent);
  font:650 12px/26px var(--font-body); letter-spacing:.01em;
  border-bottom:1px solid rgba(var(--accent-rgb),.28);
}
.eo-funds-row.is-fixed .eo-funds-in{ border-bottom-color:rgba(var(--accent-rgb),.28); }
.eo-funds-lock{ color:rgba(var(--accent-rgb),.5); font-size:7px; text-align:center; }
.eo-funds-add{
  display:block; width:100%; height:28px; margin-top:10px; cursor:pointer;
  border:1px dashed var(--line-bright); border-radius:6px;
  background:transparent; color:var(--muted);
  font:600 9.5px/1 var(--font-mono); letter-spacing:.12em;
  transition:color var(--t-snap) var(--ease), border-color var(--t-snap) var(--ease);
}
.eo-funds-add:hover{ color:var(--accent); border-color:var(--accent); }

/* ----- The trail ----- */
.eo-funds-trail{ margin-top:12px; padding-top:10px; border-top:1px solid var(--line); }
.eo-funds-trail-head{
  display:flex; justify-content:space-between; align-items:baseline;
  color:var(--faint); font:500 9px/1 var(--font-mono); letter-spacing:.08em;
}
.eo-funds-spark{ display:flex; align-items:flex-end; gap:3px; height:26px; margin-top:10px; }
.eo-funds-spark i{ flex:1; min-height:2px; border-radius:1px; background:rgba(var(--good-rgb),.45); }
.eo-funds-spark i.is-neg{ background:rgba(var(--danger-rgb),.5); }
.eo-funds-entry{
  display:flex; align-items:baseline; padding:5px 0; cursor:pointer;
  border-bottom:1px solid var(--line-soft); font:400 12px/1.4 var(--font-body);
}
.eo-funds-entry:last-of-type{ border-bottom:0; }
.eo-funds-entry:hover{ background:rgba(var(--accent-rgb),.05); }
.eo-funds-entry:hover .eo-funds-entry-date{ color:var(--muted); }
.eo-funds-entry-date{ flex:none; font-family:var(--font-mono); font-size:10.5px; letter-spacing:.06em; color:var(--faint); }
.eo-funds-entry-leader{ flex:1; margin:0 8px; align-self:flex-end; height:5px; border-bottom:1px dotted var(--line-bright); }
.eo-funds-entry b{ flex:none; font-weight:650; color:var(--text); font-variant-numeric:tabular-nums; }
.eo-funds-entry b.is-neg{ color:var(--danger); }
.eo-funds-hint{ margin:6px 0 0; color:var(--faint); font:400 10.5px/1.5 var(--font-body); }
.eo-funds-link{
  display:block; width:100%; margin-top:11px; padding:0; cursor:pointer;
  border:0; background:none; color:var(--faint);
  font:600 9.5px/1 var(--font-mono); letter-spacing:.14em;
}
.eo-funds-link:hover{ color:var(--accent); }

/* ----- Rail: playing points, over time -----
   Same readout chrome as the funds card, but the whole face is the plot: a
   line built on a real time scale rather than one point per entry (see
   pointsTrendChartSvg in eo-command.js). */
.eo-points-trend-rail .eo-funds-readout{ margin-top:6px; }
.eo-ptt-xtick{ fill:var(--faint); font:400 9px/1 var(--font-mono); text-anchor:middle; }

/* ----- Rail: tasks-closed heatmap -----
   Twelve columns (weeks) of six rows (Mon–Sat). Sunday is deliberately not
   drawn: a rest day rendered as an empty cell reads as a miss. */
.eo-hm-card{ background:rgba(var(--panel-rgb),.72); }
.eo-hm-grid{
  display:grid;
  grid-auto-flow:column;
  grid-template-rows:repeat(6,1fr);
  grid-template-columns:repeat(12,1fr);
  gap:3px; margin-top:11px;
}
.eo-hm-cell{ aspect-ratio:1; border-radius:2px; background:rgba(var(--accent-rgb),.1); }
.eo-hm-cell[data-shade="1"]{ background:rgba(var(--good-rgb),.22); }
.eo-hm-cell[data-shade="2"]{ background:rgba(var(--good-rgb),.36); }
.eo-hm-cell[data-shade="3"]{ background:rgba(var(--good-rgb),.5); }
.eo-hm-cell[data-shade="4"]{ background:rgba(var(--good-rgb),.66); }
.eo-hm-cell[data-shade="5"]{ background:rgba(var(--good-rgb),.82); }
.eo-hm-cell[data-shade="6"]{ background:var(--good); }
.eo-hm-cell.is-today{ box-shadow:0 0 0 1px var(--accent); }
.eo-hm-cell.is-future{ opacity:.3; }
.eo-hm-foot{
  display:flex; justify-content:space-between; align-items:baseline; gap:8px;
  margin-top:10px; color:var(--faint); font:400 10.5px/1 var(--font-body);
}
.eo-hm-note{ font:500 9px/1 var(--font-mono); letter-spacing:.1em; }

/* ----- Responsive ----- */
@media (max-width:760px){
  .eo-cmd-hero-visual{ display:none; }
  .eo-cmd-hero-main{ padding-right:0; }
  .eo-rail-top{ flex-wrap:wrap; }
}

.eo-command-notice{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:36px;
  padding:8px 12px;
  border:1px solid rgba(var(--good-rgb),.3);
  background:rgba(var(--good-rgb),.07);
  color:var(--good);
  font:600 11px/1.2 var(--font-mono);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.eo-command-notice.is-warn{
  border-color:rgba(var(--warn-rgb),.35);
  background:rgba(var(--warn-rgb),.08);
  color:var(--warn);
}
.eo-command-vector{
  display:grid;
  grid-template-columns:minmax(0,1.65fr) minmax(220px,.85fr) minmax(160px,.5fr);
  border:1px solid var(--line-strong);
  background:var(--card-subtle);
}
.eo-command-vector > div{
  min-width:0;
  padding:18px;
}
.eo-command-vector > div + div{ border-left:1px solid var(--line); }
.eo-command-vector > div > span{
  display:block;
  margin-bottom:10px;
  color:var(--faint);
  font:700 10px/1 var(--font-mono);
  letter-spacing:.16em;
}
.eo-vector-now{ position:relative; background:var(--card); }
.eo-vector-now::after{
  content:'';
  position:absolute;
  left:18px;
  top:0;
  width:56px;
  height:1px;
  background:var(--accent);
}
.eo-vector-now h3{
  max-width:780px;
  margin:0 0 8px;
  color:var(--text);
  font:650 28px/1.1 var(--font-display);
  letter-spacing:-.035em;
  text-wrap:balance;
}
.eo-vector-now p,
.eo-vector-later p{ margin:0 0 14px; color:var(--muted); line-height:1.5; }
.eo-vector-next ol{ display:flex; flex-direction:column; gap:8px; margin:0; padding:0; list-style:none; }
.eo-vector-next li{ display:flex; gap:10px; align-items:flex-start; padding:7px 0; border-bottom:1px solid var(--line-soft); }
.eo-vector-next li:last-child{ border-bottom:0; }
.eo-vector-next li b{ flex:none; color:var(--accent); font:600 10px/1.6 var(--font-mono); }
.eo-vector-next li span{ color:var(--text); font-size:12px; line-height:1.4; }
.eo-vector-next li.is-empty span{ color:var(--faint); }
.eo-command-grid{ grid-template-columns:minmax(0,1.1fr) minmax(260px,.9fr); }
.eo-live-command{ display:grid; grid-template-columns:1fr auto; gap:8px 16px; align-items:center; }
.eo-live-command > div{ display:flex; flex-direction:column; gap:7px; }
.eo-live-command > div b{ font:650 18px/1.2 var(--font-display); }
.eo-live-command > strong{
  color:var(--accent);
  font:600 26px/1 var(--font-mono);
  font-variant-numeric:tabular-nums;
}
.eo-live-command p{ grid-column:1/-1; margin:0; color:var(--muted); font:500 10px/1.4 var(--font-mono); text-transform:uppercase; letter-spacing:.08em; }
.eo-live-command .eo-btn{ width:max-content; }
.eo-tier-stack{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.eo-tier-row{ display:flex; flex-direction:column; gap:7px; }
.eo-tier-row > div{ display:flex; justify-content:space-between; gap:8px; }
.eo-tier-row > div span{ color:var(--text); font-weight:650; }
.eo-tier-row > div b{ color:var(--faint); font:600 10px/1.4 var(--font-mono); }
.eo-tier-row > i{ display:block; height:3px; background:rgba(var(--text-rgb),.07); overflow:hidden; }
.eo-tier-row > i em{ display:block; height:100%; background:var(--accent); }
.eo-tier-row.is-complete > i em{ background:var(--good); }
.eo-tier-row.is-complete > div b{ color:var(--good); }
.eo-tier-row p{ margin:0; color:var(--muted); font-size:11px; line-height:1.45; }
.eo-proof-list time{ margin-left:auto; color:var(--faint); font:500 9px/1.3 var(--font-mono); font-variant-numeric:tabular-nums; }
.eo-recovery-green{ color:var(--good); border-color:rgba(var(--good-rgb),.28); }
.eo-recovery-amber{ color:var(--warn); border-color:rgba(var(--warn-rgb),.28); }
.eo-recovery-red,.eo-recovery-black{ color:var(--danger); border-color:rgba(var(--danger-rgb),.28); }

/* ----- Rescue protocol ----- */
.eo-rescue-shell{
  width:min(880px,100%);
  margin:24px auto 60px;
  display:flex;
  flex-direction:column;
  gap:20px;
}
.eo-rescue-head{ text-align:left; border-left:2px solid var(--warn); padding-left:16px; }
.eo-rescue-head h2{ margin:6px 0 4px; font-size:28px; letter-spacing:-.035em; }
.eo-rescue-progress{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:0;
  margin:0;
  padding:0;
  list-style:none;
  border:1px solid var(--line);
}
.eo-rescue-progress li{ display:flex; align-items:center; gap:7px; min-height:42px; padding:8px 10px; color:var(--faint); border-right:1px solid var(--line-soft); }
.eo-rescue-progress li:last-child{ border-right:0; }
.eo-rescue-progress li b{ font:600 9px/1 var(--font-mono); }
.eo-rescue-progress li span{ font:600 10px/1.2 var(--font-mono); text-transform:uppercase; letter-spacing:.08em; }
.eo-rescue-progress li.active{ color:var(--warn); background:rgba(var(--warn-rgb),.07); }
.eo-rescue-progress li.done{ color:var(--good); }
.eo-rescue-stage{ min-height:360px; }
.eo-rescue-focus{
  display:flex;
  min-height:340px;
  padding:32px;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:14px;
  text-align:center;
  border:1px solid rgba(var(--warn-rgb),.28);
  background:var(--card);
}
.eo-rescue-focus > strong{
  color:var(--warn);
  font:650 72px/1 var(--font-mono);
  font-variant-numeric:tabular-nums;
  letter-spacing:-.06em;
}
.eo-rescue-focus p{ max-width:520px; margin:0; color:var(--muted); font-size:14px; }
.eo-rescue-dump{ min-height:230px; font-size:16px; line-height:1.55; }
.eo-choice-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.eo-choice{
  display:flex;
  min-height:48px;
  padding:10px 12px;
  align-items:flex-start;
  justify-content:center;
  flex-direction:column;
  gap:3px;
  color:var(--muted);
  text-align:left;
  border:1px solid var(--line);
  background:var(--card-subtle);
  cursor:pointer;
  transition:border-color var(--t-snap) var(--ease), color var(--t-snap) var(--ease), background var(--t-snap) var(--ease), transform var(--t-snap) var(--ease);
}
.eo-choice:hover{ color:var(--text); border-color:var(--line-bright); }
.eo-choice:active{ transform:scale(.98); }
.eo-choice.selected{ color:var(--accent); border-color:rgba(var(--accent-rgb),.5); background:rgba(var(--accent-rgb),.07); }
.eo-choice b{ color:inherit; font-size:12px; }
.eo-choice span{ color:var(--faint); font-size:10px; line-height:1.35; }
.eo-commit-input{ min-height:52px; font-size:16px; }
.eo-rescue-return{ display:flex; flex-direction:column; gap:8px; padding:8px 0 18px; }
.eo-rescue-return h3{ margin:0; font:650 28px/1.15 var(--font-display); }
.eo-rescue-return p{ margin:0; font-size:17px; color:var(--text); }
.eo-rescue-return > span:last-child{ color:var(--muted); }
body.eo-rescue .nav-rail-list > .eo-primary-nav{ display:flex !important; }
body.eo-rescue .eo-primary-nav > *{ display:none !important; }
body.eo-rescue .eo-primary-nav > .eo-nav-sec-main,
body.eo-rescue .eo-primary-nav > #navOSCommand{ display:flex !important; }

/* ----- Guided Today / Review ----- */
#eoTodayPanel .eo-tabs-wrap{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:4px;
  padding:4px;
  overflow:visible;
}
#eoTodayPanel .eo-tabs-wrap .eo-tab{ justify-content:flex-start; min-height:34px; padding:7px 9px; font-size:9px; }
#eoTodayPanel .eo-tabs-wrap .eo-tab:disabled{ opacity:.35; cursor:not-allowed; }
#eoTodayPanel .eo-tabs-wrap .eo-tab.active{ border-color:rgba(var(--accent-rgb),.28); background:rgba(var(--accent-rgb),.09); }
#eoTodayPanel .eo-telemetry-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
#eoTodayPanel .eo-big-stat{ font-variant-numeric:tabular-nums; }

/* Daily briefings: compact linear paths with the active decision in focus. */
#eoTodayPanel .eo-ritual-steps{ grid-template-columns:repeat(5,minmax(112px,1fr)); }
#eoTodayPanel .eo-ritual-steps-evening{ grid-template-columns:repeat(4,minmax(112px,1fr)); }
#eoTodayPanel .eo-ritual-steps .eo-tab{ display:flex; align-items:center; gap:6px; }
#eoTodayPanel .eo-ritual-steps .eo-tab>span{ color:var(--faint); font-family:var(--font-mono); }
.eo-ritual-controls{ display:flex; justify-content:flex-end; gap:8px; padding-top:4px; }
.eo-validation{ border-left-color:var(--warning); }
.eo-ritual-reading .eo-card-body{ gap:16px; }
.eo-reading-layout{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,300px); gap:24px; align-items:start; }
.eo-reading-copy{ max-width:78ch; color:var(--text); font-size:16px; line-height:1.75; text-wrap:pretty; }
.eo-reading-copy p{ margin:0 0 1em; }
.eo-reading-images{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.eo-reading-images img{ width:100%; height:130px; object-fit:cover; border-radius:var(--r-md); outline:1px solid rgba(255,255,255,.1); }
.eo-reading-images img:first-child{ grid-column:span 2; height:190px; }
.eo-today-task-list,.eo-tomorrow-list,.eo-task-plan-stack,.eo-summary-tasks{ display:flex; flex-direction:column; gap:8px; }
.eo-today-task{
  display:grid; grid-template-columns:24px minmax(0,1fr) 32px; align-items:center; gap:10px;
  padding:10px 12px; border-radius:var(--r-md); background:var(--card-subtle); border:1px solid var(--line-soft);
}
.eo-today-task>input[type=checkbox],.eo-micro-row>input[type=checkbox],.eo-tomorrow-task>input[type=checkbox]{ accent-color:var(--accent); }
.eo-today-task.is-done{ opacity:.58; }
.eo-today-task.is-done .eo-task-title-input{ text-decoration:line-through; }
.eo-today-task-main{ min-width:0; }
.eo-task-title-input{ width:100%; padding:2px 0; border:0; outline:0; background:transparent; color:var(--text); font:650 var(--fs-body)/1.35 var(--font-body); }
.eo-task-meta{ display:flex; gap:10px; flex-wrap:wrap; margin-top:3px; color:var(--faint); font-size:var(--fs-caption); }
.eo-task-source{ display:inline-flex; align-items:center; width:max-content; color:var(--muted); font:650 10px/1.2 var(--font-mono); text-transform:uppercase; letter-spacing:.06em; }
.eo-task-priority{ color:var(--faint); font:700 var(--fs-caption)/1 var(--font-mono); text-align:center; }
.eo-task-add{ display:flex; gap:8px; margin-top:12px; }
.eo-task-plan-stack>.eo-task-plan-card{ width:100%; }
.eo-task-plan-card .eo-card-head{ position:sticky; top:0; z-index:2; background:var(--card); }
.eo-task-plan-card .eo-card-title{ color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.eo-task-plan-card textarea{ resize:vertical; line-height:1.45; }
.eo-task-plan-card .eo-priority-field{ max-width:150px; }
.eo-next-tiny{ border-color:rgba(var(--accent-rgb),.35); }
.eo-micro-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding-top:4px; }
.eo-micro-list{ display:flex; flex-direction:column; gap:6px; }
.eo-micro-row{ display:grid; grid-template-columns:22px minmax(0,1fr) 32px 32px 32px; align-items:center; gap:5px; }
.eo-micro-row.is-done .eo-input{ text-decoration:line-through; color:var(--faint); }
.eo-icon-btn{ width:32px; height:32px; display:grid; place-items:center; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--card-subtle); color:var(--muted); cursor:pointer; }
.eo-icon-btn:hover:not(:disabled){ color:var(--text); border-color:var(--line-bright); }
.eo-icon-btn:disabled{ opacity:.3; cursor:not-allowed; }
.eo-weekly-mission{ font-size:20px; line-height:1.4; color:var(--text); font-weight:650; text-wrap:balance; }
.eo-weekly-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.eo-weekly-value{ padding:10px 12px; border-radius:var(--r-md); background:var(--card-subtle); }
.eo-weekly-value>span{ color:var(--faint); font:700 var(--fs-caption)/1 var(--font-mono); text-transform:uppercase; letter-spacing:.07em; }
.eo-weekly-value>p{ margin:6px 0 0; color:var(--text); line-height:1.45; }
.eo-weekly-grid-compact{ margin-top:4px; }
.eo-weekly-grid-compact .eo-weekly-value{ padding:7px 10px; }
.eo-weekly-grid-compact .eo-weekly-value>span{ font-size:10px; }
.eo-weekly-grid-compact .eo-weekly-value>p{ margin-top:3px; font-size:var(--fs-small); line-height:1.35; }
.eo-summary-status{ display:flex; gap:8px; flex-wrap:wrap; }
.eo-summary-status>span{ padding:5px 8px; border:1px solid var(--line); border-radius:999px; color:var(--muted); font:650 var(--fs-caption)/1 var(--font-mono); }
.eo-summary-status>span.is-complete{ color:var(--good); border-color:rgba(var(--good-rgb),.28); }
.eo-checkin-summary{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.eo-checkin-summary>span{ display:flex; justify-content:space-between; gap:10px; padding:7px 9px; border-radius:var(--r-sm); background:var(--card-subtle); color:var(--text); font:600 var(--fs-caption)/1.3 var(--font-mono); }
.eo-habit-week-wrap{ overflow-x:auto; }
.eo-habit-week-table{ width:100%; border-collapse:collapse; font-size:var(--fs-small); }
.eo-habit-week-table th,.eo-habit-week-table td{ padding:7px 9px; text-align:center; border-bottom:1px solid var(--line-soft); }
.eo-habit-week-table thead th{ color:var(--faint); font:700 var(--fs-caption)/1 var(--font-mono); text-transform:uppercase; letter-spacing:.06em; }
.eo-habit-week-table th:first-child{ text-align:left; color:var(--text); font-weight:600; white-space:nowrap; }
.eo-habit-week-group th{ text-align:left; background:var(--card-subtle); color:var(--muted); font:700 var(--fs-caption)/1 var(--font-mono); text-transform:uppercase; letter-spacing:.06em; padding-top:10px; }
.eo-habit-week-cell{ color:var(--faint); }
.eo-habit-week-cell.is-done{ color:var(--good); font-weight:700; }
.eo-checkin-summary b{ color:var(--faint); font-weight:600; }
.eo-summary-details{ margin-top:10px; color:var(--muted); }
.eo-summary-details summary{ cursor:pointer; color:var(--text); font-size:var(--fs-small); }
.eo-summary-details p{ white-space:pre-wrap; line-height:1.55; }
.eo-summary-task{ padding:11px 12px; border-left:2px solid var(--line-strong); background:var(--card-subtle); border-radius:0 var(--r-md) var(--r-md) 0; }
.eo-summary-task>div{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.eo-summary-task p{ margin:7px 0 0; color:var(--muted); font-size:var(--fs-small); }
.eo-summary-task p>span{ color:var(--faint); font:700 var(--fs-caption)/1 var(--font-mono); text-transform:uppercase; }
.eo-summary-task ul{ margin:8px 0 0; padding-left:20px; color:var(--muted); font-size:var(--fs-small); }
.eo-summary-task li.is-done{ text-decoration:line-through; color:var(--faint); }
.eo-vision-preview{ margin-bottom:10px; }
.eo-tomorrow-task{ display:grid; grid-template-columns:22px minmax(0,1fr) auto; align-items:center; gap:8px; }
.eo-routine-block{ display:flex; flex-direction:column; gap:8px; }
.eo-routine-strip{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; }
.eo-routine-check{
  min-height:72px; padding:10px; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:3px; text-align:center; color:var(--text); background:var(--card-subtle);
  border:1px solid var(--line); border-radius:var(--r-md); cursor:pointer;
  transition:background var(--t-snap) var(--ease),border-color var(--t-snap) var(--ease),transform var(--t-snap) var(--ease);
}
.eo-routine-check:hover{ border-color:var(--line-bright); background:var(--card-hover); }
.eo-routine-check:active{ transform:scale(.98); }
.eo-routine-check>span{ font-size:20px; line-height:1; }
.eo-routine-check>b{ min-width:0; font-size:var(--fs-small); line-height:1.25; text-wrap:balance; color:var(--accent); font-weight:650; }
.eo-routine-check>i{ color:var(--faint); font:650 var(--fs-caption)/1 var(--font-mono); font-style:normal; text-transform:uppercase; letter-spacing:.06em; }
.eo-routine-check.is-done{ border-color:rgba(var(--good-rgb),.3); background:rgba(var(--good-rgb),.07); }
.eo-routine-check.is-done>i{ color:var(--good); }
.eo-routine-wide-row{ display:flex; }
.eo-routine-check-wide{ flex:1 1 auto; flex-direction:row; justify-content:space-between; min-height:44px; padding:11px 16px; }
.eo-routine-check-wide>b{ font-size:var(--fs-base,15px); }
/* Daily Routine card (Command rail). One segment per habit, grouped into the
   three routine periods; the segment strip is the day's progress bar and the
   names below it are what is left. A logged habit keeps its filled segment and
   its name is struck through, so the upright names ARE the remaining list.
   Each segment paints a 6px bar through ::before while the button stays 14px
   tall, so the strip reads thin but keeps a real click target. The strip is a
   neon tube: dim glass when empty, ignites to saturated green when done. */
.eo-hs-bar{ display:flex; align-items:center; gap:10px; }
.eo-hs-count{ flex:none; color:var(--faint); font:700 15px/1 var(--font-mono); font-variant-numeric:tabular-nums; }
.eo-hs-count>b{ color:var(--text); font-weight:700; }
.eo-routine-card .eo-pill-toggle{ margin-left:auto; }
.eo-hs-track{ display:flex; gap:6px; margin-top:11px; }
.eo-hs-group{
  flex:1; min-width:0; display:flex; gap:0;
  height:14px; padding:2px;
  background:linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.35));
  border:1px solid rgba(var(--text-rgb),.12);
  box-shadow:
    0 0 0 1px rgba(0,0,0,.6) inset,
    0 2px 4px rgba(0,0,0,.5),
    0 0 14px rgba(var(--accent-rgb),.06);
}
.eo-hs-seg{
  flex:1; min-width:0; height:100%; padding:0; border:0; margin:0;
  background:none; cursor:pointer; display:flex; align-items:center;
  position:relative;
}
.eo-hs-seg::before{
  content:''; display:block; width:100%; height:100%;
  background:rgba(var(--text-rgb),.05);
  transition:background var(--t-snap) var(--ease), box-shadow var(--t-snap) var(--ease);
}
.eo-hs-seg:hover::before{ background:rgba(var(--accent-rgb),.18); }
.eo-hs-seg.is-done::before{
  background:rgba(var(--good-rgb),1);
  box-shadow:
    0 0 6px rgba(var(--good-rgb),.95),
    0 0 14px rgba(var(--good-rgb),.55),
    0 0 24px rgba(var(--good-rgb),.4);
}
.eo-hs-seg.is-done:hover::before{
  background:rgba(var(--good-rgb),1);
  box-shadow:
    0 0 8px rgba(var(--good-rgb),1),
    0 0 18px rgba(var(--good-rgb),.65),
    0 0 28px rgba(var(--good-rgb),.45);
}
.eo-hs-seg:focus-visible{ outline:2px solid rgba(var(--accent-rgb),.8); outline-offset:1px; }
.eo-hs-detail{ margin-top:13px; }
.eo-hs-cols{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.eo-hs-col-label{
  margin-bottom:6px; color:var(--faint);
  font:600 9px/1 var(--font-mono); letter-spacing:.12em;
}
.eo-hs-item{
  display:flex; align-items:baseline; gap:6px; width:100%; min-width:0;
  padding:3px 0; border:0; background:none; cursor:pointer; text-align:left;
  font-family:var(--font-body);
}
.eo-hs-item>span:first-child{ flex:none; color:var(--faint); font-size:13px; line-height:1; }
.eo-hs-item>span:last-child{
  min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  color:var(--text); font:400 12px/1.3 var(--font-body);
}
.eo-hs-item:hover>span:last-child{ color:var(--accent); }
.eo-hs-item.is-done>span:first-child{ color:var(--good); }
.eo-hs-item.is-done>span:last-child{ color:var(--faint); text-decoration:line-through; }
.eo-hs-logged{ margin-top:11px; color:var(--good); font:600 10px/1 var(--font-mono); letter-spacing:.06em; }
.eo-hs-alldone{ margin-top:11px; color:var(--good); font:600 10px/1 var(--font-mono); letter-spacing:.1em; }
@media (max-width:900px){ .eo-hs-cols{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.eo-meditation-grid{ display:flex; flex-direction:column; gap:14px; }
.eo-meditation-duration{ max-width:220px; }
.eo-task-workbench{ display:grid; grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr); gap:14px; align-items:start; }
.eo-planning-prompt{ margin:0; color:var(--text); font-size:15px; line-height:1.65; text-wrap:pretty; }
.eo-planning-cues{ display:grid; gap:6px; }
.eo-planning-cues>span{ padding:7px 9px; border-left:2px solid var(--line-strong); color:var(--muted); background:var(--card-subtle); font-size:var(--fs-small); }
.eo-check-stack{ align-items:flex-start; flex-direction:column; gap:8px; }
.eo-tomorrow-add-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.eo-tomorrow-add-grid>#eoTomorrowTaskNew,.eo-tomorrow-add-grid>#eoTomorrowNotes{ grid-column:span 2; }
.eo-tomorrow-add-grid>.eo-btn{ align-self:stretch; }
#eoSprintsPanel .eo-grid-3 > .eo-card{ min-height:140px; }
#eoSprintsPanel #eoWeeklyReviewForm > .eo-card{ align-self:start; }

/* Connected planning surfaces: a softer workbench layer inside the command deck. */
.eo-panel .eo-btn:focus-visible,.eo-panel .eo-icon-btn:focus-visible,.eo-panel .eo-input:focus-visible{
  outline:2px solid rgba(var(--accent-rgb),.8); outline-offset:2px;
}
.eo-panel .eo-btn{ min-height:38px; padding-inline:15px; }
.eo-panel .eo-btn-sm{ min-height:32px; padding-inline:11px; }
.eo-task-workbench{ grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr); gap:18px; }
.eo-task-workbench>aside{ display:flex; flex-direction:column; gap:14px; min-width:0; }
.eo-live-todo-card,.eo-thinking-card,.eo-todo-record,.eo-planning-pool-card,.eo-week-day-card,.eo-week-column{
  border-radius:14px !important;
}
.eo-live-todo-card{ overflow:hidden; box-shadow:0 12px 36px rgba(0,0,0,.16); }
.eo-thinking-card{ background:linear-gradient(180deg,rgba(var(--accent-rgb),.035),transparent 48%),var(--card); }
.eo-thinking-card .eo-ta{ min-height:210px; padding:13px 14px; line-height:1.65; }
.eo-shared-todo-list{ display:flex; flex-direction:column; gap:10px; }
.eo-todo-record{
  padding:12px; background:var(--card-subtle); border:1px solid var(--line-soft);
  transition:border-color var(--t-snap) var(--ease),background var(--t-snap) var(--ease),opacity var(--t-snap) var(--ease);
}
.eo-todo-record:hover,.eo-todo-record.is-selected{ border-color:rgba(var(--accent-rgb),.38); background:rgba(var(--accent-rgb),.045); }
.eo-todo-record.is-done{ opacity:.62; }
.eo-todo-record.is-done .eo-task-title-input{ text-decoration:line-through; }
.eo-todo-record-head{ display:grid; grid-template-columns:24px minmax(0,1fr) auto; gap:10px; align-items:start; }
.eo-todo-record-head>input,.eo-todo-record .eo-micro-row>input[type=checkbox]{ accent-color:var(--accent); margin-top:7px; }
.eo-todo-record-title{ min-width:0; }
.eo-todo-record-actions{ display:flex; align-items:center; gap:5px; }
.eo-task-status-chip{
  padding:5px 8px; border:1px solid var(--line); border-radius:999px; color:var(--faint);
  font:700 9px/1 var(--font-mono); text-transform:uppercase; letter-spacing:.08em;
}
.eo-plan-task-btn{ width:auto; padding:0 9px; font:700 9px/1 var(--font-mono); text-transform:uppercase; }
.eo-micro-list-inline{ margin:10px 0 4px 34px; padding-left:10px; border-left:1px solid var(--line); }
.eo-add-inline-step{ margin-left:34px; color:var(--accent-soft); }
.eo-task-progress{ display:grid; grid-template-columns:auto minmax(90px,1fr); gap:12px; align-items:center; margin-bottom:12px; }
.eo-task-progress>span{ color:var(--muted); font:650 10px/1 var(--font-mono); text-transform:uppercase; letter-spacing:.07em; }
.eo-task-progress>span b{ color:var(--text); }
.eo-task-progress>i{ height:5px; overflow:hidden; background:var(--card-subtle); border-radius:999px; }
.eo-task-progress>i>b{ display:block; height:100%; border-radius:inherit; background:var(--accent); transition:width .2s var(--ease); }
.eo-tomorrow-intro{ display:grid; grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr); gap:14px; }
.eo-planning-source-list,.eo-allocation-list{ display:flex; flex-direction:column; gap:8px; max-height:520px; overflow:auto; padding-right:3px; }
.eo-planning-source-row,.eo-allocation-source,.eo-allocation-task,.eo-week-queue-row{
  display:flex; justify-content:space-between; align-items:center; gap:12px; padding:10px 11px;
  background:var(--card-subtle); border:1px solid var(--line-soft); border-radius:10px;
}
.eo-planning-source-row>div,.eo-allocation-source>div,.eo-allocation-task>div,.eo-week-queue-row>div{ min-width:0; display:flex; flex-direction:column; gap:3px; }
.eo-planning-source-row b,.eo-allocation-source b,.eo-allocation-task b,.eo-week-queue-row b{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--fs-small); }
.eo-planning-source-row span,.eo-allocation-source span,.eo-allocation-task span,.eo-week-queue-row span{ color:var(--faint); font:600 9px/1.3 var(--font-mono); text-transform:uppercase; }
.eo-allocation-task .eo-input,.eo-week-queue-row .eo-input{ width:min(230px,45%); flex:none; font-size:var(--fs-caption); }

/* Retrospective: a small, scoped table of the week's finished work, grouped by project. */
.eo-completed-week-card .eo-card-body{ max-height:340px; overflow:auto; padding:0; }
.eo-completed-table-wrap{ overflow-x:auto; }
.eo-completed-table{ width:100%; border-collapse:collapse; font-size:var(--fs-caption); }
.eo-completed-table th,.eo-completed-table td{ text-align:left; padding:7px 11px; border-bottom:1px solid var(--line-soft); }
.eo-completed-table thead th{ position:sticky; top:0; z-index:1; background:var(--card-subtle); color:var(--faint); font:700 9px/1.3 var(--font-mono); text-transform:uppercase; letter-spacing:.08em; }
.eo-completed-table td:first-child{ color:var(--text); }
.eo-completed-table td:nth-child(2),.eo-completed-table td:last-child{ color:var(--muted); white-space:nowrap; }
.eo-completed-group-row>th{ background:var(--card-subtle); color:var(--accent-soft); font:700 10px/1.3 var(--font-mono); text-transform:uppercase; letter-spacing:.06em; }
.eo-completed-group-row>th span{ color:var(--faint); }

/* Weekly review timeline and five-week allocation runway. */
.eo-section-intro{ display:flex; justify-content:space-between; align-items:flex-end; gap:18px; margin:8px 0 2px; }
.eo-section-intro h3{ margin:4px 0 0; color:var(--text); font:650 23px/1.2 var(--font-display); letter-spacing:-.025em; text-wrap:balance; }
.eo-week-summary-strip>.eo-card{ min-height:0 !important; }
.eo-week-timeline-card .eo-card-body{ overflow-x:auto; }
.eo-week-daily-timeline{ display:grid; grid-template-columns:repeat(7,minmax(210px,1fr)); gap:10px; min-width:1510px; }
.eo-week-day-card{ padding:12px; background:var(--card-subtle); border:1px solid var(--line-soft); }
.eo-week-day-card>header{ display:flex; justify-content:space-between; gap:8px; font:700 9px/1 var(--font-mono); text-transform:uppercase; letter-spacing:.08em; color:var(--faint); }
.eo-week-day-card>header span{ color:var(--accent-soft); }
.eo-week-day-goal{ min-height:48px; margin:12px 0 9px; color:var(--text); font-size:var(--fs-small); line-height:1.5; }
.eo-week-day-stats{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
.eo-week-day-stats span{ padding:5px 6px; border-radius:6px; background:var(--card); color:var(--muted); font:600 9px/1.25 var(--font-mono); }
.eo-week-day-status{ margin:9px 0; color:var(--faint); font:700 9px/1 var(--font-mono); text-transform:uppercase; }
.eo-week-day-status.is-done{ color:var(--good); }
.eo-week-day-card details{ border-top:1px solid var(--line-soft); padding-top:8px; margin-top:8px; color:var(--muted); font-size:var(--fs-caption); }
.eo-week-day-card summary{ cursor:pointer; color:var(--text); }
.eo-week-day-card details p{ line-height:1.5; }
.eo-week-score-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }

/* Retrospective: the process audit is short, so the closeout card is stacked
   under it rather than opening a new full-width row. */
.eo-retro-side-stack{ display:flex; flex-direction:column; gap:14px; min-width:0; align-self:start; }

/* Weekly call + journal review readouts. */
.eo-week-stat-tiles{ display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:10px; }
.eo-week-stat-tile{
  padding:11px 12px; border-radius:10px; background:var(--card-subtle);
  border:1px solid var(--line-soft); display:flex; flex-direction:column; gap:4px; min-width:0;
}
.eo-week-stat-tile b{ color:var(--text); font:650 22px/1.1 var(--font-display); letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.eo-week-stat-tile span{ color:var(--faint); font:700 9px/1.3 var(--font-mono); text-transform:uppercase; letter-spacing:.07em; }
.eo-week-meters{ display:grid; gap:7px; }
.eo-week-meter{ display:grid; grid-template-columns:minmax(96px,150px) minmax(0,1fr) 34px; gap:10px; align-items:center; }
.eo-week-meter>span{ color:var(--muted); font-size:var(--fs-small); }
.eo-week-meter>i{ height:6px; border-radius:99px; background:var(--card-subtle); border:1px solid var(--line-soft); overflow:hidden; }
.eo-week-meter>i>b{ display:block; height:100%; background:var(--accent); border-radius:99px; }
.eo-week-meter>em{ color:var(--text); font:650 11px/1 var(--font-mono); font-style:normal; text-align:right; font-variant-numeric:tabular-nums; }
.eo-week-day-tabs{ display:flex; flex-wrap:wrap; gap:4px; padding:3px; border-bottom:1px solid var(--line-soft); margin-bottom:14px; }
.eo-week-day-tabs .eo-tab{ display:flex; flex-direction:column; align-items:center; gap:2px; min-width:64px; position:relative; }
.eo-week-day-tabs .eo-tab>span{ font:700 9px/1 var(--font-mono); }
.eo-week-day-tabs .eo-tab.is-filled::after{ content:''; position:absolute; top:5px; right:6px; width:5px; height:5px; border-radius:99px; background:var(--accent); }
.eo-week-day-tabs .eo-tab.active.is-filled::after{ background:var(--on-accent); }
.eo-week-log{ display:flex; flex-direction:column; gap:12px; }
.eo-week-log-day{ padding:13px 14px; border-radius:14px; background:var(--card-subtle); border:1px solid var(--line-soft); }
.eo-week-log-day>header{ display:flex; justify-content:space-between; gap:10px; align-items:baseline; }
.eo-week-log-day>header b{ color:var(--text); font:650 14px/1.2 var(--font-display); }
.eo-week-log-day>header span{ color:var(--faint); font:700 9px/1 var(--font-mono); text-transform:uppercase; letter-spacing:.08em; }
.eo-week-log-stats{ display:flex; flex-wrap:wrap; gap:6px; margin:10px 0 2px; }
.eo-week-log-stats span{ padding:5px 8px; border-radius:6px; background:var(--card); color:var(--muted); font:600 9px/1.25 var(--font-mono); }
.eo-week-log-tags{ display:flex; flex-wrap:wrap; gap:6px; margin:10px 0 2px; }
.eo-week-log-subhead{ margin:14px 0 0; padding-top:10px; border-top:1px solid var(--line-soft); color:var(--faint); font:700 9px/1 var(--font-mono); text-transform:uppercase; letter-spacing:.08em; }
.eo-week-log-field{ margin-top:10px; padding-top:9px; border-top:1px solid var(--line-soft); }
.eo-week-log-field>span{ color:var(--faint); font:700 9px/1.3 var(--font-mono); text-transform:uppercase; letter-spacing:.07em; }
.eo-week-log-field>p{ margin:4px 0 0; color:var(--text); font-size:var(--fs-small); line-height:1.6; }
.eo-week-emotion-tally{ display:flex; flex-wrap:wrap; gap:7px; }
.eo-week-emotion{
  display:inline-flex; align-items:baseline; gap:7px; padding:6px 10px; border-radius:99px;
  background:var(--card-subtle); border:1px solid var(--line-soft);
}
.eo-week-emotion b{ color:var(--text); font-size:var(--fs-small); font-weight:600; }
.eo-week-emotion i{ color:var(--faint); font:650 10px/1 var(--font-mono); font-style:normal; }
.eo-week-emotion.is-frequent{ border-color:rgba(var(--accent-rgb),.45); background:rgba(var(--accent-rgb),.08); }
.eo-week-emotion.is-frequent i{ color:var(--accent-soft); }
.eo-next-week-allocation{ display:flex; flex-direction:column; gap:14px; padding-top:6px; }
.eo-goals-intro{ margin-top:14px; }
.eo-five-week-board{ display:grid; grid-template-columns:repeat(5,minmax(220px,1fr)); gap:10px; min-width:1120px; }
#eoSprintsPanel .eo-view-body{ overflow-x:hidden; }
#eoSprintsPanel .eo-five-week-board{ overflow:visible; }
.eo-week-column{ display:flex; flex-direction:column; gap:11px; padding:12px; background:var(--card); border:1px solid var(--line); min-width:0; }
.eo-week-column.is-current{ border-color:rgba(var(--accent-rgb),.48); box-shadow:inset 0 1px 0 rgba(var(--accent-rgb),.16); }
.eo-week-column>header{ display:flex; justify-content:space-between; align-items:flex-start; gap:8px; }
.eo-week-column>header span{ color:var(--faint); font:700 8px/1 var(--font-mono); letter-spacing:.1em; }
.eo-week-column>header h3{ margin:5px 0 0; font:650 14px/1.3 var(--font-display); }
.eo-week-column>header>b{ display:grid; place-items:center; min-width:28px; height:28px; border-radius:50%; background:var(--card-subtle); color:var(--accent-soft); font:700 10px/1 var(--font-mono); }
.eo-week-column-track{ height:4px; overflow:hidden; background:var(--card-subtle); border-radius:999px; }
.eo-week-column-track i{ display:block; height:100%; background:var(--good); border-radius:inherit; }
.eo-week-context{ display:flex; flex-direction:column; gap:5px; }
.eo-week-context-chip{ display:block; padding:6px 7px; background:var(--card-subtle); border-radius:7px; color:var(--muted); font:600 9px/1.3 var(--font-mono); }
.eo-week-context-chip.is-active{ color:var(--accent-soft); background:rgba(var(--accent-rgb),.08); }
.eo-week-column-tasks{ display:flex; flex-direction:column; gap:7px; flex:1; }
.eo-week-column-task{ display:flex; flex-direction:column; gap:7px; padding:8px; border-radius:9px; background:var(--card-subtle); border:1px solid var(--line-soft); }
.eo-week-column-task>div{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.eo-week-column-task b{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--fs-caption); }
.eo-week-column-task span{ color:var(--faint); font:600 8px/1 var(--font-mono); text-transform:uppercase; }
.eo-week-column-task .eo-input{ padding:6px 7px; font-size:10px; }
.eo-week-quick-add{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px; }
.eo-week-quick-add .eo-input{ padding:7px 8px; font-size:var(--fs-caption); }
.eo-week-queues{ margin-top:14px; }

/* Weekly Plan: two live mounts of the side-panel to-do rail. The rows are
   rendered by thought-capture.js, so they inherit thought-capture.css — only
   the mount, the drop state and the plan-only extras are styled here. */
.eo-plan-rails{ align-items:start; }
.eo-rail-mount{ max-height:min(62vh,620px); overflow-y:auto; margin:-4px -4px 0; padding:4px; }
.eo-rail-drop{ border:1px dashed transparent; border-radius:8px; transition:border-color .12s, background .12s; }
.eo-rail-drop.is-drop-target{ border-color:var(--accent,#6ea8fe); background:color-mix(in srgb, var(--accent,#6ea8fe) 8%, transparent); }
.eo-rail-mount .tsb-empty{ padding:18px 10px; text-align:center; color:var(--faint); font-size:var(--fs-caption); }
.eo-plan-sprint-pick-row{ margin-bottom:8px; }
.eo-plan-sprint-pick{ width:100%; }
.eo-rail-drag{ cursor:grab; }
.eo-rail-drag:active{ cursor:grabbing; }
.eo-rail-allocated{ opacity:.62; }
/* Second grip, in the row footer: drags a row out of this rail into the other
   one. Sits with the archive/delete buttons and reveals on row hover, so the
   reorder handle on the left stays the only always-visible grip. */
.eo-rail-out{ display:flex; align-items:center; justify-content:center; padding:3px; border-radius:6px;
  color:var(--faint); cursor:grab; opacity:0; transition:opacity .12s, color .12s, background .12s; }
.tsb-row:hover .eo-rail-out{ opacity:.85; }
.eo-rail-out:hover{ color:var(--accent); background:var(--hover); }
.eo-rail-out:active{ cursor:grabbing; }
.eo-rail-out svg{ width:10px; height:14px; pointer-events:none; }
.eo-rail-chip-week{ background:color-mix(in srgb, var(--accent,#6ea8fe) 22%, transparent); color:var(--accent,#6ea8fe); }
select.eo-rail-day{ padding:2px 4px; font:600 9px/1.4 var(--font-mono); text-transform:uppercase;
  background:var(--panel-2,rgba(255,255,255,.05)); color:var(--fg); border:1px solid var(--line,rgba(255,255,255,.12));
  border-radius:5px; cursor:pointer; }

@media (max-width:1250px){
  .eo-task-workbench,.eo-tomorrow-intro{ grid-template-columns:1fr; }
  .eo-five-week-board{ min-width:0; grid-template-columns:repeat(5,260px); overflow-x:auto; padding-bottom:8px; }
}
@media (max-width:760px){
  .eo-todo-record-head{ grid-template-columns:24px minmax(0,1fr); }
  .eo-todo-record-actions{ grid-column:2; flex-wrap:wrap; }
  .eo-micro-list-inline,.eo-add-inline-step{ margin-left:0; }
  .eo-week-score-grid{ grid-template-columns:1fr; }
  .eo-section-intro{ align-items:flex-start; flex-direction:column; }
  .eo-planning-source-row,.eo-allocation-source,.eo-allocation-task,.eo-week-queue-row{ align-items:stretch; flex-direction:column; }
  .eo-allocation-task .eo-input,.eo-week-queue-row .eo-input{ width:100%; }
}

/* ----- Audio ----- */
.eo-audio-groups{ display:flex; flex-direction:column; gap:20px; }
.eo-audio-groups > section > header{ margin-bottom:8px; padding-bottom:7px; border-bottom:1px solid var(--line-soft); }
.eo-audio-groups > section > header span{ color:var(--faint); font:700 10px/1 var(--font-mono); letter-spacing:.16em; }
.eo-audio-mode-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.eo-audio-mode{
  display:flex;
  min-height:150px;
  padding:16px;
  align-items:flex-start;
  flex-direction:column;
  color:var(--text);
  text-align:left;
  border:1px solid var(--line);
  background:var(--card);
  cursor:pointer;
  transition:border-color var(--t-snap) var(--ease), background var(--t-snap) var(--ease), transform var(--t-snap) var(--ease);
}
.eo-audio-mode:hover{ border-color:rgba(var(--accent-rgb),.42); background:var(--card-hover); }
.eo-audio-mode:active{ transform:scale(.98); }
.eo-audio-mode > span{ color:var(--accent); font:600 9px/1 var(--font-mono); letter-spacing:.1em; }
.eo-audio-mode > b{ margin-top:12px; font:650 20px/1.1 var(--font-display); }
.eo-audio-mode > p{ flex:1; margin:8px 0; color:var(--muted); font-size:11px; line-height:1.45; }
.eo-audio-mode > em{ color:var(--faint); font:600 9px/1 var(--font-mono); font-style:normal; }

/* ----- Settings ----- */
.eo-setting-row{ display:flex; min-height:48px; align-items:center; justify-content:space-between; gap:18px; padding:8px 0; border-bottom:1px solid var(--line-soft); }
.eo-setting-row:last-child{ border-bottom:0; }
.eo-setting-row > div{ display:flex; flex-direction:column; gap:3px; }
.eo-setting-row > div b{ font-size:12px; }
.eo-setting-row > div span{ color:var(--muted); font-size:10px; line-height:1.4; }
.eo-setting-row > b{ font:600 12px/1 var(--font-mono); }
.eo-file-button{ display:inline-flex; position:relative; width:max-content; }
.eo-file-button input{ position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.eo-settings-status{ display:block; min-height:14px; margin-top:8px; color:var(--accent); font:600 9px/1.4 var(--font-mono); letter-spacing:.08em; }

/* ----- Responsive ----- */
@media (max-width:1100px){
  .eo-command-vector{ grid-template-columns:minmax(0,1.4fr) minmax(220px,.8fr); }
  .eo-vector-later{ grid-column:1/-1; border-left:0 !important; border-top:1px solid var(--line); }
  .eo-tier-stack{ grid-template-columns:1fr; }
  .eo-audio-mode-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:820px){
  .eo-command-hero{ align-items:flex-start; flex-direction:column; }
  .eo-command-actions{ width:100%; }
  .eo-command-vector,.eo-command-grid{ grid-template-columns:1fr; }
  .eo-command-vector > div + div{ border-left:0; border-top:1px solid var(--line); }
  .eo-live-command{ grid-template-columns:1fr; }
  .eo-live-command > strong{ font-size:22px; }
  .eo-rescue-progress{ grid-template-columns:repeat(3,1fr); }
  .eo-rescue-progress li:nth-child(3){ border-right:0; }
  .eo-rescue-progress li:nth-child(n+4){ border-top:1px solid var(--line-soft); }
  .eo-choice-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  #eoTodayPanel .eo-tabs-wrap{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  #eoTodayPanel .eo-telemetry-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .eo-audio-mode-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:560px){
  .eo-command-actions,.eo-choice-grid,.eo-audio-mode-grid{ grid-template-columns:1fr; }
  .eo-command-vector > div{ padding:14px; }
  .eo-vector-now h3{ font-size:23px; }
  .eo-rescue-focus{ padding:20px 14px; }
  .eo-rescue-focus > strong{ font-size:54px; }
  .eo-rescue-progress li span{ display:none; }
  #eoTodayPanel .eo-telemetry-grid{ grid-template-columns:1fr; }
}

@media (max-width:900px){
  #eoTodayPanel .eo-ritual-steps{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .eo-reading-layout{ grid-template-columns:1fr; }
  .eo-reading-images{ max-width:420px; }
  .eo-weekly-grid{ grid-template-columns:1fr; }
  .eo-task-workbench{ grid-template-columns:1fr; }
  .eo-routine-strip{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:560px){
  .eo-tomorrow-add-grid{ grid-template-columns:1fr; }
  .eo-tomorrow-add-grid>#eoTomorrowTaskNew,.eo-tomorrow-add-grid>#eoTomorrowNotes{ grid-column:span 1; }
}

@media (prefers-reduced-motion:reduce){
  .eo-choice,.eo-audio-mode,.eo-primary-nav .app-nav-tab{ transition:none; }
}
html[data-motion="static"] .eo-choice,
html[data-motion="static"] .eo-audio-mode,
html[data-motion="static"] .eo-primary-nav .app-nav-tab{ transition:none; }

/* =========================================================================
   CONNECTED PLANNING REWORK — spacing, buttons, to-do board, week lanes,
   guided weekly review. Loaded after everything above; scoped to eo panels.
   ========================================================================= */

/* ---- Card rhythm: give the briefing grids room to breathe ---- */
#eoTodayPanel .eo-grid,#eoSprintsPanel .eo-grid{ gap:18px; }
#eoTodayPanel .eo-view-body,#eoSprintsPanel .eo-view-body{ gap:20px; }
#eoTodayPanel .eo-card-body{ gap:12px; }

/* ---- Premium buttons ---- */
.eo-panel .eo-btn{
  border-radius:10px;
  transition:background var(--t-snap) var(--ease), border-color var(--t-snap) var(--ease),
    transform var(--t-snap) var(--ease), box-shadow var(--t-snap) var(--ease), color var(--t-snap) var(--ease);
}
.eo-panel .eo-btn:hover{ transform:translateY(-1px); box-shadow:0 4px 14px rgba(0,0,0,.28); }
.eo-panel .eo-btn:active{ transform:translateY(0) scale(.98); box-shadow:none; }
.eo-panel .eo-btn-primary{
  background:linear-gradient(180deg, rgba(var(--accent-rgb),1), rgba(var(--accent-rgb),.78));
  border-color:rgba(var(--accent-rgb),.9); color:var(--on-accent,#fff);
  box-shadow:0 2px 10px rgba(var(--accent-rgb),.22);
}
.eo-panel .eo-btn-primary:hover{ box-shadow:0 5px 18px rgba(var(--accent-rgb),.35); }
.eo-icon-btn{ border-radius:9px; transition:color var(--t-snap) var(--ease), border-color var(--t-snap) var(--ease), background var(--t-snap) var(--ease); }
.eo-icon-btn:hover:not(:disabled){ background:var(--card-hover); }

/* ---- Morning routine: emoji habit buttons that feel designed ---- */
.eo-routine-strip{ gap:10px; }
.eo-routine-check{
  min-height:86px; padding:13px 14px; border-radius:14px !important;
  gap:6px;
  background:linear-gradient(165deg, var(--card), var(--card-subtle));
  box-shadow:0 1px 0 rgba(255,255,255,.03) inset;
}
.eo-routine-check>span{ font-size:25px; line-height:1; }
.eo-routine-check:hover{
  transform:translateY(-2px); border-color:rgba(var(--accent-rgb),.45);
  box-shadow:0 8px 20px rgba(0,0,0,.3);
}
.eo-routine-check:focus-visible{ outline:2px solid rgba(var(--accent-rgb),.8); outline-offset:2px; }
.eo-routine-check.is-done{
  border-color:rgba(var(--good-rgb),.42);
  background:linear-gradient(165deg, rgba(var(--good-rgb),.12), rgba(var(--good-rgb),.04));
  box-shadow:0 0 0 1px rgba(var(--good-rgb),.14) inset;
}
.eo-routine-check-wide{ min-height:44px; padding:11px 16px; }

/* ---- Meditation Check-In: wide sliders, no dead space ---- */
.eo-meditation-grid{
  display:grid; grid-template-columns:minmax(180px,230px) minmax(0,1fr);
  gap:16px 30px; align-items:start;
}
.eo-meditation-grid>.eo-field:last-child{ grid-column:1/-1; }
.eo-meditation-lead{ display:flex; flex-direction:column; gap:12px; }
.eo-meditation-duration{ max-width:none; }
.eo-meditation-sliders{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 36px; }
.eo-meditation-sliders .eo-slider{ gap:5px; }
.eo-meditation-sliders .eo-slider input[type=range]{ height:22px; }

/* ---- "N/A" sections: kept visible, but locked and visibly out of the data ---- */
.eo-na-row{
  grid-column:1/-1; display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px;
  padding:8px 12px; border-radius:8px;
  border:1px solid rgba(var(--accent-rgb),.16); background:rgba(var(--accent-rgb),.05);
}
.eo-na-row .eo-note{ margin:0; }
.eo-na-check{ margin:0; white-space:nowrap; }
.eo-na-block.is-na>*:not(.eo-na-row){ opacity:.4; filter:saturate(.35); }
.eo-na-block.is-na input,.eo-na-block.is-na textarea,.eo-na-block.is-na select{ cursor:not-allowed; }
.eo-na-block.is-na .eo-na-row{
  border-color:rgba(var(--warn-rgb,var(--accent-rgb)),.4);
  background:rgba(var(--warn-rgb,var(--accent-rgb)),.09);
}
.eo-na-summary span b{ color:var(--faint); }
@media (max-width:900px){
  .eo-meditation-grid{ grid-template-columns:1fr; }
  .eo-meditation-sliders{ grid-template-columns:1fr; }
}

/* ---- Task chips: sprint / project / priority / due context ---- */
.eo-task-chip-row{ display:flex; gap:5px; flex-wrap:wrap; margin-top:6px; }
.eo-task-chip-row .eo-chip{ font-size:9px; padding:2px 8px; }
.eo-chip-priority{ color:var(--warn); border-color:rgba(var(--warn-rgb),.4); }
.eo-chip-sprint{ color:var(--accent-soft); border-color:rgba(var(--accent-rgb),.35); }
.eo-chip-project{ color:var(--good); border-color:rgba(var(--good-rgb),.32); }

/* ---- Drag handles + drop targets ---- */
.eo-drag-dot{
  flex:none; display:inline-grid; place-items:center; width:16px; min-height:24px;
  color:var(--faint); font-size:11px; letter-spacing:-2px; line-height:1;
  cursor:grab; user-select:none; border-radius:5px;
}
.eo-drag-dot:hover{ color:var(--text); background:rgba(var(--text-rgb),.06); }
.eo-drag-dot:active{ cursor:grabbing; }
.is-drop-target{
  outline:1.5px dashed rgba(var(--accent-rgb),.75); outline-offset:2px;
  background:rgba(var(--accent-rgb),.05) !important;
}

/* ---- Today's To-Dos board: today (left) + this week by day (right) ---- */
.eo-todo-board{ grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr); gap:18px; }
.eo-todo-board>div{ display:flex; flex-direction:column; gap:16px; min-width:0; }
.eo-todo-record-head{ grid-template-columns:16px 24px minmax(0,1fr) auto; gap:8px; }
.eo-todo-record-head .eo-drag-dot{ margin-top:5px; }
.eo-week-board-card .eo-card-body{ padding:12px; }
.eo-week-lane-board{ display:flex; flex-direction:column; gap:10px; }
.eo-week-lane{
  border:1px solid var(--line-soft); border-radius:12px !important;
  background:var(--card-subtle); padding:9px 10px 10px;
  display:flex; flex-direction:column; gap:7px;
  transition:border-color var(--t-snap) var(--ease), background var(--t-snap) var(--ease);
}
.eo-week-lane.is-today{ border-color:rgba(var(--accent-rgb),.45); background:rgba(var(--accent-rgb),.045); }
.eo-week-lane>header{
  display:flex; align-items:baseline; gap:8px;
  font:700 9.5px/1 var(--font-mono); text-transform:uppercase; letter-spacing:.08em; color:var(--muted);
}
.eo-week-lane.is-today>header span{ color:var(--accent-soft); }
.eo-week-lane>header b{ color:var(--faint); font-weight:600; }
.eo-week-lane>header i{
  margin-left:auto; font-style:normal; color:var(--faint);
  min-width:20px; height:18px; display:grid; place-items:center;
  background:var(--card); border-radius:999px; font-size:9px;
}
.eo-lane-empty{ margin:0; padding:4px 2px 2px; color:var(--faint); font-size:var(--fs-caption); }
.eo-week-lane-task{
  display:flex; align-items:flex-start; gap:8px; padding:7px 8px;
  background:var(--card); border:1px solid var(--line-soft); border-radius:9px;
}
.eo-week-lane-task>input[type=checkbox]{ accent-color:var(--accent); margin-top:3px; }
.eo-week-lane-task.is-done{ opacity:.55; }
.eo-week-lane-task.is-done b{ text-decoration:line-through; }
.eo-week-lane-main{ min-width:0; flex:1; display:flex; flex-direction:column; gap:2px; }
.eo-week-lane-main b{ font-size:var(--fs-small); line-height:1.35; overflow-wrap:anywhere; }
.eo-week-lane-main .eo-task-chip-row{ margin-top:2px; }
.eo-lane-today-btn{ flex:none; white-space:nowrap; min-height:26px !important; padding-inline:8px !important; font-size:9.5px; }
@media (max-width:1250px){ .eo-todo-board{ grid-template-columns:1fr; } }

/* ---- Think-through notes: compact, collapsible, still a real notepad ---- */
.eo-thinking-card>summary{ cursor:pointer; list-style:none; user-select:none; }
.eo-thinking-card>summary::-webkit-details-marker{ display:none; }
.eo-thinking-card>summary .eo-card-title::before{ content:'▸ '; color:var(--accent); }
.eo-thinking-card[open]>summary .eo-card-title::before{ content:'▾ '; }
.eo-thinking-card .eo-ta{ min-height:140px; padding:12px 13px; line-height:1.6; }

/* ---- Today's Goals: command summary, not a form wall ---- */
.eo-goal-command{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 22px; }
.eo-goal-command>div{ display:flex; flex-direction:column; gap:12px; min-width:0; }
.eo-priority-rows{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:7px; }
.eo-priority-rows li{ display:grid; grid-template-columns:26px minmax(0,1fr); gap:8px; align-items:center; }
.eo-priority-rows li>b{
  display:grid; place-items:center; width:26px; height:26px; border-radius:8px;
  background:rgba(var(--accent-rgb),.1); color:var(--accent-soft);
  font:700 11px/1 var(--font-mono);
}
.eo-tier-fields{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.eo-tier-field{
  display:flex; flex-direction:column; gap:6px; padding:11px 12px;
  background:var(--card-subtle); border:1px solid var(--line-soft); border-radius:12px !important;
  border-top:2px solid var(--line-strong);
}
.eo-tier-field>span{ font:700 var(--fs-caption)/1 var(--font-mono); text-transform:uppercase; letter-spacing:.08em; color:var(--muted); }
.eo-tier-min{ border-top-color:rgba(var(--warn-rgb),.55); }
.eo-tier-strong{ border-top-color:rgba(var(--accent-rgb),.55); }
.eo-tier-elite{ border-top-color:rgba(var(--good-rgb),.55); }
@media (max-width:900px){ .eo-goal-command,.eo-tier-fields{ grid-template-columns:1fr; } }

/* ---- Evening Goal Review: the morning target on the left, tonight's verdict
   on the right, so the whole list reads in one downward glance ---- */
.eo-goal-verdict{ display:grid; grid-template-columns:minmax(0,180px) minmax(0,1fr); gap:10px 14px; align-items:start; margin:4px 0 2px; }
.eo-priority-review-head{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:baseline; margin-bottom:6px; }
.eo-priority-review-head>span:last-child{ text-align:right; }
.eo-priority-review{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:7px; }
.eo-priority-review-row{
  display:grid; grid-template-columns:26px minmax(0,1fr) auto; gap:10px; align-items:center;
  padding:8px 11px; background:var(--card-subtle); border:1px solid var(--line-soft); border-radius:10px !important;
}
.eo-priority-review-row>b{
  display:grid; place-items:center; width:26px; height:26px; border-radius:8px;
  background:rgba(var(--accent-rgb),.1); color:var(--accent-soft);
  font:700 11px/1 var(--font-mono);
}
.eo-priority-review-row>span{ min-width:0; color:var(--text); font-size:var(--fs-small); line-height:1.45; }
.eo-priority-review-row>input[type=checkbox]{ width:17px; height:17px; margin:0; accent-color:var(--good); cursor:pointer; }
@media (max-width:900px){ .eo-goal-verdict{ grid-template-columns:1fr; } }

/* ---- Weekly mission empty state + quick create ---- */
.eo-weekly-empty{
  display:flex; flex-direction:column; gap:10px; padding:16px 14px;
  border:1px dashed var(--line); border-radius:12px !important; background:var(--card-subtle);
}
.eo-weekly-empty p{ margin:0; color:var(--muted); font-size:var(--fs-small); line-height:1.55; }
.eo-quick-mission{ display:flex; gap:8px; }
.eo-quick-mission .eo-input{ flex:1; }

/* ---- Review area: compact head + smaller banner = usable vertical space ---- */
#eoSprintsPanel .pg-banner-wrap.has-cover{ height:clamp(84px,9vw,118px); }
#eoSprintsPanel .eo-page-head{ padding:14px 0 10px; }
#eoSprintsPanel .eo-page-head .eo-page-title{ font-size:19px; }
#eoSprintsPanel .eo-week-nav-header{ margin:0; justify-content:flex-end; }
#eoSprintsPanel .eo-week-nav-header b{ text-align:center; }
@media (max-width:820px){
  #eoSprintsPanel .eo-week-nav-header{ width:100%; justify-content:flex-start; flex-wrap:wrap; }
}
.eo-review-tabs{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px; padding:4px; overflow:visible; }
.eo-review-tabs .eo-tab{
  display:flex; flex-direction:column; align-items:flex-start; gap:3px;
  min-height:44px; padding:8px 11px; text-align:left;
}
.eo-review-tabs .eo-tab b{ font-size:10.5px; }
.eo-review-tabs .eo-tab small{ color:var(--faint); font:500 8.5px/1.2 var(--font-body); text-transform:none; letter-spacing:0; }
.eo-review-tabs .eo-tab.active{ border:1px solid rgba(var(--accent-rgb),.3) !important; background:rgba(var(--accent-rgb),.09); border-radius:8px !important; }
.eo-review-tabs .eo-tab.active small{ color:var(--muted); }

/* ---- Guided Weekly Review stepper ---- */
.eo-review-steps{ display:grid; grid-template-columns:repeat(9,minmax(88px,1fr)); gap:4px; padding:4px; overflow:visible; }
.eo-review-steps .eo-tab{ display:flex; align-items:center; gap:6px; min-height:32px; padding:6px 8px; font-size:9px; }
.eo-review-steps .eo-tab>span{ color:var(--faint); font-family:var(--font-mono); }
.eo-review-steps .eo-tab.active{ border:1px solid rgba(var(--accent-rgb),.3) !important; background:rgba(var(--accent-rgb),.09); border-radius:6px !important; }
.eo-review-intro{ display:flex; flex-direction:column; gap:3px; padding:2px 2px 0; }
.eo-review-intro h3{ margin:0; font:650 21px/1.2 var(--font-display); letter-spacing:-.02em; }
.eo-review-intro p{ margin:0; color:var(--muted); font-size:var(--fs-small); }
.eo-social-sliders{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 34px; }
@media (max-width:1100px){ .eo-review-steps{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:820px){ .eo-review-tabs{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* ---- Weekly Plan: week columns + day lanes ---- */
.eo-week-column.is-selected{ border-color:rgba(var(--accent-rgb),.55); box-shadow:0 0 0 1px rgba(var(--accent-rgb),.2); }
.eo-week-column-task-head{ display:flex; align-items:flex-start; gap:6px; min-width:0; }
.eo-week-column-task-head>div{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.eo-plan-day-lanes{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; align-items:start; }
.eo-plan-day-lanes .eo-week-lane{ min-height:96px; }
.eo-week-queue-row{ align-items:center; }
.eo-week-queue-row>.eo-drag-dot{ align-self:center; }
.eo-week-queue-row>div{ flex:1; }
@media (max-width:1250px){ .eo-plan-day-lanes{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px){ .eo-plan-day-lanes{ grid-template-columns:1fr; } }


/* ---- Calendar widget ------------------------------------------------------
   A printed wall calendar, in this app's ink: the weekday ruler, a plain grid
   of numbers, and one filled circle on today. Nothing is
   coloured except today, because on a calendar there is only one thing you are
   ever really looking for.

   Weeks start MONDAY (see the note in js/eo-command.js), which puts Saturday
   and Sunday together at the right-hand edge — so the quiet tint on those two
   columns does the job the red Sunday column does on a printed calendar.

   EVERYTHING SIZES OFF THE CARD, not the window. Two containers: the card
   decides whether a 2M pair sits side by side or stacks, and each month block
   decides its own type and cell size — so a month reads correctly whether it
   has the whole widget or half of it, and the widget survives being dragged
   from 30 columns down to 5.
   -------------------------------------------------------------------------- */
.eo-cal{
  container:calcard / inline-size;
  display:flex; flex-direction:column; gap:6px;
  min-height:0; padding:10px 13px 13px;
}
.eo-cal-head{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.eo-cal-head .eo-rail-kicker{ white-space:nowrap; }
.eo-cal-steps{ margin-left:auto; }
.eo-cal-now.is-home{
  appearance:none; border:0; padding:2px 5px; margin-left:-5px; border-radius:3px;
  white-space:nowrap;
  font:700 9.5px/1 var(--font-mono); letter-spacing:.1em;
  color:var(--accent); background:transparent; cursor:pointer;
  transition:background .15s var(--ease);
}
.eo-cal-now.is-home:hover{ background:rgba(var(--accent-rgb),.12); }
.eo-cal-views{ display:flex; gap:2px; flex:none; }
.eo-cal-view{
  appearance:none; border:0; background:transparent; cursor:pointer;
  padding:2px 6px; border-radius:3px;
  font:600 10px/1 var(--font-mono); letter-spacing:.08em;
  color:var(--faint);
  transition:color .15s var(--ease), background .15s var(--ease);
}
.eo-cal-view:hover{ color:var(--text); background:var(--card-subtle); }
.eo-cal-view.is-on{ color:var(--on-accent); background:rgba(var(--accent-rgb),.85); }

/* The two triangles. No frame, no fill, no label — the shape is the button. */
.eo-cal-steps{ display:flex; align-items:center; gap:1px; flex:none; }
.eo-cal-step{
  appearance:none; border:0; background:transparent; cursor:pointer;
  display:grid; place-items:center;
  width:19px; height:19px; padding:0; border-radius:4px;
  color:var(--faint);
  transition:color .15s var(--ease), background .15s var(--ease);
}
.eo-cal-step svg{ width:8px; height:10px; fill:currentColor; stroke:none; }
.eo-cal-step:hover{ color:var(--accent); background:var(--card-subtle); }
.eo-cal-step:active{ color:var(--accent); transform:translateY(.5px); }

/* The stage holds exactly one period. Spare height in a tall widget goes to the
   day cells, so a calendar given more room grows its squares rather than
   stranding a band of empty card under the last week. */
.eo-cal-stage{ flex:1 1 auto; min-height:0; display:flex; flex-direction:column; }
.eo-cal-stage > *{ flex:1 1 auto; min-height:0; }

.eo-cal-block{
  container:calblock / inline-size;
  display:flex; flex-direction:column; min-width:0;
}
.eo-cal-pair{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; align-items:start; }
.eo-cal-pair > .eo-cal-block{ height:100%; }

.eo-cal-grid{
  display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:1px;
  grid-auto-rows:minmax(var(--cal-cell,20px), 1fr);
  flex:1 1 auto; align-content:start;
}
/* The weekday ruler is a label, not a row of the month: it keeps its own height
   however much the cells below it grow. */
.eo-cal-grid > .eo-cal-dow{ grid-row:1; }
.eo-cal-dow{
  display:grid; place-items:center; padding-bottom:3px;
  font:700 clamp(7px,3cqw,9.5px)/1 var(--font-mono);
  letter-spacing:.06em; text-transform:uppercase; color:var(--faint);
}
.eo-cal-dow.is-weekend{ color:rgba(var(--text-rgb),.24); }
.eo-cal-day{
  display:grid; place-items:center;
  min-height:var(--cal-cell,20px); border-radius:4px;
}
.eo-cal-day.is-weekend{ background:rgba(var(--text-rgb),.035); }
.eo-cal-day.is-weekend > i{ color:var(--faint); }
.eo-cal-day.is-blank{ background:transparent; }
.eo-cal-day > i{
  display:grid; place-items:center; font-style:normal;
  width:var(--cal-chip,20px); height:var(--cal-chip,20px);
  border-radius:50%;
  font:500 clamp(8px,4.4cqw,14px)/1 var(--font-mono);
  font-variant-numeric:tabular-nums;
  color:var(--text);
}
/* Today. One filled circle — the only saturated thing on the card. */
.eo-cal-day.is-today > i{
  background:var(--accent); color:var(--on-accent); font-weight:800;
  box-shadow:0 2px 10px rgba(var(--accent-rgb),.32);
}

/* Densities. A month and a half-width month want the same proportions, so they
   share; 1W gets room to breathe, because one week is all it has to draw. */
.eo-cal[data-cal-view="month"] .eo-cal-block,
.eo-cal[data-cal-view="twin"] .eo-cal-block{ --cal-chip:clamp(15px,9cqw,28px); --cal-cell:clamp(18px,10cqw,31px); }
.eo-cal[data-cal-view="week"] .eo-cal-block{ --cal-chip:clamp(20px,11cqw,44px); --cal-cell:clamp(26px,13cqw,56px); }
.eo-cal[data-cal-view="week"] .eo-cal-day > i{ font-size:clamp(11px,5.4cqw,19px); }

/* Too narrow for two months abreast: stack the pair rather than crush it. */
@container calcard (max-width:330px){
  .eo-cal-pair{ grid-template-columns:minmax(0,1fr); }
}
/* Too narrow for a label as well as the controls: the controls win. */
@container calcard (max-width:250px){
  .eo-cal-head .eo-rail-kicker{ display:none; }
}

/* Routine progress bar — the routine card with only its readout left. It can
   be dropped on the canvas as a slim strip, so the track centres in whatever
   height it is given instead of hugging the top.

   Its shape is its own: one cut-glass lozenge per habit, point to point, the
   way a cartridge loading bar fills. No tube housing here — the diamonds ARE
   the bar. An unlogged habit sits dark and faceted; logging one ignites it
   from its top edge and throws light past its silhouette (drop-shadow, not
   box-shadow — clip-path eats a box shadow along with the corners it cuts).
   The chain sizes off the diamond height and centres itself, so a full-width
   strip reads as one deliberate run instead of sixteen stretched rhombi. */
.eo-routine-bar-card{
  display:flex; flex-direction:column; justify-content:center;
  /* Tight enough that the diamonds still read at ONE snap box tall, rather
     than being handed to the fit pass to redraw at half size. */
  padding:8px 12px;
  --eo-dia:26px;
}
.eo-routine-bar-card .eo-hs-track{
  margin-top:0; gap:14px; justify-content:center; align-items:center;
}
.eo-routine-bar-card .eo-hs-group{
  flex:0 1 auto; height:var(--eo-dia); padding:0; gap:0;
  background:none; border:0; box-shadow:none;
}
.eo-routine-bar-card .eo-hs-seg{
  flex:0 1 var(--eo-dia); width:var(--eo-dia); min-width:5px;
  /* Square, so the clip cuts a true diamond rather than a sliver. When the
     card is too narrow to seat sixteen at full size the segments shrink, and
     aspect-ratio takes the height down with the width instead of leaving a
     row of tall thin shards. */
  aspect-ratio:1; height:auto; align-self:center;
  /* Corners would meet exactly at the halfway point; a hairline of air keeps
     each lozenge its own cut stone instead of a poured ribbon. */
  margin-inline:1px;
  transition:filter var(--t-snap) var(--ease), transform var(--t-snap) var(--ease);
}
.eo-routine-bar-card .eo-hs-seg::before{
  clip-path:polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
  /* Stops start at 12%, not 0%: on a diamond the box's own corners are cut
     away, so a highlight parked at 0% is a highlight nobody sees. */
  background:linear-gradient(145deg,
    rgba(var(--text-rgb),.24) 12%,
    rgba(var(--text-rgb),.09) 48%,
    rgba(0,0,0,.5) 100%);
  box-shadow:none;
}
.eo-routine-bar-card .eo-hs-seg:hover::before{
  background:linear-gradient(145deg,
    rgba(var(--accent-rgb),.55) 12%,
    rgba(var(--accent-rgb),.24) 55%,
    rgba(var(--accent-rgb),.08) 100%);
}
.eo-routine-bar-card .eo-hs-seg.is-done::before,
.eo-routine-bar-card .eo-hs-seg.is-done:hover::before{
  background:linear-gradient(145deg,
    rgba(255,255,255,.98) 12%,
    rgba(var(--good-rgb),1) 45%,
    rgba(var(--good-rgb),.70) 80%,
    rgba(var(--good-rgb),.36) 100%);
  box-shadow:none;
}
.eo-routine-bar-card .eo-hs-seg.is-done{
  filter:
    drop-shadow(0 0 3px rgba(var(--good-rgb),.55))
    drop-shadow(0 0 9px rgba(var(--good-rgb),.22));
}
.eo-routine-bar-card .eo-hs-seg:hover{ transform:translateY(-1px); }

/* ---- Working day progress bar --------------------------------------------
   Same instrument as the PLAYING POINTS track above it: a thin bordered
   housing, segments sitting on one track, lit parts glowing. Work sessions
   burn the same green as funds; the blocks that hold them apart burn baby-blue
   neon. Colour alone carries the difference — at 9px a pattern is noise. ---- */
.eo-daybar-card{ display:flex; align-items:center; padding:8px 12px; }
.eo-daybar{
  position:relative; flex:1 1 auto; height:9px;
  border:1px solid var(--line-bright); padding:1px;
  background:var(--card-subtle);
}
/* Absolute children sit inside the padding box, so a right border on each
   segment cuts the 2px gutter between blocks without the fill covering it —
   the same rhythm as the funds bar's flex gap. */
.eo-daybar-seg{
  position:absolute; top:1px; bottom:1px;
  box-sizing:border-box; border-right:2px solid var(--card-subtle);
  background:rgba(var(--text-rgb),.07);
  overflow:hidden;
}
.eo-daybar-seg:last-of-type{ border-right:0; }
/* The fill grows from the left edge as the segment's time elapses — it never
   outruns the cursor. */
.eo-daybar-fill{
  position:absolute; left:0; top:0; bottom:0; width:0;
  transition:width .8s cubic-bezier(.4,0,.2,1);
}
.eo-daybar-seg.is-work .eo-daybar-fill{
  background:linear-gradient(180deg, var(--good), rgba(var(--good-rgb),.42));
  box-shadow:0 0 8px rgba(var(--good-rgb),.35) inset;
}
/* Standby is baby-blue neon: a different KIND of block, told apart by colour
   alone. */
.eo-daybar-seg.is-standby .eo-daybar-fill{
  background:linear-gradient(180deg, var(--ice), rgba(var(--ice-rgb),.42));
  box-shadow:0 0 8px rgba(var(--ice-rgb),.35) inset;
}
.eo-daybar-cursor{
  position:absolute; top:-2px; bottom:-2px; width:1px; margin-left:-1px;
  background:#fff;
  box-shadow:0 0 6px rgba(255,255,255,.75);
  transition:left .8s cubic-bezier(.4,0,.2,1);
  z-index:10;
}

/* ---- Inbox list ---------------------------------------------------------
   A working surface, not a readout. Capture box on top, the queue underneath,
   each capture a card with its own notes and its own two actions.

   Adaptive by REFLOW: the auto-fill grid gives one column in a narrow rail
   tile and as many as the width allows in a wide one, with the SAME card in
   both — nothing shrinks, the layout just rearranges.

   And it scrolls. This is the only widget on the canvas allowed to: an inbox
   is a queue you work down, and one that hides its own tail is worse than one
   you scroll. */
.eo-inbox-card{ display:flex; flex-direction:column; min-height:0; }
.eo-inbox-head{ flex:none; display:flex; align-items:center; gap:9px; }
.eo-inbox-count{
  flex:none; color:var(--text);
  font:700 15px/1 var(--font-mono); font-variant-numeric:tabular-nums;
}
.eo-inbox-head .eo-pill-toggle{ margin-left:auto; }

.eo-inbox-capture{ flex:none; display:flex; gap:6px; margin-top:10px; }
.eo-inbox-capture input{
  flex:1 1 auto; min-width:0; height:30px; padding:0 10px;
  border:1px solid var(--line-bright); border-radius:3px;
  background:rgba(var(--text-rgb),.04); color:var(--text);
  font:400 12.5px/1 var(--font-body);
  transition:border-color var(--t-snap) var(--ease), background var(--t-snap) var(--ease);
}
.eo-inbox-capture input::placeholder{ color:var(--faint); }
.eo-inbox-capture input:focus{
  outline:none; border-color:var(--accent);
  background:rgba(var(--accent-rgb),.07);
}
.eo-inbox-capture button{
  flex:none; height:30px; padding:0 13px;
  border:1px solid rgba(var(--accent-rgb),.45); border-radius:3px;
  background:rgba(var(--accent-rgb),.12); color:var(--accent);
  font:600 10.5px/1 var(--font-mono); letter-spacing:.08em; text-transform:uppercase;
  white-space:nowrap; cursor:pointer;
  transition:background var(--t-snap) var(--ease);
}
.eo-inbox-capture button:hover{ background:rgba(var(--accent-rgb),.22); }

.eo-inbox-scroll{
  flex:1 1 auto; min-height:0;
  margin-top:9px;
  overflow-y:auto; overflow-x:hidden;
  scrollbar-width:thin; scrollbar-color:var(--line-bright) transparent;
}
.eo-inbox-scroll::-webkit-scrollbar{ width:7px; }
.eo-inbox-scroll::-webkit-scrollbar-thumb{ background:var(--line-bright); border-radius:4px; }
.eo-inbox-scroll::-webkit-scrollbar-thumb:hover{ background:var(--line-strong); }
.eo-inbox-scroll::-webkit-scrollbar-track{ background:transparent; }

.eo-inbox-flow{
  margin:0; padding:0 3px 0 0; list-style:none;
  display:grid;
  /* min() so a widget narrower than a card still gets ONE column that fits,
     rather than one 220px column hanging out over the edge. */
  grid-template-columns:repeat(auto-fill, minmax(min(220px, 100%), 1fr));
  align-content:start;
  gap:7px;
}
.eo-inbox-item{
  display:flex; flex-direction:column; gap:5px;
  min-width:0; padding:8px 10px 7px;
  border-left:2px solid rgba(var(--accent-rgb),.55);
  background:rgba(var(--text-rgb),.045);
  transition:background var(--t-snap) var(--ease), border-color var(--t-snap) var(--ease);
}
.eo-inbox-item:hover{ background:rgba(var(--accent-rgb),.1); border-left-color:var(--accent); }
.eo-inbox-item-text{
  color:var(--text);
  font:550 12.5px/1.4 var(--font-body);
  /* Two lines, then ellipsis — enough for a real captured sentence without
     one rambling capture taking the whole card. */
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;
  overflow:hidden; overflow-wrap:anywhere;
}
.eo-inbox-item-notes{
  margin:0; color:var(--muted);
  font:400 11px/1.45 var(--font-body);
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;
  overflow:hidden; overflow-wrap:anywhere;
}
.eo-inbox-item-foot{ display:flex; align-items:center; gap:6px; }
.eo-inbox-item-age{
  flex:1 1 auto; min-width:0; color:var(--faint);
  font:600 9.5px/1 var(--font-mono); letter-spacing:.05em;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.eo-inbox-act{
  flex:none; height:21px; padding:0 8px;
  border:1px solid var(--line-bright); border-radius:11px;
  background:transparent; color:var(--muted);
  font:600 9px/1 var(--font-mono); letter-spacing:.08em; text-transform:uppercase;
  cursor:pointer;
  /* Held back until the card is under the cursor: a queue of twenty captures
     with forty live buttons on it reads as noise. Keyboard focus reveals them
     the same way, so they are never unreachable. */
  opacity:0;
  transition:opacity var(--t-snap) var(--ease), color var(--t-snap) var(--ease), border-color var(--t-snap) var(--ease);
}
.eo-inbox-item:hover .eo-inbox-act,
.eo-inbox-act:focus-visible{ opacity:1; }
.eo-inbox-act:hover{ color:var(--accent); border-color:rgba(var(--accent-rgb),.5); }
.eo-inbox-act.is-drop{ padding:0 7px; }
.eo-inbox-act.is-drop:hover{ color:var(--danger); border-color:rgba(var(--danger-rgb),.5); }

.eo-inbox-tail{
  grid-column:1 / -1;
  padding:7px 2px 2px; color:var(--faint);
  font:500 10px/1.4 var(--font-mono); letter-spacing:.04em;
}
.eo-inbox-empty{
  flex:1 1 auto; min-height:90px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  text-align:center;
}
.eo-inbox-empty b{ color:var(--good); font:650 12.5px/1 var(--font-display); }
.eo-inbox-empty span{ color:var(--faint); font:400 11px/1.4 var(--font-body); }


/* ---- Clipboard ----------------------------------------------------------
   The Scratchpad's clipboard history, on the canvas — the same in-memory list
   pushed to both windows by main.js (see clipsSection in eo-command.js).

   Deliberately NOT the inbox's auto-fill grid. A capture is a thought you read
   whole and act on, so it earns a card; a clip is a thing you RECOGNISE and
   click, and recognising it takes two lines and a glance at the top of the
   list. So this is one column, tight rows, newest at the top — twenty of them
   readable in the height an inbox spends on six.

   Every row is a button in all but markup: the whole thing copies, and the
   only competing target is the delete cross in its corner. */
.eo-clips-card{ display:flex; flex-direction:column; min-height:0; }
.eo-clips-head{ flex:none; display:flex; align-items:center; gap:9px; }
.eo-clips-count{
  flex:none; color:var(--text);
  font:700 15px/1 var(--font-mono); font-variant-numeric:tabular-nums;
}
.eo-clips-head .eo-pill-toggle{ margin-left:auto; }

.eo-clips-scroll{
  flex:1 1 auto; min-height:0;
  margin-top:9px;
  overflow-y:auto; overflow-x:hidden;
  scrollbar-width:thin; scrollbar-color:var(--line-bright) transparent;
}
.eo-clips-scroll::-webkit-scrollbar{ width:7px; }
.eo-clips-scroll::-webkit-scrollbar-thumb{ background:var(--line-bright); border-radius:4px; }
.eo-clips-scroll::-webkit-scrollbar-thumb:hover{ background:var(--line-strong); }
.eo-clips-scroll::-webkit-scrollbar-track{ background:transparent; }

.eo-clips-flow{
  margin:0; padding:0 3px 0 0; list-style:none;
  display:flex; flex-direction:column; gap:5px;
}
.eo-clip{
  position:relative;
  display:flex; flex-direction:column; gap:3px;
  min-width:0; padding:7px 26px 6px 9px;   /* right pad keeps line 1 off the cross */
  border-left:2px solid rgba(var(--accent-rgb),.45);
  background:rgba(var(--text-rgb),.045);
  cursor:pointer;
  transition:background var(--t-snap) var(--ease), border-color var(--t-snap) var(--ease);
}
.eo-clip:hover{ background:rgba(var(--accent-rgb),.1); border-left-color:var(--accent); }
.eo-clip:active{ background:rgba(var(--accent-rgb),.16); }
.eo-clip-text{
  color:var(--text);
  font:500 12px/1.4 var(--font-body);
  /* Two lines and then ellipsis. A clip is recognised, not read: a copied
     paragraph must not take the room six other clips need. Whitespace is
     preserved so a copied snippet of code still looks like one. */
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;
  overflow:hidden; overflow-wrap:anywhere; white-space:pre-wrap;
}
.eo-clip-meta{
  color:var(--faint);
  font:600 9.5px/1 var(--font-mono); letter-spacing:.05em;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
/* Click feedback: the row says what happened instead of how old it is, for as
   long as it takes to read (1.2s, see markClipCopied). */
.eo-clip.is-copied{
  border-left-color:var(--good);
  background:rgba(var(--good-rgb),.1);
}
.eo-clip.is-copied .eo-clip-meta{ color:var(--good); }

/* Faint until the row is under the cursor, but never invisible — a 0-opacity
   target is one you mis-click, and the thing underneath it COPIES. */
.eo-clip-del{
  position:absolute; top:4px; right:4px;
  width:18px; height:18px; padding:0;
  border:0; border-radius:3px;
  background:transparent; color:var(--faint);
  font:600 9px/1 var(--font-mono);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; opacity:.3;
  transition:opacity var(--t-snap) var(--ease), color var(--t-snap) var(--ease), background var(--t-snap) var(--ease);
}
.eo-clip:hover .eo-clip-del{ opacity:.8; }
.eo-clip-del:hover,
.eo-clip-del:focus-visible{
  opacity:1; color:var(--danger); background:rgba(var(--danger-rgb),.14);
}

.eo-clips-empty{
  flex:1 1 auto; min-height:90px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  text-align:center;
}
.eo-clips-empty b{ color:var(--muted); font:650 12.5px/1 var(--font-display); }
.eo-clips-empty span{ color:var(--faint); font:400 11px/1.4 var(--font-body); }

/* ---- Today's to-do list -------------------------------------------------
   The side panel's Today rail, mounted inside a dashboard card.

   There is no row markup styled here, and that is the point. The rows are real
   .tsb-row markup from a live TC rail (see todayTodosSection in eo-command.js),
   so they carry thought-capture.css's row language wholesale: the same
   checkbox, the same inline name field, the same note flag, chips, sub-actions
   and hover tool footer. A lookalike copy of those rules is exactly what this
   card used to be, and exactly how it drifted from the panel.

   What IS here is the fit. The rail is drawn for a full-height side panel with
   room to breathe; this card is one cell on a dense board, and every rule
   below buys a row back. Nothing is removed — one step down in type, and the
   padding that a panel can afford taken off. */
.eo-todo-card{
  display:flex; flex-direction:column; min-height:0;
  /* A card with a heading needs a margin above it; a card that IS its list
     just needs the rows off the border. The left inset is handed to the scroll
     box instead of taken here — see the grip gutter below. */
  padding:8px 9px 8px 0;
}

/* No head: the rows are the whole card, so the scroll box starts at its edge.
   Its padding-left is the grip gutter, not an inset: it is the card's own left
   margin, moved onto the element the grips are positioned against. Overflow
   clips at the padding box, so a grip sitting at left:-11px is inside it and
   stays visible. */
.eo-todo-scroll{
  flex:1 1 auto; min-height:0;
  padding-left:11px;
  overflow-y:auto; overflow-x:hidden;
  scrollbar-width:thin; scrollbar-color:var(--line-bright) transparent;
}
.eo-todo-scroll::-webkit-scrollbar{ width:7px; }
.eo-todo-scroll::-webkit-scrollbar-thumb{ background:var(--line-bright); border-radius:4px; }
.eo-todo-scroll::-webkit-scrollbar-thumb:hover{ background:var(--line-strong); }
.eo-todo-scroll::-webkit-scrollbar-track{ background:transparent; }

/* One step down from the panel across the whole row — the name, the chips, the
   sub-actions and the sub-action counter all move together, so the row keeps
   its internal hierarchy at the smaller size instead of flattening. */
.eo-todo-scroll .tsb-row-name{ font-size:12px; }
.eo-todo-scroll .tsb-micro-input{ font-size:11px; }
.eo-todo-scroll .tsb-chip{ font-size:9px; padding:1px 5px; }
.eo-todo-scroll .tsb-subs-toggle,
.eo-todo-scroll .tsb-add-micro{ font-size:10px; }
.eo-todo-scroll .tsb-empty{ font-size:11px; padding:16px 2px; text-align:center; }

/* The rail's own outer padding is a row's worth of the little height this card
   has, and the card already has padding of its own. */
.eo-todo-scroll .tsb-rows{ padding:0; }
.eo-todo-scroll .tsb-row{ padding:2px 4px 2px 0; }

/* The drag grips are invisible until the row is hovered, but they were still
   holding their width the whole time — about 14px of nothing down the left of
   every row, and another 12px down every sub-action. That is the dead space.
   They move out of the flow entirely and hang in the gutter beside the row, so
   at rest the checkbox IS the left edge, and hovering costs no reflow: the
   grip appears next to the row rather than pushing it sideways. */
.eo-todo-scroll .tsb-row > .tsb-drag{
  position:absolute; left:-11px; top:2px;
  width:11px; padding:0; justify-content:center;
}
.eo-todo-scroll :is(.tsb-micro,.tsb-sub-micro){ position:relative; }
.eo-todo-scroll :is(.tsb-micro,.tsb-sub-micro) > .tc-msort-handle{
  position:absolute; left:-11px; top:2px; width:11px;
}
.eo-todo-scroll .tsb-row-main{ gap:1px; }
.eo-todo-scroll .tsb-row-name{ padding:0; }

/* The biggest single waste: "Add sub-action" sits on every row whether or not
   the row has any, so a list of plain to-dos pays a full extra line each. It
   joins the tool footer on hover instead — same place the delete, archive and
   schedule buttons already live. A row that HAS chips or sub-actions keeps its
   meta line at rest, because that line is then carrying information. */
.eo-todo-scroll .tsb-meta-line{ gap:5px; }
.eo-todo-scroll .tsb-add-micro{
  opacity:0; max-height:0; padding:0; overflow:hidden;
  transition:opacity var(--t-snap) var(--ease);
}
.eo-todo-scroll .tsb-row:hover .tsb-add-micro,
.eo-todo-scroll .tsb-row:focus-within .tsb-add-micro{ opacity:1; max-height:20px; }

/* Sub-actions indent off a 18px handle the card no longer has room for. */
.eo-todo-scroll .tsb-micros{ margin-top:1px; padding-left:0; }
.eo-todo-scroll .tsb-sub-micros{ margin-left:8px; padding-left:6px; }