/* Workspace design system. Functional base styles remain in app.css. */
:root, :root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #111215; --surface: #18191e; --surface-2: #22242b; --line: #2c2e37;
  --text: #eeeff3; --muted: #a0a4b3; --accent: #8b9bff; --info: #a6b5ff;
  --focus: #b1bdff; --up: #61d4b1; --down: #ff998e; --ok: #61d4b1;
  --bad: #ff998e; --warn: #e6c783; --warn-bg: #332b1c; --radius: 16px; --gutter: 24px;
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f7f8fb; --surface: #fff; --surface-2: #edf0f8; --line: #dfe3ef;
  --text: #202435; --muted: #616a7e; --accent: #5265da; --info: #4657bd;
  --up: #127d65; --down: #b43c35; --ok: #127d65; --bad: #b43c35; --focus: #5265da;
}
body { font-size: 14px; line-height: 1.6; letter-spacing: -.012em; }
a { text-underline-offset: 3px; }
h1,h2,h3 { letter-spacing: -.025em; }
button, a, input, textarea, select, summary { -webkit-tap-highlight-color: transparent; }
button, a.btn { user-select: none; }
.btn { min-height: 42px; border-radius: 10px; padding: 9px 15px; font-size: 13px; font-weight: 550; display: inline-flex; align-items: center; justify-content: center; gap: 8px; text-decoration: none; }
.btn.primary { color: #121526; background: var(--accent); border-color: transparent; }
.btn:hover:not(:disabled) { background: #30333f; border-color: #45495b; }
.btn.primary:hover:not(:disabled) { background: #a6b2ff; }
input,select,textarea { border-radius: 10px; font-size: 13px; }
input[type="checkbox"] { width: 20px; min-height: 20px; accent-color: var(--accent); }
.card { padding: 24px; border-radius: var(--radius); box-shadow: 0 3px 14px rgba(0,0,0,.04); }
.stack > * + * { margin-top: 20px; }
.card.stack > * + * { margin-top: 12px; }
.card h2 { font-size: 16px; font-weight: 600; }
.card h3 { font-size: 13px; font-weight: 600; }
.card-head { gap: 12px; }
.muted { color: var(--muted); }
.small { font-size: 12px; line-height: 1.65; }
.tiny { font-size: 11px; }
.badge { padding: 3px 8px; border-radius: 6px; font-size: 10px; font-weight: 550; line-height: 1.5; letter-spacing: .015em; }
.badge.ok { background: rgba(97,212,177,.08); border-color: rgba(97,212,177,.25); }
.badge.bad { background: rgba(255,153,142,.07); border-color: rgba(255,153,142,.3); }
.badge.off { background: var(--surface-2); border-color: transparent; }
.banner { border-radius: 10px; }
.banner.info { border-color: rgba(139,155,255,.3); background: rgba(139,155,255,.045); }
.banner.warn { border-color: rgba(255,153,142,.25); background: rgba(255,153,142,.06); }
.banner.sample { border-color: var(--warn); }
.eyebrow { font-size: 10px; color: var(--muted); font-weight: 650; letter-spacing: .12em; line-height: 1.5; }
.page-heading { padding: 8px 0 6px; }
.page-heading h2 { font-size: 29px; font-weight: 550; margin: 8px 0; }
.page-heading > p { margin: 0; font-size: 13px; }
/* Navigation */
.side { background: #16171b; padding: 26px 16px 18px; gap: 16px; }
.brand { font-size: 17px; gap: 12px; padding: 0 6px; }
.brand-sub { display: block; font-size: 8px; letter-spacing: .1em; color: var(--muted); font-weight: 500; margin-top: 1px; }
.mark { background: #272c45; color: var(--accent); width: 36px; height: 36px; border: 1px solid #414868; border-radius: 11px; }
.mark svg { width: 22px; height: 22px; fill: currentColor; }
.side-head { margin-bottom: 8px; }
.newchat { background: #24262e; border-color: #353842; justify-content: flex-start; font-size: 13px; padding: 11px 14px; }
.newchat svg { color: var(--accent); width: 18px; }
.newchat.active { border-color: #565f91; background: #24283b; }
.side-nav { border-top: 0; padding: 0 0 18px; border-bottom: 1px solid var(--line); gap: 4px; }
.navlink { padding: 10px 12px; gap: 11px; font-size: 13px; min-height: 42px; color: #a7aab9; }
.navlink svg { width: 18px; height: 18px; }
.navlink[aria-current="page"] { color: #c4ccff; background: #272b3c; font-weight: 550; }
.side-label { font-size: 10px; text-transform: none; letter-spacing: .03em; padding: 0 10px; }
.convlist { margin-top: -6px; min-height: 0; }
.convitem { font-size: 12px; font-weight: 400; padding: 10px 32px 10px 10px; color: #c1c4d0; }
.convitem[aria-current="page"] { background: #262831; font-weight: 450; color: #fff; }
.convdel { opacity: 0; font-size: 18px; width: 28px; height: 28px; }
.convrow:hover .convdel,.convrow:focus-within .convdel { opacity: 1; }
.workspace-owner { border-top: 1px solid var(--line); padding: 18px 4px 0; display: flex; gap: 10px; align-items: center; color: #e0e2ec; font-size: 12px; }
.workspace-owner small { display: block; color: var(--muted); font-size: 10px; }
.owner-avatar { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: #343849; font-size: 12px; color: #d4dafa; }
.top { min-height: 70px; padding: 16px 32px; background: var(--bg); gap: 16px; }
.top h1 { font-weight: 550; font-size: 14px; }
.pills { gap: 5px; }
.pills .badge { font-size: 9px; padding: 3px 7px; }
#clock { margin-left: 6px; font-size: 10px; }
#view { max-width: 1500px; margin: 0 auto; padding: 26px 40px 48px; }
.tabs { border-bottom: 0; background: var(--surface); border: 1px solid var(--line); padding: 5px; gap: 4px; border-radius: 12px; width: fit-content; max-width: 100%; }
.tab { padding: 8px 18px; min-height: 36px; border: 0; border-radius: 8px; font-size: 12px; }
.tab[aria-current="page"] { background: #2b3046; color: #bdc7ff; font-weight: 550; }
@media (min-width:900px) { .shell { grid-template-columns: 256px minmax(0,1fr); } .side { height: 100dvh; } .grid-2 { gap: 20px; } .grid-3 { gap: 20px; } }
/* Chat */
body.chatmode { overflow: hidden; }
body.chatmode .shell,body.chatmode .main { height: 100dvh; min-height: 0; }
body.chatmode .top { flex: 0 0 auto; }
body.chatmode #view { flex: 1 1 0; min-height: 0; overflow: hidden; margin: 0; }
.chat { height: 100%; max-width: 920px; }
.thread { padding: 34px 32px 16px; gap: 28px; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.hero { padding: 32px 8px 64px; width: 100%; max-width: 690px; }
.hero-symbol { width: 56px; height: 56px; margin: 0 auto 26px; background: #202334; border: 1px solid #383f5d; border-radius: 18px; display: grid; place-items: center; color: #a4b1ff; box-shadow: 0 0 45px rgba(139,155,255,.06); }
.hero-symbol svg { width: 28px; height: 28px; fill: currentColor; }
.hero .eyebrow { margin-bottom: 14px; font-size: 9px; letter-spacing: .15em; }
.hero h2 { font-size: clamp(28px,3vw,40px); font-weight: 500; margin-bottom: 16px; letter-spacing: -.045em; }
.hero > p { max-width: 430px; margin: 0 auto; font-size: 13px; line-height: 1.75; }
.hero .chips { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin-top: 34px; text-align: left; }
.hero .chip { border-radius: 12px; min-height: 72px; background: var(--surface); border-color: var(--line); padding: 14px 16px; text-align: left; justify-content: flex-start; align-items: flex-start; font-size: 12px; line-height: 1.55; font-weight: 400; }
.hero .chip::before { content: '↗'; color: var(--accent); font-size: 15px; flex-shrink: 0; }
.hero .chip:hover { background: var(--surface-2); border-color: #555d86; }
.bubble.user { max-width: 80%; background: #292d3e; color: var(--text); border-radius: 16px 16px 4px 16px; padding: 12px 18px; font-size: 14px; }
.bubble.user .message-author { display: none; }
.bubble.assistant { border: 0; background: transparent; padding: 0; line-height: 1.8; }
.bubble.assistant .message-author { font-size: 12px; font-weight: 600; margin-bottom: 12px; display: flex; gap: 9px; align-items: center; }
.bubble.assistant .message-author::before { content: '✦'; color: var(--accent); font-size: 16px; }
.bubble.error { padding: 12px !important; border: 1px solid var(--bad) !important; border-radius: 12px; }
.bubble .msgtext { font-size: 14px; line-height: 1.8; }
.bubble .tiny { margin-top: 8px; font-size: 10px; }
.message-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 14px; }
.message-meta .badge { font-size: 9px; background: #22242c; color: var(--muted); }
.message-info { font-size: 10px; color: var(--muted); }
.message-info summary { cursor: pointer; }
.message-info p { max-width: 600px; margin: 8px 0 0; }
.message-info[open] { flex-basis: 100%; }
.report-message { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 20px; }
.report-message .disclosure { border: 0; background: transparent; margin-top: 14px; border-top: 1px solid var(--line); border-radius: 0; }
.report-message .disclosure > summary { padding: 12px 0 0; }
.report-message .disclosure-body { padding: 14px 0 0; }
.report-caution { white-space: pre-wrap; border-left: 2px solid var(--warn); padding: 10px 12px; background: rgba(230,199,131,.04); color: var(--warn); margin-top: 16px; border-radius: 0 8px 8px 0; }
.composer { flex: 0 0 auto; position: relative; padding: 16px 32px calc(18px + env(safe-area-inset-bottom)); background: var(--bg); }
.composer .box { background: #1e2026; border-color: #3a3d49; border-radius: 18px; padding: 12px 12px 12px 20px; box-shadow: 0 8px 40px rgba(0,0,0,.12); }
.composer .box:focus-within { border-color: #6e7bbb; box-shadow: 0 0 0 3px rgba(139,155,255,.05); }
.composer textarea { min-height: 42px; font-size: 14px; padding: 10px 0; }
.composer .send { border-radius: 12px; min-width: 42px; min-height: 42px; width: 42px; height: 42px; padding: 10px; }
.send svg { width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linejoin: round; stroke-linecap: round; }
.composer .hint { text-align: center; margin-top: 10px; font-size: 10px; }
.thinking { color: var(--muted); font-size: 13px; }
/* Trading & daily briefing */
.overview-summary .card { display: flex; flex-direction: column; justify-content: flex-start; }
.bigprice { font-size: 42px; letter-spacing: -.04em; font-weight: 550; margin: 10px 0 0; }
.price-card .card-head h2 { font-size: 13px; color: var(--muted); }
.price-card .disclosure { margin-top: 4px; border: 0; background: transparent; }
.price-card .disclosure > summary { padding: 0; font-size: 10px; color: var(--muted); }
.price-card .disclosure-body { padding: 8px 0 0; }
.price-card .row { margin-top: auto; padding-top: 16px; }
.quote-warning { color: var(--warn); background: rgba(230,199,131,.07); border-radius: 8px; padding: 8px 10px; }
.quick-outlook { gap: 12px; }
.quick-outlook .stance { font-size: 26px; font-weight: 550; margin-top: 14px; }
.quick-outlook .text-link { margin-top: auto; padding-top: 10px; }
.text-link { font-size: 12px; font-weight: 550; color: var(--accent); display: inline-block; text-decoration: none; }
.text-link:hover { text-decoration: underline; }
.coverage-notice { color: var(--warn); padding: 8px 10px; border: 1px solid rgba(230,199,131,.2); background: rgba(230,199,131,.04); border-radius: 8px; }
.chart-card { padding: 24px; }
.chart-card .field { margin-top: 16px; }
.chart-card select { max-width: 680px; background: var(--surface); font-size: 11px; }
.chart-card .chart-wrap { margin-top: 24px; }
.chart-card .readout { font-size: 11px; padding: 12px 0 6px; }
.chart-card > p { border-top: 1px solid var(--line); margin-top: 10px; padding-top: 12px; font-size: 10px; }
.c-up { fill: var(--up); }
.c-grid { stroke: #282b33; }
.c-lasttext { fill: #121526; }
.tile { background: #202228; border: 1px solid var(--line); padding: 14px; border-radius: 10px; }
.tile .v { margin-top: 4px; font-size: 18px; }
.journal-strip { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.journal-strip p { margin: 5px 0 0; }
.briefing-metrics { display: grid; grid-template-columns: 1fr 1.6fr 1fr 1fr; gap: 12px; }
.metric { border: 1px solid var(--line); background: var(--surface); border-radius: 12px; padding: 17px 20px; display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.metric strong { font-size: 18px; font-weight: 550; line-height: 1.5; overflow-wrap: anywhere; }
.metric .tiny { font-size: 10px; }
.report-card { overflow: hidden; }
.report-card > * + * { margin-top: 20px; }
.outlook-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.outlook-head .outlook-title { font-size: 30px; font-weight: 550; margin-bottom: 8px; }
.reference-price { text-align: right; flex-shrink: 0; }
.reference-price strong { display: block; font-size: 25px; font-weight: 500; margin-top: 4px; }
.report-limit { color: var(--muted); margin-top: 6px; }
.report-columns { display: grid; grid-template-columns: 1.7fr 1fr; gap: 32px; border-top: 1px solid var(--line); padding-top: 22px; }
.evidence li { padding: 14px 0; }
.evidence strong { font-size: 12px; font-weight: 550; }
.evidence p { margin: 6px 0 0; }
.levels-panel { background: #1e2027; border: 1px solid var(--line); border-radius: 12px; padding: 18px; align-self: start; }
.level-row { border-bottom: 1px solid var(--line); padding: 14px 0; }
.level-row > strong { font-size: 20px; font-weight: 500; }
.level-row p { margin: 5px 0 0; }
.outcome-state { margin-top: 18px; }
.outcome-state > p { margin: 6px 0 0; font-size: 13px; }
.outcome-state > p.small { font-size: 11px; }
.schedule-card > p { font-size: 12px; color: var(--muted); }
.schedule-card > .small { font-size: 11px; }
.schedule-card .list { margin-top: 12px; }
.schedule-card .btn { font-size: 11px; }
.review-card > h2 { margin: 12px 0; font-size: 20px; }
.review-card > p { margin: 12px 0; }
.review-card .card { padding: 0; border: 0; box-shadow: none; background: transparent; }
.review-card pre { font-size: 11px; line-height: 1.7; }
.disclosure { border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.disclosure > summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; list-style: none; cursor: pointer; padding: 16px 20px; font-size: 12px; font-weight: 550; }
.disclosure > summary::-webkit-details-marker { display: none; }
.disclosure-arrow { color: var(--muted); font-size: 17px; transition: transform .15s; }
.disclosure[open] > summary .disclosure-arrow { transform: rotate(180deg); }
.disclosure[open] > summary { border-bottom: 1px solid var(--line); }
.disclosure-body { padding: 20px; min-width: 0; overflow-wrap: anywhere; }
.disclosure-body > .card { border: 0; padding: 0; box-shadow: none; background: transparent; }
.diagnostics { margin-top: 28px; }
.diagnostics > * + * { margin-top: 10px; }
.tbl th { font-size: 10px; padding: 12px 10px; }
.tbl td { padding: 12px 10px; font-size: 11px; }
.list > li { padding: 12px 0; }
.login { padding: 32px; }
.login h2 { font-size: 23px; margin-bottom: 12px; }
.login label { margin-top: 24px; }
.login .btn { width: 100%; }
.login .error:empty { min-height: 0; margin: 12px 0; }
/* Small screens: viewport-bound drawer & independently scrolling conversation. */
@media (max-width: 1190px) and (min-width: 900px) {
  #view { padding: 24px; } .shell { grid-template-columns: 230px minmax(0,1fr); }
  .pills { max-width: 60%; overflow: auto; flex-wrap: nowrap; }
  .briefing-metrics { grid-template-columns: 1fr 1fr; }
  .report-columns { gap: 20px; }
}
@media (max-width:899px) {
  :root { --gutter: 18px; }
  .top { padding: 10px 16px; min-height: 60px; gap: 8px; }
  .top h1 { font-size: 13px; }
  #view { padding: 20px 18px 36px; }
  .pills { max-width: 48%; }
  .side { width: min(84vw,300px); height: 100dvh; bottom: auto; padding-top: 20px; }
  .convdel { opacity: .7; }
  .side-head { margin-bottom: 0; }
  .card { padding: 20px; }
  .grid-2 > * + * { margin-top: 16px; }
  .page-heading h2 { font-size: 26px; }
  .page-heading p { font-size: 12px; }
  .chat { max-width: 720px; }
  .thread { padding: 24px 20px 16px; gap: 24px; }
  .composer { padding: 12px 18px calc(14px + env(safe-area-inset-bottom)); }
  .composer .box { padding: 8px 8px 8px 16px; border-radius: 16px; }
  .composer textarea { font-size: 16px; }
  .hero { padding: 24px 0 30px; }
  .hero .chips { grid-template-columns: 1fr; gap: 8px; margin-top: 24px; }
  .hero .chip { min-height: 48px; padding: 12px 16px; align-items: center; }
  .hero-symbol { width: 48px; height: 48px; border-radius: 15px; margin-bottom: 20px; }
  .hero .eyebrow { font-size: 8px; }
  .hero h2 { font-size: 30px; }
  .bubble .msgtext { font-size: 14px; }
  .bubble.user { max-width: 88%; }
  .report-message { padding: 16px; }
  .tabs { width: 100%; }
  .tab { padding: 8px 14px; font-size: 11px; }
  .briefing-metrics { grid-template-columns: 1fr 1fr; gap: 10px; }
  .metric { padding: 14px; }
  .metric strong { font-size: 15px; }
  .metric .small { font-size: 10px; }
  .metric .tiny { font-size: 9px; }
  .outlook-head { flex-direction: column; gap: 12px; }
  .outlook-head .outlook-title { font-size: 26px; }
  .reference-price { text-align: left; }
  .reference-price strong { font-size: 22px; }
  .report-columns { grid-template-columns: 1fr; gap: 18px; }
  .report-columns > * { min-width: 0; }
  .journal-strip { flex-direction: column; align-items: flex-start; gap: 14px; }
  .disclosure > summary { padding: 15px 16px; }
  .disclosure-body { padding: 16px; }
  .tiles { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .tile .v { font-size: 16px; }
  .chart-card select { max-width: 100%; }
  .fields-2 { display: block; }
}
@media (prefers-reduced-motion: no-preference) { .btn,.navlink,.chip { transition: background .15s,border-color .15s,color .15s; } }
@media (prefers-reduced-motion: reduce) { .disclosure-arrow { transition: none; } }

/* Evidence-linked background research */
.ai-research-card{border-color:rgba(146,155,255,.3);background:linear-gradient(145deg,rgba(100,107,190,.1),transparent 70%)}
.ai-summary{font-size:15px;line-height:1.65;margin:0}.ai-warning{color:#edc78b;font-size:12px;line-height:1.55;padding:9px 11px;background:rgba(205,153,66,.08);border:1px solid rgba(205,153,66,.18);border-radius:9px;margin:0}
.ai-reason{font-size:13px;line-height:1.6;border-left:2px solid #8893ed;padding-left:12px;margin:9px 0}.ai-scenarios{display:grid;grid-template-columns:1fr 1fr;gap:18px}.ai-section h3{font-size:12px;color:#c2c7dc;margin:4px 0 8px}.ai-section li{font-size:12px;line-height:1.6;color:#a9b1c9}.ai-outcome{font-size:12px;border-top:1px solid rgba(170,180,220,.12);padding-top:12px;color:#bac4df}.ai-evidence li{font-size:12px;overflow-wrap:anywhere}.ai-details pre{white-space:pre-wrap;overflow-wrap:anywhere}.ai-review-card,.ai-research-card{min-width:0;overflow-wrap:anywhere}
@media(max-width:600px){.ai-scenarios{grid-template-columns:1fr;gap:9px}.ai-summary{font-size:14px}.ai-research-card .stance{font-size:24px}}