/* WCB review app: a native-feeling Mac window, after Mail, Notes, Reminders and System Settings.
   Every color, size, radius and duration comes from tokens.css (Apple HIG semantics, Adivo Blue
   as the single tint). No raw colors, gradients or one-off radii here; a test enforces it. */

*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{height:100%}
body{margin:0;font-family:var(--font-sans);font-size:var(--t-body);line-height:var(--t-body-lh);color:var(--label);
  background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
h1,h2,h3,p{margin:0}
a{color:var(--tint-text);text-decoration:none}
a:hover{text-decoration:underline}
::selection{background:var(--tint-soft)}
:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}
svg.icon{flex:none;display:block}
button svg,.btn svg,.icon-btn svg{pointer-events:none}   /* clicks land on the control itself */
.muted{color:var(--label-2)}
.small{font-size:var(--t-callout);line-height:var(--t-callout-lh)}
.num{text-align:right;font-variant-numeric:tabular-nums}
.strong{font-weight:var(--w-semibold)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- window: sidebar + content ---------- */
.window{display:grid;grid-template-columns:var(--sidebar-w) minmax(0,1fr);min-height:100vh}
/* Collapsed: the track goes to zero and the sidebar leaves the tab order.
   # DECISION: no transition here. Animating grid-template-columns is unreliable
   across engines and a dropped declaration takes the whole layout with it. */
html.sb-collapsed .window{grid-template-columns:0 minmax(0,1fr)}
html.sb-collapsed .sidebar{padding-left:0;padding-right:0;overflow:hidden;visibility:hidden;border-right-color:transparent}
.foot-row{display:flex;align-items:center;justify-content:space-between;gap:var(--s2)}
.sidebar-toggle{flex:none}
/* The same control in the same corner when the sidebar is away.
   # DECISION: these carry .icon-btn in the selector on purpose. .icon-btn is defined
   further down the file and sets position and display; an equal-specificity rule here
   loses to it, which once put this button in the grid and pushed the page off screen. */
.icon-btn.sidebar-show{position:fixed;left:var(--s3);bottom:var(--s3);z-index:30;display:none;
  background:var(--material-solid);border:1px solid var(--separator)}
html.sb-collapsed .icon-btn.sidebar-show{display:inline-flex}
.sidebar{position:sticky;top:0;height:100vh;overflow-y:auto;display:flex;flex-direction:column;gap:var(--s5);
  padding:var(--s4);background:var(--material);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);
  border-right:1px solid var(--separator)}
/* Sidebar header card: built to the "Sidebar Header" design (Claude Design, 280px sidebar). */
.brand{display:flex;flex-direction:column;gap:var(--s3);padding:var(--s3);background:var(--brand-card);color:var(--brand-ink);
  border:1px solid var(--brand-card-edge);border-radius:var(--r-md);box-shadow:var(--brand-card-shadow);text-align:left;
  transition:background-color 160ms var(--ease),border-color 160ms var(--ease),box-shadow 160ms var(--ease)}
.brand:hover{background:var(--brand-card-hover);border-color:var(--brand-card-edge-hover);box-shadow:var(--brand-card-shadow-hover);text-decoration:none}
.brand:active{background:var(--brand-card-press)}
.brand:focus-visible{outline:2px solid var(--brand-blue-v3);outline-offset:2px}
.brand-logos{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);height:48px}
.brand-adivo{display:block;flex:none;height:48px;width:auto}
.brand-rule{flex:none;align-self:stretch;width:1px;background:var(--brand-rule)}
.brand-wcb{display:block;flex:1 1 0;min-width:0;width:100%;max-height:48px;object-fit:contain;object-position:right center}
.brand b{font-family:var(--font-brand);font-size:16px;line-height:1.25;font-weight:var(--w-bold);letter-spacing:-0.01em;text-align:center}
.nav{display:flex;flex-direction:column;gap:var(--s1)}
.nav a{position:relative;display:flex;align-items:center;gap:10px;height:40px;padding:0 var(--s3);border-radius:var(--r-sm);
  color:var(--label);font-weight:var(--w-medium);transition:background-color var(--dur) var(--ease)}
.nav a::after{content:"";position:absolute;inset:-2px 0}
.nav a .icon{color:var(--tint-text)}
.nav a:hover{background:var(--fill);text-decoration:none}
.nav a:active{background:var(--fill-pressed)}
.nav a.active{background:var(--tint-soft);font-weight:var(--w-semibold)}
.sidebar-foot{margin-top:auto;display:flex;flex-direction:column;gap:var(--s2);padding:0 var(--s1)}
.rep{display:flex;flex-direction:column;gap:6px}
.rep label{display:flex;align-items:center;gap:6px;font-size:var(--t-caption);line-height:var(--t-caption-lh);color:var(--label-2)}
.rep select{width:100%}
.add-reps{font-size:var(--t-callout);display:inline-flex;align-items:center;min-height:28px}
.made{font-size:var(--t-caption);line-height:var(--t-caption-lh);color:var(--label-2)}

.content{--content-bg:var(--bg);display:flex;flex-direction:column;min-width:0;background:var(--content-bg)}
.grouped-page .content{--content-bg:var(--bg-grouped)}
main{flex:1;padding:var(--s6) var(--s7) var(--s9);min-width:0}

/* ---------- unified toolbar ---------- */
.toolbar{position:sticky;top:0;z-index:20;padding:var(--s4) var(--s7) var(--s3);
  background:color-mix(in srgb,var(--content-bg) 80%,transparent);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);
  border-bottom:1px solid var(--separator)}
