.portfolio-mode-switch{--mode-ink:var(--neutral-01,#171717);--mode-line:color-mix(in srgb,var(--mode-ink) 30%,transparent);--mode-active:var(--color-01,#171717);--mode-active-ink:var(--neutral-04,#fff);display:inline-flex;flex:0 0 auto;align-items:center;gap:3px;padding:3px;border:1px solid var(--mode-line);border-radius:9px;font:500 12px/1.3 'DM Sans',sans-serif;margin:0}
.portfolio-mode-switch a{display:flex;align-items:center;justify-content:center;min-height:32px;padding:7px 12px;border-radius:6px;color:var(--mode-ink);text-decoration:none!important;white-space:nowrap;transition:background-color .2s,color .2s}
.portfolio-mode-switch a[aria-current=page]{background:var(--mode-active);color:var(--mode-active-ink);font-weight:600}
.portfolio-mode-switch a:focus-visible{outline:2px solid var(--mode-active);outline-offset:3px}
.simple-view .portfolio-mode-switch{--mode-ink:var(--simple-ink);--mode-line:var(--simple-line);--mode-active:var(--simple-ink);--mode-active-ink:var(--simple-paper)}
.portfolio-navigation-open .portfolio-mode-switch{visibility:hidden}
@media(max-width:767px){.portfolio-mode-switch{font-size:11px}.portfolio-mode-switch a{padding:6px 8px;min-height:30px}.header .nav-wrapper{gap:10px}.header .nav-logo{flex:1;min-width:0;margin-right:auto;white-space:normal}.header .portfolio-full-name{font-size:18px;white-space:normal;line-height:1.15}.header .portfolio-menu-trigger{flex-shrink:0}}
@media(prefers-reduced-motion:reduce){.portfolio-mode-switch a{transition:none}}
.simple-header .portfolio-mode-switch{display:inline-flex;gap:3px;flex-wrap:nowrap;font-size:12px;max-width:none;justify-content:flex-start}
@media(max-width:767px){.simple-header .portfolio-mode-switch{font-size:11px}}