.ds,.ds-light{--ds-blue-50:#eef2f6;--ds-blue-100:#dce4ec;--ds-blue-500:#4a6b8f;--ds-blue-600:#3a5572;--ds-blue-700:#2c4156;--ds-signal-50:#ffeae2;--ds-signal-100:#ffd1c1;--ds-signal-200:#ffb599;--ds-signal-300:#ff8d64;--ds-signal-400:#f55d1a;--ds-signal-500:#d54600;--ds-signal-600:#aa3700;--ds-signal-700:#81300f;--ds-clay-50:#faefe6;--ds-clay-100:#f3decc;--ds-clay-200:#e9c5a4;--ds-clay-300:#dda479;--ds-clay-400:#d68a59;--ds-clay-500:#c2723f;--ds-clay-600:#a15a2e;--ds-clay-700:#7e4523;--ds-paper-bright:#fffdf8;--ds-paper-cream:#faf3ea;--ds-white:#fff;--ds-sand-25:#fbfaf7;--ds-sand-50:#f6f3ed;--ds-sand-100:#ece7de;--ds-sand-200:#dcd4c7;--ds-sand-300:#bfb5a4;--ds-sand-400:#968c7c;--ds-sand-500:#6f665a;--ds-sand-600:#524b41;--ds-sand-700:#3a342c;--ds-sand-800:#232020;--ds-sand-900:#1a1817;--ds-sand-950:#141414;--ds-black:#000;--ds-green-50:#e9f7ee;--ds-green-100:#cbedd7;--ds-green-500:#1f9d57;--ds-green-600:#178347;--ds-green-700:#11663a;--ds-amber-50:#fcf2dd;--ds-amber-100:#f8e2b4;--ds-amber-500:#e0980f;--ds-amber-600:#bc7d0b;--ds-amber-700:#92610c;--ds-red-50:#fbebe7;--ds-red-100:#f6d2c9;--ds-red-500:#dc4a3d;--ds-red-600:#c1372c;--ds-red-700:#9c2920;--ds-color-bg:var(--ds-paper-cream);--ds-surface-card:var(--ds-white);--ds-surface-raised:var(--ds-white);--ds-surface-sunken:var(--ds-sand-50);--ds-surface-subtle:var(--ds-sand-25);--ds-surface-inverse:var(--ds-sand-950);--ds-surface-overlay:#1814108c;--ds-text-primary:var(--ds-sand-950);--ds-text-secondary:var(--ds-sand-600);--ds-text-tertiary:var(--ds-sand-400);--ds-text-disabled:var(--ds-sand-300);--ds-text-inverse:var(--ds-paper-bright);--ds-text-brand:var(--ds-signal-600);--ds-text-link:var(--ds-signal-700);--ds-border-subtle:var(--ds-sand-100);--ds-border-default:var(--ds-sand-200);--ds-border-strong:var(--ds-sand-300);--ds-border-focus:var(--ds-signal-400);--ds-color-primary:var(--ds-sand-950);--ds-color-primary-hover:var(--ds-sand-800);--ds-color-primary-active:var(--ds-black);--ds-color-primary-fg:var(--ds-paper-bright);--ds-color-primary-soft:var(--ds-sand-100);--ds-color-primary-soft-fg:var(--ds-sand-900);--ds-color-accent:var(--ds-signal-400);--ds-color-accent-hover:var(--ds-signal-500);--ds-color-accent-active:var(--ds-signal-600);--ds-color-accent-strong:var(--ds-signal-600);--ds-color-accent-fg:var(--ds-sand-950);--ds-color-accent-soft:var(--ds-signal-50);--ds-color-accent-soft-fg:var(--ds-signal-700);--ds-color-info:var(--ds-blue-500);--ds-color-info-soft:var(--ds-blue-50);--ds-color-info-fg:var(--ds-blue-700);--ds-color-success:var(--ds-green-500);--ds-color-success-soft:var(--ds-green-50);--ds-color-success-fg:var(--ds-green-700);--ds-color-warning:var(--ds-amber-500);--ds-color-warning-soft:var(--ds-amber-50);--ds-color-warning-fg:var(--ds-amber-700);--ds-color-danger:var(--ds-red-500);--ds-color-danger-soft:var(--ds-red-50);--ds-color-danger-fg:var(--ds-red-700);--ds-focus-ring:0 0 0 3px #f55d1a61;--ds-focus-ring-strong:0 0 0 3px #f55d1a8c;--ds-font-display:"Forum", "Times New Roman", serif;--ds-font-sans:"Karla", system-ui, -apple-system, "Segoe UI", sans-serif;--ds-font-mono:ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;--ds-font-handwritten:"Caveat", cursive;--ds-fw-light:300;--ds-fw-regular:400;--ds-fw-medium:500;--ds-fw-semibold:600;--ds-fw-bold:700;--ds-fw-extrabold:800;--ds-text-2xs:.6875rem;--ds-text-xs:.75rem;--ds-text-sm:.875rem;--ds-text-base:.9375rem;--ds-text-md:1rem;--ds-text-lg:1.125rem;--ds-text-xl:1.375rem;--ds-text-2xl:1.75rem;--ds-text-3xl:2.25rem;--ds-text-4xl:3rem;--ds-text-5xl:4rem;--ds-text-6xl:5.25rem;--ds-leading-none:1;--ds-leading-tight:1.15;--ds-leading-snug:1.3;--ds-leading-normal:1.5;--ds-leading-relaxed:1.65;--ds-tracking-tighter:-.03em;--ds-tracking-tight:-.015em;--ds-tracking-normal:0;--ds-tracking-wide:.02em;--ds-tracking-wider:.08em;--ds-tracking-caps:.14em;--ds-font-title:var(--ds-font-display);--ds-font-body:var(--ds-font-sans);--ds-font-numeric:var(--ds-font-sans);--ds-space-0:0;--ds-space-px:1px;--ds-space-0-5:.125rem;--ds-space-1:.25rem;--ds-space-1-5:.375rem;--ds-space-2:.5rem;--ds-space-2-5:.625rem;--ds-space-3:.75rem;--ds-space-4:1rem;--ds-space-5:1.25rem;--ds-space-6:1.5rem;--ds-space-7:1.75rem;--ds-space-8:2rem;--ds-space-10:2.5rem;--ds-space-12:3rem;--ds-space-16:4rem;--ds-space-20:5rem;--ds-space-24:6rem;--ds-space-32:8rem;--ds-container-sm:640px;--ds-container-md:820px;--ds-container-lg:1080px;--ds-container-xl:1280px;--ds-container-2xl:1440px;--ds-gutter:clamp(1.25rem, 4vw, 4rem);--ds-sidebar-w:264px;--ds-sidebar-w-collapsed:72px;--ds-topbar-h:60px;--ds-control-h-sm:32px;--ds-control-h-md:40px;--ds-control-h-lg:48px;--ds-radius-xs:4px;--ds-radius-sm:6px;--ds-radius-md:10px;--ds-radius-lg:14px;--ds-radius-xl:20px;--ds-radius-2xl:28px;--ds-radius-pill:999px;--ds-shadow-xs:0 1px 2px #281c120d;--ds-shadow-sm:0 1px 2px #281c120d, 0 1px 3px #281c1212;--ds-shadow-md:0 2px 4px #281c120a, 0 6px 16px #281c1214;--ds-shadow-lg:0 6px 12px #281c120f, 0 16px 36px #281c121a;--ds-shadow-xl:0 12px 24px #281c1214, 0 32px 64px #281c1229;--ds-shadow-inset:inset 0 1px 2px #281c120f;--ds-glow-signal:0 0 0 1px #f55d1a66, 0 8px 28px #f55d1a3d;--ds-glow-clay:0 0 0 1px #d68a5966, 0 8px 28px #d68a5942;--ds-glow-accent:0 8px 28px #f55d1a47;--ds-ease-standard:cubic-bezier(.2, 0, 0, 1);--ds-ease-emphasized:cubic-bezier(.3, 0, 0, 1);--ds-ease-out:cubic-bezier(0, 0, .2, 1);--ds-ease-in:cubic-bezier(.4, 0, 1, 1);--ds-duration-fast:.12s;--ds-duration-base:.2s;--ds-duration-slow:.32s;--ds-duration-slower:.48s;--ds-transition-colors:color var(--ds-duration-fast) var(--ds-ease-standard), background-color var(--ds-duration-fast) var(--ds-ease-standard), border-color var(--ds-duration-fast) var(--ds-ease-standard), box-shadow var(--ds-duration-fast) var(--ds-ease-standard);--ds-gradient-paper:radial-gradient(ellipse 420px 180px at 85% 0%, #f55d1a1a, transparent 70%), linear-gradient(135deg, #faf3ea 0%, #fffdf8 60%);--ds-gradient-paper-hero:radial-gradient(ellipse 760px 360px at 88% -8%, #f55d1a2e, transparent 68%), radial-gradient(ellipse 620px 420px at 6% 108%, #f55d1a12, transparent 70%), linear-gradient(150deg, #faf3ea 0%, #fffdf8 58%);--ds-gradient-frost:radial-gradient(ellipse 520px 220px at 90% 0%, #f55d1a0f, transparent 70%), linear-gradient(135deg, #f6f3ed 0%, #fbfaf7 70%);--ds-gradient-espresso:radial-gradient(ellipse 620px 300px at 84% -6%, #f55d1a3d, transparent 64%), radial-gradient(ellipse 540px 360px at 8% 110%, #f55d1a1f, transparent 70%), linear-gradient(155deg, #1f1c1a 0%, #141414 60%);--ds-pattern-dots:radial-gradient(#1414140d 1px, transparent 1px);--ds-pattern-dots-size:22px 22px;--ds-sage-300:#49867b;--ds-sage-400:#37776e;--ds-sage-500:#0f766e;--ds-border-gradient:linear-gradient(178deg, #f55d1a38 1.71%, #f55d1ab8 18%, #14141447 50.1%, #d546009e 82%, #f55d1a2e 98.84%);--ds-color-gradient:linear-gradient(90deg, #141414 0%, #81300f 28%, #f55d1a 58%, #141414 100%);--ds-color-gradient-secondary:linear-gradient(180deg, #f55d1a29 0%, #faf3ea57 48%, #d546001f 100%);--ds-grid-line-color:#281c120e;--ds-inset-shadow-color:#281c120d;--ds-svg-glow-filter:drop-shadow(0 0 20px #f55d1a29) drop-shadow(0 0 40px #d546001a);--ds-svg-glow-filter-intense:drop-shadow(0 0 30px #f55d1a47) drop-shadow(0 0 60px #d5460024);--ds-glow-text-shadow:0 0 12px #f55d1a52;--ds-badge-border-mid:#81300f2e;--ds-badge-border-bright:#f55d1a94;--ds-gradient-text-bright:#f55d1af2;--ds-gradient-text-mid:#d54600c7;--ds-gradient-text-dim:#81300fa8;--ds-brand-primary-rgb:245, 93, 26;--ds-brand-accent-rgb:213, 70, 0;--ds-brand-highlight-rgb:255, 141, 100;--ds-brand-deep-rgb:129, 48, 15}.ds-dark,.dark .ds-auto{--ds-color-bg:var(--ds-sand-950);--ds-surface-card:#1b1611;--ds-surface-raised:#221c16;--ds-surface-sunken:#100e0d;--ds-surface-subtle:#161413;--ds-surface-inverse:var(--ds-paper-bright);--ds-surface-overlay:#000000a8;--ds-text-primary:var(--ds-paper-bright);--ds-text-secondary:var(--ds-sand-300);--ds-text-tertiary:var(--ds-sand-400);--ds-text-disabled:var(--ds-sand-600);--ds-text-inverse:var(--ds-sand-950);--ds-text-brand:var(--ds-signal-300);--ds-text-link:var(--ds-signal-300);--ds-border-subtle:#fffbf514;--ds-border-default:#fffbf524;--ds-border-strong:#fffbf53d;--ds-border-focus:var(--ds-signal-400);--ds-color-primary:var(--ds-paper-bright);--ds-color-primary-hover:var(--ds-sand-100);--ds-color-primary-active:var(--ds-sand-200);--ds-color-primary-fg:var(--ds-sand-950);--ds-color-primary-soft:#fffbf51a;--ds-color-primary-soft-fg:var(--ds-paper-bright);--ds-color-accent-soft:#f55d1a29;--ds-color-accent-soft-fg:var(--ds-signal-200);--ds-focus-ring:0 0 0 3px #f55d1a6b;--ds-border-gradient:linear-gradient(178deg, #fffdf814 1.71%, #f55d1ab8 18%, #fffdf82e 50.1%, #d546009e 82%, #fffdf814 98.84%);--ds-color-gradient:linear-gradient(90deg, #fffdf8 0%, #ff8d64 30%, #f55d1a 60%, #fffdf8 100%);--ds-color-gradient-secondary:linear-gradient(180deg, #1414146b 0%, #f55d1a2e 46%, #1414146b 100%);--ds-grid-line-color:#fffdf809;--ds-inset-shadow-color:#f55d1a14;--ds-svg-glow-filter:drop-shadow(0 0 20px #f55d1a47) drop-shadow(0 0 40px #d546002e);--ds-svg-glow-filter-intense:drop-shadow(0 0 30px #f55d1a70) drop-shadow(0 0 60px #ff8d643d);--ds-glow-text-shadow:0 0 14px #ff8d646b;--ds-badge-border-mid:#f55d1a42;--ds-badge-border-bright:#ff8d6494;--ds-gradient-text-bright:#fffdf8f5;--ds-gradient-text-mid:#ff8d64e0;--ds-gradient-text-dim:#f55d1ab8;--ds-brand-accent-rgb:255, 141, 100;--ds-brand-highlight-rgb:255, 181, 153}
.ds-anchor{scroll-margin-top:6rem}.ds-eyebrow{font-family:var(--font-secondary);letter-spacing:.14em;text-transform:uppercase;color:var(--color-text-light);font-size:.75rem;font-weight:600}.ds-code,.ds-mono{font-family:var(--ds-font-mono);font-size:.8125rem}.ds-code{color:var(--color-text)}.ds-mono{color:var(--color-text-light)}.ds-chip{border:1px solid var(--color-border);font-family:var(--ds-font-mono);border-radius:999px;align-items:center;padding:.25rem .75rem;font-size:.8125rem;display:inline-flex}.ds-rule{padding-left:1.5rem;position:relative}.ds-rule:before{content:"";background:var(--ds-signal-400);border-radius:999px;width:.625rem;height:.625rem;position:absolute;top:.55em;left:0}.ds-steps{counter-reset:ds-step;gap:.75rem;display:grid}.ds-steps li{counter-increment:ds-step;grid-template-columns:1.75rem 1fr;align-items:start;gap:.75rem;display:grid}.ds-steps li:before{content:counter(ds-step);background:var(--ds-signal-400);width:1.75rem;height:1.75rem;color:var(--ds-sand-950);border-radius:999px;place-items:center;font-size:.8125rem;font-weight:700;display:grid}.ds-replay{border:1px solid var(--ds-border-strong);border-radius:var(--ds-radius-md);background:var(--ds-surface-card);color:var(--ds-text-primary);transition:var(--ds-transition-colors), transform var(--ds-duration-fast) var(--ds-ease-standard);align-items:center;gap:.5rem;margin-top:1.25rem;padding:.5rem .875rem;font-size:.875rem;font-weight:600;display:inline-flex}.ds-replay:hover{background:var(--ds-surface-sunken)}.ds-replay:active{transform:scale(.98)}.ds-replay:focus-visible,.ds-nav a:focus-visible,.ds-fold:focus-visible{box-shadow:var(--ds-focus-ring-strong);outline:none}.ds-verdict{letter-spacing:.04em;text-transform:uppercase;border-radius:999px;align-items:center;gap:.35rem;padding:.2rem .6rem;font-size:.75rem;font-weight:700;display:inline-flex}.ds-verdict.is-yes{background:var(--ds-green-50);color:var(--ds-green-700)}.ds-verdict.is-no{background:var(--ds-red-50);color:var(--ds-red-700)}.ds-cover{border:1px solid var(--ds-border-default);border-radius:var(--ds-radius-2xl);background:var(--ds-surface-card);box-shadow:var(--ds-shadow-lg);overflow:hidden}.ds-cover-stage,.ds-motion-stage{background:linear-gradient(to right, var(--ds-grid-line-color) 1px, transparent 1px) 0 0 / calc(100% / 6) 100%, var(--ds-gradient-paper-hero);place-items:center;padding:clamp(2.5rem,7vw,5rem) clamp(1.25rem,6vw,4rem);display:grid}.ds-motion-stage{height:100%;min-height:16rem}.ds-motion-stage.is-compact{height:auto;min-height:0;padding:3.5rem 1.5rem}.ds-cover-blocks{grid-template-columns:repeat(3,1fr);display:grid}.ds-pillar{background-image:linear-gradient(90deg,#14141414 1px,#0000 1px);background-size:50% 100%;flex-direction:column;gap:.25rem;min-height:11rem;padding:1.25rem 1.5rem;display:flex}.ds-pillar.is-paper{background-color:var(--ds-paper-cream);color:var(--ds-sand-950)}.ds-pillar.is-ink{background-color:var(--ds-sand-950);color:var(--ds-paper-bright);background-image:linear-gradient(90deg,#fffdf814 1px,#0000 1px)}.ds-pillar.is-signal{background-color:var(--ds-signal-400);color:var(--ds-sand-950)}.ds-pillar-name{font-family:var(--font-primary);font-size:1.75rem;line-height:1.15}.ds-pillar-hex{font-family:var(--ds-font-mono);opacity:.8;font-size:.8125rem}.ds-pillar-text{margin-top:auto;font-size:.9375rem;line-height:1.4}@media (max-width:767px){.ds-cover-blocks{grid-template-columns:1fr}.ds-pillar{min-height:0}.ds-pillar-text{margin-top:.75rem}}.ds-nav{flex-wrap:wrap;justify-content:center;gap:.5rem;display:flex}.ds-nav a{border:1px solid var(--color-border);color:var(--color-text);transition:var(--ds-transition-colors);border-radius:999px;padding:.375rem .875rem;font-size:.875rem;font-weight:500}.ds-nav a:hover{border-color:var(--ds-signal-400);background:var(--ds-color-accent-soft)}.ds-logo-panel{background:var(--ds-color-bg);place-items:center;min-height:9.5rem;padding:2.5rem 2rem 2.25rem;display:grid;position:relative}.ds-logo-panel+.ds-logo-panel{border-top:1px solid #fffdf81a}.ds-logo-panel img{width:100%;max-width:15rem;height:auto}.ds-logo-caption{letter-spacing:.14em;text-transform:uppercase;color:var(--ds-text-tertiary);font-size:.6875rem;font-weight:600;position:absolute;top:.75rem;left:1rem}.ds-fold{overscroll-behavior:contain;border:1px solid var(--ds-border-default);border-radius:var(--ds-radius-lg);background:var(--ds-paper-cream);height:15rem;position:relative;overflow-y:auto}.ds-fold-header{z-index:1;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--ds-border-default);background:#faf3eaeb;align-items:center;height:4rem;padding:0 1rem;display:flex;position:sticky;top:0}.ds-fold-logo svg{width:min(13rem,60vw);height:auto;display:block}.ds-fold-body{flex-direction:column;gap:.75rem;min-height:40rem;padding:1.25rem 1rem 2rem;display:flex}.ds-fold-hint{color:var(--ds-text-secondary);font-size:.8125rem;font-weight:600}.ds-fold-line{background:var(--ds-sand-100);border-radius:999px;height:.625rem;display:block}.ds-fold-block{border:1.5px dashed var(--ds-sand-200);border-radius:var(--ds-radius-md);height:6rem;display:block}.ds-big-swatch{min-height:10rem;display:grid}.ds-big-swatch>div{flex-direction:column;justify-content:flex-end;gap:.25rem;padding:1.25rem 1.5rem;display:flex}.ds-big-swatch span{font-weight:600}.ds-big-swatch code{font-family:var(--ds-font-mono);opacity:.8;font-size:.8125rem}.ds-ramp{grid-template-columns:repeat(8,minmax(0,1fr));gap:.25rem 0;display:grid}.ds-ramp li{flex-direction:column;gap:.15rem;display:flex}.ds-ramp-swatch{height:5rem;margin-bottom:.5rem;display:block}.ds-ramp li:first-child .ds-ramp-swatch{border-radius:var(--ds-radius-lg) 0 0 var(--ds-radius-lg)}.ds-ramp li:last-child .ds-ramp-swatch{border-radius:0 var(--ds-radius-lg) var(--ds-radius-lg) 0}.ds-ramp-step{font-weight:700}.ds-ramp code{font-family:var(--ds-font-mono);color:var(--color-text-light);font-size:.75rem}.ds-ramp-role{color:var(--color-text-light);padding-right:.5rem;font-size:.8125rem;line-height:1.25}@media (max-width:767px){.ds-ramp{grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem 0}.ds-ramp li:nth-child(4) .ds-ramp-swatch{border-radius:0 var(--ds-radius-lg) var(--ds-radius-lg) 0}.ds-ramp li:nth-child(5) .ds-ramp-swatch{border-radius:var(--ds-radius-lg) 0 0 var(--ds-radius-lg)}}.ds-rule-demo{justify-content:center;align-items:center;min-height:8.5rem;padding:1.5rem;display:flex}.ds-demo-label{font-size:1.375rem;font-weight:700}.ds-demo-price{font-size:2.25rem;line-height:1}.ds-sample-button{height:var(--ds-control-h-md);border-radius:var(--ds-radius-md);align-items:center;padding:0 1rem;font-size:.875rem;font-weight:600;display:inline-flex}.ds-sample-button.is-ink{background:var(--ds-sand-950);color:var(--ds-paper-bright)}.ds-sample-button.is-signal{background:var(--ds-signal-400);color:var(--ds-sand-950);opacity:.55;position:relative}.ds-sample-button.is-signal:after{content:"";background:var(--ds-red-600);height:2px;position:absolute;top:50%;left:-.375rem;right:-.375rem;transform:rotate(-12deg)}.ds-dot-lg{border-radius:999px;width:2.5rem;height:2.5rem;display:inline-block}.ds-status{border-radius:999px;align-items:center;gap:.4rem;padding:.25rem .65rem;font-size:.8125rem;font-weight:600;display:inline-flex}.ds-status-dot{border-radius:999px;width:.45rem;height:.45rem}.ds-forum-sample,.ds-karla-sample,.ds-scale li>span{color:var(--color-text)}.ds-forum-sample{font-size:clamp(2.25rem,5vw,3.5rem);line-height:1.1}.ds-forum-number{color:var(--ds-text-brand);margin-top:1rem;font-size:clamp(2.5rem,6vw,4rem);line-height:1}.ds-karla-sample{font-size:1.375rem;line-height:1.4}.ds-weights{grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem;margin-top:1.5rem;display:grid}.ds-weights li{border-top:1px solid var(--color-border);font-variant-numeric:tabular-nums;flex-direction:column;gap:.25rem;padding-top:.75rem;font-size:1.375rem;display:flex}.ds-weights span{font-family:var(--ds-font-mono);color:var(--color-text-light);font-size:.75rem;font-weight:400}.ds-scale li{border-top:1px solid var(--color-border);grid-template-columns:9rem 1fr;align-items:baseline;gap:1rem;padding:.75rem 0;display:grid}.ds-scale li>span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}@media (max-width:639px){.ds-scale li{grid-template-columns:1fr;gap:.25rem}.ds-weights{grid-template-columns:repeat(2,minmax(0,1fr))}}.ds-space-bars li{grid-template-columns:5.5rem 1fr 3rem;align-items:center;gap:.75rem;padding:.3rem 0;display:grid}.ds-space-bar{background:var(--ds-signal-100);border:1px solid var(--ds-signal-300);border-radius:2px;max-width:100%;height:.75rem;display:block}.ds-radii{grid-template-columns:repeat(auto-fit,minmax(6.5rem,1fr));gap:1rem;display:grid}.ds-radii li{flex-direction:column;gap:.25rem;display:flex}.ds-radius-box{border:1.5px solid var(--ds-sand-950);background:var(--ds-signal-50);height:4rem;margin-bottom:.5rem;display:block}.dark .ds-radius-box{border-color:var(--ds-paper-bright);background:#f55d1a29}.ds-shadow-panel{background:var(--ds-surface-sunken);color:var(--ds-text-primary);border:1px solid var(--ds-border-subtle)}.ds-shadow-panel .ds-eyebrow{color:var(--ds-text-secondary)}.ds-shadows{grid-template-columns:repeat(auto-fit,minmax(6rem,1fr));gap:1rem;display:grid}.ds-shadows li{border-radius:var(--ds-radius-lg);background:var(--ds-surface-card);place-items:end start;height:5rem;padding:.75rem;display:grid}.ds-shadows .ds-mono{color:var(--ds-text-secondary)}.ds-focus-demo{height:var(--ds-control-h-md);border:1px solid var(--ds-border-focus);border-radius:var(--ds-radius-md);background:var(--ds-surface-card);max-width:20rem;box-shadow:var(--ds-focus-ring);color:var(--ds-text-tertiary);align-items:center;padding:0 .875rem;font-size:.9375rem;display:flex}.ds-caret{background:var(--ds-text-primary);width:1px;height:1.1rem;margin-left:2px;animation:1.1s step-end infinite ds-caret}@keyframes ds-caret{50%{opacity:0}}.ds-motif{place-items:center;height:11rem;display:grid;position:relative;overflow:hidden}.ds-motif-paper{background:var(--ds-gradient-paper)}.ds-motif-rules{background:linear-gradient(to right, var(--ds-grid-line-color) 1px, transparent 1px) 0 0 / calc(100% / 6) 100%, var(--ds-gradient-paper);--ds-grid-line-color:#281c1229;background-position:8.33333% 0,0 0}.ds-motif-grid{background-color:var(--ds-paper-cream)}.ds-motif-grid:before{content:"";background-image:linear-gradient(90deg,#281c1224 1px,#0000 1px),linear-gradient(#281c1218 1px,#0000 1px);background-position:top;background-size:4.25rem 4.25rem;position:absolute;inset:0;-webkit-mask-image:radial-gradient(94% 76% at 50% 0,#000 0%,#000000e0 38%,#0000005c 70%,#0000 98%);mask-image:radial-gradient(94% 76% at 50% 0,#000 0%,#000000e0 38%,#0000005c 70%,#0000 98%)}.ds-motif-aurora{background:var(--ds-paper-cream)}.ds-motif-aurora:before,.ds-motif-aurora:after{content:"";filter:blur(28px);border-radius:999px;position:absolute}.ds-motif-aurora:before{background:radial-gradient(#f55d1a80 0%,#ff8d643d 44%,#0000 76%);width:62%;height:72%;animation:14s ease-in-out infinite alternate ds-aurora-signal;top:14%;left:4%}.ds-motif-aurora:after{background:radial-gradient(#49867b6b 0%,#49867b33 48%,#0000 78%);width:58%;height:72%;animation:16s ease-in-out infinite alternate ds-aurora-sage;top:18%;right:4%}@keyframes ds-aurora-signal{0%{transform:translate(-4%,-3%)scale(.96)}to{transform:translate(12%,4%)scale(1.06)}}@keyframes ds-aurora-sage{0%{transform:translate(6%,2%)scale(1)}to{transform:translate(-12%,-2%)scale(1.05)}}.ds-motif-gradient{background:var(--ds-paper-bright)}.ds-text-gradient{background:var(--ds-color-gradient);color:#0000;-webkit-background-clip:text;background-clip:text;font-size:clamp(2.5rem,5vw,3.25rem);line-height:1}.ds-motif-espresso{background:var(--ds-gradient-espresso)}@media (prefers-reduced-motion:reduce){.ds-motif-aurora:before,.ds-motif-aurora:after,.ds-caret{animation:none}}.ds-icon-panel{border:1px solid var(--ds-border-subtle);border-radius:var(--ds-radius-xl);background:var(--ds-gradient-paper);color:var(--ds-text-primary);padding:clamp(1.25rem,3vw,2rem)}.ds-icons{grid-template-columns:repeat(auto-fill,minmax(5.5rem,1fr));gap:.25rem;display:grid}.ds-icons li{border-radius:var(--ds-radius-md);transition:var(--ds-transition-colors);flex-direction:column;align-items:center;gap:.5rem;padding:.875rem .25rem .75rem;display:flex}.ds-icons li:hover{background:var(--ds-surface-card)}.ds-icons img{width:2rem;height:2rem}.ds-icons span{text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-family:var(--ds-font-mono);color:var(--ds-text-secondary);font-size:.6875rem;overflow:hidden}.ds-icon-note{color:var(--ds-text-secondary);margin-top:1.25rem;font-size:.875rem}.ds-illustration{background:var(--ds-gradient-paper)}.ds-chips{grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr));gap:.5rem;display:grid}.ds-chips li{grid-template-rows:auto auto;grid-template-columns:2rem 1fr;align-items:center;column-gap:.625rem;display:grid}.ds-chip-swatch{border-radius:var(--ds-radius-sm);grid-row:span 2;width:2rem;height:2rem;box-shadow:inset 0 0 0 1px #1414141f}.ds-chip-name{font-size:.8125rem;font-weight:600}.ds-chips .ds-mono{font-size:.75rem}.ds-roles{border-collapse:collapse;text-align:left;width:100%;min-width:36rem}.ds-roles th,.ds-roles td{border-top:1px solid var(--color-border);vertical-align:middle;padding:.5rem .75rem .5rem 0;font-weight:400}.ds-roles thead th{letter-spacing:.14em;text-transform:uppercase;color:var(--color-text-light);border-top:0;font-size:.75rem;font-weight:600}.ds-roles tbody th code{font-family:var(--ds-font-mono);font-size:.8125rem}.ds-role-cell{align-items:center;gap:.5rem;display:inline-flex}.ds-role-swatch{border-radius:var(--ds-radius-xs);width:1.5rem;height:1.5rem;display:inline-block;box-shadow:inset 0 0 0 1px #1414141f}.ds-ratio{background:var(--color-border);border-radius:999px;padding:.05rem .45rem;font-size:.6875rem;font-weight:700}.ds-token-list{gap:.125rem;display:grid}.ds-token-list li{border-top:1px solid var(--color-border);flex-wrap:wrap;justify-content:space-between;gap:.25rem 1rem;padding:.375rem 0;display:flex}.ds-token-list code{font-family:var(--ds-font-mono);font-size:.8125rem}.ds-token-list .ds-mono{overflow-wrap:anywhere;text-align:right;max-width:100%}