/* css/site.css — Akadata public site. Tokens mirror the live Node site exactly.
   Light is default; .dark overrides. The external theme script (no cookies)
   flips the class and remembers the choice in localStorage. */

:root {
  --background: 0 0% 100%;
  --foreground: 215 25% 15%;
  --card: 0 0% 100%;
  --card-foreground: 215 25% 15%;
  --popover: 0 0% 100%;
  --popover-foreground: 215 25% 15%;
  --primary: 217 91% 39%;
  --primary-foreground: 0 0% 100%;
  --secondary: 276 28% 36%;
  --secondary-foreground: 0 0% 100%;
  --muted: 210 20% 96%;
  --muted-foreground: 215 16% 47%;
  --accent: 172 100% 32%;
  --accent-foreground: 0 0% 100%;
  --destructive: 0 84% 60%;
  --destructive-foreground: 0 0% 100%;
  --border: 214 32% 91%;
  --input: 214 32% 91%;
  --ring: 217 91% 39%;
  --radius: .75rem;
  --gradient-hero: linear-gradient(135deg, hsl(217 91% 39%), hsl(276 28% 36%));
  --gradient-card: linear-gradient(180deg, hsl(0 0% 100%), hsl(210 20% 98%));
  --shadow-card: 0 4px 24px -2px hsl(217 91% 39% / .08);
  --shadow-hover: 0 8px 32px -4px hsl(217 91% 39% / .15);
  --font: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, "Noto Sans", sans-serif;
}

.dark {
  --background: 217 32% 8%;
  --foreground: 210 40% 98%;
  --card: 217 32% 10%;
  --card-foreground: 210 40% 98%;
  --popover: 217 32% 10%;
  --popover-foreground: 210 40% 98%;
  --primary: 217 91% 55%;
  --primary-foreground: 0 0% 100%;
  --secondary: 276 28% 45%;
  --secondary-foreground: 0 0% 100%;
  --muted: 217 32% 18%;
  --muted-foreground: 215 20% 65%;
  --accent: 172 100% 38%;
  --accent-foreground: 0 0% 100%;
  --destructive: 0 63% 31%;
  --destructive-foreground: 210 40% 98%;
  --border: 217 32% 18%;
  --input: 217 32% 18%;
  --ring: 217 91% 55%;
  --gradient-hero: linear-gradient(135deg, hsl(217 91% 25%), hsl(276 28% 20%));
  --gradient-card: linear-gradient(180deg, hsl(217 32% 10%), hsl(217 32% 12%));
  --shadow-card: 0 4px 24px -2px hsl(0 0% 0% / .3);
  --shadow-hover: 0 8px 32px -4px hsl(0 0% 0% / .4);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--font);
  background: hsl(var(--background));
  color: hsl(var(--foreground));
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  transition: background .3s ease, color .3s ease;
}

a { color: hsl(var(--primary)); text-decoration: none; }
a:hover { text-decoration: underline; }

img { max-width: 100%; height: auto; }

.container { width: 100%; max-width: 1280px; margin: 0 auto; padding: 0 1.25rem; }
@media (min-width: 640px) { .container { padding: 0 1.5rem; } }
@media (min-width: 1024px) { .container { padding: 0 2rem; } }

.skip-link {
  position: absolute; left: -999px; top: 0;
  background: hsl(var(--primary)); color: hsl(var(--primary-foreground));
  padding: .5rem 1rem; z-index: 100; border-radius: 0 0 .5rem 0;
}
.skip-link:focus { left: 0; text-decoration: none; }

/* Header — matches live Node site: sticky top bar, dropdowns, mobile menu */
.site-header {
  position: sticky; top: 0; z-index: 50;
  width: 100%;
  border-bottom: 1px solid hsl(var(--border));
  background: hsl(var(--background) / .95);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.header-search-panel {
  position: absolute;
  top: calc(100% + .5rem);
  right: max(1rem, calc((100vw - 1280px) / 2));
  z-index: 60;
  width: min(24rem, calc(100vw - 2rem));
  padding: .75rem;
  border: 1px solid hsl(var(--border));
  border-radius: .5rem;
  background: hsl(var(--popover));
  box-shadow: 0 10px 30px rgb(0 0 0 / .14);
}
.header-search-panel form { display: flex; gap: .5rem; }
.header-search-panel input { min-width: 0; flex: 1; height: 2.5rem; padding: 0 .75rem; border: 1px solid hsl(var(--input)); border-radius: .375rem; background: hsl(var(--background)); color: hsl(var(--foreground)); }
.header-search-panel button { height: 2.5rem; padding: 0 1rem; border-radius: .375rem; background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); font-size: .875rem; font-weight: 500; }
.site-header__inner {
  display: flex; align-items: center; gap: 1rem;
  height: 4rem; /* h-16 */
}
.brand {
  display: inline-flex; align-items: center; gap: .5rem; /* gap-2 */
  font-size: 1.5rem; line-height: 2rem; font-weight: 700; /* text-2xl font-bold */
  color: hsl(var(--primary)); text-decoration: none;
}
.brand:hover { text-decoration: none; }
.brand__name { font-size: 1.5rem; line-height: 2rem; color: hsl(var(--primary)); font-weight: 700; }
.brand__sub { font-size: .875rem; color: hsl(var(--muted-foreground)); }
.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;
}

/* Primary nav */
.primary-nav { display: none; align-items: center; gap: 1.25rem; padding-left: 1.5rem; } /* gap-5 pl-6 */
.nav-link {
  display: inline-flex; align-items: center; gap: .375rem; /* gap-1.5 */
  height: 2.25rem; /* match icon buttons / CTA so every item shares one row */
  font-size: .875rem; line-height: 1; font-weight: 500; color: hsl(var(--foreground));
  background: none; border: 0; cursor: pointer; padding: 0; margin: 0;
  font-family: inherit; transition: color .15s ease;
}
.nav-link span { line-height: 1; }
.nav-link .lucide { flex: 0 0 auto; width: 1rem; height: 1rem; }
.nav-link:hover, .nav-link:focus-visible, .nav-link.is-pressed { color: hsl(var(--primary)); text-decoration: none; }
.nav-link__icon { width: 1rem; height: 1rem; }
.nav-dropdown { position: relative; display: inline-flex; align-items: center; height: 2.25rem; }
.nav-dropdown__trigger .lucide-chevron-down { transition: transform .2s ease; }
.nav-dropdown__trigger[aria-expanded="true"] .lucide-chevron-down { transform: rotate(180deg); }
.nav-dropdown__menu {
  /* Open below the full header row, not level with the trigger, so the
     dropdown never bleeds into the header. The trigger is centred in the
     4rem header; offset down to clear the header bottom border. */
  position: absolute; top: calc(100% + 1rem); left: 0;
  width: 14rem; list-style: none; margin: 0; padding: .25rem;
  background: hsl(var(--card)); border: 1px solid hsl(var(--border));
  border-radius: var(--radius); box-shadow: 0 10px 30px -10px hsl(217 91% 39% / .25);
  display: none; z-index: 60;
}
.nav-dropdown__menu[data-open="true"] { display: block; }
#nav-about-menu { width: 12rem; }
#nav-projects-menu { width: 15rem; }
.nav-dropdown__menu li a {
  display: flex; align-items: center; gap: .5rem;
  min-height: 2rem; padding: .375rem .5rem; border-radius: calc(var(--radius) - 4px);
  color: hsl(var(--foreground)); font-size: .875rem; font-weight: 400; line-height: 1.25rem;
}
.nav-dropdown__menu .lucide { width: 1rem; height: 1rem; flex: 0 0 1rem; }
.nav-dropdown__menu li a:hover, .nav-dropdown__menu li a:focus-visible {
  background: hsl(var(--primary) / .08); color: hsl(var(--primary)); text-decoration: none;
}

