.site-view-switcher {
  --view-bg: #f3f5ef;
  --view-line: #c9d0c3;
  --view-text: #657062;
  --view-active: #171c18;
  --view-hover: #e8ece3;
  --view-font: system-ui, sans-serif;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 0;
  border-bottom: 1px solid var(--view-line);
  background: var(--view-bg);
}
.site-view-switcher .site-view-label { color: var(--view-text); font: 500 10px/1.4 var(--view-font); padding-left: 12px; flex: 0 0 58px; }
.site-view-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: min(600px, calc(100% - 58px)); min-width: 0; }
body .site-view-switcher a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 43px;
  padding: 9px 8px;
  border-bottom: 2px solid transparent;
  color: var(--view-text);
  font: 500 11px/1.4 var(--view-font);
  letter-spacing: 0;
  text-align: center;
  text-decoration: none;
  overflow-wrap: anywhere;
}
body .site-view-switcher a:hover { color: var(--view-active); background: var(--view-hover); }
body .site-view-switcher a[aria-current="page"] { color: var(--view-active); border-bottom-color: currentColor; }
body .site-view-switcher a:focus-visible { outline: 2px solid var(--view-active); outline-offset: -5px; }
.theme-v8 .site-view-switcher { --view-font: var(--ap-mono); }
.theme-v2 .site-view-switcher {
  --view-bg: var(--crt-bg);
  --view-line: var(--amber-25);
  --view-text: var(--text-60);
  --view-active: var(--amber);
  --view-hover: var(--amber-08);
  --view-font: var(--ff-mono);
}
.theme-v2-version4 .site-view-switcher {
  --view-bg: var(--ws-deep);
  --view-line: var(--ws-border);
  --view-text: var(--ws-muted);
  --view-active: var(--ws-green);
  --view-hover: var(--ws-hover);
  --view-font: var(--ws-mono);
}
@media (max-width: 360px) {
  body .site-view-switcher a { padding-inline: 3px; }
}
@media print {
  .site-view-switcher { display: none; }
}