/* Truvi system layer — loaded last. One set of rules for the things every page shares:
   rail labels, focus, buttons, status pills, section rhythm, menus. Page files keep their layout;
   this file only normalises what should look identical everywhere. Tokens: see docs/UX_SIMPLIFICATION.md. */
:root{
 --t-radius-sm:8px;--t-radius-md:10px;--t-radius-lg:16px;/* STYLE.md: chips 999px, controls 10px, cards 16px */
 --t-space-1:4px;--t-space-2:8px;--t-space-3:12px;--t-space-4:16px;--t-space-5:24px;--t-space-6:32px;
 --t-text-xs:11px;--t-text-sm:12px;--t-text-md:13px;--t-text-base:14px;--t-text-lg:16px;--t-text-xl:20px;--t-text-2xl:26px;
 --t-focus:0 0 0 2px var(--pv-surface),0 0 0 4px var(--pv-live);
}

/* 1. Rail: icon + word. Icons alone made scientists guess. */
body.preview-ui .cosmo-header.product-header nav{gap:2px}
body.preview-ui .cosmo-header.product-header .product-nav-icon{flex:0 0 auto;width:auto;min-width:44px;height:40px;min-height:40px;padding:0 12px 0 10px;display:inline-flex;align-items:center;gap:8px;border-radius:var(--t-radius-md);font:500 var(--t-text-md)/1 var(--sans);color:var(--pv-ink-2)}
body.preview-ui .cosmo-header.product-header .product-nav-icon svg{width:18px;height:18px;flex:none}
body.preview-ui .cosmo-header.product-header .product-nav-icon .product-nav-label{white-space:nowrap;letter-spacing:.01em}
body.preview-ui .cosmo-header.product-header .product-nav-icon[aria-current=page]{color:var(--pv-accent-ink);background:var(--pv-accent-tint)}
body.preview-ui .cosmo-header.product-header .product-nav-icon .product-project-attention{top:2px;right:2px}
@media(max-width:800px){
 body.preview-ui .cosmo-header.product-header .product-nav-icon{padding:0 10px 0 8px;height:38px;min-height:38px;font-size:var(--t-text-sm)}
 body.preview-ui .cosmo-header.product-header .product-nav-icon svg{width:17px;height:17px}
}
@media(max-width:360px){body.preview-ui .cosmo-header.product-header .product-nav-icon{padding:0 7px;gap:6px}}

/* 2. One focus ring. Keyboard users should see the same thing on every page. */
body.preview-ui :is(button,a,input,textarea,select,summary,[role=button],[tabindex]:not([tabindex="-1"])):focus-visible{outline:2px solid var(--pv-live);outline-offset:2px;box-shadow:none}
body.preview-ui :is(input,textarea,select):focus-visible{outline-offset:0}

/* 3. Buttons: one family, three weights. */
body.preview-ui :is(.button,.pv-tc-button,.ws-link-button,.hub-link,.ov-link,.lab-link,.ds-link){cursor:pointer}
body.preview-ui .button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--pv-line);border-radius:var(--ui-radius);background:var(--pv-surface);color:var(--pv-ink);font:600 var(--t-text-base)/1 var(--sans);min-height:var(--t-control-h);padding:0 14px;box-shadow:none;transition:background-color .15s ease,border-color .15s ease,transform .1s ease}
body.preview-ui .button:hover:not(:disabled){background:var(--pv-surface-2)}
body.preview-ui .button:disabled{opacity:.55;cursor:not-allowed}
body.preview-ui .button:active:not(:disabled){transform:translateY(1px)}
body.preview-ui .button.gold{background:var(--pv-accent);border-color:var(--pv-accent);color:var(--pv-on-accent);font-weight:600}
body.preview-ui .button.gold:hover:not(:disabled){background:var(--pv-accent-hover);border-color:var(--pv-accent-hover);filter:none}
body.preview-ui .button.small{min-height:30px;padding:0 10px;font-size:var(--t-text-sm)}
body.preview-ui :is(.ws-link-button,.hub-link,.ov-link,.lab-link,.ds-link,.pv-tc-text-link){color:var(--pv-accent-ink);font-weight:500}

/* 4. Section headings share one rhythm across Home, Overview, Notebook and Review. */
body.preview-ui :is(.lab-section-head,.ov-section-head,.ds-section-head,.ws-list-heading) h2{font-size:var(--t-text-lg);font-weight:600;letter-spacing:-.005em}
body.preview-ui :is(.lab-section-head,.ov-section-head,.ds-section-head) small,body.preview-ui .ov-subtle{color:var(--pv-muted);font-size:var(--t-text-sm)}

/* 5. Status pills: same shape everywhere (workspace, overview, home, dossier). */
body.preview-ui :is(.ws-status,.ws-exp-status,.ov-status,.lab-status,.ds-pill,.hub-status,.plg-status,.ov-connector-state){display:inline-flex;align-items:center;gap:6px;border:0;border-radius:999px;padding:2px 8px;background:var(--pv-side);color:var(--pv-ink-2);font:600 11.5px/1.5 var(--sans);letter-spacing:0;text-transform:none;white-space:nowrap}
body.preview-ui h1 .ws-area-tag{display:inline-block;vertical-align:middle;margin-left:8px;padding:2px 7px;border:1px solid var(--pv-line);border-radius:var(--t-radius-sm);background:var(--pv-surface-2);color:var(--pv-muted);font:600 var(--t-text-xs)/1.4 var(--mono);letter-spacing:.04em}

/* 6. Final Review header: one primary action and an overflow; phase actions live with Publication. */
body.preview-ui .ds-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px}
body.preview-ui .ds-more{position:relative}
body.preview-ui .ds-more>summary{list-style:none;display:inline-flex;align-items:center}
body.preview-ui .ds-more>summary::-webkit-details-marker{display:none}
body.preview-ui .ds-more-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:40;min-width:180px;display:grid;padding:6px;border:1px solid var(--pv-line);border-radius:12px;background:var(--pv-surface);box-shadow:var(--pv-shadow)}
body.preview-ui .ds-more-menu button{border:0;border-radius:var(--t-radius-sm);background:transparent;color:var(--pv-ink);text-align:left;padding:8px 10px;font:500 var(--t-text-md)/1.4 var(--sans)}
body.preview-ui .ds-more-menu button:hover{background:var(--pv-surface-2)}
body.preview-ui .ds-phase-actions{display:grid;gap:6px;margin:12px 0 10px}
body.preview-ui .ds-phase-actions .button{justify-content:center;width:100%}

/* 7. Tools page under Design. */
body.preview-ui .pv-tc-back{display:inline-block;margin-bottom:14px}
body.preview-ui .pv-tc-page-head .pv-tc-muted{margin:6px 0 0;max-width:60ch;color:var(--pv-muted);font-size:var(--t-text-base)}

/* 8. Notebook sidebar without the project tree: give the notebook tabs room. */
body.preview-ui .ws-sidebar .pv-notebook-section{margin-bottom:6px}
body.preview-ui .ws-breadcrumb{gap:6px}

/* 9. Overview: the queue is the hero; suggested analyses read as help, not another dashboard. */
body.preview-ui .ov-cosmo .ov-action strong{font-size:var(--t-text-base)}

/* 10. Reduced motion is a promise, not a preference. */
@media(prefers-reduced-motion:reduce){body.preview-ui *{transition-duration:.001ms!important;animation-duration:.001ms!important}}

/* 11. Four notebook tabs fit the 280px sidebar as a 2×2 grid instead of wrapping unevenly. */
body.preview-ui .ws-sidebar .pv-notebook-nav{display:grid;grid-template-columns:1fr 1fr;gap:4px}
body.preview-ui .ws-sidebar .pv-notebook-nav button{width:100%;text-align:center;padding:8px 6px;font-size:var(--t-text-md)}

/* 12. Shared overflow/action menu: a native details element, keyboard-friendly, one look everywhere. */
body.preview-ui .t-menu{position:relative}
body.preview-ui .t-menu>summary{list-style:none;display:inline-flex;align-items:center;gap:6px;cursor:pointer}
body.preview-ui .t-menu>summary::-webkit-details-marker{display:none}
body.preview-ui .t-menu>summary[aria-disabled=true]{opacity:.55}
body.preview-ui .t-menu-list{position:absolute;right:0;top:calc(100% + 6px);z-index:40;min-width:260px;max-width:min(360px,calc(100vw - 32px));display:grid;gap:2px;padding:6px;border:1px solid var(--pv-line);border-radius:12px;background:var(--pv-surface);box-shadow:var(--pv-shadow)}
body.preview-ui .t-menu-list button{display:grid;gap:2px;width:100%;border:0;border-radius:var(--t-radius-sm);background:transparent;color:var(--pv-ink);text-align:left;padding:8px 10px;font:500 var(--t-text-md)/1.4 var(--sans)}
body.preview-ui .t-menu-list button small{color:var(--pv-muted);font-weight:400;font-size:var(--t-text-sm)}
body.preview-ui .t-menu-list button:hover:not(:disabled){background:var(--pv-surface-2)}
body.preview-ui .t-menu-list button:disabled{opacity:.5}
body.preview-ui .t-menu-list p{margin:4px 10px 6px;font-size:var(--t-text-sm);color:var(--pv-muted)}

/* 13. Project segment bar reads as tabs (underline), like every other tab set in the product. */
body.preview-ui .pv-project-views{gap:0;padding:0;border:0;border-bottom:1px solid var(--pv-line);border-radius:0;background:transparent;width:auto;align-self:stretch;max-width:100%}
body.preview-ui .pv-project-views button{position:relative;padding:10px 14px 12px;border-radius:0;font-size:var(--t-text-base);color:var(--pv-muted);min-height:40px}
body.preview-ui .pv-project-views button:hover{background:transparent;color:var(--pv-ink)}
body.preview-ui .pv-project-views button[aria-current=page]{background:transparent;color:var(--pv-ink);box-shadow:none;font-weight:600}
body.preview-ui .pv-project-views button[aria-current=page]::after{content:'';position:absolute;left:14px;right:14px;bottom:-1px;height:2px;border-radius:2px;background:var(--pv-accent)}
body.preview-ui .ov-main>.pv-project-views{margin-bottom:4px}
@media(max-width:800px){body.preview-ui .pv-project-views button{padding:9px 10px 11px;font-size:var(--t-text-md)}}

