/* Canonical K2040 header, menus, actions, and global cascade. */
:root {
  --k2040-nav-bg: var(--site-nav-bg, var(--nav-bg, #0f1318));
  --k2040-nav-text: var(--site-nav-text, var(--nav-text, #f7f9fb));
  --k2040-nav-muted: var(--site-nav-muted, var(--nav-muted, #c6ccd2));
}

.site-header {
  border: 1px solid rgba(0,207,215,.54);
  border-radius: 0;
  background: var(--k2040-nav-bg);
  color: var(--k2040-nav-text);
  box-shadow: 0 0 0 1px rgba(0,130,143,.32),0 0 22px rgba(0,210,220,.08),inset 0 0 30px rgba(0,209,219,.035),0 20px 44px rgba(0,0,0,.24);
  clip-path: none;
  isolation: isolate;
}

.site-header::before,
.site-header .menu-panel:not(.global-menu-panel)::before,
.global-menu-panel::before {
  position: absolute;
  z-index: 3;
  inset: 7px;
  box-sizing: border-box;
  pointer-events: none;
  content: "";
  border: 8px solid transparent;
  border-image-source: url("/assets/k2040-inner-frame.svg");
  border-image-slice: 8;
  border-image-width: 8px;
  border-image-repeat: stretch;
  background:
    linear-gradient(90deg,#00d9e5,transparent) 8px 0/3.5rem 1px no-repeat,
    linear-gradient(180deg,#00d9e5,transparent) 0 8px/1px 3.5rem no-repeat,
    linear-gradient(-90deg,#00d9e5,transparent) calc(100% - 8px) 100%/3.5rem 1px no-repeat,
    linear-gradient(0deg,#00d9e5,transparent) 100% calc(100% - 8px)/1px 3.5rem no-repeat;
  background-origin: border-box;
  clip-path: none;
}

.site-header .menu-panel:not(.global-menu-panel) {
  border: 1px solid rgba(0,207,215,.54);
  border-radius: 0;
  background: var(--k2040-nav-bg);
  color: var(--k2040-nav-text);
  box-shadow: 0 0 0 1px rgba(0,130,143,.32),0 0 22px rgba(0,210,220,.08),0 20px 44px rgba(0,0,0,.24);
  clip-path: polygon(0 10px,10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px));
  isolation: isolate;
}

.site-brand { align-items: center; }
.menu { position: relative; }
.menu > summary { list-style: none; cursor: pointer; }
.menu > summary::-webkit-details-marker { display: none; }
.menu-caret { color: var(--k2040-nav-muted); font-size: 1.05rem; line-height: 1; transition: transform 140ms ease; }
.menu[open] > summary .menu-caret { transform: rotate(180deg); }

.site-brand > .global-menu > summary,
.site-brand-section,
.site-header .nav-link,
.site-header .nav-language-control,
.site-header .menu > summary,
.site-header .theme-toggle {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  padding: .65rem .8rem;
  border: 1px solid transparent;
  border-radius: 0;
  background: transparent;
  color: var(--k2040-nav-text);
  font-weight: 750;
  text-decoration: none;
  box-shadow: none;
  clip-path: polygon(0 7px,7px 0,calc(100% - 7px) 0,100% 7px,100% calc(100% - 7px),calc(100% - 7px) 100%,7px 100%,0 calc(100% - 7px));
}
.site-brand > .global-menu > summary { min-width: 86px; }
.site-brand > .global-menu > summary strong { color:#fff; font-size:1.05rem; letter-spacing:.04em; }
.site-brand-section span { color:#f5f7f9; font-size:.88rem; font-weight:700; }

.site-brand-section[aria-current="page"],
.site-header .nav-link[aria-current="page"] {
  border-color: transparent;
  border-bottom-color: transparent;
  background: transparent;
  box-shadow: none;
}

.site-brand > .global-menu > summary:hover,
.site-brand > .global-menu > summary:focus-visible,
.site-brand > .global-menu[open] > summary,
.site-brand-section:hover,
.site-brand-section:focus-visible,
.site-header .nav-link:hover,
.site-header .nav-link:focus-visible,
.site-header .nav-link[aria-current="page"]:hover,
.site-header .nav-link[aria-current="page"]:focus-visible,
.site-header .nav-language-control:hover,
.site-header .nav-language-control:focus-within,
.site-header .menu > summary:hover,
.site-header .menu > summary:focus-visible,
.site-header .menu[open] > summary,
.site-header .theme-toggle:hover,
.site-header .theme-toggle:focus-visible {
  border-color: transparent;
  border-bottom-color: #00d9e5;
  background: linear-gradient(180deg,rgba(0,217,229,.08),transparent);
  box-shadow: inset 0 -2px 0 #00d9e5,0 0 10px rgba(0,217,229,.1);
  outline: none;
  transform: none;
}

.app-menu-panel { width:min(360px,calc(100vw - 2rem)); }
.language-menu-panel { min-width:190px; }
.app-menu-panel a,
.language-menu-panel button {
  position: relative;
  display: flex;
  width: 100%;
  min-height: 42px;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  gap: .2rem;
  padding: .7rem .55rem;
  border: 1px solid transparent;
  border-radius: 0;
  background: transparent;
  color: var(--k2040-nav-text);
  font: inherit;
  font-weight: 750;
  text-align: left;
  text-decoration: none;
  box-shadow: none;
  clip-path: polygon(0 7px,7px 0,calc(100% - 7px) 0,100% 7px,100% calc(100% - 7px),calc(100% - 7px) 100%,7px 100%,0 calc(100% - 7px));
}
.language-menu-panel button { display:grid; grid-template-columns:1.6rem 1fr; align-items:center; justify-content:initial; gap:.55rem; }
.app-menu-panel small { margin:0; color:var(--k2040-nav-muted); font-size:.78rem; font-weight:600; line-height:1.35; }
.app-menu-panel a:hover,
.app-menu-panel a:focus-visible,
.language-menu-panel button:hover,
.language-menu-panel button:focus-visible,
.language-menu-panel button[aria-current="true"] {
  border-color: transparent;
  border-bottom-color: #00d9e5;
  background: linear-gradient(180deg,rgba(0,217,229,.08),transparent);
  box-shadow: inset 0 -2px 0 #00d9e5,0 0 10px rgba(0,217,229,.1);
  outline: none;
}
.app-menu-panel a + a,
.language-menu-panel button + button { margin-top:.55rem; padding-top:1.15rem; }
.app-menu-panel a + a::before,
.language-menu-panel button + button::before,
.global-menu-item + .global-menu-item::before,
.global-menu-submenu a + a::before {
  position:absolute;
  left:16%;
  right:16%;
  height:1px;
  content:"";
  background:linear-gradient(90deg,transparent,rgba(0,217,229,.72),transparent);
  box-shadow:0 0 7px rgba(0,217,229,.28);
}
.app-menu-panel a + a::before,
.language-menu-panel button + button::before { top:.25rem; }

.global-menu-panel {
  position:absolute;
  top:calc(100% + .55rem);
  right:auto;
  left:0;
  z-index:60;
  width:220px;
  padding:.55rem;
  overflow:visible;
  border:1px solid rgba(0,207,215,.54);
  border-radius:0;
  background:var(--k2040-nav-bg);
  color:var(--k2040-nav-text);
  box-shadow:0 0 0 1px rgba(0,130,143,.32),0 0 22px rgba(0,210,220,.08),0 20px 44px rgba(0,0,0,.24);
  clip-path:none;
  isolation:isolate;
}
.global-menu-item { position:relative; }
.global-menu-item > summary {
  position:relative;
  display:flex;
  width:100%;
  min-height:42px;
  align-items:center;
  justify-content:space-between;
  gap:.6rem;
  padding:.65rem .6rem;
  border:1px solid transparent;
  border-radius:0;
  background:transparent;
  color:var(--k2040-nav-text);
  font:inherit;
  font-weight:750;
  text-align:left;
  list-style:none;
  cursor:pointer;
  box-shadow:none;
  clip-path:polygon(0 7px,7px 0,calc(100% - 7px) 0,100% 7px,100% calc(100% - 7px),calc(100% - 7px) 100%,7px 100%,0 calc(100% - 7px));
}
.global-menu-item > summary::-webkit-details-marker { display:none; }
.global-menu-item-arrow { color:var(--k2040-nav-muted); font-size:1.05rem; }
.global-menu-submenu {
  position:absolute;
  top:0;
  left:calc(100% + .55rem);
  z-index:60;
  width:245px;
  padding:.55rem;
  border:1px solid rgba(0,207,215,.54);
  border-radius:0;
  background:var(--k2040-nav-bg);
  color:var(--k2040-nav-text);
  box-shadow:0 0 0 1px rgba(0,130,143,.32),0 0 22px rgba(0,210,220,.08),0 20px 44px rgba(0,0,0,.24);
  clip-path:polygon(0 10px,10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px));
}
.global-menu-submenu::before { display:none; content:none; }
.global-menu-item--flip .global-menu-submenu { right:calc(100% + .55rem); left:auto; }
.global-menu-submenu a {
  position:relative;
  display:block;
  padding:.7rem .6rem;
  border:1px solid transparent;
  border-radius:0;
  background:transparent;
  color:var(--k2040-nav-text);
  font:inherit;
  font-weight:700;
  text-decoration:none;
  box-shadow:none;
  clip-path:polygon(0 7px,7px 0,calc(100% - 7px) 0,100% 7px,100% calc(100% - 7px),calc(100% - 7px) 100%,7px 100%,0 calc(100% - 7px));
}
.global-menu-item > summary:hover,
.global-menu-item > summary:focus-visible,
.global-menu-item[open] > summary,
.global-menu-submenu a:hover,
.global-menu-submenu a:focus-visible {
  border-color:transparent;
  border-bottom-color:#00d9e5;
  background:linear-gradient(180deg,rgba(0,217,229,.08),transparent);
  box-shadow:inset 0 -2px 0 #00d9e5,0 0 10px rgba(0,217,229,.1);
  outline:none;
}
.global-menu-item + .global-menu-item { margin-top:.65rem; padding-top:.65rem; }
.global-menu-item + .global-menu-item::before { top:0; }
.global-menu-submenu a + a { margin-top:.55rem; padding-top:1.25rem; }
.global-menu-submenu a + a::before { top:.28rem; }

.k2040-action,
.text-link,
.project-action,
.section-link,
.inline-link,
.download-button,
.resource-links a,
.about-links a,
.site-footer nav a,
.update-action,
.text-action {
  display:inline-flex;
  min-height:38px;
  align-items:center;
  justify-content:center;
  padding:.5rem .85rem;
  border:1px solid rgba(0,207,215,.3);
  border-radius:0;
  background:rgba(12,22,29,.88);
  color:#dce8ec;
  font:inherit;
  font-weight:750;
  line-height:normal;
  text-decoration:none;
  box-shadow:none;
  clip-path:polygon(0 7px,7px 0,calc(100% - 7px) 0,100% 7px,100% calc(100% - 7px),calc(100% - 7px) 100%,7px 100%,0 calc(100% - 7px));
  transform:none;
}
.about-links a { min-height:40px; }
.k2040-action:hover,
.k2040-action:focus-visible,
.text-link:hover,
.text-link:focus-visible,
.project-action:hover,
.project-action:focus-visible,
.section-link:hover,
.section-link:focus-visible,
.inline-link:hover,
.inline-link:focus-visible,
.download-button:hover,
.download-button:focus-visible,
.resource-links a:hover,
.resource-links a:focus-visible,
.about-links a:hover,
.about-links a:focus-visible,
.site-footer nav a:hover,
.site-footer nav a:focus-visible,
.update-action:hover,
.update-action:focus-visible,
.text-action:hover,
.text-action:focus-visible {
  border-color:transparent;
  border-bottom-color:#00d9e5;
  background:linear-gradient(180deg,rgba(0,217,229,.08),rgba(8,20,27,.94));
  box-shadow:inset 0 -2px 0 #00d9e5,0 0 10px rgba(0,217,229,.1);
  outline:none;
  text-decoration:none;
  transform:none;
}
.download-button--source { gap:.4rem; }
.download-source-icon {
  display:inline;
  width:auto;
  height:auto;
  flex:0 0 auto;
  border:0;
  background:transparent;
  color:inherit;
  font:inherit;
  font-size:.92rem;
  font-weight:750;
  line-height:1;
  box-shadow:none;
}

@media (max-width:760px) {
  .site-header::before,
  .site-header .menu-panel:not(.global-menu-panel)::before { inset:4px; }
  .site-header .nav-link,
  .site-header .nav-language-control,
  .site-header .menu > summary,
  .site-header .theme-toggle {
    min-height:36px;
    gap:.18rem;
    padding:.28rem .18rem;
  }
  .menu-caret { font-size:.82rem; }
  .global-menu-panel {
    width:min(320px,calc(100vw - 1rem));
    max-height:calc(100vh - 6rem);
    overflow-y:auto;
  }
  .global-menu-submenu,
  .global-menu-item--flip .global-menu-submenu {
    position:static;
    width:auto;
    margin:.3rem 0 .45rem .65rem;
    padding:.3rem;
    border-color:rgba(0,207,215,.3);
    box-shadow:none;
  }
  .global-menu-item-arrow { transform:rotate(90deg); }
  .global-menu-item[open] .global-menu-item-arrow { transform:rotate(-90deg); }
}

@media (max-width:360px) {
  .site-header .nav-link,
  .site-header .nav-language-control,
  .site-header .menu > summary,
  .site-header .theme-toggle {
    min-height:34px;
    padding:.24rem .12rem;
  }
}