/* Tonight — the front door of C² (Sep 2026). Palette from the mockup:
   site green #1F4D3A, gold #B08D3F, cream #FAF7F0, white cards with #E3DFD4.
   The gold left border marks the "since you were here" band and nothing else.
   Purple stays the suggestion colour, as on the board's department pills.
   The all-caught-up panel uses the light green TINT: the confirmed green is
   reserved for councilConfirmed everywhere on the site.
   Touch targets are 44px or taller — officers use iPads. */

:root{
  --tn-green:#1F4D3A; --tn-green-ink:#2E4A3A; --tn-tint:#E7F0EA; --tn-tint-rule:#C3D8CB;
  --tn-gold:#B08D3F; --tn-gold-ink:#8A7434;
  --tn-cream:#FAF7F0; --tn-card:#ffffff; --tn-rule:#E3DFD4; --tn-rule-soft:#EDEAE1;
  --tn-ink:#1C1F1D; --tn-muted:#5A5F5C;
  --tn-purple:#4A3A78; --tn-purple-bg:#EFEAFB; --tn-purple-rule:#8A79C4;
  --tn-amber-ink:#8A5A00; --tn-amber-bg:#FBF0DC;
  --tn-serif:var(--display,"Newsreader",Georgia,serif);
  --tn-sans:var(--body,"Inter",system-ui,sans-serif);
}

/* The view switch. Tonight is the default; the board is one link away and
   unchanged. body.c2-tonight hides the board chrome inside #app, not the
   sticky header (Council Tools, Monthly Report, the account menu stay). */
body.c2-tonight #app > :not(.mast):not(#tonight):not(#routeQ){display:none !important}
body.c2-tonight #app .mast .needs-review{display:none !important}
body.c2-tonight #fcStickyActions .fc-sticky-tonight{display:none}
body.c2-tonight .bulk-bar{display:none !important}
#tonight[hidden],#routeQ[hidden]{display:none !important}

#tonight,#routeQ{
  font-family:var(--tn-sans);color:var(--tn-ink);
  max-width:980px;margin:6px 0 40px;display:flex;flex-direction:column;gap:20px;
}

/* head */
.tn-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap}
.tn-title{margin:0;font-family:var(--tn-serif);font-weight:600;font-size:1.9rem;line-height:1.15;color:var(--tn-green)}
.tn-title-sm{font-size:1.6rem}
.tn-sub{margin:5px 0 0;font-size:.95rem;color:var(--tn-muted)}
.tn-boardlink{font-size:.9rem;color:var(--tn-green);text-decoration:none;border-bottom:1px solid var(--tn-gold);padding:10px 0 2px;min-height:44px;display:inline-flex;align-items:flex-end}
.tn-boardlink:hover{color:#2E6B4F}

/* since band — the only gold left border on the site */
.tn-since{background:var(--tn-card);border:1px solid var(--tn-rule);border-left:4px solid var(--tn-gold);border-radius:10px;padding:16px 20px}
.tn-since-k{font-size:.68rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--tn-gold-ink)}
.tn-since-lines{margin-top:10px;display:flex;flex-direction:column;gap:7px;font-size:.95rem;line-height:1.45}
.tn-since-lines strong{font-weight:600}
.tn-muted{color:var(--tn-muted)}

/* all caught up — tint, not the confirmed green */
.tn-caught{background:var(--tn-tint);border:1px solid var(--tn-tint-rule);border-radius:10px;padding:24px 22px;display:flex;align-items:center;gap:16px;color:var(--tn-green)}
.tn-caught svg{flex:0 0 auto}
.tn-caught-t{font-family:var(--tn-serif);font-size:1.15rem;font-weight:600;color:var(--tn-green)}
.tn-caught-s{margin-top:4px;font-size:.95rem;color:var(--tn-green-ink);line-height:1.45}

