/* Copied verbatim from Sam Workflow (pd-live origin/main 9073b821) static/fb19/fb-shell.css. Do not edit: override in styles.css. */
/* fb19 shared kit (fb-shell, the owner's feedback decisions of 19.10.2026), linked by base.html on every page after
   components.css, so a page's own sheet can still override it. The prototype's look (SPEC-v2 2.3, 2.4, 3.4, 4.3,
   4.4), drawn with the theme's tokens (light and dark):

   (a) "Sam is working" (decision b): details.agentrun.samw, from templates/fb19/fb-shell-working.html or
       window.SamWorking (fb19/fb-shell.js). The strip, its orb, "Sam", the words of the moment (a shimmer while Sam
       works; none under prefers-reduced-motion) and the step lines (done, cur, todo, wait, bad).
   (b) The pop-up paper: div.wpov#wpOv > div.wpbox > button.wpx + .paper (window.SamPaper, a[data-sam-paper]).
       It shows at once on its backdrop, its paper always opaque, never fading in see-through (item 16). A cited
       source's slide-over (window.SamSource): .srcover.samsrc-over + .srcpanel.samsrc(.ol for an e-mail). The toast
       stands above every panel (item 12).
   (c) Figure cards (.outs > .ocard.ofc(.ocl) > b, .v, .ofig(.two) > .ofl + .ofn, .ofbt > a.dlb) and working-paper
       tiles (.wps > .wpt > .wpi + span > b + small, then a.dlb). A link cannot hold a link, so a tile with its own
       Download is a div.wpt (or li.wpt) whose opening link a.wpo[data-sam-paper] covers the tile; a tile without one
       can be the link itself (a.wpt[data-sam-paper]). A clickable card (.ocl) is opened the same way by a.ostretch.
   (d) The checks bar: .ckbar > button.ckhd (.ckt, .ckc, .cksum, .ckch) + .cklist > .cks (.ckd, .ckn, .ckv, .ckl),
       and its pop-over .ckpop (.ckph, the compare cards of components.css, .cexp, .ckact).
   No inline style anywhere (CSP): scripts place the pop-over through the CSSOM. */

/* ------------------------------------------------------------------ (a) "Sam is working" */
.samw { display: block; }
.samw > summary { list-style: none; }
.samw > summary::-webkit-details-marker { display: none; }
.samw > summary:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; border-radius: 6px; }
.samw .arhead { min-width: 0; }
.samw .arhead b { flex: none; }
.samw .samw-now { min-width: 0; overflow-wrap: anywhere; }
.samw .chev { flex: none; margin-left: auto; }
.samw .chev::after { content: "\25B8"; }
.samw[open] .chev::after { content: "\25BE"; }
.samw .samw-lines:empty { display: none; }
.samw .samw-lines { list-style: none; }
.samw .samw-t { min-width: 0; overflow-wrap: anywhere; }
.samw .stx svg { display: block; margin: 0 auto; }
/* the orb follows Sam's real state: it pings only while Sam works */
.samw:not(.st-working) .arorb::after { display: none; }
.samw.st-done .arorb { color: var(--good); }
.samw.st-waiting .arorb { color: var(--warn); }
.samw.st-stopped .arorb { color: var(--bad); }
.samw.st-idle .arorb, .samw.st-idle .samw-now { color: var(--faint); }
/* the words of the moment, in her shimmer while Sam works (her .arlab-run) */
.samw.st-working .samw-now { background: linear-gradient(90deg, var(--faint), var(--ink) 50%, var(--faint));
  background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: arsheen 1.5s linear infinite; }
.samw.st-waiting .samw-now { color: var(--ink); }
/* step lines: ✓ done (green), the spinner while running, ● waiting for a person, ✕ stopped on a problem, · to do */
.samw .samw-line.done .stx { color: var(--good); }
.samw .samw-line.cur, .samw .samw-line.cur .ic, .samw .samw-line.cur .stx { color: var(--ink); }
.samw .samw-line.cur .stx svg { animation: arspin .9s linear infinite; }
.samw .samw-line.wait, .samw .samw-line.wait .ic { color: var(--ink); }
.samw .samw-line.wait .stx { color: var(--warn); }
.samw .samw-line.todo, .samw .samw-line.todo .ic, .samw .samw-line.todo .stx { color: var(--faint); }
.samw .samw-line.bad, .samw .samw-line.bad .ic, .samw .samw-line.bad .stx { color: var(--bad); }
@media (prefers-reduced-motion: reduce) {
  .samw.st-working .samw-now { animation: none; background: none; color: var(--ink); }
  .samw .samw-line.cur .stx svg, .samw .arorb::after { animation: none; }
}

