/* Ask Dottpace AI as a working session (lib/live/workspace.js, ui/wsblocks.js). Calm on purpose: white and the two blacks, hairlines, status
   colours only where something has a status. Tokens only, so light and dark both work. */
.ws-page{display:grid;grid-template-columns:220px minmax(0,1fr);gap:28px;align-items:start}
.ws-main{min-width:0;max-width:880px;display:flex;flex-direction:column;gap:14px}
.ws-sec{display:flex;flex-direction:column;gap:14px;transition:opacity var(--dur-2,.2s) var(--ease,ease)}
.ws-sec.is-working{opacity:.5}
.ws-h2{font-size:var(--t-sh);line-height:var(--lh-sh);font-weight:var(--w-semibold);margin:10px 0 0;color:var(--fg)}
.ws-title{font-size:var(--t-t3);line-height:var(--lh-t3);font-weight:var(--w-semibold);margin:0;color:var(--fg)}

/* sessions */
.ws-rail{position:sticky;top:12px;display:flex;flex-direction:column;gap:6px;min-width:0}
.ws-railh{display:flex;align-items:center;justify-content:space-between;color:var(--fg-2);font-size:var(--t-co)}
.ws-railt{display:none;appearance:none;border:0;background:none;color:var(--fg-2);font:inherit;cursor:pointer;text-decoration:underline}
.ws-rail ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px;max-height:calc(100vh - 220px);overflow:auto}
.ws-rail a{display:flex;flex-direction:column;gap:1px;padding:7px 9px;border-radius:var(--r-8);color:var(--fg);text-decoration:none;min-width:0}
.ws-rail a:hover{background:var(--hover)}
.ws-rail a.is-on{background:var(--fill-1,var(--hover))}
.ws-rail a small{color:var(--fg-3);font-size:var(--t-co)}
.ws-rt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ws-rail .ws-new{flex-direction:row;align-items:center;gap:6px;border:1px solid var(--line);color:var(--fg)}

/* the question, the turns, the lines above the blocks */
.ws-q{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin:0;font-size:var(--t-read);line-height:var(--lh-read);color:var(--fg)}
.ws-q > span{color:var(--fg-3);font-size:var(--t-co)}
.ws-q small{flex-basis:100%;color:var(--fg-3);font-size:var(--t-co)}
.ws-turns{display:flex;gap:6px;list-style:none;margin:0;padding:0 0 2px;overflow-x:auto}
.ws-turns a{display:inline-flex;align-items:center;gap:6px;max-width:240px;padding:4px 10px 4px 4px;border:1px solid var(--line);border-radius:var(--r-full,999px);color:var(--fg-2);text-decoration:none;font-size:var(--t-co);white-space:nowrap}
.ws-turns a:hover{background:var(--hover)}
.ws-turns a.is-on{border-color:var(--fg);color:var(--fg)}
.ws-tn{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;border-radius:999px;background:var(--fill-1,var(--hover));font-variant-numeric:tabular-nums}
.ws-tq{overflow:hidden;text-overflow:ellipsis}
.ws-bar0{margin:0;padding:8px 12px;border:1px solid var(--line);border-radius:var(--r-8);color:var(--fg-2);font-size:var(--t-co)}
.ws-bar0 a,.ws-pl{color:var(--fg);text-decoration:underline;text-underline-offset:2px}

