:root{--bg: #070b12;--bg-card: #0d1420;--border: #22314a;--text: #e8eef7;--muted: #8796ad;--accent: #38bdf8;--accent-2: #34d399;--accent-3: #fbbf24;--danger: #ef4444;--warn: #f59e0b;--radius: 14px;--radius-sm: 9px;--nav-width: 240px;--glass: rgba(13, 20, 32, .78);--glass-border: rgba(255, 255, 255, .08);--shadow: 0 14px 40px rgba(0, 0, 0, .45);--font: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;--mono: "JetBrains Mono", ui-monospace, monospace}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font);background:var(--bg);color:var(--text);font-size:14.5px;line-height:1.45;background-image:radial-gradient(1200px 600px at 85% -10%,rgba(56,189,248,.1),transparent 60%),radial-gradient(900px 500px at -10% 110%,rgba(52,211,153,.07),transparent 60%),linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:auto,auto,32px 32px,32px 32px;min-height:100vh}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}h1{font-size:1.6rem;font-weight:700;letter-spacing:-.01em;margin-bottom:1rem}h1 small{font-size:.95rem;font-weight:500}h2{font-size:1.1rem;font-weight:650}h3{font-size:1rem}h4{font-size:.9rem;margin-bottom:.4rem}.muted{color:var(--muted)}.small{font-size:.85rem}.mono{font-family:var(--mono);font-size:.82rem}.break{word-break:break-all}.glass{background:var(--glass);border:1px solid var(--glass-border);border-radius:var(--radius);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.shell{display:flex;min-height:100vh}.nav{position:fixed;inset:12px auto 12px 12px;width:var(--nav-width);display:flex;flex-direction:column;padding:1rem .75rem;z-index:30}.brand{display:flex;gap:.7rem;align-items:center;padding:.25rem .5rem 1rem;border-bottom:1px solid var(--glass-border);margin-bottom:.75rem}.brand strong{font-size:1.15rem;display:block}.brand small{color:var(--muted);font-size:.75rem}.logo{width:36px;height:36px;flex:none}.nav nav{display:flex;flex-direction:column;gap:2px;flex:1;overflow:auto}.nav nav a{display:flex;align-items:center;gap:.65rem;padding:.55rem .7rem;border-radius:var(--radius-sm);color:var(--text);opacity:.82;font-weight:500}.nav nav a:hover{background:#ffffff0d;text-decoration:none;opacity:1}.nav nav a.active{background:linear-gradient(90deg,#38bdf833,#38bdf80a);opacity:1;box-shadow:inset 2px 0 0 var(--accent)}.ni{width:1.3rem;text-align:center;color:var(--accent)}.nav-user{border-top:1px solid var(--glass-border);padding-top:.75rem;display:flex;flex-direction:column;gap:.5rem}.user-chip{display:flex;gap:.6rem;align-items:center;color:var(--text)}.user-chip small{display:block;color:var(--muted);font-size:.75rem}.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#04111c;font-weight:700}.main{flex:1;margin-left:calc(var(--nav-width) + 24px);min-width:0;display:flex;flex-direction:column}.topbar{display:none}.content{padding:1.5rem 1.5rem 1rem;max-width:1500px;width:100%}.foot{padding:1rem 1.5rem;font-size:.8rem}.page{display:flex;flex-direction:column;gap:1rem}.page>h1{margin-bottom:0}.card{padding:1.1rem 1.2rem}.card-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:.8rem}.toolbar{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}.title-row{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap}.title-row h1{margin:0}.back{font-size:.85rem}.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1rem}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;border:1px solid var(--border);background:#ffffff0a;color:var(--text);padding:.5rem .9rem;border-radius:var(--radius-sm);font:inherit;font-weight:550;cursor:pointer;transition:.15s;white-space:nowrap}.btn:hover{border-color:var(--accent)}.btn:disabled{opacity:.5;cursor:default}.btn.primary{background:linear-gradient(135deg,#38bdf8,#0ea5e9);border-color:transparent;color:#03131f}.btn.primary:hover{filter:brightness(1.1)}.btn.ghost{background:transparent}.btn.danger{border-color:#ef444473;color:#fca5a5;background:transparent}.btn.danger:hover{background:#ef44441f}.btn.sm{padding:.25rem .55rem;font-size:.8rem}.btn.icon{padding:.35rem .6rem}.btn.block{width:100%}.actions{text-align:right;white-space:nowrap}.actions .btn{margin-left:.25rem}input,select,textarea{font:inherit;color:var(--text);background:#0a111c;border:1px solid var(--border);border-radius:var(--radius-sm);padding:.5rem .65rem;min-width:0}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #38bdf82e}input[type=checkbox]{width:18px;height:18px;accent-color:var(--accent)}.search{width:200px}.field{display:flex;flex-direction:column;gap:.3rem}.field>span{font-size:.8rem;color:var(--muted);font-weight:550}.field.check{flex-direction:row-reverse;justify-content:flex-end;align-items:center;gap:.5rem}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem 1rem}.full{grid-column:1 / -1}.form-actions{display:flex;justify-content:flex-end;gap:.5rem;margin-top:.5rem}.stack{display:flex;flex-direction:column;gap:.8rem}.fiber-select{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.alert{padding:.65rem .85rem;border-radius:var(--radius-sm);border:1px solid;font-size:.9rem}.alert.error{border-color:#ef444466;background:#ef44441a;color:#fecaca}.alert.ok{border-color:#34d39966;background:#34d3991a;color:#a7f3d0}.alert.demo{border-color:#fbbf2473;background:#fbbf2414;color:#fde68a}.alert-inline{color:#fca5a5}.empty,.loading{padding:1.2rem;color:var(--muted);text-align:center;border:1px dashed var(--border);border-radius:var(--radius-sm)}.table-wrap{overflow-x:auto}.table{width:100%;border-collapse:collapse}.table th{text-align:left;font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);padding:.5rem .6rem;border-bottom:1px solid var(--border);white-space:nowrap}.table td{padding:.55rem .6rem;border-bottom:1px solid rgba(255,255,255,.05);vertical-align:middle}.table tr.clickable{cursor:pointer}.table tr.clickable:hover td{background:#38bdf80d}.table.compact td,.table.compact th{padding:.3rem .4rem;font-size:.82rem}.table.perm td.yes{color:var(--accent-2);text-align:center;font-weight:700}.table.perm td.no{color:var(--muted);text-align:center}.badge{display:inline-block;padding:.12rem .5rem;border-radius:999px;font-size:.72rem;font-weight:650;background:#ffffff14;border:1px solid rgba(255,255,255,.1);margin-right:.25rem;white-space:nowrap}.st-geplant{background:#94a3b826;color:#cbd5e1}.st-verlegt{background:#38bdf826;color:#7dd3fc}.st-gespleisst{background:#a78bfa2e;color:#c4b5fd}.st-gemessen{background:#fbbf2426;color:#fde68a}.st-abgenommen{background:#34d39929;color:#6ee7b7}.st-bad{background:#ef444429;color:#fca5a5}.st-warn{background:#f59e0b29;color:#fcd34d}.badge.demo{background:#fbbf2426;color:#fde68a;margin-left:.4rem}.role-admin{color:#fca5a5}.role-planer{color:#7dd3fc}.role-techniker{color:#fde68a}.role-leser{color:#cbd5e1}.res-ok{color:#6ee7b7}.res-grenzwertig{color:#fde68a}.res-nicht_ok{color:#fca5a5}.legend{display:flex;gap:.3rem;flex-wrap:wrap}.fcolor{display:inline-flex;align-items:center;gap:.35rem}.fdot{width:13px;height:13px;border-radius:50%;border:1px solid rgba(255,255,255,.35);display:inline-block;flex:none}.fdot.ring{outline:2px dashed rgba(0,0,0,.7);outline-offset:-4px}.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:.8rem}.kpi{padding:.9rem 1rem;display:flex;flex-direction:column;gap:.3rem}.kpi small{color:var(--muted)}.kpi strong{font-size:1.6rem}.bar{display:flex;height:6px;border-radius:4px;overflow:hidden;background:#ffffff0f}.seg{height:100%}.seg.st-geplant{background:#64748b}.seg.st-verlegt{background:#38bdf8}.seg.st-gespleisst{background:#a78bfa}.seg.st-gemessen{background:#fbbf24}.seg.st-abgenommen{background:#34d399}.kv{display:grid;grid-template-columns:max-content 1fr;gap:.35rem 1rem}.kv dt{color:var(--muted);font-size:.85rem}.kv.cols{grid-template-columns:repeat(auto-fill,minmax(110px,max-content) minmax(160px,1fr))}.modal-back{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;background:#02060cb8;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:grid;place-items:center;z-index:1000;padding:1rem;isolation:isolate}.modal-back+.modal-back{z-index:1001}body.modal-open{overflow:hidden}.modal{width:min(560px,100%);max-height:92vh;display:flex;flex-direction:column;background:#0d1420}.modal.wide{width:min(980px,100%)}.modal-head{display:flex;justify-content:space-between;align-items:center;padding:.9rem 1.1rem;border-bottom:1px solid var(--glass-border)}.modal-body{padding:1.1rem;overflow:auto;display:flex;flex-direction:column;gap:.8rem}.auth-screen,.center-screen{min-height:100vh;display:grid;place-items:center;padding:1rem}.auth-card{width:min(420px,100%);padding:2rem;display:flex;flex-direction:column;gap:1rem}.auth-brand{display:flex;gap:.9rem;align-items:center}.auth-brand .logo{width:52px;height:52px}.auth-brand h1{margin:0}.secret{display:block;font-family:var(--mono);font-size:1.2rem;letter-spacing:.08em;padding:.7rem;background:#050a12;border:1px dashed var(--accent);border-radius:var(--radius-sm);text-align:center}.racks{display:flex;gap:1.2rem;flex-wrap:wrap;align-items:flex-start}.rack{width:360px;max-width:100%;border:1px solid var(--border);border-radius:10px;background:#080d16;overflow:hidden}.rack.side-aktiv{border-color:#38bdf859}.rack.side-passiv{border-color:#34d39959}.rack-head{padding:.55rem .7rem;border-bottom:1px solid var(--border);background:#ffffff08}.rack-head small{display:block;color:var(--muted);font-size:.75rem}.rack-body{padding:6px 14px;background:repeating-linear-gradient(90deg,#1a2333 0 6px,transparent 6px calc(100% - 6px),#1a2333 calc(100% - 6px))}.he{display:flex;align-items:center;gap:.5rem;border-bottom:1px solid rgba(255,255,255,.04);cursor:pointer;padding:0 .4rem;font-size:.78rem}.he:hover{background:#38bdf80f}.he-no{width:2.6rem;color:var(--muted);font-family:var(--mono);font-size:.7rem;flex:none}.he-free{color:#ffffff2e}.he-label{display:flex;flex-direction:column;line-height:1.15;overflow:hidden}.he-label small{color:var(--muted);font-size:.68rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.he.used{border-radius:4px;margin:1px 0;border:1px solid rgba(255,255,255,.1)}.he.cat-patchfeld{background:linear-gradient(90deg,#34d39938,#34d3990f)}.he.cat-spleiss{background:linear-gradient(90deg,#a78bfa3d,#a78bfa0f)}.he.cat-aktiv{background:linear-gradient(90deg,#38bdf83d,#38bdf80f)}.he.cat-sonstiges{background:#94a3b81f}.tabs{display:flex;gap:.3rem}.tab{background:transparent;border:1px solid var(--border);color:var(--text);padding:.35rem .8rem;border-radius:999px;cursor:pointer;font:inherit}.tab.active{background:var(--accent);color:#03131f;border-color:transparent;font-weight:650}.cassettes{display:grid;grid-template-columns:1fr;gap:.8rem}.cassette{overflow-x:auto;border:1px solid var(--border);border-radius:10px;padding:.6rem}.tubes{display:flex;flex-direction:column;gap:.8rem}.tube{border:1px solid var(--border);border-radius:10px;padding:.6rem}.tube-head{display:flex;align-items:center;gap:.4rem;font-weight:650;margin-bottom:.5rem}.fibers{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:.4rem}.fiber-chip{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem;padding:.4rem .5rem;border-radius:8px;background:#ffffff08;border:1px solid rgba(255,255,255,.06);cursor:pointer;font-size:.8rem}.fiber-chip:hover{border-color:var(--accent)}.fiber-chip small{color:var(--muted)}.fiber-chip .svc{width:100%;color:var(--accent-3)}.trace-link{margin-left:auto;font-size:.75rem}.trace-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.8rem}.trace-summary small{display:block;color:var(--muted)}.trace-summary strong{font-size:1.15rem}.trace{list-style:none;display:flex;flex-direction:column}.hop>div{display:flex;gap:.8rem;align-items:flex-start;padding:.55rem 0}.hop-ico{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;flex:none;background:#0a111c;border:2px solid var(--accent);color:var(--accent)}.hop-connection .hop-ico{border-color:#a78bfa;color:#c4b5fd;width:26px;height:26px;margin-left:4px;margin-right:4px}.hop-end:last-child .hop-ico{border-color:var(--accent-2);color:var(--accent-2)}.hop-line{width:34px;align-self:stretch;flex:none;background:linear-gradient(var(--accent),var(--accent)) center / 3px 100% no-repeat;min-height:42px}.hop-fiber>div{padding:0;align-items:center}.att-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.6rem}.att{border:1px solid var(--border);border-radius:10px;overflow:hidden;display:flex;flex-direction:column}.att img{width:100%;height:130px;object-fit:cover}.att-icon{height:80px;display:grid;place-items:center;font-size:2rem;background:#ffffff08}.att-meta{padding:.5rem;display:flex;flex-direction:column;gap:.25rem}.att-meta strong{font-size:.82rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(max-width:900px){.nav{transform:translate(-110%);transition:transform .25s;inset:0 auto 0 0;border-radius:0}.nav.open{transform:none}.nav-back{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:20}.main{margin-left:0}.topbar{display:flex;align-items:center;gap:.6rem;padding:.6rem 1rem;position:sticky;top:0;z-index:10;background:#070b12e6;border-bottom:1px solid var(--glass-border)}.topbrand{display:flex;align-items:center;gap:.5rem;font-weight:700}.topbrand .logo{width:26px;height:26px}.content{padding:1rem}.form-grid{grid-template-columns:1fr}.search{width:100%}.table thead{display:none}.table tr{display:block;border-bottom:1px solid var(--border);padding:.4rem 0}.table td{display:flex;justify-content:space-between;gap:1rem;border:none;padding:.25rem .4rem}.table td:before{content:attr(data-label);color:var(--muted);font-size:.75rem}.table td.actions{justify-content:flex-end}.table td.actions:before{content:none}.cassettes,.fiber-select{grid-template-columns:1fr}}.rack-frame{display:flex;gap:6px;padding-left:6px}.rack-frame .rack-body{flex:1}.tower{width:74px;flex:none;margin:6px 0;border:1px solid rgba(167,139,250,.45);border-radius:6px;background:#a78bfa1a;padding:4px;cursor:pointer;display:flex;flex-direction:column;font-size:.66rem;line-height:1.15}.tower:hover{border-color:#c4b5fd}.tower small{color:var(--muted)}.tower-stack{display:flex;flex-direction:column;gap:1px;margin-top:4px;flex:1}.tower-stack span{height:3px;background:#c4b5fd59;border-radius:1px}.rack{width:440px}.tower-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(54px,1fr));gap:4px}.cas{background:#0a111c;border:1px solid var(--border);color:var(--text);border-radius:6px;padding:3px;cursor:pointer;display:flex;flex-direction:column;align-items:center;font:inherit;font-size:.72rem}.cas small{color:var(--muted);font-size:.62rem}.cas.part{background:#fbbf2424;border-color:#fbbf2480}.cas.full{background:#a78bfa38;border-color:#a78bfa}.cas.sel{outline:2px solid var(--accent)}.as-frei{color:#cbd5e1}.as-reserviert{background:#fbbf2426;color:#fde68a}.as-gespleisst{background:#34d39929;color:#6ee7b7}.cat-HK{background:#38bdf826;color:#7dd3fc}.cat-HAK{background:#fb923c29;color:#fdba74}.cat-INHOUSE{background:#f472b626;color:#f9a8d4}