main{height:calc(100dvh - 82px);min-height:500px}#controls-panel{order:0;width:300px;padding:17px;overflow-y:auto;border-right:1px solid #343c49}.preview{order:1}#library-panel{order:2;width:280px;padding:17px;overflow:hidden;border-left:1px solid #343c49}#controls-panel .row{min-height:37px;font-size:11px;gap:7px}#controls-panel .picked-color{max-width:65px;font-size:9px}#controls-panel input[type=color]{width:39px;height:26px}#autosave-status{margin:0 0 16px}.swatch-library{height:100%;margin:0;padding:0;border:0;display:flex;flex-direction:column;min-height:0}.swatch-library>.note{margin:7px 0}.swatch-library .section-head{margin-bottom:0}.swatch-library .library-label{margin-top:10px}.swatch-library .swatch-grid{flex:1;min-height:130px;max-height:none;overflow-y:scroll;grid-auto-rows:min-content;scrollbar-gutter:stable;overscroll-behavior:contain}.named-swatch{min-height:36px;padding:5px;font-size:10px}.swatch-chip{height:23px;width:23px}.library-downloads{margin:12px 0 0}.library-downloads[open]{max-height:170px;overflow:auto}.library-downloads summary{font-size:11px}.swatch-library .note{font-size:10px;line-height:1.4}#swatch-status:empty,#factory-status:empty{display:none}.swatch-library select{font-size:11px}#apply-colorway{margin-top:7px}.export-controls{padding-top:17px;margin-top:17px;border-top:1px solid #465165}.export-controls h2{margin-bottom:10px}.export-controls label{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:10px 0;font-size:11px}.export-controls select{max-width:155px;background:#202937;color:#eef2f7;border:1px solid #465165;border-radius:5px;padding:7px;font:11px Arial}.export-controls button{width:100%;margin-top:5px;background:#edb257;color:#18202c;font-weight:bold}.export-controls .note{font-size:10px}.export-controls button:disabled{opacity:.6;cursor:wait}aside,.swatch-grid{scrollbar-width:thin;scrollbar-color:#718096 #202937}aside::-webkit-scrollbar,.swatch-grid::-webkit-scrollbar{width:5px}aside::-webkit-scrollbar-track,.swatch-grid::-webkit-scrollbar-track{background:#202937}aside::-webkit-scrollbar-thumb,.swatch-grid::-webkit-scrollbar-thumb{background:#718096;border-radius:5px}#controls-panel>details{margin-top:18px}
@media(min-width:901px) and (max-width:1150px){#controls-panel{width:265px;padding:13px}#library-panel{width:250px;padding:13px}#controls-panel .picked-color{max-width:50px}}
@media(max-width:900px){body{overflow:auto}main{height:auto;display:flex;flex-direction:column;min-height:0}.preview{order:0;height:65vh;min-height:420px;flex:none}#controls-panel{order:1;width:100%;overflow:visible;padding:20px;border:0}#library-panel{order:2;width:100%;height:740px;padding:20px;border:0;border-top:1px solid #343c49}#colors{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.swatch-grid{grid-template-columns:repeat(3,1fr)}.named-swatch{display:flex;font-size:11px}.swatch-chip{display:block;width:25px;height:25px;margin:0}.export-controls{max-width:450px}#controls-panel .picked-color{max-width:90px}}
@media(max-width:540px){#colors{grid-template-columns:1fr}header{height:76px}.swatch-grid{grid-template-columns:repeat(2,1fr)}}

.model-selector{padding:14px 0;border-bottom:1px solid #354150;margin-bottom:12px}.model-selector label{display:block;font-weight:700;margin-bottom:8px}.model-selector select{width:100%;padding:10px;border-radius:5px;background:#202b38;color:#fff;border:1px solid #4b5b6e;font:inherit}.model-selector .note{line-height:1.5;margin-bottom:0}