/* 14. Library / People / Scope pages share the Overview's composition: header row, toolbar, boxed empty state. */
body.preview-ui .hub-content{max-width:1120px}
body.preview-ui .hub-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:20px}
body.preview-ui .hub-heading h1{font-size:26px;margin:2px 0 4px}
body.preview-ui .hub-heading p{margin:0;max-width:60ch}
body.preview-ui .hub-actions{display:flex;gap:8px;align-items:center}
body.preview-ui .hub-body{display:grid;gap:16px}
body.preview-ui .hub-body>.hub-note{margin:0;font-size:var(--t-text-md)}
body.preview-ui .hub-search{display:flex;flex-direction:column;gap:6px;max-width:520px;font-size:var(--t-text-sm);color:var(--pv-muted)}
body.preview-ui .hub-search input{min-height:36px;padding:0 12px;border:1px solid var(--pv-line);border-radius:var(--t-radius-md);background:var(--pv-surface);color:var(--pv-ink);font-size:var(--t-text-md)}
body.preview-ui #hub-search-status{margin:0;font-size:var(--t-text-sm);color:var(--pv-muted)}
body.preview-ui .hub-empty{display:grid;justify-items:center;gap:8px;padding:36px 20px;border:1px dashed var(--pv-line);border-radius:var(--t-radius-lg);background:var(--pv-surface);text-align:center;color:var(--pv-ink)}
body.preview-ui .hub-empty p{margin:0;max-width:46ch;font-size:var(--t-text-base);color:var(--pv-ink-2)}
body.preview-ui .hub-empty .button{margin-top:4px}
body.preview-ui p.hub-empty{display:block;text-align:left;padding:14px 16px}
body.preview-ui .hub-card{border:1px solid var(--pv-line);border-radius:var(--t-radius-lg);background:var(--pv-surface);padding:18px 20px;box-shadow:none}
body.preview-ui .hub-card h2{font-size:var(--t-text-lg);margin:0 0 8px}
body.preview-ui .hub-source-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:12px}
body.preview-ui .hub-wiki-intro{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;padding:12px 16px;border:1px solid var(--pv-line);border-radius:var(--t-radius-md);background:var(--pv-surface-2);font-size:var(--t-text-md);color:var(--pv-ink-2)}
body.preview-ui .hub-wiki-intro p{margin:0;max-width:70ch}
body.preview-ui p.hub-empty{display:grid;justify-items:center;text-align:center;padding:28px 20px}

/* 15. Type (Pass E, the Magic Patterns pairing): Poppins for headings, page and card titles and big numbers; Inter for
   everything else. Both @font-face rules live in airbnb-home.css; this block only names the stacks. */
:root{--sans-brand:'Poppins',ui-sans-serif,system-ui,sans-serif;--sans-app:'Inter',ui-sans-serif,system-ui,-apple-system,sans-serif;--serif-display:var(--sans-brand);--sans:var(--sans-app)}
body.preview-ui .cosmo-header.product-header,body.preview-ui .cosmo-header.product-header :is(button,input){font-family:var(--sans-app)}
body.preview-ui .cosmo-header.product-header .product-nav-icon{font-weight:600}
body.preview-ui .product-create-menu,body.preview-ui #product-search-results{font-family:var(--sans-app)}
body.preview-ui .cosmo-header.product-header .product-nav-icon,body.preview-ui .cosmo-header.product-header .product-create-trigger,body.preview-ui .cosmo-header.product-header .preview-global-search>input{font-family:var(--sans-app)}
body.preview-ui #lab-home :is(button,input,textarea,select){font-family:inherit}/* headings keep --sans-brand from product-theme.css */

/* ============================================================================
   16. One product, one palette: the vitruvias.ai system (design/STYLE.md, Oct 2026). Near-white ground, white
   surfaces separated by hairlines, near-black ink that is also the one action colour, sky blue for focus and the
   single highlighted thing, semantic colours that are never brand. This block is the only place light values are
   defined; page files consume the tokens. Dark values are the parked graphite set (theme-init.js forces light). */
:root{
 /* Pass D colours (the Magic Patterns palette was tried on 2026-10-20 and reverted the same day; its fonts stayed, see Pass E). */
 --pv-bg:#FCFCFD;--pv-surface:#FFFFFF;--pv-surface-2:#F9F9FB;--pv-side:#F1F3F6;--pv-line:#E5E7EB;--pv-line-2:#EEF0F3;
 --pv-ink:#1C2024;--pv-ink-2:#4B5259;--pv-muted:#6B7280;
 --pv-accent:#1C2024;--pv-accent-ink:#1C2024;--pv-accent-tint:#F1F3F6;--pv-accent-hover:#2A3036;--pv-on-accent:#FFFFFF;
 --pv-selected-fill:linear-gradient(135deg,#E9C65A 0%,#D4AD35 55%,#C9A227 100%);--pv-selected-ink:#1C2024;/* a selected toggle or tab wears the gold */
 --pv-live:#51B6F8;--pv-live-tint:#E8F5FE;
 --pv-ok:#17653F;--pv-ok-tint:#E4F4EB;--pv-warn:#7A5200;--pv-warn-tint:#FBF1DA;--pv-info:#2457B5;--pv-info-tint:#E8EFFB;--pv-note:#6B4EE6;--pv-note-tint:#EFEBFC;
 --pv-shadow:0 1px 2px rgba(28,32,36,.04),0 8px 24px rgba(28,32,36,.05);
 --pv-gold:#C9A227;--pv-gold-soft:#F0DB92;--pv-gold-tint:#FBF4DC;/* the "new since you last looked" cue only */
 --ui-radius:10px;--radius:10px;--t-control-h:38px;--ui-focus:var(--pv-live);
 /* names older sheets still read */
 --pv-selected:var(--pv-side);--t-sky:var(--pv-live);--t-sky-tint:var(--pv-live-tint);--t-ok:var(--pv-ok);--t-ok-tint:var(--pv-ok-tint);--t-warn:var(--pv-warn);--t-warn-tint:var(--pv-warn-tint);--t-info:var(--pv-info);--t-info-tint:var(--pv-info-tint);--t-dot:#D5D8DE;
 --t-shadow-float:0 10px 24px rgba(28,32,36,.12),0 1px 2px rgba(28,32,36,.06);--ab-shadow:none;--ab-shadow-hover:var(--t-shadow-float);
 --lab-green:var(--pv-accent);--lab-green-deep:var(--pv-accent-hover);--lab-green-tint:var(--pv-accent-tint);--lab-green-line:var(--pv-line);--lab-warm:var(--pv-warn);--lab-warm-tint:var(--pv-warn-tint);--lab-blue:var(--pv-info);--lab-blue-tint:var(--pv-info-tint);--lab-grey-tint:var(--pv-side);
}
:root[data-theme=dark]{
 --pv-bg:#121517;--pv-surface:#1A1E21;--pv-surface-2:#20252A;--pv-side:#272D33;--pv-line:#2A3033;--pv-line-2:#252A2E;
 --pv-ink:#E3E6E4;--pv-ink-2:#B4BAB8;--pv-muted:#969E9B;
 --pv-accent:#E3E6E4;--pv-accent-ink:#E3E6E4;--pv-accent-tint:#272D33;--pv-accent-hover:#F2F4F3;--pv-on-accent:#121517;
 --pv-live:#7CC6F7;--pv-live-tint:#17293A;
 --pv-ok:#7CC48F;--pv-ok-tint:#1B2E22;--pv-warn:#DDB862;--pv-warn-tint:#342B15;--pv-info:#8FB3E4;--pv-info-tint:#1D2733;--pv-note:#B3A2F2;--pv-note-tint:#2A2440;
 --pv-shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35);--t-dot:#3A4147;--pv-gold:#E6C76B;--pv-gold-soft:#8A6F2A;--pv-gold-tint:#2E2816;--t-shadow-float:0 10px 24px rgba(0,0,0,.5),0 1px 2px rgba(0,0,0,.4);
}
body.preview-ui{font-family:var(--sans-app)}
body.preview-ui :is(button,input,select,textarea){font-family:var(--sans-app)}
body.preview-ui :is(h1,h2,h3,h4){font-family:var(--sans-app)}

/* 17. Layout: the rail lives in the top bar (Home · Project · Design · Library); pages fill the width; a project area
   (Notebook, Inventory, Review) opens in a pane from the right beside the Project page on wide screens. */
