/* Site chrome is independent of the report's typography and diagram styles. */
@font-face {
  font-family: "Knowin Navigation Sans";
  src: url("../assets/fonts/knowin-tech-nav-v2.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
:root { --knowin-header-height: 60px; }
/* Long-distance smooth scrolling would load every diagram along the way and
   move the destination as those lazy frames acquire their natural heights. */
html { scroll-behavior: auto; scroll-padding-top: calc(var(--knowin-header-height) + 24px); }
.technology-page { padding-top: var(--knowin-header-height); }
.technology-page .progress { top: var(--knowin-header-height); z-index: 61; height: 2px; }
.technology-page .skip:focus { top: 64px; z-index: 62; }
#top .toc { top: 88px; max-height: calc(100dvh - 112px); }
#article :is(.chapter, .benchmark-section, .architecture-source) { scroll-margin-top: 24px; }
.knowin-tech-header { position: fixed; inset: 0 0 auto; z-index: 60; height: var(--knowin-header-height); display: flex; align-items: center; justify-content: space-between; padding: 0 30px; background: rgba(0,0,0,.86); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.knowin-tech-logo { display: inline-flex; align-items: center; flex-shrink: 0; }
.knowin-tech-header .knowin-tech-logo { position: absolute; left: 2.34375vw; top: 22px; }
.knowin-tech-logo img { display: block; width: 114.286px; height: 15px; }
.knowin-tech-nav { position: absolute; right: 67px; top: 19px; display: flex; width: 360px; height: 22px; gap: 15px; align-items: center; }
.knowin-tech-header a { color: #fff; font: 500 12px/22px "Knowin Navigation Sans", "PingFang SC", "Microsoft YaHei", Arial, sans-serif; font-synthesis: none; text-decoration: none; }
.knowin-tech-nav a { display: block; width: 60px; flex: 0 0 60px; white-space: nowrap; }
.knowin-tech-nav a:first-child { text-align: center; }
.knowin-tech-nav a[aria-current] { font-weight: 900; }
.knowin-tech-nav a:hover { opacity: .72; }
.knowin-tech-menu-open { display: none; }
.knowin-tech-actions { position: absolute; right: 30px; top: 19px; display: flex; align-items: center; }
.knowin-tech-language { position: relative; }
.knowin-tech-language-button { display: flex; align-items: center; justify-content: center; width: 22px; height: 22px; padding: 0; border: 0; background: transparent; color: #fff; }
.knowin-tech-language-button img { display: block; width: 22px; height: 22px; }
.knowin-tech-language-button:hover { opacity: .72; }
.knowin-tech-language-popover { position: absolute; right: 0; top: calc(100% + 10px); display: grid; width: 114px; overflow: hidden; border: 1px solid #303030; border-radius: 8px; background: rgba(10,10,10,.94); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.knowin-tech-language-popover[hidden] { display: none; }
.knowin-tech-language-popover a { display: flex; align-items: center; justify-content: center; min-height: 45px; }
.knowin-tech-language-popover a + a { border-top: 1px solid #303030; }
.knowin-tech-language-popover a[aria-current] { font-weight: 700; }
.knowin-tech-language-popover a:hover, .knowin-tech-language-popover a:focus-visible { background: #252525; outline-offset: -3px; }
/* Match About's mobile disclosure menu without importing its page styles. */
.knowin-tech-menu { position: fixed; inset: 0; z-index: 80; background: transparent; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 240ms ease, visibility 240ms ease; }
.knowin-tech-menu.is-open { opacity: 1; visibility: visible; pointer-events: auto; }
.knowin-tech-menu-panel { position: absolute; right: 17px; top: var(--knowin-header-height); display: flex; flex-direction: column; align-items: stretch; gap: 0; width: 114px; height: 264px; overflow: hidden; border-radius: 8px; background: rgba(255,255,255,.3); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.knowin-tech-menu-panel a { position: relative; display: flex; align-items: center; justify-content: center; flex: 0 0 44px; width: 114px; height: 44px; color: #fff; background: transparent; font: 400 14px/18px "Knowin Navigation Sans", "PingFang SC", "Microsoft YaHei", Arial, sans-serif; letter-spacing: 0; text-align: center; text-decoration: none; white-space: nowrap; transition: background 160ms ease, opacity 160ms ease, font-weight 160ms ease; }
.knowin-tech-menu-panel a::after { content: ""; position: absolute; left: 0; bottom: -.5px; width: 114px; height: 1px; background: rgba(255,255,255,.3); pointer-events: none; }
.knowin-tech-menu-panel a[aria-current="page"], .knowin-tech-menu-panel a:hover, .knowin-tech-menu-panel a:focus-visible { background: #fff; color: #2c2c2c; font-weight: 400; }
.knowin-tech-menu-panel a:not([aria-current="page"]):not(:hover):not(:focus-visible):last-child { background: linear-gradient(180deg, rgba(0,0,0,.3) 0%, rgba(0,0,0,.44) 100%); }
/* Native HTML/MathML from GLOW-v79-ICL-Formulation-Standalone.html.
   Scope the attachment's styles so its typography cannot affect the report. */
#article #icl-formulation { display: flow-root; width: 100%; min-width: 0; margin: 32px 0; color: #f5f5f5; }
#article #icl-formulation * { box-sizing: border-box; }
#article #icl-formulation [data-module-root] { border: 1px solid #333; background: #0e0e0e; padding: 24px; }
#article #icl-formulation .kicker { color: #aaa; }
#article #icl-formulation h3 { margin: 8px 0 24px; padding: 0; font: 600 18px/1.3 Arial, sans-serif; letter-spacing: normal; color: #fff; text-wrap: balance; }
#article #icl-formulation [data-glow-type="diagram-12"] { font: 400 12px/1.3 Arial, sans-serif; letter-spacing: normal; word-spacing: normal; }
#article #icl-formulation .equations { display: grid; gap: 0; }
#article #icl-formulation .formula-row { display: grid; grid-template-columns: 185px minmax(0, 1fr); gap: 12px; padding: 15px 0; border-top: 1px solid #333; align-items: center; }
#article #icl-formulation .formula-row:first-child { border-top: 0; }
#article #icl-formulation .label { color: #b6b6b6; }
#article #icl-formulation .label b { display: block; color: #e0e0e0; }
#article #icl-formulation .label .context-origin { display: block; color: inherit; margin: 2px 0 3px; }
#article #icl-formulation .math { min-width: 0; overflow-x: auto; }
#article #icl-formulation math { display: block math; font-family: "Cambria Math", "STIX Two Math", serif; font-size: 19px; margin: 0; }
#article #icl-formulation p { padding: 0; word-break: normal; overflow-wrap: break-word; text-align: left; text-align-last: auto; }
#article #icl-formulation .symbols { color: #bebebe; margin: 22px 0 0; }
#article #icl-formulation .symbols b { color: #e1e1e1; }
#article #icl-formulation .symbol { white-space: nowrap; }
#article #icl-formulation sub { font-size: .75em; line-height: 0; }
#article #icl-formulation .insight { margin: 22px 0 0; border-top: 1px solid #404040; padding-top: 19px; color: #dbdbdb; }
#article #icl-formulation .adaptation-note { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 20px; padding: 15px 18px; margin-top: 18px; border: 1px solid #5e5e5e; border-radius: 4px; background: #202020; }
#article #icl-formulation .adaptation-note b { display: block; color: #e7e7e7; }
#article #icl-formulation .adaptation-note p { color: #bebebe; margin: 4px 0 0; }
#article #icl-formulation .adaptation-note math { font-size: 20px; }
@media (max-width: 600px) {
  #article #icl-formulation [data-module-root] { padding: 18px; }
  #article #icl-formulation .formula-row { grid-template-columns: 1fr; gap: 10px; }
  #article #icl-formulation .label b { display: inline; margin-right: 9px; }
  #article #icl-formulation math { font-size: clamp(16px, 4vw, 19px); }
  #article #icl-formulation .adaptation-note { grid-template-columns: 1fr; gap: 12px; padding: 13px 15px; }
  #article #icl-formulation .adaptation-note math { font-size: 19px; }
}
@media (max-width: 360px) {
  #article #icl-formulation .formula-row math { font-size: 15px; }
}
@media (min-width: 768px) {
  /* Fixed columns prevent the active link's bold weight from shifting its peers. */
  .knowin-tech-header[lang="en"] .knowin-tech-nav { display: grid; grid-template-columns: 33px 45px 65px 34px 45px; width: max-content; gap: 36px; }
  .knowin-tech-header[lang="en"] .knowin-tech-nav a { width: auto; text-align: left; }
}
@media (max-width: 767px) {
  /* English prose: keep justified edges while allowing dictionary hyphenation
     in addition to the report's existing discretionary soft hyphens. */
  #article p[data-glow-type="body"]:not(.formula):not(.formula *):not(#icl-formulation *) {
    text-align: justify !important;
    text-align-last: left !important;
    text-justify: inter-word;
    -webkit-hyphens: auto;
    hyphens: auto;
    hyphenate-limit-chars: 5 2 2;
    -webkit-hyphenate-limit-before: 2;
    -webkit-hyphenate-limit-after: 2;
    letter-spacing: normal;
    word-spacing: normal;
    word-break: normal;
    overflow-wrap: break-word;
    text-wrap: wrap;
  }
  :root { --knowin-safe-top: min(44px, env(safe-area-inset-top, 0px)); --knowin-header-height: calc(57px + var(--knowin-safe-top)); }
  .knowin-tech-header { padding: 0 20px; background: rgba(0,0,0,.8); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }
  .knowin-tech-header .knowin-tech-logo { left: 20px; top: calc(20px + var(--knowin-safe-top)); }
  .knowin-tech-logo img { width: 114.236px; }
  .knowin-tech-nav { display: none; }
  .knowin-tech-actions { right: 20px; top: calc(11.5px + var(--knowin-safe-top)); gap: 14px; }
  .knowin-tech-language-button, .knowin-tech-language-button img { width: 32px; height: 32px; }
  .knowin-tech-language-popover { right: 0; top: calc(100% + 10px); }
  .knowin-tech-menu-open { display: block; padding: 0; width: 32px; height: 32px; border: 0; border-radius: 50%; background-color: transparent; background-image: url("../assets/images/figma/tech-new/tech-nav-menu-lines.svg"), url("../assets/images/figma/tech-new/tech-nav-menu-bg.svg"); background-position: 9.25px 10.97px, 0 0; background-size: 13.5px 10.1px, 32px 32px; background-repeat: no-repeat; }
  #top .toc { top: auto; max-height: none; }
}
@media print {
  .knowin-tech-header, .knowin-tech-menu, .progress { display: none !important; }
  .technology-page { padding-top: 0; }
}

/* Explicit mobile break opportunities work without a browser dictionary. */
.knowin-mobile-hyphen { display: none; }
@media (max-width: 767px) {
  #article .knowin-mobile-hyphen { display: inline; }
}


/* KNOWIN Citation — scoped, dependency-free, desktop + mobile. */
#knowin-citation {
  box-sizing: border-box;
  width: 100%; max-width: none; min-width: 0;
  margin: 64px auto 72px; padding: 0;
  color: #f5f5f5; background: transparent;
  font-family: Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
  text-align: left; text-transform: none;
  scroll-margin-top: 90px;
}
#knowin-citation *, #knowin-citation *::before, #knowin-citation *::after { box-sizing: border-box; }
#knowin-citation .knowin-citation__heading {
  margin: 0 0 20px; padding: 0; border: 0;
  color: #fff; font: 500 clamp(24px, 2.1vw, 30px)/1.32 Arial, sans-serif;
  letter-spacing: normal; text-wrap: wrap;
}
#knowin-citation .knowin-citation__intro {
  margin: 0 0 28px; padding: 0;
  color: #d2d2d2; font: 400 17px/1.76 Arial, sans-serif;
  text-align: left !important; text-align-last: auto !important;
  letter-spacing: normal; word-spacing: normal; hyphens: none;
}
#knowin-citation .knowin-citation__card {
  width: 100%; min-width: 0; border: 1px solid #383838;
  border-radius: 8px; background: #0d0e10;
}
#knowin-citation .knowin-citation__reference {
  padding: 24px 26px; border-bottom: 1px solid #303030;
}
#knowin-citation .knowin-citation__text {
  width: auto; max-width: none; margin: 0; padding: 0;
  color: #e5e5e5; font: 400 17px/1.76 Arial, sans-serif;
  text-align: left !important; text-align-last: auto !important; letter-spacing: normal;
  overflow-wrap: anywhere; hyphens: none;
}
#knowin-citation .knowin-citation__title { font-style: italic; }
#knowin-citation .knowin-citation__link {
  display: inline-block; max-width: 100%; margin-top: 8px;
  color: #e5e5e5; font: 400 17px/1.76 Arial, sans-serif;
  text-decoration: underline; text-underline-offset: 4px;
  text-decoration-thickness: 1px; border: 0; overflow-wrap: anywhere;
}
#knowin-citation .knowin-citation__link:hover { color: #fff; }
#knowin-citation .knowin-citation__link:focus-visible { outline: 2px solid #fff; outline-offset: 5px; border-radius: 2px; }
#knowin-citation .knowin-citation__code {
  display: block; width: 100%; max-width: 100%; min-width: 0;
  margin: 0; padding: 24px 26px; border: 0; border-radius: 0;
  background: transparent; color: #b8b8b8;
  font: 400 14px/1.8 Consolas, "SFMono-Regular", Menlo, monospace;
  letter-spacing: normal; text-align: left; text-transform: none;
  white-space: pre-wrap; overflow-wrap: anywhere; word-break: normal;
  hyphens: none; tab-size: 2;
}
#knowin-citation .knowin-citation__code code {
  display: inline; margin: 0; padding: 0; border: 0; background: transparent;
  color: inherit; font: inherit; white-space: inherit;
  overflow-wrap: inherit; word-break: inherit; letter-spacing: normal;
}
@media (max-width: 600px) {
  #knowin-citation { margin-top: 40px; margin-bottom: 48px; }
  #knowin-citation .knowin-citation__heading { margin-bottom: 16px; }
  #knowin-citation .knowin-citation__intro { margin-bottom: 20px; font-size: 16px; }
  #knowin-citation .knowin-citation__reference { padding: 20px 16px; }
  #knowin-citation .knowin-citation__text,
  #knowin-citation .knowin-citation__link { font-size: 16px; line-height: 1.75; }
  #knowin-citation .knowin-citation__code { padding: 20px 16px; font-size: 13px; line-height: 1.85; }
}
@media print {
  #knowin-citation { color: #111; break-inside: avoid; }
  #knowin-citation .knowin-citation__card { background: #fff; border-color: #ccc; }
  #knowin-citation .knowin-citation__reference { border-color: #ddd; }
  #knowin-citation .knowin-citation__heading,
  #knowin-citation .knowin-citation__intro,
  #knowin-citation .knowin-citation__text,
  #knowin-citation .knowin-citation__link,
  #knowin-citation .knowin-citation__code { color: #111; }
}
