a.skip-link{position:absolute;left:-999px;top:.5rem;background:#f2f2f2;color:#080808;padding:.55rem .75rem;border:2px solid #2060ff;z-index:9999;text-decoration:none;font-weight:bold}a.skip-link:focus{left:.5rem}
a:focus-visible{outline:2px solid #4d8aff;outline-offset:3px}

.tlr-backbar{background:#080808;color:#f2f2f2;border-bottom:2px solid #2060ff;font:14px/1.4 Georgia,serif;padding:.75rem 1rem;text-align:center}
.tlr-backbar a{color:#4d8aff;text-decoration:none;border-bottom:1px solid #2060ff;margin:0 .55rem}.tlr-backbar a:hover{color:#fff}


/* Public clarity button layer — added during Phase 11 + Week 27 merge. */
.lp,
.button,
.button-link,
.source a {
  display: inline-block;
  position: relative;
  color: #f6f1e8 !important;
  background: linear-gradient(145deg, #243149, #151a25) !important;
  border: 1px solid #5f78a8 !important;
  border-radius: 7px !important;
  padding: 0.46rem 0.72rem !important;
  margin: 0.25rem 0.55rem 0.35rem 0 !important;
  box-shadow: 0 0 0 1px rgba(105,167,255,.08), 0 8px 18px rgba(0,0,0,.35), inset 2px 2px 6px rgba(255,255,255,.04), inset -3px -3px 8px rgba(0,0,0,.45) !important;
  font-family: Consolas, "Courier New", monospace !important;
  font-size: 0.76rem !important;
  letter-spacing: 0.055em !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  text-transform: none !important;
  border-bottom: 1px solid #5f78a8 !important;
}
.lp::before,
.button::before,
.button-link::before,
.source a::before {
  content: "↳ ";
  color: #9cc6ff;
  font-weight: bold;
}
.lp:hover,
.lp:focus-visible,
.button:hover,
.button:focus-visible,
.button-link:hover,
.button-link:focus-visible,
.source a:hover,
.source a:focus-visible {
  color: #ffffff !important;
  background: linear-gradient(145deg, #31486f, #1a2232) !important;
  border-color: #9cc6ff !important;
  box-shadow: 0 0 0 2px rgba(156,198,255,.28), 0 0 18px rgba(105,167,255,.45), 0 10px 24px rgba(0,0,0,.45) !important;
  transform: translateY(-1px);
}
nav a {
  color: #e7edf8 !important;
  border: 1px solid rgba(156,198,255,.45) !important;
  background: rgba(16,29,49,.92) !important;
  border-radius: 999px !important;
  margin: .18rem !important;
  box-shadow: none !important;
  text-decoration: none !important;
}
nav a:hover,
nav a:focus-visible {
  color: #ffffff !important;
  border-color: #9cc6ff !important;
  background: rgba(49,72,111,.95) !important;
  box-shadow: 0 0 14px rgba(105,167,255,.38) !important;
}
@media (max-width: 640px) {
  .lp, .button, .button-link, .source a { width: 100%; max-width: 100%; text-align: left; }
}


/* Polished tactile button layer — adapted from Uiverse.io by FColombati.
   Site integration note: existing action links keep their hrefs and are wrapped with
   button-outer/button-inner spans so the effect works without changing page routes. */
.lp,
.button,
.button-link {
  all: unset;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  position: relative;
  display: inline-block;
  max-width: 100%;
  border-radius: 100em;
  background-color: rgba(0, 0, 0, 0.75);
  box-shadow:
    -0.15em -0.15em 0.15em -0.075em rgba(5, 5, 5, 0.25),
    0.0375em 0.0375em 0.0675em 0 rgba(5, 5, 5, 0.1);
  margin: 0.32rem 0.55rem 0.42rem 0;
  vertical-align: middle;
  text-decoration: none;
  touch-action: manipulation;
}
.lp::before,
.button::before,
.button-link::before { content: none !important; }
.lp::after,
.button::after,
.button-link::after {
  content: "";
  position: absolute;
  z-index: 0;
  width: calc(100% + 0.3em);
  height: calc(100% + 0.3em);
  top: -0.15em;
  left: -0.15em;
  border-radius: inherit;
  background: linear-gradient(-135deg, rgba(5, 5, 5, 0.5), transparent 20%, transparent 100%);
  filter: blur(0.0125em);
  opacity: 0.25;
  mix-blend-mode: multiply;
  pointer-events: none;
}
.lp .button-outer,
.button .button-outer,
.button-link .button-outer {
  position: relative;
  z-index: 1;
  display: block;
  border-radius: inherit;
  transition: box-shadow 300ms ease;
  will-change: box-shadow;
  box-shadow:
    0 0.05em 0.05em -0.01em rgba(5, 5, 5, 1),
    0 0.01em 0.01em -0.01em rgba(5, 5, 5, 0.5),
    0.15em 0.3em 0.1em -0.01em rgba(5, 5, 5, 0.25);
}
.lp:hover .button-outer,
.lp:focus-visible .button-outer,
.button:hover .button-outer,
.button:focus-visible .button-outer,
.button-link:hover .button-outer,
.button-link:focus-visible .button-outer {
  box-shadow:
    0 0 0 0 rgba(5, 5, 5, 1),
    0 0 0 0 rgba(5, 5, 5, 0.5),
    0 0 0 0 rgba(5, 5, 5, 0.25);
}
.lp .button-inner,
.button .button-inner,
.button-link .button-inner {
  --inset: 0.035em;
  position: relative;
  z-index: 1;
  display: block;
  border-radius: inherit;
  padding: 0.84em 1.28em;
  background-image: linear-gradient(135deg, rgba(238, 242, 250, 1), rgba(178, 190, 214, 1));
  transition:
    box-shadow 300ms ease,
    clip-path 250ms ease,
    background-image 250ms ease,
    transform 250ms ease;
  will-change: box-shadow, clip-path, background-image, transform;
  overflow: clip;
  clip-path: inset(0 0 0 0 round 100em);
  box-shadow:
    0 0 0 0 inset rgba(5, 5, 5, 0.1),
    -0.05em -0.05em 0.05em 0 inset rgba(5, 5, 5, 0.25),
    0 0 0 0 inset rgba(5, 5, 5, 0.1),
    0 0 0.05em 0.2em inset rgba(255, 255, 255, 0.25),
    0.025em 0.05em 0.1em 0 inset rgba(255, 255, 255, 1),
    0.12em 0.12em 0.12em inset rgba(255, 255, 255, 0.25),
    -0.075em -0.25em 0.25em 0.1em inset rgba(5, 5, 5, 0.25);
}
.lp:hover .button-inner,
.lp:focus-visible .button-inner,
.button:hover .button-inner,
.button:focus-visible .button-inner,
.button-link:hover .button-inner,
.button-link:focus-visible .button-inner {
  clip-path: inset(
    clamp(1px, 0.0625em, 2px) clamp(1px, 0.0625em, 2px)
      clamp(1px, 0.0625em, 2px) clamp(1px, 0.0625em, 2px) round 100em
  );
  box-shadow:
    0.1em 0.15em 0.05em 0 inset rgba(5, 5, 5, 0.75),
    -0.025em -0.03em 0.05em 0.025em inset rgba(5, 5, 5, 0.5),
    0.25em 0.25em 0.2em 0 inset rgba(5, 5, 5, 0.5),
    0 0 0.05em 0.5em inset rgba(255, 255, 255, 0.15),
    0 0 0 0 inset rgba(255, 255, 255, 1),
    0.12em 0.12em 0.12em inset rgba(255, 255, 255, 0.25),
    -0.075em -0.12em 0.2em 0.1em inset rgba(5, 5, 5, 0.25);
}
.lp .button-inner span,
.button .button-inner span,
.button-link .button-inner span {
  position: relative;
  z-index: 4;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: 0.01em;
  font-weight: 700;
  font-size: 0.75rem;
  line-height: 1.2;
  color: rgba(0, 0, 0, 0);
  background-image: linear-gradient(135deg, rgba(17, 22, 36, 1), rgba(35, 72, 145, 1));
  -webkit-background-clip: text;
  background-clip: text;
  transition: transform 250ms ease;
  display: block;
  will-change: transform;
  text-shadow: rgba(0, 0, 0, 0.1) 0 0 0.1em;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  text-transform: uppercase;
}
.lp:hover .button-inner span,
.lp:focus-visible .button-inner span,
.button:hover .button-inner span,
.button:focus-visible .button-inner span,
.button-link:hover .button-inner span,
.button-link:focus-visible .button-inner span {
  transform: scale(0.975);
}
.lp:active .button-inner,
.button:active .button-inner,
.button-link:active .button-inner { transform: scale(0.975); }
.lp:focus-visible,
.button:focus-visible,
.button-link:focus-visible {
  outline: 3px solid #4d8aff !important;
  outline-offset: 4px !important;
}
@media (max-width: 640px) {
  .lp, .button, .button-link { display: block; width: 100%; margin-right: 0; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
  .lp, .button, .button-link,
  .lp *, .button *, .button-link * { transition: none !important; transform: none !important; }
}
@media print {
  .lp, .button, .button-link { display: none !important; }
}