@neobrut-vue/core 0.1.1 → 0.2.0
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/CHANGELOG.md +5 -0
- package/README.md +30 -2
- package/dist/components/NbButtonGroup/NbButtonGroup.vue.d.ts +23 -0
- package/dist/components/NbButtonGroup/index.d.ts +1 -0
- package/dist/components/NbKbd/NbKbd.vue.d.ts +22 -0
- package/dist/components/NbKbd/index.d.ts +1 -0
- package/dist/components/NbLink/NbLink.vue.d.ts +26 -0
- package/dist/components/NbLink/index.d.ts +2 -0
- package/dist/components/NbMarker/NbMarker.vue.d.ts +23 -0
- package/dist/components/NbMarker/index.d.ts +2 -0
- package/dist/components/NbToggle/NbToggle.vue.d.ts +35 -0
- package/dist/components/NbToggle/index.d.ts +2 -0
- package/dist/index.d.ts +9 -1
- package/dist/neobrut-vue.css +1 -1
- package/dist/neobrut-vue.js +663 -567
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
package/README.md
CHANGED
|
@@ -49,12 +49,40 @@ import { NbBadge, NbButton, NbCard } from '@neobrut-vue/core'
|
|
|
49
49
|
|
|
50
50
|
| Group | Components |
|
|
51
51
|
| --- | --- |
|
|
52
|
-
| Actions and surfaces | `NbButton`, `NbCard`, `NbAlert`, `NbBadge` |
|
|
52
|
+
| Actions and surfaces | `NbButton`, `NbButtonGroup`, `NbToggle`, `NbCard`, `NbAlert`, `NbBadge` |
|
|
53
53
|
| Forms | `NbCheckbox`, `NbCombobox`, `NbFieldset`, `NbInput`, `NbInputGroup`, `NbNumberInput`, `NbRadioGroup`, `NbSelect`, `NbSelectItem`, `NbSlider`, `NbSwitch`, `NbTextarea`, `NbToggleGroup`, `NbToggleGroupItem` |
|
|
54
54
|
| Navigation | `NbBreadcrumbs`, `NbPagination`, `NbTabs`, `NbTabsList`, `NbTabsTrigger`, `NbTabsContent` |
|
|
55
55
|
| Overlays | `NbDialog`, `NbDropdownMenu`, `NbDropdownMenuItem`, `NbDropdownMenuSeparator`, `NbPopover`, `NbToast`, `NbTooltip` |
|
|
56
56
|
| Data display | `NbAccordion`, `NbAccordionItem`, `NbAvatar`, `NbEmptyState`, `NbProgress`, `NbSkeleton`, `NbSpinner`, `NbTable` |
|
|
57
|
-
|
|
|
57
|
+
| Inline and layout | `NbLink`, `NbKbd`, `NbMarker`, `NbAspectRatio`, `NbScrollArea`, `NbSeparator` |
|
|
58
|
+
|
|
59
|
+
## Links and actions
|
|
60
|
+
|
|
61
|
+
`NbLink` forwards native anchor attributes and can render a router component through `as`. Related actions stay semantic and keyboard accessible:
|
|
62
|
+
|
|
63
|
+
```vue
|
|
64
|
+
<script setup lang="ts">
|
|
65
|
+
import { ref } from 'vue'
|
|
66
|
+
import { NbButton, NbButtonGroup, NbKbd, NbLink, NbMarker, NbToggle } from '@neobrut-vue/core'
|
|
67
|
+
|
|
68
|
+
const pinned = ref(false)
|
|
69
|
+
</script>
|
|
70
|
+
|
|
71
|
+
<template>
|
|
72
|
+
<p>
|
|
73
|
+
<NbLink href="/docs" tone="accent">Read the docs</NbLink>
|
|
74
|
+
and build something <NbMarker>loud</NbMarker>.
|
|
75
|
+
</p>
|
|
76
|
+
|
|
77
|
+
<NbButtonGroup label="Document actions">
|
|
78
|
+
<NbButton>Save</NbButton>
|
|
79
|
+
<NbButton variant="secondary">Share</NbButton>
|
|
80
|
+
</NbButtonGroup>
|
|
81
|
+
|
|
82
|
+
<NbToggle v-model="pinned" label="Pin project">Pin</NbToggle>
|
|
83
|
+
<span>Search with <NbKbd>⌘ K</NbKbd></span>
|
|
84
|
+
</template>
|
|
85
|
+
```
|
|
58
86
|
|
|
59
87
|
## Forms
|
|
60
88
|
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
orientation?: 'horizontal' | 'vertical';
|
|
3
|
+
label?: string;
|
|
4
|
+
};
|
|
5
|
+
declare function __VLS_template(): {
|
|
6
|
+
attrs: Partial<{}>;
|
|
7
|
+
slots: {
|
|
8
|
+
default?(_: {}): any;
|
|
9
|
+
};
|
|
10
|
+
refs: {};
|
|
11
|
+
rootEl: HTMLDivElement;
|
|
12
|
+
};
|
|
13
|
+
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
14
|
+
declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
15
|
+
orientation: "horizontal" | "vertical";
|
|
16
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
|
|
17
|
+
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
18
|
+
export default _default;
|
|
19
|
+
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
20
|
+
new (): {
|
|
21
|
+
$slots: S;
|
|
22
|
+
};
|
|
23
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default as NbButtonGroup } from './NbButtonGroup.vue';
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
size?: 'sm' | 'md';
|
|
3
|
+
};
|
|
4
|
+
declare function __VLS_template(): {
|
|
5
|
+
attrs: Partial<{}>;
|
|
6
|
+
slots: {
|
|
7
|
+
default?(_: {}): any;
|
|
8
|
+
};
|
|
9
|
+
refs: {};
|
|
10
|
+
rootEl: HTMLElement;
|
|
11
|
+
};
|
|
12
|
+
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
13
|
+
declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
14
|
+
size: "sm" | "md";
|
|
15
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLElement>;
|
|
16
|
+
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
17
|
+
export default _default;
|
|
18
|
+
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
19
|
+
new (): {
|
|
20
|
+
$slots: S;
|
|
21
|
+
};
|
|
22
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default as NbKbd } from './NbKbd.vue';
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { Component } from 'vue';
|
|
2
|
+
export type NbLinkTone = 'ink' | 'primary' | 'secondary' | 'accent' | 'danger';
|
|
3
|
+
type __VLS_Props = {
|
|
4
|
+
as?: string | Component;
|
|
5
|
+
tone?: NbLinkTone;
|
|
6
|
+
};
|
|
7
|
+
declare function __VLS_template(): {
|
|
8
|
+
attrs: Partial<{}>;
|
|
9
|
+
slots: {
|
|
10
|
+
default?(_: {}): any;
|
|
11
|
+
};
|
|
12
|
+
refs: {};
|
|
13
|
+
rootEl: any;
|
|
14
|
+
};
|
|
15
|
+
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
16
|
+
declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
17
|
+
as: string | Component;
|
|
18
|
+
tone: NbLinkTone;
|
|
19
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
20
|
+
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
21
|
+
export default _default;
|
|
22
|
+
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
23
|
+
new (): {
|
|
24
|
+
$slots: S;
|
|
25
|
+
};
|
|
26
|
+
};
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
export type NbMarkerTone = 'primary' | 'secondary' | 'accent' | 'danger';
|
|
2
|
+
type __VLS_Props = {
|
|
3
|
+
tone?: NbMarkerTone;
|
|
4
|
+
};
|
|
5
|
+
declare function __VLS_template(): {
|
|
6
|
+
attrs: Partial<{}>;
|
|
7
|
+
slots: {
|
|
8
|
+
default?(_: {}): any;
|
|
9
|
+
};
|
|
10
|
+
refs: {};
|
|
11
|
+
rootEl: HTMLElement;
|
|
12
|
+
};
|
|
13
|
+
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
14
|
+
declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
15
|
+
tone: NbMarkerTone;
|
|
16
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLElement>;
|
|
17
|
+
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
18
|
+
export default _default;
|
|
19
|
+
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
20
|
+
new (): {
|
|
21
|
+
$slots: S;
|
|
22
|
+
};
|
|
23
|
+
};
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
export type NbToggleTone = 'primary' | 'secondary' | 'accent' | 'danger';
|
|
2
|
+
export type NbToggleSize = 'sm' | 'md' | 'lg';
|
|
3
|
+
type __VLS_Props = {
|
|
4
|
+
modelValue?: boolean;
|
|
5
|
+
defaultValue?: boolean;
|
|
6
|
+
disabled?: boolean;
|
|
7
|
+
label?: string;
|
|
8
|
+
tone?: NbToggleTone;
|
|
9
|
+
size?: NbToggleSize;
|
|
10
|
+
};
|
|
11
|
+
declare function __VLS_template(): {
|
|
12
|
+
attrs: Partial<{}>;
|
|
13
|
+
slots: {
|
|
14
|
+
default?(_: {}): any;
|
|
15
|
+
};
|
|
16
|
+
refs: {};
|
|
17
|
+
rootEl: any;
|
|
18
|
+
};
|
|
19
|
+
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
20
|
+
declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
|
21
|
+
"update:modelValue": (value: boolean) => any;
|
|
22
|
+
}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
23
|
+
"onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
|
|
24
|
+
}>, {
|
|
25
|
+
size: NbToggleSize;
|
|
26
|
+
disabled: boolean;
|
|
27
|
+
tone: NbToggleTone;
|
|
28
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
29
|
+
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
30
|
+
export default _default;
|
|
31
|
+
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
32
|
+
new (): {
|
|
33
|
+
$slots: S;
|
|
34
|
+
};
|
|
35
|
+
};
|
package/dist/index.d.ts
CHANGED
|
@@ -4,6 +4,7 @@ import { NbBadge } from './components/NbBadge';
|
|
|
4
4
|
import { NbAvatar } from './components/NbAvatar';
|
|
5
5
|
import { NbBreadcrumbs } from './components/NbBreadcrumbs';
|
|
6
6
|
import { NbButton } from './components/NbButton';
|
|
7
|
+
import { NbButtonGroup } from './components/NbButtonGroup';
|
|
7
8
|
import { NbCard } from './components/NbCard';
|
|
8
9
|
import { NbCheckbox } from './components/NbCheckbox';
|
|
9
10
|
import { NbCombobox } from './components/NbCombobox';
|
|
@@ -14,6 +15,9 @@ import { NbEmptyState } from './components/NbEmptyState';
|
|
|
14
15
|
import { NbFieldset } from './components/NbFieldset';
|
|
15
16
|
import { NbInput } from './components/NbInput';
|
|
16
17
|
import { NbInputGroup } from './components/NbInputGroup';
|
|
18
|
+
import { NbKbd } from './components/NbKbd';
|
|
19
|
+
import { NbLink } from './components/NbLink';
|
|
20
|
+
import { NbMarker } from './components/NbMarker';
|
|
17
21
|
import { NbNumberInput } from './components/NbNumberInput';
|
|
18
22
|
import { NbPagination } from './components/NbPagination';
|
|
19
23
|
import { NbPopover } from './components/NbPopover';
|
|
@@ -30,13 +34,17 @@ import { NbTabs, NbTabsContent, NbTabsList, NbTabsTrigger } from './components/N
|
|
|
30
34
|
import { NbTextarea } from './components/NbTextarea';
|
|
31
35
|
import { NbTable } from './components/NbTable';
|
|
32
36
|
import { NbToast } from './components/NbToast';
|
|
37
|
+
import { NbToggle } from './components/NbToggle';
|
|
33
38
|
import { NbToggleGroup, NbToggleGroupItem } from './components/NbToggleGroup';
|
|
34
39
|
import { NbTooltip } from './components/NbTooltip';
|
|
35
|
-
export { NbAccordion, NbAccordionItem, NbAlert, NbAspectRatio, NbAvatar, NbBadge, NbBreadcrumbs, NbButton, NbCard, NbCheckbox, NbCombobox, NbDialog, NbDropdownMenu, NbDropdownMenuItem, NbDropdownMenuSeparator, NbEmptyState, NbFieldset, NbInput, NbInputGroup, NbNumberInput, NbPagination, NbPopover, NbProgress, NbRadioGroup, NbScrollArea, NbSelect, NbSelectItem, NbSeparator, NbSkeleton, NbSlider, NbSpinner, NbSwitch, NbTable, NbTabs, NbTabsContent, NbTabsList, NbTabsTrigger, NbTextarea, NbToast, NbToggleGroup, NbToggleGroupItem, NbTooltip };
|
|
40
|
+
export { NbAccordion, NbAccordionItem, NbAlert, NbAspectRatio, NbAvatar, NbBadge, NbBreadcrumbs, NbButton, NbButtonGroup, NbCard, NbCheckbox, NbCombobox, NbDialog, NbDropdownMenu, NbDropdownMenuItem, NbDropdownMenuSeparator, NbEmptyState, NbFieldset, NbInput, NbInputGroup, NbKbd, NbLink, NbMarker, NbNumberInput, NbPagination, NbPopover, NbProgress, NbRadioGroup, NbScrollArea, NbSelect, NbSelectItem, NbSeparator, NbSkeleton, NbSlider, NbSpinner, NbSwitch, NbTable, NbTabs, NbTabsContent, NbTabsList, NbTabsTrigger, NbTextarea, NbToast, NbToggle, NbToggleGroup, NbToggleGroupItem, NbTooltip };
|
|
36
41
|
export type { NbBreadcrumbItem } from './components/NbBreadcrumbs';
|
|
37
42
|
export type { NbComboboxOption } from './components/NbCombobox';
|
|
43
|
+
export type { NbLinkTone } from './components/NbLink';
|
|
44
|
+
export type { NbMarkerTone } from './components/NbMarker';
|
|
38
45
|
export type { NbRadioOption } from './components/NbRadioGroup';
|
|
39
46
|
export type { NbTabsOrientation } from './components/NbTabs';
|
|
47
|
+
export type { NbToggleSize, NbToggleTone } from './components/NbToggle';
|
|
40
48
|
export type { NbToggleGroupOrientation, NbToggleGroupType } from './components/NbToggleGroup';
|
|
41
49
|
export type { NbToastTone } from './components/NbToast';
|
|
42
50
|
export declare const NeoBrutalVue: import('vue').Plugin;
|
package/dist/neobrut-vue.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--nb-color-ink: #151515;--nb-color-paper: #fff8e7;--nb-color-muted: #ded5c4;--nb-color-primary: #ffdf3f;--nb-color-secondary: #70e1c3;--nb-color-accent: #ff7b71;--nb-color-danger: #ff4d5a;--nb-color-info: #8dc8ff;--nb-color-success: #9be15d;--nb-border-width: 3px;--nb-radius: .75rem;--nb-radius-sm: .35rem;--nb-shadow-x: 6px;--nb-shadow-y: 6px;--nb-shadow-color: var(--nb-color-ink);--nb-font-display: ui-rounded, "Arial Rounded MT Bold", system-ui, sans-serif;--nb-font-body: system-ui, sans-serif;--nb-font-mono: ui-monospace, SFMono-Regular, Menlo, monospace}.nb-theme-dark{--nb-color-ink: #fff8e7;--nb-color-paper: #202020;--nb-color-muted: #454545;--nb-shadow-color: #050505}:where(.nb-root){color:var(--nb-color-ink);font-family:var(--nb-font-body)}:where(.nb-root *,.nb-root *:before,.nb-root *:after){box-sizing:border-box}:where(.nb-root button,.nb-root input,.nb-root textarea,.nb-root select){font:inherit}:where(.nb-root button,.nb-root [role=button],.nb-root input,.nb-root textarea,.nb-root select):focus-visible{outline:3px solid var(--nb-color-accent);outline-offset:3px}@media(prefers-reduced-motion:reduce){:where(.nb-root *,.nb-root *:before,.nb-root *:after){animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}.nb-field{display:grid;align-items:start;grid-auto-rows:max-content;gap:.4rem}.nb-field__label,.nb-checkbox__label{font-family:var(--nb-font-display);font-weight:800}.nb-field__control{display:block;width:100%;height:2.75rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-paper);color:var(--nb-color-ink);padding:0 .8rem}.nb-select__trigger{display:flex;width:100%;height:2.75rem;align-items:center;justify-content:space-between;gap:.75rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-primary);color:var(--nb-color-ink);padding:0 .8rem;text-align:left}.nb-select__trigger:disabled{cursor:not-allowed;opacity:.55}.nb-select__icon,.nb-select__icon svg,.nb-select__scroll-button svg,.nb-select__indicator svg{width:1rem;height:1rem;flex:0 0 auto}.nb-select__icon svg,.nb-select__scroll-button svg,.nb-select__indicator svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.5}.nb-select__content{z-index:50;width:var(--reka-select-trigger-width);max-height:min(24rem,var(--reka-select-content-available-height));overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-paper);color:var(--nb-color-ink)}.nb-select__viewport{padding:.25rem}.nb-select__item{position:relative;display:flex;min-height:2.25rem;align-items:center;border:2px solid transparent;border-radius:calc(var(--nb-radius-sm) - .1rem);padding:.4rem 2rem .4rem .6rem;outline:0;cursor:default;-webkit-user-select:none;user-select:none}.nb-select__item[data-highlighted]{border-color:var(--nb-color-ink);background:var(--nb-color-primary)}.nb-select__item[data-disabled]{pointer-events:none;opacity:.45}.nb-select__indicator{position:absolute;right:.55rem;display:grid;place-items:center}.nb-select__scroll-button{display:flex;width:100%;height:1.75rem;align-items:center;justify-content:center;border:0;background:var(--nb-color-paper);color:var(--nb-color-ink)}.nb-field__control[type=file]{height:2.75rem;padding:0;overflow:hidden;line-height:calc(2.75rem - (2 * var(--nb-border-width)))}.nb-field__control[type=file]::file-selector-button{height:100%;margin:0 .75rem 0 0;border:0;border-right:var(--nb-border-width) solid var(--nb-color-ink);background:var(--nb-color-primary);color:var(--nb-color-ink);padding:0 .8rem;font:inherit;font-family:var(--nb-font-display);font-weight:800;line-height:normal;vertical-align:top;cursor:pointer}.nb-field__control--textarea{height:auto;min-height:7rem;padding:.7rem .8rem;resize:vertical}.nb-field__control:disabled{cursor:not-allowed;opacity:.5}.nb-field__hint,.nb-field__error{font-size:.8rem}.nb-field__hint{color:color-mix(in srgb,var(--nb-color-ink) 65%,transparent)}.nb-field__error{color:color-mix(in srgb,var(--nb-color-danger) 60%,var(--nb-color-ink));font-weight:700}.nb-checkbox{display:inline-flex;align-items:center;gap:.6rem;cursor:pointer}.nb-checkbox__input{position:absolute;opacity:0;pointer-events:none}.nb-checkbox__box{display:grid;width:1.5rem;height:1.5rem;place-items:center;border:var(--nb-border-width) solid var(--nb-color-ink);background:var(--nb-color-paper);font-weight:900;line-height:1}.nb-checkbox__input:not(:checked)+.nb-checkbox__box{color:transparent}.nb-checkbox__input:checked+.nb-checkbox__box{background:var(--nb-color-primary)}.nb-checkbox__input:focus-visible+.nb-checkbox__box{outline:3px solid var(--nb-color-accent);outline-offset:3px}.nb-checkbox__input:disabled+.nb-checkbox__box,.nb-checkbox__input:disabled~.nb-checkbox__label{opacity:.55}.nb-radio-group,.nb-fieldset{min-width:0;margin:0;border:0;padding:0}.nb-radio-group__legend,.nb-fieldset__legend{padding:0;font-family:var(--nb-font-display);border-radius:var(--nb-radius-sm);font-size:1rem;font-weight:900}.nb-radio-group__hint{margin:.3rem 0 0}.nb-radio-group__options{display:grid;gap:.55rem;margin-top:.7rem}.nb-radio{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.75rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-paper);cursor:pointer;padding:.75rem}.nb-radio.is-checked{box-shadow:4px 4px 0 var(--nb-shadow-color);background:var(--nb-color-primary);transform:translate(-1px,-1px)}.nb-radio__input,.nb-switch__input{position:absolute;opacity:0;pointer-events:none}.nb-radio__mark{display:grid;width:1.45rem;height:1.45rem;place-items:center;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:50%;background:var(--nb-color-paper)}.nb-radio__mark:after{width:.55rem;height:.55rem;border-radius:50%;background:var(--nb-color-ink);content:"";opacity:0}.nb-radio__input:checked+.nb-radio__mark:after{opacity:1}.nb-radio__input:focus-visible+.nb-radio__mark{outline:3px solid var(--nb-color-accent);outline-offset:3px}.nb-radio:has(.nb-radio__input:disabled){cursor:not-allowed;opacity:.5}.nb-radio__content,.nb-switch__content{display:grid;gap:.1rem}.nb-radio__label,.nb-switch__label{font-family:var(--nb-font-display);font-weight:800}.nb-radio__description,.nb-switch__description{font-size:.8rem;font-weight:500}.nb-switch{display:inline-grid;grid-template-columns:auto 1fr;align-items:center;gap:.75rem;cursor:pointer}.nb-switch.is-disabled{cursor:not-allowed;opacity:.55}.nb-switch__track{display:flex;width:3.25rem;height:1.8rem;align-items:center;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:999px;background:var(--nb-color-muted);padding:.15rem}.nb-switch__thumb{width:1rem;height:1rem;border:2px solid var(--nb-color-ink);border-radius:50%;background:var(--nb-color-paper);transition:transform .12s ease}.nb-switch__input:checked+.nb-switch__track{background:var(--nb-color-primary)}.nb-switch__input:checked+.nb-switch__track .nb-switch__thumb{transform:translate(1.35rem)}.nb-switch__input:focus-visible+.nb-switch__track{outline:3px solid var(--nb-color-accent);outline-offset:3px}.nb-fieldset{border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:5px 5px 0 var(--nb-shadow-color);background:var(--nb-color-paper);padding:1rem}.nb-fieldset__legend{border:var(--nb-border-width) solid var(--nb-color-ink);background:var(--nb-color-secondary);padding:.25rem .55rem;box-shadow:2px 2px 0 var(--nb-shadow-color)}.nb-fieldset__description{margin:0 0 1rem;font-size:.9rem}.nb-fieldset__content{display:grid;gap:1rem}.nb-fieldset:disabled{opacity:.55}.nb-input-group{display:grid;grid-template-columns:auto minmax(0,1fr) auto;min-height:2.75rem;overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-paper)}.nb-input-group__addon{display:flex;align-items:center;background:var(--nb-color-primary);padding:.65rem .75rem;font-family:var(--nb-font-display);font-weight:800}.nb-input-group__addon:first-child{border-right:var(--nb-border-width) solid var(--nb-color-ink)}.nb-input-group__addon:last-child{border-left:var(--nb-border-width) solid var(--nb-color-ink)}.nb-input-group__control{display:flex;min-width:0}.nb-input-group__control>:where(input,textarea,select){width:100%;min-width:0;border:0;background:transparent;color:var(--nb-color-ink);padding:.65rem .75rem;outline:0}.nb-input-group:has(.nb-input-group__control>:where(input,textarea,select):focus-visible){outline:3px solid var(--nb-color-accent);outline-offset:3px}.nb-number-input{display:grid;grid-template-columns:2.75rem minmax(0,1fr) 2.75rem;height:2.75rem;overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-paper)}.nb-number-input__input{width:100%;min-width:0;border:0;border-right:var(--nb-border-width) solid var(--nb-color-ink);border-left:var(--nb-border-width) solid var(--nb-color-ink);background:var(--nb-color-paper);color:var(--nb-color-ink);padding:0 .7rem;text-align:center;outline:0}.nb-number-input__button{border:0;background:var(--nb-color-primary);color:var(--nb-color-ink);font-family:var(--nb-font-display);font-size:1.25rem;font-weight:900;cursor:pointer}.nb-number-input__button:disabled{cursor:not-allowed;opacity:.45}.nb-number-input:has(.nb-number-input__input:focus-visible){outline:3px solid var(--nb-color-accent);outline-offset:3px}.nb-number-input:has(.nb-number-input__input:disabled){opacity:.55}.nb-slider__header{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}.nb-slider__value{min-width:2.5rem;border:2px solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-secondary);padding:.1rem .4rem;font-family:var(--nb-font-mono);font-size:.8rem;font-weight:800;text-align:center}.nb-slider{position:relative;display:flex;width:100%;height:2rem;align-items:center;touch-action:none;-webkit-user-select:none;user-select:none}.nb-slider__track{position:relative;width:100%;height:.75rem;border-radius:var(--nb-radius-sm);overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);background:var(--nb-color-paper)}.nb-slider__range{position:absolute;height:100%;background:var(--nb-color-primary)}.nb-slider__thumb{display:block;width:1.2rem;height:1.2rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:100%;background:var(--nb-color-accent);cursor:grab}.nb-slider__thumb:active{cursor:grabbing;transform:translate(2px,2px)}.nb-slider__thumb:focus-visible{outline:3px solid var(--nb-color-accent);outline-offset:3px}.nb-slider[data-disabled]{opacity:.55}.nb-slider[data-disabled] .nb-slider__thumb{cursor:not-allowed}.nb-toggle-group{display:inline-flex;width:fit-content;max-width:100%;overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:4px 4px 0 var(--nb-shadow-color);background:var(--nb-color-paper)}.nb-toggle-group[data-orientation=vertical]{flex-direction:column}.nb-toggle-group__item{min-width:2.75rem;min-height:2.75rem;border:0;border-right:var(--nb-border-width) solid var(--nb-color-ink);background:var(--nb-color-paper);color:var(--nb-color-ink);padding:.55rem .8rem;font-family:var(--nb-font-display);font-weight:800;cursor:pointer}.nb-toggle-group__item:last-child{border-right:0}.nb-toggle-group[data-orientation=vertical] .nb-toggle-group__item{border-right:0;border-bottom:var(--nb-border-width) solid var(--nb-color-ink)}.nb-toggle-group[data-orientation=vertical] .nb-toggle-group__item:last-child{border-bottom:0}.nb-toggle-group__item[data-state=on]{background:var(--nb-color-primary)}.nb-toggle-group__item:focus-visible{position:relative;z-index:1;outline:3px solid var(--nb-color-accent);outline-offset:-3px}.nb-toggle-group__item:disabled{cursor:not-allowed;opacity:.45}.nb-combobox__anchor{display:grid;grid-template-columns:minmax(0,1fr) 2.75rem;height:2.75rem;overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-paper)}.nb-combobox__input{width:100%;min-width:0;border:0;background:transparent;color:var(--nb-color-ink);padding:0 .8rem;outline:0}.nb-combobox__trigger{display:grid;place-items:center;border:0;border-left:var(--nb-border-width) solid var(--nb-color-ink);background:var(--nb-color-primary);color:var(--nb-color-ink);cursor:pointer}.nb-combobox__trigger svg,.nb-combobox__indicator svg{width:1rem;height:1rem;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.5}.nb-combobox__anchor:has(.nb-combobox__input:focus-visible){outline:3px solid var(--nb-color-accent);outline-offset:3px}.nb-combobox__anchor:has(.nb-combobox__input:disabled){opacity:.55}.nb-combobox__content{z-index:50;width:var(--reka-combobox-trigger-width);max-height:min(24rem,var(--reka-combobox-content-available-height));overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-paper);color:var(--nb-color-ink)}.nb-combobox__viewport{padding:.25rem}.nb-combobox__item{position:relative;display:flex;min-height:2.25rem;align-items:center;border:2px solid transparent;border-radius:calc(var(--nb-radius-sm) - .1rem);padding:.4rem 2rem .4rem .6rem;outline:0;cursor:default;-webkit-user-select:none;user-select:none}.nb-combobox__item[data-highlighted]{border-color:var(--nb-color-ink);background:var(--nb-color-primary)}.nb-combobox__item[data-disabled]{pointer-events:none;opacity:.45}.nb-combobox__indicator{position:absolute;right:.55rem;display:grid;place-items:center}.nb-combobox__empty{padding:.7rem;font-size:.85rem;font-weight:700}.nb-alert{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:4px 4px 0 var(--nb-shadow-color);padding:.9rem 1rem}.nb-alert__content{display:grid;gap:.2rem}.nb-alert__close,.nb-dialog__close{border:0;background:transparent;color:inherit;cursor:pointer;font-size:1.5rem;font-weight:900;line-height:1}.nb-alert--info{background:var(--nb-color-info)}.nb-alert--success{background:var(--nb-color-success)}.nb-alert--danger{background:var(--nb-color-danger)}.nb-alert--warning{background:var(--nb-color-primary)}.nb-dialog-layer{position:fixed;z-index:100;inset:0;display:grid;place-items:center;background:#151515b3;padding:1rem}.nb-dialog{width:min(100%,32rem);border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius);box-shadow:8px 8px #000;background:var(--nb-color-paper);color:var(--nb-color-ink)}.nb-dialog__header,.nb-dialog__footer{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem}.nb-dialog__header{border-bottom:var(--nb-border-width) solid var(--nb-color-ink)}.nb-dialog__header h2{margin:0;font-family:var(--nb-font-display)}.nb-dialog__body{padding:1rem}.nb-dialog__footer{border-top:var(--nb-border-width) solid var(--nb-color-ink);justify-content:flex-end}.nb-tabs{display:grid;gap:.65rem}.nb-tabs__list{display:flex;gap:.3rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-muted);padding:.3rem}.nb-tabs__trigger{flex:1 1 0;min-height:2.5rem;border:2px solid transparent;border-radius:calc(var(--nb-radius-sm) - 2px);background:transparent;color:var(--nb-color-ink);cursor:pointer;padding:.55rem .9rem;font-family:var(--nb-font-display);font-weight:800}.nb-tabs__trigger.is-active{border-color:var(--nb-color-ink);box-shadow:2px 2px 0 var(--nb-shadow-color);background:var(--nb-color-primary);transform:translate(-1px,-1px)}.nb-tabs__trigger:disabled{cursor:not-allowed;opacity:.45}.nb-tabs__content{border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:5px 5px 0 var(--nb-shadow-color);background:var(--nb-color-paper);padding:1rem}.nb-tabs--vertical{grid-template-columns:minmax(9rem,.35fr) minmax(0,1fr);align-items:start}.nb-tabs--vertical .nb-tabs__list{flex-direction:column}.nb-tabs--vertical .nb-tabs__trigger{flex-basis:auto;text-align:left}@media(max-width:42rem){.nb-tabs--vertical{grid-template-columns:1fr}}.nb-tooltip{position:relative;display:inline-flex}.nb-tooltip__trigger{display:inline-flex;cursor:help}.nb-tooltip__content{position:absolute;z-index:10;bottom:calc(100% + .6rem);left:50%;width:max-content;max-width:18rem;transform:translate(-50%);border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:4px 4px 0 var(--nb-shadow-color);background:var(--nb-color-primary);color:var(--nb-color-ink);padding:.5rem .65rem;font-size:.8rem;font-weight:700}.nb-tooltip__content[hidden]{display:none}.nb-overlay-trigger{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:2.75rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:4px 4px 0 var(--nb-shadow-color);background:var(--nb-color-secondary);color:var(--nb-color-ink);cursor:pointer;padding:.65rem .9rem;font-family:var(--nb-font-display);font-weight:800;line-height:1}.nb-overlay-trigger:hover:not(:disabled){transform:translate(1px,1px);box-shadow:3px 3px 0 var(--nb-shadow-color)}.nb-overlay-trigger:disabled{cursor:not-allowed;opacity:.5}.nb-overlay-trigger__icon{width:1rem;height:1rem;fill:none;stroke:currentColor;stroke-width:2.5}.nb-overlay-close{display:inline-grid;place-items:center;width:2rem;height:2rem;flex:0 0 auto;border:2px solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-accent);color:var(--nb-color-ink);cursor:pointer;font-size:1.25rem;font-weight:900;line-height:1}.nb-popover,.nb-dropdown-menu{z-index:110;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:6px 6px 0 var(--nb-shadow-color);background:var(--nb-color-paper);color:var(--nb-color-ink)}.nb-popover{width:min(20rem,calc(100vw - 2rem))}.nb-popover__header{display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:var(--nb-border-width) solid var(--nb-color-ink);padding:.75rem}.nb-popover__header h2{margin:0;font-family:var(--nb-font-display);font-size:1rem}.nb-popover__body{padding:1rem}.nb-dropdown-menu{min-width:12rem;padding:.35rem}.nb-dropdown-menu__item{display:flex;min-height:2.4rem;align-items:center;border:2px solid transparent;border-radius:calc(var(--nb-radius-sm) - 1px);cursor:pointer;padding:.45rem .65rem;font-weight:750;outline:none;-webkit-user-select:none;user-select:none}.nb-dropdown-menu__item[data-highlighted]{border-color:var(--nb-color-ink);background:var(--nb-color-primary)}.nb-dropdown-menu__item[data-disabled]{cursor:not-allowed;opacity:.45}.nb-dropdown-menu__item--destructive{color:#a50018}.nb-dropdown-menu__separator{height:2px;margin:.3rem -.35rem;background:var(--nb-color-ink)}.nb-toast-viewport{position:fixed;z-index:120;right:1rem;bottom:1rem;display:grid;width:min(24rem,calc(100vw - 2rem));margin:0;padding:0;list-style:none;outline:none}.nb-toast{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:6px 6px 0 var(--nb-shadow-color);padding:.9rem 1rem}.nb-toast--info{background:var(--nb-color-info)}.nb-toast--success{background:var(--nb-color-success)}.nb-toast--warning{background:var(--nb-color-primary)}.nb-toast--danger{background:var(--nb-color-danger)}.nb-toast__content{display:grid;gap:.15rem}.nb-toast__title{font-family:var(--nb-font-display);font-weight:900}.nb-toast__description{font-size:.9rem}.nb-accordion{display:grid;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:5px 5px 0 var(--nb-shadow-color);overflow:hidden;background:var(--nb-color-paper)}.nb-accordion__item+.nb-accordion__item{border-top:var(--nb-border-width) solid var(--nb-color-ink)}.nb-accordion__header{margin:0}.nb-accordion__trigger{display:flex;width:100%;align-items:center;justify-content:space-between;gap:1rem;border:0;background:var(--nb-color-secondary);color:var(--nb-color-ink);cursor:pointer;padding:.9rem 1rem;font-family:var(--nb-font-display);font-weight:900;text-align:left}.nb-accordion__trigger:hover{background:var(--nb-color-primary)}.nb-accordion__trigger:disabled{cursor:not-allowed;opacity:.5}.nb-accordion__icon{width:1rem;height:1rem;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2.5;transition:transform .15s ease}.nb-accordion__trigger[data-state=open] .nb-accordion__icon{transform:rotate(180deg)}.nb-accordion__content{overflow:hidden}.nb-accordion__content[data-state=open]{animation:nb-accordion-open .18s ease-out}.nb-accordion__content[data-state=closed]{animation:nb-accordion-close .16s ease-in}.nb-accordion__body{border-top:2px solid var(--nb-color-ink);padding:1rem}.nb-breadcrumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;margin:0;padding:0;list-style:none}.nb-breadcrumbs li{display:inline-flex;align-items:center;gap:.35rem}.nb-breadcrumbs a{color:inherit;font-weight:750;text-decoration-thickness:2px;text-underline-offset:.2em}.nb-breadcrumbs [aria-current=page]{font-family:var(--nb-font-display);font-weight:900}.nb-breadcrumbs__separator{width:.9rem;height:.9rem;fill:none;stroke:currentColor;stroke-width:2.5}.nb-pagination,.nb-pagination__list{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem}.nb-pagination__button{display:inline-grid;min-width:2.5rem;min-height:2.5rem;place-items:center;border:2px solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:2px 2px 0 var(--nb-shadow-color);background:var(--nb-color-paper);color:var(--nb-color-ink);cursor:pointer;font-family:var(--nb-font-display);font-weight:900}.nb-pagination__button svg{width:1rem;height:1rem;fill:none;stroke:currentColor;stroke-width:2.5}.nb-pagination__button[aria-current=page]{background:var(--nb-color-primary);transform:translate(1px,1px);box-shadow:1px 1px 0 var(--nb-shadow-color)}.nb-pagination__button:disabled{cursor:not-allowed;opacity:.4;box-shadow:none}.nb-pagination__ellipsis{min-width:1.5rem;text-align:center;font-weight:900}.nb-avatar{display:inline-grid;place-items:center;overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:50%;box-shadow:3px 3px 0 var(--nb-shadow-color);font-family:var(--nb-font-display);font-weight:900}.nb-avatar--sm{width:2rem;height:2rem;font-size:.7rem}.nb-avatar--md{width:3rem;height:3rem;font-size:.9rem}.nb-avatar--lg{width:4rem;height:4rem;font-size:1.15rem}.nb-avatar--primary{background:var(--nb-color-primary)}.nb-avatar--secondary{background:var(--nb-color-secondary)}.nb-avatar--accent{background:var(--nb-color-accent)}.nb-avatar__image{width:100%;height:100%;object-fit:cover}.nb-progress-wrap{display:grid;gap:.4rem}.nb-progress__header{display:flex;justify-content:space-between;gap:1rem;font-family:var(--nb-font-display);font-weight:850}.nb-progress{height:1.25rem;overflow:hidden;border:2px solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-muted)}.nb-progress__indicator{width:100%;height:100%;background:var(--nb-color-accent);transition:transform .18s ease}.nb-progress__indicator[data-state=indeterminate]{background:repeating-linear-gradient(135deg,var(--nb-color-accent) 0 .75rem,var(--nb-color-primary) .75rem 1.5rem);background-size:2.125rem 100%;animation:nb-progress-stripes .7s linear infinite}.nb-skeleton{border:2px solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:linear-gradient(110deg,var(--nb-color-muted) 25%,var(--nb-color-paper) 45%,var(--nb-color-muted) 65%);background-size:250% 100%;animation:nb-skeleton-shimmer 1.4s linear infinite}.nb-skeleton--rounded{border-radius:999px}@keyframes nb-accordion-open{0%{height:0;opacity:0}to{height:var(--reka-accordion-content-height);opacity:1}}@keyframes nb-accordion-close{0%{height:var(--reka-accordion-content-height);opacity:1}to{height:0;opacity:0}}@keyframes nb-progress-stripes{to{background-position-x:2.125rem}}@keyframes nb-skeleton-shimmer{to{background-position-x:-250%}}@media(prefers-reduced-motion:reduce){.nb-accordion__content,.nb-accordion__icon,.nb-progress__indicator,.nb-skeleton{animation:none;transition:none}}.nb-table-wrap{width:100%;overflow-x:auto;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:5px 5px 0 var(--nb-shadow-color)}.nb-table{width:100%;border-collapse:collapse;background:var(--nb-color-paper);color:var(--nb-color-ink)}.nb-table caption{border-bottom:var(--nb-border-width) solid var(--nb-color-ink);background:var(--nb-color-primary);padding:.8rem 1rem;font-family:var(--nb-font-display);font-weight:900;text-align:left}.nb-table th,.nb-table td{padding:.75rem 1rem;border-bottom:2px solid var(--nb-color-ink);text-align:left}.nb-table th{background:var(--nb-color-secondary);font-family:var(--nb-font-display);font-weight:900}.nb-table tr:last-child td{border-bottom:0}.nb-table tbody tr:nth-child(2n){background:color-mix(in srgb,var(--nb-color-muted) 50%,transparent)}.nb-empty-state{display:grid;justify-items:center;gap:.6rem;border:var(--nb-border-width) dashed var(--nb-color-ink);border-radius:var(--nb-radius);background:var(--nb-color-paper);padding:2.5rem 1.5rem;text-align:center}.nb-empty-state__icon{display:grid;place-items:center;width:4rem;height:4rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:50%;background:var(--nb-color-primary);font-size:2rem}.nb-empty-state h2{margin:0;font-family:var(--nb-font-display)}.nb-empty-state p{max-width:32rem;margin:0}.nb-empty-state__action{margin-top:.5rem}.nb-spinner-wrap{display:inline-flex}.nb-spinner{display:inline-block;border:3px solid var(--nb-color-muted);border-top-color:var(--nb-color-accent);border-right-color:var(--nb-color-ink);border-radius:50%;animation:nb-spin .7s linear infinite}.nb-spinner--sm{width:1rem;height:1rem;border-width:2px}.nb-spinner--md{width:1.5rem;height:1.5rem}.nb-spinner--lg{width:2.25rem;height:2.25rem;border-width:4px}.nb-separator{flex:0 0 auto;background:var(--nb-color-ink)}.nb-separator[data-orientation=horizontal]{width:100%;height:3px}.nb-separator[data-orientation=vertical]{width:3px;min-height:1.5rem;align-self:stretch}.nb-aspect-ratio{overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:5px 5px 0 var(--nb-shadow-color);background:var(--nb-color-secondary)}.nb-aspect-ratio>*{width:100%;height:100%;object-fit:cover}.nb-scroll-area{overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-paper)}.nb-scroll-area__viewport{width:100%;height:100%}.nb-scroll-area__viewport>*{padding:1rem}.nb-scroll-area__scrollbar{display:flex;width:.8rem;touch-action:none;-webkit-user-select:none;user-select:none;border-left:2px solid var(--nb-color-ink);background:var(--nb-color-muted);padding:2px}.nb-scroll-area__thumb{position:relative;flex:1;border:2px solid var(--nb-color-ink);border-radius:999px;background:var(--nb-color-accent)}.nb-badge{display:inline-flex;align-items:center;border:2px solid var(--nb-color-ink);border-radius:999px;color:var(--nb-color-ink);font-family:var(--nb-font-mono);font-weight:700;line-height:1}.nb-badge--sm{padding:.25rem .5rem;font-size:.7rem}.nb-badge--md{padding:.35rem .65rem;font-size:.8rem}.nb-badge--paper{background:var(--nb-color-paper)}.nb-badge--primary{background:var(--nb-color-primary)}.nb-badge--secondary{background:var(--nb-color-secondary)}.nb-badge--accent{background:var(--nb-color-accent)}.nb-badge--danger{background:var(--nb-color-danger)}.nb-badge--ink{background:var(--nb-color-ink);color:var(--nb-color-paper)}.nb-button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:var(--nb-shadow-x) var(--nb-shadow-y) 0 var(--nb-shadow-color);color:var(--nb-color-ink);cursor:pointer;font-family:var(--nb-font-display);font-weight:800;line-height:1;transition:transform .12s ease,box-shadow .12s ease}.nb-button:hover:not(:disabled){transform:translate(2px,2px);box-shadow:4px 4px 0 var(--nb-shadow-color)}.nb-button:active:not(:disabled){transform:translate(var(--nb-shadow-x),var(--nb-shadow-y));box-shadow:0 0 0 var(--nb-shadow-color)}.nb-button:disabled{cursor:not-allowed;opacity:.55}.nb-button--sm{min-height:2rem;padding:.5rem .75rem;font-size:.8rem}.nb-button--md{height:2.75rem;padding:0 1rem;font-size:.95rem}.nb-button--lg{min-height:3.25rem;padding:.9rem 1.25rem;font-size:1.05rem}.nb-button--primary{background:var(--nb-color-primary)}.nb-button--secondary{background:var(--nb-color-secondary)}.nb-button--accent{background:var(--nb-color-accent)}.nb-button--danger{background:var(--nb-color-danger)}.nb-button--ghost{background:transparent}.nb-button__loader{animation:nb-spin .7s linear infinite}@keyframes nb-spin{to{transform:rotate(360deg)}}.nb-card{border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius);box-shadow:var(--nb-shadow-x) var(--nb-shadow-y) 0 var(--nb-shadow-color);overflow:hidden}.nb-card--paper{background:var(--nb-color-paper)}.nb-card--primary{background:var(--nb-color-primary)}.nb-card--secondary{background:var(--nb-color-secondary)}.nb-card--ink{background:var(--nb-color-ink);color:var(--nb-color-paper)}.nb-card--interactive{transition:transform .12s ease,box-shadow .12s ease}.nb-card--interactive:hover{transform:translate(2px,2px);box-shadow:4px 4px 0 var(--nb-shadow-color)}.nb-card__header,.nb-card__footer{padding:.9rem 1rem;border-bottom:var(--nb-border-width) solid currentColor}.nb-card__footer{border-bottom:0;border-top:var(--nb-border-width) solid currentColor}.nb-card__body{padding:1rem}
|
|
1
|
+
:root{--nb-color-ink: #151515;--nb-color-paper: #fff8e7;--nb-color-muted: #ded5c4;--nb-color-primary: #ffdf3f;--nb-color-secondary: #70e1c3;--nb-color-accent: #ff7b71;--nb-color-danger: #ff4d5a;--nb-color-info: #8dc8ff;--nb-color-success: #9be15d;--nb-border-width: 3px;--nb-radius: .75rem;--nb-radius-sm: .35rem;--nb-shadow-x: 6px;--nb-shadow-y: 6px;--nb-shadow-color: var(--nb-color-ink);--nb-font-display: ui-rounded, "Arial Rounded MT Bold", system-ui, sans-serif;--nb-font-body: system-ui, sans-serif;--nb-font-mono: ui-monospace, SFMono-Regular, Menlo, monospace}.nb-theme-dark{--nb-color-ink: #fff8e7;--nb-color-paper: #202020;--nb-color-muted: #454545;--nb-shadow-color: #050505}:where(.nb-root){color:var(--nb-color-ink);font-family:var(--nb-font-body)}:where(.nb-root *,.nb-root *:before,.nb-root *:after){box-sizing:border-box}:where(.nb-root button,.nb-root input,.nb-root textarea,.nb-root select){font:inherit}:where(.nb-root button,.nb-root [role=button],.nb-root input,.nb-root textarea,.nb-root select):focus-visible{outline:3px solid var(--nb-color-accent);outline-offset:3px}@media(prefers-reduced-motion:reduce){:where(.nb-root *,.nb-root *:before,.nb-root *:after){animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}.nb-field{display:grid;align-items:start;grid-auto-rows:max-content;gap:.4rem}.nb-field__label,.nb-checkbox__label{font-family:var(--nb-font-display);font-weight:800}.nb-field__control{display:block;width:100%;height:2.75rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-paper);color:var(--nb-color-ink);padding:0 .8rem}.nb-select__trigger{display:flex;width:100%;height:2.75rem;align-items:center;justify-content:space-between;gap:.75rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-primary);color:var(--nb-color-ink);padding:0 .8rem;text-align:left}.nb-select__trigger:disabled{cursor:not-allowed;opacity:.55}.nb-select__icon,.nb-select__icon svg,.nb-select__scroll-button svg,.nb-select__indicator svg{width:1rem;height:1rem;flex:0 0 auto}.nb-select__icon svg,.nb-select__scroll-button svg,.nb-select__indicator svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.5}.nb-select__content{z-index:50;width:var(--reka-select-trigger-width);max-height:min(24rem,var(--reka-select-content-available-height));overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-paper);color:var(--nb-color-ink)}.nb-select__viewport{padding:.25rem}.nb-select__item{position:relative;display:flex;min-height:2.25rem;align-items:center;border:2px solid transparent;border-radius:calc(var(--nb-radius-sm) - .1rem);padding:.4rem 2rem .4rem .6rem;outline:0;cursor:default;-webkit-user-select:none;user-select:none}.nb-select__item[data-highlighted]{border-color:var(--nb-color-ink);background:var(--nb-color-primary)}.nb-select__item[data-disabled]{pointer-events:none;opacity:.45}.nb-select__indicator{position:absolute;right:.55rem;display:grid;place-items:center}.nb-select__scroll-button{display:flex;width:100%;height:1.75rem;align-items:center;justify-content:center;border:0;background:var(--nb-color-paper);color:var(--nb-color-ink)}.nb-field__control[type=file]{height:2.75rem;padding:0;overflow:hidden;line-height:calc(2.75rem - (2 * var(--nb-border-width)))}.nb-field__control[type=file]::file-selector-button{height:100%;margin:0 .75rem 0 0;border:0;border-right:var(--nb-border-width) solid var(--nb-color-ink);background:var(--nb-color-primary);color:var(--nb-color-ink);padding:0 .8rem;font:inherit;font-family:var(--nb-font-display);font-weight:800;line-height:normal;vertical-align:top;cursor:pointer}.nb-field__control--textarea{height:auto;min-height:7rem;padding:.7rem .8rem;resize:vertical}.nb-field__control:disabled{cursor:not-allowed;opacity:.5}.nb-field__hint,.nb-field__error{font-size:.8rem}.nb-field__hint{color:color-mix(in srgb,var(--nb-color-ink) 65%,transparent)}.nb-field__error{color:color-mix(in srgb,var(--nb-color-danger) 60%,var(--nb-color-ink));font-weight:700}.nb-checkbox{display:inline-flex;align-items:center;gap:.6rem;cursor:pointer}.nb-checkbox__input{position:absolute;opacity:0;pointer-events:none}.nb-checkbox__box{display:grid;width:1.5rem;height:1.5rem;place-items:center;border:var(--nb-border-width) solid var(--nb-color-ink);background:var(--nb-color-paper);font-weight:900;line-height:1}.nb-checkbox__input:not(:checked)+.nb-checkbox__box{color:transparent}.nb-checkbox__input:checked+.nb-checkbox__box{background:var(--nb-color-primary)}.nb-checkbox__input:focus-visible+.nb-checkbox__box{outline:3px solid var(--nb-color-accent);outline-offset:3px}.nb-checkbox__input:disabled+.nb-checkbox__box,.nb-checkbox__input:disabled~.nb-checkbox__label{opacity:.55}.nb-radio-group,.nb-fieldset{min-width:0;margin:0;border:0;padding:0}.nb-radio-group__legend,.nb-fieldset__legend{padding:0;font-family:var(--nb-font-display);border-radius:var(--nb-radius-sm);font-size:1rem;font-weight:900}.nb-radio-group__hint{margin:.3rem 0 0}.nb-radio-group__options{display:grid;gap:.55rem;margin-top:.7rem}.nb-radio{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.75rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-paper);cursor:pointer;padding:.75rem}.nb-radio.is-checked{box-shadow:4px 4px 0 var(--nb-shadow-color);background:var(--nb-color-primary);transform:translate(-1px,-1px)}.nb-radio__input,.nb-switch__input{position:absolute;opacity:0;pointer-events:none}.nb-radio__mark{display:grid;width:1.45rem;height:1.45rem;place-items:center;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:50%;background:var(--nb-color-paper)}.nb-radio__mark:after{width:.55rem;height:.55rem;border-radius:50%;background:var(--nb-color-ink);content:"";opacity:0}.nb-radio__input:checked+.nb-radio__mark:after{opacity:1}.nb-radio__input:focus-visible+.nb-radio__mark{outline:3px solid var(--nb-color-accent);outline-offset:3px}.nb-radio:has(.nb-radio__input:disabled){cursor:not-allowed;opacity:.5}.nb-radio__content,.nb-switch__content{display:grid;gap:.1rem}.nb-radio__label,.nb-switch__label{font-family:var(--nb-font-display);font-weight:800}.nb-radio__description,.nb-switch__description{font-size:.8rem;font-weight:500}.nb-switch{display:inline-grid;grid-template-columns:auto 1fr;align-items:center;gap:.75rem;cursor:pointer}.nb-switch.is-disabled{cursor:not-allowed;opacity:.55}.nb-switch__track{display:flex;width:3.25rem;height:1.8rem;align-items:center;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:999px;background:var(--nb-color-muted);padding:.15rem}.nb-switch__thumb{width:1rem;height:1rem;border:2px solid var(--nb-color-ink);border-radius:50%;background:var(--nb-color-paper);transition:transform .12s ease}.nb-switch__input:checked+.nb-switch__track{background:var(--nb-color-primary)}.nb-switch__input:checked+.nb-switch__track .nb-switch__thumb{transform:translate(1.35rem)}.nb-switch__input:focus-visible+.nb-switch__track{outline:3px solid var(--nb-color-accent);outline-offset:3px}.nb-fieldset{border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:5px 5px 0 var(--nb-shadow-color);background:var(--nb-color-paper);padding:1rem}.nb-fieldset__legend{border:var(--nb-border-width) solid var(--nb-color-ink);background:var(--nb-color-secondary);padding:.25rem .55rem;box-shadow:2px 2px 0 var(--nb-shadow-color)}.nb-fieldset__description{margin:0 0 1rem;font-size:.9rem}.nb-fieldset__content{display:grid;gap:1rem}.nb-fieldset:disabled{opacity:.55}.nb-input-group{display:grid;grid-template-columns:auto minmax(0,1fr) auto;min-height:2.75rem;overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-paper)}.nb-input-group__addon{display:flex;align-items:center;background:var(--nb-color-primary);padding:.65rem .75rem;font-family:var(--nb-font-display);font-weight:800}.nb-input-group__addon:first-child{border-right:var(--nb-border-width) solid var(--nb-color-ink)}.nb-input-group__addon:last-child{border-left:var(--nb-border-width) solid var(--nb-color-ink)}.nb-input-group__control{display:flex;min-width:0}.nb-input-group__control>:where(input,textarea,select){width:100%;min-width:0;border:0;background:transparent;color:var(--nb-color-ink);padding:.65rem .75rem;outline:0}.nb-input-group:has(.nb-input-group__control>:where(input,textarea,select):focus-visible){outline:3px solid var(--nb-color-accent);outline-offset:3px}.nb-number-input{display:grid;grid-template-columns:2.75rem minmax(0,1fr) 2.75rem;height:2.75rem;overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-paper)}.nb-number-input__input{width:100%;min-width:0;border:0;border-right:var(--nb-border-width) solid var(--nb-color-ink);border-left:var(--nb-border-width) solid var(--nb-color-ink);background:var(--nb-color-paper);color:var(--nb-color-ink);padding:0 .7rem;text-align:center;outline:0}.nb-number-input__button{border:0;background:var(--nb-color-primary);color:var(--nb-color-ink);font-family:var(--nb-font-display);font-size:1.25rem;font-weight:900;cursor:pointer}.nb-number-input__button:disabled{cursor:not-allowed;opacity:.45}.nb-number-input:has(.nb-number-input__input:focus-visible){outline:3px solid var(--nb-color-accent);outline-offset:3px}.nb-number-input:has(.nb-number-input__input:disabled){opacity:.55}.nb-slider__header{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}.nb-slider__value{min-width:2.5rem;border:2px solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-secondary);padding:.1rem .4rem;font-family:var(--nb-font-mono);font-size:.8rem;font-weight:800;text-align:center}.nb-slider{position:relative;display:flex;width:100%;height:2rem;align-items:center;touch-action:none;-webkit-user-select:none;user-select:none}.nb-slider__track{position:relative;width:100%;height:.75rem;border-radius:var(--nb-radius-sm);overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);background:var(--nb-color-paper)}.nb-slider__range{position:absolute;height:100%;background:var(--nb-color-primary)}.nb-slider__thumb{display:block;width:1.2rem;height:1.2rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:100%;background:var(--nb-color-accent);cursor:grab}.nb-slider__thumb:active{cursor:grabbing;transform:translate(2px,2px)}.nb-slider__thumb:focus-visible{outline:3px solid var(--nb-color-accent);outline-offset:3px}.nb-slider[data-disabled]{opacity:.55}.nb-slider[data-disabled] .nb-slider__thumb{cursor:not-allowed}.nb-toggle-group{display:inline-flex;width:fit-content;max-width:100%;overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:4px 4px 0 var(--nb-shadow-color);background:var(--nb-color-paper)}.nb-toggle-group[data-orientation=vertical]{flex-direction:column}.nb-toggle-group__item{min-width:2.75rem;min-height:2.75rem;border:0;border-right:var(--nb-border-width) solid var(--nb-color-ink);background:var(--nb-color-paper);color:var(--nb-color-ink);padding:.55rem .8rem;font-family:var(--nb-font-display);font-weight:800;cursor:pointer}.nb-toggle-group__item:last-child{border-right:0}.nb-toggle-group[data-orientation=vertical] .nb-toggle-group__item{border-right:0;border-bottom:var(--nb-border-width) solid var(--nb-color-ink)}.nb-toggle-group[data-orientation=vertical] .nb-toggle-group__item:last-child{border-bottom:0}.nb-toggle-group__item[data-state=on]{background:var(--nb-color-primary)}.nb-toggle-group__item:focus-visible{position:relative;z-index:1;outline:3px solid var(--nb-color-accent);outline-offset:-3px}.nb-toggle-group__item:disabled{cursor:not-allowed;opacity:.45}.nb-combobox__anchor{display:grid;grid-template-columns:minmax(0,1fr) 2.75rem;height:2.75rem;overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-paper)}.nb-combobox__input{width:100%;min-width:0;border:0;background:transparent;color:var(--nb-color-ink);padding:0 .8rem;outline:0}.nb-combobox__trigger{display:grid;place-items:center;border:0;border-left:var(--nb-border-width) solid var(--nb-color-ink);background:var(--nb-color-primary);color:var(--nb-color-ink);cursor:pointer}.nb-combobox__trigger svg,.nb-combobox__indicator svg{width:1rem;height:1rem;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.5}.nb-combobox__anchor:has(.nb-combobox__input:focus-visible){outline:3px solid var(--nb-color-accent);outline-offset:3px}.nb-combobox__anchor:has(.nb-combobox__input:disabled){opacity:.55}.nb-combobox__content{z-index:50;width:var(--reka-combobox-trigger-width);max-height:min(24rem,var(--reka-combobox-content-available-height));overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-paper);color:var(--nb-color-ink)}.nb-combobox__viewport{padding:.25rem}.nb-combobox__item{position:relative;display:flex;min-height:2.25rem;align-items:center;border:2px solid transparent;border-radius:calc(var(--nb-radius-sm) - .1rem);padding:.4rem 2rem .4rem .6rem;outline:0;cursor:default;-webkit-user-select:none;user-select:none}.nb-combobox__item[data-highlighted]{border-color:var(--nb-color-ink);background:var(--nb-color-primary)}.nb-combobox__item[data-disabled]{pointer-events:none;opacity:.45}.nb-combobox__indicator{position:absolute;right:.55rem;display:grid;place-items:center}.nb-combobox__empty{padding:.7rem;font-size:.85rem;font-weight:700}.nb-alert{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:4px 4px 0 var(--nb-shadow-color);padding:.9rem 1rem}.nb-alert__content{display:grid;gap:.2rem}.nb-alert__close,.nb-dialog__close{border:0;background:transparent;color:inherit;cursor:pointer;font-size:1.5rem;font-weight:900;line-height:1}.nb-alert--info{background:var(--nb-color-info)}.nb-alert--success{background:var(--nb-color-success)}.nb-alert--danger{background:var(--nb-color-danger)}.nb-alert--warning{background:var(--nb-color-primary)}.nb-dialog-layer{position:fixed;z-index:100;inset:0;display:grid;place-items:center;background:#151515b3;padding:1rem}.nb-dialog{width:min(100%,32rem);border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius);box-shadow:8px 8px #000;background:var(--nb-color-paper);color:var(--nb-color-ink)}.nb-dialog__header,.nb-dialog__footer{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem}.nb-dialog__header{border-bottom:var(--nb-border-width) solid var(--nb-color-ink)}.nb-dialog__header h2{margin:0;font-family:var(--nb-font-display)}.nb-dialog__body{padding:1rem}.nb-dialog__footer{border-top:var(--nb-border-width) solid var(--nb-color-ink);justify-content:flex-end}.nb-tabs{display:grid;gap:.65rem}.nb-tabs__list{display:flex;gap:.3rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-muted);padding:.3rem}.nb-tabs__trigger{flex:1 1 0;min-height:2.5rem;border:2px solid transparent;border-radius:calc(var(--nb-radius-sm) - 2px);background:transparent;color:var(--nb-color-ink);cursor:pointer;padding:.55rem .9rem;font-family:var(--nb-font-display);font-weight:800}.nb-tabs__trigger.is-active{border-color:var(--nb-color-ink);box-shadow:2px 2px 0 var(--nb-shadow-color);background:var(--nb-color-primary);transform:translate(-1px,-1px)}.nb-tabs__trigger:disabled{cursor:not-allowed;opacity:.45}.nb-tabs__content{border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:5px 5px 0 var(--nb-shadow-color);background:var(--nb-color-paper);padding:1rem}.nb-tabs--vertical{grid-template-columns:minmax(9rem,.35fr) minmax(0,1fr);align-items:start}.nb-tabs--vertical .nb-tabs__list{flex-direction:column}.nb-tabs--vertical .nb-tabs__trigger{flex-basis:auto;text-align:left}@media(max-width:42rem){.nb-tabs--vertical{grid-template-columns:1fr}}.nb-tooltip{position:relative;display:inline-flex}.nb-tooltip__trigger{display:inline-flex;cursor:help}.nb-tooltip__content{position:absolute;z-index:10;bottom:calc(100% + .6rem);left:50%;width:max-content;max-width:18rem;transform:translate(-50%);border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:4px 4px 0 var(--nb-shadow-color);background:var(--nb-color-primary);color:var(--nb-color-ink);padding:.5rem .65rem;font-size:.8rem;font-weight:700}.nb-tooltip__content[hidden]{display:none}.nb-overlay-trigger{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:2.75rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:4px 4px 0 var(--nb-shadow-color);background:var(--nb-color-secondary);color:var(--nb-color-ink);cursor:pointer;padding:.65rem .9rem;font-family:var(--nb-font-display);font-weight:800;line-height:1}.nb-overlay-trigger:hover:not(:disabled){transform:translate(1px,1px);box-shadow:3px 3px 0 var(--nb-shadow-color)}.nb-overlay-trigger:disabled{cursor:not-allowed;opacity:.5}.nb-overlay-trigger__icon{width:1rem;height:1rem;fill:none;stroke:currentColor;stroke-width:2.5}.nb-overlay-close{display:inline-grid;place-items:center;width:2rem;height:2rem;flex:0 0 auto;border:2px solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-accent);color:var(--nb-color-ink);cursor:pointer;font-size:1.25rem;font-weight:900;line-height:1}.nb-popover,.nb-dropdown-menu{z-index:110;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:6px 6px 0 var(--nb-shadow-color);background:var(--nb-color-paper);color:var(--nb-color-ink)}.nb-popover{width:min(20rem,calc(100vw - 2rem))}.nb-popover__header{display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:var(--nb-border-width) solid var(--nb-color-ink);padding:.75rem}.nb-popover__header h2{margin:0;font-family:var(--nb-font-display);font-size:1rem}.nb-popover__body{padding:1rem}.nb-dropdown-menu{min-width:12rem;padding:.35rem}.nb-dropdown-menu__item{display:flex;min-height:2.4rem;align-items:center;border:2px solid transparent;border-radius:calc(var(--nb-radius-sm) - 1px);cursor:pointer;padding:.45rem .65rem;font-weight:750;outline:none;-webkit-user-select:none;user-select:none}.nb-dropdown-menu__item[data-highlighted]{border-color:var(--nb-color-ink);background:var(--nb-color-primary)}.nb-dropdown-menu__item[data-disabled]{cursor:not-allowed;opacity:.45}.nb-dropdown-menu__item--destructive{color:#a50018}.nb-dropdown-menu__separator{height:2px;margin:.3rem -.35rem;background:var(--nb-color-ink)}.nb-toast-viewport{position:fixed;z-index:120;right:1rem;bottom:1rem;display:grid;width:min(24rem,calc(100vw - 2rem));margin:0;padding:0;list-style:none;outline:none}.nb-toast{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:6px 6px 0 var(--nb-shadow-color);padding:.9rem 1rem}.nb-toast--info{background:var(--nb-color-info)}.nb-toast--success{background:var(--nb-color-success)}.nb-toast--warning{background:var(--nb-color-primary)}.nb-toast--danger{background:var(--nb-color-danger)}.nb-toast__content{display:grid;gap:.15rem}.nb-toast__title{font-family:var(--nb-font-display);font-weight:900}.nb-toast__description{font-size:.9rem}.nb-accordion{display:grid;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:5px 5px 0 var(--nb-shadow-color);overflow:hidden;background:var(--nb-color-paper)}.nb-accordion__item+.nb-accordion__item{border-top:var(--nb-border-width) solid var(--nb-color-ink)}.nb-accordion__header{margin:0}.nb-accordion__trigger{display:flex;width:100%;align-items:center;justify-content:space-between;gap:1rem;border:0;background:var(--nb-color-secondary);color:var(--nb-color-ink);cursor:pointer;padding:.9rem 1rem;font-family:var(--nb-font-display);font-weight:900;text-align:left}.nb-accordion__trigger:hover{background:var(--nb-color-primary)}.nb-accordion__trigger:disabled{cursor:not-allowed;opacity:.5}.nb-accordion__icon{width:1rem;height:1rem;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2.5;transition:transform .15s ease}.nb-accordion__trigger[data-state=open] .nb-accordion__icon{transform:rotate(180deg)}.nb-accordion__content{overflow:hidden}.nb-accordion__content[data-state=open]{animation:nb-accordion-open .18s ease-out}.nb-accordion__content[data-state=closed]{animation:nb-accordion-close .16s ease-in}.nb-accordion__body{border-top:2px solid var(--nb-color-ink);padding:1rem}.nb-breadcrumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;margin:0;padding:0;list-style:none}.nb-breadcrumbs li{display:inline-flex;align-items:center;gap:.35rem}.nb-breadcrumbs a{color:inherit;font-weight:750;text-decoration-thickness:2px;text-underline-offset:.2em}.nb-breadcrumbs [aria-current=page]{font-family:var(--nb-font-display);font-weight:900}.nb-breadcrumbs__separator{width:.9rem;height:.9rem;fill:none;stroke:currentColor;stroke-width:2.5}.nb-pagination,.nb-pagination__list{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem}.nb-pagination__button{display:inline-grid;min-width:2.5rem;min-height:2.5rem;place-items:center;border:2px solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:2px 2px 0 var(--nb-shadow-color);background:var(--nb-color-paper);color:var(--nb-color-ink);cursor:pointer;font-family:var(--nb-font-display);font-weight:900}.nb-pagination__button svg{width:1rem;height:1rem;fill:none;stroke:currentColor;stroke-width:2.5}.nb-pagination__button[aria-current=page]{background:var(--nb-color-primary);transform:translate(1px,1px);box-shadow:1px 1px 0 var(--nb-shadow-color)}.nb-pagination__button:disabled{cursor:not-allowed;opacity:.4;box-shadow:none}.nb-pagination__ellipsis{min-width:1.5rem;text-align:center;font-weight:900}.nb-avatar{display:inline-grid;place-items:center;overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:50%;box-shadow:3px 3px 0 var(--nb-shadow-color);font-family:var(--nb-font-display);font-weight:900}.nb-avatar--sm{width:2rem;height:2rem;font-size:.7rem}.nb-avatar--md{width:3rem;height:3rem;font-size:.9rem}.nb-avatar--lg{width:4rem;height:4rem;font-size:1.15rem}.nb-avatar--primary{background:var(--nb-color-primary)}.nb-avatar--secondary{background:var(--nb-color-secondary)}.nb-avatar--accent{background:var(--nb-color-accent)}.nb-avatar__image{width:100%;height:100%;object-fit:cover}.nb-progress-wrap{display:grid;gap:.4rem}.nb-progress__header{display:flex;justify-content:space-between;gap:1rem;font-family:var(--nb-font-display);font-weight:850}.nb-progress{height:1.25rem;overflow:hidden;border:2px solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-muted)}.nb-progress__indicator{width:100%;height:100%;background:var(--nb-color-accent);transition:transform .18s ease}.nb-progress__indicator[data-state=indeterminate]{background:repeating-linear-gradient(135deg,var(--nb-color-accent) 0 .75rem,var(--nb-color-primary) .75rem 1.5rem);background-size:2.125rem 100%;animation:nb-progress-stripes .7s linear infinite}.nb-skeleton{border:2px solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:linear-gradient(110deg,var(--nb-color-muted) 25%,var(--nb-color-paper) 45%,var(--nb-color-muted) 65%);background-size:250% 100%;animation:nb-skeleton-shimmer 1.4s linear infinite}.nb-skeleton--rounded{border-radius:999px}@keyframes nb-accordion-open{0%{height:0;opacity:0}to{height:var(--reka-accordion-content-height);opacity:1}}@keyframes nb-accordion-close{0%{height:var(--reka-accordion-content-height);opacity:1}to{height:0;opacity:0}}@keyframes nb-progress-stripes{to{background-position-x:2.125rem}}@keyframes nb-skeleton-shimmer{to{background-position-x:-250%}}@media(prefers-reduced-motion:reduce){.nb-accordion__content,.nb-accordion__icon,.nb-progress__indicator,.nb-skeleton{animation:none;transition:none}}.nb-table-wrap{width:100%;overflow-x:auto;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:5px 5px 0 var(--nb-shadow-color)}.nb-table{width:100%;border-collapse:collapse;background:var(--nb-color-paper);color:var(--nb-color-ink)}.nb-table caption{border-bottom:var(--nb-border-width) solid var(--nb-color-ink);background:var(--nb-color-primary);padding:.8rem 1rem;font-family:var(--nb-font-display);font-weight:900;text-align:left}.nb-table th,.nb-table td{padding:.75rem 1rem;border-bottom:2px solid var(--nb-color-ink);text-align:left}.nb-table th{background:var(--nb-color-secondary);font-family:var(--nb-font-display);font-weight:900}.nb-table tr:last-child td{border-bottom:0}.nb-table tbody tr:nth-child(2n){background:color-mix(in srgb,var(--nb-color-muted) 50%,transparent)}.nb-empty-state{display:grid;justify-items:center;gap:.6rem;border:var(--nb-border-width) dashed var(--nb-color-ink);border-radius:var(--nb-radius);background:var(--nb-color-paper);padding:2.5rem 1.5rem;text-align:center}.nb-empty-state__icon{display:grid;place-items:center;width:4rem;height:4rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:50%;background:var(--nb-color-primary);font-size:2rem}.nb-empty-state h2{margin:0;font-family:var(--nb-font-display)}.nb-empty-state p{max-width:32rem;margin:0}.nb-empty-state__action{margin-top:.5rem}.nb-spinner-wrap{display:inline-flex}.nb-spinner{display:inline-block;border:3px solid var(--nb-color-muted);border-top-color:var(--nb-color-accent);border-right-color:var(--nb-color-ink);border-radius:50%;animation:nb-spin .7s linear infinite}.nb-spinner--sm{width:1rem;height:1rem;border-width:2px}.nb-spinner--md{width:1.5rem;height:1.5rem}.nb-spinner--lg{width:2.25rem;height:2.25rem;border-width:4px}.nb-separator{flex:0 0 auto;background:var(--nb-color-ink)}.nb-separator[data-orientation=horizontal]{width:100%;height:3px}.nb-separator[data-orientation=vertical]{width:3px;min-height:1.5rem;align-self:stretch}.nb-aspect-ratio{overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:5px 5px 0 var(--nb-shadow-color);background:var(--nb-color-secondary)}.nb-aspect-ratio>*{width:100%;height:100%;object-fit:cover}.nb-scroll-area{overflow:hidden;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);background:var(--nb-color-paper)}.nb-scroll-area__viewport{width:100%;height:100%}.nb-scroll-area__viewport>*{padding:1rem}.nb-scroll-area__scrollbar{display:flex;width:.8rem;touch-action:none;-webkit-user-select:none;user-select:none;border-left:2px solid var(--nb-color-ink);background:var(--nb-color-muted);padding:2px}.nb-scroll-area__thumb{position:relative;flex:1;border:2px solid var(--nb-color-ink);border-radius:999px;background:var(--nb-color-accent)}.nb-badge{display:inline-flex;align-items:center;border:2px solid var(--nb-color-ink);border-radius:999px;color:var(--nb-color-ink);font-family:var(--nb-font-mono);font-weight:700;line-height:1}.nb-badge--sm{padding:.25rem .5rem;font-size:.7rem}.nb-badge--md{padding:.35rem .65rem;font-size:.8rem}.nb-badge--paper{background:var(--nb-color-paper)}.nb-badge--primary{background:var(--nb-color-primary)}.nb-badge--secondary{background:var(--nb-color-secondary)}.nb-badge--accent{background:var(--nb-color-accent)}.nb-badge--danger{background:var(--nb-color-danger)}.nb-badge--ink{background:var(--nb-color-ink);color:var(--nb-color-paper)}.nb-button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:var(--nb-shadow-x) var(--nb-shadow-y) 0 var(--nb-shadow-color);color:var(--nb-color-ink);cursor:pointer;font-family:var(--nb-font-display);font-weight:800;line-height:1;transition:transform .12s ease,box-shadow .12s ease}.nb-button:hover:not(:disabled){transform:translate(2px,2px);box-shadow:4px 4px 0 var(--nb-shadow-color)}.nb-button:active:not(:disabled){transform:translate(var(--nb-shadow-x),var(--nb-shadow-y));box-shadow:0 0 0 var(--nb-shadow-color)}.nb-button:disabled{cursor:not-allowed;opacity:.55}.nb-button--sm{min-height:2rem;padding:.5rem .75rem;font-size:.8rem}.nb-button--md{height:2.75rem;padding:0 1rem;font-size:.95rem}.nb-button--lg{min-height:3.25rem;padding:.9rem 1.25rem;font-size:1.05rem}.nb-button--primary{background:var(--nb-color-primary)}.nb-button--secondary{background:var(--nb-color-secondary)}.nb-button--accent{background:var(--nb-color-accent)}.nb-button--danger{background:var(--nb-color-danger)}.nb-button--ghost{background:transparent}.nb-button__loader{animation:nb-spin .7s linear infinite}@keyframes nb-spin{to{transform:rotate(360deg)}}.nb-button-group{display:inline-flex;width:fit-content;border-radius:var(--nb-radius-sm);box-shadow:var(--nb-shadow-x) var(--nb-shadow-y) 0 var(--nb-shadow-color)}.nb-button-group[data-orientation=vertical]{flex-direction:column}.nb-button-group>.nb-button{position:relative;box-shadow:none;border-radius:0}.nb-button-group[data-orientation=horizontal]>.nb-button+.nb-button{margin-left:calc(var(--nb-border-width) * -1)}.nb-button-group[data-orientation=vertical]>.nb-button+.nb-button{margin-top:calc(var(--nb-border-width) * -1)}.nb-button-group[data-orientation=horizontal]>.nb-button:first-child{border-radius:var(--nb-radius-sm) 0 0 var(--nb-radius-sm)}.nb-button-group[data-orientation=horizontal]>.nb-button:last-child{border-radius:0 var(--nb-radius-sm) var(--nb-radius-sm) 0}.nb-button-group[data-orientation=vertical]>.nb-button:first-child{border-radius:var(--nb-radius-sm) var(--nb-radius-sm) 0 0}.nb-button-group[data-orientation=vertical]>.nb-button:last-child{border-radius:0 0 var(--nb-radius-sm) var(--nb-radius-sm)}.nb-button-group>.nb-button:hover:not(:disabled),.nb-button-group>.nb-button:active:not(:disabled){z-index:1;transform:none;box-shadow:inset 3px 3px color-mix(in srgb,var(--nb-color-ink) 18%,transparent)}.nb-button-group>.nb-button:focus-visible{z-index:2}.nb-card{border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius);box-shadow:var(--nb-shadow-x) var(--nb-shadow-y) 0 var(--nb-shadow-color);overflow:hidden}.nb-card--paper{background:var(--nb-color-paper)}.nb-card--primary{background:var(--nb-color-primary)}.nb-card--secondary{background:var(--nb-color-secondary)}.nb-card--ink{background:var(--nb-color-ink);color:var(--nb-color-paper)}.nb-card--interactive{transition:transform .12s ease,box-shadow .12s ease}.nb-card--interactive:hover{transform:translate(2px,2px);box-shadow:4px 4px 0 var(--nb-shadow-color)}.nb-card__header,.nb-card__footer{padding:.9rem 1rem;border-bottom:var(--nb-border-width) solid currentColor}.nb-card__footer{border-bottom:0;border-top:var(--nb-border-width) solid currentColor}.nb-card__body{padding:1rem}.nb-kbd{display:inline-flex;align-items:center;justify-content:center;border:2px solid var(--nb-color-ink);border-radius:.25rem;box-shadow:2px 2px 0 var(--nb-shadow-color);background:var(--nb-color-paper);color:var(--nb-color-ink);font-family:var(--nb-font-mono);font-weight:800;line-height:1;white-space:nowrap}.nb-kbd--sm{min-width:1.35rem;min-height:1.35rem;padding:.2rem .3rem;font-size:.7rem}.nb-kbd--md{min-width:1.7rem;min-height:1.7rem;padding:.3rem .45rem;font-size:.8rem}.nb-link{--nb-link-color: var(--nb-color-primary);color:var(--nb-color-ink);font-family:var(--nb-font-display);font-weight:850;text-decoration-color:var(--nb-link-color);text-decoration-line:underline;text-decoration-thickness:.22em;text-underline-offset:.16em;transition:background-size .14s ease,color .14s ease;background-image:linear-gradient(var(--nb-link-color),var(--nb-link-color));background-position:0 100%;background-repeat:no-repeat;background-size:100% 0}.nb-link:hover{background-size:100% .72em}.nb-link:focus-visible{outline:3px solid var(--nb-color-accent);outline-offset:3px}.nb-link--ink{--nb-link-color: var(--nb-color-muted)}.nb-link--primary{--nb-link-color: var(--nb-color-primary)}.nb-link--secondary{--nb-link-color: var(--nb-color-secondary)}.nb-link--accent{--nb-link-color: var(--nb-color-accent)}.nb-link--danger{--nb-link-color: var(--nb-color-danger)}.nb-marker{margin-inline:.08em;padding:.05em .22em;box-decoration-break:clone;-webkit-box-decoration-break:clone;color:var(--nb-color-ink);font-weight:750}.nb-marker--primary{background:var(--nb-color-primary)}.nb-marker--secondary{background:var(--nb-color-secondary)}.nb-marker--accent{background:var(--nb-color-accent)}.nb-marker--danger{background:var(--nb-color-danger)}.nb-toggle{display:inline-flex;align-items:center;justify-content:center;border:var(--nb-border-width) solid var(--nb-color-ink);border-radius:var(--nb-radius-sm);box-shadow:4px 4px 0 var(--nb-shadow-color);color:var(--nb-color-ink);cursor:pointer;font-family:var(--nb-font-display);font-weight:800;line-height:1;transition:transform .12s ease,box-shadow .12s ease}.nb-toggle:hover:not(:disabled){transform:translate(1px,1px);box-shadow:3px 3px 0 var(--nb-shadow-color)}.nb-toggle[data-state=on]{transform:translate(4px,4px);box-shadow:none}.nb-toggle:disabled{cursor:not-allowed;opacity:.55}.nb-toggle--sm{min-height:2rem;padding:.45rem .65rem;font-size:.8rem}.nb-toggle--md{min-height:2.75rem;padding:.65rem .9rem;font-size:.95rem}.nb-toggle--lg{min-height:3.25rem;padding:.8rem 1.1rem;font-size:1.05rem}.nb-toggle--primary{background:var(--nb-color-primary)}.nb-toggle--secondary{background:var(--nb-color-secondary)}.nb-toggle--accent{background:var(--nb-color-accent)}.nb-toggle--danger{background:var(--nb-color-danger)}
|