/* The NOW look, disciplined (31 Oct 2026, Round Table part J; Nick: "KEEP IMPROVING").
   Red #EC1C24 means "act now" and nothing else: the logo, the needs-you counts and badges, urgent markers and primary buttons.
   Everything that was red only to decorate — card top lines, section titles, table headers, nav section labels, hover
   glows, underlines — turns neutral, so the few red things on a screen are the things that need Nick. Small text never sits
   in pure #EC1C24 on charcoal (about 3.6:1, fails AA); it uses the lighter tint below or white. Loaded last; removing this
   file restores the 30 Oct look exactly. */
:root { --act: #ec1c24; --act-text: #ff6b70; --quiet: #9a9a9a; --quiet-line: rgba(255, 255, 255, .09); --quiet-hover: rgba(255, 255, 255, .045); }
:root[data-theme="light"] { --act-text: #c4141c; --quiet: #5e5e5e; --quiet-line: rgba(0, 0, 0, .09); --quiet-hover: rgba(0, 0, 0, .035); }

/* Links and small red text: a readable tint, never pure red. */
a { color: var(--act-text); }
.ledger-strip b.need, .cal-dh.today span, .cal-day.today .cal-dn { color: var(--act-text); }

/* Primary buttons stay red (they are the action); the label is white, bold and at least 14 px (white on red is ~4.4:1). */
.btn-primary, body.face .btn-primary { font-weight: 700; font-size: max(14px, 1em); letter-spacing: .01em; }
.btn-primary.btn-sm, body.face .btn-primary.btn-sm { font-size: 14px; }

/* Cards: no decorative red line on top, neutral labels, a neutral lift on hover. */
.card::after { display: none; }
body.face .card .k { color: var(--quiet); }
@media (hover: hover) { body.face .card:hover { border-color: rgba(255, 255, 255, .14); box-shadow: 0 24px 60px rgba(0, 0, 0, .55); } }

/* Section titles and page titles: neutral; the red underline under every title was decoration. */
body.face .section h4 { color: var(--quiet); }
body.face .section h4::after { background: linear-gradient(90deg, var(--quiet-line), transparent); }
body.face .topbar h2::after { background: linear-gradient(90deg, rgba(255, 255, 255, .22), transparent 70%); }
.voyage-head .eyebrow, .cal-hero .eyebrow, .dr-hero .eyebrow, .cal-agday { color: var(--quiet); }
.voy-k { fill: var(--quiet); }   /* the pipeline's stage names; the path and the numbers carry the story */

/* Tables: neutral headers and a neutral row hover. */
body.face table.list th { background: rgba(255, 255, 255, .025); color: var(--quiet); border-bottom-color: var(--quiet-line); }
body.face table.list tbody tr:hover td { background: var(--quiet-hover); }
body.face table.list tbody tr:hover td:first-child { box-shadow: inset 2px 0 0 rgba(255, 255, 255, .25); }
table.list tr.selected td { background: rgba(255, 255, 255, .06); }

/* Navigation: neutral section labels and edge; the current page is white with one thin red marker, no glow. */
body.face .nav { border-image: linear-gradient(180deg, var(--quiet-line), transparent 60%, var(--quiet-line)) 1; }
body.face .nav-sec { color: #7d7d7d; }
body.face .nav-sec::after { background: linear-gradient(90deg, var(--quiet-line), transparent); }
body.face .user-role { color: var(--quiet); }
body.face .nav a[aria-current="page"], .nav a[aria-current="page"] { color: #ffffff; background: rgba(255, 255, 255, .06); border-color: transparent; }
body.face .nav a[aria-current="page"]::after { background: var(--act); box-shadow: none; }
body.face .nav a[aria-current="page"] .nav-star, body.face .nav a[aria-current="true"] .nav-star { color: #ffffff; filter: none; }
.nav a[aria-current="true"] { color: var(--text); }
body.face .nav a.nav-sub::after { border-left-color: var(--quiet-line); border-bottom-color: var(--quiet-line); }
body.face .nav a.nav-sub[aria-current="page"]::after { border-left-color: rgba(255, 255, 255, .5); border-bottom-color: rgba(255, 255, 255, .5); }

/* Tabs and pickers: the selected state is white, not red. */
.tabs button[aria-selected="true"], body.face .tabs button[aria-selected="true"] { color: var(--text); border-bottom-color: rgba(255, 255, 255, .7); text-shadow: none; }
.cal-views button[aria-selected="true"] { background: rgba(255, 255, 255, .08); color: var(--text); }

/* Inputs: a visible neutral focus ring; red is reserved for actions. */
body.face .input:hover { border-color: rgba(255, 255, 255, .18); }
.input:focus, body.face .input:focus { border-color: rgba(255, 255, 255, .55); box-shadow: 0 0 0 3px rgba(255, 255, 255, .10); }
:focus-visible { outline-color: rgba(255, 255, 255, .8); }

/* Quotes, timelines, the data-room and calendar panels: neutral rails. */
body.face .quote { border-left-color: rgba(255, 255, 255, .25); }
body.face .timeline li { border-left-color: var(--quiet-line); }
.timeline li.tl-email_in { border-left-color: rgba(255, 255, 255, .35); }
body.face .dr-hero { border-left-color: rgba(255, 255, 255, .25); }
.tiffany, .agent-hero { border-color: var(--line-strong); background: var(--surface); }
.cal-col.today { background: rgba(255, 255, 255, .03); }

/* The rings stay on the sign-in and start-up screens; behind data they fade right down. */
body.face:has(.shell) .now-rings { opacity: .14; }
body.face:has(.shell) #ody-sky { background: radial-gradient(900px 600px at 0% 100%, rgba(236, 28, 36, .07), transparent 62%), #050505; }
body:has(.shell):not(.face) { background-image: none; }

/* Light theme: the same rules on white. */
:root[data-theme="light"] body.face table.list th { background: rgba(0, 0, 0, .03); }
:root[data-theme="light"] .nav a[aria-current="page"], :root[data-theme="light"] body.face .nav a[aria-current="page"] { color: var(--text); background: rgba(0, 0, 0, .05); }
:root[data-theme="light"] .tabs button[aria-selected="true"] { border-bottom-color: rgba(0, 0, 0, .6); }
:root[data-theme="light"] .input:focus { border-color: rgba(0, 0, 0, .45); box-shadow: 0 0 0 3px rgba(0, 0, 0, .08); }

/* Reports → Trust (31 Oct, part K): neutral tiles; only an off-target figure carries red, and it always says so in words. */
.trust .trust-tile .v small { font-size: 13px; font-weight: 600; color: var(--text-3); }
.trust .trust-tile .trust-state { font-weight: 700; color: var(--text-2); }
.trust .trust-tile.off { border-color: rgba(236, 28, 36, .55); }
.trust .trust-tile.off .trust-state { color: var(--act-text); }
.trust .trust-tile.on .trust-state { color: var(--ok); }
