/* Component styles sit above legacy layout layers; geometry stays with each tool. */
.ui-input,.ui-textarea,.ui-select,.ui-select-trigger {
  width:100%;min-width:0;min-height:var(--control-height);padding:var(--control-padding-y) var(--control-padding-x);
  border:var(--border-width) solid var(--control-border);border-radius:var(--control-radius);
  background:var(--control-bg);color:var(--color-text);font-family:var(--font-sans);font-size:var(--font-size-sm);line-height:var(--line-height-control);
  transition:border-color var(--duration-fast),box-shadow var(--duration-fast),background var(--duration-fast);
}
.ui-input[data-ui-number]{font-variant-numeric:tabular-nums;letter-spacing:var(--tracking-numeric)}
.ui-input:hover:not(:disabled),.ui-textarea:hover:not(:disabled),.ui-select-trigger:hover:not(:disabled){border-color:var(--control-border-hover)}
.ui-input:focus-visible,.ui-textarea:focus-visible,.ui-select:focus-visible,.ui-select-trigger:focus-visible {
  outline:var(--focus-width) solid var(--color-focus);outline-offset:var(--focus-offset);border-color:var(--color-focus);box-shadow:var(--shadow-focus);
}
.ui-input:disabled,.ui-textarea:disabled,.ui-select:disabled,.ui-select-trigger:disabled {background:var(--color-surface-disabled);color:var(--color-text-muted);cursor:not-allowed;opacity:var(--opacity-disabled)}
.ui-input[aria-invalid="true"],.ui-textarea[aria-invalid="true"],.ui-select-trigger[aria-invalid="true"]{border-color:var(--color-danger)}
.ui-input[readonly],.ui-textarea[readonly]{background:var(--color-surface-subtle)}
.ui-textarea{display:block;resize:vertical;line-height:var(--line-height-body);padding:var(--space-4)}
.ui-field{display:flex;flex-direction:column;gap:var(--space-2);min-width:0;font-size:var(--font-size-xs);line-height:var(--line-height-body);color:var(--color-text);font-weight:var(--font-weight-medium)}
.ui-field>span:first-child,.ui-field>label{display:block}
.ui-field>.ui-hint{margin:0;font-weight:var(--font-weight-normal)}
.ui-select-wrap{position:relative;display:block;min-width:0;max-width:100%;width:100%;font-weight:var(--font-weight-normal)}
select.ui-select-source {position:absolute!important;inset:0 auto auto 0!important;width:1px!important;height:1px!important;min-height:0!important;padding:0!important;margin:0!important;border:0!important;clip-path:inset(50%);overflow:hidden;white-space:nowrap}
.ui-select-trigger{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);text-align:left;cursor:pointer;font-weight:var(--font-weight-normal)}
.ui-select-value{display:block;min-width:0;overflow-wrap:anywhere;white-space:normal;word-break:keep-all}
.ui-select-chevron{width:var(--size-chevron);height:var(--size-chevron);border-right:var(--border-width-strong) solid currentColor;border-bottom:var(--border-width-strong) solid currentColor;transform:translateY(-25%) rotate(45deg);flex-shrink:0;opacity:var(--opacity-icon)}
.ui-select-trigger[aria-expanded="true"]{border-color:var(--color-focus);box-shadow:var(--shadow-focus)}
.ui-select-trigger[aria-expanded="true"] .ui-select-chevron{transform:translateY(25%) rotate(225deg)}
.ui-select-list{position:fixed;inset:auto;margin:0;padding:var(--space-1);border:var(--border-width) solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text);box-shadow:var(--shadow-popover);overflow-y:auto;overscroll-behavior:contain;font-family:var(--font-sans);font-size:var(--font-size-sm);line-height:var(--line-height-control);box-sizing:border-box}
.ui-select-option{position:relative;display:flex;align-items:center;min-height:var(--control-height);padding:var(--space-3) var(--space-8) var(--space-3) var(--space-3);border-radius:var(--radius-sm);cursor:pointer;white-space:normal;overflow-wrap:anywhere;word-break:keep-all}
.ui-select-option:hover,.ui-select-option.is-active{background:var(--color-surface-hover)}
.ui-select-option[aria-selected="true"]{background:var(--color-accent-subtle);color:var(--color-accent-text);font-weight:var(--font-weight-semibold)}
.ui-select-option[aria-selected="true"]::after{content:'✓';position:absolute;right:var(--space-3);font-size:var(--font-size-base)}
.ui-select-option[aria-disabled="true"]{color:var(--color-text-muted);opacity:var(--opacity-disabled);cursor:not-allowed}
.ui-button {display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:var(--control-height);padding:var(--space-3) var(--space-5);border:var(--border-width) solid transparent;border-radius:var(--button-radius);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);line-height:var(--line-height-control);text-decoration:none;transition:background var(--duration-fast),border-color var(--duration-fast)}
.ui-button--primary{background:var(--button-primary-bg);color:var(--button-primary-text);border-color:var(--button-primary-bg)}
.ui-button--primary:hover:not(:disabled){background:var(--color-text-hover);color:var(--button-primary-text)}
.ui-button--secondary{background:var(--color-surface);border-color:var(--color-border);color:var(--color-text)}
.ui-button--secondary:hover:not(:disabled){border-color:var(--control-border-hover);background:var(--color-surface-subtle)}
.ui-button--ghost{color:var(--color-text-muted);background:transparent}
.ui-button--ghost:hover:not(:disabled){background:var(--color-surface-hover);color:var(--color-text)}
.ui-button:disabled{opacity:var(--opacity-disabled);cursor:not-allowed}
.workspace-heading{gap:var(--space-4)}
.workspace-heading>h2{min-width:0}
.workspace-heading>.ui-button{flex-shrink:0;white-space:nowrap}
.ui-button:focus-visible,.ui-choice:focus-visible{outline:var(--focus-width) solid var(--color-focus);outline-offset:var(--focus-offset)}
.ui-choice{accent-color:var(--color-accent);width:var(--size-choice);height:var(--size-choice);min-height:0;padding:0;flex-shrink:0}
.ui-file{display:block;width:100%;min-width:0;min-height:var(--control-height);padding:var(--space-2);border:var(--border-width) dashed var(--control-border);border-radius:var(--control-radius);background:var(--color-surface-subtle);color:var(--color-text-muted);font-family:var(--font-sans);font-size:var(--font-size-xs);line-height:var(--line-height-control);cursor:pointer}
.ui-file::file-selector-button{margin-right:var(--space-3);padding:var(--space-2) var(--space-3);border:var(--border-width) solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text);font:inherit;font-weight:var(--font-weight-semibold);cursor:pointer}
.ui-file:hover:not(:disabled){border-color:var(--control-border-hover)}
.ui-file:hover:not(:disabled)::file-selector-button{background:var(--color-surface-hover)}
.ui-range{width:100%;min-width:0;min-height:var(--size-44);accent-color:var(--color-accent);padding:0;cursor:pointer}
.ui-color{width:100%;min-width:0;min-height:var(--control-height);padding:var(--space-2);border:var(--border-width) solid var(--control-border);border-radius:var(--control-radius);background:var(--color-surface);cursor:pointer}
.ui-file:focus-visible,.ui-range:focus-visible,.ui-color:focus-visible{outline:var(--focus-width) solid var(--color-focus);outline-offset:var(--focus-offset)}
.ui-file:disabled,.ui-range:disabled,.ui-color:disabled{opacity:var(--opacity-disabled);cursor:not-allowed}
.ui-table-wrap{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain}
.ui-hint{font-size:var(--font-size-xs);line-height:var(--line-height-body);color:var(--color-text-muted);margin-top:var(--space-2)}
.ui-alert {padding:var(--space-3) var(--space-4);border:var(--border-width) solid var(--color-danger-border);border-radius:var(--radius-sm);font-size:var(--font-size-sm);line-height:var(--line-height-body)}
.ui-alert--error{color:var(--color-danger);background:var(--color-danger-subtle)}
.ui-card{min-width:0;border:var(--border-width) solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-subtle);padding:var(--space-4)}
.ui-result{margin-top:var(--space-6);padding:var(--space-5);border:var(--border-width) solid var(--color-result-border);border-radius:var(--radius-md);background:var(--color-result-bg);overflow-wrap:anywhere}
.ui-table{border-collapse:collapse;width:100%;font-size:var(--font-size-xs);text-align:left}
.ui-table th,.ui-table td{padding:var(--space-3);border-bottom:var(--border-width) solid var(--color-result-border);vertical-align:top;font-variant-numeric:tabular-nums}
.ui-table th{font-weight:var(--font-weight-semibold)}
.json-actions>label:has(.ui-select-wrap){display:flex;align-items:center;gap:var(--space-2)}
.json-actions>label>.ui-select-wrap{width:auto;min-width:var(--size-inline-select)}
@media(max-width:760px){.ui-input,.ui-textarea,.ui-select,.ui-select-trigger{font-size:var(--font-size-base)}.ui-result{padding:var(--space-4)}}
@media(prefers-reduced-motion:reduce){.ui-input,.ui-textarea,.ui-select-trigger,.ui-button{transition:none}}