body.preview-ui{--nav-w:0px;--pane-w:min(1080px,74vw)}
body.preview-ui .cosmo-header.product-header{gap:14px;padding:0 20px}
body.preview-ui .cosmo-header.product-header nav{display:flex;gap:2px;margin-left:6px}
body.preview-ui .cosmo-header.product-header .product-nav-icon{height:44px;min-height:44px}
.product-nav-text{display:flex;flex-direction:column;align-items:flex-start;gap:1px;line-height:1.15}
.product-nav-icon .product-project-title{display:block;max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 11px/1.2 var(--sans-app);color:var(--pv-muted)}
.product-nav-icon[aria-current=page] .product-project-title{color:var(--pv-accent-ink)}
body.preview-ui .cosmo-header.product-header .product-project{margin:0 auto 0 0;width:38px;height:38px;flex:none;padding:0;display:grid;place-items:center;max-width:none;font:inherit;text-align:center;color:var(--pv-ink-2)}
body.preview-ui .cosmo-header.product-header .product-project:hover{color:var(--pv-ink)}
body.preview-ui .cosmo-header.product-header nav{flex:0 0 auto;width:auto;justify-content:flex-start}
.product-calendar[aria-current]{color:var(--pv-accent-ink);background:var(--pv-accent-tint)}
body.preview-ui .cosmo-header.product-header .product-create-trigger{background:var(--pv-accent);color:var(--pv-on-accent)}
body.preview-ui :is(#lab-home,#project-overview,#scientific-workspace,#project-dossier,#preview-tools-calendar,#project-hub,#journey,#app){margin-left:0}
body.preview-ui .preview-project-switch{display:none}
body.preview-ui{--pv-project-bar-height:0px}
body.preview-ui :is(#lab-home,#project-overview,#scientific-workspace,#project-hub,#preview-tools-calendar,#project-dossier,#journey) :is(.overview-sidebar,.ws-sidebar,.hub-sidebar,.preview-context-sidebar,.dossier-sidebar,.design-sidebar){margin-top:0;padding-top:20px;height:calc(100dvh - var(--ui-header-height));top:var(--ui-header-height)}
.pv-project-views{display:none}
/* The project pane: the area's own <main> lives inside it; the Project page stays beneath, dimmed. */
.project-pane{position:fixed;top:var(--ui-header-height);right:0;bottom:0;z-index:120;/* below the review strip (125) and every modal */width:var(--pane-w);display:flex;flex-direction:column;background:var(--pv-bg);border-left:1px solid var(--pv-line);box-shadow:var(--pv-shadow)}
.project-pane[hidden]{display:none}
.project-pane-bar,.project-expanded-bar{display:flex;align-items:center;gap:12px;min-height:50px;padding:0 16px;border-bottom:1px solid var(--pv-line);background:var(--pv-surface)}
.project-expanded-bar[hidden]{display:none}
.project-pane-close{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 10px 0 6px;border:0;border-radius:8px;background:transparent;color:var(--pv-ink-2);font:500 13px var(--sans-app);cursor:pointer}
.project-pane-close svg{transform:rotate(90deg)}
.project-pane-close:hover{background:var(--pv-surface-2);color:var(--pv-ink)}
.project-pane-title{font:600 15px var(--sans-app);color:var(--pv-ink);outline:none}
.project-pane-expand{margin-left:auto;height:32px;padding:0 12px;border:1px solid var(--pv-line);border-radius:8px;background:var(--pv-surface);color:var(--pv-ink-2);font:500 13px var(--sans-app);cursor:pointer}
.project-pane-expand:hover{color:var(--pv-ink);border-color:var(--pv-muted)}
.project-pane-context{display:none;width:32px;height:32px;border:1px solid var(--pv-line);border-radius:8px;background:var(--pv-surface);color:var(--pv-ink-2)}
.project-pane-body{flex:1;min-height:0;overflow:auto;position:relative}
.project-pane-body>main{min-height:100%}
.project-pane :is(.ws-sidebar,.dossier-sidebar){top:0;height:calc(100dvh - var(--ui-header-height) - 50px)}
body.preview-ui .project-pane #project-dossier .dossier-sidebar{padding-top:20px}
body.preview-ui .project-pane .ds-content{padding-top:20px}
/* With a pane open the Project page folds to the uncovered strip: crumb, title and the three tiles stacked, so you can
   move between Notebook, Inventory and Review without closing anything. */
body.project-pane-open #project-overview .ov-rail{display:none}
body.project-pane-open #project-overview{display:block}body.project-pane-open #project-overview .ov-main{width:calc(100vw - var(--pane-w));max-width:none;box-sizing:border-box;padding:18px 20px 24px}
body.project-pane-open #project-overview :is(.ov-objective,.ov-phase-mini,.ov-header-team,.ov-now,.ov-grid,.ov-connectors,.ov-recent-runs,.ov-reading,.ov-footnote){display:none}
body.project-pane-open #project-overview .ov-title-button{display:block;text-align:left}body.project-pane-open #project-overview .ov-title-button h1{font-size:19px;line-height:1.25;white-space:normal;overflow-wrap:normal;word-break:normal}body.project-pane-open #project-overview .ov-title-button span[aria-hidden]{display:none}
body.project-pane-open #project-overview .ov-areas{grid-template-columns:1fr;gap:10px;margin-top:14px}
body.project-pane-open #project-overview .ov-area{min-height:0;padding:14px 16px 34px}
@media(prefers-reduced-motion:no-preference){.project-pane{animation:project-pane-in .22s cubic-bezier(.2,.7,.2,1)}@keyframes project-pane-in{from{transform:translateX(28px);opacity:.5}to{transform:none;opacity:1}}}
/* Project page: crumb + the three area tiles */
.ov-crumbs{display:flex;align-items:center;gap:8px;margin:0 0 6px;font-size:12.5px;color:var(--pv-muted)}
.ov-crumb{border:0;padding:0;background:none;color:var(--pv-ink-2);font:inherit;cursor:pointer}.ov-crumb:hover{color:var(--pv-ink)}.ov-crumb[aria-current]{color:var(--pv-ink);font-weight:600;cursor:default}
.ov-areas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0 22px}
.ov-area{position:relative;display:grid;gap:7px;align-content:start;min-height:136px;padding:18px 20px 40px;border:1px solid var(--pv-line);border-radius:14px;background:var(--pv-surface);color:var(--pv-ink);text-align:left;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease,transform .12s ease}
.ov-area:hover{border-color:var(--pv-accent);box-shadow:var(--pv-shadow)}.ov-area:active{transform:translateY(1px)}
.ov-area[aria-current]{border-color:var(--pv-accent);box-shadow:inset 0 0 0 1px var(--pv-accent)}
.ov-area-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.ov-area-top strong{font-size:19px;font-weight:600;letter-spacing:-.01em}.ov-area-top b{font-weight:500;font-size:13px;color:var(--pv-muted);white-space:nowrap}
.ov-area-facts{font-size:13px;color:var(--pv-ink-2)}
.ov-area-now{font-size:13px;color:var(--pv-muted)}.ov-area-now:is(.live,.attention){color:var(--pv-accent-ink);font-weight:600}.ov-area-now.warn{color:var(--pv-warn);font-weight:600}
.ov-area-go{position:absolute;right:18px;bottom:14px;font-size:12.5px;font-weight:600;color:var(--pv-accent-ink)}
@media(max-width:1000px){
 body.preview-ui .cosmo-header.product-header{padding:0 14px}
 body.preview-ui .preview-project-switch{display:flex;position:sticky;top:var(--ui-header-height);z-index:220;width:100%;min-height:50px;padding:6px 14px;gap:10px;align-items:center;border-right:0}
 body.preview-ui[data-product-tab=home] .preview-project-switch,body.preview-ui.preview-research .preview-project-switch{display:none}
 body.preview-ui{--pv-project-bar-height:0px}
 .ov-areas{grid-template-columns:1fr;gap:10px}.ov-area{min-height:0;padding:14px 16px 34px}
}
@media(max-width:800px){
 :root{--ui-header-height:56px}
 body.preview-ui .cosmo-header.product-header{height:56px;min-height:56px;display:flex;grid-template-rows:none;gap:8px}
 body.preview-ui .cosmo-header.product-header .j-brand{display:none}
 body.preview-ui .cosmo-header.product-header nav{margin-left:0;flex:0 0 auto;width:auto}
 .product-nav-icon .product-project-title{display:none}
 body.preview-ui :is(#lab-home,#project-overview,#scientific-workspace,#project-hub,#preview-tools-calendar,#project-dossier,#journey) :is(.overview-sidebar,.ws-sidebar,.hub-sidebar,.preview-context-sidebar,.dossier-sidebar,.design-sidebar,.pv-tc-sidebar){top:calc(var(--ui-header-height) + 50px);height:calc(100dvh - var(--ui-header-height) - 50px)}
 .preview-context-backdrop:not([hidden]){top:calc(var(--ui-header-height) + 50px)}
}
@media(max-width:560px){body.preview-ui .cosmo-header.product-header{padding:0 10px;gap:6px}body.preview-ui .cosmo-header.product-header #product-create{font-size:0;gap:0;padding:0 10px;min-width:0}body.preview-ui .cosmo-header.product-header .product-nav-icon{padding:0 8px;gap:0}body.preview-ui .cosmo-header.product-header .product-nav-icon .product-nav-label{display:none}body.preview-ui .cosmo-header.product-header .product-nav-icon svg{width:19px;height:19px}}

/* 18. Form fields follow the theme. Legacy sheets (workspace.css, ui.css, product-light.css) paint inputs #fff, which
   in night mode meant light text on a white box: typing looked blank. One rule, every field, both themes. */
body.preview-ui :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]),textarea,select,.ws-search,.ws-inline-name,.ws-table-toolbar>select,.ws-columns>div){background:var(--pv-surface);color:var(--pv-ink);border-color:var(--pv-line);caret-color:var(--pv-ink)}
body.preview-ui :is(input,textarea,select):focus{background:var(--pv-surface);color:var(--pv-ink);border-color:var(--pv-accent)}
body.preview-ui :is(input,textarea)::placeholder{color:var(--pv-muted);opacity:1}
body.preview-ui select option{background:var(--pv-surface);color:var(--pv-ink)}

