.ds-head{border-bottom:1px solid var(--ui-line);background:var(--ui-surface);grid-template-columns:1.2fr 1fr;align-items:end;gap:60px;padding:64px 56px 32px;display:grid}.ds-head .eyebrow{font-family:var(--font-jetbrains), monospace;letter-spacing:.22em;text-transform:uppercase;color:var(--ui-text-3);margin-bottom:16px;font-size:11px}.ds-head h1{font-family:var(--font-fraunces), serif;letter-spacing:-.03em;margin:0;font-size:clamp(48px,6vw,92px);font-weight:400;line-height:.92}.ds-head h1 .em{color:var(--ui-text-2);font-style:italic}.ds-head p{color:var(--ui-text-2);max-width:50ch;margin:0;font-size:16px;line-height:1.55}.ds-head .meta{font-family:var(--font-jetbrains), monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--ui-text-3);grid-template-columns:repeat(3,1fr);gap:24px;margin-top:24px;font-size:11px;display:grid}.ds-head .meta strong{color:var(--ui-text);font-family:var(--font-inter), sans-serif;text-transform:none;letter-spacing:0;margin-top:4px;font-size:14px;display:block}.ds{font-family:var(--font-inter), sans-serif;gap:64px;padding:56px;display:grid}.ds-sec{grid-template-columns:220px 1fr;align-items:start;gap:48px;display:grid}.ds-sec__head{position:sticky;top:24px}.ds-sec__num{font-family:var(--font-jetbrains), monospace;color:var(--ui-accent);letter-spacing:.22em;text-transform:uppercase;font-size:11px}.ds-sec__title{font-family:var(--font-fraunces), serif;letter-spacing:-.01em;margin:12px 0 8px;font-size:28px;font-weight:500}.ds-sec__sub{color:var(--ui-text-3);font-size:13px;line-height:1.55}@media (max-width:900px){.ds-head{grid-template-columns:1fr;gap:24px;padding:32px 20px}.ds{gap:48px;padding:32px 20px}.ds-sec{grid-template-columns:1fr;gap:16px}.ds-sec__head{position:static}}.ds-type-stack{gap:18px;display:grid}.ds-type-row{border:1px solid var(--ui-line);background:var(--ui-surface);border-radius:14px;grid-template-columns:1fr 220px;align-items:end;gap:24px;padding:22px 24px;display:grid}.ds-type-row .spec{font-family:var(--font-jetbrains), monospace;color:var(--ui-text-3);letter-spacing:.14em;text-transform:uppercase;text-align:right;font-size:10px;line-height:1.6}.ds-type-row .spec strong{color:var(--ui-text);font-size:12px;display:block}.specimen-display{font-family:var(--font-fraunces), serif;letter-spacing:-.03em;font-weight:400;line-height:.92}.specimen-sans{font-family:var(--font-inter), sans-serif}.specimen-mono{font-family:var(--font-jetbrains), monospace}@media (max-width:700px){.ds-type-row{grid-template-columns:1fr}.ds-type-row .spec{text-align:left}}.ds-palettes{gap:28px;display:grid}.ds-palette h4{font-family:var(--font-jetbrains), monospace;letter-spacing:.18em;text-transform:uppercase;color:var(--ui-text-3);margin:0 0 12px;font-size:11px;font-weight:500}.ds-palette__grid{grid-template-columns:repeat(5,1fr);gap:8px;display:grid}@media (max-width:700px){.ds-palette__grid{grid-template-columns:repeat(2,1fr)}}.ds-chip{aspect-ratio:1.5;font-family:var(--font-jetbrains), monospace;letter-spacing:.08em;border:1px solid var(--ui-line);border-radius:10px;flex-direction:column;justify-content:space-between;padding:12px;font-size:10px;display:flex;position:relative}.ds-chip .name{font-weight:600}.ds-chip .hex{opacity:.75}.ds-chip.dark{color:#fff;border-color:#ffffff26}.ds-chip.dark .hex{color:#ffffffb3}.ds-spacing{gap:6px;display:grid}.ds-spacing__row{grid-template-columns:80px 1fr;align-items:center;gap:14px;padding:6px 0;display:grid}.ds-spacing__row .nm{font-family:var(--font-jetbrains), monospace;color:var(--ui-text-2);font-size:11px}.ds-spacing__row .nm strong{color:var(--ui-text)}.ds-spacing__row .vis{background:var(--ui-text);border-radius:4px;height:22px}.ds-radius{grid-template-columns:repeat(5,1fr);gap:12px;display:grid}@media (max-width:700px){.ds-radius{grid-template-columns:repeat(3,1fr)}}.ds-r-tile{aspect-ratio:1;background:var(--ui-surface);border:1px solid var(--ui-line);font-family:var(--font-jetbrains), monospace;color:var(--ui-text-3);letter-spacing:.1em;flex-direction:column;justify-content:space-between;padding:12px;font-size:10px;display:flex}.ds-r-tile strong{color:var(--ui-text);font-size:13px;display:block}.ds-elev{grid-template-columns:repeat(3,1fr);gap:16px;display:grid}@media (max-width:700px){.ds-elev{grid-template-columns:1fr}}.ds-e-tile{background:var(--ui-surface);border:1px solid var(--ui-line);height:140px;font-family:var(--font-jetbrains), monospace;color:var(--ui-text-3);letter-spacing:.1em;border-radius:12px;flex-direction:column;justify-content:space-between;padding:22px;font-size:10px;display:flex}.ds-e-tile strong{color:var(--ui-text);margin-bottom:4px;font-size:13px;display:block}.ds-e-1{box-shadow:var(--elev-1)}.ds-e-2{box-shadow:var(--elev-2)}.ds-e-3{box-shadow:var(--elev-3)}.ds-comp-row{border:1px solid var(--ui-line);background:var(--ui-surface);border-radius:14px;gap:16px;margin-bottom:16px;padding:24px;display:grid}.ds-comp-row h5{font-family:var(--font-jetbrains), monospace;letter-spacing:.18em;text-transform:uppercase;color:var(--ui-text-3);margin:0;font-size:11px;font-weight:500}.ds-comp-row .examples{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.ds-btn-app{height:40px;font-family:var(--font-inter), sans-serif;border-radius:10px;align-items:center;gap:8px;padding:0 18px;font-size:13px;font-weight:600;display:inline-flex}.ds-btn-app.primary{background:var(--ui-text);color:var(--ui-surface)}.ds-btn-app.ghost{background:var(--ui-bg);border:1px solid var(--ui-line);color:var(--ui-text)}.ds-btn-app.outline{background:var(--ui-surface);border:1px solid var(--ui-text);color:var(--ui-text)}.ds-btn-app.danger{color:#fff;background:#b3261e}.ds-btn-cn{font-family:var(--font-jetbrains), monospace;letter-spacing:.2em;text-transform:uppercase;border-radius:999px;padding:14px 22px;font-size:11px;font-weight:600}.ds-btn-cn.primary{background:var(--cn-accent);color:var(--cn-bg)}.ds-btn-cn.ghost{border:1px solid var(--cn-line);color:var(--cn-text);background:0 0}.ds-input-spec{border:1px solid var(--ui-line);background:var(--ui-surface);height:40px;font-family:var(--font-inter), sans-serif;color:var(--ui-text);border-radius:8px;min-width:240px;padding:0 12px;font-size:14px}.ds-input-spec:focus{border-color:var(--ui-text);box-shadow:0 0 0 3px color-mix(in oklab, var(--ui-text) 12%, transparent);outline:none}.ds-card-app{background:var(--ui-surface);border:1px solid var(--ui-line);border-radius:14px;width:260px;padding:20px}.ds-card-app h6{font-family:var(--font-fraunces), serif;margin:0 0 4px;font-size:18px;font-weight:500}.ds-card-app p{color:var(--ui-text-2);margin:0;font-size:13px;line-height:1.5}.ds-card-app .pill{font-family:var(--font-jetbrains), monospace;background:var(--ui-bg);color:var(--ui-text-2);letter-spacing:.1em;border-radius:999px;padding:4px 8px;font-size:10px}.ds-chart-card{background:var(--ui-surface);border:1px solid var(--ui-line);border-radius:14px;width:100%;padding:22px}.ds-chart-legend{font-family:var(--font-jetbrains), monospace;color:var(--ui-text-2);gap:16px;margin-bottom:12px;font-size:11px;display:flex}.ds-chart-legend span{align-items:center;gap:6px;display:inline-flex}.ds-chart-legend .sw{border-radius:2px;width:10px;height:10px}.ds-motion-grid{grid-template-columns:1fr 1fr;gap:16px;display:grid}@media (max-width:700px){.ds-motion-grid{grid-template-columns:1fr}}.ds-motion-card{border:1px solid var(--ui-line);background:var(--ui-surface);border-radius:14px;padding:22px}.ds-motion-card.ok{background:color-mix(in oklab, #2f7d3e 4%, var(--ui-surface));border-color:#2f7d3e}.ds-motion-card.no{background:color-mix(in oklab, #b3261e 4%, var(--ui-surface));border-color:#b3261e}.ds-motion-card .tag{font-family:var(--font-jetbrains), monospace;letter-spacing:.18em;text-transform:uppercase;margin-bottom:10px;font-size:10px}.ds-motion-card.ok .tag{color:#2f7d3e}.ds-motion-card.no .tag{color:#b3261e}.ds-motion-card h5{font-family:var(--font-fraunces), serif;margin:0 0 8px;font-size:20px;font-weight:500}.ds-motion-card p{color:var(--ui-text-2);margin:0;font-size:13px;line-height:1.5}.ds-motion-card ul{color:var(--ui-text-2);margin:8px 0 0;padding-left:18px;font-size:13px;line-height:1.6}.ds-cn-preview{background:var(--cn-bg);color:var(--cn-text);border-radius:14px;padding:32px;position:relative;overflow:hidden}.ds-cn-preview h3{font-family:var(--font-fraunces), serif;letter-spacing:-.02em;margin:0 0 8px;font-size:48px;font-weight:400;line-height:1}.ds-cn-preview h3 .em{color:var(--cn-accent);font-style:italic}.ds-cn-preview p{color:var(--cn-text-2);max-width:50ch;margin:0 0 18px;font-size:14px;line-height:1.55}
