lutra 0.0.33 → 0.1.4

package/dist/style.css

@@ -1,950 +0,0 @@
-@font-face {
-    font-family: InterVariable;
-    font-style: normal;
-    font-weight: 100 900;
-    src: url("/InterVariable.woff2") format("woff2");
-}
-@font-face {
-    font-family: InterVariable;
-    font-style: italic;
-    font-weight: 100 900;
-    src: url("/InterVariable-Italic.woff2") format("woff2");
-}
-@font-face {
-    font-family: InconsolataVariable;
-    font-style: normal;
-    font-weight: 100 900;
-    src: url("/InconsolataVariable.woff2") format("woff2");
-}
-
-:root {
-    font-synthesis-weight: none;
-    /* The base grid size is used to calculate sizes */
-    --grid-size: 16px;
-    /* Default font family */
-    --font-family: InterVariable, sans-serif;
-    --font-family-mono: 'InconsolataVariable';
-    font-optical-sizing: auto;
-    font-kerning: auto;
-    --border-radius: 0.5em;
-    --field-radius: 0.35em;
-    --border-size: 1px;
-    --border-style: solid;
-    --field-border-size: 1px;
-    --field-border-style: solid;
-    --focus-size: 2px;
-    --mix-amount: 80%; 
-    --margin-xxxs: 0.35rem;
-    --margin-xxs: 0.5rem;
-    --margin-xs: 0.75rem;
-    --margin-sm: 1rem;
-    --margin-md: 1.5rem;
-    --margin-lg: 2rem;
-    --margin-xl: 3rem;
-    --margin-xxl: 4rem;
-    /* Transitions */
-    --menu-trans: 0.1s ease-in-out;
-    --overlay-filter: blur(10px);
-    /**
-     * Light theme
-     */
-    --l-mix-target: hsl(215, 0%, 5%);
-    /* bg */
-    --l-bg-app: hsl(215, 3%, 98%);
-    --l-bg-panel: white;
-    --l-bg-scrim: rgba(0, 0, 0, 0.5);
-    --l-bg-subtle: hsl(210, 10%, 96%);
-    --l-bg-subtler: hsl(215, 3%, 94%);
-    --l-bg-hover: hsl(215, 50%, 93%);
-    --l-bg-overlay: rgba(255,255,255,0.85);
-    --l-shadow: rgba(0, 0, 0, 0.15);
-    /* border */
-    --l-border-color: hsl(215, 6%, 80%);
-    --l-border-subtle-color: hsl(215, 5%, 87%);
-    --l-focus-color: hsl(215, 60%, 55%);
-    --l-focus-color-error: hsl(353, 76%, 58%);
-    --l-border: var(--border-size) var(--border-style) var(--l-border-color);
-    --l-border-subtle: var(--border-size) var(--border-style) var(--l-border-subtle-color);
-    --l-focus-outline: var(--focus-size) solid var(--l-focus-color);
-    /* text */
-    --l-text: hsl(240, 2%, 20%);
-    --l-text-subtle: hsl(240, 2%, 40%);
-    --l-text-subtler: hsl(240, 2%, 55%);
-    --l-text-highlight: hsl(206, 99%, 47%);
-    --l-text-heading: hsl(240, 3%, 12%);
-    --l-text-link: hsl(215, 70%, 55%);
-    --l-text-warn: #e74c3c;
-    --l-text-icon: #666;
-    --l-text-subtle-icon: #999;
-    --l-text-warn-icon: #e74c3c;
-    /* fields */
-    --l-form-bg: hsl(215, 3%, 99%);
-    --l-field-bg: transparent;
-    --l-field-border-color: var(--l-border-color);
-    --l-field-border-color-error: var(--l-focus-color-error);
-    --l-field-border: var(--field-border-size) var(--field-border-style) var(--l-field-border-color);
-    --l-field-text: var(--l-text);
-    --l-field-placeholder: #999;
-    --l-field-label: #333;
-    /* toggle */
-    --l-toggle-on: #0187ed;
-    --l-toggle-off: #ccc;
-    /* buttons */
-    --l-button-bg: hsl(215, 70%, 50%);
-    --l-button-text: white;
-    --l-button-border-color: var(--l-button-bg);
-    --l-button-border: var(--border-size) var(--border-style) var(--l-button-border-color);
-    /* buttons: disabled */
-    --l-button-disabled-bg: hsl(215, 3%, 50%);
-    --l-button-disabled-text: #fafafa;
-    --l-button-disabled-border-color: var(--l-button-disabled-bg);
-    --l-button-disabled-border: var(--border-size) var(--border-style) var(--l-button-disabled-border-color);
-    /* buttons: outlined */
-    --l-button-outlined-text: hsl(215, 3%, 30%);
-    --l-button-outlined-border-color: hsl(215, 3%, 50%);
-    --l-button-outlined-border: var(--border-size) var(--border-style) var(--l-button-outlined-border-color);
-    /* buttons: secondary (for highlighted actions) */
-    --l-button-secondary-bg: hsl(132, 94%, 32%);
-    --l-button-secondary-text: white;
-    --l-button-secondary-border-color: var(--l-button-secondary-bg);
-    --l-button-secondary-border: var(--border-size) var(--border-style) var(--l-button-secondary-border-color);
-    /* buttons: warn */
-    --l-button-warn-bg: #e74c3c;
-    --l-button-warn-text: white;
-    --l-button-warn-border-color: var(--l-button-warn-bg);
-    --l-button-warn-border: var(--border-size) var(--border-style) var(--l-button-warn-border-color);
-    /* warn */
-    --l-warn-bg: #ffbc04;
-    --l-warn-border: #b58500;
-    --l-warn-text: #3f2f00;
-    /* success */
-    --l-success-bg: #e6ffed;
-    --l-success-border: #a3e7c5;
-    --l-success-text: rgb(29, 69, 29);
-    /* error */
-    --l-error-bg: #ffdede;
-    --l-error-border: #df8888;
-    --l-error-text: rgb(115, 37, 37);
-    /* info */
-    --l-info-bg: #e6f7ff;
-    --l-info-border: #a3e7ff;
-    --l-info-text: rgb(29, 69, 69);
-    /* menu */
-    --l-menu-bg: #fff;
-    --l-menu-bg-active: hsl(215, 25%, 90%);
-    --l-menu-border: var(--l-border-subtle);
-    --l-menu-text: hsl(215, 10%, 50%);
-    --l-menu-text-active: hsl(240, 2%, 15%);
-    /* status colors */
-    --l-status-default: hsl(215, 20%, 85%);
-    --l-status-ok: #28a745;
-    --l-status-alert: #dc3545;
-    --l-status-warn: #ffc107;
-    --l-status-info: #038ac8;
-    --l-status-task: #007bff;
-    /* scrollbar */
-    --l-scrollbar-color: hsl(215, 8%, 70%) hsl(215, 20%, 98%);
-
-    /**
-     * Dark theme
-     */
-    --d-mix-target: hsl(215, 3%, 10%);
-    /* bg */
-    --d-bg-app: hsl(215, 12%, 8%);
-    --d-bg-panel: hsl(215, 12%, 14%);
-    --d-bg-scrim: rgba(0, 0, 0, 0.5);
-    --d-bg-subtle: hsl(215, 12%, 12%);
-    --d-bg-subtler: hsl(215, 12%, 10%);
-    --d-bg-hover: hsl(215, 15%, 20%);
-    --d-bg-overlay: hsla(215, 10%, 10%, 0.85);
-    --d-shadow: hsla(215, 5%, 5%, 0.3);
-    /* border */
-    --d-border-color: hsl(215, 10%, 33%);
-    --d-border-subtle-color: hsl(215, 5%, 25%);
-    --d-focus-color: rgb(77, 144, 254);
-    --d-focus-color-error: red;
-    --d-border: var(--border-size) var(--border-style) var(--d-border-color);
-    --d-border-subtle: var(--border-size) var(--border-style) var(--d-border-subtle-color);
-    --d-focus-outline: var(--focus-size) solid var(--d-focus-color);
-    /* text */
-    --d-text: hsl(220, 6%, 80%);
-    --d-text-subtle: hsl(215, 5%, 65%);
-    --d-text-subtler: hsl(215, 5%, 50%);
-    --d-text-highlight: #4C9AFF;
-    --d-text-heading: #e1e1e3;
-    --d-text-link: rgb(77, 144, 254);
-    --d-text-link-hover: rgb(58, 109, 193);
-    --d-text-warn: #e23434;
-    --d-text-icon: hsl(215, 5%, 70%);
-    --d-text-subtle-icon: hsl(215, 5%, 50%);
-    --d-text-warn-icon: #ff6b6b;
-    /* fields */
-    --d-form-bg: hsl(215, 12%, 14%);
-    --d-field-bg: hsl(215, 10%, 10%);
-    --d-field-border-color: var(--d-border-color);
-    --d-field-border-color-error: red;
-    --d-field-border: var(--field-border-size) var(--field-border-style) var(--d-field-border-color);
-    --d-field-text: var(--d-text);
-    --d-field-placeholder: hsl(215, 5%, 40%);
-    --d-field-label: hsl(215, 5%, 75%);
-    /* toggle */
-    --d-toggle-on: hsl(215, 80%, 40%);
-    --d-toggle-on-hover: hsl(215, 90%, 60%);
-    --d-toggle-off: hsl(215, 5%, 45%);
-    --d-toggle-off-hover: hsl(215, 8%, 50%);
-    /* buttons */
-    --d-button-bg: hsl(215, 80%, 40%);
-    --d-button-text: hsl(215, 5%, 98%);
-    --d-button-border-color: var(--d-button-bg);
-    --d-button-border: var(--border-size) var(--border-style) var(--d-button-border-color);
-    /* buttons: disabled */
-    --d-button-disabled-bg: #555;
-    --d-button-disabled-text: #333;
-    --d-button-disabled-border-color: var(--d-button-disabled-bg);
-    --d-button-disabled-border: var(--border-size) var(--border-style) var(--d-button-disabled-border-color);
-    /* buttons: outlined */
-    --d-button-outlined-text: hsl(215, 8%, 85%);
-    --d-button-outlined-border-color: var(--d-button-outlined-text);
-    --d-button-outlined-border: var(--border-size) var(--border-style) var(--d-button-outlined-border-color);
-    /* buttons: secondary (for highlighted actions) */
-    --d-button-secondary-bg: hsl(146, 67%, 38%);
-    --d-button-secondary-text: hsl(146, 5%, 98%);
-    --d-button-secondary-border-color: var(--d-button-secondary-bg);
-    --d-button-secondary-border: var(--border-size) var(--border-style) var(--d-button-secondary-border-color);
-    /* buttons: warn */
-    --d-button-warn-bg: hsl(0, 53%, 42%);
-    --d-button-warn-text: white;
-    --d-button-warn-border-color: var(--d-button-warn-bg);
-    --d-button-warn-border: var(--border-size) var(--border-style) var(--d-button-warn-border-color);
-    /* warn */
-    --d-warn-bg: #ffb900;
-    --d-warn-border: #cc9500;
-    --d-warn-text: #664d00;
-    /* success */
-    --d-success-bg: #4caf50;
-    --d-success-border: #397d3f;
-    --d-success-text: #e8f5e9;
-    /* error */
-    --d-error-bg: #f44336;
-    --d-error-border: #d32f2f;
-    --d-error-text: #ffebee;
-    /* info */
-    --d-info-bg: #2196f3;
-    --d-info-border: #1976d2;
-    --d-info-text: #e3f2fd;
-    /* menu */
-    --d-menu-bg: #2c2c2c;
-    --d-menu-bg-active: #444;
-    --d-menu-border: var(--d-border-subtle);
-    --d-menu-text: hsl(215, 10%, 75%);
-    --d-menu-text-active: #fff;
-    /* status colors */
-    --d-status-default: hsl(215, 10%, 25%);
-    --d-status-ok: #4caf50;
-    --d-status-alert: #f44336;
-    --d-status-warn: #ffeb3b;
-    --d-status-info: #0362c8;
-    --d-status-task: #1e88e5;
-    --d-scrollbar-color: hsl(215, 10%, 55%) hsla(215, 10%, 35%, 0.5);
-}
-
-@media(min-width: 1280px) {
-    :root {
-        --grid-size: 16px;
-        --pad-xs: 0.5rem;
-        --pad-sm: 1rem;
-        --pad-md: 1.5rem;
-        --pad-lg: 2rem;
-        --pad-xl: 3rem;
-        --pad-xxl: 4rem;
-    }
-}
-
-@media(max-width: 1280px) {
-    :root {
-        --grid-size: 14px;
-        --pad-xs: 0.5rem;
-        --pad-sm: 1rem;
-        --pad-md: 1.5rem;
-        --pad-lg: 2rem;
-        --pad-xl: 3rem;
-        --pad-xxl: 4rem;
-    }
-}
-
-@media(max-width: 960px) {
-    :root {
-        --pad-xs: 0.35rem;
-        --pad-sm: 0.75rem;
-        --pad-md: 1rem;
-        --pad-lg: 1.5rem;
-        --pad-xl: 2rem;
-        --pad-xxl: 3rem;
-    }
-}
-
-@media(max-width: 640px) {
-    :root {
-        --grid-size: 13px;
-        --pad-xs: 0.25rem;
-        --pad-sm: 0.5rem;
-        --pad-md: 0.75rem;
-        --pad-lg: 1rem;
-        --pad-xl: 1.5rem;
-        --pad-xxl: 2rem;
-    }
-}
-
-body {
-    font-family: var(--font-family);
-    font-size: var(--grid-size);
-    text-rendering: optimizeLegibility;
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
-    scrollbar-width: thin;
-    font-kerning: auto;
-    min-width: 280px;
-    overscroll-behavior: none;
-}
-
-body * {
-    box-sizing: border-box;
-    margin: 0;
-    padding: 0;
-}
-
-html:has(.Layout .Theme.dark) {
-    --scrollbar-color: var(--d-scrollbar-color);
-}
-
-html:has(.Layout .Theme.light) {
-    --scrollbar-color: var(--l-scrollbar-color);
-}
-
-html, body, .app {
-    padding: 0;
-    margin: 0;
-    inline-size: 100%;
-    min-block-size: 100%;
-    block-size: 100%;
-    scrollbar-width: thin;
-    scrollbar-color: var(--scrollbar-color);
-    scrollbar-gutter: stable;
-}
-
-html {
-    font-size: 1rem;
-    color-scheme: light dark;
-}
-
-html, body {
-    overscroll-behavior-x: none;
-}
-
-input, textarea, select, button {
-    touch-action: manipulation;
-    font-family: var(--font-family);
-}
-
-*:focus-visible {
-    transition: outline 0.1s;
-    outline: 3px solid var(--focus-color);
-    outline-offset: 0;
-    -webkit-outline-offset: 0;
-    transform: translateZ(0);
-}
-
-.scrollbar {
-    width: 8px;
-    height: 100%;
-    background: transparent;
-    position: absolute;
-    top: 0;
-    right: 0;
-    z-index: 1000;
-}
-
-.scrollbar .grabber {
-    width: calc(100% - 2px);
-    height: 100px;
-    background: var(--text);
-    cursor: grab;
-    border-radius: 9999px;
-    position: absolute;
-    left: 1px;
-}
-
-/**
- * Typography
- */
-
-h1, h2, h3, h4, h5, h6 {
-    font-family: var(--font-family);
-    line-height: 1.5;
-    margin: 0;
-    color: var(--text-heading);
-}
-
-
-/**
- * Use system font on iOS devices
- */
-@supports (font: -apple-system-body) {
-    :root {
-        --font-family: -apple-system-body;
-    }
-}
-
-h1 {
-    font-size: 2em;
-    font-weight: 700;
-    text-wrap: balance;
-}
-
-h2 {
-    font-size: 1.75em;
-    font-weight: 650;
-    text-wrap: balance;
-}
-
-h3 {
-    font-size: 1.5em;
-    font-weight: 650;
-}
-
-h4 {
-    font-size: 1.25em;
-    font-weight: 600;
-}
-
-h5 {
-    font-size: 1em;
-    line-height: 1.5;
-    font-weight: 500;
-}
-
-h6 {
-    font-size: 0.85em;
-    line-height: 1.5;
-    font-weight: 500;
-}
-
-p, th, td, dt, dd, li:not(:has(p)) {
-    font-size: 1em;
-    line-height: 1.5;
-    font-weight: 400;
-    color: var(--text);
-}
-
-small {
-    font-size: 0.85em;
-    line-height: 1.5;
-    font-weight: 400;
-    color: var(--text-subtle);
-    display: block;
-}
-
-dt {
-    color: var(--text-subtle);
-}
-
-strong {
-    color: var(--text-heading);
-    font-weight: 500;
-}
-
-code, pre {
-    font-family: var(--font-family-mono);
-    font-weight: 400;
-}
-
-hr {
-    border: 0;
-    border-top: var(--border);
-    box-sizing: content-box;
-}
-
-/**
- * Links
- */
-
-a {
-    color: var(--text-link);
-    text-decoration: none;
-}
-
-a:hover {
-    color: color-mix(in hsl shorter hue, var(--text-link) var(--mix-amount), var(--mix-target));
-}
-
-/**
- * Forms
- */
-
-form {
-    margin: 0;
-    padding: 0;
-}
-
-fieldset {
-    border: 0;
-    padding: 0;
-    margin: 0;
-    border-radius: var(--border-radius);
-}
-
-fieldset.contained {
-    border: var(--border);
-    padding: 0.5rem;
-}
-
-fieldset legend {
-    color: var(--text-heading);
-    font-weight: 600;
-}
-
-input, textarea, select {
-    font-family: var(--font-family);
-    font-size: var(--font-size, max(0.9em, 9px));
-    line-height: 1.5;
-    font-weight: 400;
-    color: var(--field-text);
-    background-color: var(--field-bg);
-    border: var(--field-border);
-    border-radius: var(--field-radius);
-    padding: 0.5em 0.75em;
-    transition: border-color 0.1s;
-    touch-action: manipulation;
-}
-
-input:user-invalid {
-    border-color: var(--field-border-color-error);
-}
-
-input:user-invalid:focus-visible {
-    outline-color: var(--focus-color-error);
-}
-
-input[type="submit"],
-input[type="button"] {
-    cursor: pointer;
-}
-
-input[type="checkbox"] {
-    border-radius: none;
-}
-
-input[type="checkbox"],
-input[type="radio"] {
-    cursor: pointer;
-    width: 1.35em;
-    height: 1.35em;
-    accent-color: var(--focus-color);
-    transition: accent-color 0.1s, scale 0.1s;
-}
-
-input[type="checkbox"]:hover,
-input[type="radio"]:hover {
-    border: var(--field-border);
-    opacity: 1;
-}
-
-input[type="checkbox"]:active,
-input[type="radio"]:active {
-    accent-color: color-mix(in srgb, var(--focus-color) var(--mix-amount), var(--mix-target));
-}
-
-input[type="checkbox"]:focus-visible,
-input[type="radio"]:focus-visible {
-    border: var(--field-border);
-}
-
-input[type="range"] {
-    padding: 0;
-}
-
-label {
-    color: var(--field-label);
-    font-size: max(0.85em, 12px);
-    line-height: 1.5;
-    font-weight: 500;
-    display: block;
-}
-
-label:has(+input[type="checkbox"]),
-label:has(+input[type="radio"]) {
-    cursor: pointer;
-    font-size: var(--font-size, max(0.9em, 9px));
-    font-weight: 400;
-}
-
-/**
- * Buttons
- */
-
-button {
-    background: none;
-    border: none;
-    padding: 0;
-}
-
-.button,
-::file-selector-button {
-    font-size: var(--font-size, max(0.9em, 9px));
-    touch-action: manipulation;
-    line-height: 1.5;
-    font-weight: 500;
-    background-color: var(--button-bg);
-    color: var(--button-text);
-    padding: var(--padding, 0.5em 1em);
-    border-radius: var(--field-radius);
-    border: var(--button-border);
-    cursor: pointer;
-    display: inline-flex;
-    transition: transform 0.1s, background-color 0.1s, color 0.1s, border-color 0.1s, scale 0.1s;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    gap: 0.5rem;
-}
-
-.button:hover {
-    color: var(--button-text);
-    background-color: color-mix(in srgb, var(--button-bg) var(--mix-amount), var(--mix-target));
-    border-color: color-mix(in srgb, var(--button-border-color) var(--mix-amount), var(--mix-target));
-}
-
-.button:active {
-    scale: 0.95;
-}
-
-.button.sm {
-    --font-size: 0.75em;
-    --padding: 0.35em 0.75em;
-}
-
-.button.lg {
-    --font-size: 1.15em;
-    --padding: 0.65em 1.25em;
-}
-
-.button.xl {
-    --font-size: 1.25em;
-    --padding: 0.75em 1.5em;
-}
-
-.button.outlined {
-    background-color: transparent;
-    color: var(--button-outlined-text);
-    border: var(--button-outlined-border);
-}
-
-.button.outlined:hover {
-    border-color: color-mix(in srgb, var(--button-outlined-border-color) 50%, var(--mix-target));
-}
-
-.button.secondary {
-    background-color: var(--button-secondary-bg);
-    border: var(--button-secondary-border);
-}
-
-.button.secondary:hover {
-    background-color: color-mix(in srgb, var(--button-secondary-bg) var(--mix-amount), var(--mix-target));
-    border-color: color-mix(in srgb, var(--button-secondary-border-color) var(--mix-amount), var(--mix-target));
-}
-
-.button.warn {
-    background-color: var(--button-warn-bg);
-    border: var(--button-warn-border);
-}
-
-.button.warn:hover {
-    background-color: color-mix(in srgb, var(--button-warn-bg) var(--mix-amount), var(--mix-target));
-    border-color: color-mix(in srgb, var(--button-warn-border-color) var(--mix-amount), var(--mix-target));
-}
-
-.button:disabled {
-    background-color: var(--button-disabled-bg);
-    color: var(--button-disabled-text);
-    border: var(--button-disabled-border);
-    cursor: not-allowed;
-}
-
-.button:disabled:hover {
-    background-color: var(--button-disabled-bg);
-    color: var(--button-disabled-text);
-    border: var(--button-disabled-border);
-}
-
-@scope (.PageContent) to (.UIContent) {
-
-    .spacer {
-        display: block;
-        margin-block-end: calc(1.5rem * var(--margin-scale, 1));
-    }
-    .spacer.xs { margin-block-end: calc(0.5rem * var(--margin-scale, 1)); }
-    .spacer.sm { margin-block-end: calc(1rem * var(--margin-scale, 1)); }
-    .spacer.lg { margin-block-end: calc(2rem * var(--margin-scale, 1)); }
-    .spacer.xl { margin-block-end: calc(3rem * var(--margin-scale, 1)); }
-    .spacer.xxl { margin-block-end: calc(4rem * var(--margin-scale, 1)); }
-
-    p { margin-block: calc(0.75rem * var(--margin-scale, 1)); }
-    h1 { margin-block: calc(3rem * var(--margin-scale, 1)) calc(1.5rem * var(--margin-scale, 1)); }
-    h2 { margin-block: calc(3rem * var(--margin-scale, 1)) calc(1.5rem * var(--margin-scale, 1)); }
-    h1+h2 {
-        margin-block-start: 0;
-    }
-    h1:has(+h2) {
-        margin-block-end: calc(0.75rem * var(--margin-scale, 1));
-    }
-    h3 {
-        margin-block: calc(2rem * var(--margin-scale, 1)) calc(1.5rem * var(--margin-scale, 1));
-    }
-    h3:has(+p, +ul, +ol) {
-        margin-block-end: calc(0.75rem * var(--margin-scale, 1));
-    }
-    h4,
-    h5 {
-        margin-block: calc(1.5rem * var(--margin-scale, 1)) calc(0.5rem * var(--margin-scale, 1));
-    }
-    p {
-        hyphens: auto;
-    }
-
-    ul, ol {
-        margin-block: calc(1.5rem * var(--margin-scale, 1));
-    }
-    ul {
-        list-style-type: "–  ";
-        list-style-position: outside;
-    }
-    li {
-        margin-block: calc(0.5em * var(--margin-scale, 1));
-    }
-    @media(max-width: 960px) {
-        ul, ol {
-            list-style-position: inside;
-        }
-        ul {
-            margin-inline-start: 0;
-        }
-        ul li:before {
-            margin-inline-start: calc(0.5rem * var(--margin-scale, 1));
-        }
-    }
-    li p {
-        margin-block: calc(0.5rem * var(--margin-scale, 1));
-    }
-    li:not(:last-child) p:last-child {
-        margin-block-end: calc(0.85em * var(--margin-scale, 1));
-    }
-    ul:has(+p), ol:has(+p) {
-        margin-block-end: calc(1em * var(--margin-scale, 1));
-    }
-
-    p+ul, p+ol {
-        margin-block-start: calc(1em * var(--margin-scale, 1));
-    }
-
-    h3+p,
-    h3+ul,
-    h3+ol {
-        margin-block-start: calc(1em * var(--margin-scale, 1));
-    }
-
-    h4+p,
-    h4+ul,
-    h4+ol {
-        margin-block-start: calc(0.75em * var(--margin-scale, 1));
-    }
-
-    h5+p,
-    h5+ul,
-    h5+ol {
-        margin-block-start: calc(0.5em * var(--margin-scale, 1));
-    }
-
-    /** Links */
-    a:hover:not(.button),
-    a:focus-visible:not(.button) {
-        text-decoration: underline;
-    }
-
-    /** Dividers */
-    hr {
-        margin-block: calc(2em * var(--margin-scale, 1));
-        border-top: var(--border-subtle);
-    }
-
-    /** Code */
-    p > code,
-    li > code {
-        padding: 0.15em 0.35em;
-        background-color: var(--bg-subtle);
-        border-radius: var(--border-radius);
-        border: var(--border-subtle);
-        color: var(--text);
-        font-weight: 450;
-    }
-    pre {
-        color: var(--text);
-        font-size: 1em;
-        line-height: 1.35;
-        background-color: var(--bg-subtle);
-        border-radius: var(--border-radius);
-        border: var(--border-subtle);
-        overflow-x: auto;
-        inline-size: calc(100% + 2rem);
-        box-sizing: border-box;
-        display: grid;
-        margin-block: 1.5rem;
-        margin-inline: -1rem;
-        overflow-wrap: break-word;
-        word-break: break-word;
-    }
-    pre code {
-        box-sizing: border-box;
-        display: block;
-        padding: 1rem;
-        font-weight: 450;
-        color: var(--text);
-        box-sizing: border-box;
-        overflow-x: auto;
-        width: 100%;
-    }
-    :first-child {
-        margin-block-start: 0;
-    }
-    :last-child {
-        margin-block-end: 0;
-    }
-
-    /** Tables */
-    .table-container {
-        width: 100cqw;
-        display: block;
-        overflow-x: auto;
-        scrollbar-width: thin;
-    }
-    .table-container.hang {
-        margin-inline: calc(var(--inset-inline, 1rem) * -1);
-        inline-size: calc(100% + 2rem);
-    }
-    .table-container.contained {
-        border: var(--border);
-    }
-    .table-container.rounded {
-        border-radius: var(--border-radius);
-    }
-    table {
-        margin-block: calc(1.5em * var(--margin-scale, 1));
-        border-collapse: collapse;
-        font-size: var(--font-size, 1em);
-    }
-    table.fullWidth {
-        inline-size: 100%;
-    }
-    table.contained {
-        border: var(--border);
-    }
-    table.hang {
-        margin-inline: calc(var(--inset-inline, 1rem) * -1);
-        inline-size: calc(100% + 2rem);
-    }
-    table.sm {
-        --font-size: 0.85em;
-        --padding: 0.5rem;
-    }
-    table.rounded {
-        border-radius: var(--border-radius);
-        border-style: hidden;
-    }
-    tr {
-        border-block-end: var(--border-subtle);
-    }
-    th,
-    td {
-        height: 3rem;
-        font-size: max(0.9em, 9px);
-        line-height: 1.5;
-        padding: var(--padding, 0.5em 0.75em);
-        white-space: nowrap;
-        text-align: start;
-    }
-    td.end {
-        text-align: end;
-    }
-    table tr > :not([style*="display: none"]):first-child {
-        padding-inline-start: 1rem;
-    }
-    table tr > :not([style*="display: none"]):last-child {
-        padding-inline-end: 1rem;
-    }
-    th:last-child,
-    td:last-child {
-        border-inline-end: none;
-    }
-    th {
-        font-weight: 700;
-    }
-    table.colored tbody tr:nth-child(2n) {
-        background-color: var(--bg-subtle);
-    }
-    table.colored thead tr {
-        background-color: var(--bg-subtle);
-    }
-    table tbody tr:last-of-type {
-        border-block-end: none;
-    }
-    table.hoverable tbody tr:hover {
-        background-color: var(--bg-hover);
-    }
-
-    .table-container.hang table {
-        inline-size: 100%;
-        margin-inline: 0;
-    }
-    .table-container.contained table {
-        border: none;
-    }
-
-    /** Forms */
-    fieldset label,
-    fieldset input {
-        margin-block-end: calc(0.5rem * var(--margin-scale, 1));
-    }
-
-    /** Blockquote */
-    blockquote {
-        margin-block: calc(1.5rem * var(--margin-scale, 1));
-        padding: 1.5rem 1.5rem;
-        inline-size: calc(100% + 2rem);
-        margin-inline: -1rem;
-        border-inline-start: 4px solid var(--border-subtle-color);
-        background-color: var(--bg-subtle);
-    }
-
-    @container(max-width: 960px) {
-        table td.hide-md,
-        table th.hide-md {
-            display: none;
-        }
-    }
-    @container(max-width: 640px) {
-        table td.hide-sm,
-        table th.hide-sm {
-            display: none;
-        }
-    }
-}
-
-@media(prefers-reduced-motion: reduce) {
-    * {
-        transition-duration: 0s !important;
-    }
-
-    button:active,
-    .button:active {
-        scale: initial;
-    }
-}