/* One continuous canvas from the navigation into every dark interface. */
/* Keep wheel, touch and keyboard scrolling without a visible vertical rail. */
html,body,body>#app,#nav{scrollbar-width:none}
html::-webkit-scrollbar,body::-webkit-scrollbar,body>#app::-webkit-scrollbar,#nav::-webkit-scrollbar{width:0}
html[data-theme=dark],html:has(.pd-neon){background:#041723;--bg:#041723;--surface:#0c2433;--surface2:#102b3b;--line:#24404f}
html[data-theme=dark] body,body:has(.pd-neon){--bg:#041723;--surface2:#102b3b;background:linear-gradient(90deg,#041723 0,#041723 300px,#061b29 70%,#071e2d 100%)}
body>.sidebar{border-right:0;box-shadow:none}
html[data-theme=dark] body>.topbar,body:has(.pd-neon)>.topbar{background:linear-gradient(90deg,#041723,#061b29);border-bottom-color:#ffffff08;box-shadow:none}
html[data-theme=dark] body>#app,body:has(.pd-neon)>#app{background:transparent}
.sd-pagination{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:10px;padding:14px 18px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
.sd-pagination>span:first-child{margin-right:auto}.sd-pagination button:disabled{opacity:.45;cursor:default}

/* One viewport photograph continues from the roof into the navigation. */
html:has(body.app-ready){background:#00131f}
html body.app-ready{--bg:#00131f;--surface:#082536;--surface2:#103044;--line:#204558;--ink:#edf6ff;--muted:#a6c5dc;--industrial-photo:linear-gradient(90deg,#00131f9e 0,#00131f85 150px,#00131f30 340px,transparent 62%),linear-gradient(180deg,#00131f10,#00131f45),url('/assets/overview-factory-v1.png');--industrial-mask:linear-gradient(180deg,#000 0,#000 90px,transparent 190px),linear-gradient(90deg,#000 0,#000 165px,transparent 325px);background:#00131f;color:var(--ink)}
html body.app-ready::before{content:'';position:fixed;z-index:0;pointer-events:none;inset:0;height:100dvh;background-image:var(--industrial-photo);background-position:center top;background-size:cover;background-repeat:no-repeat;mask-image:var(--industrial-mask);-webkit-mask-image:var(--industrial-mask);mask-composite:add}
html body.app-ready>#app{position:relative;z-index:1;background:transparent}
html body.app-ready>.sidebar{background:transparent!important;border-right:0!important;box-shadow:none!important;outline:none}
html body.app-ready>.sidebar::before{display:none!important;background:none!important}
body.app-ready>.sidebar #nav button{text-shadow:0 1px 3px #000b}
html body.app-ready>.sidebar.open{background:transparent!important;backdrop-filter:none}
html body.app-ready>.topbar{--ink:#edf6ff;--muted:#a6c5dc;--surface:#082536;--surface2:#103044;--line:#204558;background:linear-gradient(90deg,#00162433 35%,#00131fe8);border-bottom:0;box-shadow:none;backdrop-filter:none}
body.app-ready #app h1{color:#edf6ff}body.app-ready #app h1+p,body.app-ready #app .page-head p{color:#b9d5e9}
/* A compact navigation gives every interface the same extra working space. */
html body.app-ready{--sidebar-width:200px}
html body.app-ready>.sidebar{width:var(--sidebar-width);padding-right:8px;padding-left:8px}
html body.app-ready>#app{margin-left:var(--sidebar-width)}
html body.app-ready>.topbar{left:var(--sidebar-width)}
body.app-ready>.sidebar .brand{gap:7px;padding-left:4px;padding-right:4px}
body.app-ready>.sidebar .brand .brand-logo{width:36px;height:36px}
body.app-ready>.sidebar .brand b{font-size:15px}
body.app-ready>.sidebar #nav button{gap:8px;padding-left:6px;padding-right:6px;font-size:12px}
/* A soft light blends the profile into the photograph without a panel edge. */
body.app-ready>.sidebar .sidebar-foot{position:relative;min-height:56px;padding:10px 5px;gap:7px;border:0;border-radius:0;background:radial-gradient(ellipse 80px 40px at 25px 50%,#c3e7ff26 0,#89bed010 55%,transparent 100%);box-shadow:none}
body.app-ready>.sidebar .sidebar-foot .avatar{width:33px;height:33px;border:0;box-shadow:0 2px 6px #00131f40}
body.app-ready>.sidebar .sidebar-foot>span:nth-child(2){flex:1;min-width:0}
body.app-ready>.sidebar .sidebar-foot b,body.app-ready>.sidebar .sidebar-foot small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 1px 3px #00131f}
body.app-ready>.sidebar .sidebar-foot b{font-size:11.5px}
body.app-ready>.sidebar .sidebar-foot small{font-size:9px;color:#b9d5e9}
body.app-ready>.sidebar .sidebar-foot .logout-btn{width:25px;min-width:25px;height:32px;padding:3px;flex:none;margin-left:0}
@media(max-width:900px){
 html body.app-ready>#app{margin-left:0}
 html body.app-ready>.topbar{left:0}
 html body.app-ready>.sidebar.open::after{left:var(--sidebar-width)}
 html body.app-ready::before{--industrial-mask:linear-gradient(180deg,#000 0,#000 95px,transparent 200px)}
 html body.app-ready>.sidebar,html body.app-ready>.sidebar.open{background:#00131f!important;backdrop-filter:none}
 html body.app-ready>.sidebar::before{display:block!important;inset:0 auto auto 0;width:100vw;height:100dvh;background-image:linear-gradient(#00131f66,#00131f66),var(--industrial-photo)!important;background-position:center top!important;background-size:cover!important;background-repeat:no-repeat!important}
}
