/* The Vire workspace demonstration. Dark instrument, hairline structure, one blue. */
.ws-app{--ws-side:#040405;--ws-hover:#0d0d10;--ws-on:#101014;--ws-tab-on:#141418;--ws-seg-on:#16161b;--ws-grid:#17171b;--ws-field:#0a0a0c;--ws-q-line:#3d3d44;--ws-stream-bg:#08080a;--on-blue:#fff;position:relative;display:grid;grid-template-columns:200px minmax(0,1fr);border:1px solid var(--line-2);border-radius:var(--r-lg);background:var(--ink-1);color:var(--fg);overflow:hidden;min-height:0;text-align:left}
.ws-side{position:relative;display:flex;flex-direction:column;gap:2px;padding:18px 12px 14px;background:var(--ws-side);border-right:1px solid var(--line)}
.ws-side__logo{height:15px;width:auto;align-self:flex-start;margin:3px 10px 18px}
.ws-biz{display:flex;flex-direction:column;gap:2px;margin:0 10px 4px;min-width:0}
.ws-biz b{font-size:13px;font-weight:600;color:var(--fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ws-biz span{font-size:11.5px;color:var(--fg-3)}
.ws-group{margin:14px 10px 6px;font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-3)}
.ws-nav{position:relative;z-index:1;display:flex;align-items:center;gap:10px;height:34px;padding:0 10px 0 14px;border:0;border-radius:6px;background:none;color:var(--fg-2);font-size:13px;font-weight:500;cursor:pointer;text-align:left;transition:color .2s,background .2s}
.ws-nav svg{width:15px;height:15px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ws-nav:hover{color:var(--fg);background:var(--ws-hover)}
.ws-nav.is-on{color:var(--fg);background:var(--ws-on)}
.ws-thumb{position:absolute;left:12px;top:0;width:2px;height:16px;border-radius:2px;background:var(--blue);transition:transform .5s var(--ease)}
.ws-side__foot{margin-top:auto;padding:12px 10px 0;border-top:1px solid var(--line);font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3)}
.ws-main{position:relative;display:flex;flex-direction:column;min-width:0;min-height:0}
.ws-bar{height:46px;flex:none;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:0 20px;border-bottom:1px solid var(--line);font-size:13px;color:var(--fg-2);white-space:nowrap}
.ws-bar__r{display:flex;align-items:center;gap:12px}
.ws-askbtn{display:inline-flex;align-items:center;gap:8px;height:28px;padding:0 11px;border:1px solid var(--line-2);border-radius:6px;background:none;color:var(--fg);font-size:12.5px;font-weight:500;cursor:pointer;transition:border-color .2s,background .2s}
.ws-askbtn:hover{border-color:var(--ws-q-line);background:var(--ws-hover)}
.ws-askbtn i{width:5px;height:5px;border-radius:50%;background:var(--blue)}
.ws-crumb b{color:var(--fg);font-weight:500}
.ws-crumb i{font-style:normal;color:var(--fg-3);margin:0 8px}
.ws-mtabs{display:none}
.ws-views{position:relative;flex:1;min-height:0;transition:filter .26s,opacity .26s}
.ws-views.is-swapping{filter:blur(8px);opacity:.15}
.ws-view{position:absolute;inset:0;overflow:auto;scrollbar-width:none;padding:22px 24px 26px;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .3s,transform .45s var(--ease),visibility 0s .45s}
.ws-view::-webkit-scrollbar{display:none}
.ws-view.is-on{opacity:1;visibility:visible;transform:none;transition:opacity .35s .06s,transform .5s .06s var(--ease),visibility 0s}
.ws-lab{display:flex;align-items:center;gap:8px;margin:0;font-family:var(--mono);font-size:9.5px;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:var(--fg-3)}
.ws-lab .dot{width:5px;height:5px;border-radius:50%;background:var(--blue)}
.ws-vh{margin:8px 0 18px;font-size:20px;font-weight:500;letter-spacing:-.025em}
.ws-sub{margin:20px 0 10px;font-family:var(--mono);font-size:9.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3)}
.ws-note{margin:18px 0 0;font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-3);line-height:1.6}
.ws-note--top{margin:0 0 18px}
.ws-link{padding:0;border:0;background:none;color:var(--blue-ink);font-size:13px;font-weight:500;cursor:pointer;text-decoration:none}
.ws-link:hover{color:color-mix(in srgb,var(--blue-ink) 70%,var(--fg))}
/* home */
.ws-home{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:20px 28px}
.ws-h{margin:10px 0 6px;font-size:clamp(20px,1.85vw,27px);font-weight:500;letter-spacing:-.03em;line-height:1.13}
.ws-p{margin:0;color:var(--fg-2);font-size:13.5px}
.ws-chart{position:relative;margin-top:18px;height:clamp(96px,17vh,160px)}
.ws-chart__svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ws-stop{stop-color:var(--blue-chart)}
.ws-line{stroke:var(--blue-chart)}
.ws-grid{stroke:var(--ws-grid);stroke-width:1;vector-effect:non-scaling-stroke}
.ws-live{position:absolute;right:0;bottom:-20px;display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue-ink)}
.ws-live i{width:6px;height:6px;border-radius:50%;background:var(--blue-chart);box-shadow:0 0 0 0 color-mix(in srgb,var(--blue-chart) 60%,transparent);animation:livepulse 2.4s var(--ease) infinite}
@keyframes livepulse{70%{box-shadow:0 0 0 7px color-mix(in srgb,var(--blue-chart) 0%,transparent)}100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--blue-chart) 0%,transparent)}}
.ws-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin-top:34px;background:var(--line);border:1px solid var(--line);border-radius:8px;overflow:hidden}
.ws-kpis--2{grid-template-columns:repeat(2,minmax(0,1fr));margin:18px 0 6px}
.ws-kpi{padding:12px 14px 13px;background:var(--ink-1)}
.ws-kpi__l{margin:0;font-family:var(--mono);font-size:9px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ws-kpi__v{margin:7px 0 4px;font-size:clamp(19px,1.65vw,25px);font-weight:500;letter-spacing:-.02em}
.ws-kpi__d{margin:0;font-size:11.5px;color:var(--fg-2)}
.ws-col{display:flex;flex-direction:column;gap:14px;min-width:0}
.ws-attn{padding:16px;border:1px solid var(--line);border-radius:8px}
.ws-attn__h{margin:12px 0 6px;font-size:15px;font-weight:500;line-height:1.38;letter-spacing:-.012em}
.ws-attn__p{margin:0 0 14px;font-size:12.5px;line-height:1.5;color:var(--fg-2)}
.ws-why{padding:0;border:0;background:none;color:var(--blue-ink);font-size:13px;font-weight:500;cursor:pointer}
.ws-why:hover{color:color-mix(in srgb,var(--blue-ink) 70%,var(--fg))}
.ws-ask{padding:14px 16px 16px;border:1px solid var(--line);border-radius:8px}
.ws-ask__t{margin:6px 0 0;font-size:15px;font-weight:500}
.ws-ask__form{display:flex;align-items:center;gap:8px;height:38px;margin-top:10px;padding:0 4px 0 12px;border:1px solid var(--line-2);border-radius:6px;background:var(--ws-field)}
.ws-ask__form input{flex:1;min-width:0;height:100%;border:0;outline:0;background:none;color:var(--fg);font:13.5px var(--font)}
.ws-ask__form input::placeholder{color:var(--fg-3)}
.ws-ask__form button{width:30px;height:30px;display:grid;place-items:center;border:0;border-radius:5px;background:var(--blue);color:var(--on-blue);cursor:pointer}
.ws-ask__form .glyph{width:14px;height:7px}
.ws-answer{display:none;margin-top:12px;padding:12px 13px;border-radius:7px;background:color-mix(in srgb,var(--blue-chart) 9%,var(--ink-1));border:1px solid color-mix(in srgb,var(--blue-chart) 28%,transparent)}
.ws-answer.is-on{display:block;animation:rise .4s var(--ease) both}
.ws-answer__q{margin:0 0 6px;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue-ink)}
.ws-answer__a{margin:0;font-size:13px;line-height:1.55;color:var(--fg)}
.caret{display:inline-block;width:6px;height:13px;margin-left:3px;vertical-align:-2px;background:var(--blue-ink);animation:blink 1s steps(2) infinite}
@keyframes blink{50%{opacity:0}}
.ws-qs{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.ws-q{padding:6px 10px;border:1px solid var(--line-2);border-radius:999px;background:none;color:var(--fg-2);font-size:12px;cursor:pointer;text-align:left;transition:color .2s,border-color .2s,background .2s}
.ws-q:hover{color:var(--fg);border-color:var(--ws-q-line)}
.ws-q.is-on{color:var(--fg);border-color:var(--blue);background:color-mix(in srgb,var(--blue) 13%,transparent)}
/* intelligence */
.ws-steps{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);counter-reset:s}
.ws-steps li{display:grid;grid-template-columns:200px minmax(0,1fr);gap:20px;padding:16px 0;border-bottom:1px solid var(--line)}
.ws-view.is-on .ws-steps li{animation:rise .5s var(--ease) both;animation-delay:calc(var(--i)*70ms)}
.ws-steps__n{font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3);padding-top:2px}
.ws-steps li:last-child .ws-steps__n{color:var(--blue-ink)}
.ws-steps p{margin:0;font-size:14.5px;line-height:1.5}
/* actions */
.ws-acts{border-top:1px solid var(--line)}
.ws-act{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 20px;align-items:center;padding:15px 0;border-bottom:1px solid var(--line)}
.ws-view.is-on .ws-act{animation:rise .5s var(--ease) both;animation-delay:calc(var(--i)*70ms)}
.ws-act h4{margin:0;font-size:14.5px;font-weight:500}
.ws-act p{margin:3px 0 0;font-size:13px;color:var(--fg-2)}
/* business */
.ws-pills{display:flex;flex-wrap:wrap;gap:6px}
.ws-pill{padding:7px 11px;border:1px solid var(--line-2);border-radius:999px;background:none;color:var(--fg-2);font-size:12.5px;cursor:pointer;transition:all .2s}
.ws-pill:hover{color:var(--fg)}
.ws-pill[aria-pressed="true"]{color:var(--fg);border-color:var(--blue);background:color-mix(in srgb,var(--blue) 13%,transparent)}
.ws-knows{border-top:1px solid var(--line)}
.ws-know{border-bottom:1px solid var(--line)}
.ws-know__b{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:11px 0;border:0;background:none;color:var(--fg);font-size:13.5px;cursor:pointer;text-align:left}
.ws-know__s{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-3)}
.ws-know__d{margin:0 0 12px;font-size:13px;color:var(--fg-2)}
ul.ws-know__d{padding-left:16px;display:flex;flex-direction:column;gap:4px}
ul.ws-know__d li::marker{color:var(--blue-ink)}
.ws-qna__row{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:13.5px}
.ws-qna__d{margin:10px 0 0;font-size:13px;color:var(--fg-2)}
/* connections */
.ws-conn-h{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.ws-conn-n{display:flex;align-items:baseline;gap:8px;margin:0 0 18px}
.ws-conn-n b{font-size:24px;font-weight:500}
.ws-conn-n span{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--positive)}
.ws-cg{margin-bottom:16px}
.ws-cg__h{display:flex;justify-content:space-between;margin:0 0 6px;padding-bottom:6px;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3)}
.ws-ci{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:12px;align-items:center;padding:7px 0}
.ws-ci__n{font-size:13.5px;font-weight:500;line-height:1.25}
.ws-ci__n small{display:block;font-family:var(--mono);font-size:9px;font-weight:400;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-3)}
.ws-miss{display:flex;justify-content:space-between;gap:12px;margin-top:8px;padding:12px 0;border-top:1px solid var(--line);font-size:13.5px}
.lg{display:grid;place-items:center;width:30px;height:30px;border-radius:7px;border:1px solid var(--s-line2,var(--line-2));background:color-mix(in srgb,var(--s-fg,#fff) 3%,transparent);flex:none}
.lg svg{width:15px;height:15px;fill:currentColor}
.lg--mono{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.04em;color:var(--s-fg2,var(--fg-2))}
.st{font-family:var(--mono);font-size:9px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.st::before{content:"";width:6px;height:6px;border-radius:50%;flex:none}
.st--on{color:var(--positive)}.st--on::before{background:var(--positive)}
.st--setup{color:var(--blue-ink)}.st--setup::before{border:1.5px solid var(--blue-ink);width:5px;height:5px}
.st--ready{color:#7fc4a2}.st--ready::before{border:1.5px solid #7fc4a2;width:5px;height:5px;border-radius:1px}
.st--approval{color:#e2b968}.st--approval::before{background:linear-gradient(90deg,#e2b968 50%,transparent 50%);border:1px solid #e2b968}
.st--soon{color:var(--fg-3)}.st--soon::before{border:1px dashed var(--fg-3)}
[data-surface="paper"] .st--setup,.ws-app[data-theme="light"] .st--setup{color:var(--blue)}[data-surface="paper"] .st--setup::before,.ws-app[data-theme="light"] .st--setup::before{border-color:var(--blue)}
[data-surface="paper"] .st--ready,.ws-app[data-theme="light"] .st--ready{color:#2f8a5f}[data-surface="paper"] .st--ready::before,.ws-app[data-theme="light"] .st--ready::before{border-color:#2f8a5f}
[data-surface="paper"] .st--approval,.ws-app[data-theme="light"] .st--approval{color:#a8741a}[data-surface="paper"] .st--approval::before,.ws-app[data-theme="light"] .st--approval::before{border-color:#a8741a;background:linear-gradient(90deg,#a8741a 50%,transparent 50%)}
[data-surface="paper"] .st--soon,.ws-app[data-theme="light"] .st--soon{color:var(--paper-3)}[data-surface="paper"] .st--soon::before,.ws-app[data-theme="light"] .st--soon::before{border-color:var(--paper-3)}
/* settings */
.ws-setg{padding-bottom:6px}
.ws-set{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13.5px;flex-wrap:wrap}
.ws-set__v{color:var(--fg-2)}
.ws-seg{display:inline-flex;padding:2px;border:1px solid var(--line-2);border-radius:7px;flex-wrap:wrap}
.ws-seg button{padding:5px 10px;border:0;border-radius:5px;background:none;color:var(--fg-2);font-size:12px;cursor:pointer}
.ws-seg button{transition:background .25s,color .25s,box-shadow .25s}
.ws-seg button[aria-pressed="true"]{background:var(--ws-seg-on);color:var(--fg);box-shadow:var(--ws-seg-shadow,none)}
/* buttons inside the workspace */
.ws-btn{flex:none;height:34px;padding:0 14px;border:1px solid var(--blue);border-radius:6px;background:var(--blue);color:var(--on-blue);font:500 12.5px var(--font);cursor:pointer;transition:filter .2s,background .2s,border-color .2s}
.ws-btn:hover{filter:brightness(1.08)}
.ws-btn--q{border-color:var(--line-2);background:none;color:var(--fg)}
.ws-btn--q:hover{filter:none;border-color:var(--ws-q-line);background:var(--ws-hover)}
/* what Voice or the assistant points at */
.ws-hl{outline:2px solid var(--blue);outline-offset:4px;border-radius:8px;transition:outline-color .9s var(--ease)}
.ws-hl.is-fading{outline-color:transparent}
/* connections → the Connector assistant (webapp/templates/connector_assistant.html) */
.ws-asst{margin:0 0 22px;padding:16px 0 18px;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line)}
.ws-asst__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}
.ws-asst__lab{margin:0 0 5px;font-family:var(--mono);font-size:9.5px;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:var(--blue-ink)}
.ws-asst__lede{margin:0;max-width:62ch;font-size:12.5px;line-height:1.5;color:var(--fg-2)}
.ws-asst__st,.ws-talk__st{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--fg-2);white-space:nowrap}
.ws-asst__st i,.ws-talk__st i{width:6px;height:6px;border-radius:50%;background:var(--fg-3);flex:none}
.ws-asst__st.is-run i,.ws-talk__st.is-live i{background:var(--blue-chart);animation:livepulse 2.4s var(--ease) infinite}
.ws-asst__st.is-wait i,.ws-talk__st.is-muted i{background:var(--warning)}
.ws-asst__st.is-done i{background:var(--positive)}
.ws-asst__body{display:grid;grid-template-columns:minmax(0,1fr);gap:16px 28px;align-items:start}
.ws-asst.has-side .ws-asst__body{grid-template-columns:minmax(0,1.5fr) minmax(190px,1fr)}
.ws-asst__thread{display:flex;flex-direction:column;gap:10px;min-width:0}
.ws-am,.ws-tm{display:grid;grid-template-columns:68px minmax(0,1fr);gap:10px;align-items:baseline;animation:rise .35s var(--ease) both}
.ws-am>span,.ws-tm>span{font-family:var(--mono);font-size:9px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3)}
.ws-am.is-assistant>span,.ws-tm.is-assistant>span{color:var(--blue-ink)}
.ws-am p,.ws-tm p{margin:0;font-size:13px;line-height:1.5;color:var(--fg)}
.ws-am.is-vire p,.ws-tm.is-vire p{font-size:12.5px;color:var(--fg-2)}
.ws-am.is-user p,.ws-tm.is-user p{font-weight:500}
.ws-tm.is-typed p::after{content:" (typed)";font-weight:400;color:var(--fg-3)}
.ws-asst__try{padding:0;border:0;background:none;color:var(--blue-ink);font:inherit;cursor:pointer;text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--blue-ink) 40%,transparent);text-underline-offset:3px}
.ws-asst__try:disabled{color:inherit;text-decoration:none;cursor:default}
.ws-asst__side{min-width:0}
.ws-asst__side:empty{display:none}
.ws-asst__k{margin:0 0 6px;font-family:var(--mono);font-size:9px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3)}
.ws-asst__side ul{list-style:none;margin:0 0 14px;padding:0}
.ws-asst__plan li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;padding:7px 0;border-bottom:1px solid var(--line);font-size:12.5px;animation:rise .3s var(--ease) both}
.ws-asst__plan strong{font-weight:500}
.ws-asst__plan small,.ws-asst__steps small{grid-column:1/-1;display:block;font-size:11.5px;color:var(--fg-3)}
.ws-asst__state{font-family:var(--mono);font-size:9px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;color:var(--warning)}
.ws-asst__state.is-blocked{color:var(--critical)}
.ws-asst__state.is-validated{color:var(--blue-ink)}
.ws-asst__steps li{position:relative;padding:6px 0 6px 14px;border-bottom:1px solid var(--line);font-size:12.5px;animation:rise .3s var(--ease) both}
.ws-asst__steps li::before{content:"";position:absolute;left:0;top:13px;width:6px;height:6px;border-radius:50%;background:var(--line-2)}
.ws-asst__steps li.is-ok::before{background:var(--positive)}
.ws-asst__act:empty{display:none}
.ws-asst__act{margin-top:14px;animation:rise .35s var(--ease) both}
.ws-asst__act>p{margin:0 0 10px;max-width:62ch;font-size:12.5px;line-height:1.5;color:var(--fg-2)}
.ws-asst__ctl{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.ws-asst__ctl .ws-btn{height:32px}
.ws-asst__note{margin:10px 0 0!important;font-family:var(--mono);font-size:9.5px!important;letter-spacing:.1em;text-transform:uppercase;color:var(--blue-ink)!important}
.ws-asst__form{display:flex;gap:8px;margin-top:14px;max-width:640px}
.ws-asst__form input,.ws-talk__form input{flex:1;min-width:0;height:34px;padding:0 12px;border:1px solid var(--line-2);border-radius:6px;background:var(--ws-field);color:var(--fg);font:13.5px var(--font);outline:0;transition:border-color .2s}
.ws-asst__form input:focus,.ws-talk__form input:focus{border-color:var(--blue)}
.ws-asst__form input::placeholder,.ws-talk__form input::placeholder{color:var(--fg-3)}
.ws-asst__small{margin:8px 0 0;font-size:11.5px;line-height:1.5;color:var(--fg-3)}
.ws-asst.is-busy .ws-asst__st i{animation-duration:1.2s}
.ws-ci{border-radius:6px}
.ws-ci.is-new{animation:cinew 2.6s var(--ease)}
@keyframes cinew{0%,40%{background:color-mix(in srgb,var(--positive) 10%,transparent)}100%{background:transparent}}
/* help (webapp/templates/support.html) */
.ws-help__lede{margin:0;max-width:62ch;font-size:13.5px;line-height:1.55;color:var(--fg-2)}
.ws-help{display:flex;flex-direction:column;gap:8px;max-width:560px}
.ws-help label{font-size:12.5px;color:var(--fg-2)}
.ws-help textarea{min-height:104px;padding:10px 12px;border:1px solid var(--line-2);border-radius:6px;background:var(--ws-field);color:var(--fg);font:13.5px/1.5 var(--font);resize:vertical;outline:0;transition:border-color .2s}
.ws-help textarea:focus{border-color:var(--blue)}
.ws-help textarea::placeholder{color:var(--fg-3)}
.ws-help .ws-btn{align-self:flex-start;margin-top:4px}
/* Vire Voice: the Vire mark at the bottom right, and its panel (webapp/templates/voice.html) */
.ws-talk{position:absolute;top:62px;right:16px;bottom:16px;z-index:6;width:min(344px,calc(100% - 32px));display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-end;gap:10px;pointer-events:none}
.ws-talk>*{pointer-events:auto}
.ws-talk__btn{position:relative;flex:none;display:grid;place-items:center;width:48px;height:48px;padding:0;border:1px solid var(--line-2);border-radius:50%;background:var(--ink-1);box-shadow:0 10px 28px rgba(0,0,0,.5);cursor:pointer;transition:transform .2s var(--ease),border-color .2s}
.ws-talk__btn:hover{transform:translateY(-1px);border-color:var(--fg-3)}
.ws-talk__btn:active{transform:scale(.97)}
.ws-talk__btn:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.ws-talk__btn img{width:30px;height:auto;position:relative;z-index:1;transition:opacity .2s}
.ws-talk__ring{position:absolute;inset:-1px;border-radius:50%;border:2px solid transparent;pointer-events:none}
.ws-talk__btn[data-state=listening],.ws-talk__btn[data-state=transcribing],.ws-talk__btn[data-state=speaking]{border-color:var(--blue)}
.ws-talk__btn[data-state=listening] .ws-talk__ring{border-color:var(--blue);animation:talklisten 1.8s var(--ease) infinite}
.ws-talk__btn[data-state=transcribing] .ws-talk__ring{border-color:var(--blue);animation:talklisten .9s var(--ease) infinite}
.ws-talk__btn[data-state=processing] .ws-talk__ring{border-color:var(--line-2);border-top-color:var(--blue);animation:talkspin .9s linear infinite}
.ws-talk__btn[data-state=speaking] img{opacity:0}
.ws-talk__wave{position:absolute;display:none;gap:3px;align-items:center;height:18px}
.ws-talk__btn[data-state=speaking] .ws-talk__wave{display:flex}
.ws-talk__wave i{display:block;width:3px;height:6px;border-radius:2px;background:var(--blue-ink);animation:talkwave .9s ease-in-out infinite}
.ws-talk__wave i:nth-child(2){animation-delay:.15s}.ws-talk__wave i:nth-child(3){animation-delay:.3s}
.ws-talk__badge{position:absolute;right:-2px;top:-2px;display:none;width:12px;height:12px;border-radius:50%;border:2px solid var(--ink-1);background:var(--warning)}
.ws-talk__btn[data-state=muted]{border-color:var(--warning)}
.ws-talk__btn[data-state=muted] .ws-talk__badge{display:block}
@keyframes talklisten{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--blue) 45%,transparent)}50%{box-shadow:0 0 0 7px color-mix(in srgb,var(--blue) 0%,transparent)}}
@keyframes talkspin{to{transform:rotate(360deg)}}
@keyframes talkwave{0%,100%{height:5px}50%{height:16px}}
.ws-talk__panel{width:100%;min-height:0;display:flex;flex-direction:column;padding:14px 14px 12px;border:1px solid var(--line-2);border-radius:10px;background:var(--ink-1);box-shadow:0 24px 60px rgba(0,0,0,.55);animation:rise .35s var(--ease) both}
.ws-talk__panel[hidden]{display:none}
.ws-talk__head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.ws-talk__brand{display:flex;align-items:center;gap:8px}
.ws-talk__brand img{width:34px;height:auto}
.ws-talk__title{font-family:var(--mono);font-size:9.5px;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:var(--blue-ink)}
.ws-talk__st{margin-left:auto}
.ws-talk__min{width:26px;height:26px;display:grid;place-items:center;padding:0;border:0;border-radius:6px;background:none;color:var(--fg-2);cursor:pointer}
.ws-talk__min:hover{background:var(--ws-hover);color:var(--fg)}
.ws-talk__min svg,.ws-tc svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ws-talk__thread{flex:0 1 auto;min-height:24px;display:flex;flex-direction:column;gap:8px;overflow-y:auto;scrollbar-width:none;scroll-behavior:smooth}
.ws-talk__thread::-webkit-scrollbar{display:none}
.ws-tm{grid-template-columns:42px minmax(0,1fr);gap:8px}
.ws-tm p{font-size:12.5px}
.ws-talk__heard{margin:10px 0 0;padding:7px 10px;border-left:2px solid var(--blue);background:color-mix(in srgb,var(--fg) 4%,transparent);font-size:12.5px;font-style:italic;color:var(--fg-2)}
.ws-talk__heard[hidden]{display:none}
/* while Vire hears and answers, the phrases fold away so the panel covers less of what it points at */
.ws-talk__more{flex:none;display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s var(--ease),opacity .3s}
.ws-talk__more>div{min-height:0;overflow:hidden}
.ws-talk__panel.is-busy .ws-talk__more{grid-template-rows:0fr;opacity:0}
.ws-talk__k{margin:12px 0 0;font-family:var(--mono);font-size:9px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3)}
.ws-talk__try{flex:none;margin-top:6px}
.ws-talk__try .ws-q{font-size:11.5px;padding:5px 9px}
.ws-talk__try .ws-q:disabled{opacity:.45;cursor:default}
.ws-talk__form{flex:none;display:flex;gap:8px;margin-top:10px}
.ws-talk__form input{height:32px;font-size:13px}
.ws-talk__form .ws-btn{height:32px}
.ws-talk__ctl{flex:none;display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}
.ws-tc{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border:1px solid var(--line-2);border-radius:999px;background:none;color:var(--fg-2);font:500 12px var(--font);cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.ws-tc:hover{border-color:var(--fg-3);color:var(--fg)}
.ws-tc[aria-pressed=true]{background:var(--fg);border-color:var(--fg);color:var(--ink-1)}
.ws-tc--end{margin-left:auto}
.ws-talk__foot{flex:none;margin:8px 0 0;font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-3)}
.ws-app[data-theme="light"] .ws-talk__btn{box-shadow:0 8px 22px rgba(10,10,11,.12)}
.ws-app[data-theme="light"] .ws-talk__panel{box-shadow:0 20px 50px rgba(10,10,11,.14)}
.ws-app[data-theme="light"] .ws-asst__state{color:#a8741a}
.ws-app[data-theme="light"] .ws-asst__state.is-validated{color:var(--blue-ink)}
.ws-app[data-theme="light"] .ws-asst__state.is-blocked{color:#c2362f}
.ws-app[data-theme="light"]{--warning:#a8741a;--critical:#c2362f}
@media (prefers-reduced-motion:reduce){.ws-talk__btn .ws-talk__ring{animation:none!important}.ws-talk__btn[data-state=listening] .ws-talk__ring{box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 35%,transparent)}.ws-talk__wave i{animation:none;height:10px}}
/* advanced */
.ws-adv{border-top:1px solid var(--line)}
.ws-adv__i{border-bottom:1px solid var(--line)}
.ws-adv__i button{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:12px;width:100%;padding:14px 0;border:0;background:none;color:var(--fg);text-align:left;cursor:pointer}
.ws-adv__n{font-family:var(--mono);font-size:10px;color:var(--fg-3)}
.ws-adv__t{font-size:14.5px;font-weight:500}
.ws-adv__s{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--blue-ink)}
.ws-adv__i p{margin:0 0 14px 46px;font-size:13px;color:var(--fg-2)}
/* responsive */
@media (max-width:1100px){.ws-home{grid-template-columns:minmax(0,1fr)}.ws-asst.has-side .ws-asst__body{grid-template-columns:minmax(0,1fr)}}
@media (max-width:760px){
  .ws-app{grid-template-columns:minmax(0,1fr)}
  .ws-side{display:none}
  .ws-bar{padding:0 14px}
  .ws-bar .tag{display:none}
  .ws-talk{top:104px;right:10px;bottom:10px;width:calc(100% - 20px)}
  .ws-talk__btn{width:44px;height:44px}
  .ws-talk__btn img{width:27px}
  .ws-am{grid-template-columns:minmax(0,1fr);gap:2px}
  .ws-asst__head{flex-direction:column;gap:8px}
  .ws-mtabs{display:flex;gap:4px;padding:8px 10px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none;flex:none}
  .ws-mtabs::-webkit-scrollbar{display:none}
  .ws-mtabs button{flex:none;height:30px;padding:0 11px;border:0;border-radius:6px;background:none;color:var(--fg-2);font-size:12.5px;font-weight:500;cursor:pointer}
  .ws-mtabs button.is-on{background:var(--ws-tab-on);color:var(--fg)}
  .ws-view{padding:16px 14px 20px}
  .ws-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ws-steps li{grid-template-columns:minmax(0,1fr);gap:6px}
}

/* the six tabs not on screen are not laid out or painted until opened (the homepage built all seven at once and
   dropped frames on phones); the outgoing tab keeps its fade before it is set aside */
.ws-view:not(.is-on){content-visibility:hidden;transition:opacity .3s,transform .45s var(--ease),visibility 0s .45s,content-visibility 0s .45s;transition-behavior:allow-discrete}
.ws-view.is-on{content-visibility:visible}

/* ---------- Settings → Appearance: the light workspace (the original site's light values) ---------- */
.ws-logo--l{display:none}
.ws-app[data-theme="light"]{
  --ink-1:#ffffff; --line:#ececea; --line-2:#dcdcd8;
  --fg:#0a0a0a; --fg-2:#55555e; --fg-3:#73737c;
  --blue-ink:#0050eb; --blue-chart:#0057ff; --positive:#1a7f4e;
  --s-fg:#0a0a0a; --s-fg2:#55555e; --s-fg3:#73737c; --s-line:#ececea; --s-line2:#dcdcd8;
  --ws-side:#f7f7f5; --ws-hover:#f1f1ee; --ws-on:#ececea; --ws-tab-on:#ececea; --ws-seg-on:#ffffff; --ws-grid:#efefec;
  --ws-field:#fafaf9; --ws-q-line:#c9c9c4; --ws-stream-bg:#f7f7f5;
  --ws-seg-shadow:0 1px 2px rgba(10,10,11,.08),inset 0 0 0 1px #e4e4e0;
  color-scheme:light;
}
.ws-app[data-theme="light"] .ws-logo--d{display:none}
.ws-app[data-theme="light"] .ws-logo--l{display:block}
.ws-app[data-theme="light"] .chip--blue{background:color-mix(in srgb,var(--blue) 10%,transparent);color:var(--blue-ink)}
.ws-app[data-theme="light"] .chip--med{background:rgba(154,100,8,.1);color:#8a5a06}
.ws-app[data-theme="light"] .chip--pos{background:rgba(26,127,78,.1);color:#1a7f4e}
.ws-app[data-theme="light"] .chip--crit{background:rgba(194,54,47,.1);color:#c2362f}
.ws-app .tag{color:var(--blue-ink);border-color:color-mix(in srgb,var(--blue-ink) 34%,transparent)}
.ws-app .chip--blue{background:color-mix(in srgb,var(--blue) 14%,transparent);color:var(--blue-ink)}

/* ---------- Settings → Colours → Match my website: the business's own colour takes the accent's place.
   Only the accent changes (surfaces and text stay Vire's), and each shade is moved just far enough to stay readable
   on the theme (workspace.js V.brandVars). A black-and-white brand uses the foreground as its accent. ---------- */
.ws-app[data-palette="color"]{--blue:var(--b-fill);--blue-2:var(--b-fill);--on-blue:var(--b-on,#fff);--blue-ink:var(--b-ink-d);--blue-chart:var(--b-chart-d)}
.ws-app[data-palette="color"][data-theme="light"]{--blue-ink:var(--b-ink-l);--blue-chart:var(--b-chart-l)}
.ws-app[data-palette="mono"]{--blue:var(--fg);--blue-2:var(--fg);--on-blue:var(--ink-1);--blue-ink:var(--fg);--blue-chart:var(--b-sig-d,var(--fg))}
.ws-app[data-palette="mono"][data-theme="light"]{--blue-chart:var(--b-sig-l,var(--fg))}

/* a change of theme or colours glides; at rest nothing extra is transitioned */
.ws-app.is-theming,.ws-app.is-theming *{transition-property:background-color,border-color,color,fill,stroke,stop-color,box-shadow,opacity,transform,visibility!important;transition-duration:.6s!important;transition-timing-function:var(--ease)!important;transition-delay:0s!important}
.ws-app.is-theming .ws-logo--d,.ws-app.is-theming .ws-logo--l{transition:none!important}
/* a platform's icon as an image (its favicon or touch icon), the size of the drawn marks */
.lg--img img{width:18px;height:18px;border-radius:3px;object-fit:contain;display:block}
.asst__tile .lg--img img{width:22px;height:22px;border-radius:4px}
.works__list .lg--img img{width:18px;height:18px}