.tb-row{display:flex;align-items:center;gap:var(--s3);min-height:var(--target)}
.tb-title{flex:1;min-width:0}
.tb-title h1{font-size:var(--t-large);line-height:var(--t-large-lh);font-weight:var(--w-bold);letter-spacing:var(--t-large-track);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb-sub{margin-top:2px;font-size:var(--t-callout);line-height:var(--t-callout-lh);color:var(--label-2);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb-actions{display:flex;align-items:center;gap:var(--s2);flex:none}
.tb-actions:empty{display:none}
.tb-search{display:flex;align-items:center;gap:var(--s2)}
.tb-search input[type=search]{width:240px}
.toolbar .tabs{margin-top:var(--s3)}

/* ---------- buttons: capsules; icon buttons: circles ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:6px;height:var(--control-h);padding:0 var(--s4);
  border:0;border-radius:var(--r-capsule);font:inherit;font-weight:var(--w-medium);line-height:1;white-space:nowrap;cursor:pointer;
  background:var(--fill);color:var(--label);text-decoration:none;
  transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease),transform var(--dur) var(--ease),opacity var(--dur) var(--ease)}
.btn::after{content:"";position:absolute;inset:calc((var(--control-h) - var(--target)) / 2) 0}   /* 44px click target */
.btn:hover{background:var(--fill-hover);text-decoration:none}
.btn:active{background:var(--fill-pressed);transform:scale(.97)}
.btn.primary{background:var(--tint);color:var(--on-tint)}
.btn.primary:hover{background:var(--tint-hover)}
.btn.primary:active{background:var(--tint-pressed)}
.btn.plain,.btn.quiet{background:transparent;color:var(--tint-text);padding:0 var(--s3)}
.btn.plain:hover,.btn.quiet:hover{background:var(--fill)}
.btn.destructive{background:transparent;color:var(--red)}
.btn.destructive:hover{background:var(--red-soft)}
.btn.small{height:28px;padding:0 var(--s3)}
.btn.small::after{inset:-8px 0}
.btn[disabled],.btn.disabled{background:var(--fill);color:var(--label-3);cursor:not-allowed;transform:none}
.btn.plain[disabled],.btn.destructive[disabled]{background:transparent}
.btn.loading{pointer-events:none;opacity:.7}
.btn.loading::before{content:"";width:12px;height:12px;border-radius:var(--r-round);border:2px solid currentColor;border-right-color:transparent;
  animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.icon-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;width:36px;height:36px;padding:0;
  border:0;border-radius:var(--r-round);background:transparent;color:var(--label-2);cursor:pointer;
  transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease),transform var(--dur) var(--ease)}
.icon-btn::after{content:"";position:absolute;inset:-4px}
.icon-btn:hover{background:var(--fill);color:var(--label);text-decoration:none}
.icon-btn:active{background:var(--fill-pressed);transform:scale(.94)}
.icon-btn.prominent{background:var(--tint);color:var(--on-tint)}
.icon-btn.prominent:hover{background:var(--tint-hover);color:var(--on-tint)}
.icon-btn.prominent:active{background:var(--tint-pressed)}
.icon-btn.small{width:28px;height:28px}
.icon-btn.small::after{inset:-8px}
.icon-btn[aria-disabled=true]{color:var(--label-3);opacity:.5;cursor:default}
.icon-btn[aria-disabled=true]:hover{background:transparent}
.link{background:none;border:0;padding:0;font:inherit;color:var(--tint-text);cursor:pointer}
.link:hover{text-decoration:underline}
.actions{display:flex;gap:var(--s2);align-items:center;flex-wrap:wrap}
.actions.trailing{flex-direction:row-reverse;justify-content:flex-end}   /* primary last in the row; DOM order unchanged */
.actions > select{width:auto}
.actions > input[type=text]{width:auto;flex:1}

/* ---------- segmented control ---------- */
.segmented{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:var(--r-capsule);background:var(--fill);max-width:100%}
.segmented a{position:relative;display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 var(--s4);border-radius:var(--r-capsule);
  color:var(--label);font-weight:var(--w-medium);white-space:nowrap;transition:background-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.segmented a::after{content:"";position:absolute;inset:-7px 0}
.segmented a:hover{background:var(--fill);text-decoration:none}
.segmented a.active{background:var(--seg-selected);box-shadow:var(--shadow-control);font-weight:var(--w-semibold)}
.segmented .count{color:var(--label-2);font-weight:var(--w-regular);font-variant-numeric:tabular-nums}

/* ---------- fields ---------- */
input[type=text],input[type=password],input[type=url],input[type=date],input[type=number],textarea{width:100%;height:var(--control-h);padding:0 10px;font:inherit;color:var(--label);
  background:var(--bg-input);border:1px solid var(--separator-strong);border-radius:var(--r-sm);
  transition:border-color var(--dur) var(--ease),outline-color var(--dur) var(--ease)}
textarea{height:auto;min-height:88px;padding:var(--s2) 10px;line-height:1.45;resize:vertical}
input:hover,textarea:hover{border-color:var(--label-3)}
input:focus,textarea:focus{outline:3px solid var(--focus-ring);outline-offset:0;border-color:var(--tint)}
::placeholder{color:var(--label-3);opacity:1}
input[aria-invalid=true],select[aria-invalid=true]{border-color:var(--red)}
select{appearance:none;-webkit-appearance:none;width:100%;height:var(--control-h);padding:0 30px 0 var(--s3);font:inherit;color:var(--label);
  background:var(--fill) var(--icon-popup) no-repeat right 10px center/14px 14px;border:0;border-radius:var(--r-sm);cursor:pointer;
  transition:background-color var(--dur) var(--ease)}
select:hover{background-color:var(--fill-hover)}
select:focus{outline:none}
select:focus-visible{outline:3px solid var(--focus-ring);outline-offset:0}
input[type=search]{appearance:none;-webkit-appearance:none;width:100%;height:var(--control-h);padding:0 var(--s4) 0 34px;font:inherit;color:var(--label);
  background:var(--fill) var(--icon-search) no-repeat 12px center/15px 15px;border:1px solid transparent;border-radius:var(--r-capsule);
  transition:background-color var(--dur) var(--ease),border-color var(--dur) var(--ease)}
input[type=search]::placeholder{color:var(--label-2)}
input[type=search]:hover{background-color:var(--fill-hover);border-color:transparent}
input[type=search]:focus{background-color:var(--bg-input);border-color:var(--tint)}
.field-error{color:var(--red);font-size:var(--t-callout);line-height:var(--t-callout-lh);margin-top:6px}
.hint{font-size:var(--t-callout);line-height:var(--t-callout-lh);color:var(--label-2)}

/* iOS-style switch */
input.switch{appearance:none;-webkit-appearance:none;position:relative;flex:none;width:40px;height:24px;margin:0;border-radius:var(--r-capsule);
  background:var(--switch-off);box-shadow:inset 0 0 0 1px var(--switch-edge);cursor:pointer;
  transition:background-color var(--dur-slow) var(--ease),box-shadow var(--dur-slow) var(--ease)}
input.switch::before{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:var(--r-capsule);background:var(--knob);
  box-shadow:var(--shadow-knob);transition:transform var(--dur-slow) var(--spring),width var(--dur) var(--ease)}
input.switch:checked{background:var(--tint);box-shadow:inset 0 0 0 1px var(--tint-edge)}
input.switch:checked::before{transform:translateX(16px)}
input.switch:active::before{width:24px}
input.switch:checked:active::before{transform:translateX(12px)}
input.switch:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}

/* ---------- inset grouped lists (System Settings) ---------- */
main.grouped{background:var(--bg-grouped)}
.page{max-width:var(--page-w);margin:0 auto}
.group-header{font-size:var(--t-callout);line-height:var(--t-callout-lh);font-weight:var(--w-semibold);color:var(--label-2);margin:var(--s7) var(--s4) 6px}
.page > .group-header:first-child,form > .group-header:first-child,.notice + form > .group-header:first-child{margin-top:var(--s1)}
.group-footer{font-size:var(--t-callout);line-height:var(--t-callout-lh);color:var(--label-2);margin:var(--s2) var(--s4) 0;max-width:72ch}
.group{background:var(--bg-cell);border-radius:var(--r-md);overflow:hidden}
main:not(.grouped) .group{background:var(--bg-grouped)}
.group .row{position:relative;display:flex;align-items:center;gap:var(--s4);min-height:var(--row-h);padding:var(--s2) var(--s4);margin:0}
.group .row + .row::before{content:"";position:absolute;top:0;left:var(--s4);right:var(--s4);height:1px;background:var(--separator)}
.group .row > label:first-child,.group .row > dt{flex:0 0 200px;font-weight:var(--w-regular);color:var(--label)}
.group .row .value,.group .row > dd{flex:1;min-width:0;margin:0}
.group .row.stacked{flex-direction:column;align-items:stretch;gap:6px;padding-top:var(--s3);padding-bottom:var(--s3)}
.group .row.stacked > label{flex:none}
.req{display:block;font-size:var(--t-caption);line-height:var(--t-caption-lh);color:var(--label-2)}
.switch-row{justify-content:space-between;cursor:pointer}
.group-tools{display:flex;justify-content:flex-start;margin:var(--s2) 0 var(--s3)}
.group-error{margin-left:var(--s4)}
.form-actions{display:flex;flex-direction:row-reverse;justify-content:flex-start;align-items:center;gap:var(--s2);margin-top:var(--s6)}
.form-actions .hint,.form-actions > span{margin-right:auto}
.danger-zone{margin-top:var(--s8);padding-top:var(--s4);border-top:1px solid var(--separator)}
.props .path{word-break:break-all;color:var(--label-2)}
.group .row > .row-label{flex:0 0 200px}
.group .row .value > .hint{margin:var(--s1) 0 0}
.status-on{font-weight:var(--w-semibold)}
.danger-row{display:flex;justify-content:flex-end;margin-top:var(--s2)}

/* ---------- tables (Finder and Mail lists) ---------- */
table.list{width:calc(100% + 2 * var(--s3));margin:0 calc(-1 * var(--s3));border-collapse:separate;border-spacing:0}
table.list th{font-size:var(--t-callout);line-height:var(--t-callout-lh);font-weight:var(--w-medium);color:var(--label-2);text-align:left;
  padding:var(--s2) var(--s4) var(--s2) 0;border-bottom:1px solid var(--separator);white-space:nowrap}
table.list td{padding:var(--s3) var(--s4) var(--s3) 0;border-bottom:1px solid var(--separator);vertical-align:top}
table.list th:first-child,table.list td:first-child{padding-left:var(--s3)}
table.list th:last-child,table.list td:last-child{padding-right:var(--s3)}
table.list td.num,table.list th.num{text-align:right}
table.list td.num,table.list td.nw{white-space:nowrap}
table.list tr.rowlink{cursor:pointer}
table.list tr.rowlink td{vertical-align:middle;transition:background-color var(--dur) var(--ease)}
table.list tr.rowlink:hover td{background:var(--fill)}
table.list tr.rowlink:active td{background:var(--fill-pressed)}
table.list tr.rowlink td:first-child{border-radius:var(--r-sm) 0 0 var(--r-sm)}
table.list tr.rowlink td:last-child{border-radius:0 var(--r-sm) var(--r-sm) 0}
table.list td.client{width:1%;white-space:nowrap;vertical-align:middle}
.client-logo{display:block;height:24px;width:auto}
table.list .chev{width:28px;color:var(--label-3);vertical-align:middle}
table.list .act{width:1%;white-space:nowrap;text-align:right;vertical-align:middle}
table.compact td{padding-top:var(--s2);padding-bottom:var(--s2)}
table.list input,table.list select{min-width:0}
.group table.list{width:calc(100% - 2 * var(--s4));margin:0 var(--s4)}
.group table.list th:first-child,.group table.list td:first-child{padding-left:0}
.group table.list th:last-child,.group table.list td:last-child{padding-right:0}
.group table.list tbody tr:last-child td{border-bottom:0}
.group table.list th{padding-top:var(--s3)}
.group table.list td{vertical-align:middle}
.switch-cell{display:inline-flex;align-items:center;min-height:var(--target);cursor:pointer}
ul.notes,ul.files{margin:0;padding:0;list-style:none}
ul.notes li + li,ul.files li + li{margin-top:2px}
.reuse{display:flex;align-items:flex-start;gap:var(--s1);margin-top:2px}
.reuse > .icon{flex:none;margin-top:2px}
.after-table{margin-top:var(--s3)}

/* ---------- banners and empty states ---------- */
.flash,.notice{display:flex;align-items:flex-start;gap:var(--s3);padding:var(--s3) var(--s4);margin-bottom:var(--s5);
  border-radius:var(--r-md);background:var(--fill);color:var(--label)}
.flash{margin-bottom:var(--s2)}
.flash + :not(.flash){margin-top:var(--s5)}
main.grouped > .flash{max-width:var(--page-w);margin-left:auto;margin-right:auto}
.flash > .icon,.notice > .icon{margin-top:-1px;color:var(--label-2)}
.flash.ok > .icon{color:var(--tint-text)}
.flash.error > .icon{color:var(--red)}
.flash ul,.notice ul{margin:var(--s1) 0 0;padding-left:18px}
.notice b{font-weight:var(--w-semibold)}
.notice.log{max-width:560px;margin:var(--s6) auto 0}
.empty{display:flex;flex-direction:column;align-items:center;gap:6px;max-width:420px;margin:12vh auto 0;padding:0 var(--s4);text-align:center}
.empty > .icon{color:var(--label-3);margin-bottom:var(--s2)}
.empty h2{font-size:var(--t-headline);line-height:var(--t-headline-lh);font-weight:var(--w-semibold)}
.empty p{color:var(--label-2)}
.empty .btn{margin-top:var(--s4)}

/* ---------- status words (always words, never color alone) ---------- */
.st-approved{font-weight:var(--w-semibold);color:var(--label)}
.st-pending,.st-rejected{color:var(--label-2)}
.pr-critical{font-weight:var(--w-semibold);color:var(--label)}
.pr-major{color:var(--label-2)}
.pr-minor{color:var(--label-2)}
.flag-word{color:var(--tint-text);font-weight:var(--w-semibold)}

/* ---------- drop zone ---------- */
.dropzone{display:flex;flex-direction:column;align-items:center;gap:6px;padding:var(--s7) var(--s6);text-align:center;cursor:pointer;
  border:1.5px dashed var(--separator-strong);border-radius:var(--r-md);background:var(--bg-cell);
  transition:background-color var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.dropzone > .icon{color:var(--tint-text);margin-bottom:var(--s1)}
.dropzone b{font-weight:var(--w-semibold)}
.dropzone .muted{font-size:var(--t-callout);line-height:var(--t-callout-lh)}
.dropzone:hover,.dropzone.over{border-color:var(--tint);background:var(--tint-soft)}
.dropzone input{display:none}
/* One drop area per document type, two across. */
.drop-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3);align-items:start}
.drop-cell{display:flex;flex-direction:column;min-width:0}
.drop-cell .dropzone{flex:1;justify-content:center;gap:var(--s1);padding:var(--s5) var(--s4);min-height:148px}
.drop-cell .dropzone b{margin-top:var(--s1)}
.drop-cell .file-list{margin-top:var(--s2)}
.file-list{list-style:none;margin:var(--s3) 0 0;padding:0;background:var(--bg-cell);border-radius:var(--r-md);overflow:hidden}
.file-list:empty{display:none}
.file-list li{position:relative;display:flex;justify-content:space-between;align-items:center;gap:var(--s3);min-height:var(--target);padding:0 var(--s4)}
.file-list li + li::before{content:"";position:absolute;top:0;left:var(--s4);right:var(--s4);height:1px;background:var(--separator)}
.file-list .link{min-height:var(--target)}

