@mkbabb/glass-ui 7.0.0 → 9.0.0

package/dist/styles/glass/a11y-fallback.css

@@ -1 +1 @@
-@media (prefers-reduced-transparency: reduce) { :root { --glass-level: 0; --glass-grain-opacity: 0; --glass-highlight: 0 0 0 0 transparent; } } @media (prefers-contrast: more) { :root { --glass-level: 0.3; --glass-tint-source: var(--glass-tint-ink); --glass-tint-strength: var(--glass-tint-strength-aa); --glass-definition: 1; } } @media (forced-colors: active) { :root { --glass-level: 0; --glass-grain-opacity: 0; --glass-highlight: 0 0 0 0 transparent; } .glass-material, .glass-wash, .glass-quiet, .glass-resting, .glass-floating, .glass-overlay, .glass-card, .glass-drawer { border: 1px solid CanvasText; } .glass-floating, .glass-overlay, .glass-drawer { background: Canvas; } .glass-material::before, .glass-wash::before, .glass-quiet::before, .glass-resting::before, .glass-floating::before, .glass-overlay::before, .glass-card::before, .glass-drawer::before, .glass-wash::after, .glass-quiet::after, .glass-resting::after, .glass-floating::after, .glass-overlay::after { display: none; } }
+@media (prefers-reduced-transparency: reduce){:root{--glass-level: 0;--glass-grain-opacity: 0;}}@media (prefers-contrast: more){:root{--glass-level: 0.3;--glass-definition: 1;}}@media (forced-colors: active){:root{--glass-level: 0;--glass-grain-opacity: 0;}.glass-wash,.glass-quiet,.glass-resting,.glass-floating,.glass-overlay,.glass-card{border: 1px solid CanvasText;}.glass-floating,.glass-overlay{background: Canvas;}.glass-wash::before,.glass-quiet::before,.glass-resting::before,.glass-floating::before,.glass-overlay::before,.glass-card::before{display: none;}}

package/dist/styles/glass/control-bit.css

@@ -0,0 +1 @@
+@layer components{.control-bit{--control-bit-size: 1.25rem;--control-bit-fill: color-mix(in oklab,var(--foreground) 4%,transparent);--control-bit-ink: color-mix( in oklab,var(--foreground) calc(var(--ink-perimeter) * 100%),transparent );--control-bit-edge: var(--control-bit-ink);display: inline-grid;place-items: center;flex: none;inline-size: max( var(--touch-target),var(--control-bit-face-inline,var(--control-bit-size)) );block-size: max( var(--touch-target),var(--control-bit-face-block,var(--control-bit-size)) );margin: 0;padding: 0;border: 0;background: transparent;color: var(--primary-foreground);cursor: pointer;appearance: none;touch-action: manipulation;}.dark .control-bit{--control-bit-fill: oklch(0 0 0 / 0.14);}.control-bit:focus-visible{outline: none;}.control-bit:is([data-state="checked"],[data-state="indeterminate"]){--control-bit-fill: var(--control-checked-bg);--control-bit-edge: var(--control-checked-bg);}.control-bit:is(:disabled,[data-disabled]){--control-bit-mark-ink: color-mix( in oklab,var(--primary-foreground) 45%,transparent );--control-bit-edge: color-mix( in oklab,var(--control-bit-ink) 45%,transparent );cursor: not-allowed;}.control-bit:is(:disabled,[data-disabled]):is( [data-state="checked"],[data-state="indeterminate"] ){--control-bit-fill: color-mix( in oklab,var(--control-checked-bg) 45%,transparent );--control-bit-edge: color-mix( in oklab,var(--control-checked-bg) 45%,transparent );}.control-bit__face{display: inline-flex;align-items: center;justify-content: center;inline-size: var(--control-bit-face-inline,var(--control-bit-size));block-size: var(--control-bit-face-block,var(--control-bit-size));padding: var(--control-bit-face-pad,0);border: 1px solid var(--control-bit-edge);border-radius: var(--control-bit-radius,var(--radius-pill));background-color: var(--control-bit-fill);box-shadow: var(--glass-rim-top),var(--glass-rim-bottom);transition: background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),outline-color var(--duration-fast) var(--ease-standard);}@media (hover: hover){.control-bit:not(:disabled,[data-disabled]):hover .control-bit__face{background-color: color-mix( in oklab,var(--foreground) calc(var(--fill-hover) * 100%),var(--control-bit-fill) );}}.control-bit:not(:disabled,[data-disabled]):active .control-bit__face{background-color: color-mix( in oklab,var(--foreground) calc(var(--fill-selected) * 100%),var(--control-bit-fill) );}.control-bit:focus-visible .control-bit__face{outline: 2px solid var(--control-bit-ink);outline-offset: 2px;box-shadow: var(--glass-rim-top),var(--glass-rim-bottom),0 0 8px color-mix(in oklab,var(--foreground) 15%,transparent);}:is(.control-bit[data-invalid],[data-invalid] .control-bit) .control-bit__face{border-color: var(--destructive);outline-color: var(--destructive);}.control-bit__mark{display: grid;place-items: center;color: var(--control-bit-mark-ink,var(--primary-foreground));scale: 0.6;opacity: 0;transition: scale var(--spring-press-duration) var(--transition-liquid-spatial),opacity var(--duration-fast) var(--ease-standard);}.control-bit:is([data-state="checked"],[data-state="indeterminate"]) .control-bit__mark{scale: 1;opacity: 1;}@media (prefers-reduced-motion: reduce){.control-bit__mark{scale: 1;transition: opacity var(--duration-fast) var(--ease-standard);}}@media (forced-colors: active){.control-bit__face{border-color: ButtonText;background-color: Canvas;box-shadow: none;}.control-bit:is([data-state="checked"],[data-state="indeterminate"]) .control-bit__face{border-color: Highlight;background-color: Highlight;}.control-bit__mark{color: HighlightText;}.control-bit:focus-visible .control-bit__face{outline: 2px solid Highlight;outline-offset: 2px;box-shadow: none;}}}

package/dist/styles/glass/control-edge.css

@@ -0,0 +1 @@
+@layer components{.glass-control-edge{box-shadow: var(--glass-rim-top),var(--glass-rim-bottom),var(--control-edge-inner,0 0 #0000),var(--control-edge-ring,0 0 #0000);}}

package/dist/styles/glass/control-surfaces.css

@@ -1 +1 @@
-@layer components { .input-pill { @apply flex w-full; height: var(--control-pill-h, var(--control-h-md)); border-radius: var(--radius-pill); border: 1.5px solid var(--control-surface-border); background: var(--control-surface-bg); -webkit-backdrop-filter: var(--glass-cell-backdrop-filter, var(--control-surface-blur)); backdrop-filter: var(--glass-cell-backdrop-filter, var(--control-surface-blur)); padding: 0 calc(1rem * var(--ui-scale)); font-size: var(--control-pill-text, var(--control-text)); color: var(--foreground); transition: background-color var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard), box-shadow var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard), opacity var(--duration-fast) var(--ease-standard); } .input-pill::placeholder { color: var(--surface-tint-35); } .control-surface { background: var(--control-surface-bg); border: 1px solid var(--control-surface-border); -webkit-backdrop-filter: var(--glass-cell-backdrop-filter, var(--control-surface-blur)); backdrop-filter: var(--glass-cell-backdrop-filter, var(--control-surface-blur)); } .control-surface:hover:not(:disabled, [data-disabled]) { background: var(--control-surface-bg-hover); } .input-pill:focus-visible { outline: none; border-color: var(--color-accent-opaque, var(--focus-ring-color)); box-shadow: 0 0 0 2px var(--color-accent, color-mix(in srgb, var(--focus-ring-color) 30%, transparent)); } .input-pill:where(:user-invalid, [aria-invalid="true"]) { border-color: var(--destructive); background: color-mix(in srgb, var(--destructive) 8%, var(--glass-bg-quiet)); } .input-pill:where(:user-valid) { border-color: var(--success); } .input-pill:where(:user-invalid, [aria-invalid="true"]):focus-visible { border-color: var(--destructive); box-shadow: var(--invalid-ring); } .input-pill:disabled { opacity: 0.5; cursor: not-allowed; } .glass-wash[role="combobox"] { border-color: var(--surface-tint-15); } }
+@layer components{.input-pill{@apply flex w-full;height: var(--control-pill-h,var(--control-h-md));border-radius: var(--radius-pill);border: 1.5px solid var(--control-surface-border);background: var(--control-surface-bg);-webkit-backdrop-filter: var(--control-surface-blur);backdrop-filter: var(--control-surface-blur);padding: 0 calc(1rem * var(--ui-scale));font-size: var(--control-pill-text,var(--control-text));color: var(--foreground);transition: background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),box-shadow var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard),opacity var(--duration-fast) var(--ease-standard);}.input-pill::placeholder{color: var(--muted-foreground);}.control-surface{background: var(--control-surface-bg);border: 1px solid var(--control-surface-border);-webkit-backdrop-filter: var(--control-surface-blur);backdrop-filter: var(--control-surface-blur);}.control-surface:hover:not(:disabled,[data-disabled]){background: var(--control-surface-bg-hover);}.input-pill:focus-visible{outline: none;border-color: var(--color-accent-opaque,var(--focus-ring-color));box-shadow: 0 0 0 2px var(--color-accent,color-mix(in srgb,var(--focus-ring-color) 30%,transparent));}.input-pill:where(:user-invalid,[aria-invalid="true"]){border-color: var(--destructive);background: color-mix(in srgb,var(--destructive) 8%,var(--glass-plate-quiet));}.input-pill:where(:user-valid){border-color: var(--success);}.input-pill:where(:user-invalid,[aria-invalid="true"]):focus-visible{border-color: var(--destructive);box-shadow: var(--invalid-ring);}.input-pill:disabled{opacity: 0.5;cursor: not-allowed;}.glass-wash[role="combobox"]{border-color: var(--surface-tint-15);}}

package/dist/styles/glass/deep.css

@@ -1 +1 @@
-@layer components { .glass-deep { --glass-blur-deep-active-radius: calc( ( var(--glass-blur-floating-radius) + (var(--glass-blur-deep-radius) - var(--glass-blur-floating-radius)) * var(--glass-depth) ) * var(--glass-level) ); --glass-saturate-deep-active: calc( var(--glass-saturate-floating) + (var(--glass-saturate-deep) - var(--glass-saturate-floating)) * var(--glass-depth) ); --glass-blur-deep: blur(var(--glass-blur-deep-active-radius)) saturate(var(--glass-saturate-deep-active)); --glass-blur-floating: var(--glass-blur-deep); } :where(.glass-overlay) { --glass-depth: var(--glass-depth-menu); } :where(.glass-floating) { --glass-depth: var(--glass-depth-popover); } :where(.glass-card, .glass-resting, .glass-quiet, .glass-wash) { --glass-depth: var(--glass-depth-content); } }
+@layer components{:where(.glass-deep){--glass-blur-tier-radius: var(--glass-blur-resting-radius);}.glass-deep{--glass-blur-deep-active-radius: calc( ( var(--glass-blur-tier-radius) + var(--glass-blur-deep-boost) * var(--glass-depth) ) * var(--glass-level) );--glass-saturate-deep-active: calc( var(--glass-saturate) + (var(--glass-saturate-deep) - var(--glass-saturate)) * var(--glass-depth) );--glass-blur-deep: blur(var(--glass-blur-deep-active-radius)) saturate(var(--glass-saturate-deep-active));--glass-blur-wash: var(--glass-blur-deep);--glass-blur-quiet: var(--glass-blur-deep);--glass-blur-resting: var(--glass-blur-deep);--glass-blur-floating: var(--glass-blur-deep);--glass-blur-overlay: var(--glass-blur-deep);}:where(.glass-overlay){--glass-depth: var(--glass-depth-menu);--glass-blur-tier-radius: var(--glass-blur-overlay-radius);}:where(.glass-floating){--glass-depth: var(--glass-depth-popover);--glass-blur-tier-radius: var(--glass-blur-floating-radius);}:where(.glass-resting){--glass-depth: var(--glass-depth-content);--glass-blur-tier-radius: var(--glass-blur-resting-radius);}:where(.glass-quiet){--glass-depth: var(--glass-depth-content);--glass-blur-tier-radius: var(--glass-blur-quiet-radius);}:where(.glass-wash){--glass-depth: var(--glass-depth-content);--glass-blur-tier-radius: var(--glass-blur-wash-radius);}:where(.glass-card){--glass-depth: var(--glass-depth-content);}}

package/dist/styles/glass/defined.css

@@ -1 +1 @@
-@layer components { .glass-defined, .input-pill, .control-surface { --glass-definition: 1; --glass-floor-fill: color-mix( in srgb, var(--card) calc(var(--glass-definition) * var(--glass-floor-fill-max)), transparent ); --glass-border-defined: color-mix( in srgb, var(--foreground) calc(var(--glass-definition) * 14%), transparent ); background-color: transparent; background-image: linear-gradient( var(--glass-defined-plate, var(--glass-plate-tinted)), var(--glass-defined-plate, var(--glass-plate-tinted)) ), linear-gradient(var(--glass-floor-fill), var(--glass-floor-fill)); border-color: var(--glass-border-defined); } .input-pill, .control-surface { --glass-defined-plate: var(--control-surface-bg); } }
+@layer components{.glass-defined,.input-pill,.control-surface{--glass-definition: 1;--glass-floor-fill: color-mix( in srgb,var(--card) calc(var(--glass-definition) * var(--glass-floor-fill-max)),transparent );--glass-border-defined: color-mix( in srgb,var(--foreground) calc(var(--glass-definition) * 14%),transparent );background-color: transparent;background-image: linear-gradient( var(--glass-defined-plate,var(--glass-veil)),var(--glass-defined-plate,var(--glass-veil)) ),linear-gradient(var(--glass-floor-fill),var(--glass-floor-fill));border-color: var(--glass-border-defined);}.input-pill,.control-surface{--glass-defined-plate: var(--control-surface-bg);}}

package/dist/styles/glass/dissolve.css

@@ -0,0 +1 @@
+@layer components{.glass-vaporize{--vap-clock: var(--exit-overlay-duration);--vap-curve: var(--exit-curve);--vap-rest-blur: calc(var(--glass-blur-floating-radius) * var(--glass-level));--vap-rest-saturate: var(--glass-saturate);--vap-blur: var(--vap-rest-blur);--vap-saturate: var(--vap-rest-saturate);--vap-height: 1lh;--vap-ink-blur: calc(0.5 * var(--vap-height));--vap-ink-floor: 0.3;}.glass-vaporize[data-state="closed"]{-webkit-backdrop-filter: blur(var(--vap-blur)) saturate(var(--vap-saturate));backdrop-filter: blur(var(--vap-blur)) saturate(var(--vap-saturate));animation: glass-vaporize-saturate var(--vap-clock) var(--vap-curve) both,glass-vaporize-panel var(--vap-clock) var(--vap-curve) both,glass-vaporize-blur var(--vap-clock) var(--vap-curve) both;}.glass-vaporize[data-state="closed"],.glass-vaporize[data-state="closed"][data-side="top"],.glass-vaporize[data-state="closed"][data-side="bottom"],.glass-vaporize[data-state="closed"][data-side="left"],.glass-vaporize[data-state="closed"][data-side="right"]{opacity: 1;scale: none;translate: none;filter: none;}.glass-vaporize[data-state="closed"] > *{animation: glass-vaporize-ink var(--vap-clock) var(--vap-curve) both;}.glass-corner-host{--corner-affordance-size: var(--icon-xl);--corner-affordance-host-border: 0px;--corner-affordance-offset: calc( (0.065 - 0.5) * var(--corner-affordance-size) - var(--corner-affordance-host-border) );position: relative;overflow: visible;}.glass-corner-host[data-corner="top-left"]{transform-origin: left top;}.glass-corner-host[data-corner="top-right"]{transform-origin: right top;}.glass-corner-host[data-corner="bottom-left"]{transform-origin: left bottom;}.glass-corner-host[data-corner="bottom-right"]{transform-origin: right bottom;}.glass-corner-affordance{position: absolute;z-index: 1;display: grid;place-items: center;inline-size: var(--corner-affordance-size);block-size: var(--corner-affordance-size);border-radius: 50%;border: 0;box-shadow: none;-webkit-backdrop-filter: none;backdrop-filter: none;background-color: var(--corner-affordance-fill,var(--foreground));color: var(--corner-affordance-ink,var(--background));}.glass-corner-host[data-corner="top-left"] > .glass-corner-affordance{inset-block-start: var(--corner-affordance-offset);inset-inline-start: var(--corner-affordance-offset);}.glass-corner-host[data-corner="top-right"] > .glass-corner-affordance{inset-block-start: var(--corner-affordance-offset);inset-inline-end: var(--corner-affordance-offset);}.glass-corner-host[data-corner="bottom-left"] > .glass-corner-affordance{inset-block-end: var(--corner-affordance-offset);inset-inline-start: var(--corner-affordance-offset);}.glass-corner-host[data-corner="bottom-right"] > .glass-corner-affordance{inset-block-end: var(--corner-affordance-offset);inset-inline-end: var(--corner-affordance-offset);}}@media (pointer: coarse){.glass-corner-affordance::after{content: "";position: absolute;inset: calc((var(--corner-affordance-size) - var(--touch-target)) / 2);}}@layer components{@media (prefers-reduced-motion: reduce){.glass-vaporize[data-state="closed"]{animation-name: glass-vaporize-saturate,glass-vaporize-panel,glass-vaporize-blur !important;animation-duration: var(--vap-clock) !important;}.glass-vaporize[data-state="closed"] > *{animation-name: glass-vaporize-ink-reduced !important;animation-duration: var(--vap-clock) !important;}}}

package/dist/styles/glass/focus-veil.css

