:root {
  --bg: #0a0d0c; --panel: #101413; --panel-2: #171c1a; --line: #252c29;
  --text: #f0f4f2; --muted: #8d9994; --accent: #54e2ad; --accent-2: #2fb986;
  --danger: #ff7a86; --shadow: 0 24px 70px rgba(0,0,0,.42);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--bg); color: var(--text); }
body { min-height: 100vh; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
.hidden { display: none !important; }
.login-shell { min-height: 100vh; display: grid; place-items: center; padding: 24px; background:
  radial-gradient(circle at 20% 10%, rgba(84,226,173,.13), transparent 30%),
  radial-gradient(circle at 85% 90%, rgba(47,185,134,.08), transparent 35%), var(--bg); }
.login-card { width: min(420px, 100%); padding: 44px; border: 1px solid var(--line); border-radius: 24px;
  background: rgba(16,20,19,.9); box-shadow: var(--shadow); backdrop-filter: blur(18px); }
.brand-mark { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 15px; color: #07110d;
  background: linear-gradient(145deg, #7cf3c6, #35c991); font-weight: 900; box-shadow: 0 10px 30px rgba(84,226,173,.2); }
.brand-mark.small { width: 32px; height: 32px; border-radius: 10px; font-size: 14px; }
.eyebrow { margin: 28px 0 8px; color: var(--accent); font-size: 11px; letter-spacing: .18em; font-weight: 750; }
h1 { margin: 0; font-size: 32px; letter-spacing: -.03em; }
.muted { color: var(--muted); margin: 10px 0 28px; }
label { display: grid; gap: 8px; margin: 16px 0; color: #c8d0cc; font-size: 14px; }
input, textarea { width: 100%; border: 1px solid var(--line); color: var(--text); background: #0d1110; outline: none;
  border-radius: 12px; padding: 13px 14px; transition: border-color .16s, box-shadow .16s; }
input:focus, textarea:focus { border-color: var(--accent-2); box-shadow: 0 0 0 3px rgba(84,226,173,.1); }
.primary { border: 0; border-radius: 11px; padding: 11px 16px; font-weight: 750; color: #07100d; background: var(--accent); }
.primary:hover { background: #73ecc0; }
.wide { width: 100%; margin-top: 8px; padding: 13px; }
.error { min-height: 20px; color: var(--danger); font-size: 13px; }
.app-shell { min-height: 100vh; display: grid; grid-template-columns: 290px 1fr; }
.sidebar { position: relative; z-index: 4; min-width: 0; height: 100vh; display: grid; grid-template-rows: auto auto auto auto 1fr auto;
  background: var(--panel); border-right: 1px solid var(--line); }
.sidebar-head { display: flex; justify-content: space-between; align-items: center; padding: 20px; }
.brand-line { display: flex; align-items: center; gap: 11px; letter-spacing: -.01em; }
.transfer-entry { margin:0 14px 10px; padding:11px 12px; display:flex; align-items:center; gap:10px; border:1px solid #315446; border-radius:11px; color:var(--text); background:rgba(84,226,173,.06); text-align:left; }
.transfer-entry>span:first-child { width:28px; height:28px; display:grid; place-items:center; border-radius:8px; color:#07110d; background:var(--accent); font-weight:900; }
.transfer-entry>span:last-child { display:grid; gap:1px; }.transfer-entry small { color:var(--muted); font-size:10px; }.transfer-entry.active { box-shadow:inset 0 0 0 1px var(--accent); background:rgba(84,226,173,.12); }
.new-chat-form { display: grid; grid-template-columns: 1fr auto; gap: 8px; padding: 4px 14px 16px; }
.new-chat-form input { grid-column: 1 / -1; min-width: 0; padding: 10px 11px; }
.new-chat-form select { min-width:0; padding:9px 10px; border:1px solid var(--line); border-radius:9px; color:var(--text); background:var(--panel-2); }
.conversation-tools { display:grid; gap:8px; padding:0 12px 10px; }
.conversation-tools input { padding:9px 10px; border-radius:9px; }
.filter-tabs { display:flex; gap:6px; }
.filter-tabs button { flex:1; padding:7px; border:1px solid var(--line); border-radius:8px; color:var(--muted); background:transparent; }
.filter-tabs button.active { color:var(--accent); border-color:#315446; background:rgba(84,226,173,.06); }
.conversation-list { overflow-y: auto; padding: 0 10px 16px; }
.conversation-row { position: relative; display: grid; grid-template-columns: 1fr 28px; align-items: center; border-radius: 11px; margin: 3px 0; }
.conversation-row:hover, .conversation-row.active { background: var(--panel-2); }
.conversation-row.active { box-shadow: inset 2px 0 var(--accent); }
.conversation-button, .delete-button, .text-button, .icon { border: 0; color: inherit; background: transparent; }
.conversation-button { min-width: 0; text-align: left; display: flex; justify-content: space-between; gap: 8px; padding: 11px 8px 11px 12px; }
.conversation-button span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.conversation-button small { flex: 0 0 auto; color: var(--muted); }
.conversation-button .title-wrap { min-width:0; display:grid; gap:2px; }
.conversation-button .tags { max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#6f8d81; font-size:10px; }
.favorite-mark { color:#f5c85b; margin-right:5px; }
.delete-button { opacity: 0; color: var(--muted); font-size: 20px; padding: 2px; }
.conversation-row:hover .delete-button, .conversation-row.active .delete-button { opacity: 1; }
.delete-button:hover { color: var(--danger); }
.list-empty { padding: 20px; color: var(--muted); text-align: center; }
.account-box { display: flex; justify-content: space-between; align-items: center; padding: 17px 20px; border-top: 1px solid var(--line); color: #c9d0cd; font-size: 14px; }
.account-details { min-width: 0; max-width: 145px; display: grid; gap: 5px; }
#reserveText, #wakeStatus { white-space: normal; overflow-wrap: anywhere; }
#wakeDesktopButton { padding: 6px; font-size: 12px; }
.quota-text { display: block; max-width: 145px; overflow: hidden; color: var(--muted); font-size: 11px; line-height: 1.35; white-space: nowrap; text-overflow: ellipsis; }
.account-actions { display: grid; justify-items: end; gap: 5px; }
.account-actions .text-button { padding: 2px 0; font-size: 12px; }
.account-actions .prominent { color: var(--accent); font-weight: 700; }
.role-badge,.user-role-badge { display:inline-block; padding:2px 6px; border:1px solid #315446; border-radius:999px; color:var(--accent); background:rgba(84,226,173,.07); font-size:10px; font-weight:750; vertical-align:middle; }
.role-badge.normal,.user-role-badge.normal { border-color:var(--line); color:var(--muted); background:transparent; }
.status-dot { display: inline-block; width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 12px var(--accent); }
.text-button { color: var(--muted); }.text-button:hover, .account-actions .prominent:hover { color: var(--text); }
.chat-panel { height: 100vh; min-width: 0; display: grid; grid-template-rows: auto 1fr auto; background:
  radial-gradient(circle at 70% 0%, rgba(84,226,173,.045), transparent 26%), var(--bg); }
.transfer-panel { height:100vh; min-width:0; overflow:hidden; display:grid; grid-template-rows:auto 1fr; background:radial-gradient(circle at 70% 0%,rgba(84,226,173,.045),transparent 26%),var(--bg); }
.transfer-head .head-action { margin-left:auto; }.transfer-content { overflow-y:auto; padding:28px clamp(18px,4vw,54px) 60px; }
.transfer-overview { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-bottom:18px; }
.speed-test-panel { margin-bottom:18px; padding:18px; border:1px solid var(--line); border-radius:15px; background:var(--panel); }
.speed-head { display:flex; justify-content:space-between; align-items:center; gap:14px; }.speed-results { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 16px; }
.speed-results span { padding:9px 11px; border-radius:9px; color:var(--muted); background:#0d1110; font-size:12px; }.speed-results span.testing { color:#f5c85b; }.speed-results span.done { color:var(--accent); }.speed-results span.failed { color:var(--danger); }
.node-card { display:grid; gap:7px; padding:16px 18px; border:1px solid var(--line); border-radius:14px; background:var(--panel); }
.node-card span { color:var(--muted); font-size:13px; }.node-card.unavailable { border-color:#63333a; }.node-card.unavailable span { color:var(--danger); }
.transfer-actions-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.transfer-card { display:grid; align-content:start; gap:12px; padding:22px; border:1px solid var(--line); border-radius:17px; background:var(--panel); }
.transfer-card h3,.transfer-list-section h3 { margin:0; font-size:17px; }.transfer-card .eyebrow { margin:0 0 5px; }.compact-note { margin:5px 0 0; font-size:12px; }
.transfer-card label { margin:0; }.transfer-card select { width:100%; padding:11px; border:1px solid var(--line); border-radius:10px; color:var(--text); background:#0d1110; }
.file-picker-row,.batch-actions { display:flex; flex-wrap:wrap; gap:8px; }.file-picker-row button,.batch-actions button { padding:9px 11px; border:1px solid #315446; border-radius:9px; color:var(--accent); background:rgba(84,226,173,.05); }.transfer-selection { max-height:110px; overflow:auto; padding:9px 11px; border:1px solid var(--line); border-radius:9px; color:var(--muted); font-size:12px; white-space:pre-line; }
.transfer-live { display:grid; grid-template-columns:1fr auto; align-items:center; gap:10px; color:var(--muted); font-size:12px; }.transfer-live progress { width:100%; accent-color:var(--accent); }
.transfer-list-section { margin-top:22px; padding:22px; border:1px solid var(--line); border-radius:17px; background:var(--panel); }.transfer-list-head p { margin:5px 0 16px; color:var(--muted); font-size:12px; }
.transfer-list-head { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; }.transfer-folder { border:1px solid var(--line); border-radius:12px; background:#0b0f0e; }.transfer-folder>summary { cursor:pointer; padding:14px; color:var(--text); font-weight:700; }.transfer-folder-files { display:grid; gap:8px; padding:0 10px 10px; }.transfer-select { width:18px; height:18px; accent-color:var(--accent); flex:0 0 auto; }.transfer-item.selectable { grid-template-columns:auto minmax(0,1fr) auto; }
.transfer-list { display:grid; gap:10px; }.transfer-item { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:14px; align-items:center; padding:14px; border:1px solid var(--line); border-radius:12px; background:#0d1110; }
.transfer-file-info { min-width:0; display:grid; gap:6px; }.transfer-file-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.transfer-meta { display:flex; flex-wrap:wrap; gap:6px 12px; color:var(--muted); font-size:11px; }.transfer-status { color:var(--accent); }.transfer-status.failed { color:var(--danger); }
.share-meta { color:#f5c85b; }
.transfer-progress { width:min(420px,100%); height:5px; border:0; accent-color:var(--accent); }.transfer-item-actions { display:flex; flex-wrap:wrap; gap:7px; justify-content:flex-end; }.transfer-item-actions a,.transfer-item-actions button { padding:8px 11px; border:1px solid #315446; border-radius:9px; color:var(--accent); background:rgba(84,226,173,.05); text-decoration:none; }.transfer-item-actions .danger { color:var(--danger); border-color:#63333a; background:transparent; }
.chat-head { min-height: 78px; display: flex; align-items: center; gap: 12px; padding: 15px 28px; border-bottom: 1px solid rgba(37,44,41,.7); }
.chat-head h2 { margin: 0; font-size: 17px; font-weight: 700; }
  .model-controls { margin-left: auto; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.head-action { padding:7px 9px; border:1px solid var(--line); border-radius:9px; color:var(--muted); background:var(--panel-2); }
.head-action.active { color:#f5c85b; border-color:#66552d; }
.model-controls label { margin: 0; display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 12px; }
.model-controls select { max-width: 190px; border: 1px solid var(--line); border-radius: 9px; padding: 7px 9px; color: var(--text); background: var(--panel-2); }
.model-controls .toggle-control { display: inline-flex; cursor: pointer; padding: 7px 9px; border: 1px solid var(--line); border-radius: 9px; background: var(--panel-2); white-space: nowrap; }
.model-controls .toggle-control input { appearance: none; width: 25px; height: 14px; margin: 0; padding: 0; border: 0; border-radius: 999px; background: #3a423f; box-shadow: none; position: relative; }
.model-controls .toggle-control input::after { content: ''; position: absolute; top: 2px; left: 2px; width: 10px; height: 10px; border-radius: 50%; background: #aeb8b4; transition: transform .15s; }
.model-controls .toggle-control input:checked { background: var(--accent-2); }
.model-controls .toggle-control input:checked::after { transform: translateX(11px); background: #07110d; }
.model-controls .toggle-control input:disabled { opacity: .35; cursor: not-allowed; }
.label-preview { margin: 5px 0 0; color: var(--muted); font: 12px ui-monospace, SFMono-Regular, Consolas, monospace; }
.empty-state { grid-row: 2; align-self: center; justify-self: center; text-align: center; color: var(--muted); }
.empty-state h2 { color: var(--text); margin: 22px 0 8px; }
.orb { width: 70px; height: 70px; margin: auto; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #9af8d5, #35c991 45%, #163d2e 72%);
  box-shadow: 0 0 80px rgba(84,226,173,.2); }
.messages { grid-row: 2; overflow-y: auto; padding: 32px max(24px, calc((100% - 860px)/2)) 140px; }
.message { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 14px; margin: 0 0 26px; }
.message.user { margin-left: clamp(0px, 7vw, 80px); }
.avatar { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 10px; background: var(--panel-2); color: var(--muted); font-weight: 800; font-size: 12px; }
.message.assistant .avatar { color: #07110d; border: 0; background: var(--accent); }
.message-body { min-width: 0; padding: 5px 0; line-height: 1.7; overflow-wrap: anywhere; color: #e5ebe8; }
.message.user .message-text { white-space:pre-wrap; }
.message-text > :first-child { margin-top:0; }.message-text > :last-child { margin-bottom:0; }
.message-text p,.message-text ul,.message-text ol,.message-text blockquote,.message-text pre,.message-text table { margin:0 0 13px; }
.message-text h1,.message-text h2,.message-text h3,.message-text h4 { margin:22px 0 9px; line-height:1.3; color:#f5faf7; scroll-margin-top:90px; }
.message-text h1 { font-size:1.45rem; }.message-text h2 { font-size:1.25rem; }.message-text h3 { font-size:1.08rem; }
.message-text ul,.message-text ol { padding-left:25px; }.message-text li+li { margin-top:4px; }
.message-text blockquote { padding:8px 13px; border-left:3px solid var(--accent-2); color:#b9c8c2; background:rgba(84,226,173,.04); }
.message-text a { color:#71e5bb; text-decoration-thickness:1px; text-underline-offset:3px; }
.message-text img { display:block; max-width:min(100%,720px); max-height:560px; margin:12px 0; border:1px solid var(--line); border-radius:12px; object-fit:contain; background:#fff; }
.message-text table { display:block; max-width:100%; overflow:auto; border-collapse:collapse; }
.message-text th,.message-text td { padding:7px 10px; border:1px solid #35403c; text-align:left; }.message-text th { background:var(--panel-2); }
.message-text code:not(pre code) { padding:2px 5px; border-radius:5px; color:#a8f2d3; background:#17201d; }
.code-block { position:relative; margin:0 0 13px; }.code-block pre { margin:0; padding-top:38px; border:1px solid var(--line); border-radius:11px; overflow:auto; background:#0b0f0e; }
.copy-code { position:absolute; z-index:1; top:7px; right:7px; padding:4px 8px; border:1px solid var(--line); border-radius:6px; color:var(--muted); background:#171c1a; font-size:11px; }
.message-toc { margin:0 0 15px; border:1px solid var(--line); border-radius:10px; background:rgba(255,255,255,.018); }.message-toc summary { padding:8px 11px; cursor:pointer; color:var(--accent); }.message-toc ol { margin:0; padding:0 14px 10px 32px; font-size:12px; }
.source-cards { display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin-top:14px; }.source-cards>strong { width:100%; color:var(--muted); font-size:11px; }.source-card { max-width:100%; padding:7px 10px; border:1px solid #315446; border-radius:8px; color:#bcebd8; background:rgba(84,226,173,.045); text-decoration:none; font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.message-actions { display:flex; flex-wrap:wrap; gap:7px; margin-top:12px; }.message-actions button { padding:5px 8px; border:1px solid var(--line); border-radius:7px; color:var(--muted); background:transparent; font-size:11px; }.message-actions button:hover { color:var(--text); border-color:#41504a; }
.message.pending { opacity: .58; }
.composer { grid-row: 3; position: relative; width: min(860px, calc(100% - 40px)); justify-self: center; margin: 0 auto 24px;
  background: rgba(16,20,19,.95); border: 1px solid #303a36; border-radius: 18px; box-shadow: 0 18px 50px rgba(0,0,0,.35); }
.composer textarea { resize: none; min-height: 58px; max-height: 180px; border: 0; background: transparent; padding: 18px 62px 16px 54px; box-shadow: none; line-height: 1.5; }
.attach-button { position: absolute; left: 10px; bottom: 11px; width: 36px; height: 36px; border: 0; border-radius: 11px; color: var(--accent); background: var(--panel-2); font-size: 24px; }
.attachment-list { display: flex; flex-wrap: wrap; gap: 7px; padding: 10px 12px 0; }
.file-chip { border: 1px solid var(--line); border-radius: 10px; padding: 6px 10px; color: #cfe1da; background: var(--panel-2); font-size: 12px; text-align:left; }
.file-chip small { display:block; margin-top:2px; color:var(--muted); font-size:10px; }.file-chip.uploading { border-color:#315446; }
.progress-panel { padding: 12px 16px; border-bottom: 1px solid var(--line); color: var(--accent); font-size: 13px; }
.progress-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.stop-button { padding:6px 10px; border:1px solid #70413e; border-radius:8px; color:#ffaaa2; background:rgba(255,100,90,.08); }
.streaming-text { margin-top:10px; padding:10px 12px; max-height:180px; overflow:auto; border-left:2px solid var(--accent); color:var(--text); white-space:pre-wrap; overflow-wrap:anywhere; }
.progress-steps { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; color: var(--muted); font-size: 12px; }
.progress-steps .completed { color: #8da69c; }.progress-steps .inProgress { color: var(--accent); }
.activity-details { margin-top: 12px; border: 1px solid var(--line); border-radius: 11px; background: rgba(255,255,255,.018); overflow: hidden; white-space: normal; }
.activity-details.live { margin-top: 10px; background: #0d1110; }
.activity-details summary { cursor: pointer; padding: 8px 11px; color: #aebbb6; font-size: 12px; user-select: none; list-style-position: inside; }
.activity-details[open] summary { border-bottom: 1px solid var(--line); color: var(--accent); }
.activity-list { display: grid; gap: 0; padding: 5px 10px; }
.activity-item { display: grid; grid-template-columns: 20px minmax(0,1fr); gap: 7px; padding: 7px 2px; color: #cbd5d1; font-size: 12px; }
.activity-item + .activity-item { border-top: 1px solid rgba(37,44,41,.7); }
.activity-icon { color: var(--accent); font-weight: 800; text-align: center; }
.activity-item.pending { color: var(--muted); }.activity-item.failed .activity-icon { color: var(--danger); }
.activity-item strong { display: block; font-size: 12px; font-weight: 650; }
.activity-item p { margin: 3px 0 0; color: var(--muted); line-height: 1.5; overflow-wrap: anywhere; }
.artifact-list { display: grid; gap: 8px; margin-top: 12px; }
.uploaded-files { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.uploaded-file { max-width: 100%; padding: 7px 10px; border: 1px solid var(--line); border-radius: 9px; color: #b9c8c2; background: var(--panel-2); font-size: 12px; overflow-wrap: anywhere; }
.artifact-row { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.artifact-thumb { width:112px; height:82px; border:1px solid var(--line); border-radius:9px; object-fit:cover; background:#fff; }
.artifact-thumb { cursor:zoom-in; transition:transform .15s,border-color .15s; }.artifact-thumb:hover { transform:translateY(-2px); border-color:var(--accent-2); }
.artifact-card { width: fit-content; max-width: 100%; padding: 9px 12px; border: 1px solid #315446; border-radius: 10px; color: var(--accent); background: rgba(84,226,173,.06); text-decoration: none; }
.artifact-card:hover { background: rgba(84,226,173,.12); }
.artifact-action { padding:7px 9px; border:1px solid var(--line); border-radius:8px; color:var(--muted); background:var(--panel-2); font-size:12px; }
.modal { width:min(680px,calc(100vw - 28px)); max-height:82vh; padding:0; border:1px solid var(--line); border-radius:15px; color:var(--text); background:var(--panel); box-shadow:var(--shadow); }
.preview-modal { width:min(1180px,calc(100vw - 24px)); height:min(90vh,900px); max-height:90vh; overflow:hidden; }
.preview-head { min-height:62px; }.preview-head>div { min-width:0; }.preview-head h3 { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }.preview-meta { display:block; margin-top:3px; color:var(--muted); }
.preview-toolbar { min-height:44px; display:flex; align-items:center; flex-wrap:wrap; gap:7px; padding:7px 12px; border-bottom:1px solid var(--line); background:#0d1110; }
.preview-toolbar button,.preview-toolbar a { padding:6px 9px; border:1px solid var(--line); border-radius:7px; color:#bdc9c4; background:var(--panel-2); text-decoration:none; font-size:12px; }
.preview-toolbar a:last-child { margin-left:auto; color:var(--accent); }.preview-control-group { display:flex; gap:6px; }
.preview-stage { position:relative; height:calc(100% - 107px); min-height:320px; display:grid; place-items:center; overflow:auto; background:#151918; }
.preview-stage iframe { width:100%; height:100%; border:0; background:#fff; }.preview-stage audio { width:min(720px,calc(100% - 40px)); }
.preview-stage .preview-image { max-width:100%; max-height:100%; object-fit:contain; transform-origin:center; transition:transform .14s; }
.preview-loading,.preview-error { color:var(--muted); }.preview-error { max-width:520px; padding:24px; text-align:center; }
.wide-modal { width:min(900px,calc(100vw - 28px)); }
.modal::backdrop { background:rgba(0,0,0,.72); }
.modal-head { display:flex; align-items:center; justify-content:space-between; padding:14px 18px; border-bottom:1px solid var(--line); }
.modal-head h3 { margin:0; }.modal-body { padding:16px 18px; overflow:auto; max-height:70vh; }.modal-body h4 { margin:20px 0 8px; }
.version-row,.admin-user,.audit-row { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 0; border-bottom:1px solid var(--line); }
.version-actions,.admin-actions { display:flex; flex-wrap:wrap; gap:6px; }
.admin-form { display:grid; grid-template-columns:1fr 1fr auto auto; align-items:center; gap:8px; }
.admin-form input { padding:9px; border-radius:8px; }.admin-form label { margin:0; display:flex; align-items:center; }.admin-form label input { width:auto; }
.admin-identity { display:flex; align-items:center; flex-wrap:wrap; gap:7px; }.current-account-mark { color:var(--muted); font-size:11px; }
.compact-note { margin:4px 0 8px; font-size:12px; }
.audit-row { display:block; font-size:12px; }.audit-row small { color:var(--muted); }.audit-row p { margin:4px 0 0; overflow-wrap:anywhere; }
.send-button { position: absolute; right: 10px; bottom: 10px; width: 38px; height: 38px; border: 0; border-radius: 12px; color: #07110d; background: var(--accent); font-size: 20px; font-weight: 800; }
.send-button:disabled { cursor: wait; opacity: .4; }
.toast { position: fixed; z-index: 10; left: 50%; bottom: 24px; translate: -50% 0; padding: 11px 16px; color: var(--text); background: #202724; border: 1px solid #37423e; border-radius: 11px; box-shadow: var(--shadow); }
.mobile-only { display: none; }.icon { font-size: 21px; padding: 6px; }
.model-pill { padding:8px 12px; border:1px solid var(--line); border-radius:20px; background:var(--panel-2); color:var(--text); font-size:13px; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.compact-dialog { width:min(420px,calc(100vw - 24px)); max-height:85dvh; }
.compact-dialog::backdrop { background:rgba(0,0,0,.5); }
.compact-fields { border:0; margin:0; padding:16px; min-width:0; }
.compact-fields label { margin:10px 0 6px; font-size:13px; }
.compact-fields select { width:100%; padding:10px; border:1px solid var(--line); border-radius:10px; background:var(--panel-2); color:var(--text); font-size:16px; }
.compact-fields select[hidden] { display:none; }
.compact-fields input[type=range] { width:100%; min-height:40px; padding:0; accent-color:var(--accent); }
.compact-fields output { color:var(--accent); }
.control-help { margin:6px 0 14px; color:var(--muted); font-size:12px; line-height:1.6; }
.compact-fields .compact-toggle { display:flex; align-items:center; gap:10px; }
.compact-toggle input { width:18px; height:18px; accent-color:var(--accent); }
.plus-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:10px 0; }
.plus-grid button { text-align:left; padding:12px; border:1px solid var(--line); border-radius:10px; color:var(--text); background:var(--panel-2); font-size:13px; }
.plus-grid small { display:block; margin-top:5px; font-size:11px; color:var(--muted); }
.compact-fields summary { cursor:pointer; padding:12px 0; font-size:13px; }
.backdrop { position: fixed; z-index: 3; inset: 0; background: rgba(0,0,0,.55); }
@media (max-width: 760px) {
  .app-shell { display: block; }.mobile-only { display: block; }
  .sidebar { position: fixed; inset: 0 auto 0 0; width: min(86vw, 320px); transform: translateX(-105%); transition: transform .2s ease; box-shadow: var(--shadow); }
  .sidebar.open { transform: translateX(0); }.chat-panel,.transfer-panel { height: 100dvh; }
  .chat-head { padding: 13px 16px; min-height: 68px; }.messages { padding: 24px 16px 120px; }
  .chat-panel>.chat-head { flex-wrap:nowrap; gap:8px; padding:10px 12px; min-height:56px; }
  .chat-panel>.chat-head>div:not(.model-controls) { flex:1; min-width:0; }
  .chat-panel>.chat-head h2 { font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .chat-panel #conversationLabel { display:none; }
  .model-controls { width:auto; max-width:62%; gap:0; flex-wrap:nowrap; }
  .model-pill { font-size:12px; padding:8px 10px; }
  .compact-dialog { margin:auto auto 12px; border-radius:18px; }
  .model-controls label:not(.toggle-control) { flex: 1 1 125px; min-width: 0; display: grid; gap: 4px; font-size: 12px; }
  .model-controls select { width: 100%; max-width: none; min-width: 0; min-height: 40px; font-size: 16px; }
  .head-action { padding:6px; font-size:11px; }.admin-form { grid-template-columns:1fr; }
  .model-controls .toggle-control { padding: 8px; }.model-controls .toggle-control span { display: inline; }
  .message.user { margin-left: 20px; }.composer { width: calc(100% - 24px); margin-bottom: 12px; }
  .login-card { padding: 30px 24px; }
  .transfer-content { padding:18px 12px 40px; }.transfer-overview,.transfer-actions-grid,.speed-results { grid-template-columns:1fr; }.transfer-card,.transfer-list-section { padding:16px; }.transfer-list-head { display:grid; }.transfer-item,.transfer-item.selectable { grid-template-columns:1fr; }.transfer-item-actions { justify-content:flex-start; }
  .preview-modal { width:100vw; max-width:none; height:100dvh; max-height:none; border:0; border-radius:0; }.preview-toolbar a:last-child { margin-left:0; }.preview-stage { height:calc(100% - 145px); }
}
/* Use the browser's visible viewport, including toolbar and keyboard changes. */
:root { --app-height:100dvh; --app-top:0px; }
html,body { height:100%; min-height:0; overflow:hidden; }
.login-shell { height:var(--app-height); min-height:0; overflow:auto; }
.app-shell { position:fixed; top:var(--app-top); left:0; width:100%; height:var(--app-height); min-height:0; overflow:hidden; grid-template-columns:290px minmax(0,1fr); }
.chat-panel,.transfer-panel,.sidebar { height:100%; min-height:0; }
.chat-panel { grid-template-columns:minmax(0,1fr); grid-template-rows:auto minmax(0,1fr) auto; overflow:hidden; }
.transfer-panel { grid-template-columns:minmax(0,1fr); grid-template-rows:auto minmax(0,1fr); }
.chat-head { min-width:0; }
.sidebar { grid-template-rows:auto auto auto auto minmax(0,1fr) auto; overflow:hidden; }
.chat-head>div:not(.model-controls) { min-width:0; flex:1; }
.chat-head h2,.label-preview { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }
.model-controls { flex-shrink:0; max-width:60%; min-width:0; }
.conversation-row { grid-template-columns:minmax(0,1fr) 28px; }
.messages { min-height:0; min-width:0; overscroll-behavior:contain; overflow-anchor:none; padding-bottom:24px; }
.message-body,.message-text { min-width:0; overflow-wrap:anywhere; }
.composer { margin-bottom:max(10px,env(safe-area-inset-bottom)); max-height:none; }
.attachment-list { max-height:15dvh; overflow:auto; }
.progress-panel { max-height:min(220px,30dvh); overflow-y:auto; overscroll-behavior:contain; }
.compact-dialog { max-height:calc(var(--app-height) - 24px); }
.speed-buttons { display:inline-flex; gap:4px; padding:4px; border:1px solid var(--line); border-radius:12px; }
.speed-buttons button { padding:8px 20px; border:0; border-radius:8px; color:var(--muted); background:transparent; }
.speed-buttons button[aria-pressed=true] { color:#07110d; background:var(--accent); }
/* Light theme with distinct, readable user bubbles. */
:root { color-scheme:light; --bg:#fff; --panel:#f6f7f9; --panel-2:#eef1f5; --line:#dce2ea; --text:#182230; --muted:#637083; --accent:#2563eb; --accent-2:#1d4ed8; --danger:#b42318; --shadow:0 16px 50px rgba(28,45,70,.12); }
body,.chat-panel,.transfer-panel { background:#fff; }
.login-shell { background:linear-gradient(145deg,#f5f8fd,#fff); }
.login-card { background:#fff; }
label,.message-body,.activity-item,.account-box,.uploaded-file,.file-chip { color:var(--text); }
input,textarea,.transfer-card select,.transfer-item,.transfer-folder,.progress-panel,.activity-details.live,.preview-toolbar { color:var(--text); background:#fff; }
.transfer-selection,.speed-results span,.code-block pre,.copy-code { background:#f1f4f8; color:var(--text); }
.composer { background:#fff; border-color:#cfd8e5; box-shadow:0 4px 20px rgba(32,50,80,.06); }
.message.user { margin-left:clamp(28px,9vw,100px); }
.message.user .message-body { padding:12px 16px; background:#eaf3ff; border:1px solid #d3e5fc; border-radius:16px 16px 4px 16px; color:#173553; }
.message.user .avatar { background:#dcecff; color:#22558f; border-color:#c5dcf7; }
.message.assistant .avatar { color:#fff; background:#334155; }
.message.assistant .message-body { background:#fff; }
.message-text h1,.message-text h2,.message-text h3,.message-text h4 { color:#182230; }
.message-text a,.source-card { color:#1d4ed8; }
.message-text blockquote { color:#475569; background:#f3f6fa; }
.message-text th,.message-text td { border-color:#dce2ea; }
.message-text code:not(pre code) { color:#334155; background:#edf1f6; }
.code-block .hljs { color:#263445; background:#f1f4f8; }
.code-block .hljs-keyword,.code-block .hljs-selector-tag,.code-block .hljs-literal { color:#8330a2; }
.code-block .hljs-string,.code-block .hljs-title,.code-block .hljs-section { color:#166534; }
.code-block .hljs-comment { color:#66768b; }
.code-block .hljs-number,.code-block .hljs-attribute { color:#1d4ed8; }
.activity-details summary,.preview-toolbar button,.preview-toolbar a { color:#475569; }
.activity-item+.activity-item { border-color:var(--line); }
.source-card,.artifact-card,.transfer-entry { border-color:#ccdbef; background:#f0f6ff; }
.role-badge,.user-role-badge { border-color:#b9d0f5; background:#eaf2ff; }
.stop-button { color:#b42318; border-color:#f0b8b2; background:#fff3f1; }
.primary,.send-button,.speed-buttons button[aria-pressed=true] { color:#fff; background:#2563eb; }
.primary:hover { background:#1d4ed8; }
.brand-mark,.transfer-entry>span:first-child { color:#fff; background:#2563eb; box-shadow:none; }
.preview-stage { background:#e9edf3; }.toast { color:#fff; background:#334155; border-color:#475569; }
.modal::backdrop { background:rgba(25,35,50,.24); }
:root .transfer-library-file{display:block;width:100%;padding:12px;margin:8px 0;text-align:left;white-space:normal;overflow-wrap:anywhere}