.ds{flex:1;width:100%;min-width:0;min-height:0;display:flex}.ds-layout{box-sizing:border-box;flex:1;grid-template-rows:minmax(0,1fr);grid-template-columns:240px 1fr;align-items:stretch;width:100%;height:100%;min-height:0;padding-top:60px;transition:grid-template-columns .24s;display:grid}.ds-layout.is-collapsed{grid-template-columns:64px 1fr}.ds-side{border-right:1px solid var(--hair);flex-direction:column;gap:6px;min-height:0;padding:20px 24px;display:flex;overflow:hidden}.ds-side-collapse{width:32px;height:32px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:6px;justify-content:center;align-self:flex-start;align-items:center;margin:0 0 0 -6px;padding:0;display:flex}.ds-side-collapse:hover{color:var(--ink-strong);background:#f1f1f1}.ds-side-collapse:focus-visible,.ds-open:focus-visible,.ds-drawer-close:focus-visible{outline-offset:2px;outline:2px solid #0070e9}.ds-def{flex-direction:column;gap:6px;margin-bottom:10px;padding-top:6px;transition:opacity .16s;display:flex}.ds-def-word{font-family:var(--font-head);letter-spacing:-.01em;color:var(--ink-strong);font-size:22px;font-weight:500;line-height:1.15}.ds-def-meta{font-family:var(--font-head);color:#6b7076;margin:0;font-size:13px;line-height:1.4}.ds-def-meta i{margin-left:4px;font-style:italic}.ds-def:after{content:"";background:var(--hair);height:1px;margin:14px -24px 0;display:block}.ds-def-text{font-family:var(--font-head);color:#5c6269;margin:0;font-size:14px;line-height:1.5}.ds-side-list{scrollbar-width:none;flex-direction:column;gap:22px;transition:opacity .16s;display:flex;overflow:hidden auto}.ds-side-list::-webkit-scrollbar{display:none}.ds-side::-webkit-scrollbar{display:none}.ds-side{scrollbar-width:none}.ds-main,.ds-code pre{scrollbar-width:thin;scrollbar-color:#e2e2e2 transparent}.ds-main::-webkit-scrollbar{width:6px;height:6px}.ds-code pre::-webkit-scrollbar{width:6px;height:6px}.ds-main::-webkit-scrollbar-thumb{background:#e2e2e2;border-radius:99px}.ds-code pre::-webkit-scrollbar-thumb{background:#e2e2e2;border-radius:99px}.ds-main::-webkit-scrollbar-track{background:0 0}.ds-code pre::-webkit-scrollbar-track{background:0 0}.ds-layout.is-collapsed .ds-side-list,.ds-layout.is-collapsed .ds-def{opacity:0;visibility:hidden;pointer-events:none}.ds-side-group{flex-direction:column;gap:4px;display:flex}.ds-side-group+.ds-side-group{border-top:1px solid var(--hair);margin-right:-24px;padding-top:18px;padding-right:24px}.ds-side-label{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:#a3a8ad;margin-bottom:8px;font-size:10px;font-weight:500}.ds-side-item{font-family:var(--font-head);color:#4e4e4c;border-right:2px solid #0000;margin-right:-24px;padding:6px 24px 6px 0;font-size:14px;text-decoration:none;transition:color .16s}.ds-side-item:hover{color:var(--ink-strong)}.ds-side-item.is-active{color:#000;border-right-color:#000;font-weight:500}.ds-main{min-width:0;min-height:0;padding:36px 48px 64px;overflow-y:auto}.ds-panel{flex-direction:column;gap:28px;padding-bottom:40px;display:flex}.ds-panel[hidden]{display:none}.ds-panel-head{flex-direction:column;gap:12px;display:flex}.ds-panel-head h2{font-family:var(--font-head);color:var(--ink-strong);font-size:20px;font-weight:500}.ds-why{max-width:640px;font-size:var(--p-size);line-height:var(--p-lh);color:var(--p-color)}.ds-title-row{align-items:center;gap:10px;display:flex}.ds-stage{padding:8px 0}.ds-code{flex-direction:column;gap:10px;display:flex}.ds-code-top{border-bottom:1px solid var(--hair);font-family:var(--font-head);color:var(--ink-strong);justify-content:space-between;align-items:center;gap:24px;padding-bottom:8px;font-size:14px;font-weight:500;display:flex}.ds-copy{height:28px;font-family:var(--font-mono);color:#cc5f31;cursor:pointer;background:0 0;border:1px solid #e4e4e4;border-radius:4px;padding:0 12px;font-size:11px}.ds-copy:hover{background:#f3f3f3}.ds-code pre{border:1px solid var(--hair);max-height:260px;font-family:var(--font-mono);color:#4e4e4c;white-space:pre-wrap;word-break:break-word;background:#f8f8f8;border-radius:12px;padding:16px;font-size:11px;line-height:1.6;overflow:hidden auto}.ds-row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.ds-rules{font-family:var(--font-head);color:#4e4e4c;flex-direction:column;gap:8px;margin:8px 0 0;padding-left:18px;font-size:15px;line-height:1.5;display:flex}.ds-rules b{color:var(--ink-strong);font-weight:500}.ds-swatches{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 24px;display:grid}.ds-swatch{border:1px solid var(--hair);border-radius:12px;grid-template-columns:44px 1fr auto;grid-template-areas:"chip name hex""chip use use";align-items:center;gap:2px 14px;padding:12px;display:grid}.ds-chip{border:1px solid #0000000f;border-radius:8px;grid-area:chip;width:44px;height:44px}.ds-sw-name{font-family:var(--font-head);color:var(--ink-strong);grid-area:name;font-size:14px;font-weight:500}.ds-sw-hex{font-family:var(--font-mono);color:var(--muted);grid-area:hex;font-size:11px}.ds-sw-use{font-family:var(--font-head);color:#5c6269;grid-area:use;font-size:13px}.ds-type{border:1px solid var(--hair);border-radius:16px;flex-direction:column;gap:14px;padding:28px;display:flex}.ds-type-row{border-top:1px solid var(--hair);flex-direction:column;gap:2px;margin-top:10px;padding-top:14px;display:flex}.ds-type-row:first-child{border-top:0;margin-top:0;padding-top:0}.ds-type-name{font-family:var(--font-head);color:var(--ink-strong);font-size:14px;font-weight:500}.ds-type-meta{font-family:var(--font-head);color:#5c6269;font-size:13px}.ds-mono{font-family:var(--font-mono);color:#4e4e4c;margin:0;font-size:13px;font-weight:300;line-height:1.645}.ds-icons{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;display:grid}.ds-icon{border:1px solid var(--hair);color:#4e4e4c;border-radius:12px;flex-direction:column;align-items:flex-start;gap:10px;padding:16px;display:flex}.ds-icon span{font-family:var(--font-head);color:#5c6269;font-size:13px}.ds-lines{border:1px solid var(--hair);border-radius:16px;flex-direction:column;gap:0;display:flex}.ds-line-row{grid-template-columns:140px 1fr;align-items:center;gap:24px;padding:20px 24px;display:grid}.ds-line-row+.ds-line-row{border-top:1px solid var(--hair)}.ds-line{width:100%;display:block}.ds-line-label{font-family:var(--font-head);color:#4e4e4c;font-size:14px;line-height:1.5}.ds-line-label b{color:var(--ink-strong);margin-right:6px;font-weight:500}.ds-note{font-family:var(--font-head);color:#5c6269;margin:14px 0 0;font-size:13px}.ds-dock{scrollbar-width:none;border-radius:4px;overflow-x:auto}.ds-dock::-webkit-scrollbar{display:none}.ds-dock .dock-nav{grid-template-columns:repeat(4,1fr);min-width:560px}.ds-dock .dock-links{display:contents}.ds-glass{border:1px solid var(--hair);border-radius:12px;position:relative;overflow:hidden}.ds-glass .glass{opacity:1;visibility:visible;position:relative;top:auto;left:auto;right:auto;transform:none}.ds-cw{border:1px solid var(--hair);border-radius:16px;flex-direction:column;align-items:center;gap:20px;padding:28px 0;display:flex;overflow:hidden}.ds-cw-track{justify-content:center;gap:28px;width:100%;display:flex}.ds-cw-slide{filter:blur(calc(var(--d) * 3px));opacity:calc(1 - var(--d) * .45);transform:scale(calc(1 - var(--d) * .05));flex:0 0 220px}.ds-cw-card{border:1px solid var(--hair);background:var(--bg);border-radius:24px;flex-direction:column;gap:14px;padding:12px 12px 16px;display:flex}.ds-cw-media{aspect-ratio:8/7;background:#ebebeb;border-radius:14px;display:block}.ds-cw-company{font-family:var(--font-head);color:var(--ink-strong);padding:0 4px;font-size:18px;font-weight:600}.ds-cw-dots{align-items:center;gap:8px;display:flex}.ds-cw-dot{width:calc(6px + (1 - var(--d)) * 26px);align-items:center;height:14px;display:grid}.ds-cw-dot i{background:color-mix(in srgb, #4e4e4c calc((1 - var(--d)) * 100%), #d7d7d7);border-radius:3px;height:6px;display:block}@media (width<=860px){.ds-icons{grid-template-columns:repeat(2,minmax(0,1fr))}.ds-line-row{grid-template-columns:1fr;gap:12px}.ds-cw-slide{flex-basis:150px}.ds-cw-track{gap:14px}}.ds-radii{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;display:grid}.ds-radii>div{font-family:var(--font-head);color:#5c6269;flex-direction:column;gap:6px;font-size:13px;display:flex}.ds-radii b{color:var(--ink-strong);font-size:14px;font-weight:500}.ds-r{background:#fcfcfc;border:1px solid #d9d9d9;height:72px;display:block}.ds-backdrop,.ds-drawer-close,.ds-open{display:none}@media (prefers-reduced-motion:reduce){.ds-layout,.ds-side-list{transition:none}}@media (width<=860px){.ds-layout{height:auto;padding-top:60px;display:block}.ds-layout.is-collapsed{display:block}.ds-side{z-index:35;background:var(--bg);border-right:1px solid var(--hair);visibility:hidden;width:min(300px,84vw);padding:20px;transition:transform .24s,visibility 0s linear .24s;position:fixed;top:60px;bottom:42px;left:0;overflow-y:auto;transform:translate(-102%)}.ds-side.is-open{visibility:visible;transition:transform .24s;transform:none;box-shadow:10px 0 30px #00000014}.ds-def:after{margin-left:-20px;margin-right:-20px}.ds-layout.is-collapsed .ds-side-list,.ds-layout.is-collapsed .ds-def{opacity:1;visibility:visible;pointer-events:auto}.ds-side-collapse{display:none}.ds-drawer-close{width:32px;height:32px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:6px;place-items:center;padding:0;display:grid;position:absolute;top:22px;right:16px}.ds-backdrop{z-index:34;background:#00000038;display:block;position:fixed;inset:60px 0 42px}.ds-backdrop[hidden]{display:none}.ds-open{width:32px;height:32px;color:var(--ink-strong);cursor:pointer;background:0 0;border:0;border-radius:6px;flex-shrink:0;place-items:center;margin-left:-6px;padding:0;display:grid}.ds-main{height:auto;padding:0 0 48px;overflow:visible}.ds-panel{padding:28px 24px 0}.ds-swatches{grid-template-columns:1fr}.ds-radii{grid-template-columns:repeat(2,minmax(0,1fr))}}