@font-face{font-family:Montserrat;font-style:normal;font-weight:700 800;font-display:swap;src:url(/fonts/montserrat-700-800.woff2) format("woff2")}@font-face{font-family:Blinker;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/blinker-400.woff2) format("woff2")}@font-face{font-family:Blinker;font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/blinker-600.woff2) format("woff2")}@font-face{font-family:Blinker;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/blinker-700.woff2) format("woff2")}:root{--font-heading: "Montserrat", "Segoe UI", Arial, sans-serif;--font-body: "Blinker", "Segoe UI", Arial, sans-serif;--weight-heading: 800;--weight-subhead: 700;--weight-label: 600;--weight-body: 400;--ink: #333333;--ink-soft: #6e6e6e;--ink-faint: #b2b2b2;--paper: #fdfdfd;--paper-dim: #e3e2e2;--panel: #f2f1f1;--panel-strong: #e8e7e7;--line: #333333;--line-soft: #d8d7d7;--border-width: 2px;--radius-panel: 12px;--radius-chip: 6px;--radius-cell: 6px;--space-1: 6px;--space-2: 10px;--space-3: 16px;--space-4: 24px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:var(--font-body);font-weight:var(--weight-body);color:var(--ink);background:var(--paper-dim);overflow:hidden}button{font-family:inherit;cursor:pointer}button:focus-visible{outline:var(--border-width) solid var(--ink);outline-offset:2px}.stage{position:fixed;top:50%;left:50%;width:1280px;height:720px;background:var(--paper);overflow:hidden}.stage-circle{position:absolute;top:-150px;right:-150px;width:460px;height:460px;border-radius:50%;background:var(--panel-strong)}.stage-frame{position:absolute;top:22px;right:22px;bottom:22px;left:22px;border:var(--border-width) solid var(--line);pointer-events:none}.stage-inner{position:absolute;top:22px;right:22px;bottom:22px;left:22px;display:flex;flex-direction:column;padding:30px 48px 20px}.step-number{position:absolute;top:22px;left:48px;transform:translateY(-50%);background:var(--ink);color:#fff;font-family:var(--font-heading);font-weight:var(--weight-subhead);font-size:18px;padding:7px 15px;letter-spacing:.06em}.stage-header{display:flex;align-items:flex-start;gap:var(--space-3);margin-bottom:var(--space-3)}.step-title{font-family:var(--font-heading);font-weight:var(--weight-heading);font-size:38px;line-height:1.15;letter-spacing:-.01em;color:var(--ink)}.step-subtitle{font-size:18px;font-weight:var(--weight-label);color:var(--ink-soft);margin-top:4px}.step-count{margin-left:auto;font-size:15px;font-weight:var(--weight-subhead);color:var(--ink-faint);white-space:nowrap;padding-top:10px}.step-body{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;gap:var(--space-3)}.step-body>*{animation:step-rise .32s ease-out both}.step-body>*:nth-child(2){animation-delay:70ms}.step-body>*:nth-child(3){animation-delay:.14s}.step-body>*:nth-child(4){animation-delay:.21s}@keyframes step-rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.panel{background:var(--panel);border:var(--border-width) solid var(--line-soft);border-radius:var(--radius-panel);padding:14px 18px}.callout{background:var(--panel-strong);border:var(--border-width) solid var(--line);border-radius:var(--radius-panel);padding:14px 22px}.panel-label{font-family:var(--font-heading);font-weight:var(--weight-subhead);font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--ink);margin-bottom:var(--space-1)}.panel-text{font-size:15.5px;line-height:1.45;color:var(--ink)}.panel-pair{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}.panel-narrow{width:720px;align-self:center}.chip{display:inline-flex;align-items:center;padding:3px 12px;border-radius:var(--radius-chip);font-size:13.5px;font-weight:var(--weight-subhead);letter-spacing:.02em;white-space:nowrap}.chip-dark{background:var(--ink);color:#fff}.chip-soft{background:var(--panel-strong);border:var(--border-width) solid var(--line-soft);color:var(--ink)}.chip-outline{background:#fff;border:var(--border-width) solid var(--ink);color:var(--ink)}.chip-row{display:flex;gap:var(--space-2);margin-top:var(--space-2)}.chip-row-centered{justify-content:center;align-items:center;margin-top:0}.chip-row-label{font-size:13.5px;font-weight:var(--weight-label);color:var(--ink-soft)}.formula-line{display:flex;align-items:baseline;gap:var(--space-3);margin-top:var(--space-2);padding:7px 16px;border:var(--border-width) solid var(--line-soft);border-radius:8px;background:#fff;font-size:16.5px;font-weight:var(--weight-label);color:var(--ink);width:fit-content}.formula-line sub{font-size:11px}.formula-caption{font-size:13px;font-weight:var(--weight-label);color:var(--ink-soft)}.chromosome{display:flex;align-items:center;gap:4px}.cell-slot{position:relative}.cell{width:56px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-cell);font-size:13.5px;font-weight:var(--weight-label)}.cell-on{background:var(--ink);color:#fff;font-weight:var(--weight-subhead)}.cell-off{background:#fff;border:var(--border-width) solid var(--line-soft);color:var(--ink-faint)}.cell-marked{outline:var(--border-width) solid var(--ink);outline-offset:2px}.cell-mark{position:absolute;top:calc(100% + 6px);left:50%;transform:translate(-50%);font-size:11px;font-weight:var(--weight-subhead);text-transform:uppercase;letter-spacing:.04em;color:var(--ink);white-space:nowrap}.cell-more{width:34px;background:transparent;border:var(--border-width) dashed var(--line-soft);color:var(--ink-faint);font-weight:var(--weight-subhead)}.chromosome-compact{gap:2px}.chromosome-compact .cell{width:16px;height:22px;border-radius:3px}.chromosome-compact .cell-off{border-width:1px}.strip-stack{display:flex;flex-direction:column;gap:var(--space-2);align-items:center}.strip{display:grid;grid-template-columns:88px auto 200px;align-items:center;gap:var(--space-3)}.strip-with-marks{margin-bottom:14px}.strip-label{font-size:13px;font-weight:var(--weight-subhead);text-transform:uppercase;letter-spacing:.08em;color:var(--ink);text-align:right}.strip-right{display:flex;align-items:center;gap:var(--space-2);font-size:16px;font-weight:var(--weight-subhead);color:var(--ink);white-space:nowrap}.strip-ghost{font-size:13.5px;font-weight:var(--weight-label);color:var(--ink-faint)}.flow-divider{font-size:14.5px;font-weight:var(--weight-label);color:var(--ink-soft);text-align:center}.stat-line{font-size:17px;font-weight:var(--weight-subhead);color:var(--ink);text-align:center}.candidate{display:flex;align-items:center;gap:var(--space-2);padding:7px 12px;border:var(--border-width) solid transparent;border-radius:8px}.candidate-winner{border-color:var(--ink);background:#fff}.candidate-name{width:30px;font-size:13px;font-weight:var(--weight-subhead);letter-spacing:.05em}.candidate-fitness{margin-left:auto;font-size:14.5px;font-weight:var(--weight-subhead)}.candidate-muted{opacity:.55}.run-row{display:flex;gap:var(--space-1);justify-content:center;margin-top:var(--space-2)}.run-chip{padding:4px 10px;border:var(--border-width) solid var(--line-soft);border-radius:var(--radius-chip);background:#fff;font-size:12.5px;font-weight:var(--weight-label);color:var(--ink-soft);white-space:nowrap}.run-chip-selected{border-color:var(--ink);background:var(--ink);color:#fff;font-weight:var(--weight-subhead)}.stage-footer{display:flex;flex-direction:column;gap:var(--space-2);margin-top:var(--space-3)}.step-note{font-size:13.5px;font-weight:var(--weight-label);color:var(--ink-soft);text-align:center}.footer-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:var(--space-3)}.key-hint{font-size:12px;font-weight:var(--weight-label);letter-spacing:.04em;color:var(--ink-faint);white-space:nowrap}.progress{display:flex;gap:4px}.progress-item{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border:none;border-radius:var(--radius-chip);background:transparent;font-size:11.5px;font-weight:var(--weight-subhead);text-transform:uppercase;letter-spacing:.07em;color:var(--ink-faint);transition:background-color .18s ease,color .18s ease}.progress-item:hover{color:var(--ink)}.progress-item-done{color:var(--ink-soft)}.progress-item-current{background:var(--ink);color:#fff}.reset-button{justify-self:end;padding:5px 14px;border:var(--border-width) solid var(--line-soft);border-radius:var(--radius-chip);background:#fff;font-size:12px;font-weight:var(--weight-subhead);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft);transition:border-color .15s ease,color .15s ease}.reset-button:hover{border-color:var(--ink);color:var(--ink)}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