/* ------------------------------------------------------------------ (b) the pop-up paper (SPEC-v2 2.3) */
/* Its layer (130) sits over the source slide-over (127, 128) and the check pop-over (120), which sit over the
   sidebar's fly-outs (80) and the docked Ask Sam panel (66); the mail drawer (330, 331) and the toast (320) stand
   above them all (test_restore_mail keeps every layer of Sam's under the drawer). */
html.wp-open { overflow: hidden; }
.wpov { position: fixed; inset: 0; z-index: 130; display: flex; align-items: flex-start; justify-content: center;
  padding: 48px 16px; overflow: auto; background: rgba(0, 0, 0, .28); }
.wpbox { position: relative; width: min(760px, 100%); }
.wpbox .paper { margin: 0; max-width: none; background: var(--panel); opacity: 1;
  box-shadow: 0 24px 60px -20px rgba(0, 0, 0, .4); }
/* the paper keeps its page's wrappers (its scoped rules still apply); their page spacing steps aside */
.wpbox .docwrap { padding: 0; }
.wpbox > :not(.wpx) { margin: 0; min-width: 0; }
.wpx { all: unset; box-sizing: border-box; position: absolute; top: -14px; right: -14px; z-index: 2; width: 30px;
  height: 30px; border-radius: 50%; display: grid; place-items: center; cursor: pointer; font-size: 13px;
  color: var(--ink); background: var(--panel);
  box-shadow: 0 0 0 1px var(--border2), 0 6px 14px -6px rgba(0, 0, 0, .3); }
.wpx:hover { background: var(--panel2); }
.wpx:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.wpbox .wp-loading { margin: 0; padding: 28px; text-align: center; color: var(--muted); }
/* the toast over every panel and overlay (components.css gives it 30); an overlay that opens closes it (toast.js) */
.toast { z-index: 320; }
/* a cited source in its slide-over (SamSource): above the docked Ask Sam panel, under the pop-up paper */
.samsrc-over { z-index: 127; }
.srcpanel.samsrc { z-index: 128; display: flex; flex-direction: column; }
.srcpanel.samsrc.ol, .srcpanel.samsrc.samsrc-pdf { width: min(620px, calc(94vw / var(--wf-zoom, 1))); }
.samsrc .srctop b { min-width: 0; overflow-wrap: anywhere; }
.samsrc-body { min-width: 0; flex: 1; display: flex; flex-direction: column; font-size: 13px; line-height: 1.6; }
.samsrc-wait, .samsrc-note { color: var(--muted); margin: 6px 0; }
.samsrc-meta { color: var(--muted); font-size: 12px; margin: 0 0 10px; }
.samsrc-p { margin: 0 0 10px; white-space: pre-wrap; overflow-wrap: anywhere; }
.samsrc-olbar { display: flex; align-items: center; gap: 10px; padding: 8px 12px; margin: 0 0 12px; border-radius: 9px;
  background: var(--panel2); border: 1px solid var(--border); font-size: 12px; color: var(--muted); min-width: 0; }