/* ---------- processing ---------- */
.processing{max-width:480px;margin:12vh auto 0;text-align:center}
.processing h2{font-size:var(--t-headline);line-height:var(--t-headline-lh);font-weight:var(--w-semibold);margin-bottom:6px}
.progress{height:6px;border-radius:var(--r-capsule);background:var(--fill);overflow:hidden;margin:var(--s6) 0 var(--s3)}
.progress div{height:100%;border-radius:var(--r-capsule);background:var(--tint);width:0;transition:width var(--dur-slow) var(--ease)}

/* ---------- comments: Mail list + reading pane ---------- */
.pane-page .window{height:100vh}
.pane-page .content{height:100vh;overflow:hidden}
main.pane{display:flex;flex-direction:column;padding:0;min-height:0}
main.pane > .flash{margin:var(--s4) var(--s7) 0}
.filterbar{display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap;padding:var(--s3) var(--s7);border-bottom:1px solid var(--separator)}
.filterbar select{width:auto;min-width:180px}
.filterbar input[type=search]{width:240px;margin-left:auto}
.kbd{font-size:var(--t-caption);line-height:var(--t-caption-lh);color:var(--label-2)}
.split{flex:1;min-height:0;display:grid;grid-template-columns:var(--list-w) minmax(0,1fr)}
.clist{overflow-y:auto;padding:6px var(--s2);border-right:1px solid var(--separator)}
.clist a{position:relative;display:block;padding:10px var(--s3);border-radius:var(--r-md);color:var(--label);
  transition:background-color var(--dur) var(--ease)}
