[hidden] { display: none !important; }

/* Calculator */
.calc { margin: 2rem auto; max-width: 880px; background: var(--surface); border: 1px solid var(--rule); border-radius: 10px; padding: 1.5rem clamp(1rem, 3vw, 2rem) 1.25rem; }
.calc-head h3 { margin-bottom: 0.3rem; }
.calc-sub { color: var(--muted); font-size: 0.95rem; margin-bottom: 1rem; }
.calc-presets { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1.5rem; }
.preset { font-family: var(--font-body); font-size: 0.85rem; font-weight: 600; letter-spacing: 0.02em; padding: 0.45rem 0.85rem; border-radius: 999px; border: 1px solid var(--rule); background: transparent; color: var(--fg); cursor: pointer; }
.preset:hover { border-color: var(--accent); }
.preset.is-active { background: var(--accent); border-color: var(--accent); color: #fff; }
:root[data-theme="dark"] .preset.is-active { color: #0E1412; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .preset.is-active { color: #0E1412; } }
.preset-reset { margin-left: auto; color: var(--muted); }
.preset:focus-visible, input[type=range]:focus-visible, summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.calc-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: 2rem; align-items: start; }
@media (max-width: 720px) { .calc-grid { grid-template-columns: 1fr; gap: 1.5rem; } .calc { border-radius: 8px; } }
.calc-inputs, .calc-outputs { min-width: 0; }

.field { margin-bottom: 1.1rem; }
.field-row { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-bottom: 0.2rem; }
.field label { font-weight: 600; font-size: 0.95rem; }
.field output { font-family: var(--font-mono); font-size: 0.95rem; font-variant-numeric: tabular-nums; color: var(--accent); }
.hint { font-size: 0.82rem; color: var(--muted); margin: 0.3rem 0 0; line-height: 1.45; }

input[type=range] { -webkit-appearance: none; appearance: none; width: 100%; height: 28px; background: transparent; margin: 0; cursor: pointer; }
input[type=range]::-webkit-slider-runnable-track { height: 4px; background: var(--rule); border-radius: 2px; }
input[type=range]::-moz-range-track { height: 4px; background: var(--rule); border-radius: 2px; }
input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 18px; height: 18px; border-radius: 50%; background: var(--accent); border: 2px solid var(--surface); box-shadow: 0 0 0 1px var(--accent); margin-top: -7px; }
input[type=range]::-moz-range-thumb { width: 14px; height: 14px; border-radius: 50%; background: var(--accent); border: 2px solid var(--surface); box-shadow: 0 0 0 1px var(--accent); }

.stats { display: grid; grid-template-columns: 1fr 1fr; gap: 0.9rem; margin: 0; }
.stat { background: var(--bg); border: 1px solid var(--rule); border-radius: 8px; padding: 0.8rem 0.9rem; min-width: 0; }
.stat dt { font-size: 0.75rem; letter-spacing: 0.05em; text-transform: uppercase; color: var(--muted); font-weight: 600; margin-bottom: 0.2rem; }
.stat dd { margin: 0; font-family: var(--font-mono); font-size: 1.35rem; font-weight: 500; font-variant-numeric: tabular-nums; line-height: 1.2; overflow-wrap: anywhere; }
.stat-sub { display: block; font-size: 0.78rem; color: var(--muted); margin-top: 0.25rem; line-height: 1.35; }
.stat-hero { grid-column: 1 / -1; background: var(--accent-soft); border-color: transparent; }
.stat-hero dd { font-size: 1.9rem; }
.stat-hero dd.pos { color: var(--pos); }
.stat-hero dd.neg { color: var(--neg); }
.pos { color: var(--pos); } .neg { color: var(--neg); }

.bar-wrap { margin-top: 1rem; }
.bar-label { display: flex; justify-content: space-between; font-size: 0.75rem; letter-spacing: 0.05em; text-transform: uppercase; color: var(--muted); font-weight: 600; margin-bottom: 0.3rem; }
.bar { display: grid; gap: 4px; }
.bar > div { height: 10px; border-radius: 3px; transition: width 160ms ease-out; min-width: 2px; }
.bar-cost { background: var(--neg); }
.bar-rev { background: var(--pos); }
@media (prefers-reduced-motion: reduce) { .bar > div { transition: none; } }

