/* ================= FEEDBACK (2026-10-23) =================
   The lightbulb, the report pop-up, the board, What changed and Time spent.
   Loaded by both pages of the app and by the board's own page. The look is the
   page's own: every colour, font, border and radius below is one of its
   tokens (--bg --panel --panel2 --line --ink --dim --amber --on-amber --r
   --border --font-body), so the same sheet is Plum Press on / and "the sign"
   (white on black) on /new and /feedback. <html data-look="sign"> picks the
   sign's few extra values.

   DESIGN.md's rules hold here: no bold, no uppercase, no rounded corners and
   no shadows on the sign. The ONE thing that is not shades of a single hue is
   the board's status colour: each status has its own hue (as the owner's other
   apps do), named in words on its badge as well, so colour is never the only
   signal. On the sign it is a bar and a badge on black, never a fill.

   EIGHT STATUSES (2026-10-25): "To revisit later" is a clay, a hue none of the
   others uses (tesc-crm colors.ts: light #8A6A52 on #F2EBE4 with a #6B4C37
   badge; dark #c9a78d on #2b231e). On Plum Press a badge is a FILL, so it
   takes the darker --fb-<status>-badge tone (tesc-crm's own, white text on it
   4.5:1 or better: test/feedback-contrast.test.js); bars and edges keep the
   brighter hue. On the sign a status is a bar and an outlined badge on black.

   Everything inside a feedback window carries .fb-ui, which restyles the
   page's generic classes (.btn .ghost .iconbtn .chip .tag .card) for itself,
   so a rule written for the page's own buttons cannot reach in. */
