.cr-heading{letter-spacing:-.03em;color:#f0f0f0f2;margin-bottom:8px;font-size:28px;font-weight:700}.cr-intro{color:#b4b4b4b3;max-width:500px;margin-bottom:32px;font-size:14px;line-height:1.6}.cr-filter-row{flex-wrap:wrap;gap:6px;margin-bottom:32px;display:flex}.cr-filter-btn{font:inherit;color:#a0a0a0b3;cursor:pointer;background:#ffffff0a;border:1px solid #ffffff14;border-radius:20px;padding:5px 14px;font-size:12px;transition:background .12s,border-color .12s,color .12s}.cr-filter-btn:hover{color:#c8c8c8e6;background:#ffffff12}.cr-filter-btn--active{color:#e6e6e6f2;background:#ffffff1a;border-color:#fff3}.cr-grid{grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:16px;display:grid}.cr-card{cursor:pointer;background:#ffffff08;border:1px solid #ffffff14;border-radius:16px;padding:20px;transition:background .15s,border-color .15s;overflow:hidden}.cr-card:hover{background:#ffffff0d;border-color:#ffffff24}.cr-card-top{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.cr-badge{letter-spacing:.08em;text-transform:uppercase;color:#a0a0a0b3;background:#ffffff0f;border-radius:10px;padding:3px 9px;font-size:10px;font-weight:600}.cr-badge--typography{color:#f093fb;background:#f093fb1a}.cr-badge--spacing{color:#667eea;background:#667eea1a}.cr-badge--color{color:#ffd166;background:#ffd1661a}.cr-badge--motion{color:#4ade80;background:#4ade801a}.cr-expand-icon{color:#8c8c8c80;font-size:14px;transition:transform .2s;display:inline-block}.cr-expand-icon--open{transform:rotate(180deg)}.cr-card-name{letter-spacing:-.02em;color:#e6e6e6f2;margin-bottom:4px;font-size:17px;font-weight:600}.cr-card-rule{color:#a0a0a0a6;margin-bottom:16px;font-size:13px;font-style:italic;line-height:1.5}.cr-demo{background:#ffffff05;border:1px solid #ffffff0f;border-radius:10px;justify-content:center;align-items:center;min-height:52px;margin-bottom:14px;padding:14px;display:flex;overflow:hidden}.cr-spec-list{flex-direction:column;gap:4px;display:flex}.cr-spec{font-size:11px;font-family:var(--font-mono,monospace);color:#a0a0a099;line-height:1.5}.cr-spec:before{content:"↳ ";color:#78787866}.cr-expand-body{border-top:1px solid #ffffff0f;margin-top:14px;padding-top:14px}.cr-description{color:#aaaaaabf;font-size:13px;line-height:1.65}.cr-typescale{flex-wrap:wrap;align-items:baseline;gap:12px;display:flex}.cr-typescale-item{flex-direction:column;align-items:center;gap:4px;display:flex}.cr-typescale-sample{color:#c8c8c8e6;font-weight:500;line-height:1}.cr-typescale-label{font-size:9px;font-family:var(--font-mono,monospace);color:#78787899}.cr-lh-demo{gap:16px;width:100%;display:flex}.cr-lh-col{flex:1}.cr-lh-label{text-transform:uppercase;letter-spacing:.06em;color:#78787880;font-size:9px;font-family:var(--font-mono,monospace);margin-bottom:6px}.cr-lh-text{color:#aaaaaab3;font-size:11px}.cr-weights{flex-direction:column;gap:5px;width:100%;display:flex}.cr-weight-row{align-items:baseline;gap:10px;display:flex}.cr-weight-val{font-size:9px;font-family:var(--font-mono,monospace);color:#78787880;flex-shrink:0;width:24px}.cr-weight-text{color:#c8c8c8d9;font-size:13px}.cr-ls-demo{flex-direction:column;gap:7px;width:100%;display:flex}.cr-ls-row{justify-content:space-between;align-items:center;display:flex}.cr-ls-label{font-size:9px;font-family:var(--font-mono,monospace);color:#78787880}.cr-ls-text{color:#c8c8c8d9;text-transform:uppercase;font-size:13px;font-weight:600}.cr-4pt-row{flex-wrap:wrap;align-items:flex-end;gap:4px;display:flex}.cr-4pt-block{font-size:8px;font-family:var(--font-mono,monospace);color:#a0a0dc99;background:#667eea59;border-radius:3px;justify-content:center;align-items:flex-end;padding-bottom:2px;display:flex}.cr-padding-demo{align-items:center;gap:8px;display:flex}.cr-padding-btn{color:#c8c8c8d9;cursor:default;white-space:nowrap;border:1px solid #fff3;border-radius:8px;font-size:12px}.cr-padding-btn--sm{padding:6px 12px}.cr-padding-btn--md{padding:8px 16px}.cr-padding-btn--lg{padding:12px 24px}.cr-heights-row{align-items:center;gap:8px;display:flex}.cr-height-item{flex-direction:column;align-items:center;gap:6px;display:flex}.cr-height-bar{background:#667eea4d;border:1px solid #667eea66;border-radius:6px;width:40px}.cr-height-label{font-size:9px;font-family:var(--font-mono,monospace);color:#78787899}.cr-gap-demo{flex-direction:column;gap:0;width:100%;display:flex}.cr-gap-item{color:#aaaaaab3;background:#ffffff0a;border:1px solid #ffffff12;border-radius:6px;padding:5px 10px;font-size:11px}.cr-contrast-demo{align-items:center;gap:12px;width:100%;display:flex}.cr-contrast-swatch{border-radius:8px;flex-shrink:0;width:36px;height:36px}.cr-contrast-info{flex-direction:column;gap:2px;display:flex}.cr-contrast-ratio{font-size:18px;font-weight:700;font-family:var(--font-mono,monospace);color:#dcdcdcf2}.cr-contrast-level{color:#8c8c8c99;text-transform:uppercase;letter-spacing:.06em;font-size:10px}.cr-semantic-grid{grid-template-columns:repeat(3,1fr);gap:6px;width:100%;display:grid}.cr-semantic-chip{font-size:9px;font-family:var(--font-mono,monospace);text-align:center;border-radius:6px;padding:5px 6px}.cr-opacity-demo{flex-direction:column;gap:5px;width:100%;display:flex}.cr-opacity-row{align-items:center;gap:10px;display:flex}.cr-opacity-label{font-size:9px;font-family:var(--font-mono,monospace);color:#78787880;flex-shrink:0;width:28px}.cr-opacity-text{color:#dcdcdc;font-size:13px}.cr-darkmode-demo{gap:10px;width:100%;display:flex}.cr-darkmode-card{border-radius:10px;flex:1;padding:10px 12px}.cr-darkmode-card--light{background:#f5f5f7;border:1px solid #0000001a}.cr-darkmode-card--dark{background:#121214;border:1px solid #ffffff1a}.cr-darkmode-title-light{color:#111;font-size:12px;font-weight:600}.cr-darkmode-title-dark{color:#f0f0f0f2;font-size:12px;font-weight:600}.cr-darkmode-text-light{color:#0009;margin-top:2px;font-size:11px}.cr-darkmode-text-dark{color:#ffffff8c;margin-top:2px;font-size:11px}.cr-duration-demo{align-items:center;gap:10px;display:flex}.cr-duration-dot{cursor:pointer;background:#667eeacc;border-radius:50%;width:8px;height:8px}.cr-duration-label{font-size:9px;font-family:var(--font-mono,monospace);color:#78787880}.cr-easing-demo{flex-direction:column;gap:8px;width:100%;display:flex}.cr-easing-row{align-items:center;gap:8px;display:flex}.cr-easing-label{font-size:9px;font-family:var(--font-mono,monospace);color:#78787880;flex-shrink:0;width:58px}.cr-easing-track{background:#ffffff0f;border-radius:1px;flex:1;height:2px;position:relative}.cr-easing-dot{background:#667eeae6;border-radius:50%;width:8px;height:8px;animation:none;position:absolute;top:-3px;left:0}.cr-reduce-demo{flex-direction:column;gap:8px;width:100%;display:flex}.cr-reduce-label{font-size:10px;font-family:var(--font-mono,monospace);color:#78787880}@keyframes cr-spin{to{transform:rotate(360deg)}}@keyframes cr-pulse-fade{0%,to{opacity:1}50%{opacity:.3}}.cr-reduce-animated{border:2px solid #667eea80;border-top-color:#667eeae6;border-radius:50%;width:20px;height:20px;animation:1s linear infinite cr-spin}@media (prefers-reduced-motion:reduce){.cr-reduce-animated{animation:2s ease-in-out infinite cr-pulse-fade}}.cr-reader-note{color:#8c8c8cb3;margin-top:12px;font-size:11px;line-height:1.45}