:root{--bg0: #0b0f14;--bg1: #121820;--bg2: #1a222d;--line: rgba(210, 220, 230, .1);--text: #e8eef4;--muted: #8b9aab;--accent: #7ec8e3;--accent-2: #c9b896;--ok: #6bcf8e;--warn: #e0b35a;--bad: #e07a7a;--radius: 14px;--font: "Outfit", system-ui, sans-serif;--display: "Syne", "Outfit", sans-serif;--sidebar-w: 240px;--topbar-h: 0px;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px);--touch: 44px}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}html,body,#root{min-height:100%}body{margin:0;font-family:var(--font);color:var(--text);background:radial-gradient(1200px 600px at 10% -10%,rgba(126,200,227,.14),transparent 55%),radial-gradient(900px 500px at 90% 0%,rgba(201,184,150,.1),transparent 50%),linear-gradient(165deg,#080b10,#0f141c 45%,#0b1016);background-attachment:fixed}button,input,select,textarea{font:inherit;color:inherit}input,select,textarea{font-size:16px}a{color:inherit;text-decoration:none}.app-shell{display:grid;grid-template-columns:var(--sidebar-w) 1fr;min-height:100vh;min-height:100dvh}.topbar,.nav-backdrop,.nav-close{display:none}.sidebar{border-right:1px solid var(--line);background:#0a0e14b8;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);padding:1.5rem 1rem;padding-bottom:calc(1.5rem + var(--safe-bottom));display:flex;flex-direction:column;gap:1.5rem;position:sticky;top:0;height:100vh;height:100dvh;overflow-y:auto;overscroll-behavior:contain}.sidebar-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.sidebar-foot{margin-top:auto;padding-top:1rem}.brand{font-family:var(--display);font-weight:800;font-size:1.55rem;letter-spacing:-.03em;padding:0 .5rem;background:linear-gradient(120deg,#f2f6fa 20%,var(--accent) 70%,var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}.nav{display:flex;flex-direction:column;gap:.35rem}.nav a{display:flex;align-items:center;min-height:var(--touch);padding:.7rem .85rem;border-radius:10px;color:var(--muted);transition:background .2s ease,color .2s ease,transform .2s ease}.nav a:hover{color:var(--text);background:#ffffff0a}.nav a.active{color:var(--text);background:linear-gradient(90deg,#7ec8e329,#7ec8e30a)}.main{padding:1.75rem 2rem 3rem;padding-left:calc(2rem + var(--safe-left));padding-right:calc(2rem + var(--safe-right));padding-bottom:calc(3rem + var(--safe-bottom));min-width:0}.page-head{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap}.page-head h1{margin:0;font-family:var(--display);font-size:clamp(1.45rem,4vw,1.85rem);letter-spacing:-.03em}.page-head p{margin:.35rem 0 0;color:var(--muted)}.page-head>.btn,.page-head>.form-actions{flex-shrink:0}.grid{display:grid;gap:1rem}.grid-split{grid-template-columns:1.2fr .8fr;align-items:start}.grid-split-wide{grid-template-columns:1.3fr .7fr;align-items:start}.grid-split-even{grid-template-columns:1fr 1fr;align-items:start}.grid-servers{grid-template-columns:1.1fr 1fr;align-items:start}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-config{grid-template-columns:1fr 180px;align-items:start}.stats{grid-template-columns:repeat(4,minmax(0,1fr))}.stat{padding:1.1rem 1.2rem;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(180deg,#ffffff08,#ffffff03);animation:rise .45s ease both}.stat:nth-child(2){animation-delay:.05s}.stat:nth-child(3){animation-delay:.1s}.stat:nth-child(4){animation-delay:.15s}.stat .label{color:var(--muted);font-size:.9rem}.stat .value{margin-top:.35rem;font-family:var(--display);font-size:clamp(1.4rem,5vw,1.8rem);letter-spacing:-.03em}.panel{border:1px solid var(--line);border-radius:var(--radius);background:#121820a6;overflow:hidden;min-width:0}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:1rem 1.2rem;border-bottom:1px solid var(--line);flex-wrap:wrap}.panel-head h2{margin:0;font-size:1.05rem;font-weight:600}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:.85rem 1.1rem;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}.table th{color:var(--muted);font-weight:500;font-size:.85rem;white-space:nowrap}.table tr:last-child td{border-bottom:0}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--line);background:#ffffff0a;color:var(--text);border-radius:10px;padding:.55rem .9rem;min-height:var(--touch);cursor:pointer;transition:transform .15s ease,background .2s ease,border-color .2s ease;display:inline-flex;align-items:center;justify-content:center;gap:.35rem;text-align:center}.btn:hover{background:#ffffff14;transform:translateY(-1px)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-primary{border-color:#7ec8e359;background:linear-gradient(135deg,#7ec8e347,#7ec8e31a)}.btn-danger{border-color:#e07a7a59;color:#f0b4b4}.btn-block{width:100%}.badge{display:inline-flex;align-items:center;gap:.35rem;padding:.2rem .55rem;border-radius:999px;font-size:.78rem;border:1px solid var(--line);color:var(--muted)}.badge:before{content:"";width:.45rem;height:.45rem;border-radius:50%;background:currentColor}.badge.online{color:var(--ok);border-color:#6bcf8e4d}.badge.offline{color:var(--bad);border-color:#e07a7a4d}.badge.error,.badge.unknown{color:var(--warn);border-color:#e0b35a4d}.form{display:grid;gap:.85rem;padding:1.2rem}.form-row{display:grid;gap:.35rem}.form-row label{color:var(--muted);font-size:.88rem}.form-row input,.form-row textarea,.form-row select{width:100%;max-width:100%;border-radius:10px;border:1px solid var(--line);background:#00000040;padding:.7rem .85rem;min-height:var(--touch);outline:none}.form-row textarea{min-height:5.5rem;resize:vertical}.form-row input:focus,.form-row textarea:focus,.form-row select:focus{border-color:#7ec8e373}.form-actions{display:flex;gap:.6rem;flex-wrap:wrap}.login-page{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:max(1.5rem,var(--safe-top)) max(1.5rem,var(--safe-right)) max(1.5rem,var(--safe-bottom)) max(1.5rem,var(--safe-left))}.login-card{width:min(420px,100%);border:1px solid var(--line);border-radius:18px;background:#0e121acc;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);padding:2rem 1.6rem;animation:rise .5s ease both}.login-card .brand{font-size:2rem;margin-bottom:.35rem}.login-remember{margin:.15rem 0 .35rem;-webkit-user-select:none;user-select:none}.login-card .sub{color:var(--muted);margin:0 0 1.4rem}.muted{color:var(--muted)}.error{color:#f0b4b4;font-size:.9rem}.chips{display:flex;flex-wrap:wrap;gap:.35rem}.chip{font-size:.78rem;padding:.2rem .5rem;border-radius:8px;border:1px solid var(--line);background:#ffffff08}.chip.on{border-color:#6bcf8e59;color:var(--ok)}.filters{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:1rem}.filters input,.filters select{border-radius:10px;border:1px solid var(--line);background:#00000040;padding:.65rem .8rem;min-height:var(--touch);min-width:160px;font-size:16px}.filters input{flex:1;min-width:min(100%,200px)}.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;max-width:100%}.table-wrap::-webkit-scrollbar{height:8px}.table-wrap::-webkit-scrollbar-thumb{background:#ffffff1f;border-radius:999px}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#04080cb8;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:grid;place-items:end center;padding:0;z-index:50;animation:rise .2s ease both}@media(min-width:641px){.modal-backdrop{place-items:center;padding:1rem}}.modal{width:min(520px,100%);max-height:min(92vh,900px);max-height:min(92dvh,900px);overflow:auto;overscroll-behavior:contain;border:1px solid var(--line);border-radius:16px;background:#121820;box-shadow:0 24px 60px #00000073}.check-row{display:flex;align-items:center;gap:.55rem;color:var(--muted);min-height:var(--touch)}.check-row input{width:1.15rem;height:1.15rem;flex-shrink:0}.badge.expiry-active{color:var(--ok);border-color:#6bcf8e4d}.badge.expiry-expiring{color:var(--warn);border-color:#e0b35a4d}.badge.expiry-expired,.badge.expiry-disabled{color:var(--bad);border-color:#e07a7a4d}.badge.expiry-none{color:var(--muted)}a.btn{display:inline-flex;align-items:center}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@media(max-width:960px){:root{--topbar-h: 56px}.app-shell{grid-template-columns:1fr;grid-template-rows:var(--topbar-h) 1fr}.topbar{display:grid;grid-template-columns:var(--touch) 1fr auto;align-items:center;gap:.5rem;position:sticky;top:0;z-index:40;height:calc(var(--topbar-h) + var(--safe-top));padding:var(--safe-top) max(.75rem,var(--safe-right)) 0 max(.75rem,var(--safe-left));border-bottom:1px solid var(--line);background:#0a0e14eb;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.topbar-brand{font-family:var(--display);font-weight:800;font-size:1.05rem;letter-spacing:-.02em;background:linear-gradient(120deg,#f2f6fa 20%,var(--accent) 70%);-webkit-background-clip:text;background-clip:text;color:transparent}.topbar-title{justify-self:end;color:var(--muted);font-size:.88rem;max-width:42vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav-toggle{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:var(--touch);height:var(--touch);border:1px solid var(--line);border-radius:10px;background:#ffffff0a;display:grid;place-items:center;cursor:pointer;padding:0}.nav-toggle-bars,.nav-toggle-bars:before,.nav-toggle-bars:after{display:block;width:18px;height:2px;background:var(--text);border-radius:2px;transition:transform .2s ease,opacity .2s ease}.nav-toggle-bars{position:relative}.nav-toggle-bars:before,.nav-toggle-bars:after{content:"";position:absolute;left:0}.nav-toggle-bars:before{top:-6px}.nav-toggle-bars:after{top:6px}.nav-open .nav-toggle-bars{background:transparent}.nav-open .nav-toggle-bars:before{top:0;transform:rotate(45deg)}.nav-open .nav-toggle-bars:after{top:0;transform:rotate(-45deg)}.nav-backdrop{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:45;background:#04080c8c;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .2s ease}.nav-open .nav-backdrop{opacity:1;pointer-events:auto}.nav-close{display:inline-flex}.sidebar{position:fixed;top:0;left:0;z-index:46;width:min(300px,86vw);height:100vh;height:100dvh;border-right:1px solid var(--line);border-bottom:0;padding-top:calc(1rem + var(--safe-top));padding-left:calc(1rem + var(--safe-left));transform:translate(-105%);transition:transform .25s ease;box-shadow:16px 0 40px #00000059}.nav-open .sidebar{transform:translate(0)}.main{padding:1rem 1rem 2rem;padding-left:calc(1rem + var(--safe-left));padding-right:calc(1rem + var(--safe-right));padding-bottom:calc(2rem + var(--safe-bottom))}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-split,.grid-split-wide,.grid-split-even,.grid-servers,.grid-3,.grid-config{grid-template-columns:1fr}.page-head{align-items:stretch}.page-head>.btn{width:100%}}@media(max-width:640px){.stats{grid-template-columns:1fr 1fr}.stat{padding:.9rem 1rem}.filters{flex-direction:column}.filters input,.filters select{width:100%;min-width:0}.table th,.table td{padding:.7rem .85rem;font-size:.92rem}.form{padding:1rem}.form-actions .btn{flex:1 1 calc(50% - .4rem)}.modal{width:100%;max-height:min(94dvh,100%);border-radius:16px 16px 0 0;border-bottom:0;padding-bottom:var(--safe-bottom)}.modal .panel-head{position:sticky;top:0;z-index:1;background:#121820}.login-card{padding:1.5rem 1.15rem}.table .form-actions{flex-direction:column;align-items:stretch}.table .form-actions .btn{width:100%}}@media(max-width:420px){.stats{grid-template-columns:1fr}.topbar-title{display:none}}@media(hover:none){.btn:hover,.nav a:hover{transform:none}}