/* Header actions */
.header-spacer { flex: 1 1 auto; } /* flex-1 */
.header-actions-1, .header-actions-2, .header-actions-m {
  display: flex; align-items: center; gap: .5rem;
}
.icon-btn {
  display: inline-flex; align-items: center; justify-content: center;
  height: 2.25rem; width: 2.25rem; border-radius: .375rem; /* h-9 rounded-md */
  border: 1px solid hsl(var(--input)); background: hsl(var(--background));
  color: hsl(var(--foreground)); cursor: pointer; padding: 0;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.icon-btn:hover, .icon-btn:focus-visible {
  background: hsl(var(--accent)); color: hsl(var(--accent-foreground)); border-color: hsl(var(--accent)); text-decoration: none;
}
.header-search { /* reuses .icon-btn */ }

/* Get in Touch — matches live: bg-primary text-primary-foreground h-9 rounded-md px-3 */
.header-cta {
  display: inline-flex; align-items: center; gap: .25rem;
  height: 2.25rem; padding: 0 .75rem; /* h-9 px-3 */
  border-radius: .375rem; font-size: .875rem; font-weight: 500;
  background: hsl(var(--primary)); color: hsl(var(--primary-foreground));
  border: 0; cursor: pointer; text-decoration: none; white-space: nowrap;
  transition: background .15s ease;
}
.header-cta:hover, .header-cta:focus-visible, .header-cta.is-pressed {
  background: hsl(var(--primary) / .9); color: hsl(var(--primary-foreground)); text-decoration: none;
}
.header-cta .lucide { width: 1rem; height: 1rem; }

/* Mobile menu */
.menu-toggle { display: inline-flex; }
.mobile-menu {
  border-top: 1px solid hsl(var(--border));
  background: hsl(var(--background));
  padding: 0;
}
.mobile-menu[hidden] { display: none; }
.mobile-menu nav {
  display: flex; flex-direction: column; gap: 1rem;
  width: 100%; max-width: 1280px; margin: 0 auto; padding: 1rem 1.25rem;
}
.mobile-menu a {
  display: flex; align-items: center; gap: .5rem; padding: 0;
  color: hsl(var(--foreground)); font-size: .875rem; line-height: 1.25rem; font-weight: 500;
}
.mobile-menu a:hover, .mobile-menu a:focus-visible, .mobile-menu a.is-pressed { background: hsl(var(--muted) / .6); text-decoration: none; }
.mobile-menu a .lucide { width: 1rem; height: 1rem; flex: 0 0 1rem; }
.mobile-menu__note { margin: 0; color: hsl(var(--muted-foreground)); font-size: .875rem; line-height: 1.25rem; }

/* Show desktop nav and action groups at md+, hide mobile group; reverse on small */
.header-actions-1, .header-actions-2 { display: none; }
.header-actions-m { display: flex; margin-left: auto; }
.play-control { display: none; }
body.speech-on .play-control { display: inline-flex; }
.speech-section-host { position: relative; }
.speech-section-anchor {
  position: absolute; top: 1rem; right: 1rem; z-index: 10; pointer-events: none;
}
.speech-section-button {
  display: inline-flex; align-items: center; justify-content: center;
  width: 2.5rem; height: 2.5rem; padding: 0; border-radius: 9999px;
  border: 1px solid hsl(var(--primary)); background: hsl(var(--background) / .9);
  color: hsl(var(--primary)); box-shadow: 0 2px 8px hsl(var(--foreground) / .12);
  cursor: pointer; pointer-events: auto; transition: background-color .15s ease, color .15s ease;
}
.speech-section-button:hover, .speech-section-button:focus-visible {
  color: white; background: rgb(16 185 129); outline: 2px solid hsl(var(--primary)); outline-offset: 2px;
}
.speech-section-button svg { width: 1.25rem; height: 1.25rem; fill: currentColor; }
.project-card { box-shadow: var(--shadow-card); }
.project-card:hover { box-shadow: var(--shadow-hover); }
.project-status {
  position: absolute; top: 1rem; right: 1rem; display: inline-flex; align-items: center; gap: .25rem;
  padding: .25rem .75rem; border-radius: 9999px; font-size: .75rem; line-height: 1rem; font-weight: 600;
}
.project-status--live { background: rgb(16 185 129 / .1); color: rgb(4 120 87); }
.project-status--creation { background: rgb(245 158 11 / .1); color: rgb(180 83 9); }
.project-status--hold { background: hsl(var(--muted)); color: hsl(var(--muted-foreground)); }
.dark .project-status--live { color: rgb(110 231 183); }
.dark .project-status--creation { color: rgb(252 211 77); }
.speech-toast {
  position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 100;
  display: flex; align-items: center; gap: .75rem; max-width: min(24rem, calc(100vw - 2rem));
  padding: .875rem 1rem; border: 1px solid hsl(var(--border)); border-radius: .625rem;
  background: hsl(var(--card)); color: hsl(var(--card-foreground));
  box-shadow: 0 10px 30px hsl(var(--foreground) / .18);
  font-size: .875rem; line-height: 1.35;
  animation: speech-toast-in .18s ease-out;
}
.speech-toast[hidden] { display: none; }
.speech-toast__spinner {
  width: 1rem; height: 1rem; flex: 0 0 1rem; border-radius: 9999px;
  border: 2px solid hsl(var(--primary) / .25); border-top-color: hsl(var(--primary));
  animation: speech-toast-spin .8s linear infinite;
}
.aip56-demo-toast {
  position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 100;
  display: flex; flex-direction: column; gap: .5rem;
  width: min(26rem, calc(100vw - 2rem));
  padding: .875rem 1rem; border: 1px solid hsl(var(--border)); border-radius: .625rem;
  background: hsl(var(--card)); color: hsl(var(--card-foreground));
  box-shadow: 0 10px 30px hsl(var(--foreground) / .18);
  font-size: .875rem; line-height: 1.35; overflow: hidden;
  animation: speech-toast-in .18s ease-out;
}
.aip56-demo-toast[hidden] { display: none; }
.aip56-demo-toast--closing { animation: speech-toast-out .2s ease-in forwards; }
.aip56-demo-toast__head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.aip56-demo-toast__title { font-weight: 700; }
.aip56-demo-toast__close {
  appearance: none; border: 0; background: transparent; cursor: pointer;
  color: hsl(var(--muted-foreground)); font-size: 1.15rem; line-height: 1;
  padding: 0 .15rem; border-radius: .35rem;
}
.aip56-demo-toast__close:hover, .aip56-demo-toast__close:focus-visible { color: hsl(var(--foreground)); }
.aip56-demo-toast__item { display: grid; gap: .2rem; }
.aip56-demo-toast__source { font-size: .72rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: hsl(var(--primary)); }
.aip56-demo-toast__phrase {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .8rem;
  background: hsl(var(--muted)); border-radius: .35rem; padding: .35rem .5rem;
  overflow-wrap: anywhere;
}
.aip56-demo-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
@media (prefers-reduced-motion: reduce) { .aip56-demo-toast { animation: none; } }
.aie-form-toast {
  position: fixed; right: 1rem; bottom: 1rem; z-index: 10000;
  max-width: 24rem; padding: 1rem 1.25rem; border-radius: .75rem;
  box-shadow: 0 12px 30px rgb(0 0 0 / .2);
  color: #fff; font: 500 .875rem/1.4 system-ui, sans-serif;
}
.aie-form-toast--status { background: #172554; }
.aie-form-toast--error { background: #7f1d1d; }
.akadata-hero-gradient { background: var(--gradient-hero); }
.akadata-accordion-region {
  --radix-accordion-content-height: var(--radix-collapsible-content-height);
  --radix-accordion-content-width: var(--radix-collapsible-content-width);
}
.akadata-outline-none { outline: none; }
.akadata-no-animation { animation-duration: 0s; }
@keyframes speech-toast-in {
  from { opacity: 0; transform: translateY(.5rem); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes speech-toast-out {
  from { opacity: 1; transform: translateY(0); }
  to { opacity: 0; transform: translateY(.5rem); }
}
@keyframes speech-toast-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .speech-toast, .speech-toast__spinner { animation: none; }
  .aip56-demo-toast, .aip56-demo-toast--closing { animation: none; }
}
/* Desktop header (full nav + inline actions) only once there is genuinely
   room for brand + nav + search + CTA + toggles. Below this, use the compact
   hamburger header so the header never overflows on tablets/large phones. */
@media (min-width: 1024px) {
  .primary-nav { display: flex; }
  .header-actions-1, .header-actions-2 { display: flex; }
  .header-actions-m { display: none; }
}

/* Buttons — match live: base + primary (blue) / secondary (pale-green hover) */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  white-space: nowrap; font-size: .875rem; font-weight: 500; line-height: 1;
  border-radius: .375rem; padding: 0 2rem; height: 2.75rem; /* h-11 rounded-md px-8 */
  border: 1px solid transparent; cursor: pointer; text-decoration: none;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.btn:hover, .btn:focus-visible { text-decoration: none; }
.btn .lucide { width: 1rem; height: 1rem; flex-shrink: 0; pointer-events: none; }
.btn--primary { background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); }
.btn--primary:hover, .btn--primary:focus-visible { background: hsl(var(--primary) / .9); }
.btn--secondary {
  background: hsl(var(--background)); color: hsl(var(--foreground));
  border-color: hsl(var(--input));
}
.btn--secondary:hover, .btn--secondary:focus-visible {
  background: hsl(var(--accent)); color: hsl(var(--accent-foreground)); border-color: hsl(var(--accent));
}
.btn--ghost {
  background: transparent; color: hsl(var(--primary));
  border-color: hsl(var(--border)); padding: 0 1rem; height: 2.25rem; font-size: .85rem;
}
.btn--ghost:hover, .btn--ghost:focus-visible {
  background: hsl(var(--accent)); color: hsl(var(--accent-foreground)); border-color: hsl(var(--accent));
}
.button-group { display: flex; gap: .75rem; margin-top: 1.6rem; flex-wrap: wrap; align-items: center; }

/* Hero */
.hero { padding: 3.5rem 0 2.5rem; }
.hero__inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 2.5rem; align-items: center; }
.eyebrow { text-transform: uppercase; letter-spacing: .08em; color: hsl(var(--primary)); font-size: .8rem; font-weight: 700; margin: 0 0 .6rem; }
.hero h1 { font-size: clamp(2rem, 4.5vw, 3.2rem); line-height: 1.1; margin: 0 0 1.1rem; letter-spacing: -.02em; }
.lede { color: hsl(var(--muted-foreground)); font-size: 1.12rem; }
.cta-row { display: flex; gap: .75rem; margin-top: 1.6rem; flex-wrap: wrap; }

/* Sections */
section { padding: 2.75rem 0; }
h2 { font-size: clamp(1.5rem, 3vw, 2rem); margin-top: 0; }
h3 { font-size: 1.15rem; }

/* Cards */
.card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1.25rem; }
.card {
  background: hsl(var(--card)); border: 1px solid hsl(var(--border));
  border-radius: var(--radius); padding: 1.1rem; box-shadow: var(--shadow-card);
  transition: var(--transition, transform .25s ease, box-shadow .25s ease);
}
.card:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); }
.card img { border-radius: 10px; margin-bottom: .8rem; aspect-ratio: 16/10; object-fit: cover; }
.card h3 { margin: 0 0 .5rem; font-size: 1.1rem; }
.card h3 a { color: hsl(var(--foreground)); }
.card p { color: hsl(var(--muted-foreground)); margin: 0; font-size: .95rem; }

