:root{font-family:Inter,Segoe UI,Arial,sans-serif;color:#edf1f7;background:#0c1017;font-synthesis:none;color-scheme:dark;--line:#283347;--muted:#9aa8bd;--blue:#8cb6ff}*{box-sizing:border-box}body{margin:0;display:flex;min-height:100vh}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:wait;opacity:.5}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--blue);outline-offset:4px}button,a,summary,input,select{-webkit-tap-highlight-color:transparent}button{min-height:44px}small{display:block;color:var(--muted);font-size:12.1px;margin-top:7px}h1,h2,h3,p{overflow-wrap:anywhere}h2,h3{font-weight:550}button span{pointer-events:none}.sidebar{width:264px;background:#10151e;border-right:1px solid var(--line);padding:28px 20px;display:flex;flex-direction:column;flex-shrink:0;min-height:100vh}.brand{display:block;background:#fff;padding:13px 7px;border-radius:9px;border:1px solid #dce2ed}.brand img{display:block;width:100%;height:auto}.product-label{font-size:11px;letter-spacing:2.2px;color:#c1cfe4;padding:17px 3px;display:flex;justify-content:space-between}.product-label span{font-size:9.9px;letter-spacing:0;color:#8b9ab2}.workspace{display:flex;gap:12px;align-items:center;padding:17px 12px;border:1px solid var(--line);border-radius:9px;margin:14px 0 27px;font-size:13.2px}.avatar{background:#24334c;padding:11px 8px;border-radius:7px;font-size:12.1px;color:#c0d5ff}.nav-label{font-size:11px;letter-spacing:1.4px;color:#8b9ab2;margin:9px 12px 14px}nav{display:grid;gap:8px}nav button{background:none;border:1px solid transparent;border-radius:7px;color:#a3b0c4;text-align:left;padding:12px;font-size:14.3px;display:flex;align-items:center;gap:13px}nav button span:first-child{font-size:23.1px;width:22px;color:#9bafcb}nav button.active{background:#1a2b47;border-color:#2c4469;color:#c2d7ff}nav button:hover{background:#1d2a3e}.aside-bottom{margin-top:auto;padding:65px 5px 0;color:#a1b2ca;font-size:12.1px}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#7eacfb;margin-right:7px}.aside-bottom small{margin-left:13px;font-size:11px}main{min-width:0;width:100%;padding:0 40px;max-width:none;margin:0 auto}header{height:82px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:16px}.breadcrumb{font-size:13.2px;color:var(--muted)}.breadcrumb span{margin:0 12px;color:#7d8ba1}.breadcrumb strong{font-weight:400;color:#c5cfdf}.badge{font-size:11px;letter-spacing:1px;color:#a6c3ee}.heading{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:38px 0 30px}.eyebrow{font-size:11px;letter-spacing:1.8px;color:#a6bee6;margin:0 0 13px}h1{font-size:34.1px;font-weight:550;letter-spacing:-.9px;margin:0 0 12px}.heading p:last-child{font-size:14.3px;line-height:1.7;color:var(--muted);margin:0}.version{font-size:12.1px;border:1px solid var(--line);border-radius:5px;padding:7px 9px;color:#b0c2dd;flex-shrink:0}.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.stats article{background:#131b28;border:1px solid var(--line);border-radius:10px;padding:20px 22px}.stats p{margin:0 0 15px;color:#b1bfd3;font-size:13.2px}.stats strong{font-size:33px;font-weight:500}.stats small{font-size:12.1px;line-height:1.6;margin-top:9px}.section-title{display:flex;justify-content:space-between;align-items:center;gap:18px;margin:28px 0 18px}.section-title h2,.section-title h3{font-size:15.4px;margin:0}.section-title>span{font-size:9.9px;letter-spacing:1px;color:#92a2bc}.welcome{display:flex;align-items:center;gap:30px;border:1px solid #344b70;background:radial-gradient(ellipse at left,#1c3050,#141e2d 70%);border-radius:11px;padding:34px;margin-top:22px}.orbit{font-size:48.4px;color:#accbff;border:1px solid #52729e;border-radius:23px;background:#203956;min-width:85px;height:90px;display:grid;place-items:center}.welcome h2{font-size:26.4px;letter-spacing:-.5px;margin:13px 0}.welcome p{font-size:14.3px;line-height:1.85;color:#afbdd1;max-width:570px;margin:0 0 22px}.primary,.secondary{border-radius:7px;padding:10px 15px;font-size:13.2px;font-weight:600;line-height:1.4}.primary{background:#8bb5ff;color:#0a1b38;border:1px solid #b3d0ff}.primary:hover{background:#a4c6ff}.primary span{margin-left:17px}.secondary{background:#1b2b43;color:#c2d7fa;border:1px solid #3d5579}.secondary:hover{background:#2c4262}.compact{font-size:12.1px;padding:8px 11px}.modules{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.module{text-align:left;padding:22px;background:#131b28;border:1px solid var(--line);border-radius:9px;color:inherit}.module:hover{border-color:#6f95ca;background:#19283e}.module-icon{display:inline-grid;place-items:center;background:#253954;color:#b1ceff;border-radius:7px;width:35px;height:35px;font-size:24.2px}.module small{float:right;font-size:8.8px;letter-spacing:.7px;border:1px solid #40516e;padding:6px;border-radius:4px;margin:4px 0}.module h3{font-size:15.4px;margin:19px 0 9px}.module p{font-size:13.2px;line-height:1.8;margin:0;color:#a4b3c9}.panel{border:1px solid var(--line);background:#121a27;border-radius:11px;min-width:0}.projects-layout{display:grid;grid-template-columns:minmax(260px,310px) minmax(0,1fr);gap:20px;align-items:start}.explorer{padding:19px 16px}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:17px}.panel-heading h2{font-size:15.4px;margin:0}input,textarea,select{background:#0e1623;border:1px solid #425371;border-radius:6px;color:#edf1f7;padding:12px;min-height:44px;width:100%;font-size:14.3px;outline-offset:3px}input::placeholder,textarea::placeholder{color:#98a9c4}input:focus,select:focus,textarea:focus{outline:2px solid var(--blue)}.client-tree{padding-top:18px;min-height:220px}.client-branch{margin:5px 0 10px}.client-summary{cursor:pointer;font-size:14.3px;padding:12px 8px;min-height:46px;color:#d0dcf0;overflow-wrap:anywhere;list-style:disclosure-closed inside}.client-branch[open]>.client-summary{list-style:disclosure-open inside}.client-name{margin-left:5px}.count{display:inline-flex;margin-left:10px;background:#263851;color:#bfd3f2;padding:3px 7px;border-radius:5px;font-size:11px}.project-children{border-left:1px solid #3b4d6b;margin:3px 0 12px 12px;padding-left:12px}.tree-project{display:block;width:100%;background:none;border:1px solid transparent;border-radius:6px;color:#c4d1e5;text-align:left;padding:11px 10px;margin:4px 0;line-height:1.5}.tree-project:hover{background:#1b2b43}.tree-project.selected{border-color:#486b9e;background:#1d3353;color:#d1e2ff}.project-name{font-size:13.2px;overflow-wrap:anywhere}.tree-project small{font-size:11px;color:#a0b6d8;margin-top:5px}.add-project{color:#b8d3ff;font-size:12.1px;background:none;border:0;padding:9px 10px;min-height:44px}.tree-note{font-size:12.1px;color:var(--muted);padding:0 10px}.explorer-note{font-size:8.8px;letter-spacing:.8px;line-height:1.7;color:#98aac5;border-top:1px solid var(--line);padding-top:18px;margin:14px 0 0}.tree-empty{line-height:1.9;padding:5px 10px}.project-panel{padding:28px;min-height:380px;scroll-margin-top:20px}.project-title{font-size:27.5px;letter-spacing:-.5px;margin:0 0 12px}.project-description{font-size:14.3px;color:#acbbd1;line-height:1.85;white-space:pre-wrap}.project-panel .section-title{padding-top:20px;border-top:1px solid var(--line);margin-top:26px;flex-wrap:wrap}.resource-list{display:grid;gap:14px}.resource-card{padding:18px;background:#172337;border:1px solid #34496b;border-radius:8px;margin-bottom:12px;display:flex;justify-content:space-between;align-items:center;gap:15px;flex-wrap:wrap;min-width:0}.resource-info{min-width:0;flex:1}.resource-kind{font-size:9.9px;letter-spacing:1.2px;text-transform:uppercase;color:#b1c8ed}.resource-card h3{font-size:15.4px;margin:7px 0 0}.resource-projects{display:flex;gap:8px;flex-direction:column;align-items:flex-start;max-width:100%}.text-link{background:transparent;border:0;color:#bad4ff;text-align:left;font-size:13.2px;padding:6px;line-height:1.6;overflow-wrap:anywhere;max-width:100%}.text-link:hover{text-decoration:underline}.resource-projects .muted{font-size:12.1px}.boundary-note{font-size:12.1px;color:#9daec9;line-height:1.8;margin-top:22px}.inline-empty{border:1px dashed #485a78;border-radius:8px;color:#a6b7d1;padding:25px;font-size:13.2px;line-height:1.9}.empty{padding:55px 28px;text-align:center}.empty-icon{display:block;font-size:46.2px;color:#a8c9ff;margin-bottom:24px}.empty h2{font-size:24.2px;line-height:1.5;margin:16px 0 12px}.empty p{font-size:14.3px;line-height:1.9;max-width:470px;margin:12px auto 20px}.muted{font-size:13.2px;color:var(--muted);line-height:1.8}.section-title p{margin-bottom:0}footer{display:flex;justify-content:space-between;gap:20px;color:#94a5c0;font-size:11px;line-height:1.6;padding:30px 0;margin-top:13px}footer>span:first-child{letter-spacing:1px}footer b{color:#a0c4ff;margin:0 5px}#health{color:#aac2e7}#error,.notice{padding:15px 18px;border-radius:6px;margin-bottom:20px;font-size:13.2px;line-height:1.7}#error{background:#44272d;border:1px solid #bf7e88}#retry{margin-left:10px}.notice{background:#202e46;border:1px solid #4c6796;color:#c2d7f8;font-size:11px;letter-spacing:.4px;margin-top:22px}dialog{border:1px solid #526a8f;background:#151f30;color:#edf1f7;border-radius:14px;padding:26px;width:min(480px,calc(100% - 30px));max-height:calc(100dvh - 40px);overflow:auto}dialog::backdrop{background:#030710b8;backdrop-filter:blur(5px)}.dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:15px}.dialog-heading h2{font-size:23.1px;margin:0}.icon-button{font-size:28.6px;background:none;border:0;color:#c2d4ef;width:44px;height:44px}.field{display:block;font-size:13.2px;margin-top:20px;color:#c3d2e8}.field input,.field textarea,.field select{display:block;margin-top:9px}.field textarea{resize:vertical}.dialog-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:26px}.form-error{color:#ffc5cd;background:#40252c;padding:12px;border-radius:6px;font-size:13.2px;line-height:1.8}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;left:15px;top:-100px;z-index:100;background:#a6c8ff;color:#102440;padding:15px}.skip-link:focus{top:15px}[hidden]{display:none!important}
@media(min-width:1600px){main{padding:0 60px}}@media(max-width:1100px){.sidebar{width:220px;padding:25px 14px}main{padding:0 25px}.projects-layout{grid-template-columns:minmax(230px,270px) minmax(0,1fr);gap:14px}.project-panel{padding:22px}.welcome{padding:28px;gap:23px}.module{padding:18px}.module small{font-size:7.7px}.stats article{padding:18px}.stats small{font-size:11px}}
@media(max-width:900px){.sidebar{width:195px;padding:22px 12px}.workspace{padding:15px 9px;font-size:12.1px}.workspace small{font-size:11px}.projects-layout{grid-template-columns:1fr}.client-tree{min-height:0}.module{padding:15px}.module small{float:none;display:inline-block;margin:0 0 0 8px}.module-icon{width:27px;height:30px;font-size:20.9px}.welcome h2{font-size:24.2px}.orbit{display:none}.stats{gap:10px}}
@media(max-width:760px){body{display:block}.sidebar{width:100%;min-height:0;padding:18px 20px 14px;border-right:0;border-bottom:1px solid var(--line);display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:15px}.brand{width:210px;max-width:65%;padding:10px 5px;border-radius:7px}.product-label{font-size:9.9px;letter-spacing:1.4px;display:block;text-align:right;line-height:1.8}.product-label span{display:block}.workspace,.nav-label,.aside-bottom{display:none}nav{position:fixed;left:0;right:0;bottom:0;z-index:20;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;padding:8px 7px calc(8px + env(safe-area-inset-bottom));background:#111b2bf5;border-top:1px solid #405373;backdrop-filter:blur(15px)}nav button{display:flex;flex-direction:column;justify-content:center;gap:5px;padding:7px 2px;text-align:center;font-size:11px;min-height:56px;border-radius:7px}nav button span:first-child{width:auto;font-size:23.1px}main{padding:0 20px 86px}header{height:60px}.badge{font-size:9.9px}.breadcrumb{font-size:12.1px}.breadcrumb span{margin:0 8px}.heading{padding:28px 0 24px;align-items:flex-start}.eyebrow{font-size:9.9px;line-height:1.6}h1{font-size:29.7px;line-height:1.2}.heading p:last-child{font-size:13.2px}.version{display:none}.stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.stats article{padding:15px 11px}.stats p{font-size:12.1px;margin-bottom:12px}.stats strong{font-size:28.6px}.stats small{font-size:11px;line-height:1.6}.welcome{padding:25px;margin-top:18px}.welcome h2{font-size:25.3px;line-height:1.4}.welcome p{font-size:13.2px}.modules{grid-template-columns:1fr;gap:12px}.module{padding:20px}.module small{float:right;font-size:9.9px;padding:6px;margin:0}.module-icon{width:35px;height:35px;font-size:24.2px}.module h3{margin-top:16px}.section-title{align-items:flex-start;flex-wrap:wrap;gap:14px}.section-title>span{display:none}.section-title .primary{flex-shrink:0}.explorer{padding:17px}.client-tree{padding-top:12px}.client-summary{font-size:15.4px}.tree-project{padding:13px 10px}.project-name{font-size:14.3px}.tree-project small{font-size:12.1px}.project-panel{padding:24px 20px;min-height:300px;scroll-margin-top:15px}.project-panel .section-title{align-items:center}.empty{padding:35px 20px}.empty h2{font-size:23.1px}.project-title{font-size:26.4px}.resource-card{padding:16px}.resource-card .secondary{min-width:65px}.text-link{font-size:13.2px}.inline-empty{padding:20px}.boundary-note{font-size:12.1px}footer{flex-direction:column;gap:10px;font-size:9.9px;padding:25px 0 12px}.notice{font-size:11px;padding:12px}dialog{padding:21px}dialog input,dialog textarea,dialog select{font-size:17.6px}.dialog-actions button{flex:1}.dialog-heading h2{font-size:23.1px}}
@media(max-width:360px){main{padding-left:14px;padding-right:14px}.sidebar{padding-left:14px;padding-right:14px}.brand{max-width:64%}.product-label{font-size:8.8px;letter-spacing:.8px}.stats{grid-template-columns:1fr}.stats article{position:relative;padding:14px 16px}.stats p{margin:0 0 7px}.stats strong{position:absolute;right:16px;top:16px}.stats small{margin-top:0}header .badge{font-size:8.8px}.breadcrumb{font-size:11px}nav button{font-size:9.9px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.vpn-list{display:grid;gap:10px;width:100%;max-width:none}
.vpn-card{padding:10px 16px}
.vpn-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px}
.vpn-identity{display:flex;align-items:center;gap:12px;min-width:0}
.vpn-heading h2{font-size:16.5px;line-height:1.5;margin:0;overflow-wrap:anywhere}
.vpn-state{font-size:11px;line-height:1.5;padding:4px 9px;border:1px solid #55729b;border-radius:16px;background:#223650;color:#c8dcff;white-space:nowrap}
.state-connected{border-color:#367f72;color:#a4e7ce;background:#193b35}
.state-error,.state-stale{border-color:#9c784c;background:#3a3021;color:#f4d39e}
.vpn-row-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.vpn-details-button{display:flex;align-items:center;gap:7px;min-height:44px;padding:7px 5px;border:0;background:none;color:#b6c8e2;font-size:12.1px}
.vpn-details-button:hover{color:#edf4ff}
.vpn-caret{display:inline-block;width:7px;height:7px;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:rotate(45deg);margin:-3px 2px 0 3px;transition:transform .15s}
.vpn-details-button[aria-expanded=true] .vpn-caret{transform:translateY(3px) rotate(225deg)}
.vpn-switch{display:grid;place-items:center;min-width:58px;min-height:44px;padding:7px 3px;border:0;background:none;border-radius:12px;flex-shrink:0}
.vpn-switch-track{display:block;width:50px;height:28px;background:#455268;border:1px solid #718198;border-radius:16px;padding:2px;transition:background .18s,border-color .18s}
.vpn-switch-thumb{display:block;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 4px #0006;transition:transform .18s}
.vpn-switch[aria-checked=true] .vpn-switch-track{background:#39ad7b;border-color:#64d3a5}
.vpn-switch[aria-checked=true] .vpn-switch-thumb{transform:translateX(22px)}
.vpn-switch:disabled{opacity:.55;cursor:wait}
.vpn-details-panel{border-top:1px solid var(--line);padding:16px 0 4px;margin-top:8px}
.vpn-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0}
.vpn-facts dt{font-size:12.1px;color:#a5b5ce;margin-bottom:6px}
.vpn-facts dd{font-size:13.2px;margin:0;overflow-wrap:anywhere}
.vpn-details-panel .boundary-note{margin:14px 0 0}
@media(max-width:760px){.vpn-card{padding:10px 12px}.vpn-heading{gap:10px}.vpn-identity{flex-direction:column;align-items:flex-start;gap:4px}.vpn-heading h2{font-size:15.4px}.vpn-row-actions{gap:6px}.vpn-state{font-size:9.9px;padding:3px 7px}.vpn-facts{gap:16px 10px}}
@media(max-width:360px){.vpn-row-actions{gap:2px}.vpn-details-button{font-size:11px}.vpn-switch{min-width:54px}.vpn-facts{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.vpn-switch-track,.vpn-switch-thumb,.vpn-caret{transition:none}}

#monitor-list{margin-bottom:32px}
.monitor-status{display:inline-flex;align-items:center;gap:7px;font-size:13.2px;color:var(--muted,#a4b1c5)}
.monitor-status::before{content:"";width:9px;height:9px;border-radius:50%;background:#8995a7;flex-shrink:0}
.monitor-running::before{background:#46d39b;box-shadow:0 0 8px #46d39b55}
.monitor-stopped::before{background:#fa6d79;box-shadow:0 0 8px #fa6d7955}
.monitor-context{font-size:13.2px;color:#a4b1c5;margin:8px 0 0;overflow-wrap:anywhere}
.monitor-log{background:#090e16;border:1px solid #29384c;border-radius:8px;padding:14px;font:13.2px/1.6 ui-monospace,Consolas,monospace;max-height:420px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;color:#cbd7e8}

.monitor-healthy::before{background:#46d39b;box-shadow:0 0 8px #46d39b55}
.monitor-warning::before{background:#eab86b;box-shadow:0 0 8px #eab86b44}
.monitor-failed::before{background:#fa6d79;box-shadow:0 0 8px #fa6d7955}
.vpn-facts dd{overflow-wrap:anywhere}

.monitor-client{overflow:hidden;background:#0f1723}
.monitor-client-toggle{display:flex;width:100%;align-items:center;justify-content:space-between;gap:20px;padding:17px 20px;background:none;border:0;color:inherit;text-align:left}
.monitor-client-toggle:hover{background:#172235}
.monitor-client-info{display:flex;align-items:center;gap:15px;min-width:0}
.monitor-client-name{font-size:17.6px;font-weight:600;overflow-wrap:anywhere}
.monitor-client-info .monitor-context{margin:0}
.monitor-client-controls{display:flex;gap:18px;align-items:center}
.monitor-client-toggle[aria-expanded=true] .vpn-caret{transform:translateY(3px) rotate(225deg)}
.monitor-client-items{display:grid;gap:8px;padding:12px;border-top:1px solid var(--line);min-width:0}
.monitor-online::before{background:#46d39b;box-shadow:0 0 8px #46d39b55}
.monitor-offline::before{background:#fa6d79;box-shadow:0 0 8px #fa6d7955}
@media(max-width:760px){.monitor-client-toggle{padding:14px;gap:10px}.monitor-client-info{align-items:flex-start;flex-direction:column;gap:4px}.monitor-client-controls{gap:12px}.monitor-client-controls .monitor-status{font-size:12.1px}.monitor-client-items{padding:8px}.monitor-client-items .vpn-card{padding:10px}.monitor-client-items .vpn-heading h2{font-size:14.3px}}

:root{font-size:17.6px}
body{display:block}
.app-shell{display:flex;min-height:100vh;width:100%}
.app-header{height:auto;min-height:144px;padding:22px 0;gap:22px;flex-wrap:wrap}
.header-brand{width:440px;max-width:100%;padding:16px 14px;flex-shrink:1}
.account-controls{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:10px;font-size:14.3px;color:#c4d2e7}
.account-buttons{display:flex;gap:8px;flex-wrap:wrap}
.section-title h1{font-size:24.2px;margin:0}
.login-screen{min-height:100vh;display:grid;place-items:center;padding:35px 20px}
.login-wrap{width:100%;max-width:560px}
.login-brand{padding:20px;margin-bottom:28px}
.login-form{max-width:420px;margin:auto;padding:30px;display:grid;gap:10px}
.login-form h1{font-size:30.8px;margin:0 0 12px}
.login-form label,dialog form>label,dialog #user-password-fields>label{font-size:14.3px;display:block;margin:10px 0 7px}
.login-form .primary{margin-top:4px}
.form-error{color:#ff9ba6;font-size:14.3px;line-height:1.5}
#users-dialog{width:min(850px,94vw);max-width:850px}
#password-dialog{width:min(500px,94vw)}
.user-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 0;border-bottom:1px solid var(--line);font-size:15.4px}
.user-actions{display:flex;gap:8px;flex-wrap:wrap}
.user-editor{border-top:1px solid var(--line);padding-top:12px;margin-top:24px}
.check-label{display:flex;gap:10px;align-items:center;font-size:14.3px;min-height:40px;cursor:pointer}
.check-label input{width:18px;height:18px;min-height:18px;flex-shrink:0;margin:0;accent-color:#8cb6ff}
#user-enabled-label{margin-top:14px}
#permission-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.permission-group{border:1px solid var(--line);border-radius:8px;min-width:0;padding:12px}
.permission-group legend{font-size:15.4px;padding:0 6px}
@media(max-width:1100px){.header-brand{width:390px}.account-controls{align-items:flex-start;margin-left:0}}
@media(max-width:760px){.app-shell{display:block}.app-shell>.sidebar{height:0;min-height:0;padding:0;border:0}.sidebar .product-label{display:none}nav{grid-template-columns:repeat(2,minmax(0,1fr))}.viewer nav{grid-template-columns:1fr}.app-header{padding:20px 0;gap:18px;min-height:0;align-items:stretch}.header-brand{width:100%;max-width:480px;padding:14px 10px}.account-controls{width:100%;gap:9px}.account-buttons{width:100%}.account-buttons button{flex:1}.section-title h1{font-size:23.1px}.login-brand{padding:16px 10px}.login-form{padding:24px}#permission-options{grid-template-columns:1fr}.user-row{align-items:flex-start;flex-direction:column;gap:10px}.user-actions{width:100%}.user-actions button{flex:1}}
.form-error:empty{display:none}

.login-brand{width:100%;max-width:100%;margin-left:auto;margin-right:auto}
.login-form{width:100%;box-sizing:border-box}
#login-error[hidden]{display:none!important}
.monitor-row-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}
.monitor-rename{display:grid;place-items:center;width:40px;min-height:40px;color:#a4b9d6;border-radius:6px}
.monitor-rename:hover{background:#24344b;color:#e5efff}
.monitor-rename svg{pointer-events:none}
#rename-dialog{width:min(520px,94vw)}
@media(max-width:760px){.login-screen{min-height:100svh;padding:28px 20px}.login-wrap{width:100%;max-width:420px}.login-brand{width:100%;max-width:100%;margin:0 auto 22px;padding:16px 12px}.login-brand img{width:100%;height:auto;object-fit:contain}.login-form{max-width:100%;margin:0}.monitor-row-actions{gap:2px}.monitor-rename{width:36px}}

.monitor-client-heading,.prepared-server-heading{display:flex;align-items:center;gap:4px;padding-right:8px;min-width:0}
.monitor-client-heading .monitor-client-toggle{flex:1;min-width:0}
.prepared-server{flex:1;min-width:0;padding:14px;background:#121d2b}
.prepared-server-summary{cursor:pointer;font-weight:600;overflow-wrap:anywhere}
.prepared-server p{margin-bottom:0}

.monitor-vpn_unavailable,.monitor-host_unreachable,.monitor-check_unavailable{color:#adbbce}
.monitor-vpn_unavailable:before,.monitor-host_unreachable:before,.monitor-check_unavailable:before{background:#8292a9}
.monitor-service_unavailable{color:#f4bd68}
.monitor-service_unavailable:before{background:#f4bd68}
.dependency-notice{padding:10px 12px;margin:0;color:#adbbce;border-left:3px solid #8292a9}

.monitor-server-items{display:grid;gap:8px;margin-top:12px;min-width:0}
.monitor-server-items:empty{display:none}
.dashboard-frame{overflow:auto;max-height:80vh;margin-top:12px;border:1px solid var(--line);border-radius:6px;background:white}
.dashboard-image{display:block;width:100%;height:auto}.dashboard-frame.full-size .dashboard-image{width:auto;max-width:none}
.monitor-idle{color:#7dd7b1}.monitor-idle:before{background:#7dd7b1}
#credentials-dialog{width:min(520px,94vw)}

.prepared-server-heading{align-items:flex-start}.prepared-server-heading>.monitor-rename{margin-top:8px}

.transfer-history-frame{overflow:auto;margin:12px 0 20px}.transfer-history{width:100%;border-collapse:collapse;font-size:14px}.transfer-history th,.transfer-history td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--line);vertical-align:top}.transfer-history td:first-child{overflow-wrap:anywhere;min-width:140px}.transfer-history td:not(:first-child){white-space:nowrap}.restart-service{margin:12px 0;color:#f7b5ae}

.app-header{min-height:0;padding:16px 0;gap:0;justify-content:flex-end}

#users{padding-bottom:24px}.login-log-heading{margin-top:32px}.login-log-heading label{display:flex;align-items:center;gap:10px}.login-log-heading select{padding:8px;border:1px solid var(--line);border-radius:6px;background:#111b2b;color:inherit}.login-events-frame{overflow:auto}.login-events-table{width:100%;border-collapse:collapse;font-size:14px}.login-events-table th,.login-events-table td{text-align:left;vertical-align:top;padding:12px;border-bottom:1px solid var(--line)}.login-events-table th{color:var(--muted);font-weight:500}.login-ip{overflow-wrap:anywhere;font-family:ui-monospace,monospace;font-size:13px}.login-outcome{font-weight:600}.outcome-success{color:#7dd7b1}.outcome-invalid{color:#ff9ba6}.outcome-blocked,.outcome-rate_limited{color:#f4bd68}.last-login{margin-top:10px}#load-older-logins{margin-top:16px}
@media(max-width:760px){nav{grid-template-columns:repeat(3,minmax(0,1fr))}.viewer nav{grid-template-columns:1fr}.login-events-table,.login-events-table tbody{display:block}.login-events-table thead{display:none}.login-events-table tr{display:grid;grid-template-columns:1fr 1fr;padding:10px;border:1px solid var(--line);border-radius:8px;margin:10px 0}.login-events-table td{display:block;border:0;padding:7px;min-width:0}.login-events-table td:before{content:attr(data-label);display:block;color:var(--muted);font-family:Inter,Segoe UI,Arial,sans-serif;font-size:11px;margin-bottom:6px}.login-events-table td:nth-child(3){grid-column:1/-1}.login-log-heading{gap:12px}}

.login-events-table td{overflow-wrap:anywhere}.user-row>div:first-child{min-width:0;overflow-wrap:anywhere}

.signal-bars{display:inline-flex;align-items:flex-end;gap:3px;height:22px;margin-right:10px;vertical-align:middle}
.signal-bars span{width:7px;border-radius:2px;background:#314052;height:6px}
.signal-bars span:nth-child(2){height:11px}.signal-bars span:nth-child(3){height:16px}.signal-bars span:nth-child(4){height:22px}
.signal-bars .filled{background:#efb75d}.signal-level-1 .filled{background:#ed7979}.signal-level-3 .filled,.signal-level-4 .filled{background:#24cba2}
.signal-value{vertical-align:middle}

#upload-dialog{width:min(620px,calc(100vw - 32px));max-height:90dvh;overflow:auto}#upload-fields{border:0;padding:0;margin:0;min-width:0}#upload-fields>input,#upload-fields>select{width:100%;box-sizing:border-box;margin:8px 0 16px}.upload-check{display:flex;align-items:flex-start;gap:10px;margin:14px 0}.upload-check input{width:auto;flex-shrink:0}.upload-actions{flex-wrap:wrap}#upload-fingerprint{overflow-wrap:anywhere}

@media(max-width:760px){.monitor-rename{display:none}.monitor-client-heading,.prepared-server-heading{padding-right:0;gap:0}}

.monitoring-schedule{text-align:center;font-size:12px;line-height:1.6;margin:18px 0 0;color:var(--muted)}

.viewer .sidebar,.viewer nav{display:none}@media(max-width:760px){.viewer main{padding-bottom:calc(20px + env(safe-area-inset-bottom))}}

.app-header{border-bottom:0;margin-bottom:10px}

.users-page-actions{display:flex;gap:8px}.login-audit{margin-top:20px;border:1px solid var(--line);border-radius:9px;padding:0 14px}.login-audit>summary{cursor:pointer;font-weight:600;padding:16px 0}.login-audit[open]{padding-bottom:14px}.login-audit .login-log-heading{margin:0 0 12px;display:flex;justify-content:flex-end}.login-audit #login-audit-note{font-size:12px;line-height:1.5}.user-row .last-login{margin-top:5px;line-height:1.5}
@media(max-width:760px){#users>.section-title{margin-bottom:12px}#users>.muted{font-size:13px;margin-bottom:14px}.users-page-actions button{padding:8px 10px;font-size:12px}.user-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;padding:12px 0;align-items:center}.user-row small{font-size:12px}.user-actions{width:auto;flex-direction:column;gap:6px}.user-actions button{flex:none;min-height:40px;padding:7px 10px;font-size:12px}.login-events-table tr{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4px 12px;padding:10px;margin:6px 0}.login-events-table td{padding:2px 0;font-size:12px}.login-events-table td:before{display:none}.login-events-table td:nth-child(3){grid-column:auto}.login-events-table td:nth-child(even){text-align:right}.login-events-table td:first-child{color:var(--muted)}.login-events-table td small{font-size:11px}.login-audit .login-events-frame{overflow:visible}}

.batch-progress{margin:12px 0 10px;padding:12px 14px;border:1px solid #2b3b52;border-radius:9px;background:#101b2a}.batch-progress-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:12px;color:var(--muted)}.batch-progress-heading strong{color:#a7c8ff;font-size:15px;font-variant-numeric:tabular-nums}.batch-progress progress{display:block;appearance:none;-webkit-appearance:none;width:100%;height:8px;margin:9px 0;border:0;border-radius:20px;overflow:hidden;background:#243046}.batch-progress progress::-webkit-progress-bar{background:#243046;border-radius:20px}.batch-progress progress::-webkit-progress-value{background:linear-gradient(90deg,#648cfa,#45cfb5);border-radius:20px}.batch-progress progress::-moz-progress-bar{background:linear-gradient(90deg,#648cfa,#45cfb5);border-radius:20px}.batch-progress .monitor-context{margin:0;font-size:12px}

#monitor-list [data-monitor-id]{transition:opacity .16s ease,filter .16s ease,border-color .16s ease}#monitor-list .monitor-focus-dimmed{opacity:.42;filter:grayscale(1)}#monitor-list .monitor-focus-dimmed:hover,#monitor-list .monitor-focus-dimmed:focus-within{opacity:.72}#monitor-list .monitor-focus-active{border-color:#587ba6;box-shadow:0 0 0 1px #587ba626}@media(prefers-reduced-motion:reduce){#monitor-list [data-monitor-id]{transition:none}}

/* Shared centered workspace; the sidebar keeps its existing desktop position. */
main>.view,main>.app-header{width:100%;max-width:1280px;margin-left:auto;margin-right:auto}
.monitor-client{border-radius:11px;transition:border-color .14s ease}
.monitor-client-heading{background:#101925;transition:background-color .14s ease,box-shadow .14s ease}
.monitor-client.is-expanded{border-color:#405979}
.monitor-client.is-expanded>.monitor-client-heading{background:#192a40;box-shadow:inset 3px 0 0 #79a6df}
.monitor-client-toggle{transition:background-color .12s ease}
.monitor-client-toggle:hover{background:#ffffff05}
.monitor-client.is-expanded .monitor-client-name{color:#ecf4ff}
.monitor-client-controls{font-variant-numeric:tabular-nums}
.vpn-card.vpn-details-open{border-color:#405979;background:#142033}
.vpn-card.vpn-details-open>.vpn-heading h2{color:#c6ddff}
.vpn-card{transition:background-color .14s ease,border-color .14s ease}
@media(prefers-reduced-motion:no-preference){.vpn-caret{transition:transform .15s ease}}
@media(prefers-reduced-motion:reduce){.monitor-client,.monitor-client-heading,.monitor-client-toggle,.vpn-card,.vpn-caret{transition:none}}

/* Keep centered cards stationary when expanded details add a page scrollbar. */
html{overflow-y:scroll}
@supports(scrollbar-gutter:stable){html{overflow-y:auto;scrollbar-gutter:stable}}

.unifi-facts{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 20px}
.wan-availability{background:#0e1826;border:1px solid var(--line);border-radius:9px;padding:14px;margin:18px 0}
.wan-availability-heading{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:#b9c9df;align-items:center}.wan-availability-heading strong{color:#dce9fa;font-size:17px;font-variant-numeric:tabular-nums}
.wan-availability-bar{display:flex;height:9px;border-radius:8px;overflow:hidden;background:#344052;margin:11px 0}.wan-part{min-width:0;flex-basis:0}.wan-part.online{background:#35caa0}.wan-part.offline{background:#ed6b79}
.wan-availability .monitor-context{margin:0;font-size:11px;line-height:1.6}
.network-device-groups{display:grid;gap:9px;margin:16px 0 20px}.network-device-group{border:1px solid var(--line);border-radius:9px;overflow:hidden;background:#101b2a}
.network-device-toggle{width:100%;border:0;display:flex;align-items:center;gap:13px;padding:13px 15px;background:transparent;color:inherit;text-align:left}.network-device-toggle:hover,.network-device-toggle[aria-expanded=true]{background:#192a40}.network-device-toggle[aria-expanded=true]{box-shadow:inset 3px 0 #79a6df}
.network-device-icon{display:grid;place-items:center;color:#a8c8f4;flex-shrink:0}.network-group-identity{flex:1;min-width:0}.network-group-identity strong{font-size:14px;font-weight:550}.network-group-identity small{margin-top:3px;font-size:11px}.network-group-status{display:flex;align-items:center;gap:7px;white-space:nowrap;font-size:12px;color:#afc0d8}
.network-device-list{padding:0 15px}.network-device-row{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:11px 0;border-top:1px solid var(--line)}.network-device-name{min-width:0;overflow-wrap:anywhere}.network-device-name strong{font-size:13px;font-weight:500}.network-device-name small{font-size:11px;margin-top:4px}.network-device-state{display:flex;align-items:center;gap:7px;white-space:nowrap;color:#afc0d8;font-size:12px}.network-group-status .state-dot,.network-device-state .state-dot{margin:0}
@media(max-width:760px){.unifi-facts{grid-template-columns:repeat(2,minmax(0,1fr))}.network-device-toggle{padding:12px 10px;gap:9px}.network-group-identity strong{font-size:13px}.network-group-status{font-size:11px}.network-device-list{padding:0 10px}.wan-availability{padding:12px}.wan-availability-heading{font-size:12px}.wan-availability-heading strong{font-size:15px}}
@media(prefers-reduced-motion:no-preference){.network-device-toggle{transition:background-color .14s ease}}

.network-device-groups .state-dot{display:inline-block;width:7px;height:7px;border-radius:50%;flex-shrink:0;background:#8593a7}.network-device-groups .state-dot.online{background:#35caa0}.network-device-groups .state-dot.offline{background:#ed6b79}.network-device-groups .state-dot.warning{background:#e7b76d}

.backup-history{margin:16px 0;border:1px solid var(--line);border-radius:8px;padding:12px}.backup-history summary{cursor:pointer;font-size:13px;color:#c2d7fa}.backup-history[open] summary{margin-bottom:12px}