@@ -0,0 +1 @@
+@layer components{.glass-focus-veil{position: fixed;inset: 0;z-index: calc(var(--z-overlay) - 1);pointer-events: none;-webkit-backdrop-filter: blur(var(--glass-focus-veil-blur)) saturate(var(--glass-saturate));backdrop-filter: blur(var(--glass-focus-veil-blur)) saturate(var(--glass-saturate));background: var(--glass-focus-veil-dim);-webkit-mask-image: linear-gradient( to right,transparent calc( var(--veil-x) - var(--glass-focus-veil-core-x) - var(--glass-focus-veil-bloom) ),black calc(var(--veil-x) - var(--glass-focus-veil-core-x)),black calc(var(--veil-x) + var(--glass-focus-veil-core-x)),transparent calc( var(--veil-x) + var(--glass-focus-veil-core-x) + var(--glass-focus-veil-bloom) ) ),linear-gradient( to bottom,transparent calc( var(--veil-y) - var(--glass-focus-veil-core-y) - var(--glass-focus-veil-bloom) ),black calc(var(--veil-y) - var(--glass-focus-veil-core-y)),black calc(var(--veil-y) + var(--glass-focus-veil-core-y)),transparent calc( var(--veil-y) + var(--glass-focus-veil-core-y) + var(--glass-focus-veil-bloom) ) );-webkit-mask-composite: source-in;mask-image: linear-gradient( to right,transparent calc( var(--veil-x) - var(--glass-focus-veil-core-x) - var(--glass-focus-veil-bloom) ),black calc(var(--veil-x) - var(--glass-focus-veil-core-x)),black calc(var(--veil-x) + var(--glass-focus-veil-core-x)),transparent calc( var(--veil-x) + var(--glass-focus-veil-core-x) + var(--glass-focus-veil-bloom) ) ),linear-gradient( to bottom,transparent calc( var(--veil-y) - var(--glass-focus-veil-core-y) - var(--glass-focus-veil-bloom) ),black calc(var(--veil-y) - var(--glass-focus-veil-core-y)),black calc(var(--veil-y) + var(--glass-focus-veil-core-y)),transparent calc( var(--veil-y) + var(--glass-focus-veil-core-y) + var(--glass-focus-veil-bloom) ) );mask-composite: intersect;opacity: 0;transition: opacity var(--duration-fast) var(--ease-standard);}.glass-focus-veil[data-engaged]{opacity: 1;transition: opacity var(--duration-normal) var(--ease-standard) var(--duration-instant);}@starting-style{.glass-focus-veil[data-engaged]{opacity: 0;}}}@media (prefers-reduced-transparency: reduce),(forced-colors: active){.glass-focus-veil{display: none;}}

package/dist/styles/glass/glass-atom.css

@@ -1 +1 @@
-@layer components { .cartoon-cast { --cast-travel: calc(6px * var(--motion-weight) * var(--cartoon-press-t)); --cast-spread: calc(1 + 0.18 * var(--motion-weight) * var(--cartoon-press-t)); position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none; box-shadow: var(--shadow-cartoon-md); translate: calc(-1 * var(--cast-travel) + var(--cartoon-cast-dx)) calc(var(--cast-travel) + var(--cartoon-cast-dy)); scale: var(--cast-spread); transition: translate calc(var(--duration-normal) * 1.15) var(--ease-cartoon-punch), scale calc(var(--duration-normal) * 1.15) var(--ease-cartoon-punch); } .glass-atom { transition: background var(--duration-fast) var(--ease-standard), box-shadow var(--duration-fast) var(--ease-standard); } .glass-atom[data-surface="glass"] { background-image: linear-gradient( var(--glass-fill-tinted), var(--glass-fill-tinted) ); } @media (prefers-reduced-motion: reduce) { .cartoon-cast { --motion-weight: 0; transition: none; } } @media (prefers-contrast: more) { .glass-atom { border-color: color-mix(in srgb, var(--foreground) 24%, transparent); } } .badge-atom { box-shadow: var(--glass-material-rim); } .badge-atom--outline { box-shadow: var(--glass-material-rim); border: 1px solid color-mix(in srgb, var(--foreground) 14%, transparent); } .badge-atom--glass { background-color: transparent !important; --glass-fill-strength: var(--badge-glass-strength, 16%); } .badge-atom--glass[data-variant="default"] { --glass-fill-tint: var(--primary); } .badge-atom--glass[data-variant="secondary"] { --glass-fill-tint: var(--glass-capsule-warm); } .badge-atom--glass[data-variant="outline"] { --glass-fill-tint: var(--glass-capsule-warm); } .badge-atom--glass[data-tone="destructive"] { --glass-fill-tint: var(--destructive); } .badge-atom--glass[data-tone="success"] { --glass-fill-tint: var(--success); } .badge-atom--glass[data-tone="warning"] { --glass-fill-tint: var(--warning); } .badge-atom--glass[data-tone="info"] { --glass-fill-tint: var(--info); } @media (prefers-contrast: more) { .badge-atom { border: 1px solid color-mix(in srgb, var(--foreground) 28%, transparent); } } }
+@layer components{.cartoon-cast{--cast-travel: calc(6px * var(--motion-weight) * var(--cartoon-press-t));--cast-spread: calc(1 + 0.18 * var(--motion-weight) * var(--cartoon-press-t));position: absolute;inset: 0;z-index: -1;border-radius: inherit;pointer-events: none;box-shadow: var(--shadow-cartoon-md);translate: calc(-1 * var(--cast-travel) + var(--cartoon-cast-dx)) calc(var(--cast-travel) + var(--cartoon-cast-dy));scale: var(--cast-spread);transition: translate calc(var(--duration-normal) * 1.15) var(--ease-cartoon-punch),scale calc(var(--duration-normal) * 1.15) var(--ease-cartoon-punch);}.glass-atom{transition: background var(--duration-fast) var(--ease-standard),box-shadow var(--duration-fast) var(--ease-standard);}.glass-atom[data-surface="glass"]{background-image: linear-gradient( var(--glass-fill-tinted),var(--glass-fill-tinted) );}@media (prefers-reduced-motion: reduce){.cartoon-cast{--motion-weight: 0;transition: none;}}@media (prefers-contrast: more){.glass-atom{border-color: color-mix(in srgb,var(--foreground) 24%,transparent);}}.badge-atom{box-shadow: var(--glass-material-rim);}.badge-atom--outline{box-shadow: var(--glass-material-rim),inset 0 0 0 1px color-mix( in oklab,var(--foreground) calc(var(--ink-perimeter) * 100%),transparent );}@media (prefers-contrast: more){.badge-atom{box-shadow: var(--glass-material-rim),inset 0 0 0 1px color-mix(in oklab,var(--foreground) 28%,transparent);}}}

package/dist/styles/glass/glass-capsule.css

@@ -1 +1 @@
-@layer components { .glass-capsule { background: var( --glass-capsule-fill, color-mix( in oklab, var(--glass-bg-floating-tinted), var(--glass-capsule-warm) var(--glass-capsule-warm-floor) ) ); -webkit-backdrop-filter: var(--glass-cell-backdrop-filter, var(--glass-blur-floating)); backdrop-filter: var(--glass-cell-backdrop-filter, var(--glass-blur-floating)); box-shadow: var(--glass-rim-top), var(--glass-rim-bottom), var(--glass-shadow-floating); border-radius: var(--radius-pill); } .glass-capsule-track { background: var(--glass-bg-quiet); -webkit-backdrop-filter: var(--glass-cell-backdrop-filter, var(--glass-blur-quiet)); backdrop-filter: var(--glass-cell-backdrop-filter, var(--glass-blur-quiet)); box-shadow: var(--glass-rim-top), var(--glass-rim-bottom), inset 0 1px 2px var(--tab-track-recess-ink); } .glass-capsule-hover { transition: scale var(--duration-fast) var(--ease-cartoon-punch), --specular-intensity var(--duration-fast) var(--ease-standard); } .glass-capsule-hover:hover, .glass-drag-lift { --specular-intensity: 0.14; } .glass-capsule-hover:hover { scale: 1.015; } .glass-capsule-hover:not([data-press-armed]):active { scale: var(--scale-press-sm, 0.97); } @media (prefers-reduced-motion: reduce) { .glass-capsule-hover:hover, .glass-capsule-hover:not([data-press-armed]):active { scale: 1; } } .glass-dock :is(.glass-capsule, .glass-capsule-hover) { background-clip: content-box; } .glass-dock .dock-icon-button { padding: var(--dock-icon-padding, var(--dock-control-safe-inset, 0)); } }
+@layer components{.glass-capsule{background: var( --glass-capsule-fill,color-mix( in oklab,var(--glass-veil),var(--glass-capsule-warm) var(--glass-capsule-warm-floor) ) );-webkit-backdrop-filter: var(--glass-blur-floating);backdrop-filter: var(--glass-blur-floating);box-shadow: var(--glass-rim-top),var(--glass-rim-bottom),var(--glass-shadow-capsule);border-radius: var(--radius-pill);}.glass-capsule-track{background: var(--glass-plate-quiet);-webkit-backdrop-filter: var(--glass-blur-quiet);backdrop-filter: var(--glass-blur-quiet);box-shadow: var(--glass-rim-top),var(--glass-rim-bottom),inset 0 1px 2px var(--tab-track-recess-ink);}.glass-capsule-hover{transition: scale var(--duration-fast) var(--ease-cartoon-punch),--specular-intensity var(--duration-fast) var(--ease-standard);}.glass-capsule-hover:hover{--glass-specular-intensity-hover: var(--glass-specular-capsule-hover);scale: 1.015;}.glass-capsule-hover:not([data-press-armed]):active{scale: var(--scale-press-sm,0.97);}@media (prefers-reduced-motion: reduce){.glass-capsule-hover:hover,.glass-capsule-hover:not([data-press-armed]):active{scale: 1;}}.glass-dock :is(.glass-capsule,.glass-capsule-hover){background-clip: content-box;}.glass-dock .dock-icon-button{padding: var(--dock-icon-padding,var(--dock-control-safe-inset,0));}}

package/dist/styles/glass/glass-chip.css

@@ -1 +1 @@
-@property --chip-flood-t { syntax: "<number>"; inherits: true; initial-value: 0; } @layer components { .glass-chip { --chip-tint-floor: 12%; --accent-band-strength: max(18%, calc(var(--chip-tint-floor) + 10%)); position: relative; isolation: isolate; background-image: linear-gradient( var(--glass-fill-tinted), var(--glass-fill-tinted) ); transition: background-color var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard); } .dark .glass-chip { --chip-tint-floor: 15%; } .glass-chip--interactive { scale: calc(1 + 0.12 * var(--chip-flood-t) * var(--motion-weight, 0.618)); transition: scale var(--duration-normal) var(--ease-cartoon-punch), background-color var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard); } .glass-chip[data-mode="selectable"][data-state="on"] { --chip-flood-t: 1; background-color: var(--accent-band); border-color: var(--accent-edge); color: var(--accent-ink); } .glass-chip[data-mode="selectable"]::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: radial-gradient( 120% 140% at 50% 50%, color-mix(in oklab, var(--accent-band) 60%, oklch(0.9 0.05 75 / 0)), oklch(0.9 0.05 75 / 0) 72% ); mix-blend-mode: plus-lighter; opacity: var(--chip-flood-t); transition: opacity var(--duration-normal) var(--ease-out) 60ms; } .glass-chip--cell, .glass-chip--cell.glass-capsule { border-radius: var(--radius-card); } .glass-chip--icon, .glass-chip--icon.glass-capsule { border-radius: var(--radius-pill); } .glass-chip__content { min-inline-size: 0; } .glass-chip__remove { display: inline-grid; flex: none; place-items: center; inline-size: 1.25rem; block-size: 1.25rem; padding: 0; border: 0; border-radius: var(--radius-pill); color: currentColor; background: color-mix(in srgb, currentColor 10%, oklch(0.9 0.05 75 / 0)); cursor: pointer; } .glass-chip[data-disabled] { opacity: var(--opacity-disabled); } @media (prefers-reduced-motion: reduce) { .glass-chip--interactive { --motion-weight: 0; } } @media (pointer: coarse) { .glass-chip--interactive { min-inline-size: var(--touch-target, 2.75rem); min-block-size: var(--touch-target, 2.75rem); } .glass-chip[data-mode="removable"] { min-block-size: var(--touch-target, 2.75rem); } .glass-chip[data-mode="removable"]::after { content: ""; flex: none; inline-size: var(--touch-target, 2.75rem); } .glass-chip__remove { position: absolute; inset-block-start: 50%; inset-inline-end: 0; inline-size: var(--touch-target, 2.75rem); block-size: var(--touch-target, 2.75rem); translate: 0 -50%; background: transparent; } .glass-chip__remove > span { display: inline-grid; inline-size: 1.25rem; block-size: 1.25rem; place-items: center; border-radius: var(--radius-pill); background: color-mix(in srgb, currentColor 10%, oklch(0.9 0.05 75 / 0)); } } @media (prefers-contrast: more) { .glass-chip[data-mode="selectable"][data-state="on"] { border-color: color-mix( in srgb, var(--foreground) 28%, oklch(0.9 0.05 75 / 0) ); } } }
+@property --chip-flood-t{syntax: "<number>";inherits: true;initial-value: 0;}@layer components{.glass-chip{--chip-tint-floor: 12%;--accent-band-strength: max(18%,calc(var(--chip-tint-floor) + 10%));position: relative;isolation: isolate;background-image: linear-gradient( var(--glass-fill-tinted),var(--glass-fill-tinted) );transition: background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard);}.dark .glass-chip{--chip-tint-floor: 15%;}.glass-chip--interactive{scale: calc(1 + 0.12 * var(--chip-flood-t) * var(--motion-weight,0.618));transition: scale var(--duration-normal) var(--ease-cartoon-punch),background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard);}.glass-chip[data-mode="selectable"][data-state="on"]{--chip-flood-t: 1;background-color: var(--accent-band);border-color: var(--accent-edge);color: var(--accent-ink);}.glass-chip[data-mode="selectable"]::after{content: "";position: absolute;inset: 0;border-radius: inherit;pointer-events: none;background: radial-gradient( 120% 140% at 50% 50%,color-mix(in oklab,var(--accent-band) 60%,oklch(0.9 0.05 75 / 0)),oklch(0.9 0.05 75 / 0) 72% );mix-blend-mode: plus-lighter;opacity: var(--chip-flood-t);transition: opacity var(--duration-normal) var(--ease-out) 60ms;}.glass-chip--cell,.glass-chip--cell.glass-capsule{border-radius: var(--radius-card);}.glass-chip--icon,.glass-chip--icon.glass-capsule{border-radius: var(--radius-pill);}.glass-chip__content{min-inline-size: 0;}.glass-chip__remove{display: inline-grid;flex: none;place-items: center;inline-size: 1.25rem;block-size: 1.25rem;padding: 0;border: 0;border-radius: var(--radius-pill);color: currentColor;background: color-mix(in srgb,currentColor 10%,oklch(0.9 0.05 75 / 0));cursor: pointer;}.glass-chip[data-disabled]{opacity: var(--opacity-disabled);}@media (prefers-reduced-motion: reduce){.glass-chip--interactive{--motion-weight: 0;}}@media (pointer: coarse){.glass-chip--interactive{min-inline-size: var(--touch-target,2.75rem);min-block-size: var(--touch-target,2.75rem);}.glass-chip[data-mode="removable"]{min-block-size: var(--touch-target,2.75rem);}.glass-chip[data-mode="removable"]::after{content: "";flex: none;inline-size: var(--touch-target,2.75rem);}.glass-chip__remove{position: absolute;inset-block-start: 50%;inset-inline-end: 0;inline-size: var(--touch-target,2.75rem);block-size: var(--touch-target,2.75rem);translate: 0 -50%;background: transparent;}.glass-chip__remove > span{display: inline-grid;inline-size: 1.25rem;block-size: 1.25rem;place-items: center;border-radius: var(--radius-pill);background: color-mix(in srgb,currentColor 10%,oklch(0.9 0.05 75 / 0));}}@media (prefers-contrast: more){.glass-chip[data-mode="selectable"][data-state="on"]{border-color: color-mix( in srgb,var(--foreground) 28%,oklch(0.9 0.05 75 / 0) );}}}

package/dist/styles/glass/grasp.css

@@ -0,0 +1 @@
+@layer components{:has(> .glass-grasp-carrier[data-grasp="grasp"]){-webkit-backdrop-filter: none;backdrop-filter: none;}[data-held]:has(> .glass-grasp-carrier[data-grasp="grasp"]){--glass-veil-rung: calc(var(--glass-veil-rest) * 0.6);}.glass-grasp-carrier{position: absolute;inset: 0;border-radius: inherit;pointer-events: none;}.glass-grasp-carrier[data-grasp="rest"]{-webkit-backdrop-filter: var(--glass-grasp-rest-filter,var(--glass-blur-resting));backdrop-filter: var(--glass-grasp-rest-filter,var(--glass-blur-resting));opacity: 0;}.glass-grasp-carrier[data-grasp="grasp"]{-webkit-backdrop-filter: blur( calc( var(--glass-grasp-radius,var(--glass-blur-resting-radius)) * 1.625 * var(--glass-level) ) ) saturate(var(--glass-saturate-grasp)) brightness(0.96);backdrop-filter: blur( calc( var(--glass-grasp-radius,var(--glass-blur-resting-radius)) * 1.625 * var(--glass-level) ) ) saturate(var(--glass-saturate-grasp)) brightness(0.96);opacity: 1;}:not([data-held]):has(> .glass-grasp-carrier[data-grasp="grasp"]) > .glass-grasp-carrier[data-grasp="rest"]{opacity: 1;}:not([data-held]):has(> .glass-grasp-carrier[data-grasp="grasp"]) > .glass-grasp-carrier[data-grasp="grasp"]{opacity: 0;transition: opacity var(--spring-dock-duration) var(--ease-standard);}:not([data-held]):has(> .glass-grasp-carrier[data-grasp="grasp"]){--glass-veil-rung: var(--glass-veil-rest);transition: --glass-veil-rung var(--spring-dock-duration) var(--ease-standard);}}

package/dist/styles/glass/ladder-undershadow.css

@@ -1 +1 @@
-@layer components { .glass-opaque { --glass-level: 0; --glass-tint-strength: 0%; } .glass-quiet.glass-over-text, .glass-quiet[data-over-content="text"] { box-shadow: var(--glass-under-shadow-default), var(--glass-shadow-quiet); } .glass-resting.glass-over-text, .glass-resting[data-over-content="text"] { box-shadow: var(--glass-under-shadow-vivid), var(--glass-shadow-resting); } .glass-resting[data-over-content="solid"] { box-shadow: var(--glass-under-shadow-quiet), var(--glass-shadow-resting); } .glass-floating[data-over-content="solid"] { box-shadow: var(--glass-material-rim), var(--glass-under-shadow-default), var(--glass-shadow-floating); } }
+@layer components{.glass-opaque{--glass-level: 0;}.glass-quiet.glass-over-text,.glass-quiet[data-over-content="text"]{box-shadow: var(--glass-under-shadow-default),var(--glass-shadow-quiet);}.glass-resting.glass-over-text,.glass-resting[data-over-content="text"]{box-shadow: var(--glass-under-shadow-vivid),var(--glass-shadow-resting);}.glass-resting[data-over-content="solid"]{box-shadow: var(--glass-under-shadow-quiet),var(--glass-shadow-resting);}.glass-floating[data-over-content="solid"]{box-shadow: var(--glass-material-rim),var(--glass-under-shadow-default),var(--glass-shadow-floating);}}

package/dist/styles/glass/ladder.css

