@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@400;500;600;650;700;750;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#232728;background:#f4f3ef;font-synthesis:none;--line:#ddded8;--muted:#797f7b;--accent:#c9363f;--panel:#fafaf7;--scene:#efeee9}*{box-sizing:border-box}body{margin:0}button,input,a{-webkit-tap-highlight-color:transparent}button,a,input{touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer}button:disabled{opacity:.4;cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible,canvas:focus-visible{outline:2px solid #c9363f;outline-offset:4px}button{border:0;background:none}button:hover:not(:disabled){color:#b42532}a{color:inherit}button[hidden],[hidden]{display:none!important}.header{height:86px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 34px;gap:34px;background:var(--panel)}.brand{display:flex;align-items:center;text-decoration:none;font-family:Manrope,sans-serif;font-size:39px;letter-spacing:-3px;font-weight:800;gap:13px}.brand span{font-family:'DM Sans',sans-serif;font-size:10px;letter-spacing:2px;font-weight:600;padding-top:12px}.brand i{width:6px;height:6px;background:var(--accent);border-radius:50%;align-self:center;margin:10px 0 0 -9px}.car-id{font-size:9px;letter-spacing:1.8px;color:var(--muted);border-left:1px solid var(--line);padding-left:28px}.car-id span{display:block;font-size:12px;letter-spacing:0;color:#434844;margin-top:6px}.view-tabs{margin-left:auto;display:flex;border-radius:30px;background:#ecece6;padding:4px}.view-tabs button{padding:10px 21px;border-radius:24px;font-size:12px;font-weight:600}.view-tabs button[aria-pressed=true]{background:#fff;box-shadow:0 2px 5px #0000000a}.explode-button{border:1px solid #c9ccc4;border-radius:25px;padding:12px 20px;font-size:12px;display:flex;gap:10px;align-items:center}.explode-button[aria-pressed=true]{background:#252b27;color:white;border-color:#252b27}.explode-button span{font-size:18px;line-height:10px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 310px;height:calc(100dvh - 86px);min-height:640px}#viewer{position:relative;overflow:hidden;background:var(--scene);min-width:0}#canvas-host{position:absolute;inset:0 0 148px}#canvas-host canvas{width:100%;height:100%;display:block;touch-action:none}.scene-heading{position:absolute;z-index:2;top:34px;left:38px;pointer-events:none}.eyebrow{font-size:9px;font-weight:650;letter-spacing:1.8px;color:var(--muted)}h1,h2{font-family:Manrope,sans-serif;font-weight:650;letter-spacing:-1.4px}h1{font-size:32px;margin:12px 0 9px;line-height:1.2}.scene-heading p{font-size:12px;color:var(--muted);margin:0}.scene-top-actions{position:absolute;right:28px;top:32px;display:flex;gap:7px;z-index:3}.icon-button{padding:8px 11px;border:1px solid #cfd1c9;border-radius:22px;font-size:14px;background:#fafaf799}.icon-button span{font-size:10px;margin-left:5px}.icon-button[aria-pressed=true]{background:#252b27;border-color:#252b27;color:white}.scene-bottom{position:absolute;bottom:152px;left:38px;right:30px;display:flex;align-items:center;justify-content:space-between;gap:15px;z-index:4}.camera-presets{display:flex;gap:5px}.camera-presets button{font-size:10px;padding:8px 12px;border-radius:18px;border:1px solid transparent;background:#fafaf76e}.camera-presets button[aria-pressed=true]{background:#fafaf7;border-color:#cbcec6}.orbit-hint{position:absolute;bottom:35px;left:0;font-size:10px;color:var(--muted);display:flex;gap:8px;align-items:center;pointer-events:none}.orbit-hint span{font-size:18px}.orbit-hint b{font-weight:400;color:#a0a59b}.text-button{font-size:10px;white-space:nowrap;padding:8px 0}.build-control{position:absolute;z-index:5;bottom:27px;left:38px;right:32px;border-top:1px solid #d4d6ce;padding-top:20px}.build-heading,.range-labels{display:flex;justify-content:space-between;align-items:center}.build-heading output{font-size:12px;font-weight:600}.build-control input{width:100%;height:24px;margin:14px 0 6px;appearance:none;background:transparent;cursor:ew-resize;accent-color:#323a33}.build-control input::-webkit-slider-runnable-track{height:3px;background:linear-gradient(to right,#343c35 0 var(--progress,100%),#cbd0c7 var(--progress,100%) 100%);border-radius:4px}.build-control input::-webkit-slider-thumb{appearance:none;width:19px;height:19px;margin-top:-8px;background:#343c35;border:5px solid #f3f3ed;box-shadow:0 0 0 1px #343c35;border-radius:50%}.build-control input::-moz-range-track{height:3px;background:#cbd0c7}.build-control input::-moz-range-thumb{width:12px;height:12px;background:#343c35;border:4px solid #f3f3ed;border-radius:50%}.range-labels button{font-size:11px;padding:0;font-weight:550}.range-labels span{font-size:10px;color:var(--muted)}.config-panel{overflow:auto;border-left:1px solid var(--line);background:var(--panel);padding:30px 27px 20px}.panel-title h2{font-size:28px;line-height:1.2;margin:10px 0 8px}.panel-title h2 span{color:var(--accent)}.panel-title p{color:var(--muted);font-size:11px;margin:0 0 23px}.finish-group{padding:17px 0 14px;border-top:1px solid var(--line);position:relative}.finish-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;gap:5px}.finish-heading h3{font-size:11px;font-weight:600;margin:0}.finish-heading output{font-size:9px;color:var(--muted);text-align:right}.swatches{display:flex;gap:11px;min-height:27px;margin-bottom:10px}.swatch{width:27px;height:27px;border-radius:50%;background:var(--swatch);border:1px solid #00000012;position:relative;flex-shrink:0;padding:0;box-shadow:inset 1px 1px 2px #ffffff36}.swatch[aria-pressed=true]:after{content:'';position:absolute;inset:-4px;border:1px solid #60685f;border-radius:50%}.swatch[aria-pressed=true]:before{content:'✓';font-size:12px;color:var(--tick,#fff);position:absolute;inset:0;display:grid;place-items:center}.custom-colour{font-size:9px;color:var(--muted);display:inline-flex;align-items:center;gap:5px;cursor:pointer;position:relative}.custom-colour input{position:absolute;opacity:0;width:100%;height:100%;left:0;top:0;cursor:pointer}.custom-colour:focus-within{outline:2px solid var(--accent);outline-offset:3px}.custom-colour span{font-size:13px}.colour-note{font-size:10px;color:var(--muted);line-height:1.6;margin:0 0 14px}.build-summary{font-size:10px;color:#606a60;display:flex;gap:7px;align-items:center;border-top:1px solid var(--line);padding:16px 0 10px}.status-dot{width:5px;height:5px;border-radius:50%;background:#647b59;flex-shrink:0}.reset-build{font-size:10px;padding:8px 0;width:100%;display:flex;justify-content:space-between;text-align:left}.about-link{font-size:9px;color:var(--muted);padding:15px 0 0;text-align:left;line-height:1.5}.assembly-card{padding:17px;background:#eeefe8;border-radius:8px;margin:8px 0 12px}.assembly-card h3{font-family:Manrope,sans-serif;font-size:16px;margin:9px 0}.assembly-card p{font-size:11px;line-height:1.6;color:#657060;margin:0 0 4px}#loading{position:absolute;z-index:10;inset:0 0 150px;background:var(--scene);display:flex;justify-content:center;align-items:center;flex-direction:column;gap:14px;font-size:12px}#loading span{font-size:11px;color:var(--muted)}#loading progress{height:3px;width:180px;accent-color:#394537}.loading-ring{width:34px;height:34px;border:1px solid #cbd0c4;border-top-color:#394537;border-radius:50%;animation:spin 1.2s linear infinite;margin-bottom:6px}@keyframes spin{to{transform:rotate(360deg)}}#labels{position:absolute;inset:0 0 148px;pointer-events:none;overflow:hidden}.part-label{position:absolute;pointer-events:auto;background:#fbfbf4ed;border:1px solid #b4bdb0;border-radius:18px;padding:6px 11px;font-size:10px;box-shadow:0 2px 6px #0000000a;white-space:nowrap;transform:translate(-50%,-50%)}.part-label:before{content:'';display:inline-block;width:4px;height:4px;border-radius:50%;background:#c9363f;margin-right:6px}.part-label.selected{background:#27342c;color:#fff}dialog{border:1px solid var(--line);border-radius:15px;background:#fafaf7;width:min(570px,calc(100vw - 28px));padding:38px;color:#232728;box-shadow:0 30px 100px #0003}dialog::backdrop{background:#1c27245c;backdrop-filter:blur(5px)}dialog h2{font-size:30px;margin:12px 0 20px}dialog h3{font-size:12px;margin-top:25px}dialog p{font-size:13px;line-height:1.8;color:#626961}dialog .credit{font-size:10px}.dialog-close{position:absolute;right:16px;top:10px;font-size:26px}.reference-links{display:flex;gap:15px;font-size:12px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}body.night{--scene:#252c31;--muted:#899493}body.night #viewer{color:#e4e7e1}body.night .config-panel,body.night .header{--muted:#797f7b}body.night .part-label,body.night .camera-presets button,body.night .icon-button{color:#27312b}body.night .part-label.selected{color:#fff}body.night .build-control input::-webkit-slider-thumb{border-color:#252c31;background:#c7d0c6;box-shadow:0 0 0 1px #c7d0c6}body.night .build-control input::-webkit-slider-runnable-track{background:#8d9d8e}
@media(min-width:1500px){.workspace{grid-template-columns:minmax(0,1fr) 350px}.config-panel{padding:38px 34px}.finish-group{padding:23px 0 18px}.scene-heading{top:46px;left:50px}h1{font-size:39px}.scene-bottom,.build-control{left:50px;right:44px}.swatches{gap:15px}.swatch{width:30px;height:30px}}
@media(max-width:1100px){.header{gap:20px;padding:0 24px}.car-id{display:none}.scene-top-actions{top:126px;left:35px;right:auto}.icon-button{padding:7px 10px}h1{font-size:27px}.scene-bottom{left:26px;right:22px}.build-control{left:26px;right:22px}.scene-heading{left:26px}.range-labels span{display:none}.workspace{grid-template-columns:minmax(0,1fr) 280px}.config-panel{padding:27px 22px}.swatches{gap:9px}}
@media(max-width:740px){.header{height:73px;padding:0 16px;gap:13px}.brand{font-size:31px;gap:8px}.brand span{font-size:8px;letter-spacing:1.2px;padding-top:10px}.brand i{width:4px;height:4px;margin-left:-5px}.view-tabs{margin-left:auto}.view-tabs button{padding:8px 11px;font-size:10px}.explode-button{padding:8px 10px;font-size:9px;gap:4px}.workspace{display:flex;flex-direction:column;height:auto;min-height:0}#viewer{height:calc(100svh - 73px);min-height:560px;max-height:820px;flex-shrink:0}#canvas-host,#labels{bottom:143px}.scene-heading{top:24px;left:21px}h1{font-size:27px}.scene-heading p{font-size:11px}.scene-top-actions{top:112px;left:21px}.build-control{bottom:21px;left:21px;right:21px;padding-top:19px}.scene-bottom{bottom:151px;left:21px;right:21px}.orbit-hint{font-size:9px;gap:5px}.camera-presets button{padding:7px 10px;font-size:9px}.config-panel{overflow:visible;border-left:0;border-top:1px solid var(--line);padding:27px 24px;display:grid;grid-template-columns:1fr 1fr;column-gap:25px}.panel-title,.colour-note,.assembly-card,.build-summary,.reset-build,.about-link{grid-column:1/-1}.panel-title h2{font-size:26px}.finish-heading{align-items:flex-start;flex-direction:column;gap:6px}.swatches{gap:9px;flex-wrap:wrap}.swatch{width:25px;height:25px}.finish-group{padding:19px 0}.colour-note{margin-top:10px}.about-link{padding-top:15px}.part-label{font-size:9px;padding:5px 8px}}
@media(max-width:370px){.header{gap:7px;padding:0 10px}.brand span,.brand i{display:none}.view-tabs button{padding:8px 12px}.scene-heading h1{font-size:24px}.config-panel{column-gap:15px;padding:24px 18px}.swatches{gap:8px}.swatch{width:23px;height:23px}.orbit-hint{font-size:8px}.text-button{font-size:9px}}
@media(prefers-reduced-motion:reduce){.loading-ring{animation:none}}
body.night .icon-button[aria-pressed=true]{color:#f3f5f0;border-color:#69756c}.orbit-hint{background:#fafaf7b8;border-radius:16px;padding:4px 10px;margin-left:-10px;color:#697267}body.night .orbit-hint{background:#252c31c9;color:#bbc6be}.explode-button[aria-pressed=true]:hover{color:#fff}
.orbit-hint{bottom:calc(100% + 8px)}
@media(max-width:740px){.scene-bottom{align-items:flex-end}.camera-presets{flex-wrap:wrap;max-width:calc(100% - 72px);row-gap:4px}}
.is-exploded .finish-group,.is-exploded .colour-note{display:none}.mechanical-toggles{display:flex;gap:7px;flex-wrap:wrap;margin:14px 0}.mechanical-toggles button{border:1px solid #c8cfc5;border-radius:20px;padding:10px 12px;font-size:10px}.mechanical-toggles button[aria-pressed=true]{background:#283d31;color:white;border-color:#283d31}.mechanical-help{font-size:11px;color:#778074;line-height:1.7}.part-select-label{font-size:10px;display:block;margin:22px 0 9px;color:#687362}#part-picker{width:100%;font:inherit;font-size:11px;padding:12px 8px;border:1px solid #c9d0c6;border-radius:7px;color:#2c3d31;background:#f5f7ef;margin-bottom:14px}.is-exploded .assembly-card{padding:20px 17px;margin-top:10px}.is-exploded .assembly-card p{line-height:1.8}#mechanical-tools{grid-column:1/-1}

.panel-controls{border-bottom:1px solid var(--line,#d8dbd2);padding:0 0 22px;margin:22px 0}.panel-controls p{font-size:12px;line-height:1.6;color:#6b756d;margin:10px 0 14px}.panel-buttons{display:grid;grid-template-columns:1fr 1fr;gap:7px}.panel-buttons button{font:inherit;font-size:11px;padding:11px 6px;border:1px solid #bdc8be;border-radius:8px;background:transparent;color:inherit;cursor:pointer}.panel-buttons button[aria-pressed=true]{background:#294c3b;border-color:#294c3b;color:#fff}.panel-buttons button:hover{border-color:#47765a}.panel-controls .text-button{font-size:11px}.panel-controls[hidden]{display:none}.night .panel-controls p{color:#abb8b0}.night .panel-buttons button{border-color:#58675b}

@media(max-width:850px){.panel-controls{grid-column:1/-1}}