.clist a + a::before{content:"";position:absolute;top:0;left:var(--s3);right:var(--s3);height:1px;background:var(--separator);
  transition:opacity var(--dur) var(--ease)}
.clist a:hover{background:var(--fill);text-decoration:none}
.clist a:hover::before,.clist a:hover + a::before,.clist a.active::before,.clist a.active + a::before{opacity:0}
.clist a.active{background:var(--tint);color:var(--on-tint)}
.clist a.active .meta,.clist a.active .meta b,.clist a.active .meta span,.clist a.active .where{color:var(--on-tint)}
.clist a:focus-visible{outline-offset:-3px}
.clist .meta{display:flex;align-items:baseline;gap:6px;font-size:var(--t-callout);line-height:var(--t-callout-lh);color:var(--label-2)}
.clist .meta b{font-size:var(--t-body);font-weight:var(--w-semibold);color:var(--label)}
.clist .text{margin-top:3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.clist .where{margin-top:3px;font-size:var(--t-callout);line-height:var(--t-callout-lh);color:var(--label-2);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.list-empty{display:flex;flex-direction:column;align-items:center;gap:var(--s2);padding:var(--s8) var(--s4);color:var(--label-2);text-align:center}
.list-empty .icon{color:var(--label-3)}
.detail{overflow-y:auto;padding:var(--s6) var(--s7) var(--s8);min-width:0}
.detail > *{max-width:760px}
.detail-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s3);color:var(--label-2)}
.detail-empty .icon{color:var(--label-3)}
.detail-head{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--s4)}
.detail-head h2{font-size:var(--t-title);line-height:var(--t-title-lh);font-weight:var(--w-bold);letter-spacing:-0.01em}
.detail-head .meta{color:var(--label-2);margin-top:2px}
.nav-btns{display:flex;gap:var(--s1)}
.status-line{margin-top:var(--s3);font-size:var(--t-callout);line-height:var(--t-callout-lh);color:var(--label-2)}
.status-line.final{color:var(--label);font-weight:var(--w-semibold)}
.detail section{margin-top:var(--s6)}
.detail h3{font-size:var(--t-callout);line-height:var(--t-callout-lh);font-weight:var(--w-semibold);color:var(--label-2);margin-bottom:6px}
.detail .issue{font-size:var(--t-reading);line-height:var(--t-reading-lh);max-width:72ch}
.rows .loc + .loc,.rows .topic + .topic{border-top:1px solid var(--separator)}
.loc{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s4);padding:10px 0}
.loc > a{flex:none}
.loc .quote{color:var(--label-2);font-size:var(--t-callout);line-height:var(--t-callout-lh);margin-top:2px}
.conf{display:flex;align-items:baseline;gap:var(--s2);flex-wrap:wrap}
.conf b{font-size:28px;line-height:34px;font-weight:var(--w-bold);letter-spacing:-0.01em;font-variant-numeric:tabular-nums}
table.evidence{margin-top:var(--s2);width:calc(100% + 2 * var(--s3));max-width:calc(620px + 2 * var(--s3))}
.decide{display:flex;flex-direction:row-reverse;justify-content:flex-start;align-items:center;gap:var(--s2);flex-wrap:wrap;
  margin-top:var(--s7);padding-top:var(--s4);border-top:1px solid var(--separator)}