:root{
  --fb-lit:#e8b02e; --fb-lit-ink:#2e2b25; --fb-lit-glow:rgba(232,176,46,.45);
  --fb-new:#2463b8; --fb-triaged:#7446c2; --fb-approved:#0e8a8f; --fb-working:#c77a0a;
  --fb-resolved:#27844a; --fb-declined:#b23b3b; --fb-later:#8a6a52; --fb-duplicate:#85878e;
  --fb-new-fill:#e5eefb; --fb-triaged-fill:#efe8fb; --fb-approved-fill:#d9f1ef; --fb-working-fill:#fcefd2;
  --fb-resolved-fill:#e1f2e6; --fb-declined-fill:#fbe4e2; --fb-later-fill:#f2ebe4; --fb-duplicate-fill:#ebecee;
  --fb-new-badge:#1d56a3; --fb-triaged-badge:#6538b0; --fb-approved-badge:#0a6f74; --fb-working-badge:#8f4e04;
  --fb-resolved-badge:#1d6a3a; --fb-declined-badge:#a32d2d; --fb-later-badge:#6b4c37; --fb-duplicate-badge:#5f5e5a;
  --fb-edit:#8a1463; --fb-edit-rule:#c23a93;
  --fb-wait:#c47f00; --fb-wait-bg:#fff4d6; --fb-wait-ink:#5c3b00;
  --fb-stop:#c62828; --fb-stop-bg:#fdecec; --fb-stop-ink:#5a1010;
  --fb-err-bg:#fdecec; --fb-err-ink:#8a2020; --fb-ok-bg:#e1f2e6; --fb-ok-ink:#1d6a3a;
  --fb-wash:rgba(255,255,255,.55);
  --fb-surface:var(--panel2,#fbf7ef); --fb-ground:var(--panel,#f6f0e6);
}
:root[data-look="sign"]{
  --fb-lit:#fff; --fb-lit-ink:#000; --fb-lit-glow:rgba(255,255,255,.35);
  --fb-new:#6ea2ff; --fb-triaged:#b79cff; --fb-approved:#4fd1d6; --fb-working:#f0a93a;
  --fb-resolved:#5fcf8a; --fb-declined:#f07a7a; --fb-later:#c9a78d; --fb-duplicate:#a8a8a8;
  --fb-new-fill:#0a0f1a; --fb-triaged-fill:#100c1a; --fb-approved-fill:#07151a; --fb-working-fill:#1a1306;
  --fb-resolved-fill:#07140c; --fb-declined-fill:#1a0a0a; --fb-later-fill:#2b231e; --fb-duplicate-fill:#101010;
  --fb-edit:#ff9bd8; --fb-edit-rule:#ff9bd8;
  --fb-wait:#f0a93a; --fb-wait-bg:#1a1306; --fb-wait-ink:#ffe3a8;
  --fb-stop:#f07a7a; --fb-stop-bg:#1a0a0a; --fb-stop-ink:#ffc9c9;
  --fb-err-bg:#1a0a0a; --fb-err-ink:#ffc9c9; --fb-ok-bg:#07140c; --fb-ok-ink:#b8f0cc;
  --fb-wash:rgba(255,255,255,.06);
}

/* ---- the lightbulb ----
   Absolutely placed in the corner of the header (and of each window), so it
   adds nothing to any height: the two scroll models and the fold are untouched.
   Lit: a filled bulb in a frame; unlit (nothing open) reads as the page's own
   outline buttons do. */
header{position:relative}
.fb-bulb{position:absolute;top:6px;right:6px;z-index:5;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;
  border:var(--border,1.5px solid #fff);border-radius:var(--r,0);background:var(--fb-lit);color:var(--fb-lit-ink);
  text-decoration:none;cursor:pointer;
  -webkit-touch-callout:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;touch-action:manipulation}
.fb-bulb[hidden]{display:none!important}
/* A finger's target is 44px, not the drawn 34-36 (2026-10-25: an icon-only control
   gets the 44px rule). The ring is taken from the margin around the drawn box, so
   it adds no layout and the header keeps its height; the developer's count badge
   is ::after and is untouched. Nothing else sits within 5px of either bulb. */
.fb-bulb::before{content:"";position:absolute;inset:-7px}      /* from the padding box: about 5.5px past the drawn border, so 44-48px in all */
.fb-bulb svg{width:20px;height:20px;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.fb-bulb:hover{filter:brightness(1.06)}
.fb-bulb.is-held{filter:brightness(.78);transform:scale(.93)}                 /* held: deeper, so the press shows the board is next */
.fb-bulb:focus-visible{outline:2px solid var(--ink,#000);outline-offset:2px}
.fb-bulb.is-lit{background:var(--fb-lit);box-shadow:0 0 0 3px var(--fb-lit-glow)}
/* Lit is deliberately NOT the header buttons' black square: it is the one filled (white) box in the header, with a
   frame round it, so "there is something new / the module is on" reads at a glance. Unlit it is their outline. */
:root[data-look="sign"] .fb-bulb.is-lit{box-shadow:none;outline:1.5px solid #fff;outline-offset:3px}
/* the developer's number of New reports on its corner (99+ past 99) */
.fb-bulb[data-count]::after{content:attr(data-count);position:absolute;top:-8px;right:-8px;min-width:18px;height:18px;padding:0 4px;
  display:inline-flex;align-items:center;justify-content:center;font:400 11px/1 var(--font-body,system-ui);
  background:var(--ink,#000);color:var(--bg,#fff);border:1px solid var(--bg,#fff)}
:root[data-look="sign"] .fb-bulb[data-count]::after{background:#fff;color:#000;border-color:#000}
.fb-bulb-sheet{top:10px;right:10px;width:34px;height:34px}
.modal>.fb-bulb-sheet~*{}                                   /* the bulb is first in the window; nothing is pushed */
.modal{position:relative}
/* the version in Settings can be pressed: it says so with a dotted line */
#buildInfo.fb-footv{cursor:pointer;text-decoration:underline dotted;text-underline-offset:3px}
@media (max-width:420px){.fb-bulb{top:4px;right:4px;width:34px;height:34px}}

/* ---- shared furniture, inside every feedback window ---- */
.fb-ui{font-family:var(--font-body,system-ui,sans-serif);color:var(--ink,#000);font-size:15px;line-height:1.45;text-transform:none;letter-spacing:normal}
.fb-ui *,.fb-ui *::before,.fb-ui *::after{box-sizing:border-box}
.fb-ui [hidden]{display:none!important}
.fb-ui h2,.fb-ui h3{font-weight:400;margin:0}
.fb-ui a{color:inherit}
.fb-ui .btn,.fb-ui .ghost,.fb-ui .iconbtn,.fb-ui .fb-linkbtn{font:inherit;font-size:15px;line-height:1.15;cursor:pointer;
  border:var(--border,1.5px solid currentColor);border-radius:var(--r,0);background:transparent;color:var(--ink,#000);
  padding:7px 14px 8px;min-height:38px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;text-transform:lowercase;letter-spacing:normal;box-shadow:none}
.fb-ui .btn{background:var(--amber,#000);color:var(--on-amber,#fff);border-color:var(--amber,#000)}
.fb-ui .ghost:hover,.fb-ui .iconbtn:hover{background:var(--selected,rgba(128,128,128,.18))}
.fb-ui .btn:hover{filter:brightness(1.1)}
.fb-ui .btn:disabled,.fb-ui .ghost:disabled,.fb-ui .iconbtn:disabled{opacity:.5;cursor:default}
.fb-ui .btn.fb-run{background:transparent;color:var(--ink,#000);border-color:var(--ink,#000)}
.fb-ui .iconbtn{min-height:30px;width:auto;height:auto;padding:3px 10px;font-size:13px}
.fb-ui .fb-attach-pick{border:1.5px solid var(--ink,#000)!important;padding:5px 12px!important;min-height:34px!important;display:inline-flex!important;align-items:center;text-decoration:none!important;text-transform:lowercase}
.fb-ui .fb-linkbtn{border:0;background:none;padding:0;min-height:0;display:inline;text-decoration:underline dotted;text-underline-offset:3px}
.fb-ui input[type=text],.fb-ui input[type=search],.fb-ui input[type=password],.fb-ui input[type=date],.fb-ui select,.fb-ui textarea{
  width:100%;font:inherit;font-size:15px;color:var(--ink,#000);background:var(--fb-ground);border:var(--border,1.5px solid currentColor);
  border-radius:var(--r,0);padding:9px 11px;text-transform:none;letter-spacing:normal}
.fb-ui textarea{min-height:110px;resize:vertical;display:block}
.fb-ui input:focus,.fb-ui textarea:focus,.fb-ui select:focus{outline:2px solid var(--ink,#000);outline-offset:1px}
.fb-ui input[type=checkbox],.fb-ui input[type=radio]{width:auto;accent-color:var(--amber,#000)}
.fb-opt{color:var(--dim,#666);text-transform:none;letter-spacing:normal}
.fb-label{display:block;font-size:14px;color:var(--dim,#666);margin-bottom:5px}
.fb-field{display:block;margin:0 0 12px}
.fb-sentwith{margin:0 0 10px;font-size:13.5px;color:var(--dim,#666);overflow-wrap:anywhere}
.fb-sentwith b{font-weight:400;color:var(--ink,#000);text-decoration:underline dotted}
.fb-err,.fb-ok,.fb-note{margin:0 0 10px;padding:9px 12px;font-size:14px;line-height:1.45;border-left:4px solid currentColor}
.fb-err{background:var(--fb-err-bg);color:var(--fb-err-ink)}
.fb-ok{background:var(--fb-ok-bg);color:var(--fb-ok-ink)}
.fb-note{background:var(--fb-wait-bg);color:var(--fb-wait-ink)}
.fb-err a,.fb-ok a{color:inherit}
/* The sign look has no tinted status colours (the app's forms are white 1.5px frames on black): a refusal,
   a note and a done line are the same frame on the grey band, told apart by their words and the left bar. */
:root[data-look="sign"] .fb-err,:root[data-look="sign"] .fb-ok,:root[data-look="sign"] .fb-note,:root[data-look="sign"] .fb-banner.is-err{
  background:var(--band,#4d4d4d);color:#fff;border:1.5px solid #fff;border-left-width:4px}
:root[data-look="sign"] .fbm .is-missing textarea,:root[data-look="sign"] .fbm .is-missing input{border-color:#fff;outline:2px dotted #fff;outline-offset:1px}
.fb-label-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 5px;min-height:26px}
.fb-label-row .fb-label{margin:0}
/* Dictate (2026-10-25): a small outline button on the Details label row; lit while it listens */
.fb-ui .fbm-dictate{min-height:30px;padding:3px 10px;font-size:15px}
.fb-ui .fbm-dictate.is-listening{background:var(--ink,#000);color:var(--bg,#fff)}
.fb-interim{margin:4px 0 0;font-size:13px;font-style:italic;color:var(--dim,#666);overflow-wrap:anywhere}
.fb-hide{display:none!important}
.fb-figcap{font-size:13px;color:var(--dim,#666)}
.fb-ui .tag{display:inline-flex;align-items:center;flex:none;font-size:12px;line-height:1;padding:3px 7px;text-transform:none;letter-spacing:normal;font-weight:400;border:1px solid var(--dim,#666);color:var(--dim,#666);white-space:nowrap}
.fb-ui .tag.off{opacity:.8}
.fb-ui .nores{padding:34px 16px;text-align:center;color:var(--dim,#666)}
.fb-ui .nores b{display:block;font-weight:400;color:var(--ink,#000);font-size:17px;margin-bottom:4px}
.fb-ui .empty-cell{color:var(--dim,#666)}
.fb-ui .card{background:var(--fb-surface);border:var(--border,1.5px solid currentColor);border-radius:var(--r-card,0);padding:12px 14px}
.fb-ui .seg{display:inline-flex}
.fb-ui .seg button{font:inherit;font-size:14px;padding:7px 12px;border:var(--border,1.5px solid currentColor);background:transparent;color:var(--ink,#000);cursor:pointer;margin-left:-1.5px}
.fb-ui .seg button[aria-pressed="true"]{background:var(--ink,#000);color:var(--bg,#fff)}
.fb-ui .pastwrap{border:var(--border,1.5px solid currentColor);margin:10px 0 0;background:var(--fb-surface)}
.fb-ui .pastwrap>summary{cursor:pointer;padding:9px 12px}

/* ---- screenshots and files: paste, drop or pick (attach.js) ---- */
.fb-attach{margin:0 0 12px}
.fb-attach-input{font-size:13px;max-width:100%}
.fb-attach.is-live .fb-attach-input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.fb-attach-hint{margin:0;font-size:13.5px;color:var(--dim,#666)}
.fb-attach-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.fb-attach.has-files .fb-attach-list{margin-top:8px}
.fb-attach-list li{display:flex;flex-direction:column;gap:4px;width:118px;font-size:12px;color:var(--dim,#666)}
.fb-attach-list img{width:118px;height:78px;object-fit:cover;border:var(--border,1px solid currentColor)}
.fb-attach-cap{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fb-attach-doc{display:flex;align-items:center;justify-content:center;width:118px;height:78px;border:1.5px dashed currentColor;font-size:14px;letter-spacing:.04em}
.fb-attach-err{margin:6px 0 0;font-size:13.5px;color:var(--fb-err-ink)}
.fb-attach-shot[hidden]{display:none}
form.fb-dropping{outline:2px dashed currentColor;outline-offset:4px}

/* ================= the report pop-up (#fbm) =================
   A native <dialog>: on a phone opened with showModal() (the page behind
   inert, a card centred); on a computer shown BESIDE the page (.is-modeless).
   Above the phone breakpoint the title bar moves it with a transform
   (popup.js); at 640px and below nothing moves. */
dialog.fbm{width:min(560px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:0;border:var(--border,1.5px solid currentColor);border-radius:var(--r-card,0);
  background:var(--fb-surface);color:var(--ink,#000);overflow:hidden}
dialog.fbm::backdrop,dialog.fb-ov::backdrop,dialog.fb-chg::backdrop,dialog.fb-ctx::backdrop{background:var(--scrim,rgba(46,43,37,.55))}
dialog.fbm[open]{display:flex;flex-direction:column}
.fbm-form{display:flex;flex-direction:column;min-height:0;flex:1 1 auto;margin:0}
.fbm-head[data-fbm-drag]{cursor:move;touch-action:none;user-select:none;-webkit-user-select:none}
.fbm.is-moving{user-select:none;-webkit-user-select:none}
.modal-head{padding:14px 16px 10px;border-bottom:var(--border-thin,1px solid currentColor);display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:space-between}
.modal-head h2{font-size:21px;line-height:1.2;text-transform:lowercase}
.modal-head h2:focus,.fb-page h2:focus,.fb-chg h2:focus,.fb-ctx h2:focus{outline:none}
.modal-head .msub{display:block;font-size:13.5px;color:var(--dim,#666);margin-top:2px;text-transform:none}
.fbm-body{padding:14px 16px 16px;overflow-y:auto;min-height:0;flex:1 1 auto;overscroll-behavior:contain}
.fbm-body>:last-child{margin-bottom:0}
.fbm-body textarea{min-height:140px}
.fbm .is-missing textarea,.fbm .is-missing input{border-color:var(--fb-stop)}
.fbm-acts{flex:none;display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap;padding:12px 16px 14px;border-top:var(--border-thin,1px solid currentColor)}
.fbm-done{padding:26px 20px 8px;text-align:center}
.fbm-tick{width:46px;height:46px;margin:0 auto 10px;display:flex;align-items:center;justify-content:center;border:var(--border,1.5px solid currentColor);font-size:24px}
.fbm-done h2{font-size:22px}
.fbm-done-s{margin:6px 0 12px;color:var(--dim,#666)}
.fbm-done .fb-err,.fbm-done .fb-note,.fbm-done .fb-ok{text-align:left}
.fbm-done .fbm-acts{justify-content:center;border-top:0;padding:6px 0 14px}
/* BESIDE THE PAGE: not in the top layer, so fixed and centred as a modal one
   is (the drag offsets are measured from there), no backdrop, over the page's
   windows (.modal-bg is 50) and under its toast (99) */
dialog.fbm.is-modeless{position:fixed;inset:0;margin:auto;z-index:60;height:fit-content}
@media (max-width:640px){
  dialog.fbm{width:calc(100vw - 20px);max-width:calc(100vw - 20px);max-height:calc(100dvh - 40px);margin:auto;transform:none!important}
  .fbm-head[data-fbm-drag]{cursor:auto;touch-action:auto;user-select:auto;-webkit-user-select:auto}
  .fbm input[type=text],.fbm textarea{font-size:16px}       /* 16px: iOS does not zoom */
  .fbm-body{padding:12px 14px 14px}
  .fbm-body textarea{min-height:120px}
  .fbm-acts{padding:10px 14px 14px}
  .fbm-acts .btn,.fbm-acts .ghost{flex:1 1 0;min-height:44px}
  .fbm-acts .fbm-again{flex-basis:100%;order:3}
}

/* ================= the board =================
   One component, two mounts: the overlay (a modal <dialog>, .fb-ov) over
   whatever is on screen, and the page (public/feedback.html). */
dialog.fb-ov{width:min(1180px,calc(100vw - 32px));height:calc(100dvh - 32px);max-width:none;max-height:none;padding:0;
  border:var(--border,1.5px solid currentColor);border-radius:var(--r-card,0);background:var(--fb-ground);color:var(--ink,#000);overflow:hidden}
dialog.fb-ov[open]{display:flex;flex-direction:column}
.fb-ov>.modal-head{background:var(--fb-surface)}
.fb-ov-acts{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.fb-ov-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:14px 16px 18px;position:relative}
@media (max-width:640px){
  dialog.fb-ov{width:calc(100vw - 16px);height:calc(100dvh - 24px);margin:auto}
  .fb-ov>.modal-head{padding:10px 12px 8px}
  .fb-ov-body{padding:10px 10px 16px}
}
.fb-page{max-width:1180px;margin:0 auto;padding:14px 16px 90px}
.fb-crumb{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 14px;font-size:17px;text-transform:lowercase}
.fb-crumb a.hb{display:inline-flex;align-items:center;gap:4px;text-decoration:none}
.fb-crumb a.hb:hover{text-decoration:underline}
.fb-crumb .ni{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
.fb-crumb b{font-weight:400}
.fb-crumb b:focus{outline:none}
.fb-board{min-width:0}
.fb-head{display:flex;align-items:baseline;gap:6px 14px;flex-wrap:wrap;margin:0 0 10px}
.fb-head .count{font-size:15px;color:var(--dim,#666)}
.fb-head .count b{font-weight:400;color:var(--ink,#000)}
.fb-me{font-size:14px;color:var(--dim,#666)}
.fb-headlinks{display:flex;gap:6px;margin-left:auto;flex-wrap:wrap}
.fb-banner{margin:0 0 10px;padding:9px 12px;border-left:4px solid currentColor;background:var(--fb-wash);font-size:14px}
.fb-banner.is-err{background:var(--fb-err-bg);color:var(--fb-err-ink)}

/* The board head above the cards is the counts line, the waiting banner and, when a
   link or the banner filtered the list, a line that says so (CHK #292, 2026-10-27):
   no composer, filter row, colour key or Copy all new. */
.fb-filternote{margin:0 0 12px;padding:8px 12px;font-size:14px;line-height:1.45;border:var(--border-thin,1px solid currentColor);display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px}
.fb-filternote[hidden]{display:none}
.fb-archnote{font-size:14px;color:var(--dim,#666);align-self:center;padding:0 6px}
.fb-waiting-banner,.fb-waitingbanner{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;width:100%;max-width:100%;min-width:0;box-sizing:border-box;margin:0 0 12px;padding:10px 14px;font:inherit;font-size:15px;text-align:left;cursor:pointer;
  background:var(--fb-wait-bg);border:2px solid var(--fb-wait);color:var(--fb-wait-ink)}
.fb-waiting-banner>span:nth-child(2){flex:1 1 12em;min-width:0;overflow-wrap:anywhere}
.fb-waiting-banner.on{outline:2px solid var(--fb-wait);outline-offset:2px}
.fb-wb-flag{font-size:20px;line-height:1;color:var(--fb-wait)}
.fb-wb-go{margin-left:auto;white-space:nowrap}
@media (max-width:640px){.fb-wb-go{margin-left:32px;flex:1 1 100%}}   /* on a narrow banner "Show them" drops under the words, whole */

/* badges: each status its own hue, and its name in words */
.fb-status,.fb-tagx{display:inline-flex;align-items:center;flex:none;font-size:12px;line-height:1;padding:4px 9px;white-space:nowrap;
  color:var(--fb-hue,var(--dim,#666));border:1.5px solid var(--fb-hue,var(--dim,#666));background:transparent}
.fb-status-new{--fb-hue:var(--fb-new)} .fb-status-triaged{--fb-hue:var(--fb-triaged)} .fb-status-approved{--fb-hue:var(--fb-approved)}
.fb-status-working{--fb-hue:var(--fb-working)} .fb-status-resolved{--fb-hue:var(--fb-resolved)} .fb-status-declined{--fb-hue:var(--fb-declined)}
.fb-status-later{--fb-hue:var(--fb-later)} .fb-status-duplicate{--fb-hue:var(--fb-duplicate)}
.fb-status-new{--fb-badge:var(--fb-new-badge)} .fb-status-triaged{--fb-badge:var(--fb-triaged-badge)} .fb-status-approved{--fb-badge:var(--fb-approved-badge)}
.fb-status-working{--fb-badge:var(--fb-working-badge)} .fb-status-resolved{--fb-badge:var(--fb-resolved-badge)} .fb-status-declined{--fb-badge:var(--fb-declined-badge)}
.fb-status-later{--fb-badge:var(--fb-later-badge)} .fb-status-duplicate{--fb-badge:var(--fb-duplicate-badge)}
/* Plum Press: a filled badge, in the darker tone so its white words read (4.5:1 or better) */
:root:not([data-look="sign"]) .fb-status{background:var(--fb-badge,var(--fb-hue));color:#fff;border-color:var(--fb-badge,var(--fb-hue))}
.fb-tagx.fb-edited{--fb-hue:var(--fb-edit)}
.fb-line .tag{font-size:11.5px;padding:2px 6px;flex:none}

/* the grid of cards: a bar and a tint in the status's hue, compact when closed */
.fb-grid{list-style:none;margin:0;padding:0;display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));align-items:start}
.fb-card{--fill:var(--fb-surface);--edge:var(--line,#000);--fb-row:56px;position:relative;min-width:0;background:var(--fill);
  border:1.5px solid var(--edge);border-left-width:7px;color:var(--ink,#000);scroll-margin-top:70px;scroll-margin-bottom:170px}
.fb-st-new{--fill:var(--fb-new-fill);--edge:var(--fb-new)} .fb-st-triaged{--fill:var(--fb-triaged-fill);--edge:var(--fb-triaged)}
.fb-st-approved{--fill:var(--fb-approved-fill);--edge:var(--fb-approved)} .fb-st-working{--fill:var(--fb-working-fill);--edge:var(--fb-working)}
.fb-st-resolved{--fill:var(--fb-resolved-fill);--edge:var(--fb-resolved)} .fb-st-declined{--fill:var(--fb-declined-fill);--edge:var(--fb-declined)}
.fb-st-later{--fill:var(--fb-later-fill);--edge:var(--fb-later)} .fb-st-duplicate{--fill:var(--fb-duplicate-fill);--edge:var(--fb-duplicate)}
/* parked on purpose: a dashed frame, the bar on the left stays solid */
.fb-card.fb-st-later{border-style:dashed;border-left-style:solid}
.fb-tick{position:absolute;z-index:1;left:0;top:0;width:38px;height:var(--fb-row);display:flex;align-items:center;justify-content:center;cursor:pointer}
.fb-tick input{width:17px;height:17px;margin:0;cursor:pointer}
.fb-card:has(.fb-tick input:checked){outline:3px solid var(--ink,#000);outline-offset:1px}
.fb-more>summary{list-style:none;cursor:pointer;min-height:var(--fb-row);display:flex;align-items:center;gap:8px;padding:7px 78px 7px 12px}
.fb-dev .fb-more>summary{padding-left:38px}
.fb-more>summary::-webkit-details-marker{display:none}
.fb-more>summary:hover{background:var(--fb-wash)}
.fb-sum{display:block;flex:1 1 auto;min-width:0}
/* LINE 1 never wraps on a computer (tesc-crm, CHK #174 / style review 2026-10-05): #id, the
   date, the subject, the status, in that order; only the subject gives way (an ellipsis),
   and the status sits right after it, not at the far edge. A phone's line 1 is running text
   (see the phone block below). */
.fb-top{display:flex;flex-wrap:nowrap;align-items:center;gap:4px 6px;min-width:0}
.fb-id{font-size:14px;flex:none;font-variant-numeric:tabular-nums}
.fb-when{flex:none;white-space:nowrap;font-size:13px;color:var(--dim,#666);font-variant-numeric:tabular-nums}
.fb-subject{flex:0 1 auto;min-width:0;font-size:16px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fb-sj-cut{display:none}
.fb-top .fb-status{font-size:11.5px;padding:3px 7px;flex:none}
.fb-line{display:flex;flex-wrap:wrap;align-items:center;gap:4px 5px;min-width:0;margin-top:4px;font-size:13px;line-height:1.25;color:var(--dim,#666);white-space:nowrap}
.fb-who{min-width:0;max-width:100%;flex:0 1 auto;overflow:hidden;text-overflow:ellipsis}
.fb-chev{flex:none;width:7px;height:7px;margin:0 3px 3px 0;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg)}
.fb-more[open] .fb-chev{transform:rotate(-135deg);margin:3px 3px 0 0}
.fb-more[open] .fb-subject{white-space:normal;overflow-wrap:anywhere}
/* an OPEN card shows the whole subject, wrapping beside the status; the status goes under it when the card is narrow */
@media (min-width:641px){
  .fb-more[open] .fb-top{flex-wrap:wrap}
  .fb-more[open] .fb-subject{flex:1 1 7em;min-width:7em}
}
.fb-copy-row{position:absolute;z-index:1;right:10px;top:calc((var(--fb-row) - 30px) / 2);min-height:30px!important;height:30px;padding:0 10px!important;font-size:13px!important;background:var(--fb-surface)!important}
.fb-copy.is-copied{background:var(--ink,#000)!important;color:var(--bg,#fff)!important}
.fb-copy.is-failed{color:var(--fb-err-ink)!important;border-color:var(--fb-err-ink)!important}
.fb-card.fb-just,.fb-card.fb-ring{outline:3px solid var(--ink,#000);outline-offset:2px}
.fb-card.is-sending{opacity:.55;pointer-events:none}
/* the flag on the row and its menu; Approve, one press */
.fb-flag{margin:0;font-family:inherit;cursor:pointer;-webkit-appearance:none;appearance:none;gap:5px;background:transparent}
.fb-flag:hover,.fb-flag[aria-expanded=true]{background:var(--fb-wash)}
.fb-flag-caret{display:inline-block;width:5px;height:5px;margin:-3px 1px 0 0;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}
.fb-approve,.fb-bringback{display:inline-flex;align-items:center;flex:none;margin:0;cursor:pointer;font:inherit;font-size:12px;line-height:1;padding:4px 8px;white-space:nowrap;
  color:#fff;background:var(--fb-approved-badge);border:0}
:root[data-look="sign"] .fb-approve{color:#000;background:var(--fb-approved)}
.fb-bringback{background:var(--fb-later-badge)}
:root[data-look="sign"] .fb-bringback{color:#000;background:var(--fb-later)}
.fb-approve:hover,.fb-bringback:hover{filter:brightness(1.1)}
.fb-bringback-full{font-size:14px;padding:8px 14px;min-height:38px}
.fb-parkednote{margin:10px 0 2px;font-size:13.5px;color:var(--dim,#666)}
.fb-flag-menu{position:absolute;z-index:6;left:38px;top:calc(var(--fb-row) - 6px);display:grid;gap:2px;margin:0;padding:6px;min-width:220px;max-width:calc(100% - 48px);
  background:var(--fb-surface);color:var(--ink,#000);border:var(--border,1.5px solid currentColor)}
.fb-flag-opt{display:flex;align-items:center;gap:8px;width:100%;margin:0;padding:6px 8px;border:0;background:none;color:var(--ink,#000);font:inherit;font-size:14px;text-align:left;cursor:pointer}
.fb-flag-opt:not(:disabled):hover,.fb-flag-opt:focus-visible{background:var(--selected,rgba(128,128,128,.2));outline:none}
.fb-flag-opt:disabled{cursor:default}
.fb-flag-now{margin-left:auto;font-size:12px;color:var(--dim,#666)}
/* the shelf under the grid: "To revisit later" (2026-10-25; tesc-crm ParkedSection) */
.fb-later{margin:18px 0 0}
.fb-later h2{margin:0;font-size:inherit}
.fb-later-head{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;width:100%;min-height:40px;margin:0;padding:8px 14px;box-sizing:border-box;
  font:inherit;font-size:15px;text-align:left;color:var(--ink,#000);background:var(--fb-later-fill);border:1.5px dashed var(--fb-later);border-radius:var(--r,0);cursor:pointer}
.fb-later-head[aria-disabled=true]{cursor:default}
.fb-later-head:focus-visible{outline:2px solid var(--ink,#000);outline-offset:2px}
.fb-later-chev{flex:none;width:7px;height:7px;margin:0 5px 0 2px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg)}
.fb-later-head[aria-expanded=true] .fb-later-chev{transform:rotate(45deg);margin:0 4px 3px 2px}
.fb-later-title{flex:none}
.fb-later-count{flex:none;min-width:22px;padding:3px 8px;text-align:center;font-size:12px;line-height:1;color:#fff;background:var(--fb-later-badge)}
:root[data-look="sign"] .fb-later-count{color:#000;background:var(--fb-later)}
.fb-later-hint{flex:1 1 220px;min-width:0;font-size:13px;color:var(--dim,#666);line-height:1.35}
.fb-later-body{margin:10px 0 0}
.fb-later-empty{padding:14px 12px;font-size:13.5px;color:var(--dim,#666)}
/* waiting on you: the outline, the pill, the box on the open card */
.fb-card.fb-waiting{border-left-width:12px}
.fb-card.fb-waiting-question,.fb-card.fb-waiting-done{--edge:var(--fb-wait);outline:2px solid var(--fb-wait);outline-offset:0}
.fb-card.fb-waiting-stopped{--edge:var(--fb-stop);outline:2px solid var(--fb-stop);outline-offset:0}
.fb-wait-pill{display:inline-flex;align-items:center;gap:5px;flex:none;padding:2px 9px 2px 3px;font-size:12px;white-space:nowrap;color:var(--bg,#fff);background:var(--fb-wait)}
:root[data-look="sign"] .fb-wait-pill{color:#000}
.fb-wait-pill b{display:inline-flex;align-items:center;justify-content:center;width:17px;height:17px;background:var(--bg,#fff);color:var(--fb-wait);font-weight:400;font-size:12px}
:root[data-look="sign"] .fb-wait-pill b{background:#000;color:var(--fb-wait)}
.fb-wait-pill.fb-wait-stopped{background:var(--fb-stop)}
.fb-wait-pill.fb-wait-stopped b{color:var(--fb-stop)}
.fb-wait-box{margin:0 0 12px;padding:10px 13px;background:var(--fb-wait-bg);border:1.5px solid var(--fb-wait);color:var(--fb-wait-ink)}
.fb-wait-box.fb-wait-stopped{background:var(--fb-stop-bg);border-color:var(--fb-stop);color:var(--fb-stop-ink)}
.fb-wait-head{font-size:14px}
.fb-wait-text{margin:6px 0;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}
.fb-wait-how{display:block;font-size:13.5px}
/* the open card */
.fb-full{padding:2px 12px 12px}
.fb-body{white-space:pre-wrap;overflow-wrap:break-word;line-height:1.5;background:var(--fb-wash);padding:9px 11px;margin:0}
.fb-ed{color:var(--fb-edit)}
.fb-body.fb-ed{border-left:4px solid var(--fb-edit-rule)}
.fb-editnote{margin:8px 0 0;font-size:13.5px;color:var(--fb-edit)}
.fb-orig{margin-top:4px;font-size:13.5px}
.fb-orig>summary{cursor:pointer}
.fb-orig-text{margin-top:6px;padding:8px 10px;background:var(--fb-surface);border:1px dashed currentColor}
.fb-orig-text .fb-body{background:none;padding:0}
.fb-orig-subject{margin:0 0 8px;overflow-wrap:anywhere}
.fb-claude{margin:8px 0 0;padding:6px 10px;font-size:13.5px;background:var(--fb-wash);overflow-wrap:anywhere;white-space:pre-wrap}
.fb-claude b{font-weight:400;text-decoration:underline dotted}
.fb-notes{margin-top:6px;font-size:13.5px}
.fb-notes>summary{cursor:pointer;color:var(--dim,#666)}
.fb-time{margin:8px 0 0;font-size:13.5px;line-height:1.5}
.fb-time b{font-weight:400;text-decoration:underline dotted}
.fb-meta{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;margin:10px 0 0;font-size:13.5px;color:var(--dim,#666)}
.fb-meta dt{color:var(--ink,#000)}
.fb-meta dd{margin:0;overflow-wrap:anywhere}
.fb-runnow{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:10px 0 0;font-size:13.5px;color:var(--dim,#666)}
.fb-imgs{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.fb-imgs button{display:block;padding:0;border:var(--border,1px solid currentColor);overflow:hidden;background:var(--fb-surface);cursor:zoom-in}
.fb-imgs img{display:block;width:150px;height:100px;object-fit:cover}
.fb-img-miss{display:flex;align-items:center;justify-content:center;width:150px;height:100px;font-size:12px;color:var(--dim,#666);padding:6px;text-align:center}
.fb-full .pastwrap .wrin-form{padding:0 12px 12px;margin-top:10px;display:flex;flex-direction:column;gap:6px}
.fb-full .pastwrap .fb-attach{margin:10px 12px 0}
.fb-full .pastwrap .btngrp{padding:0 12px 12px;display:flex;gap:8px}
.fb-edit[open]>summary{color:var(--fb-edit)}
.fb-edit[open]{border-color:var(--fb-edit-rule)}
.fb-refusal{margin:10px 0 0;font-size:13.5px;color:var(--dim,#666)}
.fb-files{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.fb-files .ghost{gap:7px;max-width:100%;padding:6px 11px;font-size:14px}
.fb-file-kind{flex:none;font-size:11.5px;letter-spacing:.04em;padding:2px 5px;border:1px solid currentColor}
.fb-file-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fb-file-size{flex:none;font-size:12px;color:var(--dim,#666)}
.fb-choices{margin:8px 0}
.fb-choice-q{margin:0 0 10px;padding:8px 11px 10px;border:1.5px solid var(--fb-wait);background:var(--fb-surface);color:var(--ink,#000);min-width:0}
.fb-choice-q legend{padding:0 4px;line-height:1.4}
.fb-choice{display:flex;gap:8px;align-items:flex-start;margin:5px 0;line-height:1.4;cursor:pointer}
.fb-choice input{margin:3px 0 0;flex:none}
.fb-choice b{font-weight:400;text-decoration:underline dotted}
.fb-choice-q textarea{margin-top:6px;min-height:0;font-size:14px}
.fb-choices-acts{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center}
.fb-choices-hint{flex:1 1 220px;font-size:13.5px}
.fb-choices .fb-err{margin:0 0 8px}
.fb-lightbox{position:fixed;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:20px;background:var(--scrim,rgba(0,0,0,.85))}
.fb-lightbox img{max-width:100%;max-height:calc(100% - 60px);object-fit:contain;background:var(--fb-surface)}
/* the bulk sheet: shown while a box is ticked */
.fb-sheet{z-index:20;padding:9px 10px;background:var(--fb-surface);color:var(--ink,#000);border:var(--border,1.5px solid currentColor);visibility:hidden;opacity:0;pointer-events:none}
.fb-board:has(.fb-tick input:checked) .fb-sheet{visibility:visible;opacity:1;pointer-events:auto}
.fb-page .fb-sheet{position:fixed;left:50%;transform:translateX(-50%);width:max-content;max-width:min(96vw,1120px);bottom:12px}
.fb-page .fb-board:has(.fb-tick input:checked){padding-bottom:var(--fb-sheet-h,96px)}
.fb-ov .fb-sheet{position:sticky;bottom:0;margin:12px -4px 0;display:none}
.fb-ov .fb-board:has(.fb-tick input:checked) .fb-sheet{display:block}
.fb-sheet-acts,.fb-sheet-confirm{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap}
.fb-sheet-grp{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.fb-sheet-grp+.fb-sheet-grp{padding-left:12px;border-left:1px solid currentColor}
.fb-picked{white-space:nowrap;min-width:84px}
.fb-sheet .ghost,.fb-sheet .btn{padding:6px 11px;font-size:14px}
.fb-sheet select{width:auto}
.fb-danger{color:var(--fb-stop)!important}
.fb-ui .btn.fb-danger-solid{background:var(--fb-stop);border-color:var(--fb-stop);color:#000!important}
.fb-confirm-text{color:var(--fb-stop)}
@media (max-width:640px){
  .fb-grid{grid-template-columns:1fr;gap:8px}
  .fb-page{padding:14px 16px 110px}
  .fb-more>summary{padding-right:84px;align-items:flex-start}
  .fb-copy-row{height:34px;top:calc((var(--fb-row) - 34px) / 2)}
  /* A phone's LINE 1 is running text in the same order (tesc-crm, the second style review
     2026-10-05: at 390px the subject was cut to ~10 letters): "#id · date " then the subject,
     wrapping word by word, and the status badge right after its last word. Copy stays at the
     top right, outside the <details>, which is why the right padding above is kept. A closed
     card shows the first 90 letters (the open card the whole subject). */
  .fb-top{display:block;line-height:1.4;overflow-wrap:break-word}
  .fb-id,.fb-when,.fb-subject{display:inline}
  .fb-subject{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere}
  .fb-more:not([open]) .fb-subject.has-cut .fb-sj-full{display:none}
  .fb-more:not([open]) .fb-subject.has-cut .fb-sj-cut{display:inline}
  .fb-top .fb-status{margin-left:2px;vertical-align:1px}
  .fb-chev{margin-top:6px}
  .fb-flag-menu{left:10px;right:10px;max-width:none;min-width:0}
  .fb-flag-opt{min-height:42px}
  .fb-page .fb-sheet{left:0;right:0;transform:none;width:auto;max-width:none;border-bottom:0;padding:10px 12px 12px}
  .fb-sheet-grp{flex:1 1 100%}
  .fb-sheet-grp+.fb-sheet-grp{padding-left:0;border-left:0}
  .fb-sheet select{flex:1 1 auto;min-width:0;font-size:16px}
  .fb-sheet .ghost,.fb-sheet .btn,.fb-sheet select{min-height:40px}
  .fb-choice{min-height:40px;align-items:center;margin:2px 0}
  .fb-choice input{margin:0}
  .fb-choice-q textarea{font-size:16px}
  .fb-choices-acts .btn{flex:1 1 100%;min-height:44px}
}
/* Before / After: the What-changed entry's pictures, side by side */
.fb-ba{margin-top:12px;padding:10px 12px 12px;background:var(--fb-surface);border:var(--border-thin,1px solid currentColor)}
.fb-ba-head{display:flex;gap:8px;flex-wrap:wrap;align-items:baseline;font-size:14px}
.fb-pics{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-top:8px}
.fb-pics figure{margin:0;min-width:0}
.fb-pics img{display:block;width:100%;height:auto;max-height:300px;object-fit:contain;border:var(--border-thin,1px solid currentColor)}
.fb-picform{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}
.fb-picbox{position:relative;cursor:pointer}
.fb-picbox input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.fb-picbox:focus-within{outline:2px solid currentColor;outline-offset:2px}
.fb-picbox.has-file{background:var(--selected,rgba(128,128,128,.2))}
.fb-picnote{flex:1 1 100%;margin:0;font-size:13.5px;color:var(--dim,#666)}
.fb-ba-none{margin:10px 0 0;font-size:13.5px;color:var(--dim,#666)}
/* What changed: the pop-up on opening the app, and the /changes view */
dialog.fb-chg{width:min(620px,calc(100vw - 32px));max-height:calc(100dvh - 64px);margin:auto;padding:0;border:var(--border,1.5px solid currentColor);border-radius:var(--r-card,0);
  background:var(--fb-surface);color:var(--ink,#000);overflow:hidden}
dialog.fb-chg[open]{display:flex;flex-direction:column}
.fb-chg-tog{flex:none;display:block;width:100%;text-align:left;font:inherit;font-size:15px;color:inherit;background:none;border:0;border-bottom:var(--border-thin,1px solid currentColor);padding:12px 16px;min-height:44px;cursor:pointer}
.fb-chg-tog:hover{background:var(--selected,rgba(128,128,128,.18))}
.fb-chg-tog:focus-visible{outline:2px solid currentColor;outline-offset:-4px}
.fb-chg-body[hidden]{display:none}
.fb-chg-body{flex:1 1 auto;min-height:0;overflow-y:auto;padding:14px 16px 16px;overscroll-behavior:contain}
.fb-chg-acts{flex:none;display:flex;gap:8px;align-items:center;justify-content:flex-end;padding:12px 16px 14px;border-top:var(--border-thin,1px solid currentColor)}
.fb-chg-acts .btn,.fb-chg-acts .ghost{flex:none;white-space:nowrap}
.fb-chg-again{flex:1 1 auto;min-width:0;margin-right:auto;font-size:13.5px;color:var(--dim,#666)}
.fb-chg-item{padding:0 0 14px;margin:0 0 14px;border-bottom:var(--border-thin,1px solid currentColor)}
.fb-chg-item:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
.fb-chg-h{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:baseline;font-size:18px;line-height:1.3}
.fb-chg-when{font-size:13.5px;color:var(--dim,#666)}
.fb-chg-s{margin:4px 0 0;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.fb-chg-ref{margin:4px 0 0;font-size:13.5px;color:var(--dim,#666)}
.fb-changes .card{padding:14px 16px}
.fb-chg-scroll{overflow-y:auto;max-height:calc(100dvh - 300px);min-height:200px;overscroll-behavior:contain}
.fb-ov .fb-chg-scroll{max-height:none;overflow:visible}
@media (max-width:640px){
  dialog.fb-chg{width:calc(100vw - 16px);max-height:calc(100dvh - 24px)}
  .fb-chg-acts .btn,.fb-chg-acts .ghost{flex:1 1 0;min-height:44px}
  .fb-chg-again{display:none}
  .fb-chg-body{padding:12px 14px 14px}
}
/* Time spent */
.fb-time-ctl{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 12px}
.fb-time-ctl label{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:var(--dim,#666)}
.fb-time-ctl input[type=date],.fb-time-ctl select{width:auto;max-width:200px}
.fb-time-out .card{margin:0 0 12px;overflow-x:auto;padding:0}
.fb-time-out table{width:100%;border-collapse:collapse}
.fb-time-out h3{font-size:16px;margin:0;padding:10px 14px;border-bottom:var(--border-thin,1px solid currentColor)}
.fb-time-out th,.fb-time-out td{text-align:left;padding:8px 14px;font-weight:400;border-bottom:1px solid var(--rule,rgba(128,128,128,.3))}
.fb-time-out td.n,.fb-time-out th.n{text-align:right;font-variant-numeric:tabular-nums}
.fb-time-out tfoot td{border-top:var(--border-thin,1px solid currentColor)}
.fb-time-bad{margin:0 0 10px;font-size:14px;color:var(--fb-wait)}
/* ADD MORE CONTEXT and WHICH CLAUDE RUNS IT */
.fb-ctxlist{margin:10px 0 0}
.fb-ctxhead{margin:0 0 6px;font-size:14px;color:var(--dim,#666)}
.fb-ctxlist ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.fb-ctx-item{background:var(--fb-wash);padding:8px 11px;border-left:4px solid var(--fb-edit-rule)}
.fb-ctx-by{margin:0 0 3px;font-size:13px;color:var(--dim,#666)}
.fb-ctx-text{line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.fb-ctxadd{margin:10px 0 0}
.fb-ctxadd .ghost{padding:6px 12px;font-size:14px}
.fb-runopts{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:10px 0 0;font-size:13.5px;color:var(--dim,#666)}
.fb-runopts select{font-size:14px;padding:6px 9px;width:auto;min-width:0;max-width:100%}
.fb-runopts select.is-set{border-color:var(--fb-edit-rule);color:var(--fb-edit)}
.fb-runopts-msg{flex:1 1 100%;font-size:13px}
.fb-runopts-msg:empty{display:none}
.fb-runopts-msg.is-err{color:var(--fb-err-ink)}
.fb-line .tag.fb-tag-run{color:var(--fb-edit);border-color:var(--fb-edit)}
dialog.fb-ctx{width:min(520px,calc(100vw - 32px));max-height:calc(100dvh - 64px);margin:auto;padding:0;border:var(--border,1.5px solid currentColor);border-radius:var(--r-card,0);
  background:var(--fb-surface);color:var(--ink,#000);overflow:hidden}
dialog.fb-ctx[open]{display:flex;flex-direction:column}
.fb-ctx-form{display:flex;flex-direction:column;min-height:0;flex:1 1 auto;margin:0}
.fb-ctx .modal-head h2{overflow-wrap:anywhere}
.fb-ctx-body{flex:1 1 auto;min-height:0;overflow-y:auto;padding:12px 16px 8px;overscroll-behavior:contain}
.fb-ctx-hint{margin:0 0 10px;font-size:13.5px;color:var(--dim,#666)}
.fb-ctx-body textarea{min-height:140px}
.fb-ctx-count{margin:4px 0 0;text-align:right;font-size:12.5px;color:var(--dim,#666);font-variant-numeric:tabular-nums}
.fb-ctx-count.is-over{color:var(--fb-err-ink)}
.fb-ctx-body .fb-err{margin:10px 0 0}
.fb-ctx-acts{flex:none;display:flex;gap:8px;align-items:center;justify-content:flex-end;padding:12px 16px 14px;border-top:var(--border-thin,1px solid currentColor)}
@media (max-width:640px){
  dialog.fb-ctx{width:calc(100vw - 16px);max-height:calc(100dvh - 24px)}
  .fb-ctx-body textarea{font-size:16px;min-height:120px}
  .fb-ctx-acts .btn,.fb-ctx-acts .ghost{flex:1 1 0;min-height:44px}
  .fb-runopts select{flex:1 1 100%;min-height:44px;font-size:16px}
  .fb-ctxadd .ghost{min-height:44px;width:100%}
}
@media print{
  dialog.fbm,dialog.fb-ov,dialog.fb-chg,dialog.fb-ctx,.fb-bulb,.fb-sheet{display:none!important}
}

/* ---- the "Report #N sent" line (CHK #279, taken 2026-10-27) ----
   An empty role=status region that is always in the page (so it is heard), a
   dark line under the header at the bulb's end while it holds a report. Under
   the toast (99), over the card's layer (60). */
.fb-sentline{position:fixed;top:52px;right:10px;z-index:61;max-width:calc(100vw - 20px);margin:0;font-size:14px;line-height:1.4}
.fb-sentline.is-on{padding:9px 14px;background:var(--bg,#000);color:var(--ink,#fff);border:var(--border,1.5px solid #fff)}
.fb-sentline a{color:inherit}
.fb-sentline a:focus-visible{outline:2px solid currentColor;outline-offset:2px}
@media print{.fb-sentline{display:none!important}}