:root{--netlog-navy:#10265c;--netlog-yellow:#ffbf0b;--netlog-border:rgba(133,164,203,.22)}
body{background-color:#07172c;background-image:linear-gradient(100deg,rgba(3,13,30,.93) 0%,rgba(8,25,49,.84) 48%,rgba(7,24,46,.73) 100%),url('/brand/netlog-flags.jpg');background-size:cover;background-position:center top;background-attachment:fixed}
.shell{background:transparent}.shell>aside{background:rgba(5,16,34,.94);border-right:1px solid rgba(123,155,199,.18);backdrop-filter:blur(18px)}.shell>main{position:relative;background:linear-gradient(180deg,rgba(8,23,44,.25),rgba(5,17,34,.58))}
.brand{padding:0 8px;letter-spacing:0}.netlog-logo-plate{display:flex;align-items:center;justify-content:center;background:#fff;border-radius:12px;padding:13px 12px;box-shadow:0 8px 26px #0002;border-bottom:3px solid var(--netlog-yellow)}.netlog-logo-plate img{display:block;width:100%;height:auto;max-width:172px;aspect-ratio:3.55;object-fit:contain}.brand .sub{font-size:9px;letter-spacing:1.6px;line-height:1.6;margin-top:12px;color:#b7c6dc;text-align:center}
.shell>main>header{position:relative;overflow:hidden;isolation:isolate;background-image:linear-gradient(90deg,rgba(5,20,43,.96) 0%,rgba(9,30,59,.84) 43%,rgba(12,35,65,.26) 100%),url('/brand/netlog-flags.jpg');background-size:cover;background-position:center 36%;border:1px solid rgba(139,166,200,.32);border-bottom:3px solid var(--netlog-yellow);border-radius:16px;padding:28px 27px;min-height:230px;box-shadow:0 20px 50px #0003;margin-bottom:24px}
.shell>main>header::after{content:'NETLOG';position:absolute;right:15px;bottom:-21px;font-size:90px;font-weight:900;letter-spacing:8px;line-height:1;color:rgba(255,255,255,.07);z-index:-1;pointer-events:none}.shell>main>header>.eyebrow{color:#d8e5f5}.shell>main>header .eyebrow{color:#f6cf61;letter-spacing:1.6px;font-size:10px}.shell>main>header h1{color:#fff;font-size:29px;line-height:1.2;max-width:540px}.shell>main>header .statusline{color:#c6d4e8}.shell>main>header [data-account-open]{background:rgba(10,31,63,.88);border-color:rgba(255,200,44,.5);color:#ffe08b}.shell>main>header>.header-status{background:rgba(5,20,41,.78);border:1px solid rgba(183,208,236,.24);border-radius:10px;padding:16px;backdrop-filter:blur(10px)}.shell>main>header .time{color:#c0cde0}
.nav button.active{background:linear-gradient(90deg,rgba(255,191,11,.15),rgba(255,191,11,.04));border-left-color:var(--netlog-yellow);color:#ffdb76}.nav button:hover{color:#f3dc9a}.stat,.card,.panel,.history-panel{background:rgba(12,29,51,.95);border-color:var(--netlog-border);box-shadow:0 12px 28px rgba(0,0,0,.12)}.stat{background:linear-gradient(125deg,rgba(20,43,75,.97),rgba(10,28,49,.95))}.card-head{border-color:rgba(129,162,204,.18)}.card-foot{background:rgba(5,21,42,.82)}.card:hover{border-color:rgba(255,199,46,.7)}.notice{background:rgba(11,30,54,.91);border-color:rgba(147,174,208,.25)}.footer{color:#9aaec8}.netlog-credit{margin-top:6px;font-size:9px;letter-spacing:1.4px;color:#7690b0}.hist-chart{background:rgba(6,19,36,.94)}
body.login-page{background-image:linear-gradient(100deg,rgba(5,17,37,.9),rgba(7,29,57,.55)),url('/brand/netlog-flags.jpg');background-position:center center}.login-page main{background:rgba(7,23,45,.95);backdrop-filter:blur(20px);border:1px solid rgba(161,184,216,.3);border-top:4px solid var(--netlog-yellow);box-shadow:0 30px 100px #0007}.login-brand{background:#fff;border-radius:12px;padding:17px 22px;margin:0 0 22px;border-bottom:3px solid var(--netlog-yellow)}.login-brand img{display:block;width:100%;height:auto}.login-caption{font-size:10px;color:#f7ce69;letter-spacing:2px}.login-page button{background:var(--netlog-yellow);color:#0f265a}.login-page input:focus{outline-color:var(--netlog-yellow)}
@media(max-width:1150px){.shell>main>header{padding:24px;min-height:220px}.shell>main>header h1{font-size:25px}.brand{padding:0}.brand .sub{font-size:8px}}
@media(max-width:750px){body{background-attachment:scroll}.shell>aside{background:rgba(5,18,37,.96)}.netlog-logo-plate{padding:8px 9px;border-radius:8px;max-width:132px}.netlog-logo-plate img{max-width:114px}.brand .sub{font-size:7px;letter-spacing:1px;text-align:left;margin-top:6px}.shell>main>header{min-height:280px;padding:23px 18px;display:block;background-position:62% 30%;background-image:linear-gradient(90deg,rgba(5,20,43,.96),rgba(7,26,50,.71)),url('/brand/netlog-flags.jpg')}.shell>main>header h1{font-size:25px;max-width:310px}.shell>main>header>.header-status{padding:10px 12px;display:inline-block;margin-top:20px}.shell>main>header::after{font-size:66px;bottom:-12px;right:8px;letter-spacing:4px}.shell>main>header .live{max-width:none}.shell>main>header .time{text-align:left;max-width:none;font-size:10px}.shell>main>header .eyebrow{font-size:8px}.nav button.active{border-bottom-color:var(--netlog-yellow)}.login-page main{padding:26px}}
body::after{content:'';position:fixed;right:3vw;bottom:4vh;width:min(450px,45vw);height:140px;background:url('/brand/netlog-logo.png') center/contain no-repeat;opacity:.075;mix-blend-mode:screen;pointer-events:none;z-index:0}.shell{position:relative;z-index:1}.login-page::after{display:none}@media(max-width:750px){body::after{width:70vw;height:100px;bottom:100px}}

/* User supplied full viewport background */
body,body.login-page{background-image:linear-gradient(90deg,rgba(3,13,30,.50),rgba(7,24,46,.28)),url('/brand/netlog-background.jpg');background-position:center center;background-size:cover;background-attachment:fixed;min-height:100vh}
body::before{content:'';position:fixed;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(3,13,30,.50),rgba(7,24,46,.28)),url('/brand/netlog-background.jpg') center center/cover no-repeat;pointer-events:none}
body::after{display:none}.shell>main{background:transparent}.shell>main>header{background-image:linear-gradient(90deg,rgba(5,20,43,.80),rgba(7,26,50,.42));background-color:transparent}.shell>aside{background:rgba(5,16,34,.85)}
@media(max-width:750px){body,body.login-page{background-attachment:fixed}.shell>main>header{background-image:linear-gradient(90deg,rgba(5,20,43,.80),rgba(7,26,50,.42))}}

/* Group flags in the title area */
.shell>main>header{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:22px;padding:20px;min-height:0;background:rgba(5,20,43,.72)}
.shell>main>header::after{display:none}.group-flags-banner{display:block;width:100%;height:auto;aspect-ratio:2048/849;object-fit:contain;border-radius:10px}.shell>main>header>div:first-child{min-width:0}.shell>main>header>.header-status{align-self:center}
@media(max-width:750px){.shell>main>header{display:block;padding:12px;min-height:0}.group-flags-banner{width:100%}.shell>main>header>.header-status{margin-top:12px}}