@splendidlabz/styles 4.0.1 → 4.1.0

package/dist/styles.css

@@ -1,1383 +0,0 @@
-@layer reset {
-  html, *, ::before, ::after {
-    box-sizing: border-box;
-  }
-
-  html, body {
-    height: 100%;
-  }
-
-  body {
-    min-height: 100vh;
-    min-height: 100svh;
-  }
-
-  * {
-    margin: 0;
-    padding: 0;
-    border-width: 0;
-    border-style: solid;
-  }
-
-  p, h1, h2, h3, h4, h5, h6 {
-    overflow-wrap: break-word;
-  }
-
-  ul {
-    list-style: none;
-  }
-
-  img, video, object, embed, svg {
-    display: block;
-    max-width: 100%;
-    height: auto;
-  }
-
-  picture {
-    display: flex;
-    justify-content: center;
-  }
-
-  iframe, canvas {
-    display: block;
-    max-width: 100%;
-  }
-
-  svg {
-    pointer-events: none;
-    flex-shrink: 0;
-    box-sizing: content-box;
-    width: var(--svg-width, auto);
-    height: var(--svg-height, 1em);
-  }
-
-  hr {
-    height: 1px;
-    background-color: var(--border-color, black);
-  }
-
-  [hidden] {
-    display: none;
-    opacity: 0;
-    visibility: hidden;
-  }
-
-  noscript {
-    display: block;
-    margin-top: 1em;
-    margin-bottom: 1em;
-  }
-}
-
-@theme {
-    --bg-color: white; --text-color: black; --leading: 1.5;   --border-width: 1px; --border-style: solid; --border-color: black; --radius: .5rem;   --outline-width: 3px; --outline-style: solid; --outline-color: oklch(61.52% .178 257.59deg); --outline-offset: 0px;   --transition-duration: .2s; --transition-delay: 0s; --transition-easing: ease-in-out;   --input-font: inherit;   --header-row-border-top: 1px solid transparent; --header-row-border-bottom: 1px solid var(--border-color) ; --alt-row-color: transparent;
-}
-
-@theme {
-    --breakpoint-bp1: 100px; --breakpoint-bp1.5: 150px; --breakpoint-bp2: 200px; --breakpoint-bp2.5: 250px; --breakpoint-bp3: 300px; --breakpoint-bp3.5: 350px; --breakpoint-bp4: 400px; --breakpoint-bp4.5: 450px; --breakpoint-bp5: 500px; --breakpoint-bp5.5: 550px; --breakpoint-bp6: 600px; --breakpoint-bp6.5: 650px; --breakpoint-bp7: 700px; --breakpoint-bp7.5: 750px; --breakpoint-bp8: 800px; --breakpoint-bp8.5: 850px; --breakpoint-bp9: 900px; --breakpoint-bp9.5: 950px; --breakpoint-bp10: 1000px; --breakpoint-bp10.5: 1050px; --breakpoint-bp11: 1100px; --breakpoint-bp11.5: 1150px; --breakpoint-bp12: 1200px; --breakpoint-bp12.5: 1250px; --breakpoint-bp13: 1300px; --breakpoint-bp13.5: 1350px; --breakpoint-bp14: 1400px; --breakpoint-bp14.5: 1450px; --breakpoint-bp15: 1500px; --breakpoint-bp15.5: 1550px; --breakpoint-bp16: 1600px; --breakpoint-bp16.5: 1650px; --breakpoint-bp17: 1700px; --breakpoint-bp17.5: 1750px; --breakpoint-bp18: 1800px; --breakpoint-bp18.5: 1850px; --breakpoint-bp19: 1900px; --breakpoint-bp19.5: 1950px; --breakpoint-bp20: 2000px; --breakpoint-bp20.5: 2050px; --breakpoint-bp21: 2100px; --breakpoint-bp21.5: 2150px; --breakpoint-bp22: 2200px; --breakpoint-bp22.5: 2250px; --breakpoint-bp23: 2300px; --breakpoint-bp23.5: 2350px; --breakpoint-bp24: 2400px; --breakpoint-bp24.5: 2450px; --breakpoint-bp25: 2500px;   --container-bp1: 100px; --container-bp1.5: 150px; --container-bp2: 200px; --container-bp2.5: 250px; --container-bp3: 300px; --container-bp3.5: 350px; --container-bp4: 400px; --container-bp4.5: 450px; --container-bp5: 500px; --container-bp5.5: 550px; --container-bp6: 600px; --container-bp6.5: 650px; --container-bp7: 700px; --container-bp7.5: 750px; --container-bp8: 800px; --container-bp8.5: 850px; --container-bp9: 900px; --container-bp9.5: 950px; --container-bp10: 1000px; --container-bp10.5: 1050px; --container-bp11: 1100px; --container-bp11.5: 1150px; --container-bp12: 1200px; --container-bp12.5: 1250px; --container-bp13: 1300px; --container-bp13.5: 1350px; --container-bp14: 1400px; --container-bp14.5: 1450px; --container-bp15: 1500px; --container-bp15.5: 1550px; --container-bp16: 1600px; --container-bp16.5: 1650px; --container-bp17: 1700px; --container-bp17.5: 1750px; --container-bp18: 1800px; --container-bp18.5: 1850px; --container-bp19: 1900px; --container-bp19.5: 1950px; --container-bp20: 2000px; --container-bp20.5: 2050px; --container-bp21: 2100px; --container-bp21.5: 2150px; --container-bp22: 2200px; --container-bp22.5: 2250px; --container-bp23: 2300px; --container-bp23.5: 2350px; --container-bp24: 2400px; --container-bp24.5: 2450px; --container-bp25: 2500px;
-}
-
-@theme {
-  --text-1: .625rem;   --text-2: .6875rem;   --text-3: .75rem;   --text-4: .8125rem;   --text-5: .875rem;   --text-6: .9375rem;   --text-7: 1rem;   --text-8: 1.125rem;   --text-9: 1.3125rem;   --text-10: 1.5rem;   --text-11: 1.75rem;   --text-12: 2rem;   --text-13: 2.25rem;   --text-14: 2.625rem;   --text-15: 3rem;   --text-16: 3.375rem;   --text-17: 3.75rem;   --text-18: 4.5rem;   --text-19: 5.25rem;   --text-20: 6rem;   --text-21: 6.75rem;   --text-22: 7.5rem;   --text-1e: .625em;   --text-2e: .6875em;   --text-3e: .75em;   --text-4e: .8125em;   --text-5e: .875em;   --text-6e: .9375em;   --text-7e: 1em;   --text-8e: 1.125em;   --text-9e: 1.3125em;   --text-10e: 1.5em;   --text-11e: 1.75em;   --text-12e: 2em;   --text-13e: 2.25em;   --text-14e: 2.625em;   --text-15e: 3em;   --text-16e: 3.375em;   --text-17e: 3.75em;   --text-18e: 4.5em;   --text-19e: 5.25em;   --text-20e: 6em;   --text-21e: 6.75em;   --text-22e: 7.5em;  
-}
-
-@theme {
-  --font-weight-100: 100; --font-weight-125: 125; --font-weight-150: 150; --font-weight-175: 175; --font-weight-200: 200; --font-weight-225: 225; --font-weight-250: 250; --font-weight-275: 275; --font-weight-300: 300; --font-weight-325: 325; --font-weight-350: 350; --font-weight-375: 375; --font-weight-400: 400; --font-weight-425: 425; --font-weight-450: 450; --font-weight-475: 475; --font-weight-500: 500; --font-weight-525: 525; --font-weight-550: 550; --font-weight-575: 575; --font-weight-600: 600; --font-weight-625: 625; --font-weight-650: 650; --font-weight-675: 675; --font-weight-700: 700; --font-weight-725: 725; --font-weight-750: 750; --font-weight-775: 775; --font-weight-800: 800; --font-weight-825: 825; --font-weight-850: 850; --font-weight-875: 875; --font-weight-900: 900;
-}
-
-@theme {
-  --radius-0.5: .125rem; --radius-1: .25rem; --radius-1.5: .375rem; --radius-2: .5rem; --radius-2.5: .625rem; --radius-3: .75rem; --radius-3.5: .875rem; --radius-4: 1rem; --radius-4.5: 1.125rem; --radius-5: 1.25rem; --radius-5.5: 1.375rem; --radius-6: 1.5rem; --radius-6.5: 1.625rem; --radius-7: 1.75rem; --radius-7.5: 1.875rem; --radius-8: 2rem; --radius-8.5: 2.125rem; --radius-9: 2.25rem; --radius-9.5: 2.375rem; --radius-10: 2.5rem; --radius-10.5: 2.625rem; --radius-11: 2.75rem; --radius-11.5: 2.875rem; --radius-12: 3rem; --radius-12.5: 3.125rem; --radius-13: 3.25rem; --radius-13.5: 3.375rem; --radius-14: 3.5rem; --radius-14.5: 3.625rem; --radius-15: 3.75rem; --radius-15.5: 3.875rem; --radius-16: 4rem; --radius-16.5: 4.125rem; --radius-17: 4.25rem; --radius-17.5: 4.375rem; --radius-18: 4.5rem; --radius-18.5: 4.625rem; --radius-19: 4.75rem; --radius-19.5: 4.875rem; --radius-20: 5rem; --radius-0.5r: calc(var(--radius) * .5) ; --radius-1r: var(--radius) ; --radius-1.5r: calc(var(--radius) * 1.5) ; --radius-2r: calc(var(--radius) * 2) ; --radius-2.5r: calc(var(--radius) * 2.5) ; --radius-3r: calc(var(--radius) * 3) ; --radius-3.5r: calc(var(--radius) * 3.5) ; --radius-4r: calc(var(--radius) * 4) ; --radius-4.5r: calc(var(--radius) * 4.5) ; --radius-5r: calc(var(--radius) * 5) ;
-}
-
-@utility pigment-scaffold {
-  & { border-color: var(--border-color) ; color: var(--text-color, currentcolor) ; background-color: var(--bg-color) ; transition: var(--transition-values) ; transition-property: var(--transition-props) ; :where(svg path) { fill: var(--fill-color, var(--text-color)) ; stroke: var(--stroke-color, var(--text-color)) ;   transition: var(--transition-values) ; transition-property: var(--transition-props) ; } }
-}
-
-@utility pigment-hover-scaffold {
-  border-color: var(--border-hover-color, var(--border-color)) ; color: var(--text-hover-color, var(--text-color)) ; background-color: var(--bg-hover-color, var(--bg-color)) ; :where(svg path) { fill: var(--fill-hover-color, var(--text-hover-color, var(--fill-color, var(--text-color)))) ; stroke: var(--stroke-hover-color, var(--text-hover-color, var(--stroke-color, var(--text-color)))) ; }
-}
-
-@utility pigment-focus-scaffold {
-  & :focus { border-color: var(--border-focus-color, var(--border-hover-color, var(--border-color))) ; color: var(--text-focus-color, var(--text-hover-color, var(--text-color))) ; background-color: var(--bg-focus-color, var(--bg-hover-color, var(--bg-color))) ; :where(svg path) { fill: var(--fill-focus-color, var(--text-focus-color, var(--fill-hover-color, var(--text-hover-color, var(--fill-color, var(--text-color)))))) ; stroke: var(--stroke-focus-color, var(--text-focus-color, var(--stroke-hover-color, var(--text-hover-color, var(--stroke-color, var(--text-color)))))) ; } }
-}
-
-@utility pigment-active-scaffold {
-  & :active { border-color: var(--border-active-color, var(--border-hover-color, var(--border-color))) ; color: var(--text-active-color, var(--text-hover-color, var(--text-color))) ; background-color: var(--bg-active-color, var(--bg-hover-color, var(--bg-color))) ; :where(svg path) { fill: var(--fill-active-color, var(--text-active-color, var(--fill-hover-color, var(--text-hover-color, var(--fill-color, var(--text-color)))))) ; stroke: var(--stroke-active-color, var(--text-active-color, var(--stroke-hover-color, var(--text-hover-color, var(--stroke-color, var(--text-color)))))) ; } }
-}
-
-@utility pigment-selected-scaffold {
-  & . selected, & . checked, & [aria-current], & [aria-selected], & [aria-expanded= "true"] { border-color: var(--border-selected-color, var(--border-hover-color, var(--border-color))) ; color: var(--text-selected-color, var(--text-hover-color, var(--text-color))) ; background-color: var(--bg-selected-color, var(--bg-hover-color, var(--bg-color))) ; :where(svg path) { fill: var(--fill-selected-color, var(--text-selected-color, var(--fill-hover-color, var(--text-hover-color, var(--fill-color, var(--text-color)))))) ; stroke: var(--stroke-selected-color, var(--text-selected-color, var(--stroke-hover-color, var(--text-hover-color, var(--stroke-color, var(--text-color)))))) ; } }
-}
-
-@utility pigment {
-  @apply pigment-scaffold;& :hover { @apply pigment-hover-scaffold; }
-
- @apply pigment-focus-scaffold; @apply pigment-active-scaffold; @apply pigment-selected-scaffold;
-}
-
-@utility pigment-outline {
-  --bg-color: transparent;
-}
-
-@utility pigment-ghost {
-  --bg-color: transparent; --border-color: transparent;
-}
-
-@layer base {
-  * {
-    outline: var(--outline-width) var(--outline-style) transparent;
-    outline-offset: var(--outline-offset);
-  }
-
-  @media (prefers-reduced-motion: reduce) {
-    * {
-      scroll-behavior: auto !important;
-      transition-duration: .01ms !important;
-      animation-duration: .01ms !important;
-      animation-iteration-count: 1 !important;
-    }
-  }
-
-  .sr-only {
-    overflow: hidden;
-    position: absolute;
-    width: 1px;
-    height: auto;
-    margin: 0;
-    padding: 0;
-    border: 0;
-    clip: rect(0 0 0 0);
-    white-space: nowrap;
-  }
-
-  * {
-    --transition-values: var(--transition-duration) var(--transition-delay) var(--transition-easing);
-    --transition-props: background, color, border, outline, opacity, gap, fill, opacity, stroke, transform;
-  }
-
-  html {
-    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans", Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
-    line-height: var(--leading, 1.5);
-    font-variant-ligatures: common-ligatures;
-  }
-
-  body {
-    color: var(--text-color);
-    background-color: var(--bg-color);
-    text-rendering: optimizelegibility;
-  }
-
-  h1, h2, h3, h4, h5, h6 {
-    font-variant-numeric: oldstyle-nums proportional-nums;
-  }
-
-  pre {
-    padding: 1em;
-    border-radius: var(--radius);
-  }
-
-  code {
-    font-size: .8em;
-  }
-
-  :not(pre) > :is(code) {
-    display: inline;
-    padding: .2em .25em;
-    border-radius: var(--radius);
-  }
-
-  pre > :is(code) {
-    background-color: rgb(0 0 0 / 0%);
-  }
-
-  fieldset {
-    border: none;
-  }
-
-  textarea, select, .field {
-    display: block;
-    width: 100%;
-    border-radius: inherit;
-    font: inherit;
-    font-family: var(--input-font);
-    color: var(--text-color, currentcolor);
-    background-color: var(--bg-color);
-  }
-
-  input:where([type="text"], [type="search"], [type="email"], [type="password"], [type="tel"], [type="url"]) {
-    display: block;
-    width: 100%;
-    border-radius: inherit;
-    font: inherit;
-    font-family: var(--input-font);
-    color: var(--text-color, currentcolor);
-    background-color: var(--bg-color);
-  }
-
-  input[type="password"] {
-    font-family: Verdana, sans-serif;
-    letter-spacing: .125em;
-  }
-
-  .disabled, .readonly, [disabled], [readonly] {
-    opacity: .5;
-  }
-
-  :is(.disabled, .readonly, [disabled], [readonly]):where(input) {
-    cursor: not-allowed;
-  }
-
-  :is(.disabled, .readonly, [disabled], [readonly]):focus {
-    outline-color: rgb(0 0 0 / 0%);
-  }
-
-  :is(.disabled, .readonly, [disabled], [readonly]):focus-visible {
-    outline-color: rgb(0 0 0 / 0%);
-  }
-}
-
-@utility outline-visible {
-  outline-color: var(--outline-color) ;
-}
-
-@utility preserve-outlines {
-  & { box-sizing: content-box; margin: calc(var(--outline-width) * -1) ; padding: calc(var(--outline-width)) ; }
-}
-
-@layer utilities {
-  @apply pigment;
-
-  a:visited {
-    border-color: var(--border-visited-color, var(--border-color));
-    color: var(--text-visited-color, var(--text-color));
-    background-color: var(--bg-visited-color, var(--bg-color));
-  }
-
-  @apply outline-visible;
-  @apply outline-visible;
-}
-
-@utility button {
-  & { flex-shrink: 0;   display: inline-flex; justify-content: center; align-items: center; gap: .5em; padding: .25em 1em; border-width: var(--border-width, 1px) ; border-color: var(--border-color) ; border-radius: var(--radius) ; font: var(--input-font, inherit) ; color: var(--text-color, currentColor) ; background-color: var(--bg-color, #eee) ; text-decoration: none! important; transition: var(--transition-values) ; transition-property: var(--transition-props) ; cursor: pointer; * { pointer-events: none; } svg path { transition: var(--transition-values) ; transition-property: var(--transition-props) ; } }
-}
-
-@utility button-icon {
-  & { padding: var(--padding, .5em) ; line-height: 1; }
-}
-
-@layer components {
-  .backdrop--blur {
-    backdrop-filter: blur(var(--blur, 8px));
-    transition-property: -webkit-backdrop-filter, backdrop-filter;
-  }
-
-  .backdrop:where([data-state="blur"]) {
-    backdrop-filter: blur(var(--blur, 8px));
-    transition-property: -webkit-backdrop-filter, backdrop-filter;
-  }
-}
-
-@utility break-word {
-  hyphens: auto; overflow-wrap: break-word; word-break: break-word; word-wrap: break-word;
-}
-
-@utility card {
-  & { padding: var(--padding, 1rem) ; border: var(--border-width) var(--border-style) var(--border-color) ; border-radius: var(--radius) ; }
-}
-
-@utility card-split {
-  & { @apply card;> * , :where(astro-slot, astro-island, astro-content) > * { margin: var(--nudge, 0) ; padding: var(--padding, 1rem) ; } & . card-split {   overflow: hidden; gap: 0; padding: 0;> * , :where(astro-slot, astro-island, astro-content) > * { border-radius: calc(var(--radius) - var(--nudge)) ; } } & :where(. divider-between-x, . divider-between-horizontal) > :where(. card-split) { border-width: 0; border-top-width: var(--border-width) ; } & :where(. divider-between-y, . divider-between-vertical) > :where(. card-split) { border-width: 0; border-left-width: var(--border-width) ; } }
-}
-
-@utility box {
-  @apply card;
-}
-
-@utility has-focus-within {
-  & :focus-within { outline: var(--outline-width) var(--outline-style) transparent; outline-offset: var(--outline-offset) ; } * :focus, * :focus-visible { outline-color: transparent; }
-}
-
-@utility hero-heading {
-  display: flex; flex-direction: column; gap: var(--gap, .25em) ; max-width: 100%;> :where(. hero-eyebrow) { font-size: var(--eyebrow-size, .6em) ; } > * , > * :where(. contents) > * , > * :where(astro-island, astro-slot) > * { max-width: 100%; }
-}
-
-@utility hero-heading-start {
-  & { @apply hero-heading; text-align: start; }
-}
-
-@utility hero-heading-center {
-  & { @apply hero-heading; align-self: center; margin-inline: auto; text-align: center; }
-}
-
-@utility hero-heading-end {
-  & { @apply hero-heading; align-self: end; margin-inline-start: auto; text-align: end; }
-}
-
-@utility indent-list-scaffold {
-  --indent-list-depth: 0; li li { margin-inline-start: var(--indent, 1em) ; } li { --depth: 1; a { --depth: 1; } li, li a { --depth: 2; } li li, li li a { --depth: 3; } li li li, li li li a { --depth: 4; } li li li li, li li li li a { --depth: 5; } } :where(ul, ol, li) { padding-inline-start: 0; } a { display: block; padding-block: .125em; }
-}
-
-@utility indent-list {
-  @apply indent-list-scaffold; li { list-style-type: disc; }
-}
-
-@utility indent-list-guides {
-  & { @apply indent-list-scaffold; li li { position: relative; margin-inline-start: 0; padding-inline-start: var(--indent, 1em) ; a { position: relative; margin-left: calc(var(--indent, 1em) * -1) ; padding-left: var(--indent, 1em) ; } & ::before, a::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 1px; background-color: var(--border-color) ; } a:hover::before { background-color: var(--border-hover-color) ; } } }
-}
-
-@utility prose {
-  & { display: flex; flex-flow: column; gap: 1em; max-width: 100%;  *  + :where(h2, h3), *  + :where(astro-island, astro-slot) > :where(:where(h2, h3) :first-child) { margin-top: 2em; scroll-margin-top: 2em; } *  + :where(h4, h5, h6), *  + :where(astro-island, astro-slot) > :where(:where(h4, h5, h6) :first-child) { margin-top: 1em; scroll-margin-top: 2em; } :where(ul, ol) { list-style-type: revert-layer; } > :where(ul, ol), > :where(astro-island, astro-slot) > :where(ul, ol) { list-style-position: outside; margin-left: 2em; :where(ul, ol) { padding-left: 2em; } li { font-variant-numeric: lining-nums; } li + li { margin-top: .25em; } li:has(li)  + li { margin-top: .5em; } li> :where(ul, ol) { margin-top: .25em; } } :where(a) { text-decoration: underline; } > img, figure img { border: 1px solid oklch(90% 0 0deg); border-radius: var(--radius) ; } }
-}
-
-@utility square {
-  width: var(--size) ; height: var(--size) ;
-}
-
-@utility circle {
-  width: var(--size) ; height: var(--size) ; border-radius: 50%;
-}
-
-@utility roundrect {
-  border-radius: var(--radius, 8px) ;
-}
-
-@utility pill {
-  border-radius: 100em;
-}
-
-@utility simple-svg {
-  :where(path) { fill: var(--fill-color) ; stroke: var(--stroke-color) ;   stroke-width: var(--stroke-width) ; }
-}
-
-@utility table-scaffold {
-  & { width: 100%;   font-variant-numeric: lining-nums tabular-nums slashed-zero diagonal-fractions; }
-}
-
-@utility table-auto {
-  :where(table) & { table-layout: auto; } :where(. table-grid) & { @apply grid-repeat-auto; }
-}
-
-@utility table-fixed {
-  :where(table) & { table-layout: fixed; } :where(. table-grid) & { @apply grid-simple; }
-}
-
-@utility table-header-row {
-  & { border-top: var(--header-row-border-top) ; border-bottom: var(--header-row-border-bottom) ; font-weight: bold; }
-}
-
-@utility table-header-column {
-  font-weight: bold;
-}
-
-@utility table-cell {
-  text-align: left; padding: var(--padding, var(--padding-x, .375rem)) var(--padding, var(--padding-y, .5rem)) ;
-}
-
-table {
-  border-collapse: collapse;
-}
-
-@apply table-scaffold;
-
-table:has(thead) tr:nth-child(2n+2) {
-  background-color: var(--alt-row-color);
-}
-
-table:not(:has(thead)) tr tr:nth-child(2n+3) {
-  background-color: var(--alt-row-color);
-}
-
-@apply table-header-row;
-@apply table-header-column;
-@apply table-cell;
-
-.table-grid:where(table, [role="table"], [role="grid"]) {
-  max-width: 100%;
-}
-
-@apply table-scaffold;
-@apply table-auto;
-
-.table-grid :where(thead, tbody, tfoot, [role="rowgroup"]) {
-  display: contents;
-}
-
-.table-grid :where(tr, [role="row"]) {
-  grid-column: 1 / -1;
-  display: grid;
-  grid-template-columns: subgrid;
-  grid-template-rows: subgrid;
-}
-
-.table-grid :where(tr, [role="row"]):nth-child(2n+3) {
-  background-color: var(--alt-row-color);
-}
-
-@apply table-header-row;
-@apply table-header-column;
-
-.table-grid :where([role="columnheader"], [role="rowheader"], [role="cell"], [role="gridcell"], th, td) {
-  display: grid;
-  align-items: center;
-}
-
-@apply table-cell;
-
-@utility writing-scaffold {
-    transition: none;
-}
-
-@utility writing-normal {
-  @apply writing-scaffold;
-
- writing-mode: horizontal-tb;
-}
-
-@utility writing-rotated-left {
-  & { @apply writing-scaffold; writing-mode: vertical-rl; text-orientation: sideways; transform: rotate(180deg) ;   }
-}
-
-@utility writing-rotated-right {
-  & { @apply writing-scaffold; writing-mode: vertical-rl; text-orientation: sideways; }
-}
-
-@utility writing-downwards {
-  & { @apply writing-scaffold; writing-mode: vertical-lr; text-orientation: upright; }
-}
-
-@utility writing-downards-lr {
-  & { @apply writing-downwards; }
-}
-
-@utility writing-downwards-rl {
-  & { @apply writing-scaffold; writing-mode: vertical-rl; text-orientation: upright; }
-}
-
-@theme {
-  --gap: 1rem;
-}
-
-@utility micro {
-  > * , > :where(. contents) > * , > * :where(astro-island, astro-slot) > * { flex-grow: var(--grow, 0) ; }
-}
-
-@utility horizontal {
-  display: flex; flex-direction: row; gap: var(--gap-y, var(--gap)) var(--gap-x, var(--gap));> . spacer { margin-inline-start: auto; }
-
- @apply micro;
-}
-
-@utility vertical {
-  display: flex; flex-direction: column; gap: var(--gap-y, var(--gap)) var(--gap-x, var(--gap)); width: 100%; max-width: 100%;> . spacer { margin-block-start: auto; }
-
- @apply micro;
-}
-
-@utility single-col {
-  @apply vertical;
-
- align-items: stretch;
-}
-
-@utility flow {
-  display: flex; flex-flow: row wrap; gap: var(--gap-y, var(--gap)) var(--gap-x, var(--gap));
-
- @apply micro;
-}
-
-@utility stack {
-  & { position: relative; display: grid; grid-template-columns: minmax(min(0, 100%), 1fr) ; padding: 0;& ::before, & ::after, > * , > * :where(astro-island, astro-slot) > * { position: relative; z-index: 1; grid-column: 1 / span 1; grid-row: 1 / span 1; } > . background { overflow: hidden; position: absolute; inset: 0; } > . foreground { position: relative; z-index: 10; } }
-}
-
-@utility divider-scaffold {
-  & { align-self: stretch; display: flex; align-items: center; padding: 0! important; border-radius: 0! important;& :where(:not(:empty)) { gap: var(--gap, 1rem) ; } & ::before, & ::after { content: ""; background-color: var(--border-color, currentColor) ; } }
-}
-
-@utility divider-x {
-  & { @apply divider-scaffold; flex-grow: 1;& ::before, & ::after { flex-grow: 1; height: var(--border-width, 1px) ; } }
-}
-
-@utility divider-y {
-  & { @apply divider-scaffold; align-self: stretch; display: flex; flex-direction: column; :where(. vertical, . single-col, . wrap) > & { flex-grow: 1; } & ::before, & ::after { flex-grow: 1; width: var(--border-width, 1px) ; } }
-}
-
-@utility divider-horizontal {
-  @apply divider-x;
-}
-
-@utility divider-vertical {
-  @apply divider-y;
-}
-
-@utility divider-between-x {
-  & { @apply divider-scaffold;> *  + * , > *  + * :where(astro-island, astro-slot) > * { border-top-width: var(--border-width, 1px) ; border-color: var(--border-color) ; } }
-}
-
-@utility divider-between-y {
-  & { @apply divider-scaffold;> *  + * , > *  + * :where(astro-island, astro-slot) > * { border-left-width: var(--border-width, 1px) ; border-color: var(--border-color) ; } }
-}
-
-@utility divider-between-horizontal {
-  @apply divider-between-x;
-}
-
-@utility divider-between-vertical {
-  @apply divider-between-y;
-}
-
-@utility breakout- *  {
-  margin-inline: --value(--spacing- * ) ;
-}
-
-@utility breakout-x- *  {
-  margin-inline: --value(--spacing- * ) ;
-}
-
-@utility breakout-l- *  {
-  margin-inline-start: --value(--spacing- * ) ;
-}
-
-@utility breakout-r- *  {
-  margin-inline-end: --value(--spacing- * ) ;
-}
-
-@utility breakout-y- *  {
-  margin-block: --value(--spacing- * ) ;
-}
-
-@utility breakout-t- *  {
-  margin-block-start: --value(--spacing- * ) ;
-}
-
-@utility breakout-b- *  {
-  margin-block-end: --value(--spacing- * ) ;
-}
-
-@utility new-stacking-context {
-  transform: translateZ(0) ;
-}
-
-@theme {
-  --snap-align: start; --snap-type: proximity; --scroll-margin: 1rem;
-}
-
-@utility scrollable {
-  & { display: flex; gap: var(--gap, 1rem) ;> :where( * ) { flex-grow: 0; flex-shrink: 0; scroll-snap-align: var(--snap-align) ; scroll-margin: var(--scroll-margin) ; } }
-}
-
-@utility scrollable-x {
-  & { @apply scrollable; overflow: auto hidden; flex-direction: row; max-width: 100%; scroll-snap-type: x var(--snap-type) ; }
-}
-
-@utility scrollable-y {
-  & { @apply scrollable; overflow: hidden auto; flex-direction: column; scroll-snap-type: y var(--snap-type) ; }
-}
-
-@utility scrollable-preserve-outlines {
-  & { box-sizing: content-box; margin: calc(var(--outline-width) * -1) ; padding: calc(var(--outline-width)) ; }
-}
-
-@utility snap-type- *  {
-  --snap-type: --value(--snap-type- * ) ;
-}
-
-@utility scrollable-nosnap {
-  --snap-type: none;
-}
-
-@utility scrollable-horizontal {
-  @apply scrollable-x;
-}
-
-@utility scrollable-vertical {
-  @apply scrollable-y;
-}
-
-@utility shell-simple {
-  & { display: flex; flex-direction: column; height: inherit;> . content { flex-grow: 1; } > . footer { flex-shrink: 0; } }
-}
-
-@utility shell-grid {
-  & { display: grid; grid-template-columns: minmax(0, var(--lsb-width, auto)) minmax(0, 1fr) ; gap: var(--gap, 0) ; height: 100dvh; } & :has(> header) { grid-template-rows: auto 1fr; } & :has(> . rightsidebar) { grid-template-columns: minmax(0, var(--lsb-width, auto)) minmax(0, var(--content-width, 1fr)) minmax(0, var(--rsb-width, auto)) ; } & > . is(header, . Full) { grid-column: 1 / -1; } > . leftsidebar, > . rightsidebar, > . content { overflow: auto; grid-column-end: span var(--span, 1) ; height: auto; }
-}
-
-@theme {
-  --cols: 1;
-}
-
-@utility grid-scaffold {
-  & { display: grid; gap: var(--gap, 1rem) ; width: 100%; max-width: 100%; margin-inline: auto;> * , > * :where(. contents) > * , > * :where(astro-island, astro-slot) > * {     grid-column: var(--start, auto) / span var(--span, 1) ; grid-row: var(--rowstart, auto) / span var(--rowspan, 1) ; max-width: 100%; } }
-}
-
-@utility grid-simple {
-  @apply grid-scaffold;
-
- grid-template-columns: repeat(var(--cols), minmax(0, 1fr)) ;
-}
-
-@utility grid-repeat-auto {
-  @apply grid-scaffold;
-
- grid-template-columns: repeat(var(--cols, 1), minmax(0, auto)) ;
-}
-
-@utility grid-fr-auto {
-  @apply grid-scaffold;
-
- grid-template-columns: minmax(0, 1fr) minmax(0, auto) ;
-}
-
-@utility grid-auto-fr {
-  @apply grid-scaffold;
-
- grid-template-columns: minmax(0, auto) minmax(0, 1fr) ;
-}
-
-@utility grid-with-breakout {
-  & { @apply grid-scaffold; grid-template-columns: [breakout-start] 1fr [content-start] repeat(var(--cols, 1), minmax(0, 1fr)) [content-end] 1fr [breakout-end] ;> * :not([class*="breakout-full"]) { grid-column: content-start / content-end; } > * :where(. breakout-full) { grid-column: breakout-start / breakout-end; } }
-}
-
-@utility grid-gallery {
-  @apply grid-scaffold;
-
- grid-template-columns: repeat(var(--fit, auto-fill), minmax(min(var(--item-width, 3rem), 100%), 1fr)) ;
-}
-
-@utility grid-gallery-fit {
-  --fit: auto-fit;
-
- @apply grid-gallery;
-}
-
-@utility grid-gallery-fill {
-  --fit: auto-fill;
-
- @apply grid-gallery;
-}
-
-@utility dense {
-  grid-auto-flow: dense;
-}
-
-@utility dense-column {
-  grid-auto-columns: dense;
-}
-
-@utility dense-row {
-  grid-auto-rows: dense;
-}
-
-@utility subgrid-scaffold {
-  display: grid; gap: inherit;
-}
-
-@utility subgrid {
-  @apply subgrid-columns; @apply subgrid-rows;
-
- grid-template-columns: subgrid; grid-template-rows: subgrid;
-}
-
-@utility subgrid-columns {
-  @apply subgrid-scaffold;
-
- grid-column: var(--start, auto) / span var(--span, 1) ; grid-template-columns: subgrid;> * :not([class*="subgrid"]) { grid-column-end: span var(--ispan, 1) ; width: 100%; max-width: 100%; }
-}
-
-@utility subgrid-rows {
-  @apply subgrid-scaffold;
-
- grid-row: var(--rowstart, auto) / span var(--rowspan, 1) ; grid-template-rows: subgrid;> * :not([class*="subgrid"]) { grid-row-end: span var(--irowspan, 1) ; }
-}
-
-@utility masonry {
-  @apply grid-repeat-auto;
-
- grid-template-rows: masonry;
-}
-
-@utility masonry-gallery {
-  @apply masonry;
-
- grid-template-columns: repeat(auto-fill, minmax(min(var(--item-width, 3rem), 100%), 1fr)) ;
-}
-
-@utility flex-grid {
-  display: flex; flex-flow: row wrap; gap: var(--gap, 1rem) ;> * , > * :where(astro-island, astro-slot) > * , > :where(. contents) > * { --one-column: var(--gap, 1rem) * (var(--cols, 1)  - 1) ; flex: var(--grow, var(--span, 1)) var(--span, 1) calc((100% - var(--one-column)) / var(--cols, 1) * var(--span, 1)  + (var(--span, 1) - 1) * var(--gap, 1rem)) ; min-width: min(100%, var(--item-width, 3rem)) ; max-width: 100%; }
-}
-
-@utility wrap {
-  margin-inline: auto; padding-inline: var(--wrap-padding, 1rem) ;
-}
-
-@utility width-single-column {
-  max-width: var(--width-single-column, 100%) ;
-}
-
-@utility width-narrow {
-  max-width: var(--width-narrow, 100%) ;
-}
-
-@utility width-standard {
-  max-width: var(--width-standard, 100%) ;
-}
-
-@utility width-text {
-  max-width: var(--width-text, 100%) ;
-}
-
-@utility width-limit {
-  max-width: var(--width-limit, 100%) ;
-}
-
-@theme {
-  --nudge: 0; --nudge-x: 0; --nudge-y: 0;
-}
-
-@utility nudge-top {
-  margin-block-start: var(--nudge-y, var(--nudge, 0)) ;
-}
-
-@utility nudge-topleft {
-  margin-block-start: var(--nudge-y, var(--nudge, 0)) ; margin-inline-start: var(--nudge-x, var(--nudge, 0)) ;
-}
-
-@utility nudge-topright {
-  margin-block-start: var(--nudge-y, var(--nudge, 0)) ; margin-inline-end: var(--nudge-x, var(--nudge, 0)) ;
-}
-
-@utility nudge-topfull {
-  margin-block-start: var(--nudge-y, var(--nudge, 0)) ; margin-inline: var(--nudge-x, var(--nudge, 0)) ;
-}
-
-@utility nudge-bottomleft {
-  margin-block-end: var(--nudge-y, var(--nudge, 0)) ; margin-inline-start: var(--nudge-x, var(--nudge, 0)) ;
-}
-
-@utility nudge-bottom {
-  margin-block-end: var(--nudge-y, var(--nudge, 0)) ;
-}
-
-@utility nudge-bottomright {
-  margin-block-end: var(--nudge-y, var(--nudge, 0)) ; margin-inline-end: var(--nudge-x, var(--nudge, 0)) ;
-}
-
-@utility nudge-bottomfull {
-  margin-block-end: var(--nudge-y, var(--nudge, 0)) ; margin-inline: var(--nudge-x, var(--nudge, 0)) ;
-}
-
-@utility nudge-left {
-  margin-inline-start: var(--nudge-x, var(--nudge, 0)) ;
-}
-
-@utility nudge-leftfull {
-  margin-block: var(--nudge-y, var(--nudge, 0)) ; margin-inline-start: var(--nudge-x, var(--nudge, 0)) ;
-}
-
-@utility nudge-right {
-  margin-inline-end: var(--nudge-x, var(--nudge, 0)) ;
-}
-
-@utility nudge-rightfull {
-  margin-block: var(--nudge-y, var(--nudge, 0)) ; margin-inline-end: var(--nudge-x, var(--nudge, 0)) ;
-}
-
-@utility stack-pos-top {
-  place-self: start center;
-}
-
-@utility stack-pos-topleft {
-  place-self: start start;
-}
-
-@utility stack-pos-topright {
-  place-self: start end;
-}
-
-@utility stack-pos-topfull {
-  place-self: start stretch;
-}
-
-@utility stack-pos-bottomleft {
-  place-self: end start;
-}
-
-@utility stack-pos-bottom {
-  place-self: end center;
-}
-
-@utility stack-pos-bottomright {
-  place-self: end end;
-}
-
-@utility stack-pos-bottomfull {
-  place-self: end stretch;
-}
-
-@utility stack-pos-left {
-  place-self: center start;
-}
-
-@utility stack-pos-lefttop {
-  place-self: start start;
-}
-
-@utility stack-pos-leftbottom {
-  place-self: end start;
-}
-
-@utility stack-pos-leftfull {
-  place-self: stretch start;
-}
-
-@utility stack-pos-right {
-  place-self: center end;
-}
-
-@utility stack-pos-righttop {
-  place-self: start end;
-}
-
-@utility stack-pos-rightbottom {
-  place-self: end end;
-}
-
-@utility stack-pos-rightfull {
-  place-self: stretch end;
-}
-
-@utility stack-pos-center {
-  place-self: center center;
-}
-
-@utility relative-pos {
-  position: absolute;
-}
-
-@utility relative-pos-top {
-  @apply relative-pos;
-
- inset-block-start: 0;
-}
-
-@utility relative-pos-topleft {
-  @apply relative-pos; @apply relative-pos-top;
-
- inset-inline-start: 0;
-}
-
-@utility relative-pos-topright {
-  @apply relative-pos; @apply relative-pos-top;
-
- inset-inline-end: 0;
-}
-
-@utility relative-pos-topfull {
-  @apply relative-pos; @apply relative-pos-top;
-
- inset-inline: 0;
-}
-
-@utility relative-pos-bottom {
-  @apply relative-pos;
-
- inset-block-end: 0;
-}
-
-@utility relative-pos-bottomleft {
-  @apply relative-pos; @apply relative-pos-bottom;
-
- inset-inline-start: 0;
-}
-
-@utility relative-pos-bottomright {
-  @apply relative-pos; @apply relative-pos-bottom;
-
- inset-inline-end: 0;
-}
-
-@utility relative-pos-bottomfull {
-  @apply relative-pos;
-
- inset-block-end: 0; inset-inline: 0;
-}
-
-@utility relative-pos-left {
-  @apply relative-pos;
-
- inset-inline-start: 0;
-}
-
-@utility relative-pos-lefttop {
-  @apply relative-pos; @apply relative-pos-left;
-
- inset-block-start: 0;
-}
-
-@utility relative-pos-leftbottom {
-  @apply relative-pos; @apply relative-pos-left;
-
- inset-block-end: 0;
-}
-
-@utility relative-pos-leftfull {
-  @apply relative-pos; @apply relative-pos-left;
-
- inset-block: 0;
-}
-
-@utility relative-pos-right {
-  @apply relative-pos;
-
- inset-inline-end: 0;
-}
-
-@utility relative-pos-righttop {
-  @apply relative-pos; @apply relative-pos-right;
-
- inset-block-start: 0;
-}
-
-@utility relative-pos-rightbottom {
-  @apply relative-pos; @apply relative-pos-right;
-
- inset-block-end: 0;
-}
-
-@utility relative-pos-rightfull {
-  @apply relative-pos; @apply relative-pos-right;
-
- inset-block: 0;
-}
-
-@utility relative-pos-center {
-  @apply relative-pos;
-
- top: 50%; left: 50%; transform: translate(-50%, -50%) ;
-}
-
-@utility relative-pos-overlay {
-  @apply relative-pos;
-
- inset: 0;
-}
-
-@utility pos-top {
-  @apply nudge-top; :where(. stack) > & { @apply stack-pos-top; } :where(. relative) > & { @apply relative-pos-top; }
-}
-
-@utility pos-topleft {
-  @apply nudge-topleft; :where(. stack) > & { @apply stack-pos-topleft; } :where(. relative) > & { @apply relative-pos-topleft; }
-}
-
-@utility pos-topright {
-  @apply nudge-topright; :where(. stack) > & { @apply stack-pos-topright; } :where(. relative) > & { @apply relative-pos-topright; }
-}
-
-@utility pos-topfull {
-  @apply nudge-topfull; :where(. stack) > & { @apply stack-pos-topfull; } :where(. relative) > & { @apply relative-pos-topfull; }
-}
-
-@utility pos-bottom {
-  @apply nudge-bottom; :where(. stack) > & { @apply stack-pos-bottom; } :where(. relative) > & { @apply relative-pos-bottom; }
-}
-
-@utility pos-bottomleft {
-  @apply nudge-bottomleft; :where(. stack) > & { @apply stack-pos-bottomleft; } :where(. relative) > & { @apply relative-pos-bottomleft; }
-}
-
-@utility pos-bottomright {
-  @apply nudge-bottomright; :where(. stack) > & { @apply stack-pos-bottomright; } :where(. relative) > & { @apply relative-pos-bottomright; }
-}
-
-@utility pos-bottomfull {
-  @apply nudge-bottomfull; :where(. stack) > & { @apply stack-pos-bottomfull; } :where(. relative) > & { @apply relative-pos-bottomfull; }
-}
-
-@utility pos-left {
-  @apply nudge-left; :where(. stack) > & { @apply stack-pos-left; } :where(. relative) > & { @apply relative-pos-left; }
-}
-
-@utility pos-leftfull {
-  @apply nudge-leftfull; :where(. stack) > & { @apply stack-pos-leftfull; } :where(. relative) > & { @apply relative-pos-leftfull; }
-}
-
-@utility pos-right {
-  @apply nudge-right; :where(. stack) > & { @apply stack-pos-right; } :where(. relative) > & { @apply relative-pos-right; }
-}
-
-@utility pos-rightfull {
-  @apply nudge-rightfull; :where(. stack) > & { @apply stack-pos-rightfull; } :where(. relative) > & { @apply relative-pos-rightfull; }
-}
-
-@utility pos-center {
-  :where(. stack) > & { @apply stack-pos-center; } :where(. relative) > & { @apply relative-pos-center; }
-}
-
-@utility pos-overlay {
-  :where(. stack) > & { display: grid;> * { grid-column: 1 / span 1; grid-row: 1 / span 1; } } :where(. relative) > & { @apply relative-pos-overlay; }
-}
-
-@theme {
-  --tx: 0%; --ty: 0%;
-}
-
-@utility edge-scaffold {
-  transform: translateX(var(--tx, 0%)) translateY(var(--ty, 0%)) ; :where(. stack) > & { box-sizing: content-box; } :where(. relative> & ) { position: absolute; }
-}
-
-@utility stack-edge-top {
-  place-self: start center;
-}
-
-@utility stack-edge-topleft {
-  place-self: start start;
-}
-
-@utility stack-edge-topright {
-  place-self: start end;
-}
-
-@utility stack-edge-topfull {
-  place-self: start stretch;
-}
-
-@utility stack-edge-bottom {
-  place-self: end center;
-}
-
-@utility stack-edge-bottomleft {
-  place-self: end start;
-}
-
-@utility stack-edge-bottomright {
-  place-self: end end;
-}
-
-@utility stack-edge-bottomfull {
-  place-self: end stretch;
-}
-
-@utility stack-edge-left {
-  place-self: center start;
-}
-
-@utility stack-edge-leftfull {
-  place-self: stretch start;
-}
-
-@utility stack-edge-right {
-  place-self: center end;
-}
-
-@utility stack-edge-rightfull {
-  place-self: stretch end;
-}
-
-@utility relative-edge-top {
-  inset-block-start: 0;
-}
-
-@utility relative-edge-topleft {
-  inset-block-start: 0; inset-inline-start: 0;
-}
-
-@utility relative-edge-topright {
-  inset-block-start: 0; inset-inline-end: 0;
-}
-
-@utility relative-edge-topfull {
-  inset-block-start: 0; inset-inline: 0;
-}
-
-@utility relative-edge-bottom {
-  inset-block-end: 0;
-}
-
-@utility relative-edge-bottomfull {
-  inset-block-end: 0; inset-inline: 0;
-}
-
-@utility relative-edge-bottomleft {
-  inset-block-end: 0; inset-inline-start: 0;
-}
-
-@utility relative-edge-bottomright {
-  inset-block-end: 0; inset-inline-end: 0;
-}
-
-@utility relative-edge-left {
-  inset-inline-start: 0;
-}
-
-@utility relative-edge-leftfull { inset-block: 0;
-  inset-inline-start: 0;
-}
-
-@utility relative-edge-right {
-  inset-inline-end: 0;
-}
-
-@utility relative-edge-rightfull { inset-block: 0;
-  inset-inline-end: 0;
-}
-
-@utility edge-adjust-top {
-  --ty: -50%;
-}
-
-@utility edge-adjust-topleft-start {
-  @apply edge-adjust-top;
-
- --tx: -100%;
-}
-
-@utility edge-adjust-topleft {
-  @apply edge-adjust-top;
-
- --tx: -50%;
-}
-
-@utility edge-adjust-topleft-end {
-  @apply edge-adjust-top;
-
- --tx: 0%;
-}
-
-@utility edge-adjust-topright-start {
-  @apply edge-adjust-top;
-
- --tx: 0%;
-}
-
-@utility edge-adjust-topright {
-  @apply edge-adjust-top;
-
- --tx: 50%;
-}
-
-@utility edge-adjust-topright-end {
-  @apply edge-adjust-top;
-
- --tx: 100%;
-}
-
-@utility edge-adjust-bottom {
-  --ty: 50%;
-}
-
-@utility edge-adjust-bottomleft-start {
-  @apply edge-adjust-bottom;
-
- --tx: -100%;
-}
-
-@utility edge-adjust-bottomleft {
-  @apply edge-adjust-bottom;
-
- --tx: -50%;
-}
-
-@utility edge-adjust-bottomleft-end {
-  @apply edge-adjust-bottom;
-
- --tx: 0%;
-}
-
-@utility edge-adjust-bottomright-start {
-  @apply edge-adjust-bottom;
-
- --tx: 0%;
-}
-
-@utility edge-adjust-bottomright {
-  @apply edge-adjust-bottom;
-
- --tx: 50%;
-}
-
-@utility edge-adjust-bottomright-end {
-  @apply edge-adjust-bottom;
-
- --tx: 100%;
-}
-
-@utility edge-adjust-left {
-  --tx: -50%;
-}
-
-@utility edge-adjust-right {
-  --tx: 50%;
-}
-
-@utility edge-top {
-  @apply edge-scaffold; @apply edge-adjust-top; :where(. stack) > & { @apply stack-edge-top; } :where(. relative) > & { @apply relative-edge-top; }
-}
-
-@utility edge-topleft {
-  @apply edge-scaffold; @apply edge-adjust-topleft; :where(. stack) > & { @apply stack-edge-topleft; } :where(. relative) > & { @apply relative-edge-topleft; }
-}
-
-@utility edge-topright {
-  @apply edge-scaffold; @apply edge-adjust-topright; :where(. stack) > & { @apply stack-edge-topright; } :where(. relative) > & { @apply relative-edge-topright; }
-}
-
-@utility edge-topfull {
-  @apply edge-scaffold; @apply edge-adjust-top; :where(. stack) > & { @apply stack-edge-top; } :where(. relative) > & { @apply relative-edge-top; }
-}
-
-@utility edge-bottom {
-  @apply edge-scaffold; @apply edge-adjust-bottom; :where(. stack) > & { @apply stack-edge-bottom; } :where(. relative) > & { @apply relative-edge-bottom; }
-}
-
-@utility edge-bottomleft {
-  @apply edge-scaffold; @apply edge-adjust-bottomleft; :where(. stack) > & { @apply stack-edge-bottomleft; } :where(. relative) > & { @apply relative-edge-bottomleft; }
-}
-
-@utility edge-bottomright {
-  @apply edge-scaffold; @apply edge-adjust-bottomright; :where(. stack) > & { @apply stack-edge-bottomright; } :where(. relative) > & { @apply relative-edge-bottomright; }
-}
-
-@utility edge-bottomfull {
-  @apply edge-scaffold; @apply edge-adjust-bottom; :where(. stack) > & { @apply stack-edge-bottom; } :where(. relative) > & { @apply relative-edge-bottom; }
-}
-
-@utility edge-left {
-  @apply edge-scaffold; @apply edge-adjust-left; :where(. stack) > & { @apply stack-edge-left; } :where(. relative) > & { @apply relative-edge-left; }
-}
-
-@utility edge-leftfull {
-  @apply edge-scaffold; @apply edge-adjust-left; :where(. stack) > & { @apply stack-edge-left; } :where(. relative) > & { @apply relative-edge-left; }
-}
-
-@utility edge-right {
-  @apply edge-scaffold; @apply edge-adjust-right; :where(. stack) > & { @apply stack-edge-right; } :where(. relative) > & { @apply relative-edge-right; }
-}
-
-@utility edge-rightfull {
-  @apply edge-scaffold; @apply edge-adjust-right; :where(. stack) > & { @apply stack-edge-right; } :where(. relative) > & { @apply relative-edge-right; }
-}
-
-@utility edge-topleft-start {
-  @apply edge-top; @apply edge-adjust-topleft-start;
-}
-
-@utility edge-topleft-end {
-  @apply edge-top; @apply edge-adjust-topleft-end;
-}
-
-@utility edge-topright-start {
-  @apply edge-top; @apply edge-adjust-topright-start;
-}
-
-@utility edge-topright-end {
-  @apply edge-top; @apply edge-adjust-topright-end;
-}
-
-@utility edge-bottomleft-start {
-  @apply edge-bottom; @apply edge-adjust-bottomleft-start;
-}
-
-@utility edge-bottomleft-end {
-  @apply edge-bottom; @apply edge-adjust-bottomleft-end;
-}
-
-@utility edge-bottomright-start {
-  @apply edge-bottom; @apply edge-adjust-bottomright-start;
-}
-
-@utility edge-bottomright-end {
-  @apply edge-bottom; @apply edge-adjust-bottomright-end;
-}
-
-@utility fixed-top {
-  position: fixed; top: 0; left: 0; right: 0;
-}
-
-@utility fixed-topleft {
-  @apply fixed-top; @apply nudge-topleft;
-
- right: auto;
-}
-
-@utility fixed-topright {
-  @apply fixed-top; @apply nudge-topright;
-
- left: auto;
-}
-
-@utility fixed-topfull {
-  @apply fixed-top; @apply nudge-topfull;
-}
-
-@utility fixed-bottom {
-  position: fixed; bottom: 0; left: 0; right: 0;
-}
-
-@utility fixed-bottomleft {
-  @apply fixed-bottom; @apply nudge-bottomleft;
-
- right: auto;
-}
-
-@utility fixed-bottomright {
-  @apply fixed-bottom; @apply nudge-bottomright;
-
- left: auto;
-}
-
-@utility fixed-bottomfull {
-  @apply fixed-bottom; @apply nudge-bottomfull;
-}
-
-@utility fixed-left {
-  position: fixed; top: 0; bottom: 0; left: 0;
-}
-
-@utility fixed-leftfull {
-  @apply fixed-left; @apply nudge-leftfull;
-}
-
-@utility fixed-right {
-  position: fixed; top: 0; bottom: 0; right: 0;
-}
-
-@utility fixed-rightfull {
-  @apply fixed-right; @apply nudge-rightfull;
-}
-
-@utility fixed-center {
-  position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%) ;
-}
-
-@utility fixed-overlay { pointer-events: none;
-  position: fixed; inset-block: var(--nudge-y, var(--nudge, 0)) ; inset-inline: var(--nudge-x, var(--nudge, 0)) ; display: grid;
-}
-
-@utility sticky {
-  position: sticky; top: 0; z-index: var(--z-index, 15) ; :where([class*="grid"] > & ) { align-self: start;   }
-}
-
-@custom-variant sticking (& . sticking);
-
-@utility text-stroke {
-  @supports (-webkit-text-stroke-width: 1px) {     -webkit-text-stroke-width: var(--stroke-width, .1em) ; -webkit-text-stroke-color: var(--stroke-color) ; paint-order: stroke fill; }
-}
-
-@utility text-outline {
-  color: var(--stroke-color) ;
-
-   @supports (-webkit-text-stroke-width: 1px) { font-size: calc(1em - var(--stroke-width, .1em) / 2) ; color: var(--bg-color) ; -webkit-text-stroke-width: var(--stroke-width, 2px) ;   -webkit-text-stroke-color: var(--stroke-color) ; paint-order: stroke fill; }
-}
-
-.highlight-bg {
-  line-height: 1;
-  background-image: linear-gradient(transparent .25em, var(--color) .25em, var(--color) 1em, transparent 1em);
-}
-
-@utility hero {
-  @apply vertical;
-}
-
-@utility hero-center {
-  @apply vertical items-center;
-}