@@ -1 +1 @@
-@layer components { .glass-wash, .glass-quiet, .glass-resting, .glass-floating, .glass-overlay { --glass-plate-tinted: color-mix( in oklab, var(--glass-bg-rung), var(--glass-tint-source) var(--glass-tint-strength) ); } .glass-wash { position: relative; --glass-bg-rung: var(--glass-bg-wash); background: var(--glass-plate-tinted); -webkit-backdrop-filter: var(--glass-cell-backdrop-filter, var(--glass-blur-wash)); backdrop-filter: var(--glass-cell-backdrop-filter, var(--glass-blur-wash)); --glass-border-rung: var(--glass-border-wash); border: 1px solid var(--glass-border-accent); box-shadow: var(--glass-material-rim), var(--glass-shadow-wash); } .glass-quiet { position: relative; --glass-bg-rung: var(--glass-bg-quiet); background: var(--glass-plate-tinted); -webkit-backdrop-filter: var(--glass-cell-backdrop-filter, var(--glass-blur-quiet)); backdrop-filter: var(--glass-cell-backdrop-filter, var(--glass-blur-quiet)); --glass-border-rung: var(--glass-border-quiet); border: 1px solid var(--glass-border-accent); box-shadow: var(--glass-material-rim), var(--glass-under-shadow-quiet), var(--glass-shadow-quiet); } .glass-resting { position: relative; --glass-bg-rung: var(--glass-bg-resting); background: var(--glass-plate-tinted); -webkit-backdrop-filter: var(--glass-cell-backdrop-filter, var(--glass-blur-resting)); backdrop-filter: var(--glass-cell-backdrop-filter, var(--glass-blur-resting)); --glass-border-rung: var(--glass-border-resting); border: 1px solid var(--glass-border-accent); box-shadow: var(--glass-material-rim), var(--glass-under-shadow-default), var(--glass-shadow-resting); } .glass-floating { --glass-backdrop: light; position: relative; --glass-bg-rung: var(--glass-bg-floating); background: var(--glass-plate-tinted); -webkit-backdrop-filter: var(--glass-blur-floating); backdrop-filter: var(--glass-blur-floating); --glass-border-rung: var(--glass-border-floating); border: 1px solid var(--glass-border-accent); box-shadow: var(--glass-material-rim), var(--glass-under-shadow-vivid), var(--glass-shadow-floating); } .glass-overlay { --glass-backdrop: light; position: relative; --glass-bg-rung: var(--glass-bg-overlay); background: var(--glass-plate-tinted); -webkit-backdrop-filter: var(--glass-blur-overlay); backdrop-filter: var(--glass-blur-overlay); --glass-border-rung: var(--glass-border-overlay); border: 1px solid var(--glass-border-accent); box-shadow: var(--glass-material-rim), var(--glass-shadow-overlay); } @container style(--glass-backdrop: light) { .glass-material, .glass-wash, .glass-quiet, .glass-resting, .glass-floating, .glass-overlay, .glass-card { --glass-tint-source: var(--glass-tint-ink); --glass-tint-strength: var(--glass-tint-strength-aa); --muted-foreground: var(--foreground); } } :where(.glass-floating, .glass-overlay) { --glass-tint-source: var(--glass-tint-ink); --glass-tint-strength: clamp( var(--glass-tint-strength-floor), calc( var(--glass-tint-strength-floor) + (var(--glass-tint-strength-aa) - var(--glass-tint-strength-floor)) * max(0, (var(--glass-backdrop-luma, 0) - var(--glass-backdrop-luma-knee)) / (1 - var(--glass-backdrop-luma-knee))) ), var(--glass-tint-strength-aa) ); --muted-foreground: var(--on-glass-muted); --muted-foreground-strong: var(--on-glass-muted-strong); } :where(.glass-card, .glass-resting, .glass-quiet, .glass-wash) { --glass-tint-source: var(--glass-tint-ink); --glass-tint-strength: clamp( var(--glass-tint-strength-floor), calc( var(--glass-tint-strength-floor) + (var(--glass-tint-strength-aa) - var(--glass-tint-strength-floor)) * max(0, (var(--glass-backdrop-luma, 0) - var(--glass-backdrop-luma-knee)) / (1 - var(--glass-backdrop-luma-knee))) ), var(--glass-tint-strength-aa) ); --muted-foreground: var(--on-glass-muted); --muted-foreground-strong: var(--on-glass-muted-strong); } :where(.feedback-tone, .glass-capsule) { --muted-foreground: var(--on-glass-muted-strong); --muted-foreground-strong: var(--on-glass-muted-strong); } @supports (color: contrast-color(white)) { @container style(--glass-backdrop: light) { .glass-material, .glass-wash, .glass-quiet, .glass-resting, .glass-floating, .glass-overlay, .glass-card { color: contrast-color(var(--card)); --foreground: contrast-color(var(--card)); --muted-foreground: contrast-color(var(--card)); } } } }
+@layer components{.glass-wash{position: relative;@apply glass-plate;border-radius: var(--radius-ctx);transition: background-color var(--spring-press-duration) var(--spring-press),box-shadow var(--spring-press-duration) var(--spring-press);-webkit-backdrop-filter: var(--glass-blur-wash);backdrop-filter: var(--glass-blur-wash);--glass-border-rung: var(--glass-border-wash);border: 1px solid var(--glass-border-accent);box-shadow: var(--glass-material-rim),var(--glass-shadow-wash);}.glass-quiet{position: relative;@apply glass-plate;border-radius: var(--radius-ctx);transition: background-color var(--spring-press-duration) var(--spring-press),box-shadow var(--spring-press-duration) var(--spring-press);-webkit-backdrop-filter: var(--glass-blur-quiet);backdrop-filter: var(--glass-blur-quiet);--glass-border-rung: var(--glass-border-quiet);border: 1px solid var(--glass-border-accent);box-shadow: var(--glass-material-rim),var(--glass-under-shadow-quiet),var(--glass-shadow-quiet);}.glass-resting{position: relative;@apply glass-plate;border-radius: var(--radius-ctx);transition: background-color var(--spring-press-duration) var(--spring-press),box-shadow var(--spring-press-duration) var(--spring-press);-webkit-backdrop-filter: var(--glass-blur-resting);backdrop-filter: var(--glass-blur-resting);--glass-border-rung: var(--glass-border-resting);border: 1px solid var(--glass-border-accent);box-shadow: var(--glass-material-rim),var(--glass-under-shadow-default),var(--glass-shadow-resting);}.glass-floating{--glass-backdrop: light;position: relative;@apply glass-plate;border-radius: var(--radius-ctx);transition: background-color var(--spring-press-duration) var(--spring-press),box-shadow var(--spring-press-duration) var(--spring-press);-webkit-backdrop-filter: var(--glass-blur-floating);backdrop-filter: var(--glass-blur-floating);--glass-border-rung: var(--glass-border-floating);border: 1px solid var(--glass-border-accent);box-shadow: var(--glass-material-rim),var(--glass-under-shadow-vivid),var(--glass-shadow-floating);}.glass-overlay{--glass-backdrop: light;position: relative;@apply glass-plate;border-radius: var(--radius-ctx);transition: background-color var(--spring-press-duration) var(--spring-press),box-shadow var(--spring-press-duration) var(--spring-press);-webkit-backdrop-filter: var(--glass-blur-overlay);backdrop-filter: var(--glass-blur-overlay);--glass-border-rung: var(--glass-border-overlay);border: 1px solid var(--glass-border-accent);box-shadow: var(--glass-material-rim),var(--glass-shadow-overlay);}@container style(--glass-backdrop: light){.glass-wash,.glass-quiet,.glass-resting,.glass-floating,.glass-overlay,.glass-card{--muted-foreground: var(--foreground);}}:where( .glass-card,.glass-resting,.glass-quiet,.glass-wash,.glass-floating,.glass-overlay ){--muted-foreground: var(--on-glass-muted);--muted-foreground-strong: var(--on-glass-muted-strong);}:where(.feedback-tone,.glass-capsule){--muted-foreground: var(--on-glass-muted-strong);--muted-foreground-strong: var(--on-glass-muted-strong);}@supports (color: contrast-color(white)){@container style(--glass-backdrop: light){.glass-wash,.glass-quiet,.glass-resting,.glass-floating,.glass-overlay,.glass-card{color: contrast-color(var(--card));--foreground: contrast-color(var(--card));--muted-foreground: contrast-color(var(--card));}}}}

package/dist/styles/glass/liquid-enter.css

@@ -1 +1 @@
-@layer components { .liquid-enter { --lq-enter-rise: 0.5rem; --lq-enter-blur: 4px; --lq-enter-origin: center; --lq-stretch-x: 1.06; --lq-stretch-y: 0.945; --lq-enter-duration: var(--spring-snappy-duration); } @media (prefers-reduced-motion: no-preference) { .liquid-enter { animation: gl-liquid-enter var(--lq-enter-duration) var(--spring-snappy) both; animation-delay: calc( var( --lq-enter-step, calc(var(--lq-enter-duration) * 0.618) ) * var(--i, 0) ); transform-origin: var(--lq-enter-origin); } .liquid-enter.is-display { animation-timing-function: var(--ease-out); } @keyframes gl-liquid-enter { 0% { opacity: 0; scale: var(--lq-stretch-x, 1.06) var(--lq-stretch-y, 0.945); translate: 0 var(--lq-enter-rise, 0.5rem); filter: blur(var(--lq-enter-blur, 4px)); } 100% { opacity: 1; scale: 1 1; translate: 0 0; filter: blur(0); } } } @media (prefers-reduced-motion: no-preference) { .liquid-enter.is-cel { animation: gl-cel-slam var(--lq-enter-duration) var(--ease-cartoon-punch, var(--spring-bouncy)) both; } @keyframes gl-cel-slam { 0% { opacity: 0; translate: 0 calc(14px * var(--motion-weight, 0.618)); scale: calc(1 - 0.12 * var(--motion-weight, 0.618)) calc(1 + 0.06 * var(--motion-weight, 0.618)); filter: blur(var(--lq-enter-blur, 4px)); } 62% { opacity: 1; translate: 0 calc(-3px * var(--motion-weight, 0.618)); scale: calc(1 + 0.1 * var(--motion-weight, 0.618)) calc(1 - 0.05 * var(--motion-weight, 0.618)); filter: blur(0); } 100% { opacity: 1; translate: 0 0; scale: 1 1; filter: blur(0); } } } .liquid-enter.is-cel > .cartoon-cast { position: absolute; inset: 0; z-index: -1; border-radius: inherit; box-shadow: var(--shadow-cartoon-md); pointer-events: none; } @media (prefers-reduced-motion: no-preference) { .liquid-enter.is-cel > .cartoon-cast { animation: gl-cast-lag var(--lq-enter-duration) var(--ease-cartoon-punch, var(--spring-snappy)) both; animation-delay: calc(0.006s + 0.06s * var(--motion-weight, 0.618)); } @keyframes gl-cast-lag { 0% { opacity: 0; translate: 0 calc(10px * var(--motion-weight, 0.618)) 0; scale: 0.92; } 100% { opacity: 1; translate: 0 0 0; scale: 1; } } } @media (prefers-contrast: more) { .liquid-enter.is-cel > .cartoon-cast { opacity: 1; } } } @layer components { @media (prefers-reduced-motion: reduce) { .liquid-enter, .liquid-enter.is-cel { animation: gl-liquid-enter-reduced var(--duration-fast) var(--ease-out) both; animation-delay: 0s; } .liquid-enter.is-cel > .cartoon-cast { animation: none; opacity: 1; translate: 0; scale: 1; } @keyframes gl-liquid-enter-reduced { from { opacity: 0; } to { opacity: 1; } } } }
+@layer components{.liquid-enter{--lq-enter-rise: 0.5rem;--lq-enter-blur: 4px;--lq-enter-origin: center;--lq-stretch-x: 1.06;--lq-stretch-y: 0.945;--lq-enter-duration: var(--spring-present-duration);}@media (prefers-reduced-motion: no-preference){.liquid-enter{animation: gl-liquid-enter var(--lq-enter-duration) var(--spring-present) both;animation-delay: calc( var( --lq-enter-step,calc(var(--lq-enter-duration) * 0.618) ) * var(--i,0) );transform-origin: var(--lq-enter-origin);}.liquid-enter.is-display{animation-timing-function: var(--ease-out);}@keyframes gl-liquid-enter{0%{opacity: 0;scale: var(--lq-stretch-x,1.06) var(--lq-stretch-y,0.945);translate: 0 var(--lq-enter-rise,0.5rem);filter: blur(var(--lq-enter-blur,4px));}100%{opacity: 1;scale: 1 1;translate: 0 0;filter: blur(0);}}}@media (prefers-reduced-motion: no-preference){.liquid-enter.is-cel{animation: gl-cel-slam var(--lq-enter-duration) var(--ease-cartoon-punch,var(--spring-present)) both;}@keyframes gl-cel-slam{0%{opacity: 0;translate: 0 calc(14px * var(--motion-weight,0.618));scale: calc(1 - 0.12 * var(--motion-weight,0.618)) calc(1 + 0.06 * var(--motion-weight,0.618));filter: blur(var(--lq-enter-blur,4px));}62%{opacity: 1;translate: 0 calc(-3px * var(--motion-weight,0.618));scale: calc(1 + 0.1 * var(--motion-weight,0.618)) calc(1 - 0.05 * var(--motion-weight,0.618));filter: blur(0);}100%{opacity: 1;translate: 0 0;scale: 1 1;filter: blur(0);}}}.liquid-enter.is-cel > .cartoon-cast{position: absolute;inset: 0;z-index: -1;border-radius: inherit;box-shadow: var(--shadow-cartoon-md);pointer-events: none;}@media (prefers-reduced-motion: no-preference){.liquid-enter.is-cel > .cartoon-cast{animation: gl-cast-lag var(--lq-enter-duration) var(--ease-cartoon-punch,var(--spring-present)) both;animation-delay: calc(0.006s + 0.06s * var(--motion-weight,0.618));}@keyframes gl-cast-lag{0%{opacity: 0;translate: 0 calc(10px * var(--motion-weight,0.618)) 0;scale: 0.92;}100%{opacity: 1;translate: 0 0 0;scale: 1;}}}@media (prefers-contrast: more){.liquid-enter.is-cel > .cartoon-cast{opacity: 1;}}}@layer components{@media (prefers-reduced-motion: reduce){.liquid-enter,.liquid-enter.is-cel{animation: gl-liquid-enter-reduced var(--duration-fast) var(--ease-out) both;animation-delay: 0s;}.liquid-enter.is-cel > .cartoon-cast{animation: none;opacity: 1;translate: 0;scale: 1;}@keyframes gl-liquid-enter-reduced{from{opacity: 0;}to{opacity: 1;}}}}

package/dist/styles/glass/liquid-fill.css

@@ -1 +1 @@
-@layer components { .glass-liquid-fill { border-radius: var(--radius-pill); background: color-mix( in oklab, var(--liquid-fill-tint, var(--glass-capsule-warm)) var(--liquid-fill-strength, 88%), oklch(0.9 0.05 75 / 0) ); -webkit-backdrop-filter: var( --glass-cell-backdrop-filter, var(--liquid-fill-blur, var(--glass-blur-quiet)) ); backdrop-filter: var( --glass-cell-backdrop-filter, var(--liquid-fill-blur, var(--glass-blur-quiet)) ); box-shadow: var(--glass-material-rim), var(--liquid-fill-shadow, var(--glass-under-shadow-quiet)); transition: background var(--duration-fast) var(--ease-standard), box-shadow var(--duration-fast) var(--ease-standard); } }
+@layer components{.glass-liquid-fill{border-radius: var(--radius-pill);--glass-veil-rest: 1;--glass-veil-rung: var(--glass-veil-rest);background: color-mix( in oklab,var(--liquid-fill-tint,var(--glass-capsule-warm)) calc(var(--liquid-fill-strength,88%) * var(--glass-veil-rung)),oklch(0.9 0.05 75 / 0) );-webkit-backdrop-filter: var(--liquid-fill-blur,var(--glass-blur-quiet));backdrop-filter: var(--liquid-fill-blur,var(--glass-blur-quiet));--glass-grasp-rest-filter: var(--liquid-fill-blur,var(--glass-blur-quiet));--glass-grasp-radius: var(--glass-blur-quiet-radius);box-shadow: var(--glass-material-rim),var(--liquid-fill-shadow,var(--glass-under-shadow-quiet));transition: box-shadow var(--duration-fast) var(--ease-standard);}}

package/dist/styles/glass/mark.css

@@ -0,0 +1 @@
+@layer components{:where(.badge-atom,.separator,.label,.avatar,.skeleton,.status-dot){-webkit-backdrop-filter: none;backdrop-filter: none;}:where(.badge-atom,.avatar,.separator,.status-dot){flex: none;}:where(.badge-atom,.avatar,.status-dot){--mark-stadium: var(--radius-pill);}:where(.badge-atom,.feedback-mark){transition: background-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard),box-shadow var(--duration-fast) var(--ease-standard),scale var(--spring-press-duration) var(--spring-press);}@media (prefers-reduced-motion: reduce){:where(.badge-atom,.feedback-mark){transition: none;}}:where(.badge-atom){--mark-pad-block: 0.25rem;--mark-pad-inline: 0.75rem;--mark-floor: calc(1lh + var(--mark-pad-block) * 2);min-inline-size: var(--mark-floor);padding-block: var(--mark-pad-block);padding-inline: min( var(--mark-pad-inline),calc((var(--mark-floor) - 1ch) / 2) );}}

package/dist/styles/glass/material.css