/* 19. Workflow builder: blocks, protocols and saved work on the left; steps in order on the right, dragged into place. */
dialog#modal.ws-dialog-wide.rw-builder-open{width:min(1240px,96vw);max-width:min(1240px,96vw)}
.rw-builder{display:grid;grid-template-columns:250px minmax(0,1fr);gap:18px;margin-top:10px;align-items:start}
.rw-palette{position:sticky;top:0;padding:12px;border:1px solid var(--pv-line);border-radius:12px;background:var(--pv-surface-2)}
.rw-palette-tabs{display:flex;gap:4px;margin-bottom:10px}
.rw-palette-tabs [role=tab]{flex:1;height:30px;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--pv-ink-2);font:500 12.5px var(--sans-app);cursor:pointer}
.rw-palette-tabs [role=tab][aria-selected=true]{background:var(--pv-surface);border-color:var(--pv-line);color:var(--pv-ink);font-weight:600}
.rw-palette-body>p{margin:0 0 8px;font-size:12px}
.rw-palette h4{margin:12px 0 6px;font:600 12px var(--sans-app);color:var(--pv-muted)}
.rw-block-list{display:flex;flex-wrap:wrap;gap:6px}
.rw-block{display:inline-flex;flex-direction:column;align-items:flex-start;gap:2px;padding:7px 10px;border:1px solid var(--pv-line);border-radius:9px;background:var(--pv-surface);color:var(--pv-ink);font:500 12.5px/1.25 var(--sans-app);cursor:grab;text-align:left;transition:border-color .12s ease}
.rw-block:hover{border-color:var(--pv-accent)}.rw-block:active{cursor:grabbing}
.rw-protocol{width:100%}.rw-protocol small{color:var(--pv-muted);font-size:11px;font-weight:500}
.rw-saved-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 0;border-bottom:1px solid var(--pv-line-2)}
.rw-saved-row>span{display:flex;flex-direction:column;min-width:0}.rw-saved-row strong{font-size:12.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rw-saved-row small{color:var(--pv-muted);font-size:11px}
.rw-small{margin-top:12px;font-size:11.5px;line-height:1.5}
.rw-canvas-head h3{margin:0 0 2px;font:600 15px var(--sans-app);color:var(--pv-ink)}.rw-canvas-head p{margin:0 0 10px;font-size:12.5px}
body.preview-ui .rw-step-editor{display:grid;gap:8px;min-height:120px;padding:8px;border:1px dashed var(--pv-line);border-radius:12px;background:transparent}
.rw-step-editor:empty::before{content:"Drop a step type or a protocol here, or add a step.";display:block;padding:28px 12px;color:var(--pv-muted);font-size:13px;text-align:center}
body.preview-ui .rw-step-editor details{border:1px solid var(--pv-line);border-radius:10px;background:var(--pv-surface);margin:0}
body.preview-ui .rw-step-editor summary{display:flex;align-items:center;gap:10px;padding:10px 12px;cursor:pointer;list-style:none}
body.preview-ui .rw-step-editor summary::-webkit-details-marker{display:none}
body.preview-ui .rw-step-editor summary small{color:var(--pv-muted)}
.rw-drag{color:var(--pv-muted);cursor:grab;letter-spacing:-3px;font-size:15px;line-height:1}
.rw-step-move{margin-left:auto;display:flex;gap:2px}
.rw-step-move button{width:26px;height:26px;border:1px solid var(--pv-line);border-radius:6px;background:var(--pv-surface);color:var(--pv-ink-2);font-size:12px;cursor:pointer}
.rw-step-move button:disabled{opacity:.35;cursor:default}.rw-step-move button:not(:disabled):hover{color:var(--pv-ink);border-color:var(--pv-muted)}
.rw-drop-line{height:3px;border-radius:2px;background:var(--pv-accent);margin:-4px 0}
.rw-canvas-foot{display:flex;align-items:center;gap:12px;margin-top:10px;font-size:12.5px}
@media(max-width:900px){.rw-builder{grid-template-columns:1fr}.rw-palette{position:static}}

@media(max-width:380px){body.preview-ui .cosmo-header.product-header{padding:0 8px;gap:4px}body.preview-ui .cosmo-header.product-header .product-nav-icon{min-width:36px;padding:0 6px}body.preview-ui .cosmo-header.product-header .product-project{width:32px}body.preview-ui .cosmo-header.product-header #product-create{padding:0 8px}body.preview-ui .cosmo-header.product-header .preview-avatar{width:32px;height:32px;min-width:32px}}body.preview-ui .cosmo-header.product-header :is(.j-brand,.preview-word){background:transparent;box-shadow:none}

/* 20. Overview order: progress + activity first, then the three areas as horizontal bars, then Up next. */
.ov-areas{grid-template-columns:1fr;gap:10px;margin:0 0 22px}
.ov-area{display:grid;grid-template-columns:200px minmax(0,1fr) auto;grid-template-areas:"top facts go" "top now go";column-gap:18px;row-gap:2px;align-items:center;min-height:0;padding:14px 20px}
.ov-area-top{grid-area:top;flex-direction:column;align-items:flex-start;gap:2px}
.ov-area-facts{grid-area:facts;align-self:end}
.ov-area-now{grid-area:now;align-self:start}
.ov-area-go{grid-area:go;position:static}
body.project-pane-open #project-overview .ov-grid{display:none}
@media(max-width:1000px){.ov-area{grid-template-columns:1fr;grid-template-areas:"top" "facts" "now" "go";row-gap:4px}.ov-area-go{justify-self:end}}
/* Connections: honest tiles, monogram marks (no third-party logos are bundled), one dialog that says what is and isn't possible today. */
.ov-connectors{margin:0 0 22px}
.ov-connector-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:10px}
.ov-connector{display:flex;align-items:center;gap:12px;min-width:0;width:100%;padding:12px 14px;border:1px solid var(--pv-line);border-radius:12px;background:var(--pv-surface);color:var(--pv-ink);text-align:left;cursor:pointer;transition:border-color .12s ease}
.ov-connector:hover{border-color:var(--pv-accent)}
.ov-connector-mark{flex:none;width:36px;height:36px;display:grid;place-items:center;border-radius:9px;background:var(--pv-surface-2);color:var(--pv-ink-2);font:600 12px/1 var(--sans-app);letter-spacing:.02em}
.ov-connector-copy{display:flex;flex:1;flex-direction:column;min-width:0;gap:1px}.ov-connector-copy strong{font-size:13.5px;font-weight:600}.ov-connector-copy small{font-size:12px;color:var(--pv-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ov-connector-state{margin-left:auto;flex:none;font-size:11.5px;color:var(--pv-muted);border:1px solid var(--pv-line);border-radius:999px;padding:3px 8px}
@media(max-width:1100px){.ov-connector-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.ov-connector-grid{grid-template-columns:1fr}.ov-connector-copy small{white-space:normal}}
/* Presence: the workspace's collaborator line reads as a live indicator. */
body.preview-ui #ws-presence:not(:empty){display:inline-flex;align-items:center;gap:6px;color:var(--pv-accent-ink);font-weight:600}
body.preview-ui #ws-presence:not(:empty)::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--pv-ok)}
body.project-pane-open #project-overview .ov-area{grid-template-columns:1fr;grid-template-areas:"top" "facts" "now" "go";row-gap:4px;padding:14px 16px}body.project-pane-open #project-overview .ov-area-go{justify-self:end}
/* Connect your data: one button in the Project rail; pressing it lists the ways in. */
.ov-rail-connect{padding:14px 0 6px;border-top:1px solid var(--pv-line)}
body.preview-ui .ov-rail-connect .ov-connect{display:inline-flex;align-items:center;gap:8px;width:100%;justify-content:flex-start;padding:10px 12px;border:1px solid var(--pv-accent);border-radius:10px;background:var(--pv-accent-tint);color:var(--pv-accent-ink);font-weight:600}
body.preview-ui .ov-rail-connect .ov-connect:hover{background:var(--pv-accent);color:var(--pv-on-accent)}
.ov-rail-connect .ov-connect .ov-icon-square{width:22px;height:22px;background:transparent;color:inherit}
.ov-small{font-size:12px;margin:8px 2px 0}
.ov-connector-grid--chooser{grid-template-columns:repeat(2,minmax(0,1fr));margin:14px 0}
@media(max-width:640px){.ov-connector-grid--chooser{grid-template-columns:1fr}}

/* 21. Workflows: research areas as a starting point, and a live diagram inside the builder. */
.rw-areas{margin:0 0 22px}
.rw-areas-head{margin-bottom:10px}.rw-areas-head h2{margin:0 0 4px;font:600 17px var(--sans-app);color:var(--pv-ink)}.rw-areas-head p{margin:0;font-size:13px;color:var(--pv-muted)}
.rw-area-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.rw-area{display:grid;gap:6px;align-content:start;padding:14px 16px;border:1px solid var(--pv-line);border-radius:12px;background:var(--pv-surface);color:var(--pv-ink);text-align:left;cursor:pointer;transition:border-color .12s ease,box-shadow .12s ease}
.rw-area:hover:not(:disabled){border-color:var(--pv-accent);box-shadow:var(--pv-shadow)}.rw-area:disabled{opacity:.6;cursor:default}
.rw-area strong{font-size:14.5px;font-weight:600}.rw-area small{font-size:12.5px;color:var(--pv-muted);line-height:1.45}
.rw-area-steps{display:flex;align-items:center;flex-wrap:wrap;gap:3px;margin-top:4px}
.rw-area-steps i{width:20px;height:20px;display:grid;place-items:center;border:1px solid var(--pv-line);border-radius:6px;background:var(--pv-surface-2);color:var(--pv-ink-2);font:600 10.5px var(--sans-app);font-style:normal}
.rw-area-steps b{color:var(--pv-muted);font-weight:500;font-size:11px}
.rw-areas-note{margin:10px 0 0;font-size:12px}
.rw-builder-map{margin:0 0 10px;padding:10px;border:1px solid var(--pv-line);border-radius:12px;background:var(--pv-surface-2);overflow-x:auto}
.rw-builder-map:empty{display:none}
.rw-builder-lanes{gap:10px;align-items:stretch}
.rw-builder-lanes .rw-lane{width:150px;gap:8px}
.rw-lane-arrow{align-self:center;color:var(--pv-muted);font-size:14px}
body.preview-ui .rw-node--mini{min-height:0;padding:8px 10px;gap:2px;border-color:var(--pv-line);background:var(--pv-surface);color:var(--pv-ink);box-shadow:none;cursor:pointer}
body.preview-ui .rw-node--mini small{font-size:10.5px;color:var(--pv-muted)}body.preview-ui .rw-node--mini strong{font-size:12px;font-weight:600;line-height:1.25}
body.preview-ui .rw-node--mini:hover{border-color:var(--pv-accent)}
@media(max-width:1000px){.rw-area-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.rw-area-grid{grid-template-columns:1fr}}

/* 22. Project page = Overview + Review in one view; Notebook, Inventory and Workflow are tiles in the left rail. */
.ov-rail-title{display:none;margin:0 0 12px}.ov-rail-title span{display:block;font-size:12px;color:var(--pv-muted)}.ov-rail-title strong{display:block;font-size:17px;font-weight:600;line-height:1.25}
.ov-rail .ov-areas{grid-template-columns:1fr;gap:10px;margin:0 0 18px}
.ov-rail .ov-area{grid-template-columns:1fr;grid-template-areas:"top" "facts" "now" "go";row-gap:4px;padding:14px 16px}
.ov-rail .ov-area-top{flex-direction:row;align-items:baseline;justify-content:space-between}.ov-rail .ov-area-top strong{font-size:17px}
.ov-rail .ov-area-go{justify-self:end}
/* the folded strip beside a pane is the rail itself */
body.project-pane-open #project-overview .ov-rail{display:block}
body.project-pane-open #project-overview .ov-main{display:none}
body.project-pane-open #project-overview .ov-rail :is(.ov-rail-navigation,.ov-rail-connect,.ov-team,.ov-sidebar-upcoming){display:none}
body.project-pane-open #project-overview .ov-rail-title{display:block}
/* the Review record inside the page */
.ov-review{margin:0 0 22px}
.ov-review-jump{border:0;background:none;padding:0;font:inherit;color:inherit;cursor:pointer}.ov-review-jump:hover{color:var(--pv-accent-ink)}
body.preview-ui #project-overview #project-dossier{display:grid;grid-template-columns:260px minmax(0,1fr);gap:0 18px;min-height:0;margin-top:10px;border:1px solid var(--pv-line);border-radius:14px;background:var(--pv-surface);overflow:hidden}
body.preview-ui #project-overview #project-dossier .dossier-sidebar{position:static;width:auto;height:auto;flex:none;padding:20px 18px;border-right:1px solid var(--pv-line);background:var(--pv-surface-2)}
body.preview-ui #project-overview #project-dossier .ds-content{padding:20px 22px}
@media(max-width:1100px){body.preview-ui #project-overview #project-dossier{grid-template-columns:1fr}body.preview-ui #project-overview #project-dossier .dossier-sidebar{border-right:0;border-bottom:1px solid var(--pv-line)}}
@media(max-width:800px){body.preview-ui #project-overview #project-dossier{display:grid}body.preview-ui #project-overview #project-dossier .dossier-sidebar{display:block;position:static;top:auto;height:auto;box-shadow:none}}
.ov-rail .ov-area--review{grid-template-areas:"top" "now";padding:12px 16px;background:var(--pv-surface-2)}.ov-rail .ov-area--review .ov-area-top strong{font-size:15px}
/* Below 800px the Project page's rail is not a hidden panel: its tiles come first, the main column next, and Project
   status, Team and Upcoming follow. (display:contents lets the rail's children join the page's flex column.) */
@media(max-width:800px){
 body.preview-ui[data-product-tab=overview] .preview-project-switch{display:none}
 body.preview-ui #project-overview{display:flex;flex-direction:column}
 body.preview-ui #project-overview .ov-rail,body.preview-ui #project-overview .ov-rail-body{display:contents}
 body.preview-ui #project-overview .ov-rail-title{display:none}
 body.preview-ui #project-overview .ov-areas{order:0;margin:16px 16px 4px}
 body.preview-ui #project-overview .ov-main{order:1}
 body.preview-ui #project-overview :is(.ov-rail-navigation,.ov-rail-connect,.ov-team,.ov-sidebar-upcoming){order:2;margin:0 16px 12px}
}

/* 23. Fit and fill. Home fits the viewport (cards scroll inside); a project pane fills everything right of the rail. */
body.preview-ui{--pane-w:calc(100vw - var(--ui-sidebar-width,280px))}
body.preview-ui #lab-home .lab-content{display:flex;flex-direction:column;height:calc(100dvh - var(--ui-header-height));box-sizing:border-box;padding-bottom:16px;overflow:hidden}
body.preview-ui #lab-home .lab-heading{flex:none}
body.preview-ui #lab-home .lab-projects{flex:none;padding:8px 0 2px}
body.preview-ui #lab-home .lab-topline,body.preview-ui #lab-home .lab-project-head,body.preview-ui #lab-home .lab-tabs{flex:none}
body.preview-ui #lab-home .lab-project-head h1{font-size:24px}
body.preview-ui #lab-home .lab-attention{flex:none;max-height:32vh;overflow:auto}
body.preview-ui #lab-home .lab-grid{flex:1;min-height:0;grid-template-rows:minmax(0,1fr) minmax(0,1fr);gap:12px}
body.preview-ui #lab-home .pc-card{min-height:0;overflow:auto}
body.preview-ui #lab-home .lab-reading{grid-template-rows:minmax(0,1fr)}
@media(max-height:800px){body.preview-ui #lab-home .lab-content{padding-top:10px}body.preview-ui #lab-home .lab-heading{padding-bottom:6px}body.preview-ui #lab-home .lab-projects{padding:4px 0 0}body.preview-ui #lab-home .lab-project-head h1{font-size:20px}body.preview-ui #lab-home .lab-project-copy p{display:none}body.preview-ui #lab-home .lab-topline{margin-bottom:2px}body.preview-ui #lab-home .lab-tabs{margin:6px 0}body.preview-ui #lab-home .lab-attention{max-height:26vh;padding:10px 14px}body.preview-ui #lab-home .pc-card{padding:12px 14px}body.preview-ui #lab-home .lab-grid{gap:8px}body.preview-ui #lab-home .pc-head{margin-bottom:6px}}
@media(max-height:600px),(max-width:1100px){body.preview-ui #lab-home .lab-content{height:auto;overflow:visible}body.preview-ui #lab-home .lab-attention{max-height:none}body.preview-ui #lab-home .lab-grid{grid-template-rows:none}}
/* Rail: the report button and the status card */
.ov-rail-report{padding:2px 0 8px}
body.preview-ui .ov-rail-report .ov-report{display:inline-flex;align-items:center;gap:8px;width:100%;justify-content:flex-start;padding:10px 12px;border-radius:10px;font-weight:600}
.ov-rail-report .ov-report .ov-icon-square{width:22px;height:22px;background:transparent;color:inherit}
body.preview-ui .ov-rail-report .ov-report[aria-current]{box-shadow:inset 0 0 0 2px var(--pv-accent-ink)}
.ov-status-card .task-node-list{margin-top:4px}
.ov-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:1250px){.ov-grid--three{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1100px){.ov-grid--three{grid-template-columns:1fr}}
body.project-pane-open #project-overview .ov-rail .ov-rail-report{display:block}
@media(max-width:800px){body.preview-ui #project-overview .ov-rail-report{order:0;margin:0 16px 8px}}
@media(min-width:1300px) and (min-height:601px){body.preview-ui #lab-home .lab-grid:not(.lab-reading){grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:minmax(0,1fr)}body.preview-ui #lab-home .pc-progress-body{flex-direction:column;align-items:flex-start;gap:10px}body.preview-ui #lab-home .pc-ring{width:84px;height:84px}}

body.preview-ui .project-pane #project-dossier .dossier-sidebar,body.preview-ui .project-pane #scientific-workspace .ws-sidebar{top:0;margin-top:0;height:calc(100dvh - var(--ui-header-height) - 50px)}

/* 24. Moving between pages and areas: one short fade on what just appeared. Reduced motion turns it off. */
@media(prefers-reduced-motion:no-preference){
 /* Page and tab changes cross-fade gently: content never drops to transparent, so there is no white flash */
 .page-enter{animation:page-enter .42s cubic-bezier(.22,.61,.36,1) both}
 .project-pane-body.page-enter{animation:page-enter .46s cubic-bezier(.22,.61,.36,1) both}
 @keyframes page-enter{from{opacity:.55}60%{opacity:.9}to{opacity:1}}
 @media(prefers-reduced-motion:reduce){.page-enter,.project-pane-body.page-enter{animation:none}}
}
body.preview-ui #lab-home .lab-attention{flex:0 1 auto;min-height:0;max-height:none;overflow:auto}body.preview-ui #lab-home .lab-attention--empty p{margin:6px 0 0;font-size:13px}
/* Calendar as a Home tab: the calendar page renders inside Home's column. */
body.preview-ui #lab-home .lab-calendar-slot{flex:1 1 auto;min-height:0;overflow:auto;border:1px solid var(--home-line);border-radius:var(--home-radius);background:var(--home-surface)}
body.preview-ui #lab-home #preview-tools-calendar:not([hidden]){margin:0;min-height:100%;display:flex;flex-direction:row;align-items:stretch}
body.preview-ui #lab-home #preview-tools-calendar .pv-tc-sidebar{position:static;top:auto;height:auto;width:300px;flex:0 0 300px;overflow:auto;border-right:1px solid var(--pv-line);padding:16px 18px}
body.preview-ui #lab-home #preview-tools-calendar .pv-tc-content{flex:1 1 auto;min-width:0;overflow:auto;padding:16px 18px 24px}
@media(max-width:900px){body.preview-ui #lab-home #preview-tools-calendar:not([hidden]){flex-direction:column}body.preview-ui #lab-home #preview-tools-calendar .pv-tc-sidebar{width:auto;flex:none;border-right:0;border-bottom:1px solid var(--pv-line)}}
@media(max-width:1000px){body.preview-ui[data-product-tab=calendar] .preview-project-switch{display:none}}
/* Protocol page: the workflow builder sits under the protocols table. */
.rw-combined{margin-top:28px;padding-top:22px;border-top:1px solid var(--pv-line-2)}
.rw-combined-head{margin-bottom:14px}.rw-combined-head h2{margin:0 0 4px;font:600 19px var(--sans-app);color:var(--pv-ink)}.rw-combined-head p{margin:0;font-size:13px;color:var(--pv-muted)}
.rw-saved{margin-top:18px}.rw-saved h3{margin:0 0 8px;font:600 14px var(--sans-app);color:var(--pv-ink)}.rw-saved h3 span{margin-left:6px;font-weight:500;color:var(--pv-muted)}
.rw-saved-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px;margin-bottom:8px}
.rw-saved-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--pv-line);border-radius:10px;background:var(--pv-surface);color:var(--pv-ink);text-align:left;cursor:pointer}
.rw-saved-row:hover{border-color:var(--pv-accent)}.rw-saved-row strong{flex:1;min-width:0;font:500 13.5px var(--sans-app);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rw-saved-row small{font-size:12px;color:var(--pv-muted)}.rw-saved-row span{color:var(--pv-muted)}
/* ---- Workflow area (Protocol page lower half + Workflows page): icon cards, no step numbers, saved list with tools ---- */
.rw-area-page{display:flex;flex-direction:column;gap:16px}
.rw-area-page.rw-combined{margin-top:28px;padding-top:24px;border-top:1px solid var(--pv-line-2)}
.rw-page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}
.rw-page-title{display:flex;align-items:center;gap:14px}
.rw-page-title h1,.rw-page-title h2{margin:0;font:600 24px/1.15 var(--sans-app);color:var(--pv-ink)}
.rw-page-title p{margin:4px 0 0;font-size:13px;color:var(--pv-muted)}
.rw-page-mark,.rw-area-icon,.inv-panel-icon,.inv-stat-icon{display:grid;place-items:center;flex:none;border-radius:12px;background:var(--pv-accent-tint);color:var(--pv-accent-ink)}
.rw-page-mark{width:52px;height:52px}
.rw-block{padding:16px 18px 18px;border:1px solid var(--pv-line-2);border-radius:14px;background:var(--pv-surface)}
.rw-block-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.rw-block-head h3{display:inline-flex;align-items:center;gap:8px;margin:0;font:600 15px var(--sans-app);color:var(--pv-ink)}
.rw-block-head h3 svg{color:var(--pv-accent-ink)}
.rw-area-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.rw-area{display:flex;align-items:center;gap:14px;padding:14px 14px 14px 16px;border:1px solid var(--pv-line-2);border-radius:12px;background:var(--pv-surface);color:var(--pv-ink);text-align:left;cursor:pointer;transition:border-color .12s ease,box-shadow .12s ease}
.rw-area:hover:not(:disabled){border-color:var(--pv-accent);box-shadow:var(--pv-shadow)}.rw-area:disabled{opacity:.6;cursor:default}
.rw-area-icon{width:52px;height:52px}
.rw-area-copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.rw-area strong{font-size:14.5px;font-weight:600}.rw-area small{font-size:12.5px;color:var(--pv-muted);line-height:1.45}
.rw-area-go{color:var(--pv-muted);flex:none}
.rw-area-steps{display:none}
.rw-saved-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rw-search{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 10px;border:1px solid var(--pv-line);border-radius:9px;background:var(--pv-surface);color:var(--pv-muted)}
.rw-search input{border:0;background:transparent;outline:0;min-width:180px;font:400 13px var(--sans-app);color:var(--pv-ink)}
.rw-saved-tools select{height:36px;padding:0 10px;border:1px solid var(--pv-line);border-radius:9px;background:var(--pv-surface);color:var(--pv-ink);font:400 13px var(--sans-app)}
.rw-saved-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px}
.rw-saved-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--pv-line-2);border-radius:12px;background:var(--pv-surface);color:var(--pv-ink);text-align:left;cursor:pointer}
.rw-saved-row:hover{border-color:var(--pv-accent)}
.rw-saved-row .rw-area-icon{width:44px;height:44px}
.rw-saved-row strong{font:600 14px var(--sans-app)}.rw-saved-row small{font-size:12.5px;color:var(--pv-muted)}
.rw-saved-row[hidden]{display:none}
.rw-empty{display:flex;align-items:center;gap:16px;padding:22px 20px;border:1px dashed var(--pv-line);border-radius:12px;background:var(--pv-surface-2)}
.rw-empty[hidden]{display:none}
.rw-empty strong{display:block;font:600 15px var(--sans-app);color:var(--pv-ink)}.rw-empty p{margin:4px 0 0;font-size:13px;color:var(--pv-muted);max-width:60ch}
.rw-runs-link{margin-top:10px}
.rw-areas-note{display:none}
@media(max-width:1000px){.rw-area-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.rw-area-grid{grid-template-columns:1fr}.rw-search input{min-width:120px}}
/* ---- Inventory landing (LIMS): stat tiles, two panels with empty states, storage health ---- */
.inv-head .ws-area-tag{vertical-align:middle;margin-left:8px;padding:3px 8px;border-radius:999px;font:600 10.5px var(--sans-app);letter-spacing:.08em;color:var(--pv-accent-ink);background:var(--pv-accent-tint);border-color:transparent}
.inv-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 18px}
.inv-stat{display:flex;align-items:center;gap:14px;padding:14px 16px;border:1px solid var(--pv-line-2);border-radius:12px;background:var(--pv-surface);color:var(--pv-ink);text-align:left;cursor:pointer;transition:border-color .12s ease}
.inv-stat:hover{border-color:var(--pv-accent)}
.inv-stat-icon{width:44px;height:44px}
.inv-stat.warn .inv-stat-icon{background:var(--pv-warn-tint);color:var(--pv-warn)}
.inv-stat-copy{display:flex;flex-direction:column;min-width:0}
.inv-stat-copy strong{font:600 24px/1.1 var(--sans-app);font-variant-numeric:tabular-nums}
.inv-stat-copy span{font:500 13px var(--sans-app);color:var(--pv-ink-2)}
.inv-stat-copy small{font-size:11.5px;color:var(--pv-muted)}
.inv-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-bottom:18px}
.inv-panel{display:flex;flex-direction:column;gap:12px;padding:18px 20px 20px;border:1px solid var(--pv-line-2);border-radius:14px;background:var(--pv-surface)}
.inv-panel-head{display:flex;align-items:flex-start;gap:14px}
.inv-panel-icon{width:52px;height:52px}
.inv-panel-copy{flex:1;min-width:0}
.inv-panel-copy h2{margin:0;font:600 17px var(--sans-app);color:var(--pv-ink)}.inv-panel-copy p{margin:4px 0 0;font-size:13px;color:var(--pv-muted)}
.inv-facts{display:flex;gap:14px;flex-wrap:wrap;margin:0;font-size:12.5px;color:var(--pv-muted)}
.inv-facts span{display:inline-flex;align-items:center;gap:6px}.inv-facts i{width:7px;height:7px;border-radius:50%;background:var(--pv-line)}
.inv-facts .warn i{background:var(--pv-warn)}.inv-facts .ok i{background:var(--pv-ok)}.inv-facts .violet i{background:var(--pv-note)}
.inv-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:26px 20px 22px;border:1px dashed var(--pv-line);border-radius:12px;background:var(--pv-surface-2)}
.inv-illo{display:block;width:160px;color:var(--pv-accent-ink);opacity:.8;margin-bottom:6px}
.inv-empty strong{font:600 15px var(--sans-app);color:var(--pv-ink)}.inv-empty p{margin:0 0 8px;font-size:12.5px;color:var(--pv-muted);max-width:44ch}
.inv-health{display:flex;align-items:center;gap:14px;padding:14px 18px;border:1px solid var(--pv-line-2);border-radius:14px;background:var(--pv-surface)}
.inv-health.is-warn{background:var(--pv-warn-tint);border-color:transparent}
.inv-health .inv-panel-icon{width:44px;height:44px}
.inv-health.is-warn .inv-panel-icon{background:var(--pv-surface);color:var(--pv-warn)}
@media(max-width:1100px){.inv-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){.inv-grid{grid-template-columns:1fr}}
.rw-block-head .rw-saved-tools{flex:0 0 auto;margin-left:auto}
.rw-saved-tools select,.rw-search{width:auto;flex:none;margin:0}
.rw-saved-tools select{max-width:170px}
.rw-empty{width:100%;box-sizing:border-box}
#ws-table-host[hidden],#ws-page-control[hidden]{display:none}
/* ---- Workflow flowchart canvas (builder + saved workflow page) ---- */
.rw-fc{position:relative;display:flex;flex-direction:column;min-height:380px;border:1px solid var(--pv-line);border-radius:14px;background:var(--pv-bg);overflow:hidden}
.rw-fc-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid var(--pv-line-2);background:var(--pv-surface)}
.rw-fc-title{display:flex;align-items:baseline;gap:10px;min-width:0}
.rw-fc-title strong{font:600 17px/1.2 var(--sans-app);color:var(--pv-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rw-fc-saved{display:inline-flex;align-items:center;gap:6px;font:500 12px/1 var(--sans-app);color:var(--pv-muted)}
.rw-fc-saved::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--pv-ok)}
.rw-fc-title small{font:500 12px/1 var(--sans-app);color:var(--pv-accent-ink)}
.rw-fc-view{display:inline-flex;align-items:center;gap:6px;font:500 12px var(--sans-app);color:var(--pv-muted)}
.rw-fc-view select{height:30px;padding:0 8px;border:1px solid var(--pv-line);border-radius:8px;background:var(--pv-surface);color:var(--pv-ink);font:500 12.5px var(--sans-app)}
.rw-fc-scroll{flex:1;min-height:0;overflow:auto;background-image:radial-gradient(var(--pv-line-2) 1px,transparent 1px);background-size:22px 22px}
.rw-fc-inner{position:relative;display:inline-block;min-width:100%;padding:34px 40px 40px}
.rw-fc-links{position:absolute;inset:0;pointer-events:none;overflow:visible}
.rw-fc-links path{fill:none;stroke:var(--pv-muted);stroke-width:1.4;stroke-dasharray:3 4}
.rw-fc-links circle{fill:var(--pv-muted)}
.rw-fc-lane{position:relative;display:flex;align-items:flex-start;gap:0}
.rw-fc-card{position:relative;z-index:1;flex:none;width:236px;border:1px solid var(--pv-line);border-radius:10px;background:var(--pv-surface);color:var(--pv-ink);box-shadow:var(--pv-shadow);cursor:pointer;text-align:left;transition:border-color .12s ease,box-shadow .12s ease}
.rw-fc-card:hover{border-color:var(--pv-accent)}
.rw-fc-card.is-selected{border-color:var(--pv-live);box-shadow:0 0 0 3px var(--pv-live-tint),var(--pv-shadow)}
.rw-fc-card:focus-visible{outline:2px solid var(--pv-live);outline-offset:2px}
.rw-fc-head{display:flex;align-items:center;gap:8px;padding:10px 10px 8px 12px;border-bottom:1px solid var(--pv-line-2);background:var(--pv-surface-2);border-radius:10px 10px 0 0}
.rw-fc-no{display:grid;place-items:center;flex:none;width:20px;height:20px;border-radius:6px;background:var(--pv-accent-tint);color:var(--pv-accent-ink);font:600 11px var(--sans-app)}
.rw-fc-head strong{flex:1;min-width:0;font:600 14px/1.25 var(--sans-app);overflow-wrap:anywhere}
.rw-fc-status{font:600 10.5px/1 var(--sans-app);font-style:normal;padding:4px 7px;border-radius:999px;background:var(--pv-line-2);color:var(--pv-ink-2);text-transform:capitalize}
.rw-fc-status[data-status=ready],.rw-fc-status[data-status=running]{background:var(--pv-info-tint);color:var(--pv-info)}
.rw-fc-status[data-status=completed]{background:var(--pv-ok-tint);color:var(--pv-ok)}
.rw-fc-gear{display:grid;place-items:center;flex:none;width:26px;height:26px;border:1px solid var(--pv-line);border-radius:7px;background:var(--pv-surface);color:var(--pv-ink-2);cursor:pointer}
.rw-fc-gear:hover{border-color:var(--pv-accent);color:var(--pv-accent-ink)}
.rw-fc-type{margin:0;padding:6px 12px 0;font:500 11px/1.3 var(--sans-app);color:var(--pv-muted)}
.rw-fc-sec{padding:10px 12px 11px;border-top:1px solid var(--pv-line-2)}
.rw-fc-type+.rw-fc-sec{border-top:0;padding-top:8px}
.rw-fc-sec h5{margin:0 0 5px;font:600 12px/1.2 var(--sans-app);color:var(--pv-ink)}
.rw-fc-sec ul{list-style:none;margin:0;padding:0;display:grid;gap:3px}
.rw-fc-sec li,.rw-fc-sec dd,.rw-fc-sec dt{font:400 12.5px/1.35 var(--sans-app);color:var(--pv-ink-2)}
.rw-fc-sec dl{margin:0;display:grid;gap:3px}.rw-fc-sec dl div{display:flex;justify-content:space-between;gap:10px}.rw-fc-sec dd{margin:0;color:var(--pv-ink);font-variant-numeric:tabular-nums;text-align:right}
.rw-fc-none{margin:0;font:400 12px/1.3 var(--sans-app);color:var(--pv-muted);font-style:italic}
.rw-fc-link{display:flex;align-items:center;flex:none;width:76px;margin-top:20px}
.rw-fc-link i{flex:1;height:0;border-top:1.5px solid var(--pv-muted)}
.rw-fc-link .rw-fc-arrow{position:relative}.rw-fc-link .rw-fc-arrow::after{content:"";position:absolute;right:-1px;top:-4px;border:4px solid transparent;border-left:6px solid var(--pv-muted)}
.rw-fc-link .rw-fc-tail{border-top-style:dashed}
.rw-fc-plus{display:grid;place-items:center;flex:none;width:22px;height:22px;border:1px solid var(--pv-muted);border-radius:50%;background:var(--pv-surface);color:var(--pv-ink-2);cursor:pointer;transition:transform .12s ease,border-color .12s ease,color .12s ease}
.rw-fc-plus:hover{transform:scale(1.12);border-color:var(--pv-accent);color:var(--pv-accent-ink)}
.rw-fc-plus--static{border-style:dashed;cursor:default}
.rw-fc-lane>.rw-fc-plus:first-child{margin-top:20px}
.rw-fc-dots{flex:none;width:32px;margin-top:31px;border-top:1.5px dashed var(--pv-muted)}
.rw-fc-empty{display:grid;justify-items:start;gap:6px;max-width:440px;padding:18px 20px;border:1px dashed var(--pv-line);border-radius:12px;background:var(--pv-surface)}
.rw-fc-empty strong{font:600 14px var(--sans-app)}.rw-fc-empty p{margin:0 0 6px;font:400 12.5px/1.5 var(--sans-app);color:var(--pv-muted)}
.rw-fc-zoom{position:absolute;left:12px;bottom:12px;display:grid;gap:2px;padding:3px;border:1px solid var(--pv-line);border-radius:8px;background:var(--pv-surface);box-shadow:var(--pv-shadow)}
.rw-fc-zoom button{display:grid;place-items:center;width:24px;height:24px;border:0;border-radius:5px;background:transparent;color:var(--pv-ink-2);cursor:pointer}
.rw-fc-zoom button:hover{background:var(--pv-surface-2);color:var(--pv-ink)}
.rw-builder-map{padding:0;border:0;background:transparent;overflow:visible}
.rw-workflow-layout--canvas{grid-template-columns:minmax(0,1fr) 320px;gap:16px}
.rw-workflow-layout--canvas .rw-workflow-map{min-height:0;padding:0;border:0;background:transparent}
@media(max-width:1100px){.rw-workflow-layout--canvas{grid-template-columns:1fr}}
/* Lab Notebook sections in one horizontal row: Entries · Protocol · Files. */
body.preview-ui .ws-sidebar .pv-notebook-nav{display:flex;flex-direction:row;gap:2px}
body.preview-ui .ws-sidebar .pv-notebook-nav button{flex:1 1 0;min-width:0;text-align:center;padding:9px 3px;font-size:12px;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Generate report prompt */
.rp-dialog{border:1px solid var(--pv-line);border-radius:12px;padding:0;width:min(560px,calc(100vw - 32px));background:var(--pv-surface);color:var(--pv-ink);box-shadow:var(--pv-shadow)}
.rp-dialog::backdrop{background:rgba(28,32,36,.42)}
.rp-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:22px 24px 6px}
.rp-eyebrow{margin:0 0 4px;font:600 12px/1 var(--sans-app);color:var(--pv-muted)}
.rp-head h2{margin:0 0 6px;font:600 20px/1.25 var(--sans-app)}.rp-sub{margin:0;font-size:13px;color:var(--pv-muted)}
.rp-close{border:0;background:transparent;font-size:22px;line-height:1;color:var(--pv-muted);cursor:pointer;padding:2px 6px;border-radius:6px}.rp-close:hover{background:var(--pv-surface-2)}
.rp-body{display:grid;gap:6px;padding:10px 24px 6px}
.rp-row{display:flex;align-items:flex-start;gap:12px;padding:10px 12px;border:1px solid var(--pv-line-2);border-radius:10px;cursor:pointer}.rp-row:hover{background:var(--pv-surface-2)}
.rp-row input[type=checkbox]{margin-top:3px;accent-color:var(--pv-accent)}.rp-row span{display:grid;gap:2px;flex:1}.rp-row strong{font:600 14px var(--sans-app)}.rp-row small{font-size:12.5px;line-height:1.45;color:var(--pv-muted)}
.rp-row--date{align-items:center}.rp-row--date input{font:inherit;padding:6px 8px;border:1px solid var(--pv-line);border-radius:8px;background:var(--pv-surface)}
.rp-foot{display:flex;justify-content:flex-end;gap:8px;padding:12px 24px 22px}

