:root {
  --bg: #0b0e13;
  --panel: #11151c;
  --panel-2: #161b24;
  --line: #222a36;
  --text: #e6e9ef;
  --muted: #7d8696;
  --up: #22c55e;
  --down: #ef4444;
  --accent: #38bdf8;
  --warn: #f59e0b;
  --mono: 'JetBrains Mono', ui-monospace, monospace;
  --radius: 10px;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { margin: 0; height: 100%; }
body {
  background: var(--bg);
  color: var(--text);
  font: 14px/1.4 Inter, system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}
button, input, select { font: inherit; color: inherit; }
button {
  background: var(--accent); color: #04121b; border: 0; border-radius: 8px;
  padding: 8px 14px; font-weight: 600; cursor: pointer;
}
button.ghost { background: transparent; color: var(--text); border: 1px solid var(--line); font-weight: 500; }
button.ghost:hover { border-color: var(--muted); }
button.ghost.active { border-color: var(--accent); color: var(--accent); }
input, select {
  background: var(--panel-2); border: 1px solid var(--line); border-radius: 8px;
  padding: 8px 10px; outline: none; min-width: 0;
}
input:focus, select:focus { border-color: var(--accent); }
.muted { color: var(--muted); }
.small { font-size: 12px; }

/* Top bar */
.topbar {
  display: flex; align-items: center; gap: 16px;
  padding: 10px 16px; border-bottom: 1px solid var(--line); background: var(--panel);
  padding-top: max(10px, env(safe-area-inset-top));
}
.brand { display: flex; align-items: center; gap: 10px; font-weight: 700; letter-spacing: -0.01em; }
.logo { display: inline-flex; align-items: end; gap: 3px; height: 18px; }
.logo i { display: block; width: 4px; border-radius: 1px; }
.logo i:nth-child(1) { height: 10px; background: var(--down); }
.logo i:nth-child(2) { height: 18px; background: var(--up); }
.logo i:nth-child(3) { height: 13px; background: var(--up); }
.feed { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.feed .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--warn); }
.feed.live .dot { background: var(--up); box-shadow: 0 0 0 3px rgba(34,197,94,.15); }
.feed.demo .dot { background: var(--accent); }
.top-actions { margin-left: auto; display: flex; gap: 8px; }

/* Layout */
.layout { display: grid; grid-template-columns: 270px 1fr; height: calc(100% - 53px); }
.side { border-right: 1px solid var(--line); background: var(--panel); display: flex; flex-direction: column; min-height: 0; }
.main { display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow-y: auto; }

