:root {
  color-scheme: dark;
  --bg: #0b0d1b;
  --surface: #14172a;
  --surface-2: #1b1f36;
  --card: #252a48;
  --card-soft: #2f3558;
  --text: #f6f7ff;
  --muted: #adb3ca;
  --border: rgba(255,255,255,.11);
  --accent: #7ea8ff;
  --radius: 22px;
  --sidebar: 292px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html, body { margin:0; min-height:100%; background:var(--bg); color:var(--text); }
body { overflow:hidden; }
button, input, textarea { font:inherit; }
button { color:inherit; }
.hidden { display:none !important; }
.app-shell { min-height:100dvh; display:flex; background:
  radial-gradient(circle at 70% 12%, rgba(76,96,177,.18), transparent 34%),
  var(--bg); }
.main { margin-left:var(--sidebar); width:calc(100% - var(--sidebar)); min-height:100dvh; display:flex; flex-direction:column; }
.sidebar {
  position:fixed; inset:0 auto 0 0; width:var(--sidebar); background:#111426; border-right:1px solid var(--border);
  padding:24px 14px 18px; display:flex; flex-direction:column; z-index:20; overflow:auto; transition:transform .22s ease, box-shadow .22s ease;
}
.brand-block { padding:8px 12px 24px; }
.brand-title { font-weight:850; font-size:1.38rem; letter-spacing:.02em; display:flex; align-items:center; gap:10px; }
.brand-icon { width:32px; height:32px; border-radius:9px; }
.brand-subtitle { color:var(--muted); margin-top:5px; font-size:.84rem; }
.sidebar-spacer { flex:1; min-height:24px; }
.nav-item {
  width:100%; border:0; background:transparent; border-radius:15px; padding:12px 14px; display:flex; gap:13px;
  align-items:center; text-align:left; cursor:pointer; font-weight:620; color:#e8eaff;
}
.nav-item:hover, .nav-item.active { background:rgba(255,255,255,.075); }
.nav-separator { height:1px; background:var(--border); margin:8px 4px; }
.danger-subtle { color:#d9dcec; }
.topbar {
  min-height:62px; padding:max(8px, env(safe-area-inset-top)) 12px 8px; border-bottom:1px solid var(--border);
  background:rgba(13,15,29,.88); backdrop-filter:blur(14px); display:grid; grid-template-columns:48px 1fr 48px;
  align-items:center; position:sticky; top:0; z-index:10;
}
.top-title { text-align:center; font-weight:800; font-size:1.1rem; }
.icon-btn, .composer-icon, .send-btn {
  border:0; background:transparent; min-width:44px; min-height:44px; border-radius:50%; cursor:pointer;
}
.icon-btn:hover, .composer-icon:hover { background:rgba(255,255,255,.08); }
.content { flex:1; overflow:auto; padding:22px max(18px, calc((100vw - var(--sidebar) - 820px)/2)); padding-bottom:130px; }
.home { max-width:760px; margin:0 auto; padding-top:5vh; }
.hero { text-align:center; margin:22px 0 32px; }
.hero h1 { font-size:clamp(2rem,5vw,3.3rem); line-height:.96; margin:0; letter-spacing:-.04em; }
.hero p { color:var(--muted); margin:14px 0 0; }
.home-card {
  width:100%; border:1px solid var(--border); background:linear-gradient(145deg,var(--card),#202540); border-radius:var(--radius);
  padding:22px; display:flex; align-items:center; gap:18px; margin:12px 0; cursor:pointer; text-align:left;
}
.home-card:hover { transform:translateY(-1px); border-color:rgba(126,168,255,.34); }
.home-card .symbol { font-size:1.5rem; width:36px; text-align:center; }
.home-card b { display:block; font-size:1.1rem; }
.home-card small { display:block; color:var(--muted); margin-top:4px; }
.home-note { color:var(--muted); text-align:center; font-size:.83rem; padding:18px; }
.chat { max-width:820px; margin:0 auto; }
.message { margin:18px 0; }
.message.user { display:flex; justify-content:flex-end; }
.user-bubble {
  background:var(--card-soft); border-radius:24px; padding:16px 18px; max-width:82%; white-space:pre-wrap; line-height:1.5;
}
.assistant-head { display:flex; align-items:center; gap:9px; font-weight:800; margin-bottom:8px; }
.web-badge { color:#b8d5ff; font-size:.78rem; font-weight:700; }
.assistant-body { white-space:pre-wrap; line-height:1.62; font-size:1.02rem; }
.source-title { margin-top:14px; font-weight:800; }
.source-link {
  display:block; padding:9px 0; color:#bfd2ff; text-decoration:none; border-bottom:1px solid rgba(255,255,255,.05);
}
.actions { display:flex; gap:4px; flex-wrap:wrap; margin-top:8px; }
.text-action { border:0; background:transparent; color:#dfe3f4; padding:8px 9px; cursor:pointer; border-radius:10px; font-size:.84rem; }
.text-action:hover { background:rgba(255,255,255,.06); }
.attachment-card {
  border:1px solid var(--border); background:var(--surface-2); border-radius:20px; padding:15px; margin:12px 0;
}
.attachment-card img { max-width:100%; max-height:390px; border-radius:14px; display:block; margin:8px auto; }
.attachment-meta { display:flex; justify-content:space-between; gap:10px; align-items:center; }
.attachment-meta button { border:0; background:transparent; color:#d9deff; cursor:pointer; }
.loading { color:var(--muted); padding:12px 0; }
.composer-wrap {
  position:fixed; left:var(--sidebar); right:0; bottom:0; z-index:12; padding:8px max(12px, calc((100vw - var(--sidebar) - 820px)/2)) max(10px,env(safe-area-inset-bottom));
  background:linear-gradient(180deg,transparent,rgba(11,13,27,.92) 22%,rgba(11,13,27,.99));
}
.composer {
  display:flex; align-items:flex-end; gap:2px; border:1px solid rgba(255,255,255,.2); background:#171a2d; border-radius:30px; padding:5px 6px;
  box-shadow:0 12px 45px rgba(0,0,0,.3);
}
.composer textarea {
  flex:1; min-height:44px; max-height:130px; resize:none; border:0; outline:0; background:transparent; color:var(--text); padding:11px 7px;
}
.composer textarea::placeholder { color:#8f96b0; }
.send-btn { font-size:1.35rem; color:#dbe5ff; }
.send-btn:disabled { opacity:.35; cursor:default; }
.mode-label { max-width:820px; margin:0 auto 3px; color:#aeb5cc; font-size:.76rem; padding-left:14px; }
.sheet-dialog { border:0; padding:0; background:transparent; width:min(92vw,500px); color:var(--text); }
.sheet-dialog::backdrop { background:rgba(0,0,0,.62); backdrop-filter:blur(2px); }
.dialog-card { background:#222744; border:1px solid var(--border); border-radius:26px; padding:22px; }
.dialog-title { font-size:1.6rem; font-weight:850; margin:2px 3px 16px; }
.action-row {
  width:100%; display:flex; align-items:center; gap:16px; border:0; background:#2b3153; border-radius:18px; padding:15px; margin:8px 0; text-align:left; cursor:pointer;
}
.action-row:hover { background:#333a62; }
.action-row span:last-child { display:flex; flex-direction:column; }
.action-row small { color:var(--muted); margin-top:2px; }
.action-icon { width:35px; text-align:center; font-size:1.45rem; }
.cancel-btn { display:block; margin:12px 0 0 auto; background:transparent; border:0; padding:10px 14px; cursor:pointer; }
.panel { max-width:820px; margin:0 auto; }
.panel h1 { margin-top:10px; }
.panel-card { background:var(--surface-2); border:1px solid var(--border); border-radius:20px; padding:16px; margin:10px 0; }
.row-between { display:flex; justify-content:space-between; gap:14px; align-items:center; }
.muted { color:var(--muted); }
.field { width:100%; border:1px solid var(--border); background:#0f1221; color:var(--text); padding:13px 14px; border-radius:14px; outline:none; margin:6px 0; }
.primary-btn { border:0; border-radius:14px; padding:12px 16px; background:#dfe7ff; color:#11152a; font-weight:800; cursor:pointer; }
.secondary-btn { border:1px solid var(--border); border-radius:14px; padding:11px 15px; background:transparent; color:var(--text); font-weight:700; cursor:pointer; }
.button-row { display:flex; gap:9px; flex-wrap:wrap; margin-top:10px; }
.history-item { cursor:pointer; }
.memory-text { white-space:pre-wrap; }
.toast { position:fixed; bottom:105px; left:50%; transform:translateX(-50%); z-index:100; background:#eef1ff; color:#171a2d; border-radius:999px; padding:10px 16px; box-shadow:0 10px 30px rgba(0,0,0,.35); }
.scrim { display:none; }
.large-text { font-size:1.13em; }

body.sidebar-collapsed .sidebar { transform:translateX(-102%); box-shadow:none; }
body.sidebar-collapsed .main { margin-left:0; width:100%; }
body.sidebar-collapsed .composer-wrap { left:0; padding-left:max(12px, calc((100vw - 820px)/2)); padding-right:max(12px, calc((100vw - 820px)/2)); }
body.sidebar-collapsed .content { padding-left:max(18px, calc((100vw - 820px)/2)); padding-right:max(18px, calc((100vw - 820px)/2)); }
.danger-zone { border-color:rgba(255,115,115,.22); }
.danger-btn { border:1px solid rgba(255,115,115,.38); border-radius:14px; padding:11px 15px; background:rgba(255,80,80,.09); color:#ffd7d7; font-weight:750; cursor:pointer; }
.danger-btn:hover { background:rgba(255,80,80,.16); }
.legal-page, .download-page { max-width:860px; margin:0 auto; padding:48px 22px 90px; line-height:1.65; }
.legal-page h1, .download-page h1 { font-size:clamp(2rem,6vw,3.2rem); margin-bottom:8px; }
.legal-page h2 { margin-top:32px; }
.legal-page a, .download-page a { color:#bfd2ff; }
.page-toplink { display:inline-flex; gap:8px; align-items:center; text-decoration:none; margin-bottom:28px; color:#dce5ff; }
.download-card { background:var(--surface-2); border:1px solid var(--border); border-radius:26px; padding:24px; margin-top:24px; }
.download-icon { width:104px; height:104px; border-radius:24px; display:block; margin-bottom:18px; }
.download-btn { display:inline-block; text-decoration:none; border-radius:14px; padding:13px 18px; background:#dfe7ff; color:#11152a !important; font-weight:850; margin-top:12px; }
.download-btn.disabled { opacity:.46; pointer-events:none; }
.status-pill { display:inline-block; padding:6px 10px; border-radius:999px; background:rgba(255,255,255,.07); color:var(--muted); font-size:.84rem; }

@media (max-width: 820px) {
  :root { --sidebar: 286px; }
  .sidebar { transform:translateX(-102%); transition:transform .2s ease; box-shadow:20px 0 55px rgba(0,0,0,.38); }
  .sidebar.open { transform:translateX(0); }
  .main, body.sidebar-collapsed .main { margin-left:0; width:100%; }
  .sidebar.collapsed, body.sidebar-collapsed .sidebar { transform:translateX(-102%); }
  .sidebar.open, body.sidebar-collapsed .sidebar.open { transform:translateX(0); }
  .composer-wrap, body.sidebar-collapsed .composer-wrap { left:0; padding-left:14px; padding-right:14px; }
  body.sidebar-collapsed .content { padding-left:14px; padding-right:14px; }
  .content { padding-left:14px; padding-right:14px; }
  .scrim { display:block; position:fixed; inset:0; z-index:18; background:rgba(0,0,0,.52); }
  .scrim.hidden { display:none !important; }
  .composer-icon { min-width:38px; }
  .user-bubble { max-width:90%; }
}
