/* VectorXS 0.4.1: a quiet workspace around a responsive, floating Vector. */
:root {
  --bg:#faf9f6;
  --surface:#fffefa;
  --sidebar:#f0efeb;
  --surface-2:#eeede7;
  --ink:#292d2b;
  --muted:#62675f;
  --subtle:#6e736c;
  --line:#dddcd4;
  --accent:#426753;
  --accent-hover:#335340;
  --accent-soft:#e8eee7;
  --accent-ink:#fff;
  --focus:#426753;
  --brand:#426753;
  --brand-ink:#fff;
  --nav-bg:#f0efeb;
  --nav-ink:#30352f;
  --nav-muted:#62675f;
  --nav-line:#d9dbd2;
  --nav-hover:#e7e8e0;
  --nav-selected:#dfe4d9;
  --void-near:rgba(196,209,211,.38);
  --void-far:rgba(228,232,222,.18);
  --void-line:rgba(94,117,119,.18);
  --option-hover:#f0f2eb;
}
:root[data-theme=dark] {
  --bg:#222321;
  --surface:#2c2e2b;
  --sidebar:#1b1d1b;
  --surface-2:#343731;
  --ink:#eeeee7;
  --muted:#b6bbb0;
  --subtle:#a4ac9e;
  --line:#41463d;
  --accent:#b2c9ad;
  --accent-hover:#cbdcc5;
  --accent-soft:#354232;
  --accent-ink:#1c281c;
  --focus:#b2c9ad;
  --brand:#b2c9ad;
  --brand-ink:#1c281c;
  --nav-bg:#1b1d1b;
  --nav-ink:#eeeee7;
  --nav-muted:#b6bbb0;
  --nav-line:#353b32;
  --nav-hover:#2c302a;
  --nav-selected:#343c30;
  --void-near:rgba(103,128,137,.17);
  --void-far:rgba(55,65,61,.08);
  --void-line:rgba(158,187,185,.15);
  --option-hover:#30372e;
}
input,textarea { caret-color:var(--accent) }
.app-shell { grid-template-columns:248px minmax(0,1fr) }
.app-sidebar { padding-inline:14px; scrollbar-color:var(--nav-line) transparent }
.sidebar-brand { min-height:64px; padding-inline:10px }
.sidebar-brand .vx-symbol { color:var(--accent); width:23px; height:23px; flex-basis:23px }
.sidebar-brand .wordmark-text { font-size:20px }
.workspace-switch { background:transparent; min-height:52px; padding:8px; border-color:var(--nav-line); margin-bottom:15px }
.workspace-switch strong { font-size:.8rem }
.workspace-switch small { font-size:.7rem }
.workspace-switch .workspace-avatar { background:var(--nav-selected); color:var(--nav-ink) }
.sidebar-compose { justify-content:flex-start; min-height:38px; padding:8px 12px; margin-bottom:14px; color:var(--nav-ink); background:transparent; border:1px solid var(--nav-line); font-size:.83rem }
.primary-nav { gap:2px }
.nav-item { color:var(--nav-muted); font-size:.82rem; min-height:36px; padding:7px 12px }
.nav-item.active { background:var(--nav-selected); color:var(--nav-ink) }
.nav-active-dot { display:none }
/* Only conversation rows scroll; section controls stay visible. */
.sidebar-conversations {
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:105px;
  max-height:none;
  overflow:hidden;
  padding-top:22px;
}
.sidebar-conversations > .section-header { flex:0 0 auto }
#conversation-list {
  flex:1 1 auto;
  min-height:0;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior-y:contain;
  scrollbar-width:thin;
  scrollbar-color:var(--nav-line) transparent;
}
.sidebar-section .section-header { margin-bottom:8px; padding-inline:11px }
.app-sidebar .quiet-label { font-size:.73rem; font-weight:550 }
.conversation-row { min-height:38px; gap:0; position:relative; border-radius:8px }
.conversation-row.selected { background:var(--nav-selected) }
.conversation-open { display:flex; align-items:center; gap:8px; min-height:38px; padding:9px 10px; font-size:.82rem; line-height:1.4; text-decoration:none; color:var(--nav-ink); border-radius:8px }
.conversation-open span { flex:1; min-width:0 }
.conversation-open>.icon { width:13px; height:13px; flex:none; color:var(--nav-muted) }
.conversation-more.icon-button { flex:0 0 30px; width:30px; min-width:30px; height:30px; min-height:30px; padding:6px; margin-right:3px; border:0; border-radius:6px; background:transparent; color:var(--nav-muted) }
.conversation-more .icon { width:18px; height:18px }
.conversation-row.is-loading { opacity:.6 }
.conversation-row.is-loading .conversation-open { cursor:progress }
.sidebar-bottom { padding-top:8px; padding-bottom:16px }
.profile-row { padding-top:14px }
.profile-row .avatar { background:var(--nav-selected); color:var(--nav-ink) }
.profile-row strong { font-size:.78rem }
.profile-row small { font-size:.68rem }
.topbar { border-bottom:0; min-height:58px; padding:9px 30px }
.topbar-location { font-size:.79rem }
.topbar-search { background:transparent; border-color:transparent; font-size:.73rem }
.topbar-search kbd { background:var(--surface-2) }
.chat-subbar { padding:7px 32px; min-height:39px; font-size:.77rem; color:var(--muted) }
.model-label { font-size:.69rem }
.messages { padding:24px 36px 32px; gap:32px }
.messages>* { width:min(100%,760px) }
.welcome { margin-block:auto; padding:12px 0 0 }
.welcome-heading { text-align:center; padding-inline:12px }
.welcome h1 { font:400 2.25rem/1.2 Georgia,"Times New Roman",serif; letter-spacing:-.025em }
.welcome p { font-size:.85rem; line-height:1.5; margin-top:12px; color:var(--muted) }
.assistant-orbit { display:grid; grid-template-columns:minmax(0,1fr) 230px minmax(0,1fr); grid-template-rows:1fr 1fr; align-items:center; column-gap:10px; position:relative; isolation:isolate; min-height:265px; margin:8px auto 0; max-width:740px }
.assistant-atmosphere { position:absolute; inset:-20px -15px -8px; z-index:-1; pointer-events:none; background:radial-gradient(ellipse at 50% 49%,var(--void-near) 0%,var(--void-far) 38%,transparent 68%) }
.assistant-atmosphere::before,.assistant-atmosphere::after { content:""; position:absolute; left:50%; top:50%; width:310px; height:144px; margin:-72px 0 0 -155px; border:1px solid var(--void-line); border-radius:50%; transform:rotate(-18deg); mask-image:linear-gradient(90deg,transparent,#000 35%,#000 65%,transparent) }
.assistant-atmosphere::after { width:405px; height:185px; margin:-92px 0 0 -202px; opacity:.5; transform:rotate(18deg) }
.vx-core--chat { grid-column:2; grid-row:1 / 3; align-self:center; justify-self:center; width:230px; height:265px; flex:initial; background:transparent; border-radius:0; overflow:visible }
.vx-core--chat .vx-core-canvas { inset:0; overflow:visible }
.vx-core--chat .vx-core-controls { display:flex; bottom:2px; gap:5px }
.vx-core--chat [data-core-explode] { display:none }
.vx-core--chat .core-pause { background:transparent; border:0; color:var(--muted); min-height:32px; height:32px; min-width:32px; padding:7px; opacity:.7 }
.vx-core--chat .core-pause:hover,.vx-core--chat .core-pause:focus-visible { opacity:1 }
.vx-core--chat .vx-core-fallback { inset:28% 30% 32% }
.orbit-option { display:flex; align-items:center; gap:11px; width:100%; min-height:68px; padding:12px 10px; border:1px solid transparent; border-radius:12px; text-align:left; color:var(--ink); background:transparent; position:relative; z-index:2; transition:background-color var(--fast),border-color var(--fast),transform var(--fast) var(--ease-out) }
.orbit-option>span { flex:1; min-width:0 }
.orbit-option strong { display:block; font-size:.82rem; font-weight:550; line-height:1.4 }
.orbit-option small { display:block; margin-top:3px; font-size:.7rem; line-height:1.5; color:var(--muted) }
.orbit-option>.icon:first-child { width:18px; height:18px; flex:none; color:var(--accent) }
.orbit-option>.icon:last-child { width:13px; height:13px; color:var(--muted); opacity:0; transform:translateX(-3px); transition:opacity var(--fast),transform var(--fast) var(--ease-out) }
.orbit-option:focus-visible { background:var(--option-hover) }
.orbit-option:focus-visible>.icon:last-child { opacity:1; transform:none }
.orbit-option--knowledge { grid-column:1; grid-row:1; align-self:end; margin-bottom:14px }
.orbit-option--read { grid-column:1; grid-row:2; align-self:start; margin-top:14px }
.orbit-option--write { grid-column:3; grid-row:1; align-self:end; margin-bottom:14px }
.orbit-option--explore { grid-column:3; grid-row:2; align-self:start; margin-top:14px }
.composer-dock { width:min(100%,836px); padding:10px 30px calc(16px + env(safe-area-inset-bottom,0px)) }
.chat-workspace:has(.welcome) .composer-dock { margin-bottom:max(25px,calc((100dvh - 760px)/2)) }
.composer { border-radius:20px; padding:17px 17px 11px; border-color:var(--line); background:var(--surface); box-shadow:none }
.composer:focus-within { border-color:var(--accent) }
.composer textarea { font-size:.96rem; min-height:60px; padding:3px 5px 10px }
.composer-actions { padding-top:3px }
.composer-actions .icon-button { border-radius:50% }
.composer-scope { font-size:.7rem }
.send-button { border-radius:50%; width:36px; height:36px; min-height:36px; padding:8px }
.send-button:disabled { background:var(--surface-2); color:var(--muted); opacity:1 }
.composer-note { font-size:.67rem; margin-top:10px }
.message { font-size:1rem }
.answer-prose { font-size:.98rem; line-height:1.8 }
.message-user .message-body { background:var(--surface-2); border:0; border-radius:18px; padding:12px 18px }
.message-assistant .message-label::before { background:var(--accent) }
.message-assistant .message-body { max-width:72ch }
.messages[aria-busy=true] { cursor:progress }
.conversation-loading { color:var(--muted); padding-block:20px; font-size:.85rem }
.home-hero { background:var(--surface-2); color:var(--ink) }
.home-hero-copy>p,.starter-links a,.core-caption { color:var(--muted) }
.home-composer { background:var(--surface); border-color:var(--line) }
.home-composer textarea { color:var(--ink) }
.home-composer textarea::placeholder,.home-composer>div>span { color:var(--muted) }
.home-hero h2 { font-family:Georgia,"Times New Roman",serif; font-weight:400 }
.home-hero .core-control { color:var(--ink); border-color:var(--line); background:var(--surface) }
.home-hero .core-control[aria-pressed=true] { background:var(--accent-soft) }
.auth-story { background:var(--surface-2); color:var(--ink) }
.auth-story .wordmark { color:var(--ink) }
.auth-story .vx-symbol,.auth-value .icon { color:var(--accent) }
.auth-story-content>p,.auth-value span,.auth-story-footer { color:var(--muted) }
.auth-story .core-control { background:var(--surface); border-color:var(--line); color:var(--ink) }
.auth-form-wrap h2 { font:400 2rem/1.2 Georgia,"Times New Roman",serif }
.auth-form-wrap .account-form { display:flex; flex-direction:column; gap:20px; margin-top:28px }
.auth-form-wrap .account-form label { display:flex; flex-direction:column; gap:8px; font-size:.81rem }
.auth-form-wrap .label-row { display:flex; align-items:center; justify-content:space-between; gap:12px }
.auth-form-wrap p { color:var(--muted); margin-top:12px; font-size:.86rem }
.auth-form-wrap .auth-switch { margin-top:24px; font-size:.79rem }
@media (hover:hover) and (pointer:fine) {
  .primary:hover,.send-button:hover { background:var(--accent-hover); color:var(--accent-ink) }
  .app-sidebar .icon-button:hover,.nav-item:hover,.conversation-row:hover,.sidebar-compose:hover { background:var(--nav-hover); color:var(--nav-ink) }
  .conversation-row.selected:hover { background:var(--nav-selected) }
  .conversation-more { opacity:0 }
  .conversation-row:hover .conversation-more,.conversation-row:focus-within .conversation-more { opacity:1 }
  .orbit-option:hover { background:var(--option-hover); border-color:var(--line); transform:translateY(-2px) }
  .orbit-option:hover>.icon:last-child { opacity:1; transform:none }
}
@media (max-width:1150px) and (min-width:761px) {
  .app-shell { grid-template-columns:224px minmax(0,1fr) }
  .assistant-orbit { grid-template-columns:minmax(0,1fr) 180px minmax(0,1fr); column-gap:0 }
  .vx-core--chat { width:200px }
  .orbit-option { padding-inline:6px; gap:7px }
  .orbit-option>.icon:last-child { display:none }
  .orbit-option strong { font-size:.78rem }
  .orbit-option small { font-size:.67rem }
}
@media (max-width:760px) {
  .app-shell { grid-template-columns:minmax(0,1fr) }
  .app-sidebar { width:min(294px,calc(100vw - 44px)) }
  .app-sidebar .nav-item { min-height:44px }
  .topbar { padding-inline:14px; min-height:56px }
  .chat-subbar { padding:4px 18px; min-height:34px }
  .messages { padding:12px 18px 18px; gap:28px }
  .welcome { padding:6px 0 0 }
  .welcome-heading { padding:0 }
  .welcome h1 { font-size:1.8rem; letter-spacing:-.03em }
  .welcome p { font-size:.77rem; margin-top:9px }
  .assistant-orbit { grid-template-columns:1fr 1fr; grid-template-rows:150px auto auto; gap:8px; margin-top:8px; min-height:0; width:100% }
  .assistant-atmosphere { inset:-25px -10px 96px }
  .assistant-atmosphere::before { width:240px; height:90px; margin:-45px 0 0 -120px }
  .assistant-atmosphere::after { width:300px; height:110px; margin:-55px 0 0 -150px }
  .vx-core--chat { grid-column:1 / -1; grid-row:1; width:200px; height:175px }
  .vx-core--chat .vx-core-controls { bottom:2px; left:auto; right:7px }
  .orbit-option { min-height:58px; padding:9px 10px; gap:8px; margin:0; align-self:stretch; border-color:var(--line); border-radius:10px; background:var(--surface) }
  .orbit-option strong { font-size:.75rem }
  .orbit-option small { font-size:.65rem }
  .orbit-option>.icon:first-child { width:16px; height:16px }
  .orbit-option>.icon:last-child { display:none }
  .orbit-option--knowledge { grid-column:1; grid-row:2 }
  .orbit-option--write { grid-column:2; grid-row:2 }
  .orbit-option--read { grid-column:1; grid-row:3 }
  .orbit-option--explore { grid-column:2; grid-row:3 }
  .composer-dock { padding:8px 14px calc(10px + env(safe-area-inset-bottom,0px)) }
  .chat-workspace:has(.welcome) .composer-dock { margin-bottom:0 }
  .composer { padding:13px 11px 9px; border-radius:18px }
  .composer textarea { font-size:1rem; min-height:49px }
  .composer-note { font-size:.6rem; margin-top:9px }
  .send-button { width:40px; height:40px; min-height:40px }
  .conversation-open { min-height:44px; font-size:.86rem }
  .conversation-more.icon-button { width:40px; height:40px; min-height:40px; flex-basis:40px; opacity:1 }
  .sidebar-conversations { min-height:105px }
  .vx-core--chat .core-pause { width:44px; height:44px }
  .answer-prose { font-size:.94rem }
}
@media (prefers-reduced-motion:reduce) {
  .orbit-option,.orbit-option>.icon:last-child { transform:none!important; transition:background-color var(--fast),opacity var(--fast) }
}
html[data-motion=reduced] .orbit-option,html[data-motion=reduced] .orbit-option>.icon:last-child { transform:none!important }
@media (prefers-contrast:more) {
  .orbit-option { border-color:var(--ink) }
  .assistant-atmosphere { display:none }
}