@import url("/experiments/apex-livery-studio/assets/fonts/fonts.css");
:root{font-family:'DM Sans',sans-serif;color:#f0f1f2;background:#191c20;font-synthesis:none;--accent:#ff7047;--muted:#a0a5af;--border:#34383e;--panel:#22262b;--round:8px;color-scheme:dark}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;color:inherit}button:disabled{opacity:.32;cursor:not-allowed}button,a,input,select{ -webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}button{transition:background .15s,color .15s,transform .15s}button:hover:not(:disabled){filter:brightness(1.12)}::selection{background:#ff704744;color:inherit}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-thumb{background:#51565f;border-radius:5px}svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}input{caret-color:var(--accent)}
.topbar{height:84px;display:flex;align-items:center;gap:36px;padding:0 28px;border-bottom:1px solid var(--border);background:#191c20;position:relative;z-index:3}.brand{display:flex;align-items:center;gap:9px;text-decoration:none;color:#fff}.brand>svg{width:37px;height:37px;fill:var(--accent);stroke:none}.brand>span{font-family:'Barlow Condensed',sans-serif;font-size:30px;line-height:.82;font-weight:700;letter-spacing:.07em}.brand-sub{display:block;font-family:'DM Sans',sans-serif;font-size:9px;letter-spacing:.19em;line-height:1;margin-top:9px;font-weight:500;color:#a0a5af}.project{border-left:1px solid var(--border);padding-left:30px;display:flex;flex-direction:column;gap:4px}.project input{background:none;border:none;color:#f4f4f5;font-size:15px;font-weight:550;padding:0;max-width:240px}.project>span{font-size:12px;color:var(--muted)}.header-actions{margin-left:auto;display:flex;align-items:center;gap:9px}.icon-button{width:35px;height:36px;border:0;background:none;display:grid;place-items:center;border-radius:6px;color:#c2c7ce}.separator{height:22px;width:1px;background:var(--border);margin:0 12px}.quiet-button{background:transparent;border:none;padding:10px 16px;font-size:14px}.primary-button{background:var(--accent);color:#1b1c20;border:none;font-weight:700;padding:12px 18px;display:flex;align-items:center;gap:20px;border-radius:6px;font-size:14px}.primary-button svg{width:17px;height:17px}.workspace{height:calc(100dvh - 84px);display:grid;grid-template-columns:82px minmax(0,1fr) 320px}.toolrail{background:#191c20;display:flex;flex-direction:column;gap:8px;align-items:center;padding:22px 8px 16px;border-right:1px solid var(--border)}.toolrail button{width:66px;min-height:69px;background:none;border:0;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;font-size:12px;color:#a8adb6;font-weight:500;position:relative}.toolrail button svg{width:23px;height:23px}.toolrail button.active{color:var(--accent);background:#ff704715}.toolrail button.active:before{content:'';position:absolute;left:-8px;height:24px;width:2px;background:var(--accent)}.rail-spacer{flex:1}.stage{position:relative;min-width:0;overflow:hidden;background:#dadcdd;color:#252a30}.stage #viewport{position:absolute;inset:0}.stage canvas{display:block;width:100%;height:100%;touch-action:none}.stage-label{position:absolute;top:33px;left:34px;display:flex;flex-direction:column;gap:6px;pointer-events:none}.car-name{font-family:'Barlow Condensed',sans-serif;font-weight:600;letter-spacing:.035em;font-size:32px;line-height:1}.stage-label>span+span{font-size:12px;color:#626a72}.stage-actions{position:absolute;right:27px;top:30px;display:flex;gap:8px}.stage-button{display:grid;place-items:center;background:#edf0f0;border:1px solid #c9ced1;border-radius:7px;width:38px;height:38px;color:#343a40}.stage-button[aria-pressed=true]{background:#ff7047;color:#191c20;border-color:#ff7047}.mode-switch{position:absolute;top:126px;left:34px;display:flex;border:1px solid #bdc3c7;background:#e6e8e9;border-radius:8px;padding:4px;gap:3px}.mode-switch button{background:transparent;border:0;border-radius:5px;padding:9px 11px;display:flex;gap:7px;align-items:center;font-size:12px;color:#535a63}.mode-switch button svg{width:15px;height:15px}.mode-switch button.active{background:#fff;color:#22282d;box-shadow:0 2px 4px #0000000b}.stage-bottom{position:absolute;bottom:28px;left:34px;right:27px;display:flex;justify-content:space-between;align-items:flex-end;gap:16px}.stage-note{display:flex;flex-direction:column;gap:7px;pointer-events:none}.stage-note>span:first-child{font-size:13px;font-weight:600}.stage-note>span+span{font-size:12px;color:#626a72}.camera-views{display:flex;background:#eef0f1;padding:4px;border:1px solid #c7cdd1;border-radius:8px;gap:2px}.camera-views button{border:0;background:none;color:#575e67;padding:8px 12px;border-radius:5px;font-size:12px}.camera-views button.active{background:#292e34;color:#fff}.inspector{background:#22262b;display:flex;flex-direction:column;border-left:1px solid #34383e;min-height:0}.inspector #panel-content{padding:29px 24px 24px;overflow:auto;overflow-x:hidden;flex:1}.panel-title{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:7px}.panel-title h1{font-size:24px;font-weight:500;letter-spacing:-.03em;margin:0}.panel-title span{color:#969da7;font-size:12px}.panel-intro{font-size:13px;line-height:1.6;color:#a4abb5;margin:0 0 25px}.field-label{display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:500;margin:23px 0 12px}.field-label small{font-size:12px;color:#a5acb6;font-weight:400}.select-wrap select{width:100%;border:1px solid #464c54;border-radius:6px;background:#2b3036;color:#e5e8eb;font-size:14px;padding:11px 12px}.palette-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.swatch{height:31px;border-radius:50%;border:2px solid transparent;background:var(--swatch);width:31px;justify-self:center}.swatch.selected{outline:2px solid #f5f6f7;outline-offset:3px}.color-custom{display:flex;align-items:center;gap:10px;margin-top:17px;background:#2b3036;border:1px solid #454b53;border-radius:7px;padding:8px 10px}.color-custom input[type=color]{padding:0;border:0;background:transparent;width:25px;height:25px;cursor:pointer;flex:none}.color-custom input[type=color]::-webkit-color-swatch-wrapper{padding:0}.color-custom input[type=color]::-webkit-color-swatch{border:0;border-radius:4px}.color-custom input[type=text]{min-width:0;flex:1;width:100%;background:none;border:0;color:#d1d5db;font-size:13px;text-transform:uppercase;outline:none}.color-custom>span{font-size:12px;color:#959ca6;white-space:nowrap}.segmented{display:flex;gap:4px;background:#191d22;padding:4px;border-radius:7px}.segmented button{background:none;border:0;border-radius:4px;flex:1;font-size:12px;padding:9px 4px;color:#a4abb5}.segmented button.active{background:#444b54;color:#fff}.pattern-options{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.pattern-button{border:1px solid #424850;border-radius:7px;padding:0;overflow:hidden;background:#2b3036;color:#aeb5bf;font-size:12px;text-align:center}.pattern-button.selected{border-color:var(--accent);color:#fff}.pattern-preview{height:42px;display:block;background:#e5e5df;position:relative;overflow:hidden}.pattern-preview.stripe:after{content:'';position:absolute;width:18%;height:100%;background:#ff7047;left:40%;transform:skew(-20deg)}.pattern-preview.split:after{content:'';position:absolute;width:55%;height:100%;background:#ff7047;left:45%;transform:skew(-20deg)}.pattern-button>span:last-child{display:block;padding:9px 3px}.rule{border:0;border-top:1px solid #383e46;margin:26px 0}.preset-row{display:flex;align-items:center;gap:12px;width:100%;background:none;border:0;padding:11px 0;text-align:left}.preset-colors{display:flex;height:26px;width:64px;overflow:hidden;border-radius:4px;flex:none}.preset-colors i{flex:1;background:var(--color)}.preset-row strong{font-size:13px;font-weight:500;flex:1}.preset-row svg{width:15px;color:#7d8792}.inspector-footer{border-top:1px solid #383e46;padding:17px 24px;display:flex;align-items:center;gap:12px;color:#8e97a3;font-size:12px;line-height:1.6}.inspector-footer svg{width:21px;flex:none}.inspector-footer button{border:0;background:none;padding:0;font-size:12px;color:#c1c7cf;text-decoration:underline;text-underline-offset:3px}.slider-row{display:flex;align-items:center;gap:10px}.slider-row input{width:100%;accent-color:var(--accent);cursor:pointer}.slider-row output{min-width:39px;text-align:right;font-size:12px;color:#b8bfc8}.wide-button{width:100%;background:#31373e;border:1px solid #4b535d;border-radius:7px;padding:12px 13px;display:flex;align-items:center;justify-content:center;gap:10px;font-size:14px;margin-top:15px}.wide-button svg{width:17px}.hint{font-size:12px;line-height:1.65;color:#a6adb7;margin-top:13px}.part-option{display:flex;align-items:center;gap:12px;width:100%;border:1px solid #414851;background:#2a3037;border-radius:7px;margin:8px 0;padding:13px 12px;text-align:left}.part-option.selected{border-color:var(--accent);background:#ff704710}.part-option>span{display:flex;flex-direction:column;gap:4px}.part-option strong{font-size:14px;font-weight:500}.part-option small{font-size:12px;color:#a4acb7}.part-option .option-dot{margin-left:auto;width:14px;height:14px;border-radius:50%;border:1px solid #68717c;flex:none}.part-option.selected .option-dot{border:4px solid var(--accent);background:#22262b}.sticker-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.sticker-choice{height:68px;display:grid;place-items:center;border-radius:7px;border:1px solid #49515a;background:#d9dddf;color:#141a20;overflow:hidden}.sticker-choice.selected{border:2px solid var(--accent)}.sticker-choice img{max-width:85%;max-height:48px;object-fit:contain}.sticker-choice span{font-family:'Barlow Condensed',sans-serif;font-size:25px;font-weight:700}.sticker-list{display:flex;flex-direction:column;gap:8px}.sticker-row{display:flex;align-items:center;gap:10px;padding:10px;background:#2c3239;border-radius:6px;font-size:13px}.sticker-row>span{flex:1}.sticker-row button{border:0;background:transparent;color:#b0b9c3}.sticker-row svg{width:15px}.empty-note{font-size:13px;color:#98a1ac;line-height:1.6}.model-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:10px;background:#dadcdde6;font-size:14px}.model-loading[hidden]{display:none}.loader{height:18px;width:18px;border:2px solid #b0b7bb;border-top-color:#363d44;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#brush-cursor{position:absolute;width:24px;height:24px;border:1px solid #fff;outline:1px solid #2228;border-radius:50%;pointer-events:none;transform:translate(-50%,-50%);z-index:2}#toast{position:fixed;bottom:27px;left:50%;transform:translate(-50%,12px);background:#191d22;color:#fff;border-radius:8px;padding:12px 20px;font-size:14px;box-shadow:0 7px 25px #0003;opacity:0;pointer-events:none;transition:opacity .15s,transform .15s;z-index:20}#toast.visible{opacity:1;transform:translate(-50%,0)}dialog{background:#22262b;color:#e8ebef;border:1px solid #4b525a;border-radius:14px;padding:34px;max-width:480px;width:calc(100% - 32px);box-shadow:0 20px 90px #0007}dialog::backdrop{background:#10151b99}dialog h2{font-size:31px;font-weight:500;letter-spacing:-.03em;line-height:1.2;margin:12px 0 14px}dialog p{font-size:14px;color:#b2bac5;line-height:1.7}.dialog-close{position:absolute;right:13px;top:9px;background:none;border:0;color:#acb4bf;font-size:27px}.dialog-mark{font-family:'Barlow Condensed',sans-serif;font-weight:800;color:var(--accent);font-style:italic;font-size:40px}.guide-rows{margin-top:26px}.guide-rows>div{display:grid;grid-template-columns:75px 1fr;gap:15px;padding:12px 0;border-top:1px solid #3a424c;font-size:13px;line-height:1.7}.guide-rows strong{font-weight:600}.guide-rows span{color:#b2bac5}.fineprint{font-size:12px!important}.source-link{font-size:13px;color:#ff9b7e;text-underline-offset:4px}.danger-button{border:0;background:none;color:#ff9b8d;padding:10px 0;font-size:14px}dialog hr{border:0;border-top:1px solid #454c55;margin:22px 0 6px}
@media(min-width:1600px){.workspace{grid-template-columns:88px minmax(0,1fr) 348px}.inspector #panel-content{padding:35px 29px}.topbar{height:90px}.workspace{height:calc(100dvh - 90px)}.stage-label{top:38px;left:40px}.mode-switch{left:40px}.stage-bottom{left:40px}}
@media(max-width:1100px){.workspace{grid-template-columns:70px minmax(0,1fr) 285px}.topbar{padding:0 18px;gap:20px}.project{padding-left:20px}.project input{max-width:165px}.toolrail button{width:54px}.inspector #panel-content{padding:25px 18px}.stage-label{left:22px}.mode-switch{left:22px}.stage-bottom{left:22px;right:18px;flex-direction:column;align-items:flex-start;gap:14px}.stage-note{gap:4px}.stage-actions{right:18px}.palette-grid{gap:8px}.quiet-button{padding:10px 6px}}
@media(max-width:760px){.topbar{height:67px;padding:0 14px;gap:15px}.brand>span{font-size:25px}.brand-sub{display:none}.brand>svg{width:28px;height:28px}.project{border:0;padding:0}.project input{font-size:13px;max-width:140px}.project>span{font-size:10px}.header-actions{gap:0}.header-actions>.icon-button,.separator,.quiet-button{display:none}.primary-button{font-size:12px;padding:10px;gap:7px}.primary-button span{display:none}.workspace{height:auto;min-height:calc(100dvh - 67px);grid-template-columns:1fr;grid-template-rows:48dvh auto auto}.stage{grid-row:1;min-height:340px}.toolrail{grid-row:2;flex-direction:row;padding:7px 16px;gap:10px;border-right:0;border-bottom:1px solid var(--border);justify-content:center}.toolrail button{width:auto;min-height:45px;flex:1;flex-direction:row;gap:8px;font-size:13px}.toolrail button svg{width:19px;height:19px}.toolrail button.active:before{display:none}.rail-spacer{display:none}.toolrail #help{flex:0;width:43px;padding:10px}.toolrail #help>span+span{display:none}.inspector{grid-row:3;border-left:0}.inspector #panel-content{padding:24px}.inspector-footer{display:none}.stage-label{top:20px;left:20px}.car-name{font-size:25px}.stage-label>span+span{font-size:11px}.stage-actions{top:18px;right:15px;gap:5px}.stage-button{width:31px;height:31px}.stage-button svg{width:17px}.mode-switch{top:84px;left:18px;padding:3px}.mode-switch button{font-size:11px;padding:7px 9px;gap:5px}.stage-bottom{bottom:16px;left:19px;right:15px;flex-direction:row;align-items:end}.stage-note{max-width:125px}.stage-note>span:first-child{font-size:11px}.stage-note>span+span{display:none}.camera-views{padding:3px;gap:0}.camera-views button{font-size:11px;padding:7px 8px}.palette-grid{grid-template-columns:repeat(8,1fr)}.swatch{height:30px;width:30px}.panel-title h1{font-size:24px}.panel-intro{margin-bottom:20px}.sticker-grid{grid-template-columns:repeat(4,1fr)}.field-label{margin-top:20px}.header-actions{margin-left:auto}.preset-row{max-width:100%}#toast{bottom:15px;max-width:90vw;width:max-content;text-align:center}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.mobile-only{display:none}@media(max-width:760px){.stage-actions .mobile-only{display:grid}.inspector-footer{display:flex;padding:18px 24px}.inspector-footer .mobile-only{display:block;margin-left:auto;padding:10px;font-size:13px;text-decoration:none}.stage-label>span+span{max-width:160px}.stage-actions{gap:4px}}

/* Reference-led team library and fixed placement packs. */
.team-reference{position:relative;margin:18px 0 14px;background:#e3e4e5;overflow:hidden;border-radius:8px}.team-reference>img{display:block;width:100%;aspect-ratio:16/9;object-fit:contain}.team-reference>span{position:absolute;bottom:8px;left:8px;padding:5px 7px;border-radius:4px;font-size:12px;background:#191c20df;color:white}.team-heading{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.team-heading h2{margin:0;font:600 28px 'Barlow Condensed',sans-serif}.team-heading>span{font-size:14px;color:#aeb3ba}.team-description{font-size:14px;line-height:1.55;margin:8px 0;color:#c5c8cd}.team-palette{display:flex;align-items:center;gap:5px;margin:15px 0}.team-palette>span{height:23px;width:23px;border-radius:50%;background:var(--color);border:1px solid #ffffff24}.team-palette small{margin-left:auto;font-size:12px;color:#aeb3ba}.team-apply{width:100%;justify-content:center;gap:8px;min-height:44px}.team-apply svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7}.team-secondary{display:grid;grid-template-columns:1fr 1fr;gap:8px}.team-secondary .wide-button{padding:10px}.reference-details{margin-top:20px;border-top:1px solid #ffffff15;padding-top:16px}.reference-details summary{font-size:14px;cursor:pointer}.reference-details summary>span{font-size:12px;color:#989fa8;margin-left:4px}.reference-gallery{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:14px 0}.reference-gallery img{display:block;width:100%;aspect-ratio:16/10;object-fit:contain;background:#dadddf;border-radius:4px}.reference-details ul{padding-left:18px;line-height:1.55;font-size:13px;color:#c2c6cc}.reference-details li{margin:8px 0}.reference-details .source-link{display:block;margin:10px 0;font-size:13px}.team-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.team-tile{padding:0 0 10px;overflow:hidden;text-align:left;border:1px solid #41464e;background:#23272d;border-radius:6px;color:#f4f4f5}.team-tile.selected{border-color:#ff7047;box-shadow:0 0 0 1px #ff7047}.team-tile img{display:block;width:100%;height:75px;object-fit:contain;background:#d7d9db;margin-bottom:8px}.team-tile strong,.team-tile small{display:block;padding:0 9px}.team-tile strong{font-size:14px}.team-tile small{font-size:12px;color:#aab0b9;margin-top:4px}.pack-heading{display:flex;flex-direction:column;gap:6px;margin:20px 0 14px}.pack-heading strong{font-size:16px}.pack-heading span{color:#aeb3ba;font-size:13px}.pack-list{margin:18px 0}.pack-sticker{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid #ffffff12;cursor:pointer}.pack-sticker input{width:17px;height:17px;accent-color:#ff7047;flex-shrink:0}.pack-sticker>span{display:flex;flex-direction:column;gap:5px;min-width:0}.pack-sticker strong{font-size:14px;font-weight:500}.pack-sticker small{font-size:12px;line-height:1.4;color:#aab0b9}.profile-note{margin-top:8px;margin-bottom:22px}.team-grid button:focus-visible,.pack-sticker:has(input:focus-visible){outline:2px solid #ff7047;outline-offset:3px}@media(max-width:760px){.team-reference>img{max-height:210px}.team-tile img{height:100px}.toolrail button{min-width:60px}.team-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:420px){.team-grid{grid-template-columns:1fr 1fr}}

.reference-angles{display:flex;gap:6px;overflow:auto;padding:8px 0 12px}.reference-angles button{flex:0 0 77px;border:1px solid var(--line,#3c4248);padding:3px;background:#23282d;color:#aeb5bd;border-radius:5px;cursor:pointer}.reference-angles button[aria-pressed="true"]{border-color:#ff7845;color:#fff}.reference-angles img{display:block;width:100%;height:43px;object-fit:contain;background:#121416}.reference-angles span{display:block;font-size:9px;line-height:1.3;margin-top:3px;max-height:25px;overflow:hidden}