.decide > span{margin-right:auto}
.decide input[type=text]{width:260px}
details.more{margin-top:var(--s5);border-top:1px solid var(--separator)}
details.more summary{display:flex;align-items:center;gap:var(--s2);min-height:var(--target);cursor:pointer;list-style:none;
  font-weight:var(--w-semibold);color:var(--label);border-radius:var(--r-sm)}
details.more summary::-webkit-details-marker{display:none}
details.more summary::before{content:"";width:7px;height:7px;margin:0 3px 0 2px;border-right:1.5px solid var(--label-2);border-bottom:1.5px solid var(--label-2);
  transform:rotate(-45deg);transition:transform var(--dur-slow) var(--ease)}
details.more[open] summary::before{transform:rotate(45deg) translate(-2px,-2px)}
details.more summary:hover{color:var(--tint-text)}
.edit-form{margin:var(--s1) 0 var(--s4)}
.edit-form .form-actions{margin-top:var(--s4)}
.history{list-style:none;padding:0;margin:0 0 var(--s4);font-size:var(--t-callout);line-height:var(--t-callout-lh);color:var(--label-2)}
.history li{padding:6px 0}
.history li + li{border-top:1px solid var(--separator)}

/* ---------- exports ---------- */
.stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s4);margin-bottom:var(--s7)}
.stats b{display:block;font-size:28px;line-height:34px;font-weight:var(--w-bold);letter-spacing:-0.01em;font-variant-numeric:tabular-nums}
.stats span{font-size:var(--t-callout);line-height:var(--t-callout-lh);color:var(--label-2)}
.section-title{font-size:var(--t-headline);line-height:var(--t-headline-lh);font-weight:var(--w-semibold);margin:var(--s7) 0 6px}
main > .section-title:first-child,.entry-body > .section-title:first-child{margin-top:0}
.lede{color:var(--label-2);max-width:72ch;margin-bottom:var(--s4)}
.notice + .actions,.lede + .actions{margin-bottom:var(--s2)}

/* ---------- library ---------- */
.cite-form{max-width:860px}
.cite-form input[type=text]{min-width:240px}
.verdict{display:flex;gap:var(--s3);align-items:flex-start;max-width:860px;margin-top:var(--s5);padding:var(--s4);border-radius:var(--r-md);background:var(--bg-grouped)}
.verdict > .icon{color:var(--tint-text);margin-top:1px}
.verdict .muted{margin-top:var(--s1)}
.verdict table.list{margin-top:var(--s3)}
.list-header{font-size:var(--t-callout);line-height:var(--t-callout-lh);font-weight:var(--w-semibold);color:var(--label-2);margin:var(--s6) 0 var(--s1)}
.entry-body{max-width:760px}
.entry-body .reading{font-size:var(--t-reading);line-height:var(--t-reading-lh)}
.entry-body ul{padding-left:var(--s5);margin:0}
.entry-body li + li{margin-top:var(--s1)}
.entry-body .topic{padding:var(--s3) 0}
.entry-body .topic .note{margin-top:var(--s1)}
.entry-body .topic ul{margin-top:var(--s1)}
dl.props{margin:0 0 var(--s7)}
dl.props > div{display:flex;gap:var(--s4);padding:10px 0}
dl.props > div + div{border-top:1px solid var(--separator)}
dl.props dt{flex:0 0 180px;color:var(--label-2)}
dl.props dd{flex:1;min-width:0;margin:0}
dl.group.props{margin:0}
dl.group.props > div{padding:var(--s2) var(--s4)}
dl.group.props > div + div{border-top:0}
dl.group.props dt{color:var(--label)}
dl.group.props dd{color:var(--label-2)}

/* ---------- smaller windows ---------- */
@media (max-width:1100px){
  .pane-page .window,.pane-page .content{height:auto;overflow:visible}
  .split{grid-template-columns:1fr}
  .clist{border-right:0;border-bottom:1px solid var(--separator);max-height:50vh}
  .kbd{display:none}
  .stats{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:820px){
  .window{grid-template-columns:1fr}
  .sidebar{position:static;height:auto;flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--s2);border-right:0;border-bottom:1px solid var(--separator)}
  .nav{flex-direction:row;flex-wrap:wrap}
  .nav a span{display:none}
  .nav a{width:var(--target);justify-content:center;padding:0}
  .sidebar-foot{margin-top:0;margin-left:auto;flex-direction:row;align-items:center}
  .rep label,.made,.add-reps{display:none}
  .brand{flex:1 1 100%}
  .toolbar{position:static;padding:var(--s3) var(--s4)}
  .tb-title h1{white-space:normal}
  main{padding:var(--s5) var(--s4) var(--s8)}
  .filterbar{padding:var(--s3) var(--s4)}
  .filterbar input[type=search]{width:100%;margin-left:0}
  .segmented{overflow-x:auto;scrollbar-width:none}
  .segmented::-webkit-scrollbar{display:none}
  .segmented a{height:40px}
  .segmented a::after{inset:0}
  .detail{padding:var(--s5) var(--s4) var(--s8)}
  .group .row{flex-direction:column;align-items:stretch;gap:6px}
  .group .row.switch-row{flex-direction:row;align-items:center}
  .group .row > label:first-child,.group .row > dt{flex:none}
  table.list{display:block;overflow-x:auto}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .drop-grid{grid-template-columns:1fr}
}
.checklist{margin-top:var(--s6)}
.steps{list-style:none;margin:0 0 var(--s5);padding:0}
.step{display:flex;align-items:flex-start;gap:var(--s3);padding:var(--s2) var(--s4);
  border-bottom:1px solid var(--separator)}