/* a block */
.ws-b{border:1px solid var(--line);border-radius:var(--r-12);background:var(--bg);padding:16px 18px;display:flex;flex-direction:column;gap:10px;min-width:0}
.ws-b.is-new{animation:ws-in .32s var(--ease-out,ease-out) both}
@keyframes ws-in{from{opacity:0;transform:translateY(6px)}}
.ws-bh{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--fg-2)}
.ws-bh h3{margin:0;font-size:var(--t-body);line-height:var(--lh-body);font-weight:var(--w-semibold);color:var(--fg)}
.ws-meta{margin-left:auto;color:var(--fg-3);font-size:var(--t-co)}
.ws-tags{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.ws-tags .ws-meta{margin-left:0}
.ws-summary{border:0;padding:4px 0 2px;background:none}
.ws-lead{display:flex;flex-direction:column;gap:6px;font-size:var(--t-read);line-height:var(--lh-read);color:var(--fg)}
.ws-lead p{margin:0}
.ws-pts{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:5px}
.ws-sub h4{margin:0 0 6px;font-size:var(--t-co);font-weight:var(--w-semibold);color:var(--fg-2)}
.ws-note{margin:0;color:var(--fg-2);font-size:var(--t-co);line-height:var(--lh-co)}
.ws-cap{margin:0;color:var(--fg-3);font-size:var(--t-co);line-height:var(--lh-co)}
.ws-plain,.ws-rec,.ws-read{margin:0;color:var(--fg)}
.ws-rec{font-size:var(--t-read);line-height:var(--lh-read)}
.ws-asked{margin:0;color:var(--fg-2)}
.ws-stake{margin:0}
.ws-acts{display:flex;flex-wrap:wrap;gap:8px}
.ws-inl{display:inline-flex;align-items:center;gap:4px;margin-left:6px}
.ws-dash{color:var(--fg-3)}
.ws-quiet{background:var(--fill-1,var(--bg))}

/* a number opens where it came from */
.ws-n{appearance:none;border:0;background:none;padding:0 2px;margin:0 -2px;font:inherit;color:inherit;cursor:pointer;border-radius:var(--r-4);text-decoration:underline dotted;text-decoration-color:var(--fg-4);text-underline-offset:3px;font-variant-numeric:tabular-nums}
.ws-n:hover,.ws-n.is-on{background:var(--hover);text-decoration-color:var(--fg)}
.ws-m{appearance:none;display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 4px;border:1px solid var(--line);border-radius:var(--r-4);background:none;color:var(--fg-3);font:inherit;font-size:11px;line-height:1;vertical-align:2px;cursor:pointer;font-variant-numeric:tabular-nums}
.ws-m:hover,.ws-m.is-on{border-color:var(--fg-2);color:var(--fg)}
.ws-src{border-top:1px solid var(--line);padding-top:10px;display:flex;flex-direction:column;gap:8px}
.ws-srch{display:flex;align-items:center;justify-content:space-between;font-size:var(--t-co)}
.ws-src ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ws-src li{display:flex;gap:8px;align-items:flex-start;font-size:var(--t-co);line-height:var(--lh-co)}
.ws-src li p{margin:0}
.ws-mn{flex:none;display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;border:1px solid var(--line);border-radius:var(--r-4);color:var(--fg-3);font-size:11px}
.ws-x{appearance:none;border:0;background:none;color:var(--fg-2);padding:4px;border-radius:var(--r-6);cursor:pointer}
.ws-x:hover{background:var(--hover)}

/* metric cards */
.ws-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.ws-card{border:1px solid var(--line);border-radius:var(--r-8);padding:12px;display:flex;flex-direction:column;gap:3px;min-width:0}
.ws-card.is-small{padding:10px}
.ws-cl{color:var(--fg-2);font-size:var(--t-co)}
.ws-cv{font-size:var(--t-t2);line-height:var(--lh-t2);font-weight:var(--w-semibold);color:var(--fg);font-variant-numeric:tabular-nums}
.ws-card.is-small .ws-cv{font-size:var(--t-sh);line-height:var(--lh-sh)}
.ws-cc{display:inline-flex;align-items:center;gap:3px;flex-wrap:wrap;font-size:var(--t-co);font-weight:var(--w-medium)}
.ws-cc small{font-weight:var(--w-regular);color:var(--fg-3)}
.ws-cc.is-good{color:var(--pos-ink,var(--pos))}
.ws-cc.is-bad{color:var(--neg-ink,var(--neg))}
.ws-cc.is-flat{color:var(--fg-2)}
.ws-cu,.ws-cs{color:var(--fg-3);font-size:var(--t-co);line-height:var(--lh-co)}

/* charts and markers */
.ws-chart{min-height:120px}
.ws-mk{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;font-size:var(--t-co)}
.ws-mk li{display:flex;align-items:center;gap:8px;color:var(--fg-2)}
.ws-mkd{min-width:52px;color:var(--fg-3);font-variant-numeric:tabular-nums}

/* tables, groups, side by side */
.ws-tw{overflow-x:auto;margin:0 -4px}
.ws-t{width:100%;border-collapse:collapse;font-size:var(--t-co);font-variant-numeric:tabular-nums}
.ws-t th,.ws-t td{padding:7px 4px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
.ws-t thead th{color:var(--fg-3);font-weight:var(--w-medium)}
.ws-t tbody th{font-weight:var(--w-regular);color:var(--fg)}
.ws-t .r{text-align:right}
.ws-t tr:last-child > *{border-bottom:0}
.ws-bar{display:inline-block;width:56px;height:6px;border-radius:999px;background:var(--fill-1,var(--hover));margin-right:8px;vertical-align:middle;overflow:hidden}
.ws-bar i{display:block;height:100%;background:var(--fg-3);border-radius:inherit}
.ws-bar.is-a i{background:var(--fg)}
.ws-sh{white-space:nowrap}
.ws-cmp tr.lean-a td:nth-child(2),.ws-cmp tr.lean-b td:nth-child(3){font-weight:var(--w-semibold);color:var(--fg)}

/* what was checked */
.ws-steps{list-style:none;margin:0;padding:0}
.ws-steps li{display:flex;gap:10px;padding:9px 0;border-top:1px solid var(--line)}
.ws-steps li:first-child{border-top:0}
.ws-si{flex:none;margin-top:2px;color:var(--fg)}
.ws-steps li.is-out .ws-si{color:var(--fg-4)}
.ws-steps li.is-warn .ws-si{color:var(--warn-ink,var(--st-orange))}
.ws-sq{margin:0;color:var(--fg-2);font-size:var(--t-co);display:flex;flex-wrap:wrap;gap:4px;align-items:baseline}
.ws-sq b{color:var(--fg);font-weight:var(--w-medium)}
.ws-sst{margin-left:auto;color:var(--fg-3)}
.ws-sf{margin:3px 0 0;color:var(--fg)}
.ws-steps li.is-out .ws-sf{color:var(--fg-2)}
.ws-lean{border-left:2px solid var(--fg);padding:2px 0 2px 12px;display:flex;flex-direction:column;gap:4px}
.ws-lean p{margin:0}

/* what if, before you do this, prepared work */
.ws-est{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.ws-est li{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.ws-est b{font-size:var(--t-sh);font-weight:var(--w-semibold);font-variant-numeric:tabular-nums}
.ws-est small{color:var(--fg-3)}
.ws-as{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.ws-as li{display:flex;gap:8px;align-items:baseline;justify-content:space-between}
.ws-basis{flex:none;color:var(--fg-3);font-size:var(--t-co);border:1px solid var(--line);border-radius:999px;padding:0 8px}
.ws-promise{margin:0;padding:10px 12px;border-radius:var(--r-8);background:var(--fill-1,var(--hover));color:var(--fg-2);font-size:var(--t-co)}
.ws-challenge{border-color:var(--line-strong,var(--line))}
.ws-try{border-left:2px solid var(--line-strong,var(--line));padding-left:12px;display:flex;flex-direction:column;gap:4px}
.ws-try p,.ws-try h4{margin:0}
.ws-dec{margin:0;color:var(--fg-2);font-size:var(--t-co)}
.ws-chg{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ws-chg li{border:1px solid var(--line);border-radius:var(--r-8);padding:8px 10px;display:flex;flex-direction:column;gap:3px}
.ws-chg p{margin:0}
.ws-bef,.ws-aft{display:flex;gap:8px}
.ws-bef{color:var(--fg-2)}
.ws-bef > span,.ws-aft > span{flex:none;min-width:40px;color:var(--fg-3);font-size:var(--t-co)}
.ws-plan{display:grid;grid-template-columns:minmax(120px,auto) 1fr;gap:4px 14px;margin:0}
.ws-plan dt{color:var(--fg-3);font-size:var(--t-co)}
.ws-plan dd{margin:0;color:var(--fg)}
.ws-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.ws-list li{display:flex;flex-direction:column;gap:4px;padding:10px 0;border-top:1px solid var(--line)}
.ws-list li:first-child{border-top:0;padding-top:0}
.ws-list p{margin:0}

/* writing, a stop, a failure, a reply that changed nothing */
.ws-working{border-style:dashed}
.ws-wk{display:flex;align-items:center;gap:8px;margin:0;color:var(--fg-2);font-size:var(--t-co)}
.ws-dot{width:8px;height:8px;border-radius:50%;background:var(--fg-3);animation:ws-pulse 1.2s ease-in-out infinite}
@keyframes ws-pulse{50%{opacity:.25}}
.ws-err{border:1px solid var(--neg,var(--line));border-radius:var(--r-12);padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.ws-err p{margin:0}
.ws-aside{border:1px dashed var(--line);border-radius:var(--r-12);padding:10px 14px;display:flex;flex-direction:column;gap:4px}
.ws-aside p{margin:0}
.ws-msg{display:flex;flex-direction:column;gap:2px;padding:8px 0;border-top:1px solid var(--line)}
.ws-msg p{margin:0;white-space:pre-wrap}
.ws-msg b{font-size:var(--t-co);color:var(--fg-3)}

/* asking */
.ws-ask{border:1px solid var(--line-strong,var(--line));border-radius:var(--r-12);padding:8px 10px;background:var(--bg);display:flex;flex-direction:column;gap:6px}
.ws-ask textarea.ob-in{border:0;box-shadow:none;background:transparent;width:100%;min-height:44px;padding:4px 2px;resize:vertical;font:inherit;color:var(--fg)}
.ws-ask textarea.ob-in:focus{outline:none}
.ws-ask:focus-within{border-color:var(--fg-2)}
.ws-ask.is-first textarea.ob-in{font-size:var(--t-read);line-height:var(--lh-read);min-height:72px}
.ws-askb{display:flex;align-items:center;justify-content:space-between;gap:10px}
.ws-askb small{color:var(--fg-3);font-size:var(--t-co)}
.ws-main > .ws-ask:not(.is-first){position:sticky;bottom:12px;box-shadow:var(--sh-med,0 6px 24px rgba(0,0,0,.08));z-index:5}
.ws-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.ws-chl{color:var(--fg-3);font-size:var(--t-co);margin-right:2px}
.ws-chip{appearance:none;border:1px solid var(--line);border-radius:999px;padding:5px 12px;background:none;color:var(--fg);font:inherit;font-size:var(--t-co);cursor:pointer;text-align:left}
.ws-chip:hover{background:var(--hover)}
.ws-chip:disabled{opacity:.5;cursor:default}

@media (max-width:900px){
  .ws-page{grid-template-columns:minmax(0,1fr);gap:12px}
  .ws-rail{position:static}
  .ws-railt{display:inline}
  .ws-rail ul,.ws-rail .ws-new,.ws-rail > .ws-note{display:none}
  .ws-rail.is-open ul,.ws-rail.is-open .ws-new{display:flex}
  .ws-rail ul{max-height:50vh}
  .ws-sst{margin-left:0;flex-basis:100%}
  .ws-plan{grid-template-columns:minmax(0,1fr)}
  .ws-askb small{display:none}
}
@media (prefers-reduced-motion:reduce){.ws-b.is-new{animation:none}.ws-dot{animation:none}.ws-sec{transition:none}}