:root{--bg:#060913;--panel:#0b1120e8;--panel2:#101827;--line:#1f2a3d;--text:#f8fafc;--muted:#8b9bb4;--cyan:#35d6ff;--blue:#6c7cff;--violet:#a855f7;--green:#2dd4a7;--amber:#f7c66b;--red:#ff6b7a;--shadow:0 18px 70px #0008}*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;min-height:100vh;color:var(--text);font-family:Inter,Tahoma,Arial,sans-serif;background:radial-gradient(circle at 82% -8%,#1a2f70 0,transparent 29%),radial-gradient(circle at 12% 20%,#36136a55 0,transparent 30%),linear-gradient(180deg,#070b14,#05070d 58%,#05070b);overflow-x:hidden}.noise{position:fixed;inset:0;pointer-events:none;opacity:.028;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='90'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}.sidebar{position:fixed;right:18px;top:18px;bottom:18px;width:274px;padding:20px 14px;border:1px solid #22304a;background:linear-gradient(180deg,#0b1120e8,#080d18e8);backdrop-filter:blur(22px);border-radius:24px;box-shadow:var(--shadow);display:flex;flex-direction:column;z-index:5}.brand{display:flex;align-items:center;gap:12px;padding:3px 8px 18px}.brand-mark{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-weight:900;font-size:22px;color:#06101a;background:linear-gradient(135deg,var(--cyan),#93c5fd 45%,#c084fc);box-shadow:0 0 32px #35d6ff44}.brand strong{display:block;font-size:18px;letter-spacing:3px}.brand span{display:block;color:#79cfff;font-size:9px;letter-spacing:2.3px;margin-top:3px}.server-pill{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid #20324d;border-radius:14px;background:#0a1423;margin-bottom:16px}.server-pill i,.live-chip i{width:8px;height:8px;background:var(--green);border-radius:50%;box-shadow:0 0 14px #2dd4a7}.server-pill b{font-size:12px}.server-pill small{display:block;color:var(--muted);font-size:10px;margin-top:2px}.nav-label{font-size:9px;color:#556780;letter-spacing:1.8px;margin:15px 10px 8px}.sidebar nav{display:grid;gap:6px;overflow:auto}.sidebar nav button{display:flex;align-items:center;gap:12px;width:100%;border:1px solid transparent;background:transparent;color:#a8b5c9;padding:11px 12px;border-radius:12px;text-align:right;cursor:pointer;transition:.2s}.sidebar nav button span{display:grid;place-items:center;width:22px;color:#7f91a9}.sidebar nav button:hover{background:#101a2a;border-color:#24334e;color:#fff}.sidebar nav button.active{background:linear-gradient(90deg,#132840,#13203a);border-color:#2e5170;color:#dff8ff;box-shadow:inset 3px 0 0 var(--cyan)}.sidebar-footer{margin-top:auto;padding-top:14px;border-top:1px solid #1b2739;display:flex;align-items:center;justify-content:space-between;color:#64758f;font-size:11px}.logout{border:1px solid #2c3b51;background:#0a101b;color:#aab7c9;border-radius:10px;padding:8px 10px;cursor:pointer}.workspace{margin-right:316px;padding:26px 28px 44px;max-width:1750px}.topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.eyebrow{font-size:9px;color:#6fbfff;letter-spacing:2.2px;font-weight:700}.eyebrow.centered{text-align:center}.topbar h1{margin:6px 0 0;font-size:30px}.top-actions{display:flex;align-items:center;gap:10px}.live-chip{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;border:1px solid #254833;background:#0d1b18;color:#9ff0ce;font-size:11px}.icon-btn{width:38px;height:38px;border-radius:12px;border:1px solid #28354a;background:#0b111d;color:#dce7f5;cursor:pointer}.hero{border:1px solid #21304a;background:linear-gradient(125deg,#0c1525e8,#0b1220cc 58%,#171134dd);border-radius:24px;padding:24px;box-shadow:var(--shadow);display:grid;grid-template-columns:1.35fr .9fr;gap:22px;position:relative;overflow:hidden}.hero:after{content:"";position:absolute;width:330px;height:330px;border-radius:50%;background:#35d6ff14;filter:blur(20px);left:-100px;top:-130px}.hero h2{font-size:28px;margin:5px 0 8px}.hero p{color:var(--muted);line-height:1.8;max-width:700px}.host-meta,.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.chip,.status-chip{padding:6px 9px;border:1px solid #2a3b57;border-radius:999px;background:#0b1423;color:#9db0c9;font-size:10px}.status-chip.ok{border-color:#275441;color:#9ff0ce;background:#0c1a16}.status-chip.warn{border-color:#604d24;color:#ffd58b;background:#1c170c}.status-chip.bad{border-color:#63313b;color:#ff9eaa;background:#1d0f14}.health-ring{display:grid;place-items:center;min-height:180px}.ring{width:150px;height:150px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--cyan) var(--pct),#152033 0);position:relative;box-shadow:0 0 60px #35d6ff22}.ring:before{content:"";position:absolute;inset:13px;border-radius:50%;background:#09111d}.ring div{position:relative;z-index:1;text-align:center}.ring b{font-size:30px}.ring span{font-size:10px;color:var(--muted);display:block}.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:14px}.kpi{border:1px solid #1e2a3e;background:linear-gradient(180deg,#0c1422e8,#09101be8);border-radius:18px;padding:17px;box-shadow:0 15px 50px #0004}.kpi .label{display:flex;justify-content:space-between;color:#8291a7;font-size:11px}.kpi .value{font-size:26px;font-weight:800;margin:10px 0 12px}.bar{height:7px;background:#121e30;border-radius:999px;overflow:hidden}.bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--cyan),var(--blue));box-shadow:0 0 12px #35d6ff66}.kpi.green .bar i{background:linear-gradient(90deg,var(--green),#7ee7c7)}.kpi.violet .bar i{background:linear-gradient(90deg,#7c6cff,var(--violet))}.kpi.amber .bar i{background:linear-gradient(90deg,#e7a93d,var(--amber))}.two-col{display:grid;grid-template-columns:1.25fr .75fr;gap:14px;margin-top:14px}.panel{border:1px solid #1e2a3e;background:linear-gradient(180deg,#0b1320e8,#080e18e8);border-radius:18px;padding:18px;box-shadow:0 15px 50px #0004}.panel+.panel{margin-top:14px}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;gap:12px}.panel-head h3{margin:0;font-size:14px}.panel-head span{font-size:10px;color:var(--muted)}.table{overflow:auto}.row{display:grid;grid-template-columns:1.25fr .8fr .8fr 1fr;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid #172336;min-width:760px}.row:last-child{border-bottom:0}.status-dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-left:8px}.status-dot.ok{background:var(--green);box-shadow:0 0 12px #2dd4a777}.status-dot.bad{background:var(--red)}.muted{color:var(--muted);font-size:11px}.quick-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.quick-card{padding:13px;border:1px solid #23334b;border-radius:14px;background:#0a1321}.quick-card b{display:block;font-size:13px}.quick-card span{display:block;color:var(--muted);font-size:10px;margin-top:4px}.primary,.ghost,.danger,.soft{border-radius:10px;padding:9px 12px;cursor:pointer}.primary{border:1px solid #3f7da0;background:linear-gradient(135deg,#35d6ff,#6c7cff);color:#06111a;font-weight:800}.ghost{border:1px solid #2b3a51;background:#0b111c;color:#d7e0ec}.soft{border:1px solid #394158;background:#121726;color:#b7c3d4}.danger{border:1px solid #63303a;background:#1d0f14;color:#ff9aa5}.toolbar{display:flex;gap:7px;flex-wrap:wrap}.form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.form-grid.two{grid-template-columns:repeat(2,1fr)}.form-grid label{font-size:11px;color:#9aa9bd}.form-grid input,.form-grid textarea,.form-grid select,.login-card input{width:100%;margin-top:6px;padding:12px;border:1px solid #2a3950;background:#070d16;color:#f8fafc;border-radius:11px;outline:none}.form-grid textarea{min-height:86px;resize:vertical}.form-grid input:focus,.form-grid textarea:focus,.form-grid select:focus,.login-card input:focus{border-color:#3cb8e1;box-shadow:0 0 0 3px #35d6ff18}.password-tools{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px}.empty{padding:30px;text-align:center;color:var(--muted)}.notice{padding:12px 14px;border-radius:12px;border:1px solid #5f4d22;background:#1b160b;color:#f5d89a;font-size:11px;line-height:1.8;margin:12px 0}.modal-backdrop{position:fixed;inset:0;background:#000a;backdrop-filter:blur(6px);z-index:20;display:grid;place-items:center;padding:18px}.modal{width:min(760px,96vw);max-height:92vh;overflow:auto;background:#0a111d;border:1px solid #2c3d57;border-radius:22px;padding:22px;box-shadow:0 40px 120px #000c}.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.modal-head h3{margin:0}.close-btn{border:1px solid #34445b;background:#0d1420;color:#d8e2ef;width:34px;height:34px;border-radius:10px;cursor:pointer}.login-body{display:grid;place-items:center;min-height:100vh;overflow:hidden}.login-orb{position:fixed;border-radius:50%;filter:blur(12px);opacity:.35}.orb-a{width:420px;height:420px;background:#2258ff44;right:-120px;top:-120px}.orb-b{width:360px;height:360px;background:#7a2cff44;left:-100px;bottom:-130px}.login-card{width:min(430px,92vw);padding:34px;background:#0a111de8;border:1px solid #26354d;border-radius:26px;box-shadow:0 40px 120px #000b;backdrop-filter:blur(25px);position:relative;z-index:2}.login-mark{margin:0 auto 18px;width:58px;height:58px;font-size:26px}.login-card h1{text-align:center;letter-spacing:3px;margin:8px 0}.login-card h1 span{color:var(--cyan)}.login-card>p{text-align:center;color:var(--muted);font-size:12px}.login-card label{display:block;margin:16px 0;color:#9facbd;font-size:11px}.primary-btn{width:100%;padding:13px;border:0;border-radius:12px;background:linear-gradient(135deg,#35d6ff,#6c7cff 55%,#a855f7);color:#06101a;font-weight:900;cursor:pointer;box-shadow:0 12px 30px #3758ff44}.login-meta{display:flex;justify-content:space-between;margin-top:16px;color:#5f7088;font-size:9px}.alert{margin:14px 0;padding:10px;border-radius:10px;border:1px solid #63313b;background:#1d0e14;color:#ffb6bd}@media(max-width:1100px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.two-col,.hero{grid-template-columns:1fr}.health-ring{min-height:140px}}@media(max-width:780px){.sidebar{right:10px;top:10px;bottom:10px;width:72px;padding:13px 8px}.brand>div:last-child,.server-pill>div,.nav-label{display:none}.sidebar nav button{justify-content:center;font-size:0}.sidebar nav button span{font-size:16px}.sidebar-footer>span{display:none}.workspace{margin-right:94px;padding:18px 12px}.kpi-grid{grid-template-columns:1fr}.form-grid,.form-grid.two{grid-template-columns:1fr}.topbar h1{font-size:23px}.row{min-width:720px}}.history-chart{width:100%;height:230px;display:block;background:linear-gradient(180deg,#0b1422,#080e18);border:1px solid #18263a;border-radius:14px;padding:8px}.chart-legend{display:flex;gap:16px;align-items:center;justify-content:flex-end;margin-top:10px;color:var(--muted);font-size:10px}.legend-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-left:6px}.legend-dot.cpu{background:var(--cyan);box-shadow:0 0 9px #35d6ff88}.legend-dot.mem{background:var(--green);box-shadow:0 0 9px #2dd4a788}
/* v0.6 Account Center + global command UX */
.command-trigger{display:flex;align-items:center;gap:9px;height:38px;padding:0 11px;border:1px solid #2a3950;border-radius:12px;background:linear-gradient(180deg,#0d1624,#0a101a);color:#c8d5e6;cursor:pointer}.command-trigger span{font-size:16px;color:var(--cyan)}.command-trigger b{font-size:11px;font-weight:600}.command-trigger kbd,.command-modal kbd{font:10px/1 monospace;color:#8ea0b7;border:1px solid #34445b;background:#08101b;border-radius:6px;padding:5px 6px}.account-hero,.security-hero,.update-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;background:radial-gradient(circle at 0 0,#233d7138,transparent 35%),linear-gradient(135deg,#0d1727,#0b1120 58%,#13122a)}.account-hero h2,.security-hero h2,.update-hero h2{margin:6px 0 8px;font-size:25px}.risk-card,.security-score,.version-stack{min-width:170px;padding:16px;border:1px solid #30425d;border-radius:17px;background:#091321;box-shadow:inset 0 1px #ffffff0b}.risk-card span,.risk-card small,.security-score span,.version-stack span{display:block;color:var(--muted);font-size:10px}.risk-card b,.security-score b,.version-stack b{display:block;font-size:24px;margin:5px 0}.version-stack .accent{color:var(--cyan)}.input-action{display:flex;gap:7px;align-items:flex-end}.input-action input{flex:1}.recommended{border-color:#35647e!important;color:#c8f5ff!important;box-shadow:0 0 0 2px #35d6ff0d inset}.provision-preview{align-self:stretch;padding:14px;border:1px solid #33405b;border-radius:13px;background:linear-gradient(145deg,#0d1625,#0b101b);display:flex;flex-direction:column;justify-content:center}.provision-preview span{font-size:9px;letter-spacing:1.5px;color:#7b8ba4}.provision-preview b{margin:6px 0;color:#ffd68a}.provision-preview small{color:var(--muted);line-height:1.7}.wide-btn{min-width:220px}.account-tools{align-items:flex-end}.filterbar{display:flex;gap:8px;flex-wrap:wrap}.filterbar input,.filterbar select{border:1px solid #2b3a50;background:#080e18;color:#dfe8f3;border-radius:10px;padding:9px 11px}.filterbar input{min-width:250px}.bulkbar{padding:10px 0 4px;border-top:1px solid #142034;border-bottom:1px solid #142034;margin-bottom:4px}.check-user{display:flex;gap:10px;align-items:flex-start}.check-user input{margin-top:4px;accent-color:#35d6ff}.credential-modal{background:radial-gradient(circle at 80% 0,#1f3e6c55,transparent 30%),#09111e}.credential-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.credential-grid>div{padding:13px;border:1px solid #263750;border-radius:13px;background:#08101b}.credential-grid span{display:block;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:1px}.credential-grid b{display:block;margin-top:6px;font-size:14px;word-break:break-all}.credential-secret{color:#9ff0ce!important;font-size:20px!important;letter-spacing:1px}.timeline{display:grid;gap:10px}.timeline>div{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid #203049;border-radius:12px;background:#09121f}.timeline b{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:#102c3a;color:#8de9ff}.timeline span{font-size:11px;color:#b8c5d7}.command-box{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px;padding:12px;border:1px dashed #36506d;border-radius:12px;background:#070d16;color:#a9edff;font-family:monospace}.command-modal{width:min(620px,94vw);background:#08101b;border:1px solid #2c3d57;border-radius:20px;box-shadow:0 40px 120px #000c;padding:12px}.command-modal>input{width:100%;padding:15px;border:1px solid #30415c;border-radius:13px;background:#0b1422;color:white;outline:none;font-size:14px}.command-modal>input:focus{border-color:#3dbce3;box-shadow:0 0 0 3px #35d6ff18}.command-modal #commandList{display:grid;gap:5px;margin-top:9px;max-height:420px;overflow:auto}.command-modal #commandList button{display:flex;justify-content:space-between;align-items:center;width:100%;padding:12px 13px;border:1px solid transparent;border-radius:11px;background:transparent;color:#cbd6e5;cursor:pointer;text-align:right}.command-modal #commandList button:hover{background:#101b2b;border-color:#243a55;color:#fff}.toast{position:fixed;left:24px;bottom:24px;z-index:50;transform:translateY(20px);opacity:0;pointer-events:none;padding:11px 14px;border:1px solid #2e5c50;border-radius:12px;background:#0b1916;color:#aaf2d8;box-shadow:0 16px 50px #0009;transition:.2s}.toast.show{transform:none;opacity:1}.security-score{text-align:center}.update-hero .version-stack{display:grid;grid-template-columns:1fr auto;gap:4px 12px;align-items:end}.update-hero .version-stack b{font-size:18px;margin:0}
@media(max-width:900px){.command-trigger b,.command-trigger kbd{display:none}.filterbar{width:100%}.filterbar input{min-width:0;flex:1}.credential-grid{grid-template-columns:repeat(2,1fr)}.account-hero,.security-hero,.update-hero{align-items:flex-start;flex-direction:column}.risk-card,.security-score,.version-stack{width:100%}}
@media(max-width:560px){.credential-grid{grid-template-columns:1fr}.command-trigger{width:38px;padding:0;justify-content:center}.top-actions{gap:6px}}

/* v0.7 release-candidate visual system */
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 0 62%,#35d6ff05 62% 63%,transparent 63%),radial-gradient(circle at 72% 14%,#6c7cff10,transparent 22%);z-index:-1}
.sidebar{border-color:#20314d;background:linear-gradient(180deg,#09111fee,#070c16ee);box-shadow:0 24px 80px #000a,inset 0 1px #ffffff08}.brand-mark{position:relative;overflow:hidden}.brand-mark:after{content:"";position:absolute;inset:2px;border:1px solid #ffffff33;border-radius:12px}.sidebar nav button{position:relative;overflow:hidden}.sidebar nav button.active:after{content:"";position:absolute;left:-30px;top:-30px;width:80px;height:80px;border-radius:50%;background:#35d6ff12;filter:blur(10px)}
.topbar{position:sticky;top:0;z-index:4;padding:10px 0 18px;background:linear-gradient(180deg,#060913 70%,transparent);backdrop-filter:blur(12px)}.environment-chip{display:grid;gap:2px;padding:7px 11px;border:1px solid #243650;border-radius:11px;background:#09111d}.environment-chip span{font-size:8px;letter-spacing:1.5px;color:#597089}.environment-chip b{font-size:10px;color:#cbd9ec;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.protocol-hero{display:flex;justify-content:space-between;align-items:center;gap:20px;background:radial-gradient(circle at 12% -20%,#2475ff2b,transparent 38%),radial-gradient(circle at 90% 0,#a855f71c,transparent 30%),linear-gradient(135deg,#0d1728,#09101b)}.protocol-hero h2{font-size:30px;margin:7px 0}.protocol-count{min-width:170px;text-align:center;padding:18px;border:1px solid #2d4564;border-radius:18px;background:#08111e;box-shadow:inset 0 1px #ffffff0b,0 16px 45px #0005}.protocol-count b{display:block;font-size:34px;background:linear-gradient(90deg,var(--cyan),#9b8cff);-webkit-background-clip:text;color:transparent}.protocol-count span{color:var(--muted);font-size:10px}.capability-strip{display:flex;gap:8px;overflow:auto;padding:12px 2px 4px;margin-bottom:10px}.capability{min-width:max-content;padding:8px 11px;border:1px solid #273349;border-radius:999px;background:#080e18;color:#65758c;font-size:11px;text-transform:uppercase}.capability small{margin-right:6px;color:#44546a}.capability.ready{border-color:#245a54;background:#0a1918;color:#9be7d2}.protocol-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:14px 0}.protocol-tile{display:flex;gap:15px;padding:18px;border:1px solid #22334c;border-radius:19px;background:linear-gradient(150deg,#0c1524,#08101a 65%);box-shadow:0 18px 52px #0004;transition:transform .18s,border-color .18s}.protocol-tile:hover{transform:translateY(-2px);border-color:#345275}.protocol-icon{flex:0 0 50px;width:50px;height:50px;display:grid;place-items:center;border-radius:15px;background:linear-gradient(135deg,#183b55,#33235e);border:1px solid #3a5876;color:#b8efff;font-size:20px;font-weight:900;box-shadow:0 0 25px #35d6ff12}.protocol-body{min-width:0;flex:1}.protocol-title{display:flex;align-items:center;justify-content:space-between;gap:10px}.protocol-title h3{margin:0;font-size:15px}.protocol-body p{color:var(--muted);font-size:11px;line-height:1.7;min-height:38px}.config-output{width:100%;min-height:360px;resize:vertical;padding:14px;border:1px solid #2b3d56;border-radius:13px;background:#050a12;color:#b7f1ff;font:12px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace;direction:ltr;text-align:left}.config-modal{width:min(900px,96vw)}
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.settings-card{margin-top:0!important}.domain-state{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}.domain-state>div{padding:13px;border:1px solid #203149;border-radius:13px;background:#09121f}.domain-state span{display:block;color:#63758e;font-size:9px;text-transform:uppercase;letter-spacing:1px}.domain-state b{display:block;margin-top:5px;font-size:12px;word-break:break-word}.single-label{display:block;font-size:11px;color:#9aa9bd}.single-label input{width:100%;margin-top:6px;padding:12px;border:1px solid #2a3950;background:#070d16;color:#f8fafc;border-radius:11px}
.panel,.kpi,.protocol-tile,.quick-card{backdrop-filter:blur(16px)}.quick-card{transition:.18s}.quick-card:hover{border-color:#36516f;transform:translateY(-1px)}.primary{box-shadow:0 8px 24px #35d6ff18}.status-chip.ok{box-shadow:0 0 16px #2dd4a711}.status-chip.warn{box-shadow:0 0 16px #f7c66b0d}
@media(max-width:1100px){.protocol-grid,.settings-grid{grid-template-columns:1fr}.protocol-hero{align-items:flex-start}.environment-chip{display:none}}
@media(max-width:640px){.protocol-tile{padding:14px}.protocol-icon{width:42px;height:42px;flex-basis:42px}.protocol-title{align-items:flex-start;flex-direction:column}.domain-state{grid-template-columns:1fr}.capability-strip{margin-left:-6px;margin-right:-6px;padding-left:6px;padding-right:6px}}

.xray-share{display:grid;grid-template-columns:220px 1fr;gap:18px;align-items:start}.xray-share img{width:220px;max-width:100%;background:#fff;padding:10px;border-radius:18px;border:1px solid #dbeafe}.xray-share span{display:block;color:var(--muted);font-size:10px;margin-bottom:7px}.xray-share textarea{width:100%;min-height:140px;resize:vertical;padding:13px;border:1px solid #2b3d56;border-radius:12px;background:#050a12;color:#b7f1ff;font:12px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;direction:ltr;text-align:left}.protocol-title .status-chip{margin:0}.protocol-tile .toolbar{margin-top:12px}
@media(max-width:700px){.xray-share{grid-template-columns:1fr}.xray-share img{margin:auto}}

html[dir="ltr"] .sidebar{right:auto;left:18px;border-left:1px solid #20314d;border-right:1px solid #20314d}html[dir="ltr"] .workspace{margin-right:0;margin-left:316px}html[dir="ltr"] .sidebar nav button{text-align:left}html[dir="ltr"] .status-dot{margin-left:0;margin-right:8px}html[dir="ltr"] .legend-dot{margin-left:0;margin-right:6px}html[dir="ltr"] .form-grid input,html[dir="ltr"] .form-grid textarea,html[dir="ltr"] .form-grid select{text-align:left}@media(max-width:780px){html[dir="ltr"] .sidebar{left:10px;right:auto}html[dir="ltr"] .workspace{margin-left:94px;margin-right:0}}

/* v0.8 account policy + protocol client surfaces */
.duration-tools{gap:5px}.duration-tools .soft{padding:7px 9px}.number-stepper{display:grid;grid-template-columns:38px 1fr 38px;gap:6px;align-items:end}.number-stepper input{text-align:center;margin-top:6px}.number-stepper .soft{height:42px;padding:0;font-size:18px}.protocol-clients-table{display:grid;gap:0}.protocol-client-row{display:grid;grid-template-columns:1.05fr 1.25fr .9fr 1fr;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid #172336;min-width:900px}.protocol-client-row:last-child{border-bottom:0}.client-main{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.protocol-pill{display:inline-flex;padding:4px 7px;border:1px solid #31506d;border-radius:999px;background:#0c1827;color:#93ddf5;font-size:9px;letter-spacing:.8px}.usage-track{height:6px;margin:7px 0;background:#101d2f;border-radius:999px;overflow:hidden}.usage-track i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#35d6ff,#6c7cff,#a855f7);box-shadow:0 0 12px #35d6ff55}.protocol-client-row .toolbar{justify-content:flex-end}
@media(max-width:900px){.protocol-client-row{min-width:840px}.duration-tools{max-width:100%;overflow:auto;flex-wrap:nowrap;padding-bottom:3px}.duration-tools .soft{white-space:nowrap}}

/* v0.8 appearance system */
body[data-theme="amoled"]{--bg:#000;--panel:#050505e8;--panel-solid:#050505;--panel-2:#090909;--line:#20242c;--line-strong:#343a46;background:radial-gradient(circle at 75% -10%,#12203b 0,transparent 24%),#000}
body[data-theme="amoled"] .sidebar{background:#030405f5}
body[data-theme="amoled"] .panel,
body[data-theme="amoled"] .kpi,
body[data-theme="amoled"] .protocol-tile,
body[data-theme="amoled"] .quick-card{background:linear-gradient(180deg,#080a0d,#030405)}
body[data-theme="graphite"]{--bg:#101216;--panel:#171a20e8;--panel-solid:#171a20;--panel-2:#1d2128;--line:#303640;--line-strong:#414957;--cyan:#66c7d9;--blue:#8392d9;--violet:#aa86c8;background:radial-gradient(circle at 80% 0,#28303a 0,transparent 28%),#101216}
body[data-theme="graphite"] .sidebar{background:linear-gradient(180deg,#16191f,#11141a)}
body[data-density="compact"] .panel{padding:13px}
body[data-density="compact"] .kpi{padding:12px}
body[data-density="compact"] .row,
body[data-density="compact"] .service-row,
body[data-density="compact"] .account-row,
body[data-density="compact"] .session-row,
body[data-density="compact"] .log-row{padding-top:8px;padding-bottom:8px}
body[data-density="compact"] .sidebar nav button{padding-top:8px;padding-bottom:8px}
body[data-density="compact"] .workspace{padding-top:18px}
.credential-grid.compact{grid-template-columns:repeat(4,1fr);margin-bottom:10px}
@media(max-width:720px){.credential-grid.compact{grid-template-columns:repeat(2,1fr)}}

/* v0.8 device/IP and renewal details */
button.status-chip{cursor:pointer;font:inherit}.ip-list{display:grid;gap:8px}.ip-list>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 13px;border:1px solid #22334b;border-radius:12px;background:#08111d}.ip-list b{direction:ltr;text-align:left;color:#c9f2ff}.ip-list span{font-size:10px;color:var(--muted)}.account-row .chips{margin-top:7px}.protocol-client-row .chips{margin-top:7px}.protocol-client-row .status-chip{white-space:nowrap}

.capability.advanced{border-color:#5a4a28;background:#18140b;color:#efd08b}.capability.advanced small{color:#a98d56}.capability.unavailable{opacity:.45;border-style:dashed}.capability.unavailable small{color:#6b7280}.capability.guided small{color:#4fb9d9}

/* v0.9 policy controls */
.policy-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:16px}.policy-summary>div{padding:12px;border:1px solid #243650;border-radius:13px;background:#08111d}.policy-summary span{display:block;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:1px}.policy-summary b{display:block;margin-top:6px;font-size:14px}.quota-tools{flex-wrap:wrap}.password-tools button:disabled,.soft:disabled{opacity:.38;cursor:not-allowed}.form-grid input:disabled{opacity:.55;background:#070b12}
@media(max-width:780px){.policy-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.policy-summary{grid-template-columns:1fr}}

/* public client subscription page */
.client-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 85% 0,#173369 0,transparent 26%),radial-gradient(circle at 10% 90%,#37165f55 0,transparent 32%),#060913}.client-shell{width:min(760px,100%)}.client-brand{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:18px}.client-brand b{display:block;letter-spacing:3px}.client-brand span{display:block;color:#72cfff;font-size:9px;letter-spacing:2px}.client-card{padding:26px;border:1px solid #263851;border-radius:24px;background:linear-gradient(155deg,#0d1728ed,#080f1aed);box-shadow:0 35px 100px #0009;backdrop-filter:blur(22px)}.client-card h1{font-size:30px;margin:7px 0 10px}.client-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:20px 0}.client-kpis>div{padding:13px;border:1px solid #22344e;border-radius:14px;background:#08111d}.client-kpis span{display:block;color:var(--muted);font-size:9px}.client-kpis b{display:block;margin-top:6px;font-size:14px;word-break:break-word}.usage-track.large{height:10px;margin:10px 0 18px}.client-actions{display:flex;gap:9px;flex-wrap:wrap}.link-btn{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.client-shell footer{text-align:center;color:#596a81;font-size:10px;margin-top:14px}@media(max-width:680px){.client-kpis{grid-template-columns:repeat(2,1fr)}.client-card{padding:19px}}

.scope-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0}.scope-grid label{display:flex;gap:10px;align-items:flex-start;padding:13px;border:1px solid #25364e;border-radius:13px;background:#08111d;cursor:pointer}.scope-grid input{margin-top:3px;accent-color:#35d6ff}.scope-grid b{display:block;font-size:12px}.scope-grid small{display:block;color:var(--muted);font-size:9px;margin-top:3px;line-height:1.5}@media(max-width:620px){.scope-grid{grid-template-columns:1fr}}

/* v0.10 unified Access Center */
.access-hero{display:flex;align-items:center;justify-content:space-between;gap:22px;background:radial-gradient(circle at 5% 0,#2e74ff29,transparent 32%),radial-gradient(circle at 92% 10%,#8b5cf622,transparent 26%),linear-gradient(135deg,#0d1727,#08111d)}.access-hero h2{margin:6px 0 8px;font-size:29px}.access-total{min-width:170px;padding:18px;text-align:center;border:1px solid #2b4564;border-radius:18px;background:#08111d;box-shadow:inset 0 1px #ffffff0a}.access-total b{display:block;font-size:34px;background:linear-gradient(90deg,var(--cyan),#a78bfa);-webkit-background-clip:text;color:transparent}.access-total span{display:block;color:var(--muted);font-size:10px}.access-create-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:14px 0}.access-create-card{display:flex;gap:12px;align-items:flex-start;padding:16px;border:1px solid #21344e;border-radius:18px;background:linear-gradient(150deg,#0c1523,#08101a);box-shadow:0 16px 48px #0004}.access-create-card>div:last-child{min-width:0;flex:1}.access-create-card h3{margin:1px 0 5px}.access-create-card p{min-height:36px;margin:0 0 12px;color:var(--muted);font-size:10px;line-height:1.6}.access-protocol-icon{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border-radius:13px;border:1px solid #355474;background:linear-gradient(135deg,#14324a,#34235f);color:#b8efff;font-weight:900}.access-head{align-items:flex-end}.delivery-legend{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 8px;padding:9px 0;border-top:1px solid #152239;border-bottom:1px solid #152239}.delivery-legend span{padding:5px 8px;border:1px solid #26374f;border-radius:999px;background:#08111c;color:#7f91a8;font-size:9px}.access-table{display:grid}.access-row{display:grid;grid-template-columns:1.25fr .8fr 1.15fr .75fr;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid #172336;min-width:980px}.access-row:last-child{border-bottom:0}.export-actions{justify-content:flex-start}.access-row .toolbar{flex-wrap:wrap}.access-row .protocol-pill{margin-inline-start:3px}.access-row .status-chip{white-space:nowrap}.access-row b{word-break:break-word}
@media(max-width:1200px){.access-create-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:860px){.access-hero{align-items:flex-start;flex-direction:column}.access-total{width:100%}.access-row{min-width:900px}}
@media(max-width:560px){.access-create-grid{grid-template-columns:1fr}.access-create-card p{min-height:0}}


/* v0.11 control-center redesign */
:root{
  --shell:#070b13;--surface:#0b1220;--surface-2:#0e1727;--surface-3:#101c2e;
  --stroke:#1d2c42;--stroke-hi:#2d4563;--accent:#44d7ff;--accent-2:#7c73ff;
  --text-soft:#a8b6c9;
}
body{background:
  radial-gradient(circle at 84% -8%,#17336f55 0,transparent 27%),
  radial-gradient(circle at 12% 38%,#52217028 0,transparent 30%),
  linear-gradient(180deg,#060912,#05070c 72%);
}
.ambient{position:fixed;pointer-events:none;border-radius:50%;filter:blur(80px);opacity:.18;z-index:-1}
.ambient-a{width:520px;height:520px;background:#235cff;top:-260px;right:25%}
.ambient-b{width:460px;height:460px;background:#8b36ff;bottom:-280px;left:-80px}
.sidebar{right:14px;top:14px;bottom:14px;width:264px;padding:17px 13px;border-radius:22px;border-color:#20324a;background:linear-gradient(180deg,#0a1220f5,#070c15f5);box-shadow:0 25px 90px #000b,inset 0 1px #ffffff08}
.workspace{margin-right:292px;padding:22px 24px 44px;max-width:none}
.brand{padding:3px 7px 14px;gap:11px}.brand-copy{min-width:0;flex:1}.release-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 14px #44d7ff88}
.node-card{position:relative;padding:11px 12px;background:linear-gradient(135deg,#0c1727,#0a111d);border-color:#243b58}.node-status{display:grid;place-items:center}.node-status i{display:block;width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 13px #2dd4a766}.node-live{margin-inline-start:auto;font-size:8px;letter-spacing:1.4px;color:#8ef2d0;border:1px solid #245241;border-radius:999px;padding:4px 6px}
.sidebar-create{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;margin:0 0 8px;padding:11px 12px;border:1px solid #356f8f;border-radius:12px;background:linear-gradient(135deg,#193952,#232c59);color:#dff9ff;cursor:pointer;box-shadow:0 9px 24px #0f8bb01a}.sidebar-create span{font-size:18px}.sidebar-create b{font-size:11px}
.sidebar nav{gap:4px}.sidebar nav button{padding:10px 11px;border-radius:11px}.sidebar nav button b{font-size:11px;font-weight:600}.sidebar nav button.active{background:linear-gradient(90deg,#132a3e,#151e35);border-color:#2e5875;box-shadow:inset 3px 0 0 var(--accent),0 8px 22px #0003}.nav-label{margin:13px 10px 7px;font-size:8px}
.sidebar-version{display:grid;gap:2px}.sidebar-version span{font-size:8px;text-transform:uppercase;letter-spacing:1.2px}.sidebar-version b{font-size:10px;color:#9aacbf}
.topbar{padding:8px 0 16px;margin-bottom:12px;background:linear-gradient(180deg,#060913e8 72%,transparent)}.page-heading h1{font-size:27px;letter-spacing:-.4px}.top-actions{gap:8px}.command-trigger,.environment-chip,.live-chip,.icon-btn{height:38px}
.panel{border-color:#1d2d43;background:linear-gradient(180deg,#0b1422e9,#08101ae9);box-shadow:0 18px 55px #0004}.primary,.ghost,.soft,.danger{border-radius:11px;transition:transform .15s,border-color .15s,filter .15s}.primary:hover,.ghost:hover,.soft:hover,.danger:hover{transform:translateY(-1px);filter:brightness(1.06)}.primary:disabled,.ghost:disabled,.soft:disabled{opacity:.48;cursor:wait;transform:none}.action-lg{padding:11px 15px}
.loading-state{min-height:260px;display:flex;align-items:center;justify-content:center;gap:12px;color:#9aabc1}.spinner{width:20px;height:20px;border:2px solid #29405c;border-top-color:var(--accent);border-radius:50%;animation:makiaSpin .75s linear infinite}@keyframes makiaSpin{to{transform:rotate(360deg)}}

/* Operations cockpit */
.command-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:1.35fr .65fr;gap:22px;padding:25px;border:1px solid #223852;border-radius:24px;background:
 radial-gradient(circle at 95% 0,#5b54ff26,transparent 31%),
 radial-gradient(circle at 8% 100%,#1fdcff12,transparent 38%),
 linear-gradient(135deg,#0d1828,#09111e 58%,#101127);box-shadow:0 24px 80px #0006}
.command-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 0 60%,#ffffff04 60% 60.4%,transparent 60.4%);pointer-events:none}
.command-hero-copy{position:relative;z-index:1}.command-hero h2{font-size:32px;margin:7px 0 6px;letter-spacing:-.6px}.command-hero p{max-width:720px;margin:0 0 14px;color:#91a2b9;line-height:1.9;font-size:12px}.hero-actions{display:flex;gap:8px;flex-wrap:wrap;margin:13px 0}
.hero-status-stack{display:grid;grid-template-columns:170px 1fr;align-items:center;gap:14px;position:relative;z-index:1}.health-orbit{--pct:80%;width:164px;height:164px;border-radius:50%;padding:10px;background:conic-gradient(var(--accent) var(--pct),#152238 0);box-shadow:0 0 55px #35d6ff1c}.health-orbit>div{height:100%;border-radius:50%;display:grid;place-items:center;align-content:center;background:#08111d;border:1px solid #203650}.health-orbit b{font-size:36px}.health-orbit span{font-size:9px;color:#7590aa;letter-spacing:1.3px}.hero-mini-grid{display:grid;gap:8px}.hero-mini-grid>div{padding:12px;border:1px solid #253750;border-radius:14px;background:#091321cc}.hero-mini-grid span{display:block;font-size:8px;color:#71839b;text-transform:uppercase;letter-spacing:1px}.hero-mini-grid b{display:block;margin-top:4px;font-size:16px}
.dashboard-metrics{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:12px 0}.dashboard-metrics .kpi{margin:0;padding:14px;border-radius:16px}.dashboard-metrics .kpi .value{font-size:22px}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(320px,.65fr);gap:12px;margin-top:12px}.dashboard-grid.lower{grid-template-columns:1fr 1fr}.dashboard-chart{min-width:0}
.access-mix{display:grid;grid-template-columns:1fr 1fr;gap:8px}.access-mix button{display:grid;grid-template-columns:10px 1fr auto;align-items:center;gap:8px;padding:11px;border:1px solid #22334a;border-radius:12px;background:#09121f;color:#cad6e5;text-align:start;cursor:pointer}.access-mix button:hover{border-color:#35516f}.access-mix span{font-size:10px}.access-mix b{font-size:17px}.mix-dot{width:8px;height:8px;border-radius:50%}.mix-dot.ssh{background:#3edcff}.mix-dot.xray{background:#806cff}.mix-dot.wg{background:#34d399}.mix-dot.ovpn{background:#f5b95a}
.dashboard-alert{display:flex;align-items:center;gap:10px;margin-top:10px;padding:12px;border-radius:12px;border:1px solid #264b3f;background:#0b1916}.dashboard-alert.warn{border-color:#604a24;background:#1a150b}.dashboard-alert b{font-size:22px}.dashboard-alert span{font-size:10px;color:#9aabc0}
.service-cards{display:grid;grid-template-columns:1fr 1fr;gap:8px}.service-card{display:grid;grid-template-columns:12px 1fr auto;align-items:center;gap:8px;padding:11px;border:1px solid #203047;border-radius:12px;background:#09121f}.service-card div{display:grid}.service-card b{font-size:11px}.service-card span{font-size:8px;color:#6d809a}.service-card strong{font-size:9px}.ok-text{color:#7de8c3}.bad-text{color:#ff9aa6}.session-cards{display:grid}.session-cards>div{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #172336}.session-cards>div:last-child{border-bottom:0}.avatar-mini{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;border:1px solid #31506f;background:linear-gradient(135deg,#102b40,#2a2454);font-size:11px;font-weight:800}.session-cards div>div{display:grid}.session-cards b{font-size:11px}.session-cards small,.session-cards time{font-size:9px;color:#72849d}

/* Access Center V2 */
.access-command{display:grid;grid-template-columns:1fr auto;align-items:center;gap:20px;padding:22px;border:1px solid #223851;border-radius:22px;background:radial-gradient(circle at 5% 50%,#21cfff14,transparent 32%),linear-gradient(135deg,#0d1727,#0a111e 62%,#12112c)}.access-command h2{margin:5px 0 6px;font-size:28px}.access-command p{margin:0;color:#8e9fb6;font-size:11px;line-height:1.8}.access-command-stats{display:grid;grid-template-columns:repeat(3,92px);gap:8px}.access-command-stats>div{padding:13px 9px;text-align:center;border:1px solid #263d58;border-radius:14px;background:#08121f}.access-command-stats b{display:block;font-size:24px}.access-command-stats span{display:block;margin-top:3px;font-size:8px;color:#71839c;text-transform:uppercase;letter-spacing:1px}
.protocol-launch-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0}.launch-card{position:relative;overflow:hidden;padding:16px;border:1px solid #21334a;border-radius:18px;background:linear-gradient(155deg,#0c1625,#08101b);min-height:166px}.launch-card:after{content:"";position:absolute;width:110px;height:110px;border-radius:50%;right:-55px;top:-55px;background:#35d6ff0a}.launch-card.xray:after{background:#7657ff16}.launch-card.wireguard:after{background:#2dd4a715}.launch-card.openvpn:after{background:#f5b95a12}.launch-top{display:flex;justify-content:space-between;align-items:center}.launch-count{font-size:20px;font-weight:800;color:#8397ae}.launch-card h3{margin:13px 0 5px;font-size:16px}.launch-card p{min-height:34px;margin:0;color:#7588a2;font-size:9px;line-height:1.7}.launch-action{position:absolute;bottom:14px;left:14px;right:14px;padding:9px;border:1px solid #31607d;border-radius:10px;background:#10263a;color:#bfeeff;font-weight:700;cursor:pointer}.launch-action:hover{border-color:#49c9ee;background:#12314a}.launch-action.setup{border-style:dashed;color:#e7c77f;border-color:#6a5528;background:#19150d}
.access-directory{padding:16px 18px}.directory-head{align-items:flex-end}.directory-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.segmented{display:flex;padding:3px;border:1px solid #263950;border-radius:11px;background:#07101a}.segmented button{border:0;background:transparent;color:#70839d;padding:7px 9px;border-radius:8px;cursor:pointer;font-size:9px}.segmented button.active{background:#14283b;color:#c8f4ff}.search-input{min-width:250px;border:1px solid #293b52;background:#07101a;color:#dce8f5;border-radius:11px;padding:9px 11px;outline:none}.search-input:focus{border-color:#3aaed3;box-shadow:0 0 0 3px #35d6ff12}.directory-summary{display:flex;gap:10px;flex-wrap:wrap;padding:9px 0;border-top:1px solid #17253a;border-bottom:1px solid #17253a;color:#71829a;font-size:8px}.directory-summary span{display:flex;align-items:center;gap:5px}.directory-summary i{width:7px;height:7px;border-radius:50%}.legend-native{background:#55d9ff}.legend-protected{background:#7d75ff}.legend-legacy{background:#e4b45a}
.access-cards{display:grid}.access-profile{display:grid;grid-template-columns:minmax(270px,1.35fr) minmax(150px,.65fr) minmax(250px,.9fr) auto;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid #18263a}.access-profile:last-child{border-bottom:0}.profile-identity{display:flex;align-items:center;gap:10px;min-width:0}.profile-avatar{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border:1px solid #315271;border-radius:12px;background:linear-gradient(135deg,#102b42,#292354);font-weight:900;color:#c9f5ff}.profile-name{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.profile-identity>div:last-child>span{display:block;margin-top:4px;color:#7588a1;font-size:9px}.profile-meta{display:grid;gap:3px}.profile-meta span{font-size:8px;color:#667991;text-transform:uppercase;letter-spacing:1px}.profile-meta b{font-size:11px}.profile-delivery,.profile-actions{display:flex;gap:6px;flex-wrap:wrap}.profile-actions{justify-content:flex-end}.icon-action,.more-action{border:1px solid #2b3d55;border-radius:10px;background:#0a131f;color:#c8d5e4;padding:8px 10px;font-size:9px;cursor:pointer}.icon-action.primaryish{border-color:#397590;background:linear-gradient(135deg,#16384b,#282c5b);color:#d7f7ff}.icon-action.warnish{border-color:#6a5324;color:#f2d28b;background:#19150b}.more-action.dangerish{border-color:#60313a;color:#ff9da9;background:#1c0f14}
.icon-action:hover,.more-action:hover{border-color:#4c6886;transform:translateY(-1px)}

/* Provisioning wizard */
.wizard-backdrop{background:#02050ad9}.provision-wizard{width:min(900px,96vw);padding:0;overflow:hidden;border-color:#2a4260;background:linear-gradient(180deg,#0b1422,#08101b)}.wizard-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 22px 14px}.wizard-head h3{margin:4px 0 0;font-size:20px}.wizard-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;padding:0 22px 18px}.wizard-steps>div{position:relative;display:flex;align-items:center;gap:7px;color:#5f728b;font-size:9px}.wizard-steps>div:after{content:"";position:absolute;top:13px;inset-inline-start:32px;inset-inline-end:4px;height:1px;background:#223249}.wizard-steps>div:last-child:after{display:none}.wizard-steps i{position:relative;z-index:1;display:grid;place-items:center;width:27px;height:27px;border:1px solid #2c405a;border-radius:9px;background:#08111d;font-style:normal}.wizard-steps .active{color:#d8f8ff}.wizard-steps .active i{border-color:#42b9de;background:#123047;box-shadow:0 0 18px #35d6ff22}.wizard-steps .done i{border-color:#32614f;background:#0e211a;color:#8af0cf}.wizard-body{min-height:330px;padding:22px;border-top:1px solid #17263a;border-bottom:1px solid #17263a;background:#080f19}.wizard-footer{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:15px 22px}.wizard-protocols{display:grid;grid-template-columns:1fr 1fr;gap:10px}.wizard-protocol{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:12px;padding:16px;border:1px solid #243750;border-radius:16px;background:#0a1421;color:#d9e5f2;text-align:start;cursor:pointer}.wizard-protocol:hover{border-color:#3c6281;background:#0c1827}.wizard-protocol>span{display:grid;place-items:center;width:44px;height:44px;border:1px solid #345979;border-radius:13px;background:linear-gradient(135deg,#113047,#2b2556);font-size:18px;font-weight:900}.wizard-protocol div{display:grid;gap:4px}.wizard-protocol b{font-size:13px}.wizard-protocol small{font-size:9px;color:#7587a0}.wizard-protocol em{font-style:normal;font-size:8px;color:#7ce8c3;border:1px solid #275645;border-radius:999px;padding:4px 6px}.wizard-protocol.not-ready em{color:#e6c274;border-color:#614e26}.wizard-section-title{margin-bottom:15px}.wizard-section-title h4{margin:0 0 5px;font-size:16px}.wizard-section-title p{margin:0;color:#7d8ea5;font-size:10px}.wizard-form{display:grid;gap:12px}.wizard-form.two{grid-template-columns:1fr 1fr}.wizard-form.three{grid-template-columns:repeat(3,1fr)}.wizard-form label,.delivery-box label{font-size:9px;color:#91a2b9}.wizard-form input,.wizard-form select,.delivery-box input{width:100%;margin-top:6px;padding:11px;border:1px solid #2a3b53;border-radius:11px;background:#070e18;color:#edf5ff;outline:none}.wizard-form input:focus,.wizard-form select:focus,.delivery-box input:focus{border-color:#42b8dc;box-shadow:0 0 0 3px #35d6ff12}.wizard-form small{display:block;margin-top:4px;color:#60738c}.preset-row{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px}.preset-row button{border:1px solid #2c4059;border-radius:8px;background:#0d1725;color:#9eb0c6;padding:6px 7px;font-size:8px;cursor:pointer}.preset-row button:hover{border-color:#3f7391;color:#d7f7ff}.wizard-note{display:flex;gap:10px;align-items:flex-start;margin-top:14px;padding:11px 12px;border:1px solid #304157;border-radius:12px;background:#0a1421}.wizard-note b{font-size:9px;color:#cbefff}.wizard-note span{font-size:9px;color:#7f91a8;line-height:1.6}.wizard-review-hint{display:grid;place-items:center;text-align:center;min-height:260px}.review-icon,.success-mark{display:grid;place-items:center;width:58px;height:58px;border-radius:18px;border:1px solid #2e6653;background:#0f221b;color:#8df2d1;font-size:28px;box-shadow:0 0 35px #2dd4a71c}.wizard-review-hint h4{margin:14px 0 5px}.wizard-review-hint p{max-width:480px;color:#7d8fa8;font-size:10px;line-height:1.8}.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.review-grid>div,.success-grid>div{padding:11px;border:1px solid #243750;border-radius:11px;background:#0a1320}.review-grid span,.success-grid span{display:block;color:#6f829b;font-size:8px;text-transform:uppercase}.review-grid b,.success-grid b{display:block;margin-top:4px;font-size:11px;word-break:break-word}.delivery-box{display:grid;grid-template-columns:1fr 270px;align-items:end;gap:14px;margin-top:14px;padding:14px;border:1px solid #344365;border-radius:14px;background:linear-gradient(135deg,#0d1826,#101329)}.delivery-box>div{display:grid;gap:4px}.delivery-box b{font-size:12px}.delivery-box span{font-size:9px;color:#8091a8}
.provision-success{width:min(650px,94vw);text-align:center;background:radial-gradient(circle at 50% 0,#285c7a25,transparent 35%),#09121e}.provision-success .success-mark{margin:0 auto 10px}.provision-success h3{font-size:22px;margin:7px}.provision-success>p{color:#8294aa;font-size:10px}.success-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:15px 0}.delivery-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:14px 0}.export-modal,.setup-modal{width:min(600px,94vw)}.export-modal{text-align:center}.export-shield{display:grid;place-items:center;width:64px;height:64px;margin:5px auto 12px;border-radius:18px;border:1px solid #4b4383;background:linear-gradient(135deg,#162d45,#30265b);font-size:28px;color:#c7bfff}.config-output.small{min-height:100px}
.diagnostics-modal{width:min(720px,94vw)}.diagnostic-score{display:flex;align-items:center;justify-content:space-between;padding:13px 14px;border:1px solid #2e5e4e;border-radius:13px;background:#0b1b16;margin-bottom:12px}.diagnostic-score.fail{border-color:#653039;background:#1e1014}.diagnostic-score b{font-size:18px}.diagnostic-score span{font-size:9px;color:#8da0b6}.diagnostic-list{display:grid;max-height:440px;overflow:auto}.diagnostic-list>div{display:grid;grid-template-columns:28px 1fr;gap:9px;align-items:start;padding:9px 0;border-bottom:1px solid #18263a}.diagnostic-list i{display:grid;place-items:center;width:24px;height:24px;border-radius:8px;font-style:normal}.diagnostic-list i.ok{background:#0e241c;color:#7ce8c3}.diagnostic-list i.bad{background:#241116;color:#ff9da8}.diagnostic-list div>div{display:grid;gap:3px}.diagnostic-list b{font-size:10px}.diagnostic-list span{font-size:8px;color:#72859f;word-break:break-word}

@media(max-width:1300px){
  .dashboard-metrics{grid-template-columns:repeat(3,1fr)}
  .protocol-launch-grid{grid-template-columns:repeat(2,1fr)}
  .access-profile{grid-template-columns:minmax(240px,1fr) minmax(140px,.6fr) minmax(220px,.9fr) auto}
}
@media(max-width:1000px){
  .command-hero,.dashboard-grid,.dashboard-grid.lower{grid-template-columns:1fr}
  .hero-status-stack{grid-template-columns:150px 1fr}.health-orbit{width:145px;height:145px}
  .access-command{grid-template-columns:1fr}.access-command-stats{grid-template-columns:repeat(3,1fr)}
  .access-directory{overflow:hidden}.access-cards{overflow:auto}.access-profile{min-width:880px}
  .wizard-form.three{grid-template-columns:1fr 1fr}.delivery-box{grid-template-columns:1fr}
}
@media(max-width:780px){
  .sidebar{width:74px;right:8px;top:8px;bottom:8px;padding:12px 7px}.workspace{margin-right:92px;padding:16px 10px 36px}
  .brand-copy,.release-dot,.node-card>div:not(.node-status),.node-live,.sidebar-create b,.sidebar-version{display:none}.sidebar-create{padding:9px}.sidebar-create span{font-size:20px}
  .sidebar nav button b{display:none}.sidebar nav button{justify-content:center}.sidebar nav button span{font-size:16px}.sidebar-footer{justify-content:center}
  .topbar{align-items:flex-start}.environment-chip{display:none}.dashboard-metrics{grid-template-columns:1fr 1fr}.command-hero{padding:18px}.command-hero h2{font-size:25px}.hero-status-stack{grid-template-columns:1fr}.health-orbit{margin:auto}
  .protocol-launch-grid{grid-template-columns:1fr 1fr}.directory-tools{width:100%}.search-input{width:100%;min-width:0}.segmented{max-width:100%;overflow:auto}
  .wizard-protocols,.wizard-form.two,.wizard-form.three,.review-grid,.success-grid{grid-template-columns:1fr}.wizard-steps span{display:none}.wizard-steps>div:after{inset-inline-start:31px}.wizard-body{padding:17px}.provision-wizard{max-height:96vh}
}
@media(max-width:520px){
  .dashboard-metrics,.protocol-launch-grid,.service-cards{grid-template-columns:1fr}.access-command-stats{grid-template-columns:repeat(3,1fr);gap:5px}.access-command-stats>div{padding:10px 5px}.command-trigger{display:none}
}
html[dir="ltr"] .sidebar{left:14px;right:auto}html[dir="ltr"] .workspace{margin-left:292px;margin-right:0}@media(max-width:780px){html[dir="ltr"] .sidebar{left:8px;right:auto}html[dir="ltr"] .workspace{margin-left:92px;margin-right:0}}


/* v0.11 normalized secondary views */
.view-intro{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:12px;padding:18px 20px;border:1px solid #21364f;border-radius:18px;background:radial-gradient(circle at 92% 0,#4b4cff16,transparent 32%),linear-gradient(135deg,#0c1725,#09111c)}.view-intro h2{margin:5px 0 5px;font-size:22px}.view-intro p{margin:0;color:#7f91aa;font-size:10px;line-height:1.75}.view-intro-stat{min-width:92px;padding:11px 12px;text-align:center;border:1px solid #2b425e;border-radius:13px;background:#08121f}.view-intro-stat b{display:block;font-size:22px}.view-intro-stat span{display:block;margin-top:2px;color:#71849d;font-size:8px;letter-spacing:1px}.view-intro-actions{display:flex;align-items:center;gap:8px}.modern-list{padding-top:15px}.security-control-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.security-control{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px;border:1px solid #22354d;border-radius:13px;background:#09131f}.security-control>div{display:grid;gap:3px}.security-control b{font-size:10px}.security-control span{font-size:8px;color:#74869e}.security-control i{display:grid;place-items:center;width:27px;height:27px;border-radius:9px;font-style:normal;font-weight:800}.security-control i.ok{color:#80eac7;background:#0f241c;border:1px solid #275746}.security-control i.warn{color:#f1cb80;background:#1b160c;border:1px solid #604d24}.backup-row,.audit-row{min-width:760px}
@media(max-width:1000px){.security-control-grid{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.view-intro{align-items:flex-start;flex-direction:column}.view-intro-stat,.view-intro-actions{width:100%}.view-intro-actions{justify-content:space-between}.security-control-grid{grid-template-columns:1fr}}


/* v0.11 Protocol Hub */
.protocol-command{display:grid;grid-template-columns:1fr auto;align-items:center;gap:18px;padding:21px;border:1px solid #223852;border-radius:20px;background:radial-gradient(circle at 90% 10%,#6b50ff1e,transparent 34%),linear-gradient(135deg,#0d1828,#09111d)}.protocol-command h2{margin:5px 0 6px;font-size:27px}.protocol-command p{margin:0;color:#8294ad;font-size:10px;line-height:1.8}.protocol-readiness{min-width:135px;text-align:center;padding:15px;border:1px solid #2c4563;border-radius:15px;background:#08131f}.protocol-readiness b{display:block;font-size:28px}.protocol-readiness span{display:block;margin-top:3px;color:#6e839c;font-size:8px;letter-spacing:1px}.engine-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;margin:12px 0}.engine-card{position:relative;min-height:215px;padding:15px;border:1px solid #21334b;border-radius:17px;background:linear-gradient(155deg,#0c1625,#08101b);overflow:hidden}.engine-card:after{content:"";position:absolute;width:110px;height:110px;border-radius:50%;right:-58px;top:-58px;background:#5474ff0e}.engine-card-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.engine-icon{display:grid;place-items:center;width:38px;height:38px;border:1px solid #345675;border-radius:12px;background:linear-gradient(135deg,#102d43,#2c2558);font-weight:900}.engine-state{padding:5px 7px;border:1px solid #2c3e54;border-radius:999px;font-size:8px}.engine-state.running{border-color:#295744;color:#8be9c8;background:#0d1d18}.engine-state.attention{border-color:#604e28;color:#ebca81;background:#1a160c}.engine-state.missing{color:#71839a}.engine-card h3{margin:12px 0 5px;font-size:14px}.engine-card p{min-height:44px;margin:0;color:#72869f;font-size:8.5px;line-height:1.7}.engine-meta{display:flex;gap:5px;flex-wrap:wrap;margin-top:9px}.engine-meta span{padding:4px 6px;border:1px solid #22364d;border-radius:999px;color:#71869f;font-size:7.5px}.engine-actions{position:absolute;bottom:13px;left:13px;right:13px;display:flex;gap:5px;flex-wrap:wrap}.engine-btn{border:1px solid #2d4159;border-radius:9px;background:#0a1420;color:#aab9ca;padding:7px 8px;font-size:8px;cursor:pointer}.engine-btn.primaryish{border-color:#376e8c;color:#c8f4ff;background:#11283a}.protocol-detail-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:10px;margin-bottom:10px}.capability-grid-v11{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.capability-card{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px;border:1px solid #23364c;border-radius:11px;background:#09131f}.capability-card>div{display:grid;gap:2px}.capability-card b{font-size:9px}.capability-card span{font-size:7px;color:#6d819a}.capability-card em{font-style:normal;font-size:7px;color:#61758f}.capability-card.ready em{color:#7de8c3}.capability-card.missing{opacity:.55}.engine-inbounds{display:grid;gap:6px;max-height:280px;overflow:auto}.engine-inbound{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px;border:1px solid #203149;border-radius:10px;background:#09121f}.engine-inbound>div{display:grid;gap:2px}.engine-inbound b{font-size:9px}.engine-inbound span{font-size:7px;color:#6e829b}.protocol-policy-mini{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.protocol-policy-mini>div{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px;border:1px solid #203149;border-radius:10px;background:#09121f}.protocol-policy-mini>div>div{display:grid;gap:2px}.protocol-policy-mini b{font-size:9px}.protocol-policy-mini span,.protocol-policy-mini strong{font-size:7px}
@media(max-width:1450px){.engine-grid{grid-template-columns:repeat(3,1fr)}.capability-grid-v11{grid-template-columns:repeat(3,1fr)}}
@media(max-width:1000px){.engine-grid{grid-template-columns:repeat(2,1fr)}.protocol-detail-grid{grid-template-columns:1fr}.protocol-policy-mini{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.protocol-command{grid-template-columns:1fr}.protocol-readiness{width:100%}.engine-grid,.capability-grid-v11,.protocol-policy-mini{grid-template-columns:1fr}}


/* v0.12 QR/Share Center */
.icon-action.shareish{border-color:#4557a7;background:linear-gradient(135deg,#152949,#32265d);color:#d9d4ff}
.share-modal{width:min(920px,96vw);background:radial-gradient(circle at 10% 0,#2a78a525,transparent 32%),radial-gradient(circle at 95% 0,#674fff1e,transparent 30%),#08111d}
.share-layout{display:grid;grid-template-columns:250px 1fr;gap:18px;align-items:start}.share-qr-wrap{display:grid;place-items:center;gap:8px;padding:14px;border:1px solid #2c4561;border-radius:18px;background:#0b1624}.share-qr{width:220px;max-width:100%;aspect-ratio:1/1;background:#fff;padding:10px;border-radius:15px}.share-qr.small{width:150px}.share-qr-wrap span{font-size:8px;letter-spacing:1.2px;color:#8397b0}.share-copy{display:grid;gap:10px}.share-copy p{margin:0;color:#8fa2bb;font-size:10px;line-height:1.8}.share-copy label{color:#8da0b8;font-size:9px}.share-copy textarea,.share-subscription textarea{width:100%;min-height:105px;margin-top:6px;padding:11px;border:1px solid #2c4058;border-radius:11px;background:#050b13;color:#b9efff;font:10px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;direction:ltr;text-align:left;resize:vertical}.share-subscription{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;margin-top:14px;padding:13px;border:1px solid #2d3d58;border-radius:14px;background:#0a1421}.share-subscription>div:first-child{display:grid;gap:3px}.share-subscription b{font-size:10px}.share-subscription span{font-size:8px;color:#71859e}.share-subscription textarea,.share-subscription .toolbar{grid-column:1/-1}

/* v0.12 Settings Center */
.settings-shell-v2{display:grid;grid-template-columns:205px minmax(0,1fr);gap:12px;align-items:start}.settings-nav-v2{position:sticky;top:94px;display:grid;gap:5px;padding:12px;border:1px solid #20334b;border-radius:17px;background:linear-gradient(180deg,#0b1523,#080f19);box-shadow:0 18px 55px #0004}.settings-nav-title{display:grid;gap:2px;padding:7px 8px 12px;border-bottom:1px solid #1c2b3f;margin-bottom:4px}.settings-nav-title b{font-size:14px}.settings-nav-title span{font-size:8px;letter-spacing:1px;color:#657a94}.settings-nav-v2 button{display:grid;grid-template-columns:27px 1fr;align-items:center;gap:8px;padding:9px;border:1px solid transparent;border-radius:10px;background:transparent;color:#8799af;text-align:start;cursor:pointer}.settings-nav-v2 button i{display:grid;place-items:center;width:27px;height:27px;border:1px solid #273a52;border-radius:8px;background:#09121e;font-style:normal}.settings-nav-v2 button span{font-size:9px}.settings-nav-v2 button:hover{border-color:#283f59;color:#c9d7e7}.settings-nav-v2 button.active{border-color:#31617e;background:linear-gradient(90deg,#10283a,#121b31);color:#d7f6ff;box-shadow:inset 3px 0 0 #42d5ff}.settings-content-v2{display:grid;gap:10px;min-width:0}.settings-section-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:17px 18px;border:1px solid #21364f;border-radius:17px;background:radial-gradient(circle at 93% 0,#6553ff18,transparent 35%),linear-gradient(135deg,#0c1725,#09111c)}.settings-section-head h2{margin:4px 0;font-size:20px}.settings-section-head p{margin:0;color:#7f92aa;font-size:9px;line-height:1.7}.settings-version{padding:7px 9px;border:1px solid #2c425d;border-radius:999px;color:#8fdcf4;font-size:9px}.settings-card-v2{padding:16px;border:1px solid #20324a;border-radius:16px;background:linear-gradient(180deg,#0b1421,#08101a);box-shadow:0 14px 45px #0003}.settings-card-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:13px}.settings-card-title>div{display:grid;gap:3px}.settings-card-title b{font-size:12px}.settings-card-title span{font-size:8px;color:#6e8199}.settings-form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.settings-form-grid.two{grid-template-columns:1fr 1fr}.settings-form-grid label{font-size:8px;color:#8294ac}.settings-form-grid input,.settings-form-grid select{width:100%;margin-top:5px;padding:10px;border:1px solid #293c54;border-radius:10px;background:#070e17;color:#e4edf7;outline:none}.settings-form-grid input:focus,.settings-form-grid select:focus{border-color:#3fb7da;box-shadow:0 0 0 3px #35d6ff10}.settings-form-grid small{display:block;margin-top:4px;color:#61758e}.settings-actions{display:flex;justify-content:flex-end;gap:7px;margin-top:13px;padding-top:12px;border-top:1px solid #18263a}.settings-shortcuts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.settings-shortcuts button{display:grid;gap:4px;padding:12px;border:1px solid #22364e;border-radius:12px;background:#09131f;color:#d1dfed;text-align:start;cursor:pointer}.settings-shortcuts button:hover{border-color:#38617f;transform:translateY(-1px)}.settings-shortcuts b{font-size:10px}.settings-shortcuts span{font-size:8px;color:#6f829a;line-height:1.5}.domain-health-v2{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:13px}.domain-health-v2>div{padding:11px;border:1px solid #22364e;border-radius:11px;background:#09131f}.domain-health-v2 span{display:block;color:#647991;font-size:7px;text-transform:uppercase;letter-spacing:.8px}.domain-health-v2 b{display:block;margin-top:4px;font-size:9px;word-break:break-word}.warn-text{color:#e8c375}.settings-inline-note{display:grid;align-content:center;padding:10px;border:1px solid #263a51;border-radius:11px;background:#09131e}.settings-inline-note b{font-size:14px}.settings-inline-note span{font-size:8px;color:#72859e}.security-feature-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px;border:1px solid #22364d;border-radius:12px;background:#09131f}.security-feature-row>div{display:grid;gap:3px}.security-feature-row b{font-size:10px}.security-feature-row span{font-size:8px;color:#71859e}
@media(max-width:1100px){.settings-form-grid{grid-template-columns:1fr 1fr}.settings-shortcuts,.domain-health-v2{grid-template-columns:1fr 1fr}}
@media(max-width:780px){.settings-shell-v2{grid-template-columns:1fr}.settings-nav-v2{position:static;display:flex;overflow:auto}.settings-nav-title{display:none}.settings-nav-v2 button{min-width:max-content;grid-template-columns:25px auto}.settings-content-v2{min-width:0}.share-layout{grid-template-columns:1fr}.share-qr-wrap{width:min(280px,100%);margin:auto}.settings-form-grid,.settings-form-grid.two{grid-template-columns:1fr}}
@media(max-width:520px){.settings-shortcuts,.domain-health-v2{grid-template-columns:1fr}.settings-section-head{align-items:flex-start;flex-direction:column}.security-feature-row{align-items:flex-start;flex-direction:column}}


/* v0.12 client QR portal */
.client-qr-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:15px 0}.client-qr-card{display:grid;place-items:center;text-align:center;gap:5px;padding:13px;border:1px solid #263b55;border-radius:15px;background:#09131f}.client-qr-card img{width:min(210px,90%);background:#fff;padding:9px;border-radius:14px}.client-qr-card b{font-size:10px;margin-top:3px}.client-qr-card span{font-size:8px;color:#73869f;line-height:1.6}
@media(max-width:580px){.client-qr-grid{grid-template-columns:1fr}}


/* v0.12 Share Center / Settings V2 completion */
.xray-share-details{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:14px}
.xray-share-details>div{min-width:0;padding:10px 11px;border:1px solid #253b55;border-radius:12px;background:#09131f}
.xray-share-details span{display:block;color:#6f839d;font-size:7px;text-transform:uppercase;letter-spacing:.7px}
.xray-share-details b{display:block;margin-top:4px;color:#d8e7f5;font-size:9px;word-break:break-word}
.share-advanced{display:grid;grid-template-columns:auto 90px 1fr;gap:7px 10px;align-items:center;margin-top:10px;padding:12px;border:1px solid #3a3159;border-radius:13px;background:#100f20}
.share-advanced>b{grid-row:1/3;align-self:start;color:#b9a8ff;font-size:9px;letter-spacing:1px}
.share-advanced span{color:#7e759b;font-size:8px}
.share-advanced code{min-width:0;overflow-wrap:anywhere;color:#d5caff;font-size:8px;direction:ltr;text-align:left}
.client-share-box{display:grid;grid-template-columns:1fr auto;gap:9px;align-items:end;margin:15px 0;padding:13px;border:1px solid #253a53;border-radius:14px;background:#08111d}
.client-share-box label{min-width:0;color:#778aa2;font-size:9px}
.client-share-box textarea{width:100%;min-height:80px;margin-top:6px;padding:10px;border:1px solid #273c55;border-radius:10px;background:#050b13;color:#bdefff;font:9px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace;direction:ltr;text-align:left;resize:vertical}
.recovery-list{display:grid;gap:7px;margin-top:12px}
.recovery-list>div{display:flex;justify-content:space-between;gap:10px;padding:10px 11px;border:1px solid #21354d;border-radius:10px;background:#09131f}
.recovery-list b{font-size:9px;word-break:break-word}.recovery-list span{color:#71859e;font-size:8px;white-space:nowrap}
html[dir="ltr"] .settings-nav-v2 button.active{box-shadow:inset 3px 0 0 #42d5ff}
html[dir="rtl"] .settings-nav-v2 button.active{box-shadow:inset -3px 0 0 #42d5ff}
@media(max-width:1100px){.xray-share-details{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:780px){.xray-share-details{grid-template-columns:repeat(2,minmax(0,1fr))}.share-advanced{grid-template-columns:1fr}.share-advanced>b{grid-row:auto}.client-share-box{grid-template-columns:1fr}}
@media(max-width:460px){.xray-share-details{grid-template-columns:1fr}.share-modal{width:98vw}.share-subscription{grid-template-columns:1fr}.share-subscription .share-qr.small{margin:auto}}


/* v0.13.1 Xray diagnostics + client education */
.guide-page{place-items:start center}.guide-shell{width:min(980px,100%);display:grid;gap:14px}
.guide-hero p{color:#92a5bd;line-height:1.9}
.guide-nav{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px}
.guide-nav a{padding:9px 12px;border:1px solid #2b425e;border-radius:10px;background:#091522;color:#ccecff;text-decoration:none;font-size:10px}
.guide-nav a:hover{border-color:#4bcdf1;background:#0d1d2c}
.guide-section{scroll-margin-top:20px}
.guide-section-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.guide-section-head h2{margin:2px 0 0;font-size:23px}
.guide-icon{width:44px;height:44px;display:grid;place-items:center;border:1px solid #376181;border-radius:13px;background:linear-gradient(135deg,#10314a,#292151);font-size:18px;font-weight:900;color:#b9efff}
.guide-method-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.guide-method-grid article{padding:14px;border:1px solid #21354e;border-radius:14px;background:#08121f}
.guide-method-grid article>b{display:block;margin-bottom:8px;color:#e5f4ff;font-size:12px}
.guide-method-grid ol{margin:0;padding-inline-start:20px;color:#a5b4c8;font-size:10px;line-height:1.95}
.guide-method-grid p{margin:0;color:#a5b4c8;font-size:10px;line-height:1.85}
.guide-method-grid code,.guide-section code{direction:ltr;display:inline-block;padding:1px 5px;border:1px solid #28415b;border-radius:6px;background:#050b13;color:#9fe7ff;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.guide-actions{margin-top:10px}
.guide-admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:12px 0}
.guide-admin-card{padding:17px;border:1px solid #22364f;border-radius:17px;background:linear-gradient(150deg,#0c1726,#08111c)}
.guide-admin-head{display:flex;align-items:center;gap:10px}.guide-admin-head>span{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;border:1px solid #31506f;background:#10233a;font-weight:900}
.guide-admin-head div{display:grid}.guide-admin-head b{font-size:13px}.guide-admin-head small{color:#71859f;font-size:8px}
.guide-admin-card p{min-height:38px;color:#92a5bd;font-size:10px;line-height:1.8}
.guide-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.guide-flow>div{padding:13px;border:1px solid #21354c;border-radius:13px;background:#08121e}.guide-flow b{display:grid;place-items:center;width:25px;height:25px;border-radius:8px;background:#13314a;color:#9feaff}.guide-flow span{display:block;margin-top:8px;color:#9aacbf;font-size:9px;line-height:1.75}
.xray-diagnostic-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:12px 0}.xray-diagnostic-grid>div{padding:12px;border:1px solid #233750;border-radius:12px;background:#08121e}.xray-diagnostic-grid span{display:block;color:#71849e;font-size:8px;text-transform:uppercase;letter-spacing:.8px}.xray-diagnostic-grid b{display:block;margin-top:5px;font-size:11px;word-break:break-word}.xray-diagnostic-grid em{display:block;margin-top:4px;color:#778aa3;font-size:8px;font-style:normal}
.diagnostic-hints{display:grid;gap:6px;margin:10px 0}.diagnostic-hint{padding:9px 11px;border:1px solid #5a492a;border-radius:10px;background:#18140b;color:#f2d694;font-size:9px;line-height:1.65}
.journal-head{display:flex;justify-content:space-between;align-items:center;margin:12px 0 5px}.journal-head b{font-size:10px}.journal-head span{color:#71839a;font-size:8px}.journal-box{max-height:260px;overflow:auto;margin:0;padding:12px;border:1px solid #253b54;border-radius:12px;background:#03070d;color:#a7bdd4;font:9px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace;direction:ltr;text-align:left;white-space:pre-wrap;word-break:break-word}
.danger-note{border-color:#63313a!important;background:#1c0d12!important}
.warnish{border-color:#6d5427!important;color:#f6d58d!important}
@media(max-width:900px){.guide-flow{grid-template-columns:repeat(2,minmax(0,1fr))}.xray-diagnostic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.guide-method-grid,.guide-admin-grid,.guide-flow,.xray-diagnostic-grid{grid-template-columns:1fr}.guide-admin-card p{min-height:0}}


/* v0.14 Glass Aurora shell ------------------------------------------------- */
body[data-theme="glass"]{
  --glass-bg:rgba(5,19,38,.58);
  --glass-bg-strong:rgba(5,16,32,.76);
  --glass-line:rgba(118,205,255,.28);
  --glass-line-hot:rgba(75,216,255,.68);
  --glass-text:#edf8ff;
  --glass-muted:#91a9c3;
  --glass-cyan:#46dcff;
  --glass-blue:#5c8dff;
  --glass-violet:#9b6cff;
  --glass-green:#39e6b0;
  --glass-amber:#ffbf68;
  min-height:100vh;
  background:
    radial-gradient(ellipse at 18% 12%,rgba(41,160,255,.34),transparent 32%),
    radial-gradient(ellipse at 82% 14%,rgba(131,72,255,.28),transparent 30%),
    radial-gradient(ellipse at 50% 105%,rgba(255,142,68,.22),transparent 27%),
    linear-gradient(155deg,#041126 0%,#071b34 42%,#0c1631 68%,#050b18 100%);
  color:var(--glass-text);
  background-attachment:fixed;
}
body[data-theme="glass"]::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-2;
  background:
    linear-gradient(135deg,transparent 0 48%,rgba(84,145,203,.10) 49% 50%,transparent 51%),
    linear-gradient(25deg,transparent 0 56%,rgba(110,83,182,.12) 57% 58%,transparent 59%);
  filter:blur(1px);
}
body[data-theme="glass"]::after{
  content:"";position:fixed;left:0;right:0;bottom:-5vh;height:42vh;pointer-events:none;z-index:-1;
  background:
    radial-gradient(ellipse at 20% 100%,rgba(21,62,94,.82),transparent 53%),
    radial-gradient(ellipse at 47% 100%,rgba(18,45,76,.88),transparent 58%),
    radial-gradient(ellipse at 78% 100%,rgba(42,32,75,.78),transparent 55%);
  clip-path:polygon(0 57%,12% 39%,24% 55%,35% 27%,47% 51%,61% 33%,71% 52%,84% 22%,100% 49%,100% 100%,0 100%);
  filter:blur(6px);
}
body[data-theme="glass"] .noise{opacity:.16;mix-blend-mode:soft-light}
body[data-theme="glass"] .ambient{filter:blur(90px);opacity:.28}

body[data-theme="glass"] .sidebar{
  top:12px;right:12px;bottom:12px;width:270px;padding:15px 13px;
  border:1px solid rgba(81,198,255,.34);border-radius:23px;
  background:linear-gradient(180deg,rgba(7,25,48,.78),rgba(4,14,29,.70));
  backdrop-filter:blur(28px) saturate(145%);-webkit-backdrop-filter:blur(28px) saturate(145%);
  box-shadow:0 28px 80px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.08),0 0 36px rgba(58,151,255,.10)
}
body[data-theme="glass"] .brand{padding:9px 9px 13px}
body[data-theme="glass"] .brand-mark{
  width:46px;height:46px;border-radius:15px;
  color:#07172c;background:linear-gradient(135deg,#52e9ff,#76a5ff 52%,#b377ff);
  box-shadow:0 0 30px rgba(87,208,255,.32)
}
body[data-theme="glass"] .brand-copy strong{letter-spacing:3px;font-size:16px}
body[data-theme="glass"] .brand-copy span{color:#6fdcff;letter-spacing:1.8px}
body[data-theme="glass"] .node-card,
body[data-theme="glass"] .sidebar-create{
  border-color:rgba(91,193,255,.28);
  background:linear-gradient(135deg,rgba(13,47,78,.58),rgba(41,37,89,.42));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05)
}
body[data-theme="glass"] .sidebar-create{
  background:linear-gradient(110deg,rgba(20,121,176,.55),rgba(88,58,194,.52));
  border-color:rgba(75,213,255,.52);box-shadow:0 0 24px rgba(61,185,255,.12)
}
body[data-theme="glass"] .sidebar nav button{
  margin:3px 0;border-radius:12px;color:#aac1d8
}
body[data-theme="glass"] .sidebar nav button:hover{
  background:rgba(38,101,150,.24);color:#e9f8ff;border-color:rgba(73,194,255,.25)
}
body[data-theme="glass"] .sidebar nav button.active{
  color:#fff;background:linear-gradient(90deg,rgba(19,106,157,.66),rgba(57,49,126,.52));
  border-color:rgba(79,215,255,.58);box-shadow:inset 3px 0 0 #43e0ff,0 0 24px rgba(55,174,255,.18)
}
body[data-theme="glass"] .workspace{margin-right:294px;padding:12px 16px 42px}
body[data-theme="glass"] .topbar{
  position:sticky;top:12px;z-index:35;margin-bottom:14px;padding:11px 14px;border:1px solid rgba(95,191,247,.24);
  border-radius:17px;background:linear-gradient(90deg,rgba(6,21,40,.70),rgba(23,29,66,.48));
  backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%);
  box-shadow:0 18px 50px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.06)
}
body[data-theme="glass"] .environment-chip,
body[data-theme="glass"] .command-trigger,
body[data-theme="glass"] .live-chip,
body[data-theme="glass"] .icon-btn{
  background:rgba(6,24,44,.50);border-color:rgba(96,189,242,.26);
  backdrop-filter:blur(14px)
}
body[data-theme="glass"] .live-chip{border-color:rgba(56,226,174,.36);color:#66f1c1}
body[data-theme="glass"] #content{max-width:1720px;margin:0 auto}

body[data-theme="glass"] .panel,
body[data-theme="glass"] .view-intro,
body[data-theme="glass"] .access-command,
body[data-theme="glass"] .protocol-command,
body[data-theme="glass"] .settings-section-head,
body[data-theme="glass"] .settings-card-v2,
body[data-theme="glass"] .settings-nav-v2,
body[data-theme="glass"] .modal{
  border-color:var(--glass-line);
  background:
    linear-gradient(145deg,rgba(12,44,73,.57),rgba(14,22,48,.52)),
    rgba(8,19,35,.50);
  backdrop-filter:blur(25px) saturate(150%);-webkit-backdrop-filter:blur(25px) saturate(150%);
  box-shadow:0 22px 62px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.07)
}
body[data-theme="glass"] .panel:hover{border-color:rgba(96,205,255,.38)}
body[data-theme="glass"] input,
body[data-theme="glass"] select,
body[data-theme="glass"] textarea{
  background:rgba(2,12,25,.58)!important;border-color:rgba(97,177,226,.28)!important;color:#eaf8ff!important;
  backdrop-filter:blur(10px)
}
body[data-theme="glass"] button.primary{
  color:#061426;border-color:rgba(94,226,255,.68);
  background:linear-gradient(100deg,#47dfff,#628bff 58%,#936aff);
  box-shadow:0 8px 25px rgba(67,191,255,.22)
}
body[data-theme="glass"] button.ghost,
body[data-theme="glass"] .ghost.link-btn,
body[data-theme="glass"] button.soft{
  border-color:rgba(100,184,234,.30);background:rgba(8,30,52,.46);color:#d8edfb
}
body[data-theme="glass"] button.danger{background:rgba(94,20,39,.48);border-color:rgba(255,91,124,.42)}
body[data-theme="glass"] .status-chip.ok{background:rgba(14,92,68,.38);border-color:rgba(55,233,173,.36);color:#72f1c4}
body[data-theme="glass"] .status-chip.bad{background:rgba(101,20,42,.36);border-color:rgba(255,83,118,.42);color:#ff9caf}

/* dashboard composition matching the selected concept */
.glass-status-hero{
  display:grid;grid-template-columns:135px minmax(0,1fr) auto;gap:20px;align-items:center;
  padding:18px 22px;margin-bottom:14px;border:1px solid rgba(85,206,255,.42);border-radius:22px;
  background:linear-gradient(115deg,rgba(16,68,108,.58),rgba(34,29,83,.46));
  backdrop-filter:blur(28px) saturate(150%);box-shadow:0 18px 56px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.10)
}
.glass-status-score{display:grid;place-items:center;padding:11px;border:1px solid rgba(93,210,255,.45);border-radius:17px;background:rgba(4,25,46,.50)}
.glass-status-score b{font-size:31px;line-height:1}.glass-status-score span{margin-top:4px;font-size:8px;letter-spacing:1.8px;color:#68dfff}
.glass-status-copy h2{margin:5px 0;font-size:25px}.glass-status-copy p{margin:0;color:#91a9c3;font-size:10px}
.glass-status-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}

.glass-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;margin-bottom:14px}
.glass-summary-grid article{
  display:grid;grid-template-columns:48px 1fr;align-items:center;gap:12px;padding:15px;
  border:1px solid rgba(95,189,241,.26);border-radius:17px;
  background:linear-gradient(135deg,rgba(11,43,72,.55),rgba(30,28,69,.43));
  backdrop-filter:blur(20px);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)
}
.glass-summary-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:13px;background:linear-gradient(135deg,#1688d7,#426ef0);box-shadow:0 0 22px rgba(56,156,255,.20);font-weight:900}
.glass-summary-icon.green{background:linear-gradient(135deg,#0d9f85,#38d2aa)}.glass-summary-icon.violet{background:linear-gradient(135deg,#6a43d9,#b260ef)}.glass-summary-icon.amber{background:linear-gradient(135deg,#b16e21,#f0ae4c)}
.glass-summary-grid small{display:block;color:#8aa5c0;font-size:8px}.glass-summary-grid b{display:block;margin:3px 0;font-size:18px}.glass-summary-grid em{font-style:normal;color:#64dbb7;font-size:8px}

.glass-main-grid{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(320px,.78fr);gap:12px;margin-bottom:12px}
.glass-services-panel,.glass-resource-panel{min-height:360px}
.glass-service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.glass-service-card{
  display:grid;grid-template-columns:38px 1fr;grid-template-rows:auto auto;gap:5px 9px;align-items:center;text-align:start;
  padding:12px;border:1px solid rgba(99,183,232,.24);border-radius:14px;background:rgba(7,25,44,.44);color:#edf8ff;cursor:pointer
}
.glass-service-card:hover{transform:translateY(-1px);border-color:rgba(81,215,255,.48);background:rgba(10,38,65,.58)}
.service-glyph{grid-row:1/3;display:grid;place-items:center;width:36px;height:36px;border:1px solid rgba(93,194,255,.38);border-radius:11px;background:linear-gradient(135deg,rgba(24,111,166,.7),rgba(75,49,137,.66));font-weight:900}
.glass-service-card div{min-width:0}.glass-service-card b{display:block;font-size:10px}.glass-service-card small{display:block;color:#7994af;font-size:7px;overflow:hidden;text-overflow:ellipsis}
.glass-service-card em{grid-column:2;font-style:normal;font-size:7px}.glass-service-card em.running{color:#54e5b4}.glass-service-card em.attention{color:#ff879b}

.glass-rings{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:8px 0 18px}
.glass-ring{--ring:0;display:grid;place-items:center;aspect-ratio:1;border-radius:50%;padding:8px;background:conic-gradient(#49ddff calc(var(--ring)*1%),rgba(104,150,190,.15) 0);box-shadow:0 0 25px rgba(62,191,255,.13)}
.glass-ring.violet{background:conic-gradient(#a774ff calc(var(--ring)*1%),rgba(115,94,171,.15) 0)}.glass-ring.green{background:conic-gradient(#3ce3b1 calc(var(--ring)*1%),rgba(69,148,127,.15) 0)}
.glass-ring>div{display:grid;place-items:center;width:78%;aspect-ratio:1;border-radius:50%;background:rgba(5,20,37,.92);box-shadow:inset 0 0 20px rgba(0,0,0,.3)}
.glass-ring b{font-size:14px}.glass-ring span{font-size:7px;color:#8aa2bb}
.glass-network-head{display:flex;align-items:center;justify-content:space-between;margin:5px 0 0;color:#8ca5bd;font-size:9px}.glass-network-head b{color:#5adfff}
body[data-theme="glass"] .history-chart{height:145px}
.glass-secondary-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.glass-access-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.glass-access-strip>div{padding:13px;border:1px solid rgba(97,183,235,.22);border-radius:12px;background:rgba(5,24,44,.42);text-align:center}.glass-access-strip b{display:block;font-size:19px}.glass-access-strip span{display:block;color:#829db7;font-size:8px;margin-top:4px}

.domain-resolution-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0}.domain-resolution-grid>div{padding:11px;border:1px solid rgba(91,182,235,.25);border-radius:11px;background:rgba(5,22,40,.52)}.domain-resolution-grid span{display:block;color:#7994ae;font-size:8px;margin-bottom:5px}.domain-resolution-grid code{display:block;color:#9fe9ff;font:8px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;direction:ltr;text-align:left;word-break:break-all}

body[data-theme="glass"] .settings-nav-v2,
body[data-theme="glass"] .settings-card-v2,
body[data-theme="glass"] .access-profile,
body[data-theme="glass"] .launch-card,
body[data-theme="glass"] .engine-card,
body[data-theme="glass"] .guide-admin-card{
  background:linear-gradient(145deg,rgba(9,37,63,.55),rgba(18,22,49,.46));
  border-color:rgba(94,183,236,.24);backdrop-filter:blur(20px)
}
body[data-theme="glass"] .settings-nav-v2 button.active{background:linear-gradient(90deg,rgba(13,103,154,.54),rgba(77,50,153,.44));border-color:rgba(67,215,255,.47)}
body[data-theme="glass"] .modal-backdrop{background:rgba(1,7,16,.62);backdrop-filter:blur(9px)}

@media(max-width:1250px){
  .glass-summary-grid{grid-template-columns:repeat(2,1fr)}
  .glass-main-grid{grid-template-columns:1fr}
  .glass-service-grid{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:900px){
  .glass-status-hero{grid-template-columns:95px 1fr}.glass-status-actions{grid-column:1/-1;justify-content:flex-start}
  .glass-service-grid{grid-template-columns:repeat(2,1fr)}
  .glass-secondary-grid{grid-template-columns:1fr}
}
@media(max-width:780px){
  body[data-theme="glass"] .sidebar{width:74px;right:8px;top:8px;bottom:8px}
  body[data-theme="glass"] .workspace{margin-right:92px;padding:8px 8px 30px}
  body[data-theme="glass"] .topbar{top:8px}
}
@media(max-width:560px){
  .glass-summary-grid,.glass-service-grid,.glass-access-strip,.glass-rings,.domain-resolution-grid{grid-template-columns:1fr}
  .glass-status-hero{grid-template-columns:1fr}.glass-status-score{width:100px}.glass-status-copy h2{font-size:20px}
  .glass-ring{max-width:120px;margin:auto;width:100%}
}
html[dir="ltr"] body[data-theme="glass"] .sidebar{left:12px;right:auto}
html[dir="ltr"] body[data-theme="glass"] .workspace{margin-left:294px;margin-right:0}
@media(max-width:780px){html[dir="ltr"] body[data-theme="glass"] .sidebar{left:8px;right:auto}html[dir="ltr"] body[data-theme="glass"] .workspace{margin-left:92px;margin-right:0}}

body[data-theme="glass"].login-body{
  background:
    radial-gradient(circle at 20% 18%,rgba(48,166,255,.32),transparent 27%),
    radial-gradient(circle at 80% 20%,rgba(135,78,255,.30),transparent 29%),
    linear-gradient(150deg,#041126,#091a34 54%,#090d20);
}
body[data-theme="glass"] .login-card{
  border-color:rgba(89,201,255,.38);
  background:linear-gradient(145deg,rgba(10,42,70,.60),rgba(20,22,54,.56));
  backdrop-filter:blur(30px) saturate(155%);-webkit-backdrop-filter:blur(30px) saturate(155%);
  box-shadow:0 35px 110px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.09),0 0 60px rgba(64,164,255,.12)
}
body[data-theme="glass"] .login-card input{background:rgba(1,14,29,.58)!important;border-color:rgba(103,192,244,.30)!important}
body[data-theme="glass"] .primary-btn{background:linear-gradient(105deg,#48e2ff,#648cff 57%,#a56dff);box-shadow:0 12px 34px rgba(64,174,255,.28)}


/* Access and support surfaces */
.access-tier-chip{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 11px;border:1px solid rgba(75,232,177,.42);border-radius:999px;font-size:9px;font-weight:900;letter-spacing:1px;color:#6ff2c0;background:rgba(14,79,63,.34);white-space:nowrap}
.support-hero{margin-bottom:14px;padding:22px;border:1px solid rgba(57,229,174,.36);border-radius:21px;background:linear-gradient(135deg,rgba(8,75,62,.42),rgba(31,38,94,.50));box-shadow:0 20px 58px rgba(0,0,0,.24)}
.support-hero h2{font-size:25px;margin:6px 0}.support-hero p{margin:0;color:var(--muted);line-height:1.8}
.support-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.support-ticket-list{display:grid;gap:8px}
.support-ticket-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border:1px solid rgba(92,177,228,.21);border-radius:12px;background:rgba(4,21,38,.43)}
.support-ticket-row b{display:block;font-size:10px}.support-ticket-row span{display:block;color:#7690aa;font-size:8px;margin-top:3px}
.success-note{border-color:rgba(52,223,168,.34)!important;background:rgba(8,73,57,.26)!important;color:#b4f8df!important}
@media(max-width:900px){.support-grid{grid-template-columns:1fr}}

/* v0.16 remote support + commercial entitlement */
.remote-support-banner{
  position:fixed;left:50%;top:8px;transform:translateX(-50%);z-index:120;
  display:flex;align-items:center;gap:10px;max-width:min(760px,calc(100vw - 32px));
  padding:8px 12px;border:1px solid rgba(255,188,88,.55);border-radius:12px;
  background:rgba(47,28,7,.88);backdrop-filter:blur(18px);box-shadow:0 12px 40px rgba(0,0,0,.35);
  color:#ffe5ad;font-size:9px
}
.remote-support-banner b{letter-spacing:1.2px;color:#ffce7b}.remote-support-banner span{flex:1;line-height:1.5}
.remote-support-banner form{margin:0}.remote-support-banner button{border:1px solid #936b2f;border-radius:8px;background:#4b2d0c;color:#ffe8b8;padding:6px 9px;cursor:pointer}
.remote-support-panel{border-color:rgba(244,183,85,.32)!important}
.remote-support-create{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.8fr);gap:14px;align-items:start}
.remote-support-create p{margin-top:0;color:#91a8bd;font-size:10px;line-height:1.8}
.support-grant-list{display:grid;gap:7px}
.support-grant-list>div{display:grid;grid-template-columns:auto auto 1fr auto;gap:8px;align-items:center;padding:9px;border:1px solid rgba(104,178,226,.22);border-radius:10px;background:rgba(3,16,29,.43)}
.support-grant-list span{font:9px ui-monospace,monospace;color:#9ce7ff}.support-grant-list b{font-size:9px}.support-grant-list small{font-size:8px;color:#7f98ad}.support-grant-list em{font-size:8px;color:#70869b;font-style:normal}
.support-code-box{margin:12px 0;padding:16px;border:1px solid rgba(98,217,255,.45);border-radius:14px;background:#020d18;color:#9eeaff;font:700 18px/1.5 ui-monospace,monospace;letter-spacing:1.2px;text-align:center}
body[data-remote-support="1"] .topbar{margin-top:42px}
@media(max-width:760px){.remote-support-create{grid-template-columns:1fr}.remote-support-banner{top:5px;align-items:flex-start;flex-wrap:wrap}.remote-support-banner span{min-width:70%}.support-grant-list>div{grid-template-columns:1fr auto}}


/* v0.17 modern scroll surfaces + protocol diagnostics */
.sidebar nav{
  scrollbar-width:thin;
  scrollbar-color:#2f6f94 transparent;
  scrollbar-gutter:stable;
  padding-inline-end:3px;
}
.sidebar nav::-webkit-scrollbar,
.modal::-webkit-scrollbar,
.table::-webkit-scrollbar,
.engine-inbounds::-webkit-scrollbar,
.diagnostic-list::-webkit-scrollbar{
  width:7px;height:7px;
}
.sidebar nav::-webkit-scrollbar-track,
.modal::-webkit-scrollbar-track,
.table::-webkit-scrollbar-track,
.engine-inbounds::-webkit-scrollbar-track,
.diagnostic-list::-webkit-scrollbar-track{
  background:transparent;
}
.sidebar nav::-webkit-scrollbar-thumb,
.modal::-webkit-scrollbar-thumb,
.table::-webkit-scrollbar-thumb,
.engine-inbounds::-webkit-scrollbar-thumb,
.diagnostic-list::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,rgba(53,214,255,.72),rgba(108,124,255,.62));
  border:2px solid transparent;
  background-clip:padding-box;
  border-radius:999px;
}
.sidebar nav::-webkit-scrollbar-thumb:hover,
.modal::-webkit-scrollbar-thumb:hover,
.table::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg,rgba(90,228,255,.9),rgba(139,126,255,.82));
  background-clip:padding-box;
}
.sidebar nav:before,.sidebar nav:after{content:"";position:sticky;display:block;height:5px;z-index:2;pointer-events:none}
.sidebar nav:before{top:0;background:linear-gradient(180deg,rgba(7,12,22,.78),transparent)}
.sidebar nav:after{bottom:0;background:linear-gradient(0deg,rgba(7,12,22,.82),transparent)}
.wg-peer-list{display:grid;gap:6px;max-height:220px;overflow:auto}
.wg-peer-runtime{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:10px 11px;border:1px solid #20364d;border-radius:11px;background:#09131f}
.wg-peer-runtime>div{display:grid;gap:3px}.wg-peer-runtime b{font-size:9px}.wg-peer-runtime span{font-size:7.5px;color:#71869f}
.endpoint-matrix{display:grid;gap:8px;margin:12px 0}
.endpoint-row{display:grid;grid-template-columns:12px 1.2fr .7fr 1.4fr;gap:10px;align-items:center;padding:11px 12px;border:1px solid #21384f;border-radius:12px;background:linear-gradient(145deg,#091521,#08101a)}
.endpoint-row>div{display:grid;gap:3px}.endpoint-row b{font-size:10px}.endpoint-row small{font-size:7.5px;color:#70849d}.endpoint-row>div:last-child{display:flex;flex-wrap:wrap;gap:5px}
.endpoint-dot{width:9px;height:9px;border-radius:50%;background:#ff6b7a;box-shadow:0 0 12px #ff6b7a55}.endpoint-dot.ok{background:#2dd4a7;box-shadow:0 0 12px #2dd4a766}
.endpoint-matrix-modal{width:min(780px,95vw)}
@media(max-width:680px){.endpoint-row{grid-template-columns:12px 1fr}.endpoint-row>div:nth-child(3),.endpoint-row>div:nth-child(4){grid-column:2}.sidebar nav{padding-inline-end:1px}}

/* v0.19: clearer navigation and WireGuard workspace */
:root{--bg:#0b1220;--panel:#121d2c;--panel2:#172437;--line:#2b3c50;--text:#f3f8fb;--muted:#a9bac9;--cyan:#69dfcf;--blue:#72a9ed;--green:#4ed3ac;--shadow:0 16px 44px #01081255}
body{background:radial-gradient(circle at 85% -15%,#194b583b,transparent 34%),linear-gradient(180deg,#101827,#0b1421 58%,#101b2a)}
body:before,.noise{opacity:.12}.ambient{opacity:.35}
.sidebar{border-color:#304355;background:linear-gradient(180deg,#142132f2,#101c2df5);box-shadow:0 18px 52px #02091477}
.sidebar .brand-mark{background:linear-gradient(135deg,#75e1cb,#66acd8);box-shadow:0 9px 22px #1f887744}
.sidebar nav button{min-height:42px;font-size:13px;color:#bccdd9}
.sidebar nav button span{color:#76cbbb}
.sidebar nav button.active{background:#1a3d43;border-color:#367d76;color:#f3fffb;box-shadow:inset 3px 0 #62dcc0}
.sidebar nav button:hover{background:#24394a;border-color:#425e68}
.nav-label{color:#97aebb;font-size:10px}
.sidebar-create,.primary{background:linear-gradient(130deg,#65dcc0,#76c5da)!important;border-color:#73d9c6!important;color:#08242b!important;box-shadow:0 7px 24px #37b99c30}
.topbar{background:linear-gradient(180deg,#101827ed 74%,transparent)}
.topbar h1{font-size:28px}.eyebrow{color:#7edaca;letter-spacing:1.3px;font-size:10px}
.panel,.access-profile,.launch-card,.engine-card,.settings-card-v2{border-color:#2c4254!important;background:#172436e8!important;box-shadow:0 12px 28px #0003}
.panel-head h3,.view-intro h2{font-size:18px}
.panel-head span,.glass-summary-grid small,.glass-summary-grid em,.glass-service-card small,.glass-service-card em,.glass-access-strip span{font-size:11px;color:#aebfcc}
.glass-summary-grid>article,.glass-service-card{background:#1c3040!important;border-color:#36505d!important}
.glass-service-card b{font-size:12px}
.glass-status-hero,.access-command,.protocol-command{background:linear-gradient(125deg,#1a3a44,#183144 58%,#20354b)!important;border-color:#3c686c!important;box-shadow:0 16px 38px #0004}
.glass-status-copy p,.access-command p,.protocol-command p{color:#c4d5dc}
.glass-access-strip>button{padding:13px;border:1px solid #4ca38f;border-radius:12px;background:#214a4b;color:#e9fff8;cursor:pointer;text-align:center;font:inherit}
.glass-access-strip>button:hover{background:#286055}
.glass-access-strip>button b{display:block;font-size:19px}.glass-access-strip>button span{display:block;margin-top:4px}
.primary,.ghost,.soft,.danger,.icon-action,.more-action,.launch-action{min-height:36px;font-size:12px}
button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #79e6c8;outline-offset:2px}
.mobile-menu-toggle{display:none;border:1px solid #3b5965;border-radius:11px;background:#1a3540;color:#d9fff4;width:41px;height:41px;font-size:21px;cursor:pointer}
.wg-workspace-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:24px;padding:28px;border:1px solid #3c7774;border-radius:20px;background:linear-gradient(120deg,#1e4b4a,#193543 68%,#1d3349);box-shadow:0 16px 40px #0004}
.wg-workspace-hero h2{margin:6px 0 10px;font-size:26px}.wg-workspace-hero p{max-width:670px;margin:0;color:#cae1df;font-size:13px;line-height:1.9}
.wg-workspace-actions,.wg-peer-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.wg-workspace-actions{margin-top:20px}
.wg-workspace-status{min-width:188px;display:grid;justify-items:center;gap:8px;padding:20px;border:1px solid #5b8b84;border-radius:17px;background:#133339ab;text-align:center}.wg-workspace-status b{font-size:15px}.wg-workspace-status small{color:#c4d9d9;font-size:11px}
.wg-status-dot{display:block;width:15px;height:15px;border-radius:50%;background:#e8ac66;box-shadow:0 0 0 7px #e8ac6630}.wg-status-dot.running{background:#5de1b0;box-shadow:0 0 0 7px #5de1b033}
.wg-workspace-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:14px 0}.wg-workspace-metrics>div{padding:17px;border:1px solid #324b57;border-radius:15px;background:#172c3b}.wg-workspace-metrics span{display:block;color:#afc8cd;font-size:11px}.wg-workspace-metrics b{display:block;margin-top:8px;font-size:25px;color:#d9fff5}
.wg-workspace-directory{margin:14px 0}.wg-workspace-list{display:grid;gap:9px}.wg-workspace-peer{display:grid;grid-template-columns:minmax(180px,1.1fr) minmax(120px,.8fr) minmax(180px,1fr);gap:12px;align-items:center;padding:16px;border:1px solid #334c5b;border-radius:14px;background:#112233}
.wg-peer-name{display:flex;align-items:center;gap:10px;min-width:0}.wg-person{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#285c61;color:#e8fff8;font-weight:800}.wg-peer-name>div{min-width:0}.wg-peer-name b,.wg-peer-endpoint b,.wg-peer-traffic b{display:block;font-size:13px;overflow-wrap:anywhere}.wg-peer-name small,.wg-peer-endpoint span,.wg-peer-traffic span{display:block;color:#acc1cd;font-size:11px;margin-top:3px}.wg-peer-endpoint b{color:#8de6d4;text-align:right}.wg-peer-actions{grid-column:1/-1;border-top:1px solid #314555;padding-top:12px}
.wg-workspace-help{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:17px 20px;border:1px solid #385961;border-radius:14px;background:#19333d}.wg-workspace-help b{font-size:13px}.wg-workspace-help p{margin:5px 0 0;color:#afcbd0;font-size:11px;line-height:1.8}
@media(max-width:1050px){.wg-workspace-peer{grid-template-columns:1fr 1fr}.wg-peer-traffic{grid-column:1/-1}}
@media(max-width:780px){
  .mobile-menu-toggle{display:grid;place-items:center;flex:none}.topbar{gap:10px}.page-heading{margin-inline-end:auto}
  .sidebar,body[data-theme="glass"] .sidebar{width:min(285px,82vw);right:0;top:0;bottom:0;border-radius:0;padding:17px;transform:translateX(105%);transition:transform .22s;z-index:15}
  body.menu-open .sidebar,body[data-theme="glass"].menu-open .sidebar{transform:translateX(0)}
  body.menu-open:after{content:"";position:fixed;inset:0;background:#0009;z-index:14}
  .sidebar nav button{justify-content:flex-start;font-size:13px}.sidebar nav button span{font-size:17px}.sidebar .brand-copy,.sidebar .server-pill>div,.sidebar .nav-label{display:block}
  .workspace,body[data-theme="glass"] .workspace{margin:0;padding:12px 14px 30px}
  .wg-workspace-hero{grid-template-columns:1fr}.wg-workspace-status{min-width:0;justify-items:start;grid-template-columns:auto 1fr;align-items:center;text-align:right}.wg-workspace-status small{grid-column:2}.wg-workspace-metrics{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){.wg-workspace-peer{grid-template-columns:1fr}.wg-peer-traffic{grid-column:auto}.wg-peer-actions button{flex:1}.wg-workspace-help{flex-direction:column;align-items:stretch}.environment-chip,.live-chip{display:none}.wg-workspace-actions>*{flex:1}.glass-access-strip{grid-template-columns:repeat(2,1fr)}}
html[dir="ltr"] .wg-peer-endpoint b{text-align:left}
@media(max-width:780px){html[dir="ltr"] .sidebar,html[dir="ltr"] body[data-theme="glass"] .sidebar{left:0;right:auto;transform:translateX(-105%)}html[dir="ltr"] body.menu-open .sidebar{transform:translateX(0)}html[dir="ltr"] .workspace,html[dir="ltr"] body[data-theme="glass"] .workspace{margin:0}}
@media(max-width:780px){.sidebar .sidebar-create b,.sidebar .sidebar-version{display:block}.sidebar .sidebar-create{justify-content:center}.sidebar .node-live{display:inline-block}}


/* v0.21 Control Center — modular operations visual system */
body[data-theme="glass"]{
  --bg:#060a11;--panel:#0c1420;--panel2:#111c2b;--line:#213149;
  --text:#f5f8fc;--muted:#91a5ba;--cyan:#44c8ff;--blue:#5b7cff;
  --violet:#9270ff;--green:#35d49b;--amber:#f4bd61;--red:#ff6f82;
  --shadow:0 18px 46px rgba(0,0,0,.34);
  background:
    radial-gradient(circle at 88% -12%,rgba(42,103,176,.22),transparent 34%),
    radial-gradient(circle at 12% 110%,rgba(78,48,142,.16),transparent 30%),
    linear-gradient(180deg,#08101a 0%,#060b13 48%,#070c14 100%);
}
body[data-theme="glass"] .noise{opacity:.018}
body[data-theme="glass"] .ambient{opacity:.12;filter:blur(90px)}
body[data-theme="glass"] .sidebar{
  right:14px;top:14px;bottom:14px;width:272px;padding:18px 12px;
  border:1px solid #1d2d42;border-radius:18px;
  background:linear-gradient(180deg,rgba(10,18,30,.98),rgba(7,13,23,.985));
  backdrop-filter:blur(20px);box-shadow:0 24px 70px rgba(0,0,0,.42);
}
body[data-theme="glass"] .brand{padding:2px 9px 15px;border-bottom:1px solid rgba(95,125,160,.14)}
body[data-theme="glass"] .brand-mark{
  width:42px;height:42px;border-radius:12px;color:#f7fbff;
  background:linear-gradient(145deg,#2678ff,#695cf4);
  box-shadow:0 10px 28px rgba(46,115,255,.25)
}
body[data-theme="glass"] .brand span{color:#6da8ff}
body[data-theme="glass"] .server-pill{
  margin:14px 2px 10px;border-color:#20344d;border-radius:12px;
  background:#0d1928;box-shadow:none
}
body[data-theme="glass"] .sidebar-create{
  min-height:43px;margin:0 2px 6px;border-radius:11px!important;
  border:1px solid #315eae!important;
  background:linear-gradient(135deg,#2f72ee,#645bf0)!important;
  color:#fff!important;box-shadow:0 10px 28px rgba(50,98,224,.22)!important
}
body[data-theme="glass"] .nav-label{
  margin:14px 10px 6px;color:#607891;font-size:9px;letter-spacing:1.7px
}
body[data-theme="glass"] .sidebar nav{gap:3px}
body[data-theme="glass"] .sidebar nav button{
  min-height:39px;padding:9px 11px;border-radius:9px;color:#9fb1c5;font-size:12px
}
body[data-theme="glass"] .sidebar nav button span{color:#7790ad}
body[data-theme="glass"] .sidebar nav button:hover{
  color:#eff6ff;background:#101e30;border-color:#223a57
}
body[data-theme="glass"] .sidebar nav button.active{
  color:#fff;border-color:#315992;background:linear-gradient(90deg,#14243a,#172e52);
  box-shadow:inset -3px 0 0 #4dbfff,0 7px 22px rgba(0,0,0,.18)
}
body[data-theme="glass"] .workspace{margin-right:304px;padding:18px 26px 42px}
body[data-theme="glass"] .topbar{
  position:sticky;top:0;z-index:4;margin:0 -4px 18px;padding:10px 4px 13px;
  background:linear-gradient(180deg,rgba(6,11,19,.96) 72%,rgba(6,11,19,0));
  backdrop-filter:blur(16px)
}
body[data-theme="glass"] .topbar h1{font-size:26px;letter-spacing:-.4px}
body[data-theme="glass"] .eyebrow{color:#68b9ff}
body[data-theme="glass"] .environment-chip,
body[data-theme="glass"] .command-trigger,
body[data-theme="glass"] .live-chip,
body[data-theme="glass"] .icon-btn{
  border-color:#233750;background:#0d1724;box-shadow:none
}
body[data-theme="glass"] .live-chip{color:#83e8bf}
body[data-theme="glass"] .panel,
body[data-theme="glass"] .access-profile,
body[data-theme="glass"] .launch-card,
body[data-theme="glass"] .engine-card,
body[data-theme="glass"] .settings-card-v2{
  border-color:#203149!important;
  background:linear-gradient(180deg,rgba(15,25,39,.96),rgba(10,18,29,.96))!important;
  border-radius:14px!important;box-shadow:0 12px 34px rgba(0,0,0,.24)!important
}
body[data-theme="glass"] .glass-status-hero,
body[data-theme="glass"] .access-command,
body[data-theme="glass"] .protocol-command,
body[data-theme="glass"] .wg-workspace-hero{
  border:1px solid #28476d!important;border-radius:16px!important;
  background:
    radial-gradient(circle at 88% 10%,rgba(74,123,255,.18),transparent 30%),
    linear-gradient(125deg,#102035,#101a2a 58%,#151b34)!important;
  box-shadow:0 18px 44px rgba(0,0,0,.28)!important
}
body[data-theme="glass"] .glass-status-copy p,
body[data-theme="glass"] .access-command p,
body[data-theme="glass"] .protocol-command p,
body[data-theme="glass"] .wg-workspace-hero p{color:#a9bed2}
body[data-theme="glass"] .glass-summary-grid>article,
body[data-theme="glass"] .glass-service-card,
body[data-theme="glass"] .wg-workspace-metrics>div{
  border:1px solid #223851!important;border-radius:12px!important;
  background:#0f1d2d!important;box-shadow:none!important
}
body[data-theme="glass"] .glass-summary-grid>article:hover,
body[data-theme="glass"] .glass-service-card:hover{
  border-color:#35618f!important;background:#13243a!important;transform:translateY(-1px)
}
body[data-theme="glass"] .glass-access-strip>button{
  border:1px solid #27476b;background:#10233a;color:#eaf5ff;border-radius:10px
}
body[data-theme="glass"] .glass-access-strip>button:hover{background:#173254;border-color:#3975ad}
body[data-theme="glass"] .primary{
  border-color:#4775ff!important;background:linear-gradient(135deg,#338bff,#645cf2)!important;
  color:#fff!important;box-shadow:0 8px 22px rgba(57,99,230,.20)!important
}
body[data-theme="glass"] .primary:hover{filter:brightness(1.08)}
body[data-theme="glass"] .ghost{
  border-color:#2b405b;background:#101a28;color:#dce9f7
}
body[data-theme="glass"] .soft{border-color:#30445d;background:#131e2d;color:#b8c9da}
body[data-theme="glass"] .status-chip.ok{border-color:#245d48;background:#0d251e;color:#74e4b5}
body[data-theme="glass"] .status-chip.warn{border-color:#654e26;background:#251d0d;color:#f4c879}
body[data-theme="glass"] .status-chip.bad{border-color:#653441;background:#271218;color:#ff9cab}
body[data-theme="glass"] .wg-workspace-status{
  border-color:#31557f;background:#0d1c2c;color:#eef7ff
}
body[data-theme="glass"] .wg-workspace-metrics b{color:#eef7ff}
body[data-theme="glass"] .wg-workspace-peer,
body[data-theme="glass"] .protocol-client-row,
body[data-theme="glass"] .engine-inbound{
  border-color:#233952;background:#0d1a29;border-radius:11px
}
body[data-theme="glass"] .wg-workspace-help{
  border-color:#29445f;background:#0f2030;border-radius:12px
}
body[data-theme="glass"] .modal{
  border-color:#28405e;background:#09131f;border-radius:16px;
  box-shadow:0 32px 100px rgba(0,0,0,.58)
}
body[data-theme="glass"] .form-grid input,
body[data-theme="glass"] .form-grid textarea,
body[data-theme="glass"] .form-grid select{
  border-color:#263b55;background:#07111c
}
body[data-theme="glass"] .sidebar-footer{border-color:#1c2a3c}
body[data-theme="glass"] .sidebar nav::-webkit-scrollbar-thumb{
  background:#2e5277;background-clip:padding-box
}
@media(max-width:780px){
  body[data-theme="glass"] .sidebar{right:0;top:0;bottom:0;border-radius:0}
  body[data-theme="glass"] .workspace{margin:0;padding:12px 14px 30px}
}


/* ==========================================================================
   v0.23 Neon Operations UI — complete shell rebuild
   ========================================================================== */
:root{
  --neon-bg:#020817;--neon-bg-2:#031127;--neon-surface:#071529;
  --neon-surface-2:#0a1a31;--neon-surface-3:#0d213c;--neon-line:#17375c;
  --neon-blue:#158bff;--neon-blue-2:#2858ff;--neon-purple:#783cff;
  --neon-cyan:#17d7ff;--neon-green:#16d98d;--neon-red:#ff4f67;
  --neon-orange:#ff9d2e;--neon-text:#f4f8ff;--neon-muted:#7f96b4;
  --neon-shadow:0 18px 55px rgba(0,0,0,.35);
  --neon-glow-shadow:0 0 28px rgba(25,113,255,.16);
}
body.makia-neon-shell{
  background:
    radial-gradient(circle at 72% -8%,rgba(23,104,255,.24),transparent 27%),
    radial-gradient(circle at 15% 18%,rgba(111,45,255,.12),transparent 28%),
    linear-gradient(180deg,#020817 0%,#020b1a 48%,#020714 100%);
  color:var(--neon-text);font-family:Tahoma,Inter,Arial,sans-serif;
}
.makia-neon-shell .noise,.makia-neon-shell .ambient{display:none}
.neon-bg-grid{position:fixed;inset:0;pointer-events:none;opacity:.17;background-image:linear-gradient(rgba(32,89,154,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(32,89,154,.08) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,#000,transparent 86%)}
.neon-glow{position:fixed;border-radius:999px;filter:blur(90px);pointer-events:none;z-index:0}
.neon-glow-a{width:430px;height:430px;right:22%;top:-220px;background:rgba(0,105,255,.18)}
.neon-glow-b{width:420px;height:420px;left:-170px;bottom:-180px;background:rgba(98,38,255,.12)}

.makia-neon-shell .sidebar{
  right:0;top:0;bottom:0;width:250px;border:0;border-left:1px solid #15355a;
  border-radius:0;padding:18px 13px 12px;background:linear-gradient(180deg,rgba(3,14,31,.99),rgba(2,10,24,.99));
  box-shadow:15px 0 55px rgba(0,0,0,.22);backdrop-filter:blur(20px);z-index:20;
}
.makia-neon-shell .brand{height:64px;padding:5px 9px 14px;border-bottom:1px solid #112a49;gap:10px}
.brand-logo{width:38px;height:38px;border-radius:10px;filter:drop-shadow(0 0 16px rgba(26,143,255,.38))}
.makia-neon-shell .brand-copy strong{font-size:15px;letter-spacing:2.2px}
.makia-neon-shell .brand-copy span{font-size:8px;letter-spacing:1.8px;color:#45adff;margin-top:2px}
.makia-neon-shell .neon-nav{padding-top:10px;display:flex;flex-direction:column;gap:4px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#245484 transparent}
.makia-neon-shell .nav-section-title{margin:14px 9px 6px;color:#44709f;font-size:9px;letter-spacing:.7px;font-weight:700}
.makia-neon-shell .sidebar nav button{
  min-height:39px;padding:7px 9px;border-radius:9px;color:#a7bad0;gap:9px;font-size:11px;
  border:1px solid transparent;background:transparent;box-shadow:none;
}
.makia-neon-shell .sidebar nav button b{font-weight:600}
.makia-neon-shell .sidebar nav button em{margin-right:auto;color:#516e90;font-style:normal;font-size:18px}
.makia-neon-shell .sidebar nav button:hover{background:#081a31;border-color:#173a61;color:#fff}
.makia-neon-shell .sidebar nav button.active{
  color:#fff;border-color:#1f5bd5;background:linear-gradient(90deg,#075dff,#2738d8);
  box-shadow:0 8px 26px rgba(17,89,255,.25),inset 0 1px rgba(255,255,255,.08);
}
.nav-icon{width:27px;height:27px;border-radius:7px;display:grid!important;place-items:center!important;font-size:13px!important;color:#fff!important;flex:none;box-shadow:inset 0 1px rgba(255,255,255,.08)}
.nav-blue{background:linear-gradient(135deg,#1688ff,#1448ff)}.nav-violet{background:linear-gradient(135deg,#7d42ff,#5d25d6)}
.nav-purple{background:linear-gradient(135deg,#8948ff,#5927c9)}.nav-green{background:linear-gradient(135deg,#13d28a,#099c6a)}
.nav-cyan{background:linear-gradient(135deg,#12cfe9,#1475f7)}.nav-orange{background:linear-gradient(135deg,#ff9a2e,#e96812)}
.nav-red{background:linear-gradient(135deg,#ff536d,#c92845)}
.nav-subgroup{display:grid;gap:3px;margin:1px 0 5px;padding-right:16px;border-right:1px solid #173759}
.nav-subgroup button{min-height:34px!important;font-size:10px!important}
.nav-mini-icon{width:25px!important;height:25px!important;border-radius:7px;display:grid!important;place-items:center!important;color:white!important;font-size:8px!important;font-weight:800;box-shadow:0 4px 12px #0003}
.nav-mini-icon.ssh{background:#1688ff}.nav-mini-icon.xray{background:#7945f3}.nav-mini-icon.wg{background:#e63c43}.nav-mini-icon.ovpn{background:#ef8d20}
.makia-neon-shell .sidebar-footer{border-top:1px solid #122c4b;padding:11px 6px 2px;margin-top:auto;gap:7px}
.server-mini-status{display:flex;align-items:center;gap:7px;min-width:0}.server-mini-status i{width:7px;height:7px;background:var(--neon-green);border-radius:50%;box-shadow:0 0 12px var(--neon-green)}
.server-mini-status b{display:block;font-size:9px;color:#d8e8fa}.server-mini-status span{display:block;font-size:8px;color:#5e7898;max-width:116px;overflow:hidden;text-overflow:ellipsis}
.sidebar-version{font-size:8px;color:#4c6684;white-space:nowrap}

.makia-neon-shell .workspace{margin-right:250px;padding:0 26px 38px;max-width:none;position:relative;z-index:2}
.makia-neon-shell .topbar{height:64px;margin:0 -26px 0;padding:0 26px;border-bottom:1px solid #123253;background:rgba(2,12,27,.82);backdrop-filter:blur(18px);position:sticky;top:0;z-index:12;display:flex;direction:ltr}
.topbar-brand-mobile{display:none}
.makia-neon-shell .command-trigger{width:min(480px,42vw);height:36px;border-radius:8px;border-color:#17385e;background:#06152a;color:#8098b7;direction:rtl;box-shadow:inset 0 1px rgba(255,255,255,.02)}
.makia-neon-shell .command-trigger span{color:#5d7ea5}.makia-neon-shell .command-trigger b{font-size:10px;font-weight:400;flex:1;text-align:right}
.makia-neon-shell .command-trigger kbd{border-color:#203f62;background:#061021;color:#6c83a0}
.makia-neon-shell .top-actions{margin-left:auto;direction:rtl}
.top-icon-button{position:relative;width:34px;height:34px;border-radius:9px;border:1px solid #163659;background:#061429;color:#8ca5c2;cursor:pointer}
.top-icon-button:hover{border-color:#2a69ab;color:white;background:#0a1d38}
.notification-dot{position:absolute;width:6px;height:6px;border-radius:50%;background:#ff3f58;top:7px;right:6px;box-shadow:0 0 8px #ff3f58}
.account-menu{position:relative;direction:rtl}
.account-menu summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:7px;min-width:132px;padding:3px 7px;border-radius:10px}
.account-menu summary::-webkit-details-marker{display:none}
.account-menu summary:hover{background:#081a31}.account-avatar{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#7657d5,#31276c);border:1px solid #705fc0;color:white;font-weight:800}
.account-menu summary div{min-width:0}.account-menu summary b{display:block;font-size:10px}.account-menu summary small{display:block;font-size:7px;color:#66809f;margin-top:2px}
.account-popover{position:absolute;left:0;top:44px;width:175px;background:#07162b;border:1px solid #1d466f;border-radius:12px;padding:7px;box-shadow:0 18px 45px #0008}
.account-popover button{width:100%;border:0;background:transparent;color:#afc4dc;text-align:right;padding:9px;border-radius:8px;cursor:pointer;font-size:10px}.account-popover button:hover{background:#0d2441;color:white}
.account-popover form{margin:0}

.page-titlebar{display:flex;align-items:center;justify-content:space-between;padding:19px 0 14px}
.page-titlebar h1{margin:4px 0 0;font-size:21px;letter-spacing:0}.page-titlebar .eyebrow{font-size:8px;color:#4586c5;letter-spacing:1.2px}
.page-title-actions{display:flex;align-items:center;gap:8px}
.top-live-badge{height:30px;display:flex;align-items:center;gap:6px;border:1px solid #155340;background:#082219;color:#54e5ae;border-radius:8px;padding:0 10px;font-size:8px;font-weight:700}
.top-live-badge i{width:6px;height:6px;background:#22e59a;border-radius:50%;box-shadow:0 0 10px #22e59a}
.top-create{padding:8px 13px!important;font-size:10px!important}

.makia-neon-shell #content{padding-bottom:30px}
.makia-neon-shell .panel,.makia-neon-shell .view-intro,.makia-neon-shell .account-hero,.makia-neon-shell .wg-workspace-hero,.makia-neon-shell .access-command{
  background:linear-gradient(180deg,rgba(7,21,42,.96),rgba(5,17,34,.96));border:1px solid #17395e;border-radius:10px;box-shadow:var(--neon-shadow);
}
.makia-neon-shell .panel{padding:14px}.makia-neon-shell .panel-head{margin-bottom:10px}.makia-neon-shell .panel-head h3{font-size:12px}.makia-neon-shell .panel-head span{font-size:8px;color:#58789b}
.makia-neon-shell .primary{background:linear-gradient(135deg,#168cff,#3b45ff 57%,#7545ff);border-color:#2d6df0;color:#fff;box-shadow:0 8px 22px rgba(31,99,255,.22)}
.makia-neon-shell .ghost,.makia-neon-shell .soft{background:#08182e;border-color:#1b416a;color:#aec4dd}
.makia-neon-shell .danger{background:#2a0e19;border-color:#753047;color:#ff8999}
.makia-neon-shell .primary,.makia-neon-shell .ghost,.makia-neon-shell .soft,.makia-neon-shell .danger{border-radius:7px;padding:7px 10px;font-size:9px}
.makia-neon-shell .status-chip{border-radius:6px;padding:4px 7px;font-size:8px}.makia-neon-shell .status-chip.ok{background:#073425;border-color:#10704e;color:#57e8b0}.makia-neon-shell .status-chip.bad{background:#34121d;border-color:#792e44;color:#ff7e91}.makia-neon-shell .status-chip.warn{background:#32240d;border-color:#75521d;color:#ffcb69}
.makia-neon-shell .muted{color:#6e88a7;font-size:9px}

/* Dashboard closely follows the approved 4-card + analytics composition. */
.neon-dashboard{display:grid;gap:12px}
.neon-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.neon-stat-card{min-height:105px;display:flex;align-items:center;gap:12px;padding:15px;border:1px solid #173a61;border-radius:10px;background:linear-gradient(145deg,#081a31,#071327);box-shadow:0 12px 32px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.03);position:relative;overflow:hidden}
.neon-stat-card:after{content:"";position:absolute;width:100px;height:100px;border-radius:50%;left:-36px;top:-42px;filter:blur(28px);opacity:.13}
.neon-stat-card.blue:after{background:#168cff}.neon-stat-card.purple:after{background:#884cff}.neon-stat-card.cyan:after{background:#18d6ff}.neon-stat-card.green:after{background:#19dc8e}
.neon-stat-icon{width:43px;height:43px;border-radius:10px;display:grid;place-items:center;font-size:19px;flex:none}
.neon-stat-card.blue .neon-stat-icon{background:linear-gradient(145deg,#0e69e4,#0f42b7)}.neon-stat-card.purple .neon-stat-icon{background:linear-gradient(145deg,#7b3ee9,#4d22a8)}
.neon-stat-card.cyan .neon-stat-icon{background:linear-gradient(145deg,#0ebccf,#0b659a)}.neon-stat-card.green .neon-stat-icon{background:linear-gradient(145deg,#11bd78,#0a744e)}
.neon-stat-card small{display:block;color:#7d96b5;font-size:9px}.neon-stat-card b{display:block;font-size:23px;margin-top:4px}.neon-stat-card em{display:block;font-style:normal;font-size:8px;color:#33e5a1;margin-top:5px}
.neon-stat-card .mini-spark{position:absolute;left:9px;right:auto;bottom:8px;width:88px;height:24px;opacity:.65}
.neon-dashboard-main{display:grid;grid-template-columns:1.7fr .85fr;gap:12px}
.neon-chart-panel,.neon-donut-panel{min-height:295px}
.neon-chart-panel .history-chart{height:205px;border:0;background:transparent;padding:0}
.neon-chart-panel .chart-legend{margin-top:0}.neon-chart-panel .legend-dot.mem{background:#793eff}
.neon-donut-wrap{display:flex;align-items:center;justify-content:center;gap:22px;min-height:220px}
.protocol-donut{--xray:40;--ssh:25;--wg:20;--ovpn:15;width:154px;height:154px;border-radius:50%;background:conic-gradient(#168cff 0 calc(var(--xray)*1%),#7743f5 calc(var(--xray)*1%) calc((var(--xray) + var(--ssh))*1%),#17d996 calc((var(--xray) + var(--ssh))*1%) calc((var(--xray) + var(--ssh) + var(--wg))*1%),#ff4c62 calc((var(--xray) + var(--ssh) + var(--wg))*1%) 100%);display:grid;place-items:center;box-shadow:0 0 35px rgba(34,100,255,.18)}
.protocol-donut:before{content:"";position:absolute;width:96px;height:96px;background:#07162a;border-radius:50%;border:1px solid #17395f}
.protocol-donut>div{position:relative;z-index:1;text-align:center}.protocol-donut b{font-size:22px}.protocol-donut span{display:block;font-size:8px;color:#6784a4;margin-top:2px}
.protocol-legend{display:grid;gap:10px;min-width:120px}.protocol-legend div{display:grid;grid-template-columns:9px 1fr auto;gap:7px;align-items:center;font-size:9px;color:#9cb2ca}.protocol-legend i{width:7px;height:7px;border-radius:50%}.protocol-legend b{color:#eaf3ff;font-size:9px}
.neon-service-strip{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.neon-service-pill{display:flex;align-items:center;gap:7px;border:1px solid #16395e;background:#07172c;border-radius:9px;padding:9px;min-width:0}.neon-service-pill i{width:7px;height:7px;border-radius:50%;background:#ff5068}.neon-service-pill i.on{background:#18db91;box-shadow:0 0 9px #18db91}.neon-service-pill b{font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.neon-service-pill span{display:block;color:#577393;font-size:7px;margin-top:2px}

/* Protocol / user management pages */
.protocol-page-header{display:flex;align-items:center;justify-content:space-between;gap:15px;border:1px solid #183b62;background:linear-gradient(100deg,#07182e,#08172b);border-radius:10px;padding:12px 14px;margin-bottom:10px}
.protocol-page-title{display:flex;align-items:center;gap:10px}.protocol-page-icon{width:43px;height:43px;border-radius:10px;display:grid;place-items:center;color:#fff;font-weight:900;font-size:12px}
.protocol-page-icon.ssh{background:linear-gradient(135deg,#108df9,#0b4dbe)}.protocol-page-icon.xray{background:linear-gradient(135deg,#8646f6,#5723bf)}.protocol-page-icon.wg{background:linear-gradient(135deg,#ee4850,#a91d29)}.protocol-page-icon.ovpn{background:linear-gradient(135deg,#ff9a30,#d86014)}
.protocol-page-title h2{font-size:17px;margin:0}.protocol-page-title p{font-size:8px;color:#718bad;margin:4px 0 0}.protocol-header-actions{display:flex;gap:7px;align-items:center}
.protocol-stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}.protocol-stat{border:1px solid #17385c;background:#07172d;border-radius:9px;padding:10px;display:flex;align-items:center;gap:9px}.protocol-stat .icon{width:33px;height:33px;border-radius:8px;display:grid;place-items:center;background:#0d315b;color:#47a8ff}.protocol-stat.green .icon{background:#0a382a;color:#41e2a4}.protocol-stat.red .icon{background:#35131d;color:#ff6f83}.protocol-stat span{display:block;font-size:8px;color:#6e89a9}.protocol-stat b{font-size:18px}
.protocol-directory{padding:0!important;overflow:hidden}.protocol-directory .panel-head{padding:12px 13px 8px;margin:0}.protocol-directory .table{border-top:1px solid #153657}
.makia-neon-shell .row{min-width:760px;padding:9px 12px;border-bottom:1px solid #112d4d;grid-template-columns:1.1fr .75fr .9fr 1fr;font-size:9px}.makia-neon-shell .row:nth-child(even){background:rgba(7,25,48,.35)}
.makia-neon-shell .row b{font-size:9px}.makia-neon-shell .toolbar{gap:5px}
.makia-neon-shell .filterbar input,.makia-neon-shell .filterbar select,.makia-neon-shell .search-input{background:#061429;border:1px solid #1b4167;color:#dcecff;border-radius:7px;padding:7px 9px;font-size:9px}
.makia-neon-shell .form-grid input,.makia-neon-shell .form-grid textarea,.makia-neon-shell .form-grid select,.makia-neon-shell .settings-form-grid input,.makia-neon-shell .settings-form-grid select,.makia-neon-shell .settings-form-grid textarea,.makia-neon-shell .single-label textarea,.makia-neon-shell .single-label input{background:#061429;border-color:#1a4067;border-radius:7px;padding:9px;color:#edf6ff}
.makia-neon-shell .form-grid label,.makia-neon-shell .settings-form-grid label,.makia-neon-shell .single-label{font-size:9px;color:#829bb8}
.makia-neon-shell .account-hero,.makia-neon-shell .wg-workspace-hero{padding:13px 15px;margin-bottom:9px;border-radius:10px}.makia-neon-shell .account-hero h2,.makia-neon-shell .wg-workspace-hero h2{font-size:17px}.makia-neon-shell .account-hero p,.makia-neon-shell .wg-workspace-hero p{font-size:9px;line-height:1.8}
.makia-neon-shell .wg-workspace-metrics{grid-template-columns:repeat(4,1fr);gap:8px;margin:0 0 10px}.makia-neon-shell .wg-workspace-metrics>div{border:1px solid #17385d;background:#07172d;border-radius:9px;padding:10px}.makia-neon-shell .wg-workspace-metrics span{font-size:8px}.makia-neon-shell .wg-workspace-metrics b{font-size:18px}
.makia-neon-shell .wg-workspace-list,.makia-neon-shell .protocol-client-list,.makia-neon-shell .access-cards{gap:7px}
.makia-neon-shell .access-profile,.makia-neon-shell .protocol-client,.makia-neon-shell .wg-peer-card{border-radius:8px;border-color:#17395e;background:#06162b}
.makia-neon-shell .access-command{padding:15px}.makia-neon-shell .access-command h2{font-size:19px}.makia-neon-shell .protocol-launch-grid{gap:8px}.makia-neon-shell .launch-card{border-radius:9px;border-color:#183c63;background:#07182e}
.makia-neon-shell .view-intro{padding:14px 16px;margin-bottom:10px}.makia-neon-shell .view-intro h2{font-size:18px}.makia-neon-shell .view-intro p{font-size:9px}
.makia-neon-shell .settings-shell{gap:10px}.makia-neon-shell .settings-nav,.makia-neon-shell .settings-card-v2{border-radius:9px;background:#07172c;border-color:#17395f}.makia-neon-shell .settings-nav button{border-radius:7px}.makia-neon-shell .settings-nav button.active{background:linear-gradient(90deg,#0d67ff,#3f35d4)}
.makia-neon-shell .settings-section-head h2{font-size:18px}.makia-neon-shell .settings-section-head p{font-size:9px}
.makia-neon-shell .modal{border-radius:12px;border-color:#24527f;background:linear-gradient(180deg,#07182e,#041124);box-shadow:0 35px 100px #000c}

/* Login */
body.neon-login-body{min-height:100vh;display:grid;place-items:center;background:#020817;overflow:hidden;position:relative}
.login-landscape{position:fixed;inset:0;background:
  radial-gradient(circle at 56% 42%,rgba(33,113,255,.24),transparent 22%),
  linear-gradient(180deg,#061b3b 0%,#0b1a43 35%,#060d21 62%,#020711 100%);overflow:hidden}
.login-landscape:before{content:"";position:absolute;inset:0;background-image:linear-gradient(110deg,transparent 0 47%,rgba(53,90,255,.12) 48% 49%,transparent 50%),radial-gradient(circle at 70% 8%,rgba(123,62,255,.42),transparent 16%);opacity:.8}
.mountain{position:absolute;bottom:31%;filter:drop-shadow(0 20px 45px #0008)}
.mountain-a{right:-4%;width:64%;height:56%;background:linear-gradient(145deg,#172b60,#0b173d 50%,#040b1f);clip-path:polygon(0 100%,18% 64%,29% 75%,48% 22%,59% 53%,72% 31%,100% 100%)}
.mountain-b{left:-10%;width:63%;height:47%;background:linear-gradient(145deg,#17245a,#0a1434 57%,#04091a);clip-path:polygon(0 100%,13% 70%,25% 80%,46% 38%,58% 65%,72% 28%,88% 68%,100% 100%)}
.mountain-c{left:20%;width:58%;height:35%;background:linear-gradient(145deg,#101e4a,#08122e 60%,#030918);clip-path:polygon(0 100%,14% 71%,28% 79%,44% 48%,59% 72%,77% 42%,100% 100%)}
.lake-glow{position:absolute;left:0;right:0;bottom:0;height:34%;background:linear-gradient(180deg,rgba(9,25,58,.75),#020713),radial-gradient(ellipse at 45% 0,rgba(62,103,255,.28),transparent 48%);border-top:1px solid rgba(65,94,180,.16)}
.login-shell-card{width:min(350px,91vw);position:relative;z-index:2;padding:26px 27px 18px;background:linear-gradient(180deg,rgba(5,23,45,.9),rgba(3,15,31,.92));border:1px solid #1b4977;border-radius:14px;box-shadow:0 30px 90px #000c,0 0 60px rgba(30,99,255,.12);backdrop-filter:blur(18px)}
.login-logo-wrap{text-align:center}.login-logo-wrap img{width:54px;height:54px;border-radius:13px;filter:drop-shadow(0 0 18px rgba(37,128,255,.35))}.login-logo-wrap strong{display:block;font-size:20px;letter-spacing:2.8px;margin-top:7px}.login-logo-wrap span{display:block;color:#50a9ff;font-size:8px;letter-spacing:2px;margin-top:1px}
.login-copy{text-align:center;margin:17px 0}.login-copy h1{font-size:16px;margin:0}.login-copy p{font-size:9px;color:#718eae;margin:6px 0 0}
.neon-login-form label>span{display:block;font-size:9px;color:#86a1be;margin-bottom:6px}.neon-login-form label{display:block;margin:12px 0}
.login-input-wrap{display:flex;align-items:center;border:1px solid #21476f;border-radius:8px;background:#07172c;padding:0 10px}.login-input-wrap:focus-within{border-color:#2589ff;box-shadow:0 0 0 3px rgba(37,137,255,.1)}.login-input-wrap i{font-style:normal;color:#7290b2;font-size:12px}.login-input-wrap input{width:100%;border:0!important;box-shadow:none!important;background:transparent!important;padding:10px 8px!important;margin:0!important;font-size:10px}
.login-options{display:flex;justify-content:space-between;align-items:center;margin:5px 0 12px;color:#607e9f;font-size:8px}.remember-check{display:flex!important;align-items:center;gap:5px;margin:0!important}.remember-check input{accent-color:#168cff}
.login-submit{width:100%;height:40px;border:1px solid #3e65ff;border-radius:8px;background:linear-gradient(90deg,#08a4ff,#235bff 48%,#7a3df4);color:#fff;font-weight:800;cursor:pointer;box-shadow:0 12px 30px rgba(27,94,255,.28)}.login-submit b{margin-right:7px}
.login-footer{display:flex;justify-content:space-between;border-top:1px solid #153659;margin-top:16px;padding-top:11px;color:#517092;font-size:7px}
.neon-login-body .alert{font-size:9px;border-radius:7px}

/* Responsive */
.mobile-menu-toggle{display:none}
@media(max-width:1180px){
  .neon-stat-grid{grid-template-columns:repeat(2,1fr)}
  .neon-dashboard-main{grid-template-columns:1fr}
  .neon-service-strip{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:820px){
  .makia-neon-shell .sidebar{transform:translateX(105%);transition:.25s;width:min(270px,84vw);box-shadow:-30px 0 70px #000a}
  .makia-neon-shell.menu-open .sidebar{transform:translateX(0)}
  .makia-neon-shell .workspace{margin-right:0;padding:0 12px 28px}
  .makia-neon-shell .topbar{margin:0 -12px;padding:0 12px;height:58px}
  .mobile-menu-toggle{display:grid;place-items:center;width:34px;height:34px;border-radius:8px;border:1px solid #1b4068;background:#07172b;color:white;margin-left:7px}
  .topbar-brand-mobile{display:flex;align-items:center;gap:5px;margin-left:auto}.topbar-brand-mobile img{width:27px;height:27px}.topbar-brand-mobile b{font-size:11px}
  .makia-neon-shell .command-trigger{width:36px;padding:0;justify-content:center}.makia-neon-shell .command-trigger b,.makia-neon-shell .command-trigger kbd{display:none}
  .account-menu summary div,.account-menu summary>span:last-child{display:none}.account-menu summary{min-width:auto;padding:2px}.account-avatar{width:30px;height:30px}
  .top-icon-button:first-child{display:none}
  .page-titlebar{padding:14px 0 10px}.page-titlebar h1{font-size:17px}.page-title-actions .top-live-badge{display:none}.top-create{font-size:8px!important}
  .neon-stat-grid{grid-template-columns:1fr 1fr;gap:7px}.neon-stat-card{min-height:88px;padding:11px}.neon-stat-card b{font-size:18px}.neon-stat-icon{width:36px;height:36px}
  .neon-service-strip{grid-template-columns:1fr 1fr}.neon-donut-wrap{flex-direction:column}
  .protocol-page-header{align-items:flex-start;flex-direction:column}.protocol-header-actions{width:100%;flex-wrap:wrap}.protocol-stat-grid{grid-template-columns:1fr 1fr 1fr}
  .makia-neon-shell .form-grid,.makia-neon-shell .form-grid.two,.makia-neon-shell .settings-form-grid{grid-template-columns:1fr}
}
@media(max-width:520px){
  .neon-stat-grid{grid-template-columns:1fr}.neon-service-strip{grid-template-columns:1fr}
  .protocol-stat-grid{grid-template-columns:1fr}.page-title-actions .top-create{padding:7px 9px!important}
  .makia-neon-shell .top-actions{gap:4px}.top-icon-button{width:30px;height:30px}.account-avatar{width:28px;height:28px}
}

/* v0.23 table treatment for user/protocol directories */
.neon-table-head{display:grid;grid-template-columns:1.1fr .75fr .9fr 1fr;gap:10px;padding:8px 12px;border-top:1px solid #143453;border-bottom:1px solid #143453;background:#061326;color:#5f7e9f;font-size:8px;min-width:760px}
.protocol-client-list{display:grid;gap:0}.protocol-client-row{display:grid;grid-template-columns:1.1fr 1.2fr .75fr 1fr;align-items:center;gap:10px;padding:10px 12px;border-top:1px solid #112f50;background:transparent;min-width:820px}
.protocol-client-row:nth-child(even){background:rgba(8,29,55,.34)}.protocol-client-row b{font-size:9px}.protocol-client-row .client-main{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.protocol-pill{background:#102b50;border:1px solid #235087;border-radius:5px;padding:3px 6px;color:#8bbdff;font-size:7px}
.usage-track{height:5px;border-radius:99px;background:#10233b;margin:5px 0;overflow:hidden}.usage-track i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#128cff,#7140f5)}
.wg-workspace-directory .table,.protocol-directory .protocol-client-list{overflow:auto}
.makia-neon-shell .access-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.makia-neon-shell .access-profile{padding:10px}
@media(max-width:820px){.makia-neon-shell .access-cards{grid-template-columns:1fr}.protocol-client-list{overflow:auto}}

/* v0.23 service + port management */
.port-management-panel{padding:0!important;overflow:auto}.port-management-panel .panel-head{padding:12px 13px;margin:0}
.port-table-head,.port-table-row{display:grid;grid-template-columns:1.2fr .55fr .85fr .7fr .9fr;align-items:center;gap:9px;min-width:720px}
.port-table-head{padding:8px 12px;background:#061326;border-top:1px solid #143453;border-bottom:1px solid #143453;color:#607f9f;font-size:8px}
.port-table-row{padding:9px 12px;border-bottom:1px solid #112f50;font-size:9px}.port-table-row:nth-child(even){background:rgba(8,29,55,.34)}
.port-table-row b{font-size:9px}.port-table-row span{display:block;color:#6683a3;font-size:8px;margin-top:2px}.transport-badge{display:inline-flex!important;width:max-content;padding:4px 7px;border-radius:5px;background:#0d2a4b;border:1px solid #1e4d7d;color:#78b5f5!important}
.port-safe-note{margin:10px 12px 12px;padding:9px 10px;border:1px solid #145844;border-radius:7px;background:#07251c;color:#54dca7;font-size:8px}
.service-control-list{display:grid;gap:6px}.service-control-row{display:grid;grid-template-columns:36px minmax(150px,1fr) 90px 46px minmax(210px,auto);align-items:center;gap:9px;padding:9px;border:1px solid #153759;border-radius:8px;background:#06162a}
.service-logo-mini{width:32px;height:32px;border-radius:8px;display:grid;place-items:center;background:linear-gradient(145deg,#145bc9,#5b32d3);color:#fff;font-weight:800;font-size:11px}
.service-control-copy b{display:block;font-size:9px}.service-control-copy span{display:block;font-size:7px;color:#5d7899;margin-top:2px}
.service-switch{width:36px;height:20px;border-radius:99px;background:#132b46;padding:3px;display:flex;align-items:center}.service-switch i{display:block;width:14px;height:14px;border-radius:50%;background:#67809d;transition:.2s}.service-switch.on{background:#0c67f1}.service-switch.on i{margin-right:auto;background:white;box-shadow:0 0 10px #fff8}
.protocol-policy-mini{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.protocol-policy-mini>div{display:flex;justify-content:space-between;align-items:center;padding:9px;border:1px solid #153759;border-radius:8px;background:#06162a}.protocol-policy-mini b{display:block;font-size:9px}.protocol-policy-mini span{font-size:7px;color:#63809f}.protocol-policy-mini strong{font-size:8px}
.ok-text{color:#37dda1}.bad-text{color:#ff667a}
@media(max-width:900px){.service-control-row{grid-template-columns:32px 1fr auto}.service-control-row>.service-switch{display:none}.service-control-row>.toolbar{grid-column:2/4}.protocol-policy-mini{grid-template-columns:1fr 1fr}}
@media(max-width:540px){.protocol-policy-mini{grid-template-columns:1fr}}

.login-eye{border:0;background:transparent;color:#6f8cae;cursor:pointer;padding:5px;font-size:10px}.login-eye:hover{color:#fff}


/* ==========================================================================
   v0.24 Sanaei-structure shell
   Information architecture and interaction model are intentionally aligned
   with the compact rail/sidebar + card/table workflow used by modern 3x-ui.
   Makia keeps its own branding, backend and capability boundaries.
   ========================================================================== */
:root{
  --sx-bg:#0b101a;
  --sx-bg-soft:#0f1624;
  --sx-panel:#111a2b;
  --sx-panel-2:#151f32;
  --sx-line:#26344b;
  --sx-line-soft:#1d293b;
  --sx-text:#f2f5fa;
  --sx-muted:#8b99ad;
  --sx-primary:#1677ff;
  --sx-primary-soft:#163b70;
  --sx-green:#2cc987;
  --sx-yellow:#e7ad42;
  --sx-red:#ef5b6c;
  --sx-sidebar-rail:72px;
  --sx-sidebar-wide:220px;
  --sx-radius:10px;
  --sx-shadow:0 8px 24px rgba(0,0,0,.2);
}

body.makia-sanaei-shell{
  margin:0;
  min-height:100vh;
  background:var(--sx-bg);
  color:var(--sx-text);
  font-family:Tahoma,Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  overflow-x:hidden;
}

.makia-sanaei-shell .sanaei-sidebar{
  position:fixed;
  inset:0 0 0 auto;
  width:var(--sx-sidebar-rail);
  height:100vh;
  z-index:50;
  display:flex;
  flex-direction:column;
  background:#0e1523;
  border-left:1px solid var(--sx-line);
  box-shadow:6px 0 24px rgba(0,0,0,.18);
  overflow:hidden;
  transition:width .18s ease;
}
.makia-sanaei-shell .sanaei-sidebar:hover,
.makia-sanaei-shell.sidebar-pinned .sanaei-sidebar{
  width:var(--sx-sidebar-wide);
}
.makia-sanaei-shell.sidebar-pinned .sanaei-content-shell{
  margin-right:var(--sx-sidebar-wide);
}
.makia-sanaei-shell .sanaei-content-shell{
  min-height:100vh;
  margin-right:var(--sx-sidebar-rail);
  background:var(--sx-bg);
  transition:margin-right .18s ease;
}

.sanaei-brand{
  height:62px;
  min-height:62px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 14px;
  border-bottom:1px solid var(--sx-line-soft);
}
.sanaei-brand img{width:34px;height:34px;flex:none;border-radius:8px}
.sanaei-brand-text{
  min-width:110px;
  opacity:0;
  transform:translateX(6px);
  transition:.16s ease;
}
.sanaei-sidebar:hover .sanaei-brand-text,
.sidebar-pinned .sanaei-brand-text{opacity:1;transform:none}
.sanaei-brand-text strong{display:block;font-size:13px;letter-spacing:1.5px}
.sanaei-brand-text span{display:block;margin-top:1px;font-size:7px;color:#5d93d8;letter-spacing:1.2px}
.sidebar-pin-btn{
  margin-right:auto;
  width:27px;height:27px;flex:none;
  border:1px solid transparent;border-radius:7px;
  background:transparent;color:#64748b;cursor:pointer;
  opacity:0;transition:.16s ease;
}
.sanaei-sidebar:hover .sidebar-pin-btn,.sidebar-pinned .sidebar-pin-btn{opacity:1}
.sidebar-pin-btn:hover,.sidebar-pinned .sidebar-pin-btn{color:#fff;background:#172238;border-color:#2a3b58}

.sanaei-command{
  margin:10px 10px 6px;
  height:37px;
  min-height:37px;
  display:flex;align-items:center;gap:9px;
  border:1px solid #263752;border-radius:8px;
  background:#101a2b;color:#8fa0b7;cursor:pointer;
  padding:0 11px;overflow:hidden;
}
.sanaei-command .menu-symbol{width:28px;min-width:28px;text-align:center;font-size:18px}
.sanaei-command b{white-space:nowrap;font-size:10px;font-weight:500;opacity:0;transition:.16s ease}
.sanaei-command kbd{margin-right:auto;border:1px solid #31415b;border-radius:5px;padding:2px 5px;font-size:7px;background:#0b1320;color:#7e8da2;opacity:0}
.sanaei-sidebar:hover .sanaei-command b,.sanaei-sidebar:hover .sanaei-command kbd,
.sidebar-pinned .sanaei-command b,.sidebar-pinned .sanaei-command kbd{opacity:1}

.sanaei-nav{
  flex:1;
  overflow-y:auto;
  overflow-x:hidden;
  padding:5px 9px 10px;
  scrollbar-width:thin;
  scrollbar-color:#33445f transparent;
}
.sanaei-nav>button,.sanaei-group-toggle,.sanaei-submenu button{
  width:100%;
  border:0;
  color:#a7b2c2;
  background:transparent;
  cursor:pointer;
  text-align:right;
  display:flex;align-items:center;
  min-height:40px;
  border-radius:8px;
  padding:0 9px;
  gap:10px;
  transition:background .12s,color .12s;
}
.sanaei-nav>button:hover,.sanaei-group-toggle:hover,.sanaei-submenu button:hover{
  background:#172238;color:#fff;
}
.sanaei-nav>button.active,.sanaei-submenu button.active{
  background:#14345f;color:#eaf3ff;
}
.sanaei-nav .menu-symbol{
  width:34px;min-width:34px;height:34px;
  display:grid;place-items:center;
  font-size:16px;color:#8ea4bf;
}
.sanaei-nav>button.active .menu-symbol{color:#5ba2ff}
.sanaei-nav button b{
  min-width:128px;
  white-space:nowrap;
  font-size:10px;font-weight:600;
  opacity:0;transform:translateX(6px);transition:.16s ease;
}
.sanaei-nav-group .sanaei-group-toggle b{min-width:112px}
.sanaei-nav-group .sanaei-group-toggle em{margin-right:auto;font-style:normal;opacity:0}
.sanaei-sidebar:hover .sanaei-nav button b,
.sidebar-pinned .sanaei-nav button b,
.sanaei-sidebar:hover .sanaei-group-toggle em,
.sidebar-pinned .sanaei-group-toggle em{opacity:1;transform:none}
.sanaei-nav-sep{height:1px;background:var(--sx-line-soft);margin:8px 7px}

.sanaei-nav-group{display:block}
.sanaei-submenu{
  display:none;
  margin:0 17px 4px 0;
  padding-right:8px;
  border-right:1px solid #283852;
}
.sanaei-nav-group.open .sanaei-submenu{display:block}
.sanaei-submenu button{min-height:32px;padding:0 7px}
.sanaei-submenu button span{width:14px;color:#4f87c9}
.sanaei-submenu button b{font-size:9px;font-weight:500}

.sanaei-sidebar-footer{
  border-top:1px solid var(--sx-line-soft);
  padding:9px;
  display:grid;gap:7px;
}
.sanaei-server-state{
  height:37px;display:flex;align-items:center;gap:10px;
  padding:0 9px;border-radius:8px;background:#111b2c;overflow:hidden;
}
.sanaei-server-state i{width:8px;height:8px;min-width:8px;border-radius:50%;background:var(--sx-green);box-shadow:0 0 0 3px rgba(44,201,135,.12)}
.sanaei-server-state span{min-width:130px;opacity:0;transition:.16s}
.sanaei-sidebar:hover .sanaei-server-state span,.sidebar-pinned .sanaei-server-state span{opacity:1}
.sanaei-server-state b{display:block;font-size:9px}.sanaei-server-state small{display:block;color:#718097;font-size:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sanaei-version{font-size:7px;color:#64748b;padding:0 11px;white-space:nowrap}
.sidebar-logout{
  width:100%;height:34px;border:0;border-radius:8px;background:transparent;color:#9caabd;
  display:flex;align-items:center;gap:11px;padding:0 13px;cursor:pointer;
}
.sidebar-logout:hover{background:#2b1820;color:#ff8c98}.sidebar-logout b{font-size:9px;opacity:0}.sanaei-sidebar:hover .sidebar-logout b,.sidebar-pinned .sidebar-logout b{opacity:1}

.sanaei-mobile-header{display:none}
.compat-page-meta{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.sanaei-content{
  max-width:1600px;
  margin:0 auto;
  padding:20px 24px 40px;
}

/* Sanaei-like page scaffolding */
.sx-page{display:grid;gap:14px}
.sx-page-head{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.sx-page-head h1{margin:0;font-size:20px;font-weight:700}
.sx-page-head p{margin:4px 0 0;color:var(--sx-muted);font-size:9px;line-height:1.65}
.sx-head-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.sx-state-pill{
  display:inline-flex;align-items:center;gap:7px;
  min-height:32px;padding:0 10px;
  border:1px solid #2b3a52;border-radius:8px;
  background:#111a2a;color:#afbdce;font-size:9px;
}
.sx-state-pill i{width:7px;height:7px;border-radius:50%;background:var(--sx-green)}
.sx-state-pill.warn i{background:var(--sx-yellow)}
.sx-state-pill.bad i{background:var(--sx-red)}

.sx-actionbar{
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;
  padding:9px;border:1px solid var(--sx-line);border-radius:var(--sx-radius);
  background:var(--sx-panel);
}
.sx-actionbar .sx-sep{width:1px;height:24px;background:var(--sx-line);margin:0 3px}
.sx-actionbar button{
  min-height:30px;border:1px solid transparent;border-radius:7px;padding:0 10px;
  background:transparent;color:#aeb9c8;font-size:9px;cursor:pointer;
}
.sx-actionbar button:hover{background:#19263b;color:#fff;border-color:#2c405f}
.sx-actionbar button.primary{background:#153e72;border-color:#2468b7;color:#ddecff}
.sx-actionbar button.danger{color:#ff8793}
.sx-actionbar .sx-version{margin-right:auto;color:#71829a;font-size:8px}

.sx-vitals{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.sx-vital{
  min-height:154px;
  border:1px solid var(--sx-line);border-radius:var(--sx-radius);
  background:var(--sx-panel);
  padding:14px;box-shadow:var(--sx-shadow);
  overflow:hidden;
}
.sx-vital-head{display:flex;align-items:center;gap:8px;color:#9cadc1;font-size:9px}
.sx-vital-head span:first-child{font-size:16px;color:#7ea8dd}
.sx-vital-value{display:flex;align-items:baseline;gap:4px;margin-top:12px}
.sx-vital-value b{font-size:30px;font-weight:650}.sx-vital-value span{font-size:10px;color:#8190a5}
.sx-vital-detail{margin-top:4px;color:#8796aa;font-size:8px}
.sx-meter{height:4px;margin-top:13px;background:#202d42;border-radius:99px;overflow:hidden}
.sx-meter i{display:block;height:100%;background:#438df5;border-radius:99px}
.sx-vital-foot{display:flex;justify-content:space-between;margin-top:8px;color:#6f7f94;font-size:7px}

.sx-mid-grid{display:grid;grid-template-columns:1.65fr 1fr;gap:12px}
.sx-card{
  border:1px solid var(--sx-line);border-radius:var(--sx-radius);
  background:var(--sx-panel);box-shadow:var(--sx-shadow);
  padding:14px;
}
.sx-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.sx-card-head h3{margin:0;font-size:12px}.sx-card-head p{margin:3px 0 0;color:#728197;font-size:8px}
.sx-card .history-chart{height:190px;background:transparent;border:0;padding:0}
.sx-card .chart-legend{font-size:8px;color:#75869e}
.sx-protocol-list{display:grid;gap:7px}
.sx-protocol-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid #1d293b}
.sx-protocol-row:last-child{border-bottom:0}
.sx-protocol-row b{font-size:9px}.sx-protocol-row span{font-size:8px;color:#7f8ea3}
.sx-protocol-row em{font-style:normal;font-size:10px;color:#dce5f2}
.sx-protocol-bar{grid-column:1/3;height:4px;border-radius:99px;background:#1d293d;overflow:hidden}
.sx-protocol-bar i{display:block;height:100%;background:#3f86ea;border-radius:99px}

.sx-system-strip{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  border:1px solid var(--sx-line);border-radius:var(--sx-radius);
  background:var(--sx-panel);overflow:hidden;
}
.sx-system-cell{padding:13px 15px;border-left:1px solid var(--sx-line)}
.sx-system-cell:last-child{border-left:0}
.sx-system-cell span{display:block;color:#728198;font-size:8px}
.sx-system-cell b{display:block;margin-top:6px;font-size:11px;font-weight:600}

/* Sanaei-like cards/tables for every management view */
.makia-sanaei-shell .panel,
.makia-sanaei-shell .view-intro,
.makia-sanaei-shell .account-hero,
.makia-sanaei-shell .wg-workspace-hero,
.makia-sanaei-shell .access-command,
.makia-sanaei-shell .settings-card-v2,
.makia-sanaei-shell .settings-nav{
  border:1px solid var(--sx-line)!important;
  border-radius:var(--sx-radius)!important;
  background:var(--sx-panel)!important;
  box-shadow:none!important;
}
.makia-sanaei-shell .primary{
  background:#1668dc!important;border-color:#1668dc!important;color:#fff!important;box-shadow:none!important
}
.makia-sanaei-shell .ghost,.makia-sanaei-shell .soft{
  background:#141f31!important;border-color:#2d405d!important;color:#b8c5d5!important
}
.makia-sanaei-shell .danger{background:#2b1720!important;border-color:#713241!important;color:#ff8995!important}
.makia-sanaei-shell .primary,.makia-sanaei-shell .ghost,.makia-sanaei-shell .soft,.makia-sanaei-shell .danger{
  border-radius:7px!important;padding:7px 10px!important;font-size:9px!important
}
.makia-sanaei-shell input,.makia-sanaei-shell select,.makia-sanaei-shell textarea{
  background:#0d1523!important;border-color:#2a3b55!important;color:#eaf0f8!important;border-radius:7px!important
}
.makia-sanaei-shell .row,.makia-sanaei-shell .access-profile,.makia-sanaei-shell .protocol-client-row,.makia-sanaei-shell .wg-workspace-peer{
  background:transparent!important;border-color:#1f2c40!important
}
.makia-sanaei-shell .row:nth-child(even),.makia-sanaei-shell .protocol-client-row:nth-child(even){background:#0f1828!important}
.makia-sanaei-shell .status-chip{border-radius:5px!important}
.makia-sanaei-shell .status-chip.ok{background:#102d24!important;border-color:#235f4a!important;color:#65d7a7!important}
.makia-sanaei-shell .status-chip.warn{background:#302719!important;border-color:#66502a!important;color:#e8c170!important}
.makia-sanaei-shell .status-chip.bad{background:#321b22!important;border-color:#74404b!important;color:#ff8d98!important}

.sx-table-wrap{border:1px solid var(--sx-line);border-radius:var(--sx-radius);background:var(--sx-panel);overflow:hidden}
.sx-table-toolbar{padding:11px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--sx-line)}
.sx-table-toolbar h3{margin:0;font-size:11px}.sx-table-toolbar small{display:block;margin-top:2px;color:#6f8199;font-size:7px}
.sx-toolbar-right{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.sx-search{min-width:220px}
.sx-summary-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.sx-summary{
  padding:11px 12px;border:1px solid var(--sx-line);border-radius:9px;background:var(--sx-panel)
}
.sx-summary span{display:block;color:#73849b;font-size:8px}.sx-summary b{display:block;margin-top:5px;font-size:17px}
.sx-summary small{display:block;margin-top:3px;font-size:7px;color:#5f7189}

.sx-inbound-list{display:grid}
.sx-inbound-row{
  display:grid;
  grid-template-columns:44px minmax(150px,1.2fr) .65fr .6fr .7fr .7fr minmax(220px,1fr);
  align-items:center;gap:10px;
  padding:10px 12px;
  border-bottom:1px solid #1f2b3e;
  min-width:900px;
}
.sx-inbound-row:last-child{border-bottom:0}
.sx-inbound-icon{width:34px;height:34px;border-radius:8px;display:grid;place-items:center;background:#17355f;color:#7eb4ff;font-weight:800;font-size:10px}
.sx-inbound-main b{display:block;font-size:9px}.sx-inbound-main span{display:block;color:#71849d;font-size:7px;margin-top:3px}
.sx-inbound-cell span{display:block;color:#6c7e95;font-size:7px}.sx-inbound-cell b{display:block;font-size:9px;margin-top:3px}
.sx-inbound-actions{display:flex;gap:5px;justify-content:flex-end;flex-wrap:wrap}

/* Clients page collapses protocol launchers into a compact toolbar */
.sx-client-tabs{display:flex;gap:4px;flex-wrap:wrap}
.sx-client-tabs button{
  border:1px solid #2a3b55;border-radius:7px;background:#111a2b;color:#8e9db1;
  padding:6px 9px;font-size:8px;cursor:pointer;
}
.sx-client-tabs button.active{background:#173b68;color:#dcebff;border-color:#2d6eb6}
.makia-sanaei-shell .access-cards{display:grid!important;grid-template-columns:1fr!important;gap:0!important}
.makia-sanaei-shell .access-profile{
  display:grid!important;
  grid-template-columns:minmax(220px,1.2fr) .6fr minmax(300px,1.4fr) auto!important;
  align-items:center;gap:10px!important;
  padding:10px 12px!important;border:0!important;border-bottom:1px solid #1f2c40!important;border-radius:0!important;
}
.makia-sanaei-shell .profile-avatar{border-radius:8px!important;background:#1a355d!important}
.makia-sanaei-shell .profile-delivery,.makia-sanaei-shell .profile-actions{display:flex!important;gap:5px!important;flex-wrap:wrap!important}

/* Login aligned to current 3x-ui structure: clean centered card + small toolbar. */
body.sanaei-login{
  min-height:100vh;display:grid;place-items:center;background:#0b101a;color:#f5f7fb;position:relative
}
.sanaei-login-toolbar{position:fixed;top:18px;left:18px;display:flex;gap:7px}
.sanaei-login-toolbar button{width:38px;height:38px;border-radius:50%;border:1px solid #283851;background:#111a2a;color:#a8b6c8;cursor:pointer}
.sanaei-login-card{width:min(360px,calc(100vw - 32px));padding:28px;background:#111a2b;border:1px solid #2a394f;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.sanaei-login-brand{text-align:center;margin-bottom:22px}.sanaei-login-brand img{width:50px;height:50px}.sanaei-login-brand strong{display:block;font-size:22px;letter-spacing:2px;margin-top:8px}.sanaei-login-brand span{display:block;color:#6999d8;font-size:8px;letter-spacing:1.7px;margin-top:2px}
.sanaei-login-card h1{text-align:center;margin:0 0 6px;font-size:19px}.sanaei-login-card>p{text-align:center;margin:0 0 20px;color:#8190a5;font-size:9px}
.sanaei-login-form label{display:block;margin:12px 0}.sanaei-login-form label>span{display:block;margin-bottom:6px;color:#a9b5c5;font-size:9px}
.sanaei-login-input{display:flex;align-items:center;border:1px solid #2d3e59;border-radius:8px;background:#0d1523;padding:0 10px}
.sanaei-login-input:focus-within{border-color:#347edf;box-shadow:0 0 0 2px rgba(22,119,255,.13)}
.sanaei-login-input input{width:100%;border:0!important;background:transparent!important;box-shadow:none!important;padding:10px 7px!important;margin:0!important}
.sanaei-login-input button{border:0;background:transparent;color:#728198;cursor:pointer}
.sanaei-login-submit{width:100%;height:40px;border:0;border-radius:8px;background:#1677ff;color:#fff;font-weight:700;cursor:pointer;margin-top:6px}
.sanaei-login-foot{display:flex;justify-content:space-between;margin-top:17px;padding-top:12px;border-top:1px solid #223149;color:#64748b;font-size:7px}

/* hide the v0.23-specific visual chrome when v0.24 shell is active */
.makia-sanaei-shell .neon-bg-grid,.makia-sanaei-shell .neon-glow,.makia-sanaei-shell .topbar,.makia-sanaei-shell .page-titlebar{display:none!important}

@media(max-width:1180px){
  .sx-vitals{grid-template-columns:repeat(2,1fr)}
  .sx-mid-grid{grid-template-columns:1fr}
  .sx-system-strip{grid-template-columns:repeat(2,1fr)}
  .sx-summary-row{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:820px){
  body.makia-sanaei-shell{--sx-sidebar-rail:0px}
  .makia-sanaei-shell .sanaei-sidebar{
    width:min(300px,84vw)!important;
    transform:translateX(105%);
    transition:transform .2s ease;
    box-shadow:-18px 0 55px rgba(0,0,0,.38);
  }
  .makia-sanaei-shell.menu-open .sanaei-sidebar{transform:translateX(0)}
  .makia-sanaei-shell .sanaei-brand-text,.makia-sanaei-shell .sidebar-pin-btn,.makia-sanaei-shell .sanaei-command b,.makia-sanaei-shell .sanaei-command kbd,.makia-sanaei-shell .sanaei-nav button b,.makia-sanaei-shell .sanaei-group-toggle em,.makia-sanaei-shell .sanaei-server-state span,.makia-sanaei-shell .sidebar-logout b{opacity:1;transform:none}
  .makia-sanaei-shell .sanaei-content-shell{margin-right:0!important}
  .sanaei-mobile-header{
    height:54px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;
    border-bottom:1px solid var(--sx-line);background:#0e1523;position:sticky;top:0;z-index:30
  }
  .sanaei-mobile-header button{width:34px;height:34px;border:1px solid #2c3e58;border-radius:8px;background:#141f31;color:#d6dfeb}
  .sanaei-mobile-header div{display:flex;align-items:center;gap:6px}.sanaei-mobile-header img{width:27px;height:27px}.sanaei-mobile-header strong{font-size:11px}
  .sanaei-content{padding:14px 10px 30px}
  .sx-page-head{align-items:flex-start;flex-direction:column}
  .sx-head-actions{width:100%}
  .sx-vitals{grid-template-columns:1fr 1fr;gap:8px}
  .sx-vital{min-height:132px;padding:11px}.sx-vital-value b{font-size:23px}
  .sx-system-strip{grid-template-columns:1fr 1fr}
  .sx-system-cell:nth-child(2n){border-left:0}.sx-system-cell{border-bottom:1px solid var(--sx-line)}
  .sx-summary-row{grid-template-columns:1fr 1fr}
  .sx-table-toolbar{align-items:flex-start;flex-direction:column}.sx-toolbar-right{width:100%}.sx-search{min-width:0;flex:1}
  .makia-sanaei-shell .access-profile{grid-template-columns:1fr!important}
  .sx-inbound-list,.makia-sanaei-shell .protocol-client-list,.makia-sanaei-shell .table{overflow:auto}
}
@media(max-width:520px){
  .sx-vitals,.sx-summary-row{grid-template-columns:1fr}
  .sx-system-strip{grid-template-columns:1fr}.sx-system-cell{border-left:0}
}

.settings-tabs-sx{
  display:flex;gap:5px;flex-wrap:wrap;
  padding:8px;border:1px solid var(--sx-line);border-radius:var(--sx-radius);
  background:var(--sx-panel);
}
.settings-tabs-sx button{
  min-height:32px;border:1px solid transparent;border-radius:7px;padding:0 9px;
  background:transparent;color:#8898ad;display:flex;align-items:center;gap:6px;cursor:pointer;font-size:8px
}
.settings-tabs-sx button i{font-style:normal;color:#6f8fb8}
.settings-tabs-sx button.active{background:#173b68;border-color:#2d65a6;color:#dcecff}
.settings-content-v2{min-width:0}.settings-content-v2 .settings-section-head{margin-bottom:10px}
@media(max-width:820px){.settings-tabs-sx{overflow:auto;flex-wrap:nowrap}.settings-tabs-sx button{white-space:nowrap}}


/* ==========================================================================
   v0.25 Professional Operations UI
   Readable scale, grouped navigation, progressive disclosure and drawer flows.
   ========================================================================== */
:root{
  --pro-bg:#07101d;
  --pro-bg-soft:#0a1422;
  --pro-surface:#0e1929;
  --pro-surface-2:#111f32;
  --pro-surface-3:#15263b;
  --pro-line:#243952;
  --pro-line-soft:#1a2b40;
  --pro-text:#edf4fc;
  --pro-muted:#8ea2ba;
  --pro-blue:#3b82f6;
  --pro-blue-2:#2563eb;
  --pro-cyan:#22c9ee;
  --pro-green:#2dd49f;
  --pro-red:#fb7185;
  --pro-amber:#f5c451;
  --pro-violet:#8b5cf6;
  --pro-sidebar:258px;
  --pro-radius:12px;
  --pro-shadow:0 16px 45px rgba(0,0,0,.22);
}

body.makia-pro-shell{
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(circle at 78% -12%,rgba(34,94,190,.15),transparent 30%),
    linear-gradient(180deg,#07101d 0%,#060d17 100%);
  color:var(--pro-text);
  font-family:Tahoma,"Segoe UI",Inter,Arial,sans-serif;
  font-size:14px;
  line-height:1.55;
  overflow-x:hidden;
}
.makia-pro-shell *{scrollbar-width:thin;scrollbar-color:#39516d transparent}
.makia-pro-shell button,.makia-pro-shell input,.makia-pro-shell select,.makia-pro-shell textarea{font:inherit}
.makia-pro-shell button{cursor:pointer}

/* Shell */
.pro-sidebar{
  position:fixed;right:0;top:0;bottom:0;width:var(--pro-sidebar);z-index:60;
  display:flex;flex-direction:column;
  background:linear-gradient(180deg,#0b1625,#08111e 72%);
  border-left:1px solid var(--pro-line);
  box-shadow:14px 0 45px rgba(0,0,0,.18);
}
.pro-brand{
  height:72px;display:flex;align-items:center;gap:11px;padding:0 18px;
  border-bottom:1px solid var(--pro-line-soft);
}
.pro-brand img{width:39px;height:39px;border-radius:10px;filter:drop-shadow(0 0 12px rgba(59,130,246,.22))}
.pro-brand strong{display:block;font-size:15px;letter-spacing:1.8px}
.pro-brand span{display:block;color:#69a7ef;font-size:8px;letter-spacing:1.2px;margin-top:1px}
.sidebar-mobile-close{display:none;margin-right:auto;width:34px;height:34px;border:1px solid var(--pro-line);border-radius:9px;background:#111e30;color:#c9d5e3}

.pro-create-access{
  margin:14px 13px 9px;padding:11px 12px;min-height:58px;
  display:flex;align-items:center;gap:10px;text-align:right;
  border:1px solid #356dcc;border-radius:11px;
  color:#fff;background:linear-gradient(135deg,#1f6fe5,#3648d8);
  box-shadow:0 10px 24px rgba(37,99,235,.22);
}
.pro-create-access>span{width:31px;height:31px;display:grid;place-items:center;border-radius:8px;background:rgba(255,255,255,.12);font-size:20px}
.pro-create-access b{display:block;font-size:12px}.pro-create-access small{display:block;font-size:8px;color:#d8e6ff;margin-top:2px;font-weight:400}

.pro-nav{flex:1;overflow-y:auto;padding:4px 10px 14px}
.pro-nav>p{margin:16px 10px 6px;color:#607993;font-size:9px;font-weight:700;letter-spacing:.8px}
.pro-nav>button,.pro-group-toggle,.pro-submenu button{
  width:100%;min-height:44px;display:flex;align-items:center;gap:10px;
  padding:0 10px;border:1px solid transparent;border-radius:9px;
  background:transparent;color:#a7b6c8;text-align:right;
}
.pro-nav>button:hover,.pro-group-toggle:hover,.pro-submenu button:hover{background:#111f32;color:#fff}
.pro-nav>button.active,.pro-submenu button.active{background:#162b47;border-color:#254a78;color:#fff}
.pro-nav-icon{width:28px;height:28px;flex:none;display:grid;place-items:center;border-radius:8px;background:#13243a;color:#8fb8e8;font-size:14px}
.pro-nav button b{font-size:12px;font-weight:600}
.pro-nav>button em{margin-right:auto;font-size:8px;color:#61778f;font-style:normal}
.pro-nav-group{display:block}.pro-group-toggle i{margin-right:auto;font-style:normal;color:#6e8298;transition:.18s}
.pro-nav-group.open .pro-group-toggle i{transform:rotate(180deg)}
.pro-submenu{display:none;margin:3px 18px 5px 0;padding:3px 7px 3px 0;border-right:1px solid #2a3e58}
.pro-nav-group.open .pro-submenu{display:grid;gap:2px}
.pro-submenu button{min-height:36px;padding:0 8px}.pro-submenu button b{font-size:10px;font-weight:500}
.pro-submenu button>span:first-child{width:14px;text-align:center;color:#547aa5}
.proto-dot{width:8px!important;height:8px;border-radius:50%;margin-left:3px}.proto-dot.xray{background:#8b5cf6}.proto-dot.inbound{background:#38bdf8}.proto-dot.ssh{background:#3b82f6}.proto-dot.wg{background:#fb7185}.proto-dot.ovpn{background:#f59e0b}

.pro-sidebar-footer{padding:11px 13px 13px;border-top:1px solid var(--pro-line-soft)}
.server-health{display:flex;align-items:center;gap:8px;padding:9px;border-radius:9px;background:#0d1b2c}.server-health>i{width:8px;height:8px;border-radius:50%;background:var(--pro-green);box-shadow:0 0 10px rgba(45,212,159,.65)}
.server-health b{display:block;font-size:9px}.server-health small{display:block;color:#70849b;font-size:8px;margin-top:1px;max-width:155px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.footer-meta{display:flex;align-items:center;justify-content:space-between;margin-top:8px;color:#5e738b;font-size:8px}.footer-meta form{margin:0}.footer-meta button{border:0;background:transparent;color:#8193a8;font-size:9px}

.pro-main{min-height:100vh;margin-right:var(--pro-sidebar)}
.pro-topbar{
  height:64px;position:sticky;top:0;z-index:40;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 26px;border-bottom:1px solid var(--pro-line-soft);
  background:rgba(7,16,29,.88);backdrop-filter:blur(16px);
}
.pro-topbar-right,.pro-topbar-left{display:flex;align-items:center;gap:9px}
.global-command{width:340px;height:38px;display:flex;align-items:center;gap:9px;padding:0 11px;border:1px solid var(--pro-line);border-radius:9px;background:#0d1928;color:#8398b1}
.global-command b{flex:1;text-align:right;font-size:10px;font-weight:500}.global-command kbd{border:1px solid #31475f;border-radius:5px;background:#091321;padding:2px 6px;color:#7e91a7;font-size:8px}
.top-server-state{height:32px;display:flex;align-items:center;gap:6px;padding:0 9px;border:1px solid #205440;border-radius:8px;background:#0a211b;color:#6fe0b7;font-size:8px;font-weight:700}
.top-server-state i{width:6px;height:6px;border-radius:50%;background:var(--pro-green)}
.top-refresh{width:34px;height:34px;border:1px solid var(--pro-line);border-radius:9px;background:#0e1929;color:#93a8bf}
.top-user{display:flex;align-items:center;gap:8px;padding-right:7px}.top-user>span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#2859c8,#7443c4);font-weight:800}
.top-user b{display:block;font-size:10px}.top-user small{display:block;font-size:7px;color:#6e829b;margin-top:1px}
.mobile-menu-toggle{display:none}
.compat-page-meta{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.pro-content{max-width:1500px;margin:0 auto;padding:26px 28px 48px}

/* Common page system */
.pro-page,.sx-page{display:grid;gap:16px}
.pro-page-head,.sx-page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.pro-page-head h1,.sx-page-head h1{margin:2px 0 0;font-size:26px;font-weight:750;letter-spacing:-.2px}
.pro-page-head p,.sx-page-head p{margin:6px 0 0;color:var(--pro-muted);font-size:12px;line-height:1.7}
.pro-kicker{display:block;color:#6ca8ec;font-size:9px;font-weight:800;letter-spacing:1.2px}
.pro-head-actions,.sx-head-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.makia-pro-shell .primary,.makia-pro-shell .ghost,.makia-pro-shell .soft,.makia-pro-shell .danger{
  min-height:36px;padding:0 13px;border-radius:9px;font-size:10px;font-weight:600
}
.makia-pro-shell .primary{border:1px solid #3478e6;background:linear-gradient(135deg,#2876e8,#4154df);color:#fff;box-shadow:0 7px 20px rgba(37,99,235,.18)}
.makia-pro-shell .ghost,.makia-pro-shell .soft{border:1px solid var(--pro-line);background:#101d2f;color:#c1cfde}
.makia-pro-shell .danger{border:1px solid #743342;background:#2a1720;color:#ff9dac}
.makia-pro-shell .status-chip{display:inline-flex;align-items:center;min-height:24px;padding:0 7px;border-radius:6px;font-size:9px;border:1px solid #31445c;background:#111c2b;color:#aab9ca}
.makia-pro-shell .status-chip.ok{border-color:#275d4b;background:#0d2a20;color:#68ddb2}
.makia-pro-shell .status-chip.warn{border-color:#6d5526;background:#2b2517;color:#e8c46f}
.makia-pro-shell .status-chip.bad{border-color:#78404d;background:#311b23;color:#ff91a1}
.makia-pro-shell .muted{color:var(--pro-muted);font-size:11px}
.makia-pro-shell input,.makia-pro-shell select,.makia-pro-shell textarea{background:#0b1727!important;border:1px solid #2b405b!important;color:#edf4fc!important;border-radius:9px!important;outline:none}
.makia-pro-shell input:focus,.makia-pro-shell select:focus,.makia-pro-shell textarea:focus{border-color:#3a7fe0!important;box-shadow:0 0 0 3px rgba(59,130,246,.12)!important}

/* Dashboard: same real data, better scale/readability */
.makia-pro-shell .sx-actionbar{display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding:10px;border:1px solid var(--pro-line);border-radius:11px;background:var(--pro-surface)}
.makia-pro-shell .sx-actionbar button{min-height:34px;border:1px solid transparent;border-radius:8px;padding:0 10px;background:transparent;color:#a9b9ca;font-size:10px}
.makia-pro-shell .sx-actionbar button:hover{background:#16253a;border-color:#2b4669;color:#fff}.makia-pro-shell .sx-actionbar button.primary{background:#1d5fc8;border-color:#2b72da;color:#fff}.makia-pro-shell .sx-version{margin-right:auto;color:#657a92;font-size:9px}
.makia-pro-shell .sx-vitals{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.makia-pro-shell .sx-vital{min-height:150px;padding:16px;border:1px solid var(--pro-line);border-radius:11px;background:var(--pro-surface);box-shadow:var(--pro-shadow)}
.makia-pro-shell .sx-vital-head{display:flex;align-items:center;gap:8px;color:#9db0c5;font-size:11px}.makia-pro-shell .sx-vital-head span:first-child{font-size:17px;color:#7db3ef}
.makia-pro-shell .sx-vital-value{display:flex;align-items:baseline;gap:5px;margin-top:13px}.makia-pro-shell .sx-vital-value b{font-size:30px}.makia-pro-shell .sx-vital-value span{font-size:11px;color:#8397ad}
.makia-pro-shell .sx-vital-detail{margin-top:4px;color:#8296ad;font-size:10px}.makia-pro-shell .sx-meter{height:5px;margin-top:13px;background:#1b2b3f;border-radius:99px;overflow:hidden}.makia-pro-shell .sx-meter i{display:block;height:100%;background:linear-gradient(90deg,#38bdf8,#4f70ee);border-radius:99px}.makia-pro-shell .sx-vital-foot{display:flex;justify-content:space-between;margin-top:9px;color:#6f839a;font-size:9px}
.makia-pro-shell .sx-mid-grid{display:grid;grid-template-columns:1.6fr .85fr;gap:12px}.makia-pro-shell .sx-card{border:1px solid var(--pro-line);border-radius:11px;background:var(--pro-surface);padding:16px;box-shadow:var(--pro-shadow)}.makia-pro-shell .sx-card-head h3{font-size:13px}.makia-pro-shell .sx-card-head p{font-size:10px}.makia-pro-shell .sx-card .history-chart{height:220px}
.makia-pro-shell .sx-protocol-row{padding:11px 0}.makia-pro-shell .sx-protocol-row b{font-size:11px}.makia-pro-shell .sx-protocol-row span{font-size:9px}.makia-pro-shell .sx-protocol-row em{font-size:11px}
.makia-pro-shell .sx-system-strip{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--pro-line);border-radius:11px;background:var(--pro-surface);overflow:hidden}.makia-pro-shell .sx-system-cell{padding:14px 16px;border-left:1px solid var(--pro-line-soft)}.makia-pro-shell .sx-system-cell span{font-size:9px;color:#7f94aa}.makia-pro-shell .sx-system-cell b{font-size:12px;margin-top:4px;display:block}

/* Compact user directory */
.pro-stat-strip{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--pro-line);border-radius:11px;background:var(--pro-surface);overflow:hidden}
.pro-stat-strip>div{padding:13px 16px;border-left:1px solid var(--pro-line-soft)}.pro-stat-strip>div:last-child{border-left:0}.pro-stat-strip span{display:block;color:#7f93aa;font-size:9px}.pro-stat-strip b{display:block;font-size:20px;margin-top:3px}
.pro-directory{border:1px solid var(--pro-line);border-radius:11px;background:var(--pro-surface);overflow:hidden;box-shadow:var(--pro-shadow)}
.pro-directory-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-bottom:1px solid var(--pro-line-soft)}
.pro-directory-toolbar h3{margin:0;font-size:13px}.pro-directory-toolbar small{display:block;color:#6f839b;font-size:9px;margin-top:2px}
.pro-filter-tabs{display:flex;gap:4px;flex-wrap:wrap}.pro-filter-tabs button{min-height:31px;padding:0 9px;border:1px solid transparent;border-radius:7px;background:transparent;color:#869bb1;font-size:9px}.pro-filter-tabs button.active{background:#183a65;border-color:#2d65a6;color:#e5f0ff}
.pro-search-wrap{min-width:290px;height:36px;display:flex;align-items:center;gap:7px;padding:0 10px;border:1px solid var(--pro-line);border-radius:8px;background:#0b1727;color:#6f859f}.pro-search-wrap input{flex:1;border:0!important;background:transparent!important;box-shadow:none!important;padding:0!important;font-size:10px}
.pro-user-table-head,.pro-user-row{display:grid;grid-template-columns:minmax(220px,1.35fr) .65fr .65fr .9fr 44px;align-items:center;gap:12px}
.pro-user-table-head{padding:9px 14px;background:#0b1625;border-bottom:1px solid var(--pro-line-soft);color:#6d8299;font-size:9px}
.pro-user-row{padding:12px 14px;border-bottom:1px solid var(--pro-line-soft);transition:background .12s}.pro-user-row:last-child{border-bottom:0}.pro-user-row:hover{background:#111e30}
.pro-user-id{display:flex;align-items:center;gap:10px;min-width:0}.pro-user-avatar{width:36px;height:36px;flex:0 0 36px;border-radius:9px;display:grid;place-items:center;background:linear-gradient(135deg,#1b4f87,#4d3d91);border:1px solid #37628b;font-weight:800;font-size:12px}.pro-user-id b{display:block;font-size:12px}.pro-user-id small{display:block;color:#70869e;font-size:10px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:260px}
.pro-protocol-badge{display:inline-flex;align-items:center;min-height:24px;padding:0 7px;border:1px solid #31465f;border-radius:6px;background:#142034;color:#b6c4d4;font-size:8px;font-weight:700}.pro-protocol-badge.xray{border-color:#55408e;color:#c8b8ff}.pro-protocol-badge.ssh{border-color:#285f9c;color:#95c7ff}.pro-protocol-badge.wireguard{border-color:#7a3f49;color:#ffacb6}.pro-protocol-badge.openvpn{border-color:#79511e;color:#f8cd87}
.pro-user-usage b{display:block;font-size:11px}.pro-user-usage small{display:block;color:#72869e;font-size:9px;margin-top:2px}.pro-row-actions{text-align:left}.pro-more{width:32px;height:32px;border:1px solid #2c4058;border-radius:8px;background:#101c2c;color:#aab9ca;font-weight:800;letter-spacing:1px}.pro-more:hover{background:#18304d;color:#fff}
.pro-empty{font-size:11px}

/* Profile detail drawer */
.detail-backdrop{z-index:100!important;padding:0;background:rgba(2,7,14,.62);backdrop-filter:blur(7px);display:block}
.access-detail-drawer{position:absolute;top:0;left:0;bottom:0;width:min(470px,100vw);display:flex;flex-direction:column;background:#0b1524;border-right:1px solid #2a405b;box-shadow:30px 0 80px rgba(0,0,0,.42);animation:proDrawerIn .2s ease both}
.access-detail-drawer>header{display:flex;justify-content:space-between;gap:12px;padding:22px;border-bottom:1px solid var(--pro-line-soft)}.access-detail-drawer h3{margin:4px 0 2px;font-size:20px}.access-detail-drawer header p{margin:0;color:#7e93aa;font-size:10px}
.access-detail-body{padding:18px 20px;overflow:auto;display:grid;gap:14px}.access-detail-summary{display:grid;grid-template-columns:1fr 1fr;gap:8px}.access-detail-summary>div{padding:11px;border:1px solid var(--pro-line-soft);border-radius:9px;background:#0f1c2d}.access-detail-summary span{display:block;color:#758ba3;font-size:8px}.access-detail-summary b{display:block;margin-top:4px;font-size:10px;word-break:break-word}
.detail-section{padding:14px;border:1px solid var(--pro-line-soft);border-radius:10px;background:#0d1929}.detail-section-head h4{margin:0;font-size:12px}.detail-section-head p{margin:3px 0 0;color:#758aa1;font-size:9px}.detail-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}
.access-detail-drawer>footer{margin-top:auto;display:flex;justify-content:space-between;gap:8px;padding:14px 20px;border-top:1px solid var(--pro-line-soft);background:#0a1422}

/* Provisioning drawer */
.provision-backdrop{z-index:100!important;padding:0;display:block;background:rgba(2,7,14,.66);backdrop-filter:blur(8px)}
.provision-drawer{position:absolute;top:0;right:0;bottom:0;width:min(640px,100vw);display:flex;flex-direction:column;background:linear-gradient(180deg,#0c1727,#09121f);border-left:1px solid #2a415d;box-shadow:-30px 0 85px rgba(0,0,0,.45);animation:proDrawerInR .22s ease both}
.provision-header{padding:21px 22px 16px;display:flex;align-items:flex-start;justify-content:space-between;border-bottom:1px solid var(--pro-line-soft)}.provision-header h3{margin:4px 0 2px;font-size:21px}.provision-header p{margin:0;color:#7f93aa;font-size:10px}
.provision-progress{display:grid;grid-template-columns:repeat(4,1fr);padding:13px 18px;border-bottom:1px solid var(--pro-line-soft);background:#0a1422}
.provision-progress>div{display:flex;align-items:center;gap:7px;min-width:0;color:#62778f}.provision-progress i{width:25px;height:25px;flex:0 0 25px;border-radius:7px;display:grid;place-items:center;border:1px solid #2b4059;background:#0d1929;font-style:normal;font-size:8px}.provision-progress b{display:block;font-size:9px}.provision-progress small{display:block;font-size:7px;margin-top:1px}.provision-progress .active{color:#e7f1fc}.provision-progress .active i{border-color:#3a7dd7;background:#17365e;color:#fff}.provision-progress .done i{border-color:#2c715a;background:#0d2a21;color:#66ddb2}
.provision-scroll{flex:1;overflow:auto}.provision-drawer .wizard-body{min-height:0;padding:22px;background:transparent;border:0}.provision-drawer .wizard-footer{flex:0 0 auto;padding:14px 20px;border-top:1px solid var(--pro-line-soft);background:#0a1422;display:flex;gap:8px;justify-content:flex-end}
.provision-intro{margin-bottom:14px}.provision-intro h4,.wizard-section-title h4{margin:4px 0 5px;font-size:17px}.provision-intro p,.wizard-section-title p{margin:0;color:#7f93aa;font-size:10px;line-height:1.7}
.pro-protocol-picker{display:grid;grid-template-columns:1fr 1fr;gap:10px}.pro-protocol-card{min-height:112px;display:grid;grid-template-columns:46px 1fr;grid-template-rows:auto auto;gap:0 11px;padding:14px;border:1px solid #2a405a;border-radius:11px;background:#0e1a2b;color:#e9f1fa;text-align:right}.pro-protocol-card:hover{border-color:#3d72ad;background:#112239}.protocol-card-icon{grid-row:1/3;width:44px;height:44px;border-radius:10px;display:grid;place-items:center;background:#183556;border:1px solid #315c88;font-size:14px;font-weight:900}.protocol-card-icon.xray{background:#312659;border-color:#5a438f}.protocol-card-icon.wireguard{background:#4b2029;border-color:#7a4049}.protocol-card-icon.openvpn{background:#4c331a;border-color:#79531f}.pro-protocol-card>div b{display:block;font-size:12px}.pro-protocol-card>div small{display:block;color:#7f93aa;font-size:9px;margin-top:2px}.pro-protocol-card>div em{display:block;color:#64809d;font-style:normal;font-size:8px;margin-top:6px}.pro-protocol-card>i{grid-column:2;font-style:normal;font-size:8px;color:#64dcae}.pro-protocol-card.not-ready>i{color:#e6c069}
.provision-drawer .wizard-form{display:grid;gap:12px}.provision-drawer .wizard-form.two{grid-template-columns:1fr 1fr}.provision-drawer .wizard-form.one{grid-template-columns:1fr}.provision-drawer .wizard-form label,.provision-drawer .delivery-box label{font-size:10px;color:#9eafc2}.provision-drawer .wizard-form input,.provision-drawer .wizard-form select,.provision-drawer .delivery-box input{width:100%;margin-top:6px;padding:11px 12px;min-height:42px}.provision-drawer .wizard-form small{display:block;color:#6f839a;font-size:8px;margin-top:4px}
.pro-advanced{margin-top:14px;border:1px solid var(--pro-line-soft);border-radius:10px;background:#0d1929;overflow:hidden}.pro-advanced summary{list-style:none;display:flex;justify-content:space-between;gap:12px;padding:12px 14px;cursor:pointer}.pro-advanced summary::-webkit-details-marker{display:none}.pro-advanced summary span{font-size:10px;font-weight:700}.pro-advanced summary small{color:#6f849b;font-size:8px}.pro-advanced[open] summary{border-bottom:1px solid var(--pro-line-soft)}.pro-advanced>div{padding:14px}
.pro-info-card,.recommended-profile{margin-top:13px;padding:12px 13px;border:1px solid #2a4059;border-radius:10px;background:#0e1b2d}.pro-info-card b,.recommended-profile b{font-size:10px}.pro-info-card span,.pro-info-card small{display:block;color:#7890a9;font-size:9px;margin-top:3px}.recommended-profile{display:flex;align-items:center;justify-content:space-between;gap:10px}.recommended-profile>div>span{display:block;color:#748ba4;font-size:8px}.recommended-profile>div>b{display:block;margin-top:3px}.pro-advanced-open{margin-top:10px}
.pro-review-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pro-review-grid>div{padding:11px;border:1px solid var(--pro-line-soft);border-radius:9px;background:#0e1b2d}.pro-review-grid span{display:block;color:#7389a1;font-size:8px}.pro-review-grid b{display:block;margin-top:4px;font-size:10px;word-break:break-word}
.pro-delivery-box{display:grid;grid-template-columns:1fr 210px;gap:12px;align-items:end;margin-top:13px;padding:13px;border:1px solid #304763;border-radius:10px;background:#0f1c30}.pro-delivery-box b{display:block;font-size:11px}.pro-delivery-box span{display:block;color:#7b90a8;font-size:9px;margin-top:3px}
@keyframes proDrawerIn{from{transform:translateX(-18px);opacity:.75}to{transform:none;opacity:1}}@keyframes proDrawerInR{from{transform:translateX(18px);opacity:.75}to{transform:none;opacity:1}}

/* Existing protocol/server pages normalized */
.makia-pro-shell .panel,.makia-pro-shell .view-intro,.makia-pro-shell .account-hero,.makia-pro-shell .wg-workspace-hero,.makia-pro-shell .settings-card-v2,.makia-pro-shell .settings-nav,.makia-pro-shell .protocol-page-header{
  border:1px solid var(--pro-line)!important;border-radius:11px!important;background:var(--pro-surface)!important;box-shadow:none!important
}
.makia-pro-shell .protocol-page-header{padding:16px!important;margin-bottom:12px!important}.makia-pro-shell .protocol-page-title h2{font-size:20px}.makia-pro-shell .protocol-page-title p{font-size:10px;color:#8094aa}.makia-pro-shell .protocol-page-icon{width:42px;height:42px;border-radius:10px}
.makia-pro-shell .wg-workspace-metrics{grid-template-columns:repeat(4,1fr);gap:9px}.makia-pro-shell .wg-workspace-metrics>div{padding:12px;border:1px solid var(--pro-line);border-radius:9px;background:#0e1a2b}.makia-pro-shell .wg-workspace-metrics span{font-size:9px}.makia-pro-shell .wg-workspace-metrics b{font-size:19px}
.makia-pro-shell .row{font-size:10px}.makia-pro-shell .panel-head h3{font-size:13px}.makia-pro-shell .panel-head span{font-size:9px}.makia-pro-shell .settings-tabs-sx button{font-size:9px;min-height:34px}
.makia-pro-shell .access-profile{font-size:10px}

/* Connectivity lab */
.iran-boundary{display:flex;align-items:flex-start;gap:8px;padding:12px 14px;border:1px solid #6f5628;border-radius:10px;background:#2a2316;color:#dcbf7e;font-size:10px;line-height:1.7}.iran-boundary b{color:#ffd87f}
.connectivity-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.connectivity-card{padding:14px;border:1px solid var(--pro-line);border-radius:11px;background:var(--pro-surface)}.connectivity-title{display:flex;justify-content:space-between;gap:10px}.connectivity-title b{display:block;font-size:12px}.connectivity-title small{display:block;color:#748aa3;font-size:8px;margin-top:3px}.connectivity-meta{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:13px}.connectivity-meta>div{padding:9px;border:1px solid var(--pro-line-soft);border-radius:8px;background:#0c1726}.connectivity-meta span{display:block;color:#6f859d;font-size:8px}.connectivity-meta b{display:block;margin-top:3px;font-size:10px}.field-badge{display:block;margin-top:11px;padding-top:10px;border-top:1px solid var(--pro-line-soft);color:#d2b46f;font-size:8px}
.lab-port-head,.lab-port-row{display:grid;grid-template-columns:1.2fr .7fr .8fr .7fr;gap:10px;align-items:center}.lab-port-head{padding:8px 14px;border-bottom:1px solid var(--pro-line-soft);background:#0b1625;color:#71869e;font-size:8px}.lab-port-row{padding:10px 14px;border-bottom:1px solid var(--pro-line-soft);font-size:9px}.lab-port-row:last-child{border-bottom:0}.lab-port-row span{color:#8498ad}.ok-text{color:#61d8aa}.bad-text{color:#ff8797}
.field-test-card{display:grid;grid-template-columns:1.3fr 1fr;gap:18px;padding:16px;border:1px solid var(--pro-line);border-radius:11px;background:var(--pro-surface)}.field-test-card h3{margin:4px 0 6px;font-size:15px}.field-test-card p{margin:0;color:#8195ab;font-size:10px;line-height:1.75}.field-test-card ol{margin:0;padding-right:22px;color:#a9b8c8;font-size:10px;line-height:1.9}.lab-self-summary{display:flex;align-items:center;gap:9px;color:#7e93aa;font-size:9px}.lab-self-summary b{font-size:10px}.lab-self-summary small{margin-right:auto}

/* Responsive */
@media(max-width:1180px){
  .makia-pro-shell .sx-vitals,.connectivity-grid{grid-template-columns:repeat(2,1fr)}
  .makia-pro-shell .sx-mid-grid{grid-template-columns:1fr}
}
@media(max-width:900px){
  :root{--pro-sidebar:0px}
  .pro-sidebar{width:min(300px,86vw);transform:translateX(105%);transition:transform .2s ease;box-shadow:-25px 0 70px rgba(0,0,0,.45)}
  .makia-pro-shell.menu-open .pro-sidebar{transform:translateX(0)}
  .sidebar-mobile-close{display:block}
  .pro-main{margin-right:0}
  .mobile-menu-toggle{display:grid;place-items:center;width:35px;height:35px;border:1px solid var(--pro-line);border-radius:9px;background:#0f1c2c;color:#dbe7f4}
  .global-command{width:200px}.global-command kbd{display:none}
  .pro-content{padding:18px 14px 36px}
  .pro-page-head,.sx-page-head{flex-direction:column}.pro-head-actions,.sx-head-actions{width:100%}
  .pro-stat-strip{grid-template-columns:1fr 1fr}
  .pro-stat-strip>div:nth-child(2n){border-left:0}.pro-stat-strip>div{border-bottom:1px solid var(--pro-line-soft)}
  .pro-directory-toolbar{flex-direction:column;align-items:stretch}.pro-search-wrap{min-width:0;width:100%}
  .pro-user-table-head{display:none}.pro-user-row{grid-template-columns:1fr auto auto}.pro-user-row>div:nth-child(4){grid-column:1/3}.pro-user-row>div:nth-child(2),.pro-user-row>div:nth-child(3){justify-self:end}.pro-row-actions{grid-column:3;grid-row:1/3}
  .field-test-card{grid-template-columns:1fr}
  .provision-drawer{width:min(620px,100vw)}
}
@media(max-width:620px){
  .pro-topbar{padding:0 11px}.global-command{width:38px;padding:0;justify-content:center}.global-command b{display:none}.top-user div,.top-server-state{display:none}
  .pro-content{padding:14px 10px 28px}
  .pro-page-head h1,.sx-page-head h1{font-size:22px}
  .makia-pro-shell .sx-vitals,.connectivity-grid,.pro-stat-strip{grid-template-columns:1fr}
  .makia-pro-shell .sx-system-strip{grid-template-columns:1fr}.makia-pro-shell .sx-system-cell{border-left:0;border-bottom:1px solid var(--pro-line-soft)}
  .pro-filter-tabs{overflow:auto;flex-wrap:nowrap}.pro-filter-tabs button{white-space:nowrap}
  .pro-user-row{grid-template-columns:1fr auto}.pro-user-row>div:nth-child(4){grid-column:1/2}.pro-row-actions{grid-column:2;grid-row:1/4}
  .access-detail-drawer{width:100vw}.access-detail-summary{grid-template-columns:1fr}
  .provision-progress small{display:none}.provision-progress b{font-size:8px}.provision-progress{padding:10px}
  .provision-drawer .wizard-body{padding:17px}.pro-protocol-picker,.provision-drawer .wizard-form.two,.pro-review-grid,.pro-delivery-box{grid-template-columns:1fr}
  .lab-port-head,.lab-port-row{grid-template-columns:1fr 1fr}.lab-port-head span:nth-child(3),.lab-port-head span:nth-child(4){display:none}
}


/* v0.26 login hardening */
.login-v026{background:#09111d!important;color:#edf4fc!important;transition:background .18s,color .18s}
.login-v026[data-theme="light"]{background:#eef3f9!important;color:#172033!important}
.login-toolbar-v026{position:fixed;top:18px;left:18px;display:flex;gap:8px;z-index:10}
.login-toolbar-v026 button{min-width:40px;height:40px;padding:0 11px;border:1px solid #2b3d55;border-radius:10px;background:#111d2e;color:#dbe7f5;display:flex;align-items:center;justify-content:center;gap:6px}
.login-toolbar-v026 button:hover{border-color:#4f82c8;background:#17263a}
.login-toolbar-v026 .toolbar-icon{font-size:14px}.login-toolbar-v026 b{font-size:9px}
.login-card-v026{width:min(390px,calc(100vw - 32px));padding:30px 30px 24px!important;border-radius:16px!important;background:#111d2e!important;border:1px solid #29405f!important}
.login-v026[data-theme="light"] .login-card-v026{background:#fff!important;border-color:#c9d6e5!important;box-shadow:0 22px 60px rgba(26,45,74,.12)!important}
.login-v026[data-theme="light"] .sanaei-login-brand strong,.login-v026[data-theme="light"] .login-card-v026 h1{color:#172033}
.login-v026[data-theme="light"] .login-card-v026>p,.login-v026[data-theme="light"] .sanaei-login-form label>span{color:#5b6d84}
.login-field-v026{height:44px;margin-top:6px;display:flex;align-items:center;border:1px solid #30445f;border-radius:9px;background:#0b1624;overflow:hidden;transition:border .15s,box-shadow .15s}
.login-field-v026:focus-within{border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.14)}
.login-field-v026 .field-icon{width:40px;flex:none;text-align:center;color:#7f96af;font-size:12px}
.login-field-v026 input{height:42px!important;min-width:0!important;flex:1!important;margin:0!important;padding:0 8px!important;border:0!important;outline:0!important;background:transparent!important;color:#f5f8fc!important;box-shadow:none!important;border-radius:0!important}
.login-field-v026 input:focus,.login-field-v026 input:-webkit-autofill{border:0!important;outline:0!important;box-shadow:0 0 0 1000px #0b1624 inset!important;-webkit-text-fill-color:#f5f8fc!important}
.login-field-v026 button{width:42px;height:42px;flex:none;border:0;background:transparent;color:#7f96af}
.login-v026[data-theme="light"] .login-field-v026{background:#f5f8fc;border-color:#cbd8e7}
.login-v026[data-theme="light"] .login-field-v026 input{color:#1e293b!important}
.login-v026[data-theme="light"] .login-field-v026 input:focus,.login-v026[data-theme="light"] .login-field-v026 input:-webkit-autofill{box-shadow:0 0 0 1000px #f5f8fc inset!important;-webkit-text-fill-color:#1e293b!important}
.login-v026[data-theme="light"] .login-toolbar-v026 button{background:#fff;border-color:#cbd8e7;color:#334155}
.login-v026[data-theme="light"] .sanaei-login-foot{color:#728399;border-color:#dbe4ee}


/* v0.26 protocol branding / advanced centers */
.protocol-brand-logo{width:44px;height:44px;flex:0 0 44px;display:grid;place-items:center;border-radius:12px;font-weight:900;font-size:17px;color:#fff;border:1px solid #355579;box-shadow:0 8px 20px #0003}
.protocol-brand-logo.xray{background:linear-gradient(135deg,#5232a8,#7459d9);border-color:#6e57b6}
.protocol-brand-logo.wireguard{background:linear-gradient(135deg,#6f2132,#a63b51);border-color:#8d3949}
.protocol-brand-logo.openvpn{background:linear-gradient(135deg,#b7640c,#e38a1c);border-color:#c8791c}
.protocol-brand-logo.ssh{background:linear-gradient(135deg,#1f5fb7,#3888ef);border-color:#3f79be}
.vpn-config-modal{width:min(780px,96vw)}
.vpn-config-modal .wizard-head>div{display:flex;align-items:center;gap:11px}
.vpn-feature-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin:15px 0}
.vpn-feature-grid>div{padding:11px;border:1px solid var(--pro-line-soft);border-radius:9px;background:#0d1929}
.vpn-feature-grid b{display:block;font-size:10px}.vpn-feature-grid span{display:block;margin-top:3px;color:#7c91a8;font-size:9px;line-height:1.6}
.toggle-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:14px 0}
.toggle-grid label{display:flex;align-items:flex-start;gap:9px;padding:11px;border:1px solid var(--pro-line-soft);border-radius:9px;background:#0d1929}
.toggle-grid input{width:auto!important;margin-top:2px!important}.toggle-grid b{display:block;font-size:10px}.toggle-grid small{display:block;color:#7b90a7;font-size:8px;margin-top:2px}
.security-score{min-width:110px;padding:11px 14px;border:1px solid #6c5527;border-radius:10px;background:#2a2317;text-align:center}.security-score.ok{border-color:#28604c;background:#0f291f}.security-score b{display:block;font-size:20px}.security-score span{font-size:8px;color:#8ca0b7}
.security-modern-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.security-modern-grid article{position:relative;display:flex;align-items:center;gap:10px;padding:13px;border:1px solid var(--pro-line);border-radius:10px;background:var(--pro-surface)}
.security-icon{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;background:#14243a;color:#79aee9;font-weight:900}.security-modern-grid b{display:block;font-size:10px}.security-modern-grid span{display:block;color:#869ab0;font-size:8px}.security-modern-grid small{display:block;color:#647a92;font-size:7px;margin-top:3px}.security-modern-grid em{position:absolute;top:10px;left:10px;font-style:normal;font-size:7px}.security-modern-grid em.ok{color:#63d9aa}.security-modern-grid em.warn{color:#edc56f}
.security-actions-v026{display:flex;align-items:center;justify-content:space-between;gap:18px}.security-actions-v026 h3{margin:0;font-size:13px}.security-actions-v026 p{margin:4px 0 0;color:#7f93aa;font-size:9px}
.security-note{display:flex;gap:9px;padding:12px 14px;border:1px solid #3c4d63;border-radius:10px;background:#101c2c;font-size:9px}.security-note b{color:#cfe1f5}.security-note span{color:#869ab0}
.guide-visual-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.guide-visual-card{overflow:hidden;border:1px solid var(--pro-line);border-radius:12px;background:var(--pro-surface)}.guide-visual-card img{display:block;width:100%;aspect-ratio:720/420;object-fit:cover;border-bottom:1px solid var(--pro-line-soft)}.guide-visual-card>div{padding:14px}.guide-visual-card h3{margin:4px 0;font-size:14px}.guide-visual-card p{margin:0 0 12px;color:#8195ab;font-size:9px;line-height:1.7}
.guide-visual-step{display:block;width:100%;max-height:360px;object-fit:contain;border:1px solid #243952;border-radius:14px;background:#0b1625;margin:14px 0}
.support-quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.support-quick-grid button{display:flex;align-items:center;gap:10px;padding:13px;border:1px solid var(--pro-line);border-radius:10px;background:var(--pro-surface);color:#dce7f4;text-align:right}.support-quick-grid button>span{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#173250;color:#8fc4ff}.support-quick-grid b{display:block;font-size:10px}.support-quick-grid small{display:block;color:#778da5;font-size:8px;margin-top:2px}
.support-main-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:12px}.support-advanced{border:1px solid var(--pro-line);border-radius:10px;background:var(--pro-surface);overflow:hidden}.support-advanced summary{list-style:none;display:flex;justify-content:space-between;align-items:center;padding:13px 15px;cursor:pointer}.support-advanced summary::-webkit-details-marker{display:none}.support-advanced summary b{display:block;font-size:10px}.support-advanced summary span{display:block;color:#7389a1;font-size:8px;margin-top:2px}.support-advanced summary em{font-style:normal;color:#80a7d4;font-size:8px}.support-advanced-body{padding:15px;border-top:1px solid var(--pro-line-soft)}
@media(max-width:1100px){.security-modern-grid{grid-template-columns:repeat(2,1fr)}.support-quick-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.vpn-feature-grid,.toggle-grid,.guide-visual-grid,.support-main-grid{grid-template-columns:1fr}.security-modern-grid,.support-quick-grid{grid-template-columns:1fr}.security-actions-v026{align-items:flex-start;flex-direction:column}.guide-visual-step{margin:10px 0}}
