.tramBoard{display:grid;gap:10px;margin-top:35px;background:#111;padding:20px}.tramBoard article{display:grid;grid-template-columns:150px 100px 1fr;align-items:center;gap:16px;padding:18px;background:#202526;color:#fff;border-left:8px solid #7f8b8d}.tramBoard article b{font-size:21px}.tramBoard article span{color:#111;background:#d8e100;padding:9px;text-align:center;font-weight:900}.tramBoard article strong{font-size:21px}.tramBoard article small{grid-column:1/-1;color:#b8c2c3}.tramBoard .tram-service{border-color:#36a85d}.tramBoard .tram-fault{border-color:#e30613}.tramBoard .tram-break{border-color:#f0a51b}.activeTramAdmin{margin-top:30px}.activeTramAdmin article{padding:18px;margin-top:14px;background:#f4f1ee;border:1px solid #ddd}.activeTramAdmin article>header{position:static;min-height:0;padding:0 0 14px;background:transparent}.activeTramAdmin article>form:first-of-type{grid-template-columns:repeat(2,minmax(0,1fr))}.activeTramAdmin article>form:first-of-type button{grid-column:span 2}@media(max-width:700px){.tramBoard article{grid-template-columns:1fr}.tramBoard article small{grid-column:auto}.activeTramAdmin article>form:first-of-type{grid-template-columns:1fr}.activeTramAdmin article>form:first-of-type button{grid-column:auto}}
.gpsScreen{margin-top:35px;background:#101619;border:10px solid #2c3336;color:#fff}.gpsScreen>header{position:static;min-height:0;padding:13px 18px;background:#182125;color:#fff}.gpsMap{position:relative;height:520px;overflow:hidden;background-color:#10191c;background-image:linear-gradient(#314047 1px,transparent 1px),linear-gradient(90deg,#314047 1px,transparent 1px),repeating-linear-gradient(35deg,transparent 0 70px,#62818b55 72px 75px,transparent 77px 140px);background-size:40px 40px,40px 40px,auto}.gpsMap button{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);display:grid;margin:0;padding:7px 10px;background:#d8e100;color:#111;border:2px solid #fff;box-shadow:0 0 15px #d8e100}.gpsMap button small{font-size:10px}@media(max-width:700px){.gpsMap{height:360px}}

/* Verkehrsunternehmens-Leitstelle */
.controlOpsPage{margin:0;background:#0a0e11;color:#e8edef;font-family:Arial,sans-serif}.controlOpsPage>footer{display:none}.opsTopbar{position:sticky;top:0;z-index:20;min-height:70px;padding:0 24px;background:#11171b;border-bottom:1px solid #29343a;display:flex;justify-content:space-between;align-items:center}.opsTopbar a,.opsTopbar>div{display:flex;align-items:center;gap:13px;color:#fff}.opsTopbar img{width:44px;height:44px;border-radius:50%;object-fit:cover}.opsTopbar a span{display:grid}.opsTopbar small{color:#829097}.opsTopbar>div>a{padding:10px 14px;background:#242d32;border:1px solid #39464d}.systemOnline{color:#9dd9ac}.systemOnline i{display:inline-block;width:8px;height:8px;margin-right:6px;border-radius:50%;background:#4bd477;box-shadow:0 0 10px #4bd477}.opsShell{display:grid;grid-template-columns:64px minmax(0,1fr);min-height:calc(100vh - 70px)}.opsRail{background:#0e1418;border-right:1px solid #263037;display:flex;flex-direction:column;align-items:center;gap:8px;padding:18px 8px}.opsRail b{display:grid;place-items:center;width:38px;height:38px;margin-bottom:20px;background:#d62932;border-radius:7px}.opsRail span{width:100%;padding:12px 2px;color:#687880;font-size:9px;font-weight:900;text-align:center;border-left:3px solid transparent}.opsRail span.active{color:#fff;background:#1c252a;border-color:#d62932}.opsContent{padding:28px clamp(18px,3vw,46px) 60px;min-width:0}.opsHeading{position:static;min-height:0;padding:0 0 24px;background:transparent;display:flex;justify-content:space-between;align-items:end;border-bottom:1px solid #253037}.opsHeading>div:first-child small{color:#e54a55;font-weight:900;letter-spacing:.14em}.opsHeading h1{margin:5px 0 4px;font-size:42px;letter-spacing:-.04em}.opsHeading p{margin:0;color:#839097}.opsHeading>div:last-child{display:grid;text-align:right}.opsHeading>div:last-child span,.opsHeading>div:last-child small{color:#718087;font-size:10px;letter-spacing:.1em}.opsHeading>div:last-child b{font:700 24px monospace;color:#fff;margin:3px 0}
.controlWorkspace{display:grid;gap:16px;margin-top:20px}.controlStats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.controlStats article{position:relative;padding:16px 18px;background:#151c20;border:1px solid #29343a;border-left:4px solid #52636b;border-radius:4px;display:grid;gap:6px}.controlStats article small{color:#829097;font-size:10px;text-transform:uppercase;letter-spacing:.09em}.controlStats article b{font:700 28px monospace;color:#fff}.controlStats article i{position:absolute;right:12px;top:14px;color:#8e9ba1;font:700 9px Arial;font-style:normal}.controlStats article i.green{color:#5dda7e}.controlStats article i.amber{color:#f1bc4c}.controlStats article i.red{color:#ff5b65}.controlSituation{min-height:54px;padding:10px 16px;background:#151c20;border:1px solid #29343a;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px}.controlSituation>div{display:flex;align-items:center;gap:9px}.controlSituation>div strong{padding-left:8px;color:#60db80}.controlSituation p{margin:0;color:#8c999f;font-size:12px}.controlSituation time{font:700 20px monospace}.pulse{width:9px;height:9px;border-radius:50%;background:#56da7a;box-shadow:0 0 0 5px #56da7a1c}.controlMainGrid{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,.75fr);gap:12px}.controlWorkspace .gpsScreen{margin:0;border:1px solid #29343a;background:#101619}.controlWorkspace .gpsScreen>header{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;background:#151d21;border-bottom:1px solid #2c383e}.controlWorkspace .gpsScreen header span{display:grid}.controlWorkspace .gpsScreen header small{color:#78878e}.mapLegend{display:flex;align-items:center;gap:7px;color:#849198;font-size:10px}.mapLegend i{width:9px;height:9px;border-radius:50%;background:#d8e100}.mapLegend i.fault{margin-left:8px;background:#ff3b47}.controlWorkspace .gpsMap{height:430px;background-color:#0c1519;background-image:linear-gradient(#233138 1px,transparent 1px),linear-gradient(90deg,#233138 1px,transparent 1px),repeating-linear-gradient(32deg,transparent 0 68px,#55717c55 70px 73px,transparent 75px 136px);background-size:34px 34px,34px 34px,auto}.controlWorkspace .gpsMap button{border-radius:3px}.controlWorkspace .gpsMap .map-fault{background:#f43d49;box-shadow:0 0 18px #f43d49;color:#fff}.mapLabel{position:absolute;color:#597079;font-size:10px;font-weight:900;letter-spacing:.12em}.mapLabel.north{top:12%;right:16%}.mapLabel.center{top:51%;left:43%}.mapLabel.depot{bottom:9%;left:12%}.controlEvents{background:#151c20;border:1px solid #29343a}.controlEvents>header{position:static;min-height:0;padding:14px;background:#1b2429;display:flex;justify-content:space-between}.controlEvents>header span{color:#78878e;font-size:11px}.controlEvents article{display:grid;grid-template-columns:45px 1fr;gap:10px;padding:13px;border-bottom:1px solid #273238}.controlEvents article time{font:700 11px monospace;color:#819097}.controlEvents article div{display:grid;gap:3px}.controlEvents article span{color:#7e8c92;font-size:11px}.controlEvents .eventFault{border-left:3px solid #ff4652}.noEvents{min-height:260px;display:grid;place-content:center;text-align:center;gap:7px;color:#809097}.noEvents span{font-size:30px;color:#53d779}.noEvents small{color:#637178}
.fleetBoard{background:#151c20;border:1px solid #29343a}.fleetBoard>header{position:static;min-height:0;padding:16px 18px;background:#1b2429;display:flex;justify-content:space-between;align-items:center}.fleetBoard header small{color:#df4550;font-size:9px;letter-spacing:.12em}.fleetBoard h2{margin:3px 0 0;font-size:20px}.fleetBoard>header>span{color:#77868d;font-size:11px}.fleetTable{overflow:visible}.fleetHead,.fleetRow{display:grid;grid-template-columns:70px minmax(150px,1.2fr) 65px minmax(150px,1.2fr) 90px 115px 95px;gap:12px;align-items:center}.fleetHead{padding:10px 16px;color:#6f7f87;font-size:9px;text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid #29343a}.fleetRow{position:relative;padding:15px 16px;border-bottom:1px solid #253037}.fleetRow>span{display:grid;color:#d7dddf}.fleetRow>span small{color:#718087}.fleetRow>em{justify-self:start;min-width:35px;padding:8px;background:#d7df00;color:#111;text-align:center;font-style:normal;font-weight:900;border-radius:3px}.fleetRow>.statusBadge{display:block;padding:7px 8px;background:#203b2b;color:#6fe28b;text-align:center;border-radius:20px;font-size:10px}.fleet-fault>.statusBadge{background:#492126;color:#ff7a83}.fleet-break>.statusBadge{background:#493b20;color:#ffd06b}.fleetRow details{position:relative}.fleetRow summary{cursor:pointer;color:#fff;background:#29353b;padding:8px;text-align:center;list-style:none;border-radius:3px;font-size:11px}.fleetRow details[open]{grid-column:1/-1;margin-top:8px;padding:16px;background:#0e1417;border:1px solid #344149}.fleetRow details[open] summary{position:absolute;right:10px;top:10px}.fleetRow details form{display:grid;grid-template-columns:100px minmax(180px,1fr) 170px auto;gap:10px;align-items:end}.fleetRow details label{color:#8d9ba1;font-size:10px}.fleetRow details input,.fleetRow details select{margin-top:5px;background:#182125;border:1px solid #35434a;color:#fff}.fleetRow details button{margin:0}.fleetRow .removeVehicle{display:block;margin-top:10px}.fleetRow .removeVehicle button{padding:8px 12px}.signalInfo{display:block;margin-top:10px;color:#627279}.emptyControl{padding:45px;text-align:center;display:grid;gap:8px;color:#78878e}.emptyControl b{color:#fff}
body:not(.controlOpsPage) .controlWorkspace{color:#111}body:not(.controlOpsPage) .controlWorkspace .fleetBoard,body:not(.controlOpsPage) .controlWorkspace .controlEvents,body:not(.controlOpsPage) .controlWorkspace .controlSituation{color:#fff}
@media(max-width:1100px){.controlStats{grid-template-columns:repeat(2,1fr)}.controlMainGrid{grid-template-columns:1fr}.fleetHead{display:none}.fleetRow{grid-template-columns:70px 1fr 60px 1fr}.fleetRow>:nth-child(5),.fleetRow>:nth-child(6){display:none}.fleetRow details{justify-self:end}.fleetRow details form{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.opsTopbar{padding:10px 14px}.opsTopbar>div>span{display:none}.opsShell{grid-template-columns:1fr}.opsRail{display:none}.opsContent{padding:20px 12px}.opsHeading{align-items:start}.opsHeading>div:last-child{display:none}.controlStats{grid-template-columns:1fr 1fr}.controlSituation{grid-template-columns:1fr auto}.controlSituation p{display:none}.controlWorkspace .gpsMap{height:340px}.fleetRow{grid-template-columns:55px 1fr 55px}.fleetRow>:nth-child(4){display:none}.fleetRow details form{grid-template-columns:1fr}.fleetRow details[open]{grid-column:1/-1}}
.driverReports{background:#151c20;border:1px solid #29343a}.driverReports>header{position:static;min-height:0;padding:15px 18px;background:#1b2429;display:flex;justify-content:space-between;align-items:center}.driverReports header small{color:#df4550;font-size:9px;letter-spacing:.12em}.driverReports h2{margin:3px 0 0;font-size:20px}.driverReports>header>b{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#d62932;color:#fff}.driverReports article{display:grid;grid-template-columns:130px minmax(0,1fr) minmax(230px,340px);gap:16px;align-items:center;padding:15px 18px;border-top:1px solid #29343a}.driverReports article p{margin:4px 0;color:#d8dfe1}.driverReports article small{color:#708087}.reportType{padding:7px 9px;border-radius:3px;background:#3d3020;color:#ffd077;text-align:center;font-size:10px;font-weight:900;text-transform:uppercase}.report-fault,.report-accident{background:#482126;color:#ff7d86}.report-passenger{background:#25344a;color:#8ebcff}.driverReports article form{display:grid;grid-template-columns:1fr auto;gap:8px;margin:0}.driverReports article input{background:#0f1518;border:1px solid #35434a;color:#fff}.driverReports article button{margin:0;padding:9px 12px}.noDriverReports{padding:24px;color:#74838a;text-align:center}@media(max-width:800px){.driverReports article{grid-template-columns:1fr}.driverReports article form{grid-template-columns:1fr}}