.samsrc-olbar b { color: var(--ink); flex: none; }
.samsrc-olsub { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.samsrc-atts { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.samsrc-att { all: unset; box-sizing: border-box; display: flex; width: 100%; cursor: pointer; }
.samsrc-att:hover { color: var(--ink); }
.samsrc-att:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.samsrc-table { overflow: auto; border: 1px solid var(--border); border-radius: 9px; }
.samsrc-table table { border-collapse: collapse; width: 100%; font-size: 12px; font-variant-numeric: tabular-nums; }
.samsrc-table th, .samsrc-table td { padding: 5px 8px; border-bottom: 1px solid var(--border); text-align: left;
  white-space: nowrap; }
.samsrc-table th { color: var(--faint); font-weight: 600; background: var(--panel2); }
.samsrc-frame { flex: 1; width: 100%; min-height: calc(70vh / var(--wf-zoom, 1)); border: 1px solid var(--border); border-radius: 9px;
  background: var(--panel); }
@media (max-width: 600px) {
  .wpov { padding: 40px 10px; }
  .wpx { top: -12px; right: -6px; }
}

/* ------------------------------------------------------------------ (c) figure cards (SPEC-v2 2.4, 4.4) */
.outs { grid-template-columns: repeat(auto-fit, minmax(min(100%, 270px), 1fr)); }
.ocard.ofc { display: flex; flex-direction: column; padding: 13px 15px; }   /* her .ocard (13/15) wins over .ofc in the prototype */
.ocard.ofc .v { margin-bottom: 8px; }   /* size-table: the prototype's .ocard .v (8 px) */
.ofig { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 5px 0;
  border-top: 1px solid var(--border); min-width: 0; }
.ocard.ofc .v + .ofig { border-top: 0; }
.ofl { font-size: 12px; color: var(--muted); white-space: nowrap; min-width: 0; overflow: hidden;
  text-overflow: ellipsis; }
.ofn { font-family: var(--mono); font-variant-numeric: tabular-nums; font-size: 18px; font-weight: 600;
  color: var(--ink); letter-spacing: -.15px; line-height: 1.5; white-space: nowrap; }   /* size-table: computed as the prototype's (27 px line at 18 px) */
.ofig.two .ofn { font-size: 14px; font-weight: 500; }
.ofbt { margin-top: auto; padding-top: 10px; display: flex; flex-wrap: wrap; gap: 8px; }
.ocl { position: relative; cursor: pointer; transition: background .15s; }
.ocl:hover { background: var(--panel2); }
.ocl:focus-visible, .ocl:focus-within:has(.ostretch:focus-visible) { outline: 2px solid var(--ink);
  outline-offset: 2px; }
.ocl a.ostretch { color: inherit; text-decoration: none; }
.ocl a.ostretch::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
/* r9: one ring per card or tile, as in the prototype: components.css draws every :focus-visible with !important,
   so the stretched link's own ring (an inner square) is turned off with !important here */
.ocl a.ostretch:focus-visible { outline: none !important; }
.ocl .ofbt, .ocl .dlb { position: relative; z-index: 1; }
/* size-table verify: in the paper pop-up the prototype's .paper h3 (16 px, weight 500, line 1.3) wins over .dochead h3 (23 px) */
.wpbox #paper-page .paper-title { font-size: 16px; line-height: 1.3; }
/* the download button: a real file link (download), her 28 px ring button with the format in small capitals */
.dlb { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; gap: 6px; height: 28px;
  padding: 0 10px; border-radius: 7px; font-size: 12px; color: var(--muted); background: var(--panel);
  box-shadow: 0 0 0 1px var(--border2); cursor: pointer; white-space: nowrap; }
.dlb span { font-size: 10px; letter-spacing: .3px; color: var(--faint); }
.dlb svg { flex: none; }
.dlb:hover { color: var(--ink); box-shadow: 0 0 0 1px var(--faint); }
.dlb:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }

/* working-paper tiles */
.wps { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 270px), 1fr)); gap: 12px;
  margin: 12px 0 0; padding: 0; list-style: none; }
.wpt { all: unset; box-sizing: border-box; position: relative; display: flex; align-items: center; gap: 11px;
  min-width: 0; padding: 12px 14px; border-radius: 11px; background: var(--panel); color: var(--ink);
  box-shadow: 0 0 0 1px var(--border); cursor: pointer; }
.wpt:hover { background: var(--panel2); }
.wpt:focus-visible, .wpt:focus-within:has(.wpo:focus-visible) { outline: 2px solid var(--ink); outline-offset: 2px; }
.wpt .wpi { width: 30px; height: 30px; flex: none; border-radius: 8px; display: grid; place-items: center;
  background: var(--panel2); color: var(--muted); }
