frutjam 2.7.1-beta.1 → 3.0.0

package/packages/js/modal.js

@@ -0,0 +1,8 @@
+export function createModal(el) {
+  return {
+    open: () => el.showModal(),
+    close: () => el.close(),
+    toggle: () => (el.open ? el.close() : el.showModal()),
+    isOpen: () => el.open,
+  }
+}

package/packages/js/tabs.js

@@ -0,0 +1,33 @@
+export function createTabs(tabsEl, panelsEl) {
+  const getTabs = () => Array.from(tabsEl.querySelectorAll('.tab'))
+  const getPanels = () => (panelsEl ? Array.from(panelsEl.children) : [])
+
+  function activate(index) {
+    getTabs().forEach((tab, i) => {
+      tab.classList.toggle('tab-active', i === index)
+      tab.setAttribute('aria-selected', String(i === index))
+    })
+    getPanels().forEach((panel, i) => {
+      panel.hidden = i !== index
+    })
+  }
+
+  tabsEl.addEventListener('click', (e) => {
+    const tab = e.target.closest('.tab')
+    if (tab) activate(getTabs().indexOf(tab))
+  })
+
+  return {
+    activate,
+    next() {
+      const all = getTabs()
+      const current = all.findIndex((t) => t.classList.contains('tab-active'))
+      activate((current + 1) % all.length)
+    },
+    prev() {
+      const all = getTabs()
+      const current = all.findIndex((t) => t.classList.contains('tab-active'))
+      activate((current - 1 + all.length) % all.length)
+    },
+  }
+}

package/packages/js/toast.js

@@ -0,0 +1,19 @@
+export function createToastManager(containerEl) {
+  function show(message, { duration = 3000, type = '' } = {}) {
+    const el = document.createElement('div')
+    el.className = ['alert', type && `alert-${type}`].filter(Boolean).join(' ')
+    el.textContent = message
+    containerEl.appendChild(el)
+    if (duration > 0) setTimeout(() => el.remove(), duration)
+    return el
+  }
+
+  return {
+    show,
+    success: (msg, opts) => show(msg, { ...opts, type: 'success' }),
+    error: (msg, opts) => show(msg, { ...opts, type: 'error' }),
+    warning: (msg, opts) => show(msg, { ...opts, type: 'warning' }),
+    info: (msg, opts) => show(msg, { ...opts, type: 'info' }),
+    dismiss: (el) => el?.remove(),
+  }
+}

package/packages/js/tooltip.js

@@ -0,0 +1,8 @@
+export function createTooltip(el) {
+  return {
+    show: () => el.classList.add('tooltip-open'),
+    hide: () => el.classList.remove('tooltip-open'),
+    toggle: () => el.classList.toggle('tooltip-open'),
+    isOpen: () => el.classList.contains('tooltip-open'),
+  }
+}

package/packages/react/index.js

@@ -0,0 +1,8 @@
+export { useModal } from './useModal.js'
+export { useDrawer } from './useDrawer.js'
+export { useCollapsible } from './useCollapsible.js'
+export { useTooltip } from './useTooltip.js'
+export { useTabs } from './useTabs.js'
+export { useToast } from './useToast.js'
+export { useCarousel } from './useCarousel.js'
+export { useCombobox } from './useCombobox.js'

package/packages/react/useCarousel.js

@@ -0,0 +1,23 @@
+import { useRef, useCallback, useState } from 'react'
+
+export function useCarousel() {
+  const ref = useRef(null)
+  const [current, setCurrent] = useState(0)
+
+  const goTo = useCallback((index) => {
+    if (!ref.current) return
+    const items = Array.from(ref.current.querySelectorAll('.carousel-item'))
+    if (!items.length) return
+    const next = Math.max(0, Math.min(index, items.length - 1))
+    setCurrent(next)
+    items[next].scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'start' })
+  }, [])
+
+  return {
+    ref,
+    current,
+    goTo,
+    next: useCallback(() => goTo(current + 1), [current, goTo]),
+    prev: useCallback(() => goTo(current - 1), [current, goTo]),
+  }
+}

package/packages/react/useCollapsible.js

@@ -0,0 +1,12 @@
+import { useRef, useCallback } from 'react'
+
+export function useCollapsible() {
+  const ref = useRef(null)
+  return {
+    ref,
+    open: useCallback(() => ref.current?.classList.add('collapsible-open'), []),
+    close: useCallback(() => ref.current?.classList.remove('collapsible-open'), []),
+    toggle: useCallback(() => ref.current?.classList.toggle('collapsible-open'), []),
+    isOpen: () => ref.current?.classList.contains('collapsible-open') ?? false,
+  }
+}

package/packages/react/useCombobox.js

@@ -0,0 +1,69 @@
+import { useState, useCallback } from 'react'
+
+export function useCombobox({ items = [], filterFn } = {}) {
+  const [open, setOpen] = useState(false)
+  const [query, setQuery] = useState('')
+  const [activeIndex, setActiveIndex] = useState(-1)
+  const [value, setValue] = useState('')
+
+  const filtered = filterFn
+    ? filterFn(items, query)
+    : items.filter((item) =>
+        String(item.label ?? item).toLowerCase().includes(query.toLowerCase())
+      )
+
+  const select = useCallback((item) => {
+    const label = item.label ?? String(item)
+    setValue(label)
+    setQuery(label)
+    setOpen(false)
+    setActiveIndex(-1)
+  }, [])
+
+  const handleKeyDown = useCallback((e) => {
+    if (e.key === 'ArrowDown') {
+      e.preventDefault()
+      if (!open) { setOpen(true); return }
+      setActiveIndex((i) => Math.min(i + 1, filtered.length - 1))
+    } else if (e.key === 'ArrowUp') {
+      e.preventDefault()
+      setActiveIndex((i) => Math.max(i - 1, 0))
+    } else if (e.key === 'Enter' && activeIndex >= 0) {
+      e.preventDefault()
+      select(filtered[activeIndex])
+    } else if (e.key === 'Escape') {
+      setOpen(false)
+      setActiveIndex(-1)
+    }
+  }, [open, filtered, activeIndex, select])
+
+  return {
+    open,
+    value,
+    query,
+    filtered,
+    activeIndex,
+    select,
+    containerProps: {
+      className: open ? 'combobox combobox-open' : 'combobox',
+    },
+    inputProps: {
+      value: query,
+      onChange: (e) => { setQuery(e.target.value); setOpen(true); setActiveIndex(-1) },
+      onKeyDown: handleKeyDown,
+      onFocus: () => setOpen(true),
+      onBlur: () => setTimeout(() => setOpen(false), 150),
+      'aria-expanded': open,
+      'aria-autocomplete': 'list',
+      role: 'combobox',
+    },
+    optionProps: (item, index) => ({
+      className: activeIndex === index ? 'combobox-option combobox-option-active' : 'combobox-option',
+      role: 'option',
+      'aria-selected': activeIndex === index,
+      onMouseDown: (e) => e.preventDefault(),
+      onClick: () => select(item),
+      onMouseEnter: () => setActiveIndex(index),
+    }),
+  }
+}

package/packages/react/useDrawer.js

@@ -0,0 +1 @@
+export { useModal as useDrawer } from './useModal.js'

package/packages/react/useModal.js

@@ -0,0 +1,12 @@
+import { useRef, useCallback } from 'react'
+
+export function useModal() {
+  const ref = useRef(null)
+  return {
+    ref,
+    open: useCallback(() => ref.current?.showModal(), []),
+    close: useCallback(() => ref.current?.close(), []),
+    toggle: useCallback(() => (ref.current?.open ? ref.current.close() : ref.current?.showModal()), []),
+    isOpen: () => ref.current?.open ?? false,
+  }
+}

package/packages/react/useTabs.js

@@ -0,0 +1,23 @@
+import { useState, useCallback } from 'react'
+
+export function useTabs(initialIndex = 0) {
+  const [active, setActive] = useState(initialIndex)
+
+  const activate = useCallback((index) => setActive(index), [])
+
+  return {
+    active,
+    activate,
+    isActive: (index) => active === index,
+    tabProps: (index) => ({
+      className: active === index ? 'tab tab-active' : 'tab',
+      onClick: () => activate(index),
+      'aria-selected': active === index,
+      role: 'tab',
+    }),
+    panelProps: (index) => ({
+      hidden: active !== index,
+      role: 'tabpanel',
+    }),
+  }
+}

package/packages/react/useToast.js

@@ -0,0 +1,27 @@
+import { useState, useCallback, useRef } from 'react'
+
+export function useToast() {
+  const [toasts, setToasts] = useState([])
+  const idRef = useRef(0)
+
+  const dismiss = useCallback((id) => {
+    setToasts((prev) => prev.filter((t) => t.id !== id))
+  }, [])
+
+  const show = useCallback((message, { duration = 3000, type = '' } = {}) => {
+    const id = ++idRef.current
+    setToasts((prev) => [...prev, { id, message, type }])
+    if (duration > 0) setTimeout(() => dismiss(id), duration)
+    return id
+  }, [dismiss])
+
+  return {
+    toasts,
+    show,
+    dismiss,
+    success: (msg, opts) => show(msg, { ...opts, type: 'success' }),
+    error: (msg, opts) => show(msg, { ...opts, type: 'error' }),
+    warning: (msg, opts) => show(msg, { ...opts, type: 'warning' }),
+    info: (msg, opts) => show(msg, { ...opts, type: 'info' }),
+  }
+}

package/packages/react/useTooltip.js

@@ -0,0 +1,12 @@
+import { useRef, useCallback } from 'react'
+
+export function useTooltip() {
+  const ref = useRef(null)
+  return {
+    ref,
+    show: useCallback(() => ref.current?.classList.add('tooltip-open'), []),
+    hide: useCallback(() => ref.current?.classList.remove('tooltip-open'), []),
+    toggle: useCallback(() => ref.current?.classList.toggle('tooltip-open'), []),
+    isOpen: () => ref.current?.classList.contains('tooltip-open') ?? false,
+  }
+}

package/dist/frutjam.local.css

