/* Components inherit the approved typography, grid and native Kai family. */
.wf {font:var(--type-body)/1.65 var(--font-native-kai);color:var(--ink,#171715);min-width:0;overflow-wrap:anywhere;}
.wf[hidden]{display:none!important}
#loginScreen [hidden]{display:none!important}
#loginScreen .field select{width:100%;min-height:var(--control-min);padding:.7em;border:1px solid var(--line,#bbb);background:transparent;color:inherit;font:var(--type-body)/1.5 var(--font-native-kai);border-radius:0;box-sizing:border-box}
#loginScreen input[readonly]{opacity:.8}
.wf h1,.wf h2,.wf h3{font-family:inherit;letter-spacing:normal;line-height:1.4;color:inherit}
.wf h1{font-size:var(--type-title-1)}.wf h2{font-size:var(--type-title-2)}.wf h3{font-size:var(--type-title-3)}
.wf p{max-width:65ch;white-space:pre-wrap}.wf .wf-meta{font-size:var(--type-subhead);opacity:.86}
.wf button,.wf .wf-button,.wf input,.wf select,.wf textarea,#wfProject,.wf-logout{font:inherit;color:inherit;max-width:100%;min-width:0;box-sizing:border-box;border:1px solid currentColor;border-radius:0;background:transparent;min-height:var(--control-min);padding:.5em .75em;}
.wf button,.wf .wf-button,.wf-logout{cursor:pointer;white-space:normal;text-decoration:none;text-align:center}
.wf button:disabled{opacity:.55;cursor:wait}.wf button:focus-visible,.wf input:focus-visible,.wf select:focus-visible,.wf textarea:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.wf .wf-actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-block:var(--space-6)}
.wf .wf-record{display:flex;justify-content:space-between;align-items:center;gap:var(--space-6);padding-block:var(--space-6);border-bottom:1px solid color-mix(in srgb,currentColor 25%,transparent)}
.wf-record>div{min-width:0}.wf-record h3,.wf-record p{margin:.3em 0}.wf-record>button{flex-shrink:0}
.wf .wf-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));gap:var(--space-6);}
.wf-form label,.wf-search{display:flex;flex-direction:column;gap:.35em;min-width:0}.wf-wide{grid-column:1/-1}.wf-form textarea{resize:vertical;width:100%;line-height:1.65}.wf-form input,.wf-form select{width:100%}
.wf fieldset{min-width:0;margin:0;padding:var(--space-4);border:1px solid color-mix(in srgb,currentColor 35%,transparent)}
.wf .wf-attachments{max-height:12rem;overflow:auto}.wf [type=checkbox]{width:1.2em;min-height:1.2em;flex-shrink:0}.wf-attachments label,.wf fieldset>label{display:flex;flex-direction:row;align-items:center;padding:.35em 0;gap:.6em}.wf fieldset>label:has([type=file]){flex-direction:column;align-items:stretch}
.wf .wf-error{color:#9c2626;white-space:pre-wrap}.wf .wf-error:empty{display:none}.wf .wf-empty{padding-block:2em}
.wf .wf-ledger{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));gap:var(--space-6);margin-block:var(--space-8)}.wf-ledger span,.wf-ledger strong{display:block}.wf-ledger strong{font-size:var(--type-title-2);font-variant-numeric:tabular-nums}
.wf-dialog{color-scheme:light;width:min(52rem,calc(100% - 2rem));max-height:calc(100dvh - 2rem);padding:var(--space-6);border:1px solid currentColor;background:#fff;overflow:auto;overscroll-behavior:contain;box-sizing:border-box}.wf-dialog::backdrop{background:rgb(0 0 0 / .55)}.wf-dialog-head{display:flex;justify-content:flex-end;position:sticky;top:0;z-index:1;background:inherit}.wf-dialog a{color:inherit}.wf-detail{margin-block:1.5em}.wf-detail dt{margin-top:1em;font-weight:600}.wf-detail dd{margin:.2em 0;white-space:pre-wrap}
#wfProject{font:var(--type-body)/1.5 var(--font-native-kai);width:100%;margin-top:1em}#workflowHome{margin-bottom:var(--space-8)}.wf-logout{font:var(--type-subhead)/1.5 var(--font-native-kai)}
[data-theme=dark] .wf-dialog{color-scheme:dark;background:#181818;color:#f5f3ee}[data-theme=dark] .wf-error{color:#ffb7b7}
@media(max-width:37.5em){.wf-record{flex-direction:column;align-items:stretch!important}.wf-record>button{align-self:flex-start}.wf-dialog{color-scheme:light;width:calc(100% - 1rem);padding:var(--space-4)}.wf-actions>button{flex:1 1 10rem}}
/* Geometry stays square while text, targets and parent columns reflow. */
.wf .wf-calendar{margin-block:var(--space-8);max-width:42rem}
.wf .wf-calendar-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem}
.wf .wf-calendar-grid{display:grid;font-size:var(--type-subhead);grid-template-columns:repeat(7,minmax(max(44px,2em),1fr));gap:.2rem;text-align:center;overflow-x:auto;scrollbar-width:thin}
.wf .wf-calendar-grid>span{font-size:var(--type-subhead);padding:.3em 0}
.wf .wf-day{display:grid;place-items:center;min-width:0;width:100%;border:0;padding:.2em 0;min-height:var(--control-min);line-height:1;font-size:var(--type-subhead)}
.wf .wf-day span{display:grid;place-items:center;inline-size:2em;block-size:2em;aspect-ratio:1;flex:none;border-radius:50%;line-height:1;box-sizing:border-box;background:transparent}
.wf .wf-day.has-log span{background:var(--ink);color:var(--paper,#fff)}
.wf .wf-day[aria-pressed=true] span{outline:2px solid var(--ink);outline-offset:2px}
.wf .wf-day:disabled{cursor:default;opacity:.65}
.wf .wf-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));gap:var(--space-6);margin-block:var(--space-8)}
.wf .wf-metric{display:flex;align-items:center;flex-wrap:wrap;gap:1rem;border-block:1px solid var(--line,#ccc);padding-block:1rem}
.wf .wf-ring{--ring-size:5.5em;position:relative;isolation:isolate;display:grid;place-items:center;inline-size:var(--ring-size);block-size:var(--ring-size);flex:0 0 var(--ring-size);aspect-ratio:1;border-radius:50%;background:conic-gradient(var(--ink) var(--arc,0%),var(--line,#ddd) 0)}
.wf .wf-ring:before{content:'';position:absolute;inset:.5em;background:var(--paper,#fff);border-radius:50%;z-index:-1}
.wf .wf-ring strong{font-size:1.2em;line-height:1.2;white-space:nowrap}
.wf .wf-metric p{margin:.25em 0}.wf .wf-metric>div:last-child{flex:1 1 8em;min-width:0}
.wf .wf-photo-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr));gap:1rem}
.wf .wf-photo-list img{width:100%;height:9rem;object-fit:cover}.wf .wf-photo-list label{display:block;overflow-wrap:anywhere}
.wf .wf-preview{width:min(100%,22rem);height:auto;display:block}
.home-story-card{border:0;padding:0;min-width:0}
#toast:empty{display:none}
@media(max-width:40em){.topbar .user{flex-wrap:wrap}.wf .wf-calendar-grid{gap:0}.wf .wf-day span{inline-size:1.65em;block-size:1.65em}.wf .wf-calendar{max-width:100%}}
#themeMenu:not(.open){visibility:hidden;pointer-events:none}
#themeMenu.open{visibility:visible}
/* Project cards and workspaces share the existing spacing and native type roles. */
.wf-workspace-switch{font:var(--type-subhead)/1.4 var(--font-native-kai);background:transparent;color:inherit;border:1px solid currentColor;padding:.5em .7em;min-height:var(--control-min);white-space:normal;max-width:100%;cursor:pointer}
.wf-workspace-switch[hidden],.project-select[hidden]{display:none!important}
.wf-workspace-context{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-4);border-bottom:1px solid var(--line);padding-bottom:var(--space-4);margin-bottom:var(--space-6)}
.wf .wf-project-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));gap:var(--space-6)}
.wf .wf-project-card{display:flex;flex-direction:column;min-width:0;border:1px solid var(--line);padding:var(--space-4);overflow-wrap:anywhere}
.wf .wf-project-card h2,.wf .wf-project-card h3{font-size:var(--type-title-3);margin:.3em 0}.wf .wf-project-card p{margin:.3em 0}
.wf .wf-project-card dl{display:grid;grid-template-columns:5em minmax(0,1fr);gap:.5em;margin:1em 0}.wf .wf-project-card dd{margin:0;min-width:0}.wf .wf-project-card dt{opacity:.8}
.wf .wf-project-card .wf-actions{margin-top:auto;padding-top:1em;margin-bottom:0}
.wf .wf-project-filters{display:flex;flex-wrap:wrap;gap:var(--space-4);margin-block:var(--space-6)}.wf-project-filters label{display:grid;gap:.4em;flex:1 1 14rem;min-width:0}.wf-project-filters input,.wf-project-filters select{width:100%}
@container(max-width:15em){.wf .wf-project-card dl{grid-template-columns:1fr;gap:.2em}.wf .wf-project-card dd{margin-bottom:.6em}}