/* Values / feature lists */
.value-list, .feature-list { display: grid; gap: .9rem; padding-left: 1.2rem; }
.feature-list li { margin-bottom: .4rem; }

/* Service index */
.service-index { display: grid; gap: .55rem; padding-left: 1.2rem; }
.service-index a { font-weight: 600; }

/* Pages */
.page { padding: 3rem 0; }
.page h1 { font-size: clamp(1.8rem, 3.5vw, 2.6rem); letter-spacing: -.02em; }
.service-detail__art { border-radius: var(--radius); margin-bottom: 1.5rem; box-shadow: var(--shadow-card); }

/* Grid two-col content */
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
@media (max-width: 820px) { .two-col { grid-template-columns: 1fr; } }

/* Forms */
.contact-form, .search-form { display: grid; gap: .6rem; max-width: 540px; margin-top: 1rem; }
.contact-form label { font-weight: 600; }
.contact-form input, .contact-form textarea, .search-form input {
  padding: .65rem .85rem; border-radius: 10px; border: 1px solid hsl(var(--input));
  background: hsl(var(--card)); color: hsl(var(--foreground)); font: inherit;
}
.note { color: hsl(var(--muted-foreground)); font-size: .9rem; }

/* Footer */
.site-footer { border-top: 1px solid hsl(var(--border)); background: hsl(var(--muted) / .3); padding: 3rem 0 2rem; margin-top: 2rem; }
.site-footer__grid { display: grid; grid-template-columns: 1fr; gap: 2rem; }
.site-footer__brand .text-2xl { font-size: 1.5rem; line-height: 1; }
.site-footer__brand .text-primary { color: hsl(var(--primary)); }
.site-footer__brand .text-muted-foreground { color: hsl(var(--muted-foreground)); }
.social-btn {
  width: 2.25rem; height: 2.25rem; border-radius: 999px; background: hsl(var(--primary) / .1);
  display: inline-flex; align-items: center; justify-content: center;
  color: hsl(var(--primary)); transition: background .15s ease, color .15s ease;
}
.social-btn:hover, .social-btn:focus-visible { background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); text-decoration: none; }
.site-footer h3 { font-size: 1rem; }
.site-footer ul { list-style: none; margin: 0; padding: 0; }
.footer-activity { width: 100%; max-width: 312px; margin-bottom: 1rem; font-size: .75rem; }
.footer-activity__title {
  font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: #515e70; margin: 0 0 .5rem;
}
.dark .footer-activity__title { color: hsl(215, 20%, 78%); }
.footer-activity__row { margin-bottom: .75rem; }
.footer-activity__row:last-child { margin-bottom: 0; }
.footer-activity__row--muted { } /* text colour is set per-child; opacity would fail contrast */
.footer-activity__row--muted .footer-activity__line { color: hsl(215, 16%, 46%); }
.dark .footer-activity__row--muted .footer-activity__line { color: hsl(215, 20%, 76%); }
.footer-activity__row--muted .footer-activity__bar { opacity: .6; }
.footer-activity__line { margin: 0 0 .25rem; color: #515e70; line-height: 1.35; }
.dark .footer-activity__line { color: hsl(215, 20%, 78%); }
.footer-activity__downloads { display: flex; justify-content: space-between; gap: .75rem; }
.footer-activity__bar {
  display: block; height: .375rem; width: 100%; margin-bottom: .35rem;
  overflow: hidden; border-radius: 999px; background: hsl(var(--muted));
  white-space: nowrap; font-size: 0;
}
.footer-activity__seg { display: inline-block; height: 100%; vertical-align: top; }
.footer-activity__seg--ipv6 { background: hsl(var(--primary)); }
.footer-activity__seg--ipv4 { background: hsl(var(--secondary)); }
/* Predefined bar widths (CSP forbids inline styles). Nearest-5% buckets. */
.footer-activity__seg--w0 { width: 0; }
.footer-activity__seg--w5 { width: 5%; }
.footer-activity__seg--w10 { width: 10%; }
.footer-activity__seg--w15 { width: 15%; }
.footer-activity__seg--w20 { width: 20%; }
.footer-activity__seg--w25 { width: 25%; }
.footer-activity__seg--w30 { width: 30%; }
.footer-activity__seg--w35 { width: 35%; }
.footer-activity__seg--w40 { width: 40%; }
.footer-activity__seg--w45 { width: 45%; }
.footer-activity__seg--w50 { width: 50%; }
.footer-activity__seg--w55 { width: 55%; }
.footer-activity__seg--w60 { width: 60%; }
.footer-activity__seg--w65 { width: 65%; }
.footer-activity__seg--w70 { width: 70%; }
.footer-activity__seg--w75 { width: 75%; }
.footer-activity__seg--w80 { width: 80%; }
.footer-activity__seg--w85 { width: 85%; }
.footer-activity__seg--w90 { width: 90%; }
.footer-activity__seg--w95 { width: 95%; }
.footer-activity__seg--w100 { width: 100%; }
.site-footer__bottom {
  border-top: 1px solid hsl(var(--border)); margin-top: 2rem; padding-top: 1.5rem;
  display: flex; flex-direction: column; gap: 1rem; align-items: center; color: hsl(var(--muted-foreground));
}
.site-footer__bottom a { color: hsl(var(--muted-foreground)); }
.site-footer__bottom a:hover, .site-footer__bottom a:focus-visible { color: hsl(var(--primary)); text-decoration: none; }
@media (min-width: 768px) {
  .site-footer__grid { grid-template-columns: 2fr 1fr 1fr; }
  .site-footer__bottom { flex-direction: row; justify-content: space-between; align-items: center; }
}

/* header spacer pushes action buttons to the right (live uses flex-1 spacer) */
.header-spacer { flex: 1 1 auto; }

/* dropdown trigger icon sizing */
.nav-dropdown__trigger .lucide { width: 1rem; height: 1rem; }
.nav-dropdown__trigger .lucide-chevron-down { margin-left: .15rem; }

/* Speak button */
.speak-btn {
  position: fixed; right: 1rem; bottom: 1rem; z-index: 20;
  border-radius: 999px; border: 1px solid hsl(var(--border));
  background: hsl(var(--primary)); color: hsl(var(--primary-foreground));
  padding: .6rem 1rem; font-weight: 600; cursor: pointer; box-shadow: var(--shadow-card);
}
.speak-btn:hover { opacity: .92; }

/* 404 */
.page-404 img { margin: 1rem 0; border-radius: var(--radius); }

/* Template pre */
.template { background: hsl(var(--card)); border: 1px solid hsl(var(--border)); border-radius: 10px; padding: 1rem; overflow: auto; }

/* AIP-56 section: compact local navigation using the existing card palette. */
.aip56-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; align-items: start; min-width: 0; }
.aip56-content { min-width: 0; }
/* Grid/flex children default to min-width:auto, which lets a wide code block
   push the whole page wider than the viewport. Allow the content column's grid
   and its immediate section wrappers to shrink so the code viewer scrolls
   itself instead of stretching the layout. */
