:root{color:#243136;background:#f7f7f3;font-family:Inter,ui-sans-serif,system-ui,sans-serif}:root{color-scheme:light dark;--doc-bg: #f7f7f3;--doc-surface: #fff;--doc-text: #243136;--doc-muted: #526267;--doc-line: #dfe3df;--doc-accent: #176b5c;--doc-code: #e9ece9}*{box-sizing:border-box}body{margin:0}a{color:#176b5c}header{display:flex;align-items:center;justify-content:space-between;min-height:68px;padding:0 max(24px,calc((100vw - 1180px)/2));border-bottom:1px solid #dfe3df;background:#fff}header nav{display:flex;gap:22px}header a{font-weight:700;text-decoration:none}.brand{color:#243136;font-size:18px}main{display:grid;grid-template-columns:220px minmax(0,760px);gap:64px;width:min(1180px,calc(100% - 48px));margin:0 auto;padding:64px 0 100px}aside{display:grid;align-content:start;gap:12px;position:sticky;top:24px;height:fit-content}aside strong{margin-bottom:8px}aside a{padding:8px 10px;border-radius:8px;color:#546368;text-decoration:none}aside a[aria-current=page]{background:#dfefe9;color:#176b5c;font-weight:750}article{display:grid;gap:34px}h1,h2,p{margin:0}h1{max-width:720px;font-size:clamp(44px,6vw,72px);letter-spacing:-.055em;line-height:.98}h2{font-size:25px;letter-spacing:-.025em}.eyebrow{color:#176b5c;font-size:12px;font-weight:850;letter-spacing:.14em;text-transform:uppercase}.lede{color:#56666b;font-size:20px;line-height:1.65}section{display:grid;gap:12px;padding-top:28px;border-top:1px solid #dfe3df}section p,li{color:#526267;line-height:1.7}code{padding:2px 6px;border-radius:5px;background:#e9ece9;color:#243136}@media (max-width: 720px){main{grid-template-columns:1fr;gap:36px;width:min(100% - 32px,760px);padding-top:36px}aside{position:static;grid-template-columns:repeat(2,max-content)}aside strong{grid-column:1 / -1}header{padding-inline:16px}}.authoring-layout{grid-template-columns:240px minmax(0,1fr);gap:56px}.authoring-layout aside nav{display:grid;gap:2px}.guide-contents summary{cursor:pointer;font-weight:650;padding:10px 0}.authoring-layout aside a{font-size:14px}.guide-search{display:grid;gap:8px;font-size:13px;font-weight:650}.guide-search input{min-width:0;width:100%;padding:12px;font:inherit;border:1px solid var(--doc-line);border-radius:8px;color:var(--doc-text);background:var(--doc-surface)}.guide-intro{display:grid;gap:24px}.guide-intro h1{font-size:clamp(42px,5.5vw,66px);line-height:1.04}.guide-downloads{display:flex;flex-wrap:wrap;gap:12px 22px;font-weight:650}.authoring-layout section{scroll-margin-top:24px}.authoring-layout [hidden]{display:none}.authoring-layout pre{margin:0;padding:20px;border:1px solid var(--doc-line);border-radius:12px;background:var(--doc-code);overflow:auto;font-size:13px;line-height:1.7}.authoring-layout pre code{padding:0;background:none}.guide-table{overflow:auto}.guide-table table{width:100%;border-collapse:collapse;font-size:13px}.guide-table td,.guide-table th{text-align:left;padding:12px 8px;border-bottom:1px solid var(--doc-line)}.guide-table code{white-space:nowrap}.guide-version{font-size:12px}.authoring-layout article{min-width:0}.authoring-layout h3,.authoring-layout h4{margin:6px 0 0}.guide-node-index{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:18px}.guide-controls{display:grid;gap:8px}.guide-control{border:1px solid var(--doc-line);border-radius:10px;background:var(--doc-surface);scroll-margin-top:24px}.guide-control summary{padding:16px;font-weight:650;cursor:pointer}.guide-control[open] summary{border-bottom:1px solid var(--doc-line)}.guide-control:target{border-color:var(--doc-accent)}.guide-control-body{display:grid;gap:16px;padding:18px;font-size:15px}.guide-control-body dl{display:grid;gap:6px;margin:0}.guide-control-body dt{font-weight:700}.guide-control-body dd{margin:0 0 8px;color:var(--doc-muted);line-height:1.6}.guide-example{--example-width: 100%;--example-padding: 24px;--example-gap: 16px;--example-direction: row;--example-main: flex-start;--example-cross: flex-start;--example-wrap: wrap}.example-live{display:grid;gap:18px;min-width:0;padding:20px;border:1px solid var(--doc-line);border-radius:12px;background:var(--doc-surface)}.example-controls{display:flex;flex-wrap:wrap;gap:16px;align-items:center}.example-live label{display:grid;gap:8px;font-size:14px;font-weight:600}.example-live input[type=range]{width:min(100%,180px);accent-color:var(--doc-accent)}.example-live select{padding:8px;color:var(--doc-text);background:var(--doc-surface);border:1px solid var(--doc-line);border-radius:6px;font:inherit}.example-live output{color:var(--doc-muted);font-weight:400;font-variant-numeric:tabular-nums}.example-live .example-checkbox{display:flex;align-items:center}.example-stage{min-width:0;overflow:auto;padding:8px;border:1px dashed var(--doc-line)}.example-sized-parent{display:flex;flex-direction:column;gap:12px;width:var(--example-width)}.example-block{padding:12px;border:1px solid #36856e;border-radius:6px;color:#163d32;background:#d9eee7;font-size:14px;text-align:center}.example-hug{width:max-content}.example-fill{width:100%}.example-fixed{width:120px}.example-spacing-parent{padding:var(--example-padding);background:#f6dfa5}.example-spacing-children{display:flex;flex-direction:column;gap:var(--example-gap);background:var(--doc-surface)}.example-layout-parent{display:flex;flex-direction:var(--example-direction);flex-wrap:var(--example-wrap);justify-content:var(--example-main);align-items:var(--example-cross);align-content:stretch;gap:12px;width:var(--example-width);height:230px;border:1px dashed var(--doc-accent)}.example-layout-parent .example-block{flex:0 0 auto;width:88px;height:48px}.example-position-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.example-position-pair h3{margin:0 0 12px}.example-scroll{height:220px;overflow:auto;border:1px solid var(--doc-line);border-radius:8px;font-size:14px}.example-position-container{border-bottom:3px solid var(--doc-accent)}.example-before{height:90px;padding:16px}.example-marker{padding:14px;color:#163d32;background:#d9eee7;border-block:1px solid #36856e}.example-sticky{position:sticky;top:0}.example-after{min-height:260px;padding:16px;line-height:1.6}.example-container-end{padding:16px;background:var(--doc-code)}.example-outside{min-height:240px;padding:16px}.example-explanation summary{padding:10px 0;cursor:pointer;font-weight:650}.example-explanation img{display:block;width:100%;height:auto;margin:12px 0}.example-explanation p{margin-top:12px}summary:focus-visible,select:focus-visible,.example-scroll:focus-visible{outline:2px solid var(--doc-accent);outline-offset:3px}@media (min-width: 721px){.authoring-layout aside{max-height:calc(100dvh - 48px);overflow-y:auto}}@media (max-width: 480px){.example-position-pair{grid-template-columns:minmax(0,1fr)}.example-live{padding:12px}}a:focus-visible,input:focus-visible{outline:2px solid var(--doc-accent);outline-offset:4px}@media (prefers-color-scheme: dark){:root{--doc-bg: #141b1e;--doc-surface: #1d272b;--doc-text: #e2ebe7;--doc-muted: #a9bcb5;--doc-line: #34463e;--doc-accent: #88d7bd;--doc-code: #26332e;background:var(--doc-bg);color:var(--doc-text)}header{background:var(--doc-surface);border-color:var(--doc-line)}a,.eyebrow{color:var(--doc-accent)}.brand{color:var(--doc-text)}.lede,section p,li,aside a{color:var(--doc-muted)}section{border-color:var(--doc-line)}code{color:var(--doc-text);background:var(--doc-code)}aside a[aria-current=page]{background:var(--doc-code);color:var(--doc-accent)}}@media (max-width: 720px){header .brand{white-space:nowrap}header nav{gap:12px;font-size:13px}.authoring-layout{grid-template-columns:minmax(0,1fr);gap:36px}.authoring-layout aside{display:grid;grid-template-columns:minmax(0,1fr)}.authoring-layout aside nav{display:flex;flex-wrap:wrap;gap:4px}.authoring-layout aside nav a{background:var(--doc-code);padding:8px 10px}.authoring-layout p{overflow-wrap:anywhere}}.example-resize{width:100%;min-width:170px;max-width:100%;resize:horizontal;overflow:auto;padding:0 8px 8px 0}.example-resize iframe{border:1px solid var(--doc-accent);display:block;width:100%;height:300px}.example-containing-demo{padding:12px}.example-relative-demo{padding:12px 36px 12px 12px}.example-reserved{border:2px dashed var(--doc-accent);margin:16px 0}.example-following{border-top:1px solid var(--doc-accent);padding-top:8px}.example-overflow-grid{display:grid;gap:22px;grid-template-columns:repeat(3,minmax(0,1fr));padding-bottom:120px}@media (max-width: 600px){.example-overflow-grid{grid-template-columns:1fr;gap:125px}}.example-crop-area{width:var(--example-width, 60%);height:240px;border:2px solid #23715d;background:#f4f7f5;margin-top:16px}.example-crop-area img{display:block;width:100%;height:100%;object-fit:var(--example-media-fit, contain);object-position:var(--example-focal-x, 50%) var(--example-focal-y, 50%)}.example-breakpoint-stage{overflow:hidden;width:100%;height:200px;border:1px solid #23715d}.example-background-stage{position:relative;height:250px;overflow:hidden;background:#324a5c;color:#fff}.example-background-motion{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(110deg,transparent 30%,#f3c677 30%,#f3c677 48%,transparent 48%)}[data-playing] .example-background-motion{animation:example-background-motion 4s linear infinite alternate}.example-background-dim{position:absolute;top:0;right:0;bottom:0;left:0;background:#000;opacity:var(--example-dimming, .4)}.example-background-stage .example-background-copy{color:#fff;position:relative;padding:40px 24px;font-size:28px;font-weight:700}.example-background-toggle{position:absolute;bottom:12px;right:12px;min-height:44px;padding:8px 14px;background:#111d;color:#fff;border:1px solid white;border-radius:6px;cursor:pointer}@keyframes example-background-motion{0%{transform:translate(-25%)}to{transform:translate(25%)}}[data-layout-example=overlays] .example-breakpoint-stage{height:320px}