diff --git a/CHANGELOG.md b/CHANGELOG.md
index 23b0949e..fd724d88 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -9,6 +9,7 @@
 - [add] `switch--s` for an 18px-tall switch.
 - [breaking] Remove `switch--s-label`. Switches now center on their label.
 - [add] Respect `prefers-reduced-motion: reduce` by making transitions instant.
+- [breaking] Focus states use `:focus-visible` with a `--focus-outline` outline, replacing `--focus-shadow`. `assembly.js` focus control only affects selects.
 - [internal] Assembly utilities are UnoCSS rules in `src/preset/`. Reset and component CSS live in `src/preset/base.css`. The package build is `src/build-*.js`. The documentation site is VitePress under `docs/`.
 - [add] `building`, `clip`, `truck` icons
 
diff --git a/MIGRATION_GUIDES.md b/MIGRATION_GUIDES.md
index be1cca86..1cf7713e 100644
--- a/MIGRATION_GUIDES.md
+++ b/MIGRATION_GUIDES.md
@@ -10,6 +10,8 @@ What can change:
 
 - The contents of `assembly.css` are generated by UnoCSS, so whitespace, comments, rule order, and source maps may differ from 1.x. Selectors and declarations for public classes stay the same, except for [switches](#switches).
 - Layout-scale media variants (`px12-mm`, `w-1/2-ml`, and so on) now use the same custom media queries you pass to `buildUserAssets`, instead of the hardcoded default breakpoints.
+- Focus states use the CSS `:focus-visible` pseudo-class, so the browser decides when to show them. `assembly.js` focus control and `Assembly.setFocusState` now only affect selects. Text inputs and textareas don't get an outline; they keep their darker border color on focus.
+- Focused elements get a `2px solid var(--blue)` outline instead of a box-shadow. The `--focus-shadow` variable is replaced by `--focus-outline`; if you passed `--focus-shadow` to `buildUserAssets`, pass an `outline` value as `--focus-outline` instead.
 - `@mapbox/assembly` now depends on `@unocss/core` (used when creating custom builds).
 - When the user prefers reduced motion, transitions on every element, including your own, finish instantly.
 
diff --git a/docs/index.md b/docs/index.md
index a6bc0e9b..b6e1ae39 100644
--- a/docs/index.md
+++ b/docs/index.md
@@ -199,7 +199,7 @@ title: Assembly.css
   <div>
     <h3 class="txt-bold">Focus outlines as needed</h3>
     <p class="mt12">
-      Assembly turns off focus outlines when you mousedown and turns them back on, universally, when you hit <kbd class="txt-kbd">Tab</kbd>. This means that only the keyboard users who need them will see nice, prominent focus outlines, while mouse users won't have the design disturbed unnecessarily.
+      Assembly uses <code class="txt-code">:focus-visible</code> to draw a prominent focus outline when you navigate with <kbd class="txt-kbd">Tab</kbd>. Mouse users won't have the design disturbed unnecessarily, and text inputs and textareas show focus with a darker border instead.
     </p>
   </div>
 </div>
@@ -211,7 +211,7 @@ title: Assembly.css
 
 <h3 class="mt60 mb12 txt-bold">Focus state</h3>
 <p class="mb24">
-  <code class="txt-code">assembly.js</code> adds event listeners that show and hide focus states depending on whether the user is navigating with a keyboard or with a pointer device. If focus state is on, an outline appears around focused elements. If focus state is off, no outline appears. The Javascript API allows you to programmatically override this focus state.
+  Browsers show an outline on a select when it's clicked, as well as when it's reached with <kbd class="txt-kbd">Tab</kbd>. <code class="txt-code">assembly.js</code> adds event listeners that track whether the user is navigating with a keyboard or with a pointer device, and only outlines a focused select when focus state is on. The Javascript API allows you to programmatically override this focus state.
 </p>
 <h3 class="mb12 mt24 txt-bold">
   <code class="txt-code">Assembly.setFocusState(enable?: boolean): void</code>
diff --git a/src/preset/base.css b/src/preset/base.css
index 45dbc8a6..250ec5b7 100644
--- a/src/preset/base.css
+++ b/src/preset/base.css
@@ -207,48 +207,26 @@ legend {
     transition-duration: 0.01ms !important;
   }
 }
