/* V7 — a quiet in-place view switcher. Content changes; the page doesn't navigate. */
.switcher-caption { display:flex; justify-content:space-between; align-items:center; gap:24px; margin-bottom:14px; }
.switcher-caption-note { color:var(--text-muted); font-size:.86rem; }
.swap-tabs { display:flex; align-items:stretch; gap:8px; min-width:0; max-width:100%; overflow-x:auto; overflow-y:hidden; scrollbar-width:none; border-bottom:1px solid var(--border); -webkit-overflow-scrolling:touch; }
.swap-tabs::-webkit-scrollbar { display:none; }
.swap-tabs button { appearance:none; position:relative; display:inline-flex; align-items:center; gap:12px; flex:0 0 auto; min-height:58px; padding:14px 20px 17px; border:0; border-radius:0; background:none; color:#737373; font:500 .98rem/1.25 var(--font); letter-spacing:-.015em; cursor:pointer; white-space:nowrap; transition:color .2s ease; }
.swap-tabs button:first-child { padding-left:0; }
.swap-tabs button::after { content:""; position:absolute; bottom:0; left:20px; right:20px; height:2px; transform:scaleX(0); transform-origin:center; background:var(--accent); transition:transform .24s var(--ease); }
.swap-tabs button:first-child::after { left:0; }
.swap-tabs button[aria-selected="true"] { color:var(--text); font-weight:600; }
.swap-tabs button[aria-selected="true"]::after { transform:scaleX(1); }
.swap-tabs button:not([aria-selected="true"]):hover { color:var(--accent); }
.swap-tabs button:focus-visible { outline:2px solid var(--accent); outline-offset:-4px; border-radius:5px; }
.swap-index { font-size:.69rem; letter-spacing:.06em; font-variant-numeric:tabular-nums; color:#aaa; font-weight:500; }
.swap-tabs button[aria-selected="true"] .swap-index { color:var(--accent); }
.swap-panels > [role="tabpanel"][hidden] { display:none!important; }
.swap-panels > [role="tabpanel"]:not([hidden]) { animation:quiet-appear .2s ease-out both; }
@keyframes quiet-appear { from {opacity:.45;} to {opacity:1;} }
@media (max-width:650px) {
  .switcher-caption { flex-wrap:wrap; row-gap:3px; }
  .switcher-caption-note { font-size:.79rem; }
  .swap-tabs { gap:5px; margin-right:calc(-1 * var(--gutter)); padding-right:var(--gutter); }
  .swap-tabs button { min-height:54px; padding:13px 15px 15px; gap:7px; font-size:.9rem; }
  .swap-tabs button::after { left:15px; right:15px; }
  .swap-index { font-size:.66rem; }
}
@media(prefers-reduced-motion:reduce) {
  .swap-tabs button,.swap-tabs button::after { transition:none; }
  .swap-panels > [role="tabpanel"]:not([hidden]) { animation:none; }
}