.mix { margin-top: 1.5rem; border-top: 1px solid var(--rule); padding-top: 1rem; }
.mix summary { cursor: pointer; font-weight: 600; font-size: 0.95rem; color: var(--accent); }
.mix-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; margin-top: 0.75rem; }
@media (max-width: 720px) { .mix-grid { grid-template-columns: 1fr; gap: 0.5rem; } }
.mix-foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 0.75rem; margin-top: 0.5rem; font-family: var(--font-mono); font-size: 0.85rem; color: var(--muted); }
.calc-foot { font-size: 0.82rem; color: var(--muted); margin: 1.25rem 0 0; line-height: 1.45; }


.group-label { font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); font-weight: 600; margin: 0.25rem 0 0.6rem; padding-top: 0.5rem; border-top: 1px solid var(--rule); }
.group-label:first-child { border-top: 0; padding-top: 0; }
.bar-stack { display: flex; gap: 2px; min-width: 2px; }
.bar-stack > div { height: 10px; border-radius: 3px; transition: width 160ms ease-out; min-width: 0; }
.bar-jobs { background: var(--neg); opacity: 0.55; }
@media (prefers-reduced-motion: reduce) { .bar-stack > div { transition: none; } }

/* Simulator */
.sim-models { display: grid; grid-template-columns: 1fr auto 1fr; gap: 1rem; align-items: start; margin-bottom: 0.75rem; }
@media (max-width: 720px) { .sim-models { grid-template-columns: 1fr; } .sim-vs { display: none; } }
.sim-model { min-width: 0; background: var(--bg); border: 1px solid var(--rule); border-radius: 8px; padding: 0.9rem 1rem 1rem; }
.sim-model .field-row label { font-weight: 600; font-size: 0.95rem; }
.sim-vs { align-self: center; font-family: var(--font-display); font-style: italic; color: var(--muted); font-size: 1.1rem; padding-top: 2.5rem; }
.sim-select { width: 100%; font-family: var(--font-body); font-size: 1rem; font-weight: 600; padding: 0.5rem 0.6rem; border: 1px solid var(--rule); border-radius: 6px; background: var(--surface); color: var(--fg); margin: 0.3rem 0 0.5rem; }
.sim-select:focus-visible, .sim-custom input:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.sim-custom { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-bottom: 0.5rem; }
.sim-custom label { font-size: 0.72rem; color: var(--muted); font-weight: 600; letter-spacing: 0.03em; display: flex; flex-direction: column; gap: 0.2rem; min-width: 0; }
.sim-custom input { width: 100%; min-width: 0; font-family: var(--font-mono); font-size: 0.9rem; padding: 0.35rem 0.4rem; border: 1px solid var(--rule); border-radius: 5px; background: var(--surface); color: var(--fg); }
.sim-price { font-family: var(--font-mono); font-size: 0.78rem; color: var(--muted); margin: 0 0 0.6rem; line-height: 1.4; }
.stats-sim { grid-template-columns: 1fr; gap: 0.6rem; }
.stats-sim .stat { background: var(--surface); }
.stats-sim .stat-hero dd { color: var(--fg); }
.sim-bar { height: 10px; background: var(--rule); border-radius: 3px; margin-top: 0.8rem; overflow: hidden; }
.sim-bar > div { height: 100%; background: var(--accent); border-radius: 3px; transition: width 160ms ease-out; min-width: 2px; }
@media (prefers-reduced-motion: reduce) { .sim-bar > div { transition: none; } }
.sim-verdict { font-family: var(--font-display); font-size: 1.15rem; line-height: 1.35; text-align: center; margin: 0.25rem 0 1.25rem; text-wrap: balance; }
.sim-grid { gap: 1.5rem; }