.wpt > span:not(.wpi), .wpt > .wpo { min-width: 0; flex: 1; }
/* r9-narrow: a tile's name wraps instead of cutting ("Trial Balance", not "Trial Balan..."), at 1280 px too */
.wpt b { display: block; font-size: 13px; font-weight: 500; white-space: normal; overflow-wrap: anywhere; }
.wpt small { display: block; font-size: 11.5px; color: var(--faint); font-family: var(--mono); overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.wpt a.wpo { display: flex; align-items: center; gap: 11px; color: inherit; text-decoration: none; }
.wpt a.wpo::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.wpt a.wpo:focus-visible { outline: none !important; }
.wpt .wpo > span:not(.wpi) { min-width: 0; flex: 1; }
.wpt .dlb { flex: none; position: relative; z-index: 1; }
[data-theme="dark"] .wpt { box-shadow: 0 0 0 1px var(--border); }

/* the place of a step that runs now (her .oshim: a soft ring and a sweep, 2.6 s) */
.oshim { position: relative; overflow: hidden; animation: oshimring 2.6s ease-in-out infinite; }
.oshim::after { content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: inherit;
  background: linear-gradient(105deg, transparent 30%, color-mix(in srgb, var(--ink) 7%, transparent) 50%,
  transparent 70%); background-size: 300% 100%; animation: oshim 2.6s ease-in-out infinite; }
[data-theme="dark"] .oshim::after { background-image: linear-gradient(105deg, transparent 30%,
  rgba(255, 255, 255, .08) 50%, transparent 70%); }
@keyframes oshim { from { background-position: 130% 0; } to { background-position: -30% 0; } }
@keyframes oshimring {
  0%, 100% { box-shadow: 0 0 0 1px color-mix(in srgb, var(--ink) 18%, transparent),
    0 0 0 4px color-mix(in srgb, var(--ink) 4%, transparent); }
  50% { box-shadow: 0 0 0 1px color-mix(in srgb, var(--ink) 32%, transparent),
    0 0 0 6px color-mix(in srgb, var(--ink) 8%, transparent); }
}
@media (prefers-reduced-motion: reduce) {
  .oshim, .oshim::after { animation: none; }
}

/* ------------------------------------------------------------------ (d) the checks bar (SPEC-v2 3.4, 4.3) */
.ckbar { position: relative; margin: -4px 0 14px; border-radius: 14px; background: var(--panel);
  box-shadow: 0 0 0 1px var(--border); }
.ckbar[hidden] { display: none; }
.ckhd { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 13px 18px; border-radius: 14px; cursor: pointer; list-style: none; }
.ckhd::-webkit-details-marker { display: none; }
.ckhd:hover { background: var(--panel2); }
.ckhd:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.ckt { font-size: 14px; font-weight: 500; color: var(--ink); }
.ckc { font-size: 11px; color: var(--muted); border: 1px solid var(--border2); border-radius: 999px; padding: 1px 8px;
  line-height: 1.5; }
.cksum { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--faint);
  text-align: right; min-width: 0; }
.cksum i { width: 7px; height: 7px; flex: none; border-radius: 50%; background: currentColor; }
.cksum.ok { color: var(--good); font-weight: 500; }
.cksum.bad { color: var(--bad); font-weight: 500; }
.cksum.run { color: var(--muted); background: linear-gradient(100deg, var(--muted) 35%, var(--faint) 50%,
  var(--muted) 65%); background-size: 250% 100%; -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; animation: ftshim 1.2s linear infinite; }
.ckch { display: grid; place-items: center; width: 20px; height: 20px; flex: none; color: var(--muted);
  transition: transform .18s; transform: rotate(-90deg); }
.ckhd:hover .ckch { color: var(--ink); }
.ckbar.open .ckch, .ckbar[open] .ckch { transform: none; }
.cklist { display: flex; flex-direction: column; margin: 0; padding: 2px 8px 8px; list-style: none;
  border-top: 1px solid var(--border); }
.cks { all: unset; box-sizing: border-box; display: grid; grid-template-columns: 10px minmax(0, 1fr) auto 64px;
  align-items: center; gap: 12px; padding: 9px 10px; border-radius: 9px; font-size: 12.5px; color: var(--ink);
  cursor: pointer; }