@@ -1,2 +0,0 @@
-/*! frutjam v2.7.1-beta.1 (c) 2025 Nezanuha | Released under the MIT License | https://frutjam.com */
-@custom-variant focus-or-within{&:focus,&:focus-within{@slot}}@layer base{:root,[data-theme]{--palette-shade-light-color:white;--palette-shade-dark-color:black;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color-scheme:var(--scheme-color,light);color:var(--color-on-base);background-color:var(--color-base);*,::after,::backdrop,::before,::file-selector-button{box-sizing:border-box;border:0 solid;padding:0;margin:0}:host,html{line-height:1.5;font-family:var( --default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji" );-webkit-tap-highlight-color:#0000}main,footer{background-color:var(--color-base)}p{text-wrap-style:pretty;color:light-dark( color-mix(in oklch,var(--palette-shade-light-color) 20%,var(--color-on-base) 80%),color-mix(in oklch,var(--palette-shade-dark-color) 20%,var(--color-on-base) 80%) );font-size:var(--text-base)}menu,ol,ul{list-style:none;color:light-dark( color-mix(in oklch,var(--palette-shade-light-color) 20%,var(--color-on-base) 80%),color-mix(in oklch,var(--palette-shade-dark-color) 20%,var(--color-on-base) 80%) );font-size:var(--text-base)}strong{color:var(--color-on-base)}code{font-weight:600;background-color:var(--color-base-soft);color:var(--color-on-base-soft);padding:0.2em 0.4em;border-radius:calc(var(--border-radius) * 1.5)}img,video{max-width:100%;height:auto}textarea{resize:vertical}--color-base-soft:light-dark(color-mix(in oklch,black 5%,var(--color-base-600) 25%),color-mix(in oklch,black 10%,var(--color-base-400) 75%));--color-on-base-soft:var(--color-on-base);--color-base-active:light-dark(color-mix(in oklch,black 5%,var(--color-base-600) 45%),color-mix(in oklch,black 10%,var(--color-base-400) 85%));--color-base-50:color-mix(in oklch,var(--palette-shade-light-color) 72%,var(--color-base) 28%);--color-base-100:color-mix(in oklch,var(--palette-shade-light-color) 59%,var(--color-base) 41%);--color-base-200:color-mix(in oklch,var(--palette-shade-light-color) 48%,var(--color-base) 52%);--color-base-300:color-mix(in oklch,var(--palette-shade-light-color) 36%,var(--color-base) 64%);--color-base-400:color-mix(in oklch,var(--palette-shade-light-color) 20%,var(--color-base) 80%);--color-base-500:var(--color-base);--color-base-600:color-mix(in oklch,var(--palette-shade-dark-color) 20%,var(--color-base) 80%);--color-base-700:color-mix(in oklch,var(--palette-shade-dark-color) 36%,var(--color-base) 64%);--color-base-800:color-mix(in oklch,var(--palette-shade-dark-color) 48%,var(--color-base) 52%);--color-base-900:color-mix(in oklch,var(--palette-shade-dark-color) 59%,var(--color-base) 41%);--color-base-950:color-mix(in oklch,var(--palette-shade-dark-color) 72%,var(--color-base) 28%);--color-neutral-soft:color-mix(in oklab,var(--color-neutral-500) 10%,transparent);--color-on-neutral-soft:light-dark(var(--color-neutral-800),var(--color-neutral-500));--color-neutral-active:color-mix(in oklab,var(--color-neutral-500) 90%,transparent);--color-neutral-50:color-mix(in oklch,var(--palette-shade-light-color) 72%,var(--color-neutral) 28%);--color-neutral-100:color-mix(in oklch,var(--palette-shade-light-color) 59%,var(--color-neutral) 41%);--color-neutral-200:color-mix(in oklch,var(--palette-shade-light-color) 48%,var(--color-neutral) 52%);--color-neutral-300:color-mix(in oklch,var(--palette-shade-light-color) 36%,var(--color-neutral) 64%);--color-neutral-400:color-mix(in oklch,var(--palette-shade-light-color) 20%,var(--color-neutral) 80%);--color-neutral-500:var(--color-neutral);--color-neutral-600:color-mix(in oklch,var(--palette-shade-dark-color) 20%,var(--color-neutral) 80%);--color-neutral-700:color-mix(in oklch,var(--palette-shade-dark-color) 36%,var(--color-neutral) 64%);--color-neutral-800:color-mix(in oklch,var(--palette-shade-dark-color) 48%,var(--color-neutral) 52%);--color-neutral-900:color-mix(in oklch,var(--palette-shade-dark-color) 59%,var(--color-neutral) 41%);--color-neutral-950:color-mix(in oklch,var(--palette-shade-dark-color) 72%,var(--color-neutral) 28%);--color-primary-soft:color-mix(in oklab,var(--color-primary-500) 10%,transparent);--color-on-primary-soft:light-dark(var(--color-primary-800),var(--color-primary-500));--color-primary-active:color-mix(in oklab,var(--color-primary-500) 90%,transparent);--color-primary-50:color-mix(in oklch,var(--palette-shade-light-color) 72%,var(--color-primary) 28%);--color-primary-100:color-mix(in oklch,var(--palette-shade-light-color) 59%,var(--color-primary) 41%);--color-primary-200:color-mix(in oklch,var(--palette-shade-light-color) 48%,var(--color-primary) 52%);--color-primary-300:color-mix(in oklch,var(--palette-shade-light-color) 36%,var(--color-primary) 64%);--color-primary-400:color-mix(in oklch,var(--palette-shade-light-color) 20%,var(--color-primary) 80%);--color-primary-500:var(--color-primary);--color-primary-600:color-mix(in oklch,var(--palette-shade-dark-color) 20%,var(--color-primary) 80%);--color-primary-700:color-mix(in oklch,var(--palette-shade-dark-color) 36%,var(--color-primary) 64%);--color-primary-800:color-mix(in oklch,var(--palette-shade-dark-color) 48%,var(--color-primary) 52%);--color-primary-900:color-mix(in oklch,var(--palette-shade-dark-color) 59%,var(--color-primary) 41%);--color-primary-950:color-mix(in oklch,var(--palette-shade-dark-color) 72%,var(--color-primary) 28%);--color-secondary-soft:color-mix(in oklab,var(--color-secondary-500) 10%,transparent);--color-on-secondary-soft:light-dark(var(--color-secondary-800),var(--color-secondary-500));--color-secondary-active:color-mix(in oklab,var(--color-secondary-500) 90%,transparent);--color-secondary-50:color-mix(in oklch,var(--palette-shade-light-color) 72%,var(--color-secondary) 28%);--color-secondary-100:color-mix(in oklch,var(--palette-shade-light-color) 59%,var(--color-secondary) 41%);--color-secondary-200:color-mix(in oklch,var(--palette-shade-light-color) 48%,var(--color-secondary) 52%);--color-secondary-300:color-mix(in oklch,var(--palette-shade-light-color) 36%,var(--color-secondary) 64%);--color-secondary-400:color-mix(in oklch,var(--palette-shade-light-color) 20%,var(--color-secondary) 80%);--color-secondary-500:var(--color-secondary);--color-secondary-600:color-mix(in oklch,var(--palette-shade-dark-color) 20%,var(--color-secondary) 80%);--color-secondary-700:color-mix(in oklch,var(--palette-shade-dark-color) 36%,var(--color-secondary) 64%);--color-secondary-800:color-mix(in oklch,var(--palette-shade-dark-color) 48%,var(--color-secondary) 52%);--color-secondary-900:color-mix(in oklch,var(--palette-shade-dark-color) 59%,var(--color-secondary) 41%);--color-secondary-950:color-mix(in oklch,var(--palette-shade-dark-color) 72%,var(--color-secondary) 28%);--color-accent-soft:color-mix(in oklab,var(--color-accent-500) 10%,transparent);--color-on-accent-soft:light-dark(var(--color-accent-800),var(--color-accent-500));--color-accent-active:color-mix(in oklab,var(--color-accent-500) 90%,transparent);--color-accent-50:color-mix(in oklch,var(--palette-shade-light-color) 72%,var(--color-accent) 28%);--color-accent-100:color-mix(in oklch,var(--palette-shade-light-color) 59%,var(--color-accent) 41%);--color-accent-200:color-mix(in oklch,var(--palette-shade-light-color) 48%,var(--color-accent) 52%);--color-accent-300:color-mix(in oklch,var(--palette-shade-light-color) 36%,var(--color-accent) 64%);--color-accent-400:color-mix(in oklch,var(--palette-shade-light-color) 20%,var(--color-accent) 80%);--color-accent-500:var(--color-accent);--color-accent-600:color-mix(in oklch,var(--palette-shade-dark-color) 20%,var(--color-accent) 80%);--color-accent-700:color-mix(in oklch,var(--palette-shade-dark-color) 36%,var(--color-accent) 64%);--color-accent-800:color-mix(in oklch,var(--palette-shade-dark-color) 48%,var(--color-accent) 52%);--color-accent-900:color-mix(in oklch,var(--palette-shade-dark-color) 59%,var(--color-accent) 41%);--color-accent-950:color-mix(in oklch,var(--palette-shade-dark-color) 72%,var(--color-accent) 28%);--color-info-soft:color-mix(in oklab,var(--color-info-500) 10%,transparent);--color-on-info-soft:light-dark(var(--color-info-800),var(--color-info-500));--color-info-active:color-mix(in oklab,var(--color-info-500) 90%,transparent);--color-info-50:color-mix(in oklch,var(--palette-shade-light-color) 72%,var(--color-info) 28%);--color-info-100:color-mix(in oklch,var(--palette-shade-light-color) 59%,var(--color-info) 41%);--color-info-200:color-mix(in oklch,var(--palette-shade-light-color) 48%,var(--color-info) 52%);--color-info-300:color-mix(in oklch,var(--palette-shade-light-color) 36%,var(--color-info) 64%);--color-info-400:color-mix(in oklch,var(--palette-shade-light-color) 20%,var(--color-info) 80%);--color-info-500:var(--color-info);--color-info-600:color-mix(in oklch,var(--palette-shade-dark-color) 20%,var(--color-info) 80%);--color-info-700:color-mix(in oklch,var(--palette-shade-dark-color) 36%,var(--color-info) 64%);--color-info-800:color-mix(in oklch,var(--palette-shade-dark-color) 48%,var(--color-info) 52%);--color-info-900:color-mix(in oklch,var(--palette-shade-dark-color) 59%,var(--color-info) 41%);--color-info-950:color-mix(in oklch,var(--palette-shade-dark-color) 72%,var(--color-info) 28%);--color-success-soft:color-mix(in oklab,var(--color-success-500) 10%,transparent);--color-on-success-soft:light-dark(var(--color-success-800),var(--color-success-500));--color-success-active:color-mix(in oklab,var(--color-success-500) 90%,transparent);--color-success-50:color-mix(in oklch,var(--palette-shade-light-color) 72%,var(--color-success) 28%);--color-success-100:color-mix(in oklch,var(--palette-shade-light-color) 59%,var(--color-success) 41%);--color-success-200:color-mix(in oklch,var(--palette-shade-light-color) 48%,var(--color-success) 52%);--color-success-300:color-mix(in oklch,var(--palette-shade-light-color) 36%,var(--color-success) 64%);--color-success-400:color-mix(in oklch,var(--palette-shade-light-color) 20%,var(--color-success) 80%);--color-success-500:var(--color-success);--color-success-600:color-mix(in oklch,var(--palette-shade-dark-color) 20%,var(--color-success) 80%);--color-success-700:color-mix(in oklch,var(--palette-shade-dark-color) 36%,var(--color-success) 64%);--color-success-800:color-mix(in oklch,var(--palette-shade-dark-color) 48%,var(--color-success) 52%);--color-success-900:color-mix(in oklch,var(--palette-shade-dark-color) 59%,var(--color-success) 41%);--color-success-950:color-mix(in oklch,var(--palette-shade-dark-color) 72%,var(--color-success) 28%);--color-warning-soft:color-mix(in oklab,var(--color-warning-500) 10%,transparent);--color-on-warning-soft:light-dark(var(--color-warning-800),var(--color-warning-500));--color-warning-active:color-mix(in oklab,var(--color-warning-500) 90%,transparent);--color-warning-50:color-mix(in oklch,var(--palette-shade-light-color) 72%,var(--color-warning) 28%);--color-warning-100:color-mix(in oklch,var(--palette-shade-light-color) 59%,var(--color-warning) 41%);--color-warning-200:color-mix(in oklch,var(--palette-shade-light-color) 48%,var(--color-warning) 52%);--color-warning-300:color-mix(in oklch,var(--palette-shade-light-color) 36%,var(--color-warning) 64%);--color-warning-400:color-mix(in oklch,var(--palette-shade-light-color) 20%,var(--color-warning) 80%);--color-warning-500:var(--color-warning);--color-warning-600:color-mix(in oklch,var(--palette-shade-dark-color) 20%,var(--color-warning) 80%);--color-warning-700:color-mix(in oklch,var(--palette-shade-dark-color) 36%,var(--color-warning) 64%);--color-warning-800:color-mix(in oklch,var(--palette-shade-dark-color) 48%,var(--color-warning) 52%);--color-warning-900:color-mix(in oklch,var(--palette-shade-dark-color) 59%,var(--color-warning) 41%);--color-warning-950:color-mix(in oklch,var(--palette-shade-dark-color) 72%,var(--color-warning) 28%);--color-error-soft:color-mix(in oklab,var(--color-error-500) 10%,transparent);--color-on-error-soft:light-dark(var(--color-error-800),var(--color-error-500));--color-error-active:color-mix(in oklab,var(--color-error-500) 90%,transparent);--color-error-50:color-mix(in oklch,var(--palette-shade-light-color) 72%,var(--color-error) 28%);--color-error-100:color-mix(in oklch,var(--palette-shade-light-color) 59%,var(--color-error) 41%);--color-error-200:color-mix(in oklch,var(--palette-shade-light-color) 48%,var(--color-error) 52%);--color-error-300:color-mix(in oklch,var(--palette-shade-light-color) 36%,var(--color-error) 64%);--color-error-400:color-mix(in oklch,var(--palette-shade-light-color) 20%,var(--color-error) 80%);--color-error-500:var(--color-error);--color-error-600:color-mix(in oklch,var(--palette-shade-dark-color) 20%,var(--color-error) 80%);--color-error-700:color-mix(in oklch,var(--palette-shade-dark-color) 36%,var(--color-error) 64%);--color-error-800:color-mix(in oklch,var(--palette-shade-dark-color) 48%,var(--color-error) 52%);--color-error-900:color-mix(in oklch,var(--palette-shade-dark-color) 59%,var(--color-error) 41%);--color-error-950:color-mix(in oklch,var(--palette-shade-dark-color) 72%,var(--color-error) 28%)}}@layer theme{&:not([data-theme]),:is([data-theme="snowberry"],[data-theme="light"]){--scheme-color:light;--border-radius:0.25rem;--color-base:oklch(1 0 0);--color-on-base:oklch(0.22 0 0);--color-neutral:oklch(0.15 0 0);--color-on-neutral:oklch(1 0 0);--color-primary:oklch(51.1% 0.262 276.966);--color-on-primary:oklch(96.2% 0.018 272.314);--color-secondary:oklch(0.591 0.293 322.896);--color-on-secondary:oklch(1 0 0);--color-accent:oklch(0.541 0.281 293.009);--color-on-accent:oklch(1 0 0);--color-info:oklch(0.685 0.169 237.323);--color-on-info:oklch(0.15 0 0);--color-success:oklch(0.792 0.209 151.711);--color-on-success:oklch(0.15 0 0);--color-warning:oklch(0.852 0.199 91.936);--color-on-warning:oklch(0.15 0 0);--color-error:oklch(0.577 0.245 27.325);--color-on-error:oklch(1 0 0)}}@layer theme{:is([data-theme="darkberry"],[data-theme="dark"]){--scheme-color:dark;--border-radius:0.25rem;--color-base:oklch(10.889% 0.00301 17.398);--color-on-base:oklch(98% 0.01 270);--color-neutral:oklch(85% 0 0);--color-on-neutral:oklch(20% 0 0);--color-primary:oklch(66.385% 0.18368 285.592);--color-on-primary:oklch(10% 0.01 270);--color-secondary:oklch(65% 0.18 220);--color-on-secondary:oklch(10% 0.01 220);--color-accent:oklch(75% 0.18 50);--color-on-accent:oklch(10% 0.01 50);--color-info:oklch(70% 0.15 250);--color-on-info:oklch(10% 0.01 250);--color-success:oklch(65% 0.18 140);--color-on-success:oklch(10% 0.01 140);--color-warning:oklch(75% 0.20 85);--color-on-warning:oklch(10% 0.01 85);--color-error:oklch(60% 0.22 30);--color-on-error:oklch(10% 0.01 30)}}@custom-variant dark ( &:where( [data-theme=dark],[data-theme=dark] *,[data-theme=darkberry],[data-theme=darkberry] * ) );@theme inline{--color-base:var(--color-base-500);--color-base-50:var(--color-base-50);--color-base-100:var(--color-base-100);--color-base-200:var(--color-base-200);--color-base-300:var(--color-base-300);--color-base-400:var(--color-base-400);--color-base-500:var(--color-base-500);--color-base-600:var(--color-base-600);--color-base-700:var(--color-base-700);--color-base-800:var(--color-base-800);--color-base-900:var(--color-base-900);--color-base-950:var(--color-base-950);--color-neutral:var(--color-neutral-500);--color-neutral-50:var(--color-neutral-50);--color-neutral-100:var(--color-neutral-100);--color-neutral-200:var(--color-neutral-200);--color-neutral-300:var(--color-neutral-300);--color-neutral-400:var(--color-neutral-400);--color-neutral-500:var(--color-neutral-500);--color-neutral-600:var(--color-neutral-600);--color-neutral-700:var(--color-neutral-700);--color-neutral-800:var(--color-neutral-800);--color-neutral-900:var(--color-neutral-900);--color-neutral-950:var(--color-neutral-950);--color-primary:var(--color-primary-500);--color-primary-50:var(--color-primary-50);--color-primary-100:var(--color-primary-100);--color-primary-200:var(--color-primary-200);--color-primary-300:var(--color-primary-300);--color-primary-400:var(--color-primary-400);--color-primary-500:var(--color-primary-500);--color-primary-600:var(--color-primary-600);--color-primary-700:var(--color-primary-700);--color-primary-800:var(--color-primary-800);--color-primary-900:var(--color-primary-900);--color-primary-950:var(--color-primary-950);--color-secondary:var(--color-secondary-500);--color-secondary-50:var(--color-secondary-50);--color-secondary-100:var(--color-secondary-100);--color-secondary-200:var(--color-secondary-200);--color-secondary-300:var(--color-secondary-300);--color-secondary-400:var(--color-secondary-400);--color-secondary-500:var(--color-secondary-500);--color-secondary-600:var(--color-secondary-600);--color-secondary-700:var(--color-secondary-700);--color-secondary-800:var(--color-secondary-800);--color-secondary-900:var(--color-secondary-900);--color-secondary-950:var(--color-secondary-950);--color-accent:var(--color-accent-500);--color-accent-50:var(--color-accent-50);--color-accent-100:var(--color-accent-100);--color-accent-200:var(--color-accent-200);--color-accent-300:var(--color-accent-300);--color-accent-400:var(--color-accent-400);--color-accent-500:var(--color-accent-500);--color-accent-600:var(--color-accent-600);--color-accent-700:var(--color-accent-700);--color-accent-800:var(--color-accent-800);--color-accent-900:var(--color-accent-900);--color-accent-950:var(--color-accent-950);--color-info:var(--color-info-500);--color-info-50:var(--color-info-50);--color-info-100:var(--color-info-100);--color-info-200:var(--color-info-200);--color-info-300:var(--color-info-300);--color-info-400:var(--color-info-400);--color-info-500:var(--color-info-500);--color-info-600:var(--color-info-600);--color-info-700:var(--color-info-700);--color-info-800:var(--color-info-800);--color-info-900:var(--color-info-900);--color-info-950:var(--color-info-950);--color-success:var(--color-success-500);--color-success-50:var(--color-success-50);--color-success-100:var(--color-success-100);--color-success-200:var(--color-success-200);--color-success-300:var(--color-success-300);--color-success-400:var(--color-success-400);--color-success-500:var(--color-success-500);--color-success-600:var(--color-success-600);--color-success-700:var(--color-success-700);--color-success-800:var(--color-success-800);--color-success-900:var(--color-success-900);--color-success-950:var(--color-success-950);--color-warning:var(--color-warning-500);--color-warning-50:var(--color-warning-50);--color-warning-100:var(--color-warning-100);--color-warning-200:var(--color-warning-200);--color-warning-300:var(--color-warning-300);--color-warning-400:var(--color-warning-400);--color-warning-500:var(--color-warning-500);--color-warning-600:var(--color-warning-600);--color-warning-700:var(--color-warning-700);--color-warning-800:var(--color-warning-800);--color-warning-900:var(--color-warning-900);--color-warning-950:var(--color-warning-950);--color-error:var(--color-error-500);--color-error-50:var(--color-error-50);--color-error-100:var(--color-error-100);--color-error-200:var(--color-error-200);--color-error-300:var(--color-error-300);--color-error-400:var(--color-error-400);--color-error-500:var(--color-error-500);--color-error-600:var(--color-error-600);--color-error-700:var(--color-error-700);--color-error-800:var(--color-error-800);--color-error-900:var(--color-error-900);--color-error-950:var(--color-error-950)}@layer theme{:is([data-theme="blackberry"]){--scheme-color:dark;--border-radius:0.25rem;--color-base:oklch(0 0 0);--color-on-base:oklch(98% 0.01 270);--color-neutral:oklch(85% 0 0);--color-on-neutral:oklch(20% 0 0);--color-primary:oklch(66.385% 0.18368 285.592);--color-on-primary:oklch(10% 0.01 270);--color-secondary:oklch(65% 0.18 220);--color-on-secondary:oklch(10% 0.01 220);--color-accent:oklch(75% 0.18 50);--color-on-accent:oklch(10% 0.01 50);--color-info:oklch(70% 0.15 250);--color-on-info:oklch(10% 0.01 250);--color-success:oklch(65% 0.18 140);--color-on-success:oklch(10% 0.01 140);--color-warning:oklch(75% 0.20 85);--color-on-warning:oklch(10% 0.01 85);--color-error:oklch(60% 0.22 30);--color-on-error:oklch(10% 0.01 30)}}@utility accordion{--radius-accordion:calc(var(--border-radius) * 2);--color-accordion-soft:var(--color-base-soft);--color-accordion-active:var(--color-base-active);display:grid;width:100%;background-color:var(--color-base);border-width:1px;border-style:solid;border-color:var(--color-accordion-active);border-radius:var(--radius-accordion);cursor:pointer;& > details{&:not(:last-child){border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:var(--color-accordion-active)}text-wrap:pretty;& > *:not(summary){padding-inline:1rem;padding-bottom:1rem}& > summary::marker{content:none}& > p{font-size:var(--text-base)}& > summary{display:flex;gap:1rem;align-items:center;justify-content:space-between;padding:1rem;font-weight:500;&::after{content:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9IjAgMCAyMCAyMCIgc3Ryb2tlLXdpZHRoPSIxLjUiIHN0cm9rZT0icmdiYSg1Myw1Myw1MywxKSIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij4KICA8cGF0aCBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGQ9Im0xOS41IDguMjUtNy41IDcuNS03LjUtNy41Ii8+Cjwvc3ZnPg==");display:inline-block;color:inherit}}}& > details[open]{& > summary{padding-bottom:1rem;&::after{transform:rotate(180deg);transform-origin:center;transition:transform 300ms}}}}@utility badge-primary{--color-badge:var(--color-primary);--color-badge-active:var(--color-primary-active);--color-on-badge:var(--color-on-primary);--color-badge-soft:var(--color-primary-soft);--color-on-badge-soft:light-dark(var(--color-primary-800),var(--color-primary));--badge-variant-text:light-dark(var(--color-primary-800),var(--color-primary-400))}@utility badge-secondary{--color-badge:var(--color-secondary);--color-badge-active:var(--color-secondary-active);--color-on-badge:var(--color-on-secondary);--color-badge-soft:var(--color-secondary-soft);--color-on-badge-soft:light-dark(var(--color-secondary-800),var(--color-secondary-400));--badge-variant-text:light-dark(var(--color-secondary-800),var(--color-secondary-400))}@utility badge-accent{--color-badge:var(--color-accent);--color-badge-active:var(--color-accent-active);--color-on-badge:var(--color-on-accent);--color-badge-soft:var(--color-accent-soft);--color-on-badge-soft:light-dark(var(--color-accent-800),var(--color-accent-400));--badge-variant-text:light-dark(var(--color-accent-800),var(--color-accent-400))}@utility badge-info{--color-badge:var(--color-info);--color-badge-active:var(--color-info-active);--color-on-badge:var(--color-on-info);--color-badge-soft:var(--color-info-soft);--color-on-badge-soft:light-dark(var(--color-info-800),var(--color-info-400));--badge-variant-text:light-dark(var(--color-info-800),var(--color-info-400))}@utility badge-neutral{--color-badge:var(--color-neutral);--color-badge-active:var(--color-neutral-active);--color-on-badge:var(--color-on-neutral);--color-badge-soft:var(--color-neutral-soft);--color-on-badge-soft:light-dark(var(--color-neutral-800),var(--color-neutral-400));--badge-variant-text:light-dark(var(--color-neutral-800),var(--color-neutral-400))}@utility badge-success{--color-badge:var(--color-success);--color-badge-active:var(--color-success-active);--color-on-badge:var(--color-on-success);--color-badge-soft:var(--color-success-soft);--color-on-badge-soft:light-dark(var(--color-success-800),var(--color-success-400));--badge-variant-text:light-dark(var(--color-success-800),var(--color-success-400))}@utility badge-warning{--color-badge:var(--color-warning);--color-badge-active:var(--color-warning-active);--color-on-badge:var(--color-on-warning);--color-badge-soft:var(--color-warning-soft);--color-on-badge-soft:light-dark(var(--color-warning-800),var(--color-warning-400));--badge-variant-text:light-dark(var(--color-warning-800),var(--color-warning-400))}@utility badge-error{--color-badge:var(--color-error);--color-badge-active:var(--color-error-active);--color-on-badge:var(--color-on-error);--color-badge-soft:var(--color-error-soft);--color-on-badge-soft:light-dark(var(--color-error-800),var(--color-error-400));--badge-variant-text:light-dark(var(--color-error-800),var(--color-error-400))}@utility badge-square{--badge--padding-inline:var(--badge-square--padding,0.625rem);--badge--padding-block:var(--badge-square--padding,0.625rem);--badge--width:var(--badge-square--padding);--badge--height:var(--badge-square--padding)}@utility badge-rounded{--badge--radius:calc(infinity * 1px)}@utility badge-circle{--badge--padding-inline:var(--badge--padding-inline,0.625rem);--badge--padding-block:var(--badge--padding-inline,0.625rem);--badge--width:var(--badge--padding-block);--badge--height:var(--badge--padding-block);--badge--radius:calc(infinity * 1px)}@utility badge-xs{--badge--padding-inline:0.5rem;--badge--padding-block:0.125rem;--badge--font-size:0.625rem;--badge--line-height:1.3;--badge-square--padding:0.125rem}@utility badge-sm{--badge--padding-inline:0.625rem;--badge--padding-block:0.25rem;--badge--font-size:0.75rem;--badge--line-height:1.3;--badge-square--padding:0.25rem}@utility badge-md{--badge--padding-inline:0.75rem;--badge--padding-block:0.375rem;--badge--font-size:0.875rem;--badge--line-height:1.3;--badge-square--padding:0.375rem}@utility badge-lg{--badge--padding-inline:0.875rem;--badge--padding-block:0.5rem;--badge--font-size:1rem;--badge--line-height:1.2;--badge-square--padding:0.5rem}@utility badge-xl{--badge--padding-inline:1rem;--badge--padding-block:0.625rem;--badge--font-size:1.125rem;--badge--line-height:1.2;--badge-square--padding:0.625rem}@utility badge-2xl{--badge--padding-inline:1.125rem;--badge--padding-block:0.75rem;--badge--font-size:1.25rem;--badge--line-height:1.2;--badge-square--padding:0.75rem}@utility badge-dashed{background-color:transparent;color:var(--badge-variant-text);outline-color:var(--color-badge);outline-style:dashed;outline-width:1px}@utility badge-outline{background-color:transparent;color:var(--badge-variant-text);outline-color:var(--color-badge);outline-style:solid;outline-width:1px}@utility badge-soft{background-color:var(--color-badge-soft);color:var(--color-on-badge-soft)}@utility badge-ghost{background-color:transparent;color:var(--badge-variant-text)}@utility badge{--radius-badge:calc(var(--border-radius) * 2);--color-badge:var(--color-base-soft);--color-on-badge:var(--color-on-base);--color-badge-active:var(--color-base-active);--color-badge-soft:var(--color-base-soft);--color-on-badge-soft:var(--color-on-base);--badge-variant-text:var(--color-on-base);background-color:var(--color-badge);color:var(--color-on-badge);padding-inline:var(--badge--padding-inline,0.75rem);padding-block:var(--badge--padding-block,0.375rem);font-size:var(--badge--font-size,0.875rem);line-height:calc(var(--badge--font-size,0.875rem) * var(--badge--line-height,1.5));outline-width:var(--badge--outline-width);outline-style:var(--badge--outline-style);outline-color:var(--badge--outline-color);display:inline-flex;gap:0.5rem;border-radius:var(--badge--radius,var(--radius-badge));align-items:center;justify-content:center;vertical-align:middle;text-align:center;width:var(--badge--width,fit-content);height:var(--badge--height)}@utility btn-primary{--color-btn:var(--color-primary);--color-btn-active:var(--color-primary-active);--color-on-btn:var(--color-on-primary);--color-btn-soft:var(--color-primary-soft);--color-on-btn-soft:var(--color-on-primary-soft);--btn-variant-text:light-dark(var(--color-primary-800),var(--color-primary-400))}@utility btn-secondary{--color-btn:var(--color-secondary);--color-btn-active:var(--color-secondary-active);--color-on-btn:var(--color-on-secondary);--color-btn-soft:var(--color-secondary-soft);--color-on-btn-soft:var(--color-on-secondary-soft);--btn-variant-text:light-dark(var(--color-secondary-800),var(--color-secondary-400))}@utility btn-accent{--color-btn:var(--color-accent);--color-btn-active:var(--color-accent-active);--color-on-btn:var(--color-on-accent);--color-btn-soft:var(--color-accent-soft);--color-on-btn-soft:var(--color-on-accent-soft);--btn-variant-text:light-dark(var(--color-accent-800),var(--color-accent-400))}@utility btn-info{--color-btn:var(--color-info);--color-btn-active:var(--color-info-active);--color-on-btn:var(--color-on-info);--color-btn-soft:var(--color-info-soft);--color-on-btn-soft:var(--color-on-info-soft);--btn-variant-text:light-dark(var(--color-info-800),var(--color-info-400))}@utility btn-neutral{--color-btn:var(--color-neutral);--color-btn-active:var(--color-neutral-active);--color-on-btn:var(--color-on-neutral);--color-btn-soft:var(--color-neutral-soft);--color-on-btn-soft:var(--color-on-neutral-soft);--btn-variant-text:light-dark(var(--color-neutral-800),var(--color-neutral-400))}@utility btn-success{--color-btn:var(--color-success);--color-btn-active:var(--color-success-active);--color-on-btn:var(--color-on-success);--color-btn-soft:var(--color-success-soft);--color-on-btn-soft:var(--color-on-success-soft);--btn-variant-text:light-dark(var(--color-success-800),var(--color-success-400))}@utility btn-warning{--color-btn:var(--color-warning);--color-btn-active:var(--color-warning-active);--color-on-btn:var(--color-on-warning);--color-btn-soft:var(--color-warning-soft);--color-on-btn-soft:var(--color-on-warning-soft);--btn-variant-text:light-dark(var(--color-warning-800),var(--color-warning-400))}@utility btn-error{--color-btn:var(--color-error);--color-btn-active:var(--color-error-active);--color-on-btn:var(--color-on-error);--color-btn-soft:var(--color-error-soft);--color-on-btn-soft:var(--color-on-error-soft);--btn-variant-text:light-dark(var(--color-error-800),var(--color-error-400))}@utility btn-square{--btn--padding-inline:var(--btn-square--padding-block,0.625rem);--btn--padding-block:var(--btn-square--padding-block,0.625rem)}@utility btn-rounded{--btn--radius:calc(infinity * 1px)}@utility btn-pill{--btn--radius:calc(infinity * 1px)}@utility btn-circle{--btn--padding-inline:var(--btn-circle--padding-block,0.625rem);--btn--padding-block:var(--btn-circle--padding-block,0.625rem);--btn--radius:calc(infinity * 1px)}@utility btn-xs{--btn--padding-inline:0.875rem;--btn--padding-block:0.375rem;--btn--font-size:0.75rem;--btn--line-height:1.3;--btn-square--padding-block:0.375rem;--btn-circle--padding-block:0.375rem}@utility btn-sm{--btn--padding-inline:1rem;--btn--padding-block:0.5rem;--btn--font-size:0.875rem;--btn--line-height:1.4;--btn-square--padding-block:0.5rem;--btn-circle--padding-block:0.5rem}@utility btn-md{--btn--padding-inline:1.125rem;--btn--padding-block:0.625rem;--btn--font-size:1rem;--btn--line-height:1.5;--btn-square--padding-block:0.625rem;--btn-circle--padding-block:0.625rem}@utility btn-lg{--btn--padding-inline:1.25rem;--btn--padding-block:0.75rem;--btn--font-size:1.125rem;--btn--line-height:1.5;--btn-square--padding-block:0.75rem;--btn-circle--padding-block:0.75rem}@utility btn-xl{--btn--padding-inline:1.375rem;--btn--padding-block:0.875rem;--btn--font-size:1.25rem;--btn--line-height:1.5;--btn-square--padding-block:0.875rem;--btn-circle--padding-block:0.875rem}@utility btn-2xl{--btn--padding-inline:1.5rem;--btn--padding-block:1rem;--btn--font-size:1.375rem;--btn--line-height:1.5;--btn-square--padding-block:1rem;--btn-circle--padding-block:1rem}@utility btn-wide{--btn--max-width:320px;--btn--width:100%}@utility btn-block{--btn--width:100%;--btn--display:block}@utility btn-active{background-color:var(--color-btn-active);color:var(--color-on-btn);outline-style:none;@variant hover{background-color:var(--color-btn-active)}}@utility btn-disabled{opacity:var(--btn--opacity);cursor:var(--btn--cursor);pointer-events:var(--btn--pointer-events)}@utility btn-soft{background-color:var(--color-btn-soft);color:var(--color-on-btn-soft);@variant hover{background-color:var(--color-btn-active);color:var(--color-on-btn)}}@utility btn-dashed{background-color:transparent;color:var(--btn-variant-text);outline-color:var(--color-btn-active);outline-style:dashed;outline-width:1px;@variant hover{outline-style:none}}@utility btn-outline{background-color:transparent;color:var(--btn-variant-text);outline-color:var(--color-btn-active);outline-style:solid;outline-width:1px;@variant hover{outline-style:none}}@utility btn-ghost{background-color:transparent;color:var(--btn-variant-text)}@utility btn-link{background-color:transparent;color:var(--btn-variant-text);@variant hover{background-color:transparent;text-decoration:underline;text-underline-offset:4px;color:var(--btn-variant-text)}}@custom-variant btn-disabled{&:is(:disabled,[disabled],.btn-disabled){@slot}}@utility btn{--radius-btn:calc(var(--border-radius) * 2);--color-btn:var(--color-base-soft);--color-on-btn:var(--color-on-base);--color-btn-active:var(--color-base-active);--color-btn-soft:var(--color-base-soft);--color-on-btn-soft:var(--color-on-base-soft);--btn-variant-text:var(--color-on-base);background-color:var(--color-btn);color:var(--color-on-btn);@variant hover{background-color:var(--color-btn-active);color:var(--color-on-btn)}border-radius:var(--btn--radius,var(--radius-btn));display:var(--btn--display,inline-flex);padding-inline:var(--btn--padding-inline,1.125rem);padding-block:var(--btn--padding-block,0.625rem);font-size:var(--btn--font-size,1rem);line-height:calc(var(--btn--font-size,1rem) * var(--btn--line-height,1.5));width:var(--btn--width);max-width:var(--btn--max-width);position:relative;gap:0.375rem;flex-shrink:0;align-items:center;justify-content:center;flex-wrap:nowrap;vertical-align:middle;font-weight:500;text-align:center;overflow:hidden;cursor:pointer;box-sizing:border-box;transition:all 250ms ease-out;@variant btn-disabled{--btn--opacity:20%;--btn--cursor:not-allowed;--btn--pointer-events:none;opacity:var(--btn--opacity);cursor:var(--btn--cursor);pointer-events:var(--btn--pointer-events)}&:is(input[type="checkbox"],input[type="radio"]){appearance:none;@variant after{content:attr(aria-label)}@variant checked{isolation:isolate}}@variant focus-visible{outline-width:2px;outline-style:solid;outline-color:light-dark( var(--color-base-950,currentColor),var(--color-base-50,currentColor) );outline-offset:3px;isolation:isolate}}@utility breadcrumb-link{display:flex;align-items:center;gap:0.5rem;line-height:1.125rem;@variant hover{text-decoration-line:underline;text-underline-offset:4px;cursor:pointer}@variant focus{outline-style:none;@variant forced-colors{outline:2px solid transparent;outline-offset:2px}}@variant focus-visible{outline:2px solid currentColor;outline-offset:2px}}@utility breadcrumb-current{display:flex;align-items:center;gap:0.5rem;line-height:1.125rem}@utility breadcrumb-list{display:flex;min-height:min-content;align-items:center;white-space:nowrap}@utility breadcrumb-item{display:flex;align-items:center;@variant before{content:"";margin-right:0.75rem;margin-left:0.5rem;height:0.375rem;width:0.375rem;display:block;transform:rotate(45deg);transition:transform 300ms;border-top:1px solid;border-right:1px solid;background-color:oklch(0 0 0 / 0);color:light-dark(var(--color-base-800),var(--color-base-400))}@variant first{@variant before{content:none}}&:has([class*="breadcrumb-separator"]){@variant before{content:none}}@variant rtl{@variant before{transform:rotate(-135deg)}}&:has([aria-current="page"],[class*="breadcrumb-current"]){color:light-dark(var(--color-base-950),var(--color-base-50))}}@utility breadcrumb-separator{display:flex;align-items:center;margin-inline:0.5rem;color:light-dark(var(--color-base-800),var(--color-base-400))}@utility breadcrumb{padding-block:0.5rem;max-width:100%;overflow-x:auto;font-size:0.875rem;color:light-dark(var(--color-base-900),var(--color-base-200))}@utility card-xs{:is(.card-body){--card-body-padding:0.5rem;--card-body-font-size:0.6875rem}:is(.card-title){--card-title-font-size:0.875rem}}@utility card-sm{:is(.card-body){--card-body-padding:1rem;--card-body-font-size:0.75rem}:is(.card-title){--card-title-font-size:1rem}}@utility card-md{:is(.card-body){--card-body-padding:1.5rem;--card-body-font-size:0.875rem}:is(.card-title){--card-title-font-size:1.125rem}}@utility card-lg{:is(.card-body){--card-body-padding:2rem;--card-body-font-size:1rem}:is(.card-title){--card-title-font-size:1.25rem}}@utility card-xl{:is(.card-body){--card-body-padding:2.5rem;--card-body-font-size:1.125rem}:is(.card-title){--card-title-font-size:1.375rem}}@utility card-body{display:flex;gap:0.5rem;flex:auto;flex-direction:column;padding:var(--card-body-padding,1.5rem);:where(p){flex-grow:1;font-size:var(--card-body-font-size,1rem)}}@utility card-title{display:flex;align-items:center;gap:0.5rem;font-weight:600;font-size:var(--card-title-font-size,1.125rem)}@utility card-outline{border-width:1px;border-style:solid;border-color:var(--color-base-active)}@utility card-dashed{border-width:1px;border-style:dashed;border-color:var(--color-base-active)}@utility card-primary{--color-card:var(--color-primary)}@utility card-secondary{--color-card:var(--color-secondary)}@utility card-accent{--color-card:var(--color-accent)}@utility card-info{--color-card:var(--color-info)}@utility card-neutral{--color-card:var(--color-neutral)}@utility card-success{--color-card:var(--color-success)}@utility card-warning{--color-card:var(--color-warning)}@utility card-error{--color-card:var(--color-error)}@utility card{--radius-card:calc(var(--border-radius) * 4);--color-card:var(--color-base);position:relative;display:flex;flex-direction:column;border-radius:var(--radius-card);overflow:hidden;background-color:var(--color-card);:where(figure:first-child){overflow:hidden;border-start-start-radius:inherit;border-start-end-radius:inherit;border-end-start-radius:unset;border-end-end-radius:unset}:where(figure:last-child){overflow:hidden;border-start-start-radius:unset;border-start-end-radius:unset;border-end-start-radius:inherit;border-end-end-radius:inherit}}@utility checkbox-primary{--color-checkbox:light-dark(var(--color-primary-50),color-mix(in oklch,black 10%,var(--color-primary-400) 20%));--color-on-checkbox:var(--color-on-primary);--color-checkbox-active:var(--color-primary-active);--checkbox--box-shadow:0 0 0 0px var(--color-primary-50),0 0 0 calc(1px + 0px) var(--color-primary-600),0 0 var(--color-primary-50);@variant focus-visible{--checkbox--box-shadow:0 0 0 0px var(--color-primary-50),0 0 0 calc(1px + 0px) var(--color-primary-700),0 0 var(--color-primary-50)}@variant checked-or-aria-checked{--checkbox--bg-color:var(--color-primary);@variant forced-colors{@variant before{--checkbox--bg-color:light-dark(var(--color-primary-600),var(--color-primary-200))}}}}@utility checkbox-secondary{--color-checkbox:light-dark(var(--color-secondary-50),color-mix(in oklch,black 10%,var(--color-secondary-400) 20%));--color-on-checkbox:var(--color-on-secondary);--color-checkbox-active:var(--color-secondary-active);--checkbox--box-shadow:0 0 0 0px var(--color-secondary-50),0 0 0 calc(1px + 0px) var(--color-secondary-600),0 0 var(--color-secondary-50);@variant focus-visible{--checkbox--box-shadow:0 0 0 0px var(--color-secondary-50),0 0 0 calc(1px + 0px) var(--color-secondary-700),0 0 var(--color-secondary-50)}@variant checked-or-aria-checked{--checkbox--bg-color:var(--color-secondary);@variant forced-colors{@variant before{--checkbox--bg-color:light-dark(var(--color-secondary-600),var(--color-secondary-200))}}}}@utility checkbox-accent{--color-checkbox:light-dark(var(--color-accent-50),color-mix(in oklch,black 10%,var(--color-accent-400) 20%));--color-on-checkbox:var(--color-on-accent);--color-checkbox-active:var(--color-accent-active);--checkbox--box-shadow:0 0 0 0px var(--color-accent-50),0 0 0 calc(1px + 0px) var(--color-accent-600),0 0 var(--color-accent-50);@variant focus-visible{--checkbox--box-shadow:0 0 0 0px var(--color-accent-50),0 0 0 calc(1px + 0px) var(--color-accent-700),0 0 var(--color-accent-50)}@variant checked-or-aria-checked{--checkbox--bg-color:var(--color-accent);@variant forced-colors{@variant before{--checkbox--bg-color:light-dark(var(--color-accent-600),var(--color-accent-200))}}}}@utility checkbox-info{--color-checkbox:light-dark(var(--color-info-50),color-mix(in oklch,black 10%,var(--color-info-400) 20%));--color-on-checkbox:var(--color-on-info);--color-checkbox-active:var(--color-info-active);--checkbox--box-shadow:0 0 0 0px var(--color-info-50),0 0 0 calc(1px + 0px) var(--color-info-600),0 0 var(--color-info-50);@variant focus-visible{--checkbox--box-shadow:0 0 0 0px var(--color-info-50),0 0 0 calc(1px + 0px) var(--color-info-700),0 0 var(--color-info-50)}@variant checked-or-aria-checked{--checkbox--bg-color:var(--color-info);@variant forced-colors{@variant before{--checkbox--bg-color:light-dark(var(--color-info-600),var(--color-info-200))}}}}@utility checkbox-neutral{--color-checkbox:light-dark(var(--color-neutral-50),color-mix(in oklch,black 10%,var(--color-neutral-400) 20%));--color-on-checkbox:var(--color-on-neutral);--color-checkbox-active:var(--color-neutral-active);--checkbox--box-shadow:0 0 0 0px var(--color-neutral-50),0 0 0 calc(1px + 0px) var(--color-neutral-600),0 0 var(--color-neutral-50);@variant focus-visible{--checkbox--box-shadow:0 0 0 0px var(--color-neutral-50),0 0 0 calc(1px + 0px) var(--color-neutral-700),0 0 var(--color-neutral-50)}@variant checked-or-aria-checked{--checkbox--bg-color:var(--color-neutral);@variant forced-colors{@variant before{--checkbox--bg-color:light-dark(var(--color-neutral-600),var(--color-neutral-200))}}}}@utility checkbox-success{--color-checkbox:light-dark(var(--color-success-50),color-mix(in oklch,black 10%,var(--color-success-400) 20%));--color-on-checkbox:var(--color-on-success);--color-checkbox-active:var(--color-success-active);--checkbox--box-shadow:0 0 0 0px var(--color-success-50),0 0 0 calc(1px + 0px) var(--color-success-600),0 0 var(--color-success-50);@variant focus-visible{--checkbox--box-shadow:0 0 0 0px var(--color-success-50),0 0 0 calc(1px + 0px) var(--color-success-700),0 0 var(--color-success-50)}@variant checked-or-aria-checked{--checkbox--bg-color:var(--color-success);@variant forced-colors{@variant before{--checkbox--bg-color:light-dark(var(--color-success-600),var(--color-success-200))}}}}@utility checkbox-warning{--color-checkbox:light-dark(var(--color-warning-50),color-mix(in oklch,black 10%,var(--color-warning-400) 20%));--color-on-checkbox:var(--color-on-warning);--color-checkbox-active:var(--color-warning-active);--checkbox--box-shadow:0 0 0 0px var(--color-warning-50),0 0 0 calc(1px + 0px) var(--color-warning-600),0 0 var(--color-warning-50);@variant focus-visible{--checkbox--box-shadow:0 0 0 0px var(--color-warning-50),0 0 0 calc(1px + 0px) var(--color-warning-700),0 0 var(--color-warning-50)}@variant checked-or-aria-checked{--checkbox--bg-color:var(--color-warning);@variant forced-colors{@variant before{--checkbox--bg-color:light-dark(var(--color-warning-600),var(--color-warning-200))}}}}@utility checkbox-error{--color-checkbox:light-dark(var(--color-error-50),color-mix(in oklch,black 10%,var(--color-error-400) 20%));--color-on-checkbox:var(--color-on-error);--color-checkbox-active:var(--color-error-active);--checkbox--box-shadow:0 0 0 0px var(--color-error-50),0 0 0 calc(1px + 0px) var(--color-error-600),0 0 var(--color-error-50);@variant focus-visible{--checkbox--box-shadow:0 0 0 0px var(--color-error-50),0 0 0 calc(1px + 0px) var(--color-error-700),0 0 var(--color-error-50)}@variant checked-or-aria-checked{--checkbox--bg-color:var(--color-error);@variant forced-colors{@variant before{--checkbox--bg-color:light-dark(var(--color-error-600),var(--color-error-200))}}}}@utility checkbox-circle{--checkbox--border-radius:calc(infinity * 1px);--checkbox--aspect-ratio:1 / 1}@utility checkbox-rounded{--checkbox--border-radius:calc(infinity * 1px);--checkbox--aspect-ratio:1 / 1}@utility checkbox-square{--checkbox--border-radius:var(--radius-checkbox);--checkbox--aspect-ratio:1 / 1}@utility checkbox-xs{--checkbox--padding:0.1875rem;--checkbox--width:0.75rem;--checkbox--height:0.75rem}@utility checkbox-sm{--checkbox--padding:0.25rem;--checkbox--width:1rem;--checkbox--height:1rem}@utility checkbox-md{--checkbox--padding:0.3125rem;--checkbox--width:1.25rem;--checkbox--height:1.25rem}@utility checkbox-lg{--checkbox--padding:0.375rem;--checkbox--width:1.5rem;--checkbox--height:1.5rem}@utility checkbox-xl{--checkbox--padding:0.4375rem;--checkbox--width:1.75rem;--checkbox--height:1.75rem}@utility checkbox-2xl{--checkbox--padding:0.5rem;--checkbox--width:2rem;--checkbox--height:2rem}@utility checkbox-disabled{cursor:var(--checkbox--cursor);opacity:var(--checkbox--opacity)}@custom-variant checked-or-aria-checked{&:checked,&[aria-checked="true"]{@slot}}@custom-variant checkbox-disabled{&:is(:disabled,[disabled],[class*="checkbox-disabled"]){@slot}}@utility checkbox{--radius-checkbox:calc(var(--border-radius) * 1.5);--color-checkbox:--alpha(var(--color-base) / 50%);--color-on-checkbox:var(--color-on-base);--color-checkbox-active:var(--color-base-active);--checkbox--box-shadow:0 0 0 0px var(--color-base-100),0 0 0 calc(1px + 0px) var(--color-checkbox-active),0 0 var(--color-base-100);background-color:var(--color-checkbox);color:var(--color-on-checkbox);box-shadow:var(--checkbox--box-shadow);aspect-ratio:var(--checkbox--aspect-ratio);border-radius:var(--checkbox--radius,var(--radius-checkbox));padding:var(--checkbox--padding,0.3125rem);width:var(--checkbox--width,1.25rem);height:var(--checkbox--height,1.25rem);position:relative;transition-duration:350ms;flex-shrink:0;cursor:pointer;appearance:none;vertical-align:middle;@variant before{content:none;opacity:0%;background-color:currentcolor;transform:rotate(45deg);transition:transform 300ms,background-color 100ms;display:block;width:100%;height:100%;clip-path:polygon(20% 100%,20% 80%,50% 80%,50% 0,70% 0,70% 100%);font-size:1rem;line-height:0.75}@variant focus-visible{outline-width:2px;outline-style:solid;outline-color:light-dark( var(--color-base-950,currentColor),var(--color-base-50,currentColor) );outline-offset:3px}@variant checked-or-aria-checked{--checkbox--bg-color:light-dark(--alpha(var(--color-base-600) / 20%),--alpha(var(--color-base-400) / 20%));background-color:var(--checkbox--bg-color);transition:all 100ms;@variant before{content:"✔︎";opacity:100%}@variant forced-colors{@variant before{--checkbox--bg-color:light-dark(var(--color-base-600),var(--color-base-200));content:"✔︎";transform:rotate(0deg);background-color:var(--checkbox--bg-color);clip-path:none}}}@variant indeterminate{@variant before{opacity:100%;transform:rotate(0deg) translate(0,-35%);clip-path:polygon( 20% 100%,20% 80%,50% 80%,50% 80%,80% 80%,80% 100% )}}@variant checkbox-disabled{--checkbox--cursor:not-allowed;--checkbox--opacity:20%;cursor:var(--checkbox--cursor);opacity:var(--checkbox--opacity)}}@utility divider-primary{--color-divider:var(--color-primary)}@utility divider-secondary{--color-divider:var(--color-secondary)}@utility divider-accent{--color-divider:var(--color-accent)}@utility divider-info{--color-divider:var(--color-info)}@utility divider-neutral{--color-divider:var(--color-neutral)}@utility divider-success{--color-divider:var(--color-success)}@utility divider-warning{--color-divider:var(--color-warning)}@utility divider-error{--color-divider:var(--color-error)}@utility divider-x{--divider-direction:right;--divider--width:100%;--divider--height:1px;--divider--flex-direction:row;--divider--margin:1rem 0}@utility divider-y{--divider-direction:bottom;--divider--width:1px;--divider--height:100%;--divider--flex-direction:column;--divider--margin:0 1rem}@utility divider-start{@variant before{display:none}}@utility divider-end{@variant after{display:none}}@utility divider-solid{--divider-dash-length:10px;--divider-gap-length:0px}@utility divider-dashed{--divider-dash-length:5px;--divider-gap-length:5px}@custom-variant before-after{&::before,&::after{@slot}}@utility divider{--divider--margin:1rem 0;--color-divider:var(--color-base-soft);--divider-direction:right;--divider--width:100%;--divider--height:1px;--divider-dash-length:10px;--divider-gap-length:0px;display:flex;align-items:center;justify-content:center;flex-direction:var(--divider--flex-direction);width:var(--divider--width);height:var(--divider--height);@variant not-empty{column-gap:0.5rem}@variant before-after{content:"";margin:var(--divider--margin);width:var(--divider--width);height:var(--divider--height);background:repeating-linear-gradient(to var(--divider-direction),var(--color-divider) 0px,var(--color-divider) var(--divider-dash-length),transparent var(--divider-dash-length),transparent calc(var(--divider-dash-length) + var(--divider-gap-length)))}}@utility drawer-top{place-items:start;:where([class*=drawer-body]){height:auto;width:100%;max-height:80vh;margin-bottom:calc(var(--spacing)*24);translate:0 -100%}}@utility drawer-bottom{place-items:end;:where([class*=drawer-body]){height:auto;width:100%;max-height:80vh;margin-top:calc(var(--spacing)*24);translate:0 100%;border-top-right-radius:var(--radius-drawer);border-top-left-radius:var(--radius-drawer)}}@utility drawer-start{place-items:start;:where([class*=drawer-body]){height:100vh;width:auto;max-height:none;translate:-100% 0}}@utility drawer-end{place-items:end;:where([class*=drawer-body]){height:100vh;max-height:none;width:auto;translate:100% 0}}@utility drawer-backdrop{display:grid;grid-column-start:1;grid-row-start:1;align-self:stretch;justify-self:stretch;color:transparent;z-index:-1;button{cursor:pointer}}@utility drawer-body{--radius-drawer:calc(var(--border-radius) * 2);border-radius:0;translate:-100% 0;scale:1;grid-column-start:1;grid-row-start:1;height:100vh;max-height:none;width:calc(11 / 12 * 100%);max-width:none;padding:0.25rem;overflow-y:auto;overscroll-behavior:contain;flex:1 1 auto;@variant forced-colors{outline-style:solid;outline-width:1px}background-color:var(--color-base);transition:translate 0.3s ease-out,visibility 0.3s allow-discrete,background-color 0.3s ease-out,opacity 0.1s ease-out}@utility drawer{pointer-events:none;visibility:hidden;position:fixed;inset:0rem;margin:0rem;padding:0rem;display:grid;width:100%;height:100%;max-width:none;max-height:none;place-items:start;color:inherit;z-index:999;overflow:hidden;overscroll-behavior:contain;&:not([class*="drawer-top"]):not([class*="drawer-bottom"]){[class*="drawer-body"]{width:auto}}&:not(drawer:not([open]):not(.drawer-open)),&::backdrop{@starting-style{visibility:hidden}opacity:1;background-color:light-dark(color-mix(in oklch,black 10%,var(--color-base-600) 40%),color-mix(in oklch,black 10%,var(--color-base-400) 40%))}&[open],&[class*="drawer-open"]{@starting-style{visibility:hidden}pointer-events:auto;visibility:visible;[class*="drawer-body"]{translate:0 0;scale:1}}}@utility dropdown{--radius-dropdown:calc(var(--border-radius) * 2);position:relative;display:inline-block}@utility dropdown-body{border-radius:var(--radius-dropdown);padding:0.60rem;visibility:hidden;position-anchor:var(--anchor-name);@supports not (position-area:end span-end){top:var(--dropdown-position--top);inset-inline-end:var(--dropdown-position--end);bottom:var(--dropdown--bottom);inset-inline-start:var(--dropdown-position--start);transform:translate(var(--dropdown--translate-x),var(--dropdown--translate-y))}@supports (position-area:end span-end){position-area:var(--dropdown--position-area,end span-end)}position:absolute;animation:dropdown 0.2s;background-color:var(--color-base);outline-style:solid;outline-width:1px;min-width:13rem;outline-color:var(--color-base-active);transition-property:opacity,transform;transition-behavior:allow-discrete;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.4,0,0.2,1)}@keyframes dropdown{from{opacity:0;transform:scale(0.95)}to{opacity:1;transform:scale(1)}}@utility dropdown-hover{anchor-name:var(--anchor-name);@variant hover{:is([class*="dropdown-body"]){pointer-events:auto;visibility:visible;opacity:1;@starting-style{visibility:hidden;opacity:0}}}}@utility dropdown-toggle{anchor-name:var(--anchor-name);[popover]:popover-open{&:is([class*="dropdown-body"]){pointer-events:auto;visibility:visible;opacity:1;@starting-style{visibility:hidden;opacity:0}}}}@utility dropdown-top-start{--dropdown--position-area:start span-end;--dropdown-position--bottom:100%;--dropdown-position--top:auto;--dropdown-position--start:0;--dropdown--translate-y:var(-0.5rem)}@utility dropdown-top-center{--dropdown--position-area:start center;--dropdown-position--bottom:100%;--dropdown-position--top:auto;--dropdown-position--start:50%;--dropdown--translate-x:var(-50%);--dropdown--translate-y:var(-0.5rem)}@utility dropdown-top-end{--dropdown--position-area:start span-start;--dropdown-position--bottom:100%;--dropdown-position--top:auto;--dropdown-position--end:0;--dropdown-position--start:auto;--dropdown--translate-y:var(-0.5rem)}@utility dropdown-end-top{--dropdown--position-area:span-start end}@utility dropdown-end-center{--dropdown--position-area:center end}@utility dropdown-end-bottom{--dropdown--position-area:span-end end}@utility dropdown-bottom-start{--dropdown--position-area:end span-end;--dropdown-position--top:100%;--dropdown-position--start:0;--dropdown--translate-y:var(0.5rem)}@utility dropdown-bottom-center{--dropdown--position-area:end center;--dropdown-position--top:100%;--dropdown-position--start:50%;--dropdown--translate-x:var(-50%);--dropdown--translate-y:var(0.5rem)}@utility dropdown-bottom-end{--dropdown--position-area:end span-start;--dropdown-position--top:100%;--dropdown-position--end:0;--dropdown-position--start:auto;--dropdown--translate-y:var(0.5rem)}@utility dropdown-start-top{--dropdown--position-area:span-start start}@utility dropdown-start-center{--dropdown--position-area:center start}@utility dropdown-start-bottom{--dropdown--position-area:span-end start}@utility header-sticky{position:sticky}@utility header-body{margin-inline:auto;padding-inline:1rem;@variant sm{padding-inline:2rem}@variant lg{padding-inline:4rem}display:flex;gap:0.75rem;padding-block:0.5rem;justify-content:space-between;align-items:center;margin-left:auto;margin-right:auto}@utility header{background-color:var(--color-base);border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:var(--color-base-soft);top:0;z-index:999}@utility input-primary{--color-input:var(--color-primary);--color-on-input:var(--color-on-primary);--color-input-soft:var(--color-primary-soft);--color-on-input-soft:var(--color-on-primary-soft);--color-input-active:var(--color-primary-active);--color-on-input-active:var(--color-on-primary);@variant focus-or-within{outline-color:var(--color-primary-400)}}@utility input-secondary{--color-input:var(--color-secondary);--color-on-input:var(--color-on-secondary);--color-input-soft:var(--color-secondary-soft);--color-on-input-soft:var(--color-on-secondary-soft);--color-input-active:var(--color-secondary-active);--color-on-input-active:var(--color-on-secondary);@variant focus-or-within{outline-color:var(--color-secondary-400)}}@utility input-neutral{--color-input:var(--color-neutral);--color-on-input:var(--color-on-neutral);--color-input-soft:var(--color-neutral-soft);--color-on-input-soft:var(--color-on-neutral-soft);--color-input-active:var(--color-neutral-active);--color-on-input-active:var(--color-on-neutral);@variant focus-or-within{outline-color:var(--color-neutral-400)}}@utility input-accent{--color-input:var(--color-accent);--color-on-input:var(--color-on-accent);--color-input-soft:var(--color-accent-soft);--color-on-input-soft:var(--color-on-accent-soft);--color-input-active:var(--color-accent-active);--color-on-input-active:var(--color-on-accent);@variant focus-or-within{outline-color:var(--color-accent-400)}}@utility input-info{--color-input:var(--color-info);--color-on-input:var(--color-on-info);--color-input-soft:var(--color-info-soft);--color-on-input-soft:var(--color-on-info-soft);--color-input-active:var(--color-info-active);--color-on-input-active:var(--color-on-info);@variant focus-or-within{outline-color:var(--color-info-400)}}@utility input-success{--color-input:var(--color-success);--color-on-input:var(--color-on-success);--color-input-soft:var(--color-success-soft);--color-on-input-soft:var(--color-on-success-soft);--color-input-active:var(--color-success-active);--color-on-input-active:var(--color-on-success);@variant focus-or-within{outline-color:var(--color-success-400)}}@utility input-warning{--color-input:var(--color-warning);--color-on-input:var(--color-on-warning);--color-input-soft:var(--color-warning-soft);--color-on-input-soft:var(--color-on-warning-soft);--color-input-active:var(--color-warning-active);--color-on-input-active:var(--color-on-warning);@variant focus-or-within{outline-color:var(--color-warning-400)}}@utility input-error{--color-input:var(--color-error);--color-on-input:var(--color-on-error);--color-input-soft:var(--color-error-soft);--color-on-input-soft:var(--color-on-error-soft);--color-input-active:var(--color-error-active);--color-on-input-active:var(--color-on-error);@variant focus-or-within{outline-color:var(--color-error-400)}}@utility input-xs{--input--inline:0.475rem;--input--block:0.375rem;--input--font-size:0.75rem}@utility input-sm{--input--inline:0.6rem;--input--block:0.5rem;--input--font-size:0.875rem}@utility input-md{--input--inline:0.75rem;--input--block:0.625rem;--input--font-size:1rem}@utility input-lg{--input--inline:0.9rem;--input--block:0.75rem;--input--font-size:1rem}@utility input-xl{--input--inline:1rem;--input--block:0.875rem;--input--font-size:1rem}@utility input-2xl{--input--inline:1.25rem;--input--block:1rem;--input--font-size:1.025rem}@utility input-disabled{cursor:var(--input-disabled--cursor);opacity:var(--input-disabled--opacity);pointer-events:var(--input-disabled--pointer-events);background-color:var(--input-disabled--bg-color);color:var(--input-disabled--color);user-select:var(--input-disabled--user-select);outline-color:var(--input-disabled--outline-color);@variant placeholder{color:var(--input-disabled--color)}}@utility input-dashed{outline-style:dashed}@utility input-outline{outline-style:solid}@utility input-soft{background-color:var(--color-input-soft);outline-color:transparent;@variant placeholder{color:--alpha(var(--color-on-input-soft) / 20%)}}@utility input-ghost{outline-color:transparent}@custom-variant input-disabled{&:is(:disabled,[disabled],[class*="input-disabled"]){@slot}@variant placeholder{color:var(--input-disabled--color)}}@utility input{--radius-input:calc(var(--border-radius) * 2);--color-input:var(--color-base-soft);--color-on-input:var(--color-on-base-soft);--color-input-active:var(--color-base-active);--color-on-input-active:var(--color-on-base);--input--inline:0.75rem;--input--block:0.625rem;--input--font-size:1rem;outline-width:1px;outline-style:solid;outline-color:var(--color-input-active);background-color:transparent;&:not([type="file"]){padding-inline:var(--input--inline);padding-block:var(--input--block)}font-size:var(--input--font-size);color:var(--color-on-base);display:inline-flex;align-self:flex-start;flex-shrink:0;align-items:center;appearance:none;border-radius:var(--radius-input);gap:0.5rem;vertical-align:middle;white-space:nowrap;position:relative;font-weight:500;transition:outline-color 250ms;transition-timing-function:ease-in-out;@variant placeholder{font-size:var(--input--font-size);color:--alpha(var(--color-on-base) / 30%);font-weight:400}@variant file{font-size:var(--input--font-size);margin-right:1rem;display:inline-flex;padding-inline:var(--input--inline);padding-block:var(--input--block);transition:border-color 300ms,background-color 300ms,display 300ms;transition-timing-function:ease-in-out;align-items:center;border-top-left-radius:calc(var(--radius-input) / 2);border-bottom-left-radius:calc(var(--radius-input) / 2);background-color:var(--color-input);border-right-width:1px;border-style:solid;border-color:var(--color-input-active);font-weight:semibold;color:var(--color-on-input);@variant hover{background-color:var(--color-input-active);color:var(--color-on-input-active)}}@variant input-disabled{--input-disabled--cursor:not-allowed;--input-disabled--opacity:0.6;--input-disabled--pointer-events:none;--input-disabled--user-select:none;--input-disabled--bg-color:var(--color-base-soft);--input-disabled--color:light-dark(var(--color-base-700),var(--color-base-400));--input-disabled--outline-color:--alpha(var(--input) / 20%);cursor:var(--input-disabled--cursor);opacity:var(--input-disabled--opacity);pointer-events:var(--input-disabled--pointer-events);background-color:var(--input-disabled--bg-color);color:var(--input-disabled--color);user-select:var(--input-disabled--user-select);outline-color:var(--input-disabled--outline-color)}@variant focus-or-within{outline-color:light-dark(var(--color-base-800),--alpha(var(--color-base-300) / 80%))}}@utility link-primary{--link--color:light-dark(var(--color-primary-800),var(--color-primary-400));@variant hover{--link--color:light-dark(var(--color-primary-700),var(--color-primary-300))}}@utility link-secondary{--link--color:light-dark(var(--color-secondary-800),var(--color-secondary-400));@variant hover{--link--color:light-dark(var(--color-secondary-700),var(--color-secondary-300))}}@utility link-accent{--link--color:light-dark(var(--color-accent-800),var(--color-accent-400));@variant hover{--link--color:light-dark(var(--color-accent-700),var(--color-accent-300))}}@utility link-info{--link--color:light-dark(var(--color-info-800),var(--color-info-400));@variant hover{--link--color:light-dark(var(--color-info-700),var(--color-info-300))}}@utility link-neutral{--link--color:light-dark(var(--color-nuetral-800),var(--color-nuetral-400));@variant hover{--link--color:light-dark(var(--color-nuetral-700),var(--color-nuetral-300))}}@utility link-success{--link--color:light-dark(var(--color-success-800),var(--color-success-400));@variant hover{--link--color:light-dark(var(--color-success-700),var(--color-success-300))}}@utility link-warning{--link--color:light-dark(var(--color-warning-800),var(--color-warning-400));@variant hover{--link--color:light-dark(var(--color-warning-700),var(--color-warning-300))}}@utility link-error{--link--color:light-dark(var(--color-error-800),var(--color-error-400));@variant hover{--link--color:light-dark(var(--color-error-700),var(--color-error-300))}}@utility link-xs{--link-text-size:0.75rem}@utility link-sm{--link-text-size:0.875rem}@utility link-md{--link-text-size:1rem}@utility link-lg{--link-text-size:1.125rem}@utility link-xl{--link-text-size:1.25rem}@utility link-2xl{--link-text-size:1.375rem}@utility link-hover{text-decoration-line:none;@variant hover{text-decoration-line:underline}}@utility link{--link--color:var(--color-on-base);cursor:pointer;text-decoration:underline;text-underline-offset:4px;color:var(--link--color);font-size:var(--link-text-size,1rem);transition:all 200ms ease-out;@variant hover{--link--color:light-dark(var(--color-base-950),var(--color-base-100));color:var(--link--color)}@variant focus{outline-style:none;@variant forced-colors{outline:2px solid transparent;outline-offset:2px}}@variant focus-visible{outline:2px solid currentColor;outline-offset:2px}}@utility modal-slide-up{--modal-body--translate:0 100%;--modal-body--scale:1}@utility modal-slide-down{--modal-body--translate:0 -100%;--modal-body--scale:1}@utility modal-slide-start{--modal-body--translate:-100% 0;--modal-body--scale:1}@utility modal-slide-end{--modal-body--translate:100% 0;--modal-body--scale:1}@utility modal-x-start{justify-items:start}@utility modal-x-center{justify-items:center}@utility modal-x-end{justify-items:end}@utility modal-y-start{align-items:start}@utility modal-y-center{align-items:center}@utility modal-y-end{align-items:end}@utility modal-backdrop{display:grid;grid-column-start:1;grid-row-start:1;align-self:stretch;justify-self:stretch;color:transparent;background-color:transparent;z-index:-1;button{cursor:pointer}}@utility modal-body{translate:var(--modal-body--translate);scale:var(--modal-body--scale,95%);opacity:var(--modal-body--opacity,0);box-shadow:light-dark(var(--color-base-600),var(--color-base-900)) 0px 1px 1px;grid-column-start:1;grid-row-start:1;max-height:100vh;width:calc(11 / 12 * 100%);max-width:32rem;padding:1.5rem;overflow-y:auto;overscroll-behavior:contain;border-radius:var(--radius-modal);background-color:var(--color-base);border-width:1px;border-style:solid;border-color:var(--color-base-soft);transition:translate 0.3s ease-out,scale 0.3s ease-out,opacity 0.3s ease-out 0.05s,box-shadow 0.3s ease-out;@variant forced-colors{outline-style:solid;outline-width:1px}}@utility modal{--radius-modal:calc(var(--border-radius) * 4);position:fixed;inset:0rem;margin:0rem;display:grid;align-items:center;justify-items:center;width:100%;height:100%;max-width:none;max-height:none;background-color:var(--color-base);color:inherit;z-index:999;overscroll-behavior:contain;overflow:hidden;padding:0.75rem;pointer-events:none;visibility:hidden;&:not(modal:not([open]):not([class*=modal-open])),&::backdrop{@starting-style{visibility:hidden;opacity:0}opacity:1;background-color:light-dark(color-mix(in oklch,black 10%,var(--color-base-600) 40%),color-mix(in oklch,black 10%,var(--color-base-400) 40%))}&[open],&[class*=modal-open]{@starting-style{visibility:hidden;opacity:0}pointer-events:auto;visibility:visible;opacity:1;--modal-body--translate:0 0;--modal-body--scale:1;--modal-body--opacity:1}}@utility navbar-x-start{--x-start:start;justify-self:var(--x-start);flex-direction:row;& >:where([class*="navbar-list"]){flex-direction:row;justify-content:var(--x-start);align-items:center;column-gap:0.5rem}& >:where([class*="navbar-list"] > li){width:auto}}@utility navbar-x-center{--x-center:center;justify-self:var(--x-center);flex-direction:row;& >:where([class*="navbar-list"]){flex-direction:row;justify-content:var(--x-center);align-items:center;column-gap:0.5rem}& >:where([class*="navbar-list"] > li){width:auto}}@utility navbar-x-end{--x-end:end;justify-self:var(--x-end);flex-direction:row;& >:where([class*="navbar-list"]){flex-direction:row;justify-content:var(--x-end);align-items:center;column-gap:0.5rem}& >:where([class*="navbar-list"] > li){width:auto}}@utility navbar-y-start{--y-start:start;justify-content:var(--y-start);flex-direction:column;row-gap:0.75rem;& >:where([class*="navbar-list"]){flex-direction:column;align-items:start;row-gap:0.25rem}}@utility navbar-y-center{--y-center:center;justify-content:var(--y-center);flex-direction:column;row-gap:0.75rem;& >:where([class*="navbar-list"]){flex-direction:column;align-items:start;row-gap:0.25rem}}@utility navbar-y-end{--y-end:end;justify-content:var(--y-end);flex-direction:column;row-gap:0.75rem;& >:where([class*="navbar-list"]){flex-direction:column;align-items:start;row-gap:0.25rem}}@utility navbar-list{display:flex;width:100%}@utility navbar{display:flex;width:100%}@utility sidebar{display:flex;flex-direction:column;gap:1.25rem;overflow-y:auto;overflow-x:hidden;position:sticky;max-height:calc(100dvh - (var(--spacing) * 14.25));padding:1rem;border-inline-style:solid;border-inline-width:1px;border-color:var(--color-base-soft);background-color:var(--color-base)}@utility surface-1{--surface--bg-color:color-mix(in oklch,var(--color-base) 90%,var(--color-on-base) 10%);--surface--color:var(--color-on-base)}@utility surface-2{--surface--bg-color:color-mix(in oklch,var(--color-base) 80%,var(--color-on-base) 20%);--surface--color:var(--color-on-base)}@utility surface-rounded{border-radius:calc(var(--border-radius) * 2)}@utility surface-xs{--surface--padding:0.5rem}@utility surface-sm{--surface--padding:1rem}@utility surface-md{--surface--padding:1.5rem}@utility surface-lg{--surface--padding:2rem}@utility surface-xl{--surface--padding:2.5rem}@utility surface-outline{border-width:1px;border-style:solid;border-color:color-mix(in oklch,var(--color-base-active) 90%,var(--color-base) 10%)}@utility surface-dashed{border-width:1px;border-style:dashed;border-color:var(--color-base-active)}@utility surface{--surface--bg-color:var(--color-base);--surface--color:var(--color-on-base);background-color:var(--surface--bg-color);color:var(--surface--color);padding:var(--surface--padding)}@utility table{--radius-table:calc(var(--border-radius) * 4);--color-table-soft:var(--color-base-soft);--color-on-table-soft:var(--color-on-base-soft);--color-table-active:var(--color-base-active);position:relative;width:100%;text-align:left;border-radius:var(--radius-table);font-size:var(--text-base);transition:all 250ms ease-out;@variant rtl{text-align:right}:where(th,td){padding-inline:1rem;padding-block:0.75rem;vertical-align:middle}:where(thead,tfoot){font-size:0.875rem;font-weight:600;white-space:nowrap;color:var(--color-on-table-soft)}:where(tfoot){border-top:1px solid var(--color-table-active)}:where(thead tr,tbody tr:not(:last-child)){border-bottom:1px solid var(--color-table-active)}}@utility table-zebra{tbody{tr{&:where(:nth-child(even)){background-color:var(--color-table-soft)}&.row-hover{&,&:where(:nth-child(even)){@variant hover{background-color:var(--color-table-active)}}}}}}@utility table-xs{:not(thead,tfoot) tr{font-size:0.6875rem}:where(th,td){padding-inline:0.5rem;padding-block:0.25rem}}@utility table-sm{:not(thead,tfoot) tr{font-size:0.75rem}:where(th,td){padding-inline:0.75rem;padding-block:0.5rem}}@utility table-md{:not(thead,tfoot) tr{font-size:0.875rem}:where(th,td){padding-inline:1rem;padding-block:0.75rem}}@utility table-lg{:not(thead,tfoot) tr{font-size:1.125rem}:where(th,td){padding-inline:1.25rem;padding-block:1rem}}@utility table-xl{:not(thead,tfoot) tr{font-size:1.375rem}:where(th,td){padding-inline:1.5rem;padding-block:1.25rem}}@utility container{box-sizing:border-box;margin-inline:auto;padding-inline:1rem;@variant sm{padding-inline:2rem}@variant lg{padding-inline:4rem}}@utility container-*{--container-size-xs:320px;--container-size-sm:640px;--container-size-md:768px;--container-size-lg:1024px;--container-size-xl:1280px;--container-size-2xl:1536px;max-width:--value(--container-size-*,integer,[integer]);box-sizing:border-box;margin-inline:auto;padding-inline:1rem;@variant sm{padding-inline:2rem}@variant lg{padding-inline:4rem}}@utility container-full{width:100%;max-width:100%;box-sizing:border-box;margin-inline:auto;padding-inline:1rem;@variant sm{padding-inline:2rem}@variant lg{padding-inline:4rem}}@utility heading{font-weight:bold;text-wrap-style:balance;font-size:var(--text-base)}@utility heading-*{font-weight:bold;text-wrap-style:balance;font-size:--value(--text-*,integer,[integer])}@utility heading-md{font-weight:bold;text-wrap-style:balance;font-size:var(--text-base)}@utility para{text-wrap-style:pretty;font-size:var(--text-base)}@utility para-*{text-wrap-style:pretty;font-size:--value(--text-*,integer,[integer])}@utility para-md{text-wrap-style:pretty;font-size:var(--text-base)}