@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-leading:initial;--tw-space-y-reverse:0;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--demo-metric-num:0;--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0}}}.demo-frame{isolation:isolate;border-radius:var(--radius-2xl,1rem);border-style:var(--tw-border-style);border-width:2px;border-color:var(--border);position:relative;overflow:hidden}@supports (color:color-mix(in lab, red, red)){.demo-frame{border-color:color-mix(in oklab, var(--border) 80%, transparent)}}.demo-frame{background-color:var(--card);color:var(--card-foreground);--tw-shadow:0px 2px 4px 0px var(--tw-shadow-color,#6363631a), 0px 8px 8px 0px var(--tw-shadow-color,#63636317), 0px 17px 10px 0px var(--tw-shadow-color,#6363630d), 0px 30px 12px 0px var(--tw-shadow-color,#63636303), 0px 47px 13px 0px var(--tw-shadow-color,#63636300);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.demo-frame:before{pointer-events:none;content:"";opacity:.55;background-image:radial-gradient(circle at 1px 1px,#6c727e17 1px,#0000 0),linear-gradient(#f5f9ff59,#0000 42%);background-image:radial-gradient(circle at 1px 1px,lab(47.7084% -.411779 -7.45813/.09) 1px,#0000 0),linear-gradient(lab(97.6387% -.285149 -3.77021/.35),#0000 42%);background-size:18px 18px,auto;position:absolute;inset:0}.dark .demo-frame:before{opacity:.45;background-image:radial-gradient(circle at 1px 1px,#a4aec21f 1px,#0000 0),linear-gradient(#2b334259,#0000 45%);background-image:radial-gradient(circle at 1px 1px,lab(70.8607% -.584245 -11.1715/.12) 1px,#0000 0),linear-gradient(lab(20.9515% -.0752509 -10.9753/.35),#0000 45%)}.demo-frame-header{z-index:1;gap:calc(var(--spacing,.25rem) * 4);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:var(--border);flex-direction:column;display:flex;position:relative}@supports (color:color-mix(in lab, red, red)){.demo-frame-header{border-color:color-mix(in oklab, var(--border) 60%, transparent)}}.demo-frame-header{background-color:var(--card)}@supports (color:color-mix(in lab, red, red)){.demo-frame-header{background-color:color-mix(in oklab, var(--card) 85%, transparent)}}.demo-frame-header{padding-inline:calc(var(--spacing,.25rem) * 5);padding-block:calc(var(--spacing,.25rem) * 4);--tw-backdrop-blur:blur(var(--blur-sm,8px));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}@media (min-width:40rem){.demo-frame-header{padding-inline:calc(var(--spacing,.25rem) * 6);flex-direction:row;justify-content:space-between;align-items:flex-start}}.demo-frame-kind{font-family:var(--font-mono,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);--tw-font-weight:var(--font-weight-semibold,600);font-size:.65rem;font-weight:var(--font-weight-semibold,600);--tw-tracking:.14em;letter-spacing:.14em;color:var(--primary);text-transform:uppercase}.demo-frame-title{margin-top:var(--spacing,.25rem);font-size:var(--text-lg,1.125rem);line-height:var(--tw-leading,var(--text-lg--line-height,calc(1.75 / 1.125)));--tw-font-weight:var(--font-weight-semibold,600);font-weight:var(--font-weight-semibold,600);--tw-tracking:var(--tracking-tight,-.025em);letter-spacing:var(--tracking-tight,-.025em);color:var(--foreground)}.demo-frame-description{margin-top:var(--spacing,.25rem);max-width:65ch;font-size:var(--text-sm,.875rem);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25 / .875)));--tw-leading:var(--leading-relaxed,1.625);line-height:var(--leading-relaxed,1.625);color:var(--muted-foreground)}.demo-frame-body{z-index:1;position:relative}:where(.demo-frame-body>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing,.25rem) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing,.25rem) * 4) * calc(1 - var(--tw-space-y-reverse)))}.demo-frame-body{padding-inline:calc(var(--spacing,.25rem) * 5);padding-block:calc(var(--spacing,.25rem) * 5)}@media (min-width:40rem){.demo-frame-body{padding-inline:calc(var(--spacing,.25rem) * 6)}}.demo-frame-controls{z-index:1;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:var(--border);position:relative}@supports (color:color-mix(in lab, red, red)){.demo-frame-controls{border-color:color-mix(in oklab, var(--border) 60%, transparent)}}.demo-frame-controls{background-color:var(--muted)}@supports (color:color-mix(in lab, red, red)){.demo-frame-controls{background-color:color-mix(in oklab, var(--muted) 25%, transparent)}}.demo-frame-controls{padding-inline:calc(var(--spacing,.25rem) * 5);padding-block:calc(var(--spacing,.25rem) * 4)}@media (min-width:40rem){.demo-frame-controls{padding-inline:calc(var(--spacing,.25rem) * 6)}}.demo-frame-footer{z-index:1;gap:calc(var(--spacing,.25rem) * 4);border-top-style:var(--tw-border-style);border-top-width:1px;border-color:var(--border);flex-direction:column;display:flex;position:relative}@supports (color:color-mix(in lab, red, red)){.demo-frame-footer{border-color:color-mix(in oklab, var(--border) 60%, transparent)}}.demo-frame-footer{background-color:var(--muted)}@supports (color:color-mix(in lab, red, red)){.demo-frame-footer{background-color:color-mix(in oklab, var(--muted) 20%, transparent)}}.demo-frame-footer{padding-inline:calc(var(--spacing,.25rem) * 5);padding-block:calc(var(--spacing,.25rem) * 4)}@media (min-width:40rem){.demo-frame-footer{padding-inline:calc(var(--spacing,.25rem) * 6);flex-flow:wrap;align-items:center}}.demo-frame-caption{z-index:1;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:var(--border);position:relative}@supports (color:color-mix(in lab, red, red)){.demo-frame-caption{border-color:color-mix(in oklab, var(--border) 50%, transparent)}}.demo-frame-caption{padding-inline:calc(var(--spacing,.25rem) * 5);padding-block:calc(var(--spacing,.25rem) * 3);font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1 / .75)));color:var(--muted-foreground)}@media (min-width:40rem){.demo-frame-caption{padding-inline:calc(var(--spacing,.25rem) * 6)}}.demo-pane{border-radius:calc(var(--radius) + 16px);border-style:var(--tw-border-style);border-width:1px;border-color:var(--border)}@supports (color:color-mix(in lab, red, red)){.demo-pane{border-color:color-mix(in oklab, var(--border) 70%, transparent)}}.demo-pane{background-color:var(--background)}@supports (color:color-mix(in lab, red, red)){.demo-pane{background-color:color-mix(in oklab, var(--background) 80%, transparent)}}.demo-pane{padding:calc(var(--spacing,.25rem) * 4);--tw-shadow:0px 1px 3px 0px var(--tw-shadow-color,#63636314), 0px 4px 6px 0px var(--tw-shadow-color,#63636312), 0px 8px 8px 0px var(--tw-shadow-color,#6363630a), 0px 15px 9px 0px var(--tw-shadow-color,#63636303), 0px 23px 10px 0px var(--tw-shadow-color,#63636300);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.demo-pane-label{margin-bottom:calc(var(--spacing,.25rem) * 2);font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1 / .75)));--tw-font-weight:var(--font-weight-semibold,600);font-weight:var(--font-weight-semibold,600);--tw-tracking:var(--tracking-wide,.025em);letter-spacing:var(--tracking-wide,.025em);color:var(--muted-foreground);text-transform:uppercase}.demo-pane-code{background-color:var(--muted)}@supports (color:color-mix(in lab, red, red)){.demo-pane-code{background-color:color-mix(in oklab, var(--muted) 50%, transparent)}}.demo-pane-code{font-family:var(--font-mono,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1 / .75)));--tw-leading:var(--leading-relaxed,1.625);line-height:var(--leading-relaxed,1.625)}.demo-code-block{border-radius:calc(var(--radius) + 8px);border-style:var(--tw-border-style);border-width:1px;border-color:var(--border);overflow-x:auto}@supports (color:color-mix(in lab, red, red)){.demo-code-block{border-color:color-mix(in oklab, var(--border) 60%, transparent)}}.demo-code-block{background-color:var(--muted)}@supports (color:color-mix(in lab, red, red)){.demo-code-block{background-color:color-mix(in oklab, var(--muted) 40%, transparent)}}.demo-code-block{padding:calc(var(--spacing,.25rem) * 3);font-family:var(--font-mono,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1 / .75)));--tw-leading:var(--leading-relaxed,1.625);line-height:var(--leading-relaxed,1.625);color:var(--foreground)}.demo-compare-grid{gap:calc(var(--spacing,.25rem) * 4);display:grid}@media (min-width:48rem){.demo-compare-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.demo-metric-tile{border-radius:calc(var(--radius) + 16px);border-style:var(--tw-border-style);border-width:1px;border-color:var(--border)}@supports (color:color-mix(in lab, red, red)){.demo-metric-tile{border-color:color-mix(in oklab, var(--border) 70%, transparent)}}.demo-metric-tile{background-color:var(--background)}@supports (color:color-mix(in lab, red, red)){.demo-metric-tile{background-color:color-mix(in oklab, var(--background) 90%, transparent)}}.demo-metric-tile{padding:calc(var(--spacing,.25rem) * 4)}.demo-metric-label{font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1 / .75)));--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500);--tw-tracking:var(--tracking-wide,.025em);letter-spacing:var(--tracking-wide,.025em);color:var(--muted-foreground);text-transform:uppercase}.demo-metric-value{margin-top:var(--spacing,.25rem);font-family:var(--font-mono,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-size:var(--text-2xl,1.5rem);line-height:var(--tw-leading,var(--text-2xl--line-height,calc(2 / 1.5)));--tw-font-weight:var(--font-weight-semibold,600);font-weight:var(--font-weight-semibold,600);--tw-tracking:var(--tracking-tight,-.025em);letter-spacing:var(--tracking-tight,-.025em);color:var(--foreground);--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}@property --demo-metric-num{syntax:"<number>";inherits:false;initial-value:0}.demo-metric-value-animated{--demo-metric-num:0;transition:--demo-metric-num .4s var(--motion-ease-settle,ease-out)}.demo-metric-tile-positive .demo-metric-value{color:var(--color-emerald-700,#007956)}@supports (color:lab(0% 0 0)){.demo-metric-tile-positive .demo-metric-value{color:var(--color-emerald-700,lab(44.4871% -41.0396 11.0361))}}.demo-metric-tile-positive .demo-metric-value:is(.dark *){color:var(--color-emerald-400,#00d294)}@supports (color:lab(0% 0 0)){.demo-metric-tile-positive .demo-metric-value:is(.dark *){color:var(--color-emerald-400,lab(75.0771% -60.7313 19.4147))}}.demo-metric-tile-negative .demo-metric-value{color:var(--destructive)}.demo-metric-tile-warning .demo-metric-value{color:var(--color-amber-700,#b75000)}@supports (color:lab(0% 0 0)){.demo-metric-tile-warning .demo-metric-value{color:var(--color-amber-700,lab(47.2709% 42.9082 69.2966))}}.demo-metric-tile-warning .demo-metric-value:is(.dark *){color:var(--color-amber-300,#ffd236)}@supports (color:lab(0% 0 0)){.demo-metric-tile-warning .demo-metric-value:is(.dark *){color:var(--color-amber-300,lab(86.4156% 6.13147 78.3961))}}:where(.demo-timeline>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing,.25rem) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing,.25rem) * 2) * calc(1 - var(--tw-space-y-reverse)))}.demo-timeline{border-left-style:var(--tw-border-style);border-left-width:1px;border-color:var(--border)}@supports (color:color-mix(in lab, red, red)){.demo-timeline{border-color:color-mix(in oklab, var(--border) 70%, transparent)}}.demo-timeline{padding-left:calc(var(--spacing,.25rem) * 4)}.demo-timeline-item{border-radius:calc(var(--radius) + 8px);border-style:var(--tw-border-style);border-width:1px;border-color:var(--border);position:relative}@supports (color:color-mix(in lab, red, red)){.demo-timeline-item{border-color:color-mix(in oklab, var(--border) 60%, transparent)}}.demo-timeline-item{background-color:var(--muted)}@supports (color:color-mix(in lab, red, red)){.demo-timeline-item{background-color:color-mix(in oklab, var(--muted) 30%, transparent)}}.demo-timeline-item{padding-inline:calc(var(--spacing,.25rem) * 3);padding-block:calc(var(--spacing,.25rem) * 2);font-size:var(--text-sm,.875rem);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25 / .875)))}@keyframes demo-timeline-enter{0%{opacity:1;transform:translate(-4px)}to{opacity:1;transform:translate(0)}}.demo-timeline-enter{animation:demo-timeline-enter .32s var(--motion-ease-settle,ease-out)}:where(.demo-media-frame>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing,.25rem) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing,.25rem) * 2) * calc(1 - var(--tw-space-y-reverse)))}.demo-media-stage{border-radius:calc(var(--radius) + 16px);border-style:var(--tw-border-style);border-width:1px;border-color:var(--border);overflow:hidden}@supports (color:color-mix(in lab, red, red)){.demo-media-stage{border-color:color-mix(in oklab, var(--border) 70%, transparent)}}.demo-media-stage{background-color:var(--muted)}@supports (color:color-mix(in lab, red, red)){.demo-media-stage{background-color:color-mix(in oklab, var(--muted) 30%, transparent)}}.demo-media-caption{text-align:center;font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1 / .75)));color:var(--muted-foreground)}.demo-frame-kind-rail{pointer-events:none;z-index:2;width:calc(var(--spacing,.25rem) * 1.5);border-top-left-radius:var(--radius-2xl,1rem);border-bottom-left-radius:var(--radius-2xl,1rem);background-color:var(--primary);inset-block:0;position:absolute;left:0}@supports (color:color-mix(in lab, red, red)){.demo-frame-kind-rail{background-color:color-mix(in oklab, var(--primary) 90%, transparent)}}.demo-frame-metric .demo-frame-kind-rail{background-color:#009767e6}@supports (color:color-mix(in lab, red, red)){.demo-frame-metric .demo-frame-kind-rail{background-color:color-mix(in oklab, var(--color-emerald-600,lab(55.0481% -49.9246 15.93)) 90%, transparent)}}.demo-frame-metric .demo-frame-kind-rail:is(.dark *){background-color:#00d294e6}@supports (color:color-mix(in lab, red, red)){.demo-frame-metric .demo-frame-kind-rail:is(.dark *){background-color:color-mix(in oklab, var(--color-emerald-400,lab(75.0771% -60.7313 19.4147)) 90%, transparent)}}.demo-frame-simulation .demo-frame-kind-rail{background-color:#7f22fee6}@supports (color:color-mix(in lab, red, red)){.demo-frame-simulation .demo-frame-kind-rail{background-color:color-mix(in oklab, var(--color-violet-600,lab(41.088% 68.9966 -91.995)) 90%, transparent)}}.demo-frame-simulation .demo-frame-kind-rail:is(.dark *){background-color:#a685ffe6}@supports (color:color-mix(in lab, red, red)){.demo-frame-simulation .demo-frame-kind-rail:is(.dark *){background-color:color-mix(in oklab, var(--color-violet-400,lab(62.8239% 34.9159 -60.0512)) 90%, transparent)}}.demo-frame-compare .demo-frame-kind-rail,.demo-frame-before-after .demo-frame-kind-rail{background-color:#0084cce6}@supports (color:color-mix(in lab, red, red)){.demo-frame-compare .demo-frame-kind-rail,.demo-frame-before-after .demo-frame-kind-rail{background-color:color-mix(in oklab, var(--color-sky-600,lab(51.7754% -11.4712 -49.8349)) 90%, transparent)}}:is(.demo-frame-compare .demo-frame-kind-rail,.demo-frame-before-after .demo-frame-kind-rail):is(.dark *){background-color:#00bcfee6}@supports (color:color-mix(in lab, red, red)){:is(.demo-frame-compare .demo-frame-kind-rail,.demo-frame-before-after .demo-frame-kind-rail):is(.dark *){background-color:color-mix(in oklab, var(--color-sky-400,lab(70.687% -23.6078 -45.9483)) 90%, transparent)}}.demo-frame-media .demo-frame-kind-rail{background-color:#dd7400e6}@supports (color:color-mix(in lab, red, red)){.demo-frame-media .demo-frame-kind-rail{background-color:color-mix(in oklab, var(--color-amber-600,lab(60.3514% 40.5624 87.1228)) 90%, transparent)}}.demo-frame-media .demo-frame-kind-rail:is(.dark *){background-color:#fcbb00e6}@supports (color:color-mix(in lab, red, red)){.demo-frame-media .demo-frame-kind-rail:is(.dark *){background-color:color-mix(in oklab, var(--color-amber-400,lab(80.1641% 16.6016 99.2089)) 90%, transparent)}}.demo-frame-interactive .demo-frame-kind-rail{background-color:var(--primary)}@supports (color:color-mix(in lab, red, red)){.demo-frame-interactive .demo-frame-kind-rail{background-color:color-mix(in oklab, var(--primary) 90%, transparent)}}.demo-frame-metric:before{background-image:linear-gradient(135deg,#3f9b651f,#0000 55%),radial-gradient(circle at 1px 1px,#6c727e14 1px,#0000 0);background-image:linear-gradient(135deg,lab(57.4832% -38.1772 19.6732/.12),#0000 55%),radial-gradient(circle at 1px 1px,lab(47.7084% -.411779 -7.45813/.08) 1px,#0000 0)}.demo-frame-simulation:before{background-image:repeating-linear-gradient(-12deg,#71699d0f,#71699d0f 8px,#0000 8px 16px),linear-gradient(#f1f0ff59,#0000 50%);background-image:repeating-linear-gradient(-12deg,lab(46.8661% 12.0811 -27.3311/.06),lab(46.8661% 12.0811 -27.3311/.06) 8px,#0000 8px 16px),linear-gradient(lab(95.1681% 2.47616 -7.07105/.35),#0000 50%)}.demo-frame-compare:before,.demo-frame-before-after:before{background-image:linear-gradient(90deg,#51779114 50%,#0000 50%);background-image:linear-gradient(90deg,lab(47.8149% -8.17716 -19.1316/.08) 50%,#0000 50%);background-size:24px 24px}.demo-frame-media:before{background-image:radial-gradient(circle at 50% 0,#cca7742e,#0000 55%);background-image:radial-gradient(circle at 50% 0,lab(71.0205% 9.03708 31.6888/.18),#0000 55%)}.demo-pane-log{--tw-border-style:dashed;background-color:var(--muted);border-style:dashed}@supports (color:color-mix(in lab, red, red)){.demo-pane-log{background-color:color-mix(in oklab, var(--muted) 40%, transparent)}}.demo-pane-log{font-family:var(--font-mono,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1 / .75)))}.demo-pane-compare{border-color:var(--primary)}@supports (color:color-mix(in lab, red, red)){.demo-pane-compare{border-color:color-mix(in oklab, var(--primary) 25%, transparent)}}.demo-pane-compare{background-color:var(--background)}:where(.demo-metric-bar>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing,.25rem) * 1.5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing,.25rem) * 1.5) * calc(1 - var(--tw-space-y-reverse)))}.demo-metric-bar-track{height:calc(var(--spacing,.25rem) * 3);border-style:var(--tw-border-style);border-width:1px;border-color:var(--border);border-radius:9999px;position:relative;overflow:hidden}@supports (color:color-mix(in lab, red, red)){.demo-metric-bar-track{border-color:color-mix(in oklab, var(--border) 60%, transparent)}}.demo-metric-bar-track{background-color:var(--muted)}@supports (color:color-mix(in lab, red, red)){.demo-metric-bar-track{background-color:color-mix(in oklab, var(--muted) 50%, transparent)}}.demo-metric-bar-fill{inset-block:0;background-color:#009767d9;border-radius:9999px;position:absolute;left:0}@supports (color:color-mix(in lab, red, red)){.demo-metric-bar-fill{background-color:color-mix(in oklab, var(--color-emerald-600,lab(55.0481% -49.9246 15.93)) 85%, transparent)}}.demo-metric-bar-fill:is(.dark *){background-color:#00d294d9}@supports (color:color-mix(in lab, red, red)){.demo-metric-bar-fill:is(.dark *){background-color:color-mix(in oklab, var(--color-emerald-400,lab(75.0771% -60.7313 19.4147)) 85%, transparent)}}.demo-metric-bar-threshold{width:calc(var(--spacing,.25rem) * .5);--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y);background-color:var(--color-amber-600,#dd7400);position:absolute;top:0;bottom:0}@supports (color:lab(0% 0 0)){.demo-metric-bar-threshold{background-color:var(--color-amber-600,lab(60.3514% 40.5624 87.1228))}}.demo-metric-bar-threshold:is(.dark *){background-color:var(--color-amber-300,#ffd236)}@supports (color:lab(0% 0 0)){.demo-metric-bar-threshold:is(.dark *){background-color:var(--color-amber-300,lab(86.4156% 6.13147 78.3961))}}.demo-metric-bar-caption{font-family:var(--font-mono,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);--tw-tracking:var(--tracking-wide,.025em);letter-spacing:var(--tracking-wide,.025em);color:var(--muted-foreground);text-transform:uppercase;font-size:.65rem}.demo-metric-hint{margin-top:var(--spacing,.25rem);font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1 / .75)));color:var(--muted-foreground)}.demo-frame-footer{gap:calc(var(--spacing,.25rem) * 3)}.blog-prose-shell .not-prose.my-8:not(.demo-frame){isolation:isolate;border-radius:var(--radius-2xl,1rem);border-style:var(--tw-border-style);border-width:1px;border-color:var(--border);position:relative;overflow:hidden}@supports (color:color-mix(in lab, red, red)){.blog-prose-shell .not-prose.my-8:not(.demo-frame){border-color:color-mix(in oklab, var(--border) 70%, transparent)}}.blog-prose-shell .not-prose.my-8:not(.demo-frame){background-color:var(--card)}@supports (color:color-mix(in lab, red, red)){.blog-prose-shell .not-prose.my-8:not(.demo-frame){background-color:color-mix(in oklab, var(--card) 90%, transparent)}}.blog-prose-shell .not-prose.my-8:not(.demo-frame){padding:calc(var(--spacing,.25rem) * 4);--tw-shadow:0px 2px 4px 0px var(--tw-shadow-color,#63636312), 0px 7px 7px 0px var(--tw-shadow-color,#6363630f), 0px 15px 9px 0px var(--tw-shadow-color,#6363630a), 0px 27px 11px 0px var(--tw-shadow-color,#63636303), 0px 42px 12px 0px var(--tw-shadow-color,#63636300);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}@media (min-width:48rem){.blog-prose-shell .not-prose.my-8:not(.demo-frame){padding:calc(var(--spacing,.25rem) * 5)}}@media (prefers-reduced-motion:reduce){.demo-timeline-enter{animation:none}.demo-metric-value-animated{transition:none}}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-leading{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}
