
/* Shared, lightweight and accessible navigation – applies to all pages */
.lc-topbar{position:sticky;top:0;z-index:99;width:100%;padding:9px 12px;background:rgba(236,247,255,.92);border-bottom:1px solid #bfdcf4;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);box-shadow:0 4px 18px rgba(9,48,96,.08);direction:rtl;color:#123867}
body.dark .lc-topbar{background:rgba(8,20,40,.96);border-color:#214672;color:#e7f7ff}
.lc-topbar *{box-sizing:border-box}
.lc-topbar-row{width:min(1250px,100%)!important;max-width:1250px!important;margin-inline:auto!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:18px!important;min-height:52px!important;flex-direction:row!important}
.lc-topbar a{text-decoration:none!important}
.lc-topbar-brand{display:flex;align-items:center;gap:9px;direction:ltr;color:inherit!important;font:900 17px/1.1 Arial,Tahoma,sans-serif;white-space:nowrap;flex:none}
.lc-topbar-brand img{width:42px;height:42px;border-radius:12px;object-fit:contain;background:#133768}
.lc-topbar-brand b{color:#0aa4ed}
.lc-topbar-primary{display:flex!important;flex:1;align-items:center;justify-content:center;gap:2px;min-width:0;white-space:nowrap}
.lc-topbar-primary a{font:850 13px/1.4 Tahoma,Arial,sans-serif!important;color:inherit!important;padding:11px 10px;border-radius:12px;transition:background .15s}
.lc-topbar-primary a.active,.lc-topbar-primary a:hover{background:rgba(25,143,235,.13)!important;color:#0872d2!important}
.lc-topbar-actions{display:flex;align-items:center;gap:8px;flex:none}
.lc-topbar-discord{border-radius:12px;padding:11px 14px;background:#0c68c8!important;color:white!important;font:800 13px/1 Tahoma,Arial,sans-serif;white-space:nowrap}
.lc-topbar-toggle{display:flex;align-items:center;gap:8px;padding:10px 14px;background:rgba(30,127,218,.10);border:1px solid rgba(25,126,215,.3);border-radius:12px;color:inherit;cursor:pointer;font:850 13px/1.25 Tahoma,Arial,sans-serif;white-space:nowrap}
.lc-topbar-toggle:hover,.lc-topbar-toggle[aria-expanded=true]{background:rgba(25,143,235,.2)}
.lc-topbar-toggle span:first-child{font-size:20px;line-height:.8}
.lc-topbar-menu[hidden]{display:none!important}
.lc-topbar-menu{position:absolute;top:calc(100% + 5px);left:max(12px,calc((100vw - 1250px)/2));width:min(420px,calc(100vw - 24px));max-height:min(73vh,580px);overflow:auto;padding:13px;background:#f4faff;border:1px solid #bbdcf8;border-radius:19px;box-shadow:0 22px 55px rgba(8,35,75,.24);direction:rtl}
body.dark .lc-topbar-menu{background:#10213b;border-color:#305987}
.lc-topbar-menu>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.lc-topbar-menu a{display:flex;align-items:center;min-height:45px;padding:9px 12px;border-radius:11px;background:rgba(33,135,234,.06);font:800 13px/1.55 Tahoma,Arial,sans-serif;color:inherit!important}
.lc-topbar-menu a:hover,.lc-topbar-menu a:focus-visible{background:rgba(30,151,240,.19);outline-color:#278ce7}
@media(max-width:1130px){.lc-topbar-primary{display:none!important}}
@media(max-width:590px){.lc-topbar{padding:6px 10px}.lc-topbar-row{min-height:46px!important;gap:8px!important}.lc-topbar-brand{font-size:14px}.lc-topbar-brand img{height:35px;width:35px}.lc-topbar-discord{display:none}.lc-topbar-toggle{padding:9px 12px}.lc-topbar-menu{left:9px;width:calc(100vw - 18px);max-height:75vh}}
@media(max-width:350px){.lc-topbar-menu>div{grid-template-columns:1fr}.lc-topbar-brand{font-size:12px}}
@media(prefers-reduced-motion:reduce){.lc-topbar *{transition:none!important}}

/* Warden palette for shared navigation. */
body .lc-topbar, body.dark .lc-topbar {
  color: #e8f6fb;
  background: #091822;
  border-color: #265064;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body .lc-topbar-menu, body.dark .lc-topbar-menu {
  color: #e8f6fb;
  background: #102633;
  border-color: #346173;
}
.lc-topbar .lc-topbar-brand b {color:#6ce6ef}
.lc-topbar .lc-topbar-primary a.active,
.lc-topbar .lc-topbar-primary a:hover {
  background: #143b4a!important;
  color: #a6f6fd!important;
}

/* Compact Warden and ice portal artwork for the shared navigation. */
.lc-warden-badge {
  display: block;
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  background: url("warden-ice-badge.webp?v=40") center / contain no-repeat;
}
@media (max-width: 590px) {
  .lc-warden-badge {width: 36px;height: 36px}
}
