:root {
    --field-background: var(--surface);
    --field-ink: var(--ink);
    --field-border: var(--line-strong);
    --field-hover: var(--muted);
    --field-focus: var(--primary);
    --field-ring: color-mix(in srgb, var(--primary) 18%, transparent);
}

:root body :is(input:not([type="checkbox"], [type="radio"], [type="range"], [type="color"], [type="file"], [type="hidden"], [type="button"], [type="submit"], [type="reset"], [type="image"]), select, textarea):not(:where(.search-field input, .conversation-list .rail-search input, .adventure-search input, .story-tags__box input, .atelier-personalized textarea.manuscript)) {
    background-color: var(--field-background);
    color: var(--field-ink);
    border-color: var(--field-border);
    transition: border-color 150ms ease, box-shadow 150ms ease;
    &:hover:not(:disabled):not(:focus) { border-color: var(--field-hover); }
    &:focus {
        border-color: var(--field-focus);
        outline: 2px solid var(--field-focus);
        outline-offset: -2px;
        box-shadow: 0 0 0 3px var(--field-ring);
    }
    &::placeholder { color: var(--muted); opacity: 1; }
    &:disabled { background-color: var(--surface-soft); color: var(--muted); cursor: not-allowed; }
    &[aria-invalid="true"] { border-color: var(--error); }
}

:root body :is(.search-field, .conversation-list .rail-search, .adventure-search label:has(input)) {
    background-color: var(--field-background);
    border-color: var(--field-border);
    transition: border-color 150ms ease, box-shadow 150ms ease;
    &:hover { border-color: var(--field-hover); }
    &:focus-within {
        border-color: var(--field-focus);
        box-shadow: 0 0 0 3px var(--field-ring);
        outline: 2px solid var(--field-focus);
        outline-offset: -2px;
    }
    & input { background: transparent; color: var(--field-ink); outline: none; box-shadow: none; }
}

@media (prefers-reduced-motion: reduce) {
    :root body :is(input, select, textarea, .search-field, .rail-search, .adventure-search label) { transition: none; }
}