.colors-dialog { width: min(940px, calc(100vw - 32px)); }
.colors-form { grid-template-columns: 1fr 2fr 1fr 80px 90px; margin: 18px 0 12px; align-items: end; }
.colors-form input[type="color"] { height: 44px; padding: 4px; cursor: pointer; }
.colors-actions { grid-column: 1 / -1; display: flex; gap: 10px; }
.colors-actions .auth-submit { width: auto; }
.colors-actions button, .colors-toolbar button, .colors-table button { padding: 8px 12px; border: 1px solid var(--line); border-radius: 6px; font-weight: 700; }
.colors-dialog button:disabled { opacity: .55; cursor: wait; }
.colors-toolbar { display: flex; align-items: center; justify-content: space-between; margin: 12px 0; font-size: 13px; }
.colors-table-wrap { overflow: auto; max-height: 42vh; border: 1px solid var(--line); border-radius: 8px; }
.colors-table { width: 100%; border-collapse: collapse; font-size: 13px; text-align: left; }
.colors-table th { position: sticky; top: 0; background: var(--surface-soft); z-index: 1; }
.colors-table th, .colors-table td { padding: 8px; border-bottom: 1px solid var(--line); }
.colors-table td:nth-child(3) { overflow-wrap: anywhere; }
.colors-table td:last-child { white-space: nowrap; }
.colors-table button + button { margin-left: 6px; color: var(--red); }
.colors-swatch { display: block; width: 28px; height: 28px; border: 1px solid var(--line); border-radius: 5px; }
@media (max-width: 700px) { .colors-form { grid-template-columns: 1fr 1fr; } .colors-dialog { padding: 20px; } }

.rotations-form { grid-template-columns: 1fr 2fr; margin: 18px 0 12px; }
.rotations-fieldset { grid-column: 1 / -1; min-width: 0; border: 1px solid var(--line); border-radius: 8px; padding: 12px; }
.rotations-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.rotations-grid label { font-size: 11px; }
.rotations-grid select { width: 100%; padding: 8px; background: var(--surface-solid); color: var(--ink); border: 1px solid var(--line); border-radius: 6px; }
.rotations-preview { display: grid; grid-template-columns: repeat(4, 34px); gap: 3px; text-align: center; }
.rotations-preview span { padding: 3px; background: var(--surface-soft); border-radius: 3px; }
@media (max-width: 480px) { .rotations-form { grid-template-columns: 1fr; } .rotations-grid { gap: 4px; } }

.categories-form { grid-template-columns: 1fr 2fr 100px; margin: 18px 0 12px; align-items: end; }
.projects-form { grid-template-columns: 1fr 1fr; }
.projects-form select { width: 100%; padding: 11px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); font: inherit; }
#projectsList td:nth-child(4) { white-space: pre-wrap; overflow-wrap: anywhere; }
.categories-description { grid-column: 1 / -1; }
.categories-form textarea { width: 100%; padding: 11px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); font: inherit; resize: vertical; }
.categories-form textarea:focus { outline: 2px solid var(--teal); outline-offset: 2px; }
@media (max-width: 700px) { .categories-form { grid-template-columns: 1fr; } }

.products-form { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.products-form select { width: 100%; padding: 11px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); font: inherit; }
@media (max-width: 700px) { .products-form { grid-template-columns: 1fr; } }

.colors-dialog [hidden] { display: none !important; }
.maintainer-toolbar-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.maintainer-toolbar-actions .auth-submit { width: auto; }
.colors-table button + button { color: inherit; }
.colors-table button.action-delete { color: var(--red); }
.colors-dialog h3 { margin: 18px 0 8px; font-weight: 800; }
@media (max-width: 480px) { .colors-toolbar { align-items: flex-start; gap: 10px; flex-wrap: wrap; } }

.users-form { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 18px 0 12px; }
.users-form select { width: 100%; padding: 11px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); font: inherit; }
@media (max-width: 700px) { .users-form { grid-template-columns: 1fr; } }
#usersListing .colors-table { min-width: 760px; }

.product-separations h4 { margin: 0; }
.product-separations .colors-table-wrap { margin-top: 12px; }
.product-separations .colors-table { min-width: 560px; }
.product-separations input[type="number"] { width: 90px; }
.product-separations input[type="file"] { max-width: 260px; padding: 8px 0; }
.product-separations td:last-child label { display: inline-flex; flex-direction: column; font-size: 12px; }
.separation-preview { width: 64px; height: 64px; object-fit: contain; background-color: #fff; background-image: conic-gradient(#ddd 25%, transparent 0 50%, #ddd 0 75%, transparent 0); background-size: 16px 16px; border: 1px solid var(--line); }

.designs-form { margin-top: 18px; }
.designs-form select, .designs-toolbar select { width: 100%; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-solid); color: var(--ink); font: inherit; }
.designs-choices, .designs-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.designs-grid { max-height: 60vh; overflow: auto; padding: 4px; }
.design-card { border: 1px solid var(--line); border-radius: 8px; padding: 14px; overflow-wrap: anywhere; }
.design-card h3 { margin-top: 0; }
.design-choice { display: flex; align-items: center; gap: 16px; }
.design-choice input[type="checkbox"] { width: 24px; height: 24px; flex: none; accent-color: var(--teal); }
.design-preview { display: block; width: 180px; max-width: 100%; aspect-ratio: 1; object-fit: contain; border: 1px solid var(--line); }
.design-card p { font-size: 13px; }
.design-card .colors-actions { flex-wrap: wrap; margin-top: 12px; }
.designs-editor { display: flex; align-items: start; gap: 20px; }
.designs-colors { display: flex; gap: 12px; flex-wrap: wrap; }
.designs-colors label { display: flex; flex-direction: column; gap: 6px; font-size: 12px; }
.designs-colors input[type="color"] { width: 64px; height: 42px; padding: 3px; }
@media (max-width: 700px) { .designs-choices, .designs-grid { grid-template-columns: 1fr; } .designs-editor { flex-wrap: wrap; } }
.auth-form .design-choice { display: flex; flex-direction: row; gap: 16px; }
#developmentTicketsForm textarea { width: 100%; padding: 11px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); font: inherit; resize: vertical; }
#developmentTicketsForm .ticket-switch { display: flex; align-items: center; justify-content: flex-start; gap: 10px; }
.ticket-switch input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.ticket-switch-control { position: relative; width: 44px; height: 24px; border-radius: 999px; background: var(--line); transition: background .2s; }
.ticket-switch-control::after { content: ''; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: var(--surface-solid); transition: transform .2s; }
.ticket-switch input:checked + .ticket-switch-control { background: var(--teal); }
.ticket-switch input:checked + .ticket-switch-control::after { transform: translateX(20px); }
.ticket-switch input:focus-visible + .ticket-switch-control { outline: 2px solid var(--teal); outline-offset: 2px; }