@@ -1 +1 @@
-@layer components { .glass-material, .glass-wash, .glass-quiet, .glass-resting, .glass-floating, .glass-overlay, .glass-card, .glass-specular-track, .dock-icon-button, .dock-tab-button, .dock-select-trigger, .dock-dropdown-trigger { position: relative; } :where( .glass-wash, .glass-quiet, .glass-resting, .glass-floating, .glass-overlay, .glass-card, .glass-dock ) > * { --glass-cell-backdrop-filter: none; } .glass-wash, .glass-quiet, .glass-resting, .glass-card { contain: paint; } .glass-material::before, .glass-wash::before, .glass-quiet::before, .glass-resting::before, .glass-floating::before, .glass-overlay::before, .glass-card::before, .glass-specular-track::before, .dock-icon-button::before, .dock-tab-button::before, .dock-select-trigger::before, .dock-dropdown-trigger::before { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 1; --specular-x: var(--mouse-x, 50%); --specular-y: var(--mouse-y, 50%); --specular-intensity: max( var(--glass-specular-intensity-rest, 0), calc( var(--glass-specular-intensity-active, 0.16) * var(--glass-btn-press-t, 0) ) ); --glass-specular-core: color-mix( in oklab, color-mix( in oklab, hsl(40 35% 92%), var(--glass-accent) var(--glass-accent-strength) ), var(--glass-ambient-hue) var(--glass-ambient-strength) ); background: conic-gradient( from var(--specular-angle, 0deg) at 50% 50%, transparent 0deg, color-mix(in srgb, var(--glass-specular-core) 55%, transparent) 18deg, transparent 60deg, transparent 360deg ), radial-gradient( circle var(--glass-specular-size, 36%) at var(--specular-x, 50%) var(--specular-y, 50%), color-mix(in srgb, var(--glass-specular-core) 50%, transparent) 0%, transparent 70%, transparent 100% ); box-shadow: inset 0 0 0 var(--glass-specular-hairline-width, 0.75px) color-mix( in srgb, hsl(40 35% 92%) var(--glass-specular-hairline-ink, 70%), transparent ); opacity: max( var(--specular-intensity, 0), var(--glass-specular-rest-hairline, 0.07) ); mask-image: radial-gradient( circle closest-side at 50% 50%, transparent calc(100% - var(--glass-edge-glint-band, 22%)), black calc(100% - calc(var(--glass-edge-glint-band, 22%) * 0.5)), black 100% ), radial-gradient( circle var(--glass-specular-size, 36%) at var(--specular-x, 50%) var(--specular-y, 50%), black 0%, black 60%, transparent 100% ); mix-blend-mode: plus-lighter; } .glass-specular-track::before, .glass-material:hover::before, .glass-material:active::before, .glass-wash:hover::before, .glass-wash:active::before, .glass-quiet:hover::before, .glass-quiet:active::before, .glass-resting:hover::before, .glass-resting:active::before, .glass-floating:hover::before, .glass-floating:active::before, .glass-overlay:hover::before, .glass-overlay:active::before, .glass-card:hover::before, .glass-card:active::before, .dock-icon-button::before, .dock-tab-button::before, .dock-select-trigger::before, .dock-dropdown-trigger::before { transition: --specular-x var(--duration-fast, 150ms) var(--ease-standard, ease-out), --specular-y var(--duration-fast, 150ms) var(--ease-standard, ease-out), opacity var(--duration-normal, 240ms) var(--ease-standard, ease-out); } .dark .glass-material::before, .dark .glass-wash::before, .dark .glass-quiet::before, .dark .glass-resting::before, .dark .glass-floating::before, .dark .glass-overlay::before, .dark .glass-card::before, .dark .glass-specular-track::before, .dark .dock-icon-button::before, .dark .dock-tab-button::before, .dark .dock-select-trigger::before, .dark .dock-dropdown-trigger::before { --specular-intensity: max( var(--glass-specular-intensity-rest, 0), calc( var(--glass-specular-intensity-active, 0.16) * var(--glass-btn-press-t, 0) ) ); } .glass-material:hover::before, .glass-wash:hover::before, .glass-quiet:hover::before, .glass-resting:hover::before, .glass-floating:hover::before, .glass-overlay:hover::before, .glass-card:hover::before, .glass-specular-track:hover::before, .dock-icon-button:hover::before, .dock-tab-button:hover::before, .dock-select-trigger:hover::before, .dock-dropdown-trigger:hover::before { --specular-intensity: var(--glass-specular-intensity-hover, 0.1); } .glass-material:active::before, .glass-wash:active::before, .glass-quiet:active::before, .glass-resting:active::before, .glass-floating:active::before, .glass-overlay:active::before, .glass-card:active::before, .glass-specular-track:active::before, .dock-icon-button:active::before, .dock-tab-button:active::before, .dock-select-trigger:active::before, .dock-dropdown-trigger:active::before { --specular-intensity: var(--glass-specular-intensity-active, 0.16); } :is( .glass-material, .glass-wash, .glass-quiet, .glass-resting, .glass-floating, .glass-overlay, .glass-specular-track, .dock-icon-button, .dock-tab-button, .dock-select-trigger, .dock-dropdown-trigger ):is( .is-active, .active, [data-active], [data-dragging], [data-state="checked"], [data-state="on"], [aria-pressed="true"], [aria-selected="true"], [aria-expanded="true"], [aria-current="page"] )::before { --specular-intensity: var(--glass-specular-intensity-active, 0.16); } :is( .glass-material, .glass-wash, .glass-quiet, .glass-resting, .glass-floating, .glass-overlay, .glass-specular-track, .dock-icon-button, .dock-tab-button, .dock-select-trigger, .dock-dropdown-trigger ):is(:disabled, [data-disabled], [aria-disabled="true"])::before { --specular-intensity: var(--glass-specular-intensity-rest, 0); transition: none; } }
+@layer components{.glass-wash,.glass-quiet,.glass-resting,.glass-floating,.glass-overlay,.glass-card,.glass-specular-track,.dock-icon-button,.dock-tab-button,.dock-select-trigger,.dock-dropdown-trigger{position: relative;}.glass-wash,.glass-quiet,.glass-resting,.glass-card{contain: paint;}.glass-wash::before,.glass-quiet::before,.glass-resting::before,.glass-floating::before,.glass-overlay::before,.glass-card::before,.glass-specular-track::before,.dock-icon-button::before,.dock-tab-button::before,.dock-select-trigger::before,.dock-dropdown-trigger::before{content: "";position: absolute;inset: 0;border-radius: inherit;pointer-events: none;z-index: 1;--specular-x: var(--mouse-x,50%);--specular-y: var(--mouse-y,50%);--specular-intensity: max( var(--glass-specular-intensity-rest,0),calc( var(--glass-specular-intensity-active,0.16) * var(--glass-btn-press-t,0) ) );--glass-specular-core: color-mix( in oklab,hsl(40 35% 92%),var(--glass-accent) var(--glass-accent-strength) );--glass-specular-disc: oklch(from var(--glass-specular-core) l c h / 0.5);background: radial-gradient( ellipse var(--glass-specular-size,36%) var(--glass-specular-size,36%) at var(--specular-x,50%) var(--specular-y,50%),var(--glass-specular-disc) 0%,transparent 70%,transparent 100% );opacity: var(--specular-intensity,0);mask-image: radial-gradient( ellipse var(--glass-specular-size,36%) var(--glass-specular-size,36%) at var(--specular-x,50%) var(--specular-y,50%),black 0%,black 60%,transparent 100% );mix-blend-mode: plus-lighter;}.glass-specular-track::before,.glass-wash:hover::before,.glass-wash:active::before,.glass-quiet:hover::before,.glass-quiet:active::before,.glass-resting:hover::before,.glass-resting:active::before,.glass-floating:hover::before,.glass-floating:active::before,.glass-overlay:hover::before,.glass-overlay:active::before,.glass-card:hover::before,.glass-card:active::before,.dock-icon-button::before,.dock-tab-button::before,.dock-select-trigger::before,.dock-dropdown-trigger::before{transition: --specular-x var(--duration-fast,150ms) var(--ease-standard,ease-out),--specular-y var(--duration-fast,150ms) var(--ease-standard,ease-out),opacity var(--duration-normal,240ms) var(--ease-standard,ease-out);}.dark .glass-wash::before,.dark .glass-quiet::before,.dark .glass-resting::before,.dark .glass-floating::before,.dark .glass-overlay::before,.dark .glass-card::before,.dark .glass-specular-track::before,.dark .dock-icon-button::before,.dark .dock-tab-button::before,.dark .dock-select-trigger::before,.dark .dock-dropdown-trigger::before{--specular-intensity: max( var(--glass-specular-intensity-rest,0),calc( var(--glass-specular-intensity-active,0.16) * var(--glass-btn-press-t,0) ) );}.glass-wash:hover::before,.glass-quiet:hover::before,.glass-resting:hover::before,.glass-floating:hover::before,.glass-overlay:hover::before,.glass-card:hover::before,.glass-specular-track:hover::before,.dock-icon-button:hover::before,.dock-tab-button:hover::before,.dock-select-trigger:hover::before,.dock-dropdown-trigger:hover::before{--specular-intensity: var(--glass-specular-intensity-hover,0.1);}.glass-wash:active::before,.glass-quiet:active::before,.glass-resting:active::before,.glass-floating:active::before,.glass-overlay:active::before,.glass-card:active::before,.glass-specular-track:active::before,.dock-icon-button:active::before,.dock-tab-button:active::before,.dock-select-trigger:active::before,.dock-dropdown-trigger:active::before{--specular-intensity: var(--glass-specular-intensity-active,0.16);}:is( .glass-wash,.glass-quiet,.glass-resting,.glass-floating,.glass-overlay,.glass-specular-track,.dock-icon-button,.dock-tab-button,.dock-select-trigger,.dock-dropdown-trigger ):is( .is-active,.active,[data-active],[data-dragging],[data-state="checked"],[data-state="on"],[aria-pressed="true"],[aria-selected="true"],[aria-expanded="true"],[aria-current="page"] )::before{--specular-intensity: var(--glass-specular-intensity-active,0.16);}:is( .glass-wash,.glass-quiet,.glass-resting,.glass-floating,.glass-overlay,.glass-specular-track,.dock-icon-button,.dock-tab-button,.dock-select-trigger,.dock-dropdown-trigger ):is(:disabled,[data-disabled],[aria-disabled="true"])::before{--specular-intensity: var(--glass-specular-intensity-rest,0);transition: none;}}

package/dist/styles/glass/overlay-plate.css

@@ -0,0 +1 @@
+@layer components{.glass-overlay-plate{--radius-ctx: var(--radius-card);--radius-inset: var(--overlay-pad);padding: var(--overlay-pad);color: var(--popover-foreground);overflow: hidden;}.glass-overlay-plate[data-reveal="menu"]{min-inline-size: var(--overlay-min-width);max-block-size: min( var(--overlay-max-block),var(--reka-popper-available-height,var(--overlay-max-block)) );overflow-y: auto;}.glass-overlay-plate[data-reveal="overlay"]{inline-size: min(21rem,calc(100dvw - 2 * var(--overlay-pad)));}.glass-overlay-plate[data-reveal="tooltip"]{--radius-ctx: var(--radius-panel);--radius-inset: var(--overlay-pad-hint);padding: var(--overlay-pad-hint);font-size: var(--tooltip-text);}.menu__trigger:focus-visible{outline: var(--focus-ring-width) solid color-mix( in oklab,var(--foreground) calc(var(--ink-perimeter) * 100%),transparent );outline-offset: var(--focus-ring-width);border-radius: var(--radius-control);}.menu__item,.menu__sub-trigger{position: relative;display: flex;width: 100%;align-items: center;padding-block: 0.375rem;padding-inline: 0.5rem;cursor: default;outline: none;color: inherit;font-size: var(--dropdown-text);user-select: none;}.menu__item[data-inset],.menu__item[data-indicator="wide"]{padding-inline-start: 2rem;}.menu__item[data-indicator="start"]{padding-inline-start: 1.75rem;}.menu__item[data-disabled],.menu__sub-trigger[data-disabled]{pointer-events: none;cursor: not-allowed;opacity: var(--opacity-disabled);}.menu__indicator{position: absolute;inset-inline-start: 0.5rem;display: inline-flex;width: 0.875rem;height: 0.875rem;align-items: center;justify-content: center;}.menu__indicator > svg{width: 1rem;height: 1rem;}.menu__radio-dot{display: inline-block;width: 0.5rem;height: 0.5rem;border-radius: var(--radius-pill);background: currentColor;}.menu__label{padding: 0.375rem 0.5rem;color: var(--muted-foreground);font-size: var(--dropdown-text-secondary);font-weight: 600;}.menu__label[data-inset]{padding-inline-start: 2rem;}.menu__shortcut{margin-inline-start: auto;font-size: var(--dropdown-text-secondary);letter-spacing: var(--type-tracking-caps);opacity: 0.6;}.menu__sub-chevron{width: 1rem;height: 1rem;margin-inline-start: auto;}[data-slot="select-content"]{--glass-veil-tier: var(--glass-veil-overlay);--overlay-viewport-inset: 4px;--overlay-option-radius: calc( var(--radius-card) - var(--overlay-viewport-inset) );background-image: linear-gradient( color-mix( in oklab,oklch(0.9 0.05 75 / 0),var(--glass-capsule-warm) var(--glass-capsule-warm-floor) ),color-mix( in oklab,oklch(0.9 0.05 75 / 0),var(--glass-capsule-warm) var(--glass-capsule-warm-floor) ) );border: 1px solid color-mix( in oklab,var(--foreground) calc(var(--ink-edge) * 100%),transparent );box-shadow: var(--glass-material-rim),var(--glass-under-shadow-vivid),var(--glass-shadow-floating),var(--shadow-cartoon-lg);max-height: min( var(--overlay-max-block),var(--reka-popper-available-height,var(--overlay-max-block)) );overflow: hidden;transform-origin: var(--reka-select-content-transform-origin);}[data-slot="select-viewport"]{padding: var(--overlay-viewport-inset);}[data-slot="select-viewport"] [role="option"]{border-radius: var(--overlay-option-radius);}.glass-field-portal{position: relative;}.glass-field-portal::before{content: "";position: absolute;inset: 0;z-index: -1;pointer-events: none;border-radius: inherit;background: radial-gradient( 70% 60% at 24% 22%,oklch(0.92 0.08 var(--field-h,48) / 0.55),transparent 72% ),radial-gradient( 64% 58% at 82% 80%,oklch(0.88 0.07 calc(var(--field-h,48) + 18) / 0.5),transparent 70% ),radial-gradient( 60% 62% at 60% 40%,oklch(0.9 0.06 calc(var(--field-h,48) - 14) / 0.48),transparent 74% );}.dark .glass-field-portal::before{background: radial-gradient( 70% 60% at 24% 22%,oklch(0.3 0.1 var(--field-h,48) / 0.55),transparent 72% ),radial-gradient( 64% 58% at 82% 80%,oklch(0.26 0.09 calc(var(--field-h,48) + 18) / 0.5),transparent 70% ),radial-gradient( 60% 62% at 60% 40%,oklch(0.28 0.08 calc(var(--field-h,48) - 14) / 0.48),transparent 74% );}@supports not (color: oklch(0.9 0.08 48)){.glass-field-portal::before{background: radial-gradient( 70% 60% at 24% 22%,hsl(var(--field-h,48) 60% 88% / 0.5),transparent 72% );}.dark .glass-field-portal::before{background: radial-gradient( 70% 60% at 24% 22%,hsl(var(--field-h,48) 45% 26% / 0.55),transparent 72% );}}}

package/dist/styles/glass/reveal.css