.aip56-content > .grid { min-width: 0; }
.aip56-content > .grid > * { min-width: 0; }
.aip56-sidebar {
  border: 1px solid hsl(var(--border)); border-radius: var(--radius);
  background: hsl(var(--card)); padding: .75rem;
}
.aip56-sidebar__title { margin: 0; padding: .35rem .6rem .55rem; font-weight: 700; }
.aip56-sidebar ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .15rem; }
.aip56-sidebar a {
  display: block; padding: .45rem .6rem; border-radius: calc(var(--radius) - 4px);
  color: hsl(var(--muted-foreground)); font-size: .875rem; line-height: 1.35;
}
.aip56-sidebar a:hover, .aip56-sidebar a:focus, .aip56-sidebar a:active, .aip56-sidebar a.is-pressed,
.aip56-sidebar a[aria-current="page"] {
  background: hsl(var(--primary) / .08); color: hsl(var(--primary)); text-decoration: none;
}
.aip56-implementations { margin-top: .65rem; border-top: 1px solid hsl(var(--border)); padding-top: .65rem; }
.aip56-implementations summary {
  cursor: pointer; padding: .45rem .6rem; border-radius: calc(var(--radius) - 4px);
  color: hsl(var(--foreground)); font-size: .875rem; font-weight: 600;
}
.aip56-implementations summary:hover, .aip56-implementations summary:focus, .aip56-implementations summary:active, .aip56-implementations summary.is-pressed {
  background: hsl(var(--primary) / .08); color: hsl(var(--primary));
}
.aip56-implementations ul { margin-top: .25rem; padding-left: .35rem; }
.aip56-implementations a { font-size: .8125rem; padding-left: .75rem; }
.aip56-code {
  margin: 0; background: hsl(var(--muted) / .5); color: hsl(var(--foreground));
  /* Never let a wide code block push the page wider than the viewport;
     scroll horizontally within the block instead. */
  max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch;
}
.aip56-code code, .aip56-phrase, .aip56-fingerprint {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}
.aip56-code code { display: block; min-width: max-content; font-size: .82rem; line-height: 1.6; }
/* Validation phrases are plain space-separated words: wrap them on small
   screens rather than forcing a horizontal scroll. */
.aip56-phrase-block { overflow-x: visible; }
.aip56-phrase-block code { min-width: 0; white-space: pre-wrap; overflow-wrap: anywhere; word-break: break-word; }

