/* Kamadeyle console theme, the same tokens as Proposals, Recon and the NOC. Header and footer come from the chrome kit
   (web/chrome/, synced from kamadeyle-chrome, never edited here). Type floor 12px; body 16.5px. */
:root {
  --ground:#0f141c; --panel:#161e2b; --raised:#1c2636; --line:#26334a; --line-soft:#1f2a3c;
  --ink:#e8eef7; --ink-2:#93a4bb; --ink-3:#8aa4c7;
  --ok:#22b422; --warn:#fab219; --down:#e35d5d; --accent:#5aa2f0; --accent-bg:rgba(90,162,240,.12);
  --ok-bg:rgba(34,180,34,.12); --warn-bg:rgba(250,178,25,.13); --down-bg:rgba(227,93,93,.13);
  --sans:"IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  color-scheme: dark;
}
* { box-sizing: border-box; }
html { text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }
body { margin:0; background:var(--ground); color:var(--ink); font:16.5px/1.45 var(--sans); }
/* Links are styled inside main only: the header and footer belong to the chrome kit. */
main a { color:var(--accent); text-decoration:none; } main a:hover { text-decoration:underline; }
button, input, select, textarea { font:inherit; color:inherit; }
[hidden] { display:none !important; }
.muted { color:var(--ink-2); }
.wrap { max-width:900px; margin:0 auto;
        padding-inline:calc(16px + env(safe-area-inset-left)) calc(16px + env(safe-area-inset-right));
        padding-block:calc(16px + env(safe-area-inset-top)) calc(32px + env(safe-area-inset-bottom)); }
main { padding-top:18px; }
h1 { font-size:22px; margin:0 0 6px; }

.panel { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:14px 16px; min-width:0; }
.pill { display:inline-block; padding:1px 9px; border-radius:999px; font-size:13px; border:1px solid var(--line); color:var(--ink-2); white-space:nowrap; }
.pill.high { color:var(--down); border-color:transparent; background:var(--down-bg); }
.toolbar { display:flex; gap:10px; align-items:center; margin:0 0 12px; }
.toolbar .grow { flex:1; }

label { display:flex; flex-direction:column; gap:4px; color:var(--ink-3); font-size:13.5px; }
input[type=text], input[type=search], input[type=password] { background:var(--ground); border:1px solid var(--line); border-radius:8px; padding:10px 12px; min-width:0; color:var(--ink); width:100%; }
input:focus, button:focus-visible { outline:2px solid var(--accent); outline-offset:-1px; }
input[type=checkbox] { appearance:auto; -webkit-appearance:checkbox; flex:none; width:20px; height:20px; padding:0; margin:0; accent-color:var(--accent); cursor:pointer; }
label.check { flex-direction:row; align-items:center; gap:10px; color:var(--ink-2); font-size:14px; cursor:pointer; }

.btn { font-family:var(--mono); font-size:13.5px; color:var(--ink-2); background:transparent; border:1px solid var(--line); border-radius:4px; padding:9px 14px; cursor:pointer; white-space:nowrap; }
.btn:hover { border-color:var(--accent); color:var(--accent); background:var(--accent-bg); }
.btn:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.btn:disabled { opacity:.45; cursor:default; }
.btn.primary { border-color:var(--accent); color:var(--accent); background:var(--accent-bg); }

.signin { max-width:440px; margin:10vh auto 0; display:flex; flex-direction:column; gap:14px; }
.signin p { margin:0; }
.signin .btn { align-self:flex-start; }

.tabs { display:flex; gap:2px; border-bottom:1px solid var(--line); margin-bottom:14px; overflow-x:auto; }
.tabs button { background:none; border:0; padding:10px 14px; color:var(--ink-2); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px; white-space:nowrap; }
.tabs button:hover { color:var(--ink); }
.tabs button.on { color:var(--ink); font-weight:600; border-bottom-color:var(--accent); }

.banner { display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:space-between; padding:10px 14px; margin-bottom:12px;
          border-radius:8px; background:var(--warn-bg); color:var(--warn); border:1px solid rgba(250,178,25,.3); }

.log { min-height:50vh; max-height:62vh; overflow-y:auto; display:flex; flex-direction:column; gap:10px; }
.msg { max-width:85%; padding:9px 13px; border-radius:12px; white-space:pre-wrap; }
.msg.user { align-self:flex-end; background:var(--accent-bg); border:1px solid rgba(90,162,240,.35); border-bottom-right-radius:3px; }
.msg.assistant { align-self:flex-start; background:var(--raised); border:1px solid var(--line); border-bottom-left-radius:3px; }
.msg.error { align-self:center; color:var(--down); font-size:15px; }
.msg.thinking { color:var(--ink-3); }
.msg .acts { display:block; font-family:var(--mono); font-size:12.5px; color:var(--ink-3); margin-top:5px; }

.say { display:flex; gap:10px; margin-top:12px; align-items:center; }
.mic { flex:none; width:56px; height:56px; border-radius:50%; border:1px solid var(--accent); background:var(--accent-bg); color:var(--accent); cursor:pointer; display:grid; place-items:center; }
.mic:hover { background:rgba(90,162,240,.22); }
.mic.live { color:#fff; background:var(--down); border-color:var(--down); animation:pulse 1.2s infinite; }
@keyframes pulse { 50% { box-shadow:0 0 0 10px rgba(227,93,93,.18); } }
.speak { margin-top:10px; }

.list { list-style:none; margin:0; padding:0; }
.list li { padding:12px 16px; border-top:1px solid var(--line-soft); display:flex; gap:12px; align-items:flex-start; }
.list li:first-child { border-top:0; }
.list li.empty { color:var(--ink-2); }
.list input[type=checkbox] { margin-top:2px; }
.list .main { flex:1; min-width:0; }
.list .main .pill { margin-left:8px; }
.list .meta { display:block; font-size:14px; color:var(--ink-3); }
.list .body { white-space:pre-wrap; font-size:15.5px; color:var(--ink-2); margin-top:4px; }
.list .day { background:var(--raised); font-weight:600; font-size:13px; color:var(--ink-3); letter-spacing:.05em; text-transform:uppercase; padding:8px 16px; }
.list .child { padding-left:44px; }