:root{--bg:#f6f8fc;--surface:#fff;--surface-2:#f1f5fb;--line:#dce4ef;--text:#172641;--muted:#61718b;--accent:#1260ed;--success:#16804b;--danger:#c6334c;--warning:#97610a;color-scheme:light;color:var(--text);background:var(--bg)}
body{background:var(--bg);color:var(--text)}
.topbar{background:#fff;border-bottom:1px solid var(--line);height:72px;backdrop-filter:none;padding:0 32px;position:relative;z-index:5}
.brand{color:#172641;font-size:20px;letter-spacing:-.6px}.brand-mark{background:#1260ed;color:white;box-shadow:none;border-radius:8px}.topbar nav{font-size:14px}.link-button{color:#526580}
.sidebar{position:fixed;top:72px;bottom:0;left:0;width:216px;background:#fff;border-right:1px solid var(--line);padding:32px 16px;display:flex;flex-direction:column;z-index:4}.sidebar-label{font-size:11px;letter-spacing:.12em;color:#79879b;margin:0 12px 22px}.sidebar nav{display:grid;gap:8px}.sidebar nav a{padding:13px 14px;border-radius:7px;font-size:14px;color:#465773}.sidebar nav a:hover{background:#f3f6fb}.sidebar nav a[aria-current]{color:#1256cb;background:#eaf1ff;font-weight:700;border-left:3px solid #1260ed}.sidebar-foot{margin:auto 12px 0;color:#405678;font-size:14px;line-height:1.8}.sidebar-foot small{color:#8490a2}
.admin-layout .page{width:auto;max-width:1500px;margin:0 0 0 216px;padding:38px 32px 64px}.client-layout .page{max-width:1180px}.page-head{margin-bottom:24px;align-items:center}h1{font-size:30px;line-height:1.2;letter-spacing:-.8px}h2{font-size:18px;letter-spacing:-.3px}.page-head p{margin-bottom:0;margin-top:8px}.text-link{color:#165ecb}.muted{color:var(--muted);font-size:14px}.count-pill{background:#fff;color:#53647b}
.panel,.stat-card,.login-card{background:#fff;box-shadow:0 2px 5px #17264103;border:1px solid var(--line);border-radius:9px}.panel{padding:24px}.table-panel{padding:0}.stat-card{padding:20px;min-height:128px}.stat-card strong{color:#182b49;margin-top:16px}.stat-card span,.stat-card small{color:#63748e;font-size:14px}.stats-grid{gap:14px}.button{border-radius:7px;font-size:14px;font-weight:650;min-height:42px;transition:background .15s}.button:hover{transform:none}.button.primary{background:#1260ed;color:#fff}.button.primary:hover{background:#074ec8}.button.ghost{background:#fff;border-color:#d5dfed;color:#32486b}.button.danger,form[data-confirm*="Заблокировать"] .button,form[data-confirm*="Отозвать"] .button{color:#bc2941;background:#fff5f6;border-color:#edc6ce}.button.small{min-height:36px;font-size:14px}.link-button:focus-visible,a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #93b8ff;outline-offset:3px}
input,textarea,select{background:#fff;color:#243652;border-color:#cfdbea;border-radius:6px;font-size:14px}input{min-height:42px}label{color:#415575;font-size:14px}input::placeholder,textarea::placeholder{color:#8390a2}.stack-form{margin-top:18px;gap:16px}.stack-form>.button:not(.full){justify-self:start}.filter-form{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr)) auto auto;gap:16px}.filter-form label{min-width:0}.filter-form input,.filter-form select{width:100%;min-width:0}
th{background:#f7f9fc;color:#5d6e87;text-transform:none;letter-spacing:0;font-size:14px;font-weight:600;padding:16px}td{color:#334761;padding:16px;font-size:14px;border-color:#e7edf5}td small{color:#6a7c95;font-size:13px}td strong{color:#172641}tbody tr:hover{background:#fbfcff}.table-wrap{border-radius:8px} .bulk-panel{background:#fff}.bulk-panel summary{color:#175dc8;font-weight:600}
.action-dialog{background:#fff;color:#172641;border-color:#d9e2ef;border-radius:12px;box-shadow:0 20px 80px #17264133}.action-dialog::backdrop{background:#15233a55;backdrop-filter:blur(3px)}.dialog-close{color:#50617b;border-color:#dae3ef;background:#f7f9fc}.password-reveal{background:#f6f9ff}.password-reveal input{background:#fff}.flash-success{color:#16613d;background:#effbf4;border-color:#bfe7ce}.flash-error{color:#a12b3c;background:#fff3f4;border-color:#edc5cb}.flash-secret{color:#74520d;background:#fff9e8;border-color:#ead7a4}.diagnostic-warning{color:#a66013}.status{font-size:13px}.status.online{background:#e9f8ef;color:#16804b}.status.offline{background:#f0f3f8;color:#64748b}.status::before{box-shadow:none}
.vpn-card{width:min(480px,100%);margin:0 auto;text-align:center;padding:32px}.vpn-card h2{font-size:23px;margin-bottom:24px}.vpn-card>.button{width:100%}.vpn-card .config-actions{display:grid;align-items:stretch;gap:9px}.vpn-card .config-actions .button{width:100%}.vpn-card .vpn-state{margin:28px 0 24px}.vpn-card .vpn-state strong{display:block;color:#216342;font-size:18px;margin-bottom:8px}.vpn-card .stats-grid{grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;margin:24px 0}.vpn-card .stat-card{border:0;box-shadow:none;padding:0;min-height:70px}.vpn-card .stat-card strong{margin:8px 0;font-size:24px}.vpn-card .stats-grid .stat-card+ .stat-card{border-left:1px solid var(--line);border-radius:0}.vpn-card .button.danger{width:100%;margin-top:8px}.vpn-card .muted{margin-top:12px;font-size:13px}.client-home-title{text-align:center;margin:8px 0 28px}.client-notice{max-width:650px;margin:24px auto}.client-notice p{font-size:12px}.login-card{padding:36px}.login-card h1{font-size:28px}.password-unavailable{font-size:13px}
@media(min-width:901px){.admin-layout .topbar{position:sticky;top:0}.admin-layout .config-panel{padding:22px}.sidebar nav a{min-height:46px}}
@media(max-width:1150px){.filter-form{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-layout .page{padding:28px 22px}.sidebar{width:190px}.admin-layout .page{margin-left:190px}}
@media(max-width:760px){.topbar{padding:0 18px;height:64px;min-height:64px}.brand{font-size:18px}.brand-mark{width:30px;height:30px}.sidebar{position:static;width:100%;padding:10px 12px;border-right:0;border-bottom:1px solid var(--line)}.sidebar-label,.sidebar-foot{display:none}.sidebar nav{display:flex;gap:4px;justify-content:space-between}.sidebar nav a{padding:10px 8px;font-size:13px}.sidebar nav a[aria-current]{border-left:0}.admin-layout .page{margin:0;padding:26px 14px 48px}.page{padding-top:28px}h1{font-size:25px}.page-head{gap:12px}.panel{padding:18px}.table-panel{padding:0}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.filter-form{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.filter-form .button{width:100%}.user-name{display:none}.vpn-card{padding:24px}.action-dialog .button{min-height:44px}.topbar nav{gap:12px}table.responsive-table thead{display:none}table.responsive-table,table.responsive-table tbody,table.responsive-table tr,table.responsive-table td{display:block;width:100%}table.responsive-table tr{padding:12px 16px;border-bottom:1px solid var(--line)}table.responsive-table td{border:0;padding:8px 0;overflow-wrap:anywhere}table.responsive-table td[data-label]:before{content:attr(data-label);display:block;font-size:12px;color:#73829a;margin-bottom:4px}table.responsive-table td:has(dialog){padding-top:12px}.diagnostic-details{min-width:0;max-width:none}.page-head>.button{flex-shrink:0}}