rizzo-css 0.0.8 → 0.0.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bin/rizzo-css.js +16 -27
- package/dist/rizzo.min.css +11 -9
- package/package.json +1 -1
- package/scaffold/astro-app/src/layouts/Layout.astro +1 -1
- package/scaffold/svelte/Accordion.svelte +2 -1
- package/scaffold/svelte/Alert.svelte +1 -0
- package/scaffold/svelte/Breadcrumb.svelte +1 -0
- package/scaffold/svelte/CopyToClipboard.svelte +5 -2
- package/scaffold/svelte/Dropdown.svelte +30 -10
- package/scaffold/svelte/Modal.svelte +1 -0
- package/scaffold/svelte/Table.svelte +8 -4
- package/scaffold/svelte-app/README.md +28 -0
- package/scaffold/svelte-app/src/app.d.ts +15 -0
- package/scaffold/svelte-app/src/app.html +1 -1
- package/scaffold/vanilla/index.html +2 -1
package/bin/rizzo-css.js
CHANGED
|
@@ -597,16 +597,11 @@ async function runAddToExisting() {
|
|
|
597
597
|
}
|
|
598
598
|
const framework = await selectMenu(frameworkOptions, frameworkPrompt);
|
|
599
599
|
|
|
600
|
-
const
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
{ value: SENTINEL_NONE, label: 'Select no themes' },
|
|
604
|
-
...THEMES.map((t) => ({ value: t, label: t })),
|
|
605
|
-
],
|
|
606
|
-
'? Themes — pick individuals (Space to toggle) or choose Select all/none below. Enter=confirm'
|
|
600
|
+
const defaultTheme = await selectMenu(
|
|
601
|
+
THEMES.map((t) => ({ value: t, label: t })),
|
|
602
|
+
'? Default theme (all 14 themes are included in the CSS; this sets the initial data-theme)'
|
|
607
603
|
);
|
|
608
|
-
const
|
|
609
|
-
const suggestedTheme = THEMES.includes(themeList[0]) ? themeList[0] : THEMES[0];
|
|
604
|
+
const theme = THEMES.includes(defaultTheme) ? defaultTheme : THEMES[0];
|
|
610
605
|
|
|
611
606
|
let selectedComponents = [];
|
|
612
607
|
const componentList = framework === 'svelte' ? SVELTE_COMPONENTS : framework === 'astro' ? ASTRO_COMPONENTS : [];
|
|
@@ -656,21 +651,21 @@ async function runAddToExisting() {
|
|
|
656
651
|
if (framework === 'svelte') {
|
|
657
652
|
console.log('\nAdd to your root layout (e.g. src/app.html):');
|
|
658
653
|
console.log(' <link rel="stylesheet" href="' + linkHref + '" />');
|
|
659
|
-
console.log('\nSet a theme on <html>: data-theme="' +
|
|
654
|
+
console.log('\nSet a theme on <html>: data-theme="' + theme + '" (see: npx rizzo-css theme)');
|
|
660
655
|
if (selectedComponents.length > 0) {
|
|
661
656
|
console.log(' Components are in src/lib/rizzo — import from \'$lib/rizzo\'.');
|
|
662
657
|
}
|
|
663
658
|
} else if (framework === 'astro') {
|
|
664
659
|
console.log('\nAdd to your layout (e.g. src/layouts/Layout.astro):');
|
|
665
660
|
console.log(' <link rel="stylesheet" href="' + linkHref + '" />');
|
|
666
|
-
console.log('\nSet a theme on <html>: data-theme="' +
|
|
661
|
+
console.log('\nSet a theme on <html>: data-theme="' + theme + '" (see: npx rizzo-css theme)');
|
|
667
662
|
if (selectedComponents.length > 0) {
|
|
668
663
|
console.log(' Components are in src/components/rizzo — import from there.');
|
|
669
664
|
}
|
|
670
665
|
} else {
|
|
671
666
|
console.log('\nAdd to your HTML or layout:');
|
|
672
667
|
console.log(' <link rel="stylesheet" href="' + linkHref + '" />');
|
|
673
|
-
console.log('\nSet a theme on <html>: data-theme="' +
|
|
668
|
+
console.log('\nSet a theme on <html>: data-theme="' + theme + '" (see: npx rizzo-css theme)');
|
|
674
669
|
}
|
|
675
670
|
console.log('\nDocs: https://rizzo-css.vercel.app\n');
|
|
676
671
|
}
|
|
@@ -707,16 +702,11 @@ async function cmdInit() {
|
|
|
707
702
|
'? Framework (arrows, Enter to select) — all get the same CSS and component styles'
|
|
708
703
|
);
|
|
709
704
|
|
|
710
|
-
const
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
{ value: SENTINEL_NONE, label: 'Select no themes' },
|
|
714
|
-
...THEMES.map((t) => ({ value: t, label: t })),
|
|
715
|
-
],
|
|
716
|
-
'? Themes — pick individuals (Space to toggle) or choose Select all/none below. Enter=confirm'
|
|
705
|
+
const defaultTheme = await selectMenu(
|
|
706
|
+
THEMES.map((t) => ({ value: t, label: t })),
|
|
707
|
+
'? Default theme (all 14 themes are included in the CSS; this sets the initial data-theme)'
|
|
717
708
|
);
|
|
718
|
-
const
|
|
719
|
-
const theme = THEMES.includes(themeList[0]) ? themeList[0] : THEMES[0];
|
|
709
|
+
const theme = THEMES.includes(defaultTheme) ? defaultTheme : THEMES[0];
|
|
720
710
|
|
|
721
711
|
let selectedComponents = [];
|
|
722
712
|
const componentList = framework === 'svelte' ? SVELTE_COMPONENTS : framework === 'astro' ? ASTRO_COMPONENTS : [];
|
|
@@ -749,9 +739,7 @@ async function cmdInit() {
|
|
|
749
739
|
process.exit(1);
|
|
750
740
|
}
|
|
751
741
|
|
|
752
|
-
const themeComment =
|
|
753
|
-
? '\n <!-- Selected themes: ' + themeList.join(', ') + ' -->'
|
|
754
|
-
: '';
|
|
742
|
+
const themeComment = '\n <!-- Default theme: ' + theme + ' (all 14 themes included in CSS) -->';
|
|
755
743
|
const projectNamePkg = name
|
|
756
744
|
? name.replace(/\s+/g, '-').toLowerCase()
|
|
757
745
|
: (framework === 'astro' ? 'my-astro-app' : framework === 'svelte' ? 'my-svelte-app' : 'my-app');
|
|
@@ -846,13 +834,14 @@ async function cmdInit() {
|
|
|
846
834
|
console.log(' - Vanilla JS: same CSS and component styles; index includes theme switcher and sample components.');
|
|
847
835
|
console.log(' - Icons: ' + join(projectDir, 'icons') + ' (SVG files)');
|
|
848
836
|
}
|
|
837
|
+
const runPrefix = name ? 'cd ' + name + ' && ' : '';
|
|
849
838
|
if (framework === 'astro' && existsSync(astroAppDir)) {
|
|
850
|
-
console.log(' - Default Astro project with Rizzo CSS. Run: pnpm install && pnpm dev');
|
|
839
|
+
console.log(' - Default Astro project with Rizzo CSS. Run: ' + runPrefix + 'pnpm install && pnpm dev');
|
|
851
840
|
console.log(' - Icons: src/components/rizzo/icons/ (Astro components)');
|
|
852
841
|
}
|
|
853
842
|
if (framework === 'svelte' && existsSync(svelteAppDir)) {
|
|
854
|
-
console.log(' - Default SvelteKit project with Rizzo CSS. Run: pnpm install && pnpm dev');
|
|
855
|
-
console.log(' - Icons: src/lib/rizzo/icons/ (Svelte components)');
|
|
843
|
+
console.log(' - Default SvelteKit project with Rizzo CSS. Run: ' + runPrefix + 'pnpm install && pnpm dev');
|
|
844
|
+
console.log(' - Install dependencies first (required before dev). Icons: src/lib/rizzo/icons/ (Svelte components)');
|
|
856
845
|
}
|
|
857
846
|
if ((framework === 'svelte' || framework === 'astro') && !existsSync(framework === 'astro' ? astroAppDir : svelteAppDir)) {
|
|
858
847
|
const fw = framework === 'svelte' ? 'Svelte' : 'Astro';
|
package/dist/rizzo.min.css
CHANGED
|
@@ -64,8 +64,8 @@ input[type="url"]:disabled,
|
|
|
64
64
|
input[type="week"]:disabled,
|
|
65
65
|
select:disabled,
|
|
66
66
|
textarea:disabled{background-color:var(--background);cursor:not-allowed;opacity:var(--opacity-60)}input::-moz-placeholder, textarea::-moz-placeholder{color:var(--text-dim);opacity:var(--opacity-70)}input::placeholder,
|
|
67
|
-
textarea::placeholder{color:var(--text-dim);opacity:var(--opacity-70)}input[type="number"]{-moz-appearance:textfield;padding-right:var(--spacing-10);position:relative}input[type="number"]::-webkit-inner-spin-button,
|
|
68
|
-
input[type="number"]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;background-color:var(--text-dim);background-image:none;border-radius:var(--radius-sm);cursor:pointer;height:var(--spacing-5);margin:0;opacity:1;position:relative;-webkit-transition:background-color var(--transition-base);transition:background-color var(--transition-base);width:var(--spacing-5)}input[type="number"]::-webkit-inner-spin-button{background:linear-gradient(to bottom,transparent 0,transparent 45%,var(--text-dim) 45%,var(--text-dim) 55%,transparent 55%),linear-gradient(to top,transparent 0,transparent 45%,var(--text-dim) 45%,var(--text-dim) 55%,transparent 55%);background-position:center var(--spacing-0-125),center var(--spacing-0-625);background-repeat:no-repeat;background-size:var(--spacing-2) var(--spacing-0-625),var(--spacing-2) var(--spacing-0-625);opacity:.7}input[type="number"]:hover::-webkit-inner-spin-button{background:linear-gradient(to bottom,transparent 0,transparent 45%,var(--accent) 45%,var(--accent) 55%,transparent 55%),linear-gradient(to top,transparent 0,transparent 45%,var(--accent) 45%,var(--accent) 55%,transparent 55%);background-position:center var(--spacing-0-125),center var(--spacing-0-625);background-repeat:no-repeat;background-size:var(--spacing-2) var(--spacing-0-625),var(--spacing-2) var(--spacing-0-625);opacity:1}input[type="number"]:active::-webkit-inner-spin-button{background:linear-gradient(to bottom,transparent 0,transparent 45%,var(--accent-hover) 45%,var(--accent-hover) 55%,transparent 55%),linear-gradient(to top,transparent 0,transparent 45%,var(--accent-hover) 45%,var(--accent-hover) 55%,transparent 55%);background-position:center var(--spacing-0-125),center var(--spacing-0-625);background-repeat:no-repeat;background-size:var(--spacing-2) var(--spacing-0-625),var(--spacing-2) var(--spacing-0-625)}input[type="number"]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}textarea{font-family:var(--font-family);min-height:var(--spacing-24);resize:vertical}select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 4 4 4 4-4'/%3E%3C/svg%3E");background-position:right var(--spacing-3) center;background-repeat:no-repeat;background-size:1rem;padding-right:var(--spacing-10)}select:focus{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%23666' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 4 4 4 4-4'/%3E%3C/svg%3E")}.form-group{margin-bottom:var(--spacing-6)}.form-group__label{color:var(--text);display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);margin-bottom:var(--spacing-2)}.form-group__label.required::after{color:var(--error);content:" *";font-weight:var(--font-weight-semibold)}.form-group__help{color:var(--text-dim);display:block;font-size:var(--font-size-xs);margin-top:var(--spacing-0-375)}.form-input--error,
|
|
67
|
+
textarea::placeholder{color:var(--text-dim);opacity:var(--opacity-70)}input[type="number"]{-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield;padding-right:var(--spacing-10);position:relative}input[type="number"]::-webkit-inner-spin-button,
|
|
68
|
+
input[type="number"]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;background-color:var(--text-dim);background-image:none;border-radius:var(--radius-sm);cursor:pointer;height:var(--spacing-5);margin:0;opacity:1;position:relative;-webkit-transition:background-color var(--transition-base);transition:background-color var(--transition-base);width:var(--spacing-5)}input[type="number"]::-webkit-inner-spin-button{background:linear-gradient(to bottom,transparent 0,transparent 45%,var(--text-dim) 45%,var(--text-dim) 55%,transparent 55%),linear-gradient(to top,transparent 0,transparent 45%,var(--text-dim) 45%,var(--text-dim) 55%,transparent 55%);background-position:center var(--spacing-0-125),center var(--spacing-0-625);background-repeat:no-repeat;background-size:var(--spacing-2) var(--spacing-0-625),var(--spacing-2) var(--spacing-0-625);opacity:.7}input[type="number"]:hover::-webkit-inner-spin-button{background:linear-gradient(to bottom,transparent 0,transparent 45%,var(--accent) 45%,var(--accent) 55%,transparent 55%),linear-gradient(to top,transparent 0,transparent 45%,var(--accent) 45%,var(--accent) 55%,transparent 55%);background-position:center var(--spacing-0-125),center var(--spacing-0-625);background-repeat:no-repeat;background-size:var(--spacing-2) var(--spacing-0-625),var(--spacing-2) var(--spacing-0-625);opacity:1}input[type="number"]:active::-webkit-inner-spin-button{background:linear-gradient(to bottom,transparent 0,transparent 45%,var(--accent-hover) 45%,var(--accent-hover) 55%,transparent 55%),linear-gradient(to top,transparent 0,transparent 45%,var(--accent-hover) 45%,var(--accent-hover) 55%,transparent 55%);background-position:center var(--spacing-0-125),center var(--spacing-0-625);background-repeat:no-repeat;background-size:var(--spacing-2) var(--spacing-0-625),var(--spacing-2) var(--spacing-0-625)}input[type="number"]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}textarea{font-family:var(--font-family);min-height:var(--spacing-24);resize:vertical}select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 4 4 4 4-4'/%3E%3C/svg%3E");background-position:right var(--spacing-3) center;background-repeat:no-repeat;background-size:1rem;padding-right:var(--spacing-10)}select:focus{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%23666' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 4 4 4 4-4'/%3E%3C/svg%3E")}.form-group{margin-bottom:var(--spacing-6)}.form-group__label{color:var(--text);display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);margin-bottom:var(--spacing-2)}.form-group__label.required::after{color:var(--error);content:" *";font-weight:var(--font-weight-semibold)}.form-group__help{color:var(--text-dim);display:block;font-size:var(--font-size-xs);margin-top:var(--spacing-0-375)}.form-input--error,
|
|
69
69
|
.form-input[aria-invalid="true"]{border-color:var(--error);border-width:var(--outline-width)}.form-input--error:focus,
|
|
70
70
|
.form-input[aria-invalid="true"]:focus{border-color:var(--error);box-shadow:0 0 0 var(--spacing-3) oklch(from var(--error) l c h/10%)}.form-input--success{border-color:var(--success);border-width:var(--outline-width)}.form-input--success:focus{border-color:var(--success);box-shadow:0 0 0 var(--spacing-3) oklch(from var(--success) l c h/10%)}.form-input--sm{font-size:var(--font-size-sm);padding:var(--spacing-2) var(--spacing-0-625)}.form-input--lg{font-size:var(--font-size-lg);padding:var(--spacing-3) var(--spacing-4)}input[type="checkbox"],
|
|
71
71
|
input[type="radio"]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--background-alt);border:var(--outline-width) solid var(--border);cursor:pointer;flex-shrink:0;height:var(--spacing-5);margin:0 var(--spacing-2) 0 0;transition:border-color var(--transition-base),background-color var(--transition-base);width:var(--spacing-5)}input[type="checkbox"]{border-radius:var(--radius)}input[type="radio"]{border-radius:var(--radius-circle)}input[type="checkbox"]:checked,
|
|
@@ -77,7 +77,7 @@ input[type="radio"]:disabled{cursor:not-allowed;opacity:var(--opacity-60)}.check
|
|
|
77
77
|
.radio-label:has(input:disabled){cursor:not-allowed;opacity:var(--opacity-60)}.checkbox-label:has(input:disabled):hover,
|
|
78
78
|
.radio-label:has(input:disabled):hover{color:var(--text)}.checkbox-group,
|
|
79
79
|
.radio-group{display:flex;flex-direction:column;gap:var(--spacing-3)}.checkbox-group--inline,
|
|
80
|
-
.radio-group--inline{flex-flow:row wrap}input[type="file"]{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;font-family:var(--font-family);font-size:var(--font-size-base);padding:var(--spacing-0-625) var(--spacing-3);width:100%}input[type="file"]:focus{border-color:var(--accent);box-shadow:0 0 0 var(--spacing-3) oklch(from var(--accent) l c h/10%);outline:none}input[type="file"]:disabled{cursor:not-allowed;opacity:var(--opacity-60)}input[type="range"]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--background-alt);border-radius:var(--radius);height:var(--spacing-2);outline:none;width:100%}input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background-color:var(--accent);border:var(--outline-width) solid var(--background-alt);border-radius:var(--radius-circle);box-shadow:0 0 0 var(--spacing-0-125) var(--accent);cursor:pointer;height:var(--spacing-5);width:var(--spacing-5)}input[type="range"]::-moz-range-thumb{background-color:var(--accent);border:var(--outline-width) solid var(--background-alt);border-radius:var(--radius-circle);box-shadow:0 0 0 var(--spacing-0-125) var(--accent);cursor:pointer;height:var(--spacing-5);width:var(--spacing-5)}input[type="range"]:focus::-webkit-slider-thumb{box-shadow:0 0 0 var(--spacing-0-125) var(--accent),0 0 0 var(--spacing-1) oklch(from var(--accent) l c h/10%)}input[type="range"]:focus::-moz-range-thumb{box-shadow:0 0 0 var(--spacing-0-125) var(--accent),0 0 0 var(--spacing-1) oklch(from var(--accent) l c h/10%)}fieldset{border:var(--border-width) solid var(--border);border-radius:var(--radius-md);margin:0 0 var(--spacing-6);padding:var(--spacing-4)}legend{color:var(--text);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);padding:0 var(--spacing-2)}.form-error{color:var(--error)}.form-error,.form-success{display:block;font-size:var(--font-size-xs);margin-top:var(--spacing-0-375)}.form-success{color:var(--success)}.form-row{display:flex;gap:var(--spacing-4);margin-bottom:var(--spacing-6)}.form-row .form-group{flex:1;margin-bottom:0}@media (width <= 640px){.form-row{flex-direction:column;gap:var(--spacing-0)}}.container{margin:0 auto;max-width:var(--container-default);padding:0 var(--spacing-4)}.card{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);color:var(--text);display:flex;flex-direction:column;padding:var(--spacing-6);transition:border-color var(--transition-base),box-shadow var(--transition-base),transform var(--transition-base)}.card--elevated{border:none;box-shadow:var(--shadow-md)}.card--elevated:hover{box-shadow:var(--shadow-lg);transform:translateY(calc(var(--spacing-0-125)*-1))}.card--outlined{background-color:transparent;border:var(--outline-width) solid var(--border)}.card--outlined:hover{border-color:var(--accent)}.card--filled{background-color:var(--background);border:var(--border-width) solid var(--border)}.card__header{border-bottom:var(--border-width) solid var(--border);margin-bottom:var(--spacing-4);padding-bottom:var(--spacing-4)}.card__header:empty{display:none}.card__body{flex:1}.card__body:empty{display:none}.card__footer{border-top:var(--border-width) solid var(--border);margin-top:var(--spacing-4);padding-top:var(--spacing-4)}.card__footer:empty{display:none}.card__image{border-radius:var(--radius-lg) var(--radius-lg) 0 0;display:block;height:auto;margin:calc(var(--spacing-6)*-1) calc(var(--spacing-6)*-1) var(--spacing-6) calc(var(--spacing-6)*-1);-o-object-fit:cover;object-fit:cover;width:100%}.card:has(.card__image){padding-top:0}.card__image + .card__header{margin-top:0;padding-top:0}.card__title{color:var(--text);font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-2) 0}.card__subtitle{color:var(--text-dim);font-size:var(--font-size-sm);margin:0}section{background-color:var(--background);color:var(--text)}.border{border:var(--border-width) solid var(--border)}.border-top{border-top:var(--border-width) solid var(--border)}.border-bottom{border-bottom:var(--border-width) solid var(--border)}.border-left{border-left:var(--border-width) solid var(--border)}.border-right{border-right:var(--border-width) solid var(--border)}.m-0{margin:0}.m-1{margin:.25rem}.m-2{margin:.5rem}.m-3{margin:.75rem}.m-4{margin:1rem}.m-5{margin:1.25rem}.m-6{margin:1.5rem}.m-8{margin:2rem}.m-10{margin:2.5rem}.m-12{margin:3rem}.m-16{margin:4rem}.m-20{margin:5rem}.m-24{margin:6rem}.m-auto{margin:auto}.mt-0{margin-top:0}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-10{margin-top:2.5rem}.mt-12{margin-top:3rem}.mt-16{margin-top:4rem}.mt-20{margin-top:5rem}.mt-24{margin-top:6rem}.mt-auto{margin-top:auto}.mr-0{margin-right:0}.mr-1{margin-right:.25rem}.mr-2{margin-right:.5rem}.mr-3{margin-right:.75rem}.mr-4{margin-right:1rem}.mr-5{margin-right:1.25rem}.mr-6{margin-right:1.5rem}.mr-8{margin-right:2rem}.mr-10{margin-right:2.5rem}.mr-12{margin-right:3rem}.mr-16{margin-right:4rem}.mr-20{margin-right:5rem}.mr-24{margin-right:6rem}.mr-auto{margin-right:auto}.mb-0{margin-bottom:0}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}.mb-16{margin-bottom:4rem}.mb-20{margin-bottom:5rem}.mb-24{margin-bottom:6rem}.mb-auto{margin-bottom:auto}.ml-0{margin-left:0}.ml-1{margin-left:.25rem}.ml-2{margin-left:.5rem}.ml-3{margin-left:.75rem}.ml-4{margin-left:1rem}.ml-5{margin-left:1.25rem}.ml-6{margin-left:1.5rem}.ml-8{margin-left:2rem}.ml-10{margin-left:2.5rem}.ml-12{margin-left:3rem}.ml-16{margin-left:4rem}.ml-20{margin-left:5rem}.ml-24{margin-left:6rem}.ml-auto{margin-left:auto}.mx-0{margin-left:0;margin-right:0}.mx-1{margin-left:.25rem;margin-right:.25rem}.mx-2{margin-left:.5rem;margin-right:.5rem}.mx-3{margin-left:.75rem;margin-right:.75rem}.mx-4{margin-left:1rem;margin-right:1rem}.mx-5{margin-left:1.25rem;margin-right:1.25rem}.mx-6{margin-left:1.5rem;margin-right:1.5rem}.mx-8{margin-left:2rem;margin-right:2rem}.mx-10{margin-left:2.5rem;margin-right:2.5rem}.mx-12{margin-left:3rem;margin-right:3rem}.mx-16{margin-left:4rem;margin-right:4rem}.mx-20{margin-left:5rem;margin-right:5rem}.mx-24{margin-left:6rem;margin-right:6rem}.mx-auto{margin-left:auto;margin-right:auto}.my-0{margin-bottom:0;margin-top:0}.my-1{margin-bottom:.25rem;margin-top:.25rem}.my-2{margin-bottom:.5rem;margin-top:.5rem}.my-3{margin-bottom:.75rem;margin-top:.75rem}.my-4{margin-bottom:1rem;margin-top:1rem}.my-5{margin-bottom:1.25rem;margin-top:1.25rem}.my-6{margin-bottom:1.5rem;margin-top:1.5rem}.my-8{margin-bottom:2rem;margin-top:2rem}.my-10{margin-bottom:2.5rem;margin-top:2.5rem}.my-12{margin-bottom:3rem;margin-top:3rem}.my-16{margin-bottom:4rem;margin-top:4rem}.my-20{margin-bottom:5rem;margin-top:5rem}.my-24{margin-bottom:6rem;margin-top:6rem}.my-auto{margin-bottom:auto;margin-top:auto}.p-0{padding:0}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.p-10{padding:2.5rem}.p-12{padding:3rem}.p-16{padding:4rem}.p-20{padding:5rem}.p-24{padding:6rem}.pt-0{padding-top:0}.pt-1{padding-top:.25rem}.pt-2{padding-top:.5rem}.pt-3{padding-top:.75rem}.pt-4{padding-top:1rem}.pt-5{padding-top:1.25rem}.pt-6{padding-top:1.5rem}.pt-8{padding-top:2rem}.pt-10{padding-top:2.5rem}.pt-12{padding-top:3rem}.pt-16{padding-top:4rem}.pt-20{padding-top:5rem}.pt-24{padding-top:6rem}.pr-0{padding-right:0}.pr-1{padding-right:.25rem}.pr-2{padding-right:.5rem}.pr-3{padding-right:.75rem}.pr-4{padding-right:1rem}.pr-5{padding-right:1.25rem}.pr-6{padding-right:1.5rem}.pr-8{padding-right:2rem}.pr-10{padding-right:2.5rem}.pr-12{padding-right:3rem}.pr-16{padding-right:4rem}.pr-20{padding-right:5rem}.pr-24{padding-right:6rem}.pb-0{padding-bottom:0}.pb-1{padding-bottom:.25rem}.pb-2{padding-bottom:.5rem}.pb-3{padding-bottom:.75rem}.pb-4{padding-bottom:1rem}.pb-5{padding-bottom:1.25rem}.pb-6{padding-bottom:1.5rem}.pb-8{padding-bottom:2rem}.pb-10{padding-bottom:2.5rem}.pb-12{padding-bottom:3rem}.pb-16{padding-bottom:4rem}.pb-20{padding-bottom:5rem}.pb-24{padding-bottom:6rem}.pl-0{padding-left:0}.pl-1{padding-left:.25rem}.pl-2{padding-left:.5rem}.pl-3{padding-left:.75rem}.pl-4{padding-left:1rem}.pl-5{padding-left:1.25rem}.pl-6{padding-left:1.5rem}.pl-8{padding-left:2rem}.pl-10{padding-left:2.5rem}.pl-12{padding-left:3rem}.pl-16{padding-left:4rem}.pl-20{padding-left:5rem}.pl-24{padding-left:6rem}.px-0{padding-left:0;padding-right:0}.px-1{padding-left:.25rem;padding-right:.25rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-8{padding-left:2rem;padding-right:2rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.px-12{padding-left:3rem;padding-right:3rem}.px-16{padding-left:4rem;padding-right:4rem}.px-20{padding-left:5rem;padding-right:5rem}.px-24{padding-left:6rem;padding-right:6rem}.py-0{padding-bottom:0;padding-top:0}.py-1{padding-bottom:.25rem;padding-top:.25rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.py-3{padding-bottom:.75rem;padding-top:.75rem}.py-4{padding-bottom:1rem;padding-top:1rem}.py-5{padding-bottom:1.25rem;padding-top:1.25rem}.py-6{padding-bottom:1.5rem;padding-top:1.5rem}.py-8{padding-bottom:2rem;padding-top:2rem}.py-10{padding-bottom:2.5rem;padding-top:2.5rem}.py-12{padding-bottom:3rem;padding-top:3rem}.py-16{padding-bottom:4rem;padding-top:4rem}.py-20{padding-bottom:5rem;padding-top:5rem}.py-24{padding-bottom:6rem;padding-top:6rem}.container-sm{max-width:640px}.container-md,.container-sm{margin-left:auto;margin-right:auto;padding-left:var(--spacing-4);padding-right:var(--spacing-4)}.container-md{max-width:768px}.container-lg{max-width:1024px}.container-lg,.container-xl{margin-left:auto;margin-right:auto;padding-left:var(--spacing-4);padding-right:var(--spacing-4)}.container-xl{max-width:1280px}.container-2xl{max-width:1536px}.container-2xl,.container-full{margin-left:auto;margin-right:auto;padding-left:var(--spacing-4);padding-right:var(--spacing-4)}.container-full{max-width:100%}.w-auto{width:auto}.w-full{width:100%}.w-screen{width:100vw}.w-fit{width:-moz-fit-content;width:fit-content}.w-max{width:-moz-max-content;width:max-content}.w-min{width:-moz-min-content;width:min-content}.w-0{width:0}.w-1{width:.25rem}.w-2{width:.5rem}.w-3{width:.75rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-10{width:2.5rem}.w-12{width:3rem}.w-16{width:4rem}.w-20{width:5rem}.w-24{width:6rem}.w-32{width:8rem}.w-40{width:10rem}.w-48{width:12rem}.w-56{width:14rem}.w-64{width:16rem}.h-auto{height:auto}.h-full{height:100%}.h-screen{height:100vh}.h-fit{height:-moz-fit-content;height:fit-content}.h-max{height:-moz-max-content;height:max-content}.h-min{height:-moz-min-content;height:min-content}.h-0{height:0}.h-1{height:.25rem}.h-2{height:.5rem}.h-3{height:.75rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-16{height:4rem}.h-20{height:5rem}.h-24{height:6rem}.h-32{height:8rem}.h-40{height:10rem}.h-48{height:12rem}.h-56{height:14rem}.h-64{height:16rem}.min-w-0{min-width:0}.min-w-full{min-width:100%}.min-w-min{min-width:-moz-min-content;min-width:min-content}.min-w-max{min-width:-moz-max-content;min-width:max-content}.min-w-fit{min-width:-moz-fit-content;min-width:fit-content}.min-h-0{min-height:0}.min-h-full{min-height:100%}.min-h-screen{min-height:100vh}.min-h-fit{min-height:-moz-fit-content;min-height:fit-content}.min-h-max{min-height:-moz-max-content;min-height:max-content}.min-h-min{min-height:-moz-min-content;min-height:min-content}.max-w-none{max-width:none}.max-w-xs{max-width:20rem}.max-w-sm{max-width:24rem}.max-w-md{max-width:28rem}.max-w-lg{max-width:32rem}.max-w-xl{max-width:36rem}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.max-w-4xl{max-width:56rem}.max-w-5xl{max-width:64rem}.max-w-6xl{max-width:72rem}.max-w-7xl{max-width:80rem}.max-w-full{max-width:100%}.max-w-screen-sm{max-width:640px}.max-w-screen-md{max-width:768px}.max-w-screen-lg{max-width:1024px}.max-w-screen-xl{max-width:1280px}.max-w-screen-2xl{max-width:1536px}.max-h-none{max-height:none}.max-h-full{max-height:100%}.max-h-screen{max-height:100vh}.max-h-fit{max-height:-moz-fit-content;max-height:fit-content}.max-h-max{max-height:-moz-max-content;max-height:max-content}.max-h-min{max-height:-moz-min-content;max-height:min-content}.max-h-0{max-height:0}.max-h-1{max-height:.25rem}.max-h-2{max-height:.5rem}.max-h-3{max-height:.75rem}.max-h-4{max-height:1rem}.max-h-5{max-height:1.25rem}.max-h-6{max-height:1.5rem}.max-h-8{max-height:2rem}.max-h-10{max-height:2.5rem}.max-h-12{max-height:3rem}.max-h-16{max-height:4rem}.max-h-20{max-height:5rem}.max-h-24{max-height:6rem}.max-h-32{max-height:8rem}.max-h-40{max-height:10rem}.max-h-48{max-height:12rem}.max-h-56{max-height:14rem}.max-h-64{max-height:16rem}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.inline-grid{display:inline-grid}.table{display:table}.table-row{display:table-row}.table-cell{display:table-cell}.contents{display:contents}.list-item{display:list-item}.hidden{display:none}@media (width >= 640px){.sm\:block{display:block}.sm\:inline-block{display:inline-block}.sm\:inline{display:inline}.sm\:flex{display:flex}.sm\:inline-flex{display:inline-flex}.sm\:grid{display:grid}.sm\:inline-grid{display:inline-grid}.sm\:hidden{display:none}}@media (width >= 768px){.md\:block{display:block}.md\:inline-block{display:inline-block}.md\:inline{display:inline}.md\:flex{display:flex}.md\:inline-flex{display:inline-flex}.md\:grid{display:grid}.md\:inline-grid{display:inline-grid}.md\:hidden{display:none}}@media (width >= 1024px){.lg\:block{display:block}.lg\:inline-block{display:inline-block}.lg\:inline{display:inline}.lg\:flex{display:flex}.lg\:inline-flex{display:inline-flex}.lg\:grid{display:grid}.lg\:inline-grid{display:inline-grid}.lg\:hidden{display:none}}@media (width >= 1280px){.xl\:block{display:block}.xl\:inline-block{display:inline-block}.xl\:inline{display:inline}.xl\:flex{display:flex}.xl\:inline-flex{display:inline-flex}.xl\:grid{display:grid}.xl\:inline-grid{display:inline-grid}.xl\:hidden{display:none}}@media (width >= 1536px){.xxl\:block{display:block}.xxl\:inline-block{display:inline-block}.xxl\:inline{display:inline}.xxl\:flex{display:flex}.xxl\:inline-flex{display:inline-flex}.xxl\:grid{display:grid}.xxl\:inline-grid{display:inline-grid}.xxl\:hidden{display:none}}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.z-0{z-index:0}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.z-auto{z-index:auto}.z-dropdown{z-index:1000}.z-dropdown-submenu{z-index:1001}.z-modal{z-index:2000}.z-modal-backdrop{z-index:1999}.z-tooltip{z-index:3000}.z-toast{z-index:4000}.z-navbar{z-index:5000}.rounded-none{border-radius:0}.rounded-sm{border-radius:.125rem}.rounded{border-radius:.25rem}.rounded-md{border-radius:.375rem}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-2xl{border-radius:1rem}.rounded-3xl{border-radius:1.5rem}.rounded-full{border-radius:9999px}.rounded-t-none{border-top-left-radius:0;border-top-right-radius:0}.rounded-t-sm{border-top-left-radius:.125rem;border-top-right-radius:.125rem}.rounded-t{border-top-left-radius:.25rem;border-top-right-radius:.25rem}.rounded-t-md{border-top-left-radius:.375rem;border-top-right-radius:.375rem}.rounded-t-lg{border-top-left-radius:.5rem;border-top-right-radius:.5rem}.rounded-t-xl{border-top-left-radius:.75rem;border-top-right-radius:.75rem}.rounded-t-2xl{border-top-left-radius:1rem;border-top-right-radius:1rem}.rounded-t-full{border-top-left-radius:9999px;border-top-right-radius:9999px}.rounded-r-none{border-bottom-right-radius:0;border-top-right-radius:0}.rounded-r-sm{border-bottom-right-radius:.125rem;border-top-right-radius:.125rem}.rounded-r{border-bottom-right-radius:.25rem;border-top-right-radius:.25rem}.rounded-r-md{border-bottom-right-radius:.375rem;border-top-right-radius:.375rem}.rounded-r-lg{border-bottom-right-radius:.5rem;border-top-right-radius:.5rem}.rounded-r-xl{border-bottom-right-radius:.75rem;border-top-right-radius:.75rem}.rounded-r-2xl{border-bottom-right-radius:1rem;border-top-right-radius:1rem}.rounded-r-full{border-bottom-right-radius:9999px;border-top-right-radius:9999px}.rounded-b-none{border-bottom-left-radius:0;border-bottom-right-radius:0}.rounded-b-sm{border-bottom-left-radius:.125rem;border-bottom-right-radius:.125rem}.rounded-b{border-bottom-left-radius:.25rem;border-bottom-right-radius:.25rem}.rounded-b-md{border-bottom-left-radius:.375rem;border-bottom-right-radius:.375rem}.rounded-b-lg{border-bottom-left-radius:.5rem;border-bottom-right-radius:.5rem}.rounded-b-xl{border-bottom-left-radius:.75rem;border-bottom-right-radius:.75rem}.rounded-b-2xl{border-bottom-left-radius:1rem;border-bottom-right-radius:1rem}.rounded-b-full{border-bottom-left-radius:9999px;border-bottom-right-radius:9999px}.rounded-l-none{border-bottom-left-radius:0;border-top-left-radius:0}.rounded-l-sm{border-bottom-left-radius:.125rem;border-top-left-radius:.125rem}.rounded-l{border-bottom-left-radius:.25rem;border-top-left-radius:.25rem}.rounded-l-md{border-bottom-left-radius:.375rem;border-top-left-radius:.375rem}.rounded-l-lg{border-bottom-left-radius:.5rem;border-top-left-radius:.5rem}.rounded-l-xl{border-bottom-left-radius:.75rem;border-top-left-radius:.75rem}.rounded-l-2xl{border-bottom-left-radius:1rem;border-top-left-radius:1rem}.rounded-l-full{border-bottom-left-radius:9999px;border-top-left-radius:9999px}.border-0{border-width:0}.border{border-width:1px}.border-2{border-width:2px}.border-4{border-width:4px}.border-8{border-width:8px}.border-t-0{border-top-width:0}.border-t{border-top-width:1px}.border-t-2{border-top-width:2px}.border-t-4{border-top-width:4px}.border-t-8{border-top-width:8px}.border-r-0{border-right-width:0}.border-r{border-right-width:1px}.border-r-2{border-right-width:2px}.border-r-4{border-right-width:4px}.border-r-8{border-right-width:8px}.border-b-0{border-bottom-width:0}.border-b{border-bottom-width:1px}.border-b-2{border-bottom-width:2px}.border-b-4{border-bottom-width:4px}.border-b-8{border-bottom-width:8px}.border-l-0{border-left-width:0}.border-l{border-left-width:1px}.border-l-2{border-left-width:2px}.border-l-4{border-left-width:4px}.border-l-8{border-left-width:8px}.border-transparent{border-color:transparent}.border-color{border-color:var(--border)}.border-accent{border-color:var(--accent)}.border-success{border-color:var(--success)}.border-warning{border-color:var(--warning)}.border-error{border-color:var(--error)}.border-info{border-color:var(--info)}.flex-row{flex-direction:row}.flex-row-reverse{flex-direction:row-reverse}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.flex-wrap-reverse{flex-wrap:wrap-reverse}.flex-nowrap{flex-wrap:nowrap}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.justify-evenly{justify-content:space-evenly}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.items-baseline{align-items:baseline}.items-stretch{align-items:stretch}.self-auto{align-self:auto}.self-start{align-self:flex-start}.self-end{align-self:flex-end}.self-center{align-self:center}.self-stretch{align-self:stretch}.self-baseline{align-self:baseline}.flex-1{flex:1 1 0%}.flex-auto{flex:1 1 auto}.flex-initial{flex:0 1 auto}.flex-none{flex:none}.grow{flex-grow:1}.grow-0{flex-grow:0}.shrink{flex-shrink:1}.shrink-0{flex-shrink:0}.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-5{grid-template-columns:repeat(5,minmax(0,1fr))}.grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.grid-cols-none{grid-template-columns:none}.grid-rows-1{grid-template-rows:repeat(1,minmax(0,1fr))}.grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}.grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}.grid-rows-4{grid-template-rows:repeat(4,minmax(0,1fr))}.grid-rows-5{grid-template-rows:repeat(5,minmax(0,1fr))}.grid-rows-6{grid-template-rows:repeat(6,minmax(0,1fr))}.grid-rows-none{grid-template-rows:none}.col-auto{grid-column:auto}.col-span-1{grid-column:span 1/span 1}.col-span-2{grid-column:span 2/span 2}.col-span-3{grid-column:span 3/span 3}.col-span-4{grid-column:span 4/span 4}.col-span-5{grid-column:span 5/span 5}.col-span-6{grid-column:span 6/span 6}.col-span-full{grid-column:1/-1}.row-auto{grid-row:auto}.row-span-1{grid-row:span 1/span 1}.row-span-2{grid-row:span 2/span 2}.row-span-3{grid-row:span 3/span 3}.row-span-4{grid-row:span 4/span 4}.row-span-5{grid-row:span 5/span 5}.row-span-6{grid-row:span 6/span 6}.row-span-full{grid-row:1/-1}.gap-0{gap:0}.gap-1{gap:var(--spacing-1)}.gap-2{gap:var(--spacing-2)}.gap-3{gap:var(--spacing-3)}.gap-4{gap:var(--spacing-4)}.gap-5{gap:var(--spacing-5)}.gap-6{gap:var(--spacing-6)}.gap-8{gap:var(--spacing-8)}.gap-10{gap:var(--spacing-10)}.gap-12{gap:var(--spacing-12)}.gap-16{gap:var(--spacing-16)}.gap-20{gap:var(--spacing-20)}.gap-24{gap:var(--spacing-24)}.gap-x-0{-moz-column-gap:0;column-gap:0}.gap-x-1{-moz-column-gap:var(--spacing-1);column-gap:var(--spacing-1)}.gap-x-2{-moz-column-gap:var(--spacing-2);column-gap:var(--spacing-2)}.gap-x-3{-moz-column-gap:var(--spacing-3);column-gap:var(--spacing-3)}.gap-x-4{-moz-column-gap:var(--spacing-4);column-gap:var(--spacing-4)}.gap-x-5{-moz-column-gap:var(--spacing-5);column-gap:var(--spacing-5)}.gap-x-6{-moz-column-gap:var(--spacing-6);column-gap:var(--spacing-6)}.gap-x-8{-moz-column-gap:var(--spacing-8);column-gap:var(--spacing-8)}.gap-x-10{-moz-column-gap:var(--spacing-10);column-gap:var(--spacing-10)}.gap-x-12{-moz-column-gap:var(--spacing-12);column-gap:var(--spacing-12)}.gap-x-16{-moz-column-gap:var(--spacing-16);column-gap:var(--spacing-16)}.gap-x-20{-moz-column-gap:var(--spacing-20);column-gap:var(--spacing-20)}.gap-x-24{-moz-column-gap:var(--spacing-24);column-gap:var(--spacing-24)}.gap-y-0{row-gap:0}.gap-y-1{row-gap:var(--spacing-1)}.gap-y-2{row-gap:var(--spacing-2)}.gap-y-3{row-gap:var(--spacing-3)}.gap-y-4{row-gap:var(--spacing-4)}.gap-y-5{row-gap:var(--spacing-5)}.gap-y-6{row-gap:var(--spacing-6)}.gap-y-8{row-gap:var(--spacing-8)}.gap-y-10{row-gap:var(--spacing-10)}.gap-y-12{row-gap:var(--spacing-12)}.gap-y-16{row-gap:var(--spacing-16)}.gap-y-20{row-gap:var(--spacing-20)}.gap-y-24{row-gap:var(--spacing-24)}.transition-none{transition-property:none}.transition-all{transition-property:all}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke}.transition-opacity{transition-property:opacity}.transition-shadow{transition-property:box-shadow}.transition-transform{transition-property:transform}.duration-75{transition-duration:75ms}.duration-100{transition-duration:.1s}.duration-150{transition-duration:.15s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}.duration-700{transition-duration:.7s}.duration-1000{transition-duration:1s}.ease-linear{transition-timing-function:linear}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.delay-75{transition-delay:75ms}.delay-100{transition-delay:.1s}.delay-150{transition-delay:.15s}.delay-200{transition-delay:.2s}.delay-300{transition-delay:.3s}.delay-500{transition-delay:.5s}.delay-700{transition-delay:.7s}.delay-1000{transition-delay:1s}.transition-fast{transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-base{transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-slow{transition-duration:.3s;transition-timing-function:cubic-bezier(.4,0,.2,1)}@media (prefers-reduced-motion:reduce){
|
|
80
|
+
.radio-group--inline{flex-flow:row wrap}input[type="file"]{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;font-family:var(--font-family);font-size:var(--font-size-base);padding:var(--spacing-0-625) var(--spacing-3);width:100%}input[type="file"]:focus{border-color:var(--accent);box-shadow:0 0 0 var(--spacing-3) oklch(from var(--accent) l c h/10%);outline:none}input[type="file"]:disabled{cursor:not-allowed;opacity:var(--opacity-60)}input[type="range"]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--background-alt);border-radius:var(--radius);height:var(--spacing-2);outline:none;width:100%}input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background-color:var(--accent);border:var(--outline-width) solid var(--background-alt);border-radius:var(--radius-circle);box-shadow:0 0 0 var(--spacing-0-125) var(--accent);cursor:pointer;height:var(--spacing-5);width:var(--spacing-5)}input[type="range"]::-moz-range-thumb{background-color:var(--accent);border:var(--outline-width) solid var(--background-alt);border-radius:var(--radius-circle);box-shadow:0 0 0 var(--spacing-0-125) var(--accent);cursor:pointer;height:var(--spacing-5);width:var(--spacing-5)}input[type="range"]:focus::-webkit-slider-thumb{box-shadow:0 0 0 var(--spacing-0-125) var(--accent),0 0 0 var(--spacing-1) oklch(from var(--accent) l c h/10%)}input[type="range"]:focus::-moz-range-thumb{box-shadow:0 0 0 var(--spacing-0-125) var(--accent),0 0 0 var(--spacing-1) oklch(from var(--accent) l c h/10%)}fieldset{border:var(--border-width) solid var(--border);border-radius:var(--radius-md);margin:0 0 var(--spacing-6);padding:var(--spacing-4)}legend{color:var(--text);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);padding:0 var(--spacing-2)}.form-error{color:var(--error)}.form-error,.form-success{display:block;font-size:var(--font-size-xs);margin-top:var(--spacing-0-375)}.form-success{color:var(--success)}.form-row{display:flex;gap:var(--spacing-4);margin-bottom:var(--spacing-6)}.form-row .form-group{flex:1;margin-bottom:0}@media (width <= 640px){.form-row{flex-direction:column;gap:var(--spacing-0)}}.layout__container{box-sizing:border-box;width:100%}.container,.layout__container{margin:0 auto;max-width:var(--container-default);padding:0 var(--spacing-4)}.card{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);color:var(--text);display:flex;flex-direction:column;padding:var(--spacing-6);transition:border-color var(--transition-base),box-shadow var(--transition-base),transform var(--transition-base)}.card--elevated{border:none;box-shadow:var(--shadow-md)}.card--elevated:hover{box-shadow:var(--shadow-lg);transform:translateY(calc(var(--spacing-0-125)*-1))}.card--outlined{background-color:transparent;border:var(--outline-width) solid var(--border)}.card--outlined:hover{border-color:var(--accent)}.card--filled{background-color:var(--background);border:var(--border-width) solid var(--border)}.card__header{border-bottom:var(--border-width) solid var(--border);margin-bottom:var(--spacing-4);padding-bottom:var(--spacing-4)}.card__header:empty{display:none}.card__body{flex:1}.card__body:empty{display:none}.card__footer{border-top:var(--border-width) solid var(--border);margin-top:var(--spacing-4);padding-top:var(--spacing-4)}.card__footer:empty{display:none}.card__image{border-radius:var(--radius-lg) var(--radius-lg) 0 0;display:block;height:auto;margin:calc(var(--spacing-6)*-1) calc(var(--spacing-6)*-1) var(--spacing-6) calc(var(--spacing-6)*-1);-o-object-fit:cover;object-fit:cover;width:100%}.card:has(.card__image){padding-top:0}.card__image + .card__header{margin-top:0;padding-top:0}.card__title{color:var(--text);font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-2) 0}.card__subtitle{color:var(--text-dim);font-size:var(--font-size-sm);margin:0}section{background-color:var(--background);color:var(--text)}.border{border:var(--border-width) solid var(--border)}.border-top{border-top:var(--border-width) solid var(--border)}.border-bottom{border-bottom:var(--border-width) solid var(--border)}.border-left{border-left:var(--border-width) solid var(--border)}.border-right{border-right:var(--border-width) solid var(--border)}.m-0{margin:0}.m-1{margin:.25rem}.m-2{margin:.5rem}.m-3{margin:.75rem}.m-4{margin:1rem}.m-5{margin:1.25rem}.m-6{margin:1.5rem}.m-8{margin:2rem}.m-10{margin:2.5rem}.m-12{margin:3rem}.m-16{margin:4rem}.m-20{margin:5rem}.m-24{margin:6rem}.m-auto{margin:auto}.mt-0{margin-top:0}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-10{margin-top:2.5rem}.mt-12{margin-top:3rem}.mt-16{margin-top:4rem}.mt-20{margin-top:5rem}.mt-24{margin-top:6rem}.mt-auto{margin-top:auto}.mr-0{margin-right:0}.mr-1{margin-right:.25rem}.mr-2{margin-right:.5rem}.mr-3{margin-right:.75rem}.mr-4{margin-right:1rem}.mr-5{margin-right:1.25rem}.mr-6{margin-right:1.5rem}.mr-8{margin-right:2rem}.mr-10{margin-right:2.5rem}.mr-12{margin-right:3rem}.mr-16{margin-right:4rem}.mr-20{margin-right:5rem}.mr-24{margin-right:6rem}.mr-auto{margin-right:auto}.mb-0{margin-bottom:0}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}.mb-16{margin-bottom:4rem}.mb-20{margin-bottom:5rem}.mb-24{margin-bottom:6rem}.mb-auto{margin-bottom:auto}.ml-0{margin-left:0}.ml-1{margin-left:.25rem}.ml-2{margin-left:.5rem}.ml-3{margin-left:.75rem}.ml-4{margin-left:1rem}.ml-5{margin-left:1.25rem}.ml-6{margin-left:1.5rem}.ml-8{margin-left:2rem}.ml-10{margin-left:2.5rem}.ml-12{margin-left:3rem}.ml-16{margin-left:4rem}.ml-20{margin-left:5rem}.ml-24{margin-left:6rem}.ml-auto{margin-left:auto}.mx-0{margin-left:0;margin-right:0}.mx-1{margin-left:.25rem;margin-right:.25rem}.mx-2{margin-left:.5rem;margin-right:.5rem}.mx-3{margin-left:.75rem;margin-right:.75rem}.mx-4{margin-left:1rem;margin-right:1rem}.mx-5{margin-left:1.25rem;margin-right:1.25rem}.mx-6{margin-left:1.5rem;margin-right:1.5rem}.mx-8{margin-left:2rem;margin-right:2rem}.mx-10{margin-left:2.5rem;margin-right:2.5rem}.mx-12{margin-left:3rem;margin-right:3rem}.mx-16{margin-left:4rem;margin-right:4rem}.mx-20{margin-left:5rem;margin-right:5rem}.mx-24{margin-left:6rem;margin-right:6rem}.mx-auto{margin-left:auto;margin-right:auto}.my-0{margin-bottom:0;margin-top:0}.my-1{margin-bottom:.25rem;margin-top:.25rem}.my-2{margin-bottom:.5rem;margin-top:.5rem}.my-3{margin-bottom:.75rem;margin-top:.75rem}.my-4{margin-bottom:1rem;margin-top:1rem}.my-5{margin-bottom:1.25rem;margin-top:1.25rem}.my-6{margin-bottom:1.5rem;margin-top:1.5rem}.my-8{margin-bottom:2rem;margin-top:2rem}.my-10{margin-bottom:2.5rem;margin-top:2.5rem}.my-12{margin-bottom:3rem;margin-top:3rem}.my-16{margin-bottom:4rem;margin-top:4rem}.my-20{margin-bottom:5rem;margin-top:5rem}.my-24{margin-bottom:6rem;margin-top:6rem}.my-auto{margin-bottom:auto;margin-top:auto}.p-0{padding:0}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.p-10{padding:2.5rem}.p-12{padding:3rem}.p-16{padding:4rem}.p-20{padding:5rem}.p-24{padding:6rem}.pt-0{padding-top:0}.pt-1{padding-top:.25rem}.pt-2{padding-top:.5rem}.pt-3{padding-top:.75rem}.pt-4{padding-top:1rem}.pt-5{padding-top:1.25rem}.pt-6{padding-top:1.5rem}.pt-8{padding-top:2rem}.pt-10{padding-top:2.5rem}.pt-12{padding-top:3rem}.pt-16{padding-top:4rem}.pt-20{padding-top:5rem}.pt-24{padding-top:6rem}.pr-0{padding-right:0}.pr-1{padding-right:.25rem}.pr-2{padding-right:.5rem}.pr-3{padding-right:.75rem}.pr-4{padding-right:1rem}.pr-5{padding-right:1.25rem}.pr-6{padding-right:1.5rem}.pr-8{padding-right:2rem}.pr-10{padding-right:2.5rem}.pr-12{padding-right:3rem}.pr-16{padding-right:4rem}.pr-20{padding-right:5rem}.pr-24{padding-right:6rem}.pb-0{padding-bottom:0}.pb-1{padding-bottom:.25rem}.pb-2{padding-bottom:.5rem}.pb-3{padding-bottom:.75rem}.pb-4{padding-bottom:1rem}.pb-5{padding-bottom:1.25rem}.pb-6{padding-bottom:1.5rem}.pb-8{padding-bottom:2rem}.pb-10{padding-bottom:2.5rem}.pb-12{padding-bottom:3rem}.pb-16{padding-bottom:4rem}.pb-20{padding-bottom:5rem}.pb-24{padding-bottom:6rem}.pl-0{padding-left:0}.pl-1{padding-left:.25rem}.pl-2{padding-left:.5rem}.pl-3{padding-left:.75rem}.pl-4{padding-left:1rem}.pl-5{padding-left:1.25rem}.pl-6{padding-left:1.5rem}.pl-8{padding-left:2rem}.pl-10{padding-left:2.5rem}.pl-12{padding-left:3rem}.pl-16{padding-left:4rem}.pl-20{padding-left:5rem}.pl-24{padding-left:6rem}.px-0{padding-left:0;padding-right:0}.px-1{padding-left:.25rem;padding-right:.25rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-8{padding-left:2rem;padding-right:2rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.px-12{padding-left:3rem;padding-right:3rem}.px-16{padding-left:4rem;padding-right:4rem}.px-20{padding-left:5rem;padding-right:5rem}.px-24{padding-left:6rem;padding-right:6rem}.py-0{padding-bottom:0;padding-top:0}.py-1{padding-bottom:.25rem;padding-top:.25rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.py-3{padding-bottom:.75rem;padding-top:.75rem}.py-4{padding-bottom:1rem;padding-top:1rem}.py-5{padding-bottom:1.25rem;padding-top:1.25rem}.py-6{padding-bottom:1.5rem;padding-top:1.5rem}.py-8{padding-bottom:2rem;padding-top:2rem}.py-10{padding-bottom:2.5rem;padding-top:2.5rem}.py-12{padding-bottom:3rem;padding-top:3rem}.py-16{padding-bottom:4rem;padding-top:4rem}.py-20{padding-bottom:5rem;padding-top:5rem}.py-24{padding-bottom:6rem;padding-top:6rem}.container-sm{max-width:640px}.container-md,.container-sm{margin-left:auto;margin-right:auto;padding-left:var(--spacing-4);padding-right:var(--spacing-4)}.container-md{max-width:768px}.container-lg{max-width:1024px}.container-lg,.container-xl{margin-left:auto;margin-right:auto;padding-left:var(--spacing-4);padding-right:var(--spacing-4)}.container-xl{max-width:1280px}.container-2xl{max-width:1536px}.container-2xl,.container-full{margin-left:auto;margin-right:auto;padding-left:var(--spacing-4);padding-right:var(--spacing-4)}.container-full{max-width:100%}.w-auto{width:auto}.w-full{width:100%}.w-screen{width:100vw}.w-fit{width:-moz-fit-content;width:fit-content}.w-max{width:-moz-max-content;width:max-content}.w-min{width:-moz-min-content;width:min-content}.w-0{width:0}.w-1{width:.25rem}.w-2{width:.5rem}.w-3{width:.75rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-10{width:2.5rem}.w-12{width:3rem}.w-16{width:4rem}.w-20{width:5rem}.w-24{width:6rem}.w-32{width:8rem}.w-40{width:10rem}.w-48{width:12rem}.w-56{width:14rem}.w-64{width:16rem}.h-auto{height:auto}.h-full{height:100%}.h-screen{height:100vh}.h-fit{height:-moz-fit-content;height:fit-content}.h-max{height:-moz-max-content;height:max-content}.h-min{height:-moz-min-content;height:min-content}.h-0{height:0}.h-1{height:.25rem}.h-2{height:.5rem}.h-3{height:.75rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-16{height:4rem}.h-20{height:5rem}.h-24{height:6rem}.h-32{height:8rem}.h-40{height:10rem}.h-48{height:12rem}.h-56{height:14rem}.h-64{height:16rem}.min-w-0{min-width:0}.min-w-full{min-width:100%}.min-w-min{min-width:-moz-min-content;min-width:min-content}.min-w-max{min-width:-moz-max-content;min-width:max-content}.min-w-fit{min-width:-moz-fit-content;min-width:fit-content}.min-h-0{min-height:0}.min-h-full{min-height:100%}.min-h-screen{min-height:100vh}.min-h-fit{min-height:-moz-fit-content;min-height:fit-content}.min-h-max{min-height:-moz-max-content;min-height:max-content}.min-h-min{min-height:-moz-min-content;min-height:min-content}.max-w-none{max-width:none}.max-w-xs{max-width:20rem}.max-w-sm{max-width:24rem}.max-w-md{max-width:28rem}.max-w-lg{max-width:32rem}.max-w-xl{max-width:36rem}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.max-w-4xl{max-width:56rem}.max-w-5xl{max-width:64rem}.max-w-6xl{max-width:72rem}.max-w-7xl{max-width:80rem}.max-w-full{max-width:100%}.max-w-screen-sm{max-width:640px}.max-w-screen-md{max-width:768px}.max-w-screen-lg{max-width:1024px}.max-w-screen-xl{max-width:1280px}.max-w-screen-2xl{max-width:1536px}.max-h-none{max-height:none}.max-h-full{max-height:100%}.max-h-screen{max-height:100vh}.max-h-fit{max-height:-moz-fit-content;max-height:fit-content}.max-h-max{max-height:-moz-max-content;max-height:max-content}.max-h-min{max-height:-moz-min-content;max-height:min-content}.max-h-0{max-height:0}.max-h-1{max-height:.25rem}.max-h-2{max-height:.5rem}.max-h-3{max-height:.75rem}.max-h-4{max-height:1rem}.max-h-5{max-height:1.25rem}.max-h-6{max-height:1.5rem}.max-h-8{max-height:2rem}.max-h-10{max-height:2.5rem}.max-h-12{max-height:3rem}.max-h-16{max-height:4rem}.max-h-20{max-height:5rem}.max-h-24{max-height:6rem}.max-h-32{max-height:8rem}.max-h-40{max-height:10rem}.max-h-48{max-height:12rem}.max-h-56{max-height:14rem}.max-h-64{max-height:16rem}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.inline-grid{display:inline-grid}.table{display:table}.table-row{display:table-row}.table-cell{display:table-cell}.contents{display:contents}.list-item{display:list-item}.hidden{display:none}@media (width >= 640px){.sm\:block{display:block}.sm\:inline-block{display:inline-block}.sm\:inline{display:inline}.sm\:flex{display:flex}.sm\:inline-flex{display:inline-flex}.sm\:grid{display:grid}.sm\:inline-grid{display:inline-grid}.sm\:hidden{display:none}}@media (width >= 768px){.md\:block{display:block}.md\:inline-block{display:inline-block}.md\:inline{display:inline}.md\:flex{display:flex}.md\:inline-flex{display:inline-flex}.md\:grid{display:grid}.md\:inline-grid{display:inline-grid}.md\:hidden{display:none}}@media (width >= 1024px){.lg\:block{display:block}.lg\:inline-block{display:inline-block}.lg\:inline{display:inline}.lg\:flex{display:flex}.lg\:inline-flex{display:inline-flex}.lg\:grid{display:grid}.lg\:inline-grid{display:inline-grid}.lg\:hidden{display:none}}@media (width >= 1280px){.xl\:block{display:block}.xl\:inline-block{display:inline-block}.xl\:inline{display:inline}.xl\:flex{display:flex}.xl\:inline-flex{display:inline-flex}.xl\:grid{display:grid}.xl\:inline-grid{display:inline-grid}.xl\:hidden{display:none}}@media (width >= 1536px){.xxl\:block{display:block}.xxl\:inline-block{display:inline-block}.xxl\:inline{display:inline}.xxl\:flex{display:flex}.xxl\:inline-flex{display:inline-flex}.xxl\:grid{display:grid}.xxl\:inline-grid{display:inline-grid}.xxl\:hidden{display:none}}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.z-0{z-index:0}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.z-auto{z-index:auto}.z-dropdown{z-index:1000}.z-dropdown-submenu{z-index:1001}.z-modal{z-index:2000}.z-modal-backdrop{z-index:1999}.z-tooltip{z-index:3000}.z-toast{z-index:4000}.z-navbar{z-index:5000}.rounded-none{border-radius:0}.rounded-sm{border-radius:.125rem}.rounded{border-radius:.25rem}.rounded-md{border-radius:.375rem}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-2xl{border-radius:1rem}.rounded-3xl{border-radius:1.5rem}.rounded-full{border-radius:9999px}.rounded-t-none{border-top-left-radius:0;border-top-right-radius:0}.rounded-t-sm{border-top-left-radius:.125rem;border-top-right-radius:.125rem}.rounded-t{border-top-left-radius:.25rem;border-top-right-radius:.25rem}.rounded-t-md{border-top-left-radius:.375rem;border-top-right-radius:.375rem}.rounded-t-lg{border-top-left-radius:.5rem;border-top-right-radius:.5rem}.rounded-t-xl{border-top-left-radius:.75rem;border-top-right-radius:.75rem}.rounded-t-2xl{border-top-left-radius:1rem;border-top-right-radius:1rem}.rounded-t-full{border-top-left-radius:9999px;border-top-right-radius:9999px}.rounded-r-none{border-bottom-right-radius:0;border-top-right-radius:0}.rounded-r-sm{border-bottom-right-radius:.125rem;border-top-right-radius:.125rem}.rounded-r{border-bottom-right-radius:.25rem;border-top-right-radius:.25rem}.rounded-r-md{border-bottom-right-radius:.375rem;border-top-right-radius:.375rem}.rounded-r-lg{border-bottom-right-radius:.5rem;border-top-right-radius:.5rem}.rounded-r-xl{border-bottom-right-radius:.75rem;border-top-right-radius:.75rem}.rounded-r-2xl{border-bottom-right-radius:1rem;border-top-right-radius:1rem}.rounded-r-full{border-bottom-right-radius:9999px;border-top-right-radius:9999px}.rounded-b-none{border-bottom-left-radius:0;border-bottom-right-radius:0}.rounded-b-sm{border-bottom-left-radius:.125rem;border-bottom-right-radius:.125rem}.rounded-b{border-bottom-left-radius:.25rem;border-bottom-right-radius:.25rem}.rounded-b-md{border-bottom-left-radius:.375rem;border-bottom-right-radius:.375rem}.rounded-b-lg{border-bottom-left-radius:.5rem;border-bottom-right-radius:.5rem}.rounded-b-xl{border-bottom-left-radius:.75rem;border-bottom-right-radius:.75rem}.rounded-b-2xl{border-bottom-left-radius:1rem;border-bottom-right-radius:1rem}.rounded-b-full{border-bottom-left-radius:9999px;border-bottom-right-radius:9999px}.rounded-l-none{border-bottom-left-radius:0;border-top-left-radius:0}.rounded-l-sm{border-bottom-left-radius:.125rem;border-top-left-radius:.125rem}.rounded-l{border-bottom-left-radius:.25rem;border-top-left-radius:.25rem}.rounded-l-md{border-bottom-left-radius:.375rem;border-top-left-radius:.375rem}.rounded-l-lg{border-bottom-left-radius:.5rem;border-top-left-radius:.5rem}.rounded-l-xl{border-bottom-left-radius:.75rem;border-top-left-radius:.75rem}.rounded-l-2xl{border-bottom-left-radius:1rem;border-top-left-radius:1rem}.rounded-l-full{border-bottom-left-radius:9999px;border-top-left-radius:9999px}.border-0{border-width:0}.border{border-width:1px}.border-2{border-width:2px}.border-4{border-width:4px}.border-8{border-width:8px}.border-t-0{border-top-width:0}.border-t{border-top-width:1px}.border-t-2{border-top-width:2px}.border-t-4{border-top-width:4px}.border-t-8{border-top-width:8px}.border-r-0{border-right-width:0}.border-r{border-right-width:1px}.border-r-2{border-right-width:2px}.border-r-4{border-right-width:4px}.border-r-8{border-right-width:8px}.border-b-0{border-bottom-width:0}.border-b{border-bottom-width:1px}.border-b-2{border-bottom-width:2px}.border-b-4{border-bottom-width:4px}.border-b-8{border-bottom-width:8px}.border-l-0{border-left-width:0}.border-l{border-left-width:1px}.border-l-2{border-left-width:2px}.border-l-4{border-left-width:4px}.border-l-8{border-left-width:8px}.border-transparent{border-color:transparent}.border-color{border-color:var(--border)}.border-accent{border-color:var(--accent)}.border-success{border-color:var(--success)}.border-warning{border-color:var(--warning)}.border-error{border-color:var(--error)}.border-info{border-color:var(--info)}.flex-row{flex-direction:row}.flex-row-reverse{flex-direction:row-reverse}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.flex-wrap-reverse{flex-wrap:wrap-reverse}.flex-nowrap{flex-wrap:nowrap}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.justify-evenly{justify-content:space-evenly}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.items-baseline{align-items:baseline}.items-stretch{align-items:stretch}.self-auto{align-self:auto}.self-start{align-self:flex-start}.self-end{align-self:flex-end}.self-center{align-self:center}.self-stretch{align-self:stretch}.self-baseline{align-self:baseline}.flex-1{flex:1 1 0%}.flex-auto{flex:1 1 auto}.flex-initial{flex:0 1 auto}.flex-none{flex:none}.grow{flex-grow:1}.grow-0{flex-grow:0}.shrink{flex-shrink:1}.shrink-0{flex-shrink:0}.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-5{grid-template-columns:repeat(5,minmax(0,1fr))}.grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.grid-cols-none{grid-template-columns:none}.grid-rows-1{grid-template-rows:repeat(1,minmax(0,1fr))}.grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}.grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}.grid-rows-4{grid-template-rows:repeat(4,minmax(0,1fr))}.grid-rows-5{grid-template-rows:repeat(5,minmax(0,1fr))}.grid-rows-6{grid-template-rows:repeat(6,minmax(0,1fr))}.grid-rows-none{grid-template-rows:none}.col-auto{grid-column:auto}.col-span-1{grid-column:span 1/span 1}.col-span-2{grid-column:span 2/span 2}.col-span-3{grid-column:span 3/span 3}.col-span-4{grid-column:span 4/span 4}.col-span-5{grid-column:span 5/span 5}.col-span-6{grid-column:span 6/span 6}.col-span-full{grid-column:1/-1}.row-auto{grid-row:auto}.row-span-1{grid-row:span 1/span 1}.row-span-2{grid-row:span 2/span 2}.row-span-3{grid-row:span 3/span 3}.row-span-4{grid-row:span 4/span 4}.row-span-5{grid-row:span 5/span 5}.row-span-6{grid-row:span 6/span 6}.row-span-full{grid-row:1/-1}.gap-0{gap:0}.gap-1{gap:var(--spacing-1)}.gap-2{gap:var(--spacing-2)}.gap-3{gap:var(--spacing-3)}.gap-4{gap:var(--spacing-4)}.gap-5{gap:var(--spacing-5)}.gap-6{gap:var(--spacing-6)}.gap-8{gap:var(--spacing-8)}.gap-10{gap:var(--spacing-10)}.gap-12{gap:var(--spacing-12)}.gap-16{gap:var(--spacing-16)}.gap-20{gap:var(--spacing-20)}.gap-24{gap:var(--spacing-24)}.gap-x-0{-moz-column-gap:0;column-gap:0}.gap-x-1{-moz-column-gap:var(--spacing-1);column-gap:var(--spacing-1)}.gap-x-2{-moz-column-gap:var(--spacing-2);column-gap:var(--spacing-2)}.gap-x-3{-moz-column-gap:var(--spacing-3);column-gap:var(--spacing-3)}.gap-x-4{-moz-column-gap:var(--spacing-4);column-gap:var(--spacing-4)}.gap-x-5{-moz-column-gap:var(--spacing-5);column-gap:var(--spacing-5)}.gap-x-6{-moz-column-gap:var(--spacing-6);column-gap:var(--spacing-6)}.gap-x-8{-moz-column-gap:var(--spacing-8);column-gap:var(--spacing-8)}.gap-x-10{-moz-column-gap:var(--spacing-10);column-gap:var(--spacing-10)}.gap-x-12{-moz-column-gap:var(--spacing-12);column-gap:var(--spacing-12)}.gap-x-16{-moz-column-gap:var(--spacing-16);column-gap:var(--spacing-16)}.gap-x-20{-moz-column-gap:var(--spacing-20);column-gap:var(--spacing-20)}.gap-x-24{-moz-column-gap:var(--spacing-24);column-gap:var(--spacing-24)}.gap-y-0{row-gap:0}.gap-y-1{row-gap:var(--spacing-1)}.gap-y-2{row-gap:var(--spacing-2)}.gap-y-3{row-gap:var(--spacing-3)}.gap-y-4{row-gap:var(--spacing-4)}.gap-y-5{row-gap:var(--spacing-5)}.gap-y-6{row-gap:var(--spacing-6)}.gap-y-8{row-gap:var(--spacing-8)}.gap-y-10{row-gap:var(--spacing-10)}.gap-y-12{row-gap:var(--spacing-12)}.gap-y-16{row-gap:var(--spacing-16)}.gap-y-20{row-gap:var(--spacing-20)}.gap-y-24{row-gap:var(--spacing-24)}.transition-none{transition-property:none}.transition-all{transition-property:all}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke}.transition-opacity{transition-property:opacity}.transition-shadow{transition-property:box-shadow}.transition-transform{transition-property:transform}.duration-75{transition-duration:75ms}.duration-100{transition-duration:.1s}.duration-150{transition-duration:.15s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}.duration-700{transition-duration:.7s}.duration-1000{transition-duration:1s}.ease-linear{transition-timing-function:linear}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.delay-75{transition-delay:75ms}.delay-100{transition-delay:.1s}.delay-150{transition-delay:.15s}.delay-200{transition-delay:.2s}.delay-300{transition-delay:.3s}.delay-500{transition-delay:.5s}.delay-700{transition-delay:.7s}.delay-1000{transition-delay:1s}.transition-fast{transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-base{transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-slow{transition-duration:.3s;transition-timing-function:cubic-bezier(.4,0,.2,1)}@media (prefers-reduced-motion:reduce){
|
|
81
81
|
.transition,
|
|
82
82
|
.transition-all,
|
|
83
83
|
.transition-base,
|
|
@@ -95,7 +95,7 @@ div.navbar__link{background:none;border:none;cursor:pointer;font:inherit;text-al
|
|
|
95
95
|
.navbar__item--has-dropdown:hover .navbar__submenu,.navbar__item--has-dropdown[aria-expanded="true"] .navbar__submenu{opacity:1;transform:translateY(0);visibility:visible}.navbar__sublink{color:var(--text);display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-normal);padding:var(--spacing-0-625) var(--spacing-4);text-decoration:none;transition:background-color var(--transition-base),color var(--transition-base)}.navbar__sublink:hover,.navbar__sublink[aria-current="page"]{background-color:var(--background);color:var(--accent)}.navbar__sublink[aria-current="page"]{font-weight:var(--font-weight-medium)}.navbar__sublink:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:calc(var(--outline-offset)*-1)}.navbar__link:hover{color:var(--accent)}.navbar__link:focus-visible{border-radius:var(--radius);outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.navbar__link::after{background-color:var(--accent);bottom:0;content:"";height:var(--spacing-0-125);left:0;position:absolute;transition:width var(--transition-slow);width:0}
|
|
96
96
|
.navbar__link:focus-visible::after,.navbar__link:hover::after,
|
|
97
97
|
.navbar__link[aria-current="page"]::after{width:100%}.navbar__link[aria-current="page"]{color:var(--accent)}.navbar__actions,.navbar__actions .search{display:none}.navbar__settings-btn{align-items:center;background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;display:flex;font-family:var(--font-family);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--spacing-2);min-width:-moz-fit-content;min-width:fit-content;padding:var(--spacing-2) var(--spacing-6);transition:background-color var(--transition-base),border-color var(--transition-base)}.navbar__settings-btn:hover{background-color:var(--background);border-color:var(--accent);color:var(--text)}.navbar__settings-btn:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.navbar__settings-icon{flex-shrink:0;height:var(--spacing-5);width:var(--spacing-5)}.navbar__settings-label{font-size:var(--font-size-sm)}@media (width <= 1023px){.navbar{overflow-x:clip}.navbar__container{gap:var(--spacing-2);min-width:0;padding-left:var(--spacing-3);padding-right:var(--spacing-3)}.navbar__brand{flex-shrink:1;min-width:0;order:0;overflow:hidden}.navbar__brand-link{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.navbar__toggle{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);display:flex;margin-left:var(--spacing-2);margin-right:0;min-height:var(--touch-target-min);min-width:var(--touch-target-min);order:1;padding:var(--spacing-2) var(--spacing-3);transition:background-color var(--transition-base),border-color var(--transition-base)}.navbar__toggle:hover{background-color:var(--background);border-color:var(--accent)}.navbar__toggle-icon{height:var(--spacing-5)!important;width:var(--spacing-5)!important}.navbar__toggle-icon span{border-radius:var(--radius-sm);height:calc(var(--spacing-0-125)*1.5)!important}.navbar__menu{align-items:stretch;background-color:var(--background-alt);border-top:none;box-shadow:var(--shadow-md);box-sizing:border-box;flex-direction:column;gap:var(--spacing-0);left:0;margin:0;max-height:0;max-width:100%;opacity:0;overflow:hidden;padding:0;pointer-events:none;position:absolute;right:0;top:100%;transition:max-height var(--transition-slowest) var(--ease-in-out-cubic),opacity var(--transition-ease-out),padding var(--transition-slowest) var(--ease-in-out-cubic);width:100%;z-index:var(--z-navbar-mobile-menu)}.navbar__menu--open{border-bottom:none!important;left:0;max-height:var(--vh-80);opacity:1;overflow-x:hidden;overflow-y:auto;padding:var(--spacing-4) 0;pointer-events:auto;position:fixed;right:0;scroll-behavior:auto;top:var(--spacing-16);transform:translateZ(0);transition:max-height var(--transition-slowest) var(--ease-in-out-cubic),opacity var(--transition-ease-in),padding var(--transition-slowest) var(--ease-in-out-cubic);width:100%;will-change:scroll-position;z-index:var(--z-navbar-mobile-menu-open)}.navbar__menu .navbar__item{contain:layout;margin:0;max-width:100%;padding:0;width:100%}.navbar__menu:not(.navbar__menu--open){padding:0;transition:max-height var(--transition-slowest) var(--ease-in-out-cubic),opacity var(--transition-ease-out),padding var(--transition-slowest) var(--ease-in-out-cubic)}.navbar__menu--open .navbar__item:last-of-type .navbar__link{border-bottom:none!important}.navbar__item{width:100%}.navbar__link{align-items:center;border-bottom:var(--border-width) solid var(--border);box-sizing:border-box;display:flex;justify-content:space-between;margin:0;max-width:100%;min-height:var(--touch-target-min);min-width:0;overflow-wrap:break-word;padding:var(--spacing-3) var(--spacing-4) var(--spacing-3) var(--spacing-3);transition:background-color var(--transition-base) ease,color var(--transition-base) ease;width:100%}.navbar__link .navbar__dropdown-icon{display:block!important;flex-shrink:0!important;height:var(--spacing-3)!important;margin-left:var(--spacing-2);margin-right:var(--spacing-4);opacity:1!important;transition:transform var(--transition-base) ease-out;visibility:visible!important;width:var(--spacing-3)!important}.navbar__submenu{background-color:var(--background);border:none;border-top:var(--border-width) solid var(--border);box-shadow:none;contain:layout;grid-template-columns:none!important;list-style:none;margin:0!important;max-height:0;max-width:100%!important;opacity:1;overflow:hidden;padding:0!important;position:static;transform:none;transition:max-height .25s cubic-bezier(.4,0,.2,1);visibility:visible;width:100%!important}.navbar__submenu,.navbar__submenu--components .navbar__submenu-components-grid{display:block!important}.navbar__submenu--components .navbar__submenu-column{display:block!important;margin-top:var(--spacing-2);width:100%!important}.navbar__submenu--components .navbar__submenu-column .navbar__sublink{border-bottom:var(--border-width) solid var(--border);min-height:var(--touch-target-min)!important;padding:var(--spacing-3) var(--spacing-5) var(--spacing-3) var(--spacing-10)!important}.navbar__item--has-dropdown[aria-expanded="true"] .navbar__submenu{max-height:var(--max-height-navbar-submenu);overflow:visible;padding:0!important}@media (prefers-reduced-motion:reduce){.navbar__menu,.navbar__menu--open,.navbar__submenu{transition:none}}.navbar__submenu li{padding:0!important}.navbar__sublink,.navbar__submenu li{display:block!important;margin:0!important;max-width:100%!important;width:100%!important}.navbar__sublink{border-bottom:var(--border-width) solid var(--border);box-sizing:border-box!important;min-height:var(--touch-target-min)!important;min-width:0!important;overflow-wrap:break-word!important;padding:var(--spacing-3) var(--spacing-5) var(--spacing-3) var(--spacing-10)!important}.navbar__sublink:last-child{border-bottom:none}.navbar__submenu--themes .navbar__submenu-themes-grid{display:block!important}.navbar__submenu--themes .navbar__submenu-column{display:block!important;margin-top:var(--spacing-2);width:100%!important}.navbar__submenu--themes .navbar__submenu-column-label{border-bottom:var(--border-width) solid var(--border);box-sizing:border-box;display:block;font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-0-625);margin-top:var(--spacing-2);padding-bottom:var(--spacing-0-625);padding-left:var(--spacing-10);padding-right:var(--spacing-5);width:100%}.navbar__submenu--themes .navbar__submenu-column:first-of-type .navbar__submenu-column-label{margin-top:0}.navbar__submenu--themes .navbar__submenu-column .navbar__sublink{border-bottom:var(--border-width) solid var(--border);min-height:var(--touch-target-min)!important;padding:var(--spacing-3) var(--spacing-5) var(--spacing-3) var(--spacing-10)!important}.navbar__submenu--themes .navbar__sublink--with-icon{align-items:center;display:flex!important;gap:var(--spacing-2)}.navbar__submenu--themes .navbar__sublink-icon{color:var(--text-dim);flex-shrink:0}.navbar__submenu--themes .navbar__sublink-text{min-width:0;overflow:hidden;text-overflow:ellipsis}.navbar__item:last-of-type .navbar__link{border-bottom:var(--border-width) solid var(--border)}.navbar__actions-desktop .navbar__settings-btn{align-items:center;display:flex;justify-content:center;min-height:var(--touch-target-min);min-width:var(--touch-target-min);padding:var(--spacing-2) var(--spacing-3);width:auto}.navbar__actions-desktop .navbar__settings-label{border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.navbar__actions-desktop .search__trigger{justify-content:center;min-height:var(--touch-target-min);min-width:var(--touch-target-min);padding:var(--spacing-2) var(--spacing-3);width:auto}
|
|
98
|
-
.navbar__actions-desktop .search__kbd,.navbar__actions-desktop .search__trigger-text{border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.navbar__actions-desktop{display:flex;flex-shrink:0;gap:var(--spacing-2);margin-left:auto;margin-right:0;min-width:0;order:2}.search__panel{z-index:var(--z-navbar-mobile-search-panel)}.search__overlay{z-index:var(--z-navbar-mobile-search-overlay)}}.theme-switcher{display:inline-block;position:relative;width:100%}.settings .theme-switcher{width:100%}.settings .theme-switcher__trigger{justify-content:space-between;width:100%}.settings .theme-switcher__menu{left:0;min-width:auto;position:absolute;right:0;top:calc(100% + var(--spacing-2));z-index:var(--z-dropdown)}.theme-switcher__trigger{align-items:center;background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;display:flex;font-family:var(--font-family);font-size:var(--font-size-base);gap:var(--spacing-3);padding:var(--spacing-3) var(--spacing-4);transition:background-color var(--transition-base),border-color var(--transition-base)}.theme-switcher__label-wrapper{align-items:center;display:flex;gap:var(--spacing-2)}.theme-switcher__label-icon{align-items:center;display:flex;flex-shrink:0;height:var(--spacing-5);justify-content:center;width:var(--spacing-5)}.theme-switcher__label-icon svg{height:100%;width:100%}.theme-switcher__trigger:hover{background-color:var(--background);border-color:var(--accent);color:var(--text)}.theme-switcher__trigger:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.theme-switcher__trigger[aria-expanded="true"] .theme-switcher__icon{transform:rotate(180deg)}.theme-switcher__icon{flex-shrink:0;transition:transform var(--transition-base)}.theme-switcher__menu{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);display:flex;flex-direction:row;gap:0;left:0;max-height:var(--spacing-100);min-width:var(--spacing-
|
|
98
|
+
.navbar__actions-desktop .search__kbd,.navbar__actions-desktop .search__trigger-text{border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.navbar__actions-desktop{display:flex;flex-shrink:0;gap:var(--spacing-2);margin-left:auto;margin-right:0;min-width:0;order:2}.search__panel{z-index:var(--z-navbar-mobile-search-panel)}.search__overlay{z-index:var(--z-navbar-mobile-search-overlay)}}.theme-switcher{display:inline-block;position:relative;width:100%}.settings .theme-switcher{width:100%}.settings .theme-switcher__trigger{justify-content:space-between;width:100%}.settings .theme-switcher__menu{left:0;min-width:auto;position:absolute;right:0;top:calc(100% + var(--spacing-2));z-index:var(--z-dropdown)}.theme-switcher__trigger{align-items:center;background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;display:flex;font-family:var(--font-family);font-size:var(--font-size-base);gap:var(--spacing-3);min-width:var(--spacing-56);padding:var(--spacing-3) var(--spacing-4);transition:background-color var(--transition-base),border-color var(--transition-base)}.theme-switcher__label-wrapper{align-items:center;display:flex;gap:var(--spacing-2)}.theme-switcher__label-icon{align-items:center;display:flex;flex-shrink:0;height:var(--spacing-5);justify-content:center;width:var(--spacing-5)}.theme-switcher__label-icon svg{height:100%;width:100%}.theme-switcher__trigger:hover{background-color:var(--background);border-color:var(--accent);color:var(--text)}.theme-switcher__trigger:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.theme-switcher__trigger[aria-expanded="true"] .theme-switcher__icon{transform:rotate(180deg)}.theme-switcher__icon{flex-shrink:0;transition:transform var(--transition-base)}.theme-switcher__menu{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);display:flex;flex-direction:row;gap:0;left:0;max-height:var(--spacing-100);min-width:var(--spacing-96);opacity:0;overflow-y:auto;position:absolute;top:calc(100% + var(--spacing-2));transform:translateY(calc(var(--spacing-2)*-1));transition:opacity var(--transition-base),visibility var(--transition-base),transform var(--transition-base);visibility:hidden;z-index:var(--z-dropdown)}.theme-switcher__menu--open{opacity:1;transform:translateY(0);visibility:visible}.theme-switcher__menu-options{flex:1 1 auto;min-width:0;overflow-y:auto}.theme-switcher__preview{background-color:var(--background);display:flex;flex:0 0 auto;flex-direction:column;gap:var(--spacing-2);justify-content:flex-start;min-width:var(--spacing-32);opacity:1;padding:var(--spacing-4);pointer-events:none;transition:opacity var(--transition-fast);width:var(--spacing-32)}.theme-switcher__preview-title{color:var(--text);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);line-height:1.2;margin:0 0 var(--spacing-1) 0;overflow-wrap:break-word;padding:0}.theme-switcher__preview-header{color:var(--preview-accent,var(--text-dim));font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:.04em;line-height:1.2;margin:0 0 var(--spacing-2) 0;min-height:1.25em;overflow-wrap:break-word;padding:0;text-transform:uppercase}.theme-switcher__preview-swatch-wrap{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);box-shadow:inset 0 1px 2px oklch(0 0 0deg/6%);padding:var(--spacing-1)}.theme-switcher__preview-swatch{background-color:var(--background);border-radius:var(--radius);height:var(--spacing-10);min-height:var(--spacing-10);transition:background-color var(--transition-fast);width:100%}.theme-switcher__preview-accent{background-color:var(--preview-accent,var(--accent));border-radius:var(--radius-full);flex-shrink:0;height:var(--spacing-2);transition:background-color var(--transition-fast);width:100%}@media (width <= 480px){.theme-switcher__preview{display:none}}@media (width >= 481px){.theme-switcher__menu-options{border-right:var(--border-width) solid var(--border)}}.framework-switcher{align-items:center;border-bottom:var(--border-width) solid var(--border);display:flex;flex-wrap:wrap;gap:var(--spacing-3);margin-bottom:var(--spacing-6);padding:var(--spacing-3) 0}.framework-switcher__label{color:var(--text-dim);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);letter-spacing:.05em;text-transform:uppercase}.framework-switcher__segmented{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);box-shadow:inset 0 1px 2px oklch(from var(--shadow-color) l c h/8%);display:inline-flex;padding:var(--spacing-0-5)}.framework-switcher__segment{align-items:center;border-radius:var(--radius-md);color:var(--text-dim);display:inline-flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--spacing-2);justify-content:center;min-width:var(--spacing-20);padding:var(--spacing-2) var(--spacing-4);text-decoration:none;transition:color var(--transition-fast),background-color var(--transition-fast),box-shadow var(--transition-fast)}.framework-switcher__icon{display:block;flex-shrink:0}.framework-switcher__segment--current .framework-switcher__icon{opacity:.95}.framework-switcher__segment--first{border-radius:var(--radius-md) 0 0 var(--radius-md)}.framework-switcher__segment--last{border-radius:0 var(--radius-md) var(--radius-md) 0}.framework-switcher__segment:only-child{border-radius:var(--radius-md)}.framework-switcher__segment:hover:not(.framework-switcher__segment--current){background-color:oklch(from var(--text) l c h/10%);color:var(--text)}.framework-switcher__segment--current{background-color:var(--accent);box-shadow:var(--shadow-sm);color:var(--accent-text)}.framework-switcher__segment--current:hover{background-color:var(--accent-hover);color:var(--accent-text)}.theme-switcher__group{padding:var(--spacing-3) 0}.theme-switcher__group-label{border-bottom:var(--border-width) solid var(--border);color:var(--text-dim);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);letter-spacing:.05em;margin-bottom:var(--spacing-1);padding:var(--spacing-2) var(--spacing-4);text-transform:uppercase}.theme-switcher__option{align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;color:var(--text);cursor:pointer;display:flex;font:inherit;font-family:var(--font-family);font-size:var(--font-size-base);gap:var(--spacing-3);padding:var(--spacing-2) var(--spacing-4);position:relative;text-align:left;transition:background-color var(--transition-fast),color var(--transition-fast);-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}
|
|
99
99
|
.theme-switcher__option:focus-visible,.theme-switcher__option:hover{background-color:var(--background);color:var(--text);outline:none}.theme-switcher__option:focus-visible{box-shadow:inset 0 0 0 var(--outline-width) var(--accent)}.theme-switcher__option-icon{flex-shrink:0;height:var(--spacing-5);width:var(--spacing-5)}.theme-switcher__option--active,
|
|
100
100
|
.theme-switcher__option--active:focus-visible,
|
|
101
101
|
.theme-switcher__option--active:hover{background-color:var(--theme-bg,var(--background));border-left:var(--border-width-accent) solid var(--accent);border-radius:var(--radius);color:var(--text);font-weight:var(--font-weight-medium);padding-left:calc(var(--spacing-4) - var(--border-width-accent))}.theme-switcher__option--active:focus-visible{box-shadow:inset 0 0 0 var(--outline-width) var(--accent)}@media (width <= 640px){.theme-switcher__menu{left:0;right:auto}}.settings{inset:0;pointer-events:none;position:fixed;z-index:var(--z-settings)}.settings[aria-hidden="true"]{display:none}.settings__overlay{backdrop-filter:blur(var(--blur-sm));background-color:var(--overlay);inset:0;opacity:0;pointer-events:all;position:absolute;transition:opacity var(--transition-ease-out)}.settings[aria-hidden="false"] .settings__overlay[aria-hidden="false"],.settings__overlay[aria-hidden="false"]{opacity:1}.settings__panel{background-color:var(--background-alt);border-left:var(--border-width) solid var(--border);box-shadow:calc(var(--spacing-1)*-1) 0 var(--spacing-3) calc(var(--spacing-0-125)*-1) oklch(from var(--shadow-color) l c h/15%);display:flex;flex-direction:column;height:100%;max-width:var(--spacing-105);overflow-y:auto;pointer-events:all;position:absolute;right:0;top:0;transform:translateX(100%);transition:transform var(--transition-ease-out);width:100%}.settings__panel[data-open="true"]{transform:translateX(0)}.settings[aria-hidden="false"] .settings__panel:not([data-open]){transform:translateX(100%)}@media (prefers-reduced-motion:reduce){.settings__overlay,.settings__panel{transition:none}}.settings__header{align-items:center;background-color:var(--background-alt);border-bottom:var(--border-width) solid var(--border);display:flex;justify-content:space-between;padding:var(--spacing-6);position:sticky;top:0;z-index:var(--z-dropdown)}.settings__title{color:var(--text);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);margin:0}.settings__close{align-items:center;background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;display:flex;height:var(--spacing-8);justify-content:center;min-height:var(--touch-target-min);min-width:var(--touch-target-min);padding:0;transition:background-color var(--transition-base),color var(--transition-base),border-color var(--transition-base);width:var(--spacing-8)}.settings__close:hover{background-color:var(--background-alt);border-color:var(--accent);color:var(--accent)}.settings__close:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.settings__content{background-color:var(--background);display:flex;flex:1;flex-direction:column;gap:var(--spacing-8);padding:var(--spacing-6)}.settings__section{display:flex;flex-direction:column;gap:var(--spacing-4)}.settings__section-title{color:var(--text);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-4)}.settings__control{display:flex;flex-direction:column;gap:var(--spacing-3)}.settings__label{align-items:center;color:var(--text);display:flex;font-weight:var(--font-weight-medium);justify-content:space-between;margin-bottom:var(--spacing-3)}.settings__label-text{font-size:var(--font-size-base)}.settings__label-value{color:var(--text-dim);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold)}.settings__slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:linear-gradient(to right,var(--accent) 0,var(--accent) var(--slider-progress,50%),var(--background-alt) var(--slider-progress,50%),var(--background-alt) 100%);border:var(--border-width) solid var(--border);border-radius:var(--radius);cursor:pointer;height:var(--spacing-2);outline:none;width:100%}.settings__slider::-webkit-slider-runnable-track{background:linear-gradient(to right,var(--accent) 0,var(--accent) var(--slider-progress,50%),var(--background-alt) var(--slider-progress,50%),var(--background-alt) 100%);border:var(--border-width) solid var(--border);border-radius:var(--radius);box-shadow:inset 0 var(--spacing-0-125) var(--spacing-0-125) oklch(from var(--shadow-color) l c h/10%);height:var(--spacing-2);width:100%}.settings__slider::-moz-range-track{background:linear-gradient(to right,var(--accent) 0,var(--accent) var(--slider-progress,50%),var(--background-alt) var(--slider-progress,50%),var(--background-alt) 100%);border:var(--border-width) solid var(--border);border-radius:var(--radius);box-shadow:inset 0 var(--spacing-0-125) var(--spacing-0-125) oklch(from var(--shadow-color) l c h/10%);height:var(--spacing-2);width:100%}.settings__slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background-color:var(--accent);border:var(--outline-width) solid var(--background);border-radius:var(--radius-circle);box-shadow:0 0 0 var(--spacing-0-125) var(--border);cursor:pointer;height:var(--spacing-5);margin-top:calc(var(--spacing-2)*-1);-webkit-transition:background-color var(--transition-base),transform var(--transition-base),border-color var(--transition-base);transition:background-color var(--transition-base),transform var(--transition-base),border-color var(--transition-base);width:var(--spacing-5)}.settings__slider::-webkit-slider-thumb:hover{background-color:var(--accent-hover);transform:scale(1.1)}.settings__slider::-moz-range-thumb{background-color:var(--accent);border:var(--outline-width) solid var(--background);border-radius:var(--radius-circle);box-shadow:0 0 0 var(--spacing-0-125) var(--border);cursor:pointer;height:var(--spacing-5);-moz-transition:background-color var(--transition-base),transform var(--transition-base),border-color var(--transition-base);transition:background-color var(--transition-base),transform var(--transition-base),border-color var(--transition-base);width:var(--spacing-5)}.settings__slider::-moz-range-thumb:hover{background-color:var(--accent-hover);transform:scale(1.1)}.settings__slider:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.settings__slider-labels{color:var(--text-dim);display:flex;font-size:var(--font-size-xs);justify-content:space-between;margin-top:var(--spacing-1)}.settings__checkbox-label{align-items:center;color:var(--text);cursor:pointer;display:flex;font-size:var(--font-size-base);font-weight:var(--font-weight-medium);gap:var(--spacing-3);-webkit-user-select:none;-moz-user-select:none;user-select:none}.settings__checkbox-label:hover{color:var(--accent)}.settings__checkbox{accent-color:var(--accent);cursor:pointer;height:var(--spacing-5);margin:0;width:var(--spacing-5)}.settings__radio-group{display:flex;flex-direction:column;gap:var(--spacing-2)}.settings__radio-label{align-items:center;border-radius:var(--radius-md);color:var(--text);cursor:pointer;display:flex;font-size:var(--font-size-base);font-weight:var(--font-weight-normal);gap:var(--spacing-2);padding:var(--spacing-2);transition:background-color var(--transition-base),color var(--transition-base);-webkit-user-select:none;-moz-user-select:none;user-select:none}.settings__radio-label:hover{background-color:var(--background-alt);color:var(--accent)}.settings__radio{accent-color:var(--accent);cursor:pointer;height:var(--spacing-5);margin:0;width:var(--spacing-5)}.settings__help-text{color:var(--text-dim);font-size:var(--font-size-sm);line-height:var(--line-height-relaxed);margin:0}@media (width <= 640px){.settings__panel{max-width:100%;width:100%}}.modal__overlay{backdrop-filter:blur(var(--blur-sm));background-color:oklch(from var(--shadow-color) l c h/60%);bottom:0;left:0;opacity:0;pointer-events:none;position:fixed;right:0;top:0;transition:opacity var(--transition-slow) ease;z-index:var(--z-modal-backdrop)}.modal__overlay[aria-hidden="false"]{opacity:1;pointer-events:auto}.modal{background-color:var(--background);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);display:flex;flex-direction:column;left:50%;max-height:var(--vh-90);max-width:var(--max-height-modal);opacity:0;pointer-events:none;position:fixed;top:50%;transform:translate(-50%,-50%);transition:opacity var(--transition-slow) ease,transform var(--transition-slow) ease;width:100%;z-index:var(--z-modal)}.modal[aria-hidden="false"]{opacity:1;pointer-events:auto}.modal__header{align-items:center;border-bottom:var(--border-width) solid var(--border);display:flex;flex-shrink:0;justify-content:space-between;padding:var(--spacing-6)}.modal__title{color:var(--text);font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);margin:0}.modal__close{align-items:center;background:none;border:none;border-radius:var(--radius);color:var(--text-dim);cursor:pointer;display:flex;flex-shrink:0;justify-content:center;padding:var(--spacing-2);transition:background-color var(--transition-base),color var(--transition-base)}.modal__close:hover{background-color:var(--background-alt);color:var(--text)}.modal__close:focus{box-shadow:0 0 0 3px oklch(from var(--accent) l c h/10%);outline:none}.modal__body{flex:1;min-height:0;overflow-y:auto;padding:var(--spacing-6)}.modal__footer{border-top:var(--border-width) solid var(--border);display:flex;flex-shrink:0;gap:var(--spacing-3);justify-content:flex-end;padding:var(--spacing-6)}.modal__footer:empty{display:none}.modal--sm{max-width:var(--spacing-96)}.modal--md{max-width:var(--max-height-modal)}.modal--lg{max-width:var(--spacing-48)}
|
|
@@ -111,7 +111,7 @@ div.navbar__link{background:none;border:none;cursor:pointer;font:inherit;text-al
|
|
|
111
111
|
.toast-container--bottom-center .alert,.toast-container--top-center .alert{animation:toast-slide-in-down .3s ease-out}.reduced-motion .toast-container .alert{animation:none}@media (width <= 640px){.toast,
|
|
112
112
|
.toast-container{max-width:calc(100vw - var(--spacing-8));width:auto}.toast,
|
|
113
113
|
.toast-container,
|
|
114
|
-
.toast-container--bottom-center,.toast-container--top-center{left:var(--spacing-4)!important;right:var(--spacing-4)!important;transform:none!important}}.badge{align-items:center;border-radius:var(--radius);display:inline-flex;font-weight:var(--font-weight-medium);justify-content:center;line-height:1;transition:opacity var(--transition-base);vertical-align:baseline;white-space:nowrap}.badge--primary{background-color:var(--accent);color:var(--accent-text)}.badge--success{background-color:var(--success);color:var(--success-text)}.badge--warning{background-color:var(--warning);color:var(--warning-text)}.badge--error{background-color:var(--error);color:var(--error-text)}.badge--info{background-color:var(--info);color:var(--info-text)}.badge--sm{font-size:var(--font-size-xs);padding:var(--spacing-
|
|
114
|
+
.toast-container--bottom-center,.toast-container--top-center{left:var(--spacing-4)!important;right:var(--spacing-4)!important;transform:none!important}}.badge{align-items:center;border-radius:var(--radius);display:inline-flex;font-weight:var(--font-weight-medium);justify-content:center;line-height:1;padding:var(--spacing-1) var(--spacing-3);transition:opacity var(--transition-base);vertical-align:baseline;white-space:nowrap}.badge--primary{background-color:var(--accent);color:var(--accent-text)}.badge--success{background-color:var(--success);color:var(--success-text)}.badge--warning{background-color:var(--warning);color:var(--warning-text)}.badge--error{background-color:var(--error);color:var(--error-text)}.badge--info{background-color:var(--info);color:var(--info-text)}.badge--sm{font-size:var(--font-size-xs);padding:var(--spacing-1) var(--spacing-2)}.badge--md{font-size:var(--font-size-sm);padding:var(--spacing-1) var(--spacing-3)}.badge--lg{font-size:var(--font-size-base);padding:var(--spacing-2) var(--spacing-4)}.badge--pill{border-radius:var(--radius-full)}@media (prefers-reduced-motion:reduce){.alert{transition:none}}.tooltip-wrapper{display:inline-block;position:relative;--tooltip-delay:0ms}.tooltip{background-color:var(--text);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);color:var(--background);font-size:var(--font-size-sm);line-height:var(--line-height-tight);max-width:var(--spacing-64);opacity:0;overflow-wrap:break-word;padding:var(--spacing-2) var(--spacing-3);pointer-events:none;position:absolute;transform:scale(var(--scale-95));transition:opacity var(--transition-base) ease-out,transform var(--transition-base) ease-out;white-space:nowrap;white-space:normal;z-index:var(--z-tooltip)}.tooltip::before{border-style:solid;content:"";height:0;position:absolute;width:0}.tooltip--top{bottom:calc(100% + var(--spacing-2));left:50%;transform:translateX(-50%) scale(var(--scale-95))}.tooltip--top::before{border-color:var(--text) transparent transparent transparent;border-width:var(--border-width-arrow) var(--border-width-arrow) 0 var(--border-width-arrow);left:50%;top:100%;transform:translateX(-50%)}.tooltip--bottom{left:50%;top:calc(100% + var(--spacing-2));transform:translateX(-50%) scale(var(--scale-95))}.tooltip--bottom::before{border-color:transparent transparent var(--text) transparent;border-width:0 var(--border-width-arrow) var(--border-width-arrow) var(--border-width-arrow);bottom:100%;left:50%;transform:translateX(-50%)}.tooltip--left{right:calc(100% + var(--spacing-2));top:50%;transform:translateY(-50%) scale(var(--scale-95))}.tooltip--left::before{border-color:transparent transparent transparent var(--text);border-width:var(--border-width-arrow) 0 var(--border-width-arrow) var(--border-width-arrow);left:100%;top:50%;transform:translateY(-50%)}.tooltip--right{left:calc(100% + var(--spacing-2));top:50%;transform:translateY(-50%) scale(var(--scale-95))}.tooltip--right::before{border-color:transparent var(--text) transparent transparent;border-width:var(--border-width-arrow) var(--border-width-arrow) var(--border-width-arrow) 0;right:100%;top:50%;transform:translateY(-50%)}
|
|
115
115
|
.tooltip-wrapper:focus-within .tooltip,.tooltip-wrapper:hover .tooltip,
|
|
116
116
|
.tooltip-wrapper[aria-describedby]:focus-within + .tooltip,
|
|
117
117
|
.tooltip-wrapper[aria-describedby]:hover + .tooltip{opacity:1;pointer-events:auto;transform:translateX(-50%) scale(1);transition-delay:var(--tooltip-delay,0s)}
|
|
@@ -120,8 +120,10 @@ div.navbar__link{background:none;border:none;cursor:pointer;font:inherit;text-al
|
|
|
120
120
|
.tooltip-wrapper:focus-within .tooltip--right,.tooltip-wrapper:hover .tooltip--right{transform:translateY(-50%) scale(1)}@media (prefers-reduced-motion:reduce){.tooltip{transform:none;transition:opacity .1s ease-out}
|
|
121
121
|
.tooltip-wrapper:focus-within .tooltip,.tooltip-wrapper:hover .tooltip{transform:none}
|
|
122
122
|
.tooltip--bottom,.tooltip--top{transform:translateX(-50%)}.tooltip--left,
|
|
123
|
-
.tooltip--right{transform:translateY(-50%)}}.dropdown{display:inline-block;position:relative}.dropdown__trigger{align-items:center;background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;display:flex;font-family:var(--font-family);font-size:var(--font-size-sm);gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);transition:background-color var(--transition-base),border-color var(--transition-base)}.dropdown__trigger:hover{background-color:var(--background);border-color:var(--accent)}.dropdown__trigger:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.dropdown__trigger[aria-expanded="true"] .dropdown__icon{transform:rotate(180deg)}
|
|
124
|
-
.
|
|
123
|
+
.tooltip--right{transform:translateY(-50%)}}.dropdown{display:inline-block;position:relative}.dropdown__trigger{align-items:center;background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;display:flex;font-family:var(--font-family);font-size:var(--font-size-sm);gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);transition:background-color var(--transition-base),border-color var(--transition-base),color var(--transition-base)}.dropdown__trigger:hover{background-color:var(--background);border-color:var(--accent);color:var(--accent)}.dropdown__trigger:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.dropdown__trigger[aria-expanded="true"] .dropdown__icon{transform:rotate(180deg)}
|
|
124
|
+
.dropdown__trigger:focus-visible .dropdown__icon,.dropdown__trigger:hover .dropdown__icon{color:var(--accent)}.dropdown__trigger-text{flex:1;text-align:left}.dropdown__icon{color:var(--icon);flex-shrink:0;transition:transform var(--transition-base),color var(--transition-base)}.dropdown__menu{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);list-style:none;margin:0;max-width:calc(100vw - var(--spacing-8));min-width:var(--spacing-64);opacity:0;overflow:visible!important;padding:var(--spacing-2) 0;position:absolute;top:calc(100% + var(--spacing-2));transform:translateY(calc(var(--spacing-2)*-1));transition:opacity var(--transition-base),visibility var(--transition-base),transform var(--transition-base);visibility:hidden;width:-moz-max-content;width:max-content;z-index:var(--z-dropdown)}.dropdown__menu--left{left:0}.dropdown__menu--right{right:0}.dropdown__menu--start{left:0}.dropdown__menu--end{right:0}.dropdown__menu--open{opacity:1;transform:translateY(0);visibility:visible}.dropdown__item{align-items:center;background-color:transparent;border:none;color:var(--text);cursor:pointer;display:flex;font-family:var(--font-family);font-size:var(--font-size-sm);gap:var(--spacing-2);min-height:var(--touch-target-min);overflow:hidden;padding:var(--spacing-2) var(--spacing-4);text-align:left;text-decoration:none;text-overflow:ellipsis;transition:background-color var(--transition-fast),color var(--transition-fast);-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap;width:100%}
|
|
125
|
+
.dropdown__item:focus-visible:not(.dropdown__item--disabled),.dropdown__item:hover:not(.dropdown__item--disabled){background-color:var(--background);color:var(--accent);outline:none}.dropdown__item:focus-visible:not(.dropdown__item--disabled){box-shadow:inset 0 0 0 var(--outline-width) var(--accent)}.dropdown__item--disabled{cursor:not-allowed;opacity:var(--opacity-50);pointer-events:none}.dropdown__item-icon{flex-shrink:0;height:var(--spacing-4);width:var(--spacing-4)}.dropdown__separator{background-color:var(--border);height:var(--border-width);margin:var(--spacing-2) 0}.dropdown__item-wrapper,.dropdown__item-wrapper--has-submenu{overflow:visible;position:relative}.dropdown__item--has-submenu{align-items:center;display:flex;justify-content:space-between}.dropdown__item-arrow{color:inherit;flex-shrink:0;height:var(--spacing-3);margin-left:var(--spacing-2);transition:transform var(--transition-base),color var(--transition-base);width:var(--spacing-3)}
|
|
126
|
+
.dropdown__item:focus-visible:not(.dropdown__item--disabled) .dropdown__item-arrow,.dropdown__item:hover:not(.dropdown__item--disabled) .dropdown__item-arrow{color:var(--accent)}.dropdown__item-wrapper--has-submenu .dropdown__submenu--open ~ .dropdown__item-arrow,
|
|
125
127
|
.dropdown__item-wrapper--has-submenu:has(.dropdown__submenu--open) .dropdown__item-arrow{transform:rotate(-90deg)}.dropdown__item-wrapper--has-submenu .dropdown__item[aria-expanded="true"] .dropdown__item-arrow{transform:rotate(-90deg)}.dropdown__submenu{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);display:block;left:0;list-style:none;margin:0;max-width:100%;min-width:100%;opacity:0;overflow:visible!important;padding:var(--spacing-2) 0;pointer-events:none;position:absolute;right:0;top:100%;transform:translateY(calc(var(--spacing-2)*-1));transition:opacity var(--transition-base),visibility var(--transition-base),transform var(--transition-base);visibility:hidden;width:100%;z-index:var(--z-dropdown-submenu)}.dropdown__submenu--open{display:block!important;opacity:1!important;pointer-events:all!important;transform:translateY(0)!important;visibility:visible!important}.dropdown__submenu-item{min-height:var(--touch-target-min);padding:var(--spacing-2) var(--spacing-4)}.dropdown__submenu .dropdown__item{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (width <= 640px){.dropdown__menu{left:0;max-width:calc(100vw - var(--spacing-4));min-width:100%;right:auto}.dropdown__menu--right{left:auto;right:0}.dropdown__submenu{max-width:100%}}@media (prefers-reduced-motion:reduce){.dropdown__menu{transform:none;transition:opacity var(--transition-fast),visibility var(--transition-fast)}.dropdown__menu--open{transform:none}.dropdown__icon{transition:none}}.search{display:inline-block}.search,.search__trigger-wrapper{position:relative}.search__trigger{align-items:center;background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;display:flex;font-family:var(--font-family);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);transition:background-color var(--transition-base),border-color var(--transition-base)}@media (width <= 1023px){.search__trigger{gap:0}.search__icon{flex-shrink:0;height:var(--spacing-5);width:var(--spacing-5)}}.search__trigger:hover{background-color:var(--background);border-color:var(--accent);color:var(--text)}.search__trigger:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.search__kbd{align-items:center;display:none;font-family:var(--font-family-mono);font-size:var(--font-size-xs);gap:var(--spacing-1);margin-left:auto}.search__kbd kbd{background-color:var(--background);border:var(--border-width) solid var(--border);border-radius:var(--radius);font-size:var(--font-size-xs);line-height:1;padding:var(--spacing-0-125) var(--spacing-0-375)}@media (width >= 768px){.search__kbd{display:flex}}.search__overlay{backdrop-filter:blur(var(--blur-sm));background-color:var(--overlay);bottom:0;box-sizing:border-box;height:100%;left:0;min-height:100vh;min-height:100dvh;min-width:100vw;opacity:0;pointer-events:none;position:fixed;right:0;top:0;transition:opacity .2s ease-out;width:100%;z-index:var(--z-search-overlay)}.search__overlay[aria-hidden="false"]{opacity:1;pointer-events:all;z-index:var(--z-search-overlay)}.search__overlay[aria-hidden="true"]{display:none}@media (width <= 1023px){.search__overlay[aria-hidden="true"]{display:none!important;pointer-events:none!important}.search__overlay{backdrop-filter:blur(2px);background-color:oklch(from var(--overlay) l c h/60%)}}.search__panel{background-color:var(--background);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);box-sizing:border-box;display:flex;flex-direction:column;left:50%;max-height:calc(100vh - var(--spacing-8));max-height:calc(100dvh - var(--spacing-8));max-width:var(--spacing-150);opacity:0;outline:none;overflow:hidden;padding-bottom:var(--spacing-6);pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);transition:opacity .2s ease-out;width:calc(100vw - var(--spacing-8));z-index:var(--z-search-panel)}.search__panel[aria-hidden="true"]{display:none}.search__panel[aria-hidden="false"][data-open="true"]{background-color:var(--background);display:flex;opacity:1;pointer-events:all}@media (width <= 640px){.search__panel{max-height:calc(100dvh - var(--spacing-8));max-width:none;width:calc(100vw - var(--spacing-8))}}@media (width <= 1023px){.search__panel[aria-hidden="false"][data-open="true"] .search__header{background-color:var(--background)!important;position:relative;z-index:var(--z-1)}}.search__header{background-color:var(--background);border-bottom:var(--border-width) solid var(--border);border-top-left-radius:var(--radius-lg);border-top-right-radius:var(--radius-lg);gap:var(--spacing-3);padding:var(--spacing-5) var(--spacing-6);position:relative}.search__close-btn,.search__header{align-items:center;display:flex;flex-shrink:0}.search__close-btn{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;font-family:var(--font-family);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--spacing-2);justify-content:center;min-height:var(--touch-target-min);min-width:var(--touch-target-min);padding:var(--spacing-2);transition:background-color var(--transition-base),border-color var(--transition-base)}.search__close-btn:hover{background-color:var(--background-alt);border-color:var(--accent);color:var(--accent)}.search__close-btn:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.search__close-btn:active{background-color:var(--background-alt)}.search__close-text{display:none}@media (width > 1023px){.search__close-btn{min-height:var(--touch-target-min);min-width:var(--touch-target-min);padding:var(--spacing-2)}}@media (width <= 1023px){.search__header{gap:var(--spacing-2);padding:var(--spacing-4)}.search__close-btn{min-height:var(--touch-target-min);padding:var(--spacing-2) var(--spacing-4);white-space:nowrap}.search__close-text{display:inline}.search__input-wrapper{flex:1;min-width:0}}.search__input-wrapper{align-items:center;display:flex;flex:1;position:relative}.search__input-icon{color:var(--icon-dim);flex-shrink:0;height:var(--spacing-5);left:var(--spacing-4);pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);width:var(--spacing-5);z-index:calc(var(--z-base) + 2)}.search__input{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);box-sizing:border-box;color:var(--text);font-family:var(--font-family);font-size:var(--font-size-base);padding:var(--spacing-3) calc(var(--spacing-14) + var(--spacing-0-125)) var(--spacing-3) var(--spacing-16)!important;transition:border-color var(--transition-base),background-color var(--transition-base);width:100%}.search__input:focus{background-color:var(--background);border-color:var(--accent);outline:none}.search__input::-moz-placeholder{color:var(--text-dim)}.search__input::placeholder{color:var(--text-dim)}.search__clear{align-items:center;background:none;border:none;border-radius:var(--radius);color:var(--text-dim);cursor:pointer;display:flex;height:var(--spacing-8);justify-content:center;opacity:0;padding:0;pointer-events:none;position:absolute;right:var(--spacing-3);transition:color var(--transition-base),background-color var(--transition-base);width:var(--spacing-8);z-index:calc(var(--z-base) + 3)}.search__clear[aria-hidden="false"]{opacity:1;pointer-events:all}@media (width <= 1023px){.search__clear{display:none!important}}.search__clear:hover{background-color:var(--background);color:var(--text)}.search__clear:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.search__results{background-color:var(--background)!important;display:flex!important;flex:1;flex-direction:column;height:auto!important;left:0!important;max-height:calc(var(--vh-70) - var(--spacing-20));min-height:var(--spacing-75)!important;opacity:1!important;overflow-x:hidden;overflow-y:auto;padding:var(--spacing-4) var(--spacing-6) var(--spacing-8) var(--spacing-6);position:relative!important;right:auto!important;visibility:visible!important;width:100%!important;z-index:calc(var(--z-base) + 1)}.search__empty,
|
|
126
128
|
.search__loading,
|
|
127
129
|
.search__no-results{align-items:center;display:flex;justify-content:center;padding:var(--spacing-6) var(--spacing-4);text-align:center}.search__empty-text,
|
|
@@ -133,5 +135,5 @@ div.navbar__link{background:none;border:none;cursor:pointer;font:inherit;text-al
|
|
|
133
135
|
.accordion__panel-content :global(ol:first-child),.accordion__panel-content :global(p:first-child),
|
|
134
136
|
.accordion__panel-content :global(ul:first-child){margin-top:0}
|
|
135
137
|
.accordion__panel-content :global(ol:last-child),.accordion__panel-content :global(p:last-child),
|
|
136
|
-
.accordion__panel-content :global(ul:last-child){margin-bottom:0}.accordion__slot-content{display:none}.tabs{width:100%}.tabs__list{border-bottom:var(--outline-width) solid var(--border);display:flex;gap:var(--spacing-1);margin-bottom:var(--spacing-6);overflow-x:auto;scrollbar-width:thin;-webkit-overflow-scrolling:touch}.tabs__list::-webkit-scrollbar{height:var(--spacing-0-125)}.tabs__list::-webkit-scrollbar-track{background:var(--background-alt)}.tabs__list::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--radius)}.tabs__tab{align-items:center;background:transparent;border:none;border-bottom:calc(var(--outline-width)*2) solid transparent;border-radius:var(--radius-md) var(--radius-md) 0 0;color:var(--text-dim);cursor:pointer;display:inline-flex;font-family:var(--font-family);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);justify-content:center;margin-bottom:calc(var(--outline-width)*-1*2);min-height:var(--touch-target-min);outline:none;padding:var(--spacing-3) var(--spacing-5);position:relative;transition:color var(--transition-base),border-color var(--transition-base),background-color var(--transition-base);white-space:nowrap}.tabs__tab:hover:not(.tabs__tab--active){background-color:var(--background-alt);color:var(--text)}.tabs__tab:focus-visible{border-radius:var(--radius-md) var(--radius-md) 0 0;outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.tabs__tab--active{border-bottom-color:var(--accent);border-bottom-width:calc(var(--outline-width)*3);font-weight:var(--font-weight-semibold)}.tabs__tab--active,.tabs__tab--active:hover{background-color:var(--background-alt);color:var(--accent)}.tabs__tab--active:hover{border-bottom-color:var(--accent)}.tabs__panels-wrapper{width:100%}.tabs__panel{display:none;min-height:var(--spacing-20);padding:var(--spacing-6) 0;width:100%}.tabs__panel--active{animation:fadeIn var(--transition-base);display:block}.tabs__panel-content{width:100%}@keyframes fade-in{from{opacity:0;transform:translateY(var(--spacing-1))}to{opacity:1;transform:translateY(0)}}.tabs__slot-content{display:none}.tabs--pills .tabs__list{border-bottom:none;gap:var(--spacing-2)}.tabs--pills .tabs__tab{border-bottom:none;border-radius:var(--radius-md);margin-bottom:0}.tabs--pills .tabs__tab--active{background-color:var(--accent);border-bottom-color:transparent;color:var(--accent-text)}.tabs--pills .tabs__tab--active:hover{background-color:var(--accent-hover);color:var(--accent-text)}.tabs--underline .tabs__list{border-bottom:var(--outline-width) solid var(--border)}.tabs--underline .tabs__tab{border-bottom:var(--outline-width) solid transparent;padding-bottom:var(--spacing-3)}.tabs--underline .tabs__tab--active{border-bottom-color:var(--accent);border-bottom-width:calc(var(--outline-width)*2)}@media (width <= 640px){.tabs__list{gap:var(--spacing-1)}.tabs__tab{font-size:var(--font-size-sm);padding:var(--spacing-2) var(--spacing-3)}.tabs__panel{padding:var(--spacing-3) 0}}@media (prefers-reduced-motion:reduce){.tabs__tab{transition:none}.tabs__panel--active{animation:none}}.progress{display:flex;flex-direction:column;gap:var(--spacing-2);width:100%}.progress__track{background-color:var(--background-alt);border:var(--border-width) solid var(--border);overflow:hidden;width:100%}.progress__bar,.progress__track{border-radius:var(--radius-full)}.progress__bar{flex-shrink:0;height:100%;min-height:var(--spacing-2);transition:width var(--transition-slow) var(--ease-in-out-cubic)}.progress--sm .progress__track{height:var(--spacing-1)}.progress--sm .progress__bar{min-height:var(--spacing-1)}.progress--md .progress__track{height:var(--spacing-2)}.progress--md .progress__bar{min-height:var(--spacing-2)}.progress--lg .progress__track{height:var(--spacing-3)}.progress--lg .progress__bar{min-height:var(--spacing-3)}.progress--primary .progress__bar{background-color:var(--accent)}.progress--success .progress__bar{background-color:var(--success)}.progress--warning .progress__bar{background-color:var(--warning)}.progress--error .progress__bar{background-color:var(--error)}.progress--info .progress__bar{background-color:var(--info)}.progress__label{color:var(--text-dim);font-size:var(--font-size-sm);text-align:right}.progress--indeterminate .progress__bar{animation:progress-indeterminate 1.5s ease-in-out infinite;min-width:30%;width:30%!important}@keyframes progress-indeterminate{0%{transform:translateX(-100%)}100%{transform:translateX(233.333%)}}@media (prefers-reduced-motion:reduce){.progress__bar{transition:none}.progress--indeterminate .progress__bar{animation:none;opacity:.7;width:50%!important}}.spinner{align-items:center;display:inline-flex;justify-content:center;vertical-align:middle}.spinner__ring{animation:spinner-rotate .8s linear infinite;border-color:var(--border);border-radius:var(--radius-full);border-style:solid;border-top-color:currentcolor;display:block}.spinner--sm .spinner__ring{border-width:var(--border-width-2);height:var(--spacing-4);width:var(--spacing-4)}.spinner--md .spinner__ring{border-width:var(--border-width-3);height:var(--spacing-6);width:var(--spacing-6)}.spinner--lg .spinner__ring{border-width:var(--border-width-4);height:var(--spacing-8);width:var(--spacing-8)}.spinner--primary{color:var(--accent)}.spinner--success{color:var(--success)}.spinner--warning{color:var(--warning)}.spinner--error{color:var(--error)}.spinner--info{color:var(--info)}@keyframes spinner-rotate{to{transform:rotate(1turn)}}@media (prefers-reduced-motion:reduce){.spinner__ring{animation:none;border-bottom-color:transparent;border-left-color:transparent;border-right-color:transparent}}.avatar{align-items:center;background-color:var(--background-alt);border:var(--border-width) solid var(--border);color:var(--text-dim);display:inline-flex;flex-shrink:0;font-size:inherit;font-weight:var(--font-weight-semibold);justify-content:center;line-height:1;overflow:hidden}.avatar__img{display:block;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.avatar__initials{align-items:center;display:flex;height:100%;justify-content:center;width:100%}.avatar--sm{font-size:var(--font-size-xs);height:var(--spacing-8);width:var(--spacing-8)}.avatar--md{font-size:var(--font-size-sm);height:var(--spacing-10);width:var(--spacing-10)}.avatar--lg{font-size:var(--font-size-base);height:var(--spacing-12);width:var(--spacing-12)}.avatar--circle{border-radius:var(--radius-full)}.avatar--square{border-radius:var(--radius-md)}.divider{align-items:center;color:var(--text-dim);display:flex;font-size:var(--font-size-sm);gap:var(--spacing-3)}.divider__line{border:none;border-left:none;border-top:var(--border-width) solid var(--border);flex:1;min-height:0;min-width:0}.divider__label{flex-shrink:0;padding:0 var(--spacing-2);white-space:nowrap}.divider--horizontal{width:100%}.divider--horizontal .divider__line{border-left:none;border-top:var(--border-width) solid var(--border)}.divider--vertical{flex-direction:column;height:100%;min-height:var(--spacing-8);width:auto}.divider--vertical .divider__line{border-left:var(--border-width) solid var(--border);border-top:none;flex:1;min-height:var(--spacing-4);width:0}.table{display:flex;flex-direction:column;gap:var(--spacing-3);width:100%}.table__filter-wrap{align-items:center;display:flex;flex-shrink:0;position:relative}.table__filter-icon{align-items:center;color:var(--icon-dim);display:flex;justify-content:center;left:var(--spacing-3);pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.table__filter-icon-svg{color:currentcolor;height:var(--table-filter-icon-size,1.25rem);width:var(--table-filter-icon-size,1.25rem)}.table__filter-wrap:focus-within .table__filter-icon{color:var(--accent)}.table__filter-wrap .table__filter{background-color:var(--background);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);font-family:var(--font-family);font-size:var(--font-size-base);max-width:var(--spacing-80);padding-bottom:var(--spacing-2);padding-left:3.5rem;padding-right:var(--spacing-3);padding-top:var(--spacing-2);width:100%}.table__filter-wrap .table__filter::-moz-placeholder{color:var(--text-dim)}.table__filter-wrap .table__filter::placeholder{color:var(--text-dim)}.table__filter-wrap .table__filter:focus{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.table__wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch}.table__table{border-collapse:collapse;border-spacing:0;font-size:var(--font-size-sm);width:100%}.table__caption{color:var(--text);font-weight:var(--font-weight-semibold);padding:var(--spacing-2) 0;text-align:left}.table__head .table__row{border-bottom:var(--border-width-2) solid var(--border)}.table__cell{border-bottom:var(--border-width) solid var(--border);color:var(--text);padding:var(--spacing-3) var(--spacing-4);text-align:left}.table__cell--head{color:var(--text);font-weight:var(--font-weight-semibold);white-space:nowrap}.table__sort-trigger{align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;border-radius:var(--radius-md);color:var(--text);cursor:pointer;display:inline-flex;font:inherit;font-weight:var(--font-weight-semibold);padding:0;text-align:left;transition:background-color var(--transition-fast),color var(--transition-fast);width:100%}.table__sort-trigger:hover{background-color:var(--background-alt);color:var(--text)}.table__sort-trigger:hover .table__sort-icon-svg{color:var(--accent)}.table__sort-trigger:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.table--sortable .table__cell--head{padding:0}.table--sortable .table__cell--head .table__sort-trigger{padding:var(--spacing-3) var(--spacing-4)}.table__cell-content{display:inline-block}.table__sort-icon{align-items:center;display:inline-flex;flex-shrink:0;justify-content:center;margin-left:var(--spacing-2)}.table__sort-icon-svg{color:var(--icon-dim);height:var(--table-sort-icon-size,1.25rem);transition:color var(--transition-fast);width:var(--table-sort-icon-size,1.25rem)}.table__body .table__row:hover{background-color:var(--background-alt)}.table__body .table__row:hover .table__cell{color:var(--text)}.table--striped .table__body .table__row:nth-child(even){background-color:var(--background-alt)}.table--striped .table__body .table__row:nth-child(even):hover{background-color:var(--background)}.table--striped .table__body .table__row:nth-child(even):hover .table__cell{color:var(--text)}.table__body .table__row[hidden]{display:none}@media (prefers-reduced-motion:reduce){.table__sort-icon-svg,.table__sort-trigger{transition:none}}.home{padding:var(--spacing-8) var(--spacing-4)}.home__container{margin:0 auto;max-width:var(--container-default);padding:0 var(--spacing-4)}.home__hero{margin-bottom:var(--spacing-16);padding:var(--spacing-16) 0;text-align:center}.home__title{color:var(--text);font-size:var(--font-size-5xl);font-weight:var(--font-weight-extrabold);line-height:var(--line-height-tight);margin:0 0 var(--spacing-6) 0}.home__subtitle{color:var(--text-dim);font-size:var(--font-size-xl);line-height:var(--line-height-relaxed);margin:0 auto;max-width:var(--spacing-175)}.home__section-title{color:var(--text);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-8);text-align:center}.home__install{margin-bottom:var(--spacing-16)}.home__install-grid{display:grid;gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--spacing-100)),1fr));margin:0 auto;max-width:var(--spacing-175)}.home__install-block{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);padding:var(--spacing-5)}.home__install-label{color:var(--text-dim);font-size:var(--font-size-sm);margin:0 0 var(--spacing-3) 0}.home__install-copy{display:block;max-width:100%;width:100%}.home__install-copy .copy-to-clipboard__text{white-space:normal;word-break:break-all}.home__grid{display:grid;gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(var(--spacing-75),1fr));margin-bottom:var(--spacing-16)}.home__card{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);color:var(--text);padding:var(--spacing-6)}.home__card h3{color:var(--text);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-3) 0}.home__card p{color:var(--text-dim);line-height:var(--line-height-relaxed);margin:0}.home__examples{margin-bottom:var(--spacing-16)}.home__example{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);margin-bottom:var(--spacing-8);padding:var(--spacing-8)}.home__example h3{color:var(--text);font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-4) 0}.home__example p{color:var(--text-dim);margin-bottom:var(--spacing-4)}.home__button-group{display:flex;flex-wrap:wrap;gap:var(--spacing-3)}.home__theme-demo{max-width:var(--spacing-75)}.home__theme-demo .theme-switcher{position:relative;width:100%;z-index:var(--z-dropdown)}.home__theme-demo .theme-switcher__menu{z-index:var(--z-dropdown)}.home__docs{margin-bottom:var(--spacing-8)}.home__docs-grid{display:grid;gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(var(--spacing-70),1fr))}.home__doc-card{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);color:var(--text);display:block;padding:var(--spacing-6);text-decoration:none;transition:border-color var(--transition-base),transform var(--transition-base),box-shadow var(--transition-base)}.home__doc-card:hover{border-color:var(--accent);box-shadow:var(--shadow-md);transform:translateY(calc(var(--spacing-0-125)*-1))}.home__doc-card:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.home__doc-card h3{color:var(--accent);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-2) 0}.home__doc-card p{color:var(--text-dim);line-height:var(--line-height-relaxed);margin:0}@media (width <= 640px){.home__title{font-size:var(--font-size-4xl)}.home__subtitle{font-size:var(--font-size-lg)}
|
|
137
|
-
.home__docs-grid,.home__grid{grid-template-columns:1fr}}.theming-page .card a{color:var(--text);text-decoration:none;transition:color var(--transition-base)}.theming-page .card a:hover{color:var(--accent)}.theming-page .card:hover{transform:translateY(calc(var(--spacing-0-125)*-1));transition:transform var(--transition-base)}.reduced-motion .theming-page .card:hover{transform:none}.theme-by{color:var(--text-dim);font-size:var(--font-size-sm);margin:0 0 var(--spacing-4) 0}.theme-by a{color:var(--accent);text-decoration:none;transition:color var(--transition-base)}.theme-by a:hover{color:var(--accent-hover);text-decoration:underline}[data-theme="github-dark-classic"]{--bg:oklch(18% 0.012 264deg);--bg-alt:oklch(15% 0.01 264deg);--current-line:oklch(20% 0.012 264deg);--selection:oklch(28% 0.08 255deg);--fg:oklch(91% 0.004 264deg);--fg-dim:oklch(66% 0.01 264deg);--comment:oklch(52% 0.015 264deg);--cyan:oklch(72% 0.12 250deg);--green:oklch(72% 0.19 145deg);--orange:oklch(78% 0.12 55deg);--pink:oklch(68% 0.14 15deg);--purple:oklch(68% 0.14 300deg);--red:oklch(68% 0.16 15deg);--yellow:oklch(88% 0.12 95deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--icon:var(--fg);--icon-dim:oklch(75% 0.01 264deg);--border:oklch(13% 0.01 264deg);--accent:var(--cyan);--accent-hover:oklch(78% 0.12 250deg);--accent-text:oklch(100% 0 0deg);--accent-text-on-hover:oklch(22% 0.03 250deg);--success:var(--green);--success-hover:oklch(78% 0.16 145deg);--success-text:oklch(100% 0 0deg);--success-text-on-solid:oklch(22% 0.03 145deg);--warning:var(--orange);--warning-hover:oklch(85% 0.1 55deg);--warning-text:oklch(100% 0 0deg);--warning-text-on-solid:oklch(22% 0.02 55deg);--error:var(--red);--error-hover:oklch(75% 0.14 15deg);--error-text:oklch(100% 0 0deg);--error-text-on-solid:oklch(22% 0.03 25deg);--info:var(--cyan);--info-hover:oklch(78% 0.1 250deg);--info-text:oklch(100% 0 0deg);--info-text-on-solid:oklch(22% 0.03 250deg)}[data-theme="shades-of-purple"]{--bg:oklch(18% 0.08 290deg);--bg-alt:oklch(15% 0.08 290deg);--current-line:oklch(25% 0.10 290deg);--selection:oklch(30% 0.12 290deg);--fg:oklch(95% 0.01 300deg);--fg-dim:oklch(75% 0.05 300deg);--comment:oklch(55.% 0.08 280deg);--cyan:oklch(75% 0.15 220deg);--green:oklch(70% 0.20 150deg);--orange:oklch(75% 0.18 60deg);--pink:oklch(75% 0.22 340deg);--purple:oklch(65% 0.25 290deg);--red:oklch(65% 0.22 25deg);--yellow:oklch(85% 0.18 100deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--icon:var(--fg);--icon-dim:oklch(80% 0.05 300deg);--border:var(--current-line);--accent:var(--purple);--accent-hover:var(--pink);--accent-text:oklch(100% 0 0deg);--accent-text-on-hover:oklch(22% 0.03 300deg);--success:var(--green);--success-hover:oklch(78% 0.16 145deg);--success-text:oklch(100% 0 0deg);--success-text-on-solid:oklch(22% 0.03 145deg);--warning:var(--yellow);--warning-hover:oklch(92% 0.1 95deg);--warning-text:oklch(100% 0 0deg);--warning-text-on-solid:oklch(22% 0.02 95deg);--error:var(--red);--error-hover:oklch(75% 0.14 15deg);--error-text:oklch(100% 0 0deg);--error-text-on-solid:oklch(22% 0.03 15deg);--info:var(--cyan);--info-hover:oklch(78% 0.1 250deg);--info-text:oklch(100% 0 0deg);--info-text-on-solid:oklch(22% 0.03 250deg)}[data-theme="sandstorm-classic"]{--bg:oklch(16% 0.025 25deg);--bg-alt:oklch(13% 0.02 25deg);--current-line:oklch(20% 0.025 25deg);--selection:oklch(28% 0.06 25deg);--fg:oklch(90% 0.01 25deg);--fg-dim:oklch(62% 0.02 25deg);--comment:oklch(52% 0.03 25deg);--cyan:oklch(68% 0.12 220deg);--green:oklch(68% 0.18 145deg);--orange:oklch(72% 0.14 55deg);--pink:oklch(65% 0.16 350deg);--purple:oklch(62% 0.14 300deg);--red:oklch(58% 0.18 25deg);--yellow:oklch(82% 0.12 95deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--icon:var(--fg);--icon-dim:oklch(72% 0.02 25deg);--border:oklch(22% 0.02 25deg);--accent:var(--red);--accent-hover:oklch(62% 0.16 25deg);--accent-text:oklch(100% 0 0deg);--accent-text-on-hover:oklch(22% 0.03 25deg);--success:var(--green);--success-hover:oklch(74% 0.16 145deg);--success-text:oklch(100% 0 0deg);--success-text-on-solid:oklch(22% 0.03 145deg);--warning:var(--orange);--warning-hover:oklch(78% 0.12 55deg);--warning-text:oklch(98% 0 0deg);--warning-text-on-solid:oklch(22% 0.02 55deg);--error:var(--red);--error-hover:oklch(65% 0.16 25deg);--error-text:oklch(100% 0 0deg);--error-text-on-solid:oklch(22% 0.03 25deg);--info:var(--cyan);--info-hover:oklch(74% 0.1 220deg);--info-text:oklch(100% 0 0deg);--info-text-on-solid:oklch(22% 0.03 220deg)}[data-theme="rocky-blood-orange"]{--bg:oklch(16% 0.03 45deg);--bg-alt:oklch(13% 0.025 45deg);--current-line:oklch(20% 0.03 45deg);--selection:oklch(28% 0.06 45deg);--fg:oklch(90% 0.01 45deg);--fg-dim:oklch(60% 0.02 45deg);--comment:oklch(52% 0.03 45deg);--cyan:oklch(68% 0.12 220deg);--green:oklch(68% 0.18 145deg);--orange:oklch(62% 0.16 55deg);--pink:oklch(65% 0.16 350deg);--purple:oklch(62% 0.14 300deg);--red:oklch(58% 0.18 25deg);--yellow:oklch(82% 0.12 95deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--icon:var(--fg);--icon-dim:oklch(72% 0.02 45deg);--border:oklch(22% 0.02 45deg);--accent:var(--orange);--accent-hover:oklch(68% 0.14 55deg);--accent-text:oklch(100% 0 0deg);--accent-text-on-hover:oklch(22% 0.03 55deg);--success:var(--green);--success-hover:oklch(74% 0.16 145deg);--success-text:oklch(100% 0 0deg);--success-text-on-solid:oklch(22% 0.03 145deg);--warning:var(--orange);--warning-hover:oklch(72% 0.14 55deg);--warning-text:oklch(98% 0 0deg);--warning-text-on-solid:oklch(22% 0.02 55deg);--error:var(--red);--error-hover:oklch(65% 0.16 25deg);--error-text:oklch(100% 0 0deg);--error-text-on-solid:oklch(22% 0.03 25deg);--info:var(--cyan);--info-hover:oklch(74% 0.1 220deg);--info-text:oklch(100% 0 0deg);--info-text-on-solid:oklch(22% 0.03 220deg)}[data-theme="minimal-dark-neon-yellow"]{--bg:oklch(14% 0.01 95deg);--bg-alt:oklch(11% 0.008 95deg);--current-line:oklch(18% 0.015 95deg);--selection:oklch(25% 0.08 95deg);--fg:oklch(92% 0.02 95deg);--fg-dim:oklch(65% 0.02 95deg);--comment:oklch(50% 0.02 95deg);--icon:var(--fg);--icon-dim:oklch(72% 0.02 95deg);--cyan:oklch(72% 0.12 220deg);--green:oklch(72% 0.18 145deg);--orange:oklch(78% 0.14 55deg);--pink:oklch(68% 0.16 350deg);--purple:oklch(65% 0.14 300deg);--red:oklch(62% 0.18 25deg);--yellow:oklch(88% 0.18 95deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(20% 0.02 95deg);--accent:var(--yellow);--accent-hover:oklch(90% 0.16 95deg);--accent-text:oklch(12% 0.02 95deg);--accent-text-on-hover:oklch(22% 0.03 95deg);--success:var(--green);--success-hover:oklch(78% 0.16 145deg);--success-text:oklch(100% 0 0deg);--success-text-on-solid:oklch(22% 0.03 145deg);--warning:var(--orange);--warning-hover:oklch(85% 0.12 55deg);--warning-text:oklch(98% 0 0deg);--warning-text-on-solid:oklch(22% 0.02 55deg);--error:var(--red);--error-hover:oklch(68% 0.16 25deg);--error-text:oklch(100% 0 0deg);--error-text-on-solid:oklch(22% 0.03 25deg);--info:var(--cyan);--info-hover:oklch(78% 0.1 220deg);--info-text:oklch(100% 0 0deg);--info-text-on-solid:oklch(22% 0.03 220deg)}[data-theme="hack-the-box"]{--bg:oklch(16% 0.03 255deg);--bg-alt:oklch(13% 0.025 255deg);--current-line:oklch(20% 0.03 255deg);--selection:oklch(55% 0.08 255deg);--fg:oklch(82% 0.03 255deg);--fg-dim:oklch(62% 0.04 255deg);--comment:oklch(55% 0.03 255deg);--icon:var(--fg);--icon-dim:oklch(70% 0.04 255deg);--cyan:oklch(78% 0.12 175deg);--green:oklch(88% 0.22 130deg);--orange:oklch(78% 0.14 75deg);--pink:oklch(65% 0.18 340deg);--purple:oklch(65% 0.22 300deg);--red:oklch(65% 0.22 25deg);--yellow:oklch(82% 0.16 95deg);--background:var(--bg);--background-alt:oklch(14% 0.028 255deg);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(20% 0.03 255deg);--accent:var(--green);--accent-hover:oklch(85% 0.2 125deg);--accent-text:oklch(12% 0.02 255deg);--accent-text-on-hover:oklch(22% 0.03 130deg);--success:var(--green);--success-hover:oklch(90% 0.18 130deg);--success-text:oklch(98% 0 0deg);--success-text-on-solid:oklch(22% 0.03 130deg);--warning:var(--yellow);--warning-hover:oklch(92% 0.14 95deg);--warning-text:oklch(98% 0 0deg);--warning-text-on-solid:oklch(22% 0.02 95deg);--error:var(--red);--error-hover:oklch(72% 0.18 25deg);--error-text:oklch(100% 0 0deg);--error-text-on-solid:oklch(22% 0.03 25deg);--info:oklch(68% 0.14 240deg);--info-hover:oklch(75% 0.12 240deg);--info-text:oklch(100% 0 0deg);--info-text-on-solid:oklch(22% 0.03 240deg)}[data-theme="pink-cat-boo"]{--bg:oklch(18% 0.03 280deg);--bg-alt:oklch(22% 0.04 280deg);--current-line:oklch(28% 0.06 320deg);--selection:oklch(28% 0.06 320deg);--fg:oklch(98% 0.01 350deg);--fg-dim:oklch(65% 0.04 280deg);--comment:oklch(55% 0.03 160deg);--cyan:oklch(72% 0.1 220deg);--green:oklch(72% 0.14 165deg);--orange:oklch(72% 0.14 75deg);--pink:oklch(78% 0.12 350deg);--purple:oklch(72% 0.14 300deg);--red:oklch(72% 0.18 350deg);--yellow:oklch(78% 0.14 85deg);--background:var(--bg);--background-alt:oklch(20% 0.035 280deg);--text:var(--fg);--text-dim:var(--fg-dim);--icon:var(--fg);--icon-dim:oklch(75% 0.04 280deg);--border:oklch(35% 0.04 280deg);--accent:var(--pink);--accent-hover:oklch(82% 0.1 350deg);--accent-text:oklch(18% 0.02 280deg);--accent-text-on-hover:oklch(22% 0.03 350deg);--success:var(--green);--success-hover:oklch(78% 0.12 165deg);--success-text:oklch(98% 0 0deg);--success-text-on-solid:oklch(22% 0.03 165deg);--warning:var(--yellow);--warning-hover:oklch(85% 0.12 85deg);--warning-text:oklch(98% 0 0deg);--warning-text-on-solid:oklch(22% 0.02 85deg);--error:var(--red);--error-hover:oklch(78% 0.14 350deg);--error-text:oklch(100% 0 0deg);--error-text-on-solid:oklch(22% 0.03 15deg);--info:var(--cyan);--info-hover:oklch(78% 0.1 220deg);--info-text:oklch(98% 0 0deg);--info-text-on-solid:oklch(22% 0.03 220deg)}[data-theme="github-light"]{--bg:oklch(100% 0 0deg);--bg-alt:oklch(97% 0.005 264deg);--current-line:oklch(95% 0.008 264deg);--selection:oklch(88% 0.06 255deg);--fg:oklch(18% 0.02 264deg);--fg-dim:oklch(52% 0.02 264deg);--comment:oklch(58% 0.02 264deg);--cyan:oklch(55% 0.18 255deg);--green:oklch(48% 0.16 145deg);--orange:oklch(65% 0.14 75deg);--pink:oklch(55% 0.18 340deg);--purple:oklch(50% 0.18 290deg);--red:oklch(50% 0.2 25deg);--yellow:oklch(75% 0.14 90deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(86% 0.01 264deg);--accent:var(--cyan);--accent-hover:oklch(38% 0.18 255deg);--accent-text:oklch(100% 0 0deg);--success:var(--green);--success-hover:oklch(55% 0.14 145deg);--success-text:oklch(20% 0 0deg);--warning:var(--yellow);--warning-hover:oklch(82% 0.12 90deg);--warning-text:oklch(20% 0 0deg);--error:var(--red);--error-hover:oklch(62% 0.18 25deg);--error-text:oklch(100% 0 0deg);--info:var(--cyan);--info-hover:oklch(65% 0.1 210deg);--info-text:oklch(20% 0 0deg)}[data-theme="red-velvet-cupcake"]{--bg:oklch(99% 0.005 25deg);--bg-alt:oklch(96% 0.01 25deg);--current-line:oklch(94% 0.015 25deg);--selection:oklch(92% 0.04 25deg);--fg:oklch(28% 0.02 250deg);--fg-dim:oklch(48% 0.02 250deg);--comment:oklch(55% 0.02 250deg);--cyan:oklch(55% 0.12 220deg);--green:oklch(50% 0.16 145deg);--orange:oklch(62% 0.14 55deg);--pink:oklch(58% 0.16 350deg);--purple:oklch(52% 0.16 290deg);--red:oklch(55% 0.17 25deg);--yellow:oklch(75% 0.12 95deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(88% 0.015 25deg);--accent:var(--red);--accent-hover:oklch(48% 0.18 25deg);--accent-text:oklch(100% 0 0deg);--success:var(--green);--success-hover:oklch(54% 0.14 145deg);--success-text:oklch(20% 0 0deg);--warning:var(--orange);--warning-hover:oklch(70% 0.12 55deg);--warning-text:oklch(20% 0 0deg);--error:var(--red);--error-hover:oklch(60% 0.16 25deg);--error-text:oklch(100% 0 0deg);--info:var(--cyan);--info-hover:oklch(58% 0.1 220deg);--info-text:oklch(20% 0 0deg)}[data-theme="orangy-one-light"]{--bg:oklch(99% 0.008 70deg);--bg-alt:oklch(96% 0.012 70deg);--current-line:oklch(94% 0.015 70deg);--selection:oklch(92% 0.05 70deg);--fg:oklch(22% 0.02 70deg);--fg-dim:oklch(48% 0.02 70deg);--comment:oklch(55% 0.02 70deg);--cyan:oklch(55% 0.12 220deg);--green:oklch(50% 0.16 145deg);--orange:oklch(58% 0.16 55deg);--pink:oklch(58% 0.16 350deg);--purple:oklch(52% 0.16 290deg);--red:oklch(52% 0.18 25deg);--yellow:oklch(75% 0.14 90deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(88% 0.02 70deg);--accent:var(--orange);--accent-hover:oklch(50% 0.18 55deg);--accent-text:oklch(100% 0 0deg);--success:var(--green);--success-hover:oklch(55% 0.14 145deg);--success-text:oklch(20% 0 0deg);--warning:var(--orange);--warning-hover:oklch(72% 0.12 55deg);--warning-text:oklch(20% 0 0deg);--error:var(--red);--error-hover:oklch(58% 0.16 25deg);--error-text:oklch(100% 0 0deg);--info:var(--cyan);--info-hover:oklch(62% 0.1 220deg);--info-text:oklch(20% 0 0deg)}[data-theme="sunflower"]{--bg:oklch(98% 0.03 95deg);--bg-alt:oklch(95% 0.04 95deg);--current-line:oklch(92% 0.05 95deg);--selection:oklch(88% 0.08 95deg);--fg:oklch(22% 0.03 95deg);--fg-dim:oklch(45% 0.03 95deg);--comment:oklch(52% 0.03 95deg);--cyan:oklch(55% 0.12 220deg);--green:oklch(50% 0.16 145deg);--orange:oklch(62% 0.14 55deg);--pink:oklch(58% 0.16 350deg);--purple:oklch(52% 0.16 290deg);--red:oklch(52% 0.18 25deg);--yellow:oklch(75% 0.16 95deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(85% 0.04 95deg);--accent:var(--yellow);--accent-hover:oklch(65% 0.18 95deg);--accent-text:oklch(15% 0.02 95deg);--accent-text-on-hover:oklch(22% 0.02 95deg);--success:var(--green);--success-hover:oklch(55% 0.14 145deg);--success-text:oklch(20% 0 0deg);--warning:var(--orange);--warning-hover:oklch(70% 0.12 55deg);--warning-text:oklch(20% 0 0deg);--error:var(--red);--error-hover:oklch(60% 0.16 25deg);--error-text:oklch(100% 0 0deg);--info:var(--cyan);--info-hover:oklch(62% 0.1 220deg);--info-text:oklch(20% 0 0deg)}[data-theme="green-breeze-light"]{--bg:oklch(98% 0.008 140deg);--bg-alt:oklch(96% 0.01 140deg);--current-line:oklch(94% 0.012 140deg);--selection:oklch(88% 0.06 200deg);--fg:oklch(20% 0.02 80deg);--fg-dim:oklch(45% 0.02 80deg);--comment:oklch(55% 0.02 80deg);--cyan:oklch(58% 0.14 205deg);--green:oklch(42% 0.14 145deg);--orange:oklch(62% 0.12 65deg);--pink:oklch(55% 0.12 340deg);--purple:oklch(55% 0.12 290deg);--red:oklch(45% 0.18 25deg);--yellow:oklch(75% 0.14 90deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(88% 0.02 140deg);--accent:oklch(48% 0.16 155deg);--accent-hover:oklch(38% 0.16 155deg);--accent-text:oklch(100% 0 0deg);--success:var(--green);--success-hover:oklch(55% 0.14 145deg);--success-text:oklch(20% 0 0deg);--warning:var(--yellow);--warning-hover:oklch(82% 0.12 95deg);--warning-text:oklch(20% 0 0deg);--error:var(--red);--error-hover:oklch(58% 0.16 25deg);--error-text:oklch(100% 0 0deg);--info:var(--cyan);--info-hover:oklch(65% 0.1 210deg);--info-text:oklch(20% 0 0deg)}[data-theme="cute-pink"]{--bg:oklch(100% 0 0deg);--bg-alt:oklch(98% 0.02 350deg);--current-line:oklch(96% 0.03 350deg);--selection:oklch(78% 0.12 350deg);--fg:oklch(25% 0.01 0deg);--fg-dim:oklch(50% 0.02 0deg);--comment:oklch(55% 0.02 0deg);--cyan:oklch(55% 0.1 220deg);--green:oklch(48% 0.12 145deg);--orange:oklch(65% 0.12 65deg);--pink:oklch(62% 0.2 350deg);--purple:oklch(42% 0.18 300deg);--red:oklch(55% 0.2 25deg);--yellow:oklch(75% 0.14 90deg);--background:var(--bg);--background-alt:oklch(98% 0.025 350deg);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(88% 0.06 350deg);--accent:oklch(62% 0.22 350deg);--accent-hover:oklch(55% 0.22 350deg);--accent-text:oklch(100% 0 0deg);--success:var(--green);--success-hover:oklch(58% 0.14 145deg);--success-text:oklch(20% 0 0deg);--warning:var(--yellow);--warning-hover:oklch(80% 0.14 90deg);--warning-text:oklch(20% 0 0deg);--error:var(--red);--error-hover:oklch(60% 0.18 25deg);--error-text:oklch(100% 0 0deg);--info:var(--cyan);--info-hover:oklch(65% 0.1 220deg);--info-text:oklch(20% 0 0deg)}[data-theme="semi-light-purple"]{--bg:oklch(96% 0.02 290deg);--bg-alt:oklch(94% 0.03 290deg);--current-line:oklch(91% 0.04 290deg);--selection:oklch(88% 0.06 290deg);--fg:oklch(25% 0.02 290deg);--fg-dim:oklch(48% 0.03 290deg);--comment:oklch(55% 0.04 280deg);--cyan:oklch(58% 0.12 220deg);--green:oklch(50% 0.14 150deg);--orange:oklch(65% 0.12 60deg);--pink:oklch(62% 0.16 340deg);--purple:oklch(52% 0.2 290deg);--red:oklch(52% 0.18 25deg);--yellow:oklch(75% 0.14 90deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(86% 0.05 290deg);--accent:var(--purple);--accent-hover:oklch(45% 0.2 290deg);--accent-text:oklch(100% 0 0deg);--success:var(--green);--success-hover:oklch(55% 0.14 145deg);--success-text:oklch(20% 0 0deg);--warning:var(--yellow);--warning-hover:oklch(82% 0.12 90deg);--warning-text:oklch(20% 0 0deg);--error:var(--red);--error-hover:oklch(58% 0.16 25deg);--error-text:oklch(100% 0 0deg);--info:var(--cyan);--info-hover:oklch(62% 0.1 220deg);--info-text:oklch(20% 0 0deg)}
|
|
138
|
+
.accordion__panel-content :global(ul:last-child){margin-bottom:0}.accordion__slot-content{display:none}.tabs{width:100%}.tabs__list{border-bottom:var(--outline-width) solid var(--border);display:flex;gap:var(--spacing-1);margin-bottom:var(--spacing-6);overflow-x:auto;scrollbar-width:thin;-webkit-overflow-scrolling:touch}.tabs__list::-webkit-scrollbar{height:var(--spacing-0-125)}.tabs__list::-webkit-scrollbar-track{background:var(--background-alt)}.tabs__list::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--radius)}.tabs__tab{align-items:center;background:transparent;border:none;border-bottom:calc(var(--outline-width)*2) solid transparent;border-radius:var(--radius-md) var(--radius-md) 0 0;color:var(--text-dim);cursor:pointer;display:inline-flex;font-family:var(--font-family);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);justify-content:center;margin-bottom:calc(var(--outline-width)*-1*2);min-height:var(--touch-target-min);outline:none;padding:var(--spacing-3) var(--spacing-5);position:relative;transition:color var(--transition-base),border-color var(--transition-base),background-color var(--transition-base);white-space:nowrap}.tabs__tab:hover:not(.tabs__tab--active){background-color:var(--background-alt);color:var(--text)}.tabs__tab:focus-visible{border-radius:var(--radius-md) var(--radius-md) 0 0;outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.tabs__tab--active{border-bottom-color:var(--accent);border-bottom-width:calc(var(--outline-width)*3);font-weight:var(--font-weight-semibold)}.tabs__tab--active,.tabs__tab--active:hover{background-color:var(--background-alt);color:var(--accent)}.tabs__tab--active:hover{border-bottom-color:var(--accent)}.tabs__panels-wrapper{width:100%}.tabs__panel{display:none;min-height:var(--spacing-20);padding:var(--spacing-6) 0;width:100%}.tabs__panel--active{animation:fadeIn var(--transition-base);display:block}.tabs__panel-content{width:100%}@keyframes fade-in{from{opacity:0;transform:translateY(var(--spacing-1))}to{opacity:1;transform:translateY(0)}}.tabs__slot-content{display:none}.tabs--pills .tabs__list{border-bottom:none;gap:var(--spacing-2)}.tabs--pills .tabs__tab{border-bottom:none;border-radius:var(--radius-md);margin-bottom:0}.tabs--pills .tabs__tab--active{background-color:var(--accent);border-bottom-color:transparent;color:var(--accent-text)}.tabs--pills .tabs__tab--active:hover{background-color:var(--accent-hover);color:var(--accent-text)}.tabs--underline .tabs__list{border-bottom:var(--outline-width) solid var(--border)}.tabs--underline .tabs__tab{border-bottom:var(--outline-width) solid transparent;padding-bottom:var(--spacing-3)}.tabs--underline .tabs__tab--active{border-bottom-color:var(--accent);border-bottom-width:calc(var(--outline-width)*2)}@media (width <= 640px){.tabs__list{gap:var(--spacing-1)}.tabs__tab{font-size:var(--font-size-sm);padding:var(--spacing-2) var(--spacing-3)}.tabs__panel{padding:var(--spacing-3) 0}}@media (prefers-reduced-motion:reduce){.tabs__tab{transition:none}.tabs__panel--active{animation:none}}.progress{display:flex;flex-direction:column;gap:var(--spacing-2);width:100%}.progress__track{background-color:var(--background-alt);border:var(--border-width) solid var(--border);overflow:hidden;width:100%}.progress__bar,.progress__track{border-radius:var(--radius-full)}.progress__bar{flex-shrink:0;height:100%;min-height:var(--spacing-2);transition:width var(--transition-slow) var(--ease-in-out-cubic)}.progress--sm .progress__track{height:var(--spacing-1)}.progress--sm .progress__bar{min-height:var(--spacing-1)}.progress--md .progress__track{height:var(--spacing-2)}.progress--md .progress__bar{min-height:var(--spacing-2)}.progress--lg .progress__track{height:var(--spacing-3)}.progress--lg .progress__bar{min-height:var(--spacing-3)}.progress--primary .progress__bar{background-color:var(--accent)}.progress--success .progress__bar{background-color:var(--success)}.progress--warning .progress__bar{background-color:var(--warning)}.progress--error .progress__bar{background-color:var(--error)}.progress--info .progress__bar{background-color:var(--info)}.progress__label{color:var(--text-dim);font-size:var(--font-size-sm);text-align:right}.progress--indeterminate .progress__bar{animation:progress-indeterminate 1.5s ease-in-out infinite;min-width:30%;width:30%!important}@keyframes progress-indeterminate{0%{transform:translateX(-100%)}100%{transform:translateX(233.333%)}}@media (prefers-reduced-motion:reduce){.progress__bar{transition:none}.progress--indeterminate .progress__bar{animation:none;opacity:.7;width:50%!important}}.spinner{align-items:center;display:inline-flex;justify-content:center;vertical-align:middle}.spinner__ring{animation:spinner-rotate .8s linear infinite;border-color:var(--border);border-radius:var(--radius-full);border-style:solid;border-top-color:currentcolor;display:block}.spinner--sm .spinner__ring{border-width:var(--border-width-2);height:var(--spacing-4);width:var(--spacing-4)}.spinner--md .spinner__ring{border-width:var(--border-width-3);height:var(--spacing-6);width:var(--spacing-6)}.spinner--lg .spinner__ring{border-width:var(--border-width-4);height:var(--spacing-8);width:var(--spacing-8)}.spinner--primary{color:var(--accent)}.spinner--success{color:var(--success)}.spinner--warning{color:var(--warning)}.spinner--error{color:var(--error)}.spinner--info{color:var(--info)}@keyframes spinner-rotate{to{transform:rotate(1turn)}}@media (prefers-reduced-motion:reduce){.spinner__ring{animation:none;border-bottom-color:transparent;border-left-color:transparent;border-right-color:transparent}}.avatar{align-items:center;background-color:var(--background-alt);border:var(--border-width) solid var(--border);color:var(--text-dim);display:inline-flex;flex-shrink:0;font-size:inherit;font-weight:var(--font-weight-semibold);justify-content:center;line-height:1;overflow:hidden}.avatar__img{display:block;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.avatar__initials{align-items:center;display:flex;height:100%;justify-content:center;width:100%}.avatar--sm{font-size:var(--font-size-xs);height:var(--spacing-8);width:var(--spacing-8)}.avatar--md{font-size:var(--font-size-sm);height:var(--spacing-10);width:var(--spacing-10)}.avatar--lg{font-size:var(--font-size-base);height:var(--spacing-12);width:var(--spacing-12)}.avatar--circle{border-radius:var(--radius-full)}.avatar--square{border-radius:var(--radius-md)}.divider{align-items:center;color:var(--text-dim);display:flex;font-size:var(--font-size-sm);gap:var(--spacing-3)}.divider__line{border:none;border-left:none;border-top:var(--border-width) solid var(--border);flex:1;min-height:0;min-width:0}.divider__label{flex-shrink:0;padding:0 var(--spacing-2);white-space:nowrap}.divider--horizontal{width:100%}.divider--horizontal .divider__line{border-left:none;border-top:var(--border-width) solid var(--border)}.divider--vertical{flex-direction:column;height:100%;min-height:var(--spacing-8);width:auto}.divider--vertical .divider__line{border-left:var(--border-width) solid var(--border);border-top:none;flex:1;min-height:var(--spacing-4);width:0}.table{display:flex;flex-direction:column;gap:var(--spacing-3);width:100%}.table__filter-wrap{align-items:center;display:flex;flex-shrink:0;position:relative}.table__filter-icon{align-items:center;color:var(--icon-dim);display:flex;justify-content:center;left:var(--spacing-3);pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.table__filter-icon-svg{color:currentcolor;height:var(--table-filter-icon-size,1.25rem);width:var(--table-filter-icon-size,1.25rem)}.table__filter-wrap:focus-within .table__filter-icon{color:var(--accent)}.table__filter-wrap .table__filter{background-color:var(--background);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);font-family:var(--font-family);font-size:var(--font-size-base);max-width:var(--spacing-80);padding-bottom:var(--spacing-2);padding-left:3.5rem;padding-right:var(--spacing-3);padding-top:var(--spacing-2);width:100%}.table__filter-wrap .table__filter::-moz-placeholder{color:var(--text-dim)}.table__filter-wrap .table__filter::placeholder{color:var(--text-dim)}.table__filter-wrap .table__filter:focus{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.table__wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch}.table__table{border-collapse:collapse;border-spacing:0;font-size:var(--font-size-sm);width:100%}.table__caption{color:var(--text);font-weight:var(--font-weight-semibold);padding:var(--spacing-2) 0;text-align:left}.table__head .table__row{border-bottom:var(--border-width-2) solid var(--border)}.table__cell{border-bottom:var(--border-width) solid var(--border);color:var(--text);padding:var(--spacing-3) var(--spacing-4);text-align:left}.table__cell--head{color:var(--text);font-weight:var(--font-weight-semibold);white-space:nowrap}.table__sort-trigger{align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;border-radius:var(--radius-md);color:var(--text);cursor:pointer;display:inline-flex;font:inherit;font-weight:var(--font-weight-semibold);padding:0;text-align:left;transition:background-color var(--transition-fast),color var(--transition-fast);width:100%}.table__sort-trigger:hover{background-color:var(--background-alt);color:var(--text)}.table__sort-trigger:hover .table__sort-icon-svg{color:var(--accent)}.table__sort-trigger:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.table--sortable .table__cell--head{padding:0}.table--sortable .table__cell--head .table__sort-trigger{padding:var(--spacing-3) var(--spacing-4)}.table__cell-content{display:inline-block}.table__sort-icon{align-items:center;display:inline-flex;flex-shrink:0;justify-content:center;margin-left:var(--spacing-2)}.table__sort-icon-svg{color:var(--icon-dim);height:var(--table-sort-icon-size,1.25rem);transition:color var(--transition-fast);width:var(--table-sort-icon-size,1.25rem)}.table__body .table__row:hover{background-color:var(--background-alt)}.table__body .table__row:hover .table__cell{color:var(--text)}.table--striped .table__body .table__row:nth-child(even){background-color:var(--background-alt)}.table--striped .table__body .table__row:nth-child(even):hover{background-color:var(--background)}.table--striped .table__body .table__row:nth-child(even):hover .table__cell{color:var(--text)}.table__body .table__row[hidden]{display:none}@media (prefers-reduced-motion:reduce){.table__sort-icon-svg,.table__sort-trigger{transition:none}}.home{padding:var(--spacing-8) 0}.home__container{width:100%}.home__hero{margin-bottom:var(--spacing-16);padding:var(--spacing-16) 0;text-align:center}.home__title{color:var(--text);font-size:var(--font-size-5xl);font-weight:var(--font-weight-extrabold);line-height:var(--line-height-tight);margin:0 0 var(--spacing-6) 0}.home__subtitle{color:var(--text-dim);font-size:var(--font-size-xl);line-height:var(--line-height-relaxed);margin:0 auto;max-width:var(--spacing-175)}.home__section-title{color:var(--text);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-8);text-align:center}.home__install{align-items:center;display:flex;flex-direction:column;justify-content:center;margin-bottom:var(--spacing-16)}.home__install-grid{display:grid;gap:var(--spacing-6);grid-template-columns:1fr 1fr;margin:0 auto;max-width:var(--spacing-150);width:100%}.home__install-block{align-items:stretch;background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);display:flex;flex-direction:column;justify-content:center;min-height:var(--spacing-24);padding:var(--spacing-6)}.home__install-title{color:var(--text);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-2) 0;text-align:center}.home__install-label{color:var(--text-dim);font-size:var(--font-size-sm);margin:0 0 var(--spacing-4) 0;text-align:center}.home__install-copy{align-items:center;display:flex;justify-content:center;width:100%}.home__install-copy .copy-to-clipboard{justify-content:space-between;width:100%}.home__install-copy .copy-to-clipboard__text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.home__grid{display:grid;gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(var(--spacing-75),1fr));margin-bottom:var(--spacing-16)}.home__card{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);color:var(--text);padding:var(--spacing-6)}.home__card h3{color:var(--text);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-3) 0}.home__card p{color:var(--text-dim);line-height:var(--line-height-relaxed);margin:0}.home__examples{margin-bottom:var(--spacing-16)}.home__example{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);margin-bottom:var(--spacing-8);padding:var(--spacing-8)}.home__example h3{color:var(--text);font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-4) 0}.home__example p{color:var(--text-dim);margin-bottom:var(--spacing-4)}.home__button-group{display:flex;flex-wrap:wrap;gap:var(--spacing-3)}.home__theme-demo{max-width:var(--spacing-75)}.home__theme-demo .theme-switcher{position:relative;width:100%;z-index:var(--z-dropdown)}.home__theme-demo .theme-switcher__menu{z-index:var(--z-dropdown)}.home__docs{margin-bottom:var(--spacing-8)}.home__docs-grid{display:grid;gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(var(--spacing-70),1fr))}.home__doc-card{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);color:var(--text);display:block;padding:var(--spacing-6);text-decoration:none;transition:border-color var(--transition-base),transform var(--transition-base),box-shadow var(--transition-base)}.home__doc-card:hover{border-color:var(--accent);box-shadow:var(--shadow-md);transform:translateY(calc(var(--spacing-0-125)*-1))}.home__doc-card:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.home__doc-card h3{color:var(--accent);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-2) 0}.home__doc-card p{color:var(--text-dim);line-height:var(--line-height-relaxed);margin:0}@media (width <= 640px){.home__title{font-size:var(--font-size-4xl)}.home__subtitle{font-size:var(--font-size-lg)}
|
|
139
|
+
.home__docs-grid,.home__grid,.home__install-grid{grid-template-columns:1fr}}.theming-page .card a{color:var(--text);text-decoration:none;transition:color var(--transition-base)}.theming-page .card a:hover{color:var(--accent)}.theming-page .card:hover{transform:translateY(calc(var(--spacing-0-125)*-1));transition:transform var(--transition-base)}.reduced-motion .theming-page .card:hover{transform:none}.theme-by{color:var(--text-dim);font-size:var(--font-size-sm);margin:0 0 var(--spacing-4) 0}.theme-by a{color:var(--accent);text-decoration:none;transition:color var(--transition-base)}.theme-by a:hover{color:var(--accent-hover);text-decoration:underline}[data-theme="github-dark-classic"]{--bg:oklch(18% 0.012 264deg);--bg-alt:oklch(15% 0.01 264deg);--current-line:oklch(20% 0.012 264deg);--selection:oklch(28% 0.08 255deg);--fg:oklch(91% 0.004 264deg);--fg-dim:oklch(66% 0.01 264deg);--comment:oklch(52% 0.015 264deg);--cyan:oklch(72% 0.12 250deg);--green:oklch(72% 0.19 145deg);--orange:oklch(78% 0.12 55deg);--pink:oklch(68% 0.14 15deg);--purple:oklch(68% 0.14 300deg);--red:oklch(68% 0.16 15deg);--yellow:oklch(88% 0.12 95deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--icon:var(--fg);--icon-dim:oklch(75% 0.01 264deg);--border:oklch(13% 0.01 264deg);--accent:var(--cyan);--accent-hover:oklch(78% 0.12 250deg);--accent-text:oklch(100% 0 0deg);--accent-text-on-hover:oklch(22% 0.03 250deg);--success:var(--green);--success-hover:oklch(78% 0.16 145deg);--success-text:oklch(100% 0 0deg);--success-text-on-solid:oklch(22% 0.03 145deg);--warning:var(--orange);--warning-hover:oklch(85% 0.1 55deg);--warning-text:oklch(100% 0 0deg);--warning-text-on-solid:oklch(22% 0.02 55deg);--error:var(--red);--error-hover:oklch(75% 0.14 15deg);--error-text:oklch(100% 0 0deg);--error-text-on-solid:oklch(22% 0.03 25deg);--info:var(--cyan);--info-hover:oklch(78% 0.1 250deg);--info-text:oklch(100% 0 0deg);--info-text-on-solid:oklch(22% 0.03 250deg)}[data-theme="shades-of-purple"]{--bg:oklch(18% 0.08 290deg);--bg-alt:oklch(15% 0.08 290deg);--current-line:oklch(25% 0.10 290deg);--selection:oklch(30% 0.12 290deg);--fg:oklch(95% 0.01 300deg);--fg-dim:oklch(75% 0.05 300deg);--comment:oklch(55.% 0.08 280deg);--cyan:oklch(75% 0.15 220deg);--green:oklch(70% 0.20 150deg);--orange:oklch(75% 0.18 60deg);--pink:oklch(75% 0.22 340deg);--purple:oklch(65% 0.25 290deg);--red:oklch(65% 0.22 25deg);--yellow:oklch(85% 0.18 100deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--icon:var(--fg);--icon-dim:oklch(80% 0.05 300deg);--border:var(--current-line);--accent:var(--purple);--accent-hover:var(--pink);--accent-text:oklch(100% 0 0deg);--accent-text-on-hover:oklch(22% 0.03 300deg);--success:var(--green);--success-hover:oklch(78% 0.16 145deg);--success-text:oklch(100% 0 0deg);--success-text-on-solid:oklch(22% 0.03 145deg);--warning:var(--yellow);--warning-hover:oklch(92% 0.1 95deg);--warning-text:oklch(100% 0 0deg);--warning-text-on-solid:oklch(22% 0.02 95deg);--error:var(--red);--error-hover:oklch(75% 0.14 15deg);--error-text:oklch(100% 0 0deg);--error-text-on-solid:oklch(22% 0.03 15deg);--info:var(--cyan);--info-hover:oklch(78% 0.1 250deg);--info-text:oklch(100% 0 0deg);--info-text-on-solid:oklch(22% 0.03 250deg)}[data-theme="sandstorm-classic"]{--bg:oklch(16% 0.025 25deg);--bg-alt:oklch(13% 0.02 25deg);--current-line:oklch(20% 0.025 25deg);--selection:oklch(28% 0.06 25deg);--fg:oklch(90% 0.01 25deg);--fg-dim:oklch(62% 0.02 25deg);--comment:oklch(52% 0.03 25deg);--cyan:oklch(68% 0.12 220deg);--green:oklch(68% 0.18 145deg);--orange:oklch(72% 0.14 55deg);--pink:oklch(65% 0.16 350deg);--purple:oklch(62% 0.14 300deg);--red:oklch(58% 0.18 25deg);--yellow:oklch(82% 0.12 95deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--icon:var(--fg);--icon-dim:oklch(72% 0.02 25deg);--border:oklch(22% 0.02 25deg);--accent:var(--red);--accent-hover:oklch(62% 0.16 25deg);--accent-text:oklch(100% 0 0deg);--accent-text-on-hover:oklch(22% 0.03 25deg);--success:var(--green);--success-hover:oklch(74% 0.16 145deg);--success-text:oklch(100% 0 0deg);--success-text-on-solid:oklch(22% 0.03 145deg);--warning:var(--orange);--warning-hover:oklch(78% 0.12 55deg);--warning-text:oklch(98% 0 0deg);--warning-text-on-solid:oklch(22% 0.02 55deg);--error:var(--red);--error-hover:oklch(65% 0.16 25deg);--error-text:oklch(100% 0 0deg);--error-text-on-solid:oklch(22% 0.03 25deg);--info:var(--cyan);--info-hover:oklch(74% 0.1 220deg);--info-text:oklch(100% 0 0deg);--info-text-on-solid:oklch(22% 0.03 220deg)}[data-theme="rocky-blood-orange"]{--bg:oklch(16% 0.03 45deg);--bg-alt:oklch(13% 0.025 45deg);--current-line:oklch(20% 0.03 45deg);--selection:oklch(28% 0.06 45deg);--fg:oklch(90% 0.01 45deg);--fg-dim:oklch(60% 0.02 45deg);--comment:oklch(52% 0.03 45deg);--cyan:oklch(68% 0.12 220deg);--green:oklch(68% 0.18 145deg);--orange:oklch(62% 0.16 55deg);--pink:oklch(65% 0.16 350deg);--purple:oklch(62% 0.14 300deg);--red:oklch(58% 0.18 25deg);--yellow:oklch(82% 0.12 95deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--icon:var(--fg);--icon-dim:oklch(72% 0.02 45deg);--border:oklch(22% 0.02 45deg);--accent:var(--orange);--accent-hover:oklch(68% 0.14 55deg);--accent-text:oklch(100% 0 0deg);--accent-text-on-hover:oklch(22% 0.03 55deg);--success:var(--green);--success-hover:oklch(74% 0.16 145deg);--success-text:oklch(100% 0 0deg);--success-text-on-solid:oklch(22% 0.03 145deg);--warning:var(--orange);--warning-hover:oklch(72% 0.14 55deg);--warning-text:oklch(98% 0 0deg);--warning-text-on-solid:oklch(22% 0.02 55deg);--error:var(--red);--error-hover:oklch(65% 0.16 25deg);--error-text:oklch(100% 0 0deg);--error-text-on-solid:oklch(22% 0.03 25deg);--info:var(--cyan);--info-hover:oklch(74% 0.1 220deg);--info-text:oklch(100% 0 0deg);--info-text-on-solid:oklch(22% 0.03 220deg)}[data-theme="minimal-dark-neon-yellow"]{--bg:oklch(14% 0.01 95deg);--bg-alt:oklch(11% 0.008 95deg);--current-line:oklch(18% 0.015 95deg);--selection:oklch(25% 0.08 95deg);--fg:oklch(92% 0.02 95deg);--fg-dim:oklch(65% 0.02 95deg);--comment:oklch(50% 0.02 95deg);--icon:var(--fg);--icon-dim:oklch(72% 0.02 95deg);--cyan:oklch(72% 0.12 220deg);--green:oklch(72% 0.18 145deg);--orange:oklch(78% 0.14 55deg);--pink:oklch(68% 0.16 350deg);--purple:oklch(65% 0.14 300deg);--red:oklch(62% 0.18 25deg);--yellow:oklch(88% 0.18 95deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(20% 0.02 95deg);--accent:var(--yellow);--accent-hover:oklch(90% 0.16 95deg);--accent-text:oklch(12% 0.02 95deg);--accent-text-on-hover:oklch(22% 0.03 95deg);--success:var(--green);--success-hover:oklch(78% 0.16 145deg);--success-text:oklch(100% 0 0deg);--success-text-on-solid:oklch(22% 0.03 145deg);--warning:var(--orange);--warning-hover:oklch(85% 0.12 55deg);--warning-text:oklch(98% 0 0deg);--warning-text-on-solid:oklch(22% 0.02 55deg);--error:var(--red);--error-hover:oklch(68% 0.16 25deg);--error-text:oklch(100% 0 0deg);--error-text-on-solid:oklch(22% 0.03 25deg);--info:var(--cyan);--info-hover:oklch(78% 0.1 220deg);--info-text:oklch(100% 0 0deg);--info-text-on-solid:oklch(22% 0.03 220deg)}[data-theme="hack-the-box"]{--bg:oklch(16% 0.03 255deg);--bg-alt:oklch(13% 0.025 255deg);--current-line:oklch(20% 0.03 255deg);--selection:oklch(55% 0.08 255deg);--fg:oklch(82% 0.03 255deg);--fg-dim:oklch(62% 0.04 255deg);--comment:oklch(55% 0.03 255deg);--icon:var(--fg);--icon-dim:oklch(70% 0.04 255deg);--cyan:oklch(78% 0.12 175deg);--green:oklch(88% 0.22 130deg);--orange:oklch(78% 0.14 75deg);--pink:oklch(65% 0.18 340deg);--purple:oklch(65% 0.22 300deg);--red:oklch(65% 0.22 25deg);--yellow:oklch(82% 0.16 95deg);--background:var(--bg);--background-alt:oklch(14% 0.028 255deg);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(20% 0.03 255deg);--accent:var(--green);--accent-hover:oklch(85% 0.2 125deg);--accent-text:oklch(12% 0.02 255deg);--accent-text-on-hover:oklch(22% 0.03 130deg);--success:var(--green);--success-hover:oklch(90% 0.18 130deg);--success-text:oklch(98% 0 0deg);--success-text-on-solid:oklch(22% 0.03 130deg);--warning:var(--yellow);--warning-hover:oklch(92% 0.14 95deg);--warning-text:oklch(98% 0 0deg);--warning-text-on-solid:oklch(22% 0.02 95deg);--error:var(--red);--error-hover:oklch(72% 0.18 25deg);--error-text:oklch(100% 0 0deg);--error-text-on-solid:oklch(22% 0.03 25deg);--info:oklch(68% 0.14 240deg);--info-hover:oklch(75% 0.12 240deg);--info-text:oklch(100% 0 0deg);--info-text-on-solid:oklch(22% 0.03 240deg)}[data-theme="pink-cat-boo"]{--bg:oklch(18% 0.03 280deg);--bg-alt:oklch(22% 0.04 280deg);--current-line:oklch(28% 0.06 320deg);--selection:oklch(28% 0.06 320deg);--fg:oklch(98% 0.01 350deg);--fg-dim:oklch(65% 0.04 280deg);--comment:oklch(55% 0.03 160deg);--cyan:oklch(72% 0.1 220deg);--green:oklch(72% 0.14 165deg);--orange:oklch(72% 0.14 75deg);--pink:oklch(78% 0.12 350deg);--purple:oklch(72% 0.14 300deg);--red:oklch(72% 0.18 350deg);--yellow:oklch(78% 0.14 85deg);--background:var(--bg);--background-alt:oklch(20% 0.035 280deg);--text:var(--fg);--text-dim:var(--fg-dim);--icon:var(--fg);--icon-dim:oklch(75% 0.04 280deg);--border:oklch(35% 0.04 280deg);--accent:var(--pink);--accent-hover:oklch(82% 0.1 350deg);--accent-text:oklch(18% 0.02 280deg);--accent-text-on-hover:oklch(22% 0.03 350deg);--success:var(--green);--success-hover:oklch(78% 0.12 165deg);--success-text:oklch(98% 0 0deg);--success-text-on-solid:oklch(22% 0.03 165deg);--warning:var(--yellow);--warning-hover:oklch(85% 0.12 85deg);--warning-text:oklch(98% 0 0deg);--warning-text-on-solid:oklch(22% 0.02 85deg);--error:var(--red);--error-hover:oklch(78% 0.14 350deg);--error-text:oklch(100% 0 0deg);--error-text-on-solid:oklch(22% 0.03 15deg);--info:var(--cyan);--info-hover:oklch(78% 0.1 220deg);--info-text:oklch(98% 0 0deg);--info-text-on-solid:oklch(22% 0.03 220deg)}[data-theme="github-light"]{--bg:oklch(100% 0 0deg);--bg-alt:oklch(97% 0.005 264deg);--current-line:oklch(95% 0.008 264deg);--selection:oklch(88% 0.06 255deg);--fg:oklch(18% 0.02 264deg);--fg-dim:oklch(52% 0.02 264deg);--comment:oklch(58% 0.02 264deg);--cyan:oklch(55% 0.18 255deg);--green:oklch(48% 0.16 145deg);--orange:oklch(65% 0.14 75deg);--pink:oklch(55% 0.18 340deg);--purple:oklch(50% 0.18 290deg);--red:oklch(50% 0.2 25deg);--yellow:oklch(75% 0.14 90deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(86% 0.01 264deg);--accent:var(--cyan);--accent-hover:oklch(38% 0.18 255deg);--accent-text:oklch(100% 0 0deg);--success:var(--green);--success-hover:oklch(55% 0.14 145deg);--success-text:oklch(20% 0 0deg);--warning:var(--yellow);--warning-hover:oklch(82% 0.12 90deg);--warning-text:oklch(20% 0 0deg);--error:var(--red);--error-hover:oklch(62% 0.18 25deg);--error-text:oklch(100% 0 0deg);--info:var(--cyan);--info-hover:oklch(65% 0.1 210deg);--info-text:oklch(20% 0 0deg)}[data-theme="red-velvet-cupcake"]{--bg:oklch(99% 0.005 25deg);--bg-alt:oklch(96% 0.01 25deg);--current-line:oklch(94% 0.015 25deg);--selection:oklch(92% 0.04 25deg);--fg:oklch(28% 0.02 250deg);--fg-dim:oklch(48% 0.02 250deg);--comment:oklch(55% 0.02 250deg);--cyan:oklch(55% 0.12 220deg);--green:oklch(50% 0.16 145deg);--orange:oklch(62% 0.14 55deg);--pink:oklch(58% 0.16 350deg);--purple:oklch(52% 0.16 290deg);--red:oklch(55% 0.17 25deg);--yellow:oklch(75% 0.12 95deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(88% 0.015 25deg);--accent:var(--red);--accent-hover:oklch(48% 0.18 25deg);--accent-text:oklch(100% 0 0deg);--success:var(--green);--success-hover:oklch(54% 0.14 145deg);--success-text:oklch(20% 0 0deg);--warning:var(--orange);--warning-hover:oklch(70% 0.12 55deg);--warning-text:oklch(20% 0 0deg);--error:var(--red);--error-hover:oklch(60% 0.16 25deg);--error-text:oklch(100% 0 0deg);--info:var(--cyan);--info-hover:oklch(58% 0.1 220deg);--info-text:oklch(20% 0 0deg)}[data-theme="orangy-one-light"]{--bg:oklch(99% 0.008 70deg);--bg-alt:oklch(96% 0.012 70deg);--current-line:oklch(94% 0.015 70deg);--selection:oklch(92% 0.05 70deg);--fg:oklch(22% 0.02 70deg);--fg-dim:oklch(48% 0.02 70deg);--comment:oklch(55% 0.02 70deg);--cyan:oklch(55% 0.12 220deg);--green:oklch(50% 0.16 145deg);--orange:oklch(58% 0.16 55deg);--pink:oklch(58% 0.16 350deg);--purple:oklch(52% 0.16 290deg);--red:oklch(52% 0.18 25deg);--yellow:oklch(75% 0.14 90deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(88% 0.02 70deg);--accent:var(--orange);--accent-hover:oklch(50% 0.18 55deg);--accent-text:oklch(100% 0 0deg);--success:var(--green);--success-hover:oklch(55% 0.14 145deg);--success-text:oklch(20% 0 0deg);--warning:var(--orange);--warning-hover:oklch(72% 0.12 55deg);--warning-text:oklch(20% 0 0deg);--error:var(--red);--error-hover:oklch(58% 0.16 25deg);--error-text:oklch(100% 0 0deg);--info:var(--cyan);--info-hover:oklch(62% 0.1 220deg);--info-text:oklch(20% 0 0deg)}[data-theme="sunflower"]{--bg:oklch(98% 0.03 95deg);--bg-alt:oklch(95% 0.04 95deg);--current-line:oklch(92% 0.05 95deg);--selection:oklch(88% 0.08 95deg);--fg:oklch(22% 0.03 95deg);--fg-dim:oklch(45% 0.03 95deg);--comment:oklch(52% 0.03 95deg);--cyan:oklch(55% 0.12 220deg);--green:oklch(50% 0.16 145deg);--orange:oklch(62% 0.14 55deg);--pink:oklch(58% 0.16 350deg);--purple:oklch(52% 0.16 290deg);--red:oklch(52% 0.18 25deg);--yellow:oklch(75% 0.16 95deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(85% 0.04 95deg);--accent:var(--yellow);--accent-hover:oklch(65% 0.18 95deg);--accent-text:oklch(15% 0.02 95deg);--accent-text-on-hover:oklch(22% 0.02 95deg);--success:var(--green);--success-hover:oklch(55% 0.14 145deg);--success-text:oklch(20% 0 0deg);--warning:var(--orange);--warning-hover:oklch(70% 0.12 55deg);--warning-text:oklch(20% 0 0deg);--error:var(--red);--error-hover:oklch(60% 0.16 25deg);--error-text:oklch(100% 0 0deg);--info:var(--cyan);--info-hover:oklch(62% 0.1 220deg);--info-text:oklch(20% 0 0deg)}[data-theme="green-breeze-light"]{--bg:oklch(98% 0.008 140deg);--bg-alt:oklch(96% 0.01 140deg);--current-line:oklch(94% 0.012 140deg);--selection:oklch(88% 0.06 200deg);--fg:oklch(20% 0.02 80deg);--fg-dim:oklch(45% 0.02 80deg);--comment:oklch(55% 0.02 80deg);--cyan:oklch(58% 0.14 205deg);--green:oklch(42% 0.14 145deg);--orange:oklch(62% 0.12 65deg);--pink:oklch(55% 0.12 340deg);--purple:oklch(55% 0.12 290deg);--red:oklch(45% 0.18 25deg);--yellow:oklch(75% 0.14 90deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(88% 0.02 140deg);--accent:oklch(48% 0.16 155deg);--accent-hover:oklch(38% 0.16 155deg);--accent-text:oklch(100% 0 0deg);--success:var(--green);--success-hover:oklch(55% 0.14 145deg);--success-text:oklch(20% 0 0deg);--warning:var(--yellow);--warning-hover:oklch(82% 0.12 95deg);--warning-text:oklch(20% 0 0deg);--error:var(--red);--error-hover:oklch(58% 0.16 25deg);--error-text:oklch(100% 0 0deg);--info:var(--cyan);--info-hover:oklch(65% 0.1 210deg);--info-text:oklch(20% 0 0deg)}[data-theme="cute-pink"]{--bg:oklch(100% 0 0deg);--bg-alt:oklch(98% 0.02 350deg);--current-line:oklch(96% 0.03 350deg);--selection:oklch(78% 0.12 350deg);--fg:oklch(25% 0.01 0deg);--fg-dim:oklch(50% 0.02 0deg);--comment:oklch(55% 0.02 0deg);--cyan:oklch(55% 0.1 220deg);--green:oklch(48% 0.12 145deg);--orange:oklch(65% 0.12 65deg);--pink:oklch(62% 0.2 350deg);--purple:oklch(42% 0.18 300deg);--red:oklch(55% 0.2 25deg);--yellow:oklch(75% 0.14 90deg);--background:var(--bg);--background-alt:oklch(98% 0.025 350deg);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(88% 0.06 350deg);--accent:oklch(62% 0.22 350deg);--accent-hover:oklch(55% 0.22 350deg);--accent-text:oklch(100% 0 0deg);--success:var(--green);--success-hover:oklch(58% 0.14 145deg);--success-text:oklch(20% 0 0deg);--warning:var(--yellow);--warning-hover:oklch(80% 0.14 90deg);--warning-text:oklch(20% 0 0deg);--error:var(--red);--error-hover:oklch(60% 0.18 25deg);--error-text:oklch(100% 0 0deg);--info:var(--cyan);--info-hover:oklch(65% 0.1 220deg);--info-text:oklch(20% 0 0deg)}[data-theme="semi-light-purple"]{--bg:oklch(96% 0.02 290deg);--bg-alt:oklch(94% 0.03 290deg);--current-line:oklch(91% 0.04 290deg);--selection:oklch(88% 0.06 290deg);--fg:oklch(25% 0.02 290deg);--fg-dim:oklch(48% 0.03 290deg);--comment:oklch(55% 0.04 280deg);--cyan:oklch(58% 0.12 220deg);--green:oklch(50% 0.14 150deg);--orange:oklch(65% 0.12 60deg);--pink:oklch(62% 0.16 340deg);--purple:oklch(52% 0.2 290deg);--red:oklch(52% 0.18 25deg);--yellow:oklch(75% 0.14 90deg);--background:var(--bg);--background-alt:var(--bg-alt);--text:var(--fg);--text-dim:var(--fg-dim);--border:oklch(86% 0.05 290deg);--accent:var(--purple);--accent-hover:oklch(45% 0.2 290deg);--accent-text:oklch(100% 0 0deg);--success:var(--green);--success-hover:oklch(55% 0.14 145deg);--success-text:oklch(20% 0 0deg);--warning:var(--yellow);--warning-hover:oklch(82% 0.12 90deg);--warning-text:oklch(20% 0 0deg);--error:var(--red);--error-hover:oklch(58% 0.16 25deg);--error-text:oklch(100% 0 0deg);--info:var(--cyan);--info-hover:oklch(62% 0.1 220deg);--info-text:oklch(20% 0 0deg)}
|
package/package.json
CHANGED
|
@@ -13,7 +13,7 @@ const { title = '{{TITLE}}' } = Astro.props;
|
|
|
13
13
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
|
14
14
|
<!-- Theme flash prevention + accessibility (same as main site) -->
|
|
15
15
|
<script is:inline>
|
|
16
|
-
(function(){try{var s=localStorage.getItem('theme');var d='github-dark-classic';var l='github-light';var r=!s?(matchMedia('(prefers-color-scheme: dark)').matches?d:l):s==='system'?(matchMedia('(prefers-color-scheme: dark)').matches?d:l):s;document.documentElement.setAttribute('data-theme',r);var f=localStorage.getItem('fontSizeScale');if(f)document.documentElement.style.setProperty('--font-size-scale',f);if(localStorage.getItem('reducedMotion')==='true')document.documentElement.classList.add('reduced-motion');if(localStorage.getItem('highContrast')==='true')document.documentElement.classList.add('high-contrast');var b=localStorage.getItem('scrollbarStyle')||'thin';if(b==='thick')document.documentElement.classList.add('scrollbar-thick');else if(b==='hidden')document.documentElement.classList.add('scrollbar-hidden','hide-scrollbars');}catch(e){}})();
|
|
16
|
+
(function(){try{var s=localStorage.getItem('theme');var d='github-dark-classic';var l='github-light';var initial=document.documentElement.getAttribute('data-theme');var r=!s?(initial||(matchMedia('(prefers-color-scheme: dark)').matches?d:l)):s==='system'?(matchMedia('(prefers-color-scheme: dark)').matches?d:l):s;document.documentElement.setAttribute('data-theme',r);var f=localStorage.getItem('fontSizeScale');if(f)document.documentElement.style.setProperty('--font-size-scale',f);if(localStorage.getItem('reducedMotion')==='true')document.documentElement.classList.add('reduced-motion');if(localStorage.getItem('highContrast')==='true')document.documentElement.classList.add('high-contrast');var b=localStorage.getItem('scrollbarStyle')||'thin';if(b==='thick')document.documentElement.classList.add('scrollbar-thick');else if(b==='hidden')document.documentElement.classList.add('scrollbar-hidden','hide-scrollbars');}catch(e){}})();
|
|
17
17
|
</script>
|
|
18
18
|
<!-- Toast: showToast, removeToast, removeAllToasts -->
|
|
19
19
|
<script is:inline>
|
|
@@ -100,7 +100,8 @@
|
|
|
100
100
|
>
|
|
101
101
|
<span class="accordion__title">{item.title}</span>
|
|
102
102
|
<span class="accordion__icon" aria-hidden="true">
|
|
103
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
103
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
|
|
104
|
+
<title>Expand or collapse section</title>
|
|
104
105
|
<path d="m6 9 6 6 6-6" />
|
|
105
106
|
</svg>
|
|
106
107
|
</span>
|
|
@@ -33,6 +33,7 @@
|
|
|
33
33
|
<span class="breadcrumb__separator" aria-hidden="true">
|
|
34
34
|
{#if useIcon}
|
|
35
35
|
<svg class="breadcrumb__separator-icon" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
|
|
36
|
+
<title>Separator</title>
|
|
36
37
|
<path d="M6 9l6 6 6-6" />
|
|
37
38
|
</svg>
|
|
38
39
|
{:else}
|
|
@@ -10,8 +10,9 @@
|
|
|
10
10
|
|
|
11
11
|
let copied = $state(false);
|
|
12
12
|
let feedbackText = $state('');
|
|
13
|
-
const
|
|
14
|
-
const
|
|
13
|
+
const fallbackId = `copy-btn-${Math.random().toString(36).slice(2, 11)}`;
|
|
14
|
+
const buttonId = $derived(id ?? fallbackId);
|
|
15
|
+
const classes = $derived(['copy-to-clipboard', className].filter(Boolean).join(' ').trim());
|
|
15
16
|
|
|
16
17
|
async function copy() {
|
|
17
18
|
if (!value) return;
|
|
@@ -63,12 +64,14 @@
|
|
|
63
64
|
<span class="copy-to-clipboard__text">{value}</span>
|
|
64
65
|
<span class="copy-to-clipboard__icon copy-to-clipboard__icon--copy" class:copy-to-clipboard__icon--hidden={copied} aria-hidden="true">
|
|
65
66
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
|
|
67
|
+
<title>Copy</title>
|
|
66
68
|
<rect x="9" y="9" width="13" height="13" rx="2" ry="2" />
|
|
67
69
|
<path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" />
|
|
68
70
|
</svg>
|
|
69
71
|
</span>
|
|
70
72
|
<span class="copy-to-clipboard__icon copy-to-clipboard__icon--check" class:copy-to-clipboard__icon--hidden={!copied} aria-hidden="true">
|
|
71
73
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
|
|
74
|
+
<title>Copied</title>
|
|
72
75
|
<polyline points="20 6 9 17 4 12" />
|
|
73
76
|
</svg>
|
|
74
77
|
</span>
|
|
@@ -29,17 +29,18 @@
|
|
|
29
29
|
align = 'start',
|
|
30
30
|
}: Props = $props();
|
|
31
31
|
|
|
32
|
-
const
|
|
33
|
-
const
|
|
34
|
-
const
|
|
32
|
+
const fallbackId = `dropdown-${Math.random().toString(36).slice(2, 11)}`;
|
|
33
|
+
const dropdownId = $derived(id ?? fallbackId);
|
|
34
|
+
const menuId = $derived(`${dropdownId}-menu`);
|
|
35
|
+
const triggerId = $derived(`${dropdownId}-trigger`);
|
|
35
36
|
|
|
36
37
|
let open = $state(false);
|
|
37
38
|
let openSubmenuIndex = $state<number | null>(null);
|
|
38
39
|
let menuEl: HTMLDivElement;
|
|
39
40
|
let triggerEl: HTMLButtonElement;
|
|
40
41
|
|
|
41
|
-
const classes = ['dropdown', className].filter(Boolean).join(' ').trim();
|
|
42
|
-
const menuClasses = `dropdown__menu dropdown__menu--${position} dropdown__menu--${align}
|
|
42
|
+
const classes = $derived(['dropdown', className].filter(Boolean).join(' ').trim());
|
|
43
|
+
const menuClasses = $derived(`dropdown__menu dropdown__menu--${position} dropdown__menu--${align}`);
|
|
43
44
|
|
|
44
45
|
function closeMenu() {
|
|
45
46
|
open = false;
|
|
@@ -119,7 +120,8 @@
|
|
|
119
120
|
>
|
|
120
121
|
<span class="dropdown__trigger-text">{trigger}</span>
|
|
121
122
|
<span class="dropdown__icon" aria-hidden="true">
|
|
122
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
123
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" role="img" aria-labelledby="{dropdownId}-trigger-icon-title">
|
|
124
|
+
<title id="{dropdownId}-trigger-icon-title">Expand menu</title>
|
|
123
125
|
<path d="m6 9 6 6 6-6" />
|
|
124
126
|
</svg>
|
|
125
127
|
</span>
|
|
@@ -147,7 +149,8 @@
|
|
|
147
149
|
<a
|
|
148
150
|
class="dropdown__item dropdown__item--disabled={item.disabled}"
|
|
149
151
|
role="menuitem"
|
|
150
|
-
href={item.
|
|
152
|
+
href={item.href}
|
|
153
|
+
aria-label={item.label}
|
|
151
154
|
aria-disabled={item.disabled ? 'true' : undefined}
|
|
152
155
|
tabindex={open ? 0 : -1}
|
|
153
156
|
onclick={(e) => {
|
|
@@ -175,16 +178,21 @@
|
|
|
175
178
|
}
|
|
176
179
|
}}
|
|
177
180
|
onkeydown={(e) => {
|
|
181
|
+
if (item.disabled) return;
|
|
178
182
|
if (hasSubmenu && (e.key === 'Enter' || e.key === ' ' || e.key === 'ArrowRight')) {
|
|
179
183
|
e.preventDefault();
|
|
180
184
|
toggleSubmenu(index);
|
|
185
|
+
} else if (!hasSubmenu && (e.key === 'Enter' || e.key === ' ')) {
|
|
186
|
+
e.preventDefault();
|
|
187
|
+
handleItemClick(item, e as unknown as MouseEvent);
|
|
181
188
|
}
|
|
182
189
|
}}
|
|
183
190
|
>
|
|
184
191
|
<span>{item.label}</span>
|
|
185
192
|
{#if hasSubmenu}
|
|
186
193
|
<span class="dropdown__item-arrow" aria-hidden="true">
|
|
187
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
194
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" role="img" aria-labelledby="{dropdownId}-submenu-arrow-{index}-title">
|
|
195
|
+
<title id="{dropdownId}-submenu-arrow-{index}-title">Expand submenu</title>
|
|
188
196
|
<path d="m6 9 6 6 6-6" />
|
|
189
197
|
</svg>
|
|
190
198
|
</span>
|
|
@@ -205,9 +213,13 @@
|
|
|
205
213
|
<a
|
|
206
214
|
class="dropdown__item dropdown__submenu-item dropdown__item--disabled={subItem.disabled}"
|
|
207
215
|
role="menuitem"
|
|
208
|
-
href={subItem.
|
|
216
|
+
href={subItem.href}
|
|
217
|
+
aria-label={subItem.label}
|
|
209
218
|
aria-disabled={subItem.disabled ? 'true' : undefined}
|
|
210
|
-
onclick={() =>
|
|
219
|
+
onclick={(e) => {
|
|
220
|
+
if (subItem.disabled) e.preventDefault();
|
|
221
|
+
else closeMenu();
|
|
222
|
+
}}
|
|
211
223
|
>
|
|
212
224
|
<span>{subItem.label}</span>
|
|
213
225
|
</a>
|
|
@@ -223,6 +235,14 @@
|
|
|
223
235
|
closeMenu();
|
|
224
236
|
}
|
|
225
237
|
}}
|
|
238
|
+
onkeydown={(e) => {
|
|
239
|
+
if (subItem.disabled) return;
|
|
240
|
+
if (e.key === 'Enter' || e.key === ' ') {
|
|
241
|
+
e.preventDefault();
|
|
242
|
+
subItem.onClick?.(subItem.value ?? subItem.label);
|
|
243
|
+
closeMenu();
|
|
244
|
+
}
|
|
245
|
+
}}
|
|
226
246
|
>
|
|
227
247
|
<span>{subItem.label}</span>
|
|
228
248
|
</div>
|
|
@@ -138,6 +138,7 @@
|
|
|
138
138
|
<h2 id="{modalId}-title" class="modal__title">{title}</h2>
|
|
139
139
|
<button type="button" class="modal__close" aria-label="Close modal" data-modal-close onclick={close}>
|
|
140
140
|
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
|
|
141
|
+
<title>Close</title>
|
|
141
142
|
<path d="M18 6L6 18" />
|
|
142
143
|
<path d="M6 6l12 12" />
|
|
143
144
|
</svg>
|
|
@@ -29,10 +29,12 @@
|
|
|
29
29
|
}: Props = $props();
|
|
30
30
|
|
|
31
31
|
const tableId = `table-${Math.random().toString(36).slice(2, 11)}`;
|
|
32
|
-
const
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
32
|
+
const classes = $derived(
|
|
33
|
+
['table', striped ? 'table--striped' : '', sortable ? 'table--sortable' : '', filterable ? 'table--filterable' : '', className]
|
|
34
|
+
.filter(Boolean)
|
|
35
|
+
.join(' ')
|
|
36
|
+
.trim()
|
|
37
|
+
);
|
|
36
38
|
|
|
37
39
|
let sortColumnIndex = $state<number | null>(null);
|
|
38
40
|
let sortDirection = $state<'ascending' | 'descending'>('ascending');
|
|
@@ -85,6 +87,7 @@
|
|
|
85
87
|
<label for="{tableId}-filter" class="sr-only">Filter table</label>
|
|
86
88
|
<span class="table__filter-icon" aria-hidden="true">
|
|
87
89
|
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="table__filter-icon-svg" aria-hidden="true">
|
|
90
|
+
<title>Filter</title>
|
|
88
91
|
<path d="M4 6h16M4 12h10M4 18h6" />
|
|
89
92
|
</svg>
|
|
90
93
|
</span>
|
|
@@ -128,6 +131,7 @@
|
|
|
128
131
|
<span class="table__cell-content">{col.label}</span>
|
|
129
132
|
<span class="table__sort-icon" aria-hidden="true">
|
|
130
133
|
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="table__sort-icon-svg" aria-hidden="true">
|
|
134
|
+
<title>Sort</title>
|
|
131
135
|
<path d="M3 6h18M7 12h10M10 18h4" />
|
|
132
136
|
</svg>
|
|
133
137
|
</span>
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
# SvelteKit + Rizzo CSS
|
|
2
|
+
|
|
3
|
+
This project was scaffolded with `npx rizzo-css init` (Svelte).
|
|
4
|
+
|
|
5
|
+
## First-time setup
|
|
6
|
+
|
|
7
|
+
**Install dependencies before running any SvelteKit command:**
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
pnpm install
|
|
11
|
+
# or: npm install
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
Then start the dev server:
|
|
15
|
+
|
|
16
|
+
```bash
|
|
17
|
+
pnpm dev
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
The theme selected during `rizzo-css init` is set in `src/app.html` (`data-theme`) and is used on first load when you have no saved preference in the browser.
|
|
21
|
+
|
|
22
|
+
## Commands
|
|
23
|
+
|
|
24
|
+
- `pnpm dev` — Start dev server
|
|
25
|
+
- `pnpm build` — Build for production
|
|
26
|
+
- `pnpm preview` — Preview production build
|
|
27
|
+
|
|
28
|
+
Docs: [rizzo-css.vercel.app](https://rizzo-css.vercel.app)
|
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
// See https://svelte.dev/docs/kit/types#app.d.ts
|
|
2
2
|
// for information about these interfaces
|
|
3
|
+
|
|
4
|
+
/** Toast options (injected by app.html script from Rizzo CSS scaffold) */
|
|
5
|
+
interface ToastOptions {
|
|
6
|
+
variant?: 'info' | 'success' | 'warning' | 'error';
|
|
7
|
+
position?: string;
|
|
8
|
+
autoDismiss?: number;
|
|
9
|
+
dismissible?: boolean;
|
|
10
|
+
}
|
|
11
|
+
|
|
3
12
|
declare global {
|
|
4
13
|
namespace App {
|
|
5
14
|
// interface Error {}
|
|
@@ -8,6 +17,12 @@ declare global {
|
|
|
8
17
|
// interface PageState {}
|
|
9
18
|
// interface Platform {}
|
|
10
19
|
}
|
|
20
|
+
|
|
21
|
+
interface Window {
|
|
22
|
+
showToast?(message: string, options?: ToastOptions): string | null;
|
|
23
|
+
removeToast?(id: string): void;
|
|
24
|
+
removeAllToasts?(): void;
|
|
25
|
+
}
|
|
11
26
|
}
|
|
12
27
|
|
|
13
28
|
export {};
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
6
6
|
<!-- Theme flash prevention + accessibility (same as main site) -->
|
|
7
7
|
<script>
|
|
8
|
-
(function(){try{var s=localStorage.getItem('theme');var d='github-dark-classic';var l='github-light';var r=!s?(matchMedia('(prefers-color-scheme: dark)').matches?d:l):s==='system'?(matchMedia('(prefers-color-scheme: dark)').matches?d:l):s;document.documentElement.setAttribute('data-theme',r);var f=localStorage.getItem('fontSizeScale');if(f)document.documentElement.style.setProperty('--font-size-scale',f);if(localStorage.getItem('reducedMotion')==='true')document.documentElement.classList.add('reduced-motion');if(localStorage.getItem('highContrast')==='true')document.documentElement.classList.add('high-contrast');var b=localStorage.getItem('scrollbarStyle')||'thin';if(b==='thick')document.documentElement.classList.add('scrollbar-thick');else if(b==='hidden')document.documentElement.classList.add('scrollbar-hidden','hide-scrollbars');}catch(e){}})();
|
|
8
|
+
(function(){try{var s=localStorage.getItem('theme');var d='github-dark-classic';var l='github-light';var initial=document.documentElement.getAttribute('data-theme');var r=!s?(initial||(matchMedia('(prefers-color-scheme: dark)').matches?d:l)):s==='system'?(matchMedia('(prefers-color-scheme: dark)').matches?d:l):s;document.documentElement.setAttribute('data-theme',r);var f=localStorage.getItem('fontSizeScale');if(f)document.documentElement.style.setProperty('--font-size-scale',f);if(localStorage.getItem('reducedMotion')==='true')document.documentElement.classList.add('reduced-motion');if(localStorage.getItem('highContrast')==='true')document.documentElement.classList.add('high-contrast');var b=localStorage.getItem('scrollbarStyle')||'thin';if(b==='thick')document.documentElement.classList.add('scrollbar-thick');else if(b==='hidden')document.documentElement.classList.add('scrollbar-hidden','hide-scrollbars');}catch(e){}})();
|
|
9
9
|
</script>
|
|
10
10
|
<!-- Toast: showToast, removeToast, removeAllToasts -->
|
|
11
11
|
<script>
|
|
@@ -13,7 +13,8 @@
|
|
|
13
13
|
var defaultLight = 'github-light';
|
|
14
14
|
var resolvedTheme;
|
|
15
15
|
if (!savedTheme) {
|
|
16
|
-
|
|
16
|
+
var initialTheme = document.documentElement.getAttribute('data-theme');
|
|
17
|
+
resolvedTheme = initialTheme || (window.matchMedia('(prefers-color-scheme: dark)').matches ? defaultDark : defaultLight);
|
|
17
18
|
} else if (savedTheme === 'system') {
|
|
18
19
|
resolvedTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? defaultDark : defaultLight;
|
|
19
20
|
} else {
|