/* Story 1: valuation squares. Default (no JS) is the final state. */
.vz{margin:0}
.vz svg{display:block;width:100%;height:auto;max-height:62vh;overflow:visible}
.vz text{font-family:var(--font-display);fill:var(--fg)}
.vz-date{font-size:13px;letter-spacing:.08em;text-transform:uppercase;fill:var(--muted)!important}
.vz-big{font-size:19px;font-weight:600}
.vz-small{font-size:13px;fill:var(--muted)!important}
.vz-times{font-size:64px;font-weight:300;fill:var(--accent)!important}
.vz-val{fill:var(--accent-soft);stroke:var(--accent);stroke-width:1.5}
.vz-raised{fill:var(--fg)}
.vz-vol{fill:none;stroke:var(--muted);stroke-width:1.5;stroke-dasharray:5 4}
.vz-base{stroke:var(--rule);stroke-width:1}
@media (max-width:720px){.vz-small{font-size:24px}.vz-date{font-size:20px}.vz-big{font-size:26px}.vz-times{font-size:80px}.vz-caption{min-height:0}.vz-q{font-size:1.05rem}.ac-head{margin-bottom:.4rem}.ac-head b{font-size:1.35rem}.ac-label{margin:.5rem 0 .3rem!important}.ac-grid{gap:2px}.ac-notes{margin-top:.5rem;min-height:0}.ac-buy{margin-top:.6rem;padding:.5rem .8rem}.ac-zero{font-size:2.4rem}}
.vz-aug,.vz-sep,.vz-flow,.vz-times{transform-box:fill-box;transition:opacity .5s ease,transform .7s cubic-bezier(.3,.7,.2,1)}
.vz-sep{transform-origin:0% 100%}
.vz-caption{display:grid;gap:.35rem;margin-top:1rem;font-size:.95rem;line-height:1.4;min-height:5.2rem}
.vz-q{font-size:1.25rem;font-weight:500}
.vz-note{color:var(--muted)}
.vz-key{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .9rem;font-size:.8rem;color:var(--muted)}
.vz-key i{display:inline-block;width:12px;height:12px;margin-right:.4rem;vertical-align:-1px}
.k-val{background:var(--accent-soft);border:1.5px solid var(--accent)}
.k-raised{background:var(--fg)}
.k-vol{border:1.5px dashed var(--muted)}
.vz-q,.vz-note,.vz-key{transition:opacity .4s ease}
.story-valuation[data-step="1"] .vz-sep{opacity:0;transform:scale(.5)}
.story-valuation[data-step="1"] .vz-flow,.story-valuation[data-step="2"] .vz-flow,.story-valuation[data-step="3"] .vz-flow{opacity:0}
.story-valuation[data-step="1"] .vz-q,.story-valuation[data-step="2"] .vz-q,.story-valuation[data-step="1"] .vz-note,.story-valuation[data-step="2"] .vz-note{opacity:0}
.story-valuation[data-step="1"] .vz-key,.story-valuation[data-step="2"] .vz-key,.story-valuation[data-step="3"] .vz-key{opacity:0}
.story-valuation[data-step="4"] .vz-q,.story-valuation[data-step="4"] .vz-note{display:none}
.story-valuation[data-step="3"] .vz-aug,.story-valuation[data-step="3"] .vz-sep{opacity:.5}

