:root {
  color-scheme: dark;
  --bg: #212121;
  --rail: #171717;
  --surface: #2b2b2b;
  --surface-2: #303030;
  --surface-3: #383838;
  --line: #343434;
  --line-strong: #484848;
  --ink: #ececec;
  --ink-2: #c8c8c8;
  --muted: #9a9a9a;
  --faint: #737373;
  --accent: #ececec;
  --accent-soft: #303030;
  --gradient: linear-gradient(118deg, #ececec, #bdbdbd);
  --warn: #d5ae6b;
  --bad: #e38d84;
  --f-ui: "Geist", Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-mono: "Geist Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;
  --r-sm: 9px;
  --r: 13px;
  --rail-width: 258px;
  --answer-width: 768px;
  --ease: cubic-bezier(.2,.7,.1,1);
}

* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; min-height: 100%; margin: 0; }
body { overflow: hidden; background: var(--bg); color: var(--ink); font: 15px/1.55 var(--f-ui); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
button, input, select, textarea { color: inherit; font: inherit; }
button { cursor: pointer; }
svg { display: block; }
kbd { color: #8b8b8b; font: 11px var(--f-mono); }
code, pre { font-family: var(--f-mono); }
a { color: inherit; }
:focus-visible { outline: 2px solid #9a91e8; outline-offset: 2px; border-radius: 7px; }
.hidden { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.shell { display: grid; grid-template-columns: var(--rail-width) minmax(0,1fr); height: 100dvh; }
.rail { display: flex; flex-direction: column; gap: 17px; min-height: 0; padding: 15px 12px 12px; background: var(--rail); border-right: 1px solid #262626; z-index: 30; }
.rail-head { display: flex; align-items: center; justify-content: space-between; padding: 4px 8px 7px; }
.brand { display: inline-flex; align-items: center; gap: 9px; color: var(--ink); text-decoration: none; font-size: 19px; font-weight: 400; letter-spacing: -.035em; }
.brand-mark { width: 25px; height: 25px; flex: 0 0 25px; }
.icon-btn { display: inline-grid; width: 36px; height: 36px; place-items: center; border: 0; border-radius: 9px; background: transparent; color: var(--muted); }
.icon-btn:hover { background: var(--surface-3); color: var(--ink); }
.icon-btn svg, .new-btn svg, .rail-link svg, .ghost-btn svg, .decide svg, .pb-pill svg, .menu-btn svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.icon-btn.rail-close, .icon-btn.menu-btn { display: none; }
.new-btn { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 11px; border: 1px solid #3a3a3a; border-radius: 11px; background: transparent; color: var(--ink-2); text-align: left; font-size: 13px; transition: background .15s,border-color .15s; }
.new-btn:hover { border-color: #505050; background: #222; }
.new-btn svg { width: 16px; height: 16px; color: #c8c2f6; }
.new-btn kbd { margin-left: auto; }
.rail-section { display: flex; flex: 1; flex-direction: column; min-height: 0; }
.rail-row { display: flex; align-items: center; justify-content: space-between; padding: 5px 8px 7px; }
.rail-section h6 { margin: 0; color: #929292; font: 550 11px/1.2 var(--f-ui); letter-spacing: .01em; }
.link-btn { padding: 2px; border: 0; background: none; color: var(--muted); font-size: 11px; }
.link-btn:hover { color: var(--ink); }
.history { flex: 1; overflow: auto; margin: 0; padding: 0; list-style: none; scrollbar-width: thin; scrollbar-color: #444 transparent; }
.history li button { display: flex; align-items: center; gap: 9px; width: 100%; padding: 8px; overflow: hidden; border: 0; border-radius: 8px; background: transparent; color: #b9b9b9; text-align: left; font-size: 12px; }
.history li button:hover, .history li button[aria-current=true] { background: #252525; color: var(--ink); }
.history .dot { display: none; }
.h-q { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.h-empty { padding: 8px; color: #757575; font-size: 12px; }
.rail-foot { display: grid; gap: 2px; padding-top: 9px; border-top: 1px solid #2a2a2a; }
.rail-link { display: flex; align-items: center; gap: 10px; padding: 8px 9px; border: 0; border-radius: 8px; background: transparent; color: #b8b8b8; text-align: left; font-size: 13px; }
.rail-link:hover { background: #252525; color: var(--ink); }
.rail-link svg { width: 15px; height: 15px; color: #8e8e8e; }
.scrim { display: none; }

.stage { position: relative; display: flex; flex-direction: column; min-width: 0; min-height: 0; background: var(--bg); }
.stage:has(.empty:not(.hidden))::before { position: absolute; z-index: 0; inset: 54px 0 0; background: linear-gradient(180deg,rgba(33,33,33,.48),rgba(33,33,33,.57) 42%,#212121 92%),url("./assets/zearch-horizon.jpg") center 47%/cover no-repeat; content: ""; pointer-events: none; }
.stage-top { position: relative; z-index: 2; display: flex; flex: 0 0 54px; align-items: center; gap: 10px; height: 54px; padding: 0 21px; background: rgba(33,33,33,.94); }
.crumbs { display: flex; min-width: 0; align-items: center; gap: 8px; color: #aaa; font-size: 13px; }
.crumbs em { color: #626262; font-style: normal; }
.crumbs b { overflow: hidden; max-width: min(48vw,560px); color: #d5d5d5; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.top-actions { display: flex; gap: 8px; margin-left: auto; }
.ghost-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 7px 11px; border: 1px solid #454545; border-radius: 9px; background: transparent; color: #c5c5c5; font-size: 12px; }
.ghost-btn:hover { background: #303030; color: var(--ink); }
.ghost-btn svg { width: 15px; height: 15px; }

.feed { flex: 1; min-height: 0; overflow: auto; padding: 0 24px; scroll-behavior: smooth; scrollbar-color: #484848 transparent; scrollbar-width: thin; }
.empty { position: relative; isolation: isolate; display: flex; width: min(100%, var(--answer-width)); min-height: 100%; flex-direction: column; align-items: stretch; justify-content: center; gap: 15px; margin: 0 auto; padding: 28px 0 38px; text-align: center; animation: rise .32s var(--ease) both; }
.feed { position: relative; z-index: 1; }
.welcome-copy { margin: 0 0 3px; }
.empty h1 { margin: 0; color: #ededed; font-size: clamp(25px,3.2vw,31px); line-height: 1.2; font-weight: 520; letter-spacing: -.04em; }
.lede { margin: 9px auto 0; color: #9e9e9e; font-size: 14px; }

.composer { width: 100%; padding: 12px 14px 10px; border: 1px solid transparent; border-radius: 21px; background: linear-gradient(#2b2b2b,#2b2b2b) padding-box,linear-gradient(120deg,#665f99,#494750 42%,#52697a) border-box; box-shadow: 0 5px 25px #0002; transition: box-shadow .18s,border-color .18s; text-align: left; }
.composer:focus-within { box-shadow: 0 5px 28px #0004,0 0 0 1px #a69de322; }
.composer textarea { display: block; width: 100%; min-height: 34px; max-height: 180px; resize: none; padding: 1px 2px 9px; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: 15px; line-height: 1.55; }
.composer textarea::placeholder { color: #a3a3a3; }
.composer-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.composer-tools { display: flex; min-width: 0; align-items: center; gap: 13px; }
.pb-pill { position: relative; display: flex; align-items: center; color: #c6c6c6; }
.pb-pill select { max-width: 190px; appearance: none; padding: 5px 22px 5px 4px; border: 0; outline-offset: 1px; background: transparent; color: #c6c6c6; cursor: pointer; font-size: 12px; }
.pb-pill select option { background: #2c2c2c; color: #eee; }
.pb-pill svg { position: absolute; right: 3px; width: 13px; height: 13px; color: #909090; pointer-events: none; }
.gate-hint { overflow: hidden; color: #858585; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.decide { position: relative; display: inline-grid; width: 36px; height: 36px; flex: 0 0 36px; place-items: center; border: 0; border-radius: 50%; background: var(--gradient); color: #151515; box-shadow: 0 2px 9px #9189d933; transition: filter .15s,transform .15s; }
.decide:hover { filter: brightness(1.08); transform: translateY(-1px); }
.decide:active { transform: scale(.96); }
.decide:disabled { background: #484848; color: #9b9b9b; box-shadow: none; cursor: not-allowed; }
.decide svg { width: 18px; height: 18px; stroke-width: 2; }
.decide span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.fineprint { margin: 5px 0 0; color: #777; text-align: center; font-size: 10px; }
.home-composer { margin-top: 2px; }
.home-fineprint { margin-top: -8px; }
.starters { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; margin-top: 6px; text-align: left; }
.starter { display: flex; min-height: 94px; flex-direction: column; justify-content: flex-start; gap: 6px; padding: 12px; border: 1px solid #3b3b3b; border-radius: 15px; background: #252525; color: #dedede; text-align: left; transition: border-color .16s,background .16s,transform .16s; animation: rise .35s var(--ease) both; }
.starter:hover { transform: translateY(-1px); border-color: #5b5872; background: #2a292e; }
.starter-label { color: #e5e5e5; font-size: 12px; font-weight: 540; }
.starter-prompt { display: -webkit-box; overflow: hidden; color: #929292; font-size: 11px; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

.dock { flex: 0 0 auto; padding: 0 24px 15px; background: linear-gradient(180deg,rgba(33,33,33,0),var(--bg) 16%); }
.dock-inner { width: min(100%,var(--answer-width)); margin: 0 auto; }
.dock-inner:empty { display: none; }
.dock .composer { display: block; }
.dock .fineprint { margin-top: 7px; }
.thread { width: min(100%,var(--answer-width)); margin: 0 auto; padding: 24px 0 25px; }
.turn { margin: 0 0 38px; animation: rise .3s var(--ease) both; }
.user-message { display: flex; justify-content: flex-end; margin: 0 0 27px; }
.user-bubble { max-width: min(82%,600px); padding: 10px 16px; border: 1px solid #383838; border-radius: 20px; background: #303030; color: #ededed; font-size: 15px; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
.assistant-message { min-width: 0; }
.assistant-brand { display: flex; align-items: center; gap: 9px; margin: 0 0 13px; color: #e5e5e5; font-size: 13px; font-weight: 560; }
.assistant-brand > span:first-child { font-family: "Instrument Serif", Georgia, serif; font-size: 17px; font-weight: 400; letter-spacing: -.025em; }
.answer-label { margin-left: 2px; color: #858585; font-size: 11px; font-weight: 400; }
.answer-pick { margin: 0 0 5px; color: #f0f0f0; font-size: 19px; font-weight: 560; letter-spacing: -.025em; }
.answer-summary { margin: 0; color: #d0d0d0; font-size: 15px; line-height: 1.72; }
.detail-summary { width: min(100%,500px); margin-top: 15px; padding: 11px 13px; border: 1px solid #383838; border-radius: 12px; background: #252525; }
.confidence-line { display: flex; align-items: center; gap: 10px; color: #aaa; font-size: 11px; }
.gate { display: inline-flex; align-items: center; gap: 6px; text-transform: capitalize; }
.gate i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.gate-act { color: #92c8b1; }.gate-review { color: #d8b876; }.gate-abstain { color: #de938a; }
.confidence-track { position: relative; height: 4px; margin-top: 10px; border-radius: 99px; background: #414141; }
.confidence-track i { display: block; height: 100%; border-radius: inherit; background: var(--gradient); }
.confidence-track b { position: absolute; top: -3px; width: 1px; height: 10px; background: #d7d7d7; }
.source-block { margin-top: 21px; }
.source-heading { display: flex; align-items: center; gap: 8px; margin-bottom: 9px; color: #c9c9c9; font-size: 12px; font-weight: 520; }
.source-heading span:last-child { display: inline-grid; min-width: 19px; height: 19px; place-items: center; border: 1px solid #3d3d3d; border-radius: 6px; color: #959595; font-size: 10px; }
.source-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.source-link { display: inline-flex; max-width: min(100%,245px); min-width: 0; align-items: center; gap: 7px; padding: 6px 9px; overflow: hidden; border: 1px solid #3b3b3b; border-radius: 9px; background: #292929; color: #c7c7c7; text-decoration: none; font-size: 11px; }
.source-link:hover { border-color: #615d7b; background: #303035; }
.source-number { display: grid; width: 16px; height: 16px; flex: 0 0 16px; place-items: center; border-radius: 5px; background: #3a3a3a; color: #aaa; font: 9px var(--f-mono); }
.source-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.more-sources { margin-top: 9px; }
.more-sources summary, .reasoning summary, .raw-state summary { color: #a1a1a1; cursor: pointer; font-size: 11px; list-style-position: inside; }
.more-sources summary:hover, .reasoning summary:hover, .raw-state summary:hover { color: #e0e0e0; }
.source-list { display: grid; gap: 6px; margin: 9px 0 0; padding: 0; list-style: none; }
.source-list li { display: grid; grid-template-columns:minmax(0,auto) 1fr; align-items: center; gap: 4px 9px; padding: 9px; border: 1px solid #353535; border-radius: 10px; background: #252525; }
.source-list .source-link { max-width: 100%; grid-column: 1/-1; justify-self: start; }
.source-domain { color: #8d8d8d; font-size: 10px; }
.source-list p { grid-column: 1/-1; margin: 0; color: #aaa; font-size: 11px; line-height: 1.5; }
.no-src { margin: 15px 0; color: #999; font-size: 12px; }
.reasoning { width: min(100%,620px); margin-top: 17px; padding-top: 11px; border-top: 1px solid #373737; }
.reasoning summary { list-style-position: outside; }
.reasoning-body { display: grid; gap: 13px; padding: 13px 0 0; }
.detail-checks { display: flex; flex-wrap: wrap; gap: 7px; }
.detail-checks span { padding: 5px 8px; border: 1px solid #3a3a3a; border-radius: 7px; color: #aaa; font-size: 10px; }
.typed-answers { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.typed-answers h3 { grid-column: 1/-1; margin: 0; color: #aaa; font-size: 11px; font-weight: 500; }
.q { min-width: 0; padding: 11px; border: 1px solid #393939; border-radius: 10px; background: #262626; }
.q-top { display: flex; justify-content: space-between; gap: 8px; color: #898989; font: 10px var(--f-mono); }
.q-type { text-transform: uppercase; letter-spacing: .06em; }
.q-pick { margin: 8px 0 3px; color: #e4e4e4; font-size: 13px; font-weight: 550; }
.q-ins { margin: 0 0 9px; color: #929292; font-size: 10px; line-height: 1.4; }
.opt { display: grid; grid-template-columns:minmax(56px,84px) minmax(20px,1fr) 30px; align-items: center; gap: 7px; margin: 6px 0; font-size: 10px; }
.opt-name { overflow: hidden; color: #aaa; text-overflow: ellipsis; white-space: nowrap; }
.opt.on .opt-name { color: #eee; font-weight: 550; }
.opt-bar { height: 4px; overflow: hidden; border-radius: 8px; background: #414141; }
.opt-bar i { display: block; width: 0; height: 100%; border-radius: inherit; background: #777; transition: width .55s var(--ease); }
.opt.on .opt-bar i { background: var(--gradient); }
.opt-p { color: #929292; text-align: right; font: 9px var(--f-mono); }
.raw-state { padding-top: 8px; border-top: 1px solid #383838; }
.raw-state pre { overflow: auto; max-height: 300px; margin: 9px 0 0; color: #aaa; font-size: 10px; white-space: pre-wrap; }
.runtime-note,.warn { color: #888; font-size: 10px; }
.warn { color: var(--warn); }
.turn-actions { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 12px; }
.text-action { padding: 5px 8px; border: 0; border-radius: 7px; background: transparent; color: #8f8f8f; font-size: 10px; }
.text-action:hover { background: #303030; color: #ddd; }
.pending-status { display: flex; align-items: center; gap: 9px; margin: 10px 0 0; color: #aaa; font-size: 13px; }
.pending-status i { width: 7px; height: 7px; border-radius: 50%; background: #aaa2e4; animation: pulse 1.3s ease-in-out infinite; }
.skel { height: 78px; margin-top: 14px; border-radius: 12px; background: linear-gradient(90deg,#2a2a2a 25%,#323232 37%,#2a2a2a 63%); background-size: 400% 100%; animation: shimmer 1.3s ease infinite; }
.err { margin-top: 15px; padding: 12px 14px; border: 1px solid #68413d; border-radius: 10px; background: #332725; color: #e0a39b; font-size: 12px; }

.sheet { width: min(520px,calc(100vw - 24px)); max-height: min(86dvh,780px); padding: 0; border: 1px solid #454545; border-radius: 16px; background: #252525; color: var(--ink); box-shadow: 0 22px 80px #0009; }
.sheet::backdrop { background: #0009; backdrop-filter: blur(2px); }
.sheet-body { display: flex; flex-direction: column; gap: 10px; padding: 22px; }
.sheet-body header { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 8px; }
.sheet-body h2 { margin: 0; font-size: 19px; font-weight: 560; letter-spacing: -.025em; }
.sheet-body h2 em { color: #b0a9ec; font-style: normal; }
.sheet-body label { margin-top: 5px; color: #c0c0c0; font-size: 12px; font-weight: 520; }
.muted { color: #858585; }
.sheet-body select, .sheet-body input:not([type=range]) { width: 100%; padding: 10px 11px; border: 1px solid #484848; border-radius: 9px; background: #303030; color: #eee; font-size: 12px; }
.sheet-body select option { background: #292929; }
.sheet-body input[type=range] { width: 100%; accent-color: #aaa1e8; }
.hint, .thesis p { margin: 0; color: #aaa; font-size: 12px; line-height: 1.6; }
.row-split { display: flex; justify-content: flex-end; }
.sheet-body footer { display: flex; justify-content: flex-end; gap: 9px; margin-top: 12px; }
.solid-btn { padding: 8px 13px; border: 0; border-radius: 9px; background: var(--gradient); color: #181818; font-size: 12px; font-weight: 600; }
.thesis { max-height: 86dvh; overflow: auto; }
.thesis dl { display: grid; grid-template-columns: 90px 1fr; gap: 10px; margin: 7px 0 0; font-size: 12px; }
.thesis dt { color: #d4d4d4; font-weight: 550; }
.thesis dd { margin: 0; color: #999; line-height: 1.5; }
.toast { position: fixed; z-index: 80; bottom: 23px; left: 50%; transform: translate(-50%,10px); padding: 9px 13px; border: 1px solid #464646; border-radius: 10px; background: #303030; color: #ddd; box-shadow: 0 8px 30px #0006; font-size: 11px; opacity: 0; pointer-events: none; transition: opacity .2s,transform .2s; }
.toast.show { transform: translate(-50%,0); opacity: 1; }

@keyframes rise { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes shimmer { to { background-position: -100% 0; } }
@keyframes pulse { 50% { opacity: .4; } }
@media (max-width:900px) { :root { --rail-width: 236px; } .stage-top { padding-inline: 17px; } .feed { padding-inline: 18px; } .dock { padding-inline: 18px; } }
@media (max-width:680px) {
  .shell { grid-template-columns: minmax(0,1fr); }
  .rail { position: fixed; inset: 0 auto 0 0; width: min(300px,86vw); transform: translateX(-102%); transition: transform .24s var(--ease); box-shadow: 12px 0 40px #0008; }
  .rail-open .rail { transform: translateX(0); }
  .rail-open .scrim { position: fixed; z-index: 20; inset: 0; display: block; background: #0009; }
  .icon-btn.menu-btn, .icon-btn.rail-close { display: inline-grid; }
  .stage-top { height: 50px; flex-basis: 50px; gap: 7px; padding: 0 10px; }
  .crumbs { font-size: 12px; }.crumbs b { max-width: 55vw; }
  .feed { padding: 0 15px; }
  .empty { gap: 13px; padding: 25px 0 max(25px,env(safe-area-inset-bottom)); }
  .empty h1 { font-size: 25px; }
  .lede { font-size: 12px; }
  .starters { grid-template-columns: 1fr; gap: 7px; margin-top: 3px; }
  .starter { min-height: 58px; padding: 9px 11px; }
  .starter-prompt { -webkit-line-clamp: 1; }
  .dock { padding: 0 11px max(10px,env(safe-area-inset-bottom)); }
  .dock .composer { border-radius: 17px; }
  .composer textarea { font-size: 16px; }
  .gate-hint { display: none; }
  .thread { padding-top: 17px; }
  .user-message { margin-bottom: 22px; }
  .user-bubble { max-width: 92%; padding: 9px 13px; font-size: 14px; }
  .answer-summary { font-size: 14px; }
  .detail-summary { width: 100%; }
  .typed-answers { grid-template-columns: 1fr; }
  .typed-answers h3 { grid-column: auto; }
  .source-link { max-width: 100%; }
}
@media (max-height:650px) and (min-width:681px) { .empty { gap: 10px; padding-block: 14px; }.starter { min-height: 72px; } }
@media (prefers-reduced-motion:reduce) { *,*:before,*:after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

/* Approved Zearch identity — 2026-09-27. */
.stage:has(.empty:not(.hidden))::before { filter: grayscale(1); }
:focus-visible { outline-color: #c8c8c8; }
.new-btn svg, .sheet-body h2 em { color: #c8c8c8; }
.composer { background: linear-gradient(#2b2b2b,#2b2b2b) padding-box,linear-gradient(120deg,#666,#494949 42%,#777) border-box; }
.composer:focus-within { box-shadow: 0 5px 28px #0004,0 0 0 1px #ffffff22; }
.decide { box-shadow: none; }
.starter:hover, .source-link:hover { border-color: #666; background: #303030; }
.pending-status i { background: #ccc; }
.sheet-body input[type=range] { accent-color: #ccc; }
.assistant-brand > span:first-child { font-family: var(--f-ui); font-size: 15px; font-weight: 400; letter-spacing: -.025em; }