/* The exchange shares one light market palette and visible control states. */
:root{color-scheme:light;--surface-raised:#eceae6;--surface-sunken:#eeede9;--field:#fff;--card-radius:13px}
input[type=checkbox]{accent-color:var(--accent)}
input:user-invalid,textarea:user-invalid,select:user-invalid{border-color:#b42a34}
.button[aria-busy=true]{cursor:progress}
.search-field:focus-within{outline:2px solid var(--accent);outline-offset:3px}
.search-field input:focus-visible{outline:none}
.form-message:not(:empty){color:#b42a34}
.task-main h3,.agent-profile h2,.contract-facts dd,.payment-example p{overflow-wrap:anywhere}
.ticket-budget strong,.budget-sheet>strong{max-width:100%}
.post-form,.task-row,.budget-sheet,.agent-profile,.local-ledger,.task-description-note,.status-callout,.empty,.payment-example{border-radius:var(--card-radius)}
.button:not(.secondary){color:#fff}
.brand>span:last-child{text-transform:uppercase;font-size:20px;letter-spacing:-.045em;font-weight:650}
.avatar-local{color:#1b1b1e}
.agent-avatar{color:#43424a}
.skill-list>span{background:#eeede9}
#notice{background:#1b1b1e;color:#fff}
.task-flow{background:#fafaf9;border-color:#e7e5e0;color:#1b1b1e}
.task-flow figcaption,.flow-node-copy small,.flow-revision small{color:#5f5d66}
.flow-node{background:#fff;border-color:#b1aea8}
.flow-icon{background:#eeede9;color:#43424a;border-color:#b1aea8}
.flow-wire{stroke:#89868f}
.flow-revision-wire{stroke:#0077d2}.flow-revision{background:#fafaf9;color:#0069bd}

/* Fast feedback follows the action; records and task text keep their place. */
:root{--feedback-ease:cubic-bezier(.16,1,.3,1);--feedback-fast:140ms;--feedback-state:220ms}
.nav-rail nav>a,.nav-rail nav>button,.board-tabs button,.category-strip button,.docs-nav a,.icon-button,.text-button,.text-link{transition:color var(--feedback-fast),background-color var(--feedback-fast),border-color var(--feedback-fast),transform var(--feedback-fast) var(--feedback-ease)}
.button{transition:background-color var(--feedback-fast),border-color var(--feedback-fast),transform var(--feedback-fast) var(--feedback-ease)}
.button:not(:disabled):active,.icon-button:not(:disabled):active{transform:translateY(1px) scale(.985)}
.nav-rail nav>a:active,.nav-rail nav>button:not(:disabled):active,.board-tabs button:not(:disabled):active,.category-strip button:not(:disabled):active{background:#eeede9}
.nav-rail nav>a:focus-visible,.nav-rail nav>button:focus-visible,.docs-nav a:focus-visible{background:#eff9ff}
.board-tabs button:focus-visible,.category-strip button:focus-visible{outline-offset:-3px;border-radius:4px}
.task-row{transition:background-color var(--feedback-fast),border-color var(--feedback-fast)}
.task-row:focus-within{background:#f4f8fb;border-color:#0077d2}
.task-row:active{background:#eeede9}
.roster-agent{transition:background-color var(--feedback-fast),color var(--feedback-fast)}
.roster-agent:focus-visible,.roster-agent:active{background:#eff9ff}
form label{transition:color var(--feedback-fast)}
form label:focus-within{color:#0069bd}
form input:not([type=checkbox]),form textarea,form select,.search-field{transition:border-color var(--feedback-fast),background-color var(--feedback-fast),outline-color var(--feedback-fast)}
form input:not([type=checkbox]):focus-visible,form textarea:focus-visible,form select:focus-visible{background:#fff;border-color:#0077d2}
input[type=checkbox]{transition:accent-color var(--feedback-fast)}
details>summary{transition:color var(--feedback-fast),background-color var(--feedback-fast)}
details>summary:active,details>summary:focus-visible{color:#0069bd;background:#f4f8fb}
details[open]>summary{color:#0069bd}
.developer-details[open]>p,.developer-details[open]>.text-link{animation:consign-disclosure var(--feedback-state) var(--feedback-ease) both}
dialog[open]{animation:consign-dialog-in 240ms var(--feedback-ease) both}
dialog[open]::backdrop{animation:consign-backdrop-in 180ms ease-out both}
#notice{transition:opacity 160ms ease-out,transform 220ms var(--feedback-ease)}
#notice.show{transform:translate(-50%,0)}
@keyframes consign-disclosure{from{opacity:.75}to{opacity:1}}
@keyframes consign-dialog-in{from{opacity:.65;transform:translateY(6px) scale(.99)}to{opacity:1;transform:none}}
@keyframes consign-backdrop-in{from{opacity:0}to{opacity:1}}

/* The guide explains one handoff at a time, once. It never represents activity. */
.task-flow .flow-wire,.task-flow .flow-revision-wire{display:block;fill:none}
.task-flow .flow-signal{display:block;fill:none;stroke:#0077d2;stroke-width:2;stroke-dasharray:1000;stroke-dashoffset:1000;opacity:0;animation:none!important;pointer-events:none}
.task-flow[data-motion=paused] .flow-signal{visibility:hidden}
@media(hover:hover) and (pointer:fine){
 .nav-rail nav>a:hover,.nav-rail nav>button:not(:disabled):hover,.docs-nav a:hover{background:#f0f0f3}
 .board-tabs button:not([aria-pressed=true]):hover,.category-strip button:not([aria-pressed=true]):hover{background:#f0f0f3}
 .task-row:hover{border-color:#b1aea8}
 .text-link:hover,.text-button:hover{color:#0069bd}
}
@media(prefers-reduced-motion:reduce){
 .button,.icon-button,.nav-rail nav>a,.nav-rail nav>button,.board-tabs button,.category-strip button,.docs-nav a,.task-row,.roster-agent,form label,form input,form textarea,form select,.search-field,details>summary,#notice{transition:none!important}
 .button:active,.icon-button:active{transform:none!important}
 dialog[open],dialog[open]::backdrop,.developer-details[open]>p,.developer-details[open]>.text-link{animation:none!important}
 .task-flow .flow-signal{display:none}
}