.topbar .user{max-width:100%;min-width:0;flex-wrap:wrap}
.nav [data-workspace-page][aria-current=page]{background:var(--ink);color:var(--paper,#fff)}

.wf .wf-project-card{container-type:inline-size}
.wf-workspace-counts{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-block:var(--space-6)}
.wf-workspace-counts>button{flex:1 1 5em}
.wf-workspace-counts [data-workspace-page]{flex-basis:100%}

.wf [data-grant-secret][hidden]{display:none!important}
.wf-integration-page .portal-page-head{display:block}
.wf-integration-page .portal-page-head h1{max-width:none}
.wf-detail dd{white-space:pre-wrap;overflow-wrap:anywhere}

/* Three work areas share navigation, with project duties separate from administration. */
.wf-workspace-identity{display:grid;gap:.3rem;min-width:0;flex:1 1 12rem;overflow-wrap:anywhere}
.wf-workspace-identity span{font-size:var(--type-subhead);line-height:1.5}
.wf-workspace-context .wf-workspace-switch{margin-inline-start:auto;flex:0 1 auto}
.wf-nav-group{margin-block:1rem}
.wf-nav-group-title{margin:.6rem 0 .3rem;font:500 var(--type-subhead)/1.5 var(--font-native-kai);color:var(--mono-secondary)}
.nav button[aria-current=page]{background:var(--ink);color:var(--paper,#fff)}
.wf-project-role{font-size:var(--type-subhead)}
.wf-form [data-capabilities][hidden]{display:none!important}
/* Every navigation action uses the same readable row, including administration. */
#nav .wf-nav-group{display:grid;min-width:0}
#nav button{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.75rem;width:100%;min-height:var(--menu-row-min);height:auto!important;padding:var(--menu-row-padding) 0!important;font-size:var(--type-menu)!important;line-height:1.4!important;white-space:normal;text-align:left;overflow-wrap:anywhere;background:transparent!important;color:var(--ink)!important}
#nav button[aria-current=page]{background:var(--ink)!important;color:var(--paper)!important;padding-inline:.5rem!important}
#nav button[aria-current=page]::after{color:inherit}

/* Project identity remains primary; the process view groups the same cards vertically. */
.wf-project-view-controls{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-4);margin-top:var(--space-6)}
.wf-project-view-controls>[role=group]{display:flex;flex-wrap:wrap;gap:var(--space-3);min-width:0}
.wf-project-view-controls button[aria-pressed=true]{background:var(--ink);color:var(--paper,#fff)}
.wf-project-stages{display:grid;gap:var(--space-8);min-width:0}
.wf-project-stage-group{min-width:0}
.wf-project-stage-group>header{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:var(--space-3);border-top:1px solid var(--line);padding-top:var(--space-4);margin-bottom:var(--space-4)}
.wf-project-stage-group>header h2{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:baseline;min-width:0;margin:0}
.wf-project-stage-group>header p{margin:0}
.wf-stage-number{font-size:var(--type-subhead);font-variant-numeric:tabular-nums;opacity:.7}

#workflowHome section[aria-labelledby=projectContentsTitle],#workflowHome .wf-home-diary{margin-block:var(--space-8);padding-top:var(--space-6);border-top:1px solid var(--line)}
#workflowHome section[aria-labelledby=projectContentsTitle]>h2,#workflowHome .wf-home-diary>h2{margin-top:0}

/* Names and audit records use the existing readable type scale and wrap on narrow screens. */
.wf .wf-provenance{font-size:var(--type-caption);line-height:1.6;margin:.5em 0;overflow-wrap:anywhere}
.wf .wf-name-note{color:var(--muted);font-size:1em}
.wf .wf-provenance-detail{padding-block:var(--space-4);border-block:1px solid var(--line);margin-block:var(--space-4)}
.wf .wf-audit-event{padding-block:var(--space-4);border-bottom:1px solid var(--line);min-width:0;overflow-wrap:anywhere}
.wf .wf-audit-event h3{font-size:var(--type-subhead);margin:.4em 0}
.wf .wf-audit-event p{margin:.35em 0;white-space:pre-wrap}
.wf .wf-audit-entity{font-weight:600}
.wf [data-project-history]{max-width:64rem}
.wf .wf-provenance-detail{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:.65em 1em;align-items:start}
.wf .wf-provenance-detail dt,.wf .wf-provenance-detail dd{margin:0;overflow-wrap:anywhere}

/* Report websites keep the approved dialog and gain only a safe reading canvas. */
.wf .wf-report-frame{display:block;width:100%;height:70vh;min-height:20rem;border:1px solid var(--line);background:#fff;box-sizing:border-box}
.wf-dialog:has(.wf-report-frame){width:min(80rem,calc(100% - 2rem))}
.wf-record .wf-actions{margin:0;justify-content:flex-end}
.wf-message-list{display:grid;gap:var(--space-4);margin-top:var(--space-6);max-width:64rem}
.wf .wf-message-body{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.75}
.wf details code{overflow-wrap:anywhere;word-break:break-all}
@media(max-width:37.5em){.wf .wf-report-frame{height:65vh;min-height:16rem}.wf-dialog:has(.wf-report-frame){width:calc(100% - 1rem)}.wf-record .wf-actions{justify-content:flex-start}}