.step:last-child{border-bottom:0}
.step-text{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.step-title{font-size:var(--t-callout);line-height:var(--t-callout-lh);color:var(--label-2)}
.step-detail{font-size:var(--t-caption);line-height:1.4;color:var(--label-3)}
.step-detail:empty{display:none}

/* The mark: empty circle pending, rotating ring running, tick when complete. */
.step-mark{flex:0 0 16px;width:16px;height:16px;margin-top:2px;border-radius:var(--r-round);
  border:1.5px solid var(--separator-strong);position:relative}
.step.is-complete .step-title,.step.is-not_applicable .step-title,.step.is-blocked .step-title{color:var(--label)}
.step.is-running .step-title{color:var(--label);font-weight:600}
.step.is-running .step-mark{border-color:var(--separator-strong);border-top-color:var(--tint);
  animation:step-spin .8s linear infinite}
.step.is-complete .step-mark{border-color:var(--tint);background:var(--tint)}
.step.is-complete .step-mark::after{content:"";position:absolute;left:5px;top:2px;width:4px;height:8px;
  border:solid var(--on-tint);border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
.step.is-not_applicable .step-mark{border-color:var(--separator-strong);background:var(--fill)}
.step.is-not_applicable .step-mark::after{content:"";position:absolute;left:3px;top:6.5px;width:8px;height:0;
  border-top:1.5px solid var(--label-3)}
.step.is-blocked .step-mark{border-color:var(--red)}
.step.is-blocked .step-mark::after{content:"";position:absolute;left:6.5px;top:3px;width:0;height:7px;
  border-left:1.5px solid var(--red)}
.step.is-blocked .step-detail{color:var(--red)}
@keyframes step-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.step.is-running .step-mark{animation:none;border-top-color:var(--tint)}}
/* A step that finished only after 3 failed attempts: a word and a glyph, never color alone. */
.step-failed{display:inline-flex;align-items:center;gap:var(--s1);font-size:var(--t-caption);line-height:var(--t-caption-lh);
  font-weight:var(--w-semibold);color:var(--red)}
.step.is-failed .step-mark{border-color:var(--red);background:var(--red-soft)}
.phase-sum{margin:0 0 var(--s2);padding:0 var(--s4);max-width:72ch;font-size:var(--t-callout);line-height:var(--t-callout-lh);color:var(--label-2)}

/* ---------- the run screen: where it is, what it is doing, and its controls ---------- */
.processing.run-panel{max-width:var(--page-w);margin:var(--s2) auto 0;text-align:left}
.run-panel ~ .checklist{max-width:var(--page-w);margin-left:auto;margin-right:auto}
.run-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s4)}
.run-head .muted{max-width:56ch}
.run-head form,.run-banner-actions form{flex:none}
.run-banner{display:flex;align-items:flex-start;gap:var(--s3);padding:var(--s4);border-radius:var(--r-md);background:var(--bg-grouped)}
.run-banner > .icon{color:var(--tint-text);margin-top:1px}
.run-banner-text{flex:1;min-width:0}
.run-banner-text h2{font-size:var(--t-headline);line-height:var(--t-headline-lh);font-weight:var(--w-semibold);margin-bottom:var(--s1)}
.run-banner-text p + p{margin-top:var(--s1)}
.run-banner-actions{display:flex;flex-direction:column;align-items:stretch;gap:var(--s2);flex:none}
.run-banner-actions .btn,.run-head .btn{width:100%}
dl.run-facts{margin:0;font-size:var(--t-callout);line-height:var(--t-callout-lh)}
dl.run-facts > div{display:flex;gap:var(--s3);padding:6px 0}
dl.run-facts > div + div{border-top:1px solid var(--separator)}
dl.run-facts dt{flex:0 0 72px;color:var(--label-2)}
dl.run-facts dd{flex:1;min-width:0;margin:0;color:var(--label);overflow-wrap:anywhere}
dl.run-facts .run-waiting dd{font-weight:var(--w-semibold)}
dl.run-facts .run-sub{display:block;margin-top:2px;color:var(--label-2)}
@media (max-width:820px){
  .run-head,.run-banner{flex-direction:column}
  .run-banner-actions{flex-direction:row;flex-wrap:wrap}
}

/* ---------- comments: what the run handed over ---------- */
.run-notes{display:flex;flex-direction:column;gap:var(--s2);margin-bottom:var(--s5)}
.run-notes > .notice{margin:0}
main.pane > .run-notes{margin:var(--s4) var(--s7) 0;max-height:40vh;overflow-y:auto}
.notice.attention > .icon{color:var(--red)}
details.questions{padding:0 var(--s4) var(--s1);border-radius:var(--r-md);background:var(--fill)}
details.questions summary{display:flex;align-items:center;gap:var(--s2);min-height:var(--target);cursor:pointer;list-style:none;
  font-weight:var(--w-semibold)}
details.questions summary::-webkit-details-marker{display:none}
details.questions summary .icon{color:var(--tint-text)}
details.questions summary .count{color:var(--label-2);font-weight:var(--w-regular);font-variant-numeric:tabular-nums}
details.questions ol{margin:var(--s2) 0 var(--s3);padding-left:var(--s5)}
details.questions li{padding:var(--s1) 0}
details.questions li > span{display:block}

/* ---------- reviews list: the delete button in each row ---------- */
.row-delete{display:inline-flex;margin:0}
.icon-btn.destructive:hover{color:var(--red);background:var(--red-soft)}

/* ---------- AI instructions: steps grouped by phase, one open at a time ----------
   Same language as the Reviews and Library lists: small gray phase headings, plain rows
   with hairline separators, a hover fill and a chevron. A row opens in place into its
   editor. Classes are istep-* so they never meet the live run list (.step). */
.section-title .count{margin-left:var(--s2);font-size:var(--t-callout);font-weight:var(--w-regular);color:var(--label-2)}
.section-row{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s3);margin:var(--s7) 0 6px}
.section-row .section-title{margin:0}
/* Phases: one collapsible row each; opening one shows its steps, indented beneath it. */
.phases{margin:0 calc(-1 * var(--s3));border-top:1px solid var(--separator)}
details.phase{border-bottom:1px solid var(--separator)}
.phase-summary{display:grid;grid-template-columns:16px minmax(0,1fr) auto;align-items:center;column-gap:var(--s3);
  min-height:var(--row-h);padding:var(--s2) var(--s3);border-radius:var(--r-sm);cursor:pointer;list-style:none;
  transition:background-color var(--dur) var(--ease)}
