/* Shared icon rail for every page. Keep page layout rules in their own CSS. */
:root{--site-rail-width:56px;--site-rail-target:44px;--site-rail-icon:22px;--site-rail-gap:12px;--site-rail-padding:20px;--rail:var(--site-rail-width)}
body.at-has-rail{--at-rail:var(--site-rail-width)}
nav.site-rail{position:fixed;inset:0 auto 0 0;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;gap:var(--site-rail-gap);width:var(--site-rail-width);padding:calc(var(--site-rail-padding) + env(safe-area-inset-top)) 0 calc(var(--site-rail-padding) + env(safe-area-inset-bottom));border:0;background:#fafaf7;color:#202320;box-shadow:none;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none}
nav.site-rail::-webkit-scrollbar{display:none}
nav.site-rail>:is(a,button){position:relative;box-sizing:border-box;display:grid;place-items:center;flex:0 0 var(--site-rail-target);width:var(--site-rail-target);height:var(--site-rail-target);min-height:var(--site-rail-target);margin:0;padding:0;gap:0;border:0;border-radius:0;background:transparent;color:inherit;font:inherit;text-decoration:none;text-align:center;line-height:1;letter-spacing:normal;cursor:pointer;transition:opacity .15s ease;-webkit-tap-highlight-color:transparent}
nav.site-rail>:is(a,button)>svg,nav.site-rail>:is(a,button)[aria-current=page]>svg{display:block;flex:none;box-sizing:border-box;width:var(--site-rail-icon);height:var(--site-rail-icon);margin:0;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
nav.site-rail>:is(a,button)[aria-current=page]{background:transparent;color:#202320}
nav.site-rail>:is(a,button)[aria-current=page]::before{content:'';position:absolute;left:-2px;top:50%;bottom:auto;width:2px;height:20px;transform:translateY(-50%);background:currentColor}
nav.site-rail>:is(a,button):hover:not(:disabled){background:transparent;opacity:.65}
nav.site-rail>:is(a,button):disabled{opacity:.28;cursor:default}
nav.site-rail>:is(a,button):focus-visible{outline:2px solid #496858;outline-offset:-2px}
nav.site-rail>.rail-bottom{margin-top:auto}
nav.site-rail>.at-dyla-link{font-family:'AQ DIN','D-DIN','Arial Narrow',Arial,sans-serif;font-size:17px;font-weight:400;letter-spacing:.03em;line-height:1}
nav.site-rail>.at-dyla-link>span{display:block;white-space:nowrap;transform:scaleX(.78);transform-origin:center}
/* Captions sit inside the existing targets, leaving every icon in place. */
nav.site-rail>:is(a,button)::after{content:var(--at-rail-caption,none);position:absolute;left:0;bottom:0;width:100%;font:400 7px/1 'AQ DIN',Arial,sans-serif;letter-spacing:.06em;white-space:nowrap;color:inherit;pointer-events:none}
nav.site-rail>:is([data-at-view=choose],[aria-label="地図"],[aria-label="Map"]){--at-rail-caption:'MAP'}
nav.site-rail>:is([data-at-view=plan],[aria-label="旅程表"]){--at-rail-caption:'PLAN'}
nav.site-rail>:is([data-at-view=recommend],[aria-label="おすすめルート"]){--at-rail-caption:'ROUTES'}
nav.site-rail>:is([data-at-view=countries],[aria-label="国を知る"]){--at-rail-caption:'GUIDE'}
nav.site-rail>[data-at-view=style]{--at-rail-caption:'STYLE'}
nav.site-rail>:is([data-at-reset],#photo-reset){--at-rail-caption:'RESET'}
@media(max-height:760px){:root{--site-rail-gap:6px;--site-rail-padding:12px}}
@media(max-height:650px){:root{--site-rail-gap:2px;--site-rail-padding:8px}}
@media(prefers-reduced-motion:reduce){nav.site-rail>:is(a,button){transition:none}}
@media print{nav.site-rail{display:none!important}}