@@ -1 +1 @@
-@layer components { .glass-reveal { --reveal-spring: var(--enter-overlay-spring); --reveal-clock: var(--enter-overlay-clock); --reveal-exit-clock: var(--exit-overlay-duration); --reveal-exit-curve: var(--exit-curve); --glass-reveal-enter-scale: var(--enter-overlay-scale); --glass-reveal-blur: var(--enter-overlay-blur); --glass-reveal-slide: var(--enter-overlay-slide); --lq-stretch-x: 1.06; --lq-stretch-y: 0.945; transform-origin: var(--reka-popper-transform-origin, center); transition-property: scale, translate, opacity, filter, display, overlay; transition-duration: var(--reveal-clock), var(--reveal-clock), var(--reveal-clock), var(--reveal-clock), var(--reveal-clock), var(--reveal-clock); transition-timing-function: var(--reveal-spring), var(--reveal-spring), var(--ease-out), var(--ease-out), linear, linear; transition-behavior: allow-discrete; } .glass-reveal[data-reveal="overlay"] { --reveal-spring: var(--enter-overlay-spring); --reveal-clock: var(--enter-overlay-clock); --reveal-exit-clock: var(--exit-overlay-duration); --glass-reveal-enter-scale: var(--enter-overlay-scale); --glass-reveal-blur: var(--enter-overlay-blur); --glass-reveal-slide: var(--enter-overlay-slide); } .glass-reveal[data-reveal="menu"] { --reveal-spring: var(--enter-menu-spring); --reveal-clock: var(--enter-menu-clock); --reveal-exit-clock: var(--exit-overlay-duration); --glass-reveal-enter-scale: var(--enter-menu-scale); --glass-reveal-blur: var(--enter-menu-blur); --glass-reveal-slide: var(--enter-menu-slide); } .glass-reveal[data-reveal="tooltip"] { --reveal-spring: var(--enter-tooltip-spring); --reveal-clock: var(--enter-tooltip-clock); --reveal-exit-clock: var(--exit-overlay-duration); --glass-reveal-enter-scale: var(--enter-tooltip-scale); --glass-reveal-blur: var(--enter-tooltip-blur); --glass-reveal-slide: var(--enter-tooltip-slide); } .glass-reveal[data-reveal="transient"] { --reveal-spring: var(--enter-transient-spring); --reveal-clock: var(--enter-transient-clock); --reveal-exit-clock: var(--exit-transient-duration); --glass-reveal-enter-scale: var(--enter-transient-scale); --glass-reveal-blur: var(--enter-transient-blur); --glass-reveal-slide: var(--enter-transient-slide); } .glass-reveal[data-state="open"] { scale: 1 1; opacity: 1; filter: blur(0); @starting-style { scale: calc(var(--glass-reveal-enter-scale, 0.94) * var(--lq-stretch-x, 1.06)) calc(var(--glass-reveal-enter-scale, 0.94) * var(--lq-stretch-y, 0.945)); opacity: 0; filter: blur(var(--glass-reveal-blur)); } } .glass-reveal[data-state="closed"] { scale: calc(var(--glass-reveal-enter-scale, 0.94) * var(--lq-stretch-x, 1.06)) calc(var(--glass-reveal-enter-scale, 0.94) * var(--lq-stretch-y, 0.945)); opacity: 0; filter: blur(var(--glass-reveal-blur)); animation: glass-reveal-out var(--reveal-exit-clock) var(--reveal-exit-curve) both; transition-property: translate, display, overlay; transition-timing-function: var(--reveal-exit-curve); transition-duration: var(--reveal-exit-clock); } .glass-reveal[data-side="top"][data-state="open"] { translate: 0 0; @starting-style { translate: 0 var(--glass-reveal-slide); } } .glass-reveal[data-side="bottom"][data-state="open"] { translate: 0 0; @starting-style { translate: 0 calc(-1 * var(--glass-reveal-slide)); } } .glass-reveal[data-side="left"][data-state="open"] { translate: 0 0; @starting-style { translate: var(--glass-reveal-slide) 0; } } .glass-reveal[data-side="right"][data-state="open"] { translate: 0 0; @starting-style { translate: calc(-1 * var(--glass-reveal-slide)) 0; } } .glass-reveal[data-state="closed"][data-side="top"] { translate: 0 var(--glass-reveal-slide); } .glass-reveal[data-state="closed"][data-side="bottom"] { translate: 0 calc(-1 * var(--glass-reveal-slide)); } .glass-reveal[data-state="closed"][data-side="left"] { translate: var(--glass-reveal-slide) 0; } .glass-reveal[data-state="closed"][data-side="right"] { translate: calc(-1 * var(--glass-reveal-slide)) 0; } .glass-reveal[data-motion="reduced"] { --glass-reveal-enter-scale: 0.97; --glass-reveal-blur: 0px; } .glass-reveal[data-motion="off"] { scale: none; translate: none; filter: blur(0); transition-property: opacity, display, overlay; transition-duration: var(--reveal-exit-clock); transition-timing-function: var(--reveal-exit-curve); } .glass-reveal[data-motion="off"][data-state="closed"] { scale: none; translate: none; filter: blur(0); animation-name: glass-reveal-out-reduced; } } @media (prefers-reduced-motion: reduce) { .glass-reveal { scale: none; translate: none; filter: blur(0); transition-property: opacity, display, overlay; transition-duration: var(--duration-fast); transition-timing-function: var(--ease-out); } .glass-reveal[data-state="closed"] { scale: none; translate: none; filter: blur(0); animation-name: glass-reveal-out-reduced; } }
+@layer components{.glass-reveal{--reveal-spring: var(--enter-overlay-spring);--reveal-clock: var(--enter-overlay-clock);--reveal-exit-clock: var(--exit-overlay-duration);--reveal-exit-curve: var(--exit-curve);--glass-reveal-enter-scale: var(--enter-overlay-scale);--glass-reveal-blur: var(--enter-overlay-blur);--glass-reveal-slide: var(--enter-overlay-slide);--lq-stretch-x: 1.06;--lq-stretch-y: 0.945;transform-origin: var(--reka-popper-transform-origin,center);transition-property: scale,translate,opacity,filter,display,overlay;transition-duration: var(--reveal-clock),var(--reveal-clock),var(--reveal-clock),var(--reveal-clock),var(--reveal-clock),var(--reveal-clock);transition-timing-function: var(--reveal-spring),var(--reveal-spring),var(--ease-out),var(--ease-out),linear,linear;transition-behavior: allow-discrete;}.glass-reveal[data-reveal="overlay"]{--reveal-spring: var(--enter-overlay-spring);--reveal-clock: var(--enter-overlay-clock);--reveal-exit-clock: var(--exit-overlay-duration);--glass-reveal-enter-scale: var(--enter-overlay-scale);--glass-reveal-blur: var(--enter-overlay-blur);--glass-reveal-slide: var(--enter-overlay-slide);}.glass-reveal[data-reveal="menu"]{--reveal-spring: var(--enter-menu-spring);--reveal-clock: var(--enter-menu-clock);--reveal-exit-clock: var(--spring-present-exit-duration);--glass-reveal-enter-scale: var(--enter-menu-scale);--glass-reveal-blur: var(--enter-menu-blur);--glass-reveal-slide: var(--enter-menu-slide);}.glass-reveal[data-reveal="tooltip"]{--reveal-spring: var(--enter-tooltip-spring);--reveal-clock: var(--enter-tooltip-clock);--reveal-exit-clock: var(--spring-present-exit-duration);--glass-reveal-enter-scale: var(--enter-tooltip-scale);--glass-reveal-blur: var(--enter-tooltip-blur);--glass-reveal-slide: var(--enter-tooltip-slide);}.glass-reveal[data-state="open"]{scale: 1 1;opacity: 1;filter: blur(0);@starting-style{scale: calc(var(--glass-reveal-enter-scale,0.94) * var(--lq-stretch-x,1.06)) calc(var(--glass-reveal-enter-scale,0.94) * var(--lq-stretch-y,0.945));opacity: 0;filter: blur(var(--glass-reveal-blur));}}.glass-reveal[data-state="closed"]{scale: calc(var(--glass-reveal-enter-scale,0.94) * var(--lq-stretch-x,1.06)) calc(var(--glass-reveal-enter-scale,0.94) * var(--lq-stretch-y,0.945));opacity: 0;filter: blur(var(--glass-reveal-blur));animation: glass-reveal-out var(--reveal-exit-clock) var(--reveal-exit-curve) both;transition-property: translate,display,overlay;transition-timing-function: var(--reveal-exit-curve);transition-duration: var(--reveal-exit-clock);}.glass-reveal[data-side="top"][data-state="open"]{translate: 0 0;@starting-style{translate: 0 var(--glass-reveal-slide);}}.glass-reveal[data-side="bottom"][data-state="open"]{translate: 0 0;@starting-style{translate: 0 calc(-1 * var(--glass-reveal-slide));}}.glass-reveal[data-side="left"][data-state="open"]{translate: 0 0;@starting-style{translate: var(--glass-reveal-slide) 0;}}.glass-reveal[data-side="right"][data-state="open"]{translate: 0 0;@starting-style{translate: calc(-1 * var(--glass-reveal-slide)) 0;}}.glass-reveal[data-state="closed"][data-side="top"]{translate: 0 var(--glass-reveal-slide);}.glass-reveal[data-state="closed"][data-side="bottom"]{translate: 0 calc(-1 * var(--glass-reveal-slide));}.glass-reveal[data-state="closed"][data-side="left"]{translate: var(--glass-reveal-slide) 0;}.glass-reveal[data-state="closed"][data-side="right"]{translate: calc(-1 * var(--glass-reveal-slide)) 0;}.glass-reveal[data-motion="reduced"]{--glass-reveal-enter-scale: 0.97;--glass-reveal-blur: 0px;}.glass-reveal[data-motion="off"]{scale: none;translate: none;filter: blur(0);transition-property: opacity,display,overlay;transition-duration: var(--reveal-exit-clock);transition-timing-function: var(--reveal-exit-curve);}.glass-reveal[data-motion="off"][data-state="closed"]{scale: none;translate: none;filter: blur(0);animation-name: glass-reveal-out-reduced;}}@media (prefers-reduced-motion: reduce){.glass-reveal{scale: none;translate: none;filter: blur(0);transition-property: opacity,display,overlay;transition-duration: var(--duration-fast);transition-timing-function: var(--ease-out);}.glass-reveal[data-state="closed"]{scale: none;translate: none;filter: blur(0);animation-name: glass-reveal-out-reduced;}}

package/dist/styles/glass/rim.css

@@ -1 +1 @@
-@layer components { .glass-material, .glass-wash, .glass-quiet, .glass-resting, .glass-floating, .glass-overlay, .glass-card, .glass-specular-track, .dock-icon-button { --glass-rim-ink: hsl(0 0% 100% / 0.30); --glass-material-rim: inset 0 var(--glass-key-lit-y) 0 color-mix(in oklab, var(--glass-rim-ink), var(--glass-accent) var(--glass-accent-strength)), inset var(--glass-key-lit-x) 0 0 color-mix(in oklab, hsl(0 0% 100% / 0.18), var(--glass-accent) var(--glass-accent-strength)), var(--glass-rim-bottom); --glass-border-accent: color-mix( in oklab, var(--glass-border-rung, var(--glass-border)), var(--glass-accent) var(--glass-accent-strength) ); } .dark .glass-material, .dark .glass-wash, .dark .glass-quiet, .dark .glass-resting, .dark .glass-floating, .dark .glass-overlay, .dark .glass-card, .dark .glass-specular-track, .dark .dock-icon-button { --glass-rim-ink: hsl(0 0% 100% / 0.40); } }
+@layer components{:root{--glass-material-rim: var(--glass-rim-top),var(--glass-rim-bottom);}.glass-wash,.glass-quiet,.glass-resting,.glass-floating,.glass-overlay,.glass-card,.glass-specular-track,.dock-icon-button{--glass-border-accent: color-mix( in oklab,var(--glass-border-rung,var(--glass-border)),var(--glass-accent) var(--glass-accent-strength) );}}

package/dist/styles/glass/squircle.css

@@ -1 +1 @@
-@layer components { @supports (corner-shape: superellipse(2)) { .glass-floating.sheet-animate { corner-shape: var(--corner-shape-sheet); } .configurator { corner-shape: var(--corner-shape-panel); } } }
+@layer components{@supports (corner-shape: superellipse(2)){.glass-floating.sheet-animate{corner-shape: var(--corner-shape-sheet);}.configurator{corner-shape: var(--corner-shape-panel);}}}

package/dist/styles/glass/surface-axis.css

@@ -1 +1 @@
-@layer components { [data-grain="false"]::after { display: none; } [data-surface="veil"] { --veil-alpha: 44.3%; --veil-brightness: 1.02; --veil-color: color-mix( in oklab, var(--card), var(--glass-tint-source) var(--glass-tint-strength) ); --veil-bg: color-mix( in srgb, var(--veil-color) var(--veil-alpha), transparent ); --veil-clarity: blur( calc(var(--glass-blur-quiet-radius) * var(--glass-level)) ) saturate(var(--glass-saturate-quiet)) brightness(var(--veil-brightness)); --veil-border: none; --veil-shadow: none; --veil-feather: none; background: var(--veil-bg); -webkit-backdrop-filter: var(--veil-clarity); backdrop-filter: var(--veil-clarity); border: var(--veil-border); box-shadow: var(--veil-shadow); mask-image: var(--veil-feather); } :where(.dark) [data-surface="veil"] { --veil-alpha: 56%; --veil-brightness: 1.16; } [data-surface="opaque"] { --glass-level: 0; --glass-tint-strength: 0%; background: color-mix(in srgb, var(--card), transparent 0%); -webkit-backdrop-filter: none; backdrop-filter: none; } .paper-ink-mark { --paper-ink-mark-weight: 2px; --paper-ink-mark-color: var(--foreground); } .glass-well { --glass-well-tone: 8%; background: color-mix( in oklab, var(--card), var(--foreground) var(--glass-well-tone) ); box-shadow: inset 0 1px 2px color-mix(in srgb, var(--foreground) 8%, transparent); border-radius: var(--radius-md); } }
+@layer components{[data-surface="veil"]{--glass-veil-tier: var(--glass-veil-quiet);@apply glass-plate;--veil-clarity: blur( calc(var(--glass-blur-quiet-radius) * var(--glass-level)) ) saturate(var(--glass-saturate));--veil-border: none;--veil-shadow: none;--veil-feather: none;-webkit-backdrop-filter: var(--veil-clarity);backdrop-filter: var(--veil-clarity);border: var(--veil-border);box-shadow: var(--veil-shadow);mask-image: var(--veil-feather);}[data-surface="opaque"]{--glass-level: 0;background: color-mix(in srgb,var(--card),transparent 0%);-webkit-backdrop-filter: none;backdrop-filter: none;}.paper-ink-mark{--paper-ink-mark-weight: 2px;--paper-ink-mark-color: var(--foreground);}.glass-well{--glass-well-tone: 8%;background: color-mix( in oklab,var(--card),var(--foreground) var(--glass-well-tone) );box-shadow: inset 0 1px 2px color-mix(in srgb,var(--foreground) 8%,transparent);border-radius: var(--radius-md);}}

package/dist/styles/glass/surfaces-pager.css

@@ -1 +1 @@
-@layer components { .glass-pager-ring { display: inline-flex; align-items: center; gap: 0.375rem; padding-inline: 0.625rem; padding-block: 0.3125rem; border-radius: var(--radius-pill); background: color-mix( in oklab, var(--glass-bg-floating), var(--glass-tint-source) var(--glass-tint-strength) ); -webkit-backdrop-filter: var(--glass-cell-backdrop-filter, var(--glass-blur-floating)); backdrop-filter: var(--glass-cell-backdrop-filter, var(--glass-blur-floating)); box-shadow: var(--glass-edge-light), var(--glass-specular), 0 2px 6px -2px color-mix(in srgb, var(--shadow-color) 22%, transparent); transition: background-color var(--duration-fast) var(--ease-standard), box-shadow var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard); } .dark .glass-pager-ring { box-shadow: var(--glass-edge-light-dark), var(--glass-specular-dark), 0 2px 6px -2px color-mix(in srgb, var(--shadow-color) 30%, transparent); } @media (prefers-reduced-transparency: no-preference) { .glass-chromatic { box-shadow: var(--glass-edge-dispersion), var(--glass-material-rim); } } }
+@layer components{.glass-pager-ring{display: inline-flex;align-items: center;gap: var(--pager-rail-gap,var(--space-residue));padding-inline: var(--space-atom);padding-block: var(--space-residue);border-radius: var(--radius-pill);--glass-veil-tier: var(--glass-veil-floating);@apply glass-plate;-webkit-backdrop-filter: var(--glass-blur-floating);backdrop-filter: var(--glass-blur-floating);box-shadow: var(--glass-material-rim),0 2px 6px -2px color-mix(in srgb,var(--shadow-color) 22%,transparent);transition: background-color var(--duration-fast) var(--ease-standard),box-shadow var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard);}.dark .glass-pager-ring{box-shadow: var(--glass-material-rim),0 2px 6px -2px color-mix(in srgb,var(--shadow-color) 30%,transparent);}}

package/dist/styles/glass/surfaces.css

@@ -1 +1 @@
-@utility glass-fill { --glass-fill: color-mix( in oklab, var(--glass-fill-rung, var(--glass-bg-resting)), var(--glass-tint-source) var(--glass-tint-strength) ); background: var(--glass-fill); } @layer components { .glass-card { --card-focus-shadow: var(--shadow-card); --card-focus-border: var(--glass-border-quiet); position: relative; --glass-fill-rung: var(--glass-bg-quiet); @apply glass-fill; -webkit-backdrop-filter: var(--glass-cell-backdrop-filter, var(--glass-blur-quiet)); backdrop-filter: var(--glass-cell-backdrop-filter, var(--glass-blur-quiet)); --glass-border-rung: var(--card-focus-border); border: 1px solid var(--glass-border-accent); border-radius: var(--radius-card); box-shadow: var(--glass-material-rim), var(--card-focus-shadow); transition: box-shadow var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard); } .glass-card:has(:focus-visible) { --card-focus-shadow: var(--shadow-md); --card-focus-border: var(--glass-border-floating); } :where(.segmented-indicator, .glass-capsule) { --glass-bg-floating-tinted: color-mix( in oklab, var(--glass-bg-floating), var(--glass-tint-source) var(--glass-tint-strength) ); } }
+@layer components{.glass-card{--card-focus-shadow: var(--shadow-card);--card-focus-border: var(--glass-border-quiet);position: relative;@apply glass-plate;-webkit-backdrop-filter: var(--glass-blur-resting);backdrop-filter: var(--glass-blur-resting);--glass-border-rung: var(--card-focus-border);border: 1px solid var(--glass-border-accent);border-radius: var(--radius-card);box-shadow: var(--glass-material-rim),var(--card-focus-shadow);transition: box-shadow var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard);}.glass-card:has(:focus-visible){--card-focus-shadow: var(--shadow-md);--card-focus-border: var(--glass-border-floating);}:where(.segmented-indicator,.glass-capsule){--glass-veil-tier: var(--glass-veil-floating);@apply glass-plate;}}

package/dist/styles/glass/track-flow.css

@@ -0,0 +1 @@
+@layer components{.track-flow{--track-flow-peak: 0.12;--track-flow-floor: 0.3;}.track-flow::after{content: "";position: absolute;inset: 0;pointer-events: none;mix-blend-mode: plus-lighter;background-image: linear-gradient( 90deg,oklch(1 0 0 / 0) 0%,oklch(1 0 0 / var(--track-flow-peak)) 50%,oklch(1 0 0 / 0) 100% );background-size: 45% 100%;background-repeat: no-repeat;animation: track-flow var(--duration-shimmer-fast) linear infinite;}.track-flow[data-orientation="vertical"]::after{background-image: linear-gradient( 0deg,oklch(1 0 0 / 0) 0%,oklch(1 0 0 / var(--track-flow-peak)) 50%,oklch(1 0 0 / 0) 100% );background-size: 100% 45%;animation-name: track-flow-block;}@keyframes track-flow{from{background-position: -50% 0;opacity: var(--track-flow-floor);}50%{opacity: 1;}to{background-position: 150% 0;opacity: var(--track-flow-floor);}}@keyframes track-flow-block{from{background-position: 0 150%;opacity: var(--track-flow-floor);}50%{opacity: 1;}to{background-position: 0 -50%;opacity: var(--track-flow-floor);}}@media (prefers-reduced-motion: reduce){.track-flow::after,.track-flow[data-orientation="vertical"]::after{animation: none;background-position: 50% 50%;opacity: var(--track-flow-floor);}}}

package/dist/styles/glass/value-marks.css

@@ -0,0 +1 @@
+@layer components{.glass-value-marks{position: absolute;inset: 0;pointer-events: none;}.glass-value-mark{position: absolute;inset-block: 0;inset-inline-start: var(--value-mark-position);inline-size: 0;}.glass-value-marks[data-inverted] .glass-value-mark{inset-inline-start: auto;inset-inline-end: var(--value-mark-position);}.glass-value-marks[data-orientation="vertical"] .glass-value-mark{inset-inline: 0;inset-block-start: auto;inset-block-end: var(--value-mark-position);inline-size: 100%;block-size: 0;}.glass-value-marks[data-orientation="vertical"][data-inverted] .glass-value-mark{inset-block-start: var(--value-mark-position);inset-block-end: auto;}.glass-value-mark[data-consumed]{opacity: 0;}.glass-value-mark{transition: opacity var(--spring-dock-duration) var(--spring-dock);}@media (prefers-reduced-motion: reduce){.glass-value-mark{transition: none;}}.glass-value-mark::before{content: "";position: absolute;left: 50%;top: 50%;inline-size: var(--value-mark-size,0.375rem);block-size: var(--value-mark-size,0.375rem);border-radius: 50%;background: var( --value-mark-color,color-mix(in srgb,var(--foreground) 34%,transparent) );transform: translate(-50%,-50%);}}

package/dist/styles/glass/veil.css

@@ -0,0 +1 @@
+@utility glass-plate{--glass-veil-rest: clamp( var(--glass-veil-tier,var(--glass-veil-resting)),calc( var(--glass-veil-tier,var(--glass-veil-resting)) + 2 * var(--glass-veil-step) * max( 0,(var(--glass-backdrop-luma,0) - var(--glass-backdrop-luma-knee)) / (1 - var(--glass-backdrop-luma-knee)) ) ),calc( var(--glass-veil-tier,var(--glass-veil-resting)) + 2 * var(--glass-veil-step) ) );--glass-veil-rung: var(--glass-veil-rest);--glass-veil: color-mix( in srgb,oklch(from var(--glass-veil-ink) l c h / var(--glass-veil-rung)) calc(var(--glass-level) * 100%),var(--card) );background: var(--glass-veil);}@layer components{.glass-wash{--glass-veil-tier: var(--glass-veil-wash);--glass-grasp-radius: var(--glass-blur-wash-radius);--glass-grasp-rest-filter: var(--glass-blur-wash);}.glass-quiet{--glass-veil-tier: var(--glass-veil-quiet);--glass-grasp-radius: var(--glass-blur-quiet-radius);--glass-grasp-rest-filter: var(--glass-blur-quiet);}.glass-card,.glass-resting{--glass-veil-tier: var(--glass-veil-resting);--glass-grasp-radius: var(--glass-blur-resting-radius);--glass-grasp-rest-filter: var(--glass-blur-resting);}.glass-floating{--glass-veil-tier: var(--glass-veil-floating);--glass-grasp-radius: var(--glass-blur-floating-radius);--glass-grasp-rest-filter: var(--glass-blur-floating);}.glass-overlay{--glass-veil-tier: var(--glass-veil-overlay);--glass-grasp-radius: var(--glass-blur-overlay-radius);--glass-grasp-rest-filter: var(--glass-blur-overlay);}}

package/dist/styles/glass-specular-track.css

