/* Fifteen illustrative automotive shades and five finish studies. All controls remain usable by touch. */
.shade-panel{display:flex;flex-direction:column;gap:0}.shade-panel>*{max-width:100%}
.shade-panel>.eyebrow{margin-bottom:18px}.shade-heading h3{font-size:29px;line-height:1.2}
.finish{justify-self:auto;margin:15px 0;max-width:none;flex-shrink:0}
.finish-control{display:block;font-size:10px;letter-spacing:1.1px;margin:0 0 12px}
.finish-control select{display:block;width:100%;margin-top:9px;background:#111f24;color:#f2f0e9;border:1px solid #ffffff35;padding:10px 12px;font-size:14px;min-height:44px}
.palette-count{font-size:9px;letter-spacing:.8px;color:#b2c4ba;margin:8px 0 10px}
.swatches{display:grid;grid-template-columns:repeat(5,44px);justify-content:start;gap:9px 10px;margin:0 0 14px}
.swatch{width:44px;height:44px}.swatch:focus-visible{outline:2px solid #f2d9a2;outline-offset:4px}

.views{padding:16px 0;display:flex;flex-wrap:wrap;gap:5px;margin:0}.views button{flex:1;font-size:11px}
.studio-enquiry{margin:0;padding-top:16px}.disclaimer{font-size:11px;line-height:1.65;margin:14px 0 0}
@media(min-width:901px){.studio{grid-template-columns:minmax(0,1fr) 330px}.studio-stage{display:flex;flex-direction:column;min-width:0}#viewport{height:auto;min-height:470px;flex:1}.studio-toolbar{flex-shrink:0}.shade-panel{padding:28px 25px}}
@media(max-width:900px){.shade-panel{display:block}.shade-heading h3{font-size:30px}.swatches{grid-template-columns:repeat(auto-fit,44px);gap:12px}.finish-control{max-width:400px}.views{max-width:420px}.disclaimer{max-width:600px}.studio-enquiry{display:flex;max-width:400px}}
@media(max-width:600px){.swatches{grid-template-columns:repeat(5,44px);gap:11px}.finish-control select{font-size:16px}.shade-panel{padding:25px 21px}.views button{font-size:12px}.disclaimer{font-size:12px}}
@media(max-width:350px){.swatches{gap:8px}.shade-panel{padding-inline:14px}}