/* theme-shield.css — the AttentionShield LIGHT theme for the Rook shell.
   Supplies the SAME :root custom-property tokens rook-shell.css consumes, in a
   professional / minimal light palette (system-ui, one restrained accent, dark
   readable text — "grandma zero-config"). No dark-terminal aesthetic. Loads
   AFTER rook-shell.css, so a few structural rules are re-tinted for light. */

:root{
  /* type — system sans everywhere (no monospace terminal look) */
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --mono: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* surfaces — light neutral */
  --bg:       #f6f8fb;
  --bg2:      #eceff4;
  --surface:  #ffffff;
  --surface2: #f2f5f9;

  /* ink — dark, readable */
  --text:  #17202e;
  --muted: #5a6579;
  --faint: #97a1b2;

  /* hairlines */
  --line:  #e7ebf1;
  --line2: #d6dce6;

  /* the ONE restrained accent + a small semantic set */
  --thread: #2563eb;   /* professional blue — the single accent */
  --busy:   #b26a00;   /* amber, used sparingly */
  --awake:  #157f4a;   /* green — handled / kept */
  --human:  #157f4a;
  --warn:   #c02a1b;   /* urgent red */

  /* per-element fallbacks (rook-shell sets these inline where it needs them) */
  --pc: var(--faint);
  --tc: var(--line2);
  --sc: var(--faint);
}

/* kill the dark-shell glows + gradient; a calm light page */
body{ background:var(--bg); background-image:none; color:var(--text); }
::selection{ background:rgba(37,99,235,.18); }

/* the topbar's baked-in dark gradient → light */
.topbar{ background:rgba(246,248,251,.9); }
.brand{ letter-spacing:.01em; }
.brand b{ font-weight:700; }

/* the river column */
#current{ padding-bottom:48px; }
.zone{ margin-bottom:4px; }
.zone.landed .zhead{ color:var(--awake); }
.s-empty{ color:var(--faint); font-size:12.5px; padding:6px 2px; }

/* ── the scannable strip — the product's live summary surface ── */
.shield-card{ }
.shield-card.pinned{
  border-color:color-mix(in srgb, var(--thread) 32%, var(--line2));
  box-shadow:0 1px 0 var(--line2);
}
.shield-card.shield-briefing{
  border-color:color-mix(in srgb, var(--thread) 45%, var(--line2));
  background:linear-gradient(180deg, #fff 0%, color-mix(in srgb, var(--thread) 4%, #fff) 100%);
}
.shield-card.shield-relationship{
  border-left:3px solid color-mix(in srgb, var(--awake) 55%, var(--line2));
}
.shield-card .swhy{ color:var(--muted); }
.s-felt{
  font-size:11px; font-weight:600; color:var(--thread);
  background:color-mix(in srgb, var(--thread) 10%, transparent);
  border-radius:999px; padding:1px 8px;
}
.s-actions{ margin:8px 0 0; padding-left:1.1rem; color:var(--muted); font-size:12.5px; }
.s-actions li{ margin:2px 0; }
/* top-email for-you/noise structural split */
.s-foryou{ margin:8px 0 0; padding-left:1.1rem; font-size:13.5px; font-weight:600; }
.s-foryou li{ margin:3px 0; }
.s-noise{ margin:6px 0 0; color:var(--muted); font-size:12px; opacity:.8; }
/* briefing pipeline-staleness chip */
.s-stale{ color:var(--muted); font-size:12px; opacity:.9; }

/* the "now" pill on urgent cards */
.snow{ color:var(--warn); background:color-mix(in srgb, var(--warn) 10%, transparent);
  border-radius:999px; padding:1px 8px; }

/* sender · date · category meta */
.s-meta{ display:flex; flex-wrap:wrap; align-items:center; gap:6px;
  margin-top:6px; font-size:11.5px; color:var(--faint); }
.s-meta .s-sender{ color:var(--muted); font-weight:600; }
.s-meta .s-dot{ color:var(--line2); }

/* one key quote, boxed */
.s-quote{ margin:9px 0 0; padding:8px 12px; font-style:normal; font-size:13px;
  line-height:1.5; color:var(--text); background:var(--surface2);
  border-left:3px solid var(--thread); border-radius:0 8px 8px 0; }

/* the ai key_points / keywords — bolded chips */
.s-keys{ display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; }
.s-keys .kw{ font-weight:700; font-size:11.5px; color:var(--thread);
  background:color-mix(in srgb, var(--thread) 9%, transparent);
  border:1px solid color-mix(in srgb, var(--thread) 22%, transparent);
  border-radius:999px; padding:2px 9px; letter-spacing:.01em; }

/* pinned label on the top-email card */
.s-pin{ margin-left:auto; font-size:10px; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:var(--thread); }

/* verb-card buttons ride as a compact row (no leading → glyph) */
.verbs .arrow::before{ content:none; }
.verbs .arrow{ text-align:center; }

/* ── achievements: the landed[] strip ── */
.landed-item{ display:flex; align-items:center; gap:9px; margin-bottom:7px;
  padding:8px 12px; border:1px solid var(--line); border-radius:9px;
  background:var(--surface); font-size:12.5px; color:var(--muted); }
.landed-item .lst{ font-size:10px; font-weight:700; letter-spacing:.06em;
  text-transform:uppercase; padding:2px 8px; border-radius:999px; }
.landed-item .lst.kept{ color:var(--awake); background:color-mix(in srgb, var(--awake) 12%, transparent); }
.landed-item .lst.shielded{ color:var(--thread); background:color-mix(in srgb, var(--thread) 12%, transparent); }
.landed-item .lst.handled{ color:var(--muted); background:var(--surface2); }
.landed-item .ltitle{ color:var(--text); }

/* ── the dossier detail panel (opened by the dossier card's "open") ── */
#shieldDetail{ margin:14px 20px 0; padding:14px 16px; border:1px solid var(--line2);
  border-radius:12px; background:var(--surface); }