/* Published source block: line numbers, toolbar, page-flow scroll */
.aip56-source-block {
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  background: hsl(var(--card));
  overflow: hidden;
  min-width: 0;
  max-width: 100%;
}
.aip56-source-toolbar {
  display: flex; flex-wrap: wrap; align-items: center; gap: .5rem;
  padding: .6rem .75rem;
  border-bottom: 1px solid hsl(var(--border));
  background: hsl(var(--muted) / .4);
}
.aip56-source-btn {
  display: inline-flex; align-items: center; gap: .35rem;
  height: 2rem; padding: 0 .75rem;
  border: 1px solid hsl(var(--input)); border-radius: .375rem;
  background: hsl(var(--background)); color: hsl(var(--foreground));
  font-size: .8125rem; font-weight: 500; cursor: pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.aip56-source-btn:hover, .aip56-source-btn:focus-visible, .aip56-source-btn:active, .aip56-source-btn.is-pressed {
  background: hsl(var(--accent)); color: hsl(var(--accent-foreground));
  border-color: hsl(var(--accent)); outline: none;
}
.aip56-source-count {
  margin-left: auto; font-size: .75rem; color: hsl(var(--muted-foreground));
}
.aip56-source {
  width: 100%; max-width: 100%; min-width: 0; margin: 0; border: 0; border-radius: 0;
  background: hsl(var(--muted) / .35);
  overflow-x: auto; overflow-y: hidden;
}
.aip56-source code { display: block; min-width: max-content; }
.aip56-ln-row { display: flex; width: max-content; min-width: 100%; }
.aip56-ln {
  flex: 0 0 auto; min-width: 3rem; padding: 0 .75rem 0 .25rem;
  text-align: right; color: hsl(var(--muted-foreground));
  border-right: 1px solid hsl(var(--border));
  user-select: none; -webkit-user-select: none;
}
.aip56-lc { padding: 0 .75rem; white-space: pre; }
/* Collapsed preview: hide lines beyond the preview window. */
.aip56-source[data-collapsed="true"] .aip56-ln-extra { display: none; }
.aip56-source-raw { display: none; }

/* Local syntax highlighting — clean light theme, AKADATA blue accents. */
.code-token--keyword  { color: hsl(217 91% 39%); font-weight: 600; }
.code-token--string   { color: hsl(142 52% 30%); }
.code-token--comment  { color: hsl(215 16% 47%); font-style: italic; }
.code-token--number   { color: hsl(28 80% 40%); }
.code-token--function { color: hsl(262 60% 48%); }
.code-token--type     { color: hsl(190 70% 32%); }
.code-token--constant { color: hsl(0 62% 45%); }
.code-token--variable { color: hsl(240 30% 40%); }
.dark .code-token--keyword  { color: hsl(213 94% 78%); }
.dark .code-token--string   { color: hsl(142 60% 66%); }
.dark .code-token--comment  { color: hsl(215 18% 62%); }
.dark .code-token--number   { color: hsl(28 90% 68%); }
.dark .code-token--function { color: hsl(262 80% 78%); }
.dark .code-token--type     { color: hsl(190 75% 62%); }
.dark .code-token--constant { color: hsl(0 80% 72%); }
.dark .code-token--variable { color: hsl(240 40% 74%); }

/* Brace folding controls in the line-number gutter.
   Every row gets a fixed-width fold slot (empty when a row has no toggle) so the
   code start stays aligned across foldable and non-foldable rows. */
.aip56-fold-slot {
  flex: 0 0 auto; width: 1.1rem; text-align: center;
  color: hsl(var(--muted-foreground)); user-select: none; -webkit-user-select: none;
}
.aip56-fold-toggle {
  width: 100%; height: 100%; padding: 0; margin: 0;
  border: 0; background: transparent; cursor: pointer;
  color: inherit; font-size: .7rem; line-height: inherit;
}
.aip56-fold-toggle:hover, .aip56-fold-toggle:focus-visible {
  color: hsl(var(--primary)); outline: none;
}
.aip56-ln-row.aip56-fold-hidden { display: none; }
.aip56-source[data-collapsed="true"] .aip56-ln-extra.aip56-fold-hidden { display: none; }
.aip56-fold-marker {
  margin-left: .5rem; padding: 0 .4rem; border-radius: .25rem;
  background: hsl(var(--muted)); color: hsl(var(--muted-foreground));
  font-size: .72rem; user-select: none; -webkit-user-select: none;
}
.aip56-reference-details { display: grid; gap: 1.25rem; margin: 0; }
.aip56-reference-details > div { display: grid; gap: .45rem; min-width: 0; }
.aip56-reference-details dt { font-weight: 600; }
.aip56-reference-details dd { margin: 0; min-width: 0; color: hsl(var(--muted-foreground)); }
.aip56-phrase, .aip56-fingerprint { overflow-wrap: anywhere; }
/* Inline code inside prose (e.g. 64-char SHA-256 digests, PGP fingerprints)
   must wrap so it never forces horizontal page overflow on small screens. */
.aip56-content :not(pre) > code { overflow-wrap: anywhere; word-break: break-word; }
.aip56-lang-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 1.5rem;
  height: 1.5rem;
  line-height: 0;
}
.aip56-lang-badge svg { display: block; width: 100%; height: 100%; }
.aip56-title { display: flex; align-items: center; gap: .6rem; }
.aip56-title .aip56-lang-badge { width: 2rem; height: 2rem; }
.aip56-menu-badge { width: 1.15rem; height: 1.15rem; }
/* Download cards: blue outline + shadow on hover, and the link gains
   an underline — consistent with the Linux card-link pattern. */
.aip56-download-card:hover,
.aip56-download-card:focus-within,
.aip56-download-card:active,
.aip56-download-card.is-pressed {
  border-color: hsl(var(--primary) / .5);
  box-shadow: 0 4px 6px -1px hsl(0 0% 0% / .1), 0 2px 4px -2px hsl(0 0% 0% / .1);
}
.aip56-download-card a:hover { text-decoration: underline; }
.aip56-impl-link { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.aip56-impl-link .aip56-menu-badge { margin-right: .15rem; }
/* Long implementation labels (e.g. "Vanilla ECMAScript/browser") must wrap
   inside the sidebar instead of overflowing on very narrow screens. */
.aip56-implementations a, .aip56-sidebar a, .aip56-impl-link { overflow-wrap: anywhere; word-break: break-word; }
/* Breadcrumb may include long labels (e.g. "Vanilla ECMAScript/browser");
   allow it to wrap and break so it never overflows narrow screens. */
.aip56-breadcrumb { overflow-wrap: anywhere; word-break: break-word; }
@media (min-width: 1024px) {
  .aip56-layout { grid-template-columns: 15rem minmax(0, 1fr); gap: 3rem; }
  .aip56-sidebar { position: sticky; top: 5.25rem; }
}

@media (max-width: 760px) {
  .hero__inner { grid-template-columns: 1fr; }
  .hero__art { order: -1; }
}
.linux-shell {
  padding-top: 2.5rem;
  padding-bottom: 6rem;
}

.linux-hero {
  color: hsl(var(--primary-foreground));
}

.linux-hero .container {
  padding-top: 3rem;
  padding-bottom: 3.5rem;
}

.linux-hero__figure {
  flex: none;
  margin: 0;
  width: min(38vw, 30rem);
  max-width: 100%;
}

.linux-hero__figure picture {
  display: block;
}

.linux-hero__figure img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid hsl(var(--primary-foreground) / .22);
  border-radius: 1rem;
  background: #fff;
  box-shadow: 0 1.25rem 3rem hsl(222 47% 4% / .35);
}

