:root{--bg:#070b16;--panel:#0d1423;--panel2:#111b2d;--line:#1e2b42;--text:#edf5ff;--muted:#8290a8;--cyan:#5ce1e6;--blue:#3a7afe;--green:#54d6a1;--yellow:#f7c86a;--red:#ff7385}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,sans-serif}button,input,select{font:inherit}.hidden{display:none!important}.brand{height:80px;display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:.14em}.mark{width:32px;height:32px;display:grid;place-items:center;background:var(--cyan);color:#071019;border-radius:9px;font-size:18px}.login{min-height:100vh;display:grid;grid-template-columns:minmax(520px,58%) 1fr}.login>.brand{position:absolute;left:48px}.login-card{align-self:center;max-width:560px;padding:100px 9vw}.eyebrow{color:var(--cyan);font-size:12px;letter-spacing:.18em;font-weight:800}.login h1{font-size:clamp(45px,6vw,78px);line-height:1.02;letter-spacing:-.055em;margin:18px 0}.login h1 em{font-style:normal;color:var(--cyan)}.login-card>p{font-size:17px;color:var(--muted);max-width:470px}.login form{max-width:390px;margin-top:42px}.login label{display:block;color:#b8c5d9;font-size:13px;font-weight:700;margin:14px 0}.login input,.dialog input,.dialog select{display:block;width:100%;margin-top:7px;padding:13px 14px;border:1px solid var(--line);border-radius:9px;background:#0b1220;color:var(--text);outline:none}.login input:focus,.dialog input:focus,.dialog select:focus{border-color:var(--cyan);box-shadow:0 0 0 3px #5ce1e61a}.login form button,.primary{width:100%;margin-top:12px;padding:14px 18px;border:0;border-radius:9px;background:var(--cyan);color:#061016;font-weight:800;cursor:pointer;display:flex;justify-content:space-between}.login small{display:block;text-align:center;color:#59667a;margin-top:16px}.login aside{position:relative;overflow:hidden;border-left:1px solid var(--line);background:linear-gradient(145deg,#0d1930,#080c17);display:flex;align-items:flex-end;padding:58px}.login aside b{font-size:22px}.login aside p{color:var(--muted)}.orb{position:absolute;width:420px;height:420px;border-radius:50%;top:9%;left:13%;border:1px solid #5ce1e633;box-shadow:0 0 90px #2476ff33,inset 0 0 100px #5ce1e615}.orb:after,.orb:before{content:"";position:absolute;border:1px solid #5ce1e622;border-radius:50%;inset:55px}.orb:after{inset:120px}.app{display:grid;grid-template-columns:245px 1fr;min-height:100vh}.sidebar{border-right:1px solid var(--line);padding:0 22px;display:flex;flex-direction:column}.sidebar nav{display:grid;gap:7px;margin-top:28px}.sidebar nav button,.side-foot>button{border:0;background:none;color:var(--muted);padding:12px 14px;text-align:left;border-radius:8px;cursor:pointer}.sidebar nav button span{margin-left:10px}.sidebar nav button:hover,.sidebar nav button.active{background:#152137;color:#fff}.sidebar nav button.active{box-shadow:inset 3px 0 var(--cyan)}.side-foot{margin-top:auto;padding:20px 0}.mode{display:flex;gap:10px;padding:13px;background:#0c1524;border:1px solid var(--line);border-radius:10px}.mode i{width:8px;height:8px;border-radius:50%;background:var(--yellow);margin-top:6px;box-shadow:0 0 12px var(--yellow)}.mode b,.mode small{display:block}.mode small{color:var(--muted)}main{min-width:0}header{height:100px;border-bottom:1px solid var(--line);padding:22px 34px;display:flex;align-items:center;justify-content:space-between}header h2{margin:5px 0 0;font-size:22px}.crumb{font-size:11px;letter-spacing:.14em;color:#56657c}.crumb span{color:var(--cyan)}.header-actions{display:flex;align-items:center;gap:10px}.header-actions .primary{width:auto;margin:0}.ghost{padding:10px 14px;background:transparent;border:1px solid var(--line);color:#b5c2d5;border-radius:8px;cursor:pointer}.avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#172743;color:var(--cyan);font-weight:800}.page{padding:30px 34px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.stat,.panel{border:1px solid var(--line);background:linear-gradient(145deg,var(--panel),#0a101d);border-radius:12px}.stat{padding:20px}.stat label{color:var(--muted);font-size:12px;letter-spacing:.1em}.stat strong{font-size:32px;display:block;margin-top:8px}.stat small{color:var(--muted)}.layout{display:grid;grid-template-columns:1.55fr .8fr;gap:16px;margin-top:16px}.panel-head{padding:19px 20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.panel-head h3{font-size:15px;margin:0}.panel-body{padding:8px 20px 20px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th{text-align:left;color:#627086;font-size:11px;letter-spacing:.09em;padding:13px 10px;border-bottom:1px solid var(--line)}td{padding:13px 10px;border-bottom:1px solid #172238;white-space:nowrap}.sub{display:block;color:var(--muted);font-size:12px}.status{display:inline-flex;align-items:center;gap:7px;padding:4px 9px;border-radius:999px;font-size:12px;background:#142135}.status:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}.online{color:var(--green)}.warning{color:var(--yellow)}.critical,.offline{color:var(--red)}.rx.good{color:var(--green)}.rx.mid{color:var(--yellow)}.rx.bad{color:var(--red)}.olt-card{padding:16px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between}.olt-card b,.olt-card span{display:block}.olt-card span{color:var(--muted);font-size:12px}.actions button{border:1px solid var(--line);background:#111d31;color:#d8e4f6;border-radius:6px;padding:6px 9px;cursor:pointer;margin-right:5px}.empty{color:var(--muted);padding:30px;text-align:center}dialog{width:min(650px,calc(100% - 30px));border:1px solid var(--line);padding:0;background:#0d1423;color:var(--text);border-radius:14px;box-shadow:0 30px 100px #000}dialog::backdrop{background:#02050bbb;backdrop-filter:blur(4px)}.dialog{padding:0}.dialog-head{display:flex;justify-content:space-between;padding:22px 24px;border-bottom:1px solid var(--line)}.dialog h3{margin:5px 0 0;font-size:23px}.close{background:none;border:0;color:var(--muted);font-size:28px;cursor:pointer}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:22px 24px}.form-grid label{font-size:12px;font-weight:700;color:#9cacbf}.form-grid .wide{grid-column:1/-1}.dialog-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:10px;margin-top:8px}.dialog-actions button{width:auto}.notice{padding:12px 14px;background:#f7c86a12;color:#f7c86a;border:1px solid #f7c86a33;border-radius:8px;font-size:13px}.job{padding:13px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between}.job small{display:block;color:var(--muted)}#toast{position:fixed;z-index:20;right:24px;bottom:24px;padding:13px 18px;background:#14263a;border:1px solid var(--cyan);border-radius:9px;transform:translateY(100px);opacity:0;transition:.25s}#toast.show{transform:none;opacity:1}@media(max-width:900px){.login{grid-template-columns:1fr}.login aside{display:none}.app{grid-template-columns:78px 1fr}.sidebar{padding:0 12px}.sidebar .brand span:last-child,.sidebar nav span,.mode div{display:none}.sidebar .brand{justify-content:center}.stats{grid-template-columns:1fr 1fr}.layout{grid-template-columns:1fr}header{padding:18px}.page{padding:18px}.ghost,.avatar{display:none}}@media(max-width:580px){.login>.brand{left:24px}.login-card{padding:110px 24px 40px}.login h1{font-size:44px}.app{display:block}.sidebar{position:fixed;z-index:10;bottom:0;left:0;right:0;height:64px;background:#09101d;border:0;border-top:1px solid var(--line)}.sidebar>.brand,.side-foot{display:none}.sidebar nav{display:flex;margin:0;justify-content:space-around}.sidebar nav button{padding:17px 12px;font-size:18px}.sidebar nav button:nth-child(n+5){display:none}main{padding-bottom:70px}header{height:80px}.header-actions .primary{font-size:0;padding:11px}.header-actions .primary:first-letter{font-size:16px}.stats{grid-template-columns:1fr 1fr}.stat{padding:15px}.stat strong{font-size:26px}.form-grid{grid-template-columns:1fr}.form-grid .wide{grid-column:auto}}
.brand-logo{display:block;width:156px;height:54px;object-fit:contain;object-position:left center}.sidebar .brand-logo{width:142px;height:48px}
@media(max-width:900px){.sidebar .brand-logo{width:48px;height:48px;object-fit:cover;object-position:left}}
.login-card{max-width:610px}.login h1{font-size:clamp(42px,5.15vw,70px)}.login-visual{padding:58px 64px}.olt-summary{position:relative;z-index:2;width:100%;max-width:420px;padding:24px;border:1px solid #ffffff16;border-radius:14px;background:#07101fbb;backdrop-filter:blur(14px)}.olt-summary small{display:block;color:var(--cyan);font-size:11px;letter-spacing:.18em;font-weight:800}.olt-summary strong{display:block;margin:6px 0 18px;font-size:24px}.olt-summary p{margin:18px 0 0;color:#8b9ab0}.model-list{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.model-list span{padding:10px 5px;text-align:center;border:1px solid #5ce1e62e;border-radius:7px;background:#5ce1e60b;color:#bdf7f8;font-size:12px;font-weight:800}.orb span{position:absolute;width:9px;height:9px;border-radius:50%;background:var(--cyan);top:50%;left:50%;box-shadow:0 0 18px var(--cyan)}.sidebar{padding:0 18px}.sidebar .brand{padding:0 8px;border-bottom:1px solid #142139}.sidebar nav{gap:4px;margin-top:22px}.nav-label{display:block;padding:17px 13px 5px;color:#4f6078;font-size:10px;font-weight:800;letter-spacing:.14em}.sidebar nav button{display:flex;align-items:center;gap:11px;padding:11px 12px;font-size:14px}.sidebar nav button span{margin-left:0}.nav-icon{width:23px;height:23px;display:grid;place-items:center;border-radius:6px;background:#172238;color:#8394aa;font-size:15px}.sidebar nav button.active .nav-icon{background:#5ce1e61b;color:var(--cyan)}.sidebar nav button.active{box-shadow:none;background:#142136;color:#fff}.side-foot>button{width:100%;display:flex;justify-content:space-between;align-items:center;margin-top:9px;border-top:1px solid #17243a;border-radius:0;color:#8190a5}.primary{background:linear-gradient(135deg,#5ce1e6,#43c9d3)}header{height:88px}.page{padding-top:24px}
@media(max-width:900px){.nav-label{display:none}.sidebar nav button{justify-content:center}.sidebar nav button span:last-child{display:none}.sidebar nav button .nav-icon{display:grid}.login h1{font-size:48px}}
@media(max-width:580px){.login h1{font-size:40px}.login-card>p{font-size:15px}.sidebar nav button .nav-icon{display:grid}}
.role-hidden{display:none!important}.role-badge{display:inline-flex;padding:5px 9px;border:1px solid var(--line);border-radius:6px;text-transform:uppercase;font-size:11px;font-weight:800;letter-spacing:.06em}.role-badge.superadmin{color:#ffd76b;border-color:#ffd76b44;background:#ffd76b0d}.role-badge.admin{color:#7eb1ff;border-color:#7eb1ff44;background:#7eb1ff0d}.role-badge.noc{color:var(--cyan);border-color:#5ce1e644;background:#5ce1e60d}.user-note{padding:12px 14px;border:1px solid #5ce1e633;border-radius:8px;background:#5ce1e60a;color:#a7c8d0;font-size:13px}.role-guide{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.role-guide span{padding:10px;border:1px solid var(--line);border-radius:8px;color:var(--muted);font-size:11px}.role-guide b{display:block;margin-bottom:3px;color:var(--text);font-size:12px}@media(max-width:580px){.role-guide{grid-template-columns:1fr}}
.olt-page{max-width:1500px}.olt-fleet{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}.olt-tile{min-width:0;padding:13px;border:1px solid var(--line);border-radius:10px;background:#0a111e;color:var(--text);text-align:left;cursor:pointer;transition:.18s}.olt-tile:hover{border-color:#37516e;transform:translateY(-1px)}.olt-tile.active{border-color:var(--cyan);background:#0d1b2a;box-shadow:0 0 0 2px #5ce1e610}.olt-tile>.mini-device{height:48px;margin-bottom:12px}.olt-tile>span{display:grid;grid-template-columns:1fr auto}.olt-tile small,.olt-tile b{display:block}.olt-tile small{color:#75859b;font-size:10px}.olt-tile b{font-size:13px}.olt-tile em{grid-column:2;grid-row:1/3;align-self:center;font-size:10px;font-style:normal;text-transform:uppercase}.olt-tile em.online{color:var(--green)}.olt-tile em.warning{color:var(--yellow)}.olt-tile em.offline{color:var(--red)}.olt-workspace{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.7fr);gap:14px}.device-hero,.pon-section,.optic-summary{border:1px solid var(--line);border-radius:12px;background:linear-gradient(145deg,#0d1524,#09101c)}.device-hero{grid-column:1/-1;padding:22px}.device-meta{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:20px}.device-meta>div:first-child>small{display:block;margin:11px 0 2px;color:#64758c;font-size:10px;letter-spacing:.13em}.device-meta h3{margin:0;font-size:24px}.device-meta p{margin:3px 0;color:var(--muted);font-size:12px}.device-capacity{display:flex;gap:8px}.device-capacity span{padding:9px 12px;border:1px solid var(--line);border-radius:8px;color:var(--muted);font-size:11px}.device-capacity b{display:block;color:var(--text);font-size:18px}.mini-device{position:relative;display:flex;align-items:stretch;width:100%;height:116px;padding:7px 28px;border:1px solid #3a4656;border-radius:5px;background:linear-gradient(#75808b,#414a55 8%,#242b34 9%,#171d24 91%,#505966 92%,#87919a);box-shadow:inset 0 0 0 3px #111822,0 9px 20px #0005}.mini-device.rack-compact{height:82px}.rack-ear{position:absolute;inset:12px auto 12px 8px;width:12px;border:1px solid #59636e;border-radius:2px;background:repeating-linear-gradient(0deg,#151b22 0 5px,#717a84 6px 8px)}.slot-bank{display:flex;gap:4px;flex:1;padding:5px;background:#080c12;border:1px solid #3b4652}.slot-bank i{position:relative;display:grid;grid-template-columns:repeat(2,1fr);gap:3px;min-width:14px;flex:1;padding:5px 3px;background:linear-gradient(90deg,#242b33,#3c4651,#1d242c);border:1px solid #626c76;border-radius:2px}.slot-bank i:before{content:"";position:absolute;top:3px;left:3px;width:3px;height:3px;border-radius:50%;background:#5f6974}.slot-bank i.loaded:before{background:var(--green);box-shadow:0 0 5px var(--green)}.slot-bank i span{align-self:end;height:6px;border:1px solid #6e7881;background:#111923}.slot-bank i.loaded span{border-color:#2f725e;background:#163b31}.rack-power{width:58px;margin-left:5px;display:grid;grid-template-columns:1fr 1fr;gap:4px}.rack-power b{border:1px solid #656f79;background:repeating-linear-gradient(0deg,#202730 0 3px,#4a535d 4px 5px)}.chassis-legend{display:flex;gap:18px;margin-top:12px;color:#66768b;font-size:10px}.chassis-legend span:last-child{margin-left:auto}.chassis-legend i,.port-legend i{display:inline-block;width:7px;height:7px;margin-right:5px;border-radius:50%;background:#526071}.chassis-legend i.online,.port-legend i.online{background:var(--green)}.pon-section{padding:20px}.section-title{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:14px}.section-title small,.optic-head small{color:#5e7189;font-size:10px;letter-spacing:.13em}.section-title h3,.optic-head h4{margin:3px 0 0}.port-legend{display:flex;gap:10px;color:#738299;font-size:10px}.port-legend i.warning{background:var(--yellow)}.port-legend i.critical{background:var(--red)}.pon-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.pon-port{position:relative;min-width:0;padding:12px 8px 10px;border:1px solid var(--line);border-radius:8px;background:#0a111d;color:var(--text);text-align:center;cursor:pointer}.pon-port:hover,.pon-port.selected{border-color:var(--cyan);background:#102033}.pon-port b,.pon-port small{display:block}.pon-port b{font-size:11px}.pon-port small{color:#67778d;font-size:9px}.fiber-jack{display:block;width:17px;height:14px;margin:0 auto 7px;border:2px solid #58677a;border-radius:2px;background:#121a25;box-shadow:inset 0 0 0 3px #071019}.pon-port.online .fiber-jack{border-color:var(--green);box-shadow:0 0 8px #54d6a133,inset 0 0 0 3px #071019}.pon-port.warning .fiber-jack{border-color:var(--yellow)}.pon-port.critical .fiber-jack{border-color:var(--red)}.pon-port.disabled{opacity:.35}.optic-summary{padding:20px}.optic-head{display:flex;justify-content:space-between;align-items:start}.optic-head>span{padding:5px 8px;border-radius:6px;background:#142238;color:#8fa0b5;font-size:10px}.optic-bars{display:grid;gap:12px;margin:22px 0}.optic-bars label{display:flex;justify-content:space-between;font-size:11px}.optic-bars i{display:block;height:6px;margin:5px 0;border-radius:9px;background:#192234;overflow:hidden}.optic-bars i span{display:block;height:100%;min-width:3px;border-radius:9px}.optic-bars i .good{background:var(--green)}.optic-bars i .mid{background:var(--yellow)}.optic-bars i .bad{background:var(--red)}.optic-bars small{color:#647389;font-size:9px}.optic-list{border-top:1px solid var(--line)}.optic-list>div{display:grid;grid-template-columns:12px 55px 1fr auto;gap:6px;align-items:center;padding:10px 0;border-bottom:1px solid #172238;font-size:10px}.optic-list>div>span:nth-child(3){color:#7e8da2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.signal-dot{width:7px;height:7px;border-radius:50%}.signal-dot.good{background:var(--green)}.signal-dot.mid{background:var(--yellow)}.signal-dot.bad{background:var(--red)}.optic-list p{color:var(--muted);font-size:11px}@media(max-width:1100px){.olt-fleet{grid-template-columns:1fr 1fr}.olt-workspace{grid-template-columns:1fr}.pon-grid{grid-template-columns:repeat(8,1fr)}}@media(max-width:700px){.olt-fleet{grid-template-columns:1fr 1fr}.olt-tile>.mini-device{display:none}.olt-workspace{display:block}.device-hero,.pon-section,.optic-summary{margin-bottom:12px}.device-capacity{display:none}.device-hero{padding:16px}.mini-device{height:75px;padding:7px 18px}.slot-bank i{min-width:8px;padding:3px 1px}.rack-power{width:35px}.pon-grid{grid-template-columns:repeat(4,1fr)}.port-legend{display:none}.chassis-legend span:last-child{display:none}}
.c320-photo{padding:0;border-color:#283747;background:#fff;overflow:hidden}.c320-photo img{display:block;width:100%;height:100%;object-fit:contain}.device-hero .c320-photo.detail{height:auto;aspect-ratio:1600/444;box-shadow:0 9px 24px #0008}.c320-hotspots{position:absolute;inset:0}.c320-hotspot{position:absolute;left:calc(30.4% + var(--p)*3.62%);top:43%;width:3.2%;height:22%;padding:0;border:1px solid transparent;border-radius:3px;background:transparent;cursor:pointer}.c320-hotspot:hover,.c320-hotspot.selected{border-color:var(--cyan);background:#5ce1e61c;box-shadow:0 0 10px #5ce1e655}.c320-hotspot.warning{border-bottom-color:var(--yellow)}.c320-hotspot.critical{border-bottom-color:var(--red)}.c320-hotspot.online{border-bottom-color:var(--green)}.c320-hotspot span{position:absolute;left:50%;top:-18px;transform:translateX(-50%);display:none;padding:2px 5px;border-radius:4px;background:#07101f;color:#fff;font-size:9px}.c320-hotspot:hover span,.c320-hotspot.selected span{display:block}@media(max-width:700px){.device-hero .c320-photo.detail{height:auto}.c320-hotspot span{display:none!important}}
.c320-drawing{position:relative;display:flex;width:100%;height:150px;padding:7px 18px;border:1px solid #76818b;border-radius:4px;background:linear-gradient(#26313a 0 13%,#c7cdd0 13% 16%,#9ba3a7 17% 19%,#e2e5e5 20% 100%);box-shadow:inset 0 0 0 3px #172029,0 9px 20px #0006;overflow:hidden}.c320-ear{position:absolute;z-index:2;left:4px;top:22%;bottom:5%;width:18px;border:1px solid #5e6870;border-radius:3px;background:#26333d;display:flex;flex-direction:column;justify-content:space-around;align-items:center}.c320-ear.right{left:auto;right:4px}.c320-ear i{width:8px;height:8px;border:2px solid #b5bdc0;border-radius:50%;background:#152029}.c320-brand{width:78px;margin:18px 4px 0 3px;padding:7px 6px 3px;border-right:1px solid #4e575d;background:#26313a;color:#d7e0e3;display:flex;flex-direction:column}.c320-brand b{align-self:flex-start;padding:1px 5px;background:#13a4db;color:#fff;font-size:12px;line-height:1.2}.c320-brand strong{margin:3px 0 8px;color:#ff7c27;font-size:7px}.c320-brand span{font-size:6px;color:#bdc7ca}.c320-brand em{margin-top:auto;padding:3px 0;border-radius:2px;background:#f1b719;color:#15191c;text-align:center;font-size:7px;font-style:normal;font-weight:900}.c320-face{display:grid;grid-template-rows:17% 34% 49%;flex:1;margin-top:18px;border:1px solid #636c71;background:#d3d7d7;box-shadow:inset 0 0 8px #fff}.c320-blank{border-bottom:1px solid #9fa6a8;background:linear-gradient(#d9ddde,#b8bfc1)}.c320-gtgo{position:relative;display:flex;border-bottom:1px solid #737b80;background:#bdc3c4}.c320-gtgo>label{width:27px;border-right:1px solid #838b8e;color:#2f363a;font-size:6px;font-weight:900;writing-mode:vertical-rl;text-align:center}.c320-ports{display:grid;grid-template-columns:repeat(16,1fr);gap:3px;flex:1;padding:4px 8px}.c320-pon{position:relative;min-width:0;padding:0;border:1px solid #5e676b;border-radius:1px;background:#262e32;cursor:pointer}.c320-sfp{position:absolute;inset:2px;background:linear-gradient(135deg,#12181b 0 45%,#41494c 46% 62%,#0c1114 63%);border:1px solid #0a0e10}.c320-sfp b{position:absolute;inset:25% 18%;border:1px solid #596467;background:#080c0e}.c320-sfp small{position:absolute;top:-7px;left:50%;transform:translateX(-50%);color:#3c4447;font-size:5px}.c320-pon:hover,.c320-pon.selected{outline:2px solid var(--cyan);outline-offset:1px;box-shadow:0 0 8px #5ce1e688}.c320-pon.online{border-bottom:2px solid var(--green)}.c320-pon.warning{border-bottom:2px solid var(--yellow)}.c320-pon.critical{border-bottom:2px solid var(--red)}.c320-pon.disabled{opacity:.4}.c320-control-row{display:grid;grid-template-columns:1fr 1fr;gap:5px;padding:3px 7px;background:#d1d5d5}.c320-module{position:relative;display:grid;grid-template-columns:18px 25px 1fr 1.3fr;gap:5px;align-items:center;padding:3px 5px;border:1px solid #9da4a6;background:linear-gradient(#d9dddd,#bfc5c5);box-shadow:inset 0 0 0 1px #eef0f0}.c320-module>small{position:absolute;left:2px;top:2px;color:#333;font-size:5px;writing-mode:vertical-rl}.c320-switch{width:18px;height:14px;margin-left:9px;border:2px solid #363d40;border-radius:2px;background:#11171a;box-shadow:inset 0 -3px #4a5559}.c320-leds{display:grid;grid-template-columns:repeat(3,4px);gap:2px}.c320-leds b{width:4px;height:4px;border-radius:50%;background:#5f686b}.c320-leds b:first-child{background:#4ed09b;box-shadow:0 0 3px #4ed09b}.c320-uplinks{display:grid;grid-template-columns:repeat(2,1fr);gap:2px}.c320-uplinks i{height:13px;border:2px solid #4b5458;background:#12191c;box-shadow:inset 0 0 0 2px #889296}.c320-console{display:grid;grid-template-columns:repeat(4,1fr);gap:2px}.c320-console i{height:11px;border:1px solid #4d565a;background:linear-gradient(#162025,#354147)}.olt-tile>.c320-drawing{height:48px;margin-bottom:12px;padding:3px 8px}.olt-tile>.c320-drawing .c320-ear{width:6px}.olt-tile>.c320-drawing .c320-brand{width:28px;margin-top:6px;padding:2px}.olt-tile>.c320-drawing .c320-brand b{font-size:4px;padding:0 1px}.olt-tile>.c320-drawing .c320-brand strong,.olt-tile>.c320-drawing .c320-brand span,.olt-tile>.c320-drawing .c320-brand em{display:none}.olt-tile>.c320-drawing .c320-face{margin-top:6px}.olt-tile>.c320-drawing .c320-gtgo>label,.olt-tile>.c320-drawing .c320-module>small{display:none}.olt-tile>.c320-drawing .c320-ports{gap:1px;padding:1px 3px}.olt-tile>.c320-drawing .c320-sfp{inset:1px}.olt-tile>.c320-drawing .c320-control-row{gap:1px;padding:1px 2px}.olt-tile>.c320-drawing .c320-module{padding:1px;gap:1px;grid-template-columns:8px 8px 1fr 1.2fr}.olt-tile>.c320-drawing .c320-switch{width:7px;height:5px;margin-left:0;border-width:1px}.olt-tile>.c320-drawing .c320-leds{display:none}.olt-tile>.c320-drawing .c320-uplinks i,.olt-tile>.c320-drawing .c320-console i{height:4px;border-width:1px}.device-hero .c320-drawing.detail{height:170px}@media(max-width:700px){.device-hero .c320-drawing.detail{height:110px}.c320-brand{width:46px}.c320-ports{gap:1px;padding:3px}.c320-control-row{gap:2px;padding:2px}.c320-module{grid-template-columns:12px 15px 1fr 1fr;gap:2px;padding:2px}.c320-switch{width:11px;height:9px;margin-left:5px}.c320-leds{display:none}}
.c300-drawing{position:relative;width:100%;max-width:760px;height:330px;margin:0 auto;padding:38px 28px 18px;border:2px solid #242e36;border-radius:3px;background:linear-gradient(90deg,#727d82,#d2d6d5 3%,#bec4c4 97%,#68747a);box-shadow:inset 0 0 0 3px #121b22,0 12px 28px #0008;overflow:hidden}.c300-top{position:absolute;inset:0 0 auto;height:38px;padding:8px 14px;background:linear-gradient(#313d45,#151e25);border-bottom:4px solid #687177;color:#cbd3d5}.c300-top b{font-size:10px}.c300-top span{display:inline-block;width:45px;height:6px;margin-left:24%;background:#ff681b;box-shadow:205px 0 #ff681b}.c300-top em{float:right;padding:3px 7px;border-radius:2px;background:#dfad25;color:#191d20;font-size:7px;font-style:normal;font-weight:900}.c300-board-bank{display:grid;grid-template-columns:repeat(7,1fr) 1.8fr repeat(7,1fr);gap:3px;height:100%;padding:4px;border:1px solid #687277;background:#80898d}.c300-card,.c300-controller{position:relative;min-width:0;padding:15px 4px 16px;border:1px solid #838c8f;background:linear-gradient(90deg,#d8dcdc,#aeb5b6,#e5e8e7);box-shadow:inset 0 0 0 1px #f4f5f4}.c300-card:before,.c300-controller:before{content:"";position:absolute;top:3px;left:50%;width:8px;height:8px;transform:translateX(-50%);border:1px solid #7e8789;border-radius:50%;background:#dfe2e1}.c300-card:after,.c300-controller:after{content:"";position:absolute;bottom:3px;left:50%;width:8px;height:8px;transform:translateX(-50%);border:1px solid #7e8789;border-radius:50%;background:#dfe2e1}.c300-card>label,.c300-controller>label{position:absolute;top:15px;right:2px;color:#3e4648;font-size:5px;writing-mode:vertical-rl}.c300-card-leds{display:grid;grid-template-columns:repeat(3,3px);justify-content:center;gap:2px;margin:3px 0 12px}.c300-card-leds b{width:3px;height:3px;border-radius:50%;background:#5c6668}.c300-card-leds b:first-child{background:#55c89b;box-shadow:0 0 3px #55c89b}.c300-card-ports{display:grid;grid-template-columns:1fr;gap:5px}.c300-port{position:relative;display:block;width:100%;height:20px;padding:0;border:0;background:transparent}.c300-port i{position:absolute;left:50%;top:2px;width:14px;height:15px;transform:translateX(-50%);border:2px solid #4f595c;background:#13191c;box-shadow:inset 0 0 0 2px #788285}.c300-port small{position:absolute;left:1px;top:4px;color:#444c4e;font-size:4px}.c300-port:hover i,.c300-port.selected i{border-color:var(--cyan);box-shadow:0 0 7px #5ce1e6}.c300-port.online i{border-bottom-color:var(--green)}.c300-port.warning i{border-bottom-color:var(--yellow)}.c300-port.critical i{border-bottom-color:var(--red)}.c300-port.disabled{opacity:.35}.c300-card>em{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);padding:2px 3px;background:#e1b52f;color:#242729;font-size:5px;font-style:normal;font-weight:900}.c300-center{display:grid;grid-template-columns:1fr 1fr;gap:3px}.c300-controller{padding:17px 4px}.c300-controller .c300-card-leds{grid-template-columns:repeat(2,3px)}.c300-db9{display:block;width:18px;height:10px;margin:18px auto;border:2px solid #5b6466;border-radius:40%;background:#bfc5c5;box-shadow:inset 0 0 0 2px #30383a}.c300-ctrl-ports{display:grid;grid-template-columns:1fr;gap:8px}.c300-ctrl-ports i{width:18px;height:16px;margin:auto;border:2px solid #4f595c;background:#12191c}.c300-controller strong{position:absolute;bottom:17px;left:50%;width:15px;height:27px;transform:translateX(-50%);border:2px solid #586164;background:linear-gradient(#12191c 0 42%,#b9bfbe 43% 57%,#12191c 58%)}.c300-rack-ear{position:absolute;z-index:3;top:40px;bottom:15px;width:22px;background:#758085;border:1px solid #303b42;display:flex;flex-direction:column;justify-content:space-around;align-items:center}.c300-rack-ear.left{left:3px}.c300-rack-ear.right{right:3px}.c300-rack-ear i{width:9px;height:9px;border:2px solid #d0d5d4;border-radius:50%;background:#222c32}.c300-bottom{position:absolute;bottom:0;left:0;right:0;height:14px;background:#1b252b;border-top:2px solid #697277}.olt-tile>.c300-drawing{height:48px;margin:0 0 12px;padding:9px 6px 3px;border-width:1px}.olt-tile>.c300-drawing .c300-top{height:9px;padding:1px 4px;border-bottom-width:1px}.olt-tile>.c300-drawing .c300-top b,.olt-tile>.c300-drawing .c300-top em,.olt-tile>.c300-drawing .c300-top span,.olt-tile>.c300-drawing .c300-rack-ear,.olt-tile>.c300-drawing .c300-bottom{display:none}.olt-tile>.c300-drawing .c300-board-bank{gap:1px;padding:1px}.olt-tile>.c300-drawing .c300-card,.olt-tile>.c300-drawing .c300-controller{padding:2px 1px}.olt-tile>.c300-drawing .c300-card:before,.olt-tile>.c300-drawing .c300-card:after,.olt-tile>.c300-drawing .c300-controller:before,.olt-tile>.c300-drawing .c300-controller:after,.olt-tile>.c300-drawing label,.olt-tile>.c300-drawing .c300-card-leds,.olt-tile>.c300-drawing .c300-port small,.olt-tile>.c300-drawing .c300-card>em,.olt-tile>.c300-drawing .c300-db9,.olt-tile>.c300-drawing .c300-controller strong{display:none}.olt-tile>.c300-drawing .c300-card-ports{gap:1px}.olt-tile>.c300-drawing .c300-port{height:2px}.olt-tile>.c300-drawing .c300-port i{top:0;width:3px;height:2px;border-width:1px}.olt-tile>.c300-drawing .c300-ctrl-ports{gap:1px}.olt-tile>.c300-drawing .c300-ctrl-ports i{width:3px;height:3px;border-width:1px}.device-hero .c300-drawing.detail{height:330px}@media(max-width:700px){.device-hero .c300-drawing.detail{height:230px;padding:32px 18px 14px}.c300-top{height:32px}.c300-rack-ear{top:34px;width:15px}.c300-card-ports{gap:2px}.c300-port{height:13px}.c300-port i{width:9px;height:10px}.c300-center{gap:1px}.c300-controller{padding:10px 1px}.c300-db9{width:10px;height:7px;margin:10px auto}.c300-ctrl-ports i{width:10px;height:9px}.c300-controller strong{width:9px;height:17px}}
.c620-drawing{position:relative;display:flex;width:100%;height:185px;padding:14px 24px;border:2px solid #4c555d;border-radius:5px;background:linear-gradient(#4b555d 0 8%,#d7d9d7 9% 91%,#59636a 92%);box-shadow:inset 0 0 0 3px #1c252b,0 10px 24px #0008;overflow:hidden}.c620-ear{position:absolute;z-index:3;left:3px;top:17px;bottom:12px;width:21px;border:1px solid #4c555b;background:#899196;display:flex;flex-direction:column;justify-content:space-around;align-items:center}.c620-ear.right{left:auto;right:3px}.c620-ear i{width:9px;height:9px;border:2px solid #e0e2e0;border-radius:50%;background:#3a444a}.c620-brand{width:70px;padding:12px 7px 5px;border:1px solid #8b9294;background:linear-gradient(90deg,#b8bebe,#e3e5e3);color:#364046;display:flex;flex-direction:column}.c620-brand b{align-self:flex-start;padding:2px 6px;background:#26a8c4;color:#fff;font-size:11px}.c620-brand strong{margin:4px 0 10px;color:#5b666b;font-size:7px}.c620-brand span{margin:2px 0;font-size:6px}.c620-brand span:before{content:"";display:inline-block;width:4px;height:4px;margin-right:4px;border-radius:50%;background:#4fcf9d}.c620-brand em{margin-top:auto;padding:3px;background:#e6b62d;color:#222;font-size:7px;font-style:normal;font-weight:900;text-align:center}.c620-face{display:grid;grid-template-rows:55% 45%;flex:1;border:1px solid #879092;background:#cfd3d2}.c620-service{display:grid;grid-template-rows:1fr 1fr;border-bottom:2px solid #70787b}.c620-pon-row{display:grid;grid-template-columns:28px 1fr 28px;align-items:stretch;border-bottom:1px solid #939a9b;background:linear-gradient(#e4e6e4,#bec4c3)}.c620-pon-row>label,.c620-pon-row>em{display:grid;place-items:center;color:#485154;font-size:6px;font-style:normal;font-weight:900;writing-mode:vertical-rl}.c620-ports{display:grid;grid-template-columns:repeat(16,1fr);gap:4px;padding:6px}.c620-port{position:relative;min-width:0;padding:0;border:1px solid #636c6f;border-radius:1px;background:#1c2326;cursor:pointer}.c620-port i{position:absolute;inset:2px;border:1px solid #0b1012;background:linear-gradient(135deg,#111719 0 48%,#596164 49% 61%,#0d1214 62%)}.c620-port small{position:absolute;left:50%;top:-6px;transform:translateX(-50%);color:#485154;font-size:5px}.c620-port:hover,.c620-port.selected{outline:2px solid var(--cyan);outline-offset:1px;box-shadow:0 0 8px #5ce1e677}.c620-port.online{border-bottom:2px solid var(--green)}.c620-port.warning{border-bottom:2px solid var(--yellow)}.c620-port.critical{border-bottom:2px solid var(--red)}.c620-port.disabled{opacity:.38}.c620-system{display:grid;grid-template-columns:1fr 1.45fr 2.2fr;gap:5px;padding:5px;background:#cbd0cf}.c620-system>div{position:relative;border:1px solid #858e90;background:linear-gradient(#e2e5e3,#b9c0bf)}.c620-system label{position:absolute;top:2px;left:3px;color:#515b5e;font-size:5px}.c620-power{display:flex;align-items:center;gap:9px;padding:10px}.c620-power i{width:36px;height:27px;border:3px solid #3e474a;border-radius:3px;background:#111719;box-shadow:inset 0 -5px #4e585b}.c620-power span{width:26px;height:14px;border:2px solid #6c7476;border-radius:40%;background:#b7bdbc;box-shadow:inset 0 0 0 3px #333c3e}.c620-power b{width:8px;height:8px;border-radius:50%;background:#4fd09d;box-shadow:0 0 5px #4fd09d}.c620-uplink,.c620-control{display:grid;grid-template-columns:repeat(4,1fr);align-items:end;gap:5px;padding:13px 8px 6px}.c620-uplink span,.c620-control i{height:23px;border:2px solid #4c5659;background:#111719;box-shadow:inset 0 0 0 3px #7e888a}.c620-control{grid-template-columns:repeat(8,1fr)}.c620-control i{height:20px}.c620-control b{height:14px;border:1px solid #555f61;background:#172023}.olt-tile>.c620-drawing{height:48px;margin-bottom:12px;padding:4px 7px}.olt-tile>.c620-drawing .c620-ear{width:5px;top:6px;bottom:4px}.olt-tile>.c620-drawing .c620-ear i,.olt-tile>.c620-drawing .c620-brand strong,.olt-tile>.c620-drawing .c620-brand span,.olt-tile>.c620-drawing .c620-brand em,.olt-tile>.c620-drawing label,.olt-tile>.c620-drawing .c620-port small{display:none}.olt-tile>.c620-drawing .c620-brand{width:21px;padding:4px 2px}.olt-tile>.c620-drawing .c620-brand b{font-size:4px;padding:0 1px}.olt-tile>.c620-drawing .c620-ports{gap:1px;padding:2px}.olt-tile>.c620-drawing .c620-system{gap:1px;padding:1px}.olt-tile>.c620-drawing .c620-power{padding:2px;gap:2px}.olt-tile>.c620-drawing .c620-power i{width:8px;height:6px;border-width:1px}.olt-tile>.c620-drawing .c620-power span{width:6px;height:4px;border-width:1px}.olt-tile>.c620-drawing .c620-power b{width:2px;height:2px}.olt-tile>.c620-drawing .c620-uplink,.olt-tile>.c620-drawing .c620-control{gap:1px;padding:2px}.olt-tile>.c620-drawing .c620-uplink span,.olt-tile>.c620-drawing .c620-control i{height:5px;border-width:1px}.olt-tile>.c620-drawing .c620-control b{height:3px}.device-hero .c620-drawing.detail{height:185px}@media(max-width:700px){.device-hero .c620-drawing.detail{height:125px;padding:9px 15px}.c620-brand{width:43px;padding:7px 3px}.c620-brand strong,.c620-brand span{display:none}.c620-ear{width:13px;top:11px;bottom:8px}.c620-pon-row{grid-template-columns:14px 1fr 14px}.c620-ports{gap:1px;padding:3px}.c620-system{gap:2px;padding:2px}.c620-power{padding:4px;gap:3px}.c620-power i{width:18px;height:14px}.c620-power span{width:12px;height:8px}.c620-uplink,.c620-control{gap:2px;padding:7px 3px 3px}.c620-uplink span,.c620-control i{height:13px}}
.c600-drawing{position:relative;width:100%;max-width:820px;height:360px;margin:0 auto;padding:54px 29px 18px;border:2px solid #1c2730;border-radius:4px;background:linear-gradient(90deg,#5e6870,#cbd0cf 3%,#b7bdbc 97%,#56616a);box-shadow:inset 0 0 0 3px #101820,0 13px 30px #0009;overflow:hidden}.c600-cap{position:absolute;inset:0 0 auto;height:55px;padding:10px 16px;background:repeating-linear-gradient(90deg,#17232c 0 5px,#202f39 6px 10px);border-bottom:5px solid #59636b;color:#d4dcdf}.c600-cap b{display:inline-block;padding:2px 6px;background:#1e95be;color:white;font-size:11px}.c600-cap strong{margin-left:8px;font-size:9px}.c600-cap span{display:inline-block;width:46px;height:7px;margin-left:34%;background:#dcad25}.c600-cap em{float:right;padding:3px 7px;background:#d8ad2d;color:#1c2226;font-size:7px;font-style:normal;font-weight:900}.c600-bank{display:grid;grid-template-columns:repeat(7,1fr) 1.9fr repeat(8,1fr);gap:3px;height:100%;padding:4px;border:1px solid #626c70;background:#7c8589}.c600-card,.c600-controller{position:relative;min-width:0;padding:17px 3px 16px;border:1px solid #81898b;background:linear-gradient(90deg,#dfe2e0,#aeb5b5,#e8eae8);box-shadow:inset 0 0 0 1px #f7f8f6}.c600-card:before,.c600-controller:before,.c600-card:after,.c600-controller:after{content:"";position:absolute;left:50%;width:7px;height:7px;transform:translateX(-50%);border:1px solid #7a8384;border-radius:50%;background:#e2e5e3}.c600-card:before,.c600-controller:before{top:4px}.c600-card:after,.c600-controller:after{bottom:4px}.c600-card>label,.c600-controller>label{position:absolute;top:15px;right:2px;color:#424a4c;font-size:5px;writing-mode:vertical-rl}.c600-leds{display:grid;grid-template-columns:repeat(3,3px);justify-content:center;gap:2px;margin:1px 0 8px}.c600-leds b{width:3px;height:3px;border-radius:50%;background:#667072}.c600-leds b:first-child{background:#4fd09e;box-shadow:0 0 3px #4fd09e}.c600-ports{display:grid;grid-template-columns:1fr 1fr;gap:5px 3px}.c600-port{position:relative;display:block;height:23px;padding:0;border:0;background:transparent}.c600-port i{position:absolute;inset:2px;border:2px solid #4d575a;background:linear-gradient(135deg,#111719 0 47%,#646d70 48% 62%,#0d1214 63%);box-shadow:inset 0 0 0 2px #1e272a}.c600-port small{position:absolute;left:-1px;top:7px;color:#444c4e;font-size:4px}.c600-port:hover i,.c600-port.selected i{border-color:var(--cyan);box-shadow:0 0 7px #5ce1e6}.c600-port.online i{border-bottom-color:var(--green)}.c600-port.warning i{border-bottom-color:var(--yellow)}.c600-port.critical i{border-bottom-color:var(--red)}.c600-port.disabled{opacity:.36}.c600-card>em{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);padding:2px 3px;background:#dcb32f;color:#262b2d;font-size:5px;font-style:normal;font-weight:900}.c600-center{display:grid;grid-template-columns:1fr 1fr;gap:3px}.c600-controller{padding:18px 4px}.c600-controller .c600-leds{grid-template-columns:repeat(2,3px);margin-bottom:26px}.c600-ctrl-grid{display:grid;grid-template-columns:1fr;gap:7px}.c600-ctrl-grid i{width:18px;height:15px;margin:auto;border:2px solid #4f595b;background:#12191c}.c600-controller strong{position:absolute;left:50%;bottom:48px;width:16px;height:27px;transform:translateX(-50%);border:2px solid #596264;background:linear-gradient(#12191c 0 43%,#b7bdba 44% 58%,#12191c 59%)}.c600-controller span{position:absolute;left:50%;bottom:16px;width:18px;height:12px;transform:translateX(-50%);border:2px solid #5b6466;border-radius:40%;background:#bbc1bf;box-shadow:inset 0 0 0 3px #30383a}.c600-ear{position:absolute;z-index:3;top:57px;bottom:15px;width:23px;border:1px solid #2e3941;background:#657078;display:flex;flex-direction:column;justify-content:space-around;align-items:center}.c600-ear.left{left:3px}.c600-ear.right{right:3px}.c600-ear i{width:9px;height:9px;border:2px solid #d3d7d5;border-radius:50%;background:#202a31}.c600-base{position:absolute;inset:auto 0 0;height:15px;border-top:2px solid #687277;background:#172229}.olt-tile>.c600-drawing{height:48px;margin-bottom:12px;padding:11px 7px 3px;border-width:1px}.olt-tile>.c600-drawing .c600-cap{height:11px;padding:1px 4px;border-bottom-width:1px}.olt-tile>.c600-drawing .c600-cap b,.olt-tile>.c600-drawing .c600-cap strong,.olt-tile>.c600-drawing .c600-cap span,.olt-tile>.c600-drawing .c600-cap em,.olt-tile>.c600-drawing .c600-ear,.olt-tile>.c600-drawing .c600-base,.olt-tile>.c600-drawing label,.olt-tile>.c600-drawing .c600-leds,.olt-tile>.c600-drawing .c600-port small,.olt-tile>.c600-drawing .c600-card>em,.olt-tile>.c600-drawing .c600-controller strong,.olt-tile>.c600-drawing .c600-controller span{display:none}.olt-tile>.c600-drawing .c600-bank{gap:1px;padding:1px}.olt-tile>.c600-drawing .c600-card,.olt-tile>.c600-drawing .c600-controller{padding:2px 1px}.olt-tile>.c600-drawing .c600-card:before,.olt-tile>.c600-drawing .c600-card:after,.olt-tile>.c600-drawing .c600-controller:before,.olt-tile>.c600-drawing .c600-controller:after{display:none}.olt-tile>.c600-drawing .c600-ports{gap:1px}.olt-tile>.c600-drawing .c600-port{height:3px}.olt-tile>.c600-drawing .c600-port i{inset:0;border-width:1px}.olt-tile>.c600-drawing .c600-ctrl-grid{gap:1px}.olt-tile>.c600-drawing .c600-ctrl-grid i{width:3px;height:3px;border-width:1px}.device-hero .c600-drawing.detail{height:360px}@media(max-width:700px){.device-hero .c600-drawing.detail{height:240px;padding:41px 17px 13px}.c600-cap{height:42px}.c600-cap span,.c600-cap em{display:none}.c600-ear{top:44px;bottom:11px;width:14px}.c600-bank{gap:1px}.c600-card{padding:12px 1px}.c600-ports{gap:2px 1px}.c600-port{height:14px}.c600-port i{border-width:1px}.c600-center{gap:1px}.c600-controller{padding:12px 1px}.c600-controller .c600-leds{margin-bottom:12px}.c600-ctrl-grid{gap:3px}.c600-ctrl-grid i{width:9px;height:8px}.c600-controller strong{width:9px;height:17px;bottom:32px}.c600-controller span{width:10px;height:7px}}
.integration-page{max-width:1500px}.integration-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:20px;padding:8px 2px}.integration-head h3{margin:5px 0 3px;font-size:25px}.integration-head p{margin:0;color:var(--muted);font-size:13px}.integration-head .primary{width:auto;margin:0}.integration-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}.integration-stats>div{padding:17px;border:1px solid var(--line);border-radius:10px;background:linear-gradient(145deg,#0e1727,#09101c)}.integration-stats small,.integration-endpoint small{display:block;color:#63758d;font-size:9px;letter-spacing:.12em}.integration-stats b{display:block;margin:5px 0 1px;font-size:24px}.integration-stats span{color:#73839a;font-size:11px}.integration-stats .sim-label{color:var(--yellow);font-size:18px}.integration-panel{overflow:hidden}.integration-list{display:grid}.integration-row{display:grid;grid-template-columns:190px minmax(150px,1fr) minmax(170px,.85fr) minmax(150px,.75fr) 120px 105px;gap:16px;align-items:center;padding:15px 20px;border-top:1px solid #18253a}.integration-row:first-child{border-top:0}.integration-row:hover{background:#101a2a}.integration-model{position:relative}.integration-model>.mini-device,.integration-model>.c320-drawing,.integration-model>.c300-drawing,.integration-model>.c600-drawing,.integration-model>.c620-drawing{height:44px;margin:0;padding-top:7px}.integration-model>.c300-drawing,.integration-model>.c600-drawing{padding:9px 6px 3px}.integration-model>.c320-drawing{padding:3px 8px}.integration-model>.c620-drawing{padding:4px 7px}.integration-model>.status{position:absolute;right:5px;bottom:-7px;font-size:8px}.integration-main small{color:#61738b;font-size:9px}.integration-main h4{margin:2px 0;font-size:14px}.integration-main p,.integration-endpoint span{display:block;margin:0;color:#718198;font-size:10px}.integration-endpoint b{display:block;margin:4px 0 1px;font-size:12px}.credential-state{display:flex;align-items:center;gap:7px;color:#7f8ea3;font-size:10px}.credential-state i{width:8px;height:8px;border-radius:50%;background:#536174}.credential-state.ready i{background:var(--green);box-shadow:0 0 7px #54d6a166}.credential-state.ready{color:#91bfae}.test-connection{padding:9px 10px;border:1px solid #2b4058;border-radius:7px;background:#111d2e;color:#b7c6d8;font-size:10px;cursor:pointer}.test-connection:hover{border-color:var(--cyan);color:#fff}.integration-note{display:flex;gap:16px;margin-top:14px;padding:15px 18px;border:1px solid #5ce1e626;border-radius:10px;background:#5ce1e608}.integration-note b{white-space:nowrap;color:#bfeff1;font-size:12px}.integration-note span{color:#7f93a9;font-size:11px}.olt-form{position:relative;max-height:66vh;overflow:auto;padding-right:4px;scrollbar-color:#30425a #0d1423}.modal-error{padding:11px 13px;border:1px solid #ff738566;border-radius:8px;background:#ff738512;color:#ff9cab;font-size:12px}.form-section{display:flex;justify-content:space-between;align-items:end;margin-top:5px;padding:10px 0 6px;border-bottom:1px solid #24334a}.form-section b{font-size:13px}.form-section span{color:#718198;font-size:10px}.snmp-v3-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:14px;border:1px solid #213149;border-radius:9px;background:#09111e}.snmp-v3-fields label:last-child{grid-column:1/-1}.olt-actions{position:sticky;z-index:3;bottom:-22px;margin:8px -4px -22px;padding:14px 4px 22px;background:linear-gradient(transparent,#0d1423 16%);border-top:1px solid #1a2940}.olt-actions .primary:disabled{cursor:wait;opacity:.65}@media(max-width:1200px){.integration-row{grid-template-columns:150px 1fr 1fr 110px}.integration-row .integration-endpoint:nth-of-type(4){display:none}.credential-state{display:none}}@media(max-width:760px){.integration-head{align-items:flex-start;gap:15px}.integration-head p{display:none}.integration-stats{grid-template-columns:1fr 1fr}.integration-row{grid-template-columns:1fr auto;padding:14px}.integration-model{grid-column:1/-1}.integration-row .integration-endpoint{display:none}.integration-note{display:block}.integration-note b,.integration-note span{display:block}.integration-note span{margin-top:5px}.snmp-v3-fields{grid-template-columns:1fr}}
.integration-actions{display:grid;grid-template-columns:1fr 1fr;gap:5px}.integration-actions button{padding:7px 8px;border:1px solid #2b4058;border-radius:6px;background:#111d2e;color:#b7c6d8;font-size:9px;cursor:pointer}.integration-actions .test-connection{grid-column:1/-1}.integration-actions button:hover{border-color:var(--cyan);color:#fff}.integration-actions .danger{border-color:#ff738533;color:#ff8b99}.integration-actions .danger:hover{border-color:var(--red);background:#ff738512}.delete-confirm{display:grid;gap:16px;padding:22px 24px}.delete-warning{padding:15px;border:1px solid #ff738544;border-radius:9px;background:#ff73850b}.delete-warning b,.delete-warning span{display:block}.delete-warning b{color:#ff9aa6}.delete-warning span{margin-top:4px;color:#8494aa;font-size:12px}.delete-confirm label{color:#9cacbf;font-size:12px;font-weight:700}.delete-confirm input{display:block;width:100%;margin-top:8px;padding:13px 14px;border:1px solid var(--line);border-radius:9px;background:#0b1220;color:var(--text)}.danger-button{padding:10px 14px;border:1px solid #ff738566;border-radius:8px;background:#ff738518;color:#ff9aa6;font-weight:800;cursor:pointer}@media(min-width:1201px){.integration-row{grid-template-columns:180px minmax(135px,1fr) minmax(160px,.85fr) minmax(145px,.75fr) 110px 125px}}
.onu-clickable{cursor:pointer}.onu-clickable:hover td{background:rgba(83,215,225,.045)}
.onu-detail-card{margin-top:16px}.onu-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);padding:1px}.onu-detail-grid>div{background:var(--panel);padding:24px;display:flex;flex-direction:column;gap:8px;min-height:130px}.onu-detail-grid small{color:var(--muted);font-size:11px;letter-spacing:.12em}.onu-detail-grid b{font-size:20px}.onu-detail-grid button{align-self:flex-start;background:transparent;border:1px solid var(--line);color:var(--cyan);padding:6px 10px;border-radius:6px}.signal-gauge{height:18px;background:#172238;border-radius:20px;overflow:hidden}.signal-gauge i{display:block;height:100%;background:linear-gradient(90deg,#ff667d,#ffc85c,#53d7a2);border-radius:20px}
@media(max-width:900px){.onu-detail-grid{grid-template-columns:1fr}}
.metric-charts{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}.metric-svg{width:100%;height:auto;min-height:240px;background:#09111f;border:1px solid var(--line);border-radius:8px}.metric-svg line{stroke:#21304a;stroke-width:1}.metric-svg text{fill:var(--muted);font-size:11px}.metric-svg path{fill:none;stroke:var(--cyan);stroke-width:3;stroke-linejoin:round;stroke-linecap:round}.metric-svg circle{fill:#ffc85c;stroke:#09111f;stroke-width:3}.metric-svg .chart-time{font-size:10px}.chart-current{display:flex;gap:5px;color:var(--muted);margin-top:10px}.chart-current b{color:var(--text)}.chart-empty{height:240px;display:grid;place-items:center;color:var(--muted);border:1px dashed var(--line);border-radius:8px}
@media(max-width:1100px){.metric-charts{grid-template-columns:1fr}}
.traffic-svg .download-line{stroke:#4d8dff}.traffic-svg .upload-line{stroke:#ff9f43}.traffic-legend{display:flex;gap:18px;align-items:center;margin-top:10px;color:var(--muted)}.traffic-legend span:before{content:"";display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px}.traffic-legend .download:before{background:#4d8dff}.traffic-legend .upload:before{background:#ff9f43}.traffic-legend b{color:var(--text)}.traffic-legend small{margin-left:auto}
.onu-list-head{align-items:center;gap:18px;flex-wrap:wrap}.onu-toolbar{display:flex;align-items:center;gap:9px;margin-left:auto;flex-wrap:wrap}.onu-toolbar input,.onu-toolbar select{height:40px;background:#09111f;border:1px solid var(--line);color:var(--text);border-radius:7px;padding:0 12px}.onu-toolbar select{min-width:140px}.onu-search{position:relative}.onu-search span{position:absolute;left:12px;top:8px;color:var(--muted);font-size:20px}.onu-search input{width:285px;padding-left:37px}.onu-toolbar .ghost{height:40px;padding:0 15px}.onu-toolbar input:focus,.onu-toolbar select:focus{outline:none;border-color:var(--cyan)}
@media(max-width:900px){.onu-toolbar{width:100%;margin-left:0}.onu-search,.onu-search input{width:100%}.onu-toolbar select{flex:1}}
.discovery-page .integration-head{margin-bottom:18px}.discovery-time{font-size:18px!important}.discovery-search{width:260px;background:#09111f;border:1px solid var(--line);color:var(--text);padding:10px 12px;border-radius:7px}.discovery-empty{min-height:260px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}.discovery-empty b{color:var(--text);font-size:18px}.discovery-empty span{color:var(--muted)}
.auto-onu-id{display:inline-grid;place-items:center;min-width:38px;height:30px;padding:0 8px;border-radius:7px;background:rgba(83,215,225,.12);color:var(--cyan)}
.actions .danger{border-color:#ff738555;color:#ff9aa6}.actions .danger:hover{background:#ff738518;border-color:var(--red)}