@@ -1 +1 @@
-@media (prefers-reduced-motion: reduce) { .glass-material::before, .glass-wash::before, .glass-quiet::before, .glass-resting::before, .glass-floating::before, .glass-overlay::before, .glass-card::before, .dock-icon-button::before, .glass-specular-track::before { --specular-x: 50%; --specular-y: 50%; --specular-angle: 0deg; transition: none; } } @media (prefers-reduced-transparency: reduce) { .glass-material::before, .glass-wash::before, .glass-quiet::before, .glass-resting::before, .glass-floating::before, .glass-overlay::before, .glass-card::before, .dock-icon-button::before, .glass-specular-track::before { display: none; } }
+@media (prefers-reduced-motion: reduce){.glass-wash::before,.glass-quiet::before,.glass-resting::before,.glass-floating::before,.glass-overlay::before,.glass-card::before,.dock-icon-button::before,.dock-tab-button::before,.dock-select-trigger::before,.dock-dropdown-trigger::before,.glass-specular-track::before{--specular-x: 50%;--specular-y: 50%;transition: none;}}@media (prefers-reduced-transparency: reduce){.glass-wash::before,.glass-quiet::before,.glass-resting::before,.glass-floating::before,.glass-overlay::before,.glass-card::before,.dock-icon-button::before,.dock-tab-button::before,.dock-select-trigger::before,.dock-dropdown-trigger::before,.glass-specular-track::before{display: none;}}

package/dist/styles/glass.css

@@ -1 +1 @@
-@import "./glass/material.css"; @import "./glass/ladder.css"; @import "./glass/ladder-undershadow.css"; @import "./glass/grain-overlay.css"; @import "./glass/accent-tone.css"; @import "./glass/rim.css"; @import "./glass/surfaces.css"; @import "./glass/surfaces-pager.css"; @import "./glass/control-surfaces.css"; @import "./glass/glass-capsule.css"; @import "./glass/liquid-fill.css"; @import "./glass/surface-axis.css"; @import "./glass/material-roles.css"; @import "./glass/reveal.css"; @import "./glass/liquid-enter.css"; @import "./glass/deep.css"; @import "./glass/defined.css"; @import "./glass/squircle.css";
+@import "./glass/material.css";@import "./glass/veil.css";@import "./glass/ladder.css";@import "./glass/ladder-undershadow.css";@import "../components/chip/accent-tone.css";@import "./glass/rim.css";@import "./glass/grasp.css";@import "./glass/focus-veil.css";@import "./glass/surfaces.css";@import "./glass/surfaces-pager.css";@import "./glass/control-surfaces.css";@import "./glass/control-bit.css";@import "./glass/control-edge.css";@import "./glass/glass-capsule.css";@import "./glass/glass-chip.css";@import "./glass/glass-atom.css";@import "./glass/mark.css";@import "./glass/liquid-fill.css";@import "./glass/value-marks.css";@import "./glass/track-flow.css";@import "./glass/surface-axis.css";@import "./glass/overlay-plate.css";@import "./glass/reveal.css";@import "./glass/liquid-enter.css";@import "./glass/dissolve.css";@import "./glass/deep.css";@import "./glass/defined.css";@import "./glass/squircle.css";

package/dist/styles/index.css

@@ -1 +1 @@
-@layer theme, base, components, utilities; @import "./tokens.css"; @import "./typography.css"; @import "./theme.css"; @import "./glass.css"; @import "./glass-specular-track.css"; @import "./glass-refract.css"; @import "./paper.css"; @import "../components/dark-mode-toggle/dark-mode-toggle.css"; @import "../components/header-ribbon/styles.css"; @import "../components/dock/styles/index.css"; @import "../components/dock/styles/controls.css"; @import "../components/card/styles.css"; @import "../components/_shared/feedback-tone.css"; @import "./transitions.css"; @import "./animations.css"; @import "./viz-reveal.css"; @import "./scroll-driven.css"; @import "./scroll-choreography.css"; @import "../components/card/card-scroll.css"; @import "./scroll-chrome.css"; @import "./view-transition.css"; @import "./utilities.css"; @import "../components/_shared/menu.css"; @import "../components/button/styles.css"; @import "../components/configurator/styles.css"; @import "../components/instrument-chassis/styles.css"; @import "../components/drawer/styles.css"; @import "../components/tabs/styles/segmented.css"; @import "../components/tabs/styles/drag.css"; @import "../components/_shared/field-surfaces.css"; @import "../components/dialog/placement.css"; @import "../components/metric/styles.css"; @import "../components/scroll-progress-rim/styles.css"; @import "../components/completion-seal/styles.css"; @import "./draw-in.css"; @import "../glass-ui.css"; @import "./components.css" layer(components); @import "./accessibility.css"; @source "../*.js";
+@layer theme,base,components,utilities;@import "./tokens.css";@import "./typography.css";@import "./theme.css";@import "./glass.css";@import "./track-well.css";@import "./glass-specular-track.css";@import "./paper.css";@import "../components/dark-mode-toggle/dark-mode-toggle.css";@import "../components/dock/styles/index.css";@import "../components/dock/styles/controls.css";@import "../components/card/styles.css";@import "../components/_shared/feedback/feedback-tone.css";@import "../components/_shared/feedback/dot-ring.css";@import "./transitions.css";@import "./animations.css";@import "./viz-reveal.css";@import "./scroll-driven.css";@import "./scroll-choreography.css";@import "../components/card/scroll.css";@import "./scroll-chrome.css";@import "./view-transition.css";@import "./utilities.css";@import "../components/_shared/menu/menu.css";@import "../components/button/styles.css";@import "../components/configurator/styles.css";@import "../components/tabs/styles/segmented.css";@import "../components/tabs/styles/drag.css";@import "../components/sheet/styles.css";@import "../components/dialog/styles.css";@import "../components/slider/styles.css";@import "../components/metric/styles.css";@import "../components/music-staff/styles.css";@import "../components/scroll-progress-rim/styles.css";@import "../components/deck/styles/index.css";@import "../components/carousel/styles.css";@import "../glass-ui.css";@import "./components.css" layer(components);@import "./accessibility.css";@source "../*.js";

package/dist/styles/paper.css

@@ -1 +1 @@
-:root { --paper-grain-tooth: repeating-linear-gradient( 28deg, oklch(0.9 0.045 84 / 0.5) 0, oklch(0.62 0.052 60 / 0.5) 1.4px, oklch(0.9 0.045 84 / 0.5) 2.8px ), repeating-linear-gradient( -64deg, oklch(0.88 0.04 82 / 0.38) 0, oklch(0.6 0.05 58 / 0.38) 1.75px, oklch(0.88 0.04 82 / 0.38) 3.5px ), repeating-linear-gradient( 10deg, oklch(0.85 0.05 78 / 0.28) 0, oklch(0.7 0.055 66 / 0.28) 3.5px, oklch(0.85 0.05 78 / 0.28) 7px ); --paper-grain-tile: 140px; --paper-grain-relief: none; } @supports (backdrop-filter: blur(1px)) { :root { --paper-grain-relief: url("data:image/svg+xml,%3Csvg width='120' height='120' viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='r' color-interpolation-filters='sRGB'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' seed='11' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='table' tableValues='0.31 0.96'/%3E%3CfeFuncG type='table' tableValues='0.25 0.9'/%3E%3CfeFuncB type='table' tableValues='0.15 0.78'/%3E%3CfeFuncA type='linear' slope='0.42' intercept='0.12'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23r)'/%3E%3C/svg%3E"); } } @utility paper-underpaint { position: fixed; inset: 0; z-index: -1; pointer-events: none; background-image: var(--paper-grain-relief), var(--paper-grain-tooth); background-repeat: repeat; background-size: var(--paper-grain-tile) var(--paper-grain-tile); opacity: var(--paper-grain-opacity, var(--glass-grain-opacity)); mix-blend-mode: multiply; } :where(.dark) .paper-underpaint, .dark .paper-underpaint { mix-blend-mode: screen; } @utility paper-grain-overlay { position: relative; isolation: isolate; &::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background-image: var(--paper-grain-relief), var(--paper-grain-tooth); background-repeat: repeat; background-size: var(--paper-grain-tile) var(--paper-grain-tile); opacity: var(--paper-grain-opacity, var(--glass-grain-opacity)); mix-blend-mode: multiply; } } :where(.dark) .paper-grain-overlay::after, .dark .paper-grain-overlay::after { mix-blend-mode: screen; } @media (prefers-reduced-transparency: reduce) { .paper-underpaint, .paper-grain-overlay::after { opacity: 0; } } @media (prefers-reduced-motion: reduce) { .paper-underpaint { animation: none !important; } } @media print { .paper-underpaint, .paper-grain-overlay::after { display: none; } }
+:root{--paper-grain-tooth: repeating-linear-gradient( 28deg,oklch(0.9 0.045 84 / 0.5) 0,oklch(0.62 0.052 60 / 0.5) 1.4px,oklch(0.9 0.045 84 / 0.5) 2.8px ),repeating-linear-gradient( -64deg,oklch(0.88 0.04 82 / 0.38) 0,oklch(0.6 0.05 58 / 0.38) 1.75px,oklch(0.88 0.04 82 / 0.38) 3.5px ),repeating-linear-gradient( 10deg,oklch(0.85 0.05 78 / 0.28) 0,oklch(0.7 0.055 66 / 0.28) 3.5px,oklch(0.85 0.05 78 / 0.28) 7px );--paper-grain-tile: 140px;--paper-grain-relief: none;}:root{--paper-grain-relief: url("data:image/svg+xml,%3Csvg width='120' height='120' viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='r' color-interpolation-filters='sRGB'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' seed='11' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='table' tableValues='0.31 0.96'/%3E%3CfeFuncG type='table' tableValues='0.25 0.9'/%3E%3CfeFuncB type='table' tableValues='0.15 0.78'/%3E%3CfeFuncA type='linear' slope='0.42' intercept='0.12'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23r)'/%3E%3C/svg%3E");}@utility paper-underpaint{position: fixed;inset: 0;z-index: -1;pointer-events: none;background-image: var(--paper-grain-relief),var(--paper-grain-tooth);background-repeat: repeat;background-size: var(--paper-grain-tile) var(--paper-grain-tile);opacity: var(--paper-grain-opacity,var(--glass-grain-opacity));mix-blend-mode: multiply;}:where(.dark) .paper-underpaint,.dark .paper-underpaint{mix-blend-mode: screen;}@utility paper-grain-overlay{position: relative;isolation: isolate;&::after{content: "";position: absolute;inset: 0;border-radius: inherit;pointer-events: none;background-image: var(--paper-grain-relief),var(--paper-grain-tooth);background-repeat: repeat;background-size: var(--paper-grain-tile) var(--paper-grain-tile);opacity: var(--paper-grain-opacity,var(--glass-grain-opacity));mix-blend-mode: multiply;}}:where(.dark) .paper-grain-overlay::after,.dark .paper-grain-overlay::after{mix-blend-mode: screen;}@layer components{.paper-grid{background-image: var(--paper-grid-texture);background-repeat: repeat;background-size: calc(var(--paper-grid-texture-size) * 4) calc(var(--paper-grid-texture-size) * 4),calc(var(--paper-grid-texture-size) * 4) calc(var(--paper-grid-texture-size) * 4),var(--paper-grid-texture-size) var(--paper-grid-texture-size),var(--paper-grid-texture-size) var(--paper-grid-texture-size);background-blend-mode: multiply;}.dark .paper-grid{background-blend-mode: screen;}@media (prefers-reduced-transparency: reduce){.paper-grid{background-image: none;}}}@media (prefers-reduced-transparency: reduce){.paper-underpaint,.paper-grain-overlay::after{opacity: 0;}}@media (prefers-reduced-motion: reduce){.paper-underpaint{animation: none !important;}}@media print{.paper-underpaint,.paper-grain-overlay::after{display: none;}}

package/dist/styles/scroll-choreography.css

@@ -1 +1 @@
-:root { --ease-scroll-spring: var(--spring-gentle); --scroll-pin-phase-reveal-end-frac: 0.382; --scroll-pin-phase-expand-end-frac: 0.9; --scroll-pin-squash-floor: 0.944; } @media (prefers-reduced-motion: no-preference) { @supports ((animation-timeline: view()) and (animation-range: entry)) { @keyframes gl-cascade-build { from { opacity: 0; transform: translateY(var(--scroll-cascade-rise, 1.25rem)); } to { opacity: 1; transform: translateY(0); } } .scroll-cascade > * { animation: gl-cascade-build auto var(--ease-scroll-spring, linear) both; animation-timeline: view(block); animation-range: entry 0% entry var(--scroll-cascade-range-end, 45%); } .scroll-cascade.scroll-cascade--inline > * { animation-timeline: view(inline); } @keyframes gl-cascade-build-col-even { from { opacity: 0; transform: translateY(calc(-1 * var(--scroll-cascade-rise, 1.25rem))); } to { opacity: 1; transform: translateY(0); } } .scroll-cascade.scroll-cascade--columns > * { animation-range: entry 0% entry calc( var(--scroll-cascade-range-end, 45%) + var(--scroll-cascade-column-stagger, 6%) * var(--col, 0) ); } .scroll-cascade.scroll-cascade--columns > *:nth-child(even) { animation-name: gl-cascade-build-col-even; } } } @property --pin-t { syntax: "<number>"; inherits: true; initial-value: 0; } .scroll-pin { position: relative; block-size: var(--scroll-pin-stage-height, 320vh); } .scroll-pin-stage { position: sticky; inset-block-start: 0; contain: layout paint; } @media (prefers-reduced-motion: no-preference) { .scroll-pin-stage .scroll-pin-phase-reveal { --t: clamp( 0, calc(var(--pin-t, 0) / var(--scroll-pin-phase-reveal-end-frac, 0.382)), 1 ); opacity: var(--t); translate: 0 calc((1 - var(--t)) * var(--scroll-pin-lift, 2.5rem)); scale: calc( var(--scroll-pin-squash-floor, 0.944) + (1 - var(--scroll-pin-squash-floor, 0.944)) * var(--t) ); will-change: transform, opacity; } .scroll-pin-stage .scroll-pin-phase-settle { --t: clamp( 0, calc( (var(--pin-t, 0) - var(--scroll-pin-phase-reveal-end-frac, 0.382)) / ( var(--scroll-pin-phase-expand-end-frac, 0.9) - var(--scroll-pin-phase-reveal-end-frac, 0.382) ) ), 1 ); opacity: 1; translate: 0 calc(var(--t) * -1 * var(--scroll-pin-lift, 2.5rem)); scale: calc(1 + 0.02 * var(--t)); } } @media (prefers-reduced-motion: no-preference) { .smooth-scroll { scroll-behavior: smooth; } }
+:root{--ease-scroll-spring: var(--spring-world);}@media (prefers-reduced-motion: no-preference){@supports ((animation-timeline: view()) and (animation-range: entry)){@keyframes gl-cascade-build{from{opacity: 0;transform: translateY(var(--scroll-cascade-rise,1.25rem));}to{opacity: 1;transform: translateY(0);}}.scroll-cascade > *{animation: gl-cascade-build auto var(--ease-scroll-spring,linear) both;animation-timeline: view(block);animation-range: entry 0% entry var(--scroll-cascade-range-end,45%);}.scroll-cascade.scroll-cascade--inline > *{animation-timeline: view(inline);}@keyframes gl-cascade-build-col-even{from{opacity: 0;transform: translateY(calc(-1 * var(--scroll-cascade-rise,1.25rem)));}to{opacity: 1;transform: translateY(0);}}.scroll-cascade.scroll-cascade--columns > *{animation-range: entry 0% entry calc( var(--scroll-cascade-range-end,45%) + var(--scroll-cascade-column-stagger,6%) * var(--col,0) );}.scroll-cascade.scroll-cascade--columns > *:nth-child(even){animation-name: gl-cascade-build-col-even;}}}@media (prefers-reduced-motion: no-preference){.smooth-scroll{scroll-behavior: smooth;}}

package/dist/styles/scroll-chrome.css

@@ -1 +1 @@
-:root { --chrome-shrink-depth: 0.12; --chrome-rise-px: 6px; --chrome-fade-depth: 0.28; --chrome-shadow-lift: 18%; } @media (prefers-reduced-motion: no-preference) { .scroll-chrome { transform: scale(calc(1 - var(--chrome-collapse-t) * var(--chrome-shrink-depth))) translateY(calc(var(--chrome-collapse-t) * var(--chrome-rise-px) * -1)); transform-origin: top center; opacity: calc(1 - var(--chrome-collapse-t) * var(--chrome-fade-depth)); will-change: transform, opacity; } } .scroll-chrome { box-shadow: 0 calc(2px + var(--chrome-collapse-t) * 6px) calc(8px + var(--chrome-collapse-t) * 12px) color-mix( in srgb, var(--shadow-color) calc(6% + var(--chrome-collapse-t) * var(--chrome-shadow-lift)), transparent ); } @media (prefers-reduced-motion: no-preference) { @supports (animation-timeline: scroll()) { @keyframes gl-chrome-collapse { from { --chrome-collapse-t: 0; } to { --chrome-collapse-t: 1; } } .scroll-chrome--native { animation: gl-chrome-collapse auto linear both; animation-timeline: scroll(self block); } } }
+:root{--chrome-shrink-depth: 0.12;--chrome-rise-px: 6px;--chrome-fade-depth: 0.28;--chrome-shadow-lift: 18%;}@media (prefers-reduced-motion: no-preference){.scroll-chrome{transform: scale(calc(1 - var(--chrome-collapse-t) * var(--chrome-shrink-depth))) translateY(calc(var(--chrome-collapse-t) * var(--chrome-rise-px) * -1));transform-origin: top center;opacity: calc(1 - var(--chrome-collapse-t) * var(--chrome-fade-depth));will-change: transform,opacity;}}.scroll-chrome{box-shadow: 0 calc(2px + var(--chrome-collapse-t) * 6px) calc(8px + var(--chrome-collapse-t) * 12px) color-mix( in srgb,var(--shadow-color) calc(6% + var(--chrome-collapse-t) * var(--chrome-shadow-lift)),transparent );}@media (prefers-reduced-motion: no-preference){@supports (animation-timeline: scroll()){@keyframes gl-chrome-collapse{from{--chrome-collapse-t: 0;}to{--chrome-collapse-t: 1;}}.scroll-chrome--native{animation: gl-chrome-collapse auto linear both;animation-timeline: scroll(self block);}}}

package/dist/styles/scroll-driven.css

