/* widgets/needs-you — the Court Strip + the alert button skin. The slide-out drawer
   (#nu-drawer / .nd-*) was REMOVED ENTIRELY 2026-07-26 (Craig 7:37p: "This drawer goes
   away right?"), and its skin went with it — a stylesheet for a panel nothing builds is
   the same lie as the markup was. The needs-you surfaces are the Court Strip below and
   The Study. Base .obtn stays in the shell. */
.obtn.nu-alert{background:var(--action,#15a850);border-color:var(--action,#15a850);color:#fff}
.obtn.nu-alert:hover{background:var(--action-deep,#0c7a38);border-color:var(--action-deep,#0c7a38)}

/* FRESHNESS RULE (Craig 7/17 12:07p): every union item wears its added-date; past 48h a
   subtle verify-freshness treatment — muted tan, never alarm ink. A stale ask that costs
   Craig a click is a defect; the nightly re-verify closes what reality already resolved. */
.nu-fresh{display:inline-flex;align-items:center;font:500 10px Inter;color:#647062;white-space:nowrap}
.nu-fresh.stale{background:#faf6e8;border:1px solid #e8ddb8;border-radius:999px;padding:1px 8px;color:#8a7a3a;font-weight:600}

/* THE FIX-IT FLOW (Craig 7/18): one FIX NOW per craig-court auth/stmt row → grab the
   responsible bot, land its browser on the main display at the login page, watch for the
   session to come alive, flip GREEN + resume. Court-honest: FIX NOW is a green ACTION
   button (--action); the live strip glows warning-amber ONLY while waiting on Craig;
   success is calm green and walk-away is neutral — never alarm ink. */
.nu-fixbtn{flex:none;align-self:center;font:800 10.5px Inter;letter-spacing:.04em;background:var(--action,#15a850);border:1px solid var(--action,#15a850);color:#fff;border-radius:999px;padding:5px 13px;cursor:pointer;box-shadow:0 1px 3px rgba(21,168,80,.28)}
.nu-fixbtn:hover{background:var(--action-deep,#0c7a38);border-color:var(--action-deep,#0c7a38)}
.nu-fixstrip{margin-top:9px;padding:10px 12px;background:var(--signal-tint,#eef6f1);border:1px solid var(--action-line,#8fdba8);border-radius:10px;display:flex;flex-direction:column;gap:7px;cursor:default}
.nu-fixstrip[data-phase="success"]{background:var(--action-tint,#e4f6ea);border-color:var(--action,#15a850)}
.nu-fixstrip[data-phase="walkaway"]{background:#faf9f4;border-color:var(--motm-grey-300,#d4d8d6)}
.nu-fixstrip .nfx-line{display:flex;align-items:center;gap:9px;font:600 12.5px Inter;color:var(--brand-deep,#1f4a2d);line-height:1.45}
.nu-fixstrip .nfx-line.ok{color:var(--action-deep,#0c7a38)}
.nu-fixstrip .nfx-msg{flex:1;min-width:0}
.nu-fixstrip .nfx-sub{font:400 11px Inter;color:var(--motm-grey-700,#525854);line-height:1.5}
.nu-fixstrip .nfx-acts{display:flex;gap:7px;flex-wrap:wrap;margin-top:1px}
.nu-fixstrip .nfx-done{font:700 11.5px Inter;background:var(--action,#15a850);border:1px solid var(--action,#15a850);color:#fff;border-radius:999px;padding:6px 14px;cursor:pointer}
.nu-fixstrip .nfx-done:hover{background:var(--action-deep,#0c7a38)}
.nu-fixstrip .nfx-later{font:600 11px Inter;background:#fff;border:1px solid var(--motm-grey-300,#d4d8d6);color:var(--motm-grey-700,#525854);border-radius:999px;padding:6px 12px;cursor:pointer}
.nu-fixstrip .nfx-later:hover{background:#f3f1ea}
.nu-fixstrip .nfx-dot{flex:none;width:9px;height:9px;border-radius:50%;background:var(--motm-grey-300,#c9cfca)}
.nu-fixstrip .nfx-dot.live{background:var(--motm-warning,#b87a14);animation:nfxpulse 1.6s infinite}
.nu-fixstrip .nfx-dot.spin{border:2px solid var(--action-line,#8fdba8);border-top-color:var(--action,#15a850);background:none;width:11px;height:11px;animation:nfxspin .7s linear infinite}
.nu-fixstrip .nfx-dot.done{background:var(--action,#15a850)}
/* DEGRADED — the bridge could not open the browser and Craig has to do two steps himself
   (Craig 7/27: the old fallback changed one small sub-line under an otherwise-identical green
   strip, and he read it as "nothing happens"). The WHOLE panel flips amber, gets a heavier
   border and its own numbered steps. Amber, not alarm: this is his own court and it is a
   detour, not a failure — the strip's standing law still holds. */
.nu-fixstrip[data-phase="degraded"]{background:#fdf6e4;border-color:#e0a92e;border-width:1px;
  border-left:4px solid var(--motm-warning,#b87a14);padding:12px 14px;gap:9px}
.nu-fixstrip[data-phase="degraded"] .nfx-line{font:800 13px Inter;color:#7a4a06}
.nu-fixstrip[data-phase="degraded"] .nfx-done{background:var(--motm-warning,#b87a14);border-color:var(--motm-warning,#b87a14)}
.nu-fixstrip[data-phase="degraded"] .nfx-done:hover{background:#9a6410;border-color:#9a6410}
.nu-fixstrip .nfx-steps{display:flex;flex-direction:column;gap:6px;padding:9px 11px;background:#fffdf6;
  border:1px solid #ecdcb4;border-radius:8px}
.nu-fixstrip .nfx-step{font:500 11.5px/1.5 Inter;color:#5c4a24}
.nu-fixstrip .nfx-step b{font-weight:800;color:#7a4a06}
.nu-fixstrip .nfx-url{display:inline-block;margin-top:3px;font:600 10.5px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;
  color:#7a4a06;word-break:break-all}
.nu-fixstrip .nfx-why{font:500 10.5px/1.45 Inter;color:#8a7038}
.nu-fixstrip .nfx-why b{font-weight:800;color:#7a4a06}
.nu-fixstrip .nfx-dot.warn{background:var(--motm-warning,#b87a14);animation:nfxpulse 1.6s infinite}
@keyframes nfxpulse{0%{box-shadow:0 0 0 0 rgba(184,122,20,.5)}70%{box-shadow:0 0 0 7px rgba(184,122,20,0)}100%{box-shadow:0 0 0 0 rgba(184,122,20,0)}}
@keyframes nfxspin{to{transform:rotate(360deg)}}

/* ═══ THE COURT STRIP (Craig 7/26, R1 approved as rendered) ══════════════════════════
   ONE Craig-court zone, top of the center column, fed ONLY by needsYouUnion. Every other
   needs-you costume (the HQ card badge, the 'Your court' banner inside Month-End Close,
   the drawer subtitle) demotes to a POINTER into this strip — exactly one surface may
   HOLD court items; the rest may only point. Four places to check becomes one.
   Chrome = the close card's card math (16px radius, 1px #e7e2d4) + the ONLY two alarm
   affordances the court-honest law allows on a whole card: a 4px amber left edge and the
   alfred-board calm glow (breathing, never flashing). Fill is #fffdf6 — parchment warmed
   one step, NOT an amber box. Row-level amber is confined to the age figure and the
   existing .lr-act pill. */
#ops-pane-today .courtstrip{position:relative;background:#fffdf6;border:1px solid var(--line,#e7e2d4);
  border-left:4px solid var(--motm-warning,#b87a14);border-radius:16px;padding:15px 20px 8px;
  animation:csGlow 4.6s ease-in-out infinite}
@keyframes csGlow{0%,100%{box-shadow:0 0 0 0 rgba(224,169,46,0)}50%{box-shadow:0 0 0 5px rgba(224,169,46,.13)}}
@media (prefers-reduced-motion:reduce){ #ops-pane-today .courtstrip{animation:none;box-shadow:0 0 0 4px rgba(224,169,46,.11)} }
/* THE WHOLE TAN SURFACE IS THE DOOR (Craig 7/27 8:17a): "click anywhere in the tan area to open
   The Study instead of having to move my mouse all the way over to the buttons." The pointer is
   the promise — it must be true over the header, the padding and the foot line, not only over
   the pills. Geometry is untouched on purpose: this is an R1-approved surface, and widening the
   row hit-box to the card edges would have redrawn the separators along with it. */
#ops-pane-today .courtstrip{cursor:pointer}
#ops-pane-today .courtstrip .cs-hd{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:2px}
#ops-pane-today .courtstrip .cs-ct{font:800 11px Inter;color:#fff;background:#956010;border-radius:99px;
  padding:2px 9px;box-shadow:0 0 0 3px rgba(224,169,46,.22);font-variant-numeric:tabular-nums}
#ops-pane-today .courtstrip .cs-say{font:400 12.5px Inter;color:#736c5d}
#ops-pane-today .courtstrip .cs-fresh{margin-left:auto;font:500 11px Inter;color:#736c5d;white-space:nowrap}
#ops-pane-today .courtstrip .cs-row{display:flex;align-items:center;gap:12px;padding:11px 0;
  border-bottom:1px solid #f4efdf;min-width:0}
#ops-pane-today .courtstrip .cs-row:last-of-type{border-bottom:none}
/* a row is its own target — it lands The Study ON this item. The hover tint is the parchment
   one step warmer, never a highlight: this strip's alarm ink is spent on the age figure. */
#ops-pane-today .courtstrip .cs-row{cursor:pointer;transition:background .12s}
#ops-pane-today .courtstrip .cs-row:hover{background:#fdf8ea}
#ops-pane-today .courtstrip .cs-row:focus-visible{outline:2px solid var(--motm-warning,#b87a14);
  outline-offset:-3px;border-radius:8px}
#ops-pane-today .courtstrip .cs-em{flex:none;font-size:15px;line-height:1;filter:saturate(.78);opacity:.9}
#ops-pane-today .courtstrip .cs-t{flex:1;min-width:0}
#ops-pane-today .courtstrip .cs-t .t1{font:600 14px Inter;color:#1f2937;line-height:1.4;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#ops-pane-today .courtstrip .cs-t .t1 .cli{font-weight:400;color:#647062}
#ops-pane-today .courtstrip .cs-t .t2{display:flex;align-items:baseline;font:500 12px Inter;color:#736c5d;
  margin-top:2px;line-height:1.35;min-width:0;white-space:nowrap}
/* the detail gives way; 'since' and the age figure never do — the age is the row's only alarm ink */
#ops-pane-today .courtstrip .cs-t .t2 .d{min-width:0;overflow:hidden;text-overflow:ellipsis}
#ops-pane-today .courtstrip .cs-t .t2 .w{flex:none}
#ops-pane-today .courtstrip .cs-t .t2 .sep{flex:none;color:#736c5d;margin:0 6px}
#ops-pane-today .courtstrip .cs-t .t2 .age{color:var(--motm-warning,#b87a14);font-weight:700}
/* the source chip and the action pill each hold ONE column — rows whose verbs differ in
   length must not leave a ragged right edge */
#ops-pane-today .courtstrip .cs-src{flex:none;font:600 10px Inter;letter-spacing:.06em;text-transform:uppercase;
  color:#736c5d;background:#faf5e8;border:1px solid #efe7d2;border-radius:99px;padding:2px 8px;white-space:nowrap;
  min-width:78px;text-align:center}
#ops-pane-today .courtstrip .cs-row .lr-act{flex:none;font:600 13px Inter;background:#fdf6ea;border:1px solid #e3c878;
  color:var(--motm-warning,#b87a14);border-radius:999px;padding:5px 14px;cursor:pointer;white-space:nowrap;
  min-width:140px;text-align:center}
#ops-pane-today .courtstrip .cs-row .lr-act:hover{background:#fbeed6}
/* THE ✕ ON A STRIP ROW (Craig 8/5). Quiet by default and only surfacing when the eye is already
   on the row — a dismiss is destructive and must never out-shout the action pill beside it.
   It stays keyboard-reachable at all times (:focus-within / :focus-visible), because
   "visible on hover" is a mouse rule and would otherwise take the button from the keyboard. */
#ops-pane-today .courtstrip .cs-row .abw-x{flex:none;margin-left:2px;font:700 12px/1 Inter;
  border:1px solid transparent;border-radius:999px;background:transparent;color:#736c5d;
  padding:5px 7px;cursor:pointer;opacity:0;transition:opacity .12s,color .12s,background .12s}
#ops-pane-today .courtstrip .cs-row:hover .abw-x,
#ops-pane-today .courtstrip .cs-row:focus-within .abw-x{opacity:1}
#ops-pane-today .courtstrip .cs-row .abw-x:hover{color:#8a5a0f;background:#f7efdd;border-color:#e6d9bb}
#ops-pane-today .courtstrip .cs-row .abw-x:focus-visible{opacity:1;outline:2px solid var(--motm-warning,#b87a14);outline-offset:1px}
#ops-pane-today .courtstrip .cs-row .abw-x:disabled{opacity:.5;cursor:default}
@media (prefers-reduced-motion:reduce){ #ops-pane-today .courtstrip .cs-row .abw-x{transition:none} }
/* CLEAR ALL — calm, never alarm ink. It sweeps his whole court, so it reads as a quiet utility
   beside the count rather than a red button begging to be pressed. */
#ops-pane-today .courtstrip .cs-hd .cs-xall{flex:none;font:600 11px Inter;color:#736c5d;
  background:#faf5e8;border:1px solid #efe7d2;border-radius:999px;padding:3px 10px;cursor:pointer;
  white-space:nowrap;transition:color .12s,background .12s,border-color .12s}
#ops-pane-today .courtstrip .cs-hd .cs-xall:hover{color:#8a5a0f;background:#f7efdd;border-color:#e6d9bb}
#ops-pane-today .courtstrip .cs-hd .cs-xall:focus-visible{outline:2px solid var(--motm-warning,#b87a14);outline-offset:1px}
#ops-pane-today .courtstrip .cs-hd .cs-xall:disabled{opacity:.6;cursor:default}
#ops-pane-today .courtstrip .cs-foot{display:flex;align-items:center;gap:10px;margin:2px -20px -8px;
  padding:9px 20px 10px;border-top:1px solid #f4efdf;background:#fdfbf2;border-radius:0 0 13px 13px}
#ops-pane-today .courtstrip .cs-foot .fl{font:500 12px Inter;color:#736c5d;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#ops-pane-today .courtstrip .cs-foot .fb{margin-left:auto;flex:none;font:600 12px Inter;color:#5b6b5e;background:#fff;
  border:1px solid var(--line,#e7e2d4);border-radius:99px;padding:4px 12px;cursor:pointer}
#ops-pane-today .courtstrip .cs-foot .fb:hover{border-color:var(--brand-line,#b9d8b4)}
/* EMPTY STATE — the reward. No left edge, no glow, no amber, ONE quiet line. The strip
   never disappears entirely: a zone that vanishes teaches Craig to distrust its absence. */
#ops-pane-today .courtstrip.clear{background:#fbfaf6;border-left:1px solid var(--line,#e7e2d4);
  padding:10px 16px;animation:none;box-shadow:none;cursor:pointer}
#ops-pane-today .courtstrip.clear .cs-clear{display:flex;align-items:center;gap:9px;
  font:500 13px Inter;color:#647062}
#ops-pane-today .courtstrip.clear .cs-clear .tick{color:var(--brand-ok,#15803d);font-weight:700}
#ops-pane-today .courtstrip.clear .cs-fresh{margin-left:auto}

/* ── the demoted costumes: a POINTER chip, never a second count. The gold #e0a92e badge
   becomes a neutral #f2f0e9 chip whose only gold is the numeral — it still catches the eye
   at the seat, but it no longer competes with the strip for "where do I go". ── */
.ptr{display:inline-flex;align-items:center;gap:4px;font:600 11px Inter;color:#647062;background:#f2f0e9;
  border:1px solid #e3ded1;border-radius:99px;padding:2px 9px;white-space:nowrap;cursor:pointer}
.ptr:hover{border-color:#d3ccb9;color:#6b7669}
.ptr b{font-weight:800;color:#8a6d1f;font-variant-numeric:tabular-nums}

/* ── COMMITMENTS PANEL (Craig 7/29 6:06p — "one view for all of it"). Supersedes the 7/26
   three-row OWED rail: EVERY open commitment renders, court-grouped, nothing behind a click.
   Same .vr card math (10px radius, 1px #e7e2d4, white) so it still belongs to the rail — but the
   promise text now WRAPS to 3 lines instead of ellipsing at one, because in a 308px rail a single
   nowrap line clipped every promise to a fragment and Craig could not read what he owed.
   Court-honest: overdue is amber-calm in every court (never red), and only a CRAIG-COURT overdue
   row earns the 3px left edge + calm glow — the alarm-shaped tell belongs to the court that can
   actually act on it. ── */
#ops-pane-today .ow-ct{display:inline-block;margin-left:6px;font:700 10px Inter;font-variant-numeric:tabular-nums;
  color:#647062;background:#f2f0e9;border:1px solid #e3ded1;border-radius:99px;padding:1px 7px;vertical-align:1px}
#ops-pane-today .ow-ct.od{color:var(--motm-warning,#b87a14);background:#faf3e3;border-color:#eddfbb}
#ops-pane-today .ow-list{display:flex;flex-direction:column;gap:6px;min-width:0}
/* cap ONLY a long ledger — a short list gets no scrollbar and no clipped final row */
#ops-pane-today .ow-list.cap{max-height:520px;overflow-y:auto;padding-right:2px;
  scrollbar-width:thin;scrollbar-color:#ddd8c8 transparent}
/* group header: the court, named in Craig's words, with its own count */
#ops-pane-today .ow-g{display:flex;align-items:baseline;gap:6px;padding:4px 2px 0;min-width:0}
#ops-pane-today .ow-g-l{font:700 9.5px Inter;letter-spacing:.07em;text-transform:uppercase;color:#647062;flex:none}
#ops-pane-today .ow-g-n{font:600 9.5px Inter;color:#736c5d;font-variant-numeric:tabular-nums;
  min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#ops-pane-today .ow{display:flex;flex-direction:column;gap:2px;padding:8px 10px;border-radius:10px;
  background:#fff;border:1px solid var(--line,#e7e2d4);cursor:pointer;transition:border-color .12s;width:100%;text-align:left}
#ops-pane-today .ow:hover{border-color:var(--brand-line,#b9d8b4)}
/* a promise is a sentence, not a metric — up to 3 lines, then ellipsis */
#ops-pane-today .ow .ow-t{font:600 12.5px Inter;color:var(--motm-charcoal,#1a1d1c);line-height:1.35;
  overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}
#ops-pane-today .ow .ow-s{display:flex;align-items:center;flex-wrap:wrap;gap:2px 6px;
  font:400 var(--fs-micro,10px)/14px Inter;color:#647062;min-width:0}
#ops-pane-today .ow .ow-who{font-weight:600;color:#647062;flex:none}
#ops-pane-today .ow .ow-since{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#ops-pane-today .ow .ow-by{flex:none;color:#647062;white-space:nowrap}
#ops-pane-today .ow .ow-age{margin-left:auto;flex:none;font:600 10px Inter;border-radius:99px;padding:1px 7px;white-space:nowrap;
  color:#647062;background:#f4f3ee}
#ops-pane-today .ow .ow-age.due{color:var(--motm-warning,#b87a14);background:#faf3e3}
/* .od = overdue in ANY court (calm amber wash) · .due = CRAIG-court overdue (edge + slow glow) */
#ops-pane-today .ow.od{background:#fffdf6}
#ops-pane-today .ow.due{border-left:3px solid #e6d3a4;
  box-shadow:inset 3px 0 0 #e0a92e,0 0 0 0 rgba(224,169,46,0);animation:owCalmGlow 3.6s ease-in-out infinite}
@keyframes owCalmGlow{0%,100%{box-shadow:inset 3px 0 0 #e0a92e,0 0 0 0 rgba(224,169,46,0)}
  50%{box-shadow:inset 3px 0 0 #e0a92e,0 0 8px 1px rgba(224,169,46,.22)}}
@media (prefers-reduced-motion:reduce){#ops-pane-today .ow.due{animation:none;
  box-shadow:inset 3px 0 0 #e0a92e,0 0 8px 1px rgba(224,169,46,.22)}}
/* one readable line, not a stacked explainer — .ow-empty-src went with the sentence it styled */
#ops-pane-today .ow-empty{font:500 12px Inter;color:#647062;padding:7px 10px}
/* .ow-explain removed 8/6 (Craig: "Don't need all the gray explainers"). The rules went with the
   markup — a dead selector is an invitation to re-add the paragraph it used to dress. */

/* ═══ THE 🔑 DROP (Craig 8/3) — the room every login lives in now ═══════════════════════
   The cards themselves are widgets/alfred-board's .abw-* rows, rendered by the ONE
   abAuthCardHTML: this sheet dresses the room around them and nothing else, so the card
   cannot drift between the two places it is drawn. */
#nu-keydrop .nu-kd-say{font:400 12.5px/1.55 Inter;color:#5b6b5e;background:#fbf6e8;
  border:1px solid #ece0c4;border-radius:10px;padding:10px 13px;margin:0 0 13px}
#nu-keydrop .nu-kd-zero{font:500 13px/1.6 Inter;color:#5b6660;background:#f4f7f4;
  border:1px solid #dfe7e0;border-radius:10px;padding:14px 16px}
/* THE KEY, GROUPED BY DOOR (Craig 8/5 — nine walls read as four errands). A group header, not a
   card: it names the provider, how many separate sign-ins sit behind it and what they cost in
   parked jobs. Amber-calm, the 🔑's own ink — an errand, never an alarm. */
#nu-keydrop .nu-kd-fam{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;
  margin:16px 0 6px;padding:0 0 5px;border-bottom:1px solid #f0e8d6}
#nu-keydrop .nu-kd-fam:first-of-type{margin-top:2px}
#nu-keydrop .nu-kd-fam-n{font:700 12px Inter;letter-spacing:.05em;text-transform:uppercase;color:#8a5a0f}
#nu-keydrop .nu-kd-fam-c{font:600 11px Inter;color:#a8895a;background:#fbf3df;
  border-radius:99px;padding:2px 9px}
#nu-keydrop .nu-kd-fam-j{margin-left:auto;font:500 11px Inter;color:#736c5d}
