/* Setup tab. Every class starts with kst-. */
.kst-root .kit-form .kit-field select, .kst-root .kit-form .kit-field textarea { width: 100%; }
.kst-root .kit-form .kit-row > label { flex: 1 1 200px; }
.kst-status { min-height: 1.4em; }
.kst-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 16px; }
.kst-bar-text { font: 600 14px var(--spi-ui, Arial, sans-serif); }
.kst-bar .kit-actions { margin: 0; }
.kst-bar .kit-btn, .kst-re-row .kit-btn { min-height: 40px; }
.kst-place { display: inline-flex; align-items: center; gap: 6px; font: 600 13px var(--spi-ui, Arial, sans-serif); }
.kst-hexin { box-sizing: border-box; width: 5.5em; min-height: 40px; padding: 4px 8px; font: 15px ui-monospace, Menlo, Consolas, monospace; border: 1px solid var(--k-rule); border-radius: 4px; background: #fff; color: var(--k-ink); }
.kst-hexin[aria-invalid=true], .kst-re-row input[aria-invalid=true] { border-color: #8a1f11; background: #fbeeeb; }

.kst-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; align-items: start; }
@media (min-width: 1000px) { .kst-layout { grid-template-columns: 320px minmax(0, 1fr); } .kst-tray { position: sticky; top: 8px; max-height: calc(100vh - 16px); overflow-y: auto; } }

.kst-tally { margin: 0 0 8px; font: 700 14px var(--spi-ui, Arial, sans-serif); }
.kst-tally-open { color: #8a1f11; }
.kst-tray-side h3 { display: flex; align-items: center; margin: 12px 0 6px; }
.kst-tray-list { display: flex; flex-direction: column; gap: 6px; }
.kst-tray-item { display: flex; align-items: center; gap: 10px; width: 100%; box-sizing: border-box; min-height: 56px; padding: 4px 8px; text-align: left; font: 14px var(--spi-ui, Arial, sans-serif); color: var(--k-ink); background: var(--k-panel); border: 1px solid var(--k-rule); border-radius: 6px; cursor: grab; user-select: none; -webkit-user-select: none; touch-action: pan-y; }
.kst-tray-item.kst-state-none { border: 2px dashed #b4571b; background: #fff4e0; }
.kst-tray-item.kst-state-none .kst-state { color: #8a3a0a; font-weight: 700; }
.kst-tray-item.kst-state-setup, .kst-tray-item.kst-state-reinforcement { opacity: .88; }
.kst-tray-item.kst-selected, .kst-tray-item[aria-pressed=true] { border-color: var(--k-teal); box-shadow: 0 0 0 3px var(--k-teal); opacity: 1; }
.kst-tray-item:focus-visible { outline: 3px solid var(--k-teal); outline-offset: 2px; }
.kst-thumb { flex: 0 0 48px; width: 48px; height: 48px; line-height: 0; touch-action: none; }
.kst-thumb svg { width: 48px; height: 48px; pointer-events: none; }
.kst-tray-text { display: flex; flex-direction: column; min-width: 0; }
.kst-tray-text strong { overflow-wrap: anywhere; }
.kst-state { color: var(--k-muted); font-size: 12px; }

.kst-map { line-height: 0; user-select: none; -webkit-user-select: none; border-radius: 4px; }
.kst-map:focus-visible { outline: 3px solid var(--k-teal); outline-offset: 3px; }
.kst-map svg.kit-map { width: 100%; height: auto; display: block; }
.kst-map.kst-picking { cursor: crosshair; outline: 3px dashed var(--k-teal); outline-offset: 3px; }
.kst-piece { cursor: grab; touch-action: none; }
.kst-piece.kst-dragging { opacity: .35; }
.kst-readout { min-height: 1.4em; margin: 8px 0 0; line-height: 1.4; }
.kst-ghost { position: fixed; left: 0; top: 0; width: 56px; height: 56px; z-index: 1000; pointer-events: none; opacity: .92; filter: drop-shadow(0 3px 5px rgba(0,0,0,.4)); line-height: 0; }
.kst-ghost svg { width: 56px; height: 56px; }

.kst-re-row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 12px; padding: 8px 0; border-bottom: 1px solid var(--k-field); }
.kst-re-field { display: block; font: 600 13px var(--spi-ui, Arial, sans-serif); }
.kst-re-field select, .kst-re-field input { display: block; box-sizing: border-box; min-height: 40px; margin-top: 4px; padding: 4px 8px; font: 14px var(--spi-ui, Arial, sans-serif); border: 1px solid var(--k-rule); border-radius: 4px; background: #fff; color: var(--k-ink); }
.kst-re-field input[type=number] { width: 5em; }
.kst-re-field input[data-kst=re-hex] { width: 5.5em; font-family: ui-monospace, Menlo, Consolas, monospace; }
.kst-re-field select { max-width: 16em; }
.kst-error { flex-basis: 100%; color: #8a1f11; font: 600 13px var(--spi-ui, Arial, sans-serif); }
.kst-error:empty { display: none; }