/* Small, accessible three-era navigation shared by Latest, V1 and V2.
   Intentionally scoped: archived Tailwind and current Portfolio CSS stay intact. */
#portfolio-version-switcher {
  position:fixed; right:18px; top:97px; z-index:70;
  width:fit-content; max-width:calc(100vw - 24px);
  display:flex; flex-direction:column; align-items:flex-start; gap:7px;
  padding:12px 13px 11px; border-radius:16px;
  border:1px solid rgba(185,248,225,.28);
  background:rgba(8,18,28,.91); color:#e9fff6;
  box-shadow:0 12px 36px rgba(0,0,0,.32);
  -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px);
  font:600 11px/1.4 system-ui,-apple-system,"Anuphan",sans-serif;
  letter-spacing:normal; isolation:isolate; box-sizing:border-box;
}
#portfolio-version-switcher * { box-sizing:border-box; }
#portfolio-version-switcher .version-label {
  display:flex; align-items:center; gap:7px;
  color:#a9dbc9; font-size:9px; font-weight:750;
  letter-spacing:.13em; text-transform:uppercase;
}
#portfolio-version-switcher .version-label::before {
  content:""; width:6px; height:6px; background:#b5f6db; border-radius:50%;
  box-shadow:0 0 0 3px rgba(181,246,219,.1);
}
#portfolio-version-switcher .version-links {
  display:flex; gap:3px; align-items:center;
  padding:3px; border-radius:11px; background:rgba(255,255,255,.07);
}
#portfolio-version-switcher a {
  display:inline-flex; justify-content:center; align-items:center;
  min-width:48px; min-height:30px; padding:6px 12px;
  border:0; border-radius:8px; color:#d5e4e7;
  background:transparent; text-decoration:none;
  font:750 11px/1.2 system-ui,-apple-system,"Anuphan",sans-serif;
  white-space:nowrap; transition:background .18s,color .18s;
}
#portfolio-version-switcher a:hover {
  background:rgba(181,246,219,.13); color:#fff;
}
#portfolio-version-switcher a[aria-current="page"] {
  background:#b5f6db; color:#0a1a20; pointer-events:none;
  box-shadow:0 2px 8px rgba(0,0,0,.17);
}
#portfolio-version-switcher a:focus-visible {
  outline:2px solid #d3fff0;outline-offset:3px;
}
#portfolio-version-switcher .version-hint {
  color:#c9d8d6; font-size:10px; font-weight:500;
  opacity:.85; margin:0;
}
@media(max-width:520px) {
  #portfolio-version-switcher {
    right:10px; top:94px;
    padding:6px; gap:0; border-radius:12px;
  }
  #portfolio-version-switcher a {min-width:43px;min-height:30px;padding:5px 9px}
  #portfolio-version-switcher .version-label,
  #portfolio-version-switcher .version-hint {display:none}
}
@media(prefers-reduced-motion:reduce) {
  #portfolio-version-switcher a { transition:none; }
}
@media print {#portfolio-version-switcher {display:none!important}}