:root {
  --bg:#111827; --panel:#1f2937; --panel2:#0f172a; --line:#374151;
  --text:#f3f4f6; --muted:#9ca3af; --accent:#2563eb; --accent2:#60a5fa;
  --buy:#22c55e; --sell:#ef4444; --warn:#f59e0b;
}
* { box-sizing: border-box; }
body { font-family: Arial, sans-serif; background: var(--bg); color: var(--text); margin: 0; }
button { background: var(--accent); color: white; padding: 11px 15px; border: 0; border-radius: 8px; cursor: pointer; font-weight: bold; }
button:hover { background: #1d4ed8; }
button.secondary { background: var(--panel2); border: 1px solid var(--line); color: var(--text); }
button.secondary:hover { border-color: var(--accent2); color: var(--accent2); }
button:disabled { opacity: .55; cursor: not-allowed; }
input, select { background: var(--panel2); color: var(--text); border: 1px solid var(--line); border-radius: 8px; padding: 10px; }
.shell { display: grid; grid-template-columns: 400px 1fr; min-height: 100vh; }
aside { border-right: 1px solid var(--line); background: #0f172a; padding: 18px; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
main { padding: 24px; overflow: auto; }
.card { background: var(--panel); border-radius: 12px; padding: 20px; margin-bottom: 20px; box-shadow: 0 2px 12px rgba(0,0,0,0.25); border: 1px solid rgba(255,255,255,.03); }
.logo-wrap {
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:6px;
}

.logo-img {
  width:42px;
  height:42px;
  object-fit:contain;
  border-radius:8px;
}

.logo-text {
  font-size:22px;
  font-weight:800;
  letter-spacing:.02em;
}
.muted { color: var(--muted); }
.small { font-size: .88rem; }
.row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }

.filter { width:100%; margin: 12px 0; }
.symbol-group { margin: 12px 0 6px; font-size: .75rem; color: var(--muted); text-transform: uppercase; font-weight:bold; letter-spacing:.06em; }
.chips { display:flex; flex-wrap:wrap; gap:5px; }
.chip { border:1px solid var(--line); background:#111827; border-radius:999px; padding:5px 8px; color:var(--muted); cursor:pointer; font-size:.80rem; }
.chip:hover, .chip.active { color:#fff; border-color:var(--accent2); background:#1d4ed8; }
.status { display:inline-flex; align-items:center; gap:8px; color:var(--muted); font-size:.9rem; }
.dot { width:9px; height:9px; border-radius:999px; background:var(--muted); display:inline-block; }
.dot.running { background:var(--warn); animation:pulse 1s infinite; }
.dot.done { background:var(--buy); }
.dot.err { background:var(--sell); }
@keyframes pulse { 50% { opacity:.35; } }
.success { background:#052e16; color:#bbf7d0; padding:12px; border-radius:10px; margin-bottom:16px; display:none; }
.error-box { background:#7f1d1d; color:#fecaca; padding:12px; border-radius:10px; margin-bottom:16px; display:none; }
.summary-grid { display:grid; grid-template-columns: repeat(4, minmax(120px,1fr)); gap:12px; }
.metric { background:var(--panel2); border:1px solid var(--line); border-radius:10px; padding:14px; }
.metric strong { display:block; font-size:1.3rem; margin-top:5px; }
table { width:100%; border-collapse:collapse; font-size:.92rem; }
th, td { padding:10px; border-bottom:1px solid var(--line); text-align:left; white-space:nowrap; }
th { color:var(--muted); font-size:.82rem; }
.buy { color:var(--buy); } .sell { color:var(--sell); } .warn { color:var(--warn); }
.table-wrap { overflow-x:auto; }
.tag { display:inline-block; padding:5px 9px; border-radius:999px; background:#374151; font-size:.82rem; }
.tag.buy { background:#052e16; color:#bbf7d0; }
.tag.sell { background:#450a0a; color:#fecaca; }
.log { background:#020617; border:1px solid var(--line); border-radius:10px; padding:12px; max-height:160px; overflow:auto; color:var(--muted); font-family:monospace; font-size:.82rem; }
.log div { margin-bottom:3px; }

/* Spinner overlay */
.loading-overlay { position:fixed; inset:0; background:rgba(10,15,30,0.92); display:none; align-items:center; justify-content:center; z-index:9999; }
.loading-box { background:#111827; border:0.5px solid #374151; border-radius:16px; padding:32px 36px; text-align:center; min-width:300px; }
.ticker-label { font-size:13px; color:#60a5fa; letter-spacing:.1em; text-transform:uppercase; margin-bottom:6px; font-weight:bold; }
.analyzing-title { font-size:18px; font-weight:bold; color:#f3f4f6; margin-bottom:24px; }
.bar-wrap { background:#1f2937; border-radius:999px; height:6px; width:100%; overflow:hidden; margin-bottom:10px; position:relative; }
.bar-fill { height:100%; border-radius:999px; background:#2563eb; width:0%; transition:width 0.5s ease; position:relative; }
.bar-shimmer { position:absolute; top:0; left:0; right:0; bottom:0; background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,0.08) 50%,transparent 100%); animation:shimmer 1.5s infinite; border-radius:999px; }
@keyframes shimmer { 0%{transform:translateX(-100%)} 100%{transform:translateX(100%)} }
.step-label { font-size:13px; color:#9ca3af; margin-bottom:4px; min-height:18px; }
.pct-label { font-size:12px; color:#6b7280; margin-bottom:20px; }
.mini-chart { display:flex; align-items:flex-end; gap:3px; justify-content:center; height:36px; opacity:0.5; }
.mini-bar { width:6px; border-radius:2px 2px 0 0; animation:barPulse 1.2s ease-in-out infinite; }
@keyframes barPulse { 0%,100%{opacity:0.4} 50%{opacity:1} }

/* Tabs */
.tab-nav { display:flex; gap:4px; margin-bottom:20px; border-bottom:1px solid var(--line); }
.tab-btn { background:none; border:none; color:var(--muted); padding:10px 18px; cursor:pointer; font-size:.95rem; border-bottom:2px solid transparent; border-radius:0; font-weight:600; }
.tab-btn:hover { color:var(--text); background:none; }
.tab-btn.active { color:var(--accent2); border-bottom:2px solid var(--accent2); background:none; }
.tab-panel { display:none; }
.tab-panel.active { display:block; }

/* Pattern */
.pattern-badge { display:inline-block; padding:3px 8px; border-radius:999px; font-size:.78rem; font-weight:bold; background:#1e3a5f; color:#93c5fd; }
/* AI Analysis */
.ai-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.ai-header { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:18px; }
.bias-pill { display:inline-block; padding:8px 16px; border-radius:999px; font-weight:bold; font-size:1rem; }
.bias-bullish { background:#052e16; color:#bbf7d0; }
.bias-bearish { background:#450a0a; color:#fecaca; }
.bias-neutral  { background:#1e3a5f; color:#bae6fd; }
.bias-mixed    { background:#451a03; color:#fde68a; }
.bias-unclear  { background:#374151; color:#d1d5db; }
.alignment-pill { display:inline-block; padding:6px 12px; border-radius:999px; font-size:.88rem; background:#1e3a5f; color:#93c5fd; }
.summary-block { background:var(--panel2); border:1px solid var(--line); border-radius:10px; padding:14px; margin-bottom:14px; }
.confidence-pill { display:inline-block; margin-top:8px; padding:4px 10px; border-radius:999px; background:#374151; font-size:.85rem; }
.levels-title { font-weight:bold; margin:14px 0 6px; font-size:.9rem; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
.level-list { margin:4px 0 0; padding-left:18px; }
.level-list li { margin-bottom:4px; font-size:.9rem; }
.tech-details { margin-top:14px; border:1px solid var(--line); border-radius:10px; background:var(--panel2); }
.tech-details summary { cursor:pointer; font-weight:bold; color:#93c5fd; padding:10px 14px; list-style:none; }
.tech-details summary::-webkit-details-marker { display:none; }
.tech-details summary::before { content:"▶ "; font-size:.75rem; }
details[open] > summary::before { content:"▼ "; }
.tech-content { padding:14px; border-top:1px solid var(--line); }
.tech-row { display:grid; grid-template-columns:130px 1fr; gap:8px; margin-bottom:10px; font-size:.9rem; }
.tech-label { color:var(--muted); font-weight:bold; }
.chart-img { width:100%; border-radius:10px; border:1px solid var(--line); margin-bottom:14px; display:block; }
.news-item { padding:12px; background:var(--panel2); border-radius:10px; margin-top:10px; }
.news-meta { color:var(--muted); font-size:.88rem; margin-bottom:6px; }
.news-link { color:#93c5fd; text-decoration:none; }
.news-link:hover { text-decoration:underline; }
.earnings-banner { padding:10px 14px; border-radius:8px; margin-bottom:14px; font-size:.9rem; }
.earnings-upcoming { background:#451a03; color:#fde68a; }
.earnings-recent   { background:#052e16; color:#bbf7d0; }
.ai-placeholder { color:var(--muted); text-align:center; padding:60px 0; }
.ai-panel-card { background:var(--panel); border-radius:12px; padding:20px; border:1px solid rgba(255,255,255,.03); margin-bottom:20px; }

@media (max-width:980px) {
  .shell { grid-template-columns:1fr; }
  aside { height:auto; position:relative; }
  .summary-grid, .ai-grid { grid-template-columns:1fr; }
}
