*{box-sizing:border-box}html,body{margin:0;background:#101317;color:#f3f0e9;font-family:Arial,Helvetica,sans-serif}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #f4c779;outline-offset:4px}main{max-width:1800px;margin:auto}header{padding:27px 32px 24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #34393e}h1{font-size:clamp(32px,4vw,54px);line-height:1;margin:12px 0 0;letter-spacing:-2px;font-weight:500}h1 em{font-family:Georgia,serif;color:#ff855b}.eyebrow{font-size:10px;letter-spacing:1.8px;color:#b0b7bf;font-weight:700;margin:0}.badge{font-size:32px;letter-spacing:-1px;text-align:right}.badge span{display:block;letter-spacing:1.6px;font-size:9px;margin-top:8px;color:#b0b7bf}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 300px}.viewport{min-height:610px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 48% 46%,#2b333a 0,#151a20 60%,#11151a 100%)}#canvas{position:absolute;inset:0}canvas{display:block;width:100%;height:100%;touch-action:none}.view-tools{position:absolute;left:22px;top:22px;display:flex;gap:4px}.view-tools button,.zoom button{border:1px solid #56616b;background:#161d25dd;color:#cbd3da;padding:9px 12px;font-size:11px;min-height:40px}.view-tools .selected{background:#e5e6df;color:#15191e;border-color:#e5e6df}.legend{display:flex;position:absolute;left:24px;bottom:52px;gap:19px;font-size:9px;letter-spacing:1px;font-weight:bold}.legend span:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px}.odd:before{background:#ff855b}.even:before{background:#66cce5}.out:before{background:#d7dacf}.gesture{position:absolute;left:24px;bottom:15px;margin:0;color:#aab6c0;font-size:11px}.zoom{position:absolute;right:20px;bottom:22px;display:flex;gap:4px}.zoom button{font-size:20px;width:40px}#labels{position:absolute;inset:0;pointer-events:none}.label{position:absolute;left:0;top:0;white-space:nowrap;font-size:9px;letter-spacing:.8px;padding:5px 7px;color:#e5ebef;border-left:2px solid #8b969e;background:#11171edb;will-change:transform}.label.odd{border-color:#ff855b;color:#ffab8e}.label.even{border-color:#66cce5;color:#91e8fa}#loading{position:absolute;left:20%;right:20%;top:43%;text-align:center;background:#151a20;padding:25px;line-height:1.6}aside{padding:25px 22px 20px;border-left:1px solid #34393e}aside h2{font-weight:500;font-size:27px;letter-spacing:-.8px;margin:13px 0}#stage-note{color:#c0c8cf;font-size:13px;line-height:1.55;min-height:64px;margin:0 0 20px}.clutch-readout{display:grid;grid-template-columns:1fr 1fr;gap:16px}.clutch-readout span{font-size:18px;color:#ff855b}.clutch-readout>div+div span{color:#66cce5}.clutch-readout small{font-size:10px}.clutch-readout b{display:block;font-size:11px;font-weight:400;margin:6px 0 10px}.clutch-readout i{display:block;background:#343c44;height:3px}.clutch-readout u{display:block;background:#ff855b;width:100%;height:3px}.clutch-readout>div+div u{background:#66cce5;width:0}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;margin:24px 0 12px}.steps button{border:1px solid #454d54;color:#aeb8c1;background:transparent;padding:9px 3px;text-align:left;font-size:10px}.steps button span{display:block;font-size:10px;margin-top:5px}.steps .selected{background:#e4e5de;color:#111820;border-color:#e4e5de}.primary{display:block;width:100%;padding:13px;border:0;background:#fa8057;color:#171b20;text-align:left;font-size:12px;font-weight:700}.sliders{margin:22px 0;font-size:11px}.sliders>label:first-child{display:block}.sliders output{float:right;color:#b2bdc6}.sliders input[type=range]{width:100%;accent-color:#fa8057;margin:8px 0 12px;min-height:24px}.check{display:flex;align-items:center;gap:7px;margin:9px 0;color:#c4cbd1;min-height:22px}.check input{accent-color:#fa8057;width:15px;height:15px}.part-info{border-top:1px solid #38414a;padding-top:16px}.part-info select{background:#1f2831;border:1px solid #54616c;color:#e6ebef;width:100%;font-size:11px;padding:10px 5px;margin-top:11px}#part-note{font-size:11px;line-height:1.5;color:#bcc7d0;margin:11px 0 0;min-height:50px}footer{padding:18px 30px;border-top:1px solid #34393e;display:flex;gap:28px;align-items:center}footer p{font-size:10px;color:#a9b4bd;line-height:1.6;margin:0;max-width:1040px}footer strong{color:#d2d9df}footer a{font-size:10px;color:#e8b59f;white-space:nowrap}body.failed .view-tools,body.failed .zoom{display:none}@media(max-width:720px){header{padding:20px}.badge{font-size:25px}.badge span{font-size:8px;letter-spacing:.6px}.workspace{grid-template-columns:1fr}.viewport{height:430px;min-height:0}aside{padding:22px;border-left:0;border-top:1px solid #34393e}.view-tools{left:13px;top:15px}.view-tools button{padding:8px 10px}.legend{left:15px;gap:12px}.gesture{left:15px;font-size:10px}.label{font-size:8px;padding:4px 5px}aside h2{margin:10px 0;font-size:28px}#stage-note{min-height:0;margin-bottom:15px}.sliders{margin:18px 0}.steps{margin:18px 0 10px}.steps button{padding:9px}footer{display:block;padding:20px}footer a{display:inline-block;margin-top:10px}.part-info #part-note{min-height:34px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}