:root{--bg: #f7f5ef;--terrain: #cfc7b4;--ink: #1c1b19;--accent: #a63d2f;--text: #1c1b19;--border: #d9d3c3;--font-mono: "Courier Prime", "Courier New", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace}*{box-sizing:border-box}html,body{margin:0;padding:0;min-height:100%;background:var(--bg);color:var(--text);font-family:var(--font-mono)}#app{display:flex;flex-direction:column;min-height:100vh}.topbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;padding:14px 20px;border-bottom:1px solid var(--border)}.brand{display:flex;align-items:baseline;gap:8px;margin-right:auto}.topbar h1{font-family:var(--font-mono);font-size:19px;font-weight:700;letter-spacing:.04em;margin:0}.byline{font-size:11px;opacity:.55}.control-group{display:flex;flex-wrap:wrap;align-items:center;gap:8px;row-gap:6px}.control-label{display:inline-flex;align-items:center;gap:4px;font-size:11px;text-transform:uppercase;letter-spacing:.05em;opacity:.6}.goal-selector,.speed-selector{display:flex;gap:6px}.goal-btn,.speed-btn{font-family:var(--font-mono);font-size:12px;text-transform:uppercase;letter-spacing:.05em;background:var(--bg);color:var(--ink);border:1px solid var(--border);border-radius:0;padding:6px 14px;cursor:pointer;transition:border-color .15s,background .15s,color .15s}.goal-btn:hover,.speed-btn:hover{border-color:var(--ink)}.goal-btn.active,.speed-btn.active{background:var(--ink);color:var(--bg);border-color:var(--ink)}.play-btn{font-family:var(--font-mono);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;background:var(--ink);color:var(--bg);border:1px solid var(--ink);border-radius:0;padding:7px 18px;cursor:pointer}.play-btn:disabled{opacity:.4;cursor:default}.intro-note{max-width:680px;margin:10px 20px 0;font-family:var(--font-mono);font-size:13px;line-height:1.5;color:var(--text);opacity:.65}.panel{margin:10px 20px 0;border:1px solid var(--border);padding:0}.panel summary{font-family:var(--font-mono);font-size:12px;text-transform:uppercase;letter-spacing:.05em;padding:8px 14px;cursor:pointer;list-style:none}.panel summary::-webkit-details-marker{display:none}.panel summary:before{content:"▸ "}.panel[open] summary:before{content:"▾ "}.tip{position:relative;display:inline-flex;align-items:center;vertical-align:middle}.tip-icon{font-family:var(--font-mono);font-size:10px;line-height:1;width:14px;height:14px;padding:0;border-radius:50%;border:1px solid var(--border);background:var(--bg);color:var(--ink);cursor:help}.tip-icon:hover,.tip-icon:focus-visible{border-color:var(--ink);outline:none}.tip-text{position:absolute;top:calc(100% + 8px);left:50%;transform:translate(-50%);width:230px;max-width:80vw;padding:9px 11px;background:var(--bg);border:1px solid var(--ink);color:var(--text);font-size:11px;font-weight:400;line-height:1.5;text-transform:none;letter-spacing:normal;text-align:left;opacity:0;visibility:hidden;transition:opacity .1s;z-index:20;pointer-events:none}.tip:hover .tip-text,.tip:focus-within .tip-text{opacity:1;visibility:visible}.about-body{display:block;max-width:640px}.about-body p{margin:0 0 12px;font-size:13px;line-height:1.6}.about-body p:last-child{margin-bottom:4px}.panel-body{display:flex;flex-wrap:wrap;gap:20px;padding:4px 14px 14px;border-top:1px solid var(--border)}.panel-field{display:flex;flex-direction:column;gap:4px;font-size:12px}.panel-field label{text-transform:uppercase;letter-spacing:.04em;opacity:.75}.panel-field input[type=range]{width:160px;accent-color:var(--ink)}.panel-field .readout{font-variant-numeric:tabular-nums}.lineage{display:flex;align-items:center;gap:12px;margin:10px 20px 0;padding:8px 14px;border:1px solid var(--border);font-size:12px;min-height:20px}.lineage-label{opacity:.8}.lineage-pair{display:flex;align-items:center;gap:8px}.lineage-pair canvas{border:1px solid var(--border);background:var(--bg)}.lineage-x{opacity:.6}.lineage-arrow{opacity:.6;margin-left:4px}.stage{flex:1;display:flex;align-items:center;justify-content:center;padding:16px 20px 0;min-height:0}.canvas-wrap{position:relative;display:inline-block;max-width:100%;line-height:0}#sim-canvas{background:var(--bg);border:1px solid var(--border);border-radius:0;max-width:100%;height:auto}.hud{position:absolute;top:16px;right:16px;background:var(--bg);border:1px solid var(--border);padding:10px 14px;font-size:12px;line-height:1.7;white-space:pre;pointer-events:none;max-width:calc(100% - 32px)}.hud .record{color:var(--accent)}.graph-dock{padding:10px 20px 20px}#fitness-graph{width:100%;height:90px;display:block;border:1px solid var(--border);background:var(--bg)}.site-footer{margin-top:auto;padding:14px 20px;border-top:1px solid var(--border);font-size:11px;opacity:.55}.footer-sep{margin:0 6px}@media(max-width:640px){.topbar{padding:12px 14px;gap:10px 14px}.brand{width:100%;margin-right:0}.play-btn{margin-left:auto}.intro-note,.panel,.lineage,.graph-dock,.site-footer{margin-left:14px;margin-right:14px}.graph-dock,.site-footer{padding-left:0;padding-right:0}.stage{padding:12px 14px 0}.goal-btn,.speed-btn{padding:9px 13px}.hud{top:10px;right:10px;padding:7px 10px;font-size:10px;line-height:1.55;max-width:calc(100% - 20px)}#fitness-graph{height:64px}.lineage{flex-wrap:wrap;row-gap:8px}.lineage-pair canvas{width:36px;height:36px}.panel-field{flex:1 1 100%}.panel-field input[type=range]{width:100%}.tip-text{position:fixed;left:12px;right:12px;bottom:12px;top:auto;transform:none;width:auto;max-width:none}}
