/* Kerbot Microsystems · Corporate identity v1
   One restrained visual vocabulary for the marketing shell and extension catalogue.
   Functional viewers, admin pages and editors retain their own application UI. */
:root{
  --kb-navy:#10283a;--kb-navy-deep:#0b1a28;--kb-ink:#152637;
  --kb-muted:#5b6a78;--kb-blue:#195f99;--kb-border:#d9e1e8;
  --kb-canvas:#f5f7f9;--kb-paper:#ffffff;--kb-radius:8px;
  --kb-content:1240px;--kb-space:clamp(64px,7vw,100px);
}
body.home-page,body.extension-detail-page{
  font-family:Inter,"Segoe UI",Arial,sans-serif;
  color:var(--kb-ink);
  background:var(--kb-canvas)!important;
  background-image:none!important;
}
body.home-page :is(h1,h2,h3),body.extension-detail-page :is(h1,h2,h3){
  font-family:Inter,"Segoe UI",Arial,sans-serif;
  font-weight:650;
  text-wrap:balance;
}
body.home-page :is(a,button),body.extension-detail-page :is(a,button){
  -webkit-tap-highlight-color:transparent;
}
body.home-page :is(a,button):focus-visible,
body.extension-detail-page :is(a,button):focus-visible{
  outline:2px solid #327fc0;outline-offset:3px;
}
body.home-page .main,body.extension-detail-page .main{min-width:0}