.linux-hero__figure .linux-preview {
  margin: 1rem auto 0;
  display: flex;
}

.linux-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .55rem;
  margin-bottom: 2rem;
  color: hsl(var(--primary-foreground) / .78);
  font-size: .875rem;
}

.linux-breadcrumb a:hover {
  color: hsl(var(--primary-foreground));
}

.linux-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 2rem;
  padding-bottom: 0;
}

.linux-header h1 {
  margin: 0 0 1rem;
  font-size: clamp(2.25rem, 5vw, 4.5rem);
  line-height: .98;
  letter-spacing: -.04em;
}

.linux-header p:not(.linux-kicker) {
  max-width: 52rem;
  color: hsl(var(--primary-foreground) / .86);
  font-size: 1.1rem;
  line-height: 1.75;
}

.linux-kicker,
.linux-eyebrow,
.linux-step {
  margin: 0 0 .8rem;
  color: hsl(var(--primary));
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.linux-hero .linux-kicker {
  color: hsl(var(--primary-foreground) / .82);
}

.linux-hero .linux-breadcrumb,
.linux-hero .linux-breadcrumb a,
.linux-hero .linux-breadcrumb span {
  color: #fff;
}

.linux-hero .linux-preview {
  border-color: hsl(var(--primary-foreground) / .45);
  background: hsl(var(--primary-foreground) / .12);
  color: hsl(var(--primary-foreground));
}

.site-route-hero {
  color: hsl(var(--primary-foreground));
}

.site-route-hero .container {
  padding-top: 3.5rem;
  padding-bottom: 2rem;
}

.site-route-hero__inner {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2rem;
  align-items: center;
  margin-bottom: 2rem;
}

.site-route-hero__text {
  min-width: 0;
}

.site-route-hero__image {
  flex-shrink: 0;
  order: 1;
}

.site-route-hero__img {
  display: block;
  width: auto;
  max-width: 180px;
  height: auto;
  max-height: 270px;
  filter: drop-shadow(0 .75rem 1.5rem hsl(var(--primary) / .25));
}

@media (max-width: 640px) {
  .site-route-hero__inner {
    grid-template-columns: 1fr;
  }
  .site-route-hero__image {
    display: none;
  }
}

.site-route-hero__kicker {
  margin: 0 0 .75rem;
  color: hsl(var(--primary-foreground) / .78);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.site-route-hero h1 {
  max-width: 58rem;
  margin: 0;
  color: hsl(var(--primary-foreground));
  font-size: clamp(2.25rem, 5vw, 4.5rem);
  line-height: 1;
  letter-spacing: -.04em;
}

.site-route-hero p:last-child {
  max-width: 52rem;
  margin: 1rem 0 0;
  color: hsl(var(--primary-foreground) / .86);
  font-size: 1.05rem;
  line-height: 1.7;
}

.linux-preview,
.linux-download-pending {
  display: inline-flex;
  align-items: center;
  width: max-content;
  border: 1px solid hsl(var(--primary) / .35);
  border-radius: 999px;
  padding: .4rem .75rem;
  background: hsl(var(--primary) / .08);
  color: hsl(var(--primary));
  font-size: .75rem;
  font-weight: 700;
  white-space: nowrap;
}

.linux-layout {
  display: grid;
  grid-template-columns: 13rem minmax(0, 1fr);
  gap: 3.5rem;
  padding-top: 2.5rem;
}

.linux-sidebar nav {
  position: sticky;
  top: 6rem;
}

.linux-sidebar p {
  margin-bottom: .8rem;
  font-weight: 800;
}

.linux-sidebar ul {
  display: grid;
  gap: .3rem;
  padding: 0;
  list-style: none;
}

.linux-sidebar a {
  display: block;
  border-left: 2px solid hsl(var(--border));
  padding: .55rem .8rem;
  color: hsl(var(--muted-foreground));
  font-size: .9rem;
}

.linux-sidebar a:hover,
.linux-sidebar a[aria-current="page"] {
  border-color: hsl(var(--primary));
  background: hsl(var(--primary) / .06);
  color: hsl(var(--foreground));
}

.linux-sidebar__sub {
  margin-top: .7rem;
  border-top: 1px solid hsl(var(--border));
  padding-top: .7rem;
}

.linux-sidebar__sub > span {
  display: block;
  padding: 0 .8rem .35rem;
  color: hsl(var(--muted-foreground));
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.linux-sidebar__sub ul {
  display: grid;
}

.linux-content {
  min-width: 0;
}

.linux-content section {
  scroll-margin-top: 6rem;
}

.linux-content h2 {
  margin: 0 0 1rem;
  font-size: clamp(1.65rem, 3vw, 2.35rem);
  line-height: 1.15;
  letter-spacing: -.025em;
}

.linux-content h3 {
  margin: 0 0 .6rem;
  font-size: 1.1rem;
}

.linux-content p,
.linux-list {
  color: hsl(var(--muted-foreground));
  line-height: 1.75;
}

.linux-content code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.linux-divider {
  height: 1px;
  margin: 3rem 0;
  border: 0;
  background: hsl(var(--border));
}

.linux-anthem {
  border: 1px solid hsl(var(--primary) / .3);
  border-radius: 1rem;
  padding: clamp(1.5rem, 4vw, 3rem);
  background:
    radial-gradient(circle at 90% 10%, hsl(var(--primary) / .16), transparent 42%),
    hsl(var(--card));
}

.linux-anthem h2 {
  max-width: 46rem;
  font-size: clamp(2rem, 4vw, 3.5rem);
}

.linux-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 1.5rem;
}

.linux-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.5rem;
  border: 1px solid hsl(var(--primary));
  border-radius: .5rem;
  padding: .55rem 1rem;
  background: hsl(var(--primary));
  color: hsl(var(--primary-foreground));
  font-size: .875rem;
  font-weight: 700;
}

.linux-button:hover {
  filter: brightness(1.08);
}

.linux-button--outline {
  background: hsl(var(--background));
  color: hsl(var(--primary));
}

.linux-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid hsl(var(--border));
  border-radius: .75rem;
  margin: 1.25rem 0;
}

.linux-table {
  width: 100%;
  min-width: 45rem;
  border-collapse: collapse;
  background: hsl(var(--card));
}

.linux-table caption {
  padding: 1rem;
  color: hsl(var(--muted-foreground));
  text-align: left;
}

.linux-table th,
.linux-table td {
  border-top: 1px solid hsl(var(--border));
  padding: 1rem;
  text-align: left;
  vertical-align: top;
}

.linux-table thead th {
  background: hsl(var(--muted) / .5);
  font-size: .8rem;
  text-transform: uppercase;
}

.linux-note {
  margin-top: 1rem;
  border-left: 3px solid hsl(var(--primary));
  padding: .75rem 1rem;
  background: hsl(var(--primary) / .05);
  font-size: .9rem;
}

.linux-source-link {
  white-space: nowrap;
}

.linux-licence-packages {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .5rem;
}

