/* Shared workspace surfaces retain the existing light/dark semantic tokens. */
:root { --radius:14px; }
body { font-family:Inter, system-ui, sans-serif; }
.top { flex-wrap:wrap; gap:12px; padding-bottom:18px; border-bottom:1px solid var(--line); }
.top .who { flex-wrap:wrap; gap:8px; }
.tabs { flex-wrap:wrap; padding:14px 0; border-bottom:1px solid var(--line); }
.tab { border-radius:8px; padding:10px 15px; }
.tab.on { background:var(--accent-dim); color:var(--text); }
.ws-heading { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; margin-bottom:22px; }
.ws-heading h1 { font-size:clamp(26px, 3vw, 36px); letter-spacing:-.04em; margin:8px 0; }
.ws-heading h2 { overflow-wrap:anywhere; }
.ws-heading p { max-width:66ch; line-height:1.6; }
.ws-heading .eyebrow { color:var(--muted); background:var(--surface2); }
.ws-heading .btn, .ws-toolbar .btn, .ws-card .btn { width:auto; display:inline-block; text-decoration:none; }
.ws-resources { position:relative; }
.ws-resources > summary { cursor:pointer; padding:8px 12px; border:1px solid var(--line); border-radius:8px; }
.ws-resources-menu { position:absolute; right:0; top:38px; min-width:190px; display:grid; gap:8px; padding:12px; background:var(--surface); border:1px solid var(--line); border-radius:10px; z-index:50; box-shadow:0 12px 30px #0003; }
.ws-resources-menu > * { text-align:left; }
.ws-metrics, .ws-actions { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:16px; margin:20px 0; }
.ws-card { border:1px solid var(--line); background:var(--surface); border-radius:var(--radius); padding:22px; margin-bottom:18px; color:var(--text); text-align:left; min-width:0; }
button.ws-card { cursor:pointer; font:inherit; transition:border-color .15s; }
button.ws-card:hover { border-color:var(--accent); }
.ws-card h2 { font-size:17px; line-height:1.5; margin:0 0 12px; }
.ws-card h2 span { float:right; color:var(--accent); }
.ws-card p, .ws-card small { color:var(--muted); line-height:1.65; }
.ws-number { display:block; font-size:36px; letter-spacing:-.035em; margin:12px 0; }
.ws-table-wrap { overflow-x:auto; }
.ws-table { border-collapse:collapse; width:100%; font-size:13px; text-align:left; }
.ws-table th { color:var(--muted); font-weight:500; padding:12px; border-bottom:1px solid var(--line); }
.ws-table td { padding:14px 12px; border-bottom:1px solid var(--line); vertical-align:top; overflow-wrap:anywhere; max-width:340px; }
.ws-table td small { display:block; margin-top:6px; }
.ws-link { color:var(--accent); border:0; background:none; padding:0; text-align:left; cursor:pointer; font:inherit; overflow-wrap:anywhere; }
.ws-badge { display:inline-block; padding:4px 8px; border:1px solid var(--line); border-radius:6px; font-size:11px; white-space:nowrap; color:var(--muted); }
.ws-toolbar { display:flex; gap:12px; align-items:end; flex-wrap:wrap; margin:20px 0; }
.ws-toolbar label { display:grid; gap:8px; color:var(--muted); font-size:13px; flex:1; min-width:180px; }
.ws-toolbar input, .ws-toolbar select { background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:12px; color:var(--text); font:inherit; }
.ws-facts { display:grid; grid-template-columns:minmax(120px, 1fr) 3fr; gap:12px 22px; font-size:13px; }
.ws-facts dt { color:var(--muted); }
.ws-facts dd { margin:0; overflow-wrap:anywhere; }
.ws-stages { padding-left:24px; }
.ws-stages li { padding:12px 0; border-bottom:1px solid var(--line); }
.ws-stages li > span { display:block; margin:6px 0; color:var(--muted); font-size:13px; }
.ws-card details { margin-top:16px; }
.ws-card summary { cursor:pointer; color:var(--accent); font-size:13px; }
.ws-card pre { overflow:auto; white-space:pre-wrap; overflow-wrap:anywhere; font-size:12px; line-height:1.6; padding:14px; background:var(--surface2); border-radius:8px; max-height:400px; }
.ws-evidence-hint { margin:0; padding:12px 18px; color:var(--muted); font-size:11px; line-height:1.6; border-bottom:1px solid var(--line); }
body.ws-agent-open .updating { position:static; }
:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.ws-palette { width:min(520px, 90vw); padding:24px; border:1px solid var(--line); border-radius:16px; background:var(--surface); color:var(--text); }
.ws-palette::backdrop { background:#0008; }
.ws-palette form { float:right; }
.ws-palette label { display:grid; gap:12px; }
.ws-palette input { padding:12px; background:var(--surface2); border:1px solid var(--line); border-radius:8px; color:var(--text); font:inherit; }
.ws-command { display:block; width:100%; text-align:left; padding:12px; margin-top:8px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--text); cursor:pointer; }
@media (min-width:1101px) { .ws-assistant-launcher { display:none; } }
@media (max-width:1100px) {
  .ws-metrics, .ws-actions { grid-template-columns:1fr; gap:0; }
  body.ws-agent-open #agent { display:flex; width:min(460px, 100vw); z-index:100; }
  body.ws-agent-open #agent-toggle { display:block; }
}
@media (max-width:600px) {
  #app { padding:14px; }
  .ws-card { padding:16px; }
  .ws-facts { grid-template-columns:1fr; gap:6px; }
  .ws-facts dd { margin-bottom:12px; }
}
@media (prefers-reduced-motion:reduce) { .ws-card { transition:none; } }

/* ---- Blend with the Applications page (owner's ask, 7 Sept 2026). The
   Overview and Jobs & Workflows tabs read as a different product next to the
   Applications hero:flat white cards on a flat page. They now share the
   Applications page's gradient hero, its stat tiles and its category-tile
   cards (app.css .hero / .stat / .cat), so the first three tabs are one
   product. Scoped to the section-level heading:.ws-heading is also used
   inside job cards, which stay as they are. ---- */
#v-overview > .ws-heading, #v-jobs > .ws-heading{
  position:relative;overflow:hidden;color:var(--text-strong);
  background:var(--surface2);
  border-radius:16px;padding:1.7rem 1.9rem;margin-bottom:1.4rem}
