@skiddph/prui 0.2.1 → 0.4.0

package/dist/index.js

@@ -1,140 +1,159 @@
 import { cn as t } from "./core/cn.js";
-import { Button as r, buttonPropsMeta as s } from "./core/button.js";
-import { Input as P, Textarea as i, inputPropsMeta as g, textareaPropsMeta as l } from "./core/input.js";
-import { Label as m, Separator as n, labelPropsMeta as d, separatorPropsMeta as T } from "./core/label.js";
-import { Select as u, SelectContent as S, SelectItem as c, SelectTrigger as b, SelectValue as x, selectPropsMeta as h } from "./core/select.js";
-import { Switch as F, switchPropsMeta as R } from "./core/switch.js";
-import { Tabs as w, TabsContent as A, TabsList as L, TabsTrigger as N, tabsPropsMeta as v } from "./core/tabs.js";
-import { Avatar as y, Badge as E, Card as H, CardContent as I, CardDescription as B, CardFooter as O, CardHeader as j, CardTitle as U, avatarPropsMeta as V, badgePropsMeta as _, cardPropsMeta as q } from "./core/card.js";
-import { Dialog as G, DialogContent as J, DialogDescription as K, DialogFooter as Q, DialogHeader as W, DialogTitle as X, dialogPropsMeta as Y } from "./core/dialog.js";
-import { Dropdown as $, dropdownPropsMeta as ee } from "./core/dropdown.js";
-import { ScrollArea as te, scrollAreaPropsMeta as oe } from "./core/scroll-area.js";
-import { Modal as se, confirmModal as pe, confirmModalPropsMeta as Pe, modalPropsMeta as ie } from "./core/modal.js";
-import { D as le, a as Me, b as me, c as ne, d as de, F as Te, N as fe, P as ue, T as Se, e as ce, f as be, g as xe } from "./chunks/data-table-toolbar-BUy2EWPy.js";
-import { Link as De, NavLink as Fe, Navigate as Re, Outlet as Ce, Route as we, Routes as Ae } from "react-router-dom";
-import { A as Ne, a as ve, b as ke, c as ye, C as Ee, F as He, R as Ie, S as Be, d as Oe, e as je, f as Ue, g as Ve, h as _e, i as qe, r as ze, s as Ge, j as Je, k as Ke, u as Qe } from "./chunks/auth-shell-DsAwGqf8.js";
-import { AdminSetup as Xe, EmptyState as Ye, ErrorPage as Ze, ForgotPasswordPage as $e, LoginPage as ea, LogoutPage as aa, NotFoundPage as ta, OtpPage as oa, PagesRegistry as ra, ProfilePage as sa, RegisterPage as pa, ResetPasswordPage as Pa, SettingsPage as ia, adminSetupPropsMeta as ga, emptyStatePropsMeta as la, errorPagePropsMeta as Ma, forgotPasswordPagePropsMeta as ma, loginPagePropsMeta as na, logoutPagePropsMeta as da, notFoundPagePropsMeta as Ta, otpPagePropsMeta as fa, profilePagePropsMeta as ua, registerPagePropsMeta as Sa, resetPasswordPagePropsMeta as ca, settingsPagePropsMeta as ba } from "./pages.js";
-import { PRUI_THEMES as ha, applyTheme as Da, isDarkTheme as Fa, isLightTheme as Ra, nextTheme as Ca, readPersistedTheme as wa, resolveThemeName as Aa, themeMeta as La, themeMode as Na } from "./theme.js";
+import { resolveSurface as r, withSurface as s } from "./core/surface.js";
+import { Button as P, buttonPropsMeta as i } from "./core/button.js";
+import { Input as g, Textarea as m, inputPropsMeta as n, textareaPropsMeta as M } from "./core/input.js";
+import { Label as T, Separator as f, labelPropsMeta as u, separatorPropsMeta as S } from "./core/label.js";
+import { Select as h, SelectContent as x, SelectItem as b, SelectTrigger as F, SelectValue as D, selectPropsMeta as R } from "./core/select.js";
+import { Switch as C, switchPropsMeta as w } from "./core/switch.js";
+import { Tabs as k, TabsContent as v, TabsList as L, TabsTrigger as I, tabsPropsMeta as y } from "./core/tabs.js";
+import { Avatar as B, Badge as H, Card as O, CardContent as G, CardDescription as U, CardFooter as _, CardHeader as j, CardTitle as K, avatarPropsMeta as V, badgePropsMeta as q, cardPropsMeta as z } from "./core/card.js";
+import { Dialog as Q, DialogContent as W, DialogDescription as X, DialogFooter as Y, DialogHeader as Z, DialogTitle as $, dialogPropsMeta as ee } from "./core/dialog.js";
+import { Dropdown as te, dropdownPropsMeta as oe } from "./core/dropdown.js";
+import { ScrollArea as se, scrollAreaPropsMeta as pe } from "./core/scroll-area.js";
+import { Modal as ie, confirmModal as le, confirmModalPropsMeta as ge, modalPropsMeta as me } from "./core/modal.js";
+import { D as Me, a as de, b as Te, c as fe, d as ue, F as Se, N as ce, P as he, T as xe, e as be, f as Fe, g as De } from "./chunks/data-table-toolbar-BUy2EWPy.js";
+import { Link as Ae, NavLink as Ce, Navigate as we, Outlet as Ne, Route as ke, Routes as ve } from "react-router-dom";
+import { A as Ie, a as ye, b as Ee, c as Be, C as He, F as Oe, R as Ge, S as Ue, d as _e, e as je, f as Ke, g as Ve, h as qe, i as ze, r as Je, s as Qe, j as We, k as Xe, u as Ye } from "./chunks/auth-shell-DWnZhpVf.js";
+import { AdminSetup as $e, EmptyState as ea, ErrorPage as aa, ForgotPasswordPage as ta, LoginPage as oa, LogoutPage as ra, NotFoundPage as sa, OtpPage as pa, PagesRegistry as Pa, ProfilePage as ia, RegisterPage as la, ResetPasswordPage as ga, SettingsPage as ma, adminSetupPropsMeta as na, emptyStatePropsMeta as Ma, errorPagePropsMeta as da, forgotPasswordPagePropsMeta as Ta, loginPagePropsMeta as fa, logoutPagePropsMeta as ua, notFoundPagePropsMeta as Sa, otpPagePropsMeta as ca, profilePagePropsMeta as ha, registerPagePropsMeta as xa, resetPasswordPagePropsMeta as ba, settingsPagePropsMeta as Fa } from "./pages.js";
+import { PRUI_THEMES as Ra, PRUI_TOKENS as Aa, applyTheme as Ca, applyThemeTokens as wa, clearAppliedTokens as Na, defineTheme as ka, isDarkTheme as va, isLightTheme as La, listThemes as Ia, nextTheme as ya, readPersistedTheme as Ea, resolveThemeName as Ba, restoreAppliedTokens as Ha, themeMeta as Oa, themeMode as Ga } from "./theme.js";
+import { FormButton as _a, FormGroup as ja, FormInput as Ka, formButtonPropsMeta as Va, formGroupPropsMeta as qa, formInputPropsMeta as za, getFormApi as Ja, registerForm as Qa, useFormApi as Wa } from "./forms.js";
 export {
-  Xe as AdminSetup,
-  Ne as App,
-  ve as AppShell,
-  ke as AuthShell,
-  ye as AutoPages,
-  y as Avatar,
-  E as Badge,
-  r as Button,
-  H as Card,
-  I as CardContent,
-  B as CardDescription,
-  O as CardFooter,
+  $e as AdminSetup,
+  Ie as App,
+  ye as AppShell,
+  Ee as AuthShell,
+  Be as AutoPages,
+  B as Avatar,
+  H as Badge,
+  P as Button,
+  O as Card,
+  G as CardContent,
+  U as CardDescription,
+  _ as CardFooter,
   j as CardHeader,
-  U as CardTitle,
-  Ee as CommandPalette,
-  le as DataTable,
-  Me as DataTablePagination,
-  me as DataTableToolbar,
-  ne as DateFilter,
-  de as DateRangeFilter,
-  G as Dialog,
-  J as DialogContent,
-  K as DialogDescription,
-  Q as DialogFooter,
-  W as DialogHeader,
-  X as DialogTitle,
-  $ as Dropdown,
-  Ye as EmptyState,
-  Ze as ErrorPage,
-  Te as FacetedFilter,
-  $e as ForgotPasswordPage,
-  He as Form,
-  P as Input,
-  m as Label,
-  De as Link,
-  ea as LoginPage,
-  aa as LogoutPage,
-  se as Modal,
-  Fe as NavLink,
-  Re as Navigate,
-  ta as NotFoundPage,
-  fe as NumberRangeFilter,
-  oa as OtpPage,
-  Ce as Outlet,
-  ha as PRUI_THEMES,
-  ra as PagesRegistry,
-  ue as PriceFilter,
-  sa as ProfilePage,
-  pa as RegisterPage,
-  Pa as ResetPasswordPage,
-  Ie as Resource,
-  we as Route,
-  Ae as Routes,
-  te as ScrollArea,
-  u as Select,
-  S as SelectContent,
-  c as SelectItem,
-  b as SelectTrigger,
-  x as SelectValue,
-  n as Separator,
-  Be as SessionTimeout,
-  Oe as Settings,
-  ia as SettingsPage,
+  K as CardTitle,
+  He as CommandPalette,
+  Me as DataTable,
+  de as DataTablePagination,
+  Te as DataTableToolbar,
+  fe as DateFilter,
+  ue as DateRangeFilter,
+  Q as Dialog,
+  W as DialogContent,
+  X as DialogDescription,
+  Y as DialogFooter,
+  Z as DialogHeader,
+  $ as DialogTitle,
+  te as Dropdown,
+  ea as EmptyState,
+  aa as ErrorPage,
+  Se as FacetedFilter,
+  ta as ForgotPasswordPage,
+  Oe as Form,
+  _a as FormButton,
+  ja as FormGroup,
+  Ka as FormInput,
+  g as Input,
+  T as Label,
+  Ae as Link,
+  oa as LoginPage,
+  ra as LogoutPage,
+  ie as Modal,
+  Ce as NavLink,
+  we as Navigate,
+  sa as NotFoundPage,
+  ce as NumberRangeFilter,
+  pa as OtpPage,
+  Ne as Outlet,
+  Ra as PRUI_THEMES,
+  Aa as PRUI_TOKENS,
+  Pa as PagesRegistry,
+  he as PriceFilter,
+  ia as ProfilePage,
+  la as RegisterPage,
+  ga as ResetPasswordPage,
+  Ge as Resource,
+  ke as Route,
+  ve as Routes,
+  se as ScrollArea,
+  h as Select,
+  x as SelectContent,
+  b as SelectItem,
+  F as SelectTrigger,
+  D as SelectValue,
+  f as Separator,
+  Ue as SessionTimeout,
+  _e as Settings,
+  ma as SettingsPage,
   je as SidebarNav,
-  Ue as StatRow,
-  F as Switch,
-  w as Tabs,
-  A as TabsContent,
+  Ke as StatRow,
+  C as Switch,
+  k as Tabs,
+  v as TabsContent,
   L as TabsList,
-  N as TabsTrigger,
-  i as Textarea,
-  Se as TimeRangeFilter,
-  ga as adminSetupPropsMeta,
+  I as TabsTrigger,
+  m as Textarea,
+  xe as TimeRangeFilter,
+  na as adminSetupPropsMeta,
   Ve as appPropsMeta,
-  Da as applyTheme,
-  _e as authShellPropsMeta,
+  Ca as applyTheme,
+  wa as applyThemeTokens,
+  qe as authShellPropsMeta,
   V as avatarPropsMeta,
-  _ as badgePropsMeta,
-  s as buttonPropsMeta,
-  q as cardPropsMeta,
+  q as badgePropsMeta,
+  i as buttonPropsMeta,
+  z as cardPropsMeta,
+  Na as clearAppliedTokens,
   t as cn,
-  pe as confirmModal,
-  Pe as confirmModalPropsMeta,
-  ce as dataTablePaginationPropsMeta,
-  be as dataTablePropsMeta,
-  xe as dataTableToolbarPropsMeta,
-  Y as dialogPropsMeta,
-  ee as dropdownPropsMeta,
-  la as emptyStatePropsMeta,
-  Ma as errorPagePropsMeta,
-  ma as forgotPasswordPagePropsMeta,
-  qe as formPropsMeta,
-  g as inputPropsMeta,
-  Fa as isDarkTheme,
-  Ra as isLightTheme,
-  d as labelPropsMeta,
-  na as loginPagePropsMeta,
-  da as logoutPagePropsMeta,
-  ie as modalPropsMeta,
-  Ca as nextTheme,
-  Ta as notFoundPagePropsMeta,
-  fa as otpPagePropsMeta,
-  ua as profilePagePropsMeta,
-  wa as readPersistedTheme,
-  Sa as registerPagePropsMeta,
-  ca as resetPasswordPagePropsMeta,
-  Aa as resolveThemeName,
-  ze as resourcePropsMeta,
-  oe as scrollAreaPropsMeta,
-  h as selectPropsMeta,
-  T as separatorPropsMeta,
-  Ge as sessionTimeoutPropsMeta,
-  ba as settingsPagePropsMeta,
-  Je as settingsPropsMeta,
-  Ke as statRowPropsMeta,
-  R as switchPropsMeta,
-  v as tabsPropsMeta,
-  l as textareaPropsMeta,
-  La as themeMeta,
-  Na as themeMode,
-  Qe as useThemeState
+  le as confirmModal,
+  ge as confirmModalPropsMeta,
+  be as dataTablePaginationPropsMeta,
+  Fe as dataTablePropsMeta,
+  De as dataTableToolbarPropsMeta,
+  ka as defineTheme,
+  ee as dialogPropsMeta,
+  oe as dropdownPropsMeta,
+  Ma as emptyStatePropsMeta,
+  da as errorPagePropsMeta,
+  Ta as forgotPasswordPagePropsMeta,
+  Va as formButtonPropsMeta,
+  qa as formGroupPropsMeta,
+  za as formInputPropsMeta,
+  ze as formPropsMeta,
+  Ja as getFormApi,
+  n as inputPropsMeta,
+  va as isDarkTheme,
+  La as isLightTheme,
+  u as labelPropsMeta,
+  Ia as listThemes,
+  fa as loginPagePropsMeta,
+  ua as logoutPagePropsMeta,
+  me as modalPropsMeta,
+  ya as nextTheme,
+  Sa as notFoundPagePropsMeta,
+  ca as otpPagePropsMeta,
+  ha as profilePagePropsMeta,
+  Ea as readPersistedTheme,
+  Qa as registerForm,
+  xa as registerPagePropsMeta,
+  ba as resetPasswordPagePropsMeta,
+  r as resolveSurface,
+  Ba as resolveThemeName,
+  Je as resourcePropsMeta,
+  Ha as restoreAppliedTokens,
+  pe as scrollAreaPropsMeta,
+  R as selectPropsMeta,
+  S as separatorPropsMeta,
+  Qe as sessionTimeoutPropsMeta,
+  Fa as settingsPagePropsMeta,
+  We as settingsPropsMeta,
+  Xe as statRowPropsMeta,
+  w as switchPropsMeta,
+  y as tabsPropsMeta,
+  M as textareaPropsMeta,
+  Oa as themeMeta,
+  Ga as themeMode,
+  Wa as useFormApi,
+  Ye as useThemeState,
+  s as withSurface
 };

