:root{color-scheme:light;--paper:#f2f3f4;--ink:#252729;--muted:#63666a;--accent:#b34522;font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-size:18px;line-height:1.65}header,main,footer{max-width:1020px;margin:auto;padding:28px}header{display:flex;justify-content:space-between;gap:20px;font-size:14px}.home{font-weight:750;text-decoration:none}a{color:inherit;text-underline-offset:4px}.intro{padding:65px 0 70px;max-width:790px}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:650;color:var(--accent)}h1{font-size:clamp(46px,7vw,80px);line-height:1.02;letter-spacing:-3px;margin:23px 0 30px}h2{font-size:clamp(27px,4vw,39px);line-height:1.2;letter-spacing:-1px;margin:6px 0 22px}h3{font-size:24px}.intro p{max-width:650px;font-size:21px}nav{display:flex;flex-wrap:wrap;gap:24px;font-size:15px;margin-top:35px}.experiment{border-top:1px solid #cbd0d3;padding:45px 0 65px;scroll-margin-top:25px}.section-head{display:flex;align-items:start;gap:24px}.number{color:var(--accent);font-size:20px;line-height:1;padding-top:6px}.setup{display:flex;flex-wrap:wrap;align-items:center;gap:20px;font-size:14px;margin-top:30px}.setup label{display:flex;gap:10px;align-items:center}.setup input{max-width:105px;accent-color:var(--accent)}button{font-weight:600;line-height:1.4;font-family:inherit;font-size:15px;background:var(--ink);color:white;padding:14px 20px;border:1px solid var(--ink);border-radius:5px;cursor:pointer}button.secondary{background:transparent;color:var(--ink);border-color:#a9aeb3}button:disabled{opacity:.45;cursor:default}button:hover:not(:disabled){filter:brightness(.9)}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:5px}.small{font-size:13px;color:var(--muted)}.stage{position:relative;height:345px;background:#1a1b1d;border-radius:8px;overflow:hidden;margin:20px 0;color:#92969a}.fixation{position:absolute;top:74px;left:50%;transform:translateX(-50%);font-size:22px}.flash{position:absolute;width:28px;height:28px;left:calc(50% - 14px);top:219px;background:#f8f8f8;border-radius:50%;visibility:hidden}.stage-hint{position:absolute;bottom:24px;text-align:center;width:100%;font-size:12px;letter-spacing:1px}.controls{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin:24px 0 10px}#progress{font-size:14px;color:var(--muted)}#status{font-size:15px;min-height:25px}fieldset{padding:20px;border:1px solid #bdc1c5;border-radius:7px;margin:25px 0}fieldset button{margin:8px 6px 0 0}legend{font-size:17px;font-weight:600}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:15px}th,td{text-align:left;padding:12px;border-bottom:1px solid #d5d8db}th{font-weight:650}details{border-top:1px solid #d5d8db;margin-top:30px;padding-top:18px;font-size:16px}summary{cursor:pointer;font-weight:650}details p{max-width:800px}.contrast{display:flex;margin-top:30px}.surround{width:50%;aspect-ratio:1;display:grid;place-items:center;background:#202020}.surround+ .surround{background:#ededed}.square{width:25%;aspect-ratio:1;background:rgb(128,128,128)}.contrast.neutral .surround{background:#b0b0b0}.labels{display:flex;text-align:center;font-size:15px;margin:9px 0}.labels span{width:50%}.closing{border-top:1px solid #cbd0d3;padding:35px 0}.closing p{font-size:16px;max-width:720px}footer{font-size:13px;color:var(--muted);padding-bottom:40px}[hidden]{display:none!important}@media(max-width:600px){header,main,footer{padding:20px}.intro{padding:40px 0 50px}h1{letter-spacing:-2px}.intro p{font-size:18px}.stage{height:320px}.section-head{gap:15px}.setup{gap:12px}.experiment{padding-top:35px}th,td{padding:9px 7px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.demo-video,#balls-canvas{display:block;width:100%;height:auto;background:#1a1b1d;border-radius:8px;margin:25px 0}.slider-label{display:block;font-size:15px;font-weight:650;margin-top:25px}.timing-slider{width:100%;accent-color:var(--accent);margin:20px 0 0;min-height:25px}.range-labels{display:flex;justify-content:space-between;font-size:14px;color:var(--muted)}.result-box{padding:22px 26px;background:#e5e6e7;border-left:3px solid var(--accent);font-size:20px;margin-top:22px}#sync-status,#balls-status{font-size:15px;min-height:28px}

.experiment-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin:0 0 65px}.experiment-card{display:flex;flex-direction:column;padding:30px;border:1px solid #c5c8cb;border-radius:8px;text-decoration:none;background:#fafafa}.experiment-card:hover{border-color:var(--accent)}.experiment-card h2{margin:20px 0 10px;font-size:30px}.experiment-card p{font-size:17px;margin:0 0 25px}.card-action{margin-top:auto;font-size:15px;font-weight:650}.intro .intro-note{font-size:17px;color:var(--muted)}.standalone{border:0;padding-top:35px}.standalone h1{font-size:clamp(34px,5vw,56px);letter-spacing:-1.5px;margin:10px 0 24px;line-height:1.1}.standalone .section-head{margin-bottom:10px}.button-link{display:inline-block;font-size:15px;font-weight:600;line-height:1.4;padding:14px 20px;background:var(--ink);color:white;border:1px solid var(--ink);border-radius:5px;text-decoration:none}.button-link.secondary{background:transparent;color:var(--ink);border-color:#a9aeb3}.reveal-link{border-top:1px solid #cbd0d3;margin-top:38px;padding-top:18px}.reveal-link p{font-size:15px;color:var(--muted)}.explanation-page{max-width:800px;padding:35px 0 65px}.back-link{display:block;margin-bottom:38px;font-size:15px}.explanation-page h1{font-size:clamp(36px,5vw,60px);letter-spacing:-1.5px;line-height:1.1}.explanation-copy{margin:35px 0}.explanation-copy p{margin-bottom:24px}.explanation-copy a{overflow-wrap:anywhere}#no-result{font-size:16px;color:var(--muted)}@media(max-width:600px){.experiment-grid{grid-template-columns:1fr}.experiment-card{padding:24px}.standalone{padding-top:25px}.standalone .section-head{gap:12px}.button-link{max-width:100%}.explanation-page{padding-top:25px}}

.compact-intro{padding:25px 0 35px}.compact-intro h1{font-size:clamp(42px,6vw,66px);margin:15px 0 22px}.compact-intro p{font-size:18px}
