:root{
--bg:#070d18;--panel:#111923;--panel2:#1b2531;--panel3:#202c3a;--text:#eaf2ff;--muted:#9aa8bb;--accent:#58a6ff;--accent2:#2f6df6;--danger:#ff5f56;--ok:#35d071;--warning:#f59e0b;--border:#2a3748;--shadow:0 22px 70px rgba(0,0,0,.32)
}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(circle at 20% 0%,rgba(47,109,246,.16),transparent 32%),linear-gradient(135deg,#070d18,#0d1524 55%,#09101c);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;color:var(--text);min-height:100vh}
a{color:var(--accent);text-decoration:none}.wrap{max-width:1180px;margin:0 auto;padding:28px}.app-shell{display:grid;grid-template-columns:260px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;padding:22px 18px;background:linear-gradient(180deg,rgba(15,26,42,.96),rgba(9,17,30,.96));border-right:1px solid var(--border);box-shadow:18px 0 60px rgba(0,0,0,.22)}.brand{display:flex;align-items:center;gap:10px;color:var(--text);font-weight:850;font-size:18px;margin-bottom:34px}.brand-icon{display:grid;place-items:center;width:25px;height:25px;border-radius:9px;background:rgba(88,166,255,.14);color:var(--accent);border:1px solid rgba(88,166,255,.35)}.side-nav{display:flex;flex-direction:column;gap:8px}.side-nav a{color:var(--text);padding:12px 14px;border-radius:12px;font-weight:700}.side-nav a:hover,.side-nav a.active{background:linear-gradient(135deg,var(--accent2),#1f56ce);box-shadow:0 12px 34px rgba(47,109,246,.24)}.main{min-width:0}.topbar{height:64px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;padding:0 30px;background:rgba(8,15,27,.5);backdrop-filter:blur(10px)}.mobile-brand{display:none;color:var(--text);font-weight:800}.topbar-actions{display:flex;align-items:center;gap:10px;margin-left:auto}.user-chip{padding:10px 13px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid var(--border);color:var(--text);font-weight:700}.content{max-width:1120px;margin:0 auto;padding:38px 34px}.footer{text-align:center;color:var(--muted);padding:16px 0 28px}.nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.card{background:linear-gradient(180deg,rgba(19,29,41,.95),rgba(16,24,34,.95));border:1px solid var(--border);border-radius:18px;padding:22px;box-shadow:var(--shadow)}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.btn{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:12px;background:linear-gradient(135deg,#58a6ff,#2f81f7);color:#06111f;font-weight:850;padding:10px 14px;cursor:pointer;box-shadow:0 12px 30px rgba(47,129,247,.22)}.btn.secondary{background:rgba(255,255,255,.055);color:var(--text);border:1px solid var(--border);box-shadow:none}.btn.danger{background:var(--danger);color:#190706}input,textarea,select{width:100%;border:1px solid var(--border);background:#0d1117;color:var(--text);border-radius:12px;padding:11px;margin-top:6px}label{display:block;margin:12px 0;color:var(--muted);font-size:14px}table{width:100%;border-collapse:collapse}td,th{padding:13px 12px;border-bottom:1px solid var(--border);text-align:left}th{color:var(--muted);font-size:13px}.muted{color:var(--muted)}.pill{display:inline-flex;align-items:center;padding:4px 9px;border-radius:999px;background:rgba(255,255,255,.045);border:1px solid var(--border);font-size:12px;color:var(--muted);font-weight:800}.pill.blue{color:#9ccaff;background:rgba(47,109,246,.16);border-color:rgba(88,166,255,.35)}.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:26px}.page-head h1{margin:0 0 8px;font-size:30px;letter-spacing:-.03em}.page-subtitle{margin:0;font-size:18px;font-weight:750}.network-summary{display:flex;justify-content:space-between;gap:24px;align-items:flex-end;margin-bottom:24px}.network-summary h2{margin-top:0}.summary-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.section-heading{margin:26px 0 12px}.topology{margin-top:18px}.modern-topology{padding:26px}.ip-section{padding:0 0 28px}.ip-section:last-child{padding-bottom:0}.ip-section-head{display:flex;align-items:center;gap:12px;margin-bottom:16px}.ip-title{font-size:20px;font-weight:900;letter-spacing:-.02em;padding-left:15px;border-left:4px solid var(--accent);line-height:34px;text-shadow:0 0 18px rgba(88,166,255,.14)}.device-list{display:flex;flex-direction:column;gap:12px}.device-row{display:grid;grid-template-columns:46px minmax(180px,1.5fr) 150px 160px minmax(160px,1fr) 24px;align-items:center;gap:14px;padding:14px 16px;background:linear-gradient(180deg,rgba(32,44,58,.9),rgba(26,37,50,.9));border:1px solid var(--border);border-radius:14px;color:var(--text);transition:.16s ease;box-shadow:0 10px 26px rgba(0,0,0,.14)}.device-row:hover{transform:translateY(-1px);border-color:rgba(88,166,255,.55);box-shadow:0 16px 38px rgba(0,0,0,.24)}.device-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:linear-gradient(180deg,#334155,#263241);border:1px solid rgba(255,255,255,.06);font-size:20px}.device-name{font-weight:850}.device-ip,.device-location{color:#c8d6e8}.device-arrow{font-size:32px;color:#c8d6e8;text-align:right}.type-camera{color:#ff6b62;background:rgba(255,95,86,.13);border-color:rgba(255,95,86,.4)}.type-printer,.type-router{color:#52e084;background:rgba(53,208,113,.13);border-color:rgba(53,208,113,.38)}.type-computer{color:#c8a7ff;background:rgba(168,85,247,.13);border-color:rgba(168,85,247,.38)}.type-modem{color:#75b9ff;background:rgba(88,166,255,.13);border-color:rgba(88,166,255,.38)}.type-nas{color:#fbbf24;background:rgba(245,158,11,.13);border-color:rgba(245,158,11,.38)}.type-default{color:#d7e2ef}.table-card{overflow:auto}.login-box{min-height:100vh;display:grid;place-items:center;padding:24px}.login-box .card{width:min(430px,100%)}.row{display:grid;grid-template-columns:1fr 1fr;gap:14px}@media(max-width:950px){.app-shell{grid-template-columns:1fr}.sidebar{display:none}.topbar{padding:0 16px}.mobile-brand{display:block}.content{padding:24px 16px}.device-row{grid-template-columns:42px 1fr 24px}.device-row .pill,.device-ip,.device-location{grid-column:2/3}.network-summary,.page-head{flex-direction:column;align-items:stretch}.summary-actions{justify-content:flex-start}}@media(max-width:700px){.row{grid-template-columns:1fr}.wrap{padding:16px}.modern-topology{padding:16px}}

/* Modern device.php dodatki */
.device-page{display:flex;flex-direction:column;gap:22px}.device-header-card,.modern-card,.device-sidebar-card{background:rgba(22,27,34,.92);border:1px solid var(--border);border-radius:18px;box-shadow:0 18px 60px rgba(0,0,0,.25)}.device-header-card{padding:22px;display:flex;justify-content:space-between;align-items:center;gap:18px}.back-link{display:inline-flex;margin-bottom:18px;color:var(--accent);font-weight:700}.device-hero{display:flex;align-items:center;gap:16px}.device-icon-large,.sidebar-device-icon{display:grid;place-items:center;background:linear-gradient(135deg,#263241,#1f2630);border:1px solid var(--border);box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}.device-icon-large{width:64px;height:64px;border-radius:18px;font-size:30px}.device-hero h1{margin:0 0 8px;font-size:32px}.device-subtitle{display:flex;align-items:center;gap:10px;color:var(--muted)}.device-header-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.device-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px}.device-main{display:flex;flex-direction:column;gap:22px}.modern-card{padding:22px}.section-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:18px}.section-heading h2{margin:0;font-size:20px}.device-info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.info-tile{background:rgba(31,38,48,.75);border:1px solid var(--border);border-radius:16px;padding:16px;min-width:0}.info-label{text-transform:uppercase;letter-spacing:.08em;font-size:11px;color:var(--muted);font-weight:800;margin-bottom:8px}.info-value{font-size:17px;font-weight:800;word-break:break-word}.access-box{display:flex;flex-direction:column;gap:12px}.access-row{display:flex;justify-content:space-between;align-items:center;gap:16px;background:rgba(31,38,48,.75);border:1px solid var(--border);border-radius:16px;padding:16px}.credential-value{font-size:17px;font-weight:800;color:var(--text);word-break:break-all}.access-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.small-btn{padding:8px 11px;font-size:13px}.notes-box{background:rgba(31,38,48,.55);border:1px solid var(--border);border-radius:16px;padding:16px;line-height:1.7;color:var(--text);min-height:90px}.device-sidebar-card{padding:22px;align-self:start;text-align:center;position:sticky;top:22px}.sidebar-device-icon{width:86px;height:86px;border-radius:24px;font-size:40px;margin:0 auto 16px}.device-sidebar-card h3{margin:0 0 6px;font-size:22px}.sidebar-divider{height:1px;background:var(--border);margin:20px 0}.sidebar-stat{display:flex;justify-content:space-between;gap:12px;text-align:left;padding:12px 0;border-bottom:1px solid rgba(48,54,61,.7)}.sidebar-stat:last-child{border-bottom:0}.sidebar-stat span{color:var(--muted);font-size:13px}.sidebar-stat strong{text-align:right;word-break:break-word}@media(max-width:900px){.device-header-card{align-items:flex-start;flex-direction:column}.device-header-actions{justify-content:flex-start}.device-layout{grid-template-columns:1fr}.device-sidebar-card{position:static}.device-info-grid{grid-template-columns:1fr}.access-row{align-items:flex-start;flex-direction:column}.access-actions{justify-content:flex-start}.device-hero h1{font-size:26px}}

.device-grid{
margin-top:20px;
grid-template-columns:repeat(auto-fit,minmax(420px,1fr));
gap:20px;
}

.page-header{
display:flex;
justify-content:space-between;
align-items:center;
}

.page-header h1{
margin:0;
}

.device-form .card h3{
margin-top:0;
margin-bottom:20px;
color:#58a6ff;
}

textarea{
resize:vertical;
min-height:150px;
}