.phase-summary::-webkit-details-marker{display:none}
.phase-summary:hover{background:var(--fill)}
.phase-summary:active{background:var(--fill-pressed)}
.phase-summary:focus-visible{outline-offset:-3px}
.phase-chev{display:flex;color:var(--label-3);transition:transform var(--dur-slow) var(--ease)}
details.phase[open] > .phase-summary .phase-chev{transform:rotate(90deg)}
.phase-name{display:flex;align-items:baseline;gap:var(--s2);min-width:0}
.phase-num{flex:none;color:var(--label-2);font-variant-numeric:tabular-nums}
.phase-title{font-weight:var(--w-semibold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.phase-count{font-size:var(--t-callout);line-height:var(--t-callout-lh);color:var(--label-2);white-space:nowrap;font-variant-numeric:tabular-nums}
.phase-note{margin:0 var(--s3) var(--s2) calc(16px + 2 * var(--s3));max-width:72ch}
details.phase > ol.isteps{margin:0 0 0 calc(16px + var(--s3))}
details.phase > ol.isteps > li.istep:last-child{border-bottom:0}
.phase-add{margin-left:calc(16px + var(--s3));padding:var(--s1) var(--s3) var(--s3);border-top:1px solid var(--separator)}
details.phase > .istep-add{margin:0 var(--s3) var(--s4) calc(16px + 2 * var(--s3))}
ol.isteps{list-style:none;margin:0 calc(-1 * var(--s3));padding:0;border-top:1px solid var(--separator)}
li.istep{position:relative;border-bottom:1px solid var(--separator)}
.istep-details > summary{display:grid;grid-template-columns:16px 40px minmax(0,1fr) 16px;align-items:center;column-gap:var(--s3);
  min-height:var(--row-h);padding:var(--s2) var(--s3);border-radius:var(--r-sm);cursor:pointer;list-style:none;
  transition:background-color var(--dur) var(--ease)}
.istep-details > summary::-webkit-details-marker{display:none}
.istep-details > summary:hover{background:var(--fill)}
.istep-details > summary:active{background:var(--fill-pressed)}
.istep-details > summary:focus-visible{outline-offset:-3px}
.grip{grid-column:1;display:flex;justify-content:center;color:var(--label-3);cursor:grab}
.grip:active{cursor:grabbing}
.istep-num{grid-column:2;color:var(--label-2);font-variant-numeric:tabular-nums}
.istep-text{grid-column:3;display:flex;flex-direction:column;gap:1px;min-width:0}
.istep-title{font-weight:var(--w-semibold);color:var(--label)}
.istep-preview{font-size:var(--t-callout);line-height:var(--t-callout-lh);color:var(--label-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.istep-chev{grid-column:4;display:flex;color:var(--label-3);transition:transform var(--dur-slow) var(--ease)}
.istep-details[open] .istep-chev{transform:rotate(90deg)}
.istep-details[open] .istep-preview{display:none}
.istep.brief .istep-details > summary{grid-template-columns:minmax(0,1fr) 16px}
.istep.brief .istep-text{grid-column:1}
.istep.brief .istep-chev{grid-column:2}
.istep-edit{padding:var(--s1) var(--s3) var(--s4) calc(var(--s3) + 56px + 2 * var(--s3))}
.istep.brief .istep-edit{padding-left:var(--s3)}
.istep-edit .form-actions,.istep-add .form-actions{margin-top:var(--s3)}
.istep-edit textarea{min-height:120px}
textarea.brief-text{min-height:420px;line-height:1.55}
.istep-more{display:flex;align-items:center;gap:var(--s1);margin-top:var(--s2)}
.istep-more form:last-child{margin-left:auto}
/* Dragging a step: the row dims and a tint line shows where it will land. */
li.istep.dragging{opacity:.45}
li.istep.drop-above::before,li.istep.drop-below::after{content:"";position:absolute;left:var(--s3);right:var(--s3);height:2px;z-index:1;
  border-radius:var(--r-capsule);background:var(--tint)}
li.istep.drop-above::before{top:-1px}
li.istep.drop-below::after{bottom:-1px}
@media (max-width:820px){
  .istep-details > summary{grid-template-columns:36px minmax(0,1fr) 16px}
  .grip{display:none}
  .istep-num{grid-column:1}
  .istep-text{grid-column:2}
  .istep-chev{grid-column:3}
  .istep-edit{padding:var(--s1) var(--s3) var(--s4)}
}

/* ---------- universal issue scan: the coverage matrix ----------
   One row per inventoried item: its name and locations, then 13 result marks in check order,
   opening into every result with its source or reason. Marks are a glyph plus a word for
   screen readers and a tooltip, never color alone. */
.check-key .props{margin:var(--s1) 0 var(--s2)}
.check-key .props dt{flex-basis:220px;color:var(--label)}
.code{display:inline-block;min-width:22px;font-size:var(--t-caption);line-height:var(--t-caption-lh);font-weight:var(--w-semibold);
  color:var(--label-2);text-align:center;font-variant-numeric:tabular-nums}
.scan-kind{margin-top:var(--s6)}
.scan-head,.scan-item > summary{display:grid;grid-template-columns:minmax(0,1fr) repeat(13,24px) 14px;align-items:center;column-gap:4px}
.scan-head{padding:0 var(--s3);margin:0 calc(-1 * var(--s3)) var(--s1)}
.scan-head .list-header{margin:0}
.scan-head .list-header .count{margin-left:var(--s2);font-weight:var(--w-regular)}
ol.scan-items{list-style:none;margin:0 calc(-1 * var(--s3));padding:0;border-top:1px solid var(--separator)}
ol.scan-items > li{border-bottom:1px solid var(--separator)}
.scan-item > summary{min-height:var(--row-h);padding:var(--s2) var(--s3);border-radius:var(--r-sm);cursor:pointer;list-style:none;
  transition:background-color var(--dur) var(--ease)}
.scan-item > summary::-webkit-details-marker{display:none}
.scan-item > summary:hover{background:var(--fill)}
.scan-item > summary:focus-visible{outline-offset:-3px}
.scan-item .istep-chev{grid-column:auto}
.scan-item[open] .istep-chev{transform:rotate(90deg)}
.scan-label{display:flex;flex-direction:column;gap:1px;min-width:0;padding-right:var(--s3)}
.scan-name{font-weight:var(--w-semibold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scan-where{font-size:var(--t-callout);line-height:var(--t-callout-lh);color:var(--label-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mc{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:var(--r-xs);
  font-size:var(--t-callout);font-weight:var(--w-semibold);color:var(--label-2)}
.mc.r-pass{color:var(--label)}
.mc.r-fail{color:var(--red);background:var(--red-soft)}
.mc.r-not_applicable{color:var(--label-3);font-weight:var(--w-regular)}
.scan-detail{padding:0 var(--s3) var(--s4)}
.scan-detail table.list{margin-top:var(--s2)}
.r-text-pass{color:var(--label)}
.r-text-fail{color:var(--red);font-weight:var(--w-semibold)}
.r-text-not_applicable,.r-text-cannot_determine{color:var(--label-2)}
@media (max-width:1100px){
  .scan-head,.scan-item > summary{grid-template-columns:minmax(0,1fr) repeat(13,20px) 14px;column-gap:2px}
  .mc{width:18px;height:18px}
}
@media (max-width:820px){
  .scan-head .code,.scan-item .mc{display:none}
  .scan-head,.scan-item > summary{grid-template-columns:minmax(0,1fr) 14px}
}

.preview{font-size:var(--t-caption);line-height:1.55;color:var(--label);
  white-space:pre-wrap;word-break:break-word;margin:0;max-height:22em;overflow:auto;width:100%}

/* ---------- access code sign-in ---------- */
body.access-page{background:var(--bg-grouped)}
.access{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--s6) var(--s4)}
.access-card{width:100%;max-width:360px;display:flex;flex-direction:column;gap:var(--s5)}
.access-brand{cursor:default}
.access-brand:hover{background:var(--brand-card);border-color:var(--brand-card-edge);box-shadow:var(--brand-card-shadow)}
.access-form{display:flex;flex-direction:column;gap:var(--s2);padding:var(--s5);background:var(--bg-cell);border-radius:var(--r-md)}
.access-form label{font-weight:var(--w-semibold)}
.access-form .btn{margin-top:var(--s2)}
.access-error{display:flex;align-items:center;gap:6px;color:var(--red)}
.access-note{text-align:center;color:var(--label-2);font-size:var(--t-callout);line-height:var(--t-callout-lh)}
.lock-form{margin-left:auto}

/* ---------- reference library: live source status ---------- */
.live-dot{display:inline-block;flex:none;width:10px;height:10px;border-radius:var(--r-round);vertical-align:middle;box-sizing:border-box}
.live-dot.large{width:14px;height:14px}
.live-dot.is-live{background:var(--live);border:1.5px solid var(--live-edge);
  box-shadow:0 0 6px 2px var(--live-glow);animation:live-glow 2.4s var(--ease) infinite}
.live-dot.is-stale{background:var(--red);border:1.5px solid var(--stale-edge)}
.live-dot.is-untracked{background:transparent;border:1.5px solid var(--label-3)}
@keyframes live-glow{0%,100%{box-shadow:0 0 4px 1px var(--live-glow)}50%{box-shadow:0 0 10px 4px var(--live-glow-strong)}}
.nowrap{white-space:nowrap}
.group-header .count{margin-left:var(--s2);font-weight:var(--w-regular);font-variant-numeric:tabular-nums}
.page.library{max-width:1040px}
.page.library.entry-page{max-width:860px}
.lib-group-header{display:flex;align-items:center;gap:var(--s2)}
.lib-group-header .inline-form{margin-left:auto}
.lib-group-header .btn{font-weight:var(--w-regular)}
.lib-counts{display:flex;flex-wrap:wrap;gap:var(--s5)}
.lib-count{display:inline-flex;align-items:center;gap:var(--s2);color:var(--label-2)}
.lib-count b{color:var(--label);font-variant-numeric:tabular-nums}
.lib-scan-form select{max-width:320px}
.lib-scan-line{display:flex;align-items:center;justify-content:space-between;gap:var(--s3)}
.lib-scan-progress .progress{margin:0}
.cite-check{margin-top:var(--s2)}
.cite-check > summary{cursor:pointer;list-style:none;color:var(--tint-text)}
.cite-check > summary::-webkit-details-marker{display:none}
.cite-check .verdict{margin:var(--s3) 0 0}
.cite-row{gap:var(--s2)}
.cite-row input[type=text]{flex:1;min-width:0}
table.lib-list td{vertical-align:middle;padding-top:10px;padding-bottom:10px}
table.lib-list tr:last-child td{border-bottom:0}
table.lib-list .lib-dot{width:22px;padding-right:var(--s1)}
table.lib-list .lib-designation{display:block;font-weight:var(--w-semibold);color:var(--label)}
table.lib-list .lib-name{display:block;margin-top:2px;font-size:var(--t-callout);line-height:var(--t-callout-lh);color:var(--label-2)}
table.lib-list .lib-ed{width:200px;white-space:nowrap;color:var(--label-2);font-variant-numeric:tabular-nums}
table.lib-list .lib-year{width:52px;white-space:nowrap;color:var(--label-2);font-variant-numeric:tabular-nums}
table.lib-list .lib-checked{width:110px;white-space:nowrap;color:var(--label-2)}
table.lib-list .lib-act{width:40px;text-align:right}
.live-banner .row{align-items:flex-start;padding-top:var(--s4);padding-bottom:var(--s4)}
.live-banner .live-dot.large{margin-top:4px}
.live-title{font-size:var(--t-headline);line-height:var(--t-headline-lh);font-weight:var(--w-semibold)}
.live-banner.is-live .live-title{color:var(--live-text)}
.live-banner.is-stale .live-title{color:var(--red)}
.live-reason{color:var(--label-2);margin-top:2px}
.live-banner .source-row{align-items:center;padding-top:var(--s2);padding-bottom:var(--s2)}
.source-link{word-break:break-all}
.diff-row{align-items:flex-start}
.diff-row > .icon{color:var(--red);margin-top:2px}
.diff-actions{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s2)}
.eyebrow{font-size:var(--t-caption);line-height:var(--t-caption-lh);font-weight:var(--w-semibold);letter-spacing:.04em;text-transform:uppercase;color:var(--label-2)}
.entry-page .reading{font-size:var(--t-reading);line-height:var(--t-reading-lh)}
.source-quote{margin:var(--s1) 0 0;padding:var(--s2) var(--s3);border-left:3px solid var(--separator-strong);border-radius:0 var(--r-xs) var(--r-xs) 0;
  background:var(--fill);color:var(--label)}
.point-head{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2)}
.tag{display:inline-flex;align-items:center;height:20px;padding:0 var(--s2);border-radius:var(--r-capsule);background:var(--fill);
  color:var(--label-2);font-size:var(--t-caption);font-weight:var(--w-medium)}
.tag.warn{background:var(--red-soft);color:var(--red)}
.entry-page .cues{margin:0;padding-left:var(--s5)}
.entry-page .props{margin:0}
.record-row{gap:var(--s1)}
.record-head{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2)}
.record-value{white-space:pre-line}
.record-row.is-not-found .record-value,.record-row.is-unverified .record-value{color:var(--label-2)}
.sections-list > summary{cursor:pointer;color:var(--tint-text);list-style:none}
.sections-list > summary::-webkit-details-marker{display:none}
.sections-grid{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:var(--s1) var(--s4);margin-top:var(--s3);
  font-size:var(--t-callout);line-height:var(--t-callout-lh)}
.capture-list{width:100%;font-size:var(--t-body);line-height:var(--t-body-lh)}
@media (max-width:820px){
  table.lib-list .lib-ed,table.lib-list .lib-checked{display:none}
  .lib-group-header .inline-form{display:none}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:0s!important}
  .btn:active,.icon-btn:active{transform:none}
  .live-dot.is-live{animation:none}
}