/* Search */
.search { position: relative; padding: 12px; }
.search input { width: 100%; }
.results {
  position: absolute; left: 12px; right: 12px; top: 52px; z-index: 20;
  list-style: none; margin: 0; padding: 4px; background: var(--panel-2);
  border: 1px solid var(--line); border-radius: var(--radius); max-height: 320px; overflow-y: auto;
  box-shadow: 0 12px 30px rgba(0,0,0,.4);
}
.results li { padding: 8px 10px; border-radius: 6px; cursor: pointer; display: flex; gap: 10px; }
.results li:hover, .results li.sel { background: var(--line); }
.results b { font-family: var(--mono); min-width: 56px; }
.results span { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Watchlist */
.watchlist { list-style: none; margin: 0; padding: 0 8px 12px; overflow-y: auto; }
.wl-item {
  display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; gap: 0 8px;
  padding: 10px; border-radius: 8px; cursor: pointer; position: relative;
}
.wl-item:hover { background: var(--panel-2); }
.wl-item.sel { background: var(--panel-2); box-shadow: inset 3px 0 0 var(--accent); }
.wl-sym { font-family: var(--mono); font-weight: 600; }
.wl-price { font-family: var(--mono); text-align: right; transition: color .3s; }
.wl-sub { grid-column: 1; font-size: 12px; color: var(--muted); display: flex; gap: 6px; align-items: center; }
.wl-chg { grid-column: 2; font-family: var(--mono); font-size: 12px; text-align: right; }
.wl-remove {
  position: absolute; right: -2px; top: 50%; transform: translateY(-50%);
  background: var(--panel); color: var(--muted); border: 1px solid var(--line);
  width: 22px; height: 22px; padding: 0; border-radius: 50%; font-size: 13px; line-height: 1;
  opacity: 0; transition: opacity .15s;
}
.wl-item:hover .wl-remove { opacity: 1; }
.flash-up { color: var(--up) !important; }
.flash-down { color: var(--down) !important; }
.up { color: var(--up); }
.down { color: var(--down); }
.badge { font-size: 10px; padding: 1px 5px; border-radius: 4px; background: var(--line); color: var(--text); }
.badge.near { background: rgba(245,158,11,.2); color: var(--warn); }
.hint { color: var(--muted); padding: 0 16px; font-size: 13px; }

/* Chart header */
.chart-head { display: flex; justify-content: space-between; align-items: end; padding: 14px 16px 6px; gap: 12px; }
.title h1 { margin: 0; font: 600 22px var(--mono); letter-spacing: -0.02em; }
.title .muted { font-size: 13px; }
.quote { text-align: right; }
.price { font: 600 24px var(--mono); display: block; }
.chg { font: 500 13px var(--mono); }
.toolbar { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 6px 16px 10px; flex-wrap: wrap; }
.tfs { display: flex; gap: 2px; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 3px; }
.tfs button { background: transparent; color: var(--muted); padding: 5px 11px; font-weight: 500; font-family: var(--mono); font-size: 12px; }
.tfs button.on { background: var(--panel-2); color: var(--text); }

.chart-wrap { position: relative; flex: 1 1 auto; min-height: 380px; margin: 0 16px; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
#chart { position: absolute; inset: 0; }
.chart-wrap.placing { outline: 2px dashed var(--accent); outline-offset: -2px; cursor: crosshair; }
.chart-msg {
  position: absolute; inset: 0; display: grid; place-items: center; text-align: center; padding: 24px;
  color: var(--muted); background: rgba(11,14,19,.75); z-index: 5;
}
.ohlc { position: absolute; left: 10px; top: 8px; z-index: 4; font: 11px var(--mono); color: var(--muted); pointer-events: none; }
.ohlc b { color: var(--text); font-weight: 500; }

/* Levels */
.levels { padding: 14px 16px 24px; }
.levels-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.levels h2 { margin: 0; font-size: 15px; }
.level-form { display: grid; grid-template-columns: 110px 130px 1fr auto; gap: 8px; margin-bottom: 10px; }
.level-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.level {
  display: grid; grid-template-columns: 10px 90px 1fr auto auto auto; align-items: center; gap: 10px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px;
}
.level .sw { width: 10px; height: 10px; border-radius: 2px; }
.level .lp { font-family: var(--mono); font-weight: 600; }
.level .dist { font: 12px var(--mono); color: var(--muted); }
.level button { background: transparent; border: 0; color: var(--muted); padding: 4px 6px; font-size: 15px; }
.level button.bell.on { color: var(--warn); }
.level button:hover { color: var(--text); }

/* View tabs */
.viewtabs { display: flex; gap: 4px; padding: 12px 16px 0; border-bottom: 1px solid var(--line); }
.viewtabs button { background: transparent; color: var(--muted); border-radius: 0; padding: 8px 14px; border-bottom: 2px solid transparent; font-weight: 600; }
.viewtabs button.on { color: var(--text); border-bottom-color: var(--accent); }
.chart-view { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }

/* Movers */
.movers { padding: 14px 16px 24px; }
.movers-head { display: flex; justify-content: space-between; align-items: start; gap: 12px; margin-bottom: 12px; }
.movers h2 { margin: 0; font-size: 17px; }
.movers h2 .small { font-weight: 400; margin-left: 6px; }
.movers p { margin: 4px 0 0; }
.movers h3 { font-size: 14px; margin: 0 0 8px; }
.movers h3 .small { font-weight: 400; margin-left: 4px; }
.movers-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.movers-msg { background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 12px; margin-bottom: 12px; color: var(--muted); }
.mover-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.mover {
  display: grid; grid-template-columns: 1fr auto; gap: 4px 10px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px;
}
.mover .top { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.mover .sym { font: 600 15px var(--mono); }
.mover .nm { color: var(--muted); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mover .px { font: 500 14px var(--mono); text-align: right; }
.mover .pct { font: 600 13px var(--mono); }
.mover .tags { display: flex; flex-wrap: wrap; gap: 4px; }
.mover .tag, .pick .tag { font-size: 11px; padding: 2px 6px; border-radius: 4px; background: var(--panel-2); color: var(--muted); border: 1px solid var(--line); }
.mover .tag.good, .pick .tag.good { color: var(--up); border-color: rgba(34,197,94,.3); }
.mover .tag.warn, .pick .tag.warn { color: var(--warn); border-color: rgba(245,158,11,.3); }
.mover .act { display: flex; gap: 6px; align-items: center; justify-content: end; }
.mover .act button { padding: 5px 10px; font-size: 12px; }
.mover .meter { grid-column: 1 / -1; height: 4px; border-radius: 2px; background: var(--line); position: relative; }
.mover .meter i { position: absolute; top: -3px; width: 2px; height: 10px; background: var(--text); border-radius: 1px; }
.mover .meter-l { grid-column: 1 / -1; display: flex; justify-content: space-between; font: 10px var(--mono); color: var(--muted); margin-top: -2px; }
.filtered { margin-top: 16px; color: var(--muted); font-size: 13px; }
.filtered summary { cursor: pointer; }
.filtered ul { margin: 8px 0 0; padding-left: 18px; columns: 2; }
.disclaimer { margin-top: 14px !important; }

/* Top 5 */
.top5 { padding: 14px 16px 24px; }
.top5-ctrl { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; justify-content: end; }
.risk { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 13px; }
.risk input { width: 80px; padding: 6px 8px; font-family: var(--mono); }
.ai-overview { background: var(--panel); border: 1px solid var(--line); border-left: 3px solid var(--accent); border-radius: 0 8px 8px 0; padding: 12px 14px; margin-bottom: 12px; line-height: 1.55; }
.ai-overview b { color: var(--accent); }
.top5-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.pick { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 14px; display: grid; gap: 10px; }
.pick-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pick .rank { font: 600 13px var(--mono); color: var(--muted); }
.pick .sym { font: 600 18px var(--mono); }
.pick .nm { color: var(--muted); font-size: 13px; }
.pill { font: 600 11px var(--mono); padding: 3px 7px; border-radius: 4px; letter-spacing: .03em; }
.pill.long { background: rgba(34,197,94,.15); color: var(--up); }
.pill.short { background: rgba(239,68,68,.15); color: var(--down); }
.pill.grade { background: var(--panel-2); color: var(--text); border: 1px solid var(--line); }
.pill.conf-high { background: rgba(56,189,248,.15); color: var(--accent); }
.pill.conf-medium { background: rgba(245,158,11,.15); color: var(--warn); }
.pill.conf-low { background: var(--panel-2); color: var(--muted); }
.pick .px { margin-left: auto; font: 500 15px var(--mono); }
.facts { display: flex; flex-wrap: wrap; gap: 6px; }
.facts span { font: 12px var(--mono); padding: 3px 7px; background: var(--panel-2); border-radius: 4px; color: var(--muted); }
.facts span b { color: var(--text); font-weight: 500; }
.planrow { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.planrow div { background: var(--bg); border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; }
.planrow small { display: block; color: var(--muted); font-size: 11px; }
.planrow b { font: 600 14px var(--mono); }
.planrow .stopc b { color: var(--down); } .planrow .tgtc b { color: var(--up); }
.ai-text { font-size: 13.5px; line-height: 1.55; display: grid; gap: 4px; }
.ai-text p { margin: 0; } .ai-text em { font-style: normal; color: var(--muted); }
.why { display: flex; flex-wrap: wrap; gap: 4px; }
.sizing { font: 13px var(--mono); color: var(--muted); }
.sizing b { color: var(--text); font-weight: 500; }
.pick-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.pick-actions button { padding: 6px 12px; font-size: 13px; }
table.sl { width: 100%; border-collapse: collapse; margin-top: 8px; font: 12px var(--mono); }
table.sl th, table.sl td { text-align: left; padding: 5px 6px; border-bottom: 1px solid var(--line); }
table.sl th { color: var(--muted); font-weight: 500; }

/* Toasts */
.toasts { position: fixed; right: 16px; bottom: 16px; display: grid; gap: 8px; z-index: 100; max-width: min(360px, calc(100% - 32px)); }
.toast {
  background: var(--panel-2); border: 1px solid var(--line); border-left: 4px solid var(--warn);
  border-radius: 8px; padding: 10px 14px; box-shadow: 0 10px 30px rgba(0,0,0,.45);
  animation: pop .2s ease-out;
}
.toast b { font-family: var(--mono); }
@keyframes pop { from { transform: translateY(8px); opacity: 0; } }

/* Phone */
@media (max-width: 760px) {
  .topbar { gap: 10px; padding-left: 12px; padding-right: 12px; }
  .brand span:last-child { display: none; }
  .top-actions button { padding: 6px 10px; font-size: 12px; }
  .layout { display: flex; flex-direction: column; height: auto; }
  .side { border-right: 0; border-bottom: 1px solid var(--line); }
  .search { padding: 10px 12px 6px; }
  .results { top: 48px; }
  .watchlist { display: flex; gap: 6px; overflow-x: auto; padding: 4px 12px 10px; scrollbar-width: none; }
  .watchlist::-webkit-scrollbar { display: none; }
  .wl-item { flex: 0 0 auto; min-width: 128px; border: 1px solid var(--line); }
  .wl-item.sel { box-shadow: inset 0 -2px 0 var(--accent); }
  .wl-remove { opacity: 1; top: -6px; right: -6px; transform: none; width: 20px; height: 20px; }
  .main { overflow: visible; }
  .chart-head { padding: 12px 12px 4px; }
  .toolbar { padding: 6px 12px 8px; }
  .chart-wrap { margin: 0 12px; min-height: 0; height: 58vh; }
  .levels { padding: 12px; }
  .level-form { grid-template-columns: 1fr 1fr; }
  .level-form #lvLabel { grid-column: 1 / -1; }
  .level-form button { grid-column: 1 / -1; }
  .level { grid-template-columns: 10px 76px 1fr auto auto; }
  .level .dist { display: none; }
  .viewtabs { padding: 8px 12px 0; }
  .movers { padding: 12px; }
  .movers-cols { grid-template-columns: 1fr; }
  .filtered ul { columns: 1; }
  .top5 { padding: 12px; }
  .top5-ctrl { justify-content: start; }
  .planrow { grid-template-columns: repeat(2, 1fr); }
  .viewtabs button { padding: 8px 10px; }
  table.sl { font-size: 11px; }
}
@media (max-width: 760px) {
  .top5 .movers-head { flex-direction: column; align-items: stretch; }
  .top5-ctrl { justify-content: stretch; }
  .top5-ctrl #aiBtn { flex: 1 1 100%; }
}

/* News */
.news { padding: 0 16px 24px; }
.news-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.news-item { display: grid; grid-template-columns: 10px 1fr auto; gap: 10px; align-items: start; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 9px 12px; }
.news-item .dot { width: 8px; height: 8px; border-radius: 50%; margin-top: 6px; background: var(--muted); }
.news-item .dot.pos { background: var(--up); } .news-item .dot.neg { background: var(--down); }
.news-item a { color: var(--text); text-decoration: none; line-height: 1.45; }
.news-item a:hover { text-decoration: underline; }
.news-item .src { display: block; color: var(--muted); font-size: 12px; margin-top: 2px; }
.news-item .age { font: 12px var(--mono); color: var(--muted); white-space: nowrap; }
.sent { font: 600 12px var(--mono); padding: 2px 6px; border-radius: 4px; }
.sent.pos { color: var(--up); background: rgba(34,197,94,.12); } .sent.neg { color: var(--down); background: rgba(239,68,68,.12); } .sent.neu { color: var(--muted); background: var(--panel-2); }
.earn-warn { background: rgba(245,158,11,.1); border: 1px solid rgba(245,158,11,.35); color: var(--warn); border-radius: 8px; padding: 10px 12px; margin-bottom: 12px; font-size: 13px; }
@media (max-width: 760px) { .news { padding: 0 12px 20px; } }

/* Portfolio */
.pf { padding: 14px 16px 24px; }
.pf-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 12px; }
.pf-stats div { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; }
.pf-stats small { display: block; color: var(--muted); font-size: 12px; margin-bottom: 4px; }
.pf-stats b { font: 600 18px var(--mono); }
.pf-sectors { margin-bottom: 10px; }
.pf-bar { display: flex; height: 12px; border-radius: 6px; overflow: hidden; gap: 2px; background: var(--panel); }
.pf-bar span { display: block; height: 100%; }
.pf-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 8px; font-size: 12px; color: var(--muted); }
.pf-legend i { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 5px; vertical-align: -1px; }
.pf-legend b { color: var(--text); font: 500 12px var(--mono); }
.pf-warn { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 6px; }
.pf-warn li { background: rgba(245,158,11,.1); border: 1px solid rgba(245,158,11,.35); color: var(--warn); border-radius: 8px; padding: 9px 12px; font-size: 13px; }
.pf-filter { display: flex; gap: 6px; flex-wrap: wrap; margin: 4px 0 10px; }
.pf-filter button { background: var(--panel); color: var(--muted); border: 1px solid var(--line); padding: 5px 10px; font-size: 12px; font-weight: 500; }
.pf-filter button.on { color: var(--text); border-color: var(--accent); }
.pf-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.hold { background: var(--panel); border: 1px solid var(--line); border-left: 4px solid var(--line); border-radius: 0 10px 10px 0; padding: 12px 14px; display: grid; gap: 8px; }
.hold.s-hold { border-left-color: #22c55e; } .hold.s-watch { border-left-color: #eab308; }
.hold.s-careful { border-left-color: #f97316; } .hold.s-review { border-left-color: #ef4444; }
.hold-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.hold .sym { font: 600 17px var(--mono); }
.hold .nm { color: var(--muted); font-size: 13px; }
.hold .right { margin-left: auto; text-align: right; font-family: var(--mono); }
.hold .right b { display: block; font-size: 15px; font-weight: 500; }
.hold .right span { font-size: 12px; }
.st { font: 600 11px var(--mono); padding: 3px 8px; border-radius: 4px; letter-spacing: .02em; }
.st.hold { background: rgba(34,197,94,.14); color: #22c55e; } .st.watch { background: rgba(234,179,8,.14); color: #eab308; }
.st.careful { background: rgba(249,115,22,.14); color: #f97316; } .st.review { background: rgba(239,68,68,.14); color: #ef4444; }
.chg-badge { font: 500 11px var(--mono); color: var(--accent); border: 1px solid rgba(56,189,248,.4); border-radius: 4px; padding: 2px 6px; }
.hold .line { font-size: 13.5px; line-height: 1.5; }
.hold .line em { font-style: normal; color: var(--muted); }
.hold .tags { display: flex; flex-wrap: wrap; gap: 4px; }
.hold .tag { font-size: 11px; padding: 2px 6px; border-radius: 4px; background: var(--panel-2); color: var(--muted); border: 1px solid var(--line); }
.hold .tag.good { color: var(--up); border-color: rgba(34,197,94,.3); }
.hold .tag.warn { color: var(--warn); border-color: rgba(245,158,11,.3); }
.hold .hl { font-size: 12.5px; color: var(--muted); display: grid; gap: 3px; }
.hold .hl a { color: var(--muted); text-decoration: none; } .hold .hl a:hover { color: var(--text); text-decoration: underline; }
.hold .act button { padding: 5px 10px; font-size: 12px; }
.owned { font: 500 11px var(--mono); padding: 3px 7px; border-radius: 4px; background: rgba(56,189,248,.12); color: var(--accent); }
.owned.clash { background: rgba(239,68,68,.14); color: var(--down); }
@media (max-width: 760px) {
  .pf { padding: 12px; }
  .pf-stats { grid-template-columns: repeat(2, 1fr); }
  .pf .movers-head { flex-direction: column; align-items: stretch; }
  .hold .right { margin-left: 0; text-align: left; }
}

/* Intel */
.intel { padding: 14px 16px 24px; }
.in-status { font-size: 12px; color: var(--muted); margin: -4px 0 12px; display: flex; flex-wrap: wrap; gap: 4px 14px; }
.in-status b { color: var(--text); font-weight: 500; }
.in-status .bad { color: var(--warn); }
.in-sources { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; margin-bottom: 12px; }
.in-sources table { width: 100%; border-collapse: collapse; font-size: 13px; }
.in-sources td { padding: 5px 6px; border-bottom: 1px solid var(--line); }
.in-sources td:first-child { width: 22px; }
.in-sources .prov { color: var(--muted); font-size: 12px; }
.in-upcoming { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.in-upcoming span { font-size: 12px; padding: 5px 9px; border-radius: 6px; border: 1px solid rgba(245,158,11,.4); color: var(--warn); background: rgba(245,158,11,.08); }
.in-upcoming b { font-family: var(--mono); }
.in-filters { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.in-filters .pf-filter { margin: 0; }
.in-filters select { padding: 5px 8px; font-size: 13px; }
.in-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.in-day { font: 600 12px var(--mono); color: var(--muted); margin: 10px 0 2px; text-transform: uppercase; letter-spacing: .04em; }
.in-item { display: grid; grid-template-columns: 26px 1fr auto; gap: 10px; align-items: start; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 9px 12px; }
.in-item.imp3 { border-left: 3px solid var(--down); border-radius: 0 8px 8px 0; }
.in-item.imp2 { border-left: 3px solid var(--warn); border-radius: 0 8px 8px 0; }
.in-ico { font-size: 16px; line-height: 1.4; text-align: center; }
.in-item .t { line-height: 1.45; }
.in-item .t a { color: var(--text); text-decoration: none; } .in-item .t a:hover { text-decoration: underline; }
.in-item .meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 3px; font-size: 12px; color: var(--muted); align-items: center; }
.in-item .sym { font: 600 11px var(--mono); padding: 1px 6px; border-radius: 4px; background: var(--panel-2); color: var(--text); border: 1px solid var(--line); cursor: pointer; }
.in-item .sym.held { border-color: rgba(56,189,248,.5); color: var(--accent); }
.in-item .age { font: 12px var(--mono); color: var(--muted); white-space: nowrap; }
.in-brief { display: grid; gap: 6px; margin-top: 8px; }
.in-brief .bi { display: grid; grid-template-columns: auto 1fr; gap: 8px; align-items: start; font-size: 13.5px; }
.imp { font: 600 10px var(--mono); padding: 2px 6px; border-radius: 4px; text-transform: uppercase; }
.imp.high { background: rgba(239,68,68,.15); color: var(--down); } .imp.medium { background: rgba(245,158,11,.15); color: var(--warn); } .imp.low { background: var(--panel-2); color: var(--muted); }
.dir-positive { color: var(--up); } .dir-negative { color: var(--down); }
@media (max-width: 760px) { .intel { padding: 12px; } .intel .movers-head { flex-direction: column; align-items: stretch; } }
.ai-overview a { color: var(--text); text-decoration: none; } .ai-overview a:hover { text-decoration: underline; }

/* ---------- Dip Finder ---------- */
.viewtabs { overflow-x: auto; scrollbar-width: none; }
.viewtabs button { flex: none; }
.dips { padding: 14px 16px 24px; }
.dips h2 { margin: 0; font-size: 17px; }
.dips h2 .small { font-weight: 400; margin-left: 6px; }
.dips p { margin: 4px 0 0; }
.dp-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 12px; }
.dp-stats div { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; }
.dp-stats small { display: block; color: var(--muted); font-size: 12px; margin-bottom: 3px; }
.dp-stats b { font: 600 17px var(--mono); }
.dp-progress { display: flex; align-items: center; gap: 10px; background: rgba(56,189,248,.08); border: 1px solid rgba(56,189,248,.3); color: var(--accent); border-radius: 8px; padding: 10px 12px; margin-bottom: 12px; font-size: 13px; }
.dp-progress[hidden] { display: none; }
.spin { width: 14px; height: 14px; border: 2px solid rgba(56,189,248,.3); border-top-color: var(--accent); border-radius: 50%; animation: dpspin .8s linear infinite; flex: none; }
@keyframes dpspin { to { transform: rotate(360deg); } }
.pill.st-good { background: rgba(34,197,94,.15); color: var(--up); }
.pill.st-mid { background: rgba(245,158,11,.15); color: var(--warn); }
.pill.st-bad { background: rgba(239,68,68,.15); color: var(--down); }
.pill.lbl-invest { background: rgba(167,139,250,.16); color: #a78bfa; }
.pill.lbl-wait { background: var(--panel-2); color: var(--muted); }
.pill.lbl-swing { background: rgba(56,189,248,.15); color: var(--accent); }
.dp-meter .bar { position: relative; height: 8px; background: var(--panel-2); border-radius: 4px; margin: 6px 0 8px; }
.dp-meter .fill { position: absolute; top: 0; bottom: 0; background: linear-gradient(90deg, rgba(239,68,68,.55), rgba(239,68,68,.15)); border-radius: 4px; }
.dp-meter .bar b { position: absolute; top: -4px; width: 3px; height: 16px; margin-left: -1px; border-radius: 2px; }
.dp-meter .m-low { background: var(--muted); }
.dp-meter .m-px { background: var(--text); width: 4px; }
.dp-meter .m-hi { background: var(--down); }
.dp-meter .m-tg { background: var(--up); }
.dp-meter .lbls { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 4px 12px; font-size: 12px; color: var(--muted); }
.dp-meter .lbls b { color: var(--text); font: 500 12px var(--mono); }
.dp-meter .lbls em { font-style: normal; font: 500 12px var(--mono); }
.dp-meter .lbls .tg b { color: var(--up); }
.dp-meter .lbls i { display: inline-block; width: 3px; height: 10px; border-radius: 2px; margin-right: 5px; vertical-align: -1px; }
.dp-plan { display: grid; gap: 8px; }
.dp-inv { background: var(--bg); border: 1px solid var(--line); border-left: 3px solid #a78bfa; border-radius: 8px; padding: 8px 10px; font-size: 13px; }
.dp-inv small { display: block; color: var(--muted); font-size: 11px; margin-bottom: 2px; }
.dp-inv b { font-family: var(--mono); font-weight: 600; }
.dp-how { font-size: 13px; line-height: 1.55; padding: 4px 4px 0; }
.dp-how ol { margin: 6px 0; padding-left: 20px; }
#dpRejList { font-size: 13px; line-height: 1.7; }
@media (max-width: 760px) {
  .dp-stats { grid-template-columns: repeat(2, 1fr); }
  .dp-meter .lbls { font-size: 11px; }
}

.dp-own { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line); color: var(--warn); font-size: 13px; }

/* Tabs always visible while scrolling */
.viewtabs { position: sticky; top: 0; z-index: 20; background: var(--bg); flex: none; }

/* Hot 10 */
.hot-banner { background: rgba(249,115,22,.09); border: 1px solid rgba(249,115,22,.35); color: #fdba74; border-radius: 8px; padding: 10px 12px; margin-bottom: 12px; font-size: 13px; line-height: 1.5; }
.hot-banner b { color: #fb923c; }
.pick.hot { border-left: 3px solid #f97316; }

.planrow .pnl { display: block; font: 600 13px var(--mono); font-style: normal; margin-top: 2px; }

/* Dip Finder: the story behind the dip (business, sector, drop day) */
.facts.dp-story { margin-top: 6px; padding-top: 6px; border-top: 1px dashed var(--line, #2a3140); }

.facts.dp-moves span.up { color: var(--up, #22c55e); }
.facts.dp-moves span.down { color: var(--down, #ef4444); }

/* Movers: Claude's plan under each mover */
.mover .mv-plan { grid-column: 1 / -1; display: grid; gap: 8px; margin-top: 6px; padding-top: 8px; border-top: 1px dashed var(--line); }
.mover .mv-plan.skip { opacity: .75; }
.mover .mv-head { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.mover .mv-plan .planrow { grid-template-columns: repeat(3, 1fr); }

/* Three stop options under a plan */
.stops-tbl { display: grid; gap: 4px; overflow-x: auto; }
.stops-tbl table { width: 100%; border-collapse: collapse; font: 12.5px var(--mono); }
.stops-tbl th { text-align: left; color: var(--muted); font-weight: 500; font-size: 11px; padding: 4px 6px; border-bottom: 1px solid var(--line); }
.stops-tbl td { padding: 5px 6px; border-bottom: 1px solid var(--line); vertical-align: top; }
.stops-tbl tr.on td { background: var(--panel-2); }

/* Charts tab: grid of 1-minute charts */
.gridview { padding-bottom: 24px; }
.gd-grid { display: grid; grid-template-columns: repeat(var(--gd-cols, 2), minmax(0, 1fr)); gap: 12px; }
.gd-card { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 8px; display: grid; gap: 6px; min-width: 0; }
.gd-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
/* Long / short at a glance: coloured left edge and a bold badge */
.gd-card.gd-long { border-left: 4px solid var(--up); }
.gd-card.gd-short { border-left: 4px solid var(--down); }
.pill.gd-dir { font-weight: 700; font-size: 12px; padding: 3px 8px; }
.gd-sym { background: none; border: 0; padding: 0; font: 600 15px var(--mono); color: var(--text); cursor: pointer; }
.gd-sym:hover { color: var(--accent); }
.gd-px { margin-left: auto; font: 500 13px var(--mono); }
.gd-chart { height: 320px; }
.gd-editor { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.gd-editor input { flex: 1 1 180px; }
@media (max-width: 760px) { .gd-grid { grid-template-columns: 1fr; } .gd-chart { height: 280px; } }

/* Scorecard */
.sc-wrap { overflow-x: auto; margin-bottom: 14px; }
.sc-tbl { width: 100%; border-collapse: collapse; font: 13px var(--mono); }
.sc-tbl th { text-align: left; color: var(--muted); font-weight: 500; font-size: 11px; padding: 6px 8px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.sc-tbl td { padding: 6px 8px; border-bottom: 1px solid var(--line); white-space: nowrap; vertical-align: top; }
.sc-tbl tbody tr:last-child td { border-bottom: 0; }
#scSummary tbody tr:last-child td { border-top: 1px solid var(--line); background: var(--panel-2); }
.sc-h { margin: 6px 0 8px; font-size: 14px; }

/* Stocks in play table (Top 5) */
.inplay .ip-row { cursor: pointer; }
.inplay .ip-row:hover td { background: var(--panel-2); }