.design-picker{min-height:44px;display:flex;align-items:center;justify-content:center;gap:8px;padding:7px 16px;background:#f5f1fa;border-bottom:1px solid #e6dced;font-size:12px;position:sticky;top:0;z-index:50;flex-wrap:wrap}.design-picker>span{font-size:10px;letter-spacing:1px;color:#877792;margin-right:12px}.design-picker a{color:#74667f;padding:3px 10px;border-radius:5px}.design-picker a[aria-current]{background:white;color:#62369a;box-shadow:0 1px 4px #36244412}.header{top:44px}.sidebar,.toc{top:124px;height:calc(100dvh - 124px)}.nav-icon{display:none!important}.sidebar .nav-group a{padding-left:12px;gap:0}.nav-group h2{font-size:13px}.sidebar-note{display:none}.layout{grid-template-columns:215px minmax(0,850px) 150px;gap:38px}.is-home .toc{visibility:hidden}.is-home .layout{grid-template-columns:215px minmax(0,950px);gap:65px}.is-home .toc{display:none}.is-home main{padding-top:62px}.is-home .breadcrumb{display:none}.home-kicker{font-size:11px;letter-spacing:1.7px;color:#8d78a3;margin-bottom:17px}.home-intro h1{font-size:45px;line-height:1.15;margin:0 0 15px;max-width:760px}.home-intro>p{font-size:17px;color:#7c7484;margin:0 0 18px}.command-shortcut{font-size:14px;font-weight:600;text-underline-offset:5px}.entry-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:40px}.entry-card{padding:26px;border:1px solid #e8e3ed;border-radius:12px;color:var(--ink);display:block;transition:border-color .15s,background .15s;min-width:0}.entry-card:hover{background:#fcfaff;border-color:#b99acf;text-decoration:none}.entry-top{display:flex;align-items:center;gap:12px;margin-bottom:24px}.entry-top svg{width:25px;height:25px;color:#895caf;flex-shrink:0}.entry-top small{font-size:11px;color:#95879f}.entry-number{display:none}.entry-card h2{font:600 25px/1.2 Rajdhani,sans-serif;margin:0 0 9px;letter-spacing:0}.entry-card p{font-size:15px;line-height:1.7;margin:0;color:#807588;max-width:350px}.entry-details{display:none;font-size:12px;color:#a193ab;margin-top:24px}.home-end{display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--line);margin-top:38px;padding-top:20px;font-size:12px;color:#9b8aa6}.is-home .page-footer{display:none}.audience-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-top:42px}.audience-heading{font-size:17px;font-weight:600;color:#53415f;margin-bottom:22px}.audience-heading span{display:block;font-size:12px;font-weight:400;color:#9987a6;margin-top:3px}.audience-grid .entry-card{margin-bottom:15px;min-height:185px}.audience-grid .entry-top{display:none}[data-design=audience] .home-intro{padding:30px 34px;background:#f8f5fc;border-radius:12px;border:1px solid #eee6f5}[data-design=audience] .home-intro h1{font-size:40px}[data-design=audience] .entry-details{display:block}[data-design=audience] .entry-card{padding:25px}[data-design=audience] .entry-card h2{font-size:27px}[data-design=index] .home-intro h1{font-size:56px}[data-design=index] .home-intro{padding-bottom:30px;border-bottom:1px solid var(--line)}[data-design=index] .entry-grid{gap:0 38px;margin-top:10px}[data-design=index] .entry-card{border:0;border-bottom:1px solid var(--line);border-radius:0;padding:26px 0 30px}[data-design=index] .entry-top svg{display:none}[data-design=index] .entry-number{display:inline;font:600 16px Rajdhani;color:#ad99bf}[data-design=index] .entry-top{margin-bottom:15px}[data-design=index] .entry-details{display:block}[data-design=index] .entry-card:hover{background:transparent}[data-design=index] .entry-card:hover h2{color:var(--purple)}[data-design=index] .home-end{border:0;margin-top:18px}.nav-group a.active{background:#f5f0fa}.search-trigger{background:#fff}.authorize{background:#fff}.brand img{aspect-ratio:1;object-fit:contain}
@media(max-width:1190px){.layout,.is-home .layout{grid-template-columns:200px minmax(0,1fr);gap:32px}.home-intro h1{font-size:39px}.entry-card{padding:22px}.is-home main{padding-top:42px}}
@media(max-width:820px){.design-picker{position:relative;min-height:70px;gap:3px}.design-picker>span{width:100%;text-align:center;margin:0}.design-picker a{font-size:11px;padding:3px 7px}.header{top:0}.layout,.is-home .layout{display:block;padding:0 24px}.sidebar{top:68px;height:calc(100dvh - 68px)}.is-home main{padding-top:35px}.home-intro h1{font-size:37px}.entry-grid,.audience-grid{gap:15px}.entry-card{padding:22px}.entry-top small{font-size:10px}.home-end{flex-direction:column}.home-kicker{font-size:10px}[data-design=index] .home-intro h1{font-size:45px}}
@media(max-width:560px){.entry-grid,.audience-grid{grid-template-columns:1fr}.entry-top{margin-bottom:14px}.entry-card{padding:23px}.home-intro>p{font-size:16px}.entry-grid{margin-top:28px}.entry-card h2{font-size:25px}.audience-grid{gap:20px}[data-design=audience] .home-intro{padding:24px}[data-design=audience] .home-intro h1{font-size:34px}[data-design=index] .entry-grid{gap:0}.home-intro h1{font-size:36px}.search-head input{font-size:16px}}
@media(prefers-reduced-motion:reduce){.entry-card{transition:none}}

/* Production page has no preview selector. */
.header{top:0}.sidebar,.toc{top:80px;height:calc(100dvh - 80px)}.home-footer-brand{display:flex;align-items:center;gap:8px}.home-footer-brand img{object-fit:contain;aspect-ratio:1}@media(max-width:820px){.sidebar{top:68px;height:calc(100dvh - 68px)}}

/* One shared footer on every page, including narrow screens. */
.page-footer,.is-home .page-footer{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px}.page-footer .footer-brand{display:flex;align-items:center;gap:8px}.page-footer .footer-mobile-logo{display:none}.page-footer .footer-twitch{margin-left:auto;white-space:nowrap}.page-footer{font-size:12px}

/* Independent navigation scrolling on touchscreens, mice and trackpads. */
.sidebar{min-height:0;align-self:start;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;scroll-behavior:auto;-webkit-overflow-scrolling:touch;touch-action:pan-y pinch-zoom}