#cube-design-system{background:var(--mk-surface-page);color:var(--mk-color-ink);color-scheme:light;font:400 var(--mk-font-body) /var(--mk-font-line-body) var(--mk-font-family);min-height:100vh;overflow-wrap:anywhere;padding:24px}#cube-design-system *,#cube-design-system :after,#cube-design-system :before{box-sizing:border-box}#cube-design-system :is(h1,h2,h3,h4,p){margin:0}#cube-design-system h2{font-size:28px;font-weight:600;letter-spacing:-.025em;line-height:1.2}#cube-design-system h3{font-size:18px;font-weight:600;margin-bottom:16px}#cube-design-system h4{font-weight:600;margin-bottom:8px}#cube-design-system code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11px}#cube-design-system a{color:inherit;text-decoration:none}#cube-design-system .ds-header{align-items:center;display:flex;gap:20px;justify-content:space-between;margin:auto;max-width:var(--mk-layout-max);padding:12px 4px 28px}#cube-design-system .ds-brand{align-items:center;display:flex;font-size:16px;font-weight:600;gap:18px}#cube-design-system .ds-brand img{height:auto;width:64px}#cube-design-system .ds-brand small{color:var(--mk-color-muted);display:block;font-size:11px;font-weight:400;margin-top:3px}#cube-design-system .ds-workspace{display:grid;gap:32px;grid-template-columns:168px minmax(0,1fr);margin:auto;max-width:var(--mk-layout-max)}#cube-design-system .ds-nav{align-self:start;display:grid;gap:6px;padding-block:20px;position:sticky;top:24px}#cube-design-system .ds-nav a{border-radius:20px;color:var(--mk-color-muted);min-height:44px;padding:10px 16px}#cube-design-system .ds-nav a:hover{background:var(--mk-surface-control);color:var(--mk-color-action)}#cube-design-system .ds-nav>span{color:var(--mk-color-muted);font-size:11px;padding:16px}#cube-design-system .ds-main{display:grid;gap:64px;min-width:0}#cube-design-system .ds-hero{overflow:hidden;padding:42px}#cube-design-system .ds-hero h1{font-size:clamp(32px,4.4vw,64px);font-weight:600;letter-spacing:-.045em;line-height:1.05;margin:22px 0}#cube-design-system .ds-hero>p{color:var(--mk-color-muted);font-size:16px;margin-bottom:32px;max-width:620px}#cube-design-system .ds-eyebrow{color:var(--mk-color-muted);display:block;font-size:10px;font-weight:500;letter-spacing:.11em;text-transform:uppercase}#cube-design-system .ds-actions{align-items:center;display:flex;flex-wrap:wrap;gap:12px}#cube-design-system .ds-subrow{margin-top:20px}#cube-design-system .ds-muted{color:var(--mk-color-muted);font-size:12px}#cube-design-system .ds-section{display:grid;gap:24px;min-width:0;scroll-margin-top:24px}#cube-design-system .ds-section>h3{margin-bottom:-8px}#cube-design-system .ds-section-heading{align-items:end;display:flex;gap:24px;justify-content:space-between}#cube-design-system .ds-section-heading h2{margin-top:8px}#cube-design-system .ds-section-heading>p{color:var(--mk-color-muted);font-size:12px;max-width:350px}#cube-design-system .ds-colors{display:grid;gap:12px;grid-template-columns:repeat(5,minmax(0,1fr))}#cube-design-system .ds-swatch{display:flex;flex-direction:column;gap:6px}#cube-design-system .ds-swatch-color{border:1px solid #e7ebf1;border-radius:12px;height:54px;margin-bottom:5px;width:100%}#cube-design-system .ds-swatch strong{font-size:12px;font-weight:500}#cube-design-system .ds-swatch small{color:var(--mk-color-muted);font-size:10px}#cube-design-system .ds-grid-two{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}#cube-design-system .ds-full-row{grid-column:1/-1}#cube-design-system .ds-note{color:var(--mk-color-muted);font-size:12px;line-height:1.6}#cube-design-system .mk-surface>.ds-note{margin-top:20px}#cube-design-system .ds-type-row{border-bottom:1px solid var(--mk-color-line);display:flex;flex-direction:column;gap:8px;padding:14px 0}#cube-design-system .ds-type-row>span{letter-spacing:-.025em;line-height:1.2}#cube-design-system .ds-type-row>code{color:var(--mk-color-muted)}#cube-design-system .ds-space-row{align-items:center;display:flex;gap:20px;margin-block:13px}#cube-design-system .ds-space-row>code{color:var(--mk-color-muted);min-width:64px}#cube-design-system .ds-space-row>span{background:var(--mk-color-brand);border-radius:4px;height:16px}#cube-design-system .ds-radius-row{display:grid;gap:8px;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:24px}#cube-design-system .ds-radius-row>span{border:1px solid #c4d2e2;font-size:11px;padding:12px 8px;text-align:center}#cube-design-system .ds-radius-row small{color:var(--mk-color-muted);display:block}#cube-design-system .ds-materials{background:radial-gradient(ellipse at 0 0,#deecff,transparent 65%),radial-gradient(ellipse at 100% 100%,#ffebdf,transparent 65%);border-radius:32px;display:grid;gap:20px;grid-template-columns:repeat(2,minmax(0,1fr));padding:20px}#cube-design-system .ds-material{display:flex;flex-direction:column;gap:16px}#cube-design-system .ds-material h3{margin:0}#cube-design-system .ds-material p{color:var(--mk-color-muted);min-height:42px}#cube-design-system .ds-material code{color:var(--mk-color-muted);margin-top:auto}#cube-design-system .ds-stack{align-content:start;display:grid;gap:20px}#cube-design-system .ds-icons{display:grid;gap:12px;grid-template-columns:repeat(6,minmax(0,1fr))}#cube-design-system .ds-icons>div{color:var(--mk-color-muted);display:grid;gap:16px;justify-items:center;text-align:center}#cube-design-system .ds-pattern-heading{align-items:start;display:flex;gap:16px;justify-content:space-between}#cube-design-system .ds-pattern-heading+p{color:var(--mk-color-muted);font-size:13px}#cube-design-system .ds-path{color:var(--mk-color-muted);display:block;margin:18px 0}#cube-design-system .ds-code{background:#eaf0f56b;border:1px solid var(--mk-color-glass-border);border-radius:18px;line-height:1.8;margin-block:16px;max-width:100%;overflow-wrap:anywhere;padding:20px;white-space:pre-wrap}#cube-design-system .ds-code code{font-size:12px}#cube-design-system .ds-component-list{display:flex;flex-wrap:wrap;gap:8px}#cube-design-system .ds-component-list code{border:1px solid var(--mk-color-line);border-radius:12px;color:var(--mk-color-muted);padding:6px 10px}#cube-design-system .ds-download{align-items:center;color:var(--mk-color-action);display:inline-flex;gap:8px;min-height:44px}#cube-design-system .ds-table{border-collapse:collapse;font-size:12px;text-align:left;width:100%}#cube-design-system .ds-table caption{color:var(--mk-color-muted);margin-bottom:12px;text-align:left}#cube-design-system .ds-table :is(th,td){border-bottom:1px solid var(--mk-color-line);padding:12px}#cube-design-system .ds-table th{font-weight:500}#cube-design-system .ds-rules{color:var(--mk-color-muted);display:grid;font-size:13px;gap:12px;list-style:disc;margin:0;padding-left:18px}#cube-design-system .ds-footer{color:var(--mk-color-muted);display:flex;flex-wrap:wrap;font-size:11px;gap:16px;justify-content:space-between;padding-bottom:24px}#cube-design-system :is(a,button,input,:is(select,.mk-option-select),textarea,[tabindex]):focus-visible:not([tabindex="-1"]){outline:2px solid var(--mk-color-action);outline-offset:4px}#cube-design-system .ds-skip{background:#fff;border-radius:20px;left:20px;padding:12px 18px;position:fixed;top:8px;transform:translateY(-180%);z-index:30}#cube-design-system .ds-skip:focus{transform:none}@media(max-width:1100px){#cube-design-system .ds-colors,#cube-design-system .ds-icons{grid-template-columns:repeat(4,minmax(0,1fr))}#cube-design-system .ds-section-heading{align-items:start;flex-direction:column;gap:12px}}@media(max-width:850px){#cube-design-system .ds-workspace{gap:12px;grid-template-columns:minmax(0,1fr)}#cube-design-system .ds-nav{display:flex;flex-wrap:wrap;gap:0;padding-block:0 12px;position:static}#cube-design-system .ds-nav>span{display:none}#cube-design-system .ds-nav a{font-size:12px;padding-inline:12px}}@media(max-width:540px){#cube-design-system{padding:14px}#cube-design-system .ds-header{align-items:start;flex-wrap:wrap;padding-bottom:16px}#cube-design-system .ds-main{gap:42px}#cube-design-system .ds-hero{padding:26px 22px}#cube-design-system .ds-colors{grid-template-columns:repeat(2,minmax(0,1fr))}#cube-design-system .ds-grid-two,#cube-design-system .ds-materials{grid-template-columns:minmax(0,1fr)}#cube-design-system .ds-materials{padding:12px}#cube-design-system .ds-icons{grid-template-columns:repeat(3,minmax(0,1fr))}#cube-design-system .ds-table :is(th,td){padding:10px 4px}#cube-design-system h2{font-size:25px}}