:root{--ui-bg:#fff;--ui-surface:#f5f5f7;--ui-ink:#1d1d1f;--ui-muted:#6e6e73;--ui-line:#e6e6e8;--ui-link:#06c;--ui-selection:#edf3fc;--ui-mono:ui-monospace, SFMono-Regular, Menlo, monospace;--ui-green:#23704c;--ui-red:#ad3045}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:136px}body{background:var(--ui-bg);color:var(--ui-ink);font-family:var(--ui-font);-webkit-font-smoothing:antialiased;margin:0;font-size:15px;line-height:1.5}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}button,a,input,summary,pre{-webkit-tap-highlight-color:transparent}button:disabled{cursor:not-allowed}:focus-visible{outline:3px solid var(--ui-link);outline-offset:4px}button svg,a svg{flex-shrink:0}button{color:inherit}svg{vertical-align:middle}button{border:0}input{min-width:0}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:650}[hidden]{display:none!important}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.skip-link{z-index:30;background:var(--ui-ink);color:#fff;border-radius:8px;padding:12px 18px;position:fixed;top:-100px;left:16px}.skip-link:focus{top:12px}.site-header{z-index:10;backdrop-filter:blur(18px);background:#fffffff5;position:sticky;top:0}.global-bar,.local-bar{align-items:center;max-width:1440px;margin-inline:auto;padding-inline:48px;display:flex}.global-bar{justify-content:space-between;height:48px}.site-header:after{content:"";background:var(--ui-line);width:100%;height:1px;position:absolute;bottom:0}.brand{letter-spacing:-.5px;align-items:center;gap:9px;font-size:17px;font-weight:650;display:inline-flex}.brand img{display:block}.brand-divider{background:var(--ui-line);width:1px;height:16px;margin-inline:13px}.brand-descriptor{letter-spacing:.1px;color:var(--ui-muted);font-size:11px;font-weight:450}.version-link{color:var(--ui-muted);align-items:center;gap:7px;font-size:11px;display:inline-flex}.version-link:hover{color:var(--ui-link)}.local-bar{gap:30px;height:65px}.site-title{letter-spacing:-.7px;margin-right:auto;font-size:22px;font-weight:650}.top-nav{align-items:center;gap:27px;font-size:12px;display:flex}.top-nav a{color:var(--ui-muted)}.top-nav a:hover,.top-nav a[aria-current]{color:var(--ui-ink)}.search-trigger{border-left:1px solid var(--ui-line);background:0 0;align-items:center;gap:13px;padding:7px 0 7px 13px;display:flex}kbd{color:var(--ui-muted);font:10px var(--ui-font);border:1px solid var(--ui-line);border-radius:4px;padding:2px 4px}.icon-button{background:0 0;border-radius:5px;padding:6px}.mobile-menu{display:none}.page-shell{grid-template-columns:212px minmax(0,1fr);gap:64px;max-width:1440px;margin-inline:auto;padding:0 48px;display:grid}.sidebar{min-width:0}.sidebar-inner{scrollbar-width:thin;height:calc(100dvh - 113px);padding-top:38px;padding-bottom:22px;position:sticky;top:113px;overflow-y:auto}.sidebar-filter{color:var(--ui-muted);border:1px solid #d9d9dd;border-radius:9px;align-items:center;gap:9px;margin-bottom:22px;padding:8px 10px;display:flex}.sidebar-filter:focus-within{border-color:var(--ui-link);box-shadow:0 0 0 2px var(--ui-selection)}.sidebar-filter input{width:100%;color:var(--ui-ink);background:0 0;border:0;outline:0;font-size:12px}.sidebar-filter input::placeholder{color:#85858a}.sidebar-home,.sidebar-resource{color:var(--ui-muted);border-radius:6px;align-items:center;gap:9px;padding:8px 10px;font-size:12px;display:flex}.sidebar-home{margin-bottom:19px}.current{background:var(--ui-selection);color:var(--ui-link)!important}.sidebar-group{margin-bottom:16px}.sidebar-group summary{cursor:pointer;justify-content:space-between;align-items:center;padding:6px 10px;font-size:12px;font-weight:600;list-style:none;display:flex}.sidebar-group summary::-webkit-details-marker{display:none}.sidebar-group summary svg{color:#949499;transition:transform .15s}.sidebar-group[open] summary svg{transform:rotate(90deg)}.sidebar-links{flex-direction:column;gap:1px;margin-top:3px;display:flex}.sidebar-link{color:var(--ui-muted);border-radius:6px;padding:6px 10px 6px 22px;font-size:12px;display:block}.sidebar-link:hover,.sidebar-resource:hover{color:var(--ui-ink);background:var(--ui-surface)}.sidebar-resource{border-top:1px solid var(--ui-line);border-radius:0;margin-top:20px;padding-top:18px}.sidebar-bottom{color:#85858a;align-items:center;gap:7px;padding:28px 10px 0;font-size:10px;display:flex}.status-dot{background:#549f75;border-radius:50%;flex-shrink:0;width:5px;height:5px;display:inline-block}.sidebar-no-results{color:var(--ui-muted);padding:12px;font-size:12px}main{min-width:0;padding-block:42px 70px}.overview{max-width:1050px}.page-eyebrow{color:var(--ui-muted);letter-spacing:1.8px;align-items:center;gap:8px;margin-bottom:17px;font-size:10px;font-weight:550;display:flex}h1{letter-spacing:-.045em;font-size:clamp(36px,4.2vw,56px);line-height:1.1}.hero-description{letter-spacing:-.55px;text-wrap:pretty;max-width:850px;margin-top:24px;font-size:clamp(19px,2vw,25px);line-height:1.4}.hero-links{align-items:center;gap:24px;margin-top:25px;display:flex}.hero-links a{color:var(--ui-link);align-items:center;gap:9px;font-size:13px;display:inline-flex}.hero-links a:hover{text-decoration:underline}.hero-links>span{color:#8c8c91;border-left:1px solid var(--ui-line);padding-left:22px;font-size:11px}.overview-section{margin-top:58px;scroll-margin-top:140px}.section-heading{justify-content:space-between;align-items:center;gap:20px;display:flex}.section-heading>div{align-items:baseline;gap:11px;display:flex}.section-number{color:#a2a2a8;font:11px var(--ui-mono)}.section-heading h2{letter-spacing:-.8px;font-size:27px;line-height:1.2}.section-heading>a{color:var(--ui-link);align-items:center;gap:6px;font-size:11px;display:flex}.section-description{color:var(--ui-muted);margin-top:11px;font-size:13px}.topic-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 22px;margin-top:24px;display:grid}.topic-card{border-radius:13px 13px 0 0;min-width:0;display:block}.artwork{aspect-ratio:1.65;isolation:isolate;border-radius:13px;justify-content:center;align-items:center;transition:filter .25s;display:flex;position:relative;overflow:hidden}.artwork--green{--art-from:#d3ead7;--art-to:#e4eec8;--art-ink:#45794c}.artwork--blue{--art-from:#d0e5f4;--art-to:#dcddf4;--art-ink:#42648d}.artwork--purple{--art-from:#e5dcf4;--art-to:#e2e4f9;--art-ink:#7a5c9d}.artwork--orange{--art-from:#f7e2ce;--art-to:#f8edce;--art-ink:#a57342}.artwork--pink{--art-from:#f4dce4;--art-to:#efdff2;--art-ink:#a06185}.artwork{color:var(--art-ink);background:linear-gradient(125deg, var(--art-from), var(--art-to))}.artwork-grid{background-image:linear-gradient(to right, var(--art-ink) 1px, transparent 1px), linear-gradient(to bottom, var(--art-ink) 1px, transparent 1px);opacity:.045;z-index:-1;background-size:28px 28px;position:absolute;inset:0;mask-image:radial-gradient(#000,#0000 85%)}.artwork-halo{opacity:.1;z-index:-1;border:1px solid;border-radius:50%;width:124px;height:124px;position:absolute}.artwork-halo:after{content:"";border:1px solid;border-radius:50%;position:absolute;inset:13px}.artwork>svg{filter:drop-shadow(0 3px 1px #ffffff1f);stroke-width:1.35px;transition:transform .3s}.topic-card:hover .artwork{filter:saturate(1.15)}.topic-card:hover .artwork>svg{transform:translateY(-3px)scale(1.04)}.topic-card-heading{justify-content:space-between;align-items:center;gap:9px;margin-top:13px;display:flex}.topic-card-heading h3{letter-spacing:-.15px;font-size:14px;font-weight:600}.topic-card-heading>svg{color:#99999f;width:14px}.topic-card p{color:var(--ui-muted);margin-top:5px;font-size:11px;line-height:1.5}.resources-callout{border:1px solid var(--ui-line);border-radius:14px;align-items:center;gap:21px;margin-top:54px;padding:26px 28px;display:flex}.resources-callout-icon{background:var(--ui-surface);border-radius:12px;padding:14px}.resources-callout>span:nth-child(2){flex-direction:column;gap:5px;display:flex}.resources-callout strong{letter-spacing:-.3px;font-size:17px}.resources-callout>span>span{color:var(--ui-muted);font-size:12px}.resources-callout>svg{color:var(--ui-link);margin-left:auto}.resources-callout:hover{background:#fafafa}.site-footer{border-top:1px solid var(--ui-line);max-width:1440px;color:var(--ui-muted);justify-content:space-between;align-items:center;gap:20px;margin:0 auto;padding:22px 48px;font-size:10px;display:flex}.site-footer>span:first-child{color:var(--ui-ink)}.site-footer>span>span{color:#aaa;margin-inline:10px}.site-footer a{align-items:center;gap:6px;display:flex}.site-footer a:hover{color:var(--ui-link)}.document-layout{grid-template-columns:minmax(0,760px) 140px;gap:40px;display:grid}.breadcrumbs{color:var(--ui-muted);align-items:center;gap:9px;margin-bottom:23px;font-size:11px;display:flex}.breadcrumbs a:hover{color:var(--ui-link)}.document h1{font-size:clamp(34px,3.6vw,50px)}.document-lead{letter-spacing:-.45px;color:var(--ui-muted);margin-top:20px;font-size:22px;line-height:1.45}.artwork--large{aspect-ratio:auto;height:200px;margin-top:32px}.artwork--large .artwork-halo{width:170px;height:170px}.on-this-page{height:fit-content;margin-top:8px;position:sticky;top:158px}.on-this-page>span{color:var(--ui-muted);letter-spacing:1px;font-size:9px}.on-this-page nav{border-left:1px solid var(--ui-line);flex-direction:column;gap:12px;margin-top:17px;padding-left:15px;display:flex}.on-this-page a{color:var(--ui-muted);font-size:11px}.on-this-page a:hover,.on-this-page a.active{color:var(--ui-link)}.back-to-top{margin-top:27px;display:block;font-size:10px!important}.prose{font-size:15px;line-height:1.8}.prose h2{letter-spacing:-.6px;margin:44px 0 17px;font-size:26px;line-height:1.3}.prose h3{margin:25px 0 12px;font-size:19px}.prose p{margin-block:15px}.prose ul{margin-block:15px;padding-left:22px}.prose li{margin-block:9px;padding-left:4px}.prose a{color:var(--ui-link);text-decoration:underline}.prose strong{font-weight:600}.prose blockquote{border-left:3px solid var(--ui-line);color:var(--ui-muted);margin:24px 0;padding-left:20px}.page-pagination{border-top:1px solid var(--ui-line);justify-content:space-between;gap:20px;margin-top:50px;padding-top:23px;display:flex}.page-pagination a{flex-direction:column;gap:5px;max-width:48%;display:flex}.page-pagination a:last-child{text-align:right;margin-left:auto}.page-pagination small{color:var(--ui-muted);font-size:10px}.page-pagination span{color:var(--ui-link);align-items:center;gap:10px;font-size:13px;display:flex}.resources-page{max-width:930px}.download-grid{grid-template-columns:1fr 1fr;gap:20px;margin-top:40px;display:grid}.download-card{border:1px solid var(--ui-line);border-radius:14px;padding:28px}.download-card:hover{background:#fafafa}.file-format{font:13px var(--ui-mono);color:#606c8b;background:#f2f4fa;border:1px solid #dadde9;border-radius:8px;padding:12px 10px;display:inline-block}.download-card h2{letter-spacing:-.5px;margin-top:24px;font-size:21px}.download-card p{color:var(--ui-muted);margin-top:10px;font-size:13px}.download-link{color:var(--ui-link);align-items:center;gap:8px;margin-top:24px;font-size:12px;display:flex}.resource-code{margin-top:45px}.resource-code>div{justify-content:space-between;align-items:center;gap:18px;display:flex}.resource-code h2{letter-spacing:-.5px;font-size:24px}.resource-code pre{background:var(--ui-surface);max-height:400px;font:12px/1.8 var(--ui-mono);color:#495267;border-radius:12px;margin-top:20px;padding:24px;overflow:auto}.release-note{border-top:1px solid var(--ui-line);margin-top:40px;padding-top:25px}.release-note h2{font-size:17px}.release-note p{color:var(--ui-muted);margin-top:7px;font-size:12px}.text-button{color:var(--ui-link);background:0 0;justify-content:center;align-items:center;gap:7px;padding:6px 0;font-size:12px;display:inline-flex}.text-button:hover{text-decoration:underline}#search-dialog{border:1px solid var(--ui-line);width:min(640px,100% - 32px);max-height:min(640px,80dvh);color:var(--ui-ink);border-radius:16px;margin:12dvh auto auto;padding:0;overflow:hidden;box-shadow:0 20px 100px #0003}#search-dialog::backdrop{backdrop-filter:blur(5px);background:#17181c55}.search-input-row{border-bottom:1px solid var(--ui-line);align-items:center;gap:14px;padding:18px 22px;display:flex}.search-input-row>svg{color:var(--ui-muted)}.search-input-row input{width:100%;color:var(--ui-ink);background:0 0;border:0;outline:0;font-size:16px}.key-button{border:1px solid var(--ui-line);color:var(--ui-muted);background:#fff;border-radius:4px;padding:3px 5px;font-size:10px}.search-results{max-height:440px;padding:10px;overflow:auto}.search-result{border-radius:8px;align-items:center;gap:13px;padding:12px;display:flex}.search-result:hover,.search-result:focus-visible{background:var(--ui-surface)}.search-result-icon{background:var(--ui-surface);border-radius:8px;flex-shrink:0;place-items:center;width:40px;height:40px;display:grid}.search-result>span:nth-child(2){flex-direction:column;gap:3px;display:flex}.search-result strong{font-size:14px;font-weight:550}.search-result small{color:var(--ui-muted);font-size:10px}.search-result>svg{color:var(--ui-muted);margin-left:auto}.search-footer{border-top:1px solid var(--ui-line);color:var(--ui-muted);background:#fafafa;justify-content:space-between;gap:20px;padding:12px 22px;font-size:10px;display:flex}.search-empty{color:var(--ui-muted);padding:35px 22px;font-size:13px}.toast{color:#fff;background:var(--ui-ink);opacity:0;pointer-events:none;z-index:40;border-radius:9px;padding:11px 20px;font-size:13px;transition:opacity .2s,transform .2s;position:fixed;bottom:28px;left:50%;transform:translate(-50%,20px);box-shadow:0 5px 25px #0002}.toast.visible{opacity:1;transform:translate(-50%)}@media (width>=1500px){.page-shell{gap:76px}}@media (width<=1200px){.global-bar,.local-bar{padding-inline:32px}.page-shell{grid-template-columns:190px minmax(0,1fr);gap:38px;padding-inline:32px}.document-layout{display:block}.on-this-page{display:none}.topic-grid{gap:24px 18px}.top-nav{gap:19px}.local-bar{gap:22px}.section-heading h2{font-size:24px}}@media (width<=960px){.page-shell{grid-template-columns:170px minmax(0,1fr);gap:28px;padding-inline:24px}.global-bar,.local-bar{padding-inline:24px}.site-title{font-size:20px}.top-nav{gap:17px;font-size:11px}.search-trigger kbd{display:none}.topic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-description,.section-heading h2{font-size:22px}.section-number{display:none}.sidebar-link{padding-left:16px;font-size:11px}.sidebar-filter{gap:6px;padding-inline:7px}.sidebar-filter input{font-size:10px}.site-footer{padding-inline:24px}}@media (width<=700px){html{scroll-padding-top:90px}.global-bar{height:40px}.brand{font-size:15px}.brand img{width:22px;height:22px}.brand-divider,.brand-descriptor,.top-nav{display:none}.local-bar{gap:20px;height:56px}.site-title{font-size:19px}.search-trigger{border:0;padding:5px}.mobile-menu{display:block}.page-shell{padding-inline:24px;display:block}.sidebar{display:none}.sidebar.is-open{z-index:9;background:var(--ui-bg);padding:0 24px;display:block;position:fixed;inset:96px 0 0;overflow:auto}.sidebar-inner{height:auto;padding-top:22px;padding-bottom:35px;position:static}.sidebar-link{padding:10px 18px;font-size:14px}.sidebar-filter input{font-size:14px}.sidebar-group summary,.sidebar-home,.sidebar-resource{padding-block:10px;font-size:14px}body.menu-open{overflow:hidden}main{padding-top:31px;padding-bottom:48px}.page-eyebrow{letter-spacing:1.4px;margin-bottom:16px;font-size:9px}h1{font-size:39px}.hero-description{margin-top:21px;font-size:21px}.hero-links{gap:18px;margin-top:22px}.hero-links a{font-size:12px}.hero-links>span{padding-left:18px}.overview-section{margin-top:43px}.section-heading h2{font-size:23px}.section-heading>a{font-size:10px}.section-description{font-size:12px;line-height:1.6}.topic-grid{gap:24px 16px;margin-top:19px}.artwork{aspect-ratio:1.3;border-radius:10px}.artwork>svg{width:55px;height:55px}.artwork-halo{width:96px;height:96px}.topic-card-heading{align-items:flex-start;margin-top:10px}.topic-card-heading h3{font-size:13px;line-height:1.4}.topic-card-heading>svg{width:12px;margin-top:2px}.topic-card p{font-size:10px}.resources-callout{gap:15px;margin-top:38px;padding:20px}.resources-callout-icon{padding:10px}.resources-callout strong{font-size:15px}.resources-callout>span>span{font-size:11px}.resources-callout>svg{width:18px}.site-footer{flex-wrap:wrap;gap:14px 20px;padding-block:22px}.site-footer>span:nth-child(2){display:none}.document h1{font-size:38px}.document-lead{font-size:20px}.artwork--large{aspect-ratio:auto;height:170px}.artwork--large>svg{width:85px;height:85px}.prose{font-size:14px}.prose h2{margin-top:34px;font-size:24px}.download-grid{grid-template-columns:1fr;gap:16px;margin-top:30px}.download-card{padding:24px}.resource-code>div{align-items:flex-start}.resource-code h2{font-size:21px}.resource-code .text-button{flex-shrink:0;font-size:10px}.search-footer span:last-child{display:none}.search-result small{line-height:1.5}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}.examples-section{margin-top:40px}.examples-heading{justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px;display:flex}.examples-heading h2{letter-spacing:-.6px;font-size:26px}.segmented-control{background:var(--ui-surface);border-radius:7px;gap:3px;padding:3px;display:flex}.segmented-control button{color:var(--ui-muted);background:0 0;border-radius:5px;align-items:center;gap:5px;padding:5px 9px;font-size:10px;display:inline-flex}.segmented-control button[aria-pressed=true]{color:var(--ui-ink);background:#fff;box-shadow:0 1px 4px #0001}.guide-preview{font-family:var(--guide-font)}.guide-preview :is(button,input):focus-visible{outline:var(--guide-focus-width) solid var(--guide-focus-color);outline-offset:var(--guide-focus-offset)}.intro-principles{grid-template-columns:repeat(3,1fr);gap:22px;display:grid}.principle-number{color:var(--ui-muted);font:12px var(--ui-mono);margin-bottom:17px;display:block}.intro-principles h3{letter-spacing:-.25px;font-size:16px;line-height:1.4}.intro-principles p{color:var(--ui-muted);margin-top:10px;font-size:12px;line-height:1.75}.principles-list{gap:16px;display:grid}.principle-card{background:var(--ui-surface);border-radius:12px;align-items:flex-start;gap:22px;padding:24px;display:flex}.principle-card>svg{color:var(--ui-green);flex-shrink:0}.principle-card h3{letter-spacing:-.3px;font-size:18px}.principle-card p{color:var(--ui-muted);margin-top:8px;font-size:13px;line-height:1.7}.color-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 16px;display:grid}.color-token{border:1px solid var(--ui-line);border-radius:10px;overflow:hidden}.swatch{border-bottom:1px solid var(--ui-line);height:95px}.color-info{padding:13px}.color-info>strong{font:550 12px var(--ui-font);display:block}.copy-value{color:var(--ui-muted);text-align:left;background:0 0;align-items:center;gap:7px;max-width:100%;padding:4px 0;font-size:11px;display:inline-flex}.copy-value:hover{color:var(--ui-link)}.copy-value code{font-family:var(--ui-mono);overflow-wrap:anywhere;font-size:10px}.color-info p{font:11px/1.6 var(--ui-font);color:var(--ui-muted);margin-top:5px}.token-name{font:9px var(--ui-mono);color:#929298;overflow-wrap:anywhere;margin-top:11px;display:block}.subsection-title{letter-spacing:-.4px;margin-top:32px;margin-bottom:16px;font-size:20px}.table-intro{color:var(--ui-muted);margin-bottom:17px;font-size:12px}.contrast-row{border-bottom:1px solid var(--ui-line);align-items:center;gap:14px;padding:13px 0;font-size:12px;display:flex}.contrast-sample{border:1px solid var(--ui-line);border-radius:5px;flex-shrink:0;place-items:center;width:48px;height:36px;font-size:19px;display:grid}.contrast-row>strong{font:11px var(--ui-mono);white-space:nowrap;margin-left:auto}.contrast-status{color:var(--ui-green);font-size:10px}.contrast-status.is-fail{color:var(--ui-red)}.technical-note{color:var(--ui-muted);overflow-wrap:anywhere;margin-block:15px;font-size:11px}.technical-note code{font:10px/1.6 var(--ui-mono)}.type-specimens{border:1px solid var(--ui-line);color:var(--guide-text);background:var(--guide-background);border-radius:12px;padding:8px 24px;overflow:hidden}.type-specimen{border-bottom:1px solid var(--ui-line);padding:22px 0}.type-specimen:last-child{border-bottom:0}.specimen-meta{justify-content:space-between;align-items:center;gap:16px;display:flex}.specimen-meta strong{font:550 11px var(--ui-font);color:var(--guide-muted)}.specimen-meta .copy-value{color:var(--guide-muted)}.specimen-sample{overflow-wrap:anywhere;margin-block:16px}.specimen-usage{font:11px var(--ui-font);color:var(--guide-muted)}.spacing-list{background:var(--guide-background);color:var(--guide-text);border:1px solid var(--ui-line);border-radius:10px;padding:8px 20px}.spacing-row{border-bottom:1px solid var(--ui-line);grid-template-columns:35px 80px 65px 1fr;align-items:center;gap:12px;padding:16px 0;display:grid}.spacing-row:last-child{border:0}.spacing-row>code{font:11px var(--ui-mono)}.spacing-row .copy-value{color:var(--guide-muted)}.spacing-row>span:last-child{color:var(--guide-muted);font-size:11px}.spacing-measure{display:block}.spacing-measure>span{background:var(--guide-accent);opacity:.8;max-width:100%;height:18px;display:block}.specs{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;margin-block:23px;padding:0;font-size:12px;display:grid}.specs>div{border-bottom:1px solid var(--ui-line);flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px;padding-block:12px;display:flex}.specs dt{color:var(--ui-muted)}.specs dd{font:11px var(--ui-mono);overflow-wrap:anywhere;margin:0}.layout-demo{height:100px;padding-block:10px;display:grid;overflow:hidden}.layout-demo>span{background:var(--guide-accent);opacity:.15;min-width:0}.icon-specimens{border:1px solid var(--ui-line);color:var(--guide-text);background:var(--guide-background);border-radius:12px;grid-template-columns:repeat(4,1fr);gap:16px;padding:25px 12px;display:grid}.icon-specimens>div{flex-direction:column;align-items:center;gap:18px;display:flex}.icon-specimens span{font:11px var(--ui-font);color:var(--ui-muted)}.example-stage{border:1px solid var(--ui-line);background:var(--guide-background);color:var(--guide-text);border-radius:12px;flex-wrap:wrap;justify-content:center;align-items:center;gap:18px;padding:48px 24px;display:flex}.guide-button{padding:var(--guide-button-padding);min-height:var(--guide-button-height);border-radius:var(--guide-radius-control);background:var(--guide-button-background);color:var(--guide-button-foreground);font:var(--guide-button-weight) var(--guide-button-size) var(--guide-font);transition:filter var(--guide-duration-fast) var(--guide-easing);border:0}.guide-button:hover:not(:disabled){filter:var(--guide-button-hover)}.guide-button--secondary{background:var(--guide-secondary-background);color:var(--guide-secondary-foreground)}.guide-button:disabled{opacity:var(--guide-disabled-opacity)}.demo-feedback{text-align:center;font-size:var(--guide-type-caption);color:var(--guide-muted);flex-basis:100%}.demo-feedback:empty{display:none}.guide-form{width:100%;max-width:var(--guide-input-width)}.guide-form label{color:var(--guide-text);font-size:var(--guide-type-body);font-weight:var(--guide-weight-subheading);margin-bottom:var(--guide-space-xs);display:block}.guide-form input{width:100%;color:var(--guide-text);background:var(--guide-background);min-height:var(--guide-input-height);padding:var(--guide-input-padding);border:var(--guide-input-border) solid var(--guide-border);border-radius:var(--guide-radius-control);font:var(--guide-input-size) var(--guide-font);display:block}.guide-form input::placeholder{color:var(--guide-muted)}.guide-form input[aria-invalid=true]{border-color:var(--guide-danger)}.guide-hint,.guide-error{margin-top:var(--guide-space-xs);font-size:var(--guide-type-caption);line-height:var(--guide-leading-caption)}.guide-hint{color:var(--guide-muted)}.guide-error{color:var(--guide-danger)}.guide-form .guide-button{margin-top:var(--guide-space-lg)}.guide-form .demo-feedback{margin-top:var(--guide-space-md);text-align:left}.guide-navigation{gap:var(--guide-nav-gap);flex-wrap:wrap;justify-content:center;display:flex}.guide-navigation button{padding:var(--guide-nav-padding);border-radius:var(--guide-radius-control);color:var(--guide-muted);font:var(--guide-nav-size) var(--guide-font);background:0 0}.guide-navigation button[aria-pressed=true]{background:var(--guide-surface);color:var(--guide-text)}.demo-navigation-status{text-align:center;color:var(--guide-muted);font-size:var(--guide-type-caption);flex-basis:100%}.motion-examples{border:1px solid var(--ui-line);color:var(--guide-text);background:var(--guide-background);border-radius:12px;padding:4px 24px}.motion-example{border-bottom:1px solid var(--ui-line);padding:24px 0}.motion-example:last-child{border:0}.motion-example h3{margin-right:10px;font-size:15px;display:inline}.motion-example code{font:11px var(--ui-mono);color:var(--guide-muted)}.motion-example p{color:var(--guide-muted);margin-top:6px;font-size:11px}.motion-track{height:calc(var(--guide-motion-size) + 24px);align-items:center;margin-top:15px;display:flex}.motion-object{width:var(--guide-motion-size);height:var(--guide-motion-size);background:var(--guide-accent);border-radius:var(--guide-radius-control);transition-property:transform;transition-timing-function:var(--guide-easing)}.motion-example.is-playing .motion-object{transform:translateX(var(--guide-motion-distance))}.motion-example .text-button{color:var(--guide-accent)}.accessibility-target{border:1px solid var(--ui-line);color:var(--ui-green);border-radius:12px;align-items:center;gap:20px;padding:25px;display:flex}.accessibility-target>div{flex-direction:column;gap:5px;display:flex}.accessibility-target span{color:var(--ui-muted);font-size:11px}.accessibility-target strong{color:var(--ui-ink);letter-spacing:-.5px;font-size:23px}.accessibility-checks{gap:20px;margin-top:30px;display:grid}.accessibility-checks>div{gap:14px;display:flex}.accessibility-checks>div>svg{color:var(--ui-green);flex-shrink:0;margin-top:2px}.accessibility-checks h3{font-size:15px}.accessibility-checks p{color:var(--ui-muted);margin-top:5px;font-size:13px;line-height:1.7}.voice-traits{flex-wrap:wrap;gap:10px;margin-bottom:30px;display:flex}.voice-traits span{background:var(--ui-surface);border-radius:30px;padding:9px 17px;font-size:12px}.writing-examples{gap:28px;display:grid}.writing-examples h3{margin-bottom:15px;font-size:16px}.do-dont{grid-template-columns:1fr 1fr;gap:20px;display:grid}.do-dont>div{border-top:2px solid var(--ui-line);padding-top:14px}.do-dont>div:first-child{border-color:var(--ui-green)}.do-dont>div:last-child{border-color:var(--ui-red)}.do-dont span{color:var(--ui-muted);align-items:center;gap:6px;font-size:10px;display:flex}.do-dont p{margin-top:12px;font-size:13px;line-height:1.7}@media (width<=960px){.color-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.intro-principles{grid-template-columns:1fr;gap:22px}.principle-number{margin-bottom:9px}}@media (width<=700px){.examples-heading h2{font-size:23px}.segmented-control button{padding:5px 7px;font-size:9px}.segmented-control button svg{display:none}.principle-card{gap:16px;padding:20px}.principle-card h3{font-size:16px}.principle-card p{font-size:12px}.principle-card>svg{width:26px}.color-grid{gap:16px 12px}.color-info{padding:11px}.color-info>strong{font-size:11px}.color-info p{font-size:10px}.swatch{height:82px}.contrast-row{gap:8px;font-size:10px}.contrast-row>strong{font-size:10px}.contrast-status{max-width:44px;font-size:9px}.contrast-sample{width:36px;height:32px}.type-specimens{padding-inline:16px}.specimen-meta{flex-wrap:wrap;gap:5px}.spacing-list{padding-inline:16px}.spacing-row{grid-template-columns:28px minmax(60px,1fr) 67px;gap:10px}.spacing-row>span:last-child{grid-column:1/-1;margin-top:-2px}.specs{grid-template-columns:1fr}.icon-specimens{grid-template-columns:1fr 1fr;gap:28px 12px}.example-stage{padding:32px 20px}.motion-examples{padding-inline:18px}.do-dont{gap:16px}.do-dont p{font-size:12px}}