/* Shared gulum.net header: same height, layout and navigation on all pages. */
.topbar{position:sticky;top:0;z-index:50;background:#0b1020f2;border-bottom:1px solid #ffffff16;backdrop-filter:blur(16px)}
.topbar .nav{height:76px;display:flex;align-items:center;gap:24px;position:relative}
.topbar .logo{flex-shrink:0;font:800 27px Outfit,sans-serif;letter-spacing:-1.2px;white-space:nowrap}
.topbar .nav nav{display:flex;align-items:center;gap:4px;flex:1;min-width:0;font-size:13px;font-weight:700}
.topbar .nav nav a{display:inline-flex;align-items:center;justify-content:center;padding:11px 10px;border-radius:11px;color:#c4cbe1;white-space:nowrap;transition:background .15s,color .15s}
.topbar .nav nav a:hover,.topbar .nav nav a[aria-current="page"]{background:#6e4ad060;color:#fff}
.topbar .nav .nav-cta{flex-shrink:0;margin-left:auto;padding:10px 13px;border-radius:12px;border:1px solid #ffffff2c;font-size:13px;font-weight:700;white-space:nowrap}
.topbar .nav .nav-cta[aria-current="page"]{background:#6e4ad060;border-color:#8d72ec}
.topbar .nav .menu-toggle{display:none;flex-shrink:0}
.topbar .notify-widget{flex-shrink:0;margin-left:0}
@media(max-width:1050px){.topbar .nav{gap:12px}.topbar .logo{font-size:24px}.topbar .nav nav a{padding:10px 7px;font-size:12px}}
@media(max-width:850px){.topbar .nav{height:68px;gap:12px}.topbar .nav .menu-toggle{display:block;order:3;margin-left:0;border:1px solid #ffffff35;border-radius:10px;padding:6px 11px;background:#20243e;color:#fff;font-size:21px;cursor:pointer}.topbar .nav nav{display:none;position:absolute;top:68px;left:0;right:0;flex-direction:column;align-items:stretch;gap:4px;padding:12px;background:#151b31;border:1px solid #ffffff20;border-radius:0 0 15px 15px;box-shadow:0 16px 30px #0006}.topbar .nav nav.open{display:flex}.topbar .nav nav a{justify-content:flex-start;padding:13px 14px;font-size:14px}.topbar .nav .nav-cta{display:inline-flex;margin-left:auto;font-size:12px;padding:9px 10px}.topbar .notify-widget{order:2}}
@media(max-width:440px){.topbar .logo{font-size:21px}.topbar .nav{gap:8px}.topbar .nav .nav-cta{font-size:11px;padding:8px}.topbar .nav .menu-toggle{padding:5px 8px}}

/* Keep navigation and notification bell in the same row on every page. */
.topbar .nav{gap:14px}
.topbar .nav nav{gap:2px}
.topbar .nav .notify-widget{position:relative;flex:0 0 auto;margin-left:0;z-index:60}
.topbar .nav .notify-panel{position:absolute;right:0;left:auto;top:calc(100% + 12px);width:min(370px,calc(100vw - 24px));max-height:65vh;overflow:auto;white-space:normal}
.topbar .nav .notify-panel[hidden]{display:none!important}
@media(max-width:1050px){.topbar .nav{gap:9px}.topbar .nav nav a{padding:10px 6px}}
@media(max-width:850px){.topbar .nav .notify-panel{position:fixed;right:12px;top:72px;width:calc(100vw - 24px)}}

/* Authenticated user avatar in the shared navigation */
.topbar .nav .nav-cta.is-avatar{width:43px;height:43px;min-width:43px;min-height:43px;box-sizing:border-box;padding:0;border-radius:12px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#24253f;border:1px solid #44436b;line-height:1}
.topbar .nav .nav-cta.is-avatar img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.topbar .nav .nav-cta.is-avatar .nav-avatar-fallback{font-size:23px;color:#d7c7ff}
@media(max-width:440px){.topbar .nav .nav-cta.is-avatar{width:40px;height:40px;min-width:40px;min-height:40px;padding:0}}

/* V4.4.1: own profile settings shortcut next to username */
.player-name-settings{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.player-name-settings h1{margin:0}
.profile-settings-link{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;flex:0 0 38px;border:1px solid #62588d;border-radius:11px;background:#2b294d;color:#f2eaff;text-decoration:none;font-size:22px;transition:background .15s}
.profile-settings-link:hover,.profile-settings-link:focus-visible{background:#6647bf;outline:2px solid #a58aff;outline-offset:2px}
.profile-settings-link[hidden]{display:none!important}
