.spreadcalc{
  --sc-bg:#0E1217; --sc-panel:#151B23; --sc-panel2:#1A222C;
  --sc-line:rgba(255,255,255,.08); --sc-line2:rgba(255,255,255,.14);
  --sc-ink:#E6EAF0; --sc-muted:#8A97A8; --sc-amber:#F0B429; --sc-green:#3DD68C; --sc-red:#E5616B;
  --sc-mono:'IBM Plex Mono',ui-monospace,Menlo,Consolas,monospace;
  background:var(--sc-bg); color:var(--sc-ink); border-radius:14px; padding:24px;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; line-height:1.5;
  max-width:1040px; margin:0 auto;
}
.spreadcalc *{box-sizing:border-box}
.sc-head{border-bottom:1px solid var(--sc-line); padding-bottom:16px; margin-bottom:20px}
.sc-eyebrow{font-family:var(--sc-mono); font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--sc-amber); margin:0 0 8px}
.sc-ver{display:inline-block; margin-left:8px; padding:1px 7px; border:1px solid var(--sc-amber); border-radius:999px; font-size:10px; letter-spacing:.08em}
.sc-build{display:inline-block; margin-left:6px; font-family:var(--sc-mono); color:var(--sc-amber); opacity:.85}
.sc-h1{font-size:23px; font-weight:600; margin:0; color:var(--sc-ink)}
.sc-sub{color:var(--sc-muted); font-size:13.5px; margin:6px 0 0; max-width:62ch}

.sc-grid{display:grid; grid-template-columns:340px 1fr; gap:20px; align-items:start}
@media(max-width:780px){.sc-grid{grid-template-columns:1fr}}

.sc-card{background:var(--sc-panel); border:1px solid var(--sc-line); border-radius:12px; padding:18px; margin-bottom:18px}
.sc-cardtitle{font-family:var(--sc-mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--sc-muted); font-weight:600; margin:0 0 14px}

.sc-field{margin-bottom:13px}
.sc-field label{display:block; font-size:12.5px; color:var(--sc-muted); margin-bottom:5px}
.sc-field input,.sc-field select{
  width:100%; background:var(--sc-bg); border:1px solid var(--sc-line2); border-radius:8px;
  color:var(--sc-ink); font-family:var(--sc-mono); font-size:15px; padding:9px 11px;
}
.sc-field input:focus,.sc-field select:focus{outline:2px solid var(--sc-amber); border-color:transparent}
.sc-row2{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.sc-row3{display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px}
.sc-inline{display:flex; gap:8px}
.sc-inline select{flex:1}
.sc-hint{font-size:11px; color:var(--sc-muted); margin-top:5px; font-family:var(--sc-mono)}

.sc-btn{background:var(--sc-panel2); color:var(--sc-ink); border:1px solid var(--sc-line2);
  border-radius:8px; padding:9px 14px; font-size:13px; cursor:pointer; font-family:var(--sc-mono)}
.sc-btn:hover{border-color:var(--sc-amber)}
.sc-btn-amber{width:100%; margin-top:4px; background:var(--sc-amber); color:#11151a; border-color:var(--sc-amber); font-weight:600}
.sc-btn-amber:hover{filter:brightness(1.08)}

.sc-modelled{margin-top:16px; border-top:1px solid var(--sc-line); padding-top:12px}
.sc-mrow{display:flex; justify-content:space-between; font-size:13px; padding:4px 0; color:var(--sc-muted)}
.sc-mrow b{font-family:var(--sc-mono); color:var(--sc-ink); font-weight:500}
.sc-warn{color:var(--sc-red); font-size:12.5px; min-height:0; margin:8px 0 0}

.sc-help{margin:4px 0 14px; border:1px solid var(--sc-line); border-radius:8px; background:var(--sc-bg)}
.sc-help summary{cursor:pointer; padding:10px 12px; font-size:12.5px; color:var(--sc-amber); font-family:var(--sc-mono); list-style:none}
.sc-help summary::-webkit-details-marker{display:none}
.sc-help summary::before{content:"+ "; font-weight:600}
.sc-help[open] summary::before{content:"– "}
.sc-help[open] summary{border-bottom:1px solid var(--sc-line)}
.sc-help p{font-size:12.5px; color:var(--sc-muted); margin:10px 12px; line-height:1.55}
.sc-help p b{color:var(--sc-ink); font-weight:600}
.sc-deltatable{width:calc(100% - 24px); margin:10px 12px; border-collapse:collapse; font-size:12px}
.sc-deltatable th,.sc-deltatable td{text-align:left; padding:5px 6px; border-bottom:1px solid var(--sc-line); color:var(--sc-muted)}
.sc-deltatable th{color:var(--sc-ink); font-family:var(--sc-mono); font-weight:600; font-size:11px; text-transform:uppercase; letter-spacing:.05em}
.sc-deltatable td b{color:var(--sc-amber)}
.sc-helpnote{border-top:1px dashed var(--sc-line); padding-top:8px}

.sc-headline{background:var(--sc-panel2); border:1px solid var(--sc-line); border-radius:10px; padding:16px;
  display:grid; grid-template-columns:1fr 1fr; gap:4px 16px}
.sc-big{grid-column:1/-1; display:flex; align-items:baseline; gap:12px; flex-wrap:wrap;
  border-bottom:1px solid var(--sc-line); padding-bottom:13px; margin-bottom:13px}
.sc-ev{font-family:var(--sc-mono); font-size:32px; font-weight:600}
.sc-evlabel{font-size:12px; color:var(--sc-muted)}
.sc-verdict{font-family:var(--sc-mono); font-size:12px; padding:3px 9px; border-radius:999px; border:1px solid currentColor; margin-left:auto}
.sc-stat{display:flex; flex-direction:column; gap:2px}
.sc-stat .k{font-size:11.5px; color:var(--sc-muted)}
.sc-stat .v{font-family:var(--sc-mono); font-size:17px; font-weight:500}
.pos{color:var(--sc-green)} .neg{color:var(--sc-red)} .amb{color:var(--sc-amber)}

.sc-metrics{width:100%; border-collapse:collapse; font-size:13.5px; margin-top:4px}
.sc-metrics tr{border-bottom:1px solid var(--sc-line)}
.sc-metrics tr:last-child{border-bottom:0}
.sc-metrics td{padding:9px 0}
.sc-metrics td:last-child{text-align:right; font-family:var(--sc-mono); font-weight:500}
.sc-metrics .note{display:block; color:var(--sc-muted); font-size:11.5px; margin-top:1px}

.spreadcalc svg{width:100%; height:auto; display:block}
.sc-legend{display:flex; gap:16px; flex-wrap:wrap; margin-top:10px; font-size:12px; color:var(--sc-muted)}
.sc-legend span{display:inline-flex; align-items:center; gap:6px}
.sc-legend .sw{width:11px; height:11px; border-radius:2px; display:inline-block}

.sc-foot{margin-top:6px; font-size:12px; color:var(--sc-muted); max-width:80ch}
.sc-foot b{color:var(--sc-ink); font-weight:600}