.demo[data-astro-cid-xy5oowo6]{--line:color-mix(in srgb, currentColor 18%, transparent);border:1px dashed var(--line);--h:200;background:var(--color-highlight-bg);border-radius:4px;margin:2rem 0;padding:2rem}.row[data-astro-cid-xy5oowo6]{grid-template-columns:1fr;gap:1rem;display:grid}@media (width>=420px){.row[data-astro-cid-xy5oowo6]{grid-template-columns:1fr 1fr}}.col[data-astro-cid-xy5oowo6]{flex-direction:column;align-items:center;gap:.5rem;display:flex}.btn[data-astro-cid-xy5oowo6]{color:#fff;width:100%;font:inherit;cursor:default;border:0;border-radius:10px;padding:.8rem 1rem;font-weight:600}.hsl[data-astro-cid-xy5oowo6]{background:hsl(var(--h) 60% 35%)}.oklch[data-astro-cid-xy5oowo6]{background:oklch(.43 .13 var(--h))}code[data-astro-cid-xy5oowo6]{opacity:.75;font-size:.8rem}.badge[data-astro-cid-xy5oowo6]{padding:.2rem .6rem;font-size:1rem;font-weight:600}.badge[data-astro-cid-xy5oowo6].pass{color:#4ab282}.badge[data-astro-cid-xy5oowo6].fail{color:#c44127}.slide[data-astro-cid-xy5oowo6]{align-items:center;gap:.75rem;margin-top:1.25rem;font-weight:600;display:flex}input[data-astro-cid-xy5oowo6][type=range]{appearance:none;background:linear-gradient(90deg,oklch(70% .15 0),oklch(70% .15 60),oklch(70% .15 120),oklch(70% .15 180),oklch(70% .15 240),oklch(70% .15 300),oklch(70% .15 360));border-radius:999px;flex:1;height:.8rem}input[data-astro-cid-xy5oowo6][type=range]::-webkit-slider-thumb{appearance:none;background:#fff;border:2px solid #333;border-radius:50%;width:1.4rem;height:1.4rem}input[data-astro-cid-xy5oowo6][type=range]::-moz-range-thumb{background:#fff;border:2px solid #333;border-radius:50%;width:1.4rem;height:1.4rem}.td[data-astro-cid-oqbaxeyi]{--demo-line:color-mix(in srgb, currentColor 18%, transparent);--demo-primary:#7276cb;--demo-cta-primary:oklch(from var(--demo-primary) clamp(0, calc(l - .15), .55) c h);--demo-on-cta-primary:oklch(from var(--demo-cta-primary) clamp(0, calc((.65 - l) * 1000), 1) 0 0);--demo-fg:oklch(from var(--demo-primary) .25 calc(c * .3) h);--demo-fg-muted:oklch(from var(--demo-fg) l c h / 65%);--demo-cta-secondary:oklch(from var(--demo-primary) .94 calc(c * .4) h);--demo-on-cta-secondary:oklch(from var(--demo-primary) .35 c h);--demo-error:oklch(50% .2 27);--demo-error-bg:oklch(95% .03 25);--demo-surface:oklch(from var(--demo-primary) .979 clamp(0, calc(c * .035), .008) h);--demo-surface-deep:oklch(from var(--demo-surface) calc(l - .01) calc(c + .005) calc(h - 10));border:1px dashed var(--demo-line);background:var(--color-highlight-bg);border-radius:4px;grid-template-columns:1fr 1.2fr;gap:1.25rem;margin:2rem 0;padding:2rem;font-size:.9rem;display:grid}@media (width<=1020px){.td[data-astro-cid-oqbaxeyi]{grid-template-columns:1fr}}.td-left[data-astro-cid-oqbaxeyi] hr[data-astro-cid-oqbaxeyi]{border-color:var(--demo-line);opacity:.3;margin:1.5rem 0 1rem}.td-pick[data-astro-cid-oqbaxeyi]{align-items:center;gap:.75rem;margin-bottom:1rem;display:flex}.td-pick[data-astro-cid-oqbaxeyi] input[data-astro-cid-oqbaxeyi]{appearance:none;border:1px solid var(--demo-line);cursor:pointer;background:0 0;border-radius:10px;width:3.2rem;height:3.2rem;padding:0;overflow:hidden}.td-pick[data-astro-cid-oqbaxeyi] input[data-astro-cid-oqbaxeyi]::-webkit-color-swatch-wrapper{padding:0}.td-pick[data-astro-cid-oqbaxeyi] input[data-astro-cid-oqbaxeyi]::-webkit-color-swatch{border:0;border-radius:0}.td-pick[data-astro-cid-oqbaxeyi] input[data-astro-cid-oqbaxeyi]::-moz-color-swatch{border:0;border-radius:0}.td[data-astro-cid-oqbaxeyi] b[data-astro-cid-oqbaxeyi]{display:block}.td-desc[data-astro-cid-oqbaxeyi]{opacity:.7;font-size:.8rem}.td-tokens[data-astro-cid-oqbaxeyi]{grid-template-columns:1fr;gap:.6rem;margin:0;padding:0;list-style:none;display:grid}@media (width>=768px){.td-tokens[data-astro-cid-oqbaxeyi]{grid-template-columns:1fr 1fr}}@media (width>=1024px){.td-tokens[data-astro-cid-oqbaxeyi]{grid-template-columns:1fr}}.td-tokens[data-astro-cid-oqbaxeyi] li[data-astro-cid-oqbaxeyi]{align-items:center;gap:.6rem;display:flex}.td-tokens[data-astro-cid-oqbaxeyi] i[data-astro-cid-oqbaxeyi]{border-radius:4px;flex:none;width:2rem;height:2rem;box-shadow:inset 0 0 0 1px #0002}.td-frame[data-astro-cid-oqbaxeyi]{background:linear-gradient(to bottom right, var(--demo-surface), var(--demo-surface-deep));border-radius:8px;flex-direction:column;align-items:center;gap:.75rem;min-height:580px;padding:2rem;display:flex}.td-card[data-astro-cid-oqbaxeyi]{text-align:center;background:linear-gradient(#fffffff2,#ffffffa6);border:4px solid #fff;border-radius:16px;flex-direction:column;gap:.6rem;width:100%;max-width:22rem;height:100%;padding:2rem 1.5rem 1.5rem;display:flex;box-shadow:0 4px 16px #edece712;font-family:Helvetica,system-ui,sans-serif!important}@media (width>=768px){.td-card[data-astro-cid-oqbaxeyi]{max-height:520px}}.td-card[data-astro-cid-oqbaxeyi] .td-card-header[data-astro-cid-oqbaxeyi]{color:var(--demo-fg);margin-top:1rem;font-size:1.35rem;font-family:Helvetica,system-ui,sans-serif!important;font-weight:900!important}.td-card[data-astro-cid-oqbaxeyi] p[data-astro-cid-oqbaxeyi]{color:var(--demo-fg-muted);margin:0;font-size:.8rem;font-weight:400}.td-card[data-astro-cid-oqbaxeyi] button[data-astro-cid-oqbaxeyi]{font:inherit;cursor:default;border:0;border-radius:8px;padding:.65rem 1rem;font-weight:600}.primary[data-astro-cid-oqbaxeyi]{background:var(--demo-cta-primary);color:var(--demo-on-cta-primary)}.secondary[data-astro-cid-oqbaxeyi]{background:var(--demo-cta-secondary);color:var(--demo-on-cta-secondary)}.error[data-astro-cid-oqbaxeyi]{background:var(--demo-error-bg);color:var(--demo-error);margin-top:auto;padding:.65rem 1rem;font-size:.8rem;font-weight:600}
