:root {
  --bg: #fcfcfb; --panel: #ffffff; --ink: #0b0b0b; --ink2: #52514e; --rule: #e4e3de;
  --orange: #eb6834; --aqua: #1baf7a; --blue: #2a78d6; --gray: #9a9a94;
}
@media (prefers-color-scheme: dark) {
  :root { --bg: #1a1a19; --panel: #222220; --ink: #ffffff; --ink2: #c3c2b7; --rule: #3a3a37;
          --orange: #d95926; --aqua: #199e70; --blue: #3987e5; }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink);
       font: 15px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; }
main { max-width: 1060px; margin: 0 auto; padding: 28px 16px 60px; }
h1 { font-size: 24px; margin: 0 0 4px; font-weight: 600; }
h2 { font-size: 15px; margin: 0 0 10px; font-weight: 600; }
.sub { color: var(--ink2); margin: 0 0 24px; }
a { color: var(--blue); }
.panel { background: var(--panel); border: 1px solid var(--rule); border-radius: 8px;
         padding: 16px; margin-bottom: 16px; }
.controls { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px 24px; }
.control label { display: block; font-size: 13px; color: var(--ink2); margin-bottom: 4px; }
.control .val { color: var(--ink); font-weight: 600; }
.control input[type=range] { width: 100%; }
.seg { display: inline-flex; flex-wrap: wrap; border: 1px solid var(--rule); border-radius: 6px; overflow: hidden; }
.seg button { background: transparent; color: var(--ink); border: 0; padding: 6px 12px;
              font: inherit; font-size: 13px; cursor: pointer; }
.seg button + button { border-left: 1px solid var(--rule); }
.seg button.on { background: var(--blue); color: #fff; }
.hidden { display: none; }
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.stat { border-left: 3px solid var(--rule); padding: 2px 0 2px 12px; }
.stat .k { font-size: 13px; color: var(--ink2); }
.stat .v { font-size: 26px; font-weight: 600; font-variant-numeric: tabular-nums; }
.stat .n { font-size: 12px; color: var(--ink2); }
.chart { position: relative; height: 280px; }
.note { font-size: 12.5px; color: var(--ink2); margin: 8px 0 0; }
ul.analyses { padding-left: 18px; }
ul.analyses li { margin: 8px 0; }
.control.wide { grid-column: 1 / -1; }