@import url("./style-base-v27.css");

/* Desktop documentation TOC: keep sticky navigation fully reachable. */
@media (min-width:1001px){
  .docs-toc{
    max-height:calc(100vh - 110px);
    overflow-y:auto;
  }
}

/* Feature landing links: keep the existing homepage card appearance. */
.feature-card h3 .seo-feature-link{color:inherit;text-decoration:none}
.feature-card h3 .seo-feature-link:focus-visible{outline:2px solid #55caff;outline-offset:4px;border-radius:3px}

/* Entire SEO feature tiles behave like the interactive preview tiles. */
.feature-card.feature-card-link{
  display:block;
  color:inherit;
  text-decoration:none;
  cursor:pointer!important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.feature-card.feature-card-link:hover{
  transform:translateY(-3px);
  border-color:#2e78a8;
  box-shadow:0 18px 42px rgba(0,0,0,.22);
}
.feature-card.feature-card-link:focus-visible{
  outline:2px solid #51c9ff;
  outline-offset:3px;
}
.feature-card.feature-card-link .feature-guide-hint{
  display:block;
  color:#55caff;
  font-size:.76rem;
  font-weight:800;
  margin-top:11px;
}
@media (prefers-reduced-motion:reduce){
  .feature-card.feature-card-link{transition:none}
  .feature-card.feature-card-link:hover{transform:none}
}

/* CSP-safe home feature cards: formerly injected by feature-updates.js. */

    .feature-card-static{position:relative!important;overflow:hidden;cursor:default;padding-bottom:28px}
    .feature-card-static .feature-static-badge,
    .feature-card-static .feature-preview-link{position:static!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important;display:inline-flex!important;width:max-content;max-width:100%;margin-top:14px;padding:6px 10px;border:1px solid rgba(85,202,255,.22);border-radius:999px;background:rgba(11,41,65,.62);color:#55caff;line-height:1.15;white-space:normal;font-size:.72rem;font-weight:900;letter-spacing:.01em}
    .feature-card-static .feature-static-badge:before,
    .feature-card-static .feature-preview-link:before{content:none!important;display:none!important}
    @media(max-width:600px){.feature-card-static{padding-bottom:18px}.feature-card-static .feature-static-badge,.feature-card-static .feature-preview-link{position:static!important;font-size:.66rem;margin-top:11px}}
  

/* CSP-safe 404 layout (no inline style attributes). */
.error-page-layout{min-height:70vh;display:grid;place-items:center}
.error-page-content{max-width:760px;text-align:center}

/* Localized, crawlable feature tutorials below existing documentation cards. */
.seo-guide-links{grid-column:1/-1;display:flex;align-items:center;flex-wrap:wrap;gap:9px 12px;margin-top:-8px;font-size:.82rem;line-height:1.5}
.seo-guide-links strong{color:#b9d5e5;font-weight:700}
.seo-guide-links a{color:#67cfff;text-decoration:underline;text-underline-offset:3px}
.seo-guide-links a:focus-visible{outline:2px solid #67cfff;outline-offset:3px;border-radius:3px}
@media(max-width:600px){.seo-guide-links{gap:6px 10px;margin-top:0;font-size:.78rem}}

/* SEO: place the existing Android/Android TV eyebrow inside the semantic H1 without changing its appearance. */
.hero h1 > .hero-h1-eyebrow{display:flex;width:max-content;max-width:100%;align-items:center;line-height:1.25;letter-spacing:.05em;font-size:.74rem;font-weight:900;margin-bottom:24px;white-space:nowrap}
.hero h1 > .hero-h1-lines{display:block}
@media(max-width:600px){.hero h1 > .hero-h1-eyebrow{margin-bottom:17px}}
