.color-studio{flex:0 0 100%;width:100%;min-width:0;border:1px solid #e0e7eb;background:#fff;border-radius:18px;padding:16px;color:#294c69}.color-studio header{display:flex;justify-content:space-between;align-items:center;gap:12px}.color-studio header strong{font-size:17px}.color-studio button{min-height:44px;border-radius:10px;padding:8px 12px;touch-action:manipulation}.color-studio header button{border:1px solid #e0e7eb;background:#f8fafb;font-size:13px}.color-studio-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:4px;margin:14px 0;background:#edf2f4;border-radius:22px}.color-studio-tabs button{border-radius:18px;font-size:13px;padding:6px}.color-studio-tabs [aria-selected=true]{background:#fff;color:#087b86;box-shadow:0 2px 5px #294c6910}.color-studio-swatches{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:4px;align-items:center}.studio-swatch{position:relative;display:grid;place-items:center;min-width:36px;min-height:44px;width:100%;height:44px;padding:0!important;background:transparent;color:white;font-size:18px;font-weight:700;text-shadow:0 1px 3px #000;isolation:isolate}.studio-swatch:before{content:'';position:absolute;width:28px;height:28px;background:var(--swatch);border:1px solid #16394b25;border-radius:50%;z-index:-1}.studio-swatch[aria-pressed=true]:before{outline:2px solid #078e9b;outline-offset:3px}.studio-add{color:#477182;text-shadow:none;font-size:24px}.studio-add:before{background:white;border:1px dashed #8eaab8}.color-studio [data-pane]{min-width:0}.color-studio [data-pane=history]>button,.color-studio [data-pane=custom]>button{width:100%;border:1px solid #c8dfe4;background:#f2f9fa;margin-top:10px}.studio-custom-label{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0;font-size:13px}.studio-custom-label input[type=text]{width:130px;height:44px;border:1px solid #cddde4;border-radius:9px;padding:8px}.studio-custom-label input[type=color]{width:62px;height:44px;border:0;background:transparent}.studio-custom-label [aria-invalid=true]{border-color:#c74444}.studio-tones{display:grid;gap:12px;margin-top:14px}.studio-tones label{display:grid;gap:6px;font-size:12px}.studio-tones input[type=range]{width:100%;min-height:36px}.studio-fill{margin-top:18px;padding-top:12px;border-top:1px solid #e2eaee}.studio-fill>label{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;font-size:14px}.studio-fill input[type=checkbox]{width:24px;height:24px;accent-color:#078e9b}.studio-fill input[type=range]{width:100%;height:44px;accent-color:#078e9b}.studio-fill-preview{display:block;width:100%;height:60px;border:1px solid #e4ecef;border-radius:12px;background:repeating-conic-gradient(#f2f5f6 0 25%,white 0 50%) 0/16px 16px}.color-studio-status,.color-edit-hint{font-size:12px;line-height:1.5;margin:10px 0 0;color:#617b8a}.color-studio-status:empty{display:none}.color-studio button:focus-visible{outline:3px solid #079da9;outline-offset:2px}
.shape-studio #shape-color-button{width:44px;height:44px;display:grid;place-items:center;border:1px solid #dbe4e9;background:#fff;border-radius:12px;padding:7px}#shape-color-button span{width:28px;height:28px;border-radius:50%;background:var(--active-ink,#17191d);border:1px solid #193f5929}.shape-studio>.color-studio{max-width:500px;margin-left:auto}.pen-quick-strip{display:flex;align-items:center;gap:4px;flex:0 0 100%;padding:5px;border:1px solid #dfe8ec;background:#f8fbfc;border-radius:14px}.pen-quick-strip>button{flex:1;min-width:32px;min-height:44px;border-radius:10px;padding:7px}.pen-quick-strip>button[data-quick-width]{display:flex;align-items:center;justify-content:center}.pen-quick-strip>button>span{display:block;width:24px;border-radius:8px;background:currentColor}.pen-quick-strip [aria-pressed=true]{background:#dceff1;color:#087d87}.pen-color-controls>.color-studio{padding:12px}.pen-color-controls .color-studio-swatches{grid-template-columns:repeat(6,minmax(0,1fr))}
@media(max-width:480px){.color-studio{padding:12px}.color-studio-swatches{grid-template-columns:repeat(6,minmax(0,1fr))}.color-studio-tabs button{font-size:12px}}