:root{font-family:Arial,Helvetica,sans-serif;color:#272c2b;background:#f5f4ef;font-synthesis:none;--accent:#d65325;--line:#d9dcd5;--muted:#68706b;--ink:#272c2b}*{box-sizing:border-box}body{margin:0}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}button:disabled{cursor:default}button{min-height:48px}.masthead{height:92px;display:flex;align-items:center;justify-content:space-between;padding:0 40px;border-bottom:1px solid #d9dbd4;gap:20px}.brand{display:flex;align-items:center;gap:15px;font-size:13px;letter-spacing:1.6px;font-weight:800}.brand small{display:block;font-size:10px;letter-spacing:1.4px;margin-top:6px;color:#737a74;font-weight:500}.brand-symbol{font-size:31px;line-height:1;letter-spacing:-9px;font-style:italic;display:block;width:45px}.brand-symbol span{color:var(--accent)}nav{display:flex;gap:30px;font-size:13px;color:#5c655f}nav a{display:flex;align-items:center;min-height:48px;gap:9px}nav span{color:var(--accent);font-size:17px}nav a:hover,.quiet-link:hover{color:var(--accent)}main{display:grid;grid-template-columns:minmax(0,1fr) 318px;max-width:1920px;margin:auto;min-height:calc(100svh - 142px)}.stage{position:relative;background:#e9e8e2;min-height:695px;overflow:hidden}.stage-heading{position:absolute;top:36px;left:40px;z-index:2;pointer-events:none}.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.7px;line-height:1.5;color:#6b746c}h1{font-size:64px;line-height:1;margin:13px 0 9px;letter-spacing:-4px;font-weight:800}h1 span{font-weight:400;margin-left:3px}p{margin:0}.stage-heading p{font-size:13px;color:#66706a}#viewport{position:absolute;inset:122px 0 108px}#studio{display:block;width:100%;height:100%;touch-action:none;outline:none}#loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;color:#5f685f;font-size:13px;background:#e9e8e2}#loading span{width:10px;height:10px;border:1px solid #d65325;border-top-color:transparent;border-radius:100%;animation:spin .8s linear infinite}.stage-meta{position:absolute;left:40px;right:40px;bottom:120px;display:flex;justify-content:space-between;gap:10px;pointer-events:none;font-size:9px;letter-spacing:1.3px;color:#747b74}.stage-meta i{display:inline-block;width:5px;height:5px;border-radius:100%;background:#d65325;vertical-align:1px;margin-right:7px}.view-bar{position:absolute;bottom:46px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:3px;white-space:nowrap;padding:5px;background:#f5f4efdd;border:1px solid #d7d9d1;border-radius:6px;box-shadow:0 8px 24px #272c2b07}.view-bar button{background:transparent;border:0;padding:0 20px;font-size:12px;min-height:42px;color:#68716a;border-radius:3px}.view-bar button:hover{background:#e3e4dd}.view-bar button[aria-pressed=true]{background:#2d342f;color:#f6f5ee}.view-bar #rotate{border-left:1px solid #d9ddd4;border-radius:0 3px 3px 0;padding-left:17px}.rotate-icon{font-size:18px;margin-right:4px;vertical-align:-1px}.stage-instructions{position:absolute;bottom:20px;text-align:center;width:100%;font-size:10px;color:#828980;letter-spacing:.1px}.stage-instructions span{margin:0 6px}.inspector{padding:30px 27px 20px;border-left:1px solid #d9dbd4;background:#f8f7f2}.inspector-title{display:flex;align-items:center;justify-content:space-between;gap:6px}.inspector-title .eyebrow{font-size:9px;letter-spacing:1px}.status-tag{font-size:8px;letter-spacing:.6px;color:#bd542d;background:#f3e6da;border-radius:3px;padding:5px 6px}.control-section{padding:25px 0 20px;border-bottom:1px solid var(--line)}h2{font-size:15px;font-weight:600;letter-spacing:-.3px;margin:0 0 9px}.control-section>p{font-size:11px;line-height:1.5;color:var(--muted);margin-bottom:23px}.suspension label{font-size:12px;display:flex;align-items:center;justify-content:space-between;gap:10px;margin:19px 0 8px}.suspension output{font-variant-numeric:tabular-nums;font-size:12px;color:#777d72}.suspension input{display:block;width:100%;height:25px;margin:0;cursor:pointer;accent-color:var(--accent)}input[type=range]{appearance:none;-webkit-appearance:none;background:transparent}input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right,#d65325 var(--fill,0%),#d9ddd4 var(--fill,0%));height:3px;border-radius:3px}input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:13px;height:13px;margin-top:-5px;border:3px solid #f8f7f2;border-radius:100%;background:#d65325;box-shadow:0 0 0 1px #d65325}input[type=range]::-moz-range-track{height:3px;background:#d9ddd4}input[type=range]::-moz-range-thumb{background:#d65325;border:3px solid #f8f7f2;width:8px;height:8px;border-radius:100%;box-shadow:0 0 0 1px #d65325}.range-ends{display:flex;justify-content:space-between;font-size:9px;color:#93998f}.wide-button{border:1px solid #cdd3c8;background:transparent;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:23px;border-radius:4px;font-size:11px;min-height:42px;color:#505b51}.wide-button:hover{background:#ebece4}.wide-button[aria-pressed=true]{background:#e8e4d8;border-color:#bfc5b8}.play-icon{font-size:17px}.live-measurement{display:flex;justify-content:space-between;margin-top:13px;font-size:10px;color:#92988d}.live-measurement output{font-size:10px}.toggle-row{display:flex;align-items:center;justify-content:space-between;min-height:38px;font-size:12px;color:#687164}.toggle-row label{cursor:pointer;flex:1}.toggle-row input{appearance:none;-webkit-appearance:none;display:block;width:31px;height:18px;min-width:31px;margin:0;border-radius:12px;background:#d4d9cf;position:relative;cursor:pointer;transition:background .15s}.toggle-row input:before{content:"";position:absolute;width:12px;height:12px;top:3px;left:3px;border-radius:50%;background:#f9f9f3;transition:transform .15s}.toggle-row input:checked{background:#53624e}.toggle-row input:checked:before{transform:translateX(13px)}.spec-section{padding-bottom:23px}dl{margin:14px 0 17px}dl div{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin:13px 0}dt{font-size:11px;color:#7b8376}dd{font-size:12px;margin:0;font-variant-numeric:tabular-nums}dd span{font-size:9px;color:#90988a;margin-left:2px}.quiet-link{font-size:10px;color:#57654f}.review-note{padding-top:22px}.review-note>span{font-size:8px;letter-spacing:1.2px;color:#8b9385}.review-note p{font-size:10px;color:#8a9283;line-height:1.7;margin-top:8px}.reset-button{border:0;background:transparent;font-size:11px;color:#697760;margin-top:10px;padding:0;min-height:36px}.reset-button:hover{color:#d65325}footer{max-width:1920px;margin:auto;display:flex;gap:18px;align-items:center;justify-content:space-between;min-height:50px;padding:12px 40px;border-top:1px solid #d9ddd3;font-size:9px;color:#8a9282;line-height:1.6}footer span:first-child{font-size:9px;letter-spacing:1px;white-space:nowrap}footer b{color:#c3c8bc;margin:0 6px;font-weight:400}@keyframes spin{to{transform:rotate(360deg)}}@media(min-width:1500px){.stage-heading{left:54px;top:44px}h1{font-size:76px}.stage-meta{left:54px;right:54px}}@media(max-width:1000px){.masthead{padding:0 25px;height:80px}nav{gap:22px}main{grid-template-columns:1fr;min-height:0}.stage{height:min(68svh,680px);min-height:470px}.stage-heading{left:27px;top:26px}h1{font-size:51px}.stage-heading p{font-size:12px}#viewport{inset:100px 0 93px}.stage-meta{left:28px;right:28px;bottom:100px;font-size:8px}.view-bar{bottom:36px}.stage-instructions{bottom:13px}.inspector{border-left:0;border-top:1px solid #d8dcd2;padding:24px 27px;display:grid;grid-template-columns:1fr 1fr;column-gap:35px;align-items:start}.inspector-title{grid-column:1/-1;justify-content:flex-start;gap:16px;margin-bottom:7px}.control-section{padding-top:18px}.suspension{grid-row:2/5;grid-column:1;border-bottom:0;padding-bottom:0}.suspension label{margin-top:21px}.spec-section{grid-column:2;padding-bottom:18px}.review-note{grid-column:1/-1;border-top:1px solid var(--line);padding-top:15px;margin-top:18px}.review-note p{font-size:11px;max-width:550px}.reset-button{grid-column:1/-1;justify-self:start;margin-top:8px}footer{padding:17px 27px;font-size:9px}}@media(max-width:520px){.masthead{height:72px;padding:0 19px}.brand{font-size:10px;letter-spacing:1px;gap:9px}.brand small{font-size:8px}.brand-symbol{font-size:28px;width:38px}nav{gap:14px;font-size:10px}nav a:first-child{display:none}nav span{font-size:14px}.stage{height:480px;min-height:450px}.stage-heading{left:22px;top:25px}.eyebrow{font-size:9px;letter-spacing:1.4px}h1{font-size:47px;margin-top:10px}#viewport{inset:126px 0 95px}.stage-meta{left:21px;right:21px;bottom:109px;font-size:6.5px;letter-spacing:.8px}.view-bar{gap:0;padding:4px;bottom:43px;max-width:calc(100% - 28px)}.view-bar button{padding:0 12px;font-size:11px;min-height:42px}.view-bar #rotate{padding-left:10px;padding-right:9px}.rotate-icon{font-size:16px;margin-right:1px}.stage-instructions{font-size:8px;bottom:23px}.stage-instructions span{margin:0 3px}.inspector{padding:24px 22px;grid-template-columns:1fr;gap:0}.inspector-title{margin-bottom:8px;justify-content:space-between}.suspension{grid-row:auto;grid-column:auto;border-bottom:1px solid var(--line);padding-bottom:23px}.control-section{padding-top:23px;padding-bottom:23px}.control-section>p{font-size:12px;margin-bottom:21px}.suspension label,.toggle-row,dd{font-size:13px}.range-ends{font-size:10px}.suspension input{height:29px}.toggle-row{min-height:44px}.toggle-row input{width:36px;min-width:36px;height:20px}.toggle-row input:before{width:14px;height:14px}.toggle-row input:checked:before{transform:translateX(16px)}.spec-section{grid-column:auto}dt{font-size:12px}.quiet-link{font-size:11px}.wide-button{min-height:48px;font-size:12px}.review-note{margin-top:0;border:0;padding-top:22px}.review-note p{font-size:12px}footer{padding:18px 22px;display:block;font-size:10px}footer span{display:block}footer span+span{margin-top:9px}.reset-button{min-height:44px;font-size:12px}}@media(prefers-reduced-motion:reduce){*,*:before{transition:none!important;animation:none!important}}

@media(min-width:1001px) and (max-height:960px){.masthead{height:78px}.inspector{padding:22px 25px 13px}.control-section{padding:19px 0 16px}.control-section>p{margin-bottom:14px}.suspension label{margin-top:13px}.wide-button{margin-top:17px;min-height:38px}.live-measurement{margin-top:10px}.toggle-row{min-height:32px}.spec-section dl{margin:11px 0 12px}dl div{margin:10px 0}.review-note{padding-top:16px}.review-note p{line-height:1.6}.reset-button{margin-top:6px;min-height:30px}main{min-height:calc(100svh - 123px)}footer{min-height:45px}.stage-heading{top:31px}#viewport{inset:112px 0 103px}}

/* Inspection labels stay readable at normal browser zoom. */
nav{font-size:14px}h2{font-size:16px}.suspension label,.toggle-row{font-size:14px}.suspension output,dd{font-size:14px}.control-section>p,dt{font-size:12px}.view-bar button{font-size:13px;min-height:48px}.wide-button{font-size:12px}.review-note p{font-size:11px}.quiet-link{font-size:11px}.live-measurement,.live-measurement output{font-size:11px}.reset-button{font-size:12px}.range-ends{font-size:10px}@media(max-width:520px){nav{font-size:11px}.view-bar button{font-size:12px;padding:0 10px}.review-note p{font-size:12px}.stage-instructions{bottom:19px}}

@media(max-width:520px){.stage{height:500px}#viewport{inset:126px 0 122px}}

@media(max-width:520px){.view-bar button{min-width:48px;padding:0 8px}.rotate-label{display:none}.view-bar #rotate{padding:0 10px}.rotate-icon{font-size:20px}}

@media(min-width:1001px) and (max-height:960px){.control-section{padding:14px 0 13px}.suspension label{margin-top:10px}.control-section>p{margin-bottom:12px}.wide-button{margin-top:14px}.spec-section dl{margin:8px 0}dl div{margin:8px 0}.review-note{padding-top:14px}}

@media(min-width:1001px) and (max-height:960px){.inspector{padding:19px 25px 9px}.control-section{padding:13px 0 12px}.review-note{padding-top:12px}}

.asset-links{display:grid;gap:10px;margin:18px 0}.asset-links a{line-height:1.5}
/* Keep the bike and camera controls visible while inspecting a long sidebar. */
@media(min-width:1001px){main{height:calc(100svh - 142px);min-height:480px}.stage{min-height:0}.inspector{overflow-y:auto;overscroll-behavior:contain}}
@media(min-width:1001px) and (max-height:960px){main{height:calc(100svh - 123px);min-height:480px}}