.linux-licence-packages li {
  padding: .6rem .9rem;
  border: 1px solid hsl(var(--border));
  border-radius: .5rem;
  background: hsl(var(--card));
  font-size: .88rem;
}

.linux-licence-source {
  color: hsl(var(--muted-foreground));
  font-size: .8rem;
}

.linux-licence-text {
  margin-top: 1.5rem;
  padding: 1.5rem;
  border: 1px solid hsl(var(--border));
  border-radius: .75rem;
  background: hsl(var(--card));
  white-space: pre-wrap;
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
  font-size: .85rem;
  line-height: 1.5;
  overflow-wrap: break-word;
  max-height: 42rem;
  overflow-y: auto;
}

.linux-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.linux-standards-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.linux-standard-status {
  margin: 0 0 .65rem;
  color: hsl(var(--primary));
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.linux-card-digest {
  margin: .4rem 0 0;
  color: hsl(var(--muted-foreground));
  font-size: .75rem;
  font-family: ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, Consolas, monospace;
  word-break: break-all;
}

.linux-card {
  border: 1px solid hsl(var(--border));
  border-radius: .75rem;
  padding: 1.25rem;
  background: hsl(var(--card));
}

.linux-card--link {
  display: block;
  color: inherit;
  text-decoration: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}

.linux-card--link:hover,
.linux-card--link:focus-visible {
  border-color: hsl(var(--primary) / .6);
  box-shadow: 0 .5rem 1.5rem hsl(222 47% 4% / .18);
  text-decoration: none;
}

.linux-card-link {
  display: inline-block;
  margin-top: .85rem;
  color: hsl(var(--primary));
  font-size: .88rem;
  font-weight: 700;
}

.linux-card--link:hover .linux-card-link,
.linux-card--link:focus-visible .linux-card-link {
  text-decoration: underline;
}

.linux-package-nav {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin: 1.25rem 0;
}

.linux-pill {
  display: inline-block;
  padding: .4rem .85rem;
  border: 1px solid hsl(var(--border));
  border-radius: 999px;
  color: hsl(var(--foreground));
  font-size: .82rem;
  font-weight: 700;
  text-decoration: none;
  background: hsl(var(--card));
}

.linux-pill:hover,
.linux-pill:focus-visible {
  border-color: hsl(var(--primary) / .6);
}

.linux-pill--active {
  border-color: hsl(var(--primary));
  background: hsl(var(--primary) / .1);
  color: hsl(var(--primary));
}

.linux-spec {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid hsl(var(--border));
  border-radius: .75rem;
  background: hsl(var(--border));
}

.linux-spec div {
  padding: 1rem;
  background: hsl(var(--card));
}

.linux-spec dt {
  color: hsl(var(--muted-foreground));
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
}

.linux-spec dd {
  margin: .35rem 0 0;
  font-weight: 650;
}

.linux-list {
  display: grid;
  gap: .65rem;
  padding-left: 1.25rem;
}

.linux-stages {
  display: grid;
  gap: .75rem;
}

.linux-stage {
  border: 1px solid hsl(var(--border));
  border-radius: .7rem;
  background: hsl(var(--card));
}

.linux-stage summary {
  display: flex;
  gap: 1rem;
  align-items: center;
  padding: 1rem;
  cursor: pointer;
  font-weight: 700;
}

.linux-stage summary code {
  color: hsl(var(--primary));
}

.linux-stage p {
  margin: 0;
  border-top: 1px solid hsl(var(--border));
  padding: 1rem;
}

.linux-build-order {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .5rem;
  padding: 0;
  list-style: none;
  counter-reset: none;
}

.linux-build-order li {
  display: flex;
  gap: .8rem;
  border: 1px solid hsl(var(--border));
  border-radius: .45rem;
  padding: .65rem .8rem;
  background: hsl(var(--card));
}

.linux-build-order li span {
  color: hsl(var(--primary));
  font-family: ui-monospace, monospace;
  font-weight: 800;
}

.linux-code {
  overflow-x: auto;
  margin: 1.25rem 0 0;
  border: 1px solid hsl(217 50% 26%);
  border-radius: .75rem;
  padding: 1.25rem;
  background: hsl(222 47% 8%);
  color: hsl(210 40% 96%);
  line-height: 1.7;
  tab-size: 4;
}

.linux-release {
  border: 1px solid hsl(var(--border));
  border-radius: .9rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: hsl(var(--card));
}

.linux-release__head {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
}

.linux-release__head h2 {
  margin-bottom: .25rem;
}

.linux-download-list {
  display: grid;
  gap: 0;
  margin: 1.5rem 0 0;
  padding: 0;
  list-style: none;
}

.linux-download-list li {
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
  align-items: center;
  border-top: 1px solid hsl(var(--border));
  padding: 1rem 0;
}

.linux-download-list p {
  margin: .25rem 0;
}

.linux-download-list code {
  overflow-wrap: anywhere;
  font-size: .78rem;
}

.linux-download-form {
  flex: none;
}

.linux-command-table th:first-child {
  width: 42%;
}

.linux-console-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
}

.linux-console-figure {
  overflow: hidden;
  margin: 0;
  border: 1px solid hsl(var(--border));
  border-radius: .8rem;
  background: hsl(var(--card));
}

.linux-console-placeholder {
  display: grid;
  min-height: 13rem;
  place-content: center;
  gap: .65rem;
  padding: 1.5rem;
  background:
    linear-gradient(hsl(222 47% 8% / .94), hsl(222 47% 8% / .94)),
    repeating-linear-gradient(0deg, transparent 0 19px, hsl(217 91% 60% / .08) 20px);
  color: hsl(210 40% 96%);
  text-align: center;
}

