/* One navigation design across routes; a drawer on smaller screens */
:root{--rail-width:240px}
#app{display:block!important;padding-left:240px!important}
#app>#workspace{height:100%!important;width:100%;min-width:0;padding:16px!important}
#game-navigation{position:fixed!important;inset:0 auto 0 0!important;display:flex!important;flex-direction:column!important;gap:0;width:240px!important;height:100dvh!important;padding:20px 14px 16px!important;background:#0d1c29!important;border:0;border-right:1px solid #284252;box-shadow:none;overflow-x:hidden!important;overflow-y:auto!important;scrollbar-width:thin;z-index:50;box-sizing:border-box}
#game-navigation .site-header{background:none;border:0;flex:none}
#game-navigation .header-inner{display:block!important;width:100%;height:auto!important;padding:0 4px 28px!important;margin:0;max-width:none}
#game-navigation .brand{display:flex;align-items:center;justify-content:flex-start;gap:10px;min-width:0;width:100%}
#game-navigation .brand-wordmark{display:block!important;min-width:0;white-space:nowrap;color:#dff5ff}
#game-navigation .brand-wordmark strong{font:750 10.5px/1.2 'Segoe UI',sans-serif;letter-spacing:.2px;white-space:nowrap}
#game-navigation .brand small{display:none!important}
#game-navigation .portrait-help{flex:0 0 48px;min-width:48px;min-height:48px;width:48px;height:48px}
#game-navigation .brand-portrait{display:block;width:48px!important;height:48px!important;border-radius:14px!important;object-fit:cover}
#game-navigation .portrait-hint{display:flex!important}
#game-navigation .navigation-bar{position:static!important;background:none;border:0;margin:0 0 20px;padding:0;flex:none;width:100%}
#game-navigation #primary-nav{display:flex!important;flex-direction:column!important;gap:8px;min-height:0;max-width:none;margin:0}
#game-navigation #primary-nav a{display:flex;flex-direction:row!important;align-items:center;justify-content:flex-start;gap:12px!important;padding:14px 16px!important;min-height:54px!important;height:auto;font-size:15px!important;line-height:22px;font-weight:650;color:#a9c0ce;border:1px solid transparent;border-radius:12px;white-space:nowrap;box-sizing:border-box}
#game-navigation #primary-nav a>small{display:none!important}
#game-navigation #primary-nav a>span{display:block!important;white-space:nowrap}
#game-navigation #primary-nav .icon{width:19px!important;height:19px!important;flex:none}
#game-navigation #primary-nav a:hover:not(.active){background:#172e3f;border-color:#2e5267;color:#ecfaff;box-shadow:none}
#game-navigation #primary-nav a.active{background:linear-gradient(110deg,#8deeff,#40d8fb);border-color:#a0f3ff;color:#092737;box-shadow:0 4px 20px #42d9ff12,inset 0 1px #d6fbff8a}
#game-navigation .rail-help{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:46px;padding:10px 14px;margin:18px 0 0;font-size:15px;color:#9cdceb;border:1px solid #294c60;border-radius:12px;background:transparent;white-space:nowrap;box-sizing:border-box}
#game-navigation .rail-help span{display:inline!important;font-size:14px;white-space:nowrap}
#game-navigation .rail-footer{display:block!important;margin-top:auto!important;padding:16px 0 0!important;border-top:1px solid #294150;flex:none;width:100%}
#game-navigation .header-actions{display:grid!important;grid-template-columns:minmax(0,1fr) 42px;flex-direction:row!important;gap:8px;align-items:center;width:100%}
#game-navigation #wallet{display:flex;align-items:center;justify-content:center;gap:6px;width:100%!important;min-width:0;height:44px;min-height:44px;padding:8px!important;font-size:12px!important;white-space:nowrap!important;border-radius:10px}
#game-navigation #wallet .icon{width:17px!important;height:17px!important;flex:none}
#game-navigation #mute{width:42px;height:44px;min-height:44px;padding:10px;border-radius:10px;border:1px solid #294c60}
#game-navigation .navigation-heading,#mobile-navigation-bar,#navigation-shade{display:none}
@media(max-width:900px){
 #app{padding-left:0!important;padding-top:52px!important}
 #app>#workspace{padding:10px!important}
 #mobile-navigation-bar{position:fixed;inset:0 0 auto 0;height:52px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;gap:14px;background:#0d1c29;border-bottom:1px solid #284252;z-index:39;box-sizing:border-box}
 #mobile-navigation-bar>span{font-size:14px;font-weight:700;color:#dff5ff}
 #menu-toggle{display:flex;align-items:center;gap:8px;min-height:40px;background:none;border:0;padding:6px 10px;color:#8ce9fa;font-size:14px}
 #menu-toggle>span{font-size:20px}
 #game-navigation{width:240px!important;max-width:calc(100vw - 36px);transform:translateX(-100%);visibility:hidden;transition:transform .18s ease,visibility .18s;padding-top:12px!important;z-index:60;box-shadow:15px 0 50px #0006}
 #game-navigation[data-open=true]{transform:translateX(0);visibility:visible}
 #game-navigation .navigation-heading{display:flex;align-items:center;justify-content:space-between;height:38px;flex:none;margin-bottom:12px;color:#80adbf;font-size:11px;letter-spacing:.12em}
 #menu-close{display:flex;align-items:center;justify-content:center;width:38px;min-height:38px;background:none;border:0;color:#b9edfa;font-size:26px;padding:0}
 #game-navigation .header-inner{padding-bottom:22px!important}
 #navigation-shade:not([hidden]){display:block;position:fixed;inset:0;background:#020912a6;backdrop-filter:blur(3px);z-index:55}
 #toast{left:50%!important;max-width:calc(100vw - 24px)}
}
@media(max-height:520px){#game-navigation{padding-top:12px!important;padding-bottom:12px!important}#game-navigation .header-inner{padding-bottom:14px!important}#game-navigation #primary-nav{gap:5px}#game-navigation #primary-nav a{min-height:46px!important;padding:10px 16px!important}#game-navigation .rail-help{margin-top:10px}#game-navigation .navigation-bar{margin-bottom:14px}#game-navigation .rail-footer{padding-top:12px!important}}
@media(prefers-reduced-motion:reduce){#game-navigation{transition:none}}
