:root{color:#e8edf0;font-synthesis:none;--bg:#0b1115;--surface:#111a20;--surface-2:#162128;--surface-3:#1b282f;--border:#2a3941;--text:#e8edf0;--muted:#8f9da5;--accent:#2bb8b0;--accent-soft:#123f43;--green:#49b879;--amber:#e5a82c;--red:#e65d5d;--radius:7px;background:#0b1115;font-family:Inter,Manrope,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:var(--bg);min-width:320px;min-height:100vh;margin:0}button,input,select{font:inherit}button,select{cursor:pointer}button{color:inherit}.loading-screen,.login-screen{background:var(--bg);place-items:center;min-height:100vh;display:grid}.loading-screen{color:var(--muted);align-content:center;gap:13px;font-size:13px}.spinner{border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:27px;height:27px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.login-screen{padding:24px}.login-panel{background:var(--surface);border:1px solid var(--border);border-radius:10px;gap:18px;width:min(390px,100%);padding:32px;display:grid;box-shadow:0 24px 60px #0005}.login-panel h1{font-size:24px}.login-panel>p{color:var(--muted);margin-top:-12px;font-size:12px}.login-mark{color:var(--accent);align-items:center;gap:10px;display:flex}.login-mark span{letter-spacing:-1px;font-size:23px;font-weight:750}.login-submit{width:100%}.login-submit:disabled{opacity:.65;cursor:wait}.app-shell{background:var(--bg);grid-template:64px 1fr/248px minmax(620px,1fr) 364px;min-height:100vh;display:grid}.topbar{border-bottom:1px solid var(--border);z-index:5;background:#0e161b;grid-column:1/-1;align-items:center;gap:28px;padding:0 22px;display:flex}.brand{white-space:nowrap;min-width:220px;font-size:18px;font-weight:680}.brand span{color:var(--accent);letter-spacing:-1px;margin-right:7px;font-size:25px}.health{color:#cad3d8;white-space:nowrap;align-items:center;gap:9px;font-size:13px;display:flex}.health i,.status i{background:var(--green);border-radius:50%;flex:none;width:9px;height:9px}.health.preview i{background:var(--amber)}.topbar-spacer{flex:1}.updated{color:var(--muted);align-items:center;gap:7px;font-size:13px;display:flex}.icon-button{color:#aebbc2;background:0 0;border:0;border-radius:6px;place-items:center;padding:8px;display:grid}.icon-button:hover{background:var(--surface-3);color:#fff}.sidebar{border-right:1px solid var(--border);background:#0f181e;flex-direction:column;grid-area:2/1;padding:20px 10px 16px;display:flex}.sidebar nav{gap:6px;display:grid}.sidebar a{color:#a9b6bd;border-radius:var(--radius);align-items:center;gap:13px;min-height:48px;padding:0 15px;font-size:14px;text-decoration:none;display:flex}.sidebar a svg{width:19px}.sidebar a.active{background:var(--accent-soft);color:#ecffff;border-left:3px solid var(--accent);padding-left:12px}.sidebar-foot{border-top:1px solid var(--border);color:var(--muted);gap:8px;margin-top:auto;padding:17px 14px 0;font-size:12px;display:flex}.workspace{grid-area:2/2;min-width:0;padding:20px;overflow:auto}.workspace-heading{justify-content:space-between;align-items:flex-start;margin-bottom:17px;display:flex}h1,h2,p{margin:0}h1{font-size:25px;font-weight:650}.workspace-heading p,.editor-head p{color:var(--muted);margin-top:4px;font-size:12px}.primary,.secondary{border-radius:var(--radius);border:1px solid #0000;justify-content:center;align-items:center;gap:8px;min-height:42px;padding:0 17px;font-size:13px;font-weight:600;display:inline-flex}.primary{color:#f3ffff;background:#167f7e}.primary:hover{background:#1b9693}.secondary{color:#d6dee2;background:0 0;border-color:#44545d}.toolbar{gap:10px;margin-bottom:12px;display:flex}.search{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);width:min(380px,48%);min-height:40px;color:var(--muted);align-items:center;gap:8px;padding:0 12px;display:flex}.search input{width:100%;color:var(--text);background:0 0;border:0;outline:0}select,.field input{min-height:40px;color:var(--text);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);outline:none;padding:0 11px}.toolbar>select{min-width:190px}.wifi-strip{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);grid-template-columns:auto 310px minmax(220px,1fr);align-items:center;gap:16px;margin-bottom:12px;padding:11px 13px;display:grid}.wifi-title{align-items:center;gap:8px;font-size:13px;font-weight:600;display:flex}.mode-switch{border:1px solid var(--border);border-radius:var(--radius);grid-template-columns:1fr 1fr;display:grid;overflow:hidden}.mode-switch button{color:#aab6bc;background:0 0;border:0;min-height:46px;font-size:13px}.mode-switch small{color:var(--muted);margin-top:2px;font-size:10px;display:block}.mode-switch button.selected{color:#78eee7;box-shadow:inset 0 0 0 1px var(--accent);background:#133338}.pac-url{border-left:1px solid var(--border);color:#72d9d3;justify-content:space-between;align-items:center;gap:8px;min-width:0;padding-left:12px;font-size:12px;display:flex}.pac-url span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.pac-url button{color:#aebbc2;background:0 0;border:0;padding:7px}.routes-table{border:1px solid var(--border);border-radius:var(--radius);background:#0f181e;overflow:hidden}.table-head,.route-row{grid-template-columns:82px minmax(150px,1.35fr) 110px minmax(120px,1fr) minmax(145px,1fr) 104px;align-items:center;display:grid}.table-head{background:var(--surface-2);color:#aebbc2;text-transform:uppercase;letter-spacing:.04em;min-height:43px;padding:0 14px;font-size:11px}.route-row{text-align:left;background:0 0;border:0;border-top:1px solid #25343c;width:100%;min-height:54px;padding:0 14px;font-size:12.5px}.route-row:hover{background:#142128}.route-row.selected{box-shadow:inset 3px 0 var(--accent);background:#123b3f}.resource{text-overflow:ellipsis;white-space:nowrap;align-items:center;gap:8px;min-width:0;font-weight:550;display:flex;overflow:hidden}.priority{color:var(--muted)}.action{color:#61d9d3;font-size:11px}.action-ru_direct{color:#60cf8e}.action-ru_zapret{color:var(--amber)}.action-warp_test{color:#bb90ed}.action-block{color:var(--red)}.status{color:#bdc8cd;align-items:center;gap:7px;display:flex}.status svg{color:#819099;margin-left:auto}.status i.off{background:var(--muted)}.routes-table footer{border-top:1px solid var(--border);min-height:38px;color:var(--muted);align-items:center;padding:0 14px;font-size:11px;display:flex}.editor{border-left:1px solid var(--border);background:#121c22;flex-direction:column;grid-area:2/3;min-width:0;display:flex}.editor-head{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;min-height:75px;padding:15px 18px;display:flex}.editor-head h2{font-size:17px;font-weight:650}.editor-scroll{gap:16px;padding:17px 18px;display:grid;overflow:auto}.segmented{border:0;grid-template-columns:repeat(4,1fr);margin:0;padding:0;display:grid}.segmented legend,.field{color:#c9d2d7;font-size:12px;font-weight:600}.segmented legend{margin-bottom:8px}.segmented button{border:1px solid var(--border);color:#a8b4ba;background:0 0;min-height:37px;margin-left:-1px}.segmented button:first-of-type{border-radius:var(--radius) 0 0 var(--radius);margin-left:0}.segmented button:last-of-type{border-radius:0 var(--radius) var(--radius) 0}.segmented button.selected{color:#7ff5ed;border-color:var(--accent);z-index:1;background:#12383b}.field{gap:7px;display:grid}.field small,.toggle small{color:var(--muted);font-size:10.5px;font-weight:400;line-height:1.4}.field input,.field select{width:100%}.toggle{justify-content:space-between;align-items:center;display:flex}.toggle span{gap:4px;display:grid}.toggle strong{font-size:12px}.toggle input{appearance:none;background:#48545b;border-radius:20px;width:39px;height:22px;transition:all .18s;position:relative}.toggle input:after{content:"";background:#fff;border-radius:50%;width:16px;height:16px;transition:all .18s;position:absolute;top:3px;left:3px}.toggle input:checked{background:#178d88}.toggle input:checked:after{transform:translate(17px)}.message{border-radius:var(--radius);align-items:center;gap:8px;min-height:39px;padding:0 11px;font-size:11px;display:flex}.message svg{width:16px}.message.success{color:#8de6ae;background:#173829}.message.error{color:#faa;background:#3d2022}.editor-actions{border-top:1px solid var(--border);grid-template-columns:1fr 1fr;gap:10px;margin-top:auto;padding:14px 18px;display:grid}.bottom-nav,.mobile-menu{display:none}@media (width<=1180px){.app-shell{grid-template-columns:74px minmax(560px,1fr) 340px}.sidebar a{justify-content:center;padding:0;font-size:0}.sidebar a.active{box-shadow:inset 3px 0 var(--accent);border-left:0;padding:0}.sidebar-foot{display:none}.brand{min-width:175px}.wifi-strip{grid-template-columns:auto 260px minmax(180px,1fr)}.table-head,.route-row{grid-template-columns:64px minmax(130px,1.2fr) 96px minmax(105px,1fr) minmax(130px,1fr) 90px}}@media (width<=820px){.app-shell{background:var(--bg);padding:64px 0 72px;display:block}.topbar{gap:12px;height:64px;padding:0 17px 0 64px;position:fixed;inset:0 0 auto}.brand{min-width:0;font-size:14px}.brand span{font-size:21px}.health{margin-left:auto;font-size:0}.health:after{content:"OK";color:#b9c7cc;font-size:10px}.desktop-only,.sidebar{display:none!important}.workspace{padding:18px 14px;overflow:visible}.workspace-heading{align-items:center}.workspace-heading p{display:none}h1{font-size:23px}.workspace-heading .primary{min-height:40px;padding:0 13px}.toolbar{grid-template-columns:1fr 1fr;display:grid}.search{grid-column:1/-1;width:auto}.toolbar>select{width:100%;min-width:0}.wifi-strip{background:0 0;border-left:0;border-right:0;border-radius:0;padding:0;display:block}.wifi-title{display:none}.mode-switch{margin:10px 0}.pac-url{border-left:0;padding:10px 4px 12px}.table-head{display:none}.routes-table{border-left:0;border-right:0;border-radius:0;margin:0 -14px}.route-row{grid-template-rows:auto auto auto;grid-template-columns:minmax(120px,1.15fr) 1fr;gap:5px 15px;min-height:112px;padding:14px 32px 14px 17px;position:relative}.route-row .priority{font-size:0;position:absolute;top:16px;left:4px}.route-row .resource{white-space:normal;grid-row:1/4;align-self:start;padding-left:4px;font-size:13px}.route-row>span[data-label]:before{content:attr(data-label);color:var(--muted);margin-bottom:2px;font-size:9px;display:block}.route-row .action{font-size:10.5px}.route-row .status{right:10px;position:absolute;inset-block:0}.route-row .status i,.route-row .status:not(svg){font-size:0}.route-row .status svg{width:18px}.routes-table footer{padding-left:17px}.editor{z-index:20;border:1px solid var(--border);border-radius:16px 16px 0 0;position:fixed;inset:45% 0 64px;box-shadow:0 -18px 50px #0009}.editor-head{min-height:68px}.editor-scroll{grid-template-columns:1fr 1fr;gap:13px;padding:14px 16px}.segmented,.editor-scroll .field:first-of-type,.toggle,.message{grid-column:1/-1}.editor-actions{padding:11px 16px}.bottom-nav{z-index:30;border-top:1px solid var(--border);background:#0f181ef5;grid-template-columns:repeat(4,1fr);height:64px;display:grid;position:fixed;inset:auto 0 0}.bottom-nav a{color:var(--muted);flex-direction:column;justify-content:center;align-items:center;gap:4px;font-size:10px;display:flex}.bottom-nav a svg{width:19px}.bottom-nav a.active{color:#66e0d9}.mobile-menu{z-index:10;background:0 0;border:0;place-items:center;width:38px;height:38px;display:grid;position:fixed;top:14px;left:15px}}@media (width<=520px){.editor{top:42%}.editor-scroll{grid-template-columns:1fr}.editor-scroll .field,.segmented,.toggle,.message{grid-column:1}.segmented button{padding:0 5px;font-size:10.5px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important}}