/* Story 2: what 13,623 tool calls are made of */
.ac{margin:0;font-family:var(--font-body)}
.ac-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:.3rem 1.2rem;margin-bottom:1rem;font-size:1rem}
.ac-head b{font-size:1.7rem;font-weight:400;letter-spacing:-.02em;margin-right:.25rem}
.ac-minor{flex-basis:100%;font-size:.82rem;color:var(--muted)}
.ac-label{display:flex;justify-content:space-between;gap:1rem;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:.9rem 0 .4rem!important}
.ac-label span{text-transform:none;letter-spacing:0}
.ac-tasks{display:flex;flex-wrap:wrap;gap:4px}
.ac-tasks i{width:11px;height:11px;border-radius:50%;background:var(--muted);opacity:.5;transition:background .4s,opacity .4s}
.ac-grid{display:grid;grid-template-columns:repeat(17,1fr);gap:3px}
.ac-grid i{aspect-ratio:1;border-radius:2px;background:var(--muted);opacity:.5;transition:background .4s,opacity .4s}
.ac-notes{display:grid;gap:.25rem;margin-top:.9rem;min-height:3.2rem}
.ac-note{display:none;margin:0!important;font-size:.88rem;line-height:1.35}
.ac-note .sw,.sw{display:inline-block;width:11px;height:11px;border-radius:2px;margin-right:.45rem;vertical-align:-1px}
.sw.lr,.sw.pipe{background:var(--accent)}
.sw.watch{background:color-mix(in srgb,var(--accent) 50%,var(--surface))}
.sw.one{background:var(--muted);opacity:.5}
.ac-buy{display:flex;align-items:center;gap:1rem;margin-top:1rem;padding:.8rem 1rem;border:1px dashed var(--rule);border-radius:6px;opacity:0;transition:opacity .5s}
.ac-zero{font-size:3.2rem;line-height:1;font-weight:300;color:var(--neg)}
.ac-buy span:last-child{font-size:.9rem;color:var(--muted);line-height:1.35}
.story-activity[data-step="2"] .ac-tasks .lr,.story-activity[data-step="2"] .ac-grid :is(.lr,.pipe,.watch){background:var(--accent);opacity:1}
.story-activity[data-step="2"] .n2,.story-activity[data-step="3"] .n3{display:block}
.story-activity[data-step="3"] .ac-tasks .lr{background:var(--accent);opacity:1}
.story-activity[data-step="3"] .ac-grid .pipe{background:var(--accent);opacity:1}
.story-activity[data-step="3"] .ac-grid .watch{background:color-mix(in srgb,var(--accent) 50%,var(--surface));opacity:1}
.story-activity[data-step="3"] .ac-grid .lr{background:var(--accent);opacity:.25}
.story-activity[data-step="3"] .ac-grid .one{opacity:.2}
.story-activity[data-step="4"] .ac-tasks .lr,.story-activity[data-step="4"] .ac-grid :is(.lr,.pipe,.watch){background:var(--accent);opacity:.35}
.story-activity[data-step="4"] .ac-grid .one,.story-activity[data-step="4"] .ac-tasks .one{opacity:.2}
.story-activity[data-step="4"] .ac-buy{opacity:1}
.story-activity[data-step="4"] .ac-notes{display:none}

/* Calculator: break-even line */
.be{margin-bottom:1rem}
.be-head{display:flex;justify-content:space-between;gap:1rem;font-size:.75rem;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom:.4rem}
.be-read{text-transform:none;letter-spacing:0;font-size:.9rem;font-weight:600}
.be-track{position:relative;height:44px;border-radius:4px;overflow:hidden;background:color-mix(in srgb,var(--pos) 14%,var(--surface))}
.be-loss{position:absolute;inset:0 auto 0 0;background:color-mix(in srgb,var(--neg) 14%,var(--surface));transition:width 200ms ease-out}
.be-line{position:absolute;top:0;bottom:0;width:2px;margin-left:-1px;background:var(--fg);transition:left 200ms ease-out}
.be-dot{position:absolute;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--accent);border:2px solid var(--surface);box-shadow:0 0 0 1px var(--accent);transition:left 200ms ease-out}
.be-scale{display:flex;justify-content:space-between;gap:.5rem;font-size:.75rem;color:var(--muted);margin-top:.3rem}
.be-legend{display:flex;flex-wrap:wrap;gap:.2rem .9rem;font-size:.78rem;color:var(--muted);margin-top:.35rem}
.be-legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:.35rem;vertical-align:-1px}
.be-legend .l-line{width:2px;background:var(--fg)}
.be-legend .l-dot{border-radius:50%;background:var(--accent)}
@media (prefers-reduced-motion: reduce){.be-loss,.be-line,.be-dot{transition:none}}