/* 22. Area pages: the section tabs sit across the top of the page in the report's style; the sidebar keeps lists and locations. */
.ws-doc-tabs{display:flex;align-items:stretch;gap:28px;padding:0 30px;border-bottom:1px solid var(--pv-line);background:var(--pv-surface);overflow-x:auto;scrollbar-width:none}
.ws-doc-tabs-area{display:inline-flex;align-items:center;padding:15px 20px 12px 0;margin-right:4px;border-right:1px solid var(--pv-line);font:600 13px/1 var(--sans-app);letter-spacing:.02em;color:var(--pv-ink)}
.ws-doc-tabs button{display:inline-flex;align-items:center;gap:8px;flex:none;padding:16px 0 12px;border:0;border-bottom:3px solid transparent;background:transparent;color:var(--pv-ink-2);font:500 13px/1 var(--sans-app);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;white-space:nowrap}
.ws-doc-tabs button:hover{color:var(--pv-ink)}.ws-doc-tabs button[aria-current]{color:var(--pv-accent-ink);border-bottom-color:var(--pv-accent)}
.ws-doc-tabs button small{font:500 11px/1 var(--sans-app);letter-spacing:0;padding:3px 7px;border-radius:999px;background:var(--pv-surface-2);color:var(--pv-muted)}.ws-doc-tabs button[aria-current] small{background:var(--pv-accent-tint);color:var(--pv-accent-ink)}.ws-doc-tabs button small.pv-warn{background:var(--pv-warn-tint);color:var(--pv-warn)}
@media(min-width:1700px){.ws-doc-tabs{padding-inline:50px}}
@media(max-width:1100px){.ws-doc-tabs{padding:0 20px;gap:20px}}
@media(max-width:620px){.ws-doc-tabs{padding:0 16px;gap:16px}.ws-doc-tabs-area{padding-right:12px}.ws-doc-tabs button{padding:13px 0 10px;font-size:12px}}

