:root { color-scheme:light; --ink:#18231f; --muted:#6d7772; --paper:#f6f5ef; --card:#fffefa; --line:#dedfd7; --accent:#23634b; --accent-soft:#dfece4; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font:15px/1.55 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
button,textarea,input { font:inherit; } a { color:inherit; }
.shell { min-height:100vh; display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:auto 1fr auto; }
.topbar { height:68px; padding:0 28px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); background:rgba(246,245,239,.92); backdrop-filter:blur(12px); position:sticky; top:0; z-index:3; }
.brand { display:flex; gap:11px; align-items:center; font-weight:730; text-decoration:none; letter-spacing:-.02em; }
.brand span,.orb { display:grid; place-items:center; background:var(--accent); color:white; border-radius:50%; }
.brand span { width:30px; height:30px; font-family:Georgia,serif; }
.top-actions { display:flex; align-items:center; gap:15px; color:var(--muted); font-size:13px; }
.top-actions form { margin:0; }
.header-actions { display:flex; align-items:center; gap:10px; }
.language-switcher { display:inline-flex; align-items:center; margin:0; padding:2px; border:1px solid var(--line); border-radius:9px; background:#ecece6; }
.language-switcher button { min-width:29px; border:0; border-radius:6px; padding:4px 6px; background:transparent; color:var(--muted); cursor:pointer; font-size:10px; font-weight:750; letter-spacing:.04em; }
.language-switcher button[aria-current="true"] { background:var(--card); color:var(--accent); box-shadow:0 1px 4px rgba(23,35,30,.1); }
.credit-pill { display:flex; align-items:center; gap:4px; padding:5px 9px; border:1px solid var(--line); border-radius:999px; background:var(--card); text-decoration:none; color:var(--muted); }
.credit-pill strong { color:var(--accent); }
.tenant-dot { width:7px; height:7px; border-radius:50%; background:#54a176; box-shadow:0 0 0 4px #dcebe2; }
.secondary,.link-button { border:1px solid var(--line); background:var(--card); padding:8px 12px; border-radius:9px; color:var(--ink); cursor:pointer; text-decoration:none; }
.conversation { width:min(780px,calc(100% - 36px)); margin:0 auto; padding:54px 0 190px; }
.empty-state { min-height:48vh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.orb { width:56px; height:56px; font:28px Georgia,serif; box-shadow:0 14px 35px #23634b33; }
.empty-state h1 { margin:22px 0 8px; font:500 clamp(28px,5vw,42px)/1.15 Georgia,serif; letter-spacing:-.035em; }
.empty-state p { max-width:570px; color:var(--muted); font-size:16px; }
.message { display:flex; align-items:flex-start; gap:12px; width:fit-content; max-width:92%; margin:0 auto 28px 0; }
.message.user { flex-direction:row-reverse; max-width:82%; margin-right:0; margin-left:auto; }
.message-body { display:flex; flex-direction:column; align-items:flex-start; min-width:0; }
.user .message-body { align-items:flex-end; }
.message-avatar { flex:0 0 40px; display:grid; place-items:center; width:40px; height:40px; margin-top:24px; overflow:hidden; border-radius:50%; font-weight:750; }
.message-avatar img { display:block; width:100%; height:100%; object-fit:cover; }
.fluid-avatar { background:var(--accent); color:#fff; box-shadow:0 7px 18px rgba(35,99,75,.22); font:21px Georgia,serif; }
.user-avatar { background:#e4e8e3; border:1px solid #d3d8d1; color:var(--accent); }
.role { padding:0 4px 6px; color:var(--muted); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.bubble { max-width:100%; border:1px solid var(--line); background:var(--card); padding:16px 19px; border-radius:5px 18px 18px 18px; box-shadow:0 6px 20px rgba(27,45,37,.04); overflow:hidden; }
.table-wrap { max-width:100%; overflow-x:auto; }
.user .bubble { background:var(--accent-soft); border-color:#c8dbcf; border-radius:18px 5px 18px 18px; }
.bubble p { margin:0; white-space:pre-wrap; } .bubble ul { margin:12px 0 0; padding-left:20px; }
.markdown-content { min-width:0; overflow-wrap:anywhere; }
.bubble .markdown-content p { white-space:normal; margin:0 0 12px; }
.bubble .markdown-content ul,.bubble .markdown-content ol { margin:0 0 12px; padding-left:24px; }
.markdown-content li > ul,.markdown-content li > ol { margin-top:6px; }
.markdown-content h1,.markdown-content h2,.markdown-content h3,.markdown-content h4,.markdown-content h5,.markdown-content h6 { margin:18px 0 8px; font-size:1.08em; line-height:1.4; }
.markdown-content h1 { font-size:1.25em; }
.markdown-content h2 { font-size:1.15em; }
.markdown-content blockquote { margin:12px 0; padding:2px 0 2px 12px; border-left:3px solid var(--accent); color:var(--muted); }
.markdown-content code { padding:2px 4px; border-radius:4px; background:#edf0eb; font-size:.9em; }
.markdown-content pre { max-width:100%; overflow:auto; margin:12px 0; padding:12px; border-radius:8px; background:#edf0eb; }
.markdown-content pre code { padding:0; background:transparent; white-space:pre; overflow-wrap:normal; }
.markdown-content a { color:var(--accent); text-underline-offset:3px; }
.markdown-content table { overflow-wrap:normal; }
.markdown-content hr { border:0; border-top:1px solid var(--line); margin:16px 0; }
.bubble .markdown-content > :first-child { margin-top:0; }
.bubble .markdown-content > :last-child,.markdown-content li > p:last-child { margin-bottom:0; }
.pending .bubble { min-width:66px; padding:17px 19px; }
.pending .fluid-avatar { animation:thinking-glow 1.5s ease-in-out infinite; }
.thinking-status { display:flex; align-items:center; min-height:9px; }
.thinking-dots { display:flex; align-items:center; gap:5px; }
.thinking-dots span { width:7px; height:7px; border-radius:50%; background:var(--accent); opacity:.28; animation:thinking-dot 1.2s ease-in-out infinite; }
.thinking-dots span:nth-child(2) { animation-delay:.14s; }
.thinking-dots span:nth-child(3) { animation-delay:.28s; }
.error .bubble { border-color:#e4b7b0; background:#fff3f0; }
@keyframes thinking-dot { 0%,60%,100% { opacity:.28; transform:translateY(0); } 30% { opacity:1; transform:translateY(-5px); } }
@keyframes thinking-glow { 0%,100% { box-shadow:0 7px 18px rgba(35,99,75,.18); } 50% { box-shadow:0 7px 22px rgba(35,99,75,.42),0 0 0 5px rgba(35,99,75,.08); } }
@media (prefers-reduced-motion:reduce) { .pending .fluid-avatar,.thinking-dots span { animation:none; } .thinking-dots span:nth-child(2) { opacity:.55; } .thinking-dots span:nth-child(3) { opacity:.82; } }
.composer { position:fixed; z-index:2; left:50%; bottom:22px; transform:translateX(-50%); width:min(780px,calc(100% - 28px)); background:var(--card); border:1px solid #d2d6cf; border-radius:20px; padding:10px 12px 5px 12px; display:grid; grid-template-columns:42px minmax(0,1fr) 42px; box-shadow:0 20px 55px rgba(25,40,34,.18); }
.composer textarea { border:0; outline:0; resize:none; min-height:42px; max-height:180px; padding:10px 10px 7px 0; background:transparent; color:var(--ink); }
.composer button { align-self:end; width:38px; height:38px; border:0; border-radius:12px; background:var(--accent); color:#fff; font-size:21px; cursor:pointer; } .composer button:disabled { opacity:.45; }
.composer-note { grid-column:1/-1; text-align:center; color:#8b938f; font-size:10px; padding:3px 0; }
table { width:100%; border-collapse:collapse; margin-top:13px; font-size:13px; } th,td { border-bottom:1px solid var(--line); padding:9px; text-align:left; }
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; margin-top:12px; } .cards section { border:1px solid var(--line); border-radius:10px; padding:12px; } .cards section p { margin-top:4px; color:var(--muted); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.inspector-shell { width:min(1160px,calc(100% - 40px)); margin:0 auto; padding:48px 0 90px; }
.inspector-head { display:flex; justify-content:space-between; align-items:start; border-bottom:1px solid var(--line); padding-bottom:28px; }
.eyebrow { color:var(--accent); font-weight:750; letter-spacing:.1em; text-transform:uppercase; font-size:11px; margin:0; } .inspector-head h1 { margin:5px 0 2px; font:500 38px Georgia,serif; } .inspector-head p { color:var(--muted); }
code { font:11px ui-monospace,SFMono-Regular,Menlo,monospace; color:#657069; overflow-wrap:anywhere; }
.inspect-section { margin-top:36px; } .inspect-section h2 { display:flex; gap:8px; align-items:center; font-size:17px; } .inspect-section h2 span { color:var(--muted); border:1px solid var(--line); padding:1px 7px; border-radius:20px; font-size:11px; }
.inspect-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:12px; } .inspect-card,.edge-row { border:1px solid var(--line); background:var(--card); border-radius:13px; padding:15px; }
.inspect-title { display:flex; flex-direction:column; gap:3px; } .inspect-card p { margin:9px 0 0; font-size:13px; } .inspect-card p span { color:var(--muted); } pre { background:#f0f1eb; padding:10px; border-radius:8px; overflow:auto; font-size:11px; }
.edge-row { display:grid; grid-template-columns:minmax(160px,.7fr) 1fr auto 1fr auto; gap:12px; align-items:center; margin-bottom:8px; } .edge-row strong { color:var(--accent); } .edge-row small,.muted { color:var(--muted); }

/* Account modal */
.auth-stage { min-height:100vh; position:relative; display:grid; place-items:center; padding:28px 18px; overflow:hidden; }
.auth-preview { position:absolute; inset:0; background:var(--paper); filter:blur(1.5px); transform:scale(1.012); }
.auth-preview header { height:68px; padding:0 28px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.preview-pills { display:flex; gap:12px; } .preview-pills i { width:72px; height:11px; border-radius:10px; background:#dfe2dc; }
.preview-center { position:absolute; inset:68px 0 120px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.preview-center h1 { margin:22px 0 8px; font:500 clamp(30px,5vw,44px)/1.15 Georgia,serif; }
.preview-center p { color:var(--muted); font-size:16px; }
.preview-composer { position:absolute; left:50%; bottom:34px; transform:translateX(-50%); width:min(780px,calc(100% - 28px)); height:76px; background:var(--card); border:1px solid var(--line); border-radius:20px; box-shadow:0 18px 40px rgba(25,40,34,.14); }
.auth-scrim { position:absolute; inset:0; background:rgba(18,29,25,.45); backdrop-filter:blur(4px); }
.auth-modal { position:relative; z-index:1; width:min(480px,100%); max-height:calc(100vh - 42px); overflow:auto; background:var(--card); border:1px solid rgba(255,255,255,.65); border-radius:24px; padding:28px 34px 32px; box-shadow:0 35px 90px rgba(12,26,20,.3); }
.auth-modal--compact { width:min(450px,100%); text-align:center; }
.auth-brand { display:flex; justify-content:center; align-items:center; gap:9px; font-weight:750; text-decoration:none; margin-bottom:24px; }
.auth-modal-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:24px; }
.auth-modal-head .auth-brand { margin:0; }
.auth-brand span { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:var(--accent); color:#fff; font-family:Georgia,serif; }
.auth-tabs { display:grid; grid-template-columns:1fr 1fr; padding:4px; background:#ecece6; border-radius:12px; margin-bottom:28px; }
.auth-tabs a { text-align:center; padding:9px; border-radius:9px; text-decoration:none; color:var(--muted); font-size:13px; font-weight:650; }
.auth-tabs a.active { color:var(--ink); background:var(--card); box-shadow:0 2px 8px rgba(23,35,30,.08); }
.auth-heading { margin-bottom:22px; } .auth-heading h1 { margin:4px 0 7px; font:500 31px/1.15 Georgia,serif; letter-spacing:-.025em; } .auth-heading>p:last-child { color:var(--muted); margin:0; }
.auth-heading.centered { text-align:center; }
.auth-form,.settings-form { display:flex; flex-direction:column; }
.auth-form label,.settings-form label { font-size:13px; font-weight:680; margin:0 0 6px; }
.auth-form label:not(:first-child),.settings-form label:not(:first-child) { margin-top:15px; }
.auth-form label small { float:right; color:var(--muted); font-weight:500; }
.auth-form input,.settings-form input { width:100%; border:1px solid #cfd4cc; border-radius:10px; padding:11px 12px; background:#fff; color:var(--ink); outline:none; }
.auth-form input:focus,.settings-form input:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(35,99,75,.12); }
.auth-form .auth-checkbox { display:flex; align-items:center; gap:9px; margin:15px 0 0; color:var(--muted); cursor:pointer; font-weight:600; }
.auth-form .auth-checkbox input { flex:0 0 auto; width:17px; height:17px; margin:0; padding:0; accent-color:var(--accent); }
.auth-form--left { text-align:left; }
.password-forgot-link { align-self:flex-end; margin-top:8px; color:var(--accent); font-size:12px; font-weight:650; text-decoration:none; }
.primary-button { margin-top:22px; border:0; background:var(--accent); color:#fff; padding:12px 16px; border-radius:10px; cursor:pointer; font-weight:700; }
.auth-foot { margin:20px 0 0; text-align:center; color:var(--muted); font-size:13px; } .auth-foot a,.text-link { color:var(--accent); font-weight:650; }
.notice { border-radius:10px; padding:11px 13px; margin:0 0 18px; font-size:13px; text-align:left; }
.notice.error { background:#fff0ed; border:1px solid #edc8c0; color:#7a3026; } .notice.success { background:#e5f1e9; border:1px solid #c2dccb; color:#285a3d; }
.notice ul { margin:0; padding-left:18px; }
.mail-icon { display:grid; place-items:center; width:56px; height:56px; margin:4px auto 20px; border-radius:50%; background:var(--accent-soft); color:var(--accent); font-size:23px; }
.full-width { width:100%; } .text-link { display:inline-block; margin-top:18px; font-size:13px; }
.inline-button { display:inline-block; box-sizing:border-box; text-align:center; text-decoration:none; }

/* Settings */
.settings-shell { min-height:100vh; }
.settings-topbar { height:68px; padding:0 28px; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--line); }
.settings-topbar form { margin:0; }
.settings-content { width:min(900px,calc(100% - 36px)); margin:0 auto; padding:54px 0 80px; }
.settings-heading { margin-bottom:30px; } .settings-heading h1 { margin:5px 0 4px; font:500 40px Georgia,serif; } .settings-heading>p:last-child { color:var(--muted); margin:0; }
.settings-grid { display:grid; grid-template-columns:.85fr 1.4fr; gap:16px; align-items:start; }
.settings-card { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:23px; }
.settings-card h2 { margin:0 0 18px; font-size:17px; }
.avatar-setting { display:flex; align-items:center; gap:16px; padding-bottom:20px; margin-bottom:19px; border-bottom:1px solid var(--line); }
.settings-avatar { flex:0 0 68px; display:grid; place-items:center; width:68px; height:68px; overflow:hidden; border:1px solid #d3d8d1; border-radius:50%; background:#e4e8e3; color:var(--accent); font-size:22px; font-weight:750; }
.settings-avatar img { display:block; width:100%; height:100%; object-fit:cover; }
.avatar-upload { min-width:0; }
.settings-form .avatar-upload .file-picker { display:block; margin:0 0 6px; }
.avatar-input { padding:0!important; border:0!important; border-radius:0!important; background:transparent!important; color:var(--muted)!important; font-size:12px; }
.avatar-input::file-selector-button { margin-right:9px; padding:7px 10px; border:1px solid var(--line); border-radius:8px; background:var(--card); color:var(--ink); font-size:12px; font-weight:600; font-family:inherit; line-height:1.2; cursor:pointer; }
.avatar-upload small { display:block; margin-top:5px; color:var(--muted); font-size:11px; }
.card-label { color:var(--muted); margin:0 0 3px; font-size:13px; }.credit-card>strong { font:500 48px Georgia,serif; color:var(--accent); }.credit-card>p:not(.card-label) { color:var(--muted); margin:3px 0 21px; }
.readonly-field { padding:11px 12px; border:1px solid var(--line); background:#f0f1eb; border-radius:10px; display:flex; justify-content:space-between; gap:12px; color:var(--muted); }
.readonly-field span { color:var(--accent); font-size:11px; font-weight:750; text-transform:uppercase; }
.transactions-card { margin-top:16px; }
.transaction-row { display:grid; grid-template-columns:1fr auto 90px; gap:18px; align-items:center; border-top:1px solid var(--line); padding:12px 0; font-size:13px; }
.transaction-row div { display:flex; flex-direction:column; } .transaction-row small { color:var(--muted); } .transaction-row>span { font-weight:750; } .transaction-row>span.positive { color:var(--accent); }
.text-button { border:0; background:transparent; padding:18px 0; color:var(--muted); text-decoration:underline; cursor:pointer; }

/* Chat history */
.history-shell { min-height:100vh; }
.history-content { width:min(760px,calc(100% - 36px)); margin:0 auto; padding:54px 0 90px; }
.history-heading { margin-bottom:30px; }
.history-heading h1 { margin:5px 0 4px; font:500 40px Georgia,serif; }
.history-heading>p:last-child { color:var(--muted); margin:0; }
.history-list { display:flex; flex-direction:column; gap:10px; }
.history-item { display:flex; align-items:center; justify-content:space-between; gap:24px; min-width:0; padding:18px 20px; border:1px solid var(--line); border-radius:15px; background:var(--card); text-decoration:none; box-shadow:0 6px 20px rgba(27,45,37,.035); transition:border-color .15s ease,transform .15s ease,box-shadow .15s ease; }
.history-item:hover { border-color:#bdc9c1; transform:translateY(-1px); box-shadow:0 10px 28px rgba(27,45,37,.07); }
.history-item>span:first-child { display:flex; flex-direction:column; min-width:0; }
.history-item strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.history-item small { margin-top:3px; color:var(--muted); }
.history-arrow { flex:0 0 auto; display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:var(--accent-soft); color:var(--accent); font-size:18px; }
.history-empty { min-height:42vh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; border:1px solid var(--line); border-radius:18px; background:var(--card); }
.history-empty h2 { margin:20px 0 4px; font:500 25px Georgia,serif; }
.history-empty p { margin:0; color:var(--muted); }

@media (max-width:680px) {
    .topbar { padding:0 10px; }.top-actions>span:not(.tenant-dot),.top-actions>a:not(.credit-pill):not(.history-link) { display:none; }.top-actions { gap:5px; }.top-actions .language-switcher button { min-width:24px; padding-inline:4px; }.credit-pill { font-size:11px; }.conversation { width:min(100% - 24px,780px); padding-top:30px; }.message { max-width:96%; gap:8px; }.message.user { max-width:90%; }.message-avatar { flex-basis:34px; width:34px; height:34px; margin-top:23px; }.fluid-avatar { font-size:18px; }.bubble { padding:13px 15px; }.role { padding-bottom:5px; }.edge-row { grid-template-columns:1fr; }.inspector-head { gap:20px; }
    .auth-stage { padding:10px; }.auth-modal { padding:22px 20px 25px; border-radius:19px; max-height:calc(100vh - 20px); }.auth-brand { margin-bottom:18px; }.auth-tabs { margin-bottom:22px; }.auth-heading h1 { font-size:28px; }
    .settings-topbar { padding:0 14px; }.settings-content { padding-top:34px; }.settings-grid { grid-template-columns:1fr; }.transaction-row { grid-template-columns:1fr auto; }.transaction-row>small { display:none; }
    .history-content { padding-top:34px; }.history-item { padding:15px 16px; }.history-arrow { width:30px; height:30px; }
}

/* Attachments share the composer without intercepting ordinary text drags. */
.composer .attachment-toggle { background:transparent; color:var(--ink); border:1px solid transparent; display:grid; place-items:center; padding:0; line-height:1; align-self:center; }
.composer .attachment-toggle:hover,.composer .attachment-toggle[aria-expanded="true"] { background:#edf0eb; border-color:var(--line); }
.composer button:focus-visible,.attachment-panel input:focus-visible,.attachment-panel select:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.attachment-panel { grid-column:1/-1; min-width:0; max-height:55vh; max-height:55dvh; overflow:auto; padding:4px 5px 16px; margin-bottom:10px; border-bottom:1px solid var(--line); }
.attachment-panel[hidden] { display:none; }
.attachment-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.composer .attachment-panel button { width:auto; height:auto; min-height:32px; padding:6px 11px; border-radius:8px; font-size:12px; }
.composer .attachment-panel .attachment-close { background:transparent; color:var(--ink); font-size:24px; padding:0 8px; }
.attachment-help { font-size:12px; color:var(--muted); line-height:1.5; margin:3px 0 14px; }
.attachment-panel label { display:block; margin-bottom:6px; font-size:12px; font-weight:650; }
.attachment-panel .ts-wrapper { margin-bottom:8px; }
.attachment-panel .ts-control { min-height:40px; border:1px solid var(--line); border-radius:8px; padding:9px 36px 9px 10px; background:var(--card); color:var(--ink); box-shadow:none; font-size:14px; line-height:20px; }
.attachment-panel .ts-control input { min-width:0; color:var(--ink); font-size:inherit; }
.attachment-panel .ts-control input:focus-visible { outline:none; }
.attachment-panel .ts-wrapper.focus .ts-control { border-color:var(--accent); box-shadow:0 0 0 2px var(--accent-soft); }
.attachment-panel .ts-control .item { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.composer .attachment-panel .ts-control .clear-button { display:grid; place-items:center; width:26px; height:26px; min-height:0; padding:0; right:6px; background:transparent; color:var(--muted); font-size:22px; line-height:1; }
.composer .attachment-panel .ts-wrapper:not(.has-items) .clear-button { visibility:hidden; }
.composer .attachment-panel .ts-wrapper.has-items .clear-button { opacity:1; }
.composer .attachment-panel .ts-control .clear-button:hover { background:var(--accent-soft); color:var(--accent); }
.attachment-entity-dropdown { z-index:10; margin:0; border:1px solid var(--line); border-radius:8px; background:var(--card); color:var(--ink); box-shadow:0 8px 24px rgba(25,40,34,.14); font-family:inherit; font-size:14px; overflow:hidden; }
.attachment-entity-dropdown .option,.attachment-entity-dropdown .no-results,.attachment-entity-dropdown .loading { padding:9px 12px; overflow-wrap:anywhere; }
.attachment-entity-dropdown .option > span,.attachment-entity-dropdown .option > small { display:block; }
.attachment-entity-dropdown .option small { margin-top:2px; color:var(--muted); font-size:11px; }
.attachment-entity-dropdown .active { background:var(--accent-soft); color:var(--ink); }
.attachment-entity-dropdown .option .highlight { display:inline; background:transparent; color:var(--accent); font-weight:650; }
.attachment-entity-dropdown .no-results,.attachment-entity-dropdown .loading { color:var(--muted); }

.attachment-upload-actions { display:flex; gap:8px; margin-top:10px; }
.composer .attachment-panel .attachment-pick,.composer .attachment-panel .attachment-remove { background:#edf0eb; color:var(--ink); }
.attachment-pending { list-style:none; padding:0; margin:8px 0; }
.attachment-pending li { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:5px 0; font-size:12px; }
.attachment-pending li span { min-width:0; overflow-wrap:anywhere; }
.attachment-feedback { margin:8px 0; font-size:12px; color:var(--accent); }
.attachment-feedback.error { color:#9d3636; }
.attachment-feedback:empty,.attachment-pending:empty { display:none; }
.composer .attachment-panel .attachment-browse { padding:0; min-height:28px; background:transparent; color:var(--accent); text-decoration:underline; text-underline-offset:3px; }
.composer .attachment-panel .attachment-browse:disabled { display:none; }
.attachment-dialog { width:min(640px,calc(100% - 28px)); max-height:80vh; max-height:80dvh; margin:auto; padding:22px; overflow:auto; border:1px solid var(--line); border-radius:20px; background:var(--card); color:var(--ink); box-shadow:0 20px 55px rgba(25,40,34,.2); }
.attachment-dialog::backdrop { background:rgba(24,35,31,.35); }
.attachment-dialog h2 { font-size:20px; margin:0; }
.attachment-dialog-entity { margin:5px 0 18px; color:var(--muted); overflow-wrap:anywhere; }
.attachment-dialog button { border:0; border-radius:8px; min-height:34px; padding:6px 12px; background:var(--accent-soft); color:var(--accent); font-size:13px; cursor:pointer; }
.attachment-dialog button:disabled { opacity:.45; }
.attachment-dialog button:focus-visible,.attachment-dialog a:focus-visible,.attachment-dialog summary:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.attachment-dialog .attachment-dialog-close { display:grid; place-items:center; width:34px; padding:0; background:transparent; color:var(--ink); font-size:24px; line-height:1; }
.attachment-dialog .attachment-dialog-close:hover { background:var(--accent-soft); }
.attachment-list { display:grid; gap:8px; }
.attachment-item { border:1px solid var(--line); border-radius:10px; padding:10px 12px; min-width:0; }
.attachment-item a { display:block; font-size:13px; font-weight:650; overflow-wrap:anywhere; }
.attachment-meta { font-size:11px; color:var(--muted); margin:4px 0; overflow-wrap:anywhere; }
.attachment-status { font-size:11px; color:var(--accent); }
.attachment-item[data-status="failed"] .attachment-status { color:#9d3636; }
.attachment-item-actions { display:flex; flex-wrap:wrap; gap:7px; margin-top:8px; }
.attachment-item details { font-size:12px; margin-top:8px; }
.attachment-item summary { cursor:pointer; color:var(--accent); }
.attachment-item details p { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.6; }
.attachment-drop-hint { display:none; pointer-events:none; }
.composer.is-file-drag { outline:2px solid var(--accent); outline-offset:4px; }
.composer.is-file-drag .attachment-drop-hint { display:grid; position:absolute; inset:0; z-index:3; place-items:center; border-radius:20px; background:rgba(239,244,235,.96); color:var(--accent); font-weight:650; }
@media (max-width:680px) {
    .attachment-panel { max-height:48vh; max-height:48dvh; }
    .attachment-panel .ts-control { font-size:16px; }
    .composer textarea { min-width:0; }
}

/* Persistent chat navigation. */
.chat-layout { --sidebar-width:270px; }
.chat-main { margin-left:var(--sidebar-width); }
.chat-main .composer { left:calc(50% + var(--sidebar-width)/2); width:min(780px,calc(100% - var(--sidebar-width) - 36px)); }
.chat-sidebar { position:fixed; inset:0 auto 0 0; z-index:5; width:var(--sidebar-width); display:flex; flex-direction:column; background:#eeeee6; border-right:1px solid var(--line); padding:0 14px 16px; }
.sidebar-heading { min-height:68px; display:flex; align-items:center; justify-content:space-between; padding:0 10px; }
.sidebar-new { margin:12px 0 10px; }
.sidebar-new button { display:flex; align-items:center; gap:10px; width:100%; text-align:left; font-weight:600; padding:11px 13px; }
.sidebar-new button:hover { background:var(--accent-soft); border-color:#c8dbcf; }
.sidebar-new button span { font-size:21px; line-height:1; color:var(--accent); }
.sidebar-search { display:flex; align-items:center; gap:8px; margin:0 0 22px; padding:7px 10px; border:1px solid var(--line); border-radius:9px; color:var(--muted); background:var(--card); }
.sidebar-search svg { flex-shrink:0; }
.sidebar-search input { width:100%; min-width:0; padding:0; border:0; outline:0; background:transparent; color:var(--ink); font-size:13px; }
.sidebar-search input::placeholder { color:var(--muted); opacity:1; }
.sidebar-search:focus-within { outline:2px solid var(--accent); outline-offset:2px; }
.sidebar-no-results { margin:6px 12px; color:var(--muted); font-size:13px; }
.sidebar-chat-row[hidden] { display:none; }
.sidebar-label { margin:0 10px 10px; color:var(--muted); font-size:11px; font-weight:650; letter-spacing:.06em; text-transform:uppercase; }
.sidebar-chats { flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; display:flex; flex-direction:column; gap:0; scrollbar-width:thin; }
.sidebar-chat { flex:1; min-width:0; display:flex; padding:6px 12px; border-radius:10px; text-decoration:none; }
.sidebar-chat-label { width:100%; min-width:0; overflow:hidden; white-space:nowrap; font-size:13px; font-weight:550; }
.sidebar-chat-title { display:inline-block; white-space:nowrap; }
.sidebar-chat.is-overflowing .sidebar-chat-label { mask-image:linear-gradient(to right,#000 calc(100% - 16px),transparent); }
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
    .sidebar-chat-row:hover .sidebar-chat.is-overflowing .sidebar-chat-title { animation:sidebar-title-scroll var(--chat-scroll-duration,3s) linear .7s both; }
}
@keyframes sidebar-title-scroll { from { transform:translateX(0); } to { transform:translateX(var(--chat-scroll-offset,0px)); } }
.sidebar-settings { display:flex; align-items:center; gap:9px; margin-top:16px; border-top:1px solid var(--line); padding:16px 10px 0; font-size:13px; text-decoration:none; }
.sidebar-settings:hover { color:var(--accent); }
.chat-heading { min-width:0; display:flex; align-items:center; gap:10px; }
.chat-main .topbar { gap:20px; }
.chat-main .top-actions { flex-shrink:0; }
.icon-button { width:38px; height:38px; flex-shrink:0; align-items:center; justify-content:center; border:0; border-radius:9px; background:transparent; color:var(--ink); cursor:pointer; }
.icon-button:hover { background:var(--accent-soft); }
.sidebar-toggle,.sidebar-close { display:none; }
.sidebar-close { font-size:26px; }
.chat-sidebar a:focus-visible,.chat-sidebar button:focus-visible,.sidebar-toggle:focus-visible { outline:2px solid var(--accent); outline-offset:-2px; }
@media (min-width:861px) and (max-width:1100px) {
    .chat-main .top-actions>span { display:none; }
}
@media (max-width:860px) {
    .chat-layout { --sidebar-width:0px; }
    .chat-sidebar { display:none; width:min(300px,calc(100% - 48px)); }
    .chat-layout.sidebar-open .chat-sidebar { display:flex; }
    .sidebar-toggle,.sidebar-close { display:flex; }
    .sidebar-backdrop:not([hidden]) { position:fixed; inset:0; z-index:4; background:rgba(24,35,31,.35); }
    body:has(.sidebar-open) { overflow:hidden; }
    .chat-main .topbar { gap:12px; }
    .chat-main .top-actions>span { display:none; }
}

/* Archiving preserves the conversation and keeps the sidebar compact. */
.sidebar-chat-row { --chat-row-background:#eeeee6; position:relative; display:flex; align-items:center; flex-shrink:0; border-radius:10px; background:var(--chat-row-background); }
.sidebar-chat-row:hover,.sidebar-chat-row:has([aria-current="page"]) { --chat-row-background:#e4e7dd; }
.sidebar-archive-form { position:absolute; right:3px; top:50%; transform:translateY(-50%); z-index:1; margin:0; padding-left:12px; background:linear-gradient(to right,transparent,var(--chat-row-background) 12px); border-radius:0 7px 7px 0; opacity:0; pointer-events:none; }
.sidebar-archive-button { display:grid; place-items:center; width:28px; height:28px; padding:0; border:0; border-radius:7px; color:var(--muted); background:transparent; cursor:pointer; }
.sidebar-chat-row:hover .sidebar-archive-form,.sidebar-chat-row:focus-within .sidebar-archive-form { opacity:1; pointer-events:auto; }
@media (hover:none) { .sidebar-archive-form { opacity:1; pointer-events:auto; } }
.sidebar-archive-button:hover { color:var(--ink); }
.sidebar-archive-link { display:flex; align-items:center; gap:9px; margin-top:16px; padding:8px 10px; border-radius:9px; font-size:13px; text-decoration:none; }
.sidebar-archive-link:hover { background:var(--accent-soft); }
.sidebar-archive-link svg { flex-shrink:0; }
.sidebar-archive-link + .sidebar-settings { margin-top:4px; }
.history-row { display:flex; align-items:center; gap:10px; min-width:0; }
.history-row .history-item { flex:1; }
.history-row form { flex-shrink:0; }
.archive-back { display:inline-block; margin-bottom:24px; color:var(--muted); text-decoration:none; font-size:13px; }
.archived-notice { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:28px; padding:12px 14px; border:1px solid var(--line); border-radius:12px; color:var(--muted); font-size:13px; }
.archived-notice form { flex-shrink:0; }
@media (max-width:480px) {
    .history-row { flex-wrap:wrap; padding-bottom:10px; }
    .history-row .history-item { flex-basis:100%; }
    .archived-notice { flex-wrap:wrap; }
}