:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#ecf1f9;background:#090c12;font-synthesis:none;--accent:#6be1ba;--muted:#8290a5;--line:#252d3c}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,.import-button:focus-within{outline:2px solid var(--accent);outline-offset:4px}main{max-width:1512px;margin:auto;padding:0 44px}.topbar{height:86px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{font-size:21px;font-weight:800;letter-spacing:-.8px;display:flex;align-items:center;gap:4px}.wordmark>span:last-child{font-weight:350;color:var(--muted)}.logo{font-size:31px;color:var(--accent);margin-right:9px}.toplinks{display:flex;align-items:center;gap:11px;font-size:10px;letter-spacing:1.1px;color:var(--muted)}.toplinks a{color:#dbe3ee;margin-left:25px;font-size:12px;letter-spacing:0}.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);flex-shrink:0}.intro{padding:49px 0 36px;display:flex;justify-content:space-between;gap:30px;align-items:center}.eyebrow{margin:0 0 14px;font-size:10px;letter-spacing:1.9px;color:var(--accent);font-weight:700}h1{font-size:55px;line-height:1.08;letter-spacing:-2.5px;margin:0 0 19px;font-weight:650;display:flex;align-items:center;gap:17px}.version{font-size:10px;letter-spacing:.7px;border:1px solid #374d47;color:var(--accent);padding:6px 9px;border-radius:4px;font-weight:500}.lead{font-size:14px;line-height:1.75;color:#929eb0;margin:0}.implementation{border-left:1px solid var(--line);padding:8px 0 8px 25px;max-width:380px;display:flex;flex-direction:column;gap:12px}.small-label{font-size:9px;font-weight:600;letter-spacing:1.4px;color:var(--muted)}.implementation strong{font-size:14px;font-weight:500}.implementation>span:last-child{font-size:11px;color:var(--muted)}.metrics{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:9px;background:#0e131d;margin-bottom:27px;overflow:hidden}.metric{padding:23px 24px 20px;border-right:1px solid var(--line);min-width:0}.metric:last-child{border:0}.metric>span{font-size:9px;letter-spacing:1.4px;color:#9ba8bb;font-weight:600;display:block}.metric strong{display:block;font-size:44px;letter-spacing:-1.7px;font-weight:500;line-height:1.4;font-variant-numeric:tabular-nums}.metric.primary strong{color:var(--accent)}.metric i{font-size:18px;color:#617089;font-style:normal;letter-spacing:0}.metric small{color:#758399;font-size:10px}.workbench{border:1px solid var(--line);background:#0d121c;border-radius:9px;overflow:hidden}.controls{padding:23px 24px;display:grid;grid-template-columns:minmax(200px,1.6fr) 1fr .7fr .6fr auto;gap:23px;align-items:start;border-bottom:1px solid var(--line)}.control label{display:flex;justify-content:space-between;font-size:11px;color:#a8b3c4;margin-bottom:10px}.control output{color:#d9e6f5;font-variant-numeric:tabular-nums}.control select,.control input[type=number]{height:36px;border:1px solid #30394a;background:#121a28;color:#e1e8f2;padding:0 9px;border-radius:5px;width:100%;font-size:12px}.count input{accent-color:var(--accent);width:100%;height:18px;margin:0}.presets{display:flex;justify-content:space-between;gap:4px;margin-top:7px}.presets button{background:none;border:0;color:#697b93;font-size:10px;cursor:pointer;padding:2px}.presets button:hover{color:var(--accent)}.run-buttons{display:flex;gap:7px;padding-top:23px}.button{border:0;border-radius:5px;padding:10px 14px;font-size:11px;font-weight:650;white-space:nowrap;cursor:pointer;height:36px}.button.start{background:var(--accent);color:#09211a;min-width:168px;display:flex;justify-content:space-between;gap:18px}.button.secondary{background:#1c2534;color:#c8d3e3}.button:disabled{opacity:.4;cursor:default}.stage-head{display:flex;align-items:center;justify-content:space-between;padding:15px 23px;color:#8c9aaf;font-size:10px;gap:12px}.stage-head>div{display:flex;align-items:center;gap:9px;min-width:0}.stage-head strong{font-weight:500;color:#d0d9e6}.stage-head #progress-label{color:var(--muted);margin-left:8px}.stage-wrap{margin:0 18px;position:relative;background:#070b12;border:1px solid #202b3d;border-radius:5px;isolation:isolate}#scene{position:relative;width:100%;height:clamp(300px,46vh,600px);overflow:hidden;contain:strict;user-select:none}.dot{position:absolute;left:0;top:0;width:6px;height:6px;border-radius:1px;background:#5ad1b1;pointer-events:none;contain:strict}.dot.mixed{width:36px;height:18px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;line-height:18px;text-align:center;color:#08111b;border-radius:2px}.c0{background:#62d6b4}.c1{background:#78b5ed}.c2{background:#b096ec}.c3{background:#e9ac75}.c4{background:#e789a8}.c5{background:#99cd81}.c6{background:#e1d37d}.c7{background:#65cbd3}#scene-hint{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#070b12df;color:#d8e3f0;font-size:15px;text-align:center;pointer-events:none}#scene-hint span{font-size:11px;color:var(--muted)}.scene-corner{position:absolute;bottom:12px;right:14px;font-size:8px;color:#5d718d;letter-spacing:1.6px;pointer-events:none;background:#070b12bd;padding:5px 6px}.progress-track{height:2px;background:#172231;margin:12px 18px 0}#progress{height:100%;width:0;background:var(--accent);transition:width .25s linear}.chart-wrap{position:relative;padding:19px 22px 10px}.chart-wrap canvas{width:100%;height:64px;display:block;margin-top:8px}.chart-wrap>span:last-child{position:absolute;right:24px;top:20px;font-size:10px;color:#677c96}.results{padding:38px 0 26px}.section-title{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:24px}.section-title .eyebrow{font-size:9px;letter-spacing:1.4px;margin-bottom:7px}h2{font-size:24px;letter-spacing:-.6px;font-weight:550;margin:0}.text-button,.import-button{border:1px solid #2b3546;background:transparent;color:#b5c2d4;font-size:11px;padding:9px 12px;border-radius:5px;cursor:pointer;display:inline-block}.text-button{margin-left:7px}.text-button:disabled{opacity:.35;cursor:default}.table-scroll{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap}th{font-size:9px;color:#75859a;font-weight:500;letter-spacing:.5px;padding:13px 15px;background:#0d141f}td{border-bottom:1px solid #1d2634;padding:16px 15px;font-size:11px;color:#aab9cc;font-variant-numeric:tabular-nums}td.fps-cell{color:var(--accent);font-size:16px}.empty td{text-align:center;color:#687a92;padding:28px}.tag{font-size:9px;border:1px solid #334238;border-radius:3px;padding:3px 6px;color:var(--accent)}.tag.jaspr{color:#bba5ff;border-color:#433457}.method{padding:20px 0 37px;display:grid;grid-template-columns:repeat(3,1fr);gap:40px}.step-number{font-size:10px;color:#647891;font-family:ui-monospace,monospace}h3{font-size:14px;font-weight:500;margin:10px 0}.method p{font-size:11px;line-height:1.8;color:#798aa0;margin:0}footer{padding:25px 0 30px;display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);font-size:9px;color:#5c6c82}#message{font-size:12px;color:#bfcddd;min-height:15px;margin:13px 0 0}.running #scene-hint{display:none}body[data-variant=jaspr]{--accent:#b49bfa}.running #phase-dot{background:#e9b573}input:disabled,select:disabled{opacity:.5}@media(min-width:1800px){main{max-width:1700px}}@media(max-width:1100px){main{padding:0 24px}.controls{grid-template-columns:1.5fr 1fr 1fr;gap:19px}.run-buttons{padding-top:23px}.metric{padding:19px 15px}.metric small{font-size:9px}.intro h1{font-size:46px}.toplinks>span:nth-child(2){display:none}.implementation{max-width:300px}.control.count{grid-row:span 2}.metric strong{font-size:38px}}@media(max-width:700px){main{padding:0 14px}.topbar{height:65px}.toplinks a{margin-left:4px;font-size:11px}.toplinks{gap:7px}.intro{padding:30px 0 24px;display:block}.intro h1{font-size:39px;letter-spacing:-1.7px}.implementation{margin-top:22px;max-width:none;padding:0;border:0;gap:8px}.lead{font-size:12px}.lead br{display:none}.metrics{grid-template-columns:1fr 1fr}.metric{padding:17px 13px;border-bottom:1px solid var(--line)}.metric:nth-child(2){border-right:0}.metric:nth-child(3){border-bottom:0}.metric strong{font-size:36px}.metric small{font-size:9px;line-height:1.5;display:block}.controls{padding:18px 15px;grid-template-columns:1fr 1fr;gap:17px}.control.count{grid-column:span 2;grid-row:auto}.run-buttons{grid-column:span 2;padding-top:0}.button.start{flex:1}.stage-head{padding:14px 15px;flex-wrap:wrap}.stage-wrap{margin:0 9px}#scene{height:360px}.stage-head #progress-label{margin-left:0}.stage-head #scene-info{font-size:9px}.chart-wrap{padding:17px 12px 6px}.progress-track{margin-left:9px;margin-right:9px}.method{grid-template-columns:1fr;gap:25px}.section-title{align-items:flex-start;flex-direction:column;gap:15px}.results{padding-top:29px}footer{flex-direction:column;gap:12px}.version{font-size:8px;padding:5px 6px}#scene-hint{font-size:12px}#scene-hint span{font-size:10px}}
/* Three-way navigation and commit-aware measurement (v2). */
#variant-links{display:flex;gap:7px;margin-left:17px}#variant-links a{margin:0;padding:7px 10px;border:1px solid transparent;border-radius:5px}#variant-links a[aria-current=page]{border-color:var(--line);background:#131d2b;color:var(--accent)}body[data-variant=react]{--accent:#76bdf8}.tag.react{color:#76bdf8;border-color:#2d4e6e}.metrics{grid-template-columns:repeat(5,minmax(0,1fr))}.scene-metric strong{color:var(--accent)}.conditions{display:block;color:#63768f;font-size:9px;margin-top:6px}.metric small{display:block;line-height:1.5}.metric strong{font-size:40px}.metric{padding-left:20px;padding-right:20px}@media(max-width:1100px){.metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.metric{border-bottom:1px solid var(--line)}.metric:nth-child(3){border-right:0}.metric:nth-child(4),.metric:nth-child(5){border-bottom:0}.metric strong{font-size:36px}}@media(max-width:700px){.metrics{grid-template-columns:1fr 1fr}.metric{padding:17px 13px}.metric:nth-child(2),.metric:nth-child(4){border-right:0}.metric:nth-child(3){border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.metric:nth-child(4){border-bottom:1px solid var(--line)}.metric:last-child{grid-column:span 2;border:0}#variant-links{gap:1px;margin-left:2px}#variant-links a{padding:6px;font-size:10px}.toplinks>.status-dot{display:none}.topbar .wordmark{font-size:19px}}

body[data-variant=flutter]{--accent:#52d3ee}.tag.flutter{color:#52d3ee;border-color:#2c5663}body[data-variant=flutter] #scene{display:block;position:relative}#runtime{font-size:11px;color:var(--accent)}@media(max-width:700px){.intro h1{flex-wrap:wrap;gap:10px}.topbar .wordmark{font-size:16px}.logo{margin-right:3px;font-size:24px}#variant-links{gap:0}#variant-links a{padding:6px 4px;font-size:9px}.toplinks{gap:0}}
.engine-timings{border:1px solid var(--line);border-radius:7px;padding:15px 20px;margin:-10px 0 24px;display:flex;align-items:center;flex-wrap:wrap;gap:12px 25px;color:var(--muted);font-size:11px}.engine-timings[hidden]{display:none}.engine-timings>strong{font-size:10px;color:var(--accent);letter-spacing:1px}.engine-timings b{font-size:17px;color:var(--accent);font-weight:500;font-variant-numeric:tabular-nums}.engine-timings small{width:100%;font-size:10px;line-height:1.6}