.linux-console-placeholder span {
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.linux-console-placeholder code {
  color: hsl(210 40% 80%);
  font-size: .75rem;
  overflow-wrap: anywhere;
}

.linux-console-figure figcaption {
  display: grid;
  gap: .35rem;
  padding: 1rem;
}

.linux-console-figure figcaption span {
  color: hsl(var(--muted-foreground));
  font-size: .88rem;
  line-height: 1.55;
}

/* ─── Whiptail terminal and ncurses menuconfig ─── */

.terminal {
  overflow: hidden;
  border: 2px solid hsl(217 80% 60%);
  border-radius: .6rem;
  background: hsl(228 60% 6%);
  color: hsl(210 40% 88%);
  font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace;
  font-size: .82rem;
  line-height: 1.55;
  min-height: 13rem;
}

.terminal__titlebar {
  padding: .55rem .85rem;
  background: hsl(224 76% 28%);
  color: hsl(0 0% 100%);
  font-weight: 700;
  font-size: .85rem;
  text-align: center;
}

.terminal__body {
  display: grid;
  gap: 1px;
  padding: .75rem;
  background: hsl(228 45% 4%);
}

.terminal__body--scroll,
.terminal__body--tree {
  max-height: 26rem;
  overflow-y: auto;
}

.terminal__subtitle {
  padding: .25rem .35rem .5rem;
  color: hsl(210 30% 64%);
  font-size: .78rem;
}

.terminal__item {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1rem;
  padding: .2rem .35rem;
}

.terminal__item--highlighted {
  background: hsl(217 91% 48%);
  color: hsl(0 0% 100%);
}

.terminal__tag {
  font-weight: 700;
  min-width: 6rem;
  white-space: nowrap;
}

.terminal__desc {
  color: hsl(210 20% 64%);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.terminal__item--highlighted .terminal__desc {
  color: hsl(210 60% 90%);
}

.terminal__footer {
  display: flex;
  gap: .65rem;
  justify-content: center;
  padding: .65rem .75rem;
  border-top: 1px solid hsl(224 76% 28% / .4);
  background: hsl(228 55% 5%);
}

.terminal__btn {
  display: inline-flex;
  align-items: center;
  gap: .15rem;
  padding: .3rem .9rem;
  background: hsl(224 70% 18%);
  color: hsl(210 30% 80%);
  border-radius: .3rem;
  font-size: .78rem;
}

.terminal__btn--active {
  background: hsl(224 76% 28%);
  color: hsl(0 0% 100%);
}

.terminal__btn-hotkey {
  color: hsl(217 91% 60%);
  font-weight: 700;
}

.terminal__btn--active .terminal__btn-hotkey {
  color: hsl(0 0% 100%);
}

/* Checkbox / radiolist style inside whiptail body */
.terminal__checklist {
  display: grid;
  gap: 1px;
}

.terminal__check {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .65rem;
  padding: .15rem .35rem;
}

.terminal__check--on .terminal__check-mark,
.terminal__radio--on .terminal__check-mark {
  color: hsl(217 91% 60%);
  font-weight: 700;
}

.terminal__check--highlighted {
  background: hsl(217 91% 48%);
  color: hsl(0 0% 100%);
}

.terminal__check--highlighted .terminal__check-mark {
  color: hsl(0 0% 100%);
}

.terminal__check-mark {
  min-width: 1.1rem;
  text-align: center;
  user-select: none;
}

.terminal__check-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Radio list (single-choice) */
.terminal__radiolist {
  display: grid;
  gap: 1px;
}

.terminal__radio-item {
  display: grid;
  grid-template-columns: auto auto 1fr;
  gap: .65rem;
  padding: .15rem .35rem;
}

.terminal__radio-item--highlighted {
  background: hsl(217 91% 48%);
  color: hsl(0 0% 100%);
}

.terminal__radio-label,
.terminal__radio-desc {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.terminal__radio-desc {
  color: hsl(210 20% 64%);
  font-size: .76rem;
}

.terminal__radio-item--highlighted .terminal__radio-desc {
  color: hsl(210 60% 90%);
}

.terminal__text {
  margin: 0;
  padding: 0;
  color: hsl(210 20% 78%);
  font-family: inherit;
  font-size: .74rem;
  line-height: 1.6;
  white-space: pre;
  overflow-wrap: normal;
}

/* ncurses menuconfig frame */
.menuconfig {
  overflow: hidden;
  border: 2px solid hsl(180 100% 30%);
  background: hsl(240 100% 16%);
  color: hsl(0 0% 90%);
  font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace;
  font-size: .82rem;
  line-height: 1.55;
  min-height: 13rem;
}

.menuconfig__title {
  padding: .55rem .85rem;
  background: hsl(180 80% 28%);
  color: hsl(0 0% 100%);
  font-weight: 700;
  font-size: .85rem;
  text-align: center;
}

.menuconfig__hint {
  padding: .3rem .85rem;
  background: hsl(240 55% 12%);
  color: hsl(180 60% 70%);
  font-size: .74rem;
  border-bottom: 1px solid hsl(180 40% 24%);
}

.menuconfig__options {
  display: grid;
  gap: 0;
  padding: .15rem 0;
}

.menuconfig__row {
  display: grid;
  padding: .1rem .5rem;
  align-items: baseline;
  min-height: 1.45rem;
}

.menuconfig__row--category {
  font-weight: 700;
  color: hsl(180 80% 60%);
}

.menuconfig__row--option {
  grid-template-columns: auto 1fr auto;
  gap: .35rem;
  color: hsl(0 0% 88%);
}

.menuconfig__row--highlighted {
  background: hsl(180 60% 28%);
  color: hsl(0 0% 100%);
}

.menuconfig__spacer {
  visibility: hidden;
}

.menuconfig__arrow {
  color: hsl(60 100% 60%);
  font-weight: 700;
  white-space: nowrap;
}

.menuconfig__label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.menuconfig__val {
  color: hsl(180 60% 60%);
  font-size: .76rem;
  white-space: nowrap;
}

.menuconfig__row--highlighted .menuconfig__val {
  color: hsl(180 80% 80%);
}

.menuconfig__row--comment {
  grid-template-columns: auto 1fr;
  gap: .35rem;
  color: hsl(0 0% 55%);
  font-style: italic;
}

.menuconfig__footer {
  display: flex;
  gap: .65rem;
  justify-content: center;
  padding: .55rem .75rem;
  border-top: 1px solid hsl(180 40% 24%);
  background: hsl(240 50% 12%);
}

.menuconfig__btn {
  display: inline-flex;
  align-items: center;
  gap: .15rem;
  padding: .25rem .75rem;
  background: hsl(180 50% 18%);
  color: hsl(0 0% 80%);
  border-radius: .2rem;
  font-size: .76rem;
}

.menuconfig__btn-hotkey {
  color: hsl(60 100% 50%);
  font-weight: 700;
}

/* Responsive: single column on narrow viewports */
@media (max-width: 640px) {
  .terminal__item { grid-template-columns: 1fr; gap: .2rem; }
  .terminal__desc { white-space: normal; }
}

.linux-dragon {
  position: relative;
  border: 1px solid hsl(var(--border));
  border-left: 4px solid hsl(var(--muted-foreground) / .45);
  border-radius: .75rem;
  padding: 1.25rem 1.4rem;
  background: hsl(var(--card));
}

.linux-dragon::after {
  position: absolute;
  left: -4px;
  bottom: -1.1rem;
  width: 4px;
  height: 1.1rem;
  background: hsl(var(--muted-foreground) / .28);
  content: "";
}

.linux-dragon:last-child::after {
  display: none;
}

.linux-dragon--current {
  border-color: hsl(var(--primary) / .5);
  border-left-color: hsl(var(--primary));
  background: hsl(var(--primary) / .06);
}

.linux-dragon span {
  color: hsl(var(--primary));
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.linux-dragon h3 {
  margin-top: .4rem;
  font-size: 1.35rem;
}

.linux-dragon p {
  margin-bottom: 0;
}

@media (min-width: 1024px) {
  .linux-standards-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .linux-console-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .linux-header,
  .linux-download-list li {
    align-items: flex-start;
    flex-direction: column;
  }

  .linux-hero__figure {
    width: 100%;
  }

  .linux-layout {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .linux-sidebar nav {
    position: static;
  }

  .linux-sidebar ul {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .linux-grid,
  .linux-standards-grid,
  .linux-console-grid,
  .linux-spec,
  .linux-build-order {
    grid-template-columns: 1fr;
  }

  .terminal {
    font-size: .72rem;
    min-height: auto;
  }

  .terminal__item {
    grid-template-columns: 1fr;
    gap: .2rem;
  }

  .terminal__desc {
    white-space: normal;
  }

  .menuconfig {
    font-size: .72rem;
    min-height: auto;
  }

}

.linux-code {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.terminal__body--scroll,
.terminal__body--tree {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}