package/dist/prui-utilities.css

@@ -0,0 +1,2 @@
+/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
+@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial}}}@layer theme{:root,:host{--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-sm:24rem;--container-md:28rem;--container-lg:32rem;--container-4xl:56rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-wide:.025em;--leading-normal:1.5;--animate-spin:spin 1s linear infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring:where(:not(iframe)){outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.pointer-events-none{pointer-events:none}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.inset-0{inset:0}.top-0{top:0}.top-1\/2{top:50%}.top-3{top:calc(var(--spacing) * 3)}.top-4{top:calc(var(--spacing) * 4)}.right-0{right:0}.right-2{right:calc(var(--spacing) * 2)}.right-3{right:calc(var(--spacing) * 3)}.right-4{right:calc(var(--spacing) * 4)}.left-0{left:0}.left-2{left:calc(var(--spacing) * 2)}.left-2\.5{left:calc(var(--spacing) * 2.5)}.z-10{z-index:10}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.z-\[10000\]{z-index:10000}.z-\[10001\]{z-index:10001}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.m-0{margin:0}.m-auto{margin:auto}.mx-auto{margin-inline:auto}.my-1{margin-block:var(--spacing)}.my-3{margin-block:calc(var(--spacing) * 3)}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:var(--spacing)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mr-2{margin-right:calc(var(--spacing) * 2)}.mb-1{margin-bottom:var(--spacing)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.ml-0\.5{margin-left:calc(var(--spacing) * .5)}.ml-1{margin-left:var(--spacing)}.ml-4{margin-left:calc(var(--spacing) * 4)}.ml-auto{margin-left:auto}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.table{display:table}.h-3{height:calc(var(--spacing) * 3)}.h-3\.5{height:calc(var(--spacing) * 3.5)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-6{height:calc(var(--spacing) * 6)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.h-11{height:calc(var(--spacing) * 11)}.h-12{height:calc(var(--spacing) * 12)}.h-14{height:calc(var(--spacing) * 14)}.h-auto{height:auto}.h-fit{height:fit-content}.h-full{height:100%}.h-px{height:1px}.max-h-60{max-height:calc(var(--spacing) * 60)}.max-h-64{max-height:calc(var(--spacing) * 64)}.max-h-\[85vh\]{max-height:85vh}.min-h-4{min-height:calc(var(--spacing) * 4)}.min-h-20{min-height:calc(var(--spacing) * 20)}.min-h-\[100dvh\]{min-height:100dvh}.min-h-screen{min-height:100vh}.w-3{width:calc(var(--spacing) * 3)}.w-3\.5{width:calc(var(--spacing) * 3.5)}.w-4{width:calc(var(--spacing) * 4)}.w-6{width:calc(var(--spacing) * 6)}.w-8{width:calc(var(--spacing) * 8)}.w-9{width:calc(var(--spacing) * 9)}.w-10{width:calc(var(--spacing) * 10)}.w-12{width:calc(var(--spacing) * 12)}.w-20{width:calc(var(--spacing) * 20)}.w-24{width:calc(var(--spacing) * 24)}.w-28{width:calc(var(--spacing) * 28)}.w-36{width:calc(var(--spacing) * 36)}.w-56{width:calc(var(--spacing) * 56)}.w-64{width:calc(var(--spacing) * 64)}.w-\[min\(420px\,34vw\)\]{width:min(420px,34vw)}.w-full{width:100%}.w-px{width:1px}.max-w-4xl{max-width:var(--container-4xl)}.max-w-lg{max-width:var(--container-lg)}.max-w-md{max-width:var(--container-md)}.max-w-sm{max-width:var(--container-sm)}.max-w-xs{max-width:var(--container-xs)}.min-w-0{min-width:0}.min-w-40{min-width:calc(var(--spacing) * 40)}.min-w-44{min-width:calc(var(--spacing) * 44)}.flex-1{flex:1}.shrink-0{flex-shrink:0}.translate-x-0\.5{--tw-translate-x:calc(var(--spacing) * .5);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-4{--tw-translate-x:calc(var(--spacing) * 4);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.-rotate-90{rotate:-90deg}.rotate-180{rotate:180deg}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.animate-spin{animation:var(--animate-spin)}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.resize-y{resize:vertical}.scrollbar-thin{scrollbar-width:thin}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-\[1fr_auto_1fr\]{grid-template-columns:1fr auto 1fr}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-x-2{column-gap:calc(var(--spacing) * 2)}.gap-x-4{column-gap:calc(var(--spacing) * 4)}.gap-x-6{column-gap:calc(var(--spacing) * 6)}.gap-y-3{row-gap:calc(var(--spacing) * 3)}.gap-y-4{row-gap:calc(var(--spacing) * 4)}:where(.divide-y>:not(:last-child)){--tw-divide-y-reverse:0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px * var(--tw-divide-y-reverse));border-bottom-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)))}:where(.divide-\[var\(--prui-line\)\]>:not(:last-child)){border-color:var(--prui-line)}.justify-self-end{justify-self:flex-end}.justify-self-start{justify-self:flex-start}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.rounded-\[calc\(var\(--prui-radius\)-1px\)\]{border-radius:calc(var(--prui-radius) - 1px)}.rounded-\[var\(--prui-radius\)\]{border-radius:var(--prui-radius)}.rounded-\[var\(--prui-radius-1\)\]{border-radius:var(--prui-radius-1)}.rounded-\[var\(--prui-radius-full\)\]{border-radius:var(--prui-radius-full)}.rounded-\[var\(--prui-s-radius\,var\(--prui-radius\)\)\]{border-radius:var(--prui-s-radius,var(--prui-radius))}.rounded-\[var\(--prui-s-radius\,var\(--prui-radius-full\)\)\]{border-radius:var(--prui-s-radius,var(--prui-radius-full))}.rounded-full{border-radius:3.40282e38px}.rounded-t-\[var\(--prui-radius\)\]{border-top-left-radius:var(--prui-radius);border-top-right-radius:var(--prui-radius)}.border{border-style:var(--tw-border-style);border-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-\[var\(--prui-danger\)\]\/40{border-color:var(--prui-danger)}@supports (color:color-mix(in lab, red, red)){.border-\[var\(--prui-danger\)\]\/40{border-color:color-mix(in oklab, var(--prui-danger) 40%, transparent)}}.border-\[var\(--prui-line\)\]{border-color:var(--prui-line)}.border-\[var\(--prui-ok\)\]\/40{border-color:var(--prui-ok)}@supports (color:color-mix(in lab, red, red)){.border-\[var\(--prui-ok\)\]\/40{border-color:color-mix(in oklab, var(--prui-ok) 40%, transparent)}}.border-\[var\(--prui-s-border\,var\(--prui-brand\)\)\]{border-color:var(--prui-s-border,var(--prui-brand))}.border-\[var\(--prui-warn\)\]\/40{border-color:var(--prui-warn)}@supports (color:color-mix(in lab, red, red)){.border-\[var\(--prui-warn\)\]\/40{border-color:color-mix(in oklab, var(--prui-warn) 40%, transparent)}}.border-transparent{border-color:#0000}.bg-\[var\(--prui-background\)\]{background-color:var(--prui-background)}.bg-\[var\(--prui-brand\)\],.bg-\[var\(--prui-brand\)\]\/12{background-color:var(--prui-brand)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--prui-brand\)\]\/12{background-color:color-mix(in oklab, var(--prui-brand) 12%, transparent)}}.bg-\[var\(--prui-brand\)\]\/15{background-color:var(--prui-brand)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--prui-brand\)\]\/15{background-color:color-mix(in oklab, var(--prui-brand) 15%, transparent)}}.bg-\[var\(--prui-danger\)\]\/10{background-color:var(--prui-danger)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--prui-danger\)\]\/10{background-color:color-mix(in oklab, var(--prui-danger) 10%, transparent)}}.bg-\[var\(--prui-danger\)\]\/15{background-color:var(--prui-danger)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--prui-danger\)\]\/15{background-color:color-mix(in oklab, var(--prui-danger) 15%, transparent)}}.bg-\[var\(--prui-line\)\]{background-color:var(--prui-line)}.bg-\[var\(--prui-ok\)\]\/10{background-color:var(--prui-ok)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--prui-ok\)\]\/10{background-color:color-mix(in oklab, var(--prui-ok) 10%, transparent)}}.bg-\[var\(--prui-ok\)\]\/15{background-color:var(--prui-ok)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--prui-ok\)\]\/15{background-color:color-mix(in oklab, var(--prui-ok) 15%, transparent)}}.bg-\[var\(--prui-raise\)\]{background-color:var(--prui-raise)}.bg-\[var\(--prui-s-bg\,transparent\)\]{background-color:var(--prui-s-bg,transparent)}.bg-\[var\(--prui-s-bg\,var\(--prui-background\)\)\]{background-color:var(--prui-s-bg,var(--prui-background))}.bg-\[var\(--prui-s-bg\,var\(--prui-brand\)\)\]{background-color:var(--prui-s-bg,var(--prui-brand))}.bg-\[var\(--prui-s-bg\,var\(--prui-danger\)\)\]{background-color:var(--prui-s-bg,var(--prui-danger))}.bg-\[var\(--prui-s-bg\,var\(--prui-raise\)\)\]{background-color:var(--prui-s-bg,var(--prui-raise))}.bg-\[var\(--prui-surface\)\]{background-color:var(--prui-surface)}.bg-\[var\(--prui-warn\)\]\/10{background-color:var(--prui-warn)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--prui-warn\)\]\/10{background-color:color-mix(in oklab, var(--prui-warn) 10%, transparent)}}.bg-\[var\(--prui-warn\)\]\/15{background-color:var(--prui-warn)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--prui-warn\)\]\/15{background-color:color-mix(in oklab, var(--prui-warn) 15%, transparent)}}.bg-transparent{background-color:#0000}.bg-white{background-color:var(--color-white)}.object-cover{object-fit:cover}.p-0{padding:0}.p-1{padding:var(--spacing)}.p-2{padding:calc(var(--spacing) * 2)}.p-4{padding:calc(var(--spacing) * 4)}.p-6{padding:calc(var(--spacing) * 6)}.p-8{padding:calc(var(--spacing) * 8)}.px-1{padding-inline:var(--spacing)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-3\.5{padding-inline:calc(var(--spacing) * 3.5)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.px-8{padding-inline:calc(var(--spacing) * 8)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-12{padding-block:calc(var(--spacing) * 12)}.pt-0{padding-top:0}.pt-2{padding-top:calc(var(--spacing) * 2)}.pt-3{padding-top:calc(var(--spacing) * 3)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-8{padding-top:calc(var(--spacing) * 8)}.pt-24{padding-top:calc(var(--spacing) * 24)}.pr-8{padding-right:calc(var(--spacing) * 8)}.pb-1{padding-bottom:var(--spacing)}.pb-2{padding-bottom:calc(var(--spacing) * 2)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pb-4{padding-bottom:calc(var(--spacing) * 4)}.pb-8{padding-bottom:calc(var(--spacing) * 8)}.pl-2{padding-left:calc(var(--spacing) * 2)}.pl-2\.5{padding-left:calc(var(--spacing) * 2.5)}.pl-3{padding-left:calc(var(--spacing) * 3)}.pl-6{padding-left:calc(var(--spacing) * 6)}.pl-8{padding-left:calc(var(--spacing) * 8)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[10px\]{font-size:10px}.leading-normal{--tw-leading:var(--leading-normal);line-height:var(--leading-normal)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-\[0\.1em\]{--tw-tracking:.1em;letter-spacing:.1em}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.whitespace-nowrap{white-space:nowrap}.text-\[var\(--prui-brand\)\]{color:var(--prui-brand)}.text-\[var\(--prui-danger\)\]{color:var(--prui-danger)}.text-\[var\(--prui-dim\)\]{color:var(--prui-dim)}.text-\[var\(--prui-fg\)\]{color:var(--prui-fg)}.text-\[var\(--prui-ok\)\]{color:var(--prui-ok)}.text-\[var\(--prui-s-fg\,\#fff\)\]{color:var(--prui-s-fg,#fff)}.text-\[var\(--prui-s-fg\,var\(--prui-brand\)\)\]{color:var(--prui-s-fg,var(--prui-brand))}.text-\[var\(--prui-s-fg\,var\(--prui-brand-fg\)\)\]{color:var(--prui-s-fg,var(--prui-brand-fg))}.text-\[var\(--prui-s-fg\,var\(--prui-fg\)\)\]{color:var(--prui-s-fg,var(--prui-fg))}.text-\[var\(--prui-warn\)\]{color:var(--prui-warn)}.text-white{color:var(--color-white)}.capitalize{text-transform:capitalize}.uppercase{text-transform:uppercase}.underline-offset-4{text-underline-offset:4px}.accent-\[var\(--prui-brand\)\]{accent-color:var(--prui-brand)}.opacity-50{opacity:.5}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.blur{--tw-blur:blur(8px);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[filter\,background-color\,border-color\]{transition-property:filter,background-color,border-color;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-150{--tw-duration:.15s;transition-duration:.15s}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}.placeholder\:text-\[var\(--prui-dim\)\]::placeholder{color:var(--prui-dim)}.first\:pt-0:first-child{padding-top:0}.last\:border-b-0:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}.last\:pb-0:last-child{padding-bottom:0}@media (hover:hover){.hover\:border-\[var\(--prui-dim\)\]:hover{border-color:var(--prui-dim)}.hover\:bg-\[var\(--prui-brand\)\]\/10:hover{background-color:var(--prui-brand)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-\[var\(--prui-brand\)\]\/10:hover{background-color:color-mix(in oklab, var(--prui-brand) 10%, transparent)}}.hover\:bg-\[var\(--prui-brand\)\]\/20:hover{background-color:var(--prui-brand)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-\[var\(--prui-brand\)\]\/20:hover{background-color:color-mix(in oklab, var(--prui-brand) 20%, transparent)}}.hover\:bg-\[var\(--prui-raise\)\]:hover{background-color:var(--prui-raise)}.hover\:text-\[var\(--prui-fg\)\]:hover{color:var(--prui-fg)}.hover\:underline:hover{text-decoration-line:underline}.hover\:brightness-110:hover{--tw-brightness:brightness(110%);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}}.focus\:border-\[var\(--prui-brand\)\]:focus{border-color:var(--prui-brand)}.focus\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus\:ring-\[var\(--prui-brand\)\]\/30:focus{--tw-ring-color:var(--prui-brand)}@supports (color:color-mix(in lab, red, red)){.focus\:ring-\[var\(--prui-brand\)\]\/30:focus{--tw-ring-color:color-mix(in oklab, var(--prui-brand) 30%, transparent)}}.focus-visible\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-visible\:ring-\[var\(--prui-brand\)\]:focus-visible{--tw-ring-color:var(--prui-brand)}.focus-visible\:ring-offset-1:focus-visible{--tw-ring-offset-width:1px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.active\:brightness-95:active{--tw-brightness:brightness(95%);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-50:disabled{opacity:.5}.disabled\:opacity-60:disabled{opacity:.6}@media (min-width:40rem){.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}.sm\:justify-between{justify-content:space-between}}@media (min-width:48rem){.md\:fixed{position:fixed}.md\:inset-y-0{inset-block:0}.md\:left-0{left:0}.md\:z-30{z-index:30}.md\:col-span-2{grid-column:span 2/span 2}.md\:ml-\[var\(--prui-sidebar-width\)\]{margin-left:var(--prui-sidebar-width)}.md\:block{display:block}.md\:flex{display:flex}.md\:hidden{display:none}.md\:w-56{width:calc(var(--spacing) * 56)}.md\:w-\[var\(--prui-sidebar-width\)\]{width:var(--prui-sidebar-width)}.md\:shrink-0{flex-shrink:0}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:flex-col{flex-direction:column}.md\:flex-row{flex-direction:row}.md\:border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.md\:border-\[var\(--prui-line\)\]{border-color:var(--prui-line)}.md\:bg-\[var\(--prui-surface\)\]{background-color:var(--prui-surface)}.md\:p-6{padding:calc(var(--spacing) * 6)}.md\:px-6{padding-inline:calc(var(--spacing) * 6)}}@media (min-width:64rem){.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-divide-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}

package/dist/prui.css

@@ -50,6 +50,42 @@ body.modal-open { overflow: hidden; }
 .prui-app aside::-webkit-scrollbar-thumb:hover { background: var(--prui-line); }
 .prui-app aside { scrollbar-width: thin; scrollbar-color: var(--prui-raise) transparent; }
 
+/* Surface flexibility layer: per-component overrides via custom properties.
+   Components consume var(--prui-s-*, theme token) so an unset property
+   degrades to the theme default. Textures draw subtle patterns from
+   --prui-tex-c (default: the line token). */
+.prui-tex-dots {
+  background-image: radial-gradient(var(--prui-tex-c, var(--prui-line)) 1px, transparent 1px);
+  background-size: 12px 12px;
+}
+.prui-tex-grid {
+  background-image:
+    linear-gradient(var(--prui-tex-c, var(--prui-line)) 1px, transparent 1px),
+    linear-gradient(90deg, var(--prui-tex-c, var(--prui-line)) 1px, transparent 1px);
+  background-size: 16px 16px;
+}
+.prui-tex-stripes {
+  background-image: repeating-linear-gradient(45deg, var(--prui-tex-c, var(--prui-line)) 0 1px, transparent 1px 10px);
+}
+.prui-tex-diagonal {
+  background-image: repeating-linear-gradient(-45deg, var(--prui-tex-c, var(--prui-line)) 0 1px, transparent 1px 8px);
+}
+.prui-elev-sm { box-shadow: 0 1px 2px rgb(0 0 0 / 0.28); }
+.prui-elev-md { box-shadow: 0 4px 12px rgb(0 0 0 / 0.32); }
+.prui-elev-lg { box-shadow: 0 12px 32px rgb(0 0 0 / 0.4); }
+
+/* prui-card participates in the surface layer */
+.prui-card {
+  background-color: var(--prui-s-bg, var(--prui-surface));
+  color: var(--prui-s-fg, inherit);
+  border-radius: var(--prui-s-radius, var(--prui-radius));
+}
+.prui-f-control {
+  background-color: var(--prui-s-bg, var(--prui-background));
+  color: var(--prui-s-fg, var(--prui-fg));
+  border-radius: var(--prui-s-radius, var(--prui-radius));
+}
+
 /* Theme: control. Direction D "Control Room" — pure black, periwinkle accent. Default theme. */
 .prui-theme-control {
   color-scheme: dark;
@@ -118,3 +154,5 @@ body.modal-open { overflow: hidden; }
   --prui-radius: 6px;
 }
 
+/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
+@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial}}}@layer theme{:root,:host{--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-sm:24rem;--container-md:28rem;--container-lg:32rem;--container-4xl:56rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-wide:.025em;--leading-normal:1.5;--animate-spin:spin 1s linear infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring:where(:not(iframe)){outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.pointer-events-none{pointer-events:none}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.inset-0{inset:0}.top-0{top:0}.top-1\/2{top:50%}.top-3{top:calc(var(--spacing) * 3)}.top-4{top:calc(var(--spacing) * 4)}.right-0{right:0}.right-2{right:calc(var(--spacing) * 2)}.right-3{right:calc(var(--spacing) * 3)}.right-4{right:calc(var(--spacing) * 4)}.left-0{left:0}.left-2{left:calc(var(--spacing) * 2)}.left-2\.5{left:calc(var(--spacing) * 2.5)}.z-10{z-index:10}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.z-\[10000\]{z-index:10000}.z-\[10001\]{z-index:10001}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.m-0{margin:0}.m-auto{margin:auto}.mx-auto{margin-inline:auto}.my-1{margin-block:var(--spacing)}.my-3{margin-block:calc(var(--spacing) * 3)}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:var(--spacing)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mr-2{margin-right:calc(var(--spacing) * 2)}.mb-1{margin-bottom:var(--spacing)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.ml-0\.5{margin-left:calc(var(--spacing) * .5)}.ml-1{margin-left:var(--spacing)}.ml-4{margin-left:calc(var(--spacing) * 4)}.ml-auto{margin-left:auto}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.table{display:table}.h-3{height:calc(var(--spacing) * 3)}.h-3\.5{height:calc(var(--spacing) * 3.5)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-6{height:calc(var(--spacing) * 6)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.h-11{height:calc(var(--spacing) * 11)}.h-12{height:calc(var(--spacing) * 12)}.h-14{height:calc(var(--spacing) * 14)}.h-auto{height:auto}.h-fit{height:fit-content}.h-full{height:100%}.h-px{height:1px}.max-h-60{max-height:calc(var(--spacing) * 60)}.max-h-64{max-height:calc(var(--spacing) * 64)}.max-h-\[85vh\]{max-height:85vh}.min-h-4{min-height:calc(var(--spacing) * 4)}.min-h-20{min-height:calc(var(--spacing) * 20)}.min-h-\[100dvh\]{min-height:100dvh}.min-h-screen{min-height:100vh}.w-3{width:calc(var(--spacing) * 3)}.w-3\.5{width:calc(var(--spacing) * 3.5)}.w-4{width:calc(var(--spacing) * 4)}.w-6{width:calc(var(--spacing) * 6)}.w-8{width:calc(var(--spacing) * 8)}.w-9{width:calc(var(--spacing) * 9)}.w-10{width:calc(var(--spacing) * 10)}.w-12{width:calc(var(--spacing) * 12)}.w-20{width:calc(var(--spacing) * 20)}.w-24{width:calc(var(--spacing) * 24)}.w-28{width:calc(var(--spacing) * 28)}.w-36{width:calc(var(--spacing) * 36)}.w-56{width:calc(var(--spacing) * 56)}.w-64{width:calc(var(--spacing) * 64)}.w-\[min\(420px\,34vw\)\]{width:min(420px,34vw)}.w-full{width:100%}.w-px{width:1px}.max-w-4xl{max-width:var(--container-4xl)}.max-w-lg{max-width:var(--container-lg)}.max-w-md{max-width:var(--container-md)}.max-w-sm{max-width:var(--container-sm)}.max-w-xs{max-width:var(--container-xs)}.min-w-0{min-width:0}.min-w-40{min-width:calc(var(--spacing) * 40)}.min-w-44{min-width:calc(var(--spacing) * 44)}.flex-1{flex:1}.shrink-0{flex-shrink:0}.translate-x-0\.5{--tw-translate-x:calc(var(--spacing) * .5);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-4{--tw-translate-x:calc(var(--spacing) * 4);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.-rotate-90{rotate:-90deg}.rotate-180{rotate:180deg}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.animate-spin{animation:var(--animate-spin)}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.resize-y{resize:vertical}.scrollbar-thin{scrollbar-width:thin}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-\[1fr_auto_1fr\]{grid-template-columns:1fr auto 1fr}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-x-2{column-gap:calc(var(--spacing) * 2)}.gap-x-4{column-gap:calc(var(--spacing) * 4)}.gap-x-6{column-gap:calc(var(--spacing) * 6)}.gap-y-3{row-gap:calc(var(--spacing) * 3)}.gap-y-4{row-gap:calc(var(--spacing) * 4)}:where(.divide-y>:not(:last-child)){--tw-divide-y-reverse:0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px * var(--tw-divide-y-reverse));border-bottom-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)))}:where(.divide-\[var\(--prui-line\)\]>:not(:last-child)){border-color:var(--prui-line)}.justify-self-end{justify-self:flex-end}.justify-self-start{justify-self:flex-start}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.rounded-\[calc\(var\(--prui-radius\)-1px\)\]{border-radius:calc(var(--prui-radius) - 1px)}.rounded-\[var\(--prui-radius\)\]{border-radius:var(--prui-radius)}.rounded-\[var\(--prui-radius-1\)\]{border-radius:var(--prui-radius-1)}.rounded-\[var\(--prui-radius-full\)\]{border-radius:var(--prui-radius-full)}.rounded-\[var\(--prui-s-radius\,var\(--prui-radius\)\)\]{border-radius:var(--prui-s-radius,var(--prui-radius))}.rounded-\[var\(--prui-s-radius\,var\(--prui-radius-full\)\)\]{border-radius:var(--prui-s-radius,var(--prui-radius-full))}.rounded-full{border-radius:3.40282e38px}.rounded-t-\[var\(--prui-radius\)\]{border-top-left-radius:var(--prui-radius);border-top-right-radius:var(--prui-radius)}.border{border-style:var(--tw-border-style);border-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-\[var\(--prui-danger\)\]\/40{border-color:var(--prui-danger)}@supports (color:color-mix(in lab, red, red)){.border-\[var\(--prui-danger\)\]\/40{border-color:color-mix(in oklab, var(--prui-danger) 40%, transparent)}}.border-\[var\(--prui-line\)\]{border-color:var(--prui-line)}.border-\[var\(--prui-ok\)\]\/40{border-color:var(--prui-ok)}@supports (color:color-mix(in lab, red, red)){.border-\[var\(--prui-ok\)\]\/40{border-color:color-mix(in oklab, var(--prui-ok) 40%, transparent)}}.border-\[var\(--prui-s-border\,var\(--prui-brand\)\)\]{border-color:var(--prui-s-border,var(--prui-brand))}.border-\[var\(--prui-warn\)\]\/40{border-color:var(--prui-warn)}@supports (color:color-mix(in lab, red, red)){.border-\[var\(--prui-warn\)\]\/40{border-color:color-mix(in oklab, var(--prui-warn) 40%, transparent)}}.border-transparent{border-color:#0000}.bg-\[var\(--prui-background\)\]{background-color:var(--prui-background)}.bg-\[var\(--prui-brand\)\],.bg-\[var\(--prui-brand\)\]\/12{background-color:var(--prui-brand)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--prui-brand\)\]\/12{background-color:color-mix(in oklab, var(--prui-brand) 12%, transparent)}}.bg-\[var\(--prui-brand\)\]\/15{background-color:var(--prui-brand)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--prui-brand\)\]\/15{background-color:color-mix(in oklab, var(--prui-brand) 15%, transparent)}}.bg-\[var\(--prui-danger\)\]\/10{background-color:var(--prui-danger)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--prui-danger\)\]\/10{background-color:color-mix(in oklab, var(--prui-danger) 10%, transparent)}}.bg-\[var\(--prui-danger\)\]\/15{background-color:var(--prui-danger)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--prui-danger\)\]\/15{background-color:color-mix(in oklab, var(--prui-danger) 15%, transparent)}}.bg-\[var\(--prui-line\)\]{background-color:var(--prui-line)}.bg-\[var\(--prui-ok\)\]\/10{background-color:var(--prui-ok)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--prui-ok\)\]\/10{background-color:color-mix(in oklab, var(--prui-ok) 10%, transparent)}}.bg-\[var\(--prui-ok\)\]\/15{background-color:var(--prui-ok)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--prui-ok\)\]\/15{background-color:color-mix(in oklab, var(--prui-ok) 15%, transparent)}}.bg-\[var\(--prui-raise\)\]{background-color:var(--prui-raise)}.bg-\[var\(--prui-s-bg\,transparent\)\]{background-color:var(--prui-s-bg,transparent)}.bg-\[var\(--prui-s-bg\,var\(--prui-background\)\)\]{background-color:var(--prui-s-bg,var(--prui-background))}.bg-\[var\(--prui-s-bg\,var\(--prui-brand\)\)\]{background-color:var(--prui-s-bg,var(--prui-brand))}.bg-\[var\(--prui-s-bg\,var\(--prui-danger\)\)\]{background-color:var(--prui-s-bg,var(--prui-danger))}.bg-\[var\(--prui-s-bg\,var\(--prui-raise\)\)\]{background-color:var(--prui-s-bg,var(--prui-raise))}.bg-\[var\(--prui-surface\)\]{background-color:var(--prui-surface)}.bg-\[var\(--prui-warn\)\]\/10{background-color:var(--prui-warn)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--prui-warn\)\]\/10{background-color:color-mix(in oklab, var(--prui-warn) 10%, transparent)}}.bg-\[var\(--prui-warn\)\]\/15{background-color:var(--prui-warn)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--prui-warn\)\]\/15{background-color:color-mix(in oklab, var(--prui-warn) 15%, transparent)}}.bg-transparent{background-color:#0000}.bg-white{background-color:var(--color-white)}.object-cover{object-fit:cover}.p-0{padding:0}.p-1{padding:var(--spacing)}.p-2{padding:calc(var(--spacing) * 2)}.p-4{padding:calc(var(--spacing) * 4)}.p-6{padding:calc(var(--spacing) * 6)}.p-8{padding:calc(var(--spacing) * 8)}.px-1{padding-inline:var(--spacing)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-3\.5{padding-inline:calc(var(--spacing) * 3.5)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.px-8{padding-inline:calc(var(--spacing) * 8)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-12{padding-block:calc(var(--spacing) * 12)}.pt-0{padding-top:0}.pt-2{padding-top:calc(var(--spacing) * 2)}.pt-3{padding-top:calc(var(--spacing) * 3)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-8{padding-top:calc(var(--spacing) * 8)}.pt-24{padding-top:calc(var(--spacing) * 24)}.pr-8{padding-right:calc(var(--spacing) * 8)}.pb-1{padding-bottom:var(--spacing)}.pb-2{padding-bottom:calc(var(--spacing) * 2)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pb-4{padding-bottom:calc(var(--spacing) * 4)}.pb-8{padding-bottom:calc(var(--spacing) * 8)}.pl-2{padding-left:calc(var(--spacing) * 2)}.pl-2\.5{padding-left:calc(var(--spacing) * 2.5)}.pl-3{padding-left:calc(var(--spacing) * 3)}.pl-6{padding-left:calc(var(--spacing) * 6)}.pl-8{padding-left:calc(var(--spacing) * 8)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[10px\]{font-size:10px}.leading-normal{--tw-leading:var(--leading-normal);line-height:var(--leading-normal)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-\[0\.1em\]{--tw-tracking:.1em;letter-spacing:.1em}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.whitespace-nowrap{white-space:nowrap}.text-\[var\(--prui-brand\)\]{color:var(--prui-brand)}.text-\[var\(--prui-danger\)\]{color:var(--prui-danger)}.text-\[var\(--prui-dim\)\]{color:var(--prui-dim)}.text-\[var\(--prui-fg\)\]{color:var(--prui-fg)}.text-\[var\(--prui-ok\)\]{color:var(--prui-ok)}.text-\[var\(--prui-s-fg\,\#fff\)\]{color:var(--prui-s-fg,#fff)}.text-\[var\(--prui-s-fg\,var\(--prui-brand\)\)\]{color:var(--prui-s-fg,var(--prui-brand))}.text-\[var\(--prui-s-fg\,var\(--prui-brand-fg\)\)\]{color:var(--prui-s-fg,var(--prui-brand-fg))}.text-\[var\(--prui-s-fg\,var\(--prui-fg\)\)\]{color:var(--prui-s-fg,var(--prui-fg))}.text-\[var\(--prui-warn\)\]{color:var(--prui-warn)}.text-white{color:var(--color-white)}.capitalize{text-transform:capitalize}.uppercase{text-transform:uppercase}.underline-offset-4{text-underline-offset:4px}.accent-\[var\(--prui-brand\)\]{accent-color:var(--prui-brand)}.opacity-50{opacity:.5}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.blur{--tw-blur:blur(8px);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[filter\,background-color\,border-color\]{transition-property:filter,background-color,border-color;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-150{--tw-duration:.15s;transition-duration:.15s}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}.placeholder\:text-\[var\(--prui-dim\)\]::placeholder{color:var(--prui-dim)}.first\:pt-0:first-child{padding-top:0}.last\:border-b-0:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}.last\:pb-0:last-child{padding-bottom:0}@media (hover:hover){.hover\:border-\[var\(--prui-dim\)\]:hover{border-color:var(--prui-dim)}.hover\:bg-\[var\(--prui-brand\)\]\/10:hover{background-color:var(--prui-brand)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-\[var\(--prui-brand\)\]\/10:hover{background-color:color-mix(in oklab, var(--prui-brand) 10%, transparent)}}.hover\:bg-\[var\(--prui-brand\)\]\/20:hover{background-color:var(--prui-brand)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-\[var\(--prui-brand\)\]\/20:hover{background-color:color-mix(in oklab, var(--prui-brand) 20%, transparent)}}.hover\:bg-\[var\(--prui-raise\)\]:hover{background-color:var(--prui-raise)}.hover\:text-\[var\(--prui-fg\)\]:hover{color:var(--prui-fg)}.hover\:underline:hover{text-decoration-line:underline}.hover\:brightness-110:hover{--tw-brightness:brightness(110%);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}}.focus\:border-\[var\(--prui-brand\)\]:focus{border-color:var(--prui-brand)}.focus\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus\:ring-\[var\(--prui-brand\)\]\/30:focus{--tw-ring-color:var(--prui-brand)}@supports (color:color-mix(in lab, red, red)){.focus\:ring-\[var\(--prui-brand\)\]\/30:focus{--tw-ring-color:color-mix(in oklab, var(--prui-brand) 30%, transparent)}}.focus-visible\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-visible\:ring-\[var\(--prui-brand\)\]:focus-visible{--tw-ring-color:var(--prui-brand)}.focus-visible\:ring-offset-1:focus-visible{--tw-ring-offset-width:1px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.active\:brightness-95:active{--tw-brightness:brightness(95%);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-50:disabled{opacity:.5}.disabled\:opacity-60:disabled{opacity:.6}@media (min-width:40rem){.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}.sm\:justify-between{justify-content:space-between}}@media (min-width:48rem){.md\:fixed{position:fixed}.md\:inset-y-0{inset-block:0}.md\:left-0{left:0}.md\:z-30{z-index:30}.md\:col-span-2{grid-column:span 2/span 2}.md\:ml-\[var\(--prui-sidebar-width\)\]{margin-left:var(--prui-sidebar-width)}.md\:block{display:block}.md\:flex{display:flex}.md\:hidden{display:none}.md\:w-56{width:calc(var(--spacing) * 56)}.md\:w-\[var\(--prui-sidebar-width\)\]{width:var(--prui-sidebar-width)}.md\:shrink-0{flex-shrink:0}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:flex-col{flex-direction:column}.md\:flex-row{flex-direction:row}.md\:border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.md\:border-\[var\(--prui-line\)\]{border-color:var(--prui-line)}.md\:bg-\[var\(--prui-surface\)\]{background-color:var(--prui-surface)}.md\:p-6{padding:calc(var(--spacing) * 6)}.md\:px-6{padding-inline:calc(var(--spacing) * 6)}}@media (min-width:64rem){.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-divide-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}

package/dist/theme/base.css

@@ -34,3 +34,39 @@ body.modal-open { overflow: hidden; }
 .prui-app aside ::-webkit-scrollbar-thumb:hover,
 .prui-app aside::-webkit-scrollbar-thumb:hover { background: var(--prui-line); }
 .prui-app aside { scrollbar-width: thin; scrollbar-color: var(--prui-raise) transparent; }
+
+/* Surface flexibility layer: per-component overrides via custom properties.
+   Components consume var(--prui-s-*, theme token) so an unset property
+   degrades to the theme default. Textures draw subtle patterns from
+   --prui-tex-c (default: the line token). */
+.prui-tex-dots {
+  background-image: radial-gradient(var(--prui-tex-c, var(--prui-line)) 1px, transparent 1px);
+  background-size: 12px 12px;
+}
+.prui-tex-grid {
+  background-image:
+    linear-gradient(var(--prui-tex-c, var(--prui-line)) 1px, transparent 1px),
+    linear-gradient(90deg, var(--prui-tex-c, var(--prui-line)) 1px, transparent 1px);
+  background-size: 16px 16px;
+}
+.prui-tex-stripes {
+  background-image: repeating-linear-gradient(45deg, var(--prui-tex-c, var(--prui-line)) 0 1px, transparent 1px 10px);
+}
+.prui-tex-diagonal {
+  background-image: repeating-linear-gradient(-45deg, var(--prui-tex-c, var(--prui-line)) 0 1px, transparent 1px 8px);
+}
+.prui-elev-sm { box-shadow: 0 1px 2px rgb(0 0 0 / 0.28); }
+.prui-elev-md { box-shadow: 0 4px 12px rgb(0 0 0 / 0.32); }
+.prui-elev-lg { box-shadow: 0 12px 32px rgb(0 0 0 / 0.4); }
+
+/* prui-card participates in the surface layer */
+.prui-card {
+  background-color: var(--prui-s-bg, var(--prui-surface));
+  color: var(--prui-s-fg, inherit);
+  border-radius: var(--prui-s-radius, var(--prui-radius));
+}
+.prui-f-control {
+  background-color: var(--prui-s-bg, var(--prui-background));
+  color: var(--prui-s-fg, var(--prui-fg));
+  border-radius: var(--prui-s-radius, var(--prui-radius));
+}

package/dist/theme/index.d.ts

@@ -5,6 +5,57 @@
  */
 export declare const PRUI_THEMES: readonly ["control", "workshop", "ember", "daylight"];
 export type ThemeName = (typeof PRUI_THEMES)[number];
+/** Token names understood by defineTheme / applyThemeTokens. */
+export declare const PRUI_TOKENS: readonly ["background", "surface", "raise", "line", "fg", "dim", "brand", "brand-fg", "ok", "warn", "danger"];
+export type ThemeTokenName = (typeof PRUI_TOKENS)[number];
+export interface ThemeTokens {
+    background?: string;
+    surface?: string;
+    raise?: string;
+    line?: string;
+    fg?: string;
+    dim?: string;
+    brand?: string;
+    "brand-fg"?: string;
+    ok?: string;
+    warn?: string;
+    danger?: string;
+    /** Base corner radius, any CSS length. */
+    radius?: string;
+    /** Secondary-text opacity, 0 to 1. */
+    "dim-op"?: string | number;
+    /** Whether the custom theme reads as light or dark (default: dark). */
+    mode?: "light" | "dark";
+}
+/**
+ * Register a custom theme under a name. The theme becomes first-class:
+ * applyTheme({ theme: name }), the persisted-theme reader, and listThemes()
+ * all accept it. Call again with the same name to update it.
+ */
+export declare function defineTheme(name: string, tokens: ThemeTokens): string;
+/** All theme names: the four built-ins plus every theme from defineTheme. */
+export declare function listThemes(): ThemeName[];
+/**
+ * Overlay token values on top of the CURRENT theme without switching it.
+ * Vars are written inline on the target (documentElement by default), so a
+ * single call re-skins the running app. Pass a storageKey to persist the
+ * overlay and re-apply it on the next page load; pass null to skip
+ * persistence. Returns the list of vars written.
+ */
+export declare function applyThemeTokens(tokens: ThemeTokens, options?: {
+    target?: HTMLElement | null;
+    storageKey?: string | null;
+}): string[];
+/** Remove a token overlay written by applyThemeTokens and forget its persistence. */
+export declare function clearAppliedTokens(options?: {
+    target?: HTMLElement | null;
+    storageKey?: string | null;
+}): void;
+/** Re-apply a persisted token overlay (call once at startup if you use it). */
+export declare function restoreAppliedTokens(options?: {
+    target?: HTMLElement | null;
+    storageKey?: string;
+}): ThemeTokens | null;
 export type ThemeMode = "light" | "dark";
 /**
  * A theme default may be a named theme or the shorthand 'dark' / 'light',