/* 23. Resources → Plugins */
.plg-section{margin:0 0 26px}.plg-section>h2{margin:0 0 10px;font:600 15px/1.3 var(--sans-app);text-transform:uppercase;letter-spacing:.05em;color:var(--pv-ink)}
.plg-card p{min-height:3.6em}.plg-status{font:500 12px/1 var(--sans-app);padding:5px 9px;border-radius:999px;background:var(--pv-surface-2);color:var(--pv-muted)}.plg-status[data-status=installed]{background:var(--pv-accent-tint);color:var(--pv-accent-ink,var(--pv-accent))}
.plg-placeholder{padding:22px;border:1px dashed var(--pv-line-2,var(--pv-line));border-radius:14px;color:var(--pv-muted)}.plg-placeholder strong{display:block;margin-bottom:6px;color:var(--pv-ink)}.plg-placeholder p{margin:0;font-size:13.5px;line-height:1.5}

/* 24. The Project rail inside area sidebars: the same tiles, stacked and compact */
.ws-rail{display:grid;gap:8px;margin:0 0 18px}
.ws-sidebar .ov-areas{display:grid;grid-template-columns:1fr;gap:8px;margin:0}
.ws-sidebar .ov-area{display:grid;grid-template-columns:1fr;grid-template-areas:"top" "facts" "now";gap:3px;min-height:0;padding:12px 14px 30px}
.ws-sidebar .ov-area-top{grid-area:top;flex-direction:row;align-items:baseline;justify-content:space-between}.ws-sidebar .ov-area-top strong{font-size:15px}.ws-sidebar .ov-area-top b{font-size:12px}
.ws-sidebar .ov-area-facts{grid-area:facts;align-self:auto;font-size:12px}.ws-sidebar .ov-area-now{grid-area:now;font-size:12px}
.ws-sidebar .ov-area-go{right:14px;bottom:10px;font-size:12px}
.ws-sidebar .ov-rail-report{margin-top:2px}.ws-sidebar .ov-report{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%}.ws-sidebar .ov-report .ov-icon-square{width:18px;height:18px}.ws-sidebar .ov-rail-report .ov-small{margin:6px 0 0;font-size:12px}
@media(max-width:850px){.ws-rail{display:none}}
/* 25. Project status as a horizontal track with hover details */
.ov-phase-track{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:6px 0 4px;padding:6px 0 2px}
.ov-phase-track::before{content:'';position:absolute;left:12%;right:12%;top:19px;height:2px;background:var(--pv-line);border-radius:2px}
.ov-phase-node{position:relative;display:flex;justify-content:center}
.ov-phase-btn{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0;padding:0 4px 6px;border:0;background:transparent;color:var(--pv-ink);cursor:pointer;border-radius:8px}.ov-phase-btn:hover,.ov-phase-btn:focus-visible{background:var(--pv-surface-2)}
.ov-phase-btn .ov-phase-dot{width:14px;height:14px;border-radius:50%;margin:5px 0 2px;box-shadow:0 0 0 4px var(--pv-surface)}.ov-phase-btn[data-state=pending] .ov-phase-dot{background:var(--pv-surface);border:2px solid var(--pv-line-2,var(--pv-line))}
.ov-phase-btn b{font:600 18px/1 var(--sans-app);font-variant-numeric:tabular-nums}.ov-phase-btn span{font:500 12px/1.2 var(--sans-app);color:var(--pv-muted)}
.ov-phase-pop{position:absolute;left:50%;top:calc(100% + 4px);z-index:5;width:200px;transform:translateX(-50%);padding:10px 12px;border:1px solid var(--pv-line);border-radius:10px;background:var(--pv-surface);box-shadow:var(--pv-shadow);text-align:left;opacity:0;visibility:hidden;transition:opacity .12s ease}
.ov-phase-node:hover .ov-phase-pop,.ov-phase-node:focus-within .ov-phase-pop{opacity:1;visibility:visible}
.ov-phase-pop strong{display:block;font:600 13px/1.3 var(--sans-app);color:var(--pv-ink)}.ov-phase-pop p{margin:4px 0;font:400 12.5px/1.4 var(--sans-app);color:var(--pv-ink-2)}.ov-phase-pop small{font:500 11.5px/1.3 var(--sans-app);color:var(--pv-muted)}
.ov-phase-node:first-child .ov-phase-pop{left:0;transform:none}.ov-phase-node:last-child .ov-phase-pop{left:auto;right:0;transform:none}