#v-overview > .ws-heading::before, #v-jobs > .ws-heading::before{content:"";position:absolute;inset:-45%;z-index:0;pointer-events:none;
  position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(var(--overlay-1) 1px,transparent 1px),linear-gradient(90deg,var(--overlay-1) 1px,transparent 1px);
  background-size:38px 38px;mask-image:radial-gradient(90% 80% at 20% 30%,#000,transparent 78%)}
#v-overview > .ws-heading > *, #v-jobs > .ws-heading > *{position:relative;z-index:1}
#v-overview > .ws-heading h1, #v-jobs > .ws-heading h1{color:var(--text-strong);font-size:31px;line-height:1.13;letter-spacing:-.025em;margin:.35rem 0 .45rem}
#v-overview > .ws-heading p, #v-jobs > .ws-heading p{color:var(--muted);font-size:14px;margin:0}
#v-overview > .ws-heading .eyebrow, #v-jobs > .ws-heading .eyebrow{background:var(--overlay-2);color:var(--text-strong)}
#v-overview > .ws-heading .btn, #v-jobs > .ws-heading .btn{background:var(--overlay-2);border:1px solid var(--overlay-3);color:var(--text-strong)}
#v-overview > .ws-heading .btn:hover, #v-jobs > .ws-heading .btn:hover{background:var(--overlay-3)}
/* metrics as the hero's stat tiles */
.ws-metrics .ws-card{background:var(--surface);padding:16px 18px;margin:0}
.ws-metrics .ws-card > .muted{font-size:10.5px;letter-spacing:.05em;text-transform:uppercase}
.ws-metrics .ws-number{color:var(--accent);font-size:30px;font-weight:600;margin:6px 0 4px}
/* action cards as category tiles:accent bar, lift on hover */
.ws-actions .ws-card{position:relative;overflow:hidden;margin:0;transition:border-color .15s,transform .15s}
.ws-actions .ws-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--accent)}
.ws-actions .ws-card:nth-child(2)::before{background:var(--violet)}
.ws-actions .ws-card:nth-child(3)::before{background:var(--warn)}
.ws-actions .ws-card:hover{border-color:var(--line-strong);transform:translateY(-2px)}
.ws-actions .ws-card h2{font-size:16px;margin-bottom:6px}
.ws-actions .ws-card p{font-size:12.5px}
/* the remaining surfaces:tinted, not flat */
.ws-principle{background:var(--surface);border-left:3px solid var(--accent)}
#v-overview > .ws-card, #v-jobs > .ws-card{background:var(--surface)}
.ws-toolbar{padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface2)}
@media (prefers-reduced-motion:reduce){ .ws-actions .ws-card{transition:none} }

/* Dataset acquisition settings remain readable at narrow workspace widths. */
#dataset-run-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:16px; }
#dataset-run-form label { display:flex; flex-direction:column; gap:6px; min-width:0; }
#dataset-run-form input, #dataset-run-form select { box-sizing:border-box; width:100%; min-width:0; padding:10px; font:inherit; }
#dataset-run-form > p, #dataset-run-submit { grid-column:1 / -1; }
#dataset-run-form > button { align-self:end; }
@media(max-width:700px) { #dataset-run-form { grid-template-columns:minmax(0,1fr); } }