-[data-assembly-focus-control] *:focus {
-  outline: 0;
-}
-[data-assembly-focus-control='visible'] *:focus {
-  box-shadow: var(--focus-shadow);
-  transition: box-shadow var(--transition);
-}
-[data-assembly-focus-control='visible'] input:focus + .checkbox,
-[data-assembly-focus-control='visible'] input:focus + .radio,
-[data-assembly-focus-control='visible'] .switch-container:has(> input:focus) .switch,
-[data-assembly-focus-control='visible'] input:focus + .toggle {
-  box-shadow: var(--focus-shadow);
-}
-[data-assembly-focus-control='visible'] .range input[type='range'] {
-  box-shadow: none;
-}
-[data-assembly-focus-control='visible']
-  .range
-  input[type='range']:focus::-webkit-slider-thumb {
-  box-shadow: var(--focus-shadow);
+:focus-visible,
+input:focus-visible + :is(.checkbox, .radio, .toggle) {
+  outline: var(--focus-outline);
+  outline-offset: 2px;
 }
-[data-assembly-focus-control='visible']
-  .range
-  input[type='range']:focus::-ms-fill-upper {
-  box-shadow: var(--focus-shadow);
+/* Separate so browsers without :has() keep the rule above */
+.switch-container:has(> input:focus-visible) .switch {
+  outline: var(--focus-outline);
+  outline-offset: 2px;
 }
-[data-assembly-focus-control='visible']
-  .range
-  input[type='range']:focus::-ms-fill-lower {
-  box-shadow: var(--focus-shadow);
+.range input[type='range']:focus-visible {
+  outline: 0;
 }
-[data-assembly-focus-control='visible']
-  .range
-  input[type='range']:focus::-ms-thumb {
-  box-shadow: var(--focus-shadow);
+.range input[type='range']:focus-visible::-webkit-slider-thumb {
+  outline: var(--focus-outline);
 }
-[data-assembly-focus-control='visible']
-  .range
-  input[type='range']:focus::-moz-range-thumb {
-  box-shadow: var(--focus-shadow);
+.range input[type='range']:focus-visible::-moz-range-thumb {
+  outline: var(--focus-outline);
 }
-[data-assembly-focus-control] .range::-moz-focus-outer {
+.range::-moz-focus-outer {
   border: 0;
 }
 @font-face {
@@ -455,11 +433,14 @@ legend {
   width: 100%;
 }
 .input:focus,
-.textarea:focus {
+.textarea:focus,
+.select--stroke:focus {
   box-shadow: inset 0 0 0 1px var(--gray);
 }
-[data-assembly-focus-control='visible'] .select.select--stroke:focus {
-  box-shadow: inset 0 0 0 1px var(--gray), var(--focus-shadow);
+.input:focus-visible,
+.textarea:focus-visible,
+[data-assembly-focus-control='not-visible'] .select:focus-visible {
+  outline: 0;
 }
 .input::placeholder,
 .textarea::placeholder {
diff --git a/src/preset/colors.js b/src/preset/colors.js
index 65dff913..87ed01a6 100644
--- a/src/preset/colors.js
+++ b/src/preset/colors.js
@@ -81,11 +81,8 @@ function colorRules(config) {
         { 'box-shadow': `inset 0 0 0 1px var(--${color})` }
       ],
       [
-        s =>
-          `[data-assembly-focus-control='visible'] .select--stroke${s}:focus`,
-        {
-          'box-shadow': `inset 0 0 0 1px var(--${darkerShade}), var(--focus-shadow)`
-        }
+        s => `.select--stroke${s}:focus`,
+        { 'box-shadow': `inset 0 0 0 1px var(--${darkerShade})` }
       ]
     ]);
   });
diff --git a/src/variables.json b/src/variables.json
index 5d6640c6..1bc9ffb8 100644
--- a/src/variables.json
+++ b/src/variables.json
@@ -81,7 +81,7 @@
 
   "--transition": "0.125s",
 
-  "--focus-shadow": "0 0 0 3px rgba(137, 199, 216, 0.65)",
+  "--focus-outline": "2px solid var(--blue)",
 
   "--font-size-h1": "36px",
   "--font-size-h2": "30px",
diff --git a/test/__snapshots__/build-css.jest.js.snap b/test/__snapshots__/build-css.jest.js.snap
index e260f972..2ef4eab4 100644
--- a/test/__snapshots__/build-css.jest.js.snap
+++ b/test/__snapshots__/build-css.jest.js.snap
@@ -211,48 +211,25 @@ legend{
     transition-duration:0.01ms !important;
   }
 }
-[data-assembly-focus-control] *:focus{
-  outline:0;
-}
-[data-assembly-focus-control='visible'] *:focus{
-  box-shadow:0 0 0 3px rgba(137, 199, 216, 0.65);
-  transition:box-shadow 0.125s;
-}
-[data-assembly-focus-control='visible'] input:focus + .checkbox,
-[data-assembly-focus-control='visible'] input:focus + .radio,
-[data-assembly-focus-control='visible'] .switch-container:has(> input:focus) .switch,
-[data-assembly-focus-control='visible'] input:focus + .toggle{
-  box-shadow:0 0 0 3px rgba(137, 199, 216, 0.65);
-}
-[data-assembly-focus-control='visible'] .range input[type='range']{
-  box-shadow:none;
-}
-[data-assembly-focus-control='visible']
-  .range
-  input[type='range']:focus::-webkit-slider-thumb{
-  box-shadow:0 0 0 3px rgba(137, 199, 216, 0.65);
+:focus-visible,
+input:focus-visible + :is(.checkbox, .radio, .toggle){
+  outline:2px solid #3887BE;
+  outline-offset:2px;
 }
-[data-assembly-focus-control='visible']
-  .range
-  input[type='range']:focus::-ms-fill-upper{
-  box-shadow:0 0 0 3px rgba(137, 199, 216, 0.65);
+.switch-container:has(> input:focus-visible) .switch{
+  outline:2px solid #3887BE;
+  outline-offset:2px;
 }
-[data-assembly-focus-control='visible']
-  .range
-  input[type='range']:focus::-ms-fill-lower{
-  box-shadow:0 0 0 3px rgba(137, 199, 216, 0.65);
+.range input[type='range']:focus-visible{
+  outline:0;
 }
-[data-assembly-focus-control='visible']
-  .range
-  input[type='range']:focus::-ms-thumb{
-  box-shadow:0 0 0 3px rgba(137, 199, 216, 0.65);
+.range input[type='range']:focus-visible::-webkit-slider-thumb{
+  outline:2px solid #3887BE;
 }
-[data-assembly-focus-control='visible']
-  .range
-  input[type='range']:focus::-moz-range-thumb{
-  box-shadow:0 0 0 3px rgba(137, 199, 216, 0.65);
+.range input[type='range']:focus-visible::-moz-range-thumb{
+  outline:2px solid #3887BE;
 }
-[data-assembly-focus-control] .range::-moz-focus-outer{
+.range::-moz-focus-outer{
   border:0;
 }
 @font-face{
@@ -444,11 +421,14 @@ legend{
   width:100%;
 }
 .input:focus,
-.textarea:focus{
+.textarea:focus,
+.select--stroke:focus{
   box-shadow:inset 0 0 0 1px #757D82;
 }
-[data-assembly-focus-control='visible'] .select.select--stroke:focus{
-  box-shadow:inset 0 0 0 1px #757D82, 0 0 0 3px rgba(137, 199, 216, 0.65);
+.input:focus-visible,
+.textarea:focus-visible,
+[data-assembly-focus-control='not-visible'] .select:focus-visible{
+  outline:0;
 }
 .input::placeholder,
 .textarea::placeholder{
@@ -3719,129 +3699,129 @@ input:checked + .checkbox--transparent{background-color:transparent;}
 .input--border-gray,
 .select--stroke.select--gray,
 .textarea--border-gray{box-shadow:inset 0 0 0 1px #757D82;}
-[data-assembly-focus-control='visible'] .select--stroke.select--gray:focus{box-shadow:inset 0 0 0 1px #4D5255, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.input--border-gray:focus,
+.select--stroke.select--gray:focus,
+.textarea--border-gray:focus{box-shadow:inset 0 0 0 1px #4D5255;}
 .select--pink + .select-arrow{border-top-color:#FA428F;}
 .select--pink:focus + .select-arrow{border-top-color:#BA1258;}
 .input--border-pink,
 .select--stroke.select--pink,
 .textarea--border-pink{box-shadow:inset 0 0 0 1px #FA428F;}
-[data-assembly-focus-control='visible'] .select--stroke.select--pink:focus{box-shadow:inset 0 0 0 1px #BA1258, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.input--border-pink:focus,
+.select--stroke.select--pink:focus,
+.textarea--border-pink:focus{box-shadow:inset 0 0 0 1px #BA1258;}
 .select--red + .select-arrow{border-top-color:#EB3814;}
 .select--red:focus + .select-arrow{border-top-color:#B6290D;}
 .input--border-red,
 .select--stroke.select--red,
 .textarea--border-red{box-shadow:inset 0 0 0 1px #EB3814;}
-[data-assembly-focus-control='visible'] .select--stroke.select--red:focus{box-shadow:inset 0 0 0 1px #B6290D, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.input--border-red:focus,
+.select--stroke.select--red:focus,
+.textarea--border-red:focus{box-shadow:inset 0 0 0 1px #B6290D;}
 .select--orange + .select-arrow{border-top-color:#E46707;}
 .select--orange:focus + .select-arrow{border-top-color:#AE4B04;}
 .input--border-orange,
 .select--stroke.select--orange,
 .textarea--border-orange{box-shadow:inset 0 0 0 1px #E46707;}
-[data-assembly-focus-control='visible'] .select--stroke.select--orange:focus{box-shadow:inset 0 0 0 1px #AE4B04, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.input--border-orange:focus,
+.select--stroke.select--orange:focus,
+.textarea--border-orange:focus{box-shadow:inset 0 0 0 1px #AE4B04;}
 .input--border-yellow,
 .select--stroke.select--yellow,
 .textarea--border-yellow{box-shadow:inset 0 0 0 1px #F3E444;}
+.input--border-yellow:focus,
+.select--stroke.select--yellow:focus,
+.textarea--border-yellow:focus{box-shadow:inset 0 0 0 1px #8E740B;}
 .select--yellow + .select-arrow{border-top-color:#F3E444;}
 .select--yellow:focus + .select-arrow{border-top-color:#8E740B;}
-[data-assembly-focus-control='visible'] .select--stroke.select--yellow:focus{box-shadow:inset 0 0 0 1px #8E740B, 0 0 0 3px rgba(137, 199, 216, 0.65);}
 .select--green + .select-arrow{border-top-color:#2AA75C;}
 .select--green:focus + .select-arrow{border-top-color:#1F7A43;}
 .input--border-green,
 .select--stroke.select--green,
 .textarea--border-green{box-shadow:inset 0 0 0 1px #2AA75C;}
-[data-assembly-focus-control='visible'] .select--stroke.select--green:focus{box-shadow:inset 0 0 0 1px #1F7A43, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.input--border-green:focus,
+.select--stroke.select--green:focus,
+.textarea--border-green:focus{box-shadow:inset 0 0 0 1px #1F7A43;}
 .select--blue + .select-arrow{border-top-color:#3887BE;}
 .select--blue:focus + .select-arrow{border-top-color:#0B428E;}
 .input--border-blue,
 .select--stroke.select--blue,
 .textarea--border-blue{box-shadow:inset 0 0 0 1px #3887BE;}
-[data-assembly-focus-control='visible'] .select--stroke.select--blue:focus{box-shadow:inset 0 0 0 1px #0B428E, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.input--border-blue:focus,
+.select--stroke.select--blue:focus,
+.textarea--border-blue:focus{box-shadow:inset 0 0 0 1px #0B428E;}
 .select--purple + .select-arrow{border-top-color:#9669D5;}
 .select--purple:focus + .select-arrow{border-top-color:#6E2FC6;}
 .input--border-purple,
 .select--stroke.select--purple,
 .textarea--border-purple{box-shadow:inset 0 0 0 1px #9669D5;}
-[data-assembly-focus-control='visible'] .select--stroke.select--purple:focus{box-shadow:inset 0 0 0 1px #6E2FC6, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.input--border-purple:focus,
+.select--stroke.select--purple:focus,
+.textarea--border-purple:focus{box-shadow:inset 0 0 0 1px #6E2FC6;}
 .select--darken25 + .select-arrow{border-top-color:rgba(26, 34, 36, 0.25);}
 .select--darken25:focus + .select-arrow,
 .select--darken50 + .select-arrow{border-top-color:rgba(26, 34, 36, 0.5);}
 .input--border-darken25,
 .select--stroke.select--darken25,
 .textarea--border-darken25{box-shadow:inset 0 0 0 1px rgba(26, 34, 36, 0.25);}
-[data-assembly-focus-control='visible'] .select--stroke.select--darken25:focus{box-shadow:inset 0 0 0 1px rgba(26, 34, 36, 0.5), 0 0 0 3px rgba(137, 199, 216, 0.65);}
-.select--darken50:focus + .select-arrow,
-.select--darken75 + .select-arrow{border-top-color:rgba(26, 34, 36, 0.75);}
 .input--border-darken25:focus,
 .input--border-darken50,
+.select--stroke.select--darken25:focus,
 .select--stroke.select--darken50,
 .textarea--border-darken25:focus,
 .textarea--border-darken50{box-shadow:inset 0 0 0 1px rgba(26, 34, 36, 0.5);}
-[data-assembly-focus-control='visible'] .select--stroke.select--darken50:focus{box-shadow:inset 0 0 0 1px rgba(26, 34, 36, 0.75), 0 0 0 3px rgba(137, 199, 216, 0.65);}
-.select--darken75:focus + .select-arrow{border-top-color:#000;}
+.select--darken50:focus + .select-arrow,
+.select--darken75 + .select-arrow{border-top-color:rgba(26, 34, 36, 0.75);}
 .input--border-darken50:focus,
 .input--border-darken75,
+.select--stroke.select--darken50:focus,
 .select--stroke.select--darken75,
 .textarea--border-darken50:focus,
 .textarea--border-darken75{box-shadow:inset 0 0 0 1px rgba(26, 34, 36, 0.75);}
-[data-assembly-focus-control='visible'] .select--stroke.select--darken75:focus{box-shadow:inset 0 0 0 1px #000, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.select--darken75:focus + .select-arrow{border-top-color:#000;}
+.input--border-darken75:focus,
+.select--stroke.select--darken75:focus,
+.textarea--border-darken75:focus{box-shadow:inset 0 0 0 1px #000;}
 .select--lighten25 + .select-arrow{border-top-color:rgba(255, 255, 255, 0.25);}
 .select--lighten25:focus + .select-arrow,
 .select--lighten50 + .select-arrow{border-top-color:rgba(255, 255, 255, 0.5);}
 .input--border-lighten25,
 .select--stroke.select--lighten25,
 .textarea--border-lighten25{box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.25);}
-[data-assembly-focus-control='visible'] .select--stroke.select--lighten25:focus{box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.5), 0 0 0 3px rgba(137, 199, 216, 0.65);}
-.select--lighten50:focus + .select-arrow,
-.select--lighten75 + .select-arrow,
-.select--white:focus + .select-arrow{border-top-color:rgba(255, 255, 255, 0.75);}
 .input--border-lighten25:focus,
 .input--border-lighten50,
+.select--stroke.select--lighten25:focus,
 .select--stroke.select--lighten50,
 .textarea--border-lighten25:focus,
 .textarea--border-lighten50{box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.5);}
-[data-assembly-focus-control='visible'] .select--stroke.select--lighten50:focus,
-[data-assembly-focus-control='visible'] .select--stroke.select--white:focus{box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.75), 0 0 0 3px rgba(137, 199, 216, 0.65);}
-.select--lighten75:focus + .select-arrow,
-.select--white + .select-arrow{border-top-color:#fff;}
+.select--lighten50:focus + .select-arrow,
+.select--lighten75 + .select-arrow,
+.select--white:focus + .select-arrow{border-top-color:rgba(255, 255, 255, 0.75);}
 .input--border-lighten50:focus,
 .input--border-lighten75,
 .input--border-white:focus,
+.select--stroke.select--lighten50:focus,
 .select--stroke.select--lighten75,
+.select--stroke.select--white:focus,
 .textarea--border-lighten50:focus,
 .textarea--border-lighten75,
 .textarea--border-white:focus{box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.75);}
-[data-assembly-focus-control='visible'] .select--stroke.select--lighten75:focus{box-shadow:inset 0 0 0 1px #fff, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.select--lighten75:focus + .select-arrow,
+.select--white + .select-arrow{border-top-color:#fff;}
 .input--border-lighten75:focus,
 .input--border-white,
+.select--stroke.select--lighten75:focus,
 .select--stroke.select--white,
 .textarea--border-lighten75:focus,
 .textarea--border-white{box-shadow:inset 0 0 0 1px #fff;}
 .input--border-transparent,
 .select--stroke.select--transparent,
 .textarea--border-transparent{box-shadow:inset 0 0 0 1px transparent;}
-.select--transparent + .select-arrow{border-top-color:transparent;}
-.select--transparent:focus + .select-arrow{border-top-color:rgba(26, 34, 36, 0.1);}
-[data-assembly-focus-control='visible'] .select--stroke.select--transparent:focus{box-shadow:inset 0 0 0 1px rgba(26, 34, 36, 0.1), 0 0 0 3px rgba(137, 199, 216, 0.65);}
-.input--border-gray:focus,
-.textarea--border-gray:focus{box-shadow:inset 0 0 0 1px #4D5255;}
-.input--border-pink:focus,
-.textarea--border-pink:focus{box-shadow:inset 0 0 0 1px #BA1258;}
-.input--border-red:focus,
-.textarea--border-red:focus{box-shadow:inset 0 0 0 1px #B6290D;}
-.input--border-orange:focus,
-.textarea--border-orange:focus{box-shadow:inset 0 0 0 1px #AE4B04;}
-.input--border-yellow:focus,
-.textarea--border-yellow:focus{box-shadow:inset 0 0 0 1px #8E740B;}
-.input--border-green:focus,
-.textarea--border-green:focus{box-shadow:inset 0 0 0 1px #1F7A43;}
-.input--border-blue:focus,
-.textarea--border-blue:focus{box-shadow:inset 0 0 0 1px #0B428E;}
-.input--border-purple:focus,
-.textarea--border-purple:focus{box-shadow:inset 0 0 0 1px #6E2FC6;}
-.input--border-darken75:focus,
-.textarea--border-darken75:focus{box-shadow:inset 0 0 0 1px #000;}
 .input--border-transparent:focus,
+.select--stroke.select--transparent:focus,
 .textarea--border-transparent:focus{box-shadow:inset 0 0 0 1px rgba(26, 34, 36, 0.1);}
+.select--transparent + .select-arrow{border-top-color:transparent;}
+.select--transparent:focus + .select-arrow{border-top-color:rgba(26, 34, 36, 0.1);}
 .checkbox--gray{border-color:#757D82;}
 .checkbox--pink{border-color:#FA428F;}
 .checkbox--red{border-color:#EB3814;}
@@ -4686,48 +4666,25 @@ legend{
     transition-duration:0.01ms !important;
   }
 }
-[data-assembly-focus-control] *:focus{
-  outline:0;
-}
-[data-assembly-focus-control='visible'] *:focus{
-  box-shadow:0 0 0 3px rgba(137, 199, 216, 0.65);
-  transition:box-shadow 0.125s;
-}
-[data-assembly-focus-control='visible'] input:focus + .checkbox,
-[data-assembly-focus-control='visible'] input:focus + .radio,
-[data-assembly-focus-control='visible'] .switch-container:has(> input:focus) .switch,
-[data-assembly-focus-control='visible'] input:focus + .toggle{
-  box-shadow:0 0 0 3px rgba(137, 199, 216, 0.65);
-}
-[data-assembly-focus-control='visible'] .range input[type='range']{
-  box-shadow:none;
-}
-[data-assembly-focus-control='visible']
-  .range
-  input[type='range']:focus::-webkit-slider-thumb{
-  box-shadow:0 0 0 3px rgba(137, 199, 216, 0.65);
+:focus-visible,
+input:focus-visible + :is(.checkbox, .radio, .toggle){
+  outline:2px solid #0F71FA;
+  outline-offset:2px;
 }
-[data-assembly-focus-control='visible']
-  .range
-  input[type='range']:focus::-ms-fill-upper{
-  box-shadow:0 0 0 3px rgba(137, 199, 216, 0.65);
+.switch-container:has(> input:focus-visible) .switch{
+  outline:2px solid #0F71FA;
+  outline-offset:2px;
 }
-[data-assembly-focus-control='visible']
-  .range
-  input[type='range']:focus::-ms-fill-lower{
-  box-shadow:0 0 0 3px rgba(137, 199, 216, 0.65);
+.range input[type='range']:focus-visible{
+  outline:0;
 }
-[data-assembly-focus-control='visible']
-  .range
-  input[type='range']:focus::-ms-thumb{
-  box-shadow:0 0 0 3px rgba(137, 199, 216, 0.65);
+.range input[type='range']:focus-visible::-webkit-slider-thumb{
+  outline:2px solid #0F71FA;
 }
-[data-assembly-focus-control='visible']
-  .range
-  input[type='range']:focus::-moz-range-thumb{
-  box-shadow:0 0 0 3px rgba(137, 199, 216, 0.65);
+.range input[type='range']:focus-visible::-moz-range-thumb{
+  outline:2px solid #0F71FA;
 }
-[data-assembly-focus-control] .range::-moz-focus-outer{
+.range::-moz-focus-outer{
   border:0;
 }
 @font-face{
@@ -4919,11 +4876,14 @@ legend{
   width:100%;
 }
 .input:focus,
-.textarea:focus{
+.textarea:focus,
+.select--stroke:focus{
   box-shadow:inset 0 0 0 1px #757D82;
 }
-[data-assembly-focus-control='visible'] .select.select--stroke:focus{
-  box-shadow:inset 0 0 0 1px #757D82, 0 0 0 3px rgba(137, 199, 216, 0.65);
+.input:focus-visible,
+.textarea:focus-visible,
+[data-assembly-focus-control='not-visible'] .select:focus-visible{
+  outline:0;
 }
 .input::placeholder,
 .textarea::placeholder{
@@ -8210,129 +8170,129 @@ input:checked + .checkbox--transparent{background-color:transparent;}
 .input--border-gray,
 .select--stroke.select--gray,
 .textarea--border-gray{box-shadow:inset 0 0 0 1px #757D82;}
-[data-assembly-focus-control='visible'] .select--stroke.select--gray:focus{box-shadow:inset 0 0 0 1px #4D5255, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.input--border-gray:focus,
+.select--stroke.select--gray:focus,
+.textarea--border-gray:focus{box-shadow:inset 0 0 0 1px #4D5255;}
 .select--pink + .select-arrow{border-top-color:#FA428F;}
 .select--pink:focus + .select-arrow{border-top-color:#BA1258;}
 .input--border-pink,
 .select--stroke.select--pink,
 .textarea--border-pink{box-shadow:inset 0 0 0 1px #FA428F;}
-[data-assembly-focus-control='visible'] .select--stroke.select--pink:focus{box-shadow:inset 0 0 0 1px #BA1258, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.input--border-pink:focus,
+.select--stroke.select--pink:focus,
+.textarea--border-pink:focus{box-shadow:inset 0 0 0 1px #BA1258;}
 .select--red + .select-arrow{border-top-color:#EB3814;}
 .select--red:focus + .select-arrow{border-top-color:#B6290D;}
 .input--border-red,
 .select--stroke.select--red,
 .textarea--border-red{box-shadow:inset 0 0 0 1px #EB3814;}
-[data-assembly-focus-control='visible'] .select--stroke.select--red:focus{box-shadow:inset 0 0 0 1px #B6290D, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.input--border-red:focus,
+.select--stroke.select--red:focus,
+.textarea--border-red:focus{box-shadow:inset 0 0 0 1px #B6290D;}
 .select--orange + .select-arrow{border-top-color:#E46707;}
 .select--orange:focus + .select-arrow{border-top-color:#AE4B04;}
 .input--border-orange,
 .select--stroke.select--orange,
 .textarea--border-orange{box-shadow:inset 0 0 0 1px #E46707;}
-[data-assembly-focus-control='visible'] .select--stroke.select--orange:focus{box-shadow:inset 0 0 0 1px #AE4B04, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.input--border-orange:focus,
+.select--stroke.select--orange:focus,
+.textarea--border-orange:focus{box-shadow:inset 0 0 0 1px #AE4B04;}
 .input--border-yellow,
 .select--stroke.select--yellow,
 .textarea--border-yellow{box-shadow:inset 0 0 0 1px #F3E444;}
+.input--border-yellow:focus,
+.select--stroke.select--yellow:focus,
+.textarea--border-yellow:focus{box-shadow:inset 0 0 0 1px #8E740B;}
 .select--yellow + .select-arrow{border-top-color:#F3E444;}
 .select--yellow:focus + .select-arrow{border-top-color:#8E740B;}
-[data-assembly-focus-control='visible'] .select--stroke.select--yellow:focus{box-shadow:inset 0 0 0 1px #8E740B, 0 0 0 3px rgba(137, 199, 216, 0.65);}
 .select--green + .select-arrow{border-top-color:#2AA75C;}
 .select--green:focus + .select-arrow{border-top-color:#1F7A43;}
 .input--border-green,
 .select--stroke.select--green,
 .textarea--border-green{box-shadow:inset 0 0 0 1px #2AA75C;}
-[data-assembly-focus-control='visible'] .select--stroke.select--green:focus{box-shadow:inset 0 0 0 1px #1F7A43, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.input--border-green:focus,
+.select--stroke.select--green:focus,
+.textarea--border-green:focus{box-shadow:inset 0 0 0 1px #1F7A43;}
 .select--blue + .select-arrow{border-top-color:#0F71FA;}
 .select--blue:focus + .select-arrow{border-top-color:#0B428E;}
 .input--border-blue,
 .select--stroke.select--blue,
 .textarea--border-blue{box-shadow:inset 0 0 0 1px #0F71FA;}
-[data-assembly-focus-control='visible'] .select--stroke.select--blue:focus{box-shadow:inset 0 0 0 1px #0B428E, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.input--border-blue:focus,
+.select--stroke.select--blue:focus,
+.textarea--border-blue:focus{box-shadow:inset 0 0 0 1px #0B428E;}
 .select--purple + .select-arrow{border-top-color:#9669D5;}
 .select--purple:focus + .select-arrow{border-top-color:#6E2FC6;}
 .input--border-purple,
 .select--stroke.select--purple,
 .textarea--border-purple{box-shadow:inset 0 0 0 1px #9669D5;}
-[data-assembly-focus-control='visible'] .select--stroke.select--purple:focus{box-shadow:inset 0 0 0 1px #6E2FC6, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.input--border-purple:focus,
+.select--stroke.select--purple:focus,
+.textarea--border-purple:focus{box-shadow:inset 0 0 0 1px #6E2FC6;}
 .select--darken25 + .select-arrow{border-top-color:rgba(26, 34, 36, 0.25);}
 .select--darken25:focus + .select-arrow,
 .select--darken50 + .select-arrow{border-top-color:rgba(26, 34, 36, 0.5);}
 .input--border-darken25,
 .select--stroke.select--darken25,
 .textarea--border-darken25{box-shadow:inset 0 0 0 1px rgba(26, 34, 36, 0.25);}
-[data-assembly-focus-control='visible'] .select--stroke.select--darken25:focus{box-shadow:inset 0 0 0 1px rgba(26, 34, 36, 0.5), 0 0 0 3px rgba(137, 199, 216, 0.65);}
-.select--darken50:focus + .select-arrow,
-.select--darken75 + .select-arrow{border-top-color:rgba(26, 34, 36, 0.75);}
 .input--border-darken25:focus,
 .input--border-darken50,
+.select--stroke.select--darken25:focus,
 .select--stroke.select--darken50,
 .textarea--border-darken25:focus,
 .textarea--border-darken50{box-shadow:inset 0 0 0 1px rgba(26, 34, 36, 0.5);}
-[data-assembly-focus-control='visible'] .select--stroke.select--darken50:focus{box-shadow:inset 0 0 0 1px rgba(26, 34, 36, 0.75), 0 0 0 3px rgba(137, 199, 216, 0.65);}
-.select--darken75:focus + .select-arrow{border-top-color:#000;}
+.select--darken50:focus + .select-arrow,
+.select--darken75 + .select-arrow{border-top-color:rgba(26, 34, 36, 0.75);}
 .input--border-darken50:focus,
 .input--border-darken75,
+.select--stroke.select--darken50:focus,
 .select--stroke.select--darken75,
 .textarea--border-darken50:focus,
 .textarea--border-darken75{box-shadow:inset 0 0 0 1px rgba(26, 34, 36, 0.75);}
-[data-assembly-focus-control='visible'] .select--stroke.select--darken75:focus{box-shadow:inset 0 0 0 1px #000, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.select--darken75:focus + .select-arrow{border-top-color:#000;}
+.input--border-darken75:focus,
+.select--stroke.select--darken75:focus,
+.textarea--border-darken75:focus{box-shadow:inset 0 0 0 1px #000;}
 .select--lighten25 + .select-arrow{border-top-color:rgba(255, 255, 255, 0.25);}
 .select--lighten25:focus + .select-arrow,
 .select--lighten50 + .select-arrow{border-top-color:rgba(255, 255, 255, 0.5);}
 .input--border-lighten25,
 .select--stroke.select--lighten25,
 .textarea--border-lighten25{box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.25);}
-[data-assembly-focus-control='visible'] .select--stroke.select--lighten25:focus{box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.5), 0 0 0 3px rgba(137, 199, 216, 0.65);}
-.select--lighten50:focus + .select-arrow,
-.select--lighten75 + .select-arrow,
-.select--white:focus + .select-arrow{border-top-color:rgba(255, 255, 255, 0.75);}
 .input--border-lighten25:focus,
 .input--border-lighten50,
+.select--stroke.select--lighten25:focus,
 .select--stroke.select--lighten50,
 .textarea--border-lighten25:focus,
 .textarea--border-lighten50{box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.5);}
-[data-assembly-focus-control='visible'] .select--stroke.select--lighten50:focus,
-[data-assembly-focus-control='visible'] .select--stroke.select--white:focus{box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.75), 0 0 0 3px rgba(137, 199, 216, 0.65);}
-.select--lighten75:focus + .select-arrow,
-.select--white + .select-arrow{border-top-color:#fff;}
+.select--lighten50:focus + .select-arrow,
+.select--lighten75 + .select-arrow,
+.select--white:focus + .select-arrow{border-top-color:rgba(255, 255, 255, 0.75);}
 .input--border-lighten50:focus,
 .input--border-lighten75,
 .input--border-white:focus,
+.select--stroke.select--lighten50:focus,
 .select--stroke.select--lighten75,
+.select--stroke.select--white:focus,
 .textarea--border-lighten50:focus,
 .textarea--border-lighten75,
 .textarea--border-white:focus{box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.75);}
-[data-assembly-focus-control='visible'] .select--stroke.select--lighten75:focus{box-shadow:inset 0 0 0 1px #fff, 0 0 0 3px rgba(137, 199, 216, 0.65);}
+.select--lighten75:focus + .select-arrow,
+.select--white + .select-arrow{border-top-color:#fff;}
 .input--border-lighten75:focus,
 .input--border-white,
+.select--stroke.select--lighten75:focus,
 .select--stroke.select--white,
 .textarea--border-lighten75:focus,
 .textarea--border-white{box-shadow:inset 0 0 0 1px #fff;}
 .input--border-transparent,
 .select--stroke.select--transparent,
 .textarea--border-transparent{box-shadow:inset 0 0 0 1px transparent;}
-.select--transparent + .select-arrow{border-top-color:transparent;}
-.select--transparent:focus + .select-arrow{border-top-color:rgba(26, 34, 36, 0.1);}
-[data-assembly-focus-control='visible'] .select--stroke.select--transparent:focus{box-shadow:inset 0 0 0 1px rgba(26, 34, 36, 0.1), 0 0 0 3px rgba(137, 199, 216, 0.65);}
-.input--border-gray:focus,
-.textarea--border-gray:focus{box-shadow:inset 0 0 0 1px #4D5255;}
-.input--border-pink:focus,
-.textarea--border-pink:focus{box-shadow:inset 0 0 0 1px #BA1258;}
-.input--border-red:focus,
-.textarea--border-red:focus{box-shadow:inset 0 0 0 1px #B6290D;}
-.input--border-orange:focus,
-.textarea--border-orange:focus{box-shadow:inset 0 0 0 1px #AE4B04;}
-.input--border-yellow:focus,
-.textarea--border-yellow:focus{box-shadow:inset 0 0 0 1px #8E740B;}
-.input--border-green:focus,
-.textarea--border-green:focus{box-shadow:inset 0 0 0 1px #1F7A43;}
-.input--border-blue:focus,
-.textarea--border-blue:focus{box-shadow:inset 0 0 0 1px #0B428E;}
-.input--border-purple:focus,
-.textarea--border-purple:focus{box-shadow:inset 0 0 0 1px #6E2FC6;}
-.input--border-darken75:focus,
-.textarea--border-darken75:focus{box-shadow:inset 0 0 0 1px #000;}
 .input--border-transparent:focus,
+.select--stroke.select--transparent:focus,
 .textarea--border-transparent:focus{box-shadow:inset 0 0 0 1px rgba(26, 34, 36, 0.1);}
+.select--transparent + .select-arrow{border-top-color:transparent;}
+.select--transparent:focus + .select-arrow{border-top-color:rgba(26, 34, 36, 0.1);}
 .checkbox--gray{border-color:#757D82;}
 .checkbox--pink{border-color:#FA428F;}
 .checkbox--red{border-color:#EB3814;}