/* 26. Area tiles (Overview rail and area sidebars): icon · title · count on one row, details under the icon, compact */
.ov-rail .ov-area,.ws-sidebar .ov-area,body.project-pane-open #project-overview .ov-area{display:grid;grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:"title count icon" "facts facts facts" "now now go";column-gap:10px;row-gap:3px;align-items:center;min-height:0;padding:10px 12px 10px}
.ov-area-icon{grid-area:icon;display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--pv-accent-tint);color:var(--pv-accent-ink,var(--pv-accent))}.ov-area-icon svg{width:17px;height:17px}
.ov-rail .ov-area-top,.ws-sidebar .ov-area-top,body.project-pane-open #project-overview .ov-area-top{display:contents}
.ov-rail .ov-area-top strong,.ws-sidebar .ov-area-top strong{grid-area:title;font-size:15px;font-weight:600}
.ov-rail .ov-area-top b,.ws-sidebar .ov-area-top b{grid-area:count;margin-left:18px;margin-right:2px;font-size:12px;color:var(--pv-muted);white-space:nowrap}
.ov-rail .ov-area-facts,.ws-sidebar .ov-area-facts{grid-area:facts;align-self:auto;margin-top:2px;font-size:12px}
.ov-rail .ov-area-now,.ws-sidebar .ov-area-now{grid-area:now;font-size:12px}
.ov-rail .ov-area-go,.ws-sidebar .ov-area-go{grid-area:go;position:static;justify-self:end;font-size:12px}
.ov-rail .ov-areas,.ws-sidebar .ov-areas{gap:8px;margin:0 0 14px}
/* Narrow screens: the Overview view tabs scroll, the calendar card tools wrap */
.ov-view-tabs{overflow-x:auto;scrollbar-width:none}.ov-view-tabs button{flex:none;white-space:nowrap}