.cks:hover:not([disabled]) { background: var(--panel2); }
.cks:focus-visible { outline: 2px solid var(--ink); outline-offset: 1px; }
.cks[disabled] { cursor: default; }
.cks .ckd { width: 7px; height: 7px; border-radius: 50%; background: var(--border2); }
.cks .ckn { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cks .ckv { font-family: var(--mono); font-size: 11.5px; color: var(--muted); white-space: nowrap; }
.cks .ckl { text-align: right; font-size: 11.5px; font-weight: 600; }
.cks.q { color: var(--faint); }
.ckbar.idle .cks .ckd { background: transparent; box-shadow: inset 0 0 0 1.5px var(--border2); }
.cks.run { position: relative; overflow: hidden; color: var(--muted); }
.cks.run::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 30%,
  var(--wf-shimmer) 50%, transparent 70%); background-size: 250% 100%; animation: ftshim 1.1s linear infinite; }
.cks.run .ckd { background: var(--muted); }
.cks.run .ckl { color: var(--faint); font-weight: 500; }
.cks.ok .ckd { background: var(--good); }
.cks.ok .ckl { color: var(--good); }
.cks.bad .ckd { background: var(--bad); }
.cks.bad .ckl, .cks.bad .ckv { color: var(--bad); }
.ckbar.ckdis { opacity: .5; }
.ckbar.ckdis .ckhd { pointer-events: none; }
/* the pop-over of one check: fixed, under its row (or above it near the bottom of the window), at most 460 px */
.ckpop { position: fixed; z-index: 120; box-sizing: border-box; width: min(460px, calc(calc(100vw / var(--wf-zoom, 1)) - 24px)); padding: 12px;
  border-radius: 12px; background: var(--panel); color: var(--ink); font-size: 12.5px;
  box-shadow: 0 0 0 1px var(--border2), 0 18px 44px -12px rgba(0, 0, 0, .28); animation: cpin .12s ease; }
[data-theme="dark"] .ckpop { box-shadow: 0 0 0 1px var(--border2), 0 18px 44px -12px rgba(0, 0, 0, .6); }
/* r6: a pop-over is never taller than the window less 16 px a side, and scrolls inside itself past that */
.ckpop { max-height: calc(100vh / var(--wf-zoom, 1) - 32px); max-height: calc(100dvh / var(--wf-zoom, 1) - 32px); overflow: auto;
  overscroll-behavior: contain; }
/* r6: inside it a long line of "How Sam got this" (a formula) wraps between words at the pop-over's edge instead of
   running past it; a figure is one word and stays on one line */
.ckpop .ckmath .cmr b { min-width: 0; white-space: normal; overflow-wrap: break-word; text-align: right; }
/* r6: a pop-over of the window (on the body; the script places it under its row) that would run past the window's
   foot rises until its foot is 16 px above the window's edge, so all of it stays on the screen */
body > .ckpop { position-try-fallbacks: --ckpop-in; }
@position-try --ckpop-in { top: auto; bottom: 16px; }
.ckph { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin: 0 0 10px; }
.ckph b { font-size: 13px; }
.ckph .ckv { font-family: var(--mono); font-size: 12px; color: var(--muted); }
.ckact { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.ckact:empty { display: none; }
/* ftshim, cpin, arsheen and arspin are components.css's keyframes */
@media (prefers-reduced-motion: reduce) {
  .cksum.run { animation: none; background: none; -webkit-text-fill-color: currentColor; }
  .cks.run::after, .ckpop, .wpov, .srcpanel.samsrc { animation: none; }
}
@media (max-width: 600px) {
  .ckhd { padding: 12px 14px; gap: 8px; flex-wrap: wrap; }
  .cks { grid-template-columns: 10px minmax(0, 1fr) auto; }
  .cks .ckl { display: none; }
}

/* ---------------------------------------------------------------- the page header's client and period menus */
/* r9 (her prototype v2, .cpsearch and .perbox): the client menu's search field has no ring of its own in hers; the
   menu focuses it as it opens, so the shared keyboard ring (components.css :focus-visible) drew a thick black frame on
   every open. Here it keeps one quiet line inside the field instead. Her period box is outlined with --border2; the
   monthly page's sheet drew it with the lighter --wf-border. The html prefix outranks that page's own rule. */
.cpmenu .cpsearch:focus-visible { outline: none !important; box-shadow: inset 0 0 0 1px var(--border2); }
html #wf-frame[data-workflow] .wshead button.perbox { box-shadow: inset 0 0 0 1px var(--border2); }
