.icon-wrapper{display:inline-flex;position:relative;justify-content:center;min-width:7em;min-height:7em;vertical-align:middle}.icon-wrapper,.overlay{border-radius:var(--dds-radius-small)}.copy-container,.overlay{position:absolute}.copy-container{display:grid;bottom:0;grid-template-columns:1fr 1fr;width:100%;height:30px}.icon-copy-item{display:flex;align-items:center;justify-content:center;border-radius:var(--dds-radius-small);cursor:pointer}.live-css-editor-container{margin:1.5rem 0;overflow:hidden;border:1px solid var(--ifm-color-emphasis-300,#d1d5db);border-radius:8px;background:var(--ifm-background-surface-color,#fff)}.live-css-editor-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:.75rem 1rem;border-bottom:1px solid var(--ifm-color-emphasis-300,#d1d5db);background:var(--ifm-color-emphasis-100,#f3f4f6);gap:1rem}.live-css-editor-preset-selector{display:flex;align-items:center;gap:.5rem;font-size:.875rem}.live-css-editor-preset-selector label{margin:0;font-weight:500}.live-css-editor-select{padding:.375rem .75rem;border:1px solid var(--ifm-color-emphasis-300,#d1d5db);border-radius:4px;background:var(--ifm-background-color,#fff);color:var(--ifm-font-color-base,#1f2937);font-size:.875rem;cursor:pointer}.live-css-editor-select:focus{outline:2px solid var(--ifm-color-primary,#2563eb);outline-offset:2px}.live-css-editor-buttons{display:flex;gap:.5rem;margin-left:auto}.live-css-editor-button,.live-css-editor-format-button,.live-css-editor-reset-button{display:flex;align-items:center;padding:.5rem 1rem;transition:all .2s;border:none;border-radius:4px;font-size:.875rem;font-weight:500;cursor:pointer;gap:.375rem}.live-css-editor-button{background:var(--ifm-color-primary,#2563eb);color:white}.live-css-editor-button:hover{background:var(--ifm-color-primary-dark,#1d4ed8)}.live-css-editor-reset-button{background:var(--ifm-color-danger,#dc2626);color:white}.live-css-editor-reset-button:hover{background:var(--ifm-color-danger-dark,#b91c1c)}.live-css-editor-format-button{background:var(--ifm-color-secondary,#4b5563);color:white}.live-css-editor-format-button:hover:not(:disabled){background:var(--ifm-color-secondary-dark,#374151)}.live-css-editor-format-button:disabled{opacity:.6;cursor:not-allowed}.live-css-editor-split-pane{display:grid;grid-template-columns:1fr 1fr;grid-gap:0;gap:0;min-height:400px}@media (max-width:996px){.live-css-editor-split-pane{grid-template-columns:1fr}}.live-css-editor-editor-pane,.live-css-editor-preview-pane{display:flex;flex-direction:column;overflow:hidden}.live-css-editor-editor-pane{border-right:1px solid var(--ifm-color-emphasis-300,#d1d5db)}@media (max-width:996px){.live-css-editor-editor-pane{border-right:none;border-bottom:1px solid var(--ifm-color-emphasis-300,#d1d5db)}}.live-css-editor-pane-header{padding:.75rem 1rem;border-bottom:1px solid var(--ifm-color-emphasis-300,#d1d5db);background:var(--ifm-color-emphasis-200,#e5e7eb);color:var(--ifm-color-emphasis-800,#1f2937);font-size:.875rem;font-weight:600}.live-css-editor-codemirror{height:450px;overflow:auto}.live-css-editor-codemirror .cm-editor{height:100%;overflow:hidden;border:none}.live-css-editor-codemirror .cm-scroller{padding:1rem;overflow:auto;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;font-size:.875rem;line-height:1.6}.live-css-editor-preview{display:flex;flex:1 1;align-items:center;justify-content:center;padding:2rem;overflow:auto;background:var(--ifm-background-color,#fff)}.live-css-editor-preview>*{max-width:100%}.live-css-editor-preview--light{background:var(--ifm-background-color,#fff)}.live-css-editor-preview--dark{background:var(--ifm-color-emphasis-900,#111827)}.live-css-editor-container--minimal{margin:0;border:1px solid var(--ifm-color-emphasis-300,#d1d5db);border-radius:4px}.live-css-editor-toolbar--compact{padding:.5rem .75rem}.live-css-editor-toolbar--compact .live-css-editor-button,.live-css-editor-toolbar--compact .live-css-editor-format-button,.live-css-editor-toolbar--compact .live-css-editor-reset-button{padding:.375rem .75rem;font-size:.8125rem}.live-css-editor-editor-only{grid-template-columns:1fr;min-height:auto}.live-css-editor-editor-only .live-css-editor-editor-pane{border-right:none}.live-css-editor-container--minimal .live-css-editor-pane-header{display:none}.live-css-editor-container--minimal .live-css-editor-codemirror,.live-css-editor-container--minimal .live-css-editor-codemirror .cm-editor{height:auto}.live-css-editor-container--minimal .live-css-editor-codemirror .cm-scroller{padding:.75rem}.token-inheritance-visualizer{max-width:100%;margin:2rem 0;overflow-x:hidden}.token-inheritance-visualizer__container{display:flex;flex-direction:column;gap:0;max-width:100%;overflow-x:hidden}.tier-accordion{margin-bottom:0}.tier-accordion--tier1{--dds-accordion-border-color:var(--dds-brand-600);--dds-accordion-background-color:var(--dds-brand-50);--dds-accordion-hover-background:var(--dds-brand-100)}.tier-accordion--tier1::part(base){border-left:4px solid var(--dds-brand-1000)}.tier-accordion--tier2{--dds-accordion-border-color:var(--dds-positive-600);--dds-accordion-background-color:var(--dds-positive-50);--dds-accordion-hover-background:var(--dds-positive-100)}.tier-accordion--tier2::part(base){border-left:4px solid var(--dds-positive-1000)}.tier-accordion--tier3{--dds-accordion-border-color:var(--dds-informative-600);--dds-accordion-background-color:var(--dds-informative-50);--dds-accordion-hover-background:var(--dds-informative-100)}.tier-accordion--tier3::part(base){border-left:4px solid var(--dds-informative-1000)}.tier-heading{display:flex;align-items:center}.tier-heading__icon{font-size:1.5rem;line-height:1}.tier-heading__label{color:var(--dds-text-neutral-subtle,#666)}.tier-heading__title{font-size:1rem}.tier-description{margin-bottom:1rem;color:var(--dds-text-neutral-subtle,#666)}.tier-reference-pattern{margin-bottom:1rem;padding:.75rem 1rem;border-left:3px solid var(--dds-informative-1000,#0063db);border-radius:4px;background:var(--dds-background-informative-subtle,#e6f0ff);color:var(--dds-text-neutral-base,#1a1a1a)}.tier-reference-pattern strong{color:var(--dds-text-neutral-strong,#000);font-weight:600}.resolution-chain,.token-name,.token-value{padding:.125rem .375rem;border-radius:3px;background:var(--dds-background-neutral-base,#f5f5f5);color:var(--dds-text-neutral-base,#1a1a1a);font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.8125rem}.token-name{color:var(--dds-brand-1000,#4258ed);font-weight:600}.resolution-chain{display:inline-block;overflow:hidden;color:var(--dds-text-neutral-subtle,#666);font-size:.75rem;text-overflow:ellipsis;white-space:nowrap}.color-swatch{width:40px;height:40px;border:1px solid var(--dds-border-neutral-base,#e0e0e0);border-radius:4px;box-shadow:inset 0 0 0 1px rgb(0 0 0/5%)}.copied-indicator{position:absolute;z-index:10;top:50%;left:50%;padding:.25rem .75rem;transform:translate(-50%,-50%);animation:fade-in-out 1.5s ease;border-radius:4px;background-color:var(--dds-background-neutral-strong-inverted,#1a1a1a);color:var(--dds-text-neutral-inverted,#fff);font-size:.75rem;font-weight:500;white-space:nowrap;pointer-events:none}@keyframes fade-in-out{0%{opacity:0}20%{opacity:1}80%{opacity:1}to{opacity:0}}.inheritance-arrow{display:flex;position:relative;flex-direction:column;align-items:center;padding:1rem 0}.inheritance-arrow__line{width:2px;height:20px;background:var(--dds-border-neutral-medium,#ccc)}.inheritance-arrow__head{margin-top:-4px;color:var(--dds-text-neutral-subtle,#666);font-size:1rem;line-height:1}.inheritance-arrow__label{margin-top:.25rem;padding:.25rem .5rem;border-radius:3px;background:var(--dds-background-neutral-subtle,#fff);color:var(--dds-text-neutral-subtle,#666);font-size:.75rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.token-inheritance-visualizer__callout{margin-top:2rem}.token-inheritance-visualizer__callout p{margin:.5rem 0;line-height:1.6}.token-inheritance-visualizer__callout code{padding:.125rem .375rem;border-radius:3px;background:var(--dds-background-neutral-subtle,#fff);color:var(--dds-brand-1000,#4258ed);font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.8125rem}@media (max-width:768px){.tier-heading{gap:.5rem;font-size:.9375rem}.tier-heading__icon{font-size:1.25rem}.tier-heading__label{font-size:.6875rem}.tier-description{font-size:.8125rem}.resolution-chain{max-width:180px;font-size:.6875rem}.color-swatch{width:32px;height:32px}}@media (max-width:480px){.tier-heading{flex-wrap:wrap}.tier-heading__title{font-size:.875rem}.resolution-chain{max-width:120px}.token-name,.token-value{font-size:.75rem}}