/* Shared operational workspace: compact controls, tabular records and contextual guidance. */
/* Control boundaries and focus indicators keep at least 3:1 contrast on light and dark surfaces. */

body{background:var(--canvas);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:var(--text-md)}
input,select,textarea,button{font:inherit}input,select,textarea{border-radius:7px;min-height:36px;padding:8px 10px}button,.button{border-radius:7px;padding:8px 13px;font-size:var(--text-sm);min-height:36px;transition:background-color .12s}button:hover:not(:disabled){background:var(--surface-mint)}button.primary{background:var(--green);color:white;border-color:var(--green)}button.primary:hover:not(:disabled){background:var(--green-deep)}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}#workspace-navigation :focus-visible{outline-color:var(--focus-ring-on-dark)}
#workspace{max-width:none;padding:0 28px 28px;margin-left:232px}#workspace-navigation{width:232px;background:var(--text-forest);padding:24px 14px 14px;display:flex;flex-direction:column;height:100dvh}#primary-navigation{display:flex;flex-direction:column;flex:1;min-height:0;gap:4px;padding-bottom:0}#primary-navigation>.navigation-settings{margin-top:auto;border-top:1px solid var(--border-accent);padding-top:12px}.navigation-subgroup{padding:0;margin:0!important}.navigation-subgroup>summary{color:var(--surface-sage)!important;font-weight:600}.navigation-subgroup .navigation-submenu{margin-left:8px}.navigation-group summary{font-size:var(--text-sm)}#primary-navigation>a,.navigation-submenu>a{font-size:var(--text-sm);padding:10px 12px}.navigation-brand{margin-bottom:24px}.workspace-header{padding:18px 0;min-height:80px}.workspace-header #identity{font-size:var(--text-xs)}
body[data-navigation=top] #workspace-navigation{height:auto;width:100%;padding:10px 24px;gap:28px}body[data-navigation=top] #primary-navigation{flex-direction:row;overflow:visible;min-height:auto}body[data-navigation=top] #primary-navigation>.navigation-settings{margin:0 0 0 auto;border:0;padding:0}body[data-navigation=top] .navigation-subgroup{position:static!important}body[data-navigation=top] .navigation-subgroup>.navigation-submenu{position:static;box-shadow:none;border:0;border-left:1px solid var(--border-accent);margin-left:8px;min-width:0;padding:2px 0 4px 8px;background:transparent}body[data-navigation=top] .navigation-settings>.navigation-submenu{left:auto;right:0;max-height:75vh;overflow-y:auto;min-width:270px}body[data-navigation=top] #workspace{margin-left:0}
.page-heading{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 0 0}.page-heading>h1,#workspace-page-heading>h1{font-size:var(--text-3xl);padding-right:0;margin:8px 0;flex:1}.page-heading > #page-description{display:none}#workspace-page-heading>#page-help-control{position:relative}#page-assistance-open{background:white;margin-left:auto;font-size:var(--text-xs)}
/* Page status stays visible below the menu on long pages. When empty it is collapsed visually, not removed, so its live region still announces. */
.message-bar{position:sticky;top:calc(var(--navigation-sticky-height,0px) + 12px);z-index:50;display:flex;align-items:flex-start;gap:12px;margin:10px 0;padding:8px 10px 8px 16px;background:var(--surface-sage);border:1px solid var(--success-border);border-left:4px solid var(--green);border-radius:8px;box-shadow:0 4px 14px var(--shadow);color:var(--ink)}.message-bar.error{background:var(--error-surface);border-color:var(--error-border);border-left-color:var(--error)}.message-bar[data-empty=true]{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;box-shadow:none}#message{flex:1;min-width:0;margin:0;padding:5px 0;font-size:var(--text-md);line-height:1.5;overflow-wrap:anywhere}#message-goto,#message-dismiss{flex:none;min-height:30px;padding:4px 10px;font-size:var(--text-xs);background:transparent}
.card{background:var(--white);border:1px solid var(--line);border-radius:10px;padding:20px;margin:14px 0;box-shadow:0 2px 5px var(--shadow-weak)}.card h2{font-size:var(--text-xl);margin-top:0}.card h3{font-size:var(--text-lg)}.card .section-head{margin-bottom:14px}.card>.context-help{margin-bottom:14px}.section-head button{margin:0}.empty{padding:28px 14px;color:var(--muted);border-radius:8px;background:var(--surface-light)}.work-page-tabs{gap:6px;border:0;margin:16px 0}.work-page-tabs a{background:var(--surface-mist);border:1px solid var(--line);border-radius:7px;padding:8px 13px}.work-page-tabs a[aria-current=page]{background:var(--success-surface);color:var(--green-deep);border-color:var(--success-border)}pre{font-size:var(--text-xs);border-radius:7px;max-height:450px;overflow:auto}.notice{font-size:var(--text-xs);line-height:1.55}.field-help{font-size:var(--text-xs);line-height:1.5}label{font-size:var(--text-sm)}.status-chip{display:inline-flex;padding:3px 8px;border-radius:12px;font-size:var(--text-xs);font-weight:550;background:var(--surface-mist);color:var(--green-deep);white-space:nowrap}.status-chip[data-state=failed],.status-chip[data-state=suspended]{background:var(--surface-cream);color:var(--text-rust)}.status-chip[data-state=archived]{background:var(--border-faint);color:var(--text-steel)}
.workspace-table-bulk .reason-entry{flex:1}.workspace-queue-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr));gap:14px;margin:18px 0}.workspace-queue-card{background:white;border:1px solid var(--line);border-radius:10px;padding:16px;display:flex;gap:6px;flex-direction:column;text-decoration:none}.workspace-queue-card strong{font-size:var(--text-4xl)}.workspace-queue-card span{font-size:var(--text-sm)}.workspace-queue-card small{color:var(--muted);font-size:var(--text-xs)}.workspace-queue-card .workspace-queue-card-title{font-size:var(--text-xl);font-weight:600;line-height:1.3;padding-top:4px}.workspace-queue-card .workspace-queue-card-action{margin-top:auto;padding-top:4px;font-size:var(--text-sm);font-weight:600;color:var(--green)}.workspace-queue-card-action::after{content:" \2192" / ""}
.chat-drawer{display:flex;flex-direction:column}.chat-toolbar,.chat-navigation,.chat-mode-tabs,.chat-status{flex-shrink:0}.chat-body{flex:1;min-height:0}.chat-mode-tabs{display:flex;gap:5px;padding:7px 12px;border-bottom:1px solid var(--line);background:var(--surface-mist)}.chat-mode-tabs button{font-size:var(--text-xs);border:0;background:transparent;min-height:30px;padding:5px 10px}.chat-mode-tabs button[aria-pressed=true]{background:var(--surface-mint);color:var(--green-deep)}.page-assistance{flex:1;display:flex;flex-direction:column;min-height:0;padding:16px;gap:10px}.page-assistance>h3{font-size:var(--text-lg);margin:0}.page-assistance>.field-help{margin:0}.page-help-prompts{display:flex;gap:6px;flex-wrap:wrap}.page-help-prompts button{font-size:var(--text-xs);min-height:30px;padding:5px 9px}.page-help-history{flex:1;min-height:80px;overflow-y:auto;overscroll-behavior:contain}.page-help-question{background:var(--surface-mint);margin:12px 0 12px 22px;padding:10px;border-radius:10px;font-size:var(--text-md);white-space:pre-wrap;overflow-wrap:anywhere}.page-help-answer{background:var(--canvas);border:1px solid var(--line);border-radius:10px;padding:13px;font-size:var(--text-sm);line-height:1.6}.page-help-answer>div{margin-top:12px}.page-help-answer p{margin:4px 0}.page-help-answer small{display:block;margin-top:12px;font-size:var(--text-2xs);color:var(--muted)}.page-help-composer{display:grid;grid-template-columns:1fr auto;gap:7px;align-items:end;border-top:1px solid var(--line);padding-top:12px}.page-help-composer label,.page-help-status{grid-column:1/-1}.page-help-composer textarea{resize:vertical;max-height:180px}.page-help-status{font-size:var(--text-xs);min-height:16px;margin:0;color:var(--muted)}[hidden]{display:none!important}
@media(max-width:900px){#workspace-navigation,body[data-navigation=top] #workspace-navigation{height:auto;width:100%;display:block;padding:14px 18px}.navigation-brand{margin-bottom:0}#primary-navigation,body[data-navigation=top] #primary-navigation{display:none;max-height:70vh;overflow-y:auto}body.navigation-open #primary-navigation,body[data-navigation=top].navigation-open #primary-navigation{display:flex;flex-direction:column}#primary-navigation>.navigation-settings,body[data-navigation=top] #primary-navigation>.navigation-settings{margin:12px 0 0;border-top:1px solid var(--border-accent);padding-top:10px}#workspace,body[data-navigation=top] #workspace{margin:0;padding:0 18px 24px}body[data-navigation=top] .navigation-settings>.navigation-submenu{position:static;min-width:0;max-height:none}.card{padding:15px}.workspace-queue-card{padding:12px}.workspace-queue-card strong{font-size:var(--text-3xl)}}
@media(max-width:550px){.page-heading>h1,#workspace-page-heading>h1{font-size:var(--text-2xl);flex-basis:100%}#page-assistance-open{margin-left:0}.workspace-header #identity{font-size:var(--text-2xs)}.page-help-composer textarea{font-size:var(--text-lg)}.page-assistance{padding:12px}.card h2{font-size:var(--text-xl)}}

#breadcrumbs{flex-basis:100%;width:100%}.work-detail-disclosure{margin:12px 0;border:1px solid var(--line);border-radius:8px;background:var(--surface-light)}.work-detail-disclosure>summary{padding:12px;font-size:var(--text-sm);font-weight:600}.work-detail-disclosure>section.process-work{margin:0;border:0;border-top:1px solid var(--line)}

/* Chat owns reserved page space. Narrow screens switch workspace instead of covering it. */
#workspace{container-type:inline-size;container-name:workspace}
body[data-chat-open=true]{--chat-pane-width:min(420px,32vw)}
body[data-chat-open=true][data-chat-expanded=true]{--chat-pane-width:min(600px,42vw)}
@media(min-width:1101px){
 body[data-chat-open=true] #chat.chat-drawer{top:calc(0px + 12px);bottom:12px;right:12px;left:auto;width:var(--chat-pane-width);height:auto;box-shadow:0 3px 12px var(--shadow-weak);z-index:90}
 body[data-chat-open=true][data-chat-side=right] #workspace{margin-right:calc(var(--chat-pane-width) + 12px)}
 body[data-chat-open=true][data-chat-side=left] #chat.chat-drawer{left:244px;right:auto}
 body[data-chat-open=true][data-chat-side=left] #workspace{margin-left:calc(244px + var(--chat-pane-width))}
 body[data-navigation=top][data-chat-open=true][data-chat-side=left] #chat.chat-drawer{left:12px}
 body[data-navigation=top][data-chat-open=true][data-chat-side=left] #workspace{margin-left:calc(var(--chat-pane-width) + 12px);margin-right:0}
 body[data-navigation=top][data-chat-open=true][data-chat-side=right] #workspace{margin-left:0;margin-right:calc(var(--chat-pane-width) + 12px)}
}
@media(max-width:1100px){
 body[data-chat-open=true] #workspace,body[data-chat-open=true] #workspace-navigation,body[data-chat-open=true]>.skip-link{display:none!important}
 body[data-chat-open=true] #chat.chat-drawer{position:relative;inset:auto;width:100%;height:100dvh;max-height:100dvh;border:0;border-radius:0;box-shadow:none;margin:0}
 body[data-chat-open=true]{overflow:hidden}
}
@container workspace (max-width:700px){
 .workspace-header{flex-direction:column;gap:12px;align-items:stretch}.workspace-header .account-menu{flex:auto;max-width:none;text-align:left;justify-content:flex-start}.workspace-header .account-menu #identity{flex:1 1 auto}
 .workspace-shortcuts{grid-template-columns:1fr}
 .dashboard-flow-grid,.dashboard-distribution-grid,.dashboard-recent-grid{grid-template-columns:minmax(0,1fr)}.dashboard-flow-arrow{transform:rotate(90deg);height:27px;line-height:27px}.dashboard-primary-metric>span:nth-child(2){max-width:none}
 .explorer-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.explorer-toolbar>*{min-width:0;max-width:100%}
 .section-head{flex-wrap:wrap;gap:8px}.card{padding:16px}.card h2{font-size:var(--text-xl)}
 .environment-label{width:100%;min-width:0}
 .page-heading>h1,#workspace-page-heading>h1{font-size:var(--text-2xl)}
}

#page-help-control .help-content{width:30rem;max-height:65vh}#page-help-control #page-description{display:block}.page-control-instruction{padding:.45rem 0;border-bottom:1px solid var(--line,var(--line))}.page-control-instruction summary{font-weight:600;cursor:pointer}.page-control-instruction p{line-height:1.5;margin:.5rem 0}

.resource-binding{margin-block:1rem;padding:1rem;border:1px solid var(--line,var(--line));border-radius:12px;overflow-wrap:anywhere}.resource-binding h4{margin-top:0}.resource-binding .file-set-fields{margin-top:1rem}.resource-binding details p{max-width:80ch}

/* Record identifiers are secondary, copyable detail beneath a readable title. */
.record-id{margin:2px 0 10px;color:var(--muted);font:var(--text-xs)/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;overflow-wrap:anywhere}

/* Readable record view: labelled fields with values as recorded; exact JSON one step away. */
.record-view{display:grid;gap:10px;margin:10px 0;font-size:var(--text-sm);min-width:0}
.record-fields{display:grid;grid-template-columns:minmax(120px,max-content) minmax(0,1fr);gap:4px 16px;margin:0}
.record-fields>dt{color:var(--muted);font-weight:500;overflow-wrap:anywhere}
.record-fields>dd{margin:0;min-width:0;overflow-wrap:anywhere}
.record-list{margin:0;padding-left:20px}
.record-list>li{margin:2px 0}
.record-list>li>.record-fields{padding:6px 0;border-bottom:1px solid var(--line)}
.record-fields>dd>.record-fields{padding-left:10px;border-left:2px solid var(--line)}
.record-section{margin:0}
.record-section>summary{color:var(--green);font-size:var(--text-xs);cursor:pointer}
.record-section>:not(summary){margin-top:6px;padding-left:10px;border-left:2px solid var(--line)}
.record-token{font:var(--text-xs)/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;overflow-wrap:anywhere}
.record-empty{color:var(--muted);font-style:italic}
.record-text{margin:0;white-space:pre-wrap;font:var(--text-xs)/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;max-height:320px;overflow:auto}
.record-exact{margin:0}
.record-exact>summary{font-size:var(--text-xs);color:var(--muted);cursor:pointer}
@container workspace (max-width:700px){.record-fields{grid-template-columns:minmax(0,1fr);gap:2px}.record-fields>dd{margin-bottom:8px}}

/* Account menu: personal pages under the signed-in name; Sign out stays visible beside it. */
.workspace-header .account-menu{flex:0 1 auto;flex-wrap:nowrap;max-width:none;align-items:center;gap:8px}
.account-disclosure{position:relative;min-width:0;margin:0}
.account-menu>#logout{flex:none;white-space:nowrap}
.account-disclosure>summary{display:flex;align-items:center;gap:6px;min-height:36px;max-width:340px;padding:6px 10px;border:1px solid var(--line);border-radius:7px;background:var(--white);cursor:pointer;list-style:none}
.account-disclosure>summary::-webkit-details-marker{display:none}
.account-disclosure>summary::after{content:"\25BE" / "";color:var(--muted);font-size:var(--text-2xs)}
.account-disclosure #identity{flex:1 1 auto;min-width:0;font-size:var(--text-xs);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#account-navigation{position:absolute;right:0;top:calc(100% + 6px);z-index:120;display:grid;gap:2px;text-align:left;min-width:200px;padding:6px;background:var(--white);border:1px solid var(--line);border-radius:9px;box-shadow:0 8px 24px var(--shadow)}
#account-navigation a{padding:9px 12px;border-radius:6px;color:var(--ink);font-size:var(--text-sm);text-decoration:none}
#account-navigation a:hover,#account-navigation a[aria-current=page]{background:var(--surface-mint)}
@container workspace (max-width:700px){.account-disclosure{flex:1 1 auto}.account-disclosure>summary{max-width:none}#account-navigation{left:0;right:auto}}
@container workspace (max-width:480px){.workspace-queue-cards{grid-template-columns:minmax(0,1fr)}}
/* Top bar: the brand sits on the same centre line as the menu entries. */
body[data-navigation=top] .navigation-brand{margin-bottom:0}
body[data-navigation=top] .navigation-brand .brand{line-height:1}
.overview-start #overview-start-title{flex:1 1 320px}.overview-start label[for=overview-start-question]{flex-basis:100%}.overview-recent{list-style:none;margin:0;padding:0}.overview-recent li{padding:8px 0;border-top:1px solid var(--line)}.overview-recent small{color:var(--muted)}

/* A control that needs action (docs/implementation/2026-10-13-errors-point-to-field.md): outline and surface
   from the tokens, an icon and the words Error/Warning in the inline message, so colour is never the only cue. */
[data-point]{outline:3px solid var(--error);outline-offset:2px;scroll-margin:96px 0}
[data-point=warning]{outline-color:var(--warning)}
input[data-point=error],select[data-point=error],textarea[data-point=error]{background-color:var(--error-surface)}
input[data-point=warning],select[data-point=warning],textarea[data-point=warning]{background-color:var(--warning-surface)}
.point-note{display:flex;align-items:flex-start;gap:6px;flex-basis:100%;grid-column:1/-1;margin:6px 0;padding:6px 10px;border-left:4px solid var(--error);border-radius:4px;background:var(--error-surface);color:var(--ink);font-size:var(--font-label);line-height:1.45;overflow-wrap:anywhere}
.point-note[data-severity=warning]{border-left-color:var(--warning);background:var(--warning-surface)}
.point-icon{flex:none;display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--error);color:var(--white);font-size:var(--text-xs);font-weight:700;line-height:1}
.point-note[data-severity=warning] .point-icon{border-radius:3px;background:var(--warning)}
.show-me{margin-left:8px}
@media(prefers-reduced-motion:reduce){[data-point]{scroll-behavior:auto}}
/* Radios and checkboxes keep their own size; the control height is for text fields and lists (22 October 2026). */
input[type=radio],input[type=checkbox]{min-height:0;padding:0}
/* In a narrow workspace the header stacks: Find a page keeps its own height instead of growing to its flex width. */
@container workspace (max-width:700px){.workspace-header>.page-search-open{flex:0 0 auto;width:100%}}
