/* The guide directory and the shared navigation use the app's existing palette. */
[hidden]{display:none!important}
.guides-hub main{padding-top:68px;padding-bottom:70px}
.hub-intro{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:50px;align-items:center;padding-bottom:57px}
.hub-intro h1{font-size:clamp(2.7rem,4.5vw,4.4rem);line-height:1.08;letter-spacing:-.055em;margin:22px 0}
.hub-intro p:not(.eyebrow){font-size:1.05rem;line-height:1.8;color:var(--muted)}
.hub-art{position:relative;justify-self:center;width:195px;transform:rotate(7deg)}
.hub-art:before{content:"";position:absolute;inset:-38%;border-radius:50%;background:radial-gradient(ellipse,#7a5cff24,transparent 68%);z-index:-1}
.hub-art img{border-radius:23px;box-shadow:0 18px 50px #0006}
.hub-art>span{display:grid;place-items:center;position:absolute;right:-24px;bottom:-21px;width:76px;height:76px;border-radius:24px;background:linear-gradient(135deg,#26202e,#171622);border:1px solid #675075;box-shadow:0 10px 30px #0005;color:#ff94b9;font-size:2.5rem;font-weight:600;transform:rotate(-13deg)}
.hub-start{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:30px 34px;border:1px solid #423347;border-radius:24px;background:linear-gradient(115deg,#21172188,#1a182688);margin-bottom:48px}
.hub-start h2{font-size:1.8rem;letter-spacing:-.035em;margin:8px 0}
.hub-start p{color:var(--muted);font-size:.9375rem}
.hub-start .button{gap:20px;white-space:nowrap}
.guide-search{max-width:650px;margin-bottom:35px}
.guide-search label{display:block;font-size:.875rem;font-weight:600;margin-bottom:12px}
.search-field{display:flex;gap:12px;align-items:center;background:#15141d;border:1px solid #49404f;border-radius:16px;padding:0 18px;min-height:55px}
.search-field:focus-within{outline:2px solid #bbabff;outline-offset:4px}
.search-field svg{width:22px;height:22px;flex-shrink:0;color:#d0b5dc}
.search-field input{width:100%;min-width:0;background:none;border:0;color:var(--ink);font:inherit;font-size:1rem;padding:15px 0;outline:none}
.search-field input::placeholder{color:#aaa4b8;opacity:1}
.guide-search>p{color:var(--quiet);font-size:.8125rem;margin-top:10px;min-height:21px}
.guide-directory{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:34px;row-gap:46px}
.guide-group:first-child{grid-column:1/-1}
.guide-group:first-child .guide-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:58px}
.guide-group-heading{display:flex;align-items:baseline;gap:12px;border-bottom:1px solid #49404f;padding-bottom:17px}
.guide-group-heading>span{font-size:.75rem;font-weight:700;color:#cc99bc;letter-spacing:.07em}
.guide-group-heading h2{font-size:1.45rem;letter-spacing:-.03em}
.guide-list{list-style:none;margin:0;padding:0}
.guide-list li{border-bottom:1px solid var(--line)}
.guide-list a{display:grid;grid-template-columns:43px minmax(0,1fr) 20px;gap:16px;align-items:start;padding:22px 0;position:relative;transition:color .15s}
.guide-list a:hover h3{color:#ff9fbe}
.guide-glyph{display:grid;place-items:center;width:42px;min-height:42px;border-radius:13px;border:1px solid #4d3850;background:linear-gradient(120deg,#ff8a3d0a,#7a5cff13);color:#ffa5c4;font-size:1.1rem;font-weight:650;letter-spacing:-.04em}
.guide-list h3{font-size:1.05rem;line-height:1.3;letter-spacing:-.02em;margin-top:1px;transition:color .15s}
.guide-list p{font-size:.875rem;line-height:1.75;color:var(--muted);margin-top:6px;max-width:375px}
.guide-arrow{font-size:1.1rem;color:#a494b6;padding-top:3px}
.search-empty{color:var(--muted);padding:30px 0 60px;max-width:600px}
.hub-end{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:25px;align-items:center;margin-top:58px;padding-top:28px;font-size:.8125rem;line-height:1.8;color:var(--quiet)}
.hub-end a{color:#f1b5cc;text-decoration:underline;text-underline-offset:4px;padding:10px 0}
.docs-sidebar{max-height:calc(100dvh - 129px);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#52435f transparent;padding-bottom:16px}
.docs-sidebar .rail-heading{margin-top:26px;margin-bottom:10px;font-size:.6875rem;line-height:1.6;color:#aaa4b8}
.docs-sidebar a{padding:7px 10px;font-size:.8125rem;line-height:1.45;border-radius:9px;min-height:33px}
.docs-sidebar .all-guides-link{color:#e5bed2;padding-left:10px;margin-bottom:2px}
.docs-sidebar a[aria-current="page"]{color:#ffc0d5;background:linear-gradient(120deg,#ff3d7f0b,#7a5cff0b);border:1px solid #563447}
.tool-icon{font-size:1.4rem;font-weight:650;letter-spacing:-.04em}
.mobile-guide-nav{display:none}
.docs-main{min-width:0}
.docs-main p+p{margin-top:14px}
.docs-section p a,.control-list a{color:#f5adc6;text-decoration:underline;text-underline-offset:4px;text-decoration-color:#936177}
.docs-section p a:hover,.control-list a:hover{color:white}
.control-list{margin:21px 0 0}
.control-list>div{display:grid;grid-template-columns:145px minmax(0,1fr);gap:21px;padding:16px 0;border-bottom:1px solid var(--line)}
.control-list>div:first-child{border-top:1px solid var(--line)}
.control-list dt{font-size:.9375rem;line-height:1.65;font-weight:600;color:#eee8f4}
.control-list dd{margin:0;font-size:.9375rem;line-height:1.8;color:var(--muted)}
.docs-section .callout{margin-top:23px}
.guide-screen{display:grid;grid-template-columns:minmax(0,1fr) 220px;align-items:center;gap:35px;margin-top:27px;padding:28px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(120deg,#1b1725,#13131d)}
.guide-screen img{grid-column:2;grid-row:1;width:220px;border-radius:22px;border:1px solid #5b475f}
.guide-screen figcaption{grid-column:1;grid-row:1;color:#c9bdcf;font-size:.9375rem;line-height:1.8}
.related-guides{border-top:1px solid var(--line);margin-top:44px;padding-top:25px;display:flex;flex-wrap:wrap;gap:10px}
.related-guides p{flex-basis:100%;margin-bottom:5px}
.related-guides a{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:11px 16px;min-height:44px;border:1px solid #453849;border-radius:14px;font-size:.875rem;background:#ffffff03}
.related-guides a:hover{border-color:#9b718e}
.related-guides a span{color:#d49ebc}
.docs-toc a{min-height:34px;line-height:1.6;padding-block:6px}
.docs-toc{max-height:calc(100dvh - 130px);overflow:auto;scrollbar-width:thin}
.in-app .mobile-guide-nav{display:none}
html.in-app{scroll-behavior:auto}
.not-found{min-height:calc(100dvh - 190px);padding-block:100px}
.not-found h1{font-size:clamp(2.8rem,6vw,5rem);margin:22px 0;line-height:1.05}
.not-found>p:not(.eyebrow){color:var(--muted)}
@media(max-width:1100px){.guide-directory{column-gap:28px}.guide-group:first-child .guide-list{column-gap:28px}.hub-intro{gap:20px}.hub-intro h1{font-size:3.4rem}.guide-screen{gap:23px;padding:24px;grid-template-columns:minmax(0,1fr) 200px}.guide-screen img{width:200px}}
@media(max-width:950px){.mobile-guide-nav{display:block;margin:0 0 24px;background:#15141d;border:1px solid #443749;border-radius:14px;font-size:.875rem}.mobile-guide-nav summary{cursor:pointer;padding:13px 16px;min-height:48px;font-weight:600}.mobile-guide-nav nav{padding:0 14px 17px;max-height:55dvh;overflow:auto}.mobile-guide-nav nav a{display:block;padding:8px;min-height:37px;color:var(--muted)}.mobile-guide-nav .rail-heading{font-size:.6875rem;margin:21px 8px 7px;color:#d499b6}.mobile-guide-nav a[aria-current="page"]{background:#332337;border-radius:8px;color:#ffd0df}.guide-screen{grid-template-columns:minmax(0,1fr) 230px}.guide-screen img{width:230px}.hub-intro h1{font-size:3rem}.hub-art{width:155px}.hub-art>span{width:63px;height:63px;font-size:2rem;right:-16px}}
@media(max-width:600px){.guides-hub main{padding-top:39px;padding-bottom:40px}.hub-intro{display:block;position:relative;padding-bottom:33px}.hub-intro h1{font-size:2.5rem;line-height:1.12;max-width:380px;margin:19px 0}.hub-intro p:not(.eyebrow){font-size:1rem;line-height:1.8}.hub-art{display:none}.hub-start{padding:23px;border-radius:20px;display:block;margin-bottom:32px}.hub-start h2{font-size:1.5rem}.hub-start .button{margin-top:20px}.hub-start p{font-size:.875rem}.guide-directory{grid-template-columns:1fr;gap:35px}.guide-group-heading h2{font-size:1.35rem}.guide-list a{gap:13px;padding:20px 0;grid-template-columns:40px minmax(0,1fr) 16px}.guide-glyph{width:40px;min-height:40px}.guide-list h3{font-size:1rem}.guide-list p{font-size:.875rem}.hub-end{display:block;margin-top:35px;padding-top:23px}.hub-end a{display:inline-block;margin-top:12px;min-height:44px}.control-list>div{grid-template-columns:1fr;gap:6px;padding-block:17px}.control-list dt{font-size:1rem}.control-list dd{font-size:1rem}.guide-screen{grid-template-columns:1fr;padding:20px;gap:18px;border-radius:20px}.guide-screen img{grid-column:1;grid-row:1;width:min(230px,100%);justify-self:center}.guide-screen figcaption{grid-column:1;grid-row:2;font-size:.8125rem;text-align:center}.related-guides a{flex-basis:100%}.not-found{padding-block:65px}.mobile-guide-nav summary{font-size:.8125rem}}
@media(prefers-reduced-motion:reduce){.guide-list a,.guide-list h3{transition:none}}
@media(max-width:950px){.guide-directory{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.guide-directory,.guide-group:first-child .guide-list{grid-template-columns:1fr}}
@media(forced-colors:active){.guide-glyph,.search-field,.hub-start,.related-guides a{border:1px solid CanvasText}.search-field input{color:CanvasText}.guide-arrow{color:LinkText}}
@media print{.mobile-guide-nav,.related-guides,.hub-art,.guide-search{display:none}.guide-screen{background:white;display:block;break-inside:avoid}.guide-screen img{max-width:180px}.guide-screen figcaption,.control-list dd{color:#333}.control-list dt{color:#111}.docs-section p a{color:#111}}
.example-table{width:100%;border-collapse:collapse;margin:24px 0;font-size:.9375rem;line-height:1.7}
.example-table caption{text-align:left;color:var(--muted);font-size:.8125rem;padding-bottom:12px}
.example-table th,.example-table td{text-align:left;padding:12px 16px;border-bottom:1px solid var(--line)}
.example-table th{color:#eab5ce;font-weight:600;background:#ffffff04}
.example-table td{color:var(--ink)}
@media(max-width:600px){.example-table{font-size:1rem}.example-table th,.example-table td{padding:12px 8px}}
@media print{.example-table th,.example-table td,.example-table caption{color:#111}}

/* Keep section links beside wrapped headings instead of on an empty line. */
.docs-section h2{position:relative;padding-right:2rem}
.docs-section h2 .heading-link{position:absolute;right:0;top:0;margin-left:0}