| 1 | :where(.btn,button,input:is([type=button],[type=submit],[type=reset])){--_accent:initial ;--_text:initial ;--_size:initial ;--_bg-light:white;--_bg-dark:var(--surface-3);--_bg:var(--_bg-light);--_border:var(--surface-2);--_highlight-size:0;--_highlight-light:oklch(70% 100% var(--palette-hue)/25%);--_highlight-dark:oklch(70% 50% var(--palette-hue)/25%);--_highlight:var(--_highlight-light);--_ink-shadow-light:0 1px 0 var(--color-3);--_ink-shadow-dark:0 1px 0 var(--surface-1);--_ink-shadow:var(--_ink-shadow-light);--_icon-size:var(--size-relative-7,2ch);--_icon-color:var(--_accent,var(--link));font-size:var(--_size);background:var(--_bg);color:var(--_text);border:var(--border-size-2)solid var(--_border);box-shadow:var(--shadow-2),0 1px var(--surface-3),0 0 0 var(--_highlight-size)var(--_highlight);text-shadow:var(--_ink-shadow);text-align:center;justify-content:center;align-items:center;gap:var(--size-2);font-weight:var(--font-weight-7);border-radius:var(--radius-2);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;transition:border-color .5s var(--ease-3);padding-block:1ex;padding-inline:2ex;display:inline-flex}:where(input[type=file])::-webkit-file-upload-button{--_accent:initial ;--_text:initial ;--_size:initial ;--_bg-light:white;--_bg-dark:var(--surface-3);--_bg:var(--_bg-light);--_border:var(--surface-2);--_highlight-size:0;--_highlight-light:oklch(70% 100% var(--palette-hue)/25%);--_highlight-dark:oklch(70% 50% var(--palette-hue)/25%);--_highlight:var(--_highlight-light);--_ink-shadow-light:0 1px 0 var(--color-3);--_ink-shadow-dark:0 1px 0 var(--surface-1);--_ink-shadow:var(--_ink-shadow-light);--_icon-size:var(--size-relative-7,2ch);--_icon-color:var(--_accent,var(--link));font-size:var(--_size);background:var(--_bg);color:var(--_text);border:var(--border-size-2)solid var(--_border);box-shadow:var(--shadow-2),0 1px var(--surface-3),0 0 0 var(--_highlight-size)var(--_highlight);text-shadow:var(--_ink-shadow);text-align:center;justify-content:center;align-items:center;gap:var(--size-2);font-weight:var(--font-weight-7);border-radius:var(--radius-2);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;transition:border-color .5s var(--ease-3);padding-block:1ex;padding-inline:2ex;display:inline-flex}@media (prefers-color-scheme:dark){:where(input[type=file])::-webkit-file-upload-button{--_highlight:var(--_highlight-dark);--_bg:var(--_bg-dark);--_ink-shadow:var(--_ink-shadow-dark)}}@media (prefers-reduced-motion:no-preference){:where(input[type=file])::-webkit-file-upload-button{transition:border-color .5s var(--ease-3),box-shadow .145s var(--ease-spring-3,var(--ease-4)),outline-offset .145s var(--ease-spring-3,var(--ease-4))}}:where(input[type=file])::file-selector-button{--_accent:initial ;--_text:initial ;--_size:initial ;--_bg-light:white;--_bg-dark:var(--surface-3);--_bg:var(--_bg-light);--_border:var(--surface-2);--_highlight-size:0;--_highlight-light:oklch(70% 100% var(--palette-hue)/25%);--_highlight-dark:oklch(70% 50% var(--palette-hue)/25%);--_highlight:var(--_highlight-light);--_ink-shadow-light:0 1px 0 var(--color-3);--_ink-shadow-dark:0 1px 0 var(--surface-1);--_ink-shadow:var(--_ink-shadow-light);--_icon-size:var(--size-relative-7,2ch);--_icon-color:var(--_accent,var(--link));font-size:var(--_size);background:var(--_bg);color:var(--_text);border:var(--border-size-2)solid var(--_border);box-shadow:var(--shadow-2),0 1px var(--surface-3),0 0 0 var(--_highlight-size)var(--_highlight);text-shadow:var(--_ink-shadow);text-align:center;justify-content:center;align-items:center;gap:var(--size-2);font-weight:var(--font-weight-7);border-radius:var(--radius-2);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;transition:border-color .5s var(--ease-3);padding-block:1ex;padding-inline:2ex;display:inline-flex}@media (prefers-color-scheme:dark){:where(input[type=file])::file-selector-button{--_highlight:var(--_highlight-dark);--_bg:var(--_bg-dark);--_ink-shadow:var(--_ink-shadow-dark)}}@media (prefers-reduced-motion:no-preference){:where(input[type=file])::file-selector-button{transition:border-color .5s var(--ease-3),box-shadow .145s var(--ease-spring-3,var(--ease-4)),outline-offset .145s var(--ease-spring-3,var(--ease-4))}}@media (prefers-color-scheme:dark){:where(.btn,button,input:is([type=button],[type=submit],[type=reset])){--_highlight:var(--_highlight-dark);--_bg:var(--_bg-dark);--_ink-shadow:var(--_ink-shadow-dark)}}@media (prefers-reduced-motion:no-preference){:where(.btn,button,input:is([type=button],[type=submit],[type=reset])){transition:border-color .5s var(--ease-3),box-shadow .145s var(--ease-spring-3,var(--ease-4)),outline-offset .145s var(--ease-spring-3,var(--ease-4))}}:where(.btn,button,input:is([type=button],[type=submit],[type=reset]))[disabled]{--_bg:none;--_text:var(--color-6);cursor:not-allowed;box-shadow:var(--shadow-1)}@media (prefers-color-scheme:dark){:where(.btn,button,input:is([type=button],[type=submit],[type=reset]))[disabled]{--_text:var(--color-5)}}:where(.btn,button,input:is([type=button],[type=submit],[type=reset])):where(:not(:active):hover){--_highlight-size:var(--size-2);transition-duration:.25s}:where(.btn,button,input:is([type=button],[type=submit],[type=reset]))>:where(svg){filter:drop-shadow(var(--_ink-shadow));block-size:var(--_icon-size);inline-size:var(--_icon-size);flex-shrink:0}:where(.btn,button,input:is([type=button],[type=submit],[type=reset]))>:where(svg>*){stroke:var(--_icon-color);stroke-width:var(--border-size-2)}:where([type=submit],form button:not([type],[disabled])){--_text:var(--_accent,var(--link))}:where([type=reset]){--_text:var(--red-6,#fa5252);--_border:var(--red-3,#ffa8a8)}:where([type=reset]):focus-visible{outline-color:var(--red-6,#fa5252)}@media (prefers-color-scheme:dark){:where([type=reset]){--_text:var(--red-2,#ffc9c9);--_border:var(--surface-3)}}:where([type=submit],[type=reset],form button:not([type])):is(:hover,:focus-visible):not([disabled]){--_border:currentColor}:where(input[type=file]){cursor:initial;border-radius:var(--radius-2);border:var(--border-size-1)solid var(--surface-2);box-shadow:var(--inner-shadow-4);color:var(--text-2);align-self:flex-start;max-inline-size:100%;padding:0}:where(input[type=file])::-webkit-file-upload-button{cursor:pointer;margin-inline-end:2ex}:where(input[type=file])::file-selector-button{cursor:pointer;margin-inline-end:2ex}@media (prefers-color-scheme:dark){:where([type=submit]),:where(form button:not([type=button])),:where([type=reset]),:where([disabled]){--_bg:var(--surface-1)}} |