:root { --ink:#18212b; --muted:#64707d; --paper:#f7f7f4; --line:#d8ddd9; --accent:#1d4a68; --gold:#d5aa3b; --red:#bf3e44; --green:#32815c; --blue:#2d4384; }
* { box-sizing:border-box; } body { margin:0; background:var(--paper); color:var(--ink); font:16px/1.5 "Microsoft YaHei", system-ui, sans-serif; }
main { max-width:1280px; margin:0 auto; padding:36px 24px 48px; } header { display:flex; justify-content:space-between; align-items:end; gap:24px; border-bottom:1px solid var(--line); padding-bottom:20px; }
h1 { margin:0; font-size:30px; letter-spacing:-.03em; } .eyebrow { margin:0 0 4px; color:var(--accent); font-size:13px; font-weight:700; letter-spacing:.12em; } .rule { margin:0; color:var(--muted); font-size:14px; }
.controls { display:flex; flex-wrap:wrap; gap:14px; align-items:end; padding:22px 0 8px; } label { display:grid; gap:6px; color:var(--muted); font-size:13px; } input { min-width:190px; border:1px solid var(--line); border-radius:6px; padding:9px 11px; font:inherit; color:var(--ink); background:white; } button { border:0; border-radius:6px; padding:10px 18px; background:var(--accent); color:white; font:inherit; font-weight:700; cursor:pointer; }
#status { min-height:24px; color:var(--muted); font-size:14px; } .headline { display:flex; justify-content:space-between; gap:16px; align-items:end; margin:22px 0 14px; } .headline span { font-size:22px; font-weight:700; margin-right:10px; } .headline strong { color:var(--muted); font-size:14px; } .asof { font-size:14px; color:var(--muted); }
.score-grid { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); } .score-grid div { padding:12px 16px; border-right:1px solid var(--line); } .score-grid div:last-child { border-right:0; } .score-grid span { display:block; color:var(--muted); font-size:13px; } .score-grid strong { font-size:22px; }
.signal-card { margin:16px 0; padding:12px 16px; border-left:4px solid var(--gold); background:#fff8e5; } .signal-card.positive { border-color:var(--green); background:#ecf7f0; } .signal-card.negative { border-color:var(--red); background:#fff0f0; }
.intraday { margin:24px 0 18px; } h2 { font-size:16px; margin:0 0 8px; } .intraday-grid { background:#f1f5f5; }
#chart { display:block; width:100%; min-height:610px; background:white; border:1px solid var(--line); } .legend { color:var(--muted); font-size:13px; } .star { color:var(--blue); } .triangle { color:var(--red); }
@media (max-width:700px) { main { padding:24px 14px; } header,.headline { display:block; } .rule,.asof { margin-top:8px; } .score-grid { grid-template-columns:repeat(2,1fr); } .score-grid div:nth-child(2) { border-right:0; } .score-grid div { border-bottom:1px solid var(--line); } #chart { min-height:540px; } }