@@ -1 +1 @@
-.scroll-progress { transform-origin: 0 50%; transform: scaleX(0); } @media (prefers-reduced-motion: no-preference) { @supports (animation-timeline: scroll()) { @keyframes gl-scroll-grow { from { transform: scaleX(0); } to { transform: scaleX(1); } } .scroll-progress { animation: gl-scroll-grow auto linear; animation-timeline: var(--scroll-progress-timeline, scroll(nearest block)); } } } @media (prefers-reduced-motion: no-preference) { @supports ((animation-timeline: view()) and (animation-range: entry)) { @keyframes gl-reveal-in { from { opacity: 0; transform: translateY(var(--scroll-reveal-rise, 6px)); } } [data-scroll-reveal] > * { animation: gl-reveal-in auto linear both; animation-timeline: view(block); animation-range: entry 0% entry var(--scroll-reveal-range-end, 60%); } [data-scroll-reveal].scroll-reveal--inline > * { animation-timeline: view(inline); } } }
+.scroll-progress{transform-origin: 0 50%;transform: scaleX(0);}@media (prefers-reduced-motion: no-preference){@supports (animation-timeline: scroll()){@keyframes gl-scroll-grow{from{transform: scaleX(0);}to{transform: scaleX(1);}}.scroll-progress{animation: gl-scroll-grow auto linear;animation-timeline: var(--scroll-progress-timeline,scroll(nearest block));}}}@media (prefers-reduced-motion: no-preference){@supports ((animation-timeline: view()) and (animation-range: entry)){@keyframes gl-reveal-in{from{opacity: 0;transform: translateY(var(--scroll-reveal-rise,6px));}}[data-scroll-reveal] > *{animation: gl-reveal-in auto linear both;animation-timeline: view(block);animation-range: entry 0% entry var(--scroll-reveal-range-end,60%);}[data-scroll-reveal].scroll-reveal--inline > *{animation-timeline: view(inline);}}}

package/dist/styles/theme/bridges.css