/* Shared site shell. Match brand placement and navigation on both routes. */
body:is(.home-page,.extension-detail-page) .rail,
body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail{
  background:#fff!important;color:var(--kb-ink)!important;
  box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
@media(min-width:1101px){
  body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail{
    width:min(calc(100% - 48px),var(--kb-content))!important;
    min-height:82px;padding:13px 0!important;border-radius:0!important;
  }
  body:is(.home-page,.extension-detail-page).has-scrolled .rail{
    width:min(calc(100% - 40px),var(--kb-content))!important;
    top:10px!important;padding:11px 20px!important;
    border:1px solid var(--kb-border)!important;border-radius:9999px!important;
    box-shadow:0 8px 24px rgba(9,25,39,.08)!important;
    background:#fff!important;backdrop-filter:none!important;
  }
}
body:is(.home-page,.extension-detail-page) .rail .brand b{
  font-size:15px!important;letter-spacing:-.02em!important;font-weight:750!important;
  color:var(--kb-navy)!important;
}
body:is(.home-page,.extension-detail-page) .rail .brand-subtitle{
  font-size:10px!important;letter-spacing:.08em!important;color:#6e7d89!important;
}
body:is(.home-page,.extension-detail-page) .rail .brand-mark{
  height:33px!important;max-width:42px;border-radius:3px!important;
}
body:is(.home-page,.extension-detail-page) .rail .nav>a,
body:is(.home-page,.extension-detail-page) .rail .nav-dropdown-btn{
  font-size:13px!important;font-weight:600!important;color:#344757!important;
  border-radius:9999px!important;
}
body:is(.home-page,.extension-detail-page) .rail .nav>a:hover,
body:is(.home-page,.extension-detail-page) .rail .nav-dropdown-btn:hover{
  background:#edf2f6!important;color:var(--kb-navy)!important;
}
body:is(.home-page,.extension-detail-page) .rail .rail-actions .btn{
  min-height:38px!important;padding:0 16px!important;
  border-radius:9999px!important;font-weight:650!important;
  box-shadow:none!important;
}
body:is(.home-page,.extension-detail-page) .rail .rail-actions .btn.primary{
  background:var(--kb-navy)!important;color:white!important;border:1px solid var(--kb-navy)!important;
}
body:is(.home-page,.extension-detail-page) .rail .rail-actions .btn:not(.primary){
  background:#fff!important;color:var(--kb-navy)!important;border:1px solid var(--kb-border)!important;
}
body:is(.home-page,.extension-detail-page) .rail .rail-actions .btn:hover{filter:brightness(.94)}
body:is(.home-page,.extension-detail-page) .footer.corporate-footer{
  background:transparent!important;border-top:1px solid var(--kb-border)!important;
  box-shadow:none!important;
}
body:is(.home-page,.extension-detail-page) .footer .brand b{font-weight:750;letter-spacing:-.025em}
body:is(.home-page,.extension-detail-page) .footer .footer-col-title{
  color:var(--kb-ink)!important;font-weight:700!important;letter-spacing:0!important;
}
body:is(.home-page,.extension-detail-page) .footer .footer-col-list a{
  text-decoration:none!important;
}
body:is(.home-page,.extension-detail-page) .footer .footer-col-list a:hover{color:var(--kb-blue)!important}
body:is(.home-page,.extension-detail-page) .btn.primary{
  border-radius:9999px!important;box-shadow:none!important;
}

/* Home: consistent navy product storytelling; one type scale and spacing rhythm. */
body.home-page .home-hero-carousel{border-color:var(--kb-border)!important}
body.home-page .home-hero-slide--drone,
body.home-page .home-hero-slide--engine,
body.home-page .home-hero-slide--open,
body.home-page .home-hero-slide--extensions{
  background:var(--kb-navy)!important;
}
body.home-page .home-hero-visual{
  background:#142c3e!important;border-right:1px solid #405467!important;
}
body.home-page .home-hero-visual img{
  opacity:.96!important;filter:saturate(.78) contrast(1.03);
}
body.home-page .home-hero-copy h1,
body.home-page .hero .home-hero-copy h1{
  font-size:clamp(36px,3.7vw,56px)!important;
  line-height:1.07!important;letter-spacing:-.043em!important;
  font-weight:660!important;
}
body.home-page .home-hero-lead,
body.home-page .hero .home-hero-lead{
  font-size:clamp(15px,1.2vw,18px)!important;line-height:1.65!important;
  color:#d6e0e8!important;
}
body.home-page .home-hero-cta.btn,
body.home-page .hero .home-hero-cta.btn{
  min-height:44px!important;border-radius:9999px!important;
  color:var(--kb-navy)!important;font-size:13px!important;font-weight:700!important;
  background:#fff!important;border:1px solid #fff!important;
}
body.home-page .home-hero-controls{
  min-height:65px!important;background:#fff!important;border-color:var(--kb-border)!important;
}
body.home-page .home-hero-control,
body.home-page .home-hero-prev,
body.home-page .home-hero-next{
  width:40px!important;height:40px!important;border-radius:50%!important;
  border:1px solid var(--kb-border)!important;background:#fff!important;
  color:var(--kb-navy)!important;box-shadow:none!important;
}
body.home-page .home-hero-pause{width:34px!important;height:34px!important}
body.home-page .home-hero-dot{height:3px!important;border-radius:999px!important;background:#b3c0cb!important}
body.home-page .home-hero-dot::after{border-radius:999px!important;background:var(--kb-blue)!important}
body.home-page .home-intro-band{margin-top:70px;border-color:var(--kb-border)!important}
body.home-page .home-intro-band h2{font-size:clamp(28px,3vw,42px)!important;font-weight:650!important}
body.home-page .section{padding-top:var(--kb-space);padding-bottom:var(--kb-space)}
body.home-page .section+.section{border-color:var(--kb-border)!important}
body.home-page .section-head h2,
body.home-page .showcase-head h2{
  font-size:clamp(32px,3.7vw,52px)!important;line-height:1.09!important;
  font-weight:660!important;letter-spacing:-.04em!important;
}
body.home-page :is(.showcase-head>p,.home-intro-band>p,.section-copy,.resource-row p){
  color:var(--kb-muted)!important;
}
body.home-page .showcase-stage{border-color:var(--kb-border)!important;background:var(--kb-navy-deep)!important}
body.home-page .showcase-panel,
body.home-page .showcase-engine .showcase-panel{
  background:#10283af2!important;border-color:#445b6c!important;
  box-shadow:none!important;padding:36px!important;
}
body.home-page .showcase-panel h3{font-size:clamp(29px,3vw,43px)!important;font-weight:650!important}
body.home-page .showcase-panel p{font-size:16px!important}
body.home-page .showcase-panel .btn.primary{
  background:#fff!important;color:var(--kb-navy)!important;
  border:1px solid white!important;
}
body.home-page .stack-board,
body.home-page .stack-flow,
body.home-page .resource-list,
body.home-page .resource-row{border-color:var(--kb-border)!important}
body.home-page .stack-product{background:transparent!important}
body.home-page .stack-product h3{font-size:25px!important}
body.home-page .stack-product b,
body.home-page .resource-row>b,
body.home-page .home-news-more{color:var(--kb-blue)!important}
body.home-page .resource-row:hover{background:rgba(228,235,241,.35)}
body.home-page .resource-row h3{font-size:22px!important}
body.home-page .home-news-section{border-color:var(--kb-border)!important}
body.home-page .home-news-section::before{display:none!important}
body.home-page .home-news-grid .home-news-card,
body.home-page .home-news-grid .news-card{
  border-color:var(--kb-border)!important;box-shadow:none!important;
}
body.home-page .home-pricing-cta{
  background:var(--kb-navy)!important;border-color:var(--kb-navy)!important;
  box-shadow:none!important;border-radius:0!important;
}
body.home-page .home-pricing-cta h2{
  font-size:clamp(29px,3vw,42px)!important;font-weight:660!important;
}
body.home-page .home-pricing-cta .btn,
body.home-page .home-pricing-cta .btn.primary{
  border-radius:9999px!important;box-shadow:none!important;
}
body.home-page .home-pricing-cta .btn.primary{
  color:var(--kb-navy)!important;background:#fff!important;border-color:#fff!important;
}

/* Extension detail: same width, density, typography and surface logic as home. */
body.extension-detail-page .extension-detail-main{width:100%!important;margin:0!important;padding-bottom:0!important}
body.extension-detail-page .extension-breadcrumbs{
  max-width:var(--kb-content)!important;padding:42px 24px 0!important;
  font-size:12px!important;color:var(--kb-muted)!important;
}
body.extension-detail-page .extension-breadcrumbs a{color:var(--kb-blue)!important}
body.extension-detail-page .extension-detail-hero{
  max-width:var(--kb-content)!important;min-height:0!important;
  margin:0 auto!important;padding:45px 38px!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;gap:28px!important;
  border:1px solid var(--kb-border)!important;border-radius:8px!important;
  background:#fff!important;box-shadow:none!important;
}
body.extension-detail-page .extension-detail-identity{
  display:grid!important;grid-template-columns:56px minmax(0,1fr)!important;gap:22px!important;
}
body.extension-detail-page .extension-detail-icon{
  width:56px!important;height:56px!important;min-width:56px!important;
  border-radius:7px!important;background:var(--kb-navy)!important;
  border:1px solid var(--kb-navy)!important;color:#fff!important;
  box-shadow:none!important;backdrop-filter:none!important;
}
body.extension-detail-page .extension-detail-author{
  margin:0 0 9px!important;font-size:11px!important;letter-spacing:.075em!important;
  color:var(--kb-blue)!important;
}
body.extension-detail-page .extension-detail-copy h1{
  font-size:clamp(34px,4vw,54px)!important;
  line-height:1.08!important;letter-spacing:-.045em!important;
  color:var(--kb-ink)!important;font-weight:680!important;
}
body.extension-detail-page .extension-detail-description{
  max-width:690px!important;margin-top:16px!important;
  font-size:15px!important;line-height:1.65!important;color:var(--kb-muted)!important;
}
body.extension-detail-page .extension-detail-tags{margin-top:16px!important}
body.extension-detail-page .extension-detail-meta-rich{margin-top:10px!important}
body.extension-detail-page :is(.extension-detail-tags span,.extension-meta-item){
  font-size:11px!important;color:#687784!important;background:transparent!important;
}
body.extension-detail-page .extension-detail-actions{
  flex-direction:column!important;align-items:stretch!important;
  justify-content:center!important;gap:10px!important;
  width:172px!important;max-width:172px!important;padding:0!important;
}
body.extension-detail-page .extension-detail-actions .btn,
body.extension-detail-page .extension-like-btn{
  width:100%!important;min-width:0!important;min-height:40px!important;
  border-radius:9999px!important;box-shadow:none!important;backdrop-filter:none!important;
}
body.extension-detail-page .extension-detail-actions .btn{
  background:var(--kb-navy)!important;border:1px solid var(--kb-navy)!important;color:#fff!important;
}
body.extension-detail-page .extension-like-btn{
  background:#fff!important;border:1px solid var(--kb-border)!important;
  color:var(--kb-ink)!important;
}
body.extension-detail-page .extension-like-btn[aria-pressed=true]{
  background:#fff2f4!important;border-color:#e9cbd1!important;color:#a5364b!important;
}
body.extension-detail-page .extension-local-nav{
  max-width:var(--kb-content)!important;padding:0 24px!important;
  margin:20px auto 0!important;border-bottom:1px solid var(--kb-border)!important;
  border-top:0!important;
}
body.extension-detail-page .extension-local-nav a{
  min-height:50px!important;color:var(--kb-muted)!important;font-size:13px!important;
}
body.extension-detail-page .extension-local-nav a.is-active,
body.extension-detail-page .extension-local-nav a:hover{color:var(--kb-ink)!important}
body.extension-detail-page .extension-local-nav a.is-active::after{background:var(--kb-blue)!important}
body.extension-detail-page .extension-workspace{
  max-width:var(--kb-content)!important;padding:34px 0 32px!important;
  grid-template-columns:minmax(0,1fr) 286px!important;gap:22px!important;
}
body.extension-detail-page :is(.extension-overview-panel,.extension-side-card,.extension-source-panel){
  border:1px solid var(--kb-border)!important;border-radius:8px!important;
  background:#fff!important;box-shadow:none!important;
}
body.extension-detail-page .extension-overview-panel{padding:27px 30px!important}
body.extension-detail-page .extension-workspace-main{gap:22px!important}
body.extension-detail-page .extension-source-panel{margin:0!important}
body.extension-detail-page .extension-side-card{padding:23px!important}
body.extension-detail-page .extension-sidebar{top:100px!important}
body.extension-detail-page .extension-section-kicker{
  margin-bottom:8px!important;color:#687784!important;
  font-size:10px!important;letter-spacing:.095em!important;
}
body.extension-detail-page :is(.extension-overview-panel h2,.extension-source-panel h2,.extension-side-card h2,.extension-related h2){
  font-size:22px!important;line-height:1.2!important;
  font-weight:680!important;letter-spacing:-.025em!important;color:var(--kb-ink)!important;
}
body.extension-detail-page .extension-overview-panel>p{
  font-size:15px!important;line-height:1.8!important;
  margin-top:18px!important;color:var(--kb-muted)!important;
}
body.extension-detail-page .extension-side-card-head,
body.extension-detail-page .extension-source-head,
body.extension-detail-page .extension-file-browser-head,
body.extension-detail-page .extension-file-viewer-head,
body.extension-detail-page .extension-spec-list>div{
  border-color:var(--kb-border)!important;
}
body.extension-detail-page .extension-side-card-head{padding:0 0 18px!important}
body.extension-detail-page .extension-side-icon{border-radius:5px!important}
body.extension-detail-page .extension-spec-list dt,
body.extension-detail-page .extension-source-head p{color:var(--kb-muted)!important}
body.extension-detail-page .extension-spec-list dd{color:var(--kb-ink)!important;font-size:12px!important}
body.extension-detail-page .extension-source-head{padding:25px 28px!important}
body.extension-detail-page :is(.extension-file-browser-head,.extension-file-viewer-head){
  background:#f1f4f7!important;
}
body.extension-detail-page .extension-file-browser,
body.extension-detail-page .extension-file-viewer{
  border-color:var(--kb-border)!important;background:#fff!important;border-radius:0!important;
}
body.extension-detail-page .extension-code-tab{
  background:#fff!important;border-color:var(--kb-border)!important;
}
body.extension-detail-page .extension-code-tab.is-active{
  background:#eaf1f7!important;color:var(--kb-navy)!important;
}
body.extension-detail-page .extension-related{
  max-width:var(--kb-content)!important;margin:10px auto 80px!important;
  padding:32px 0 0!important;border-top:1px solid var(--kb-border)!important;
}
body.extension-detail-page .extension-related-card{
  min-height:180px!important;padding:24px!important;
  border:1px solid var(--kb-border)!important;border-radius:8px!important;
  background:#fff!important;box-shadow:none!important;
  backdrop-filter:none!important;transform:none!important;
}
body.extension-detail-page .extension-related-card:hover{border-color:#9bacbb!important}
body.extension-detail-page .extension-related-card::before{display:none!important}
body.extension-detail-page .extension-related-head a{
  border-radius:9999px!important;background:#fff!important;
  border:1px solid var(--kb-border)!important;color:var(--kb-navy)!important;
}
/* The previous stylesheet forced the hidden hero to display:grid. Restore semantic loading states. */
body.extension-detail-page :is(
 .extension-detail-hero,.extension-local-nav,.extension-detail-loading,
 .extension-detail-error,.extension-workspace,.extension-source-panel,
 .extension-related,.extension-download-btn
)[hidden]{display:none!important}
body.extension-detail-page .extension-detail-error{
  width:min(calc(100% - 48px),var(--kb-content));margin:44px auto 88px;
  padding:42px!important;border:1px solid var(--kb-border);border-radius:8px;background:#fff;
}
body.extension-detail-page .extension-detail-error h1{font-size:28px!important}

@media(max-width:980px){
  body.extension-detail-page .extension-detail-hero{
    grid-template-columns:1fr!important;margin:0 20px!important;padding:32px 28px!important;
  }
  body.extension-detail-page .extension-detail-actions{
    width:auto!important;max-width:none!important;flex-direction:row!important;
    justify-content:flex-start!important;
  }
  body.extension-detail-page .extension-detail-actions .btn,
  body.extension-detail-page .extension-like-btn{width:auto!important;min-width:144px!important}
  body.extension-detail-page .extension-workspace{
    grid-template-columns:1fr!important;padding:28px 20px!important;gap:20px!important;
  }
  body.extension-detail-page .extension-sidebar{position:static!important;max-width:none!important}
  body.extension-detail-page .extension-related{padding:30px 20px 0!important;margin-bottom:60px!important}
}
@media(max-width:680px){
  body.home-page .section{padding-top:56px!important;padding-bottom:56px!important}
  body.home-page .home-hero-controls{min-height:60px!important;padding:0 14px!important}
  body.home-page .showcase-panel,body.home-page .showcase-engine .showcase-panel{padding:26px 22px!important}
  body.home-page .home-intro-band{margin-top:44px!important}
  body.home-page .home-pricing-cta{padding-left:22px!important;padding-right:22px!important}
  body.extension-detail-page .extension-breadcrumbs{padding:28px 18px 0!important}
  body.extension-detail-page .extension-detail-hero{
    margin:0 14px!important;padding:26px 22px!important;gap:24px!important;
  }
  body.extension-detail-page .extension-detail-identity{
    grid-template-columns:44px minmax(0,1fr)!important;gap:14px!important;
  }
  body.extension-detail-page .extension-detail-icon{width:44px!important;height:44px!important;min-width:44px!important}
  body.extension-detail-page .extension-detail-copy h1{
    font-size:clamp(29px,9.5vw,42px)!important;
  }
  body.extension-detail-page .extension-detail-actions{
    width:100%!important;flex-direction:column!important;align-items:stretch!important;
  }
  body.extension-detail-page .extension-detail-actions .btn,
  body.extension-detail-page .extension-like-btn{width:100%!important;min-width:0!important}
  body.extension-detail-page .extension-local-nav{padding:0 18px!important;gap:22px!important;overflow-x:auto}
  body.extension-detail-page .extension-workspace{padding:24px 14px!important}
  body.extension-detail-page .extension-overview-panel{padding:24px 22px!important}
  body.extension-detail-page .extension-related{padding:24px 14px 0!important}
  body.extension-detail-page .extension-related-grid{grid-template-columns:1fr!important}
}
/* Avoid forcing light panels under users' OS-level dark scheme. */
@media(prefers-color-scheme:dark){
  body.home-page,body.extension-detail-page{--kb-canvas:#0b1118;--kb-paper:#121d27;--kb-border:#2b3d4b;--kb-ink:#e9f1f7;--kb-muted:#a0b2c0;--kb-blue:#93bde0;background:#0b1118!important}
  body:is(.home-page,.extension-detail-page) .rail,
  body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail,
  body:is(.home-page,.extension-detail-page).has-scrolled .rail{background:#111b25!important;border-color:#2b3d4b!important}
  body:is(.home-page,.extension-detail-page) .rail .brand b{color:#e9f1f7!important}
  body:is(.home-page,.extension-detail-page) .rail .nav>a,
  body:is(.home-page,.extension-detail-page) .rail .nav-dropdown-btn{color:#cedce7!important}
  body:is(.home-page,.extension-detail-page) .rail .rail-actions .btn:not(.primary){background:transparent!important;color:#e9f1f7!important}
  body:is(.home-page,.extension-detail-page) .rail .rail-actions .btn.primary{background:#dce9f3!important;color:#10283a!important;border-color:#dce9f3!important}
  body.home-page .home-hero-controls{background:#111b25!important}
  body.home-page .home-hero-control,body.home-page .home-hero-prev,body.home-page .home-hero-next{background:#152330!important;color:#d9e8f3!important}
  body.home-page .home-pricing-cta{background:#10283a!important}
  body.home-page .resource-row:hover{background:#14212d!important}
  body.extension-detail-page .extension-detail-hero,
  body.extension-detail-page :is(.extension-overview-panel,.extension-side-card,.extension-source-panel,.extension-related-card,.extension-detail-error){
    background:#121d27!important;border-color:#2b3d4b!important;
  }
  body.extension-detail-page .extension-detail-icon{background:#193952!important;border-color:#31546e!important}
  body.extension-detail-page .extension-like-btn,
  body.extension-detail-page .extension-related-head a{background:#121d27!important;color:#d9e8f3!important;border-color:#2b3d4b!important}
  body.extension-detail-page .extension-code-tab,
  body.extension-detail-page .extension-file-browser,
  body.extension-detail-page .extension-file-viewer{background:#121d27!important;color:#d6e4ef!important}
  body.extension-detail-page .extension-code-tab.is-active{background:#1f3549!important;color:#e9f1f7!important}
  body.extension-detail-page :is(.extension-file-browser-head,.extension-file-viewer-head){background:#172634!important}
  body.extension-detail-page .extension-local-nav a.is-active,
  body.extension-detail-page .extension-local-nav a:hover{color:#e9f1f7!important}
  body.extension-detail-page .extension-detail-actions .btn{background:#dce9f3!important;border-color:#dce9f3!important;color:#10283a!important}
  body:is(.home-page,.extension-detail-page) .footer .footer-col-title{color:#edf4fa!important}
}


/* 2026-10-09 microheader overlap and action-controls correction.
   Release announcement JS mounts after the stylesheet and is fixed at 8px when
   scrolled. The previous .has-scrolled rule put the header at 10px and hid the
   navigation/actions underneath the banner. Scope offsets to desktop only. */
@media (min-width: 1101px) {
  body:is(.home-page,.extension-detail-page).has-scrolled.has-site-announcement-sticky .rail,
  body:is(.home-page,.extension-detail-page).has-site-announcement-sticky .rail.webglass-microheader {
    top: calc(8px + var(--kerbot-announcement-height, 44px) + 8px) !important;
  }
  body:is(.home-page,.extension-detail-page) .rail .rail-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) max-content;
    gap: 18px;
    align-items: center;
  }
  body:is(.home-page,.extension-detail-page) .rail .rail-actions {
    display: flex;
    flex-wrap: nowrap !important;
    align-items: center;
    gap: 7px !important;
    min-width: 0;
    white-space: nowrap;
  }
  body:is(.home-page,.extension-detail-page) .rail .nav {
    gap: 2px !important;
    min-width: 0;
    flex-wrap: nowrap !important;
  }
  body:is(.home-page,.extension-detail-page) .rail .nav > a,
  body:is(.home-page,.extension-detail-page) .rail .nav-dropdown-btn {
    padding: 8px 11px !important;
  }
  body:is(.home-page,.extension-detail-page) .rail .header-support-email {
    margin-right: 5px !important;
    padding-right: 13px !important;
    font-size: 11px !important;
    min-height: 36px !important;
    color: #566a7b !important;
    border-color: var(--kb-border) !important;
  }
  body:is(.home-page,.extension-detail-page) .rail .rail-actions > :is(
    .btn,.account-user-button,.account-logout-button
  ) {
    min-height: 38px !important;
    height: 38px !important;
    max-width: 200px;
    padding: 0 14px !important;
    border-radius: 9999px !important;
    box-sizing: border-box;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-shadow: none !important;
    transform: none !important;
  }
  body:is(.home-page,.extension-detail-page) .rail .rail-actions > :is(
    .account-user-button,.btn.primary
  ) {
    background: #10283a !important;
    color: #fff !important;
    border: 1px solid #10283a !important;
  }
  body:is(.home-page,.extension-detail-page) .rail .rail-actions > :is(
    .account-user-button,.btn.primary
  ):hover {
    background: #20435c !important;
    border-color: #20435c !important;
  }
  body:is(.home-page,.extension-detail-page) .rail .rail-actions > :is(
    .account-logout-button,.btn:not(.primary)
  ) {
    background: #fff !important;
    color: #203648 !important;
    border: 1px solid #d4dfe8 !important;
  }
  body:is(.home-page,.extension-detail-page) .rail .rail-actions > :is(
    .account-logout-button,.btn:not(.primary)
  ):hover {
    background: #eef3f7 !important;
    border-color: #b5c7d6 !important;
  }
  body:is(.home-page,.extension-detail-page) .rail .rail-actions > :is(
    .site-search-toggle,.account-notifications-button
  ) {
    display: inline-grid !important;
    place-items: center !important;
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    flex: 0 0 38px !important;
    padding: 0 !important;
    border: 1px solid #d4dfe8 !important;
    border-radius: 9999px !important;
    background: #f2f6f9 !important;
    color: #203648 !important;
    box-shadow: none !important;
  }
  body:is(.home-page,.extension-detail-page) .rail .rail-actions > :is(
    .site-search-toggle,.account-notifications-button
  ):hover {
    background: #e6eef5 !important;
    border-color: #b5c7d6 !important;
  }
  body:is(.home-page,.extension-detail-page) .rail .rail-actions > :is(
    .site-search-toggle,.account-notifications-button
  ):focus-visible {
    outline: 2px solid #327fc0 !important;
    outline-offset: 2px !important;
  }
}
/* Preserve content width at laptop viewports: email remains available in footer. */
@media (min-width:1101px) and (max-width:1360px) {
  body:is(.home-page,.extension-detail-page) .rail .header-support-email {
    display:none !important;
  }
}
/* The announcement and the compact header are distinct panels, not overlapping pills. */
@media (min-width:1101px) {
  body:is(.home-page,.extension-detail-page) .site-announcement.is-sticky:not(.is-utility) {
    width: 100% !important;
    max-width: none !important;
    left: 0 !important;
    transform: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  body:is(.home-page,.extension-detail-page) .site-announcement.is-sticky .site-announcement-close {
    border-radius: 50% !important;
  }
}
@media (prefers-color-scheme: dark) and (min-width:1101px) {
  body:is(.home-page,.extension-detail-page) .rail .rail-actions > :is(
    .account-user-button,.btn.primary
  ) {
    color: #10283a !important;
    background: #deebf5 !important;
    border-color: #deebf5 !important;
  }
  body:is(.home-page,.extension-detail-page) .rail .rail-actions > :is(
    .account-logout-button,.btn:not(.primary),.site-search-toggle,.account-notifications-button
  ) {
    color: #e7f0f7 !important;
    background: #192b3a !important;
    border-color: #3b5264 !important;
  }
  body:is(.home-page,.extension-detail-page) .rail .header-support-email {
    color: #bfd0df !important;
  }
}


/* Full-bleed corporate navigation at the page top.
   Keep only the scrolled microheader as a floating pill. The content remains
   aligned to the utility strip's 1240px editorial grid. */
@media (min-width: 1101px) {
  body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail,
  body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail.webglass-microheader {
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 82px !important;
    margin: 0 !important;
    padding: 14px max(24px, calc((100vw - 1240px)/2)) !important;
    grid-template-columns: auto minmax(0,1fr) !important;
    gap: clamp(18px,2.2vw,32px) !important;
    align-items: center !important;
    box-sizing: border-box !important;
    border: 0 !important;
    border-bottom: 1px solid var(--kb-border) !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail:hover,
  body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail.webglass-microheader:hover,
  body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail.glass-hovered {
    transform: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail .rail-panel {
    width: 100%;
    min-width: 0;
    margin: 0 !important;
  }
}
@media (min-width:1101px) and (max-width:1300px) {
  body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail {
    padding-left: 22px !important;
    padding-right: 22px !important;
    gap: 16px !important;
  }
}
@media (prefers-color-scheme:dark) and (min-width:1101px) {
  body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail,
  body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail.webglass-microheader {
    background: #111b25 !important;
    border-bottom-color: #2b3d4b !important;
  }
}


/* Edge-to-edge masthead content + language selector v4
   The non-scrolled header uses the available viewport width rather than
   constraining its content to the 1240px editorial column. */
@media (min-width:1101px) {
  body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail,
  body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail.webglass-microheader {
    left:0 !important;
    right:0 !important;
    top:0 !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
    padding:14px clamp(18px, 2vw, 36px) !important;
    box-sizing:border-box !important;
    transform:none !important;
    border-radius:0 !important;
    gap:clamp(16px,2vw,36px) !important;
    grid-template-columns:auto minmax(0,1fr) !important;
    align-items:center !important;
  }
  body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail:hover,
  body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail.webglass-microheader:hover {
    left:0 !important;
    width:100% !important;
    transform:none !important;
    border-radius:0 !important;
  }
  body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail .rail-panel {
    width:100% !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) max-content !important;
    align-items:center !important;
    gap:clamp(12px,2vw,28px) !important;
    margin:0 !important;
  }
  body:is(.home-page,.extension-detail-page):not(.has-scrolled) .rail .brand {
    margin:0 !important;
    transform:none !important;
    white-space:nowrap;
  }
}

/* The globe is a single circular icon action, positioned immediately
   before the search control even if auth/search buttons are rerendered. */
body:is(.home-page,.extension-detail-page) .rail {
  overflow:visible !important;
}
body:is(.home-page,.extension-detail-page) .kb-language-picker {
  display:inline-flex !important;
  flex:0 0 38px !important;
  width:38px !important;
  min-width:38px !important;
  height:38px !important;
  position:relative;
  margin:0 !important;
  padding:0 !important;
  z-index:1100;
}
body:is(.home-page,.extension-detail-page) .kb-language-trigger {
  display:inline-flex !important;
  width:38px !important;
  min-width:38px !important;
  max-width:38px !important;
  height:38px !important;
  min-height:38px !important;
  max-height:38px !important;
  padding:0 !important;
  align-items:center;
  justify-content:center;
  flex:0 0 38px !important;
  border:1px solid #d4dfe8 !important;
  border-radius:50% !important;
  background:#f2f6f9 !important;
  color:#203648 !important;
  box-shadow:none !important;
  cursor:pointer;
  transform:none !important;
  transition:background-color .16s ease,border-color .16s ease,color .16s ease;
}
body:is(.home-page,.extension-detail-page) .kb-language-trigger svg {
  display:block;
  width:19px;
  height:19px;
  stroke:currentColor;
  pointer-events:none;
}
body:is(.home-page,.extension-detail-page) .kb-language-trigger:hover,
body:is(.home-page,.extension-detail-page) .kb-language-picker.is-open .kb-language-trigger {
  background:#e4edf4 !important;
  border-color:#9fb6c8 !important;
  color:#10283a !important;
}
body:is(.home-page,.extension-detail-page) .kb-language-trigger:focus-visible {
  outline:2px solid #327fc0 !important;
  outline-offset:3px !important;
}

body:is(.home-page,.extension-detail-page) .kb-language-menu {
  position:absolute;
  top:calc(100% + 14px);
  right:0;
  width:336px;
  max-width:calc(100vw - 28px);
  box-sizing:border-box;
  padding:14px;
  border:1px solid #d8e2eb;
  border-radius:18px;
  background:#fff;
  color:#172c40;
  box-shadow:0 18px 45px rgba(14,37,56,.17),0 2px 8px rgba(14,37,56,.07);
  z-index:1200;
  text-align:left;
}
body:is(.home-page,.extension-detail-page) .kb-language-menu[hidden] {
  display:none !important;
}
body:is(.home-page,.extension-detail-page) .kb-language-menu-heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:8px 8px 14px;
  border-bottom:1px solid #e8eef3;
  margin-bottom:8px;
}
body:is(.home-page,.extension-detail-page) .kb-language-menu-heading span:first-child {
  font-size:13px;
  font-weight:740;
  letter-spacing:-.018em;
  color:#10283a;
}
body:is(.home-page,.extension-detail-page) .kb-language-menu-heading span:not(:first-child) {
  font-size:11px;
  color:#718394;
}
body:is(.home-page,.extension-detail-page) .kb-language-menu-list {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:4px;
}
body:is(.home-page,.extension-detail-page) .kb-language-option {
  display:flex;
  gap:7px;
  align-items:center;
  justify-content:space-between;
  min-width:0;
  min-height:42px;
  padding:9px 11px;
  text-align:left;
  background:transparent;
  color:#293e50;
  border:1px solid transparent;
  border-radius:10px;
  font-size:12.5px;
  font-weight:600;
  line-height:1.25;
  white-space:nowrap;
  cursor:pointer;
}
body:is(.home-page,.extension-detail-page) .kb-language-option .kb-language-code {
  flex:0 0 auto;
  font-size:10px;
  font-weight:700;
  color:#8292a0;
}
body:is(.home-page,.extension-detail-page) .kb-language-option .kb-language-name {
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}
body:is(.home-page,.extension-detail-page) .kb-language-option:hover,
body:is(.home-page,.extension-detail-page) .kb-language-option:focus-visible {
  color:#10283a;
  background:#eff4f8;
  border-color:#dce7f0;
}
body:is(.home-page,.extension-detail-page) .kb-language-option[aria-checked="true"] {
  color:#114e7d;
  background:#e8f1f8;
  border-color:#c8ddeb;
}
body:is(.home-page,.extension-detail-page) .kb-language-option[aria-checked="true"] .kb-language-code {
  color:#236997;
}
body:is(.home-page,.extension-detail-page) .kb-language-option:focus-visible {
  outline:2px solid #327fc0 !important;
  outline-offset:0 !important;
}

@media (max-width:1100px) {
  body:is(.home-page,.extension-detail-page) .kb-language-picker {
    flex:0 0 44px !important;
    width:44px !important;
    height:44px !important;
  }
  body:is(.home-page,.extension-detail-page) .kb-language-trigger {
    width:44px !important;
    min-width:44px !important;
    max-width:44px !important;
    height:44px !important;
    min-height:44px !important;
    max-height:44px !important;
  }
}
@media (max-width:760px) {
  body:is(.home-page,.extension-detail-page) .kb-language-menu {
    right:auto;
    left:0;
    top:calc(100% + 10px);
    width:min(336px,calc(100vw - 48px));
  }
}
@media(prefers-color-scheme:dark) {
  body:is(.home-page,.extension-detail-page) .kb-language-trigger {
    background:#192b3a !important;
    color:#dceaf5 !important;
    border-color:#3b5264 !important;
  }
  body:is(.home-page,.extension-detail-page) .kb-language-trigger:hover,
  body:is(.home-page,.extension-detail-page) .kb-language-picker.is-open .kb-language-trigger {
    background:#284257 !important;
    color:#fff !important;
  }
  body:is(.home-page,.extension-detail-page) .kb-language-menu {
    background:#132231;
    color:#e5eef7;
    border-color:#334c60;
    box-shadow:0 18px 45px rgba(0,0,0,.4);
  }
  body:is(.home-page,.extension-detail-page) .kb-language-menu-heading {
    border-bottom-color:#2f465a;
  }
  body:is(.home-page,.extension-detail-page) .kb-language-menu-heading span:first-child {
    color:#eef5fb;
  }
  body:is(.home-page,.extension-detail-page) .kb-language-menu-heading span:last-child,
  body:is(.home-page,.extension-detail-page) .kb-language-option .kb-language-code {
    color:#9eb4c6;
  }
  body:is(.home-page,.extension-detail-page) .kb-language-option {
    color:#dae7f2;
  }
  body:is(.home-page,.extension-detail-page) .kb-language-option:hover,
  body:is(.home-page,.extension-detail-page) .kb-language-option:focus-visible {
    color:#fff;
    background:#233c50;
    border-color:#46627a;
  }
  body:is(.home-page,.extension-detail-page) .kb-language-option[aria-checked="true"] {
    color:#e9f4fc;
    background:#254962;
    border-color:#46728f;
  }
}