/* 27. Workflow map on the Protocol page */
.rw-map-host{margin-top:26px}.rw-map-loading{color:var(--pv-muted);font-size:13px}
.rw-map{display:grid;gap:14px;padding:20px 22px 18px;border:1px solid var(--pv-line);border-radius:16px;background:var(--pv-surface)}
.rw-map-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}.rw-map-head h2{margin:0;font:600 20px/1.2 var(--sans-app);color:var(--pv-ink)}.rw-map-head p{margin:4px 0 0;font-size:13px;color:var(--pv-muted)}
.rw-map-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.rw-map-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.rw-map-tools select{padding:8px 10px;border:1px solid var(--pv-line);border-radius:10px;background:var(--pv-surface);font:inherit}
.rw-map-progress{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--pv-ink-2)}.rw-map-bar{flex:1 1 180px;height:6px;border-radius:999px;background:var(--pv-surface-2);overflow:hidden}.rw-map-bar i{display:block;height:100%;background:var(--pv-accent);border-radius:999px;transition:width .4s ease}
.rw-map-scroll{overflow-x:auto;padding:6px 2px 10px;scrollbar-width:thin}.rw-map-lanes{display:flex;align-items:stretch;gap:0;min-width:max-content}
.rw-map-lane{position:relative;display:grid;gap:10px;align-content:start;padding:0 26px 0 0;margin-right:26px}
.rw-map-lane:not(:last-child)::after{content:'';position:absolute;right:0;top:34px;width:26px;height:2px;background:var(--pv-line);border-radius:2px}.rw-map-lane:not(:last-child)::before{content:'';position:absolute;right:-5px;top:30px;width:0;height:0;border-left:7px solid var(--pv-line);border-top:5px solid transparent;border-bottom:5px solid transparent}
.rw-map-node{position:relative;display:grid;gap:4px;width:224px;padding:12px 14px 12px 40px;border:1px solid var(--pv-line);border-radius:12px;background:var(--pv-surface);color:var(--pv-ink);text-align:left;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease}.rw-map-node:hover{border-color:var(--pv-accent);box-shadow:var(--pv-shadow)}
.rw-map-index{position:absolute;left:12px;top:12px;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--pv-surface-2);font:600 11px/1 var(--sans-app);color:var(--pv-muted)}
.rw-map-type{font:500 10.5px/1 var(--sans-app);letter-spacing:.06em;text-transform:uppercase;color:var(--pv-muted)}.rw-map-node strong{font:600 14px/1.3 var(--sans-app)}
.rw-map-state{display:inline-flex;align-items:center;gap:6px;font:500 12px/1.2 var(--sans-app);color:var(--pv-muted)}.rw-map-state i{width:8px;height:8px;border-radius:50%;background:var(--pv-line-2,var(--pv-line))}
.rw-map-node[data-status=completed]{border-color:var(--pv-accent-tint)}.rw-map-node[data-status=completed] .rw-map-index{background:var(--pv-accent);color:var(--pv-on-accent)}.rw-map-node[data-status=completed] .rw-map-state i{background:var(--pv-accent)}
.rw-map-node[data-status=running]{border-color:var(--pv-live);box-shadow:inset 0 0 0 1px var(--pv-live)}.rw-map-node[data-status=running] .rw-map-state{color:var(--pv-info)}.rw-map-node[data-status=running] .rw-map-state i{background:var(--pv-live);animation:rw-map-pulse 1.6s ease-in-out infinite}
.rw-map-node[data-status=ready] .rw-map-state i{background:var(--pv-ok,#3a8d5c)}.rw-map-node[data-status=failed] .rw-map-state i{background:var(--pv-warn)}.rw-map-node[data-status=pending],.rw-map-node[data-status=blocked]{opacity:.8}
@keyframes rw-map-pulse{0%,100%{box-shadow:0 0 0 0 var(--pv-live-tint)}50%{box-shadow:0 0 0 5px transparent}}
.rw-map-who{display:inline-flex;align-items:center;gap:6px;font:500 12px/1.2 var(--sans-app);color:var(--pv-ink-2)}.rw-map-who .chat-avatar{width:20px;height:20px;font-size:9px}.rw-map-who em{font-style:normal;color:var(--pv-muted)}.rw-map-node small{font-size:11.5px;color:var(--pv-muted)}
.rw-map-people h3{margin:0 0 8px;font:600 13px/1.3 var(--sans-app);text-transform:uppercase;letter-spacing:.05em;color:var(--pv-ink)}.rw-map-people ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px}
.rw-map-people li{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--pv-line);border-radius:10px}.rw-map-person{display:flex;flex-direction:column;gap:2px;min-width:0}.rw-map-person strong{font:600 13px/1.3 var(--sans-app)}.rw-map-person small{font-size:12px;color:var(--pv-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rw-map-live{margin-left:auto;font:600 10.5px/1 var(--sans-app);color:var(--pv-accent-ink);text-transform:uppercase;letter-spacing:.05em}.rw-map-people .chat-avatar[data-online=true]{box-shadow:0 0 0 2px var(--pv-surface),0 0 0 4px var(--pv-accent)}
.rw-map-empty{display:grid;gap:12px}.rw-map-empty strong{font:600 15px/1.3 var(--sans-app)}.rw-map-empty p{margin:0;font-size:13px;color:var(--pv-muted)}.rw-map-saved{display:grid;gap:8px}
.rw-map-error{color:var(--pv-warn)}
@media(max-width:620px){.rw-map{padding:16px}.rw-map-node{width:200px}}

/* 28. Diligence area */
.dg-page{display:grid;gap:22px}.dg-head h1{margin:0;font:600 28px/1.15 var(--sans-app);color:var(--pv-ink)}.dg-head p{margin:6px 0 0;font-size:14px;color:var(--pv-muted)}
.dg-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:22px 24px;border:1px solid var(--pv-line);border-radius:16px;background:var(--pv-surface)}.dg-hero-copy{flex:1 1 420px;min-width:0}.dg-hero h2{margin:0 0 8px;font:600 19px/1.3 var(--sans-app);color:var(--pv-ink)}.dg-hero p{margin:0;font-size:14px;line-height:1.55;color:var(--pv-ink-2)}
.dg-start{height:48px;padding:0 22px;font-size:15px}
.dg-state{display:flex;align-items:center;gap:12px;padding:12px 16px;border:1px solid var(--pv-line);border-radius:12px;background:var(--pv-surface-2);font-size:14px;color:var(--pv-ink-2)}.dg-state-dot{width:10px;height:10px;border-radius:50%;background:var(--pv-muted);flex:none}
.dg-scope h3,.dg-checks h3{margin:0 0 10px;font:600 13px/1.3 var(--sans-app);text-transform:uppercase;letter-spacing:.05em;color:var(--pv-ink)}
.dg-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}.dg-stat{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border:1px solid var(--pv-line);border-radius:12px;background:var(--pv-surface)}.dg-stat strong{font:600 22px/1 var(--sans-app);color:var(--pv-ink)}.dg-stat small{font-size:12.5px;color:var(--pv-muted)}
.dg-check-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}.dg-check{display:grid;gap:6px;padding:14px 16px;border:1px solid var(--pv-line);border-radius:12px;background:var(--pv-surface)}.dg-check h4{margin:0;font:600 14.5px/1.3 var(--sans-app);color:var(--pv-ink)}.dg-check p{margin:0;font-size:13px;line-height:1.5;color:var(--pv-ink-2)}
.dg-type{justify-self:start;font:600 10.5px/1 var(--sans-app);letter-spacing:.08em;padding:4px 8px;border-radius:999px;background:var(--pv-accent-tint);color:var(--pv-accent-ink,var(--pv-accent))}.dg-type[data-type=BIOSECURITY]{background:var(--pv-warn-tint);color:var(--pv-warn)}
.dg-provider{font-size:12px;color:var(--pv-muted)}.dg-muted{margin:10px 0 0;font-size:12.5px;color:var(--pv-muted)}
.dg-empty{padding:22px;border:1px dashed var(--pv-line);border-radius:14px}.dg-empty strong{display:block;margin-bottom:6px;font:600 15px/1.3 var(--sans-app);color:var(--pv-ink)}.dg-empty p{margin:0 0 10px;font-size:13.5px;line-height:1.5;color:var(--pv-muted)}
.dg-profile dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:8px 18px;margin:12px 0 0}.dg-profile dl>div{padding:10px 0;border-top:1px solid var(--pv-line)}.dg-profile dt{font-size:12px;color:var(--pv-muted)}.dg-profile dd{margin:3px 0 0;font-size:13.5px;color:var(--pv-ink)}