.site-header{position:absolute;z-index:30;top:0;right:0;left:0}
.site-nav.center-nav{position:relative;width:min(1392px,calc(100% - 48px));height:116px;min-height:116px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) 240px minmax(0,1fr);align-items:center;column-gap:clamp(24px,3.5vw,58px)}
.center-nav .brand{position:relative;z-index:2;grid-column:2;display:grid;justify-items:center;gap:7px;width:240px;justify-self:center;color:var(--ink,#151b21);text-decoration:none}
.center-nav .brand__latin{padding-left:.32em;font-size:clamp(23px,2.1vw,34px);font-weight:600;line-height:1;letter-spacing:.32em}
.center-nav .brand__rule{width:52px;height:3px;background:var(--blue,#3657ff)}
.center-nav .brand__jp{padding-left:.5em;font:500 13px/1 var(--jp,"Noto Sans JP",sans-serif);letter-spacing:.5em}
.center-nav .nav-side{display:flex;align-items:center;gap:clamp(24px,2.5vw,42px)}
.center-nav .nav-side--left{grid-column:1;grid-row:1;justify-content:flex-end}
.center-nav .nav-side--right{grid-column:3;grid-row:1;justify-content:flex-start}
.center-nav .nav-link{position:relative;display:inline-flex;width:max-content;height:24px;align-items:center;color:#4d555b;font-size:10px;font-weight:650;line-height:1;letter-spacing:.12em;text-decoration:none;text-transform:uppercase;white-space:nowrap}
.center-nav .product-menu{display:flex;height:24px;align-items:center}
.center-nav .nav-link::after{content:"";position:absolute;right:0;bottom:-8px;left:0;height:1px;background:var(--blue,#3657ff);transform:scaleX(0);transform-origin:right;transition:transform .25s ease}
.center-nav .nav-link:hover::after,.center-nav .nav-link:focus-visible::after,.center-nav .nav-link[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.center-nav .brand:focus-visible,.center-nav .nav-link:focus-visible{outline:2px solid var(--blue,#3657ff);outline-offset:7px}
.center-nav .nav-access,.center-nav .nav-join{position:absolute;z-index:5;top:50%;display:flex;height:24px;align-items:center;gap:8px;color:var(--blue,#3657ff);font-size:10px;font-weight:650;line-height:1;letter-spacing:.12em;text-decoration:none;text-transform:uppercase;transform:translateY(-50%)}
.center-nav .nav-access{left:0}.center-nav .nav-join{right:0}
.center-nav .nav-access span:first-child,.center-nav .nav-join span:first-child{position:relative}
.center-nav .nav-access span:first-child::after,.center-nav .nav-join span:first-child::after{content:"";position:absolute;right:0;bottom:-8px;left:0;height:1px;background:var(--blue,#3657ff);transform:scaleX(0);transform-origin:right;transition:transform .25s ease}
.center-nav .nav-access:hover span:first-child::after,.center-nav .nav-access:focus-visible span:first-child::after,.center-nav .nav-join:hover span:first-child::after,.center-nav .nav-join:focus-visible span:first-child::after{transform:scaleX(1);transform-origin:left}
.center-nav .nav-access span:last-child,.center-nav .nav-join span:last-child{display:inline-grid;width:12px;height:12px;place-items:center;color:currentColor;font-size:12px;line-height:12px}
.center-nav .nav-access:focus-visible,.center-nav .nav-join:focus-visible{outline:2px solid var(--blue,#3657ff);outline-offset:7px}
html[data-theme="dark"] .center-nav .nav-link{color:#d4dade}
html[data-theme="dark"] .center-nav .nav-access,html[data-theme="dark"] .center-nav .nav-join{color:#8fa3ff}
/* Reserve separate columns so tablet actions align without covering navigation links. */
@media(min-width:801px) and (max-width:1279px){
  .site-nav.center-nav{width:calc(100% - 32px);grid-template-columns:124px minmax(0,1fr) clamp(148px,16vw,200px) minmax(0,1fr) 124px;column-gap:clamp(8px,1.2vw,15px)}
  .site-nav.center-nav .brand{grid-column:3;grid-row:1;width:100%}
  .site-nav.center-nav .brand__latin{font-size:clamp(19px,2vw,24px);letter-spacing:.24em;padding-left:.24em}
  .site-nav.center-nav .nav-side{gap:clamp(10px,1.3vw,16px)}
  .site-nav.center-nav .nav-side--left{grid-column:2}
  .site-nav.center-nav .nav-side--right{grid-column:4}
  .site-nav.center-nav .nav-access,.site-nav.center-nav .nav-join{position:static;grid-row:1;height:44px;min-height:44px;box-sizing:border-box;transform:none;white-space:nowrap}
  .site-nav.center-nav .nav-access{grid-column:1;justify-self:start}
  .site-nav.center-nav .nav-join{grid-column:5;justify-self:end;padding:0 12px}
  .site-nav.center-nav .nav-link,.site-nav.center-nav .nav-access,.site-nav.center-nav .nav-join{font-size:clamp(11px,1vw,12px);letter-spacing:.03em}
}
@media(max-width:800px){.center-nav .nav-access,.center-nav .nav-join{display:none}}
@media(max-width:800px){
  .site-header{position:fixed;z-index:200;top:0;right:0;left:0;pointer-events:none}
  .site-nav.center-nav[data-mobile-nav]{width:calc(100% - 24px);height:62px;min-height:62px;margin:12px auto 0;display:block;border:1px solid transparent;background:transparent;box-shadow:none;pointer-events:auto;transition:border-color .3s ease,background-color .3s ease,box-shadow .3s ease}
  .center-nav .nav-side{display:none!important}
  .center-nav .brand{position:absolute;top:50%;left:50%;width:154px;gap:5px;justify-items:center;transform:translate(-50%,-50%)}
  .center-nav .brand__latin{font-size:17px}.center-nav .brand__rule{width:34px;height:2px}.center-nav .brand__jp{font-size:8px}
  .site-nav.center-nav.mobile-nav-scrolled{border-color:var(--line,rgba(21,27,33,.16));background:rgba(247,245,241,.92);box-shadow:0 12px 36px rgba(21,27,33,.08);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
  .site-nav.center-nav.mobile-nav-open{backdrop-filter:none;-webkit-backdrop-filter:none}
  html[data-theme="dark"] .site-nav.center-nav.mobile-nav-scrolled{border-color:rgba(247,245,241,.18);background:rgba(16,21,26,.92);box-shadow:0 12px 36px rgba(0,0,0,.28)}
}
@media(max-width:420px){.center-nav .brand{width:150px}}
@media(prefers-reduced-motion:reduce){.center-nav .product-menu__trigger,.center-nav .nav-link::after,.center-nav .nav-access span:first-child::after,.center-nav .nav-join span:first-child::after{transition:none}}
