:root{
  --md-primary:#6750A4;
  --md-secondary-container:#E8DEF8; --md-on-secondary-container:#1D192B;
  --md-surface:#FEF7FF; --md-on-surface:#1D1B20; --md-on-surface-variant:#49454F;
  --md-outline-variant:#CAC4D0;
  --md-surface-container-low:#F7F2FA; --md-surface-container:#F3EDF7; --md-surface-container-high:#ECE6F0;
  --md-shape-xs:4px; --md-shape-l:16px; --md-shape-xl:28px; --md-shape-full:9999px;
  --md-emphasized:cubic-bezier(.2,0,0,1); --md-emphasized-decel:cubic-bezier(.05,.7,.1,1);
  --md-font-brand:'Google Sans Flex',Roboto,system-ui,-apple-system,sans-serif;
  --md-font-plain:'Roboto','Google Sans Flex',system-ui,-apple-system,sans-serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  font-family:var(--md-font-plain);
  background:var(--md-surface) radial-gradient(var(--md-outline-variant) .5px,transparent .5px);
  background-size:24px 24px;color:var(--md-on-surface);
  display:flex;flex-direction:column;align-items:center;min-height:100vh;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
main{max-width:640px;width:100%;padding:12px 24px 64px;display:flex;flex-direction:column;gap:36px}
@keyframes md-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes hero-pop{0%{opacity:0;transform:scale(.94);font-variation-settings:'opsz' 16,'wdth' 100,'wght' 500,'ROND' 0}100%{opacity:1;transform:none;font-variation-settings:'opsz' 112,'wdth' 100,'wght' 800,'ROND' 100}}

.headline-small{font-family:var(--md-font-brand);font-size:1.5rem;line-height:2rem;font-weight:700}
.body-large{font-family:var(--md-font-plain);font-size:1rem;line-height:1.5rem;font-weight:400;letter-spacing:.03125rem}
.body-medium{font-family:var(--md-font-plain);font-size:.875rem;line-height:1.25rem;font-weight:400;letter-spacing:.015625rem}
.ms{font-family:'Material Symbols Rounded';font-weight:normal;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;direction:ltr;-webkit-font-feature-settings:'liga';font-feature-settings:'liga';-webkit-font-smoothing:antialiased;font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.topnav{width:100%;max-width:640px;box-sizing:border-box;padding:28px 24px 0;margin-top:8px;display:flex;align-items:center;gap:12px}
.topnav-brand{font-family:var(--md-font-brand);font-size:1.125rem;line-height:1.5rem;font-weight:600;color:var(--md-primary);text-decoration:none;letter-spacing:-.00625rem;transform-origin:left center;font-variation-settings:'opsz' 16,'wdth' 100,'wght' 600,'ROND' 0;transition:font-size .32s var(--md-emphasized),line-height .32s var(--md-emphasized),letter-spacing .32s var(--md-emphasized),font-variation-settings .32s var(--md-emphasized)}
.topnav.is-home .topnav-brand{font-size:3.5625rem;line-height:2.75rem;font-weight:800;letter-spacing:-.015625rem;font-variation-settings:'opsz' 112,'wdth' 100,'wght' 800,'ROND' 100;animation:hero-pop .55s var(--md-emphasized-decel) both}
.topnav-spacer{flex:1}
.topnav-links{display:flex;gap:2px}
.topnav-link .nav-icon{display:none}
.topnav-link{position:relative;display:inline-flex;align-items:center;height:36px;padding:0 14px;color:var(--md-on-surface-variant);text-decoration:none;border-radius:var(--md-shape-full);font-family:var(--md-font-plain);font-weight:500;font-size:.8125rem;letter-spacing:.00625rem;overflow:hidden;isolation:isolate;-webkit-tap-highlight-color:transparent;transition:color .2s var(--md-emphasized),background .2s var(--md-emphasized)}
.topnav-link::before{content:'';position:absolute;inset:0;background:var(--md-on-surface);opacity:0;z-index:-1;transition:opacity .2s var(--md-emphasized)}
.topnav-link:hover::before{opacity:.08}
.topnav-link:focus-visible{outline:none}
.topnav-link:focus-visible::before{opacity:.12}
.topnav-link.active{color:var(--md-on-secondary-container);background:var(--md-secondary-container)}
.topnav-link.active::before{background:var(--md-on-secondary-container)}

.route{display:none}
.route.active{display:block;animation:md-enter .4s var(--md-emphasized-decel) both}
.hero-sub{color:var(--md-on-surface-variant);line-height:1.5;margin-top:10px;margin-bottom:16px}
.hero-sub+.hero-sub{margin-top:0}
.hero.active{display:flex;flex-direction:column}
.section-title{color:var(--md-primary);margin-bottom:12px}

.card-list{list-style:none;display:flex;flex-direction:column}
.card{display:block;text-decoration:none;color:inherit;background:var(--md-surface-container-low);border-radius:var(--md-shape-l);padding:24px;margin-bottom:12px;position:relative;overflow:hidden;isolation:isolate;-webkit-tap-highlight-color:transparent;transition:background .2s var(--md-emphasized)}
.card::before{content:'';position:absolute;inset:0;background:var(--md-primary);opacity:0;z-index:-1;transition:opacity .2s var(--md-emphasized)}
.card:hover::before{opacity:.08}
.card:focus-visible{outline:none}
.card:focus-visible::before{opacity:.12}
.card:active{background:var(--md-surface-container)}
.card:active::before{opacity:.12}
.card-headline{display:flex;align-items:center;justify-content:space-between;gap:16px;color:var(--md-on-surface);margin-bottom:8px}
.card-title{font-family:var(--md-font-brand);font-size:1.375rem;line-height:1.75rem;font-weight:600;color:var(--md-primary)}
.card-action{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;flex:0 0 auto;color:var(--md-primary)}
.card-action .ms{font-size:22px}
.card-support{color:var(--md-on-surface-variant)}

.connect-wrap{display:flex;flex-direction:column;margin-top:4px}
.connect-label{font-family:var(--md-font-brand);font-size:1rem;line-height:1.5rem;font-weight:600;color:var(--md-primary);margin-bottom:8px}
.connect{display:flex;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 16px;margin:0 8px 8px 0;border:none;background:var(--md-secondary-container);cursor:pointer;text-decoration:none;border-radius:var(--md-shape-full);color:var(--md-on-secondary-container);font-family:var(--md-font-brand);font-weight:600;font-size:.8125rem;letter-spacing:.00625rem;position:relative;overflow:hidden;isolation:isolate;-webkit-tap-highlight-color:transparent;transition:background .2s var(--md-emphasized)}
.chip::before{content:'';position:absolute;inset:0;background:var(--md-on-secondary-container);opacity:0;z-index:-1;transition:opacity .2s var(--md-emphasized)}
.chip:hover::before{opacity:.08}
.chip:focus-visible{outline:none}
.chip:focus-visible::before{opacity:.12}
.chip:active{background:var(--md-surface-container-high)}
.chip:active::before{opacity:.12}

.post{width:100%;max-width:640px;box-sizing:border-box;padding:48px 24px 64px;display:flex;flex-direction:column;gap:20px}
.post-back{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px;align-self:flex-start;text-decoration:none;border-radius:var(--md-shape-full);font-family:var(--md-font-plain);font-weight:500;font-size:.8125rem;color:var(--md-primary);position:relative;overflow:hidden;isolation:isolate;-webkit-tap-highlight-color:transparent;transition:background .2s var(--md-emphasized)}
.post-back::before{content:'';position:absolute;inset:0;background:var(--md-primary);opacity:0;z-index:-1;transition:opacity .2s var(--md-emphasized)}
.post-back:hover::before{opacity:.08}
.post-back:focus-visible{outline:none}
.post-back:focus-visible::before{opacity:.12}
.post-back .ms{font-size:18px}
.post h1{font-family:var(--md-font-brand);font-size:2.25rem;line-height:2.75rem;font-weight:700;color:var(--md-on-surface);letter-spacing:-.015625rem}
.post h2{font-family:var(--md-font-brand);font-size:1.5rem;line-height:2rem;font-weight:600;color:var(--md-on-surface);margin-top:8px}
.post-meta{font-family:var(--md-font-plain);font-size:.8125rem;color:var(--md-on-surface-variant);letter-spacing:.015625rem}
.post p{font-family:var(--md-font-plain);font-size:1rem;line-height:1.75;letter-spacing:.015625rem;color:var(--md-on-surface)}
.post code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.875em;background:var(--md-surface-container);padding:.1em .35em;border-radius:var(--md-shape-xs)}

.error{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:24px;padding:40px 24px}
.error-code{font-family:var(--md-font-brand);font-size:8rem;line-height:1;font-weight:900;color:var(--md-primary);letter-spacing:-.05em;font-variation-settings:'opsz' 112,'wdth' 112,'wght' 900,'ROND' 100;animation:hero-pop .5s var(--md-emphasized-decel) both}
.error-card{width:100%;max-width:480px;display:flex;flex-direction:column;gap:12px;background:var(--md-surface-container-low);border-radius:var(--md-shape-xl);padding:32px;animation:md-enter .5s var(--md-emphasized-decel) both}
.error-title{font-family:var(--md-font-brand);font-size:1.5rem;line-height:2rem;font-weight:700;color:var(--md-primary)}
.error-text{color:var(--md-on-surface-variant)}
.error-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 24px;align-self:center;background:var(--md-secondary-container);color:var(--md-on-secondary-container);border-radius:var(--md-shape-full);text-decoration:none;font-family:var(--md-font-brand);font-weight:600;font-size:.875rem;letter-spacing:.00625rem;position:relative;overflow:hidden;isolation:isolate;-webkit-tap-highlight-color:transparent;transition:background .2s var(--md-emphasized)}
.error-btn .ms{font-size:18px;font-variation-settings:'FILL' 1,'wght' 400,'GRAD' 0,'opsz' 18}
.error-btn::before{content:'';position:absolute;inset:0;background:var(--md-on-secondary-container);opacity:0;z-index:-1;transition:opacity .2s var(--md-emphasized)}
.error-btn:hover::before{opacity:.08}
.error-btn:focus-visible{outline:none}
.error-btn:focus-visible::before{opacity:.12}
.error-btn:active{background:var(--md-surface-container-high)}
.error-btn:active::before{opacity:.12}

@media (max-width:480px){
  .topnav{padding:16px 16px 0;margin-top:4px;gap:8px}
  .topnav-link{width:44px;height:44px;padding:0;justify-content:center;font-size:0}
  .topnav-link .nav-icon{display:inline-flex;align-items:center;justify-content:center;font-size:22px;line-height:1}
  .topnav.is-home .topnav-brand{font-size:2rem;line-height:2rem;font-weight:800;letter-spacing:-.009375rem;font-variation-settings:'opsz' 112,'wdth' 100,'wght' 800,'ROND' 100}
  main{padding:12px 16px 48px;gap:24px}
  .post{padding:32px 16px 48px}
  .post h1{font-size:1.75rem;line-height:2.25rem}
  .error-code{font-size:6rem}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}