:root { --bg:#0d1117; --card:#161b22; --line:#30363d; --fg:#c9d1d9; --muted:#8b949e;
        --pos:#3fb950; --neg:#f85149; --accent:#58a6ff; --warn:#d29922; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:14px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif; }
a { color:var(--accent); text-decoration:none; } a:hover { text-decoration:underline; }
header.top { display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap;
             padding:.6rem 1rem; border-bottom:1px solid var(--line); background:var(--card); }
.brand { font-weight:700; font-size:1.1rem; color:var(--fg); }
.status { color:var(--muted); font-size:.85rem; display:flex; gap:.4rem; align-items:center; flex-wrap:wrap; }
main { max-width:1500px; margin:0 auto; padding:1rem; }
footer { color:var(--muted); font-size:.75rem; text-align:center; padding:1rem; }
.card { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:.9rem 1rem; margin-bottom:1rem; }
.card h2 { margin:0 0 .6rem; font-size:1rem; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
.card h3 { margin:0 0 .5rem; font-size:.95rem; }
.head { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; flex-wrap:wrap; }
.head h1 { margin:0; font-size:1.6rem; } .head h1 small { color:var(--muted); font-size:.9rem; font-weight:400; margin-left:.5rem; }
.price { text-align:right; } .price .big { font-size:1.8rem; font-weight:600; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1rem; }
.grid .card { margin:0; }
dl { display:grid; grid-template-columns:auto auto; gap:.25rem .8rem; margin:0; }
dt { color:var(--muted); } dd { margin:0; text-align:right; font-variant-numeric:tabular-nums; }
form.add { display:flex; gap:.5rem; flex-wrap:wrap; }
form.add input { flex:1 1 140px; }
form.inline { display:inline; }
input { background:var(--bg); color:var(--fg); border:1px solid var(--line); border-radius:6px; padding:.45rem .6rem; font:inherit; }
input:focus { outline:none; border-color:var(--accent); }
button { background:#21262d; color:var(--fg); border:1px solid var(--line); border-radius:6px; padding:.4rem .8rem; font:inherit; cursor:pointer; }
button:hover { border-color:var(--muted); }
button.danger { color:var(--neg); padding:.2rem .5rem; } button.danger:hover { border-color:var(--neg); }
.tablewrap { overflow-x:auto; scrollbar-color:var(--line) var(--card); }
table.overview { width:100%; border-collapse:collapse; font-variant-numeric:tabular-nums; white-space:nowrap; }
table.overview th, table.overview td { padding:.4rem .5rem; border-bottom:1px solid var(--line); text-align:left; }
table.overview th { color:var(--muted); font-weight:500; font-size:.8rem; }
table.overview tbody tr:hover { background:rgba(88,166,255,.05); }
td.r, th.r { text-align:right; }
td.name { max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.notes { color:var(--muted); font-size:.75rem; }
.sym { font-weight:600; }
.pos { color:var(--pos); } .neg { color:var(--neg); } .muted { color:var(--muted); }
.hot { color:var(--neg); font-weight:600; } .cold { color:var(--accent); font-weight:600; }
.tag { font-size:.65rem; padding:.05rem .35rem; border-radius:4px; margin-left:.3rem; text-transform:uppercase; vertical-align:middle; }
.tag.golden { background:rgba(63,185,80,.2); color:var(--pos); } .tag.death { background:rgba(248,81,73,.2); color:var(--neg); }
.badge.busy { color:var(--warn); }
.spark polyline { stroke:var(--muted); } .spark.pos polyline { stroke:var(--pos); } .spark.neg polyline { stroke:var(--neg); }
.range { display:inline-block; position:relative; width:70px; height:6px; background:var(--line); border-radius:3px; vertical-align:middle; }
.range i { position:absolute; top:-2px; width:3px; height:10px; margin-left:-1px; background:var(--accent); border-radius:2px; }
.alert { background:rgba(248,81,73,.12); border:1px solid var(--neg); color:var(--fg); padding:.6rem .9rem; border-radius:6px; margin-bottom:1rem; }
.alert.warn { background:rgba(210,153,34,.1); border-color:var(--warn); } .alert ul { margin:.4rem 0 0; }
.empty { color:var(--muted); text-align:center; padding:2rem; }
.plot.tall { height:460px; } .plot.short { height:180px; }
details p { color:var(--muted); font-size:.85rem; }

/* login */
.login-body { display:flex; min-height:100vh; align-items:center; justify-content:center; }
.login { width:100%; max-width:380px; padding:1rem; }
.login h1 { margin:0 0 .2rem; font-size:1.5rem; }
.login .card { padding:1.5rem; }
form.stack { display:flex; flex-direction:column; gap:.8rem; margin-top:1rem; }
form.stack label { display:flex; flex-direction:column; gap:.3rem; color:var(--muted); font-size:.85rem; }
button.primary { background:var(--accent); color:#0d1117; border-color:var(--accent); font-weight:600; padding:.55rem; }
button.primary:hover { filter:brightness(1.1); }
.status .user { color:var(--fg); margin-left:.4rem; }

/* navigation */
header.top nav { display:flex; gap:1rem; align-items:center; }
header.top nav a { color:var(--muted); padding:.2rem 0; border-bottom:2px solid transparent; }
header.top nav a.active { color:var(--fg); border-bottom-color:var(--accent); }
header.top nav a:hover { text-decoration:none; color:var(--fg); }

/* dashboard panels */
.panels { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1rem; margin-bottom:1rem; }
.panels .card { margin:0; }
.movers { display:flex; flex-direction:column; gap:.3rem; }
.movers .row { display:flex; justify-content:space-between; gap:.6rem; }
.movers .row .name { color:var(--muted); flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.totals { display:grid; grid-template-columns:repeat(auto-fit,minmax(110px,1fr)); gap:.6rem; }
.totals .kpi { display:flex; flex-direction:column; }
.totals .kpi .label { color:var(--muted); font-size:.75rem; text-transform:uppercase; letter-spacing:.04em; }
.totals .kpi .val { font-size:1.2rem; font-weight:600; font-variant-numeric:tabular-nums; }
.subtle { color:var(--muted); font-size:.8rem; }
.alert.ok { background:rgba(63,185,80,.12); border-color:var(--pos); }
tr.total td { font-weight:600; border-top:2px solid var(--line); }
.events { list-style:none; margin:0; padding:0; }
.events li { padding:.35rem 0; border-bottom:1px solid var(--line); display:flex; gap:.8rem; }
.events li time { color:var(--muted); white-space:nowrap; font-size:.8rem; }
form.add select { background:var(--bg); color:var(--fg); border:1px solid var(--line); border-radius:6px; padding:.45rem .6rem; font:inherit; }
.off { opacity:.5; }
.pill { font-size:.7rem; padding:.1rem .45rem; border-radius:10px; background:#21262d; color:var(--muted); }
.pill.on { color:var(--pos); }
.help { color:var(--muted); font-size:.8rem; margin:.3rem 0 0; }
.bars { display:flex; flex-direction:column; gap:.35rem; }
.bars .bar { display:grid; grid-template-columns:140px 1fr 55px; gap:.6rem; align-items:center; font-size:.85rem; }
.bars .bar .track { height:8px; background:var(--line); border-radius:4px; overflow:hidden; }
.bars .bar .track i { display:block; height:100%; background:var(--accent); }
.bars .bar .v { text-align:right; font-variant-numeric:tabular-nums; }
.tabs { display:flex; gap:.4rem; flex-wrap:wrap; margin-bottom:.6rem; }
.tabs a { padding:.25rem .6rem; border:1px solid var(--line); border-radius:6px; color:var(--muted); font-size:.85rem; }
.tabs a.active { color:var(--fg); border-color:var(--accent); }
@media (max-width: 700px) {
  header.top { flex-direction:column; align-items:flex-start; }
  .bars .bar { grid-template-columns:100px 1fr 50px; }
}

/* ---- live quotes & exchanges ---- */
.live { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:.35rem; background:var(--muted); vertical-align:middle; }
.live.open { background:var(--pos); box-shadow:0 0 0 0 rgba(63,185,80,.6); animation:pulse 2s infinite; }
.live.open.stale { background:var(--warn); animation:none; }
.live.closed { background:var(--muted); }
@keyframes pulse { 0% { box-shadow:0 0 0 0 rgba(63,185,80,.5);} 70% { box-shadow:0 0 0 6px rgba(63,185,80,0);} 100% { box-shadow:0 0 0 0 rgba(63,185,80,0);} }
.pill.ex i { display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--muted); margin-right:.3rem; }
.pill.ex.open { color:var(--pos); } .pill.ex.open i { background:var(--pos); }
.pill.ex.closed i { background:var(--muted); }
.tag.shared { background:rgba(88,166,255,.15); color:var(--accent); }

/* ---- search suggestions ---- */
.suggest-wrap { position:relative; flex:2 1 220px; display:flex; }
.suggest-wrap input { flex:1; width:100%; }
.suggest { position:absolute; top:100%; left:0; right:0; z-index:20; margin:.2rem 0 0; padding:0; list-style:none;
           background:var(--card); border:1px solid var(--line); border-radius:6px; box-shadow:0 8px 24px rgba(0,0,0,.4); max-height:320px; overflow:auto; }
.suggest li { padding:.4rem .6rem; cursor:pointer; display:flex; gap:.5rem; align-items:baseline; }
.suggest li b { min-width:70px; } .suggest li span { flex:1; color:var(--fg); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.suggest li small { color:var(--muted); white-space:nowrap; }
.suggest li:hover, .suggest li.active { background:rgba(88,166,255,.12); }

/* ---- toolbar, tags, columns ---- */
.toolbar { display:flex; gap:.8rem; align-items:center; flex-wrap:wrap; padding:.5rem .8rem; }
.toolbar input[type=search] { flex:1 1 220px; max-width:360px; }
.toolbar .check { display:flex; gap:.3rem; align-items:center; color:var(--muted); font-size:.85rem; cursor:pointer; }
.toolbar .spacer { flex:1; }
.toolbar details.columns { position:relative; }
.toolbar details.columns summary { cursor:pointer; color:var(--muted); font-size:.85rem; list-style:none; padding:.3rem .6rem; border:1px solid var(--line); border-radius:6px; }
.toolbar details.columns[open] summary { border-color:var(--accent); color:var(--fg); }
.col-list { position:absolute; z-index:15; top:110%; left:0; background:var(--card); border:1px solid var(--line); border-radius:6px;
            padding:.6rem .8rem; display:grid; grid-template-columns:repeat(2, minmax(150px, 1fr)); gap:.25rem .8rem; min-width:360px; box-shadow:0 8px 24px rgba(0,0,0,.4); }
.col-list label { display:flex; gap:.4rem; align-items:baseline; font-size:.85rem; white-space:nowrap; }
.col-list label .subtle { display:none; }
.col-hidden { display:none !important; }
th.sortable-th { cursor:pointer; user-select:none; }
th.sortable-th:hover { color:var(--fg); }
th.sorted-asc::after { content:" ▲"; font-size:.65rem; } th.sorted-desc::after { content:" ▼"; font-size:.65rem; }
.tags { display:flex; gap:.25rem; flex-wrap:wrap; margin-top:.15rem; }
.tagpill { font-size:.7rem; padding:0 .4rem; border-radius:10px; background:rgba(163,113,247,.15); color:#a371f7; border:none; cursor:pointer; font-family:inherit; }
.tagpill:hover { background:rgba(163,113,247,.3); text-decoration:none; }
table.overview.compact th, table.overview.compact td { padding:.15rem .4rem; font-size:.8rem; }
table.overview.compact .notes, table.overview.compact .tags, table.overview.compact .spark-cell { display:none; }
table.overview.compact .range { width:50px; }
.row-actions { display:flex; gap:.5rem; margin-top:.4rem; flex-wrap:wrap; }
code { background:var(--bg); padding:.05rem .3rem; border-radius:4px; font-size:.85em; }
.journal { list-style:none; margin:.6rem 0 0; padding:0; }
.journal li { display:grid; grid-template-columns:1fr auto; gap:.2rem .8rem; padding:.5rem 0; border-bottom:1px solid var(--line); }
.journal li time { grid-column:1 / -1; color:var(--muted); font-size:.8rem; }
.journal li p { margin:0; white-space:pre-wrap; }
tr.audit-warn td { color:var(--warn); }
input[type=file] { color:var(--muted); }

/* ---- mobile: card layout for the overview table ---- */
@media (max-width: 700px) {
  main { padding:.6rem; }
  header.top nav { max-width:100%; overflow-x:auto; scrollbar-width:none; }
  .status { font-size:.75rem; }
  form.add input, form.add select { flex:1 1 45%; }
  .suggest-wrap { flex:1 1 100%; }
  .toolbar details.columns .col-list { left:auto; right:0; min-width:260px; grid-template-columns:1fr; }
  table.overview.sortable { white-space:normal; }
  table.overview.sortable thead { display:none; }
  table.overview.sortable tbody tr { display:grid; grid-template-columns:repeat(3, 1fr); gap:.15rem .6rem;
                                     padding:.6rem .2rem; border-bottom:1px solid var(--line); position:relative; }
  table.overview.sortable tbody tr:hover { background:none; }
  table.overview.sortable td { display:block; border:none; padding:.1rem 0; text-align:left; }
  table.overview.sortable td.r { text-align:left; }
  table.overview.sortable td[data-label]::before { content:attr(data-label); display:block; color:var(--muted); font-size:.65rem; text-transform:uppercase; letter-spacing:.04em; }
  table.overview.sortable td[data-col="symbol"], table.overview.sortable td[data-col="name"] { grid-column:span 3; }
  table.overview.sortable td[data-col="symbol"]::before, table.overview.sortable td[data-col="name"]::before { display:none; }
  table.overview.sortable td[data-col="symbol"] { font-size:1.05rem; }
  table.overview.sortable td.name { max-width:none; white-space:normal; }
  table.overview.sortable td.spark-cell, table.overview.sortable td[data-col="52w"], table.overview.sortable td[data-col="macd"],
  table.overview.sortable td[data-col="rvol"], table.overview.sortable td[data-col="beta"], table.overview.sortable td[data-col="3m"],
  table.overview.sortable td[data-col="vs50"], table.overview.sortable td[data-col="grp"],
  table.overview.sortable td[data-col="vol"], table.overview.sortable td[data-col="dd"], table.overview.sortable td[data-col="mcap"] { display:none; }
  table.overview.sortable td.actions { position:absolute; top:.5rem; right:.2rem; }
  table.overview.sortable td.nodata { grid-column:span 3; }
  .col-list label .subtle { display:none; }
}

/* ---- technical signals ---- */
.sig { font-size:.8rem; } .sig.bull { color:var(--pos); } .sig.bear { color:var(--neg); } .sig.neutral { color:var(--warn); }
.col-list.static { position:static; box-shadow:none; border:none; padding:0; min-width:0; grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); }
.col-list.static label { white-space:normal; }
.col-list.static label .subtle { display:inline; }

/* hover help */
th[title], dt[title] { cursor:help; text-decoration:underline dotted; text-decoration-color:color-mix(in srgb, var(--muted) 55%, transparent); text-underline-offset:3px; }
td[title] { cursor:help; }
.help.right { text-align:right; margin:-.4rem 0 .4rem; }
details.gloss { margin:.4rem 0; }
details.gloss summary { cursor:pointer; font-weight:600; padding:.3rem 0; }
dl.gloss { grid-template-columns: minmax(7rem, auto) 1fr; gap:.45rem 1rem; padding:.3rem 0 .5rem; }
dl.gloss dt { color:var(--fg); font-weight:600; }
dl.gloss dd { text-align:left; color:var(--muted); font-variant-numeric:normal; line-height:1.4; }
@media (max-width: 700px) { dl.gloss { grid-template-columns: 1fr; gap:.1rem; } dl.gloss dd { margin-bottom:.6rem; } }

/* earnings calendar */
.monthnav { display:flex; align-items:center; gap:.5rem; }
.monthnav h3 { margin:0; min-width:10.5rem; text-align:center; font-size:1.05rem; }
.monthnav a { padding:.2rem .6rem; border:1px solid var(--line); border-radius:6px; color:var(--muted); }
.monthnav a:hover { color:var(--fg); border-color:var(--muted); }
.tabs.sectors { margin:.3rem 0 .5rem; } .tabs.sectors a small { color:var(--muted); margin-left:.25rem; }
.calgrid { display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:4px; }
.calgrid.weekdays { grid-template-columns:repeat(5, minmax(0,1fr)); }
.calgrid .dow { color:var(--muted); font-size:.72rem; text-transform:uppercase; letter-spacing:.04em; padding:.1rem .35rem; }
.calgrid .day { background:var(--bg); border:1px solid var(--line); border-radius:6px; padding:.3rem .4rem; min-height:5.5rem; font-size:.78rem; min-width:0; }
.calgrid .day.out { opacity:.45; } .calgrid .day.today { border-color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent); }
.calgrid .day.past .ev { opacity:.75; }
.calgrid .dnum { display:flex; justify-content:space-between; color:var(--muted); margin-bottom:.25rem; }
.calgrid .dnum .full { display:none; }
.calgrid .cnt { background:#21262d; border-radius:10px; padding:0 .45rem; font-size:.68rem; }
.ev { display:flex; gap:.3rem; align-items:baseline; white-space:nowrap; overflow:hidden; line-height:1.55; min-width:0; }
.ev .t { color:var(--muted); width:.9rem; text-align:center; flex:none; } .ev.BMO .t { color:var(--warn); } .ev.AMC .t { color:var(--accent); }
.ev .sym { flex:none; } .ev .name { color:var(--muted); overflow:hidden; text-overflow:ellipsis; flex:1 1 auto; min-width:0; }
.ev .sur { font-size:.7rem; flex:none; }
.ev.watched { background:rgba(88,166,255,.14); border-radius:4px; margin:0 -.25rem; padding:0 .25rem; }
button.addsym { padding:0 .35rem; font-size:.7rem; line-height:1.3; border-radius:4px; opacity:0; flex:none; }
.ev:hover button.addsym, tr:hover button.addsym, button.addsym:focus { opacity:1; }
.calgrid details summary { color:var(--muted); cursor:pointer; font-size:.72rem; margin-top:.15rem; }
table.overview tr.watched td { background:rgba(88,166,255,.08); }
@media (max-width: 700px) {
  .calgrid, .calgrid.weekdays { grid-template-columns:1fr; }
  .calgrid .dow, .calgrid .day.out, .calgrid .day.empty { display:none; }
  .calgrid .day { min-height:0; } .calgrid .dnum .dom { display:none; } .calgrid .dnum .full { display:inline; }
  button.addsym { opacity:1; }
  .monthnav h3 { min-width:0; }
}

/* signal meanings and the per-symbol reading */
.meaning { color:var(--muted); font-size:.78rem; line-height:1.35; margin-top:.1rem; white-space:normal; }
.events li .meaning { max-width:60ch; }
.reading { border-left:3px solid var(--line); padding:.4rem .8rem; margin:0 0 .8rem; background:rgba(110,118,129,.06); border-radius:0 6px 6px 0; }
.reading.bullish { border-color:var(--pos); } .reading.bearish { border-color:var(--neg); } .reading.mixed { border-color:var(--warn); }
.reading p { margin:.15rem 0; font-size:.85rem; line-height:1.45; } .reading em { color:var(--muted); font-style:normal; }
.reading b { font-weight:600; }
.col-list.static label .meaning { display:block; margin-left:1.4rem; }

/* extended hours */
.live.pre, .live.post { background:var(--accent); }
.pill.ex.pre, .pill.ex.post { color:var(--accent); } .pill.ex.pre i, .pill.ex.post i { background:var(--accent); }
.ext { font-size:.72rem; color:var(--muted); white-space:nowrap; line-height:1.3; }
.ext strong { color:var(--fg); font-weight:600; text-transform:capitalize; }
.price .ext { font-size:.85rem; margin-top:.15rem; }
table.overview.compact .ext { display:none; }

/* context card and backtest */
.ctx { display:grid; grid-template-columns: minmax(340px, 2fr) minmax(280px, 3fr); gap:1rem; align-items:start; }
.ctx-table td, .ctx-table th { padding:.25rem .5rem; }
.hist { color:var(--fg); opacity:.85; }
table.bt tr.baseline td { border-bottom:2px solid var(--line); color:var(--muted); }
@media (max-width: 900px) { .ctx { grid-template-columns:1fr; } }

/* tap help sheet on touch screens */
#tip { position:fixed; left:0; right:0; bottom:0; z-index:50; background:var(--card); border-top:1px solid var(--accent); box-shadow:0 -8px 24px rgba(0,0,0,.5); padding:.7rem 1rem calc(.9rem + env(safe-area-inset-bottom)); max-height:45vh; overflow:auto; font-size:.9rem; line-height:1.45; }
#tip .tip-head { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:.3rem; }
#tip .tip-head b { font-size:.95rem; }
#tip .tip-close { padding:.15rem .5rem; }
#tip p { margin:.25rem 0; }
@media (hover: none), (pointer: coarse) { th[title], dt[title] { text-decoration:none; } }