:root{
  --bg:#f5f7fb;--surface:#fff;--surface-2:#f8fafc;--text:#101828;--muted:#667085;
  --border:#e6eaf0;--primary:#3157d5;--primary-2:#2446b7;--nav:#0b1220;--nav-2:#111a2d;
  --success:#067647;--success-bg:#ecfdf3;--warning:#b54708;--warning-bg:#fffaeb;
  --danger:#b42318;--danger-bg:#fef3f2;--info:#175cd3;--info-bg:#eff8ff;
  --radius:14px;--shadow:0 10px 30px rgba(16,24,40,.06);--sidebar:270px;
}
*{box-sizing:border-box}
html{min-height:100%;background:var(--bg)}
body{margin:0;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--text);background:var(--bg);font-size:14px;-webkit-font-smoothing:antialiased}
a{color:var(--primary);text-decoration:none}a:hover{color:var(--primary-2)}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
code{font-family:"SFMono-Regular",Consolas,monospace;font-size:12px;background:#f2f4f7;border-radius:6px;padding:3px 6px;color:#344054}

.app-shell{display:flex;min-height:100vh}
.sidebar{position:fixed;z-index:60;top:0;bottom:0;left:0;width:var(--sidebar);height:100dvh;max-height:100dvh;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;background:linear-gradient(180deg,var(--nav),#0e1729);color:#d7deeb;display:flex;flex-direction:column;padding:18px 14px;border-right:1px solid rgba(255,255,255,.05)}
.brand{display:flex;align-items:center;gap:12px;padding:5px 8px 24px}
.brand-mark{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;font-size:20px;font-weight:800;background:linear-gradient(135deg,#5b7cff,#3157d5);color:#fff;box-shadow:0 8px 22px rgba(49,87,213,.35)}
.brand strong{display:block;color:#fff;font-size:16px;letter-spacing:.1px}.brand span{display:block;color:#8492aa;font-size:11px;margin-top:3px}
.sidebar-close{display:none;margin-left:auto;border:0;background:transparent;color:#aab5c7;font-size:26px}
.nav-section{display:flex;flex-direction:column;gap:4px;margin-bottom:18px}
.nav-label{font-size:10px;font-weight:700;letter-spacing:.12em;color:#65738c;padding:0 12px 8px}
.nav-item{display:flex;align-items:center;gap:11px;min-height:42px;padding:9px 11px;border-radius:10px;color:#aeb9cb;font-weight:550;transition:.18s ease}
.nav-item:hover{background:rgba(255,255,255,.06);color:#fff}
.nav-item.active{background:linear-gradient(90deg,rgba(70,104,255,.22),rgba(70,104,255,.08));color:#fff;box-shadow:inset 3px 0 #6f8cff}
.nav-icon{width:24px;height:24px;display:grid;place-items:center;border-radius:7px;color:#92a5c2;font-size:16px}.nav-item.active .nav-icon{color:#8fa6ff}
.sidebar-user{margin-top:auto;position:sticky;bottom:0;background:linear-gradient(180deg,rgba(14,23,41,.96),#0e1729);padding:14px 9px 5px;border-top:1px solid rgba(255,255,255,.07);display:flex;align-items:center;gap:10px}
.avatar{width:36px;height:36px;border-radius:11px;background:#e8edff;color:#3157d5;display:grid;place-items:center;font-weight:800}
.avatar.small{width:32px;height:32px;border-radius:10px}
.user-meta{min-width:0;flex:1}.user-meta b{display:block;color:#eef2f8;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-meta span{display:block;color:#71809a;font-size:11px;margin-top:2px}
.logout-icon{font-size:18px;color:#8492aa;padding:7px}.logout-icon:hover{color:#fff}
.app-main{min-width:0;flex:1;margin-left:var(--sidebar)}
.topbar{height:76px;position:sticky;top:0;z-index:35;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 30px}
.topbar-left{display:flex;align-items:center;gap:14px}.topbar h2{font-size:18px;margin:2px 0 0}.eyebrow{font-size:9px;letter-spacing:.15em;color:#98a2b3;font-weight:800}
.menu-toggle{display:none;width:40px;height:40px;border:1px solid var(--border);border-radius:11px;background:#fff;color:#344054;font-size:20px}
.topbar-actions{display:flex;align-items:center;gap:15px}
.quick-add{height:39px;padding:0 14px;border-radius:10px;background:var(--primary);color:#fff;display:flex;align-items:center;gap:7px;font-weight:700;box-shadow:0 5px 14px rgba(49,87,213,.2)}.quick-add:hover{background:var(--primary-2);color:#fff}.quick-add em{font-style:normal}
.top-user{display:flex;align-items:center;gap:8px;color:#475467;font-weight:600}
.wrap{max-width:1500px;margin:0 auto;padding:28px 30px 20px}
.pagehead{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:0 0 22px}.pagehead h1{font-size:25px;letter-spacing:-.03em;margin:0 0 6px}.pagehead p{margin:0;color:var(--muted);line-height:1.5}.pagehead>div:last-child{display:flex;gap:8px}
.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:21px;box-shadow:0 1px 2px rgba(16,24,40,.02);margin-top:18px}
.panel h2{font-size:16px;margin:0 0 16px;letter-spacing:-.01em}.panel h3{font-size:14px}
.panelhead{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}.panelhead h2{margin:0}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
.metric{background:linear-gradient(180deg,#fff,#fcfdff);border:1px solid var(--border);border-radius:14px;padding:18px;min-height:122px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.metric:after{content:"";position:absolute;width:78px;height:78px;border-radius:50%;background:#f0f3ff;right:-26px;top:-25px}
.metric b{display:block;color:#667085;font-size:12px;font-weight:700;position:relative;z-index:1}.metric strong{display:block;font-size:30px;letter-spacing:-.04em;margin-top:12px;position:relative;z-index:1}.metric span{display:block;margin-top:5px;font-size:11px;color:#98a2b3}
.dashboard-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.dashboard-cols{display:grid;grid-template-columns:1.6fr 1fr;gap:18px}
.summary-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin:18px 0}
.summary-cards section{background:#fff;border:1px solid var(--border);border-radius:13px;padding:17px;box-shadow:0 3px 12px rgba(16,24,40,.025)}.summary-cards span{display:block;color:#667085;font-size:11px;font-weight:700;margin-bottom:8px}.summary-cards strong{font-size:18px}
.btn,button{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:10px;padding:10px 14px;background:var(--primary);color:#fff;font-weight:700;line-height:1.1;min-height:39px}.btn:hover,button:hover{background:var(--primary-2);color:#fff}
.btn.secondary,.secondarybtn{background:#fff;color:#344054;border:1px solid #d8dee8}.btn.secondary:hover,.secondarybtn:hover{background:#f8fafc;color:#101828}.warnbtn{background:#b54708}.dangerbtn{background:#b42318}
.actions,.detail-actions{display:flex;gap:8px;flex-wrap:wrap}.detail-actions{margin:0 0 16px}.detail-actions form{margin:0}
.form{max-width:820px}.form label{display:block;margin:15px 0 7px;font-weight:650;color:#344054}.form small{display:block;margin-top:6px;color:#98a2b3;font-weight:400}
input,select,textarea{width:100%;border:1px solid #d8dee8;border-radius:10px;background:#fff;color:#101828;padding:11px 12px;outline:none;transition:border .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{border-color:#7690eb;box-shadow:0 0 0 3px rgba(49,87,213,.09)}textarea{min-height:115px;resize:vertical}.twocol{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.filterbar{display:grid;grid-template-columns:minmax(240px,1.7fr) minmax(155px,.7fr) minmax(145px,.7fr) auto auto;gap:9px;margin:16px 0}.filterbar input,.filterbar select{margin:0}.search{display:flex;gap:9px;max-width:560px}.search input{margin:0}
.tablewrap{width:100%;overflow:auto;border-radius:10px}.tablewrap::-webkit-scrollbar{height:8px}.tablewrap::-webkit-scrollbar-thumb{background:#d0d5dd;border-radius:99px}
table{width:100%;border-collapse:collapse;min-width:720px}th,td{text-align:left;padding:12px 10px;border-bottom:1px solid #edf0f5;vertical-align:middle}th{font-size:10px;letter-spacing:.045em;text-transform:uppercase;color:#98a2b3;font-weight:800;background:#fcfcfd}tr:last-child td{border-bottom:0}tbody tr:hover td{background:#fafbfc}
td small{display:block;color:#98a2b3;margin-top:4px}
.badge{display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;background:#f2f4f7;color:#475467;font-size:11px;font-weight:700;white-space:nowrap}.badge.ok{background:var(--success-bg);color:var(--success)}.badge.warn{background:var(--warning-bg);color:var(--warning)}.badge.danger{background:var(--danger-bg);color:var(--danger)}.badge.info{background:var(--info-bg);color:var(--info)}.badge.muted{background:#f2f4f7;color:#475467}
.details{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:12px;overflow:hidden}.details>div{background:#fff;padding:15px;min-height:76px}.details b{display:block;color:#98a2b3;font-size:10px;text-transform:uppercase;letter-spacing:.04em;margin-bottom:7px}
.success{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;background:var(--success-bg);border:1px solid #abefc6;border-radius:11px;margin-bottom:18px;color:var(--success);font-weight:650}.alert{background:var(--danger-bg);border:1px solid #fecdca;color:var(--danger);padding:11px 13px;border-radius:10px;margin:12px 0}
.runtime-alert{border-left:4px solid #f79009}.runtime-alert h2{margin-top:0}.runtime-alert p{margin:7px 0;color:#475467}
.runtime-tabs{display:flex;gap:7px;flex-wrap:wrap;margin:0 0 15px}.runtime-tabs a{padding:8px 11px;border-radius:9px;background:#fff;border:1px solid var(--border);color:#475467;font-size:12px;font-weight:700}.runtime-tabs a.active{background:#101828;color:#fff;border-color:#101828}
.stack{display:flex;flex-direction:column}.stackrow{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:1px solid #edf0f5;color:#101828}.stackrow:last-child{border-bottom:0}.stackrow span{display:flex;flex-direction:column;gap:3px}.stackrow small,.empty{color:#98a2b3}
.codebox{background:#0c1424;color:#d7e0ed;border-radius:12px;padding:16px;overflow:auto}.codebox pre{margin:0;white-space:pre;tab-size:4}.codebox code{background:none;color:inherit;padding:0}
.filecards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.filecards>div{border:1px solid var(--border);border-radius:12px;padding:15px;background:#fafbfc}.filecards p{margin:7px 0 0;color:#667085}
.notification-list{display:flex;flex-direction:column;gap:10px}.notification{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:14px;border:1px solid var(--border);border-radius:12px;background:#fff}.notification.warning{border-left:4px solid #f79009}.notification.danger{border-left:4px solid #d92d20}.notification.info{border-left:4px solid #2e90fa}.notification.read{opacity:.62}.notification p{margin:5px 0;color:#475467}.notification small{color:#98a2b3}
.inlineform{display:flex;gap:9px;align-items:end;flex-wrap:wrap}.inlineform select{width:auto;min-width:145px;margin:0}.renewbox{margin-bottom:15px}.renewbox h2{margin-top:0}
.settingsform h2{margin-top:27px;border-bottom:1px solid #edf0f5;padding-bottom:9px}
.app-footer{display:flex;justify-content:space-between;gap:12px;color:#98a2b3;font-size:11px;padding:25px 2px 5px;margin-top:20px;border-top:1px solid #eaecf0}
.nav-overlay{display:none;position:fixed;z-index:55;inset:0;background:rgba(10,18,32,.56);backdrop-filter:blur(2px)}
.nav-overlay.show{display:block}

/* Login */
.auth{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 10% 0,#1e2d55 0,#0b1220 38%,#080e19 100%);color:#fff}
.auth-card{width:min(440px,94vw);background:rgba(255,255,255,.98);color:#101828;padding:34px;border-radius:20px;box-shadow:0 30px 80px rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.6)}
.auth-brand{display:flex;align-items:center;gap:12px;margin-bottom:28px}.auth-brand .brand-mark{flex:0 0 auto}.auth-brand strong{font-size:17px}.auth-brand span{display:block;color:#98a2b3;font-size:11px;margin-top:3px}.auth-card h1{font-size:24px;margin:0 0 7px}.auth-card>p{color:#667085;margin:0 0 24px}.auth-card label{display:block;margin:14px 0 6px;color:#344054;font-weight:650}.auth-card button{width:100%;margin-top:18px;min-height:44px}.auth-foot{text-align:center;color:#98a2b3;font-size:11px;margin-top:20px}

@media(max-width:1180px){
  .dashboard-grid{grid-template-columns:repeat(2,1fr)}
  .dashboard-cols{grid-template-columns:1fr}
  .filterbar{grid-template-columns:1fr 1fr 1fr}
  .filterbar button,.filterbar .btn{width:100%}
  .summary-cards{grid-template-columns:1fr 1fr}
  .details{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  :root{--sidebar:270px}
  .sidebar{
    position:fixed;
    top:0;
    bottom:0;
    left:0;
    width:var(--sidebar);
    height:100dvh;
    max-height:100dvh;
    overflow-y:auto;
    overflow-x:hidden;
    transform:translate3d(-110%,0,0);
    visibility:hidden;
    pointer-events:none;
    box-shadow:none;
    transition:transform .22s ease,visibility 0s linear .22s;
  }
  .sidebar.open{
    transform:translate3d(0,0,0);
    visibility:visible;
    pointer-events:auto;
    box-shadow:20px 0 50px rgba(0,0,0,.26);
    transition:transform .22s ease,visibility 0s;
  }
  .sidebar-user{
    position:sticky;
    bottom:0;
    margin-top:auto;
    background:#0e1729;
    z-index:2;
  }
  .sidebar-close{display:block}
  .app-main{margin-left:0;width:100%;min-width:0}
  .menu-toggle{display:grid;place-items:center}
  .topbar{height:68px;padding:0 17px}
  .eyebrow{display:none}
  .topbar h2{font-size:16px}
  .wrap{padding:20px 16px}
  .top-user{display:none}
  body.nav-open{overflow:hidden;touch-action:none}
  .nav-overlay{display:none}
  .nav-overlay.show{display:block}
}
@media(max-width:650px){
  .quick-add{width:39px;padding:0;justify-content:center}.quick-add em{display:none}
  .pagehead{align-items:flex-start;flex-direction:column;margin-bottom:16px}.pagehead h1{font-size:22px}.pagehead .btn{width:100%}
  .dashboard-grid,.grid,.summary-cards,.twocol,.details,.filecards{grid-template-columns:1fr}
  .metric{min-height:104px;padding:16px}.metric strong{font-size:27px}
  .filterbar{grid-template-columns:1fr}
  .panel{padding:15px;border-radius:12px;margin-top:14px}
  .dashboard-cols{gap:0}
  .actions,.detail-actions{display:grid;grid-template-columns:1fr}.actions .btn,.detail-actions form,.detail-actions button{width:100%}
  .notification{align-items:flex-start;flex-direction:column}.notification form,.notification button{width:100%}
  .stackrow{align-items:flex-start;flex-direction:column;gap:6px}
  .inlineform{display:grid;grid-template-columns:1fr}.inlineform select,.inlineform button{width:100%}
  .app-footer{flex-direction:column;text-align:center}
  .auth-card{padding:26px 20px;border-radius:17px}
}

/* v1.1 Ultra Premium Dark-first Theme */
:root{--bg:#050508;--surface:rgba(12,13,18,.82);--surface-2:#14161F;--text:#F9FAFB;--muted:#9CA3AF;--border:rgba(255,255,255,.07);--primary:#6366F1;--primary-2:#818CF8;--nav:#08090d;--nav-2:#0C0D12;--success:#10B981;--success-bg:rgba(16,185,129,.12);--warning:#F59E0B;--warning-bg:rgba(245,158,11,.12);--danger:#EF4444;--danger-bg:rgba(239,68,68,.12);--info:#06B6D4;--info-bg:rgba(6,182,212,.12);--shadow:0 22px 70px rgba(0,0,0,.36)}
body{background:radial-gradient(900px 500px at 75% -10%,rgba(99,102,241,.11),transparent 55%),#050508;color:var(--text)}
.sidebar{background:rgba(8,9,13,.94);backdrop-filter:blur(22px);border-right:1px solid var(--border)}
.topbar{top:12px;margin:0 18px;height:64px;border:1px solid var(--border);border-radius:16px;background:rgba(12,13,18,.78);backdrop-filter:blur(22px);box-shadow:0 18px 50px rgba(0,0,0,.25)}
.panel,.metric,.summary-cards section,.notification,.runtime-tabs a,.filecards>div{background:linear-gradient(180deg,rgba(20,22,31,.78),rgba(12,13,18,.82));border-color:var(--border);box-shadow:var(--shadow);backdrop-filter:blur(18px)}
.metric:after{background:radial-gradient(circle,rgba(99,102,241,.20),transparent 70%)}
.metric b,.summary-cards span,.panel p,.runtime-alert p,.notification p,.stackrow small,.empty,.form small,td small{color:var(--muted)}
input,select,textarea,.btn.secondary,.secondarybtn,.menu-toggle{background:#0C0D12;color:var(--text);border-color:rgba(255,255,255,.1)}
input:focus,select:focus,textarea:focus{border-color:#6366F1;box-shadow:0 0 0 3px rgba(99,102,241,.14),0 0 24px rgba(99,102,241,.12)}
th{background:rgba(20,22,31,.92);color:#9CA3AF;position:sticky;top:0}th,td{border-bottom-color:rgba(255,255,255,.06)}tbody tr:hover td{background:rgba(255,255,255,.03)}
code{background:rgba(255,255,255,.055);color:#C7D2FE;font-variant-numeric:tabular-nums}.badge{background:rgba(255,255,255,.06);color:#D1D5DB}.badge.ok{background:rgba(16,185,129,.12);color:#34D399}.badge.warn{background:rgba(245,158,11,.12);color:#FBBF24}.badge.danger{background:rgba(239,68,68,.12);color:#F87171}.badge.info{background:rgba(6,182,212,.12);color:#22D3EE}
.details{background:rgba(255,255,255,.06);border-color:var(--border)}.details>div{background:#0C0D12}.stackrow{color:var(--text);border-bottom-color:rgba(255,255,255,.06)}
.quick-add,.btn,button{background:linear-gradient(135deg,#6366F1,#7C3AED);box-shadow:0 0 22px rgba(99,102,241,.22)}.quick-add:hover,.btn:hover,button:hover{background:linear-gradient(135deg,#818CF8,#8B5CF6)}
.nav-item.active{background:linear-gradient(90deg,rgba(99,102,241,.20),rgba(99,102,241,.05));box-shadow:inset 2px 0 #818CF8,0 0 20px -8px rgba(99,102,241,.45)}
.app-footer{border-top-color:var(--border)}.auth{background:radial-gradient(circle at 15% 15%,rgba(99,102,241,.18),transparent 35%),#050508}.auth-card{background:rgba(12,13,18,.86);color:var(--text);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(24px)}.auth-card>p,.auth-card label{color:var(--muted)}
*{scrollbar-color:#34364a #0C0D12}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#0C0D12}::-webkit-scrollbar-thumb{background:#34364a;border:2px solid #0C0D12;border-radius:999px}
.installation-filter{grid-template-columns:2fr 1fr auto auto}
.auth-split{display:grid;grid-template-columns:minmax(0,3fr) minmax(390px,2fr);padding:0;background:#050508;min-height:100vh}
.auth-visual{position:relative;overflow:hidden;min-height:100vh;border-right:1px solid rgba(255,255,255,.07);background:radial-gradient(circle at 35% 35%,rgba(99,102,241,.15),transparent 28%),radial-gradient(circle at 70% 70%,rgba(6,182,212,.09),transparent 25%),#050508}
.auth-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to bottom,black,transparent 92%)}
.auth-glow{position:absolute;width:520px;height:520px;border-radius:50%;filter:blur(80px);background:rgba(99,102,241,.08);left:20%;top:18%}
.auth-visual-content{position:relative;z-index:2;max-width:760px;margin:auto;padding:9vh 7vw}.auth-visual-brand{padding:0 0 8vh}.auth-kicker{font-size:10px;letter-spacing:.16em;font-weight:800;color:#A5B4FC;display:flex;align-items:center;gap:8px}.pulse-dot{width:7px;height:7px;border-radius:50%;background:#10B981;box-shadow:0 0 0 5px rgba(16,185,129,.10),0 0 18px rgba(16,185,129,.65)}
.auth-visual h2{font-size:clamp(38px,4.5vw,68px);line-height:1.02;letter-spacing:-.055em;margin:22px 0 20px}.auth-visual-content>p{max-width:650px;color:#9CA3AF;font-size:16px;line-height:1.75}
.network-card{height:270px;margin:42px 0 28px;border:1px solid rgba(255,255,255,.08);border-radius:24px;background:linear-gradient(180deg,rgba(20,22,31,.66),rgba(12,13,18,.4));backdrop-filter:blur(18px);position:relative;box-shadow:0 30px 80px rgba(0,0,0,.32),inset 0 1px rgba(255,255,255,.04)}
.node{position:absolute;padding:9px 12px;border-radius:10px;background:#0C0D12;border:1px solid rgba(255,255,255,.1);font:700 10px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.08em;color:#DDE2FF;box-shadow:0 0 24px rgba(99,102,241,.14)}.node-a{left:43%;top:42%;border-color:rgba(99,102,241,.65);box-shadow:0 0 28px rgba(99,102,241,.28)}.node-b{left:14%;top:24%}.node-c{right:13%;top:20%}.node-d{left:18%;bottom:20%}.node-e{right:16%;bottom:19%}
.network-card:before,.network-card:after{content:"";position:absolute;height:1px;background:linear-gradient(90deg,transparent,#6366F1,transparent);transform-origin:left center;opacity:.45}.network-card:before{width:58%;left:22%;top:50%;transform:rotate(-18deg)}.network-card:after{width:58%;left:22%;top:47%;transform:rotate(18deg)}
.auth-mini-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.auth-mini-metrics div{padding:14px;border-radius:14px;background:rgba(12,13,18,.68);border:1px solid rgba(255,255,255,.06)}.auth-mini-metrics span{display:block;color:#6B7280;font-size:10px}.auth-mini-metrics b{display:block;margin-top:7px;font-size:12px;color:#E5E7EB}
.auth-form-side{display:grid;place-items:center;padding:40px;background:radial-gradient(circle at 100% 0,rgba(99,102,241,.08),transparent 35%)}.auth-split .auth-card{width:min(440px,100%);box-shadow:none;border:0;background:transparent;padding:0;backdrop-filter:none}.mobile-auth-brand{display:none}.auth-split .auth-card h1{font-size:34px;letter-spacing:-.04em;margin-top:14px}.auth-split .auth-card label{display:grid;gap:8px}.auth-split .auth-card button{min-height:48px}.auth-split .auth-foot{border-top:1px solid rgba(255,255,255,.06);padding-top:20px}
@media(max-width:900px){.auth-split{grid-template-columns:1fr}.auth-visual{display:none}.auth-form-side{min-height:100vh;padding:28px}.mobile-auth-brand{display:flex}.installation-filter{grid-template-columns:1fr 1fr}}
@media(max-width:650px){.installation-filter{grid-template-columns:1fr}}


/* RC6 - Güvenli bakım ekranı */
.bakim-sayfasi{margin:0;min-height:100vh;display:grid;place-items:center;background:#050508;color:#F9FAFB;font-family:Inter,Arial,sans-serif;padding:24px}
.bakim-karti{width:min(680px,100%);padding:32px;border:1px solid rgba(255,255,255,.07);border-radius:22px;background:#0C0D12;box-shadow:0 24px 80px rgba(0,0,0,.38);text-align:center}
.bakim-karti h1{margin:0 0 14px;font-size:clamp(24px,4vw,38px);letter-spacing:-.03em}
.bakim-karti p{margin:0;color:#9CA3AF;line-height:1.75}

/* v1.2 operasyon/güvenlik eklentileri */
.panel code{font-variant-numeric:tabular-nums}.summary-cards strong{font-variant-numeric:tabular-nums}.notification.success{border-color:rgba(16,185,129,.25)}


/* ==========================================================================
   SevenSoft v1.2.3 — TEMA HOTFIX1
   Amaç: Karanlık paneli daha canlı, ferah, yüksek okunabilirlikli kurumsal
   arayüze dönüştürmek. Yapısal HTML/PHP/JS davranışına dokunmaz.
   ========================================================================== */

:root{
  --bg:#f3f7fb;
  --surface:#ffffff;
  --surface-2:#f8fbff;
  --text:#172033;
  --muted:#64748b;
  --border:#dfe7f1;

  --primary:#4257d6;
  --primary-2:#3348bd;

  --nav:#183153;
  --nav-2:#214265;

  --success:#087f5b;
  --success-bg:#e9fbf3;
  --warning:#b66a08;
  --warning-bg:#fff7df;
  --danger:#c13d4d;
  --danger-bg:#fff0f2;
  --info:#1478a8;
  --info-bg:#eaf7fd;

  --radius:16px;
  --shadow:0 12px 32px rgba(44,62,92,.08);
}

/* Genel zemin ve tipografi */
html{background:var(--bg)}
body{
  color:var(--text);
  background:
    linear-gradient(135deg,rgba(66,87,214,.035),transparent 38%),
    linear-gradient(315deg,rgba(16,160,130,.035),transparent 36%),
    var(--bg);
}
a{color:#4159cf}
a:hover{color:#253ba7}
code{
  background:#eef3f8;
  color:#314158;
  border:1px solid #e0e8f1;
}

/* Sol menü — koyu ama siyah değil, daha sıcak ve okunaklı */
.sidebar{
  background:#183153;
  border-right:1px solid rgba(255,255,255,.10);
  box-shadow:10px 0 34px rgba(32,52,79,.10);
}
.brand-mark{
  background:#536ce8;
  box-shadow:0 8px 22px rgba(83,108,232,.28);
}
.brand strong{color:#fff}
.brand span{color:#b9c9dc}
.nav-label{color:#8fa8c3}
.nav-item{color:#d3deeb}
.nav-item:hover{
  background:rgba(255,255,255,.095);
  color:#fff;
}
.nav-item.active{
  background:#294b72;
  color:#fff;
  box-shadow:inset 3px 0 #8ed8c2;
}
.nav-icon{color:#afc2d7}
.nav-item.active .nav-icon{color:#b9f0df}
.sidebar-user{
  background:#183153;
  border-top:1px solid rgba(255,255,255,.11);
}
.user-meta b{color:#fff}
.user-meta span{color:#a8bdd3}
.logout-icon{color:#b5c7da}
.logout-icon:hover{color:#fff}
.avatar{
  background:#edf2ff;
  color:#3f53c7;
}

/* Üst bar */
.topbar{
  top:10px;
  margin:0 18px;
  height:66px;
  border:1px solid #dfe7f1;
  border-radius:16px;
  background:rgba(255,255,255,.94);
  box-shadow:0 10px 30px rgba(42,62,88,.07);
  backdrop-filter:blur(14px);
}
.topbar h2,.top-user{color:var(--text)}
.eyebrow{color:#72839a}
.menu-toggle{
  background:#fff;
  color:#334155;
  border-color:#dbe4ee;
}

/* İçerik */
.wrap{padding-top:30px}
.pagehead h1{color:#172033}
.pagehead p{color:#6c7a90}

.panel,
.metric,
.summary-cards section,
.notification,
.filecards>div{
  background:#fff;
  border-color:#dfe7f1;
  box-shadow:var(--shadow);
  backdrop-filter:none;
}
.panel{
  border-radius:16px;
}
.panel h2,.panel h3{color:#1e293b}
.panel p,
.runtime-alert p,
.notification p,
.stackrow small,
.empty,
.form small,
td small{
  color:#6b7a90;
}

/* Dashboard metrikleri — renkli ama sakin */
.metric{
  background:#fff;
  border:1px solid #dfe7f1;
  min-height:122px;
  position:relative;
}
.metric:before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:4px;
  background:#536ce8;
}
.metric:nth-child(2):before{background:#20a486}
.metric:nth-child(3):before{background:#e9a23b}
.metric:nth-child(4):before{background:#db6d91}
.metric:nth-child(5):before{background:#6e63c9}
.metric:nth-child(6):before{background:#4fa1c8}
.metric:nth-child(7):before{background:#df7b54}
.metric:nth-child(8):before{background:#7cab62}
.metric:after{
  width:86px;height:86px;
  right:-34px;top:-34px;
  background:rgba(83,108,232,.07);
}
.metric:nth-child(2):after{background:rgba(32,164,134,.07)}
.metric:nth-child(3):after{background:rgba(233,162,59,.08)}
.metric:nth-child(4):after{background:rgba(219,109,145,.07)}
.metric b{color:#607089}
.metric strong{color:#172033}
.metric span{color:#8290a4}

/* Butonlar */
.quick-add,.btn,button{
  background:#536ce8;
  color:#fff;
  box-shadow:0 7px 18px rgba(83,108,232,.18);
}
.quick-add:hover,.btn:hover,button:hover{
  background:#4058cf;
  color:#fff;
}
.btn.secondary,.secondarybtn{
  background:#fff;
  color:#34445d;
  border:1px solid #d5e0ec;
  box-shadow:none;
}
.btn.secondary:hover,.secondarybtn:hover{
  background:#f3f7fb;
  color:#1d2a3d;
}
.warnbtn{background:#d18a27}
.warnbtn:hover{background:#b87116}
.dangerbtn{background:#d25462}
.dangerbtn:hover{background:#b93d4d}

/* Formlar */
.form label{color:#34445d}
input,select,textarea{
  background:#fff;
  color:#172033;
  border-color:#ccd9e7;
  box-shadow:inset 0 1px 2px rgba(25,42,66,.025);
}
input::placeholder,textarea::placeholder{color:#9aa9ba}
input:focus,select:focus,textarea:focus{
  border-color:#6178df;
  box-shadow:0 0 0 3px rgba(83,108,232,.11);
}

/* Tablo */
.tablewrap{
  border:1px solid #e1e8f0;
  background:#fff;
}
th{
  background:#f5f8fc;
  color:#65758b;
  position:sticky;
  top:0;
}
th,td{border-bottom-color:#e8eef5}
td{color:#28364a}
tbody tr:hover td{background:#f8fbfe}
.tablewrap::-webkit-scrollbar-thumb{background:#c6d2df}

/* Rozetler */
.badge{
  background:#eef2f6;
  color:#526176;
}
.badge.ok{background:#e5f8f0;color:#08795a}
.badge.warn{background:#fff4d8;color:#a85e06}
.badge.danger{background:#ffeaed;color:#b23445}
.badge.info{background:#e4f4fb;color:#14759e}
.badge.muted{background:#eef2f6;color:#5f6e81}

/* Detay / liste */
.details{
  background:#dfe7f1;
  border-color:#dfe7f1;
}
.details>div{background:#fff}
.details b{color:#75859a}
.stackrow{
  color:#243247;
  border-bottom-color:#e6edf4;
}

/* Bildirimler */
.success{
  background:#e8f9f1;
  border-color:#b8ead5;
  color:#08795a;
}
.alert{
  background:#fff0f2;
  border-color:#f4c5cb;
  color:#b93e4d;
}
.runtime-alert{
  border-left-color:#e5a53f;
  background:#fffdf8;
}
.runtime-tabs a{
  background:#fff;
  border-color:#dce5ef;
  color:#536176;
}
.runtime-tabs a:hover{background:#f5f8fc;color:#26374f}
.runtime-tabs a.active{
  background:#294b72;
  color:#fff;
  border-color:#294b72;
}

/* Footer */
.app-footer{
  color:#78879a;
  border-top-color:#dfe7f1;
}

/* Giriş ekranı — yapay zekâ neon görünümü yerine ferah kurumsal kimlik */
.auth,
.auth-split{
  background:#eef4f9;
}
.auth-visual{
  border-right:1px solid #dce5ef;
  background:#234465;
}
.auth-grid{
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
}
.auth-glow{
  background:rgba(142,216,194,.12);
  filter:blur(90px);
}
.auth-kicker{color:#b9f0df}
.pulse-dot{
  background:#6fe0b9;
  box-shadow:0 0 0 5px rgba(111,224,185,.10);
}
.auth-visual h2{color:#fff}
.auth-visual-content>p{color:#c4d3e1}
.network-card{
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.13);
  box-shadow:none;
}
.node{
  background:#315779;
  border-color:rgba(255,255,255,.16);
  color:#edf7ff;
  box-shadow:none;
}
.node-a{
  border-color:#8ed8c2;
  box-shadow:none;
}
.network-card:before,.network-card:after{
  background:linear-gradient(90deg,transparent,#8ed8c2,transparent);
}
.auth-mini-metrics div{
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.11);
}
.auth-mini-metrics span{color:#9fb6cb}
.auth-mini-metrics b{color:#fff}
.auth-form-side{
  background:#f7fafc;
}
.auth-split .auth-card{
  color:#172033;
}
.auth-split .auth-card h1{color:#172033}
.auth-card>p,.auth-card label{color:#66778d}
.auth-split .auth-foot{
  border-top-color:#dfe7f1;
}

/* Bakım ekranı */
.bakim-sayfasi{
  background:#eef4f9;
  color:#172033;
}
.bakim-karti{
  background:#fff;
  border:1px solid #dfe7f1;
  box-shadow:0 24px 70px rgba(44,62,92,.10);
}
.bakim-karti p{color:#66778d}

/* Scrollbar */
*{scrollbar-color:#b9c7d7 #edf2f7}
::-webkit-scrollbar-track{background:#edf2f7}
::-webkit-scrollbar-thumb{
  background:#b9c7d7;
  border:2px solid #edf2f7;
}

/* Mobil */
@media(max-width:900px){
  .sidebar{
    background:#183153;
    box-shadow:18px 0 45px rgba(22,43,70,.22);
  }
  .sidebar-user{background:#183153}
  .topbar{
    top:0;
    margin:0;
    border-radius:0;
    border-top:0;
    border-left:0;
    border-right:0;
  }
}