
  * { box-sizing:border-box; }
  body { background:var(--bg); color:var(--text); font:14px/1.55 -apple-system,"Segoe UI",Roboto,Helvetica,sans-serif; margin:0; padding:18px; }
  @media (min-width:1100px){ body{ padding:24px max(34px,calc((100vw - 1360px)/2)); } }
  a { text-decoration:none; color:inherit; }
  h1 { font-size:22px; margin:0 0 2px; }
  .lead { color:var(--muted); font-size:13px; margin:0 0 14px; max-width:880px; }
  .faint { color:var(--muted); }
  /* regime + stat strip */
  .strip { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:0 0 16px; }
  .reg { font-size:12px; font-weight:800; letter-spacing:.02em; padding:5px 12px; border-radius:9px; border:1px solid var(--line); }
  .reg.calm { color:var(--up); background:color-mix(in srgb,var(--up) 12%,transparent); border-color:color-mix(in srgb,var(--up) 38%,var(--line)); }
  .reg.mixed { color:var(--warn); background:color-mix(in srgb,var(--warn) 12%,transparent); border-color:color-mix(in srgb,var(--warn) 38%,var(--line)); }
  .reg.stress { color:var(--down); background:color-mix(in srgb,var(--down) 12%,transparent); border-color:color-mix(in srgb,var(--down) 38%,var(--line)); }
  .reg.unknown { color:var(--muted); }
  .stat { font-size:12px; color:var(--muted); padding:5px 12px; border:1px solid var(--line); border-radius:9px; background:var(--panel); }
  .stat b { color:var(--text); font-size:14px; font-variant-numeric:tabular-nums; }
  /* section heads */
  .sec { display:flex; align-items:baseline; gap:10px; margin:22px 0 4px; }
  .sec h2 { font-size:16px; margin:0; }
  .sec .cnt { color:var(--muted); font-size:12.5px; font-variant-numeric:tabular-nums; }
  .sub { color:var(--muted); font-size:12.5px; margin:0 0 10px; max-width:820px; }
  /* the grid + cards (overflow-contained: min-width:0 on card AND children) */
  .grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:12px; margin:4px 0 6px; }
  .ic-card { display:flex; flex-direction:column; gap:7px; min-width:0; overflow:hidden;
    background:var(--panel); border:1px solid var(--line); border-left:3px solid var(--muted);
    border-radius:12px; padding:12px 13px; transition:border-color .15s, transform .08s; }
  .ic-card > * { min-width:0; max-width:100%; }
  .ic-card:hover { border-color:var(--accent,var(--link)); transform:translateY(-1px); }
  .ic-card[data-state="EARLY_IGNITION"] { border-left-color:var(--up); }
  .ic-card[data-state="IGNITING"] { border-left-color:color-mix(in srgb,var(--up) 60%,var(--line)); }
  .ic-card[data-state="COILING"] { border-left-color:var(--link); }
  .ic-card[data-state="EXTENDED_RUN"] { border-left-color:var(--warn); }
  .ic-card[data-state="FADING"] { border-left-color:var(--down); }
  .ic-top { display:flex; align-items:center; justify-content:space-between; gap:8px; }
  .ic-tk { font-weight:800; font-size:15px; letter-spacing:.01em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .ic-score { flex:none; font-weight:800; font-size:13px; font-variant-numeric:tabular-nums; min-width:30px; text-align:center;
    padding:2px 8px; border-radius:999px; color:#fff;
    background:color-mix(in srgb, var(--up) calc(var(--sc,50)*1%), var(--down)); }
  .ic-name { font-size:12px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .ic-sec { color:var(--muted); }
  .ic-spark { height:40px; line-height:0; }
  .ic-chips { display:flex; flex-wrap:wrap; gap:5px; }
  .chip { font-size:10.5px; padding:1px 7px; border-radius:6px; background:var(--panel2,var(--bg)); border:1px solid var(--line); color:var(--muted); white-space:nowrap; font-variant-numeric:tabular-nums; }
  .chip.accel { color:var(--up); border-color:color-mix(in srgb,var(--up) 34%,var(--line)); }
  .chip.vol { color:var(--link); }
  .chip.fresh { color:var(--muted); }
  .chip.fresh.new { color:var(--up); border-color:color-mix(in srgb,var(--up) 45%,var(--line)); font-weight:800; }
  .ic-note { font-size:11.5px; color:var(--muted); line-height:1.45; overflow-wrap:anywhere; }
  .empty { color:var(--muted); font-size:13px; padding:10px 2px; }
  /* method / legend */
  .panel { background:var(--panel); border:1px solid var(--line); border-radius:13px; padding:14px 16px; margin:20px 0 8px; }
  .legend { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px; margin-top:6px; }
  .lg { font-size:12px; color:var(--muted); } .lg b { color:var(--text); }
  .cav { color:var(--muted); font-size:11.5px; line-height:1.55; border-top:1px dotted var(--line); padding-top:9px; margin-top:10px; }
  details.fold > summary { cursor:pointer; color:var(--muted); font-size:12.5px; padding:5px 0; }
  .kv { font-size:11.5px; color:var(--muted); font-variant-numeric:tabular-nums; }
