diff --git a/build/system.min.css b/build/system.min.css index 5424907..71b400c 100644 --- a/build/system.min.css +++ b/build/system.min.css @@ -1 +1 @@ -@layer --system,--theme;@property --system-accent-color{syntax: "|AccentColor"; inherits: true; initial-value: AccentColor;}@property --system-accent-color-text{syntax: "|AccentColorText"; inherits: true; initial-value: AccentColorText;}@property --system-active-text{syntax: "|ActiveText"; inherits: true; initial-value: ActiveText;}@property --system-button-border{syntax: "|ButtonBorder"; inherits: true; initial-value: ButtonBorder;}@property --system-button-face{syntax: "|ButtonFace"; inherits: true; initial-value: ButtonFace;}@property --system-button-text{syntax: "|ButtonText"; inherits: true; initial-value: ButtonText;}@property --system-canvas{syntax: "|Canvas"; inherits: true; initial-value: Canvas;}@property --system-canvas-text{syntax: "|CanvasText"; inherits: true; initial-value: CanvasText;}@property --system-field{syntax: "|Field"; inherits: true; initial-value: Field;}@property --system-field-text{syntax: "|FieldText"; inherits: true; initial-value: FieldText;}@property --system-gray-text{syntax: "|GrayText"; inherits: true; initial-value: GrayText;}@property --system-highlight{syntax: "|Highlight"; inherits: true; initial-value: Highlight;}@property --system-highlight-text{syntax: "|HighlightText"; inherits: true; initial-value: HighlightText;}@property --system-link-text{syntax: "|LinkText"; inherits: true; initial-value: LinkText;}@property --system-mark{syntax: "|Mark"; inherits: true; initial-value: Mark;}@property --system-mark-text{syntax: "|MarkText"; inherits: true; initial-value: MarkText;}@property --system-selected-item{syntax: "|SelectedItem"; inherits: true; initial-value: SelectedItem;}@property --system-selected-item-text{syntax: "|SelectedItemText"; inherits: true; initial-value: SelectedItemText;}@property --system-visited-text{syntax: "|VisitedText"; inherits: true; initial-value: VisitedText;}@property --system-cs-is-light{syntax: ""; inherits: true; initial-value: 1;}@layer --system{:root{--system-cs-state: calc(var(--system-cs-is-light, 1 ) * 100%)}@media (prefers-color-scheme: dark){:root{--system-cs-is-light: 0}}:root{--system-accent-color: color-mix(in oklab, dodgerblue 90%, black);--system-button-border: color-mix(in oklab, var(--system-stroke-color) var(--system-cs-state), ButtonBorder);--system-button-face: transparent;--system-button-text: color-mix(in oklab, ButtonText var(--system-cs-state), CanvasText);--system-canvas: Canvas;--system-canvas-text: CanvasText;--system-field: color-mix(in oklab, Field var(--system-cs-state), Canvas);--system-field-text: color-mix(in oklab, FieldText var(--system-cs-state), CanvasText);--system-gray-text: color-mix(in oklab, var(--system-canvas) 50%, var(--system-canvas-text));--system-highlight: color-mix( in oklab, Highlight var(--system-cs-state), color-mix(in oklab, steelblue 80%, CanvasText) );--system-highlight-text: HighlightText;--system-link-text: color-mix( in oklab, LinkText var(--system-cs-state), color-mix(in oklab, LinkText 60%, CanvasText) );--system-visited-text: color-mix( in oklab, VisitedText var(--system-cs-state), color-mix(in oklab, VisitedText 60%, CanvasText) )}}@layer --system{:root{--system-surface-color: color-mix( in oklab, color-mix(in oklab, var(--system-canvas) 95%, var(--system-canvas-text)) var(--system-cs-state), color-mix(in oklab, var(--system-canvas) 85%, var(--system-canvas-text)) );--system-stroke-color: color-mix(in oklab, var(--system-canvas) 55%, var(--system-canvas-text));--system-invalid-color: color-mix(in oklab, var(--system-active-text) 90%, var(--system-canvas-text));--system-interactive-color: var(--system-accent-color);--system-canvas-text-inverted: var(--system-canvas);--system-content-color-light: color-mix( in oklab, var(--system-canvas) var(--system-cs-state), var(--system-canvas-text) );--system-content-color-dark: color-mix( in oklab, var(--system-canvas-text) var(--system-cs-state), var(--system-canvas) )}}@layer --system{:root{--system-font-family-display: system-ui, sans-serif;--system-font-family-data: system-ui, sans-serif;--system-font-family-interactive: system-ui, sans-serif;--system-font-family-body: Charter, "Bitstream Charter", "Sitka Text", Cambria, serif;--system-font-family-code: ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, Consolas, "DejaVu Sans Mono", monospace;--system-font-size: 112.5%;--system-line-height: 1.5;--system-line-height-compact: 1.2;--system-line-height-display: 1.1;--system-font-size-xxxl: xxx-large;--system-font-size-xxl: xx-large;--system-font-size-xl: x-large;--system-font-size-l: large;--system-font-size-m: medium;--system-font-size-s: small;--system-font-size-xs: x-small;--system-font-size-xxs: xx-small;--system-font-weight-thin: 100;--system-font-weight-extralight: 200;--system-font-weight-light: 300;--system-font-weight-normal: 400;--system-font-weight-medium: 500;--system-font-weight-semibold: 600;--system-font-weight-bold: 700;--system-font-weight-extrabold: 800;--system-font-weight-black: 900}}@layer --system{:root{--system-stroke-thin: thin;--system-stroke-medium: medium;--system-stroke-thick: thick;--system-stroke-offset: calc(1cap - 1ex) }}@layer --system{@supports (margin: 1cap){:root{--_elememt-spacing-block-size: calc(1em - 1cap) ;--_elememt-spacing-inline-size: calc(1em - 1ch) ;--_interactive-spacing-block-size: calc(var(--_elememt-spacing-block-size) * 1.5);--_interactive-spacing-inline-size: calc(var(--_elememt-spacing-inline-size) * 2.75)}}@supports not (margin: 1cap){:root{--_elememt-spacing-block-size: .4ex;--_elememt-spacing-inline-size: .5ch;--_interactive-spacing-block-size: .8ex;--_interactive-spacing-inline-size: 1.5ch}}:root{--system-spacing-single: clamp(8px, 1rem, 24px);--system-spacing-double: clamp(16px, 2rem, 48px);--system-spacing-page-block: 0;--system-spacing-page-inline: max(var(--system-spacing-single), 5vw);--system-spacing-heading-block-start: max(var(--system-spacing-double), 2.5ex);--system-spacing-heading-block-end: var(--system-spacing-main);--system-spacing-main: clamp(var(--system-spacing-single), 1ex, var(--system-spacing-double));--system-spacing-main-block: clamp(var(--system-spacing-single), 1ex, var(--system-spacing-double));--system-spacing-main-inline: clamp(var(--system-spacing-single), 1ex, var(--system-spacing-double));--system-spacing-section-block: max(var(--system-spacing-double), 2.5ex);--system-spacing-section-inline: 0;--system-spacing-column-gap: clamp(var(--system-spacing-single), 3cqw, var(--system-spacing-double));--system-spacing-row-gap: clamp(var(--system-spacing-single), 3cqw, var(--system-spacing-double));--system-spacing-element-block: var(--_elememt-spacing-block-size);--system-spacing-element-inline: var(--_elememt-spacing-inline-size);--system-spacing-element: var(--system-spacing-element-block) var(--system-spacing-element-inline);--system-spacing-interactive-block: var(--_interactive-spacing-block-size);--system-spacing-interactive-inline: var(--_interactive-spacing-inline-size);--system-spacing-interactive: var(--system-spacing-interactive-block) var(--system-spacing-interactive-inline)}}@layer --system{:root{--system-dimension-min-width: 320px;--system-dimension-content-width: 85ch}}@layer --system{:root{--system-radius: clamp(3px, .6666ex, var(--system-spacing-single))}}@layer --system{*,*:before,*:after{box-sizing:border-box}html{font-family:var(--system-font-family-body);line-height:var(--system-line-height);color-scheme:light dark}body{margin:unset;color:var(--system-canvas-text);background-color:var(--system-canvas)}main{font-size:var(--system-font-size)}body>header{background:var(--system-surface-color)}body>header>:is(:is(h1,h2,h3),p:only-child){font-weight:var(--system-font-weight-extralight);font-family:var(--system-font-family-display);font-size:var(--system-font-size-xxl);color:var(--system-gray-text)}body>header>nav{font-family:var(--system-font-family-interactive)}body>header>nav [href]{color:var(--system-link-text)}body>header>nav [aria-current=page]{pointer-events:none;text-decoration:none;color:currentcolor}body>:is(header,main,footer):not(:has(*)){display:none}::selection{background:var(--system-highlight);color:var(--system-highlight-text)}:is([type=checkbox],[type=radio]):is(:checked,:focus-visible)+label{font-weight:bolder}:focus-visible{outline:var(--system-stroke-medium) solid var(--system-highlight);outline-offset:var(--system-stroke-offset)}:is(h1,h2,h3,h4,h5,h6){font-family:var(--system-font-family-display);line-height:var(--system-line-height-display);margin-block-start:var(--system-spacing-heading-block-start);margin-block-end:var(--system-spacing-main)}:is(h1,h2,h3){text-wrap:balance}:is(h4,h5,h6){line-height:var(--system-line-height-compact)}h1{font-weight:var(--system-font-weight-extrabold);font-size:var(--system-font-size-xxxl)}h2{font-size:var(--system-font-size-xxl)}h3{font-size:var(--system-font-size-xl)}h4{font-size:var(--system-font-size-l)}h5{font-size:var(--system-font-size-m)}h6{font-size:var(--system-font-size-s);text-transform:uppercase}a:link{color:var(--system-link-text)}a:hover{color:color-mix(in oklab,var(--system-link-text) 80%,var(--system-canvas-text))}a:active{color:var(--system-active-text)}a:focus{color:var(--system-link-text)}a:visited{color:var(--system-visited-text, VisitedText)}p{text-wrap:pretty}abbr:hover{cursor:help}blockquote{padding:var(--system-spacing-main);background:var(--system-surface-color);border-inline-start:var(--system-stroke-thick) solid var(--system-stroke-color)}blockquote>*:first-child{margin-block-start:unset}blockquote>*:last-child{margin-block-end:unset}abbr{cursor:help}input,select,button,textarea{font:inherit;font-size:var(--system-font-size-m);font-family:var(--system-font-family-interactive)}:is(input,select,button,textarea):not([type=checkbox],[type=radio]){min-block-size:max(40px,2.5rem)}:is(input,select,button,textarea):is([type=checkbox],[type=radio]){scale:125%}button{display:inline-flex;padding:var(--system-spacing-interactive);text-align:center;text-decoration:none;background:var(--system-button-face);color:var(--system-button-text);white-space:nowrap;border:var(--system-stroke-thin) solid var(--system-button-border);border-radius:var(--system-radius);font-weight:var(--system-font-weight-semibold)}button:hover{background:var(--system-surface-color)}button[type=submit]{background:var(--system-interactive-color);color:var(--system-canvas-text-inverted);border:var(--system-stroke-thin) solid var(--system-accent-color)}button[type=submit]:is(:focus,:focus-visible,:enabled:hover){color:var(--system-canvas-text-inverted);border-color:color-mix(in oklab,var(--system-accent-color) 85%,var(--system-canvas-text));background:color-mix(in oklab,var(--system-interactive-color) 85%,var(--system-canvas-text))}button[disabled]{opacity:.25;pointer-events:none}a img,a svg{margin-block-end:0px}code,pre,kbd,samp{font-family:var(--system-font-family-code)}code,samp,kbd,pre{background:var(--system-surface-color);border:var(--system-stroke-thin) solid var(--system-stroke-color);border-radius:var(--system-radius);padding:var(--system-spacing-element);font-size:var(--system-font-size-s)}kbd{border-block-end:var(--system-stroke-medium) solid var(--system-stroke-color)}pre{margin-block:var(--system-spacing-main);padding:var(--system-spacing-main);max-width:100%;overflow:auto}pre code{background:inherit;font-size:inherit;color:inherit;border:unset;padding:unset;margin:unset}code pre{display:inline;background:inherit;font-size:inherit;color:inherit;border:unset;padding:unset;margin:unset}details{margin-block:var(--system-spacing-main);border:var(--system-stroke-thin) solid var(--system-stroke-color);border-radius:var(--system-radius);cursor:text;overflow:clip}summary{cursor:pointer;font-family:var(--system-font-family-data);font-weight:var(--system-font-weight-semibold);padding:var(--system-spacing-interactive);background:var(--system-surface-color)}details[open]{padding-inline:var(--system-spacing-main-inline);padding-block-end:var(--system-spacing-main-block)}details[open]>summary{margin-inline:calc(var(--system-spacing-main) * -1)}details[open]>summary{margin-block-end:var(--system-spacing-main)}details[open]>summary+*{margin-block-start:unset}details[open]>*:last-child{margin-block-end:unset}li,li>:is(ul,ol){padding-block:var(--system-spacing-element-block)}:is(li,li>:is(ul,ol)):last-child{padding-block-end:unset}dt{font-weight:var(--system-font-weight-semibold)}hr{border:0;border-block-end:var(--system-stroke-medium) solid var(--system-surface-color);margin-block:var(--system-spacing-section-block);margin-inline:0}table{display:block;overflow-x:auto;border-collapse:collapse;width:100%;font-family:var(--system-font-family-data);font-size:smaller}:is(thead,tfoot) :is(td,th){text-transform:capitalize;padding-block:var(--system-spacing-element-block);background-color:var(--system-canvas)}td,th{vertical-align:top;border:var(--system-stroke-thin) solid var(--system-stroke-color);text-align:start;padding:var(--system-spacing-interactive)}:is(td,th) code{white-space:nowrap}th{background:var(--system-surface-color)}tr:nth-child(odd){background:var(--system-surface-color)}table caption{font-weight:var(--system-font-weight-bold);margin-block-end:var(--system-spacing-main)}textarea{max-width:100%}mark{padding:var(--system-spacing-element);background-color:var(--system-mark);color:var(--system-mark-text)}textarea,select,input{padding-block:var(--system-spacing-interactive-block);padding-inline:var(--system-spacing-interactive-inline);margin-block-end:var(--system-spacing-interactive-block);background:var(--system-field);color:var(--system-field-text);border:var(--system-stroke-thin) solid var(--system-button-border);border-radius:var(--system-radius);box-shadow:none;accent-color:var(--system-accent-color)}:is(textarea,select,input):is([type=radio]){border-radius:50%}select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800px' height='800px' viewBox='0 0 48 48' fill='gray'%3E%3Cpath d='M8.36612 16.1161C7.87796 16.6043 7.87796 17.3957 8.36612 17.8839L23.1161 32.6339C23.6043 33.122 24.3957 33.122 24.8839 32.6339L39.6339 17.8839C40.122 17.3957 40.122 16.6043 39.6339 16.1161C39.1457 15.628 38.3543 15.628 37.8661 16.1161L24 29.9822L10.1339 16.1161C9.64573 15.628 8.85427 15.628 8.36612 16.1161Z' fill='gray'/%3E%3C/svg%3E");background-size:15%;background-position:calc(100% - 1ch) 48%;background-repeat:no-repeat;padding-right:2.8em}figure{margin-block:var(--system-spacing-main);margin-inline:0}figcaption{text-align:center;font-style:italic;font-size:var(--system-font-size-s)}img,picture,svg,canvas{display:block;max-inline-size:100%;block-size:auto}:is(img,picture,svg,canvas):is([width="32"],[width="24"],[width="16"]){display:inline-block;vertical-align:middle}:is(p,li,td,dd)>:is(img,picture,svg,figure):not([width="32"],[width="24"],[width="16"]){float:inline-end;margin-inline-start:var(--system-spacing-column-gap);margin-block:var(--system-spacing-element-block);max-inline-size:42cqw}@container --content (width < 42ch){:is(p,li,dd,td)>:is(img,picture,svg,figure):not([width="32"],[width="24"],[width="16"]){width:100%;max-inline-size:unset}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}}@layer --system{body{--viewport-padding: minmax(var(--system-spacing-page-inline), 1fr);--content-width: minmax( calc(var(--system-dimension-min-width) - (var(--system-spacing-page-inline) * 2)), var(--system-dimension-content-width) );display:grid;grid-template-columns:[--viewport-start] var(--viewport-padding) [--content-start] var(--content-width) [--content-end] var( --viewport-padding ) [--viewport-end]}body>:is(header,footer){display:grid;grid-template-columns:subgrid;grid-column:--viewport-start / --viewport-end;padding-block:var(--system-spacing-main)}body>:is(header,footer)>*{grid-column:--content-start / --content-end;margin:0;padding:0}main{grid-column:--content-start / --content-end;container:--content / inline-size;padding-block:clamp(var(--system-spacing-main) * 2,var(--system-spacing-page-inline),var(--system-spacing-main) * 4)}main>*:first-child{margin-block-start:unset}main>*:last-child{margin-block-end:unset}body>header>nav{display:flex;column-gap:var(--system-spacing-column-gap);margin-block-start:var(--system-spacing-single)}body>:is(header,main,footer):not(:has(*)){display:none}}@layer --system{fieldset{display:flex;flex-direction:column;position:relative;border:0;padding:0;margin:0}fieldset:has(legend){margin-block-start:calc(1ex - .5lh);margin-block-end:1ex;padding-block-start:.5lh}form>div:has(button){margin-block-start:var(--system-spacing-main)}legend{position:relative;inset:.5lh 0}fieldset:has(:user-invalid),form:has(:user-invalid),form :user-invalid:not(:focus-visible){position:relative;outline:var(--system-stroke-thin) solid var(--system-invalid-color)}:is(fieldset:has(:user-invalid),form:has(:user-invalid),form :user-invalid:not(:focus-visible)):before{position:absolute;margin-inline-start:max(calc(var(--system-spacing-page-inline) * -1),calc(var(--system-spacing-double) * -1));content:"";width:0px;height:100%;display:block;border-inline-end-width:0;border-inline-end-style:solid;border-inline-end-color:var(--system-invalid-color)}:is(fieldset:has(:user-invalid),form:has(:user-invalid),form :user-invalid:not(:focus-visible)):is(input){border-color:var(--system-invalid-color)}:is(fieldset:has(:user-invalid),form:has(:user-invalid),form :user-invalid:not(:focus-visible)):is(fieldset){outline:0}:is(fieldset:has(:user-invalid),form:has(:user-invalid),form :user-invalid:not(:focus-visible)):is(fieldset):before{border-inline-end-width:var(--system-stroke-thick)}:is(fieldset:has(:user-invalid),form:has(:user-invalid),form :user-invalid:not(:focus-visible)):is(form){outline:0}:is(fieldset:has(:user-invalid),form:has(:user-invalid),form :user-invalid:not(:focus-visible)):is(form):before{border-inline-end-width:var(--system-stroke-thin)}fieldset>:is(p,div,fieldset){display:flex;flex-direction:column;align-items:start;justify-items:start;margin-block:calc((1lh - 1em)/2);gap:calc((1lh - 1em)/2);border:0;padding:0}fieldset>:is(p,div,fieldset):has([type=checkbox],[type=radio]){display:grid;grid-template-columns:min-content 1fr;row-gap:calc(1em - 1ex);column-gap:1ch;padding-block:calc(1em - 1ex);font-family:var(--system-font-family-data);font-size:var(--system-font-size-m);line-height:var(--system-line-height-compact)}fieldset>:is(p,div,fieldset):is(fieldset):has(:user-valid) input{accent-color:initial;outline:0}} +@layer --system,--theme;@property --system-accent-color{syntax: "|AccentColor"; inherits: true; initial-value: AccentColor;}@property --system-accent-color-text{syntax: "|AccentColorText"; inherits: true; initial-value: AccentColorText;}@property --system-active-text{syntax: "|ActiveText"; inherits: true; initial-value: ActiveText;}@property --system-button-border{syntax: "|ButtonBorder"; inherits: true; initial-value: ButtonBorder;}@property --system-button-face{syntax: "|ButtonFace"; inherits: true; initial-value: ButtonFace;}@property --system-button-text{syntax: "|ButtonText"; inherits: true; initial-value: ButtonText;}@property --system-canvas{syntax: "|Canvas"; inherits: true; initial-value: Canvas;}@property --system-canvas-text{syntax: "|CanvasText"; inherits: true; initial-value: CanvasText;}@property --system-field{syntax: "|Field"; inherits: true; initial-value: Field;}@property --system-field-text{syntax: "|FieldText"; inherits: true; initial-value: FieldText;}@property --system-gray-text{syntax: "|GrayText"; inherits: true; initial-value: GrayText;}@property --system-highlight{syntax: "|Highlight"; inherits: true; initial-value: Highlight;}@property --system-highlight-text{syntax: "|HighlightText"; inherits: true; initial-value: HighlightText;}@property --system-link-text{syntax: "|LinkText"; inherits: true; initial-value: LinkText;}@property --system-mark{syntax: "|Mark"; inherits: true; initial-value: Mark;}@property --system-mark-text{syntax: "|MarkText"; inherits: true; initial-value: MarkText;}@property --system-selected-item{syntax: "|SelectedItem"; inherits: true; initial-value: SelectedItem;}@property --system-selected-item-text{syntax: "|SelectedItemText"; inherits: true; initial-value: SelectedItemText;}@property --system-visited-text{syntax: "|VisitedText"; inherits: true; initial-value: VisitedText;}@property --system-cs-is-light{syntax: ""; inherits: true; initial-value: 1;}@layer --system{:root{--system-cs-state: calc(var(--system-cs-is-light, 1 ) * 100%)}@media (prefers-color-scheme: dark){:root{--system-cs-is-light: 0}}:root{--system-accent-color: color-mix(in oklab, dodgerblue 90%, black);--system-button-border: color-mix(in oklab, var(--system-stroke-color) var(--system-cs-state), ButtonBorder);--system-button-face: transparent;--system-button-text: color-mix(in oklab, ButtonText var(--system-cs-state), CanvasText);--system-canvas: Canvas;--system-canvas-text: CanvasText;--system-field: color-mix(in oklab, Field var(--system-cs-state), Canvas);--system-field-text: color-mix(in oklab, FieldText var(--system-cs-state), CanvasText);--system-gray-text: color-mix(in oklab, var(--system-canvas) 50%, var(--system-canvas-text));--system-highlight: color-mix( in oklab, Highlight var(--system-cs-state), color-mix(in oklab, steelblue 80%, CanvasText) );--system-highlight-text: HighlightText;--system-link-text: color-mix( in oklab, LinkText var(--system-cs-state), color-mix(in oklab, LinkText 60%, CanvasText) );--system-visited-text: color-mix( in oklab, VisitedText var(--system-cs-state), color-mix(in oklab, VisitedText 60%, CanvasText) )}}@layer --system{:root{--system-surface-color: color-mix( in oklab, color-mix(in oklab, var(--system-canvas) 95%, var(--system-canvas-text)) var(--system-cs-state), color-mix(in oklab, var(--system-canvas) 85%, var(--system-canvas-text)) );--system-stroke-color: color-mix(in oklab, var(--system-canvas) 55%, var(--system-canvas-text));--system-invalid-color: color-mix(in oklab, var(--system-active-text) 90%, var(--system-canvas-text));--system-interactive-color: var(--system-accent-color);--system-canvas-text-inverted: var(--system-canvas);--system-content-color-light: color-mix( in oklab, var(--system-canvas) var(--system-cs-state), var(--system-canvas-text) );--system-content-color-dark: color-mix( in oklab, var(--system-canvas-text) var(--system-cs-state), var(--system-canvas) )}}@layer --system{:root{--system-font-family-display: system-ui, sans-serif;--system-font-family-data: system-ui, sans-serif;--system-font-family-interactive: system-ui, sans-serif;--system-font-family-body: Charter, "Bitstream Charter", "Sitka Text", Cambria, serif;--system-font-family-code: ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, Consolas, "DejaVu Sans Mono", monospace;--system-font-size: 112.5%;--system-line-height: 1.5;--system-line-height-compact: 1.2;--system-line-height-display: 1.1;--system-font-size-xxxl: xxx-large;--system-font-size-xxl: xx-large;--system-font-size-xl: x-large;--system-font-size-l: large;--system-font-size-m: medium;--system-font-size-s: small;--system-font-size-xs: x-small;--system-font-size-xxs: xx-small;--system-font-weight-thin: 100;--system-font-weight-extralight: 200;--system-font-weight-light: 300;--system-font-weight-normal: 400;--system-font-weight-medium: 500;--system-font-weight-semibold: 600;--system-font-weight-bold: 700;--system-font-weight-extrabold: 800;--system-font-weight-black: 900}}@layer --system{:root{--system-stroke-thin: thin;--system-stroke-medium: medium;--system-stroke-thick: thick;--system-stroke-offset: calc(1cap - 1ex) }}@layer --system{@supports (margin: 1cap){:root{--_elememt-spacing-block-size: calc(1em - 1cap) ;--_elememt-spacing-inline-size: calc(1em - 1ch) ;--_interactive-spacing-block-size: calc(var(--_elememt-spacing-block-size) * 1.5);--_interactive-spacing-inline-size: calc(var(--_elememt-spacing-inline-size) * 2.75)}}@supports not (margin: 1cap){:root{--_elememt-spacing-block-size: .4ex;--_elememt-spacing-inline-size: .5ch;--_interactive-spacing-block-size: .8ex;--_interactive-spacing-inline-size: 1.5ch}}:root{--system-spacing-single: clamp(8px, 1rem, 24px);--system-spacing-double: clamp(16px, 2rem, 48px);--system-spacing-page-block: 0;--system-spacing-page-inline: max(var(--system-spacing-single), 5vw);--system-spacing-heading-block-start: max(var(--system-spacing-double), 2.5ex);--system-spacing-heading-block-end: var(--system-spacing-main);--system-spacing-main: clamp(var(--system-spacing-single), 1ex, var(--system-spacing-double));--system-spacing-main-block: clamp(var(--system-spacing-single), 1ex, var(--system-spacing-double));--system-spacing-main-inline: clamp(var(--system-spacing-single), 1ex, var(--system-spacing-double));--system-spacing-section-block: max(var(--system-spacing-double), 2.5ex);--system-spacing-section-inline: 0;--system-spacing-column-gap: clamp(var(--system-spacing-single), 3cqw, var(--system-spacing-double));--system-spacing-row-gap: clamp(var(--system-spacing-single), 3cqw, var(--system-spacing-double));--system-spacing-element-block: var(--_elememt-spacing-block-size);--system-spacing-element-inline: var(--_elememt-spacing-inline-size);--system-spacing-element: var(--system-spacing-element-block) var(--system-spacing-element-inline);--system-spacing-interactive-block: var(--_interactive-spacing-block-size);--system-spacing-interactive-inline: var(--_interactive-spacing-inline-size);--system-spacing-interactive: var(--system-spacing-interactive-block) var(--system-spacing-interactive-inline)}}@layer --system{:root{--system-dimension-min-width: 320px;--system-dimension-content-width: 85ch}}@layer --system{:root{--system-radius: clamp(3px, .6666ex, var(--system-spacing-single))}}@layer --system{*,*:before,*:after{box-sizing:border-box}html{font-family:var(--system-font-family-body);line-height:var(--system-line-height);color-scheme:light dark}body{margin:unset;color:var(--system-canvas-text);background-color:var(--system-canvas)}main{font-size:var(--system-font-size)}body>header{background:var(--system-surface-color)}body>header>:is(:is(h1,h2,h3),p:only-child){font-weight:var(--system-font-weight-extralight);font-family:var(--system-font-family-display);font-size:var(--system-font-size-xxl);color:var(--system-gray-text)}body>header>nav{font-family:var(--system-font-family-interactive)}body>header>nav [href]{color:var(--system-link-text)}body>header>nav [aria-current=page]{pointer-events:none;text-decoration:none;color:currentcolor}body>:is(header,main,footer):not(:has(*)){display:none}::selection{background:var(--system-highlight);color:var(--system-highlight-text)}:is([type=checkbox],[type=radio]):is(:checked,:focus-visible)+label{font-weight:bolder}:focus-visible{outline:var(--system-stroke-medium) solid var(--system-highlight);outline-offset:var(--system-stroke-offset)}:is(h1,h2,h3,h4,h5,h6){font-family:var(--system-font-family-display);line-height:var(--system-line-height-display);margin-block-start:var(--system-spacing-heading-block-start);margin-block-end:var(--system-spacing-main)}:is(h1,h2,h3){text-wrap:balance}:is(h4,h5,h6){line-height:var(--system-line-height-compact)}h1{font-weight:var(--system-font-weight-extrabold);font-size:var(--system-font-size-xxxl)}h2{font-size:var(--system-font-size-xxl)}h3{font-size:var(--system-font-size-xl)}h4{font-size:var(--system-font-size-l)}h5{font-size:var(--system-font-size-m)}h6{font-size:var(--system-font-size-s);text-transform:uppercase}a:link{color:var(--system-link-text)}a:hover{color:color-mix(in oklab,var(--system-link-text) 80%,var(--system-canvas-text))}a:active{color:var(--system-active-text)}a:focus{color:var(--system-link-text)}a:visited{color:var(--system-visited-text, VisitedText)}p{text-wrap:pretty}abbr:hover{cursor:help}blockquote{padding:var(--system-spacing-main);background:var(--system-surface-color);border-inline-start:var(--system-stroke-thick) solid var(--system-stroke-color)}blockquote>*:first-child{margin-block-start:unset}blockquote>*:last-child{margin-block-end:unset}abbr{cursor:help}input,select,button,textarea{font:inherit;font-size:var(--system-font-size-m);font-family:var(--system-font-family-interactive)}:is(input,select,button,textarea):not([type=checkbox],[type=radio]){min-block-size:max(40px,2.5rem)}:is(input,select,button,textarea):is([type=checkbox],[type=radio]){scale:125%}button{display:inline-flex;padding:var(--system-spacing-interactive);text-align:center;text-decoration:none;background:var(--system-button-face);color:var(--system-button-text);white-space:nowrap;border:var(--system-stroke-thin) solid var(--system-button-border);border-radius:var(--system-radius);font-weight:var(--system-font-weight-semibold)}button:hover{background:var(--system-surface-color)}button[type=submit]{background:var(--system-interactive-color);color:var(--system-canvas-text-inverted);border:var(--system-stroke-thin) solid var(--system-accent-color)}button[type=submit]:is(:focus,:focus-visible,:enabled:hover){color:var(--system-canvas-text-inverted);border-color:color-mix(in oklab,var(--system-accent-color) 85%,var(--system-canvas-text));background:color-mix(in oklab,var(--system-interactive-color) 85%,var(--system-canvas-text))}button[disabled]{opacity:.25;pointer-events:none}a img,a svg{margin-block-end:0px}code,pre,kbd,samp{font-family:var(--system-font-family-code)}code,samp,kbd,pre{background:var(--system-surface-color);border:var(--system-stroke-thin) solid var(--system-stroke-color);border-radius:var(--system-radius);padding:var(--system-spacing-element);font-size:var(--system-font-size-s)}kbd{border-block-end:var(--system-stroke-medium) solid var(--system-stroke-color)}pre{margin-block:var(--system-spacing-main);padding:var(--system-spacing-main);max-width:100%;overflow:auto}pre code{background:inherit;font-size:inherit;color:inherit;border:unset;padding:unset;margin:unset}code pre{display:inline;background:inherit;font-size:inherit;color:inherit;border:unset;padding:unset;margin:unset}details{margin-block:var(--system-spacing-main);border:var(--system-stroke-thin) solid var(--system-stroke-color);border-radius:var(--system-radius);cursor:text;overflow:clip}summary{cursor:pointer;font-family:var(--system-font-family-data);font-weight:var(--system-font-weight-semibold);padding:var(--system-spacing-interactive);background:var(--system-surface-color)}details[open]{padding-inline:var(--system-spacing-main-inline);padding-block-end:var(--system-spacing-main-block)}details[open]>summary{margin-inline:calc(var(--system-spacing-main) * -1)}details[open]>summary{margin-block-end:var(--system-spacing-main)}details[open]>summary+*{margin-block-start:unset}details[open]>*:last-child{margin-block-end:unset}dt{font-weight:var(--system-font-weight-semibold)}hr{border:0;border-block-end:var(--system-stroke-medium) solid var(--system-surface-color);margin-block:var(--system-spacing-section-block);margin-inline:0}table{display:block;overflow-x:auto;border-collapse:collapse;width:100%;font-family:var(--system-font-family-data);font-size:smaller}:is(thead,tfoot) :is(td,th){text-transform:capitalize;padding-block:var(--system-spacing-element-block);background-color:var(--system-canvas)}td,th{vertical-align:top;border:var(--system-stroke-thin) solid var(--system-stroke-color);text-align:start;padding:var(--system-spacing-interactive)}:is(td,th) code{white-space:nowrap}th{background:var(--system-surface-color)}tr:nth-child(odd){background:var(--system-surface-color)}table caption{font-weight:var(--system-font-weight-bold);margin-block-end:var(--system-spacing-main)}textarea{max-width:100%}mark{padding:var(--system-spacing-element);background-color:var(--system-mark);color:var(--system-mark-text)}textarea,select,input{padding-block:var(--system-spacing-interactive-block);padding-inline:var(--system-spacing-interactive-inline);margin-block-end:var(--system-spacing-interactive-block);background:var(--system-field);color:var(--system-field-text);border:var(--system-stroke-thin) solid var(--system-button-border);border-radius:var(--system-radius);box-shadow:none;accent-color:var(--system-accent-color)}:is(textarea,select,input):is([type=radio]){border-radius:50%}select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800px' height='800px' viewBox='0 0 48 48' fill='gray'%3E%3Cpath d='M8.36612 16.1161C7.87796 16.6043 7.87796 17.3957 8.36612 17.8839L23.1161 32.6339C23.6043 33.122 24.3957 33.122 24.8839 32.6339L39.6339 17.8839C40.122 17.3957 40.122 16.6043 39.6339 16.1161C39.1457 15.628 38.3543 15.628 37.8661 16.1161L24 29.9822L10.1339 16.1161C9.64573 15.628 8.85427 15.628 8.36612 16.1161Z' fill='gray'/%3E%3C/svg%3E");background-size:15%;background-position:calc(100% - 1ch) 48%;background-repeat:no-repeat;padding-right:2.8em}figure{margin-block:var(--system-spacing-main);margin-inline:0}figcaption{text-align:center;font-style:italic;font-size:var(--system-font-size-s)}img,picture,svg,canvas{display:block;max-inline-size:100%;block-size:auto}:is(img,picture,svg,canvas):is([width="32"],[width="24"],[width="16"]){display:inline-block;vertical-align:middle}:is(p,li,td,dd)>:is(img,picture,svg,figure):not([width="32"],[width="24"],[width="16"]){float:inline-end;margin-inline-start:var(--system-spacing-column-gap);margin-block:var(--system-spacing-element-block);max-inline-size:42cqw}@container --content (width < 42ch){:is(p,li,dd,td)>:is(img,picture,svg,figure):not([width="32"],[width="24"],[width="16"]){width:100%;max-inline-size:unset}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}}@layer --system{body{--viewport-padding: minmax(var(--system-spacing-page-inline), 1fr);--content-width: minmax( calc(var(--system-dimension-min-width) - (var(--system-spacing-page-inline) * 2)), var(--system-dimension-content-width) );display:grid;grid-template-columns:[--viewport-start] var(--viewport-padding) [--content-start] var(--content-width) [--content-end] var( --viewport-padding ) [--viewport-end]}body>:is(header,footer){display:grid;grid-template-columns:subgrid;grid-column:--viewport-start / --viewport-end;padding-block:var(--system-spacing-main)}body>:is(header,footer)>*{grid-column:--content-start / --content-end;margin:0;padding:0}main{grid-column:--content-start / --content-end;container:--content / inline-size;padding-block:clamp(var(--system-spacing-main) * 2,var(--system-spacing-page-inline),var(--system-spacing-main) * 4)}main>*:first-child{margin-block-start:unset}main>*:last-child{margin-block-end:unset}body>header>nav{display:flex;column-gap:var(--system-spacing-column-gap);margin-block-start:var(--system-spacing-single)}body>:is(header,main,footer):not(:has(*)){display:none}}@layer --system{fieldset{display:flex;flex-direction:column;position:relative;border:0;padding:0;margin:0}fieldset:has(legend){margin-block-start:calc(1ex - .5lh);margin-block-end:1ex;padding-block-start:.5lh}form>div:has(button){margin-block-start:var(--system-spacing-main)}legend{position:relative;inset:.5lh 0}fieldset:has(:user-invalid),form:has(:user-invalid),form :user-invalid:not(:focus-visible){position:relative;outline:var(--system-stroke-thin) solid var(--system-invalid-color)}:is(fieldset:has(:user-invalid),form:has(:user-invalid),form :user-invalid:not(:focus-visible)):before{position:absolute;margin-inline-start:max(calc(var(--system-spacing-page-inline) * -1),calc(var(--system-spacing-double) * -1));content:"";width:0px;height:100%;display:block;border-inline-end-width:0;border-inline-end-style:solid;border-inline-end-color:var(--system-invalid-color)}:is(fieldset:has(:user-invalid),form:has(:user-invalid),form :user-invalid:not(:focus-visible)):is(input){border-color:var(--system-invalid-color)}:is(fieldset:has(:user-invalid),form:has(:user-invalid),form :user-invalid:not(:focus-visible)):is(fieldset){outline:0}:is(fieldset:has(:user-invalid),form:has(:user-invalid),form :user-invalid:not(:focus-visible)):is(fieldset):before{border-inline-end-width:var(--system-stroke-thick)}:is(fieldset:has(:user-invalid),form:has(:user-invalid),form :user-invalid:not(:focus-visible)):is(form){outline:0}:is(fieldset:has(:user-invalid),form:has(:user-invalid),form :user-invalid:not(:focus-visible)):is(form):before{border-inline-end-width:var(--system-stroke-thin)}fieldset>:is(p,div,fieldset){display:flex;flex-direction:column;align-items:start;justify-items:start;margin-block:calc((1lh - 1em)/2);gap:calc((1lh - 1em)/2);border:0;padding:0}fieldset>:is(p,div,fieldset):has([type=checkbox],[type=radio]){display:grid;grid-template-columns:min-content 1fr;row-gap:calc(1em - 1ex);column-gap:1ch;padding-block:calc(1em - 1ex);font-family:var(--system-font-family-data);font-size:var(--system-font-size-m);line-height:var(--system-line-height-compact)}fieldset>:is(p,div,fieldset):is(fieldset):has(:user-valid) input{accent-color:initial;outline:0}}