#shieldDetail[hidden]{ display:none; }
#shieldDetail .dh{ display:flex; align-items:center; gap:10px; font-size:14px; color:var(--text); }
#shieldDetail .dx{ margin-left:auto; background:none; border:1px solid var(--line2);
  color:var(--faint); border-radius:8px; padding:2px 9px; cursor:pointer; }
#shieldDetail .dx:hover{ color:var(--text); border-color:var(--thread); }
#shieldDetail .dsec{ margin-top:12px; }
#shieldDetail .dlabel{ font-size:10.5px; letter-spacing:.09em; text-transform:uppercase;
  color:var(--faint); margin-bottom:6px; }
#shieldDetail .drow{ font-size:13px; color:var(--text); padding:3px 0; }
#shieldDetail .dsev{ font-size:10px; text-transform:uppercase; letter-spacing:.06em;
  color:var(--muted); border:1px solid var(--line2); border-radius:999px; padding:1px 7px; margin-left:4px; }

/* ── product chrome: nav + account + sign-in gate (UI unification U0/U1) ── */
.as-nav{
  display:flex; gap:.75rem; font-size:.8rem; align-items:center;
}
.as-nav a{
  color:inherit; opacity:.75; text-decoration:none;
}
.as-nav a:hover{ opacity:1; color:var(--thread); }
.as-nav a.as-nav-current{ opacity:1; font-weight:600; color:var(--text); }
.as-nav a.as-nav-ops{ opacity:.45; }

.as-account{
  display:flex; align-items:center; gap:.45rem; margin-left:.75rem;
  font-size:.78rem; color:var(--muted);
}
.as-account-email{
  max-width:12rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  color:var(--text); font-weight:500;
}
.as-chip{
  font-size:10px; font-weight:600; letter-spacing:.02em;
  border:1px solid var(--line2); border-radius:999px; padding:2px 8px;
  color:var(--muted); text-decoration:none; background:var(--surface);
}
.as-chip-ok{ color:var(--awake); border-color:color-mix(in srgb, var(--awake) 35%, var(--line2));
  background:color-mix(in srgb, var(--awake) 8%, transparent); }
.as-chip-warn{ color:var(--busy); border-color:color-mix(in srgb, var(--busy) 40%, var(--line2));
  background:color-mix(in srgb, var(--busy) 10%, transparent); }

.as-btn{
  font:inherit; font-size:.78rem; font-weight:600; cursor:pointer;
  border-radius:8px; border:1px solid var(--line2); padding:5px 12px;
  background:var(--surface); color:var(--text);
}
.as-btn:hover{ border-color:var(--thread); color:var(--thread); }
.as-btn:disabled{ opacity:.55; cursor:wait; }
.as-btn-primary{
  background:var(--thread); color:#fff; border-color:var(--thread);
}
.as-btn-primary:hover{ filter:brightness(1.05); color:#fff; }
.as-btn-ghost{
  background:transparent; border-color:transparent; color:var(--muted);
  padding:5px 8px;
}
.as-btn-ghost:hover{ color:var(--text); background:var(--surface2); }
.as-btn-lg{ font-size:1rem; padding:12px 22px; border-radius:10px; }

.as-gate{
  margin:8px 0 16px; padding:28px 24px; text-align:center;
  border:1px solid var(--line2); border-radius:14px;
  background:linear-gradient(180deg, #fff 0%, color-mix(in srgb, var(--thread) 5%, #fff) 100%);
  box-shadow:0 1px 0 var(--line);
}
.as-gate-title{ font-size:1.25rem; font-weight:700; color:var(--text); margin-bottom:8px; }
.as-gate-body{ font-size:.95rem; color:var(--muted); max-width:28rem; margin:0 auto 18px; line-height:1.5; }
.as-gate-foot{ margin-top:16px; font-size:.8rem; }
.as-gate-foot a{ color:var(--muted); text-decoration:none; }
.as-gate-foot a:hover{ color:var(--thread); }

/* setup CTA buttons on river empty state */
.setup-block .btn, .setup-block .btn.primary{
  font:inherit; font-size:.9rem; font-weight:600; cursor:pointer;
  border-radius:10px; border:1px solid var(--thread); padding:10px 18px;
  background:var(--thread); color:#fff; text-decoration:none;
}
.setup-block .btn:hover{ filter:brightness(1.05); }
.setup-block{
  padding:16px 14px; border:1px solid var(--line2); border-radius:12px;
  background:var(--surface); margin-top:4px;
}
.setup-block .swhy{ color:var(--text); font-size:.95rem; line-height:1.45; }