@@ -1 +1 @@
-@theme inline { --text-admin-label: var(--type-admin-label); --text-micro: var(--type-micro); --text-caption: var(--type-caption); --text-small: var(--type-small); --text-body: var(--type-body); --text-prose: var(--type-prose); --text-subheading: var(--type-subheading); --text-heading: var(--type-heading); --text-title: var(--type-title); --text-dropdown: var(--dropdown-text); --text-dropdown-secondary: var(--dropdown-text-secondary); --text-display: var(--type-display-1); --text-display-1: var(--type-display-1); --text-display-2: var(--type-display-2); --text-display-3: var(--type-display-3); --text-display-4: var(--type-display-4); --text-display-5: var(--type-display-5); --leading-micro: var(--type-leading-micro); --leading-caption: var(--type-leading-caption); --leading-small: var(--type-leading-small); --leading-body: var(--type-leading-body); --leading-prose: var(--type-leading-prose); --leading-heading: var(--type-leading-heading); --leading-display: var(--type-leading-display); --tracking-tight: var(--type-tracking-tight); --tracking-display: var(--type-tracking-display); --tracking-snug: var(--type-tracking-snug); --tracking-normal: var(--type-tracking-normal); --tracking-wide: var(--type-tracking-wide); --tracking-wider: var(--type-tracking-wider); --tracking-caps: var(--type-tracking-caps); --font-text: var(--font-stack-text); --font-display: var(--font-stack-display); --font-serif: var(--font-stack-text); --font-sans: var(--font-stack-sans); --font-mono: var(--font-stack-mono); --color-border: var(--border); --color-border-soft: var(--border-soft); --color-input: var(--input); --color-background: var(--background); --color-foreground: var(--foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-muted-foreground-strong: var(--muted-foreground-strong); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-surface-public-data-panel: var(--surface-public-data-panel); --color-shadow: var(--shadow); --color-success-foreground: var(--success-foreground); --color-warning-foreground: var(--warning-foreground); --color-info-foreground: var(--info-foreground); --color-muted-soft: var(--muted-soft); --color-muted-medium: var(--muted-medium); --color-glass-quiet: var(--glass-bg-quiet); --color-glass-border-quiet: var(--glass-border-quiet); --color-surface-tint-4: var(--surface-tint-4); --color-surface-tint-6: var(--surface-tint-6); --color-surface-tint-8: var(--surface-tint-8); --color-surface-tint-10: var(--surface-tint-10); --color-surface-tint-12: var(--surface-tint-12); --color-surface-tint-15: var(--surface-tint-15); --color-surface-tint-18: var(--surface-tint-18); --color-surface-tint-22: var(--surface-tint-22); --color-surface-tint-25: var(--surface-tint-25); --color-surface-tint-35: var(--surface-tint-35); --color-surface-tint-40: var(--surface-tint-40); --color-surface-tint-70: var(--surface-tint-70); --color-surface-tint-quiet: var(--surface-tint-6); --color-surface-tint-floating: var(--surface-tint-12); --color-surface-tint-modal: var(--surface-tint-18); --color-overlay-scrim: var(--overlay-scrim); --color-overlay-scrim-strong: var(--overlay-scrim-strong); --color-overlay-scrim-subtle: var(--overlay-scrim-subtle); --color-section-0: var(--section-color-0); --color-section-1: var(--section-color-1); --color-section-2: var(--section-color-2); --color-section-3: var(--section-color-3); --color-section-4: var(--section-color-4); --color-section-5: var(--section-color-5); --color-section-6: var(--section-color-6); --color-section-7: var(--section-color-7); --color-section-8: var(--section-color-8); --color-section-9: var(--section-color-9); --color-section-10: var(--section-color-10); --color-section-11: var(--section-color-11); --color-section-12: var(--section-color-12); --color-section-heading: var(--section-heading); --color-accent-pink: var(--accent-pink); --color-accent-red: var(--accent-red); --color-viz-fourier: var(--viz-fourier); --color-viz-chebyshev: var(--viz-chebyshev); --color-viz-legendre: var(--viz-legendre); --color-viz-amber: var(--viz-amber); --color-viz-green: var(--viz-green); --color-tier-featured: var(--tier-featured); --color-tier-saved: var(--tier-saved); --color-like: var(--like); --color-success: var(--success); --color-warning: var(--warning); --color-info: var(--info); --color-delete: var(--delete); --color-gold: var(--gold); --color-gold-light: var(--gold-light); --color-gold-dark: var(--gold-dark); --color-gold-deep: var(--gold-deep); --color-silver: var(--silver); --color-silver-light: var(--silver-light); --color-silver-dark: var(--silver-dark); --color-silver-deep: var(--silver-deep); --color-bronze: var(--bronze); --color-bronze-light: var(--bronze-light); --color-bronze-dark: var(--bronze-dark); --color-bronze-deep: var(--bronze-deep); --color-rainbow-red: var(--rainbow-red); --color-rainbow-orange: var(--rainbow-orange); --color-rainbow-yellow: var(--rainbow-yellow); --color-rainbow-green: var(--rainbow-green); --color-rainbow-blue: var(--rainbow-blue); --color-rainbow-indigo: var(--rainbow-indigo); --color-rainbow-violet: var(--rainbow-violet); --z-index-behind: var(--z-behind); --z-index-background: var(--z-background); --z-index-content: var(--z-content); --z-index-controls: var(--z-controls); --z-index-bar: var(--z-bar); --z-index-header: var(--z-header); --z-index-dock: var(--z-dock); --z-index-panel: var(--z-panel); --z-index-overlay: var(--z-overlay); --z-index-hovercard: var(--z-hovercard); --z-index-tooltip: var(--z-tooltip); --z-index-popover: var(--z-popover); --z-index-modal: var(--z-modal); --z-index-fullscreen: var(--z-fullscreen); --z-index-toast: var(--z-toast); --z-index-toggle: var(--z-toggle); --z-index-max: var(--z-max); --height-chart-compact: var(--chart-height-compact); --height-chart-default: var(--chart-height-default); --height-chart-large: var(--chart-height-large); --min-width-input-sm: var(--input-min-width-sm); --spacing-chart-margin: var(--chart-margin); --width-popover: var(--popover-width); --spacing-phi-5: var(--space-phi-5); --spacing-phi-6: var(--space-phi-6); --spacing-icon-xs: var(--icon-xs); --spacing-icon-sm: var(--icon-sm); --spacing-icon-md: var(--icon-md); --spacing-icon-lg: var(--icon-lg); --spacing-icon-xl: var(--icon-xl); --spacing-icon-2xl: var(--icon-2xl); --spacing-icon-3xl: var(--icon-3xl); --spacing-icon-hero: var(--icon-hero); --shadow-glass-wash: var(--glass-shadow-wash); --shadow-glass-quiet: var(--glass-shadow-quiet); --shadow-glass-resting: var(--glass-shadow-resting); --shadow-glass-floating: var(--glass-shadow-floating); --shadow-glass-overlay: var(--glass-shadow-overlay); --shadow-focus-ring: var(--focus-ring-shadow); --blur-glass-wash: var(--glass-blur-wash-radius); --blur-glass-quiet: var(--glass-blur-quiet-radius); --blur-glass-resting: var(--glass-blur-resting-radius); --blur-glass-floating: var(--glass-blur-floating-radius); --blur-glass-overlay: var(--glass-blur-overlay-radius); --ease-spring-smooth: var(--spring-smooth); --ease-spring-snappy: var(--spring-snappy); --ease-spring-bouncy: var(--spring-bouncy); --ease-spring-gentle: var(--spring-gentle); --ease-spring-press: var(--spring-press); --ease-standard: var(--motion-ease-standard); --ease-out: var(--motion-ease-out); --ease-in: var(--motion-ease-in); --ease-out-expo: var(--motion-ease-out-expo); --ease-apple: var(--motion-ease-apple); --ease-spring: var(--spring-snappy); --ease-decelerate: var(--motion-ease-out); --ease-accelerate: var(--motion-ease-in); --transition-duration-instant: var(--duration-instant); --transition-duration-fast: var(--duration-fast); --transition-duration-normal: var(--duration-normal); --transition-duration-slow: var(--duration-slow); --transition-duration-panel: var(--duration-panel); --transition-duration-xl: var(--duration-xl); --transition-duration-xxl: var(--duration-xxl); --transition-duration-control: var(--duration-control); }
+@theme inline{--text-sm: initial;--text-xs: initial;--text-micro: var(--type-micro);--text-caption: var(--type-caption);--text-small: var(--type-small);--text-body: var(--type-body);--text-prose: var(--type-prose);--text-subheading: var(--type-subheading);--text-heading: var(--type-heading);--text-title: var(--type-title);--text-dropdown: var(--dropdown-text);--text-dropdown-secondary: var(--dropdown-text-secondary);--text-display: var(--type-display-1);--text-display-1: var(--type-display-1);--text-display-2: var(--type-display-2);--text-display-3: var(--type-display-3);--text-display-4: var(--type-display-4);--text-display-5: var(--type-display-5);--leading-micro: var(--type-leading-micro);--leading-caption: var(--type-leading-caption);--leading-small: var(--type-leading-small);--leading-body: var(--type-leading-body);--leading-prose: var(--type-leading-prose);--leading-heading: var(--type-leading-heading);--leading-display: var(--type-leading-display);--tracking-tight: var(--type-tracking-tight);--tracking-display: var(--type-tracking-display);--tracking-snug: var(--type-tracking-snug);--tracking-normal: var(--type-tracking-normal);--tracking-wide: var(--type-tracking-wide);--tracking-wider: var(--type-tracking-wider);--tracking-caps: var(--type-tracking-caps);--font-text: var(--font-stack-text);--font-display: var(--font-stack-display);--font-serif: var(--font-stack-text);--font-sans: var(--font-stack-sans);--font-mono: var(--font-stack-mono);--color-border: var(--border);--color-border-soft: var(--border-soft);--color-input: var(--input);--color-background: var(--background);--color-foreground: var(--foreground);--color-primary: var(--primary);--color-primary-foreground: var(--primary-foreground);--color-secondary: var(--secondary);--color-secondary-foreground: var(--secondary-foreground);--color-muted: var(--muted);--color-muted-foreground: var(--muted-foreground);--color-muted-foreground-strong: var(--muted-foreground-strong);--color-accent: var(--accent);--color-accent-foreground: var(--accent-foreground);--color-destructive: var(--destructive);--color-destructive-foreground: var(--destructive-foreground);--color-popover: var(--popover);--color-popover-foreground: var(--popover-foreground);--color-card: var(--card);--color-card-foreground: var(--card-foreground);--color-surface-public-data-panel: var(--surface-public-data-panel);--color-shadow: var(--shadow);--color-success-foreground: var(--success-foreground);--color-warning-foreground: var(--warning-foreground);--color-info-foreground: var(--info-foreground);--color-muted-soft: var(--muted-soft);--color-muted-medium: var(--muted-medium);--color-glass-quiet: var(--glass-plate-quiet);--color-glass-border-quiet: var(--glass-border-quiet);--color-surface-tint-4: var(--surface-tint-4);--color-surface-tint-6: var(--surface-tint-6);--color-surface-tint-8: var(--surface-tint-8);--color-surface-tint-10: var(--surface-tint-10);--color-surface-tint-12: var(--surface-tint-12);--color-surface-tint-15: var(--surface-tint-15);--color-surface-tint-18: var(--surface-tint-18);--color-surface-tint-22: var(--surface-tint-22);--color-surface-tint-25: var(--surface-tint-25);--color-surface-tint-40: var(--surface-tint-40);--color-surface-tint-70: var(--surface-tint-70);--color-surface-tint-quiet: var(--surface-tint-6);--color-surface-tint-floating: var(--surface-tint-12);--color-surface-tint-modal: var(--surface-tint-18);--color-overlay-scrim: var(--overlay-scrim);--color-overlay-scrim-strong: var(--overlay-scrim-strong);--color-overlay-scrim-subtle: var(--overlay-scrim-subtle);--color-section-0: var(--section-color-0);--color-section-1: var(--section-color-1);--color-section-2: var(--section-color-2);--color-section-3: var(--section-color-3);--color-section-4: var(--section-color-4);--color-section-5: var(--section-color-5);--color-section-6: var(--section-color-6);--color-section-7: var(--section-color-7);--color-section-8: var(--section-color-8);--color-section-9: var(--section-color-9);--color-section-10: var(--section-color-10);--color-section-11: var(--section-color-11);--color-section-12: var(--section-color-12);--color-section-heading: var(--section-heading);--color-accent-pink: var(--accent-pink);--color-accent-red: var(--accent-red);--color-viz-fourier: var(--viz-fourier);--color-viz-chebyshev: var(--viz-chebyshev);--color-viz-legendre: var(--viz-legendre);--color-viz-amber: var(--viz-amber);--color-viz-green: var(--viz-green);--color-tier-featured: var(--tier-featured);--color-tier-saved: var(--tier-saved);--color-like: var(--like);--color-success: var(--success);--color-warning: var(--warning);--color-info: var(--info);--color-delete: var(--delete);--color-gold: var(--gold);--color-gold-light: var(--gold-light);--color-gold-dark: var(--gold-dark);--color-gold-deep: var(--gold-deep);--color-silver: var(--silver);--color-silver-light: var(--silver-light);--color-silver-dark: var(--silver-dark);--color-silver-deep: var(--silver-deep);--color-bronze: var(--bronze);--color-bronze-light: var(--bronze-light);--color-bronze-dark: var(--bronze-dark);--color-bronze-deep: var(--bronze-deep);--color-rainbow-red: var(--rainbow-red);--color-rainbow-orange: var(--rainbow-orange);--color-rainbow-yellow: var(--rainbow-yellow);--color-rainbow-green: var(--rainbow-green);--color-rainbow-blue: var(--rainbow-blue);--color-rainbow-indigo: var(--rainbow-indigo);--color-rainbow-violet: var(--rainbow-violet);--z-index-behind: var(--z-behind);--z-index-background: var(--z-background);--z-index-content: var(--z-content);--z-index-controls: var(--z-controls);--z-index-bar: var(--z-bar);--z-index-header: var(--z-header);--z-index-dock: var(--z-dock);--z-index-panel: var(--z-panel);--z-index-overlay: var(--z-overlay);--z-index-tooltip: var(--z-tooltip);--z-index-popover: var(--z-popover);--z-index-modal: var(--z-modal);--z-index-fullscreen: var(--z-fullscreen);--z-index-toast: var(--z-toast);--z-index-toggle: var(--z-toggle);--z-index-max: var(--z-max);--height-chart-compact: var(--chart-height-compact);--height-chart-default: var(--chart-height-default);--height-chart-large: var(--chart-height-large);--min-width-input-sm: var(--input-min-width-sm);--spacing-chart-margin: var(--chart-margin);--width-popover: var(--popover-width);--spacing-phi-5: var(--space-phi-5);--spacing-phi-6: var(--space-phi-6);--spacing-residue: var(--space-residue);--spacing-atom: var(--space-atom);--spacing-body: var(--space-body);--spacing-family: var(--space-family);--spacing-section: var(--space-section);--spacing-page: var(--space-page);--spacing-icon-xs: var(--icon-xs);--spacing-icon-sm: var(--icon-sm);--spacing-icon-md: var(--icon-md);--spacing-icon-lg: var(--icon-lg);--spacing-icon-xl: var(--icon-xl);--spacing-icon-2xl: var(--icon-2xl);--spacing-icon-3xl: var(--icon-3xl);--spacing-icon-hero: var(--icon-hero);--shadow-glass-wash: var(--glass-shadow-wash);--shadow-glass-quiet: var(--glass-shadow-quiet);--shadow-glass-resting: var(--glass-shadow-resting);--shadow-glass-floating: var(--glass-shadow-floating);--shadow-glass-overlay: var(--glass-shadow-overlay);--shadow-focus-ring: var(--focus-ring-shadow);--blur-glass-wash: var(--glass-blur-wash-radius);--blur-glass-quiet: var(--glass-blur-quiet-radius);--blur-glass-resting: var(--glass-blur-resting-radius);--blur-glass-floating: var(--glass-blur-floating-radius);--blur-glass-overlay: var(--glass-blur-overlay-radius);--ease-standard: var(--motion-ease-standard);--ease-out: var(--motion-ease-out);--ease-in: var(--motion-ease-in);--ease-out-expo: var(--motion-ease-out-expo);--ease-apple: var(--motion-ease-apple);--ease-decelerate: var(--motion-ease-out);--ease-accelerate: var(--motion-ease-in);--transition-duration-instant: var(--duration-instant);--transition-duration-fast: var(--duration-fast);--transition-duration-normal: var(--duration-normal);--transition-duration-slow: var(--duration-slow);--transition-duration-panel: var(--duration-panel);--transition-duration-xl: var(--duration-xl);--transition-duration-xxl: var(--duration-xxl);--transition-duration-control: var(--duration-control);}

package/dist/styles/theme/dark.css

@@ -1 +1 @@
-@variant dark (&:where(.dark, .dark *));
+@variant dark (&:where(.dark,.dark *));

package/dist/styles/theme/literals.css

@@ -1 +1 @@
-@theme { --animate-tooltip-in: tooltip-in var(--duration-fast) var(--ease-out); --animate-fade-in: fade-in var(--duration-normal) var(--spring-smooth); --animate-scale-in: scale-in var(--duration-normal) var(--spring-smooth); --animate-slide-up: slide-up var(--duration-normal) var(--spring-smooth); --animate-dock-in: dock-in var(--duration-panel) var(--spring-snappy) both; --animate-shimmer: shimmer var(--duration-shimmer-fast) linear infinite; --animate-shimmer-sweep: shimmer-sweep var(--duration-shimmer) ease-in-out infinite; --animate-gold-shimmer: metal-shimmer-sweep var(--duration-shimmer) linear infinite; --animate-metal: metal-shimmer-sweep var(--duration-metal) linear infinite; --animate-shake: shake 0.5s ease-in-out; --opacity-disabled: 0.5; --opacity-icon-muted: 0.8; --text-shadow-2xs: 0 1px 0 color-mix(in srgb, var(--shadow-color) 12%, transparent); --text-shadow-xs: 0 1px 1px color-mix(in srgb, var(--shadow-color) 16%, transparent); --text-shadow-sm: 0 1px 0 color-mix(in srgb, var(--shadow-color) 14%, transparent), 0 2px 3px color-mix(in srgb, var(--shadow-color) 18%, transparent); --text-shadow-md: 0 1px 0 color-mix(in srgb, var(--shadow-color) 16%, transparent), 0 2px 4px color-mix(in srgb, var(--shadow-color) 20%, transparent), 0 4px 8px color-mix(in srgb, var(--shadow-color) 14%, transparent); --text-shadow-lg: 0 1px 0 color-mix(in srgb, var(--shadow-color) 18%, transparent), 0 2px 4px color-mix(in srgb, var(--shadow-color) 22%, transparent), 0 6px 12px color-mix(in srgb, var(--shadow-color) 18%, transparent); --text-shadow-depth: 1px 1px 0 var(--shadow), 2px 2px 0 var(--shadow), 3px 3px 0 var(--shadow), 4px 4px 0 var(--shadow), 5px 5px 0 var(--shadow), 5px 5px 1px color-mix(in srgb, var(--shadow-color) 10%, transparent), 2px 2px 2px color-mix(in srgb, var(--shadow-color) 20%, transparent), 4px 4px 5px color-mix(in srgb, var(--shadow-color) 25%, transparent), 6px 6px 10px color-mix(in srgb, var(--shadow-color) 15%, transparent); --text-shadow-engraved: 0 1px 0 color-mix(in srgb, var(--background) 30%, transparent), 0 -1px 0 var(--surface-tint-8); }
+@theme{--animate-tooltip-in: tooltip-in var(--duration-fast) var(--ease-out);--animate-fade-in: fade-in var(--spring-present-duration) var(--spring-present);--animate-scale-in: scale-in var(--spring-present-duration) var(--spring-present);--animate-slide-up: slide-up var(--spring-present-duration) var(--spring-present);--animate-dock-in: dock-in var(--spring-dock-duration) var(--spring-dock) both;--animate-shimmer: shimmer var(--duration-shimmer-fast) linear infinite;--animate-shimmer-sweep: shimmer-sweep var(--duration-shimmer) ease-in-out infinite;--animate-gold-shimmer: metal-shimmer-sweep var(--duration-shimmer) linear infinite;--animate-metal: metal-shimmer-sweep var(--duration-metal) linear infinite;--animate-shake: shake 0.5s ease-in-out;--opacity-disabled: 0.5;--opacity-icon-muted: 0.8;--text-shadow-2xs: 0 1px 0 color-mix(in srgb,var(--shadow-color) 12%,transparent);--text-shadow-xs: 0 1px 1px color-mix(in srgb,var(--shadow-color) 16%,transparent);--text-shadow-sm: 0 1px 0 color-mix(in srgb,var(--shadow-color) 14%,transparent),0 2px 3px color-mix(in srgb,var(--shadow-color) 18%,transparent);--text-shadow-md: 0 1px 0 color-mix(in srgb,var(--shadow-color) 16%,transparent),0 2px 4px color-mix(in srgb,var(--shadow-color) 20%,transparent),0 4px 8px color-mix(in srgb,var(--shadow-color) 14%,transparent);--text-shadow-lg: 0 1px 0 color-mix(in srgb,var(--shadow-color) 18%,transparent),0 2px 4px color-mix(in srgb,var(--shadow-color) 22%,transparent),0 6px 12px color-mix(in srgb,var(--shadow-color) 18%,transparent);--text-shadow-depth: 1px 1px 0 var(--shadow),2px 2px 0 var(--shadow),3px 3px 0 var(--shadow),4px 4px 0 var(--shadow),5px 5px 0 var(--shadow),5px 5px 1px color-mix(in srgb,var(--shadow-color) 10%,transparent),2px 2px 2px color-mix(in srgb,var(--shadow-color) 20%,transparent),4px 4px 5px color-mix(in srgb,var(--shadow-color) 25%,transparent),6px 6px 10px color-mix(in srgb,var(--shadow-color) 15%,transparent);--text-shadow-engraved: 0 1px 0 color-mix(in srgb,var(--background) 30%,transparent),0 -1px 0 var(--surface-tint-8);}

package/dist/styles/theme/radius.css

@@ -1 +1 @@
-@theme { --radius: 0.625rem; --radius-xs: 4px; --radius-sm: 4px; --radius-md: 6px; --radius-xl: 12px; --radius-2xl: 1rem; --radius-3xl: 1.5rem; --radius-pill: 9999px; --radius-lg: var(--radius); --radius-card: var(--radius-2xl); --radius-panel: var(--radius-xl); --radius-dialog: var(--radius-card); --radius-input: var(--radius); --radius-button: var(--radius); --radius-field: var(--radius-2xl); --radius-strip: 0.75rem; --radius-control: var(--radius-pill); --radius-badge: var(--radius-pill); --radius-dock: var(--radius-pill); --radius-tab: var(--radius-pill); --radius-dock-card: var(--radius-3xl); --radius-tooltip: var(--radius-lg); --radius-floor: var(--radius-xs); --radius-ctx: var(--radius-card); --radius-inset: 0px; --corner-k-squircle: 2; --corner-k-soft: 1.7; --corner-k-sharp: 2.4; --corner-shape-bigdock: superellipse(var(--corner-k-squircle)); --corner-shape-sheet: superellipse(var(--corner-k-squircle)); --corner-shape-panel: superellipse(var(--corner-k-squircle)); --corner-shape-thumb: superellipse(var(--corner-k-squircle)); }
+@theme static{--radius: 0.625rem;--radius-xs: 4px;--radius-sm: 4px;--radius-md: 6px;--radius-xl: 12px;--radius-2xl: 1rem;--radius-3xl: 1.5rem;--radius-pill: 9999px;--radius-lg: var(--radius);--radius-card: var(--radius-2xl);--radius-panel: var(--radius-xl);--radius-dialog: var(--radius-card);--radius-media: var(--radius);--radius-button: var(--radius);--radius-field: var(--radius-2xl);--radius-strip: 0.75rem;--radius-control: var(--radius-pill);--radius-badge: var(--radius-pill);--radius-dock: var(--radius-pill);--radius-tab: var(--radius-pill);--radius-dock-card: var(--radius-3xl);--radius-floor: var(--radius-xs);--radius-ctx: var(--radius-card);--radius-inset: 0px;--corner-k-squircle: 2;--corner-shape-bigdock: superellipse(var(--corner-k-squircle));--corner-shape-sheet: superellipse(var(--corner-k-squircle));--corner-shape-panel: superellipse(var(--corner-k-squircle));--corner-shape-thumb: superellipse(var(--corner-k-squircle));}

package/dist/styles/theme.css

@@ -1 +1 @@
-@import "./theme/radius.css"; @import "./theme/bridges.css"; @import "./theme/literals.css"; @import "./theme/dark.css";
+@import "./theme/radius.css";@import "./theme/bridges.css";@import "./theme/literals.css";@import "./theme/dark.css";

package/dist/styles/tokens/color-radius.css

@@ -1 +1 @@
-:root { --neutral-0: hsl(40 30% 98%); --neutral-1: hsl(38 26% 95%); --neutral-2: hsl(34 28% 90%); --neutral-3: hsl(33 30% 82%); --neutral-4: hsl(32 26% 70%); --neutral-5: hsl(30 22% 40%); --neutral-6: hsl(28 24% 30%); --background: var(--neutral-0); --foreground: hsl(24 10% 10%); --card: hsl(30 85% 96%); --card-foreground: var(--foreground); --popover: var(--card); --popover-foreground: var(--foreground); --surface-public-data-panel: hsl(44 16% 96%); --muted: var(--neutral-1); --muted-foreground: var(--neutral-5); --muted-foreground-strong: var(--neutral-6); --secondary: var(--neutral-2); --secondary-foreground: var(--foreground); --accent: var(--neutral-3); --accent-foreground: var(--foreground); --border: var(--neutral-4); --input: var(--neutral-4); --primary: hsl(24 10% 10%); --primary-foreground: var(--neutral-0); --destructive: hsl(0 72% 50%); --destructive-foreground: var(--neutral-0); --focus-ring-color: hsl(24 10% 10%); --shadow: hsl(24 10% 10%); --shadow-color: var(--foreground); --accent-color: var(--primary); --border-soft: color-mix(in srgb, var(--border) 45%, transparent); --separator-ink: color-mix(in srgb, var(--foreground) 22%, transparent); --scrollbar-thumb: color-mix(in srgb, var(--muted-foreground) 25%, transparent); --scrollbar-track: transparent; --surface-tint-4: color-mix(in srgb, var(--foreground) 4%, transparent); --surface-tint-6: color-mix(in srgb, var(--foreground) 6%, transparent); --surface-tint-8: color-mix(in srgb, var(--foreground) 8%, transparent); --surface-tint-10: color-mix(in srgb, var(--foreground) 10%, transparent); --surface-tint-12: color-mix(in srgb, var(--foreground) 12%, transparent); --surface-tint-15: color-mix(in srgb, var(--foreground) 15%, transparent); --surface-tint-18: color-mix(in srgb, var(--foreground) 18%, transparent); --surface-tint-22: color-mix(in srgb, var(--foreground) 22%, transparent); --surface-tint-25: color-mix(in srgb, var(--foreground) 25%, transparent); --surface-tint-35: color-mix(in srgb, var(--foreground) 35%, transparent); --surface-tint-40: color-mix(in srgb, var(--foreground) 40%, transparent); --surface-tint-70: color-mix(in srgb, var(--foreground) 70%, transparent); --muted-soft: color-mix(in srgb, var(--muted) 30%, transparent); --muted-medium: color-mix(in srgb, var(--muted) 50%, transparent); --constellation-node: hsl(36 8% 46%); --constellation-node-dim: hsl(36 8% 60%); --constellation-line: hsl(24 14% 14%); --constellation-accent: hsl(18 58% 46%); --constellation-edge-alpha: 0.22; --constellation-edge-focus-alpha: 0.34; --constellation-alpha: 0.80; --constellation-edge-floor: 0; --constellation-edge-accent-alpha: 0.30; --constellation-warp-response: 0.55; --constellation-warp-zeta: 1.0; --constellation-well-gain: 19000; --constellation-well-reach: 340; --constellation-well-ramp: 8.0; --constellation-well-max-speed: 4.0; --constellation-well-hold-ms: 140; --constellation-wander-idle: 8000; --constellation-wander-jitter: 8000; --section-color-0: oklch(0.552 0.192 359.8); --section-color-1: oklch(0.502 0.165 305.9); --section-color-2: oklch(0.484 0.163 265.5); --section-color-3: oklch(0.542 0.089 222.8); --section-color-4: oklch(0.551 0.088 171.1); --section-color-5: oklch(0.530 0.124 69.6); --section-color-6: oklch(0.579 0.201 30.4); --section-color-7: oklch(0.532 0.180 317.5); --section-color-8: oklch(0.520 0.176 8.4); --section-color-9: oklch(0.492 0.038 239.6); --section-color-10: oklch(0.556 0.103 128.8); --section-color-11: oklch(0.601 0.092 208.0); --section-color-12: oklch(0.513 0.163 291.9); --accent-pink: oklch(0.613 0.197 353.8); --section-heading: oklch(0.545 0.189 352.8); --accent-red: oklch(0.574 0.216 27.5); --viz-fourier: oklch(0.579 0.201 30.4); --viz-chebyshev: oklch(0.484 0.163 265.5); --viz-legendre: oklch(0.532 0.180 317.5); --viz-amber: var(--section-color-5); --viz-green: var(--section-color-4); --tier-featured: oklch(0.841 0.173 84.2); --tier-saved: oklch(0.676 0.176 252.3); --like: oklch(0.633 0.200 24.9); --success: oklch(0.720 0.192 149.5); --warning: oklch(0.770 0.165 70.6); --info: oklch(0.626 0.186 259.6); --delete: oklch(0.597 0.198 25.5); --success-foreground: var(--neutral-0); --warning-foreground: hsl(24 10% 10%); --info-foreground: var(--neutral-0); }
+:root{--neutral-0: hsl(40 30% 98%);--neutral-1: hsl(38 26% 95%);--neutral-2: hsl(34 28% 90%);--neutral-3: hsl(33 30% 82%);--neutral-4: hsl(32 26% 70%);--neutral-5: hsl(30 22% 40%);--neutral-6: hsl(28 24% 30%);--background: var(--neutral-0);--foreground: hsl(24 10% 10%);--card: hsl(30 85% 96%);--card-foreground: var(--foreground);--popover: var(--card);--popover-foreground: var(--foreground);--surface-public-data-panel: hsl(44 16% 96%);--muted: var(--neutral-1);--muted-foreground: var(--neutral-5);--muted-foreground-strong: var(--neutral-6);--secondary: var(--neutral-2);--secondary-foreground: var(--foreground);--accent: var(--neutral-3);--accent-foreground: var(--foreground);--border: var(--neutral-4);--input: var(--neutral-4);--ink-seam: 0.08;--ink-edge: 0.16;--ink-perimeter: 0.48;--fill-hover: 0.05;--fill-selected: 0.12;--primary: hsl(24 10% 10%);--primary-foreground: var(--neutral-0);--destructive: hsl(0 72% 50%);--destructive-foreground: var(--neutral-0);--focus-ring-color: hsl(24 10% 10%);--shadow: hsl(24 10% 10%);--shadow-color: var(--foreground);--accent-color: var(--primary);--border-soft: color-mix(in srgb,var(--border) 45%,transparent);--scrollbar-thumb: color-mix(in srgb,var(--muted-foreground) 25%,transparent);--scrollbar-track: transparent;--surface-tint-4: color-mix(in srgb,var(--foreground) 4%,transparent);--surface-tint-6: color-mix(in srgb,var(--foreground) 6%,transparent);--surface-tint-8: color-mix(in srgb,var(--foreground) 8%,transparent);--surface-tint-10: color-mix(in srgb,var(--foreground) 10%,transparent);--surface-tint-12: color-mix(in srgb,var(--foreground) 12%,transparent);--surface-tint-15: color-mix(in srgb,var(--foreground) 15%,transparent);--surface-tint-18: color-mix(in srgb,var(--foreground) 18%,transparent);--surface-tint-22: color-mix(in srgb,var(--foreground) 22%,transparent);--surface-tint-25: color-mix(in srgb,var(--foreground) 25%,transparent);--surface-tint-40: color-mix(in srgb,var(--foreground) 40%,transparent);--surface-tint-70: color-mix(in srgb,var(--foreground) 70%,transparent);--muted-soft: color-mix(in srgb,var(--muted) 30%,transparent);--muted-medium: color-mix(in srgb,var(--muted) 50%,transparent);--constellation-node: hsl(36 8% 46%);--constellation-node-dim: hsl(36 8% 60%);--constellation-line: hsl(24 14% 14%);--constellation-accent: hsl(18 58% 46%);--constellation-edge-alpha: 0.22;--constellation-edge-focus-alpha: 0.34;--constellation-alpha: 0.80;--constellation-edge-floor: 0;--constellation-edge-accent-alpha: 0.30;--constellation-warp-response: 0.55;--constellation-warp-zeta: 1.0;--constellation-well-gain: 19000;--constellation-well-reach: 340;--constellation-well-ramp: 8.0;--constellation-well-max-speed: 4.0;--constellation-well-hold-ms: 140;--constellation-wander-idle: 8000;--constellation-wander-jitter: 8000;--section-color-0: oklch(0.552 0.192 359.8);--section-color-1: oklch(0.502 0.165 305.9);--section-color-2: oklch(0.484 0.163 265.5);--section-color-3: oklch(0.542 0.089 222.8);--section-color-4: oklch(0.551 0.088 171.1);--section-color-5: oklch(0.530 0.124 69.6);--section-color-6: oklch(0.579 0.201 30.4);--section-color-7: oklch(0.532 0.180 317.5);--section-color-8: oklch(0.520 0.176 8.4);--section-color-9: oklch(0.492 0.038 239.6);--section-color-10: oklch(0.556 0.103 128.8);--section-color-11: oklch(0.601 0.092 208.0);--section-color-12: oklch(0.513 0.163 291.9);--accent-pink: oklch(0.613 0.197 353.8);--section-heading: oklch(0.545 0.189 352.8);--accent-red: oklch(0.574 0.216 27.5);--viz-fourier: oklch(0.579 0.201 30.4);--viz-chebyshev: oklch(0.484 0.163 265.5);--viz-legendre: oklch(0.532 0.180 317.5);--viz-amber: var(--section-color-5);--viz-green: var(--section-color-4);--tier-featured: oklch(0.841 0.173 84.2);--tier-saved: oklch(0.676 0.176 252.3);--like: oklch(0.633 0.200 24.9);--success: oklch(0.720 0.192 149.5);--warning: oklch(0.770 0.165 70.6);--info: oklch(0.626 0.186 259.6);--delete: oklch(0.597 0.198 25.5);--success-foreground: hsl(24 10% 10%);--warning-foreground: hsl(24 10% 10%);--info-foreground: hsl(24 10% 10%);}

package/dist/styles/tokens/dark-arm-glass.css

@@ -1 +1 @@
-.dark { --glass-saturate-wash: 1.35; --glass-saturate-quiet: 1.35; --glass-saturate-resting: 1.30; --glass-saturate-floating: 1.28; --glass-saturate-overlay: 1.22; --glass-blur-wash: blur(calc(var(--glass-blur-wash-radius) * var(--glass-level))) saturate(var(--glass-saturate-wash)) brightness(1.18); --glass-blur-quiet: blur(calc(var(--glass-blur-quiet-radius) * var(--glass-level))) saturate(var(--glass-saturate-quiet)) brightness(1.16); --glass-blur-resting: blur(calc(var(--glass-blur-resting-radius) * var(--glass-level))) saturate(var(--glass-saturate-resting)) brightness(1.14); --glass-blur-floating: blur(calc(var(--glass-blur-floating-radius) * var(--glass-level))) saturate(var(--glass-saturate-floating)) brightness(1.10); --glass-blur-overlay: blur(calc(var(--glass-blur-overlay-radius) * var(--glass-level))) saturate(var(--glass-saturate-overlay)) brightness(1.06); --glass-blur-deep: blur(var(--glass-blur-deep-active-radius)) saturate(1.55) brightness(1.16); }
+.dark .glass-deep{--glass-blur-deep: blur(var(--glass-blur-deep-active-radius)) saturate(var(--glass-saturate-deep));}