:root{--navy:#04344c;--cyan:#b0edf9;--white:#fff;--text-soft:#ffffffd1;--header-height:74px}*{box-sizing:border-box}html{scroll-behavior:smooth;overflow-y:scroll}body{background:var(--navy);min-width:320px;color:var(--white);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}a{color:inherit}button,a{-webkit-tap-highlight-color:transparent}img{max-width:100%;display:block}:root{--navy-950:#031d2b;--navy-900:#062f45;--navy-800:#0a4760;--cyan-300:#b0edf9;--cyan-400:#7ed8e9;--surface:#082d41d1;--surface-solid:#0a3d57;--line:#b0edf92e;--muted:#ffffffb8;--shadow-lg:0 24px 70px #000c1547}body{background:radial-gradient(circle at 12% 0%, #b0edf91a, transparent 32rem), var(--navy-950)}button,input,select,textarea{font:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline-offset:3px;outline:3px solid #b0edf9a6}.site-header{z-index:50;height:var(--header-height);border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#031a28f5;position:sticky;top:0}.nav-shell{justify-content:space-between;align-items:center;gap:24px;width:min(1180px,100% - 48px);height:100%;margin:auto;display:flex}.brand{flex:none;align-items:center;width:170px;height:100%;display:inline-flex}.brand img{object-fit:contain;width:100%;max-height:54px}.main-nav{align-items:center;gap:8px;height:100%;display:flex}.main-nav a{color:#fff;white-space:nowrap;border-radius:12px;align-items:center;min-height:44px;padding:0 15px;font-size:14px;font-weight:650;text-decoration:none;display:flex;position:relative}.main-nav a:hover,.main-nav a.active{color:var(--cyan);background:#b0edf917}.main-nav a.active:after{content:"";background:var(--cyan);border-radius:999px;height:2px;position:absolute;bottom:6px;left:0;right:0}.main-nav>a.active:after{top:calc(50% + 16px);bottom:auto}.main-nav .nav-auth{margin-left:8px}.nav-profile{align-items:center;margin-left:4px;display:flex;position:relative}.profile-trigger{color:#fff;cursor:pointer;background:0 0;border:0;border-radius:14px;align-items:center;gap:9px;min-height:44px;padding:6px 10px;display:flex}.profile-trigger:hover{background:#b0edf917}.profile-avatar,.profile-avatar-img{border-radius:50%;width:38px;height:38px}.profile-avatar{background:var(--cyan);color:var(--navy);place-items:center;font-weight:800;display:grid}.profile-avatar-img{object-fit:cover;border:2px solid #ffffff8c}.profile-name{text-overflow:ellipsis;white-space:nowrap;max-width:150px;overflow:hidden}.navbar-actions{flex:none;align-self:center;align-items:center;gap:16px;height:44px;margin-left:14px;display:flex}.main-nav .navbar-notification{background:0 0;border-radius:50%;flex:0 0 42px;justify-content:center;align-items:center;width:42px;height:42px;min-height:42px;padding:0;line-height:1;display:flex}.main-nav .navbar-notification svg{flex:0 0 22px;width:22px;height:22px;display:block}.navbar-notification-count{border:2px solid var(--navy);color:#fff;background:#ff4f57;border-radius:999px;justify-content:center;align-items:center;min-width:17px;height:17px;padding:0 4px;font-size:9px;font-weight:800;line-height:1;display:flex;position:absolute;top:1px;right:0}.navbar-actions .nav-profile{height:44px;margin-left:0}.navbar-actions .profile-trigger{height:44px;padding-top:0;padding-bottom:0}.nav-toggle{color:#fff;cursor:pointer;background:0 0;border:0;display:none}.nav-toggle span{background:currentColor;width:24px;height:2px;margin:5px;display:block}.profile-dropdown{border:1px solid var(--line);min-width:190px;box-shadow:var(--shadow-lg);background:#031a28fa;border-radius:14px;padding:8px;display:none;position:absolute;top:calc(100% + 8px);right:0}.nav-profile.open .profile-dropdown{display:block}.profile-dropdown a,.profile-dropdown button{color:#fff;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:9px;width:100%;padding:10px 12px;text-decoration:none;display:block}.profile-dropdown a:hover,.profile-dropdown button:hover{color:var(--cyan);background:#b0edf917}@media (width<=900px){.nav-shell{width:calc(100% - 32px)}.nav-toggle{display:block}.main-nav{top:var(--header-height);border-top:1px solid var(--line);background:#031a28fc;flex-direction:column;align-items:stretch;gap:0;height:auto;padding:10px 20px 18px;display:none;position:absolute;left:0;right:0}.main-nav.open{display:flex}.main-nav a{min-height:46px;padding:0 6px}.main-nav a.active:after{width:70px;left:6px;right:auto}.navbar-actions{align-self:stretch;height:auto;margin-left:0}.navbar-actions .nav-profile{height:auto}.nav-profile{margin-left:0;display:block}.profile-trigger{justify-content:flex-start;width:100%}.profile-dropdown{margin-top:8px;display:none;position:static}.nav-profile.open .profile-dropdown{display:block}}@media (width<=620px){.brand{width:145px}}@media (width<=1120px){.site-header{left:0!important}.nav-shell{gap:14px;position:relative;width:calc(100% - 28px)!important}.brand{width:165px;left:0!important}.nav-toggle{color:#fff;z-index:1002;background:#b0edf914;border-radius:11px;flex-direction:column;flex:0 0 44px;justify-content:center;align-items:center;width:44px;height:44px;padding:8px;display:flex!important}.nav-toggle span{width:24px;height:2px;margin:3px 0;transition:transform .2s,opacity .2s}.nav-toggle[aria-expanded=true] span:first-child{transform:translateY(8px)rotate(45deg)}.nav-toggle[aria-expanded=true] span:nth-child(2){opacity:0}.nav-toggle[aria-expanded=true] span:nth-child(3){transform:translateY(-8px)rotate(-45deg)}.main-nav{max-height:calc(100vh - var(--header-height));-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:1000;border-top:1px solid #b0edf924;overflow-y:auto;box-shadow:0 18px 35px #00000040;background:#032334fc!important;flex-direction:column!important;align-items:stretch!important;gap:2px!important;width:auto!important;height:auto!important;padding:12px 16px 18px!important;display:none!important;position:absolute!important;top:100%!important;left:-14px!important;right:-14px!important}.main-nav.open{display:flex!important}.main-nav>a{box-sizing:border-box;border-radius:10px!important;justify-content:flex-start!important;width:100%!important;min-height:48px!important;margin:0!important;padding:0 10px!important}.main-nav>a:hover,.main-nav>a.active{background:#b0edf914!important}.main-nav>a.active:after{width:72px!important;inset:auto auto 5px 10px!important}.navbar-actions,.site-header .main-nav .navbar-actions{border-top:1px solid #b0edf91f;flex-direction:column!important;align-items:stretch!important;gap:6px!important;width:100%!important;height:auto!important;margin:8px 0 0!important;padding:10px 0 0!important;display:flex!important}.site-header .main-nav .navbar-actions .navbar-notification{gap:10px;border-radius:10px!important;flex:none!important;justify-content:flex-start!important;width:100%!important;min-width:0!important;max-width:none!important;height:46px!important;min-height:46px!important;max-height:none!important;padding:0 10px!important}.site-header .main-nav .navbar-actions .navbar-notification:after{content:"Notifikasi";font-size:14px;font-weight:650}.site-header .main-nav .navbar-actions .navbar-notification-count{transform:translateY(-50%);top:50%!important;right:10px!important}.site-header .main-nav .navbar-actions .nav-profile{width:100%!important;height:auto!important;display:block!important}.site-header .main-nav .navbar-actions .profile-trigger{justify-content:flex-start!important;width:100%!important;height:48px!important;min-height:48px!important;padding:0 10px!important}.site-header .main-nav .navbar-actions .profile-name{flex:1;justify-content:flex-start;max-width:none!important;height:auto!important}.site-header .main-nav .navbar-actions .profile-dropdown{box-sizing:border-box;margin-top:6px;width:100%!important;position:static!important}}@media (width<=560px){.brand{width:145px}}