/* sections */
.tn-sec{display:flex;flex-direction:column;gap:9px}
.tn-sec-h{display:flex;align-items:center;gap:10px}
.tn-sec-h h2{margin:0;font-family:var(--tn-serif);font-size:1.1rem;font-weight:600;color:var(--tn-green)}
.tn-count{font-size:.75rem;font-weight:700;color:#fff;background:var(--tn-green);border-radius:999px;padding:2px 9px;min-width:1.8em;text-align:center}
.tn-rows{display:flex;flex-direction:column;gap:9px}
.tn-row,.tn-route-card{background:var(--tn-card);border:1px solid var(--tn-rule);border-radius:10px;padding:14px 18px;display:flex;align-items:center;gap:18px}
.tn-row-main{flex:1;min-width:0}
/* A row that opens its concern (Sep 30): a real button, the whole row the target. */
button.tn-row-open{width:100%;font:inherit;color:inherit;text-align:left;cursor:pointer;min-height:44px;-webkit-appearance:none;appearance:none}
button.tn-row-open .tn-row-main,button.tn-row-open .tn-row-top,button.tn-row-open .tn-row-text,button.tn-row-open .tn-row-meta{display:block}
button.tn-row-open .tn-row-top{display:flex}
button.tn-row-open:hover{border-color:#C9C3B3;background:#FCFBF7}
button.tn-row-open:active{background:#F4F1E8}
button.tn-row-open:focus-visible{outline:2px solid var(--tn-gold);outline-offset:2px}
.tn-chev{flex:0 0 auto;display:flex;align-items:center;color:var(--tn-muted)}
button.tn-row-open:hover .tn-chev{color:var(--tn-ink,#1B2129)}
.tn-row-top{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.tn-ref{font-size:.76rem;font-weight:700;color:var(--tn-muted);letter-spacing:.04em}
.tn-row-text{margin-top:6px;font-size:.95rem;line-height:1.4;overflow-wrap:anywhere}
.tn-row-meta{margin-top:6px;font-size:.8rem;color:var(--tn-muted)}
.tn-empty{margin:0;padding:14px 18px;background:var(--tn-card);border:1px dashed var(--tn-rule);border-radius:10px;color:var(--tn-muted);font-size:.92rem}
.tn-sec-route .tn-route-card{padding:16px 18px}
.tn-sec-route .tn-row-text{margin-top:0}

/* pills */
.tn-pill{display:inline-block;font-size:.72rem;font-weight:600;border-radius:999px;padding:2px 9px;line-height:1.5;white-space:nowrap}
.tn-pill-q,.tn-pill-a{color:var(--tn-amber-ink);background:var(--tn-amber-bg)}
.tn-pill-src{color:var(--tn-purple);background:var(--tn-purple-bg)}
.tn-pill-plain{color:var(--tn-muted);background:#F1EFE8}
.tn-pill-urgent{color:var(--oxblood,#8C2F39);background:rgba(140,47,57,.1)}
.tn-pill-unsure{color:var(--tn-purple);background:var(--tn-purple-bg);border:1px dashed var(--tn-purple-rule);padding:3px 10px}

/* buttons — 44px minimum everywhere */
.tn-btn{font:inherit;font-size:.9rem;font-weight:600;border-radius:8px;padding:11px 18px;min-height:44px;cursor:pointer;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;gap:8px;line-height:1.2}
.tn-btn-primary{color:#fff;background:var(--tn-green);border:1px solid var(--tn-green)}
.tn-btn-primary:hover{background:#2E6B4F;border-color:#2E6B4F}
.tn-btn-secondary{color:var(--tn-green);background:var(--tn-tint);border:1px solid var(--tn-green)}
.tn-btn-outline{color:var(--tn-green);background:#fff;border:1px solid var(--tn-green)}
.tn-btn-quiet{color:var(--tn-muted);background:transparent;border:1px solid #D8D4C8;font-weight:400}
.tn-btn-lg{font-size:1rem;padding:14px 24px;min-height:48px;border-radius:9px}
.tn-btn:disabled{opacity:.6;cursor:default}
.tn-btn:focus-visible,.tn-boardlink:focus-visible,.tn-foot a:focus-visible,.tn-pick-opt:focus-visible{outline:2px solid var(--tn-gold);outline-offset:2px}

/* foot links — below the work, not competing with it */
.tn-foot{margin-top:4px;padding-top:18px;border-top:1px solid var(--tn-rule);display:flex;flex-direction:column;gap:4px}
.tn-foot a{font-size:.95rem;color:var(--tn-green);text-decoration:none;display:inline-flex;align-items:center;gap:8px;min-height:44px}
.tn-foot a:hover{text-decoration:underline}

/* routing */
.tn-route-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.tn-progress-n{font-size:.85rem;font-weight:600;color:var(--tn-muted);white-space:nowrap}
.tn-progress{height:5px;border-radius:999px;background:var(--tn-rule);overflow:hidden}
.tn-progress > div{height:100%;background:var(--tn-gold);transition:width .25s ease}
.tn-route-card-main{background:var(--tn-card);border:1px solid var(--tn-rule);border-radius:12px;padding:22px 24px;display:flex;flex-direction:column;gap:20px}
.tn-concern{margin:12px 0 0;font-family:var(--tn-serif);font-size:1.1rem;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.tn-suggest{border-top:1px solid var(--tn-rule-soft);padding-top:18px}
.tn-k{font-size:.68rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--tn-muted)}
.tn-suggest-row{margin-top:10px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.tn-suggest-name{font-family:var(--tn-serif);font-size:1.35rem;font-weight:600;color:var(--tn-purple)}
.tn-reason{margin-top:8px;font-size:.9rem;color:var(--tn-muted);line-height:1.45}
.tn-actions{display:flex;gap:12px;flex-wrap:wrap}
.tn-actions .tn-btn-primary{flex:1 1 auto}
.tn-pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.tn-pick-opt{font:inherit;font-size:.92rem;font-weight:600;color:var(--tn-ink);background:#fff;border:1px solid var(--tn-rule);border-radius:9px;padding:12px 14px;min-height:48px;cursor:pointer;text-align:left;display:flex;flex-direction:column;gap:2px}
.tn-pick-opt:hover{border-color:var(--tn-green)}
.tn-pick-opt.is-suggested{border-color:var(--tn-purple-rule);background:var(--tn-purple-bg);color:var(--tn-purple)}
.tn-pick-head{font-size:.75rem;font-weight:400;color:var(--tn-muted)}
.tn-pick-cancel{color:var(--tn-muted);font-weight:400;justify-content:center;align-items:center}
.tn-batch{background:var(--tn-card);border:1px solid var(--tn-rule);border-radius:10px;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:.92rem;color:var(--tn-muted);line-height:1.45}
.tn-foot-note{margin:0;font-size:.88rem;color:var(--tn-muted);line-height:1.5}
.tn-route-nav{display:flex;align-items:center;gap:8px}
.tn-route-nav a{font-size:.92rem;color:var(--tn-green);text-decoration:none;display:inline-flex;align-items:center;gap:6px;min-height:44px}

/* iPad portrait and phone: rows stack, buttons go full width */
@media (max-width:834px){
  .tn-row,.tn-route-card,.tn-batch{flex-direction:column;align-items:stretch;gap:12px}
  button.tn-row-open{flex-direction:row;align-items:center}
  .tn-row .tn-btn,.tn-route-card .tn-btn,.tn-batch .tn-btn{width:100%}
  .tn-head{flex-direction:column;align-items:flex-start;gap:4px}
  .tn-boardlink{padding-top:12px;padding-bottom:10px;min-height:44px;align-items:center;border-bottom:0;text-decoration:underline;text-decoration-color:var(--tn-gold)}
}
@media (max-width:520px){
  .tn-title{font-size:1.6rem}
  .tn-actions{flex-direction:column}
  .tn-actions .tn-btn{width:100%}
  .tn-route-card-main{padding:18px 16px}
  .tn-pick{grid-template-columns:1fr}
}

/* ---------------------------------------------------------------- review
   The drawer's top half when it is opened to review what Edgemere said
   (review.html #drReview, painted from reviewState / reviewPanelHtml).
   Edgemere's words sit in the amber "their claim" tint; the two statuses are
   two boxes that never merge; green appears only on a Council confirmation.
   Buttons are 44px or taller. */
.dr-review{margin:0 0 18px;padding:0 0 16px;border-bottom:1px solid var(--tn-rule)}
.dr-review[hidden]{display:none}
.rv{font-family:var(--tn-sans);color:var(--tn-ink)}
.rv-k{font-family:var(--mono,ui-monospace,monospace);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;
  font-weight:700;color:var(--tn-muted);margin:0 0 6px}
.rv-resp{border:1px solid rgba(176,125,43,.35);background:rgba(176,125,43,.08);border-radius:11px;padding:11px 13px;margin:0 0 12px}
.rv-resp.is-question{border-color:var(--tn-rule);background:var(--tn-card)}
.rv-resp.is-none{border-color:var(--tn-rule);background:transparent}
/* Oct 2026: a resolve claim with no explanation looks different from one with
   words — dashed, with a tag — so it isn't taken for a resolution. Never green. */
.rv-resp.is-unexplained{border-style:dashed;border-width:2px;background:transparent}
.rv-noexp{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;font-size:.72rem;font-weight:700;
  letter-spacing:0;text-transform:none;color:#7A3E12;background:#FBE9D6;border:1px solid #E2B98F;vertical-align:1px}
.rv-oc.is-unexplained{border-style:dashed}
.rv-who{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 7px;margin:0 0 6px;font-size:.84rem;color:var(--tn-muted);min-width:0}
.rv-who b{color:var(--tn-ink);font-weight:700}
.rv-dept{color:var(--tn-ink)}
.rv-title{color:var(--tn-muted)}
.rv-when{margin-left:auto;font-size:.74rem;color:var(--tn-muted);white-space:nowrap}
.rv-side{font-family:var(--mono,ui-monospace,monospace);font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--tn-muted)}
.rv-text{font-size:.95rem;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.rv-text.is-empty,.rv-none{color:var(--tn-muted);font-size:.9rem;margin:0}
.rv-status-h{display:flex;flex-wrap:wrap;align-items:center;gap:2px;margin:0 0 2px}
.rv-status-h .rv-k{margin:0}
.rv-status-h .ib-pop{flex:1 0 100%;margin:4px 0 8px}
.rv-status{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 12px}
.rv-oc{border:1px solid var(--rule,#C9CBC2);border-radius:11px;padding:9px 11px;min-width:0}
.rv-oc-k{display:block;font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--tn-muted);margin-bottom:3px}
.rv-oc-v{display:block;font-size:.88rem;font-weight:600;overflow-wrap:anywhere}
.rv-oc.is-claim{border-color:rgba(184,134,46,.45);background:rgba(184,134,46,.07)}
.rv-oc.is-claim .rv-oc-v{color:#7A5A1E}
/* Edgemere's expected date. A date gone by is stated, not alarmed: ink, bold. */
.rv-oc-due{display:block;font-size:.76rem;color:var(--tn-muted);margin-top:3px}
.rv-oc-due.is-passed{color:var(--tn-ink);font-weight:700}
.rv-oc.is-confirmed{border-color:rgba(47,125,110,.45);background:rgba(47,125,110,.07)}
.rv-oc.is-confirmed .rv-oc-v{color:#24614F}
.rv-acts{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 8px}
.rv-btn{min-height:44px;width:auto;padding:10px 16px}
.rv-btn-link{min-height:44px;min-width:44px;padding:0 10px}
.rv-replybox{margin:4px 0 10px}
.rv-replybox[hidden]{display:none}
.rv-replybox label{display:block;font-size:.84rem;font-weight:600;margin:0 0 6px}
.rv-replybox textarea{width:100%;min-height:110px;font:inherit;font-size:.95rem;box-sizing:border-box}
.rv-caveat{font-size:.82rem;color:var(--tn-ink);margin:6px 0 8px;line-height:1.4}
/* Post the response for families (Sep 30). Offered only after the Council confirms. */
.rv-post-why{font-size:.8rem;color:var(--tn-muted)}
.rv-btn:disabled{opacity:.55;cursor:default}
.rv-posted{font-size:.84rem;margin:0 0 8px;color:var(--tn-ink)}
.rv-postbox label{margin-top:10px}
.rv-postbox textarea{min-height:80px}
.rv-post-who{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.rv-post-who input{width:100%;min-height:44px;box-sizing:border-box;font:inherit}
@media (max-width:520px){.rv-post-who{grid-template-columns:1fr}}
.rv-msg-line{font-size:.84rem;margin:0 0 6px;min-height:0}
.rv-msg-line:empty{display:none}
.rv-msg-line.ok{color:var(--tn-green-ink)}
.rv-msg-line.bad{color:var(--oxblood,#8C2F39)}
.rv-turn{font-size:.88rem;margin:4px 0 12px;padding:9px 11px;border-radius:9px;background:var(--tn-cream);border:1px solid var(--tn-rule-soft)}
.rv-convo{margin-top:6px}
.rv-msg{border-top:1px solid var(--tn-rule-soft);padding:9px 0}
.rv-msg-council .rv-text{color:var(--tn-green-ink)}
/* The two statuses stay side by side even on a phone — they are a pair to
   read together, and a long key wraps inside its own box. */
@media (max-width:420px){
  .rv-when{margin-left:0}
  .rv-acts .rv-btn{flex:1 1 100%}
}

/* Send to another staff member (Oct 2026) */
.rv-sendbox select,.rv-sendbox input{width:100%;min-height:44px;box-sizing:border-box;font:inherit}
.rv-sendbox select{margin:0 0 4px}
.rv-or{font-size:.8rem;color:var(--tn-muted);margin:8px 0 4px;text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.rv-opt{font-weight:400;color:var(--tn-muted)}
.rv-sendbox textarea{min-height:70px}

/* Sent to — who has this concern, and when (Oct 1) */
.rv-sent{margin:4px 0 12px;padding:10px 12px;border:1px solid var(--tn-rule-soft);border-radius:9px;background:var(--tn-cream)}
.rv-sent .rv-k{margin:0 0 4px}
.rv-sent ul{margin:0;padding:0;list-style:none}
.rv-sent li{font-size:.86rem;padding:3px 0;display:flex;flex-wrap:wrap;gap:4px 8px;align-items:baseline}
.rv-sent-when{font-size:.78rem;color:var(--tn-muted)}