html, body {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}
    :root{
      --bg: #e9effa;
      --card: #ffffff;
      --accent: #1e88e5;
      --accent-soft: rgba(30,136,229,0.12);
      --muted: #5f6b7a;
      --text: #102133;
      --border: #d0d7e2;
    }
    *{box-sizing:border-box;font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif}
    body{
      margin:0;
      background:linear-gradient(180deg,#f5f7fc,#dde3f2);
      color:var(--text);
      padding:18px;
    }
    .page{max-width:100%;margin:0;}

    h1{
      font-size:1.5rem;
      margin:0 0 4px;
      letter-spacing:.03em;
    }
    h2{
      font-size:1rem;
      margin:0 0 8px;
      text-transform:uppercase;
      letter-spacing:.12em;
      color:var(--muted);
    }
    .subtitle{
      font-size:.85rem;
      color:var(--muted);
      margin-bottom:8px;
    }

    .layout-top{
      display:flex;
      flex-wrap:wrap;
      gap:12px;
      margin-bottom:4px;   /* tighter space under the tables */
      align-items:flex-start;
    }
    .card{
      background:#ffffff;
      border-radius:14px;
      border:1px solid var(--border);
      padding:12px 14px;
      box-shadow:0 10px 30px rgba(15,35,70,0.12);
    }
    .card.scenario{
      flex:1 1 520px;
      min-width:440px;
    }
    .card.controls{
      flex:1 1 320px;
      min-width:320px;
    }
    .card.sim-card{
      margin-top:0;
    }

    .card.controls-placeholder{
      flex:1 1 320px;
      min-height:240px;
    }

    .sim-controls{
      margin-top:4px;
      margin-bottom:8px;
      padding:8px 10px;
      background:#f4f7fd;
      border-radius:12px;
      border:1px solid #dde4f3;
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      align-items:flex-end;
    }
    .sim-controls-main{
      flex:1 1 520px;
      min-width:260px;
    }
    .sim-controls-side{
      flex:0 0 220px;
      min-width:200px;
      display:flex;
      flex-direction:column;
      gap:4px;
      font-size:.75rem;
      color:var(--muted);
    }
    .sim-metrics{
      text-align:right;
    }
    .sim-controls-side input{
      width:100%;
      background:#f4f7fd;
      border-radius:9px;
      border:1px solid #c5d4f1;
      padding:3px 6px;
      font-size:.72rem;
      color:var(--text);
    }
    .sim-controls-side label{
      font-size:.68rem;
      text-transform:uppercase;
      letter-spacing:.12em;
    }
    @media (max-width:900px){
      .sim-controls{
        flex-direction:column;
        align-items:stretch;
      }
    }

    .card.schedule{
      margin-top:12px;
    }

    .pill{
      display:inline-flex;
      align-items:center;
      gap:4px;
      padding:2px 8px;
      border-radius:999px;
      background:var(--accent-soft);
      color:var(--accent);
      font-size:.7rem;
      text-transform:uppercase;
      letter-spacing:.12em;
      margin-bottom:4px;
    }
    .pill span{
      display:inline-block;
      width:6px;
      height:6px;
      border-radius:999px;
      background:var(--accent);
    }

    
    /* Median headway pill (green/amber/red) */
    .pill.hw-ok{
      background:#ecfdf3;
      border:1px solid #bbf7d0;
      color:#166534;
    }
    .pill.hw-warn{
      background:#fffbeb;
      border:1px solid #fed7aa;
      color:#92400e;
    }
    .pill.hw-bad{
      background:#fef2f2;
      border:1px solid #fecaca;
      color:#b91c1c;
    }

.scenario-title{
      font-weight:600;
      font-size:.9rem;
      margin-bottom:4px;
    }
    .scenario-text{
      font-size:.78rem;
      color:var(--muted);
      margin-bottom:6px;
    }
    .scenario-view-toggle{
      display:flex;
      gap:6px;
      flex-wrap:wrap;
    }
    .scenario-view-toggle-row{
      margin-top:6px;
      margin-bottom:4px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:8px;
      flex-wrap:wrap;
    }
    .download-csv-inline{ white-space:nowrap; }
    .view-toggle{
      border-radius:999px;
      border:1px solid #c5d4f1;
      background:#f4f7fd;
      color:var(--muted);
      font-size:.7rem;
      padding:4px 10px;
      cursor:pointer;
      text-transform:uppercase;
      letter-spacing:.09em;
    }
    .view-toggle.active{
      background:var(--accent);
      color:#ffffff;
      border-color:var(--accent);
    }

    .scenario-table-wrapper{
      max-height:260px;
      overflow:auto;
      border-radius:10px;
      border:1px solid #dde4f3;
    }
    table{
      width:100%;
      border-collapse:collapse;
      font-size:.72rem;
    }
    thead{
      background:#f4f7fd;
      position:sticky;
      top:0;
      z-index:1;
    }
    th,td{
      padding:4px 6px;
      border-bottom:1px solid #e1e6f3;
      white-space:nowrap;
      text-align:left;
    }
    th{
      font-weight:600;
      color:var(--muted);
      text-transform:uppercase;
      letter-spacing:.1em;
      font-size:.7rem;
    }
    .scenario-table input{
      width:42px;
      background:#fff;
      border-radius:6px;
      border:1px solid #c5d4f1;
      padding:2px 4px;
      font-size:.7rem;
    }
    .headway-green{background:#e8f5e9;color:#2e7d32;font-weight:600;}
    .headway-red{background:#ffebee;color:#c62828;font-weight:600;}
    .headway-blue{background:#e3f2fd;color:#1565c0;font-weight:600;}
    .early{background:#fff3e0;color:#e65100;font-weight:600;}
    .late{background:#fce4ec;color:#c2185b;font-weight:600;}
    .ontime{background:#e8f5e9;color:#2e7d32;font-weight:600;}

    .controls-header{
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      gap:8px;
      margin-bottom:6px;
    }
    .controls-header-left{
      max-width:70%;
    }
    .sim-time-top{
      font-family:"JetBrains Mono",Consolas,monospace;
      font-size:.78rem;
      color:var(--muted);
      text-align:right;
    }
    .btn-row-top{
      display:flex;
      justify-content:flex-end;
      gap:6px;
      margin-top:4px;
      flex-wrap:wrap;
    }

    button{
      border:none;
      border-radius:999px;
      background:var(--accent);
      color:#ffffff;
      font-size:.8rem;
      padding:7px 12px;
      cursor:pointer;
      font-weight:600;
      letter-spacing:.08em;
      text-transform:uppercase;
      box-shadow:0 8px 20px rgba(30,136,229,0.35);
      white-space:nowrap;
    }
    button.secondary{
      background:#f4f7fd;
      color:var(--accent);
      border:1px solid #c5d4f1;
      box-shadow:none;
    }
    button:active{
      transform:translateY(1px);
      box-shadow:0 4px 12px rgba(30,136,229,0.25);
    }
    button:disabled{
      opacity:0.4;
      cursor:not-allowed;
      box-shadow:none;
    }

    .control-block-text{
      font-size:.78rem;
      color:var(--muted);
      margin-bottom:8px;
    }

    .control-inputs{
      display:flex;
      gap:6px;
      align-items:flex-end;
      margin-top:6px;
      flex-wrap:wrap;
    }
    .control-inputs label{
      font-size:.68rem;
      color:var(--muted);
      display:block;
      margin-bottom:2px;
      text-transform:uppercase;
      letter-spacing:.12em;
    }
    .control-inputs input{
      width:90px;
      background:#f4f7fd;
      border-radius:9px;
      border:1px solid #c5d4f1;
      padding:3px 6px;
      color:var(--text);
      font-size:.72rem;
      outline:none;
    }
    .control-inputs select{
      background:#f4f7fd;
      border-radius:9px;
      border:1px solid #c5d4f1;
      padding:4px 6px;
      color:var(--text);
      font-size:.72rem;
      outline:none;
      min-width:120px;
    }
    .control-inputs input:focus,
    .control-inputs select:focus{
      border-color:#1e88e5;
      box-shadow:0 0 0 1px rgba(30,136,229,.25);
    }

    .control-row{
      margin-top:6px;
      font-size:.8rem;
      color:var(--muted);
    }
    .control-row span.value{color:var(--text);font-weight:600;}

    .control-buttons{
      margin-top:6px;
      display:flex;
      gap:4px;
      flex-wrap:wrap;
    }

    .scenario-header{
      margin-top:4px;
      font-size:.8rem;
      color:var(--muted);
    }
    .scenario-header span.value{color:var(--text);font-weight:600;}

    .sim-card-header{
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:8px;
      margin-bottom:4px;
    }
    .sim-header-left{
      display:flex;
      flex-direction:column;
      gap:2px;
    }
    
    .sim-header-right{
      text-align:right;
      font-size:.78rem;
      color:var(--muted);
    }
    .location-select{
      background:#f4f7fd;
      border-radius:9px;
      border:1px solid #c5d4f1;
      padding:3px 6px;
      font-size:.72rem;
      color:var(--text);
      outline:none;
    }
    .metric-label-small{
      font-size:.68rem;
      text-transform:uppercase;
      letter-spacing:.12em;
      color:var(--muted);
    }
    .metric-value-small{
      font-size:1rem;
      font-weight:600;
    }

    
    .bus-tooltip{
      position:fixed;
      padding:4px 8px;
      border-radius:8px;
      background:rgba(15,23,42,0.96);
      color:#f9fafb;
      font-size:.7rem;
      pointer-events:none;
      box-shadow:0 4px 12px rgba(15,23,42,0.4);
      white-space:nowrap;
      z-index:999999;
      display:none;
    }
.track-wrapper{
      margin-top:6px;
      background:#f4f7fd;
      border-radius:16px;
      padding:18px 16px 16px;
      border:1px solid #dde4f3;
      position:relative;
      overflow:hidden;
    }
    .track-label{
      position:absolute;
      font-size:.75rem;
      text-transform:uppercase;
      letter-spacing:.16em;
      color:var(--muted);
      display:flex;
      flex-direction:column;
      gap:2px;
    }
    .track-label .main-line{
      display:flex;
      align-items:center;
      gap:4px;
    }
    .track-label span.dot{
      width:7px;
      height:7px;
      border-radius:999px;
      background:var(--accent);
    }
    .track-label.top{left:14px;top:18px;}
    .track-label.bottom{right:14px;bottom:18px;align-items:flex-end;}
    .next-bus{
      font-size:.65rem;
      color:var(--muted);
      letter-spacing:0;
      text-transform:none;
      margin-left:14px;
    }
    .track-label.bottom .next-bus{
      margin-left:0;
      margin-right:14px;
    }

    /* AVL SVG needs extra vertical space so inbound banners rendered *below* buses
       are not clipped at the bottom edge. Also allow overflow for tags/banners. */
    svg{width:100%;height:270px;display:block;overflow:visible;}
    .track-line{
      stroke:#c4d0e8;
      stroke-width:3;
      stroke-linecap:round;
    }
    /* Broken white overlay across the whole route (grey+white as requested) */
    .track-line-hatch{
      stroke:rgba(255,255,255,0.95);
      stroke-width:2;
      stroke-linecap:round;
      stroke-dasharray:10 10;
      pointer-events:none;
    }
    .bus-rect{
      rx:9;
      ry:9;
      stroke:#0f172a;
      stroke-width:0.9;
      stroke-dasharray:none;
      shape-rendering:geometricPrecision;
      filter:drop-shadow(0 4px 6px rgba(15,23,42,0.20));
      transition:transform .18s ease, filter .18s ease;
    }
    
    .bus-good{fill:#fdd835;}
    .bus-close{fill:#e53935;}
    .bus-wide{fill:#43a047;}
    .bus-recovery{fill:#90a4ae;opacity:.95;}
    .headway-band{opacity:0.55;}
    .headway-band-good{fill:#fdd835;}
    .headway-band-close{fill:#e53935;}
    .headway-band-wide{fill:#43a047;}
    
    /* Pulse animations for problem buses */
    @keyframes busPulseClose{
      0%{transform:scale(1); filter:drop-shadow(0 4px 6px rgba(239,68,68,0.55));}
      50%{transform:scale(1.03); filter:drop-shadow(0 6px 10px rgba(239,68,68,0.85));}
      100%{transform:scale(1); filter:drop-shadow(0 4px 6px rgba(239,68,68,0.55));}
    }
    @keyframes busPulseWide{
      0%{transform:scale(1); filter:drop-shadow(0 4px 6px rgba(34,197,94,0.40));}
      50%{transform:scale(1.03); filter:drop-shadow(0 6px 10px rgba(34,197,94,0.80));}
      100%{transform:scale(1); filter:drop-shadow(0 4px 6px rgba(34,197,94,0.40));}
    }
    .bus-rect.bus-close{
      animation:busPulseClose 1.4s ease-in-out infinite;
    }
    .bus-rect.bus-wide{
      animation:busPulseWide 2.0s ease-in-out infinite;
    }
    /* Extra outline to make problem buses stand out even on low-contrast projectors */
    .bus-rect.bus-close,
    .bus-rect.bus-wide{
      stroke:#111827;
      stroke-width:1.2;
    }

    
    /* Stronger highlight for selected bus */
    .bus-rect.bus-selected{
      stroke-width:2;
      stroke:#0ea5e9;
      filter:drop-shadow(0 0 0 rgba(0,0,0,0)) drop-shadow(0 0 0 rgba(0,0,0,0)) drop-shadow(0 0 0 rgba(0,0,0,0));
      outline:2px solid transparent;
    }

    /* Brief emphasis when status flips into too close / too far */
    .bus-node.bus-status-emphasis{
      filter:brightness(1.25);
    }


    /* London vs Riyadh colour modes */
    body.london-mode .bus-good,
    body.london-mode .headway-band-good{
      fill:#fdd835; /* yellow for perfect headway */
    }
    body.london-mode .bus-wide,
    body.london-mode .headway-band-wide{
      fill:#43a047; /* green for far / wide gaps */
    }
    body.london-mode .legend-swatch.legend-good{
      background:#fdd835;
    }
    body.london-mode .legend-swatch.legend-wide{
      background:#43a047;
    }
    body.riyadh-mode .legend-swatch.legend-good{
      background:#43a047;
    }
    body.riyadh-mode .legend-swatch.legend-wide{
      background:#1e88e5;
    }

    /* London-specific table & label colours */
    body.london-mode .headway-green{
      /* Perfect headway shown as yellow in London */
      background:#fff9c4;
      color:#f57f17;
    }
    body.london-mode .headway-blue{
      /* Wide gaps shown as green in London */
      background:#e8f5e9;
      color:#2e7d32;
    }
    body.london-mode .bus-label{
      /* Black text on yellow/green tiles for better contrast */
      fill:#111827 !important;
    }

    .bus-selected .bus-rect{
      stroke:#ffffff;
      stroke-width:2;
      filter:drop-shadow(0 5px 10px rgba(15,23,42,0.35));
    }

    .bus-node{
      cursor:pointer;
      /* Avoid CSS transforms on SVG groups – they can fight with the SVG 'transform' attribute and cause hover-jitter */
      transition:filter .18s ease;
      transform-box: fill-box;
      transform-origin: center;
    }

    .bus-node.bus-hover{
      /* No translate/scale here to prevent the bus from visually 'jumping' when paused */
      filter:drop-shadow(0 7px 14px rgba(15,23,42,0.35));
    }

    .bus-node.bus-hover .bus-rect{
      animation:busGlow .7s ease-in-out alternate infinite;
      filter:drop-shadow(0 7px 14px rgba(37,99,235,0.55)) brightness(1.04);
    }

    .bus-label{
      font-size:.63rem;
      pointer-events:none;
      fill:#ffffff;
      text-shadow:0 1px 2px rgba(15,23,42,0.55);
    }
    .bus-line-1{font-weight:700;}
    .bus-line-2{font-size:.65rem;font-weight:700;}
    .bus-line-3{font-size:.6rem;font-weight:500;opacity:.9;}

    /* Incident ribbon inside bus box (clear at any zoom) */
    /* High-contrast incident banner (same visual weight as HOLD) */
    .bus-incident-ribbon{
      fill: #111827;           /* near-black background */
      stroke: #ef4444;         /* red outline */
      stroke-width: 1.4;
    }
    .bus-incident-ribbon-text{
      font-size: 11px;
      font-weight: 800;
      fill: #ffffff;           /* white text */
      paint-order: stroke;
      stroke: rgba(0,0,0,0.6); /* subtle dark stroke for any background */
      stroke-width: 1.6;
      stroke-linejoin: round;
      letter-spacing: 0.6px;
    }

    .bus-tag{
      font-size:.55rem;
      pointer-events:none;
      fill:#ffffff;
      text-anchor:start;
    }

    /* Incident tag banner (high contrast, must stay readable even on grey buses) */
    .bus-tag-incident-rect{
      fill: #111827 !important;      /* near-black background */
      stroke: #ef4444 !important;    /* red outline */
      stroke-width: 1.4 !important;
      opacity: 1 !important;
      filter: none !important;
    }

    .bus-tag-incident-text{
      fill: #ffffff !important;
      font-weight: 800;
      letter-spacing: 0.6px;
      paint-order: stroke;
      stroke: rgba(0,0,0,0.70);
      stroke-width: 1.8;
      stroke-linejoin: round;
      opacity: 1 !important;
    }
    .bus-trip{
      font-size:.55rem;
      pointer-events:none;
      fill:#ffffff;
      text-anchor:end;
    }

    /* tiny front "nose" piece – direction marker, filled in JS */
    .bus-nose{
      fill:rgba(15,23,42,0.16);
      stroke:rgba(15,23,42,0.55);
      stroke-width:0.7;
    }

    @keyframes busGlow{
      0%{
        filter:drop-shadow(0 0 0 rgba(59,130,246,0));
      }
      100%{
        filter:drop-shadow(0 0 10px rgba(59,130,246,0.9));
      }
    }


    .legend{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      margin-top:8px;
      font-size:.7rem;
      color:var(--muted);
    }
    .legend-item{display:flex;align-items:center;gap:5px;}
    
    .legend-swatch{
      width:14px;height:7px;
      border-radius:14px;
      border:1px solid rgba(0,0,0,.15);
    }
    .legend-swatch.legend-good{background:#43a047;}
    .legend-swatch.legend-close{background:#e53935;}
    .legend-swatch.legend-wide{background:#1e88e5;}
    .legend-swatch.legend-grey{background:#90a4ae;}
    
    /* Stand departure overlay inside track */
    .stand-overlay{
      position:absolute;
      top:100px;   /* align roughly with grey box */
      left:8px;  /* slightly more left */
      right:8px; /* stretch towards Aldgate side */
      display:flex;
      justify-content:space-between;
      gap:8px;
      font-size:.7rem;
      pointer-events:none; /* children opt back in */
      z-index:20;
    }
    .stand-box{
      flex:0 0 45px;    /* fixed compact width */
      min-width:65px;
      background:#e3ebfb;
      border-radius:10px;
      border:1px solid #c5d4f1;
      padding:6px 6px 4px;
      box-shadow:0 4px 10px rgba(15,35,70,0.18);
      pointer-events:auto;
    }
    .stand-box-inbound{
      /* sits nearer Stand A (left) */
    }
    .stand-box-outbound{
      /* sits nearer Stand B (right) */
    }
    .stand-title{
      font-weight:600;
      text-transform:uppercase;
      letter-spacing:.12em;
      font-size:.6rem;
      color:var(--muted);
      margin-bottom:3px;
    }
    .stand-list{
      display:flex;
      flex-direction:column;
      gap:2px;
      max-height:80px;
      overflow:auto;
    }
    .stand-row{
      display:flex;
      justify-content:space-between;
      align-items:center;
      padding:1px 4px;
      border-radius:6px;
      background:#f4f7fd;
      cursor:pointer;
      transition:background .15s ease, transform .12s ease;
    }
    .stand-row:hover{
      background:#d0ddfa;
      transform:translateY(-1px);
    }
    .stand-row.bus-selected{
      outline:1px solid #1e88e5;
      background:#cddbf9;
    }
    .stand-bus-label{
      font-weight:600;
    }
    .stand-time-label{
      font-family:"JetBrains Mono",Consolas,monospace;
      font-size:.7rem;
    }
items:center;
      padding:2px 4px;
      border-radius:6px;
      background:#e3ebfb;
      cursor:pointer;
      transition:background .15s ease, transform .12s ease;
    }
    .stand-row:hover{
      background:#d0ddfa;
      transform:translateY(-1px);
    }
    .stand-row.bus-selected{
      outline:1px solid #1e88e5;
      background:#cddbf9;
    }
    .stand-bus-label{
      font-weight:600;
    }
    .stand-time-label{
      font-family:"JetBrains Mono",Consolas,monospace;
      font-size:.7rem;
    }


    .schedule-table-wrapper{overflow:auto;margin-top:4px;max-height:260px;}
    /* Neater schedule tables: wrap names & zebra stripes */
    .schedule-table-wrapper table th,
    .schedule-table-wrapper table td{
      white-space:normal;
      word-break:keep-all;
      padding:1px 3px;
      font-size:.68rem;
    }
    .schedule-table-wrapper table tbody tr:nth-child(even){
      background:#f8fafc;
    }
    /* Highlight current bus row in the full schedule */
    .full-sched-row.bus-current{
      background:#fff3cd !important;
      font-weight:600;
    }
    /* Stronger highlight for the exact timing-point cell */
    .full-sched-row.bus-current td.bus-current-cell{
      background:#ffe8b3 !important;
    }

    /* Small dot indicators inside full schedule cells */
    .schedule-bus-dots{
      display:flex;
      flex-wrap:wrap;
      gap:2px;
      margin-top:1px;
    }
    .schedule-bus-dot{
      width:8px;
      height:8px;
      border-radius:50%;
      display:inline-block;
    }
    /* Abstract state classes */
    .schedule-bus-dot.state-ontime{opacity:0.95;}
    .schedule-bus-dot.state-early{opacity:0.95;}
    .schedule-bus-dot.state-late{opacity:0.95;}
    .schedule-bus-dot.state-action{opacity:0.95;}

    /* London theme colours */
    body.london-mode .schedule-bus-dot.state-ontime{background:#fdd835;} /* yellow perfect */
    body.london-mode .schedule-bus-dot.state-early{background:#66bb6a;}  /* green early */
    body.london-mode .schedule-bus-dot.state-late{background:#ef5350;}   /* red late */
    body.london-mode .schedule-bus-dot.state-action{background:#42a5f5;} /* blue for actions */

    /* Riyadh theme colours */
    body.riyadh-mode .schedule-bus-dot.state-ontime{background:#22c55e;} /* green good */
    body.riyadh-mode .schedule-bus-dot.state-early{background:#a3e635;}  /* lime early */
    body.riyadh-mode .schedule-bus-dot.state-late{background:#f97316;}   /* orange late */
    body.riyadh-mode .schedule-bus-dot.state-action{background:#6b7280;} /* grey for actions */



    .schedule-tables-row{display:flex;gap:10px;margin-top:6px;align-items:flex-start;}
    .schedule-table-card{flex:1 1 0;min-width:0;}
    .schedule-title{font-size:.8rem;font-weight:600;margin-bottom:4px;color:var(--muted);text-transform:uppercase;letter-spacing:.16em;}

    .status-ok{color:#2e7d32;}
    .status-close{color:#e53935;font-weight:600;}
    .status-wide{color:#1e88e5;font-weight:600;}
    .gap-ok{background:#e8f5e9;color:#2e7d32;font-weight:600;}
    .gap-close{background:#ffebee;color:#c62828;font-weight:600;}
    .gap-wide{background:#e3f2fd;color:#1565c0;font-weight:600;}

    /* Route infrastructure (stops/points + spine) */
    .route-point{
      fill:#f8fafc;               /* light fill so it pops on yellow/green spine */
      stroke:#111827;             /* strong outline */
      stroke-width:1.6;
      pointer-events:none;
      filter: drop-shadow(0 1px 2px rgba(0,0,0,.35));
    }
    .route-label{
      font-size:.6rem;
      fill:#111827;
      font-weight:600;
      dominant-baseline: middle;
      alignment-baseline: middle;
      pointer-events:none;
      paint-order: stroke;
      stroke: rgba(248,250,252,.95); /* halo for readability over buses */
      stroke-width:3;
      stroke-linejoin: round;
    }
    .route-connector{
      stroke:#c4d0e8;
      stroke-width:2;
      stroke-dasharray:2 2;
      stroke-linecap:round;
      pointer-events:none;
      shape-rendering: geometricPrecision;
    }
    /* City-specific connector colours */
    body.london-mode .route-connector{
      stroke:#fdd835;  /* operator yellow spine */
      stroke-width:10;
      stroke-dasharray:none;
    }
    body.riyadh-mode .route-connector{
      stroke:#43a047;  /* Riyadh green spine */
      stroke-width:10;
      stroke-dasharray:none;
    }
    body.london-mode .route-label{
      fill:#111827;
    }



    .bus-incident{

    /* Ghost (not logged on) buses: broken outline, no fill, no status colour */
    .bus-rect.bus-ghost{
      fill: none !important;
      stroke: #64748b !important;
      stroke-width: 1.4 !important;
      stroke-dasharray: 5 4 !important;
      opacity: 0.75;
      filter: none !important;
      animation: none !important;
    }
    .bus-node.bus-ghost .bus-label{
      fill: #334155 !important;
      text-shadow: none !important;
      opacity: 0.9;
    }

      fill:#263238;
      stroke:#ffffff;
      stroke-width:1.6;
    }

    .incident-popup{
      position:fixed;
      left:50%;
      top:50%;
      transform:translate(-50%, -50%) scale(.92);
      background:rgba(15,23,42,0.96);
      color:#f9fafb;
      padding:18px 26px;
      border-radius:18px;
      box-shadow:0 18px 45px rgba(15,23,42,0.7);
      font-size:.9rem;
      letter-spacing:.03em;
      opacity:0;
      pointer-events:none;
      z-index:9999;
      max-width:520px;
      text-align:center;
      transition:opacity .25s ease, transform .25s ease;
    
      white-space: pre-line;
}
    .incident-popup.show{
      opacity:1;
      transform:translate(-50%, -50%) scale(1);
    }

    /* Road-closure / diversion warning – full-width prominent banner */
    .incident-popup.road-closure-popup{
      left:50%;
      top:18%;
      transform:translate(-50%, -50%) scale(.96);
      width:min(1100px, 96vw);
      max-width:96vw;
      font-size:1.6rem;
      line-height:1.35;
      padding:26px 34px;
      border-radius:22px;
      box-shadow:0 22px 60px rgba(15,23,42,0.85);
      text-align:center;
    }
    .incident-popup.road-closure-popup.show{
      transform:translate(-50%, -50%) scale(1);
    }
    @media (max-width:900px){
      .card.scenario{min-width:100%;}
      .card.controls{min-width:100%;}
    }

    /* Bus command modal */
    .bus-command-backdrop{
      position:fixed;
      inset:0;
      background:rgba(15,23,42,0.35);
      display:none;
      align-items:center;
      justify-content:center;
      z-index:9999;
    }
    .bus-command-backdrop.show{
      display:flex;
    }
    .bus-command-dialog{
      transform: translateY(-75px); /* move up 2cm */
      background:#ffffff;
      border-radius:16px;
      padding:14px 16px 12px;
      box-shadow:0 18px 45px rgba(15,35,70,0.45);
      width:640px;
      max-width:96%;
      font-size:.8rem;
      color:var(--text);
    }
    .bus-command-header{
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:8px;
      margin-bottom:6px;
    }
    .bus-command-title{
      font-weight:600;
      font-size:.85rem;
    }
    .bus-command-close{
      background:#f4f7fd;
      color:var(--muted);
      box-shadow:none;
      border:1px solid #c5d4f1;
      padding:4px 8px;
      font-size:.8rem;
    }
    .bus-command-info{
      font-size:.75rem;
      color:var(--muted);
      margin-bottom:4px;
    }

    .bus-command-headway-line{
      margin-top:2px;
      font-size:.7rem;
      color:var(--muted);
    }
    .bus-command-info strong{
      color:var(--text);
      font-weight:600;
    }
    #busCommandMain{
      display:flex;
      flex-direction:column;
      gap:4px;
      margin-top:6px;
    }
    #busCommandMain button{
      width:100%;
      justify-content:center;
    }
    .bus-command-lock{
      margin-top:8px;
      padding:8px 10px;
      border-radius:10px;
      font-size:0.78rem;
      line-height:1.1rem;
      border:1px solid #fecaca;
      background:#fef2f2;
      color:#991b1b;
    }
    .bus-command-dialog.locked #busCommandMain button,
    .bus-command-dialog.locked .button-row button{
      opacity:0.55;
      cursor:not-allowed;
    }

    #busCommandHoldPane,
    #busCommandCurtailPane{
      margin-top:8px;
      font-size:.75rem;
    }
    #busCommandHoldPane label,
    #busCommandCurtailPane label{
      display:block;
      margin-bottom:4px;
      font-size:.7rem;
      text-transform:uppercase;
      letter-spacing:.12em;
      color:var(--muted);
    }
    #busCommandHoldPane input,
    #busCommandCurtailPane select{
      width:100%;
      background:#f4f7fd;
      border-radius:9px;
      border:1px solid #c5d4f1;
      padding:4px 6px;
      font-size:.8rem;
      margin-bottom:6px;
    }
    #busCommandHoldPane .button-row,
    #busCommandCurtailPane .button-row{
      display:flex;
      gap:6px;
      justify-content:flex-end;
    }

  
.hiddenControls {
  display: none !important;
}

.ewt-strip{
  margin:6px 0 4px 0;
  padding:4px 10px;
  border-radius:999px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:0.8rem;
  border:1px solid transparent;
  background:#f1f5f9;
}
.ewt-strip span.label{
  font-weight:600;
}

.theme-indicator-pill{
  margin-left:auto;
  padding:2px 8px;
  border-radius:999px;
  font-size:.7rem;
  background:#eef2ff;
  color:#4b5563;
  border:1px solid #c7d2fe;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.ewt-strip.ok{
  background:#ecfdf3;
  border-color:#bbf7d0;
  color:#166534;
}
.ewt-strip.warn{
  background:#fffbeb;
  border-color:#fed7aa;
  color:#92400e;
}
.ewt-strip.bad{
  background:#fef2f2;
  border-color:#fecaca;
  color:#b91c1c;
}

.ewt-compact {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 0.8rem;
  line-height: 1.1rem;
}

    .ewt-compact-line{
      width:100%;
      display:flex;
      flex-wrap:wrap;
      gap:6px;
      align-items:center;
      font-size:0.8rem;
    }
    .ewt-compact-line .spacer{
      margin:0 4px;
    }
    
/* Session header (trainer) */
.session-header{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:4px 10px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:14px;
  background:rgba(255,255,255,.06);
}
.session-label{
  opacity:.9;
  font-weight:600;
  white-space:nowrap;
}
.session-input{
  width:180px;
  max-width:40vw;
  padding:6px 10px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(0,0,0,.18);
  color:inherit;
  outline:none;
}
.session-input::placeholder{
  opacity:.7;
}

.ewt-start-row{
      justify-content:center;
      margin-top:-10px;
    }



.sim-controls-main .control-inputs,
.sim-controls-main .control-row{
  display:none;
}
.control-buttons #slowBtn,
.control-buttons #btnSkip,
.control-buttons #btnCurtail,
.control-buttons #btnDepart,
.control-buttons #btnCancelLast{
  display:none;
}
.control-buttons{
  justify-content:flex-start;
}

.container, .card, #avlPanel, .outer-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  border-radius: 0 !important;
}

#avlPanel svg {
  width: 100% !important;
}

/* Zebra stripes for LIVE (scenario) tables only */
.scenario-table tbody tr:nth-child(even){
  background:#f8fafc;
}

/* Slightly tighter rows so more buses fit on screen */
.scenario-table tbody tr td{
  padding-top:2px;
  padding-bottom:2px;
}

.simulator-layout{ padding-right:540px; }

/* Right-hand column: Stand A/B monitors + Dispatcher Log
   Fixed width, always fully visible, never stretches main simulator. */
.right-panel{
  position:fixed;
  top:10px;
  right:12px;
  bottom:25px;
  width:520px;
  z-index:9999;
  display:flex;
  flex-direction:column;
  gap:10px;
  pointer-events:auto;
}

/* Stand monitor should behave like a normal card inside the right-panel */
.right-panel .stand-hold-monitor{
  position:static;
  width:100%;
  padding:10px 12px;
  z-index:auto;
}

/* Dispatcher log card fills remaining height in the right-panel */
.right-panel .dispatch-log-card.dispatch-log-fixed{
  margin-top:0;
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0;
}
.right-panel .dispatch-log-card.dispatch-log-fixed .dispatch-log-wrapper{
  flex:1 1 auto;
  max-height:none;
}

/* Dispatcher log – operator style panel */
.dispatch-log-card{
  margin-top:12px;
  background:#ffffff;
  border-radius:14px;
  border:1px solid var(--border);
  padding:10px 12px;
  box-shadow:0 8px 24px rgba(15,35,70,0.14);
}

.dispatch-log-title{
  font-size:.8rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:var(--muted);
  margin-bottom:6px;
}

.dispatch-log-subtitle{
  font-size:.75rem;
  color:var(--muted);
  margin-bottom:6px;
}

.dispatch-log-wrapper{
  max-height:180px;
  overflow:auto;
  border-radius:10px;
  border:1px solid #dde4f3;
  background:#f8fafc;
}

.dispatch-log-wrapper table{
  width:100%;
  border-collapse:collapse;
  font-size:.7rem;
}

.dispatch-log-wrapper th,
.dispatch-log-wrapper td{
  padding:3px 6px;
  border-bottom:1px solid #e1e6f3;
  white-space:nowrap;
}

.dispatch-log-wrapper thead{
  background:#eef2ff;
}

.dispatch-log-wrapper th{
  font-weight:600;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.12em;
}

.dispatch-log-wrapper tbody tr:nth-child(even){
  background:#f4f7fd;
}

/* “now” time style – looks like AVL/ops log */
.dispatch-log-time{
  font-family:"JetBrains Mono",Consolas,monospace;
}

.dispatch-log-action{
  font-weight:600;
}

/* Colour pill for dispatcher log actions */
.log-tag{
  display:inline-block;
  padding:1px 6px;
  border-radius:999px;
  font-size:.6rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:#ffffff;
}
.log-hold{ background:#2563eb; }
.log-curtail{ background:#f97316; }
.log-incident{ background:#dc2626; }
.log-resume{ background:#16a34a; }


.dispatch-log-bus{
  font-weight:600;
}

/* Stand windows: bus number centered, time hidden, first row highlighted */
.stand-bus-label{
  flex:1 1 auto;
  text-align:center;
  font-size:0.85rem;
  font-weight:600;
}
.stand-time-label{
  display:none !important;
}
.stand-list .stand-row:first-child{
  outline:2px solid #2563eb;
  background:#dbeafe;
  box-shadow:0 0 0 1px rgba(37,99,235,0.35);
}


/* Hide Stand A/B overlay box completely (use only real stand buses on the line) */
.stand-overlay{display:none !important;}


/* Floating dispatcher log overlay inside the track panel */
.dispatch-log-floating{
  position:fixed;
  top:10px;
  right:12px;
  bottom:25px;
  width:520px;
  max-height:none;
  background:white;
  border-radius:12px;
  border:1px solid #c5d4f1;
  padding:10px;
  box-shadow:0 8px 24px rgba(15,35,70,0.20);
  z-index:9999;
  display:flex;
  flex-direction:column;
}

.dispatch-log-wrapper{
  flex:1;
  max-height:none;
  overflow-y:auto;
}

/* Make sure the track wrapper can host absolute children */
.track-wrapper{
  position:relative;
}



/* === Injected: London live-table colours + bus command mini-map === */

/* London-specific LIVE TABLE status & gap colours */
body.london-mode .status-ok{
  /* "Good" = yellow (matches perfect headway) */
  color:#fbbf24;
  font-weight:600;
}

body.london-mode .status-wide{
  /* "Too far" = green (matches wide-gap buses) */
  color:#22c55e;
  font-weight:600;
}

body.london-mode .gap-ok{
  /* Perfect headway row background = yellow */
  background:#fff9c4;
  color:#92400e;
  font-weight:600;
}

body.london-mode .gap-close{
  /* Keep close gaps clearly red */
  background:#ffebee;
  color:#c62828;
  font-weight:600;
}

body.london-mode .gap-wide{
  /* Wide gaps = green row background */
  background:#e8f5e9;
  color:#166534;
  font-weight:600;
}

/* Bus command – mini live route map */
.bus-command-body {
  display: flex;
  flex-direction: row;
  gap: 12px;
  margin-top: 6px;
}

.bus-command-main-col {
  flex: 1 1 auto;
  min-width: 0;
}

.bus-command-map-col {
  flex: 0 0 320px;  /* wider map pane */
  border-left: 1px solid #e2e8f0;
  padding-left: 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.bus-command-map-title {
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--muted);
}

#busCommandMapSvg {
  width: 100%;
  height: 220px;  /* taller map */
  border-radius: 10px;
  background: #f8fafc;
  box-shadow: inset 0 0 0 1px #e2e8f0;
}

/* Depart-at control (bus command modal, right column) */
.bus-depart-at {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid #e2e8f0;
}

.bus-depart-at-title {
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--muted);
  margin-bottom: 6px;
}

.bus-depart-at-row {
  display: flex;
  gap: 8px;
  align-items: center;
}

#busCmdDepartAtTime {
  flex: 1 1 auto;
  min-width: 0;
  padding: 10px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
}

#busCmdDepartAtApply {
  flex: 0 0 auto;
}

.bus-map-route {
  fill: none;
  stroke: #9ca3af;
  stroke-width: 6; /* wider base road */
}

body.london-mode #busCommandMapSvg .bus-map-route {
  stroke: #fbbf24; /* industry-style yellow spine */
  stroke-width: 10; /* wider carriageway */
}

body.riyadh-mode #busCommandMapSvg .bus-map-route {
  stroke: #22c55e; /* Riyadh green spine */
  stroke-width: 3;
}

.bus-map-stop {
  fill: #64748b;
}

.bus-map-stop-label {
  font-size: .55rem;
  fill: #475569;
}

.bus-map-bus-selected {
  fill: #1e293b;
  stroke: #ffffff;
  stroke-width: 1.6;
}

.bus-map-bus-other {
  fill: #0ea5e9;
  stroke: #e0f2fe;
  stroke-width: 1.2;
}

.bus-map-bus-label {
  font-size: .6rem;
  fill: #111827;
  font-weight: 600;
}

@media (max-width: 800px) {
  .bus-command-body {
    flex-direction: column;
  }
  .bus-command-map-col {
    border-left: none;
    border-top: 1px solid #e2e8f0;
    padding-left: 0;
    padding-top: 8px;
    flex: 1 1 auto;
  }
}



/* Direction-specific colours for mini route map buses */
.bus-map-bus-selected.bus-outbound,
.bus-map-bus-other.bus-outbound {
  fill: #22c55e; /* outbound = green */
}

.bus-map-bus-selected.bus-inbound,
.bus-map-bus-other.bus-inbound {
  fill: #3b82f6; /* inbound = blue */
}

/* Fullscreen route map overlay */
.bus-map-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,0.45);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

.bus-map-overlay.show {
  display: flex;
}

.bus-map-overlay-inner {
  background: #ffffff;
  border-radius: 18px;
  box-shadow: 0 24px 60px rgba(15,23,42,0.45);
  padding: 16px 20px 14px;
  width: min(950px, 96vw);
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.bus-map-overlay-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.9rem;
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 4px;
}

.bus-map-overlay-close {
  border: none;
  background: #e5e7eb;
  border-radius: 999px;
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
}

.bus-map-overlay-close:hover {
  background: #d1d5db;
}

#busMapOverlaySvg {
  width: 100%;
  height: 320px;
  border-radius: 12px;
  background: #f8fafc;
  box-shadow: inset 0 0 0 1px #e2e8f0;
}

.bus-map-overlay-caption {
  display: flex;
  justify-content: space-between;
  font-size: 0.75rem;
  color: #4b5563;
  margin-top: 2px;
}

.bus-map-overlay-caption .inbound-label::before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #3b82f6;
  margin-right: 6px;
}

.bus-map-overlay-caption .outbound-label::before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #22c55e;
  margin-right: 6px;
}


/* Flow arrows along the mini/overlay route map */
.flow-arrow-outbound {
  fill: none;
  stroke: #22c55e;
  stroke-width: 1.5;
}

.flow-arrow-inbound {
  fill: none;
  stroke: #3b82f6;
  stroke-width: 1.5;
}


/* === Diversion / road-closure segment (red + broken white overlay) === */
.road-closure-seg{
  stroke:#e53935;
  stroke-width:6;
  stroke-linecap:round;
}
.road-closure-hatch{
  stroke:#ffffff;
  stroke-width:3;
  stroke-linecap:round;
  stroke-dasharray:7 12;
  stroke-dashoffset:4;
  pointer-events:none;
}

/* Diversion buses appear 50% faded */
.bus-node.bus-diversion{
  opacity:0.5;
}


/* === Delay zone segment (blue + dashed overlay) === */
.delay-zone-seg{
  stroke:#1e88e5;
  stroke-width:6;
  stroke-linecap:round;
  opacity:0.95;
}
.delay-zone-hatch{
  stroke:#b3e5ff;
  stroke-width:3;
  stroke-linecap:round;
  stroke-dasharray:10 10;
  stroke-dashoffset:2;
  pointer-events:none;
  opacity:0.9;
}

/* Delay zone HUD */
.delay-zone-hud{
  position:fixed;
  top:86px;
  left:50%;
  transform:translateX(-50%);
  padding:8px 12px;
  border-radius:12px;
  background:rgba(10, 25, 55, 0.65);
  border:1px solid rgba(120, 200, 255, 0.25);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color:#eaf6ff;
  font-weight:700;
  letter-spacing:0.2px;
  z-index:9999;
  box-shadow: 0 10px 40px rgba(0,0,0,0.45), 0 0 26px rgba(30,136,229,0.25);
}

/* Popup styling for delay zone */
.incident-popup.delay-zone-popup{
  border:1px solid rgba(120, 200, 255, 0.45);
  box-shadow: 0 18px 60px rgba(0,0,0,0.55), 0 0 40px rgba(30,136,229,0.35);
}

/* === Diversion / road-closure visual (dotted) === */
.bus-node.bus-diversion .bus-rect{
  stroke-dasharray: 5 3;
  stroke-width: 2.2;
}
.bus-map-bus-other.bus-diversion,
.bus-map-bus-selected.bus-diversion{
  stroke-dasharray: 3 2;
  stroke-width: 2;
}


/* === Diversion blocks curtailment timing points (grey-out on diagram) === */
.route-point.diversion-blocked{
  fill:#cbd5e1 !important;
}
.route-label.diversion-blocked{
  fill:#94a3b8 !important;
}


/* === Full schedule CSV export === */
.schedule-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin: 6px 2px 10px;
}
.schedule-actions .view-toggle{
  padding: 8px 12px;
  font-size: 12.5px;
}


/* === PATCH v9: Action banner + priority highlight + command preview + HW unit + log grouping === */
.action-banner{
  margin:6px 0;
  padding:6px 12px;
  border-radius:10px;
  font-size:0.8rem;
  font-weight:600;
  background:#fff3cd;
  color:#92400e;
  border:1px solid #fde68a;
}
.action-banner.hidden{display:none;}
/* Hide the in-table Action banner (we surface this in the bottom KPI tile instead) */
.action-banner{display:none !important;}

.bus-node.bus-priority .bus-rect{
  stroke:#ef4444;
  stroke-width:4;
}
.bus-node.bus-priority-wide .bus-rect{
  stroke:#22c55e;
  stroke-width:4;
}

/* Bus command preview box */
.command-preview{
  margin-top:6px;
  font-size:0.75rem;
  padding:6px 8px;
  background:#f8fafc;
  border-radius:8px;
  border:1px solid #e5e7eb;
  color:#374151;
}

/* Quiet headway unit (SVG tspan) */
.bus-line-2 .hw-unit{
  font-size:.55rem;
  opacity:.72;
}

/* Dispatcher log warning tag */
.log-warn{ background:#fbbf24; color:#111827; }

.bus-el{
  font-size:0.55rem;
  font-weight:700;
  fill:#111827;
}
.bus-el.E{ fill:#16a34a; }
.bus-el.L{ fill:#dc2626; }


/* Patch1 classroom hidden labels */
#trainerPasswordLabel, #traineeNameLabel { display: inline-block; }


/* Trip delta on bus badge (SVG tspans) */
.trip-delta-late{
  fill:#ffffff;                 /* white = readable on red bus */
  font-weight:800;
  paint-order:stroke;
  stroke:rgba(0,0,0,0.55);      /* outline for contrast */
  stroke-width:2px;
  stroke-linejoin:round;
}

.trip-delta-early{
  fill:#102133;                 /* dark text = readable on green/yellow */
  font-weight:800;
  paint-order:stroke;
  stroke:rgba(255,255,255,0.45); /* subtle outline */
  stroke-width:2px;
  stroke-linejoin:round;
}
/* Fullscreen overlay prompt */
.fs-overlay{
  position: fixed;
  inset: 0;
  z-index: 99998;
  background: rgba(0,0,0,0.35);
  display:flex;
  align-items:center;
  justify-content:center;
}
.fs-overlay-card{
  width: min(520px, 92vw);
  border-radius: 18px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(255,255,255,0.35);
  box-shadow: 0 18px 60px rgba(0,0,0,0.25);
  padding: 18px 18px 16px;
  text-align:center;
}
.fs-overlay-title{
  font-size: 22px;
  font-weight: 800;
  letter-spacing: 0.6px;
  margin-bottom: 6px;
}
.fs-overlay-sub{
  font-size: 14px;
  opacity: 0.85;
  margin-bottom: 14px;
}
.fs-overlay-btn{
  padding: 12px 16px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,0.08);
  background: rgba(30,136,229,0.95);
  color: #fff;
  font-weight: 800;
  cursor: pointer;
  width: 100%;
}
.fs-overlay-hint{
  margin-top: 10px;
  font-size: 12px;
  opacity: 0.75;
}

.hint{display:inline-block;margin-top:10px;font-size:13px;opacity:0.85;}

/* Trip delta on bus badge */
.trip-delta-ontime{ fill:#111; font-weight:700; }


/* === Live EWT HUD (soft colours, OK/WARN/BAD + pulse on breach) === */
.ewt-strip{
  position:fixed;
  top:14px;
  left:50%;
  transform:translateX(-50%);
  z-index:9999;
  width:min(420px, calc(100vw - 24px));
  padding:10px 12px;
  border-radius:14px;
  display:block;
  background:rgba(248,250,252,.92);
  border:1px solid rgba(148,163,184,.55);
  box-shadow:0 10px 30px rgba(15,23,42,.12);
  backdrop-filter: blur(8px);
}

.ewt-hud-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:8px;
}
.ewt-hud-title{
  font-weight:800;
  letter-spacing:.08em;
  font-size:.72rem;
  color:#334155;
}
.ewt-hud-pill{
  font-size:.72rem;
  font-weight:800;
  padding:4px 10px;
  border-radius:999px;
  background:rgba(226,232,240,.9);
  color:#334155;
  border:1px solid rgba(148,163,184,.4);
}

.ewt-hud-main{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
}
.ewt-hud-value{
  font-size:2.2rem;
  font-weight:900;
  line-height:1;
  color:#0f172a;
}
.ewt-hud-unit{
  margin-left:6px;
  font-size:.95rem;
  font-weight:800;
  color:#475569;
}
.ewt-hud-meta{
  text-align:right;
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:150px;
}
.ewt-hud-target{
  font-size:.8rem;
  color:#334155;
  font-weight:700;
}
.ewt-hud-delta{
  font-size:.78rem;
  color:#475569;
  font-weight:800;
}

.ewt-hud-bar{
  margin-top:10px;
  height:7px;
  border-radius:999px;
  background:rgba(226,232,240,.9);
  overflow:hidden;
  border:1px solid rgba(148,163,184,.25);
}
.ewt-hud-bar-fill{
  height:100%;
  width:0%;
  border-radius:999px;
  background:rgba(34,197,94,.9);
  transition:width .25s ease;
}

.ewt-hud-sub{
  margin-top:8px;
  display:flex;
  gap:12px;
  justify-content:space-between;
  color:#475569;
  font-size:.78rem;
  font-weight:700;
}
.ewt-hud-note{
  margin-top:6px;
  font-size:.72rem;
  color:#64748b;
  font-weight:600;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* State colours */
.ewt-strip.ok{
  border-color:rgba(34,197,94,.35);
}
.ewt-strip.ok .ewt-hud-pill{
  background:rgba(220,252,231,.9);
  color:#166534;
  border-color:rgba(34,197,94,.25);
}
.ewt-strip.ok .ewt-hud-bar-fill{ background:rgba(34,197,94,.9); }

.ewt-strip.warn{
  border-color:rgba(245,158,11,.4);
}
.ewt-strip.warn .ewt-hud-pill{
  background:rgba(254,243,199,.95);
  color:#92400e;
  border-color:rgba(245,158,11,.25);
}
.ewt-strip.warn .ewt-hud-bar-fill{ background:rgba(245,158,11,.9); }

.ewt-strip.bad{
  border-color:rgba(239,68,68,.55);
}
.ewt-strip.bad .ewt-hud-pill{
  background:rgba(254,226,226,.95);
  color:#991b1b;
  border-color:rgba(239,68,68,.3);
}
.ewt-strip.bad .ewt-hud-bar-fill{ background:rgba(239,68,68,.92); }

/* Pulse/shake when BAD triggers */
@keyframes ewtPulse{
  0%{ transform:translateX(-50%) scale(1); box-shadow:0 10px 30px rgba(15,23,42,.12); }
  40%{ transform:translateX(-50%) scale(1.02); box-shadow:0 14px 40px rgba(239,68,68,.22); }
  100%{ transform:translateX(-50%) scale(1); box-shadow:0 10px 30px rgba(15,23,42,.12); }
}
@keyframes ewtShake{
  0%{ transform:translateX(-50%) translateX(0); }
  20%{ transform:translateX(-50%) translateX(-4px); }
  40%{ transform:translateX(-50%) translateX(4px); }
  60%{ transform:translateX(-50%) translateX(-3px); }
  80%{ transform:translateX(-50%) translateX(3px); }
  100%{ transform:translateX(-50%) translateX(0); }
}
.ewt-strip.bad.beat{
  animation: ewtPulse .6s ease-out, ewtShake .45s ease-in-out;
}


/* Stand HOLD departure display: D HH:MM */
.bus-dep{ font-size:11px; font-weight:800; paint-order:stroke; stroke:#ffffff; stroke-width:3px; }


/* Stand Hold Monitor (buses held at Stand A/B only) */
.stand-hold-monitor{
  position:absolute;
  right: 22px;
  top: 18px;
  width: 260px;
  padding: 10px 12px;
  z-index: 6;
  pointer-events: auto;
}

/* Stand hold monitor – top placement (next to Dispatcher Log, not on the schematic) */
.stand-hold-monitor-top{
  position: fixed;
  top: 10px;
  /* Place just to the left of the fixed Dispatcher Log (520px wide + margins). */
  right: 546px;
  width: 320px;
  z-index: 9998;
}
.stand-hold-monitor-cols{
  display:flex;
  gap:10px;
}
.stand-hold-col{
  flex:1 1 0;
  min-width:0;
}
.stand-hold-title{
  font-weight:700;
  font-size:12px;
  letter-spacing:0.6px;
  text-transform:uppercase;
  color:#2d3b55;
  margin-bottom:6px;
}
.stand-hold-list{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-height: 22px;
}
.stand-hold-row{
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:6px 8px;
  border-radius:10px;
  border:1px solid var(--border);
  background:#f7faff;
}
.stand-hold-row-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
}
.stand-hold-bus{
  font-weight:700;
  font-size:12px;
  color:#1b2a43;
  white-space:nowrap;
}
.stand-hold-hw{
  font-weight:700;
  font-size:11px;
  color:#3a4a66;
  white-space:nowrap;
}
.stand-hold-dep{
  font-weight:700;
  font-size:12px;
  color:#1b2a43;
}
.stand-hold-empty{
  color: var(--muted);
  font-size:12px;
  padding:4px 2px;
}



/* Stand monitor: meta + one-line rows */
.stand-hold-meta{
  font-size: 12px;
  color: #64748b;
  margin: 2px 0 8px;
  white-space: nowrap;
}
.stand-hold-row.one-line{
  display:block;
  padding: 6px 8px;
  border: 1px solid rgba(15,23,42,0.12);
  border-radius: 10px;
  margin-bottom: 6px;
  font-weight: 700;
  letter-spacing: 0.2px;
  white-space: nowrap;
}


/* Stand hold monitor (right column) */
.stand-hold-line{
  font-size: 12px;
  line-height: 1.35;
  padding: 6px 8px;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 10px;
  background: #f8fafc;
  margin: 6px 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 600;
}
.stand-hold-empty{
  font-size: 12px;
  opacity: 0.7;
  padding: 6px 8px;
}


/* === Legal footer (small + unobtrusive) === */
.app-disclaimer{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 6px;
  padding: 6px 12px;
  font-size: 10px;
  line-height: 1.3;
  color: rgba(30,41,59,0.55);
  text-align: center;
  pointer-events: none;
  z-index: 9999;
  user-select: none;
  text-wrap: balance;
}
.app-disclaimer-sep{ padding: 0 8px; opacity: 0.45; }
@media (max-width: 900px){
  .app-disclaimer{ font-size: 9px; padding: 6px 10px; }
}




/* =========================================================
   STEP 2 UI: Full-width main view + floating Stand A/B cards
   - Removes reserved space for right column
   - Stand A and Stand B become two floating cards (like EWT)
   ========================================================= */
.simulator-layout{
  padding-right:0 !important; /* remove reserved space for fixed right column */
}

/* Convert the former right-panel column into a lightweight floating tray */
.right-panel{
  position:fixed !important;
  top:20px !important;
  right:12px !important;
  bottom:auto !important;
  width:auto !important;
  max-width:unset !important;
  display:flex !important;
  flex-direction:row !important;
  gap:12px !important;
  align-items:flex-start !important;
  padding:0 !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  pointer-events:auto; /* floating tray must remain clickable (contains dispatcher flyout) */
}

/* Stand monitor becomes a container only; individual columns become cards */
#standHoldMonitor{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  padding:0 !important;
  margin:0 !important;
  pointer-events:none;
}
#standHoldMonitor .stand-hold-monitor-cols{
  display:flex;
  flex-direction:row;
  gap:12px;
}
#standHoldMonitor .stand-hold-col{
  width:252px;
  background:#ffffff;
  border:1px solid var(--border);
  border-radius:14px;
  padding:10px 12px 8px;
  box-shadow:0 10px 30px rgba(15,35,70,0.12);
  pointer-events:auto; /* enable interaction */
}
#standHoldMonitor .stand-hold-title{
  font-weight:800;
  letter-spacing:.10em;
  text-transform:uppercase;
  font-size:.78rem;
  margin-bottom:2px;
}
#standHoldMonitor .stand-hold-meta{
  color:var(--muted);
  font-size:.74rem;
  margin-bottom:6px;
}

/* Ensure the dispatcher log flyout still works on top */
.dispatch-flyout,
.dispatch-fab{
  pointer-events:auto;
  z-index:10000;
}

/* Avoid the floating cards covering important top controls on smaller screens */
@media (max-width: 1200px){
  .right-panel{ top:64px !important; }
}



/* BOTTOM DOCK: KPI + RT */
.bottom-dock{
  position:fixed;
  left:16px;
  right:16px;
  bottom:44px; /* sits above disclaimer */
  z-index: 9000;
  display:flex;
  flex-direction:column;
  gap:10px;
  pointer-events:none; /* allow map interaction; children re-enable */
}

.bottom-dock .card{ pointer-events:auto; }

.kpi-dock{
  border-radius: 16px;
  padding: 10px 12px;
  background: rgba(255,255,255,0.86);
  backdrop-filter: blur(10px);
  box-shadow: 0 14px 36px rgba(0,0,0,0.10);
}

.kpi-tiles{
  display:flex;
  gap:10px;
  align-items:stretch;
  justify-content:flex-start;
  flex-wrap:nowrap;
  overflow:hidden;
}

.kpi-tile{
  flex:0 0 140px;
  min-width: 120px;
  background: rgba(15, 23, 42, 0.03);
  border: 1px solid rgba(15, 23, 42, 0.10);
  border-radius: 14px;
  padding: 10px 12px;
}


/* KPI pulse on change */
.kpi-tile.kpi-pulse{
  animation: kpiPulse 420ms ease-out;
}
@keyframes kpiPulse{
  0%{ transform: scale(1); box-shadow: 0 0 0 rgba(0,0,0,0); }
  35%{ transform: scale(1.03); box-shadow: 0 10px 24px rgba(15,23,42,0.18); }
  100%{ transform: scale(1); box-shadow: 0 0 0 rgba(0,0,0,0); }
}
@media (prefers-reduced-motion: reduce){
  .kpi-tile.kpi-pulse{ animation: none; }
}


.kpi-label{
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(15,23,42,0.65);
  font-weight: 800;
  line-height: 1.2;
}

.kpi-value{
  margin-top: 4px;
  font-size: 22px;
  font-weight: 900;
  color: rgba(15,23,42,0.92);
  display:flex;
  gap:6px;
  align-items:baseline;
}

.kpi-unit{
  font-size: 12px;
  font-weight: 800;
  color: rgba(15,23,42,0.55);
}

.kpi-currency{
  font-size: 12px;
  font-weight: 800;
  color: rgba(15,23,42,0.55);
  margin-right: 4px;
}

.rt-dock{
  border-radius: 16px;
  padding: 10px 12px;
  background: rgba(255,255,255,0.86);
  backdrop-filter: blur(10px);
  box-shadow: 0 14px 36px rgba(0,0,0,0.10);
  display:flex;
  gap:12px;
  align-items:center;
}

.rt-dock-left{
  min-width: 220px;
  max-width: 320px;
}

.rt-dock-title{
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(15,23,42,0.75);
  font-weight: 900;
  line-height:1.2;
}

.rt-dock-sub{
  margin-top: 2px;
  font-size: 12px;
  color: rgba(15,23,42,0.55);
  font-weight: 600;
  line-height: 1.2;
}

.rt-dock-strip{
  flex: 1 1 auto;
  display:flex;
  gap:10px;
  overflow-x:auto;
  padding-bottom: 2px;
  scrollbar-width: thin;
}

.rt-chip{
  flex: 0 0 auto;
  display:flex;
  align-items:center;
  gap:10px;
  padding: 8px 10px;
  border-radius: 14px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  background: rgba(255,255,255,0.75);
  box-shadow: 0 8px 18px rgba(0,0,0,0.06);
  font-size: 12px;
  color: rgba(15,23,42,0.92);
  min-width: 280px;
}

.rt-chip .rt-t{
  font-variant-numeric: tabular-nums;
  font-weight: 900;
  padding: 2px 8px;
  border-radius: 10px;
  border: 1px solid rgba(15,23,42,0.14);
  background: rgba(15,23,42,0.04);
}

.rt-chip .rt-bus{ font-weight: 900; }
.rt-chip .rt-issue{ font-weight: 800; color: rgba(15,23,42,0.72); }
.rt-chip .rt-action{ font-weight: 900; }
.rt-chip .rt-rt{
  font-variant-numeric: tabular-nums;
  font-weight: 900;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(15,23,42,0.04);
}
.rt-chip .rt-outcome{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:6px;
  font-weight: 900;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(15,23,42,0.04);
}

.rt-chip.outcome-good .rt-outcome{ background: rgba(34,197,94,0.12); border-color: rgba(34,197,94,0.25); color: rgba(21,128,61,0.95); }
.rt-chip.outcome-bad .rt-outcome{ background: rgba(239,68,68,0.12); border-color: rgba(239,68,68,0.25); color: rgba(185,28,28,0.95); }
.rt-chip.outcome-neutral .rt-outcome{ background: rgba(99,102,241,0.10); border-color: rgba(99,102,241,0.22); color: rgba(55,48,163,0.95); }

@media (max-width: 1200px){
  .kpi-tiles{ flex-wrap: wrap; }
  .kpi-tile{ min-width: 180px; }
  .rt-dock-left{ display:none; }
}
@media (max-width: 900px){
  .bottom-dock{ left:10px; right:10px; bottom:54px; }
  .kpi-value{ font-size: 18px; }
  .rt-chip{ min-width: 240px; }
}


/* --- KPI Dock: Action recommended tile --- */
.kpi-tile.kpi-tile-wide{ flex: 1 1 auto; min-width: 260px; }
.kpi-value.kpi-wrap{
  white-space: normal;
  word-break: break-word;
  line-height: 1.15;
  font-size: 0.98rem;
}
@media (max-width: 1100px){
  .kpi-tile.kpi-tile-wide{ flex: 1; }
  .kpi-value.kpi-wrap{ font-size: 0.92rem; }
}
.kpi-tile { flex: 0 0 160px; }
.kpi-tile.action { flex: 1 1 auto; min-width: 260px; }



/* === UI PATCH: BIGGER DISPATCHER LOG FLYOUT + MORE VISIBLE STANDS === */

/* Make the fixed right panel slimmer so the AVL has more usable width */
.right-panel{
  width:360px;
}

/* Reserve space so AVL content is not hidden behind the fixed right panel */
#avlPanel{
  padding-right:380px;
}

/* Dispatcher Log flyout: render as a large modal-style window when opened */
.dispatch-flyout{
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(15,23,42,0.35);
  z-index: 12000;
  pointer-events: auto;
}

.dispatch-flyout.is-open{
  display: flex;
}

.dispatch-flyout.is-open .dispatch-log-card{
  width: min(96vw, 1400px);
  height: min(90vh, 850px);
  margin: 0;
}

.dispatch-flyout.is-open .dispatch-log-wrapper{
  flex: 1 1 auto;
  overflow: auto;
  max-height: none;
}

/* Keep text sizing unchanged (inherit existing sizes); only container grows */


/* === AVL diagram pixel-centre (only simSvg inside track wrapper) === */
.track-wrapper #simSvg{
  transform: translateY(var(--avlShift, 0px));
  will-change: transform;
}


/* === AVL labels: INBOUND (top) to right, OUTBOUND (bottom) to left (no height change) === */

.track-wrapper .track-label.top{
  left:auto !important;
  right:14px !important;
  top:18px !important;          /* keep original height */
  align-items:flex-end !important;
  text-align:right !important;
}
.track-wrapper .track-label.bottom{
  right:auto !important;
  left:14px !important;
  bottom:18px !important;       /* keep original height */
  align-items:flex-start !important;
  text-align:left !important;
}


/* --- What matters now strip --- */
.wmn-strip{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin:10px 0 6px 0;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,0.08);
  background:linear-gradient(90deg, rgba(255,214,102,0.22), rgba(255,255,255,0.85));
  box-shadow:0 6px 18px rgba(0,0,0,0.06);
}
.wmn-left{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.wmn-icon{
  width:22px;height:22px;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:8px;
  background:rgba(255,214,102,0.45);
  border:1px solid rgba(0,0,0,0.1);
  flex:0 0 auto;
}
.wmn-label{
  font-weight:700;
  letter-spacing:0.2px;
  flex:0 0 auto;
}
.wmn-sep{ opacity:0.55; flex:0 0 auto; }
.wmn-text{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.wmn-right{
  display:flex;
  align-items:baseline;
  gap:8px;
  flex:0 0 auto;
  padding-left:10px;
  border-left:1px solid rgba(0,0,0,0.08);
}
.wmn-exposure-label{ opacity:0.7; font-size:12px; }
.wmn-exposure-value{ font-weight:800; }
.wmn-exposure-sub{ opacity:0.65; font-size:12px; }

/* --- Headway microbar in tables (stronger colours) --- */
.hw-cell{
  position:relative;
  padding-right:56px;
}
.hw-micro{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  width:40px;
  height:11px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,0.22);
  background:rgba(0,0,0,0.10);
  overflow:hidden;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.18);
}
.hw-micro::before{
  content:'';
  display:block;
  height:100%;
  width:calc(var(--hw, 0) * 50%); /* --hw is 0..2 => 0..100% */
  border-radius:999px;
  background:rgba(255,204,0,0.95); /* default */
  box-shadow: 0 0 0 1px rgba(0,0,0,0.10);
}
/* State-driven, punchier fills */
.hw-micro.headway-green::before{
  background:rgba(52,199,89,0.95);
}
.hw-micro.headway-red::before{
  background:rgba(255,59,48,0.95);
}
.hw-micro.headway-blue::before{
  background:rgba(0,122,255,0.95);
}

/* Optional: make the remaining (empty) part read clearer */
.hw-micro{
  background:linear-gradient(180deg, rgba(0,0,0,0.12), rgba(0,0,0,0.06));
}



/* HOLD / INSTRUCTION PILL */
.instr-pill{
  display:inline-block;
  padding:2px 8px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(30,60,120,0.35);
  box-shadow:0 0 18px rgba(40,120,255,0.18);
  font-weight:700;
}


/* Pending HOLD (instructed) banner */
.bus-tag-pending-text{ fill:#111827 !important; opacity:0.85; }


/* === Injected top control panel: scenario + speed + city pack + start/reset === */
.scenario-command-panel{
  position:relative;
  z-index:10020;
  margin-top:8px;
  margin-bottom:10px;
  padding:10px 12px;
  border:1px solid #c9d9f5;
  border-radius:14px;
  background:linear-gradient(180deg,#ffffff,#f5f8ff);
  box-shadow:0 10px 26px rgba(15,35,70,.10);
}
.scenario-command-panel,
.scenario-command-panel *{
  pointer-events:auto;
}
.scenario-command-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px 12px;
  align-items:end;
  justify-content:flex-start;
}
.command-field{
  display:flex;
  flex-direction:column;
  gap:5px;
  min-width:0;
}
.command-field-scenario{
  flex:0 1 430px;
  min-width:260px;
  max-width:430px;
}
.command-field-time{
  flex:0 0 auto;
  width:108px;
}
.command-field-speed{
  flex:0 0 auto;
  width:96px;
}
.command-field-city{
  flex:0 0 auto;
  width:136px;
}
.command-field-driver-change{
  flex:0 0 auto;
  width:176px;
}
.command-field label{
  font-size:.68rem;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:#627089;
  font-weight:800;
}
.command-field select,
.command-field .topSelect{
  width:100%;
  min-height:34px;
  border-radius:10px;
  border:1px solid #d5deef;
  background:#f8fbff;
  color:#132238;
  padding:6px 9px;
  font-size:.8rem;
  font-weight:650;
  outline:none;
}
.command-field select:focus{
  border-color:#1e88e5;
  box-shadow:0 0 0 3px rgba(30,136,229,.13);
}
.speed-field-inner{
  display:flex;
  gap:6px;
  align-items:center;
}
.speed-field-inner #speedSelect{
  flex:0 0 56px;
  width:56px;
  min-width:56px;
}
.command-field-city #locationSelect{
  width:136px;
  min-width:136px;
}
.command-field-time #timeBandSelect{
  width:108px;
  min-width:108px;
}
.top-speed-readout{
  display:inline-flex;
  min-width:36px;
  height:34px;
  padding:0 6px;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  background:#eef6ff;
  border:1px solid #c9ddfa;
  color:#1e5e9d;
  font-weight:900;
  font-size:.74rem;
  flex:0 0 auto;
}
.scenario-command-actions{
  margin-top:10px;
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
}
.scenario-command-actions #togglePause,
.scenario-command-actions #resetTest{
  min-width:112px;
}
.scenario-command-actions .route-header-top{
  margin-left:auto;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.ewt-compact .ewt-start-row{ display:none !important; }

/* The floating EWT HUD is read-only, so let clicks pass through to the controls below. */
.ewt-strip{
  pointer-events:none;
}

@media (max-width:1100px){
  .command-field-scenario{
    flex:1 1 100%;
    max-width:none;
  }
}
@media (max-width:760px){
  .scenario-command-row{
    align-items:stretch;
  }
  .command-field-scenario,
  .command-field-time,
  .command-field-speed,
  .command-field-city,
  .command-field-driver-change{
    width:100%;
    max-width:none;
    min-width:0;
    flex:1 1 100%;
  }
  .speed-field-inner #speedSelect,
  .command-field-time #timeBandSelect,
  .command-field-city #locationSelect,
  .command-field-driver-change #driverChangePointSelect{
    width:100%;
    min-width:0;
  }
  .scenario-command-actions .route-header-top{
    margin-left:0;
  }
}


/* === FINAL FIX: keep Live EWT HUD + Stand A/B monitor visible above top controls ===
   The top scenario panel was given a higher z-index than the floating HUD/stand cards.
   This keeps dropdowns clickable but stops the controls from hiding operational HUDs. */
.scenario-command-panel{
  z-index:120 !important;
}

.ewt-strip{
  z-index:2147482000 !important;
  pointer-events:none !important;
}

/* Stand monitors / dispatcher tray must float above the schedule card and top control panel.
   Move it just below the access HUD so the stand cards are not covered at the very top. */
.right-panel{
  top:58px !important;
  z-index:2147481000 !important;
  pointer-events:auto !important;
}

#standHoldMonitor,
#standHoldMonitor .stand-hold-monitor-cols,
#standHoldMonitor .stand-hold-col,
.right-panel .stand-hold-monitor{
  z-index:2147481000 !important;
}

/* Keep the access checking badge as the absolute top item. */
#avlAccessHud{
  z-index:2147483600 !important;
}

/* Ensure the platform menu button stays above ordinary content but below access badge. */
.platform-home-btn{
  z-index:2147483000 !important;
}


/* =========================================================
   FINAL EMBEDDED HUD FIX
   Live EWT + Stand A/B are embedded in the top scenario window
   immediately after City Pack. This removes the floating-window behaviour.
   ========================================================= */
.card.scenario{
  flex:1 1 100% !important;
  width:100% !important;
  min-width:0 !important;
}

.scenario-command-panel{
  position:relative !important;
  z-index:300 !important;
  overflow:visible !important;
  padding:10px 12px !important;
}

.scenario-command-row{
  display:grid !important;
  /* final columns are the embedded Stand A/B group plus the inline sim clock */
  grid-template-columns:minmax(260px, 430px) 92px 138px 176px minmax(260px, 320px) 1fr 408px 238px !important;
  gap:10px 12px !important;
  align-items:stretch !important;
  justify-content:stretch !important;
}

.command-field-scenario,
.command-field-time,
.command-field-speed,
.command-field-city,
.command-field-driver-change{
  align-self:start !important;
}
.command-field-driver-change{
  width:176px !important;
  max-width:176px !important;
}
.command-field-driver-change #driverChangePointSelect{
  width:176px !important;
  min-width:176px !important;
}

.embedded-ewt-slot,
.embedded-stand-slot,
.embedded-sim-clock-slot{
  min-width:0 !important;
  align-self:stretch !important;
  display:flex !important;
}
.embedded-stand-slot{
  grid-column:7 !important;
  width:408px !important;
  max-width:408px !important;
  margin-left:0 !important;
  justify-self:end !important;
}

/* Live EWT: embedded card, no fixed positioning, no overlap */
.embedded-ewt-slot #ewtStrip,
#ewtStrip{
  position:static !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  transform:none !important;
  z-index:auto !important;
  width:100% !important;
  max-width:none !important;
  min-height:92px !important;
  margin:0 !important;
  padding:10px 12px !important;
  border-radius:14px !important;
  box-shadow:0 8px 22px rgba(15,35,70,.10) !important;
  pointer-events:auto !important;
  display:block !important;
}

#ewtStrip .ewt-hud-header{ margin-bottom:5px !important; }
#ewtStrip .ewt-hud-main{ margin-bottom:5px !important; }
#ewtStrip .ewt-hud-value{ font-size:1.55rem !important; }
#ewtStrip .ewt-hud-unit{ font-size:.82rem !important; }
#ewtStrip .ewt-hud-sub{ font-size:.68rem !important; gap:8px !important; }
#ewtStrip .ewt-hud-note{ font-size:.66rem !important; margin-top:2px !important; }

/* Stand A/B: embedded side-by-side compact cards */
.embedded-stand-slot #standHoldMonitor,
#standHoldMonitor{
  position:static !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  transform:none !important;
  z-index:auto !important;
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  pointer-events:auto !important;
  display:block !important;
}

#standHoldMonitor .stand-hold-monitor-cols{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:10px !important;
  height:100% !important;
}

#standHoldMonitor .stand-hold-col{
  width:auto !important;
  min-width:0 !important;
  min-height:92px !important;
  background:#ffffff !important;
  border:1px solid var(--border) !important;
  border-radius:14px !important;
  padding:8px 8px 7px !important;
  box-shadow:0 8px 22px rgba(15,35,70,.10) !important;
  pointer-events:auto !important;
}

#standHoldMonitor .stand-hold-title{
  font-size:.74rem !important;
  line-height:1 !important;
  margin-bottom:5px !important;
  text-align:right !important;
}

#standHoldMonitor .stand-hold-meta{
  font-size:.68rem !important;
  margin:0 0 5px !important;
  text-align:right !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

#standHoldMonitor .stand-hold-list{
  gap:5px !important;
  max-height:62px !important;
  overflow:auto !important;
}

#standHoldMonitor .stand-hold-line,
#standHoldMonitor .stand-hold-row,
#standHoldMonitor .stand-hold-row.one-line{
  font-size:.68rem !important;
  line-height:1.15 !important;
  padding:5px 7px !important;
  border-radius:9px !important;
  margin:0 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

/* Right panel no longer positions the stand cards. Keep it only as an invisible host for modal flyouts. */
.right-panel{
  position:static !important;
  top:auto !important;
  right:auto !important;
  bottom:auto !important;
  width:0 !important;
  height:0 !important;
  padding:0 !important;
  margin:0 !important;
  display:block !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  pointer-events:none !important;
}
.right-panel .dispatch-flyout,
.right-panel .manual-log-flyout{
  pointer-events:auto !important;
}

.scenario-command-actions{
  margin-top:8px !important;
}

@media (max-width:1560px){
  .scenario-command-row{
    grid-template-columns:minmax(260px, 1.2fr) 92px 138px 176px minmax(240px, .9fr) 1fr 408px 238px !important;
  }
  .embedded-stand-slot{
    grid-column:7 / 8 !important;
    width:408px !important;
    max-width:408px !important;
    justify-self:end !important;
  }
  .embedded-sim-clock-slot{
    grid-column:8 / 9 !important;
    width:238px !important;
    max-width:238px !important;
    justify-self:end !important;
  }
}

@media (max-width:1350px){
  .scenario-command-row{
    grid-template-columns:minmax(260px, 1.2fr) 92px 138px 176px minmax(240px, .9fr) !important;
  }
  .embedded-stand-slot{
    grid-column:1 / span 2 !important;
    width:408px !important;
    max-width:408px !important;
    margin-left:0 !important;
    justify-self:start !important;
  }
  .embedded-sim-clock-slot{
    grid-column:3 / span 2 !important;
    width:238px !important;
    max-width:238px !important;
    justify-self:end !important;
  }
}

@media (max-width:950px){
  .scenario-command-row{
    grid-template-columns:1fr !important;
  }
  .command-field-scenario,
  .command-field-time,
  .command-field-speed,
  .command-field-city,
  .command-field-driver-change{
    width:100% !important;
    max-width:none !important;
  }
  .speed-field-inner #speedSelect,
  .command-field-time #timeBandSelect,
  .command-field-city #locationSelect,
  .command-field-driver-change #driverChangePointSelect{
    width:100% !important;
    min-width:0 !important;
  }
  .embedded-stand-slot,
  .embedded-sim-clock-slot{
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    margin-left:0 !important;
  }
  .sim-clock-display{justify-content:center !important;}
  #standHoldMonitor .stand-hold-monitor-cols{
    grid-template-columns:1fr !important;
  }
}


/* === Time band selector: AM / PM / Evening service start === */
.command-field-time{
  flex:0 0 auto !important;
  width:108px !important;
  max-width:108px !important;
}
.command-field-time #timeBandSelect{
  width:108px !important;
  min-width:108px !important;
}
@media (max-width:950px){
  .command-field-time{
    width:100% !important;
    max-width:none !important;
  }
  .command-field-time #timeBandSelect{
    width:100% !important;
    min-width:0 !important;
  }
}


/* === Time selector underneath Select Scenario === */
.scenario-time-subrow{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  margin-top:6px !important;
}
.scenario-time-subrow label{
  margin:0 !important;
  font-size:.62rem !important;
  line-height:1 !important;
  text-transform:uppercase !important;
  letter-spacing:.14em !important;
  color:#627089 !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}
.scenario-time-subrow #timeBandSelect{
  width:136px !important;
  min-width:136px !important;
  min-height:30px !important;
  border-radius:9px !important;
  padding:4px 8px !important;
  font-size:.78rem !important;
}
@media (max-width:950px){
  .scenario-time-subrow{
    align-items:stretch !important;
    flex-direction:column !important;
  }
  .scenario-time-subrow #timeBandSelect{
    width:100% !important;
    min-width:0 !important;
  }
}


.embedded-sim-clock-slot{
  grid-column:8 !important;
  width:238px !important;
  max-width:238px !important;
  min-width:238px !important;
  margin-left:auto !important;
  justify-self:end !important;
  align-self:stretch !important;
  display:flex !important;
}

.sim-clock-panel{
  width:100%;
  min-height:92px;
  background:#ffffff;
  border:1px solid var(--border);
  border-radius:14px;
  box-shadow:0 8px 22px rgba(15,35,70,.10);
  padding:10px 12px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:6px;
}
.sim-clock-panel-title{
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:#39485f;
}
.sim-clock-display{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:4px;
  width:100%;
  overflow:hidden;
}
.sim-clock-box{
  min-width:50px;
  width:50px;
  height:40px;
  border-radius:10px;
  background:linear-gradient(180deg,#20242a 0%, #101318 52%, #0a0c0f 100%);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08), inset 0 -8px 16px rgba(0,0,0,.22), 0 8px 18px rgba(10,16,24,.16);
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  overflow:hidden;
}
.sim-clock-box::before{
  content:"";
  position:absolute;
  left:0; right:0; top:50%;
  height:1px;
  background:rgba(255,255,255,.12);
  transform:translateY(-0.5px);
}
.sim-clock-box span{
  font-family:"JetBrains Mono",Consolas,"Courier New",monospace;
  font-size:1.78rem;
  line-height:1;
  font-weight:900;
  letter-spacing:.04em;
  color:#f3f7fb;
  text-shadow:0 1px 0 rgba(255,255,255,.08), 0 0 14px rgba(255,255,255,.08);
}
.sim-clock-colon{
  font-family:"JetBrains Mono",Consolas,"Courier New",monospace;
  font-size:1.55rem;
  font-weight:900;
  color:#1f2d3d;
  margin:0;
  line-height:1;
  transform:translateY(-1px);
}
.sim-clock-panel-sub{
  font-size:.68rem;
  color:#73819a;
  letter-spacing:.02em;
}

/* =========================================================
   BLUE GLASS SIMULATOR REFRESH — lighter blue dashboard look
   Keeps existing layout/functionality, updates visual theme.
   ========================================================= */
:root{
  --bg:#0b3c80;
  --card:rgba(12,43,96,0.74);
  --accent:#46a8ff;
  --accent-soft:rgba(70,168,255,0.18);
  --muted:#b9d9ff;
  --text:#eef7ff;
  --border:rgba(138,196,255,0.20);
}

body.simulator-layout{
  color:var(--text) !important;
  background:
    radial-gradient(circle at 12% 12%, rgba(125,190,255,0.22), transparent 24%),
    radial-gradient(circle at 88% 18%, rgba(74,145,255,0.18), transparent 22%),
    radial-gradient(circle at 50% 100%, rgba(33,104,214,0.24), transparent 32%),
    linear-gradient(180deg, #0d468f 0%, #0a3e82 34%, #08366e 100%) !important;
  min-height:100vh;
}
body.simulator-layout::before,
body.simulator-layout::after{
  content:"";
  position:fixed;
  inset:auto;
  pointer-events:none;
  z-index:0;
  filter:blur(36px);
}
body.simulator-layout::before{
  width:360px;height:360px;left:-100px;top:-80px;
  background:radial-gradient(circle, rgba(117,190,255,0.26) 0%, rgba(117,190,255,0) 70%);
}
body.simulator-layout::after{
  width:420px;height:420px;right:-120px;top:80px;
  background:radial-gradient(circle, rgba(66,130,255,0.18) 0%, rgba(66,130,255,0) 72%);
}
body.simulator-layout .page{ position:relative; z-index:1; }

body.simulator-layout h1,
body.simulator-layout h2,
body.simulator-layout .scenario-header,
body.simulator-layout .scenario-text,
body.simulator-layout .scenario-header span.value,
body.simulator-layout .subtitle,
body.simulator-layout .command-field label,
body.simulator-layout .theme-indicator-pill,
body.simulator-layout .route-header-top,
body.simulator-layout .ewt-compact,
body.simulator-layout .ewt-compact-line,
body.simulator-layout .session-label,
body.simulator-layout .kpi-subvalue,
body.simulator-layout .dispatch-log-subtitle,
body.simulator-layout .sim-clock-panel-sub,
body.simulator-layout .ewt-hud-note,
body.simulator-layout .ewt-hud-target,
body.simulator-layout .ewt-hud-delta,
body.simulator-layout .ewt-hud-lost,
body.simulator-layout .wmn-exposure-label,
body.simulator-layout .wmn-exposure-sub,
body.simulator-layout .stand-hold-meta,
body.simulator-layout .stand-hold-line{
  color:#d7ebff !important;
}

body.simulator-layout .card.scenario,
body.simulator-layout .scenario-command-panel,
body.simulator-layout .sim-controls,
body.simulator-layout .schedule-table-card,
body.simulator-layout .kpi-dock,
body.simulator-layout .bus-command-dialog,
body.simulator-layout .dispatch-log-card,
body.simulator-layout .dispatch-log-card.dispatch-log-fixed,
body.simulator-layout .manual-log-card,
body.simulator-layout .incident-popup,
body.simulator-layout .bus-map-overlay-inner,
body.simulator-layout .real-map-popup,
body.simulator-layout .sim-clock-panel,
body.simulator-layout .stand-hold-monitor,
body.simulator-layout #standHoldMonitor{
  background:linear-gradient(180deg, rgba(18,65,130,0.78), rgba(10,40,88,0.84)) !important;
  border:1px solid rgba(144,200,255,0.22) !important;
  border-radius:18px !important;
  box-shadow:0 18px 40px rgba(1,12,33,0.28), inset 0 1px 0 rgba(255,255,255,0.08) !important;
  backdrop-filter:blur(12px);
  color:#eef7ff !important;
}

/* Lighter centre route panel like the reference */
body.simulator-layout .track-wrapper{
  background:linear-gradient(180deg, rgba(231,242,255,0.97), rgba(206,227,255,0.94)) !important;
  border:1px solid rgba(149,191,242,0.55) !important;
  border-radius:18px !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.95), 0 18px 42px rgba(3,20,56,0.16) !important;
}
body.simulator-layout .track-wrapper .track-label,
body.simulator-layout .track-wrapper .next-bus,
body.simulator-layout .track-wrapper .scenario-text{
  color:#46658a !important;
}
body.simulator-layout .track-wrapper .track-label .dot{ background:#5ea7ff !important; }
body.simulator-layout .track-line{ stroke:#9fbde6 !important; }
body.simulator-layout .track-line-hatch{ stroke:rgba(255,255,255,0.95) !important; }

body.simulator-layout .scenario-command-panel{
  padding:12px 14px !important;
}
body.simulator-layout .theme-indicator-pill,
body.simulator-layout .top-speed-readout,
body.simulator-layout .route-header-top{
  background:rgba(183,224,255,0.12) !important;
  border:1px solid rgba(150,206,255,0.24) !important;
  color:#eff7ff !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.06) !important;
}

body.simulator-layout button{
  background:linear-gradient(180deg, #3ea9ff 0%, #187cff 100%) !important;
  color:#ffffff !important;
  border:1px solid rgba(186,224,255,0.22) !important;
  box-shadow:0 12px 28px rgba(13,76,170,0.34) !important;
  font-weight:800 !important;
  letter-spacing:.06em !important;
}
body.simulator-layout button:hover{
  filter:brightness(1.05);
  transform:translateY(-1px);
}
body.simulator-layout button.secondary,
body.simulator-layout .bus-command-close.secondary,
body.simulator-layout #busCmdCancel.secondary,
body.simulator-layout #resetTest.secondary,
body.simulator-layout #busCommandHoldBack,
body.simulator-layout #busCommandCurtailBack,
body.simulator-layout #busCommandRunLightBack{
  background:rgba(255,255,255,0.08) !important;
  color:#dcedff !important;
  border:1px solid rgba(151,203,255,0.22) !important;
  box-shadow:none !important;
}
body.simulator-layout button:disabled{
  background:linear-gradient(180deg, rgba(87,136,193,0.36), rgba(60,101,152,0.34)) !important;
  color:rgba(255,255,255,0.55) !important;
  border-color:rgba(156,196,255,0.12) !important;
}

body.simulator-layout select,
body.simulator-layout input,
body.simulator-layout .command-field select,
body.simulator-layout .command-field .topSelect,
body.simulator-layout .session-input,
body.simulator-layout #busCommandHoldMinutes,
body.simulator-layout #busCommandCurtailSelect,
body.simulator-layout #busCommandRunLightStartSelect,
body.simulator-layout #busCommandRunLightEndSelect,
body.simulator-layout #busCmdDepartAtTime{
  background:rgba(4,19,48,0.34) !important;
  color:#eef7ff !important;
  border:1px solid rgba(145,196,255,0.22) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04) !important;
}
body.simulator-layout select:focus,
body.simulator-layout input:focus{
  outline:none !important;
  border-color:rgba(116,192,255,0.95) !important;
  box-shadow:0 0 0 3px rgba(85,171,255,0.16) !important;
}
body.simulator-layout select option{
  background:#11346a;
  color:#eef7ff;
}
body.simulator-layout input::placeholder{ color:rgba(225,239,255,0.65) !important; }

body.simulator-layout .scenario-table-wrapper,
body.simulator-layout .schedule-table-wrapper,
body.simulator-layout .dispatch-log-wrapper,
body.simulator-layout .manual-log-body{
  border:1px solid rgba(144,196,255,0.15) !important;
  border-radius:14px !important;
  background:rgba(3,17,44,0.20) !important;
}
body.simulator-layout table{ color:#edf6ff !important; }
body.simulator-layout thead,
body.simulator-layout .dispatch-log-wrapper thead{
  background:rgba(6,23,57,0.82) !important;
}
body.simulator-layout th,
body.simulator-layout .dispatch-log-wrapper th{
  color:#9fd1ff !important;
  border-bottom:1px solid rgba(141,191,245,0.16) !important;
}
body.simulator-layout td,
body.simulator-layout .dispatch-log-wrapper td{
  color:#edf6ff !important;
  border-bottom:1px solid rgba(140,186,241,0.10) !important;
}
body.simulator-layout .scenario-table tbody tr:nth-child(even),
body.simulator-layout tbody tr:nth-child(even){
  background:rgba(255,255,255,0.03) !important;
}
body.simulator-layout tbody tr:hover{
  background:rgba(108,176,255,0.08) !important;
}

body.simulator-layout #ewtStrip{
  box-shadow:0 14px 32px rgba(1,12,33,0.24), inset 0 1px 0 rgba(255,255,255,0.08) !important;
}
body.simulator-layout #ewtStrip.ok{
  background:linear-gradient(180deg, rgba(38,105,82,0.96), rgba(22,76,57,0.96)) !important;
  border-color:rgba(126,231,171,0.34) !important;
  color:#effff6 !important;
}
body.simulator-layout #ewtStrip.warn{
  background:linear-gradient(180deg, rgba(153,104,19,0.97), rgba(113,72,10,0.97)) !important;
  border-color:rgba(252,211,77,0.34) !important;
  color:#fff9eb !important;
}
body.simulator-layout #ewtStrip.bad{
  background:linear-gradient(180deg, rgba(154,44,66,0.97), rgba(107,27,48,0.97)) !important;
  border-color:rgba(253,164,175,0.30) !important;
  color:#fff1f4 !important;
}
body.simulator-layout #ewtStrip .ewt-hud-title,
body.simulator-layout #ewtStrip .ewt-hud-value,
body.simulator-layout #ewtStrip .ewt-hud-unit,
body.simulator-layout #ewtStrip .ewt-hud-sub,
body.simulator-layout #ewtStrip .ewt-hud-target,
body.simulator-layout #ewtStrip .ewt-hud-delta,
body.simulator-layout #ewtStrip .ewt-hud-note,
body.simulator-layout #ewtStrip .ewt-hud-lost,
body.simulator-layout #ewtStrip .ewt-hud-pill,
body.simulator-layout #ewtStrip span{
  color:inherit !important;
}
body.simulator-layout #ewtStrip .ewt-hud-bar{
  background:rgba(255,255,255,0.12) !important;
}

body.simulator-layout .wmn-strip{
  background:linear-gradient(90deg, rgba(255,215,106,0.24), rgba(215,235,255,0.10)) !important;
  border:1px solid rgba(255,221,129,0.30) !important;
  box-shadow:0 10px 24px rgba(0,0,0,0.08) !important;
}
body.simulator-layout .wmn-icon{
  background:rgba(255,215,106,0.28) !important;
  border-color:rgba(255,221,129,0.30) !important;
}
body.simulator-layout .wmn-right{ border-left:1px solid rgba(255,232,170,0.18) !important; }

body.simulator-layout .kpi-dock{
  background:linear-gradient(180deg, rgba(13,43,91,0.92), rgba(8,29,63,0.94)) !important;
}
body.simulator-layout .kpi-tile{
  background:linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02)) !important;
  border:1px solid rgba(142,197,255,0.14) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04) !important;
}
body.simulator-layout .kpi-label{
  color:#9fd2ff !important;
}
body.simulator-layout .kpi-value,
body.simulator-layout .kpi-wrap,
body.simulator-layout #kpiComplianceHeadline,
body.simulator-layout #kpiComplianceDetail{
  color:#eef7ff !important;
}
body.simulator-layout .kpi-unit,
body.simulator-layout .kpi-currency{
  color:#b9d9ff !important;
}

body.simulator-layout .bus-command-dialog{
  border-radius:20px !important;
  transform:translateY(-55px);
}
body.simulator-layout .bus-command-title,
body.simulator-layout .bus-command-info strong,
body.simulator-layout .bus-command-map-title,
body.simulator-layout .bus-depart-at-title,
body.simulator-layout .dispatch-log-title,
body.simulator-layout .stand-hold-title,
body.simulator-layout .sim-clock-panel-title{
  color:#ffffff !important;
}
body.simulator-layout .bus-command-info,
body.simulator-layout .bus-command-headway-line,
body.simulator-layout .bus-command-note,
body.simulator-layout .dispatch-log-subtitle{
  color:#d8ebff !important;
}
body.simulator-layout .bus-command-map-col{
  border-left:1px solid rgba(145,196,255,0.16) !important;
}
body.simulator-layout #busCommandMapSvg{
  background:linear-gradient(180deg, rgba(236,246,255,0.98), rgba(219,236,255,0.95)) !important;
  box-shadow:inset 0 0 0 1px rgba(145,196,255,0.35) !important;
}

body.simulator-layout .sim-clock-panel{
  background:linear-gradient(180deg, rgba(15,53,113,0.90), rgba(8,31,72,0.92)) !important;
}
body.simulator-layout .sim-clock-panel-title{ color:#d9ebff !important; }
body.simulator-layout .sim-clock-box{
  background:linear-gradient(180deg,#1f2530 0%, #0e1218 52%, #090c11 100%) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08), inset 0 -8px 16px rgba(0,0,0,.24), 0 8px 18px rgba(10,16,24,.26) !important;
}
body.simulator-layout .sim-clock-colon{ color:#dcecff !important; }

body.simulator-layout #standHoldMonitor .stand-hold-col{
  background:rgba(255,255,255,0.04) !important;
  border:1px solid rgba(143,196,255,0.10) !important;
  border-radius:14px !important;
}
body.simulator-layout .stand-hold-bus,
body.simulator-layout .stand-hold-hw,
body.simulator-layout .stand-hold-dep{
  color:#eef7ff !important;
}

body.simulator-layout .app-disclaimer{
  color:rgba(223,237,255,0.78) !important;
}

/* Top HUDs */
body.simulator-layout #avlAccessHud{
  background:linear-gradient(180deg, rgba(11,37,82,0.94), rgba(8,25,55,0.96)) !important;
  color:#c9e8ff !important;
  border:1px solid rgba(145,196,255,0.22) !important;
  box-shadow:0 14px 34px rgba(2,12,31,0.26) !important;
  border-radius:15px !important;
}
body.simulator-layout .platform-home-btn{
  background:linear-gradient(180deg,#2d8fff,#1670ef) !important;
  border:1px solid rgba(255,255,255,0.18) !important;
  box-shadow:0 14px 30px rgba(3,20,56,0.22) !important;
}

/* =========================================================
   BLUE THEME TABLE VISIBILITY FIX
   Improves contrast for Early/Late and Headway columns.
   ========================================================= */
body.simulator-layout td.ontime,
body.simulator-layout td.early,
body.simulator-layout td.late,
body.simulator-layout td.action-cell,
body.simulator-layout td.headway-green,
body.simulator-layout td.headway-red,
body.simulator-layout td.headway-blue{
  font-weight:800 !important;
  text-shadow:none !important;
}

body.simulator-layout td.ontime{
  background:rgba(220,252,231,0.96) !important;
  color:#166534 !important;
}
body.simulator-layout td.early{
  background:rgba(255,237,213,0.98) !important;
  color:#9a3412 !important;
}
body.simulator-layout td.late{
  background:rgba(255,228,230,0.98) !important;
  color:#9f1239 !important;
}
body.simulator-layout td.action-cell{
  background:rgba(219,234,254,0.96) !important;
  color:#1d4ed8 !important;
}

/* Headway colours in the lighter blue theme:
   yellow = on target, red = too close, green = gap developing */
body.simulator-layout td.headway-green{
  background:rgba(254,243,199,0.98) !important;
  color:#92400e !important;
}
body.simulator-layout td.headway-red{
  background:rgba(254,226,226,0.98) !important;
  color:#b91c1c !important;
}
body.simulator-layout td.headway-blue{
  background:rgba(220,252,231,0.98) !important;
  color:#166534 !important;
}

body.simulator-layout td.hw-cell{
  padding-right:58px !important;
}
body.simulator-layout td.hw-cell .hw-micro{
  border:1px solid rgba(15,23,42,0.22) !important;
  background:rgba(15,23,42,0.08) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.34) !important;
}
body.simulator-layout td.hw-cell .hw-micro.headway-green::before{
  background:#facc15 !important;
}
body.simulator-layout td.hw-cell .hw-micro.headway-red::before{
  background:#ef4444 !important;
}
body.simulator-layout td.hw-cell .hw-micro.headway-blue::before{
  background:#22c55e !important;
}

/* =========================================================
   BLUE THEME STAND A / STAND B VISIBILITY FIX
   Makes rows and text readable inside stand cards.
   ========================================================= */
body.simulator-layout #standHoldMonitor .stand-hold-col{
  background:linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.03)) !important;
  border:1px solid rgba(143,196,255,0.18) !important;
}

body.simulator-layout #standHoldMonitor .stand-hold-meta{
  color:#d9ecff !important;
  opacity:0.95 !important;
}

body.simulator-layout #standHoldMonitor .stand-hold-list{
  max-height:70px !important;
}

body.simulator-layout #standHoldMonitor .stand-hold-line,
body.simulator-layout #standHoldMonitor .stand-hold-row,
body.simulator-layout #standHoldMonitor .stand-hold-row.one-line{
  background:linear-gradient(180deg, rgba(245,250,255,0.98), rgba(231,241,255,0.96)) !important;
  color:#16345d !important;
  border:1px solid rgba(143,196,255,0.28) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.9), 0 2px 6px rgba(2,18,48,0.08) !important;
}

body.simulator-layout #standHoldMonitor .stand-hold-bus,
body.simulator-layout #standHoldMonitor .stand-hold-hw,
body.simulator-layout #standHoldMonitor .stand-hold-dep,
body.simulator-layout #standHoldMonitor .stand-hold-row span,
body.simulator-layout #standHoldMonitor .stand-hold-line span{
  color:#16345d !important;
}

body.simulator-layout #standHoldMonitor .stand-hold-empty{
  color:#dcecff !important;
  background:rgba(255,255,255,0.04) !important;
  border:1px dashed rgba(143,196,255,0.22) !important;
  border-radius:10px !important;
  padding:8px 10px !important;
}

/* =========================================================
   LIGHTER BLUE THEME + CITY BACKDROP ON AVL DIAGRAM
   - slightly lightens the overall blue theme
   - adds a faded skyline/city watermark behind the AVL route diagram
   - city label changes with the selected City Pack
   ========================================================= */
body.simulator-layout{
  background:
    radial-gradient(circle at 12% 12%, rgba(166,214,255,0.24), transparent 26%),
    radial-gradient(circle at 88% 18%, rgba(114,178,255,0.20), transparent 24%),
    radial-gradient(circle at 50% 100%, rgba(87,150,236,0.22), transparent 36%),
    linear-gradient(180deg, #1a5aae 0%, #144d9a 38%, #103f84 100%) !important;
}

body.simulator-layout::before{
  background:radial-gradient(circle, rgba(146,209,255,0.30) 0%, rgba(146,209,255,0) 72%) !important;
}
body.simulator-layout::after{
  background:radial-gradient(circle, rgba(99,163,255,0.22) 0%, rgba(99,163,255,0) 74%) !important;
}

body.simulator-layout .card.scenario,
body.simulator-layout .scenario-command-panel,
body.simulator-layout .sim-controls,
body.simulator-layout .schedule-table-card,
body.simulator-layout .kpi-dock,
body.simulator-layout .bus-command-dialog,
body.simulator-layout .dispatch-log-card,
body.simulator-layout .dispatch-log-card.dispatch-log-fixed,
body.simulator-layout .manual-log-card,
body.simulator-layout .incident-popup,
body.simulator-layout .bus-map-overlay-inner,
body.simulator-layout .real-map-popup,
body.simulator-layout .sim-clock-panel,
body.simulator-layout .stand-hold-monitor,
body.simulator-layout #standHoldMonitor{
  background:linear-gradient(180deg, rgba(32,88,166,0.78), rgba(18,59,116,0.84)) !important;
  border:1px solid rgba(165,213,255,0.24) !important;
}

body.simulator-layout .kpi-dock{
  background:linear-gradient(180deg, rgba(22,68,133,0.92), rgba(14,50,102,0.94)) !important;
}
body.simulator-layout .kpi-tile{
  background:linear-gradient(180deg, rgba(255,255,255,0.07), rgba(255,255,255,0.03)) !important;
}

body.simulator-layout .theme-indicator-pill,
body.simulator-layout .top-speed-readout,
body.simulator-layout .route-header-top{
  background:rgba(205,234,255,0.14) !important;
  border:1px solid rgba(176,218,255,0.28) !important;
}

body.simulator-layout .track-wrapper{
  position:relative !important;
  overflow:hidden !important;
  isolation:isolate !important;
  background:linear-gradient(180deg, rgba(240,247,255,0.97), rgba(219,235,255,0.95)) !important;
  border:1px solid rgba(163,201,245,0.62) !important;
}

body.simulator-layout .track-wrapper::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;
  opacity:0.33;
  background-image:
    linear-gradient(180deg, rgba(255,255,255,0.26), rgba(255,255,255,0.02)),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 520' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23ffffff' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%23d8eaff' stop-opacity='.78'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg fill='url(%23g)' fill-opacity='.52' stroke='%238fb7e3' stroke-opacity='.24' stroke-width='2'%3E%3Cpath d='M0 430 L0 402 70 402 70 360 95 360 95 312 125 312 125 402 200 402 200 372 228 372 228 330 264 330 264 385 320 385 320 308 355 308 355 272 382 272 382 385 444 385 444 338 472 338 472 298 506 298 506 376 562 376 562 248 582 248 582 210 622 210 622 376 700 376 700 332 728 332 728 292 760 292 760 376 826 376 826 318 862 318 862 246 900 246 900 376 982 376 982 332 1010 332 1010 280 1042 280 1042 376 1122 376 1122 328 1155 328 1155 254 1188 254 1188 376 1272 376 1272 334 1305 334 1305 296 1340 296 1340 376 1420 376 1420 338 1456 338 1456 292 1490 292 1490 430 1600 430 1600 520 0 520 Z'/%3E%3Cpath d='M1118 376 C1135 334 1174 290 1228 274 C1220 329 1189 366 1118 376 Z' fill-opacity='.28'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-size:100% 100%, cover;
  background-position:center center, center bottom;
}

body.simulator-layout .track-wrapper::after{
  position:absolute;
  inset:auto 24px 22px 24px;
  pointer-events:none;
  z-index:0;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  font-size:clamp(42px, 5vw, 88px);
  font-weight:900;
  letter-spacing:.42em;
  text-transform:uppercase;
  white-space:nowrap;
  color:rgba(66,111,163,0.12);
  text-shadow:0 2px 18px rgba(255,255,255,0.55);
}

body.simulator-layout .track-wrapper > .track-label,
body.simulator-layout .track-wrapper > #simSvg,
body.simulator-layout .track-wrapper > .stand-overlay{
  position:relative;
  z-index:2;
}

body.simulator-layout[data-city-pack="london"] .track-wrapper::after{ content:"LONDON"; }
body.simulator-layout[data-city-pack="riyadh"] .track-wrapper::after{ content:"RIYADH"; }
body.simulator-layout[data-city-pack="belgrade"] .track-wrapper::after{ content:"BELGRADE"; }
body.simulator-layout[data-city-pack="berlin"] .track-wrapper::after{ content:"BERLIN"; }
body.simulator-layout[data-city-pack="belfast"] .track-wrapper::after{ content:"BELFAST"; }
body.simulator-layout[data-city-pack="braga"] .track-wrapper::after{ content:"BRAGA"; }
body.simulator-layout[data-city-pack="dublin"] .track-wrapper::after{ content:"DUBLIN"; }
body.simulator-layout[data-city-pack="lisbon"] .track-wrapper::after{ content:"LISBON"; }
body.simulator-layout[data-city-pack="madrid"] .track-wrapper::after{ content:"MADRID"; }
body.simulator-layout[data-city-pack="milan"] .track-wrapper::after{ content:"MILAN"; }
body.simulator-layout[data-city-pack="paris"] .track-wrapper::after{ content:"PARIS"; }
body.simulator-layout[data-city-pack="porto"] .track-wrapper::after{ content:"PORTO"; }
body.simulator-layout[data-city-pack="prishtina"] .track-wrapper::after{ content:"PRISHTINA"; }
body.simulator-layout[data-city-pack="tirana"] .track-wrapper::after{ content:"TIRANA"; }
body.simulator-layout[data-city-pack="default"] .track-wrapper::after,
body.simulator-layout:not([data-city-pack]) .track-wrapper::after{ content:"CITY"; }

body.simulator-layout select,
body.simulator-layout input,
body.simulator-layout .command-field select,
body.simulator-layout .command-field .topSelect,
body.simulator-layout .session-input,
body.simulator-layout #busCommandHoldMinutes,
body.simulator-layout #busCommandCurtailSelect,
body.simulator-layout #busCommandRunLightStartSelect,
body.simulator-layout #busCommandRunLightEndSelect,
body.simulator-layout #busCmdDepartAtTime{
  background:rgba(8,27,66,0.30) !important;
  border:1px solid rgba(165,213,255,0.24) !important;
}

body.simulator-layout button{
  background:linear-gradient(180deg, #4db0ff 0%, #2389ff 100%) !important;
}

body.simulator-layout .sim-clock-panel{
  background:linear-gradient(180deg, rgba(22,72,144,0.92), rgba(12,44,92,0.94)) !important;
}


/* City-specific monument backdrops on AVL route diagram */
body.simulator-layout[data-city-pack="london"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V430h145v-26h18v26h95v-50h26v50h66v-112h34v112h48v-72h26v72h58v-34h210v34h54v-82h20v82h120v-40h20v40h165v-28h18v28h60v90z%27/%3E%20%3Cpath%20d%3D%27M392%20430v-188h24v188zM384%20248h40l-20-40z%27/%3E%20%3Ccircle%20cx%3D%27620%27%20cy%3D%27310%27%20r%3D%2792%27%20fill%3D%27none%27%20stroke%3D%27%239fc7ef%27%20stroke-opacity%3D%27.34%27%20stroke-width%3D%2712%27/%3E%20%3Cpath%20d%3D%27M620%20218v184M528%20310h184%27%20fill%3D%27none%27%20stroke%3D%27%239fc7ef%27%20stroke-opacity%3D%27.24%27%20stroke-width%3D%274%27/%3E%20%3Cpath%20d%3D%27M1005%20430V320h18v110zM1030%20430V300h18v130zM1055%20430V280h18v150z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;}
body.simulator-layout[data-city-pack="riyadh"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V438h120v-40h60v40h90v-58h40v58h130v-32h90v32h110v-160h54v160h84v-110h28v110h180v-48h48v48h150v82z%27/%3E%20%3Cpath%20d%3D%27M690%20438V180h74v258z%27/%3E%20%3Cpath%20d%3D%27M708%20180h38l36-52v12l-14%2024%2014%2016-16%200-8-10-8%2010-16%200%2014-16-14-24V128z%27%20/%3E%20%3Cpath%20d%3D%27M890%20438V215h60v223zM920%20215l30-82%2030%2082z%27/%3E%20%3Cpath%20d%3D%27M1120%20438V250h36v188zM1110%20250h56l-28-38z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;}
body.simulator-layout[data-city-pack="belgrade"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V440h150v-30h58v30h170v-58h42v58h118v-74h86v74h150v-48h62v48h150v80z%27/%3E%20%3Cpath%20d%3D%27M560%20440V270h84v170zM548%20270h108l-54-44z%27/%3E%20%3Cpath%20d%3D%27M595%20226c14-28%2038-40%2062%200%27%20fill%3D%27none%27%20stroke%3D%27%239fc7ef%27%20stroke-opacity%3D%27.28%27%20stroke-width%3D%275%27/%3E%20%3Cpath%20d%3D%27M870%20440V210h26v230zM850%20230h66v-20h-66zM860%20210l16-42%2016%2042z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;}
body.simulator-layout[data-city-pack="berlin"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V438h160v-22h60v22h180v-36h80v36h220v-30h78v30h120v-38h78v38h160v82z%27/%3E%20%3Cpath%20d%3D%27M590%20438V188h20v250zM565%20212h70l-35-70zM575%20238h50%27%20/%3E%20%3Cpath%20d%3D%27M900%20438V286h160v152zM920%20286v-30h18v30M952%20286v-30h18v30M984%20286v-30h18v30M1016%20286v-30h18v30M1048%20286v-30h18v30M1080%20286v-30h18v30%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;}
body.simulator-layout[data-city-pack="belfast"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V446h130v-18h44v18h180v-44h100v44h130v-30h50v30h130v-40h70v40h170v74z%27/%3E%20%3Cpath%20d%3D%27M432%20446V280h54v166zM418%20280h82l-41-50z%27/%3E%20%3Cpath%20d%3D%27M860%20446V250h20v196zM820%20286l50-80%2050%2080zM930%20446V250h20v196zM890%20286l50-80%2050%2080z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;}
body.simulator-layout[data-city-pack="braga"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V448h150v-18h44v18h220v-34h86v34h200v-50h110v50h130v72z%27/%3E%20%3Cpath%20d%3D%27M430%20448V270h28v178zM404%20448V300h22v148zM462%20448V300h22v148zM410%20300h68v-20h-68zM418%20280l20-28%2020%2028z%27%20/%3E%20%3Cpath%20d%3D%27M785%20448c0-38%2018-58%2038-74%2018-14%2034-28%2034-54%200%2026%2016%2040%2034%2054%2020%2016%2038%2036%2038%2074z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;}
body.simulator-layout[data-city-pack="dublin"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V446h180v-24h44v24h180v-34h84v34h138v-46h94v46h130v74z%27/%3E%20%3Cpath%20d%3D%27M790%20446V170h20v276zM776%20184h48l-24-70z%27%20/%3E%20%3Cpath%20d%3D%27M430%20446V286h76v160zM418%20286h100l-50-34z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;}
body.simulator-layout[data-city-pack="lisbon"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V446h180v-24h44v24h160v-30h92v30h176v-44h120v44h150v74z%27/%3E%20%3Cpath%20d%3D%27M315%20446V320h26v126zM300%20320h56v-18h-56zM304%20302l12-18h24l12%2018z%27%20/%3E%20%3Cpath%20d%3D%27M760%20392h220v10H760zM780%20392V280h14v112zM820%20392V260h14v132zM860%20392V240h14v152zM900%20392V220h14v172zM940%20392V240h14v152z%27%20fill%3D%27%23d8eaff%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;}
body.simulator-layout[data-city-pack="madrid"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V446h170v-22h44v22h210v-28h100v28h184v-38h118v38h150v74z%27/%3E%20%3Cpath%20d%3D%27M545%20446V296h130v150zM558%20296v-28h104v28M575%20296V260M606%20296V260M638%20296V260M669%20296V260%27%20/%3E%20%3Cpath%20d%3D%27M875%20446V230h24v216zM860%20250h54v-18h-54zM872%20230l14-26%2014%2026z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;}
body.simulator-layout[data-city-pack="milan"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V448h190v-20h44v20h210v-32h80v32h250v-42h110v42h170v72z%27/%3E%20%3Cpath%20d%3D%27M640%20448V250h140v198zM650%20250l12-18%2012%2018%2012-24%2012%2024%2012-18%2012%2018%2012-20%2012%2020%2012-18%2012%2018zM668%20448V300M700%20448V284M732%20448V302M764%20448V290%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;}
body.simulator-layout[data-city-pack="paris"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V446h150v-20h44v20h170v-34h90v34h230v-40h100v40h160v74z%27/%3E%20%3Cpath%20d%3D%27M620%20446%20700%20170%20780%20446zM664%20330h72M648%20380h104M680%20446V306h40v140z%27%20/%3E%20%3Cpath%20d%3D%27M960%20446V330h120v116zM972%20330v-24h96v24M990%20330V300M1020%20330V300M1050%20330V300%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;}
body.simulator-layout[data-city-pack="porto"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V448h160v-20h44v20h140v-34h86v34h170v-48h110v48h130v72z%27/%3E%20%3Cpath%20d%3D%27M330%20392h250v10H330zM350%20392V320h14v72zM390%20392V300h14v92zM430%20392V280h14v112zM470%20392V300h14v92zM510%20392V320h14v72z%27%20/%3E%20%3Cpath%20d%3D%27M780%20448V248h22v200zM770%20260h42v-20h-42zM781%20248l10-30%2010%2030z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;}
body.simulator-layout[data-city-pack="prishtina"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V448h160v-22h44v22h230v-34h96v34h170v-46h110v46h150v72z%27/%3E%20%3Cpath%20d%3D%27M560%20448V300h160v148zM582%20340c0-24%2016-40%2034-40s34%2016%2034%2040-16%2040-34%2040-34-16-34-40zm70%200c0-24%2016-40%2034-40s34%2016%2034%2040-16%2040-34%2040-34-16-34-40z%27%20fill%3D%27none%27%20stroke%3D%27%239fc7ef%27%20stroke-opacity%3D%27.34%27%20stroke-width%3D%278%27/%3E%20%3Cpath%20d%3D%27M810%20448V260h24v188zM798%20272h48v-16h-48z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;}
body.simulator-layout[data-city-pack="tirana"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V448h170v-18h44v18h180v-34h90v34h190v-44h102v44h150v72z%27/%3E%20%3Cpath%20d%3D%27M540%20448V260h28v188zM530%20272h48v-18h-48zM544%20260l10-24%2010%2024z%27%20/%3E%20%3Cpath%20d%3D%27M620%20448V286h18v162zM638%20448V314h58v134zM650%20314l17-42%2017%2042z%27%20/%3E%20%3Cpath%20d%3D%27M840%20448V300h120l-60-70z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;}


/* =========================================================
   FINAL VISIBILITY + CITY BACKDROP TUNE-UP
   - stronger monument backdrop
   - remove faint abstract blocks behind London skyline
   - darker readable footer/result text where needed
   ========================================================= */
body.simulator-layout .track-wrapper::before{
  opacity:0.56 !important;
  filter:saturate(1.08) contrast(1.02);
}
body.simulator-layout .track-wrapper::after{
  color:rgba(22,46,82,0.18) !important;
  text-shadow:0 2px 14px rgba(255,255,255,0.38) !important;
}
body.simulator-layout[data-city-pack="london"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(255,255,255,0.16), rgba(255,255,255,0.01)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23cfe4ff%27%20fill-opacity%3D%27.80%27%20stroke%3D%27%237ea8d7%27%20stroke-opacity%3D%27.26%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V448h150v-18h38v18h110v-42h20v42h62v-146h28v146h60v-38h18v38h110v-160h26v160h58v-52h18v52h120v-30h18v30h78v-100h18v100h86v-46h18v46h95v-28h18v28h160v72z%27/%3E%20%3Cpath%20d%3D%27M380%20448V235h28v213zM370%20244h48l-24-48z%27%20/%3E%20%3Ccircle%20cx%3D%27665%27%20cy%3D%27314%27%20r%3D%27108%27%20fill%3D%27none%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.52%27%20stroke-width%3D%2714%27/%3E%20%3Cpath%20d%3D%27M665%20206v216M557%20314h216M588%20237l154%20154M742%20237L588%20391%27%20fill%3D%27none%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.30%27%20stroke-width%3D%274%27/%3E%20%3Cpath%20d%3D%27M1078%20448V336h16v112zM1102%20448V308h18v140zM1128%20448V284h20v164z%27%20/%3E%20%3C/g%3E%20%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-size:100% 100%, cover !important;
  background-position:center center, center bottom !important;
}
/* Make diagram captions and simulator legal/footer copy darker */
body.simulator-layout .track-label,
body.simulator-layout .track-label .next-bus,
body.simulator-layout .legend,
body.simulator-layout .legend-item,
body.simulator-layout .legend span{
  color:#26364d !important;
}
body.simulator-layout .app-disclaimer,
body.simulator-layout .app-disclaimer span,
body.simulator-layout .app-disclaimer-sep{
  color:rgba(8,15,28,0.82) !important;
  opacity:1 !important;
  text-shadow:0 1px 0 rgba(255,255,255,0.25) !important;
}
/* Stronger contrast for result tables */
body.simulator-layout td.ontime,
body.simulator-layout td.early,
body.simulator-layout td.late,
body.simulator-layout td.action-cell,
body.simulator-layout td.headway-green,
body.simulator-layout td.headway-red,
body.simulator-layout td.headway-blue,
body.simulator-layout td.hw-cell,
body.simulator-layout td.status,
body.simulator-layout td:last-child{
  text-shadow:none !important;
}
body.simulator-layout td.ontime,
body.simulator-layout td.early,
body.simulator-layout td.late,
body.simulator-layout td.action-cell,
body.simulator-layout td.headway-green,
body.simulator-layout td.headway-red,
body.simulator-layout td.headway-blue{
  color:#101820 !important;
}


/* Re-apply stronger city backdrop art for all city packs */
body.simulator-layout[data-city-pack="london"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V430h145v-26h18v26h95v-50h26v50h66v-112h34v112h48v-72h26v72h58v-34h210v34h54v-82h20v82h120v-40h20v40h165v-28h18v28h60v90z%27/%3E%20%3Cpath%20d%3D%27M392%20430v-188h24v188zM384%20248h40l-20-40z%27/%3E%20%3Ccircle%20cx%3D%27620%27%20cy%3D%27310%27%20r%3D%2792%27%20fill%3D%27none%27%20stroke%3D%27%239fc7ef%27%20stroke-opacity%3D%27.34%27%20stroke-width%3D%2712%27/%3E%20%3Cpath%20d%3D%27M620%20218v184M528%20310h184%27%20fill%3D%27none%27%20stroke%3D%27%239fc7ef%27%20stroke-opacity%3D%27.24%27%20stroke-width%3D%274%27/%3E%20%3Cpath%20d%3D%27M1005%20430V320h18v110zM1030%20430V300h18v130zM1055%20430V280h18v150z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;;opacity:0.88 !important;filter:saturate(1.22) contrast(1.10) !important;}
body.simulator-layout[data-city-pack="riyadh"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V438h120v-40h60v40h90v-58h40v58h130v-32h90v32h110v-160h54v160h84v-110h28v110h180v-48h48v48h150v82z%27/%3E%20%3Cpath%20d%3D%27M690%20438V180h74v258z%27/%3E%20%3Cpath%20d%3D%27M708%20180h38l36-52v12l-14%2024%2014%2016-16%200-8-10-8%2010-16%200%2014-16-14-24V128z%27%20/%3E%20%3Cpath%20d%3D%27M890%20438V215h60v223zM920%20215l30-82%2030%2082z%27/%3E%20%3Cpath%20d%3D%27M1120%20438V250h36v188zM1110%20250h56l-28-38z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;;opacity:0.88 !important;filter:saturate(1.22) contrast(1.10) !important;}
body.simulator-layout[data-city-pack="belgrade"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V440h150v-30h58v30h170v-58h42v58h118v-74h86v74h150v-48h62v48h150v80z%27/%3E%20%3Cpath%20d%3D%27M560%20440V270h84v170zM548%20270h108l-54-44z%27/%3E%20%3Cpath%20d%3D%27M595%20226c14-28%2038-40%2062%200%27%20fill%3D%27none%27%20stroke%3D%27%239fc7ef%27%20stroke-opacity%3D%27.28%27%20stroke-width%3D%275%27/%3E%20%3Cpath%20d%3D%27M870%20440V210h26v230zM850%20230h66v-20h-66zM860%20210l16-42%2016%2042z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;;opacity:0.88 !important;filter:saturate(1.22) contrast(1.10) !important;}
body.simulator-layout[data-city-pack="berlin"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V438h160v-22h60v22h180v-36h80v36h220v-30h78v30h120v-38h78v38h160v82z%27/%3E%20%3Cpath%20d%3D%27M590%20438V188h20v250zM565%20212h70l-35-70zM575%20238h50%27%20/%3E%20%3Cpath%20d%3D%27M900%20438V286h160v152zM920%20286v-30h18v30M952%20286v-30h18v30M984%20286v-30h18v30M1016%20286v-30h18v30M1048%20286v-30h18v30M1080%20286v-30h18v30%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;;opacity:0.88 !important;filter:saturate(1.22) contrast(1.10) !important;}
body.simulator-layout[data-city-pack="belfast"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V446h130v-18h44v18h180v-44h100v44h130v-30h50v30h130v-40h70v40h170v74z%27/%3E%20%3Cpath%20d%3D%27M432%20446V280h54v166zM418%20280h82l-41-50z%27/%3E%20%3Cpath%20d%3D%27M860%20446V250h20v196zM820%20286l50-80%2050%2080zM930%20446V250h20v196zM890%20286l50-80%2050%2080z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;;opacity:0.88 !important;filter:saturate(1.22) contrast(1.10) !important;}
body.simulator-layout[data-city-pack="braga"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V448h150v-18h44v18h220v-34h86v34h200v-50h110v50h130v72z%27/%3E%20%3Cpath%20d%3D%27M430%20448V270h28v178zM404%20448V300h22v148zM462%20448V300h22v148zM410%20300h68v-20h-68zM418%20280l20-28%2020%2028z%27%20/%3E%20%3Cpath%20d%3D%27M785%20448c0-38%2018-58%2038-74%2018-14%2034-28%2034-54%200%2026%2016%2040%2034%2054%2020%2016%2038%2036%2038%2074z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;;opacity:0.88 !important;filter:saturate(1.22) contrast(1.10) !important;}
body.simulator-layout[data-city-pack="dublin"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V446h180v-24h44v24h180v-34h84v34h138v-46h94v46h130v74z%27/%3E%20%3Cpath%20d%3D%27M790%20446V170h20v276zM776%20184h48l-24-70z%27%20/%3E%20%3Cpath%20d%3D%27M430%20446V286h76v160zM418%20286h100l-50-34z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;;opacity:0.88 !important;filter:saturate(1.22) contrast(1.10) !important;}
body.simulator-layout[data-city-pack="madrid"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V446h170v-22h44v22h210v-28h100v28h184v-38h118v38h150v74z%27/%3E%20%3Cpath%20d%3D%27M545%20446V296h130v150zM558%20296v-28h104v28M575%20296V260M606%20296V260M638%20296V260M669%20296V260%27%20/%3E%20%3Cpath%20d%3D%27M875%20446V230h24v216zM860%20250h54v-18h-54zM872%20230l14-26%2014%2026z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;;opacity:0.88 !important;filter:saturate(1.22) contrast(1.10) !important;}
body.simulator-layout[data-city-pack="milan"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V448h190v-20h44v20h210v-32h80v32h250v-42h110v42h170v72z%27/%3E%20%3Cpath%20d%3D%27M640%20448V250h140v198zM650%20250l12-18%2012%2018%2012-24%2012%2024%2012-18%2012%2018%2012-20%2012%2020%2012-18%2012%2018zM668%20448V300M700%20448V284M732%20448V302M764%20448V290%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;;opacity:0.88 !important;filter:saturate(1.22) contrast(1.10) !important;}
body.simulator-layout[data-city-pack="paris"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V446h150v-20h44v20h170v-34h90v34h230v-40h100v40h160v74z%27/%3E%20%3Cpath%20d%3D%27M620%20446%20700%20170%20780%20446zM664%20330h72M648%20380h104M680%20446V306h40v140z%27%20/%3E%20%3Cpath%20d%3D%27M960%20446V330h120v116zM972%20330v-24h96v24M990%20330V300M1020%20330V300M1050%20330V300%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;;opacity:0.88 !important;filter:saturate(1.22) contrast(1.10) !important;}
body.simulator-layout[data-city-pack="porto"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V448h160v-20h44v20h140v-34h86v34h170v-48h110v48h130v72z%27/%3E%20%3Cpath%20d%3D%27M330%20392h250v10H330zM350%20392V320h14v72zM390%20392V300h14v92zM430%20392V280h14v112zM470%20392V300h14v92zM510%20392V320h14v72z%27%20/%3E%20%3Cpath%20d%3D%27M780%20448V248h22v200zM770%20260h42v-20h-42zM781%20248l10-30%2010%2030z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;;opacity:0.88 !important;filter:saturate(1.22) contrast(1.10) !important;}
body.simulator-layout[data-city-pack="prishtina"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V448h160v-22h44v22h230v-34h96v34h170v-46h110v46h150v72z%27/%3E%20%3Cpath%20d%3D%27M560%20448V300h160v148zM582%20340c0-24%2016-40%2034-40s34%2016%2034%2040-16%2040-34%2040-34-16-34-40zm70%200c0-24%2016-40%2034-40s34%2016%2034%2040-16%2040-34%2040-34-16-34-40z%27%20fill%3D%27none%27%20stroke%3D%27%239fc7ef%27%20stroke-opacity%3D%27.34%27%20stroke-width%3D%278%27/%3E%20%3Cpath%20d%3D%27M810%20448V260h24v188zM798%20272h48v-16h-48z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;;opacity:0.88 !important;filter:saturate(1.22) contrast(1.10) !important;}
body.simulator-layout[data-city-pack="tirana"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.03)), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201600%20520%27%20preserveAspectRatio%3D%27none%27%3E%20%3Cg%20fill%3D%27%23d8eaff%27%20fill-opacity%3D%27.58%27%20stroke%3D%27%238fb7e3%27%20stroke-opacity%3D%27.22%27%20stroke-width%3D%272%27%3E%20%3Cpath%20d%3D%27M0%20520V448h170v-18h44v18h180v-34h90v34h190v-44h102v44h150v72z%27/%3E%20%3Cpath%20d%3D%27M540%20448V260h28v188zM530%20272h48v-18h-48zM544%20260l10-24%2010%2024z%27%20/%3E%20%3Cpath%20d%3D%27M620%20448V286h18v162zM638%20448V314h58v134zM650%20314l17-42%2017%2042z%27%20/%3E%20%3Cpath%20d%3D%27M840%20448V300h120l-60-70z%27%20/%3E%20%3C/g%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-size:100% 100%, cover !important;background-position:center center, center bottom !important;;opacity:0.88 !important;filter:saturate(1.22) contrast(1.10) !important;}
body.simulator-layout[data-city-pack="lisbon"] .track-wrapper::before{filter:saturate(1.22) contrast(1.10) !important;opacity:0.9 !important;}


/* =========================================================
   KPI FOOTER LAYOUT SPREAD FIX
   - spread bottom KPI tiles so all key panels are visible
   - make the last 3 panels (incentive / action / compliance) fully visible
   ========================================================= */
body.simulator-layout .bottom-dock{
  left:12px !important;
  right:12px !important;
}
body.simulator-layout .kpi-tiles{
  display:grid !important;
  grid-template-columns: repeat(7, minmax(110px, 1fr)) minmax(190px, 1.15fr) minmax(320px, 1.9fr) minmax(360px, 2.1fr) !important;
  gap:8px !important;
  align-items:stretch !important;
  justify-content:stretch !important;
  overflow:visible !important;
}
body.simulator-layout .kpi-tile,
body.simulator-layout .kpi-tile.kpi-tile-wide,
body.simulator-layout .kpi-tile.action{
  min-width:0 !important;
  width:auto !important;
  flex:auto !important;
}
body.simulator-layout .kpi-tile{
  padding:9px 10px !important;
}
body.simulator-layout .kpi-value.kpi-wrap{
  font-size:0.92rem !important;
  line-height:1.18 !important;
}
body.simulator-layout #kpiComplianceHeadline{
  font-size:1.0rem !important;
  line-height:1.15 !important;
}
body.simulator-layout #kpiComplianceDetail{
  font-size:0.78rem !important;
  line-height:1.18 !important;
}
@media (max-width: 1700px){
  body.simulator-layout .kpi-tiles{
    grid-template-columns: repeat(7, minmax(100px, 1fr)) minmax(170px, 1.05fr) minmax(280px, 1.7fr) minmax(300px, 1.8fr) !important;
  }
}
@media (max-width: 1450px){
  body.simulator-layout .kpi-tiles{
    grid-template-columns: repeat(5, minmax(120px, 1fr)) minmax(180px, 1.2fr) minmax(240px, 1.5fr) minmax(260px, 1.7fr) !important;
  }
}
@media (max-width: 1200px){
  body.simulator-layout .kpi-tiles{
    grid-template-columns: repeat(3, minmax(140px, 1fr)) repeat(2, minmax(220px, 1.3fr)) !important;
  }
}

/* =========================================================
   BOTTOM RESULTS STACK FIX
   Shows all 3 result sections instead of hiding them behind KPI dock:
   1) What matters now
   2) Selected / EWT status strip
   3) KPI results dock
   ========================================================= */
body.simulator-layout .wmn-strip{
  position:relative !important;
  z-index:20 !important;
  margin:10px 14px 6px 14px !important;
  width:auto !important;
  box-sizing:border-box !important;
  border:1px solid rgba(255,221,129,0.42) !important;
  background:linear-gradient(90deg, rgba(255,230,150,0.92), rgba(234,244,255,0.88)) !important;
  color:#101820 !important;
  box-shadow:0 8px 20px rgba(0,0,0,0.10) !important;
}
body.simulator-layout .wmn-label,
body.simulator-layout .wmn-text,
body.simulator-layout .wmn-sep,
body.simulator-layout .wmn-exposure-label,
body.simulator-layout .wmn-exposure-value,
body.simulator-layout .wmn-exposure-sub{
  color:#101820 !important;
  opacity:1 !important;
}
body.simulator-layout .wmn-label{
  font-weight:900 !important;
}

body.simulator-layout .sim-controls.ewt-compact{
  position:relative !important;
  z-index:19 !important;
  margin:6px 14px 8px 14px !important;
  width:auto !important;
  box-sizing:border-box !important;
  padding:10px 12px !important;
  border-radius:14px !important;
  border:1px solid rgba(165,213,255,0.30) !important;
  background:linear-gradient(180deg, rgba(220,236,255,0.92), rgba(190,216,249,0.88)) !important;
  color:#101820 !important;
  box-shadow:0 8px 20px rgba(0,0,0,0.10) !important;
}
body.simulator-layout .sim-controls.ewt-compact *,
body.simulator-layout .sim-controls.ewt-compact .value,
body.simulator-layout .sim-controls.ewt-compact .session-label{
  color:#101820 !important;
}
body.simulator-layout .sim-controls.ewt-compact .session-input{
  background:rgba(255,255,255,0.74) !important;
  color:#101820 !important;
  border:1px solid rgba(35,68,115,0.22) !important;
}

body.simulator-layout .bottom-dock{
  position:relative !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  z-index:18 !important;
  display:block !important;
  width:auto !important;
  margin:8px 14px 10px 14px !important;
  pointer-events:auto !important;
}
body.simulator-layout .kpi-dock{
  width:100% !important;
  box-sizing:border-box !important;
  padding:12px 12px !important;
}
body.simulator-layout .kpi-tiles{
  overflow:visible !important;
}

/* Footer should not sit over the result panels */
body.simulator-layout .app-disclaimer{
  position:relative !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  z-index:1 !important;
  display:block !important;
  padding:6px 110px 8px 110px !important;
  color:rgba(8,15,28,0.82) !important;
  background:transparent !important;
}

/* Keep the floating buttons visible but out of the KPI panel way */
body.simulator-layout #aboutBtn{
  bottom:10px !important;
  z-index:10000 !important;
}
body.simulator-layout #manualLogToggleBtn{
  right:168px !important;
  bottom:10px !important;
  z-index:10000 !important;
}
body.simulator-layout #dispatchToggleBtn{
  right:16px !important;
  bottom:10px !important;
  z-index:10000 !important;
}

@media (max-width: 1000px){
  body.simulator-layout .app-disclaimer{
    padding-left:10px !important;
    padding-right:10px !important;
  }
}

/* =========================================================
   REALISTIC CITY PHOTO BACKDROPS — injected version
   Uses actual cityscape image files instead of SVG/arrow-style outlines.
   The pale overlay keeps buses, stops, route lines, and labels readable.
   ========================================================= */
body.simulator-layout .track-wrapper{
  background:linear-gradient(180deg, rgba(235,246,255,0.96), rgba(211,231,255,0.93)) !important;
}

body.simulator-layout .track-wrapper::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
  pointer-events:none !important;
  opacity:1 !important;
  filter:none !important;
  background-repeat:no-repeat !important;
  background-size:100% 100%, cover !important;
  background-position:center center, center center !important;
  background-blend-mode:normal !important;
}

/* remove the giant city-word watermark because the photo landmarks identify the city */
body.simulator-layout .track-wrapper::after{
  content:"" !important;
  display:none !important;
}

/* keep operational content above the city photo */
body.simulator-layout .track-wrapper > .track-label,
body.simulator-layout .track-wrapper > #simSvg,
body.simulator-layout .track-wrapper > .stand-overlay,
body.simulator-layout .track-wrapper .bus-label,
body.simulator-layout .track-wrapper .next-bus{
  position:relative !important;
  z-index:2 !important;
}

/* Main requested city images */
body.simulator-layout[data-city-pack="london"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.46), rgba(218,236,255,0.42)), url("assets/city-bg/london.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="manchester"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.46), rgba(218,236,255,0.42)), url("assets/city-bg/manchester.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="berlin"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.46), rgba(218,236,255,0.42)), url("assets/city-bg/berlin.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="madrid"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.46), rgba(218,236,255,0.42)), url("assets/city-bg/madrid.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="lisbon"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.46), rgba(218,236,255,0.42)), url("assets/city-bg/lisbon.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="belgrade"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.46), rgba(218,236,255,0.42)), url("assets/city-bg/belgrade.jpg?v=city-images-v3") !important;
}

/* Regional fallbacks until dedicated images are supplied/generated */
body.simulator-layout[data-city-pack="belfast"] .track-wrapper::before,
body.simulator-layout[data-city-pack="dublin"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.48), rgba(218,236,255,0.44)), url("assets/city-bg/london.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="braga"] .track-wrapper::before,
body.simulator-layout[data-city-pack="porto"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.48), rgba(218,236,255,0.44)), url("assets/city-bg/lisbon.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="prishtina"] .track-wrapper::before,
body.simulator-layout[data-city-pack="tirana"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.48), rgba(218,236,255,0.44)), url("assets/city-bg/belgrade.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="milan"] .track-wrapper::before,
body.simulator-layout[data-city-pack="paris"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.48), rgba(218,236,255,0.44)), url("assets/city-bg/madrid.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="riyadh"] .track-wrapper::before,
body.simulator-layout[data-city-pack="default"] .track-wrapper::before,
body.simulator-layout:not([data-city-pack]) .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.50), rgba(218,236,255,0.46)), url("assets/city-bg/berlin.jpg?v=city-images-v3") !important;
}

/* make route labels readable over the photo */
body.simulator-layout .track-wrapper .track-label,
body.simulator-layout .track-wrapper .next-bus{
  color:#073763 !important;
  text-shadow:0 1px 0 rgba(255,255,255,0.72), 0 0 8px rgba(255,255,255,0.62) !important;
}

/* =========================================================
   CITY PHOTO POSITION FIX
   - lowers the city photographs inside the AVL route window
   - stretches/fits the full image into the diagram area so landmarks are visible
   - reduces the white overlay so city attractions can be seen clearly
   ========================================================= */
body.simulator-layout .track-wrapper::before{
  background-repeat:no-repeat !important;
  background-size:100% 100%, 100% 100% !important;
  background-position:center center, center bottom !important;
  opacity:1 !important;
}
body.simulator-layout[data-city-pack="london"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.30), rgba(218,236,255,0.24)), url("assets/city-bg/london.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="manchester"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.30), rgba(218,236,255,0.24)), url("assets/city-bg/manchester.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="berlin"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.30), rgba(218,236,255,0.24)), url("assets/city-bg/berlin.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="madrid"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.30), rgba(218,236,255,0.24)), url("assets/city-bg/madrid.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="lisbon"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.30), rgba(218,236,255,0.24)), url("assets/city-bg/lisbon.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="belgrade"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.30), rgba(218,236,255,0.24)), url("assets/city-bg/belgrade.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="belfast"] .track-wrapper::before,
body.simulator-layout[data-city-pack="dublin"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.32), rgba(218,236,255,0.26)), url("assets/city-bg/london.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="braga"] .track-wrapper::before,
body.simulator-layout[data-city-pack="porto"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.32), rgba(218,236,255,0.26)), url("assets/city-bg/lisbon.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="prishtina"] .track-wrapper::before,
body.simulator-layout[data-city-pack="tirana"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.32), rgba(218,236,255,0.26)), url("assets/city-bg/belgrade.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="milan"] .track-wrapper::before,
body.simulator-layout[data-city-pack="paris"] .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.32), rgba(218,236,255,0.26)), url("assets/city-bg/madrid.jpg?v=city-images-v3") !important;
}
body.simulator-layout[data-city-pack="riyadh"] .track-wrapper::before,
body.simulator-layout[data-city-pack="default"] .track-wrapper::before,
body.simulator-layout:not([data-city-pack]) .track-wrapper::before{
  background-image:linear-gradient(180deg, rgba(232,244,255,0.34), rgba(218,236,255,0.28)), url("assets/city-bg/berlin.jpg?v=city-images-v3") !important;
}


/* =========================================================
   FINAL HIGH-QUALITY REALISTIC CITY PHOTO BACKDROPS
   These overrides replace earlier SVG/low-res/faded attempts.
   ========================================================= */
body.simulator-layout .track-wrapper{
  position:relative !important;
  overflow:hidden !important;
  isolation:isolate !important;
  background:linear-gradient(180deg, rgba(236,247,255,0.98), rgba(219,236,255,0.96)) !important;
}
body.simulator-layout .track-wrapper::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
  pointer-events:none !important;
  opacity:1 !important;
  filter:none !important;
  background-repeat:no-repeat !important;
  background-size:100% 100% !important;
  background-position:center center !important;
}
body.simulator-layout .track-wrapper::after{
  display:none !important;
  content:"" !important;
}
body.simulator-layout .track-wrapper > .track-label,
body.simulator-layout .track-wrapper > #simSvg,
body.simulator-layout .track-wrapper > .stand-overlay{
  position:relative !important;
  z-index:2 !important;
}
body.simulator-layout[data-city-pack="london"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(236,247,255,0.08), rgba(219,236,255,0.06)), url("assets/city-bg/london.jpg?v=city-images-v3") !important;}
body.simulator-layout[data-city-pack="manchester"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(236,247,255,0.08), rgba(219,236,255,0.06)), url("assets/city-bg/manchester.jpg?v=city-images-v3") !important;}
body.simulator-layout[data-city-pack="riyadh"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(236,247,255,0.08), rgba(219,236,255,0.06)), url("assets/city-bg/riyadh.jpg?v=city-images-v3") !important;}
body.simulator-layout[data-city-pack="belfast"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(236,247,255,0.08), rgba(219,236,255,0.06)), url("assets/city-bg/belfast.jpg?v=city-images-v3") !important;}
body.simulator-layout[data-city-pack="belgrade"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(236,247,255,0.08), rgba(219,236,255,0.06)), url("assets/city-bg/belgrade.jpg?v=city-images-v3") !important;}
body.simulator-layout[data-city-pack="berlin"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(236,247,255,0.08), rgba(219,236,255,0.06)), url("assets/city-bg/berlin.jpg?v=city-images-v3") !important;}
body.simulator-layout[data-city-pack="braga"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(236,247,255,0.08), rgba(219,236,255,0.06)), url("assets/city-bg/braga.jpg?v=city-images-v3") !important;}
body.simulator-layout[data-city-pack="dublin"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(236,247,255,0.08), rgba(219,236,255,0.06)), url("assets/city-bg/dublin.jpg?v=city-images-v3") !important;}
body.simulator-layout[data-city-pack="lisbon"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(236,247,255,0.08), rgba(219,236,255,0.06)), url("assets/city-bg/lisbon.jpg?v=city-images-v3") !important;}
body.simulator-layout[data-city-pack="madrid"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(236,247,255,0.08), rgba(219,236,255,0.06)), url("assets/city-bg/madrid.jpg?v=city-images-v3") !important;}
body.simulator-layout[data-city-pack="milan"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(236,247,255,0.08), rgba(219,236,255,0.06)), url("assets/city-bg/milan.jpg?v=city-images-v3") !important;}
body.simulator-layout[data-city-pack="paris"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(236,247,255,0.08), rgba(219,236,255,0.06)), url("assets/city-bg/paris.jpg?v=city-images-v3") !important;}
body.simulator-layout[data-city-pack="porto"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(236,247,255,0.08), rgba(219,236,255,0.06)), url("assets/city-bg/porto.jpg?v=city-images-v3") !important;}
body.simulator-layout[data-city-pack="prishtina"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(236,247,255,0.08), rgba(219,236,255,0.06)), url("assets/city-bg/prishtina.jpg?v=city-images-v3") !important;}
body.simulator-layout[data-city-pack="tirana"] .track-wrapper::before{background-image:linear-gradient(180deg, rgba(236,247,255,0.08), rgba(219,236,255,0.06)), url("assets/city-bg/tirana.jpg?v=city-images-v3") !important;}
body.simulator-layout[data-city-pack="default"] .track-wrapper::before,
body.simulator-layout:not([data-city-pack]) .track-wrapper::before{background-image:linear-gradient(180deg, rgba(236,247,255,0.08), rgba(219,236,255,0.06)), url("assets/city-bg/london.jpg?v=city-images-v3") !important;}


/* === ALWAYS-ON-TOP ACTION ENTRY / DISPATCHER LOG MODAL FIX === */
#dispatchFlyout,
#manualLogFlyout{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100vh !important;
  max-width:none !important;
  max-height:none !important;
  right:auto !important;
  bottom:auto !important;
  left:0 !important;
  top:0 !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  padding:28px !important;
  background:rgba(3,12,32,.64) !important;
  backdrop-filter:blur(8px) !important;
  z-index:2147483000 !important;
  pointer-events:auto !important;
  overflow:auto !important;
}
#dispatchFlyout.is-open,
#manualLogFlyout.is-open{
  display:flex !important;
}
#dispatchFlyout .dispatch-log-card,
#manualLogFlyout .dispatch-log-card{
  position:relative !important;
  z-index:2147483001 !important;
  width:min(96vw,1400px) !important;
  height:min(88vh,840px) !important;
  max-height:min(88vh,840px) !important;
  margin:0 !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
}
#manualLogFlyout .manual-log-card{
  width:min(96vw,900px) !important;
  height:auto !important;
  min-height:360px !important;
  max-height:min(88vh,840px) !important;
}
#dispatchFlyout .dispatch-log-wrapper,
#manualLogFlyout .dispatch-log-wrapper{
  flex:1 1 auto !important;
  max-height:none !important;
  overflow:auto !important;
}
#dispatchFlyout .dispatch-flyout-close,
#manualLogFlyout .dispatch-flyout-close{
  color:#fff !important;
  background:rgba(255,255,255,.12) !important;
  border:1px solid rgba(255,255,255,.18) !important;
}



/* === DRIVER CHANGE COMMAND LOCK VISUAL FIX === */
.bus-command-dialog.locked button:not(.bus-command-close),
.bus-command-dialog.locked select,
.bus-command-dialog.locked input{
  opacity:.45 !important;
  filter:grayscale(1) !important;
  cursor:not-allowed !important;
}
#busCmdLockMsg{
  color:#111827 !important;
  background:#fde68a !important;
  border-color:#f59e0b !important;
  font-weight:900 !important;
}


/* === EWT SUMMARY STRONG READABILITY FIX === */
#scenarioSummaryOverlay,
#scenarioSummaryOverlay *{
  opacity:1 !important;
  text-shadow:none !important;
}
#scenarioSummaryInner{
  background:#ffffff !important;
  color:#000000 !important;
  opacity:1 !important;
}
#scenarioSummaryInner h1,
#scenarioSummaryInner h2,
#scenarioSummaryInner h3,
#scenarioSummaryInner p,
#scenarioSummaryInner table,
#scenarioSummaryInner thead,
#scenarioSummaryInner tbody,
#scenarioSummaryInner tr,
#scenarioSummaryInner th,
#scenarioSummaryInner td,
#scenarioSummaryInner span,
#scenarioSummaryInner div{
  color:#000000 !important;
  opacity:1 !important;
  text-shadow:none !important;
}
#scenarioSummaryInner th{
  background:#e5e7eb !important;
  font-weight:900 !important;
}
#scenarioSummaryInner td{
  font-weight:800 !important;
}


/* === TRAPEZE AVL STYLE BUS LABELS ===
   Visual-only change: angled AVL tag shape, black operational text, thinner shadow.
   No timing, headway, command, driver-change or dashboard logic is changed.
*/
.bus-rect{
  rx:0 !important;
  ry:0 !important;
  stroke:#1f2937 !important;
  stroke-width:1.15 !important;
  stroke-linejoin:round !important;
  stroke-linecap:round !important;
  shape-rendering:geometricPrecision !important;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.32)) !important;
}

.bus-trapeze-left{
  clip-path:polygon(0% 50%, 15% 0%, 100% 0%, 100% 100%, 15% 100%) !important;
}

.bus-trapeze-right{
  clip-path:polygon(0% 0%, 85% 0%, 100% 50%, 85% 100%, 0% 100%) !important;
}

.bus-node.bus-hover .bus-rect{
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.45)) brightness(1.04) !important;
}

.bus-selected .bus-rect{
  stroke:#ffffff !important;
  stroke-width:2 !important;
  filter:drop-shadow(0 4px 9px rgba(255,255,255,.28)) drop-shadow(0 3px 5px rgba(0,0,0,.35)) !important;
}

.bus-label,
body.london-mode .bus-label,
body.riyadh-mode .bus-label{
  fill:#111111 !important;
  color:#111111 !important;
  text-shadow:none !important;
  font-family:"Arial Narrow","Roboto Condensed","Arial",sans-serif !important;
  font-weight:800 !important;
  letter-spacing:.035em !important;
  paint-order:normal !important;
}

.bus-line-1{
  font-size:.61rem !important;
  font-weight:900 !important;
}

.bus-line-2{
  font-size:.70rem !important;
  font-weight:900 !important;
}

.bus-line-2 .hw-unit,
.hw-unit{
  font-size:.56rem !important;
  font-weight:800 !important;
}

.bus-line-3,
.bus-trip{
  fill:#111111 !important;
  color:#111111 !important;
  font-family:"Arial Narrow","Roboto Condensed","Arial",sans-serif !important;
  font-size:.55rem !important;
  font-weight:800 !important;
  letter-spacing:.025em !important;
  text-shadow:none !important;
}

/* Keep incident buses readable on black/dark held states. */
.bus-incident + .bus-label,
.bus-node .bus-incident ~ .bus-label{
  fill:#ffffff !important;
  color:#ffffff !important;
  text-shadow:0 1px 2px rgba(0,0,0,.75) !important;
}

/* Ghost/not-logged-on remains dashed but uses the same angled shape. */
.bus-ghost.bus-rect{
  fill:rgba(255,255,255,.10) !important;
  stroke:#111827 !important;
  stroke-width:1.2 !important;
  stroke-dasharray:4 3 !important;
}


/* === TRAPEZE BUS LABEL WIDTH + LIGHT FONT FIX ===
   Wider tags and non-bold text so Bus / HW / trip details fit cleanly inside.
*/
.bus-rect{
  stroke-width:1 !important;
}

.bus-label,
body.london-mode .bus-label,
body.riyadh-mode .bus-label{
  font-family:"Arial Narrow","Roboto Condensed","Arial",sans-serif !important;
  font-weight:500 !important;
  letter-spacing:.02em !important;
  fill:#111111 !important;
  color:#111111 !important;
  text-shadow:none !important;
}

.bus-line-1{
  font-size:.54rem !important;
  font-weight:500 !important;
  letter-spacing:.02em !important;
}

.bus-line-2{
  font-size:.66rem !important;
  font-weight:500 !important;
  letter-spacing:.01em !important;
}

.bus-line-2 .hw-unit,
.hw-unit{
  font-size:.52rem !important;
  font-weight:500 !important;
}

.bus-line-3,
.bus-trip{
  font-size:.51rem !important;
  font-weight:500 !important;
  letter-spacing:.01em !important;
  fill:#111111 !important;
  color:#111111 !important;
}

/* Keep selected bus visible without making all text bold. */
.bus-selected .bus-label,
.bus-selected .bus-line-1,
.bus-selected .bus-line-2,
.bus-selected .bus-line-3{
  font-weight:600 !important;
}


/* === TRAPEZE BUS LABEL CRISP TEXT FIX ===
   Sharpens text inside bus tags only. No bus size or simulator logic changed.
*/
.bus-rect{
  filter:none !important;
  shape-rendering:crispEdges !important;
}

.bus-node.bus-hover .bus-rect{
  filter:none !important;
}

.bus-selected .bus-rect{
  filter:none !important;
}

.bus-label,
body.london-mode .bus-label,
body.riyadh-mode .bus-label,
.bus-line-1,
.bus-line-2,
.bus-line-3,
.bus-trip,
.hw-unit{
  font-family:Arial, Helvetica, sans-serif !important;
  text-rendering:geometricPrecision !important;
  -webkit-font-smoothing:antialiased !important;
  font-smooth:always !important;
  text-shadow:none !important;
  filter:none !important;
  paint-order:normal !important;
  stroke:none !important;
  fill:#000000 !important;
  color:#000000 !important;
}

.bus-line-1{
  font-size:.57rem !important;
  font-weight:600 !important;
  letter-spacing:.015em !important;
}

.bus-line-2{
  font-size:.69rem !important;
  font-weight:600 !important;
  letter-spacing:.005em !important;
}

.bus-line-2 .hw-unit,
.hw-unit{
  font-size:.53rem !important;
  font-weight:600 !important;
}

.bus-line-3,
.bus-trip{
  font-size:.53rem !important;
  font-weight:600 !important;
  letter-spacing:0 !important;
}

/* Keep dark/incident bus labels readable. */
.bus-incident + .bus-label,
.bus-node .bus-incident ~ .bus-label{
  fill:#ffffff !important;
  color:#ffffff !important;
}


/* === TRAPEZE REMOVE BLACK BUS OUTLINE FIX ===
   Removes the black border around coloured bus labels.
   Flicker / status / movement logic is not changed.
*/
.bus-rect:not(.bus-ghost):not(.bus-selected){
  stroke:transparent !important;
  stroke-width:0 !important;
}

/* Keep ghost/not logged-on buses identifiable but softer, not heavy black. */
.bus-ghost.bus-rect,
.bus-rect.bus-ghost{
  stroke:#64748b !important;
  stroke-width:1 !important;
  stroke-dasharray:4 3 !important;
}

/* Keep selected bus highlight visible without black border. */
.bus-selected .bus-rect,
.bus-rect.bus-selected{
  stroke:#ffffff !important;
  stroke-width:1.5 !important;
}


/* === COMPACT TOP PANEL + ROUTE UNDER CITY PACK FIX ===
   Moves the route label under City Pack and reduces the top control window height.
   Visual/layout only. No simulator logic changed.
*/
.card.scenario{
  padding-top:8px !important;
  padding-bottom:6px !important;
}

.card.scenario > h2,
.card.scenario h2{
  margin:0 0 4px !important;
  font-size:1.02rem !important;
  line-height:1.05 !important;
}

.scenario-command-panel{
  margin-top:4px !important;
  margin-bottom:4px !important;
  padding:6px 10px !important;
  border-radius:12px !important;
}

.scenario-command-row{
  gap:6px 10px !important;
  align-items:stretch !important;
}

.command-field{
  gap:3px !important;
}

.command-field label{
  font-size:.60rem !important;
  letter-spacing:.13em !important;
}

.command-field select,
.command-field .topSelect{
  min-height:28px !important;
  height:28px !important;
  padding:3px 8px !important;
  border-radius:8px !important;
  font-size:.74rem !important;
}

.command-field-city{
  width:150px !important;
  max-width:150px !important;
}

.command-field-city #locationSelect{
  width:150px !important;
  min-width:150px !important;
}

.route-header-under-city{
  display:block !important;
  margin:4px 0 0 !important;
  max-width:150px !important;
  width:150px !important;
  min-height:18px !important;
  height:auto !important;
  padding:3px 7px !important;
  border-radius:999px !important;
  background:rgba(226,238,255,.88) !important;
  border:1px solid rgba(140,165,205,.45) !important;
  color:#2d405f !important;
  font-size:.56rem !important;
  line-height:1.08 !important;
  letter-spacing:.06em !important;
  text-transform:uppercase !important;
  white-space:normal !important;
  overflow:hidden !important;
  text-overflow:clip !important;
  box-shadow:none !important;
}

.scenario-command-actions .route-header-top:not(.route-header-under-city){
  display:none !important;
}

/* tighten time under scenario */
.scenario-time-subrow{
  gap:6px !important;
  margin-top:4px !important;
}
.scenario-time-subrow label{
  font-size:.56rem !important;
}
.scenario-time-subrow #timeBandSelect{
  min-height:26px !important;
  height:26px !important;
  width:112px !important;
  min-width:112px !important;
  padding:2px 7px !important;
  font-size:.72rem !important;
}

/* compact embedded cards */
.embedded-ewt-slot #ewtStrip,
#ewtStrip{
  min-height:72px !important;
  padding:7px 10px !important;
  border-radius:12px !important;
}

#ewtStrip .ewt-hud-header{
  margin-bottom:2px !important;
}
#ewtStrip .ewt-hud-title{
  font-size:.63rem !important;
}
#ewtStrip .ewt-hud-pill{
  min-height:18px !important;
  padding:2px 7px !important;
  font-size:.55rem !important;
}
#ewtStrip .ewt-hud-main{
  margin-bottom:2px !important;
}
#ewtStrip .ewt-hud-value{
  font-size:1.28rem !important;
  line-height:1 !important;
}
#ewtStrip .ewt-hud-unit{
  font-size:.70rem !important;
}
#ewtStrip .ewt-hud-target,
#ewtStrip .ewt-hud-delta{
  font-size:.64rem !important;
  line-height:1.05 !important;
}
#ewtStrip .ewt-hud-bar{
  height:5px !important;
  margin:3px 0 !important;
}
#ewtStrip .ewt-hud-sub{
  font-size:.58rem !important;
  line-height:1.05 !important;
  gap:6px !important;
}
#ewtStrip .ewt-hud-note{
  display:none !important;
}

#standHoldMonitor .stand-hold-col{
  min-height:72px !important;
  padding:6px 7px 5px !important;
  border-radius:12px !important;
}
#standHoldMonitor .stand-hold-title{
  font-size:.64rem !important;
  margin-bottom:3px !important;
}
#standHoldMonitor .stand-hold-meta{
  font-size:.58rem !important;
  margin-bottom:3px !important;
}
#standHoldMonitor .stand-hold-list{
  gap:3px !important;
  max-height:45px !important;
}
#standHoldMonitor .stand-hold-line,
#standHoldMonitor .stand-hold-row,
#standHoldMonitor .stand-hold-row.one-line{
  font-size:.58rem !important;
  padding:3px 6px !important;
  border-radius:7px !important;
}

/* compact sim clock */
.sim-clock-panel{
  min-height:72px !important;
  padding:7px 9px !important;
  border-radius:12px !important;
  gap:3px !important;
}
.sim-clock-panel-title{
  font-size:.58rem !important;
  line-height:1 !important;
}
.sim-clock-box{
  min-width:39px !important;
  width:39px !important;
  height:31px !important;
  border-radius:8px !important;
}
.sim-clock-box span{
  font-size:1.10rem !important;
}
.sim-clock-colon{
  font-size:1.15rem !important;
}
.sim-clock-panel-sub{
  font-size:.56rem !important;
}

/* action buttons row tighter */
.scenario-command-actions{
  margin-top:5px !important;
  gap:6px !important;
}
.scenario-command-actions button,
#manualLogToggleBtn.dispatch-fab,
#dispatchToggleBtn.dispatch-fab{
  height:28px !important;
  min-height:28px !important;
  min-width:104px !important;
  padding:0 12px !important;
  font-size:.63rem !important;
}

/* scenario text block closer to the route diagram */
.scenario-header{
  margin-top:4px !important;
}
.scenario-text{
  margin-top:2px !important;
  line-height:1.15 !important;
}

/* maintain grid but with smaller embedded cards */
.scenario-command-row{
  grid-template-columns:minmax(260px, 430px) 88px 150px 170px minmax(230px, 300px) 1fr 370px 198px !important;
}
.command-field-driver-change{
  width:170px !important;
  max-width:170px !important;
}
.command-field-driver-change #driverChangePointSelect{
  width:170px !important;
  min-width:170px !important;
}
.embedded-stand-slot{
  width:370px !important;
  max-width:370px !important;
}
.embedded-sim-clock-slot{
  width:198px !important;
  max-width:198px !important;
  min-width:198px !important;
}

@media (max-width:1560px){
  .scenario-command-row{
    grid-template-columns:minmax(260px, 1.2fr) 88px 150px 170px minmax(230px, .9fr) 1fr 370px 198px !important;
  }
  .embedded-stand-slot{
    width:370px !important;
    max-width:370px !important;
  }
  .embedded-sim-clock-slot{
    width:198px !important;
    max-width:198px !important;
    min-width:198px !important;
  }
}
@media (max-width:1350px){
  .scenario-command-row{
    grid-template-columns:minmax(260px, 1.2fr) 88px 150px 170px minmax(230px, .9fr) !important;
  }
  .embedded-stand-slot{
    grid-column:1 / span 2 !important;
    width:370px !important;
    max-width:370px !important;
  }
  .embedded-sim-clock-slot{
    grid-column:3 / span 2 !important;
    width:198px !important;
    max-width:198px !important;
    min-width:198px !important;
  }
}
@media (max-width:950px){
  .command-field-city,
  .command-field-city #locationSelect,
  .route-header-under-city{
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
  }
}


/* === FINAL VISUAL-ONLY FIX: embedded EWT + shorter scenario select ===
   Preserves all simulator JavaScript and dynamic EWT/stand logic. */
body.simulator-layout .scenario-command-row{
  overflow-x:auto !important;
  overflow-y:visible !important;
  scrollbar-width:thin !important;
}
body.simulator-layout .command-field-scenario{
  width:230px !important;
  min-width:230px !important;
  max-width:230px !important;
  flex:0 0 230px !important;
}
body.simulator-layout .command-field-scenario #scenarioSelect{
  width:230px !important;
  min-width:230px !important;
  max-width:230px !important;
}
body.simulator-layout .scenario-time-subrow #timeBandSelect{
  width:78px !important;
  min-width:78px !important;
  max-width:78px !important;
}
body.simulator-layout .embedded-ewt-slot,
body.simulator-layout .embedded-ewt-slot.demo-ewt-after-dispatcher{
  position:static !important;
  inset:auto !important;
  top:auto !important;
  right:auto !important;
  bottom:auto !important;
  left:auto !important;
  transform:none !important;
  translate:none !important;
  z-index:auto !important;
  flex:0 0 255px !important;
  width:255px !important;
  min-width:255px !important;
  max-width:255px !important;
  height:86px !important;
  min-height:86px !important;
  max-height:86px !important;
  margin:0 !important;
  padding:0 !important;
  align-self:stretch !important;
  display:flex !important;
  pointer-events:auto !important;
}
body.simulator-layout .embedded-ewt-slot #ewtStrip,
body.simulator-layout .embedded-ewt-slot.demo-ewt-after-dispatcher #ewtStrip,
body.simulator-layout #ewtStrip{
  position:static !important;
  inset:auto !important;
  top:auto !important;
  right:auto !important;
  bottom:auto !important;
  left:auto !important;
  transform:none !important;
  translate:none !important;
  z-index:auto !important;
  flex:1 1 auto !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  height:86px !important;
  min-height:86px !important;
  max-height:86px !important;
  margin:0 !important;
  padding:9px 10px !important;
  display:block !important;
  pointer-events:auto !important;
  overflow:hidden !important;
}
body.simulator-layout #ewtStrip .ewt-hud-sub{
  display:flex !important;
  justify-content:space-between !important;
  gap:8px !important;
  white-space:normal !important;
  overflow:hidden !important;
}
body.simulator-layout #ewtStrip .ewt-hud-sub span{
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
@media (max-width:1600px){
  body.simulator-layout .command-field-scenario{
    width:220px !important;
    min-width:220px !important;
    max-width:220px !important;
    flex-basis:220px !important;
  }
  body.simulator-layout .command-field-scenario #scenarioSelect{
    width:220px !important;
    min-width:220px !important;
    max-width:220px !important;
  }
  body.simulator-layout .embedded-ewt-slot,
  body.simulator-layout .embedded-ewt-slot.demo-ewt-after-dispatcher{
    flex-basis:245px !important;
    width:245px !important;
    min-width:245px !important;
    max-width:245px !important;
  }
}

/* === ADEM SHARP AVL ROUTE DIAGRAM LABEL PATCH ===
   Visual-only: sharper bus labels and stop/route names. No simulator logic changed.
*/
body.simulator-layout #simSvg,
body.simulator-layout #simSvg *{
  -webkit-font-smoothing: antialiased !important;
  text-rendering: geometricPrecision !important;
}

/* Stop / route names on the main AVL diagram */
body.simulator-layout #simSvg .route-label,
body.simulator-layout svg .route-label{
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
  letter-spacing: .035em !important;
  fill: #050505 !important;
  color: #050505 !important;
  opacity: 1 !important;
  filter: none !important;
  text-shadow: none !important;
  paint-order: stroke fill !important;
  stroke: rgba(255,255,255,.98) !important;
  stroke-width: 3.2px !important;
  stroke-linejoin: round !important;
  stroke-linecap: round !important;
}

/* Bus card text on the main AVL diagram */
body.simulator-layout #simSvg .bus-label,
body.simulator-layout #simSvg .bus-line-1,
body.simulator-layout #simSvg .bus-line-2,
body.simulator-layout #simSvg .bus-line-3,
body.simulator-layout #simSvg .bus-trip,
body.simulator-layout #simSvg .hw-unit{
  font-family: Arial, Helvetica, sans-serif !important;
  font-weight: 900 !important;
  fill: #000000 !important;
  color: #000000 !important;
  opacity: 1 !important;
  filter: none !important;
  text-shadow: none !important;
  paint-order: stroke fill !important;
  stroke: rgba(255,255,255,.58) !important;
  stroke-width: .55px !important;
  stroke-linejoin: round !important;
  stroke-linecap: round !important;
  text-rendering: geometricPrecision !important;
  -webkit-font-smoothing: antialiased !important;
}

body.simulator-layout #simSvg .bus-line-1{
  font-size: .62rem !important;
  letter-spacing: .025em !important;
}
body.simulator-layout #simSvg .bus-line-2{
  font-size: .76rem !important;
  letter-spacing: .010em !important;
}
body.simulator-layout #simSvg .bus-line-2 .hw-unit,
body.simulator-layout #simSvg .hw-unit{
  font-size: .56rem !important;
  font-weight: 900 !important;
}
body.simulator-layout #simSvg .bus-line-3,
body.simulator-layout #simSvg .bus-trip{
  font-size: .56rem !important;
  font-weight: 900 !important;
  letter-spacing: .005em !important;
}

/* Keep text readable on dark/incident buses */
body.simulator-layout #simSvg .bus-incident + .bus-label,
body.simulator-layout #simSvg .bus-node .bus-incident ~ .bus-label,
body.simulator-layout #simSvg .bus-tag-incident-text,
body.simulator-layout #simSvg .bus-incident-ribbon-text{
  fill: #ffffff !important;
  color: #ffffff !important;
  stroke: rgba(0,0,0,.80) !important;
  stroke-width: 1.1px !important;
  paint-order: stroke fill !important;
}

/* Stop names / bus labels in the small bus-command map as well */
.bus-map-stop-label,
.bus-map-bus-label{
  font-family: Arial, Helvetica, sans-serif !important;
  font-weight: 900 !important;
  fill: #050505 !important;
  color: #050505 !important;
  opacity: 1 !important;
  filter: none !important;
  paint-order: stroke fill !important;
  stroke: rgba(255,255,255,.95) !important;
  stroke-width: 2.4px !important;
  stroke-linejoin: round !important;
  text-rendering: geometricPrecision !important;
  -webkit-font-smoothing: antialiased !important;
}
.bus-map-stop-label{font-size:.66rem !important;}
.bus-map-bus-label{font-size:.68rem !important;}

/* Keep the faded background separate from the readable overlay layers */
body.simulator-layout #simSvg .bus-node,
body.simulator-layout #simSvg .route-label,
body.simulator-layout #simSvg .route-point,
body.simulator-layout #simSvg .route-connector{
  opacity:1 !important;
}


/* === ADEM ROUTE GAP + LARGER AVL BUS TAG PATCH ===
   Visual-only: more vertical space between inbound/outbound route roads and slightly larger bus boxes. */
body.simulator-layout #simSvg .route-label,
body.simulator-layout svg .route-label{
  font-size:.78rem !important;
  stroke-width:3.4px !important;
}
body.simulator-layout #simSvg .route-point{
  vector-effect:non-scaling-stroke !important;
}
body.simulator-layout #simSvg .bus-line-1{
  font-size:.66rem !important;
}
body.simulator-layout #simSvg .bus-line-2{
  font-size:.82rem !important;
}
body.simulator-layout #simSvg .bus-line-2 .hw-unit,
body.simulator-layout #simSvg .hw-unit{
  font-size:.60rem !important;
}
body.simulator-layout #simSvg .bus-line-3,
body.simulator-layout #simSvg .bus-trip{
  font-size:.60rem !important;
}
body.simulator-layout #simSvg .bus-rect{
  shape-rendering:geometricPrecision !important;
}


/* === ADEM FIX: SOLID ROUTE NAMES + BIGGER BUS TAGS + HOVER FLICKER FIX ===
   Visual-only. Stops route labels/tooltip flicker caused by SVG redraw and keeps labels fitting. */
body.simulator-layout #simSvg .route-label,
body.simulator-layout #simSvg .route-point,
body.simulator-layout #simSvg .route-connector{
  pointer-events:none !important;
  opacity:1 !important;
  visibility:visible !important;
  transition:none !important;
  animation:none !important;
  filter:none !important;
  will-change:auto !important;
}
body.simulator-layout #simSvg .route-label{
  font-size:.64rem !important;
  font-weight:900 !important;
  letter-spacing:.012em !important;
  paint-order:stroke fill !important;
  stroke:rgba(255,255,255,.99) !important;
  stroke-width:3.8px !important;
  stroke-linejoin:round !important;
  stroke-linecap:round !important;
  fill:#030303 !important;
  text-rendering:geometricPrecision !important;
  dominant-baseline:middle !important;
}
body.simulator-layout #simSvg .bus-node{
  pointer-events:visiblePainted !important;
  opacity:1 !important;
  transition:none !important;
  filter:none !important;
  will-change:transform !important;
}
body.simulator-layout #simSvg .bus-rect{
  width:74px !important;
  height:62px !important;
  vector-effect:non-scaling-stroke !important;
}
body.simulator-layout #simSvg .bus-label,
body.simulator-layout #simSvg .bus-line-1,
body.simulator-layout #simSvg .bus-line-2,
body.simulator-layout #simSvg .bus-line-3,
body.simulator-layout #simSvg .bus-trip,
body.simulator-layout #simSvg .hw-unit{
  pointer-events:none !important;
  text-rendering:geometricPrecision !important;
}
body.simulator-layout #simSvg .bus-line-1{font-size:.67rem !important;}
body.simulator-layout #simSvg .bus-line-2{font-size:.83rem !important;}
body.simulator-layout #simSvg .bus-line-3,
body.simulator-layout #simSvg .bus-trip{font-size:.61rem !important;}
#busTooltip,
.bus-tooltip{
  pointer-events:none !important;
  transition:none !important;
  animation:none !important;
  z-index:999999 !important;
}


/* === ADEM FIX: CITY PACK BUS COLOUR LOCK ===
   Visual-only. Prevents Riyadh bus/headway colours leaking into London/Manchester/Dublin/etc.
   Default + all non-Riyadh city packs use: Yellow good, Red close, Green wide.
   Riyadh only uses: Green good, Red close, Blue wide. */
body.simulator-layout #simSvg .bus-good,
body.simulator-layout #simSvg .headway-band-good,
body.simulator-layout:not(.riyadh-mode) #simSvg .bus-good,
body.simulator-layout:not(.riyadh-mode) #simSvg .headway-band-good,
body.simulator-layout[data-city-pack]:not([data-city-pack="riyadh"]) #simSvg .bus-good,
body.simulator-layout[data-city-pack]:not([data-city-pack="riyadh"]) #simSvg .headway-band-good,
body.london-mode #simSvg .bus-good,
body.london-mode #simSvg .headway-band-good{
  fill:#fdd835 !important; /* yellow = correct/on target for non-Riyadh packs */
}
body.simulator-layout #simSvg .bus-wide,
body.simulator-layout #simSvg .headway-band-wide,
body.simulator-layout:not(.riyadh-mode) #simSvg .bus-wide,
body.simulator-layout:not(.riyadh-mode) #simSvg .headway-band-wide,
body.simulator-layout[data-city-pack]:not([data-city-pack="riyadh"]) #simSvg .bus-wide,
body.simulator-layout[data-city-pack]:not([data-city-pack="riyadh"]) #simSvg .headway-band-wide,
body.london-mode #simSvg .bus-wide,
body.london-mode #simSvg .headway-band-wide{
  fill:#43a047 !important; /* green = too far/wide for non-Riyadh packs */
}
body.simulator-layout #simSvg .bus-close,
body.simulator-layout #simSvg .headway-band-close,
body.london-mode #simSvg .bus-close,
body.london-mode #simSvg .headway-band-close,
body.riyadh-mode #simSvg .bus-close,
body.riyadh-mode #simSvg .headway-band-close{
  fill:#e53935 !important; /* red = too close, all packs */
}
body.riyadh-mode #simSvg .bus-good,
body.riyadh-mode #simSvg .headway-band-good,
body.simulator-layout[data-city-pack="riyadh"] #simSvg .bus-good,
body.simulator-layout[data-city-pack="riyadh"] #simSvg .headway-band-good{
  fill:#43a047 !important; /* Riyadh green = good */
}
body.riyadh-mode #simSvg .bus-wide,
body.riyadh-mode #simSvg .headway-band-wide,
body.simulator-layout[data-city-pack="riyadh"] #simSvg .bus-wide,
body.simulator-layout[data-city-pack="riyadh"] #simSvg .headway-band-wide{
  fill:#1e88e5 !important; /* Riyadh blue = too far */
}
body.simulator-layout:not(.riyadh-mode) .legend-swatch.legend-good,
body.simulator-layout[data-city-pack]:not([data-city-pack="riyadh"]) .legend-swatch.legend-good,
body.london-mode .legend-swatch.legend-good{background:#fdd835 !important;}
body.simulator-layout:not(.riyadh-mode) .legend-swatch.legend-wide,
body.simulator-layout[data-city-pack]:not([data-city-pack="riyadh"]) .legend-swatch.legend-wide,
body.london-mode .legend-swatch.legend-wide{background:#43a047 !important;}
body.riyadh-mode .legend-swatch.legend-good,
body.simulator-layout[data-city-pack="riyadh"] .legend-swatch.legend-good{background:#43a047 !important;}
body.riyadh-mode .legend-swatch.legend-wide,
body.simulator-layout[data-city-pack="riyadh"] .legend-swatch.legend-wide{background:#1e88e5 !important;}


/* === TRAPEZE-STYLE CRISP RENDER MODE V1 ===
   Visual rendering upgrade only: sharper vector buses, fixed-size text, stable stop labels.
   No service timing, headway, dispatch, Supabase or classroom logic changed.
*/
body.simulator-layout #simSvg,
body.simulator-layout svg{
  shape-rendering:geometricPrecision !important;
  text-rendering:geometricPrecision !important;
  -webkit-font-smoothing:antialiased !important;
  transform:translateZ(0) !important;
  backface-visibility:hidden !important;
}
body.simulator-layout .track-wrapper{
  image-rendering:auto !important;
  transform:translateZ(0) !important;
}
/* Keep background decorative only; labels/buses stay fully sharp above it. */
body.simulator-layout .track-wrapper::before{
  opacity:.62 !important;
  filter:grayscale(.12) contrast(1.06) brightness(1.08) !important;
}
body.simulator-layout #simSvg .track-line{
  stroke:#9ebce4 !important;
  stroke-width:2.2 !important;
  vector-effect:non-scaling-stroke !important;
  shape-rendering:geometricPrecision !important;
}
body.simulator-layout #simSvg .track-line-hatch{
  stroke:rgba(255,255,255,.96) !important;
  stroke-width:1.2 !important;
  vector-effect:non-scaling-stroke !important;
}
body.simulator-layout #simSvg .headway-band{
  shape-rendering:crispEdges !important;
  vector-effect:non-scaling-stroke !important;
}
body.simulator-layout #simSvg .bus-node{
  will-change:transform !important;
  transform-box:fill-box !important;
  transform-origin:center center !important;
  pointer-events:all !important;
}
body.simulator-layout #simSvg .bus-svg-body,
body.simulator-layout #simSvg .bus-rect{
  shape-rendering:geometricPrecision !important;
  vector-effect:non-scaling-stroke !important;
  stroke:rgba(12,18,28,.55) !important;
  stroke-width:.75 !important;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.22)) !important;
}
body.simulator-layout #simSvg .bus-rect:not(.bus-ghost):not(.bus-selected){
  stroke:rgba(12,18,28,.40) !important;
  stroke-width:.65 !important;
}
body.simulator-layout #simSvg .bus-node.bus-hover .bus-rect{
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.30)) brightness(1.03) !important;
  stroke:#0f172a !important;
  stroke-width:1.1 !important;
}
body.simulator-layout #simSvg .bus-selected .bus-rect,
body.simulator-layout #simSvg .bus-rect.bus-selected{
  stroke:#ffffff !important;
  stroke-width:1.8 !important;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.34)) !important;
}
body.simulator-layout #simSvg .bus-label,
body.simulator-layout #simSvg .bus-line-1,
body.simulator-layout #simSvg .bus-line-2,
body.simulator-layout #simSvg .bus-line-3,
body.simulator-layout #simSvg .bus-trip,
body.simulator-layout #simSvg .hw-unit{
  font-family:"Arial", "Helvetica Neue", Helvetica, sans-serif !important;
  fill:#050505 !important;
  color:#050505 !important;
  stroke:none !important;
  paint-order:normal !important;
  text-shadow:none !important;
  filter:none !important;
  text-rendering:geometricPrecision !important;
  -webkit-font-smoothing:antialiased !important;
  dominant-baseline:auto !important;
  pointer-events:none !important;
}
body.simulator-layout #simSvg .bus-line-1{
  font-size:10.7px !important;
  font-weight:800 !important;
  letter-spacing:.25px !important;
}
body.simulator-layout #simSvg .bus-line-2{
  font-size:15px !important;
  font-weight:900 !important;
  letter-spacing:.1px !important;
}
body.simulator-layout #simSvg .bus-line-2 .hw-unit,
body.simulator-layout #simSvg .hw-unit{
  font-size:11px !important;
  font-weight:800 !important;
}
body.simulator-layout #simSvg .bus-trip{
  font-size:9.7px !important;
  font-weight:800 !important;
  letter-spacing:0 !important;
}
body.simulator-layout #simSvg .bus-node .bus-incident ~ .bus-label,
body.simulator-layout #simSvg .bus-node .bus-incident ~ .bus-line-1,
body.simulator-layout #simSvg .bus-node .bus-incident ~ .bus-line-2,
body.simulator-layout #simSvg .bus-node .bus-incident ~ .bus-trip{
  fill:#ffffff !important;
  color:#ffffff !important;
}
/* Stable, sharp route labels. Do not intercept hover so tooltips do not flicker. */
body.simulator-layout #simSvg .route-label,
body.simulator-layout #simSvg .route-label-crisp{
  pointer-events:none !important;
  font-family:Arial, Helvetica, sans-serif !important;
  font-size:12px !important;
  font-weight:900 !important;
  letter-spacing:.05px !important;
  fill:#0b0f14 !important;
  stroke:rgba(255,255,255,.96) !important;
  stroke-width:3.2px !important;
  paint-order:stroke fill !important;
  stroke-linejoin:round !important;
  text-rendering:geometricPrecision !important;
  -webkit-font-smoothing:antialiased !important;
  filter:none !important;
}
body.simulator-layout #simSvg .route-point{
  pointer-events:none !important;
  fill:#ffffff !important;
  stroke:#0b1220 !important;
  stroke-width:1.1 !important;
  vector-effect:non-scaling-stroke !important;
  shape-rendering:geometricPrecision !important;
}
body.simulator-layout #simSvg .route-connector{
  pointer-events:none !important;
  stroke:rgba(31,41,55,.28) !important;
  stroke-width:1 !important;
  vector-effect:non-scaling-stroke !important;
}
/* Optional clean background mode; enabled automatically by body class if added later. */
body.simulator-layout.trapeze-clean-bg .track-wrapper::before{
  opacity:.20 !important;
  filter:grayscale(1) contrast(1.02) brightness(1.15) !important;
}


/* === ADEM MOTION SMOOTHNESS PATCH ===
   Visual-only performance hints for crisp SVG bus movement. */
body.simulator-layout #simSvg .bus-node{
  will-change: transform !important;
  transform-box: fill-box !important;
  transform-origin: center center !important;
  transition: none !important;
}
body.simulator-layout #simSvg .bus-label,
body.simulator-layout #simSvg .route-label{
  transition: none !important;
  animation: none !important;
}
body.simulator-layout #simSvg .bus-rect{
  transition: none !important;
}


/* === ROUTE DETAIL POINTS / MOVEMENT WAYPOINTS ===
   Extra virtual points between official timing/curtailment points.
   They improve live location granularity without becoming control points. */
.route-waypoint{
  fill: rgba(20, 44, 79, 0.72) !important;
  stroke: rgba(255,255,255,0.92) !important;
  stroke-width: 1.2px !important;
  pointer-events: auto !important;
  vector-effect: non-scaling-stroke !important;
}
.route-waypoint-top,
.route-waypoint-bottom{
  opacity: 0.78 !important;
}
.route-waypoint:hover{
  fill: #39C6D6 !important;
  opacity: 1 !important;
}

/* === TEXT-ONLY INTERMEDIATE STOP NAMES ===
   Small no-box labels for the extra route detail stops between official control points. */
body.simulator-layout #simSvg .route-waypoint-label,
body.simulator-layout svg .route-waypoint-label{
  font-family: Arial, "Segoe UI", sans-serif !important;
  font-size: 7.6px !important;
  font-weight: 900 !important;
  letter-spacing: .025em !important;
  fill: rgba(5,18,34,.88) !important;
  stroke: rgba(255,255,255,.92) !important;
  stroke-width: 1.9px !important;
  paint-order: stroke fill !important;
  text-rendering: geometricPrecision !important;
  -webkit-font-smoothing: antialiased !important;
  pointer-events: none !important;
  opacity: .9 !important;
}
body.simulator-layout #simSvg .route-waypoint-label-crisp{
  vector-effect: non-scaling-stroke !important;
  shape-rendering: geometricPrecision !important;
}
body.simulator-layout #simSvg .route-waypoint{
  pointer-events: auto !important;
}
@media (min-width: 1600px){
  body.simulator-layout #simSvg .route-waypoint-label{ font-size: 8.1px !important; }
}


/* === ADEM FIX: STABLE BUS HOVER TOOLTIP / NO FLICKER === */
#busTooltip,
.bus-tooltip{
  pointer-events:none !important;
  transform:translate3d(0,0,0) !important;
  backface-visibility:hidden !important;
  contain:layout paint style !important;
  will-change:left, top !important;
  transition:none !important;
  animation:none !important;
}
#simSvg .bus-node,
#simSvg .bus-node *{
  pointer-events:visiblePainted;
}
#simSvg .bus-text,
#simSvg .bus-line-1,
#simSvg .bus-line-2,
#simSvg .bus-line-3,
#simSvg .bus-trip,
#simSvg .hw-unit{
  pointer-events:none !important;
}


/* === ADEM PATCH: BUS TOOLTIP 2 SECOND AUTO-HIDE + NEW CITY IMAGES === */
#busTooltip,.bus-tooltip{
  pointer-events:none!important;
  user-select:none!important;
  z-index:2147483647!important;
}


/* === ADEM FINAL: CRYSTAL-CLEAR ROUTE / WAYPOINT NAME PATCH ===
   Visual-only. Makes official stop names and intermediate waypoint names readable
   on large screens without changing route logic, bus movement, or controls. */
body.simulator-layout #simSvg .route-label,
body.simulator-layout #simSvg .route-label-crisp,
body.simulator-layout svg .route-label,
body.simulator-layout svg .route-label-crisp{
  font-family: "Arial Black", Arial, "Segoe UI", sans-serif !important;
  font-size: 13.4px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  fill: #020712 !important;
  color: #020712 !important;
  opacity: 1 !important;
  filter: none !important;
  paint-order: stroke fill !important;
  stroke: rgba(255,255,255,1) !important;
  stroke-width: 4.4px !important;
  stroke-linejoin: round !important;
  stroke-linecap: round !important;
  stroke-opacity: 1 !important;
  vector-effect: non-scaling-stroke !important;
  shape-rendering: geometricPrecision !important;
  text-rendering: geometricPrecision !important;
  -webkit-font-smoothing: antialiased !important;
  pointer-events: none !important;
}

body.simulator-layout #simSvg .route-waypoint-label,
body.simulator-layout #simSvg .route-waypoint-label-crisp,
body.simulator-layout svg .route-waypoint-label,
body.simulator-layout svg .route-waypoint-label-crisp{
  font-family: "Arial Black", Arial, "Segoe UI", sans-serif !important;
  font-size: 10.8px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  fill: #030914 !important;
  color: #030914 !important;
  opacity: 1 !important;
  filter: none !important;
  paint-order: stroke fill !important;
  stroke: rgba(255,255,255,1) !important;
  stroke-width: 3.8px !important;
  stroke-linejoin: round !important;
  stroke-linecap: round !important;
  stroke-opacity: 1 !important;
  vector-effect: non-scaling-stroke !important;
  shape-rendering: geometricPrecision !important;
  text-rendering: geometricPrecision !important;
  -webkit-font-smoothing: antialiased !important;
  pointer-events: none !important;
}

body.simulator-layout #simSvg .route-waypoint{
  fill: #10233c !important;
  stroke: #ffffff !important;
  stroke-width: 1.4px !important;
  opacity: .98 !important;
  vector-effect: non-scaling-stroke !important;
  shape-rendering: geometricPrecision !important;
}

@media (min-width: 1600px){
  body.simulator-layout #simSvg .route-label,
  body.simulator-layout #simSvg .route-label-crisp{ font-size: 14.2px !important; stroke-width: 4.8px !important; }
  body.simulator-layout #simSvg .route-waypoint-label,
  body.simulator-layout #simSvg .route-waypoint-label-crisp{ font-size: 11.6px !important; stroke-width: 4.0px !important; }
}

@media (max-width: 1200px){
  body.simulator-layout #simSvg .route-label,
  body.simulator-layout #simSvg .route-label-crisp{ font-size: 12.2px !important; stroke-width: 4.0px !important; }
  body.simulator-layout #simSvg .route-waypoint-label,
  body.simulator-layout #simSvg .route-waypoint-label-crisp{ font-size: 9.8px !important; stroke-width: 3.4px !important; }
}


/* =========================================================
   HIDE INTERMEDIATE WAYPOINT TEXT LABELS
   Keep route-detail waypoint logic and small dots active, but do not
   display generated text such as After / Midway / Approach on the AVL map.
   Official control/timing point names remain visible.
   ========================================================= */
body.simulator-layout #simSvg .route-waypoint-label,
body.simulator-layout #simSvg .route-waypoint-label-crisp,
body.simulator-layout svg .route-waypoint-label,
body.simulator-layout svg .route-waypoint-label-crisp,
#simSvg .route-waypoint-label,
#simSvg .route-waypoint-label-crisp,
svg .route-waypoint-label,
svg .route-waypoint-label-crisp{
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}


/* === ADEM FIX: move OUTBOUND label bottom-left and route tag to old top-left label area === */
body.simulator-layout .track-wrapper{
  position:relative !important;
}
body.simulator-layout .track-wrapper > .track-label{
  position:absolute !important;
  z-index:24 !important;
  pointer-events:none !important;
  display:flex !important;
}
body.simulator-layout .track-wrapper > .track-label.top,
body.simulator-layout .track-wrapper.route-actions-inside > .track-label.top{
  top:18px !important;
  right:18px !important;
  left:auto !important;
  bottom:auto !important;
  align-items:flex-end !important;
  text-align:right !important;
  max-width:340px !important;
  padding-right:0 !important;
}
body.simulator-layout .track-wrapper.route-actions-inside > .track-label.top{
  top:58px !important;
}
body.simulator-layout .track-wrapper > .track-label.bottom,
body.simulator-layout .track-wrapper.route-actions-inside > .track-label.bottom{
  bottom:16px !important;
  left:18px !important;
  right:auto !important;
  top:auto !important;
  align-items:flex-start !important;
  text-align:left !important;
  max-width:360px !important;
  padding-left:0 !important;
}
body.simulator-layout .track-wrapper > .track-label.bottom .next-bus,
body.simulator-layout .track-wrapper.route-actions-inside > .track-label.bottom .next-bus{
  margin-left:14px !important;
  margin-right:0 !important;
}
body.simulator-layout .track-wrapper > .track-label.top .next-bus,
body.simulator-layout .track-wrapper.route-actions-inside > .track-label.top .next-bus{
  margin-left:0 !important;
  margin-right:14px !important;
}
body.simulator-layout .route-number-hud{
  position:absolute !important;
  top:18px !important;
  left:18px !important;
  z-index:35 !important;
  min-width:96px !important;
  height:30px !important;
  padding:0 14px !important;
  border-radius:10px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:rgba(7,21,42,.96) !important;
  border:1.5px solid rgba(255,255,255,.92) !important;
  box-shadow:0 10px 22px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.10) !important;
  color:#ffffff !important;
  font-family:"Arial Black", Arial, sans-serif !important;
  font-size:12px !important;
  font-weight:900 !important;
  line-height:1 !important;
  letter-spacing:.06em !important;
  text-transform:uppercase !important;
  pointer-events:none !important;
  white-space:nowrap !important;
}
body.simulator-layout .route-number-hud[hidden]{
  display:none !important;
}
body.simulator-layout .route-number-badge,
body.simulator-layout .route-number-badge-bg,
body.simulator-layout .route-number-badge-text{
  display:none !important;
}


/* === ADEM FIX: EWT incentive / lost mileage HUD moved to bottom of AVL card === */
body.simulator-layout .track-wrapper .route-ewt-finance-hud{
  top:auto !important;
  bottom:12px !important;
  left:50% !important;
  right:auto !important;
  transform:translateX(-50%) !important;
  z-index:30 !important;
}
@media (max-width:1400px){
  body.simulator-layout .track-wrapper .route-ewt-finance-hud{
    top:auto !important;
    bottom:10px !important;
  }
}
@media (max-width:900px){
  body.simulator-layout .track-wrapper .route-ewt-finance-hud{
    top:auto !important;
    bottom:8px !important;
    left:12px !important;
    right:12px !important;
    transform:none !important;
  }
}


/* Hover tooltip removed: keep hidden and non-interactive. */
#busTooltip,
.bus-tooltip{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}


/* ===== Live table status colours aligned with bus colours ===== */
body.simulator-layout td.status-cell{
  font-weight:800 !important;
  letter-spacing:.01em;
}
body.simulator-layout td.status-good{
  color:#6c5200 !important;
  background:rgba(246,210,74,0.28) !important;
}
body.simulator-layout td.status-close{
  color:#8f1717 !important;
  background:rgba(239,83,80,0.20) !important;
}
body.simulator-layout td.status-far{
  color:#17653a !important;
  background:rgba(76,175,80,0.20) !important;
}
body.simulator-layout td.status-stand,
body.simulator-layout td.status-ghost{
  color:#425466 !important;
  background:rgba(148,163,184,0.20) !important;
}

/* ===== Wider Action Recommended KPI tile ===== */
body.simulator-layout .kpi-tiles{
  grid-template-columns: repeat(7, minmax(110px, 1fr)) minmax(190px, 1.10fr) minmax(430px, 2.45fr) minmax(300px, 1.65fr) !important;
}
@media (max-width: 1700px){
  body.simulator-layout .kpi-tiles{
    grid-template-columns: repeat(7, minmax(100px, 1fr)) minmax(170px, 1.0fr) minmax(360px, 2.1fr) minmax(270px, 1.55fr) !important;
  }
}
@media (max-width: 1450px){
  body.simulator-layout .kpi-tiles{
    grid-template-columns: repeat(5, minmax(120px, 1fr)) minmax(180px, 1.1fr) minmax(320px, 1.8fr) minmax(240px, 1.35fr) !important;
  }
}


/* ===== FINAL REFINEMENT: sharp status text + equal Action/Dispatcher width ===== */
/* Status cells: keep background, make text strong and readable */
body.simulator-layout td.status-cell{
  font-weight:900 !important;
  letter-spacing:.015em !important;
  text-shadow:0 1px 0 rgba(0,0,0,.72), 0 0 2px rgba(0,0,0,.45) !important;
}
body.simulator-layout td.status-good{
  color:#ffd84a !important;
}
body.simulator-layout td.status-close{
  color:#ff3333 !important;
}
body.simulator-layout td.status-far{
  color:#19d36f !important;
}
body.simulator-layout td.status-stand,
body.simulator-layout td.status-ghost{
  color:#d7e3f2 !important;
}

/* Bottom KPI grid: 9 real tiles. Make Action Recommended and Dispatcher Compliance similar width. */
body.simulator-layout .kpi-tiles{
  display:grid !important;
  grid-template-columns: repeat(7, minmax(108px, 1fr)) minmax(380px, 2.15fr) minmax(380px, 2.15fr) !important;
  gap:8px !important;
  align-items:stretch !important;
  justify-content:stretch !important;
  overflow:visible !important;
}
body.simulator-layout .kpi-tile.kpi-tile-wide{
  min-width:0 !important;
  width:auto !important;
}
body.simulator-layout #kpiActionRec{
  display:block !important;
  max-width:100% !important;
}
body.simulator-layout .kpi-value.kpi-wrap{
  white-space:normal !important;
  overflow-wrap:anywhere !important;
}
@media (max-width: 1700px){
  body.simulator-layout .kpi-tiles{
    grid-template-columns: repeat(7, minmax(96px, 1fr)) minmax(330px, 2fr) minmax(330px, 2fr) !important;
  }
}
@media (max-width: 1450px){
  body.simulator-layout .kpi-tiles{
    grid-template-columns: repeat(5, minmax(118px, 1fr)) minmax(170px, 1.05fr) minmax(300px, 1.85fr) minmax(300px, 1.85fr) !important;
  }
}
@media (max-width: 1200px){
  body.simulator-layout .kpi-tiles{
    grid-template-columns: repeat(3, minmax(140px, 1fr)) repeat(2, minmax(220px, 1.3fr)) !important;
  }
}


/* === Offline real-route mini map styling: lightweight, no live OSM tiles === */
body.simulator-layout #busCommandMapSvg,
body.simulator-layout #busMapOverlaySvg{
  background-color:#f8fafc !important;
  background-image:
    linear-gradient(90deg, rgba(148,163,184,.14) 1px, transparent 1px),
    linear-gradient(0deg, rgba(148,163,184,.14) 1px, transparent 1px),
    linear-gradient(135deg, rgba(37,99,235,.07), rgba(22,163,74,.04)) !important;
  background-size:34px 34px,34px 34px,100% 100% !important;
}
body.simulator-layout .bus-map-route{
  stroke:#334155 !important;
  stroke-width:7 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
  filter:drop-shadow(0 1px 1px rgba(255,255,255,.95));
}
body.simulator-layout .bus-map-stop{
  fill:#475569 !important;
  stroke:#ffffff !important;
  stroke-width:1.5 !important;
}
body.simulator-layout .bus-map-stop-label{
  fill:#111827 !important;
  font-weight:900 !important;
}


/* ===== REAL STREET MAP MODE FOR ROUTE POPUPS ===== */
.route-map-shell{
  position:relative;
  overflow:hidden;
}
.real-map-toggle{
  position:absolute;
  right:10px;
  top:10px;
  z-index:5000;
  display:flex;
  gap:6px;
  align-items:center;
}
.real-map-toggle button{
  border:1px solid rgba(255,255,255,.42);
  border-radius:999px;
  padding:6px 10px;
  background:rgba(15,42,83,.88);
  color:#fff;
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
  cursor:pointer;
  box-shadow:0 4px 12px rgba(0,0,0,.18);
}
.real-map-toggle button.active{
  background:#36a3ff;
  color:#031d38;
}
.real-map-panel{
  position:absolute;
  inset:0;
  z-index:3000;
  display:none;
  background:#e8eef5;
}
.real-map-panel.open{
  display:block;
}
.real-map-panel .leaflet-container{
  width:100%;
  height:100%;
  font-family:inherit;
}
.real-map-panel .leaflet-control-attribution{
  font-size:10px;
}
.real-map-bus-marker{
  display:flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  border-radius:999px;
  background:#2f78ff;
  color:#fff;
  border:2px solid #fff;
  box-shadow:0 2px 7px rgba(0,0,0,.32);
  font-size:11px;
  font-weight:900;
}
.real-map-bus-marker.out{
  background:#34c36b;
}
.real-map-bus-marker.in{
  background:#5c8dff;
}
.real-map-bus-marker.selected{
  background:#ffd43b;
  color:#111;
  border-color:#111;
}
.real-map-stop-marker{
  width:9px;
  height:9px;
  border-radius:999px;
  background:#ffffff;
  border:2px solid #153a69;
  box-shadow:0 1px 3px rgba(0,0,0,.25);
}


/* ===== REAL MAP TOGGLE LOADING FIX CSS ===== */
.real-map-force-toggle{
  position:absolute;
  top:14px;
  right:54px;
  z-index:200000;
  display:flex;
  gap:6px;
}
.real-map-force-toggle button{
  border:1px solid rgba(255,255,255,.50);
  border-radius:999px;
  padding:7px 11px;
  background:rgba(13,42,86,.92);
  color:#fff;
  font-size:11px;
  line-height:1;
  font-weight:900;
  letter-spacing:.04em;
  cursor:pointer;
  box-shadow:0 5px 14px rgba(0,0,0,.22);
}
.real-map-force-toggle button.active{
  background:#42a5ff;
  color:#031d38;
}
.real-map-force-overlay{
  position:absolute;
  z-index:150000;
  display:none;
  overflow:hidden;
  background:#dfe8f2;
  border-radius:12px;
}
.real-map-force-inner,
.real-map-force-inner .leaflet-container{
  width:100%;
  height:100%;
}
.real-force-bus{
  width:26px;
  height:26px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#4b82ff;
  color:#fff;
  border:2px solid #fff;
  box-shadow:0 2px 8px rgba(0,0,0,.35);
  font-size:11px;
  font-weight:900;
}
.real-force-bus.out{background:#2fbf63;}
.real-force-bus.in{background:#4b82ff;}
.real-force-bus.selected{background:#ffd43b;color:#111;border-color:#111;}


/* ===== SAFE COMMAND POPUP MAP BUTTON ONLY CSS ===== */
.safe-command-map-placeholder-only{
  min-height:170px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:rgba(224,239,255,.94) !important;
  border:1px solid rgba(255,255,255,.58) !important;
  border-radius:12px !important;
  overflow:hidden !important;
}
.safe-command-map-placeholder-only svg,
.safe-command-map-placeholder-only canvas,
.safe-command-map-placeholder-only .real-map-panel,
.safe-command-map-placeholder-only .real-map-force-overlay,
.safe-command-map-placeholder-only .real-map-toggle,
.safe-command-map-placeholder-only .real-map-force-toggle{
  display:none !important;
}
.safe-command-map-button-card{
  width:100%;
  min-height:160px;
  padding:16px;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#0d2a56;
}
.safe-command-map-button-title{
  font-weight:900;
  font-size:16px;
  letter-spacing:.04em;
  text-transform:uppercase;
  margin-bottom:8px;
}
.safe-command-map-button-subtitle{
  font-size:12px;
  font-weight:800;
  opacity:.85;
  margin-bottom:12px;
}
.safe-command-open-large-map-btn{
  border:1px solid rgba(255,255,255,.60);
  border-radius:999px;
  padding:10px 16px;
  background:linear-gradient(180deg,#51b1ff,#1e88ff);
  color:#fff;
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(20,76,142,.28);
}
.safe-command-open-large-map-btn:hover{filter:brightness(1.07);}
.safe-command-map-button-note{
  margin-top:9px;
  font-size:10px;
  font-weight:800;
  opacity:.68;
}


/* Command popup: route map open button only */
.bus-command-map-open-wrap{
  min-height:200px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:16px 12px 8px;
  background:rgba(233,240,249,0.92);
  border:1px solid rgba(255,255,255,0.52);
  border-radius:12px;
}
.bus-command-map-open-note{
  font-size:.78rem;
  line-height:1.4;
  color:#29456e;
  font-weight:700;
  margin-bottom:12px;
}
.bus-command-map-open-btn{
  border:1px solid rgba(255,255,255,.60);
  border-radius:999px;
  padding:12px 18px;
  background:linear-gradient(180deg,#51b1ff,#1e88ff);
  color:#fff;
  font-size:.8rem;
  font-weight:900;
  letter-spacing:.04em;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(20,76,142,.28);
}
.bus-command-map-open-btn:hover{filter:brightness(1.06);}


/* ===== COMPACT BUS COMMAND POPUP: map button + depart at under actions ===== */
.bus-command-dialog{
  max-width:min(620px,96vw) !important;
}
.bus-command-body{
  grid-template-columns:1fr !important;
}
.bus-command-map-col{
  display:none !important;
}
.bus-command-compact-tools{
  margin-top:12px;
  padding-top:10px;
  border-top:1px solid rgba(255,255,255,.24);
}
.bus-command-map-inline-btn{
  width:100%;
  border:1px solid rgba(255,255,255,.60);
  border-radius:999px;
  padding:12px 18px;
  background:linear-gradient(180deg,#51b1ff,#1e88ff);
  color:#fff;
  font-size:.82rem;
  font-weight:900;
  letter-spacing:.04em;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(20,76,142,.25);
  margin-bottom:12px;
}
.bus-command-map-inline-btn:hover{
  filter:brightness(1.06);
}
.bus-command-compact-tools .bus-depart-at{
  margin-top:0 !important;
  padding-top:0 !important;
  border-top:0 !important;
}
.bus-command-compact-tools .bus-depart-at-title{
  margin-bottom:6px;
}
.bus-command-compact-tools .bus-depart-at-row{
  display:flex;
  gap:8px;
  align-items:center;
}
.bus-command-compact-tools .bus-depart-at-row input{
  flex:1 1 auto;
}
.bus-command-compact-tools .bus-depart-at-row button{
  flex:0 0 auto;
}


/* ===== DEPART AT ROW FIX: time input priority, small Apply button ===== */
.bus-command-compact-tools .bus-depart-at{
  width:100% !important;
  box-sizing:border-box !important;
}
.bus-command-compact-tools .bus-depart-at-row{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  gap:10px !important;
  width:100% !important;
}
.bus-command-compact-tools .bus-depart-at-row input#busCmdDepartAtTime{
  flex:1 1 auto !important;
  width:auto !important;
  min-width:220px !important;
  height:40px !important;
  padding:0 14px !important;
  border-radius:12px !important;
  box-sizing:border-box !important;
}
.bus-command-compact-tools .bus-depart-at-row button#busCmdDepartAtApply{
  flex:0 0 96px !important;
  width:96px !important;
  min-width:96px !important;
  max-width:96px !important;
  height:40px !important;
  padding:0 12px !important;
  border-radius:999px !important;
  white-space:nowrap !important;
}


/* ===== OFFICIAL DUBLIN 39A GTFS REAL MAP ===== */
.official-dublin39a-map{
  display:none;
  width:100%;
  height:520px;
  min-height:420px;
  border-radius:14px;
  overflow:hidden;
  background:#dfe8f2;
  border:1px solid rgba(255,255,255,.45);
  position:relative;
}
#busMapOverlay.official-dublin39a-open #busMapOverlaySvg{
  display:none !important;
}
#busMapOverlay.official-dublin39a-open .official-dublin39a-map{
  display:block !important;
}
.official-gtfs-map-error{
  padding:18px;
  font-weight:900;
  color:#0d2a56;
}
#busMapOverlay.official-dublin39a-open .leaflet-overlay-pane{
  z-index:650 !important;
}
#busMapOverlay.official-dublin39a-open .leaflet-marker-pane{
  z-index:760 !important;
}
#busMapOverlay.official-dublin39a-open .leaflet-marker-icon{
  transition:transform 620ms linear !important;
  z-index:10000 !important;
}
.official-gtfs-route-line{
  filter:drop-shadow(0 0 4px rgba(0,0,0,.82));
}
.official-gtfs-bus-marker{
  width:34px;
  height:34px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-weight:900;
  font-size:12px;
  border:3px solid #fff;
  box-shadow:0 3px 14px rgba(0,0,0,.56);
  transition:transform 620ms linear;
}
.official-gtfs-bus-marker.outbound{
  background:#20b85a;
}
.official-gtfs-bus-marker.inbound{
  background:#3f7cff;
}
.official-gtfs-bus-marker.ghost{
  background:#9aa7b3;
}
.official-gtfs-bus-marker.selected{
  background:#ffd43b;
  color:#111;
  border-color:#111;
}
#busMapOverlay.official-dublin39a-open .bus-map-overlay-header span::after{
  content:" · Official GTFS 39A";
  color:#dff8ff;
  font-weight:900;
}

/* ===== OFFICIAL DUBLIN 39A ROUTE HIGHLIGHT FIX ===== */
.official-dublin39a-map{
  position:relative !important;
}
.official-39a-highlight-svg{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  z-index:740 !important;
  pointer-events:none !important;
  overflow:visible !important;
}
.official-39a-highlight-svg path{
  fill:none !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
  vector-effect:non-scaling-stroke !important;
}
.official-39a-outbound-halo,
.official-39a-inbound-halo{
  stroke:#00142f !important;
  stroke-width:15px !important;
  opacity:.82 !important;
}
.official-39a-outbound-white,
.official-39a-inbound-white{
  stroke:#ffffff !important;
  stroke-width:10px !important;
  opacity:.94 !important;
}
.official-39a-outbound-core{
  stroke:#00d45a !important;
  stroke-width:6px !important;
  opacity:1 !important;
  filter:drop-shadow(0 0 4px rgba(0,0,0,.85));
}
.official-39a-inbound-core{
  stroke:#3f7cff !important;
  stroke-width:5px !important;
  opacity:.96 !important;
  filter:drop-shadow(0 0 4px rgba(0,0,0,.85));
  stroke-dasharray:10 7 !important;
}
#busMapOverlay.official-dublin39a-open .leaflet-marker-pane{
  z-index:850 !important;
}
#busMapOverlay.official-dublin39a-open .leaflet-marker-icon{
  z-index:900 !important;
}

/* ===== DUBLIN 39A MAP VISUAL REFINEMENT: thinner line + buses above line + gentle zoom ===== */
.official-dublin39a-map{
  position:relative !important;
}
.official-39a-highlight-svg{
  z-index:640 !important;
}
.official-39a-outbound-halo,
.official-39a-inbound-halo{
  stroke-width:9px !important;
  opacity:.68 !important;
}
.official-39a-outbound-white,
.official-39a-inbound-white{
  stroke-width:6px !important;
  opacity:.84 !important;
}
.official-39a-outbound-core{
  stroke-width:3.5px !important;
  opacity:1 !important;
}
.official-39a-inbound-core{
  stroke-width:3px !important;
  opacity:1 !important;
  stroke-dasharray:7 6 !important;
}
.official-39a-bus-top-layer{
  position:absolute !important;
  inset:0 !important;
  z-index:980 !important;
  pointer-events:none !important;
  overflow:visible !important;
}
.official-39a-top-bus{
  position:absolute !important;
  width:32px !important;
  height:32px !important;
  border-radius:50% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#fff !important;
  font-size:12px !important;
  font-weight:900 !important;
  border:3px solid #ffffff !important;
  box-shadow:0 3px 13px rgba(0,0,0,.58) !important;
  transition:transform 340ms linear !important;
  will-change:transform !important;
}
.official-39a-top-bus.outbound{
  background:#20b85a !important;
}
.official-39a-top-bus.inbound{
  background:#3f7cff !important;
}
.official-39a-top-bus.ghost{
  background:#9aa7b3 !important;
}
.official-39a-top-bus.selected{
  background:#ffd43b !important;
  color:#111 !important;
  border-color:#111 !important;
}
#busMapOverlay.official-dublin39a-open .leaflet-marker-icon{
  transition:transform 340ms linear !important;
}

/* ===== OFFICIAL TIRANA 1B GTFS REAL MAP ===== */
.official-tirana1b-map{
  display:none;
  width:100%;
  height:520px;
  min-height:420px;
  border-radius:14px;
  overflow:hidden;
  background:#dfe8f2;
  border:1px solid rgba(255,255,255,.45);
  position:relative;
}
#busMapOverlay.official-tirana1b-open #busMapOverlaySvg{
  display:none !important;
}
#busMapOverlay.official-tirana1b-open .official-tirana1b-map{
  display:block !important;
}
.official-tirana1b-map-error{
  padding:18px;
  font-weight:900;
  color:#0d2a56;
}
#busMapOverlay.official-tirana1b-open .leaflet-overlay-pane{
  z-index:650 !important;
}
.official-tirana1b-route-line{
  filter:drop-shadow(0 0 4px rgba(0,0,0,.82));
}
.official-tirana1b-bus-top-layer{
  position:absolute !important;
  inset:0 !important;
  z-index:980 !important;
  pointer-events:none !important;
  overflow:visible !important;
}
.official-tirana1b-top-bus{
  position:absolute !important;
  width:32px !important;
  height:32px !important;
  border-radius:50% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#fff !important;
  font-size:12px !important;
  font-weight:900 !important;
  border:3px solid #ffffff !important;
  box-shadow:0 3px 13px rgba(0,0,0,.58) !important;
  transition:transform 340ms linear !important;
  will-change:transform !important;
}
.official-tirana1b-top-bus.outbound{
  background:#20b85a !important;
}
.official-tirana1b-top-bus.inbound{
  background:#3f7cff !important;
}
.official-tirana1b-top-bus.ghost{
  background:#9aa7b3 !important;
}
.official-tirana1b-top-bus.selected{
  background:#ffd43b !important;
  color:#111 !important;
  border-color:#111 !important;
}
#busMapOverlay.official-tirana1b-open .bus-map-overlay-header span::after{
  content:" · Official GTFS Tirana 1B";
  color:#dff8ff;
  font-weight:900;
}

/* ===== TIRANA 1B ROUTE LINE SAME STYLE AS DUBLIN ===== */
.official-tirana1b-map{
  position:relative !important;
}
.official-tirana1b-highlight-svg{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  z-index:640 !important;
  pointer-events:none !important;
  overflow:visible !important;
}
.official-tirana1b-highlight-svg path{
  fill:none !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
  vector-effect:non-scaling-stroke !important;
}
.official-tirana1b-outbound-halo,
.official-tirana1b-inbound-halo{
  stroke:#00142f !important;
  stroke-width:9px !important;
  opacity:.68 !important;
}
.official-tirana1b-outbound-white,
.official-tirana1b-inbound-white{
  stroke:#ffffff !important;
  stroke-width:6px !important;
  opacity:.84 !important;
}
.official-tirana1b-outbound-core{
  stroke:#00d45a !important;
  stroke-width:3.5px !important;
  opacity:1 !important;
  filter:drop-shadow(0 0 4px rgba(0,0,0,.82));
}
.official-tirana1b-inbound-core{
  stroke:#3f7cff !important;
  stroke-width:3px !important;
  opacity:1 !important;
  stroke-dasharray:7 6 !important;
  filter:drop-shadow(0 0 4px rgba(0,0,0,.82));
}
.official-tirana1b-bus-top-layer{
  z-index:980 !important;
}
#busMapOverlay.official-tirana1b-open .leaflet-marker-pane{
  z-index:850 !important;
}
#busMapOverlay.official-tirana1b-open .leaflet-marker-icon{
  z-index:900 !important;
}

/* ===== OFFICIAL LONDON ROUTE 25 TFL REAL MAP ===== */
.official-london25-map{
  display:none;
  width:100%;
  height:520px;
  min-height:420px;
  border-radius:14px;
  overflow:hidden;
  background:#dfe8f2;
  border:1px solid rgba(255,255,255,.45);
  position:relative;
}
#busMapOverlay.official-london25-open #busMapOverlaySvg{
  display:none !important;
}
#busMapOverlay.official-london25-open .official-london25-map{
  display:block !important;
}
.official-london25-map-error{
  padding:18px;
  font-weight:900;
  color:#0d2a56;
}
.official-london25-highlight-svg{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  z-index:640 !important;
  pointer-events:none !important;
  overflow:visible !important;
}
.official-london25-highlight-svg path{
  fill:none !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
  vector-effect:non-scaling-stroke !important;
}
.official-london25-outbound-halo,
.official-london25-inbound-halo{
  stroke:#00142f !important;
  stroke-width:9px !important;
  opacity:.68 !important;
}
.official-london25-outbound-white,
.official-london25-inbound-white{
  stroke:#ffffff !important;
  stroke-width:6px !important;
  opacity:.84 !important;
}
.official-london25-outbound-core{
  stroke:#00d45a !important;
  stroke-width:3.5px !important;
  opacity:1 !important;
  filter:drop-shadow(0 0 4px rgba(0,0,0,.82));
}
.official-london25-inbound-core{
  stroke:#3f7cff !important;
  stroke-width:3px !important;
  opacity:1 !important;
  stroke-dasharray:7 6 !important;
  filter:drop-shadow(0 0 4px rgba(0,0,0,.82));
}
.official-london25-bus-top-layer{
  position:absolute !important;
  inset:0 !important;
  z-index:980 !important;
  pointer-events:none !important;
  overflow:visible !important;
}
.official-london25-top-bus{
  position:absolute !important;
  width:32px !important;
  height:32px !important;
  border-radius:50% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#fff !important;
  font-size:12px !important;
  font-weight:900 !important;
  border:3px solid #ffffff !important;
  box-shadow:0 3px 13px rgba(0,0,0,.58) !important;
  transition:transform 340ms linear !important;
  will-change:transform !important;
}
.official-london25-top-bus.outbound{
  background:#20b85a !important;
}
.official-london25-top-bus.inbound{
  background:#3f7cff !important;
}
.official-london25-top-bus.ghost{
  background:#9aa7b3 !important;
}
.official-london25-top-bus.selected{
  background:#ffd43b !important;
  color:#111 !important;
  border-color:#111 !important;
}
#busMapOverlay.official-london25-open .bus-map-overlay-header span::after{
  content:" · Official TfL Route 25";
  color:#dff8ff;
  font-weight:900;
}


/* ===== CLEAN REAL MAP MANAGER v1 ===== */
.avl-clean-realmap-canvas{
  display:none;
  width:100%;
  height:520px;
  min-height:420px;
  border-radius:14px;
  overflow:hidden;
  background:#dfe8f2;
  border:1px solid rgba(255,255,255,.45);
  position:relative;
}
#busMapOverlay.avl-clean-realmap-open #busMapOverlaySvg{
  display:none !important;
}
#busMapOverlay.avl-clean-realmap-open .avl-clean-realmap-canvas{
  display:block !important;
}
.avl-clean-realmap-error{
  padding:18px;
  font-weight:900;
  color:#0d2a56;
}
.avl-clean-realmap-route-svg{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  z-index:640 !important;
  pointer-events:none !important;
  overflow:visible !important;
}
.avl-clean-realmap-route-svg path{
  fill:none !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
  vector-effect:non-scaling-stroke !important;
}
.avl-rm-out-halo,
.avl-rm-in-halo{
  stroke:#00142f !important;
  stroke-width:9px !important;
  opacity:.68 !important;
}
.avl-rm-out-white,
.avl-rm-in-white{
  stroke:#ffffff !important;
  stroke-width:6px !important;
  opacity:.84 !important;
}
.avl-rm-out-core{
  stroke:#00d45a !important;
  stroke-width:3.5px !important;
  opacity:1 !important;
  filter:drop-shadow(0 0 4px rgba(0,0,0,.82));
}
.avl-rm-in-core{
  stroke:#3f7cff !important;
  stroke-width:3px !important;
  opacity:1 !important;
  stroke-dasharray:7 6 !important;
  filter:drop-shadow(0 0 4px rgba(0,0,0,.82));
}
.avl-clean-realmap-bus-layer{
  position:absolute !important;
  inset:0 !important;
  z-index:980 !important;
  pointer-events:none !important;
  overflow:visible !important;
}
.avl-clean-realmap-bus{
  position:absolute !important;
  width:32px !important;
  height:32px !important;
  border-radius:50% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#fff !important;
  font-size:12px !important;
  font-weight:900 !important;
  border:3px solid #ffffff !important;
  box-shadow:0 3px 13px rgba(0,0,0,.58) !important;
  transition:transform 340ms linear !important;
  will-change:transform !important;
}
.avl-clean-realmap-bus.outbound{ background:#20b85a !important; }
.avl-clean-realmap-bus.inbound{ background:#3f7cff !important; }
.avl-clean-realmap-bus.ghost{ background:#9aa7b3 !important; }
.avl-clean-realmap-bus.selected{
  background:#ffd43b !important;
  color:#111 !important;
  border-color:#111 !important;
}


/* Exact HOLD/CURTAIL pins bypass grouping/smoothing; position comes only from freezeX/freezeY */
.bus-node.bus-exact-command-pin .bus-svg-body{
  stroke-width: 1.8px !important;
}


/* Command popup: compact OPEN MAP button under close X */
.bus-cmd-open-map-small{
  position:absolute !important;
  top:54px !important;
  right:18px !important;
  width:auto !important;
  min-width:86px !important;
  max-width:96px !important;
  height:30px !important;
  min-height:30px !important;
  padding:0 12px !important;
  border-radius:12px !important;
  font-size:11px !important;
  line-height:30px !important;
  letter-spacing:.02em !important;
  text-align:center !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  z-index:50 !important;
  box-shadow:0 5px 12px rgba(0,0,0,.18) !important;
}

/* remove the old full-width spacing feel when the button sits in the action list */
.bus-cmd-open-map-small + *{
  margin-top:0 !important;
}


/* Command popup: real compact OPEN MAP button under close X */
.bus-command-popup-has-top-map-btn{
  position:relative !important;
}
.safe-command-open-map-top-btn{
  position:absolute !important;
  top:54px !important;
  right:18px !important;
  width:86px !important;
  height:30px !important;
  min-height:30px !important;
  padding:0 10px !important;
  border:0 !important;
  border-radius:12px !important;
  background:linear-gradient(180deg,#40a8ff,#2489ed) !important;
  color:#fff !important;
  font-size:11px !important;
  font-weight:900 !important;
  letter-spacing:.02em !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  cursor:pointer !important;
  z-index:80 !important;
  box-shadow:0 6px 14px rgba(0,0,0,.20) !important;
}
.safe-command-open-map-top-btn:hover{
  filter:brightness(1.05) !important;
}
.safe-command-map-placeholder-only{
  display:none !important;
}


/* FINAL command window map button placement: actual static #busCommandMapOpenBtn */
.bus-command-dialog,
#busCommandDialog,
.bus-command-popup,
#busCommandPopup{
  position:relative !important;
}

#busCommandMapOpenBtn,
button#busCommandMapOpenBtn.bus-command-map-inline-btn,
button#busCommandMapOpenBtn.bus-command-map-top-btn{
  position:absolute !important;
  top:54px !important;
  right:18px !important;
  width:86px !important;
  max-width:86px !important;
  min-width:86px !important;
  height:30px !important;
  min-height:30px !important;
  padding:0 10px !important;
  border-radius:12px !important;
  font-size:11px !important;
  font-weight:900 !important;
  line-height:30px !important;
  letter-spacing:.02em !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  z-index:90 !important;
  margin:0 !important;
  box-shadow:0 6px 14px rgba(0,0,0,.20) !important;
}

/* Keep the depart-at section in the lower part, but remove the old full-width map-button spacing. */
.bus-command-compact-tools{
  position:static !important;
}
.bus-command-compact-tools > #busCommandMapOpenBtn{
  flex:0 0 auto !important;
}

/* Generated/fallback map cards must never recreate a full-width command-window map button. */
.safe-command-map-button-card,
.safe-command-map-button-title,
.safe-command-map-button-subtitle,
.safe-command-map-button-note,
.safe-command-open-large-map-btn{
  display:none !important;
}


/* Run Light passenger-transfer custom confirmation popup */
.rl-transfer-overlay{
  position:fixed;
  inset:0;
  z-index:99999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(4,14,31,.62);
  backdrop-filter:blur(5px);
}
.rl-transfer-dialog{
  position:relative;
  width:min(520px,94vw);
  border-radius:24px;
  padding:24px 24px 20px;
  background:linear-gradient(180deg,#f8fbff,#e7f1ff);
  color:#10243f;
  box-shadow:0 24px 70px rgba(0,0,0,.38);
  border:1px solid rgba(255,255,255,.78);
  font-family:inherit;
}
.rl-transfer-close{
  position:absolute;
  top:14px;
  right:14px;
  width:34px;
  height:34px;
  border:0;
  border-radius:50%;
  background:#163a63;
  color:#fff;
  font-size:22px;
  font-weight:900;
  line-height:34px;
  cursor:pointer;
}
.rl-transfer-icon{
  width:56px;
  height:56px;
  border-radius:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg,#1e90ff,#006ad6);
  color:#fff;
  font-size:30px;
  font-weight:1000;
  box-shadow:0 12px 24px rgba(0,106,214,.28);
  margin-bottom:12px;
}
.rl-transfer-dialog h2{
  margin:0 44px 8px 0;
  font-size:24px;
  line-height:1.15;
  font-weight:1000;
  letter-spacing:-.02em;
}
.rl-transfer-main{
  margin:0 0 14px;
  font-size:14px;
  line-height:1.45;
  font-weight:750;
  color:#244766;
}
.rl-transfer-steps{
  display:grid;
  gap:8px;
  margin:14px 0 18px;
}
.rl-transfer-steps div{
  display:flex;
  gap:10px;
  align-items:flex-start;
  padding:9px 10px;
  border-radius:14px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(25,80,140,.10);
}
.rl-transfer-steps strong{
  flex:0 0 24px;
  height:24px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#103a64;
  color:#fff;
  font-size:12px;
  font-weight:1000;
}
.rl-transfer-steps span{
  font-size:12.5px;
  line-height:1.35;
  font-weight:800;
  color:#163654;
}
.rl-transfer-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
}
.rl-transfer-actions button{
  border:0;
  border-radius:14px;
  padding:11px 15px;
  font-size:13px;
  font-weight:950;
  cursor:pointer;
}
.rl-transfer-cancel{
  background:#d7e1ed;
  color:#173654;
}
.rl-transfer-confirm{
  background:linear-gradient(180deg,#23b66f,#0a8f54);
  color:#fff;
  box-shadow:0 10px 22px rgba(10,143,84,.24);
}
.rl-transfer-confirm:hover,
.rl-transfer-cancel:hover,
.rl-transfer-close:hover{
  filter:brightness(1.04);
}


/* Ghost log-on popup: move higher and keep validation info non-blocking */
#busLoginOverlay.bus-command-backdrop{
  align-items:flex-start !important;
  padding-top:56px !important;
}
#busLoginOverlay .bus-command-dialog{
  transform:none !important;
  margin-top:0 !important;
  width:min(520px,96vw) !important;
}
#busLoginOverlay ~ .incident-popup,
#busLoginOverlay.show ~ .incident-popup{
  pointer-events:none !important;
}

/* The driver/controller info toast must never block typing into Log Bus On fields. */
.incident-popup{
  pointer-events:none !important;
}
.incident-popup.show{
  pointer-events:none !important;
}


body.bus-login-open .incident-popup{
  pointer-events:none !important;
  z-index:9998 !important;
}
body.bus-login-open #busLoginOverlay{
  z-index:2147483600 !important;
}
body.bus-login-open #busLoginOverlay .bus-command-dialog{
  position:relative !important;
  z-index:2147483601 !important;
}


/* =========================================================
   COMPACT SIMULATOR TOP-RIGHT CONTROLS
   START / RESET / TRAINEE SESSION now use a narrow vertical stack
   to avoid horizontal scrolling in full-screen simulator mode.
   ========================================================= */

/* Put START and RESET under each other inside the simulator control grid. */
.scenario-command-actions{
  grid-column:8 / 9 !important;
  grid-row:2 !important;
  justify-self:end !important;
  align-self:start !important;
  width:96px !important;
  max-width:96px !important;
  min-width:96px !important;
  margin-top:4px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  gap:4px !important;
  flex-wrap:nowrap !important;
  overflow:visible !important;
}

/* Keep route/theme pills out of this compact action stack. */
.scenario-command-actions .theme-indicator-pill,
.scenario-command-actions .route-header-top{
  display:none !important;
}

/* Smaller simulator START / RESET buttons. */
.scenario-command-actions #togglePause,
.scenario-command-actions #resetTest{
  width:96px !important;
  min-width:96px !important;
  max-width:96px !important;
  height:24px !important;
  min-height:24px !important;
  padding:0 6px !important;
  border-radius:7px !important;
  font-size:.54rem !important;
  line-height:1 !important;
  letter-spacing:.02em !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

/* Trainee/classroom access chip compact and moved away from the horizontal button row. */
html.trainee-join-only #avlAccessHud,
body.simulator-layout #avlAccessHud{
  max-width:116px !important;
  min-width:0 !important;
  min-height:24px !important;
  height:24px !important;
  padding:0 7px !important;
  border-radius:7px !important;
  font-size:.54rem !important;
  line-height:24px !important;
  text-align:center !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

/* In trainee mode put the TRAINEE SESSION chip visually under START / RESET. */
html.trainee-join-only #avlAccessHud{
  top:126px !important;
  right:16px !important;
}

/* Give the right-hand side enough height for the vertical stack, without widening the header. */
.embedded-sim-clock-slot{
  align-self:start !important;
}

/* Smaller screens: keep all three controls stacked on the right, never side-by-side. */
@media (max-width:1350px){
  .scenario-command-actions{
    grid-column:3 / span 1 !important;
    grid-row:auto !important;
    width:96px !important;
    min-width:96px !important;
    max-width:96px !important;
    justify-self:end !important;
  }
  html.trainee-join-only #avlAccessHud{
    top:118px !important;
    right:14px !important;
  }
}

@media (max-width:950px){
  .scenario-command-actions{
    grid-column:1 !important;
    grid-row:auto !important;
    justify-self:start !important;
    width:96px !important;
  }
  html.trainee-join-only #avlAccessHud{
    top:10px !important;
    right:10px !important;
  }
}


/* Remove simulator access countdown/chip from running simulator screen.
   Keep only START and RESET (TRAINER) in the compact top-right stack. */
#avlAccessHud,
html.trainee-join-only #avlAccessHud,
body.simulator-layout #avlAccessHud{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}


/* Hold command quick presets */
#busCommandHoldPane .hold-preset-title{
  margin:10px 0 6px !important;
  color:#d7ebff !important;
  font-size:.68rem !important;
  font-weight:900 !important;
  letter-spacing:.10em !important;
  text-transform:uppercase !important;
}
#busCommandHoldPane .hold-preset-grid{
  display:grid !important;
  grid-template-columns:repeat(9,minmax(0,1fr)) !important;
  gap:6px !important;
  margin:0 0 6px !important;
}
#busCommandHoldPane .hold-preset-btn{
  min-width:0 !important;
  width:100% !important;
  min-height:30px !important;
  height:30px !important;
  padding:0 !important;
  border-radius:9px !important;
  font-size:.72rem !important;
  font-weight:1000 !important;
  line-height:1 !important;
  letter-spacing:.02em !important;
}
#busCommandHoldPane .hold-preset-note{
  margin:2px 0 10px !important;
  color:rgba(225,239,255,.72) !important;
  font-size:.66rem !important;
  line-height:1.25 !important;
}
@media(max-width:680px){
  #busCommandHoldPane .hold-preset-grid{
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  }
}


/* Compact Hold / Recovery menu: small manual input + presets on one line */
#busCommandHoldPane .hold-compact-row{
  display:grid !important;
  grid-template-columns:150px minmax(0,1fr) !important;
  gap:10px !important;
  align-items:end !important;
  margin-top:2px !important;
}
#busCommandHoldPane .hold-manual-box,
#busCommandHoldPane .hold-preset-box{
  min-width:0 !important;
}
#busCommandHoldPane .hold-manual-box label,
#busCommandHoldPane .hold-preset-title{
  display:block !important;
  margin:0 0 5px !important;
  color:#d7ebff !important;
  font-size:.66rem !important;
  font-weight:900 !important;
  letter-spacing:.10em !important;
  text-transform:uppercase !important;
}
body.simulator-layout #busCommandHoldPane #busCommandHoldMinutes{
  width:82px !important;
  max-width:82px !important;
  min-width:82px !important;
  height:31px !important;
  min-height:31px !important;
  padding:0 8px !important;
  border-radius:9px !important;
  font-size:.86rem !important;
  font-weight:1000 !important;
}
#busCommandHoldPane .hold-preset-grid{
  display:grid !important;
  grid-template-columns:repeat(9, minmax(34px,1fr)) !important;
  gap:5px !important;
  margin:0 !important;
}
#busCommandHoldPane .hold-preset-btn{
  min-width:0 !important;
  width:100% !important;
  min-height:31px !important;
  height:31px !important;
  padding:0 !important;
  border-radius:9px !important;
  font-size:.76rem !important;
  font-weight:1000 !important;
  line-height:1 !important;
}
#busCommandHoldPane .hold-preset-note{
  margin:7px 0 8px !important;
  color:rgba(225,239,255,.70) !important;
  font-size:.64rem !important;
  line-height:1.2 !important;
}
#busCommandHoldPane .button-row{
  margin-top:8px !important;
}
@media(max-width:760px){
  #busCommandHoldPane .hold-compact-row{
    grid-template-columns:1fr !important;
  }
  #busCommandHoldPane .hold-preset-grid{
    grid-template-columns:repeat(5, minmax(34px,1fr)) !important;
  }
}


/* =========================================================
   AVL PERFORMANCE MODE
   Balanced is default: removes constant pulse animations and reduces paint cost
   without changing simulator logic, scoring or command behaviour.
   ========================================================= */
.command-field-performance{
  flex:0 0 auto !important;
  width:122px !important;
  max-width:122px !important;
}
.command-field-performance #performanceModeSelect{
  width:122px !important;
  min-width:122px !important;
}

/* Balanced and Low Power: stop continuous bus pulsing. Status colour remains visible. */
html.perf-balanced .bus-rect.bus-close,
html.perf-balanced .bus-rect.bus-wide,
body.perf-balanced .bus-rect.bus-close,
body.perf-balanced .bus-rect.bus-wide,
html.perf-low .bus-rect.bus-close,
html.perf-low .bus-rect.bus-wide,
body.perf-low .bus-rect.bus-close,
body.perf-low .bus-rect.bus-wide{
  animation:none !important;
}

/* Balanced: keep light shadows but remove the constantly repainting glow. */
html.perf-balanced .bus-rect,
body.perf-balanced .bus-rect{
  filter:drop-shadow(0 2px 3px rgba(15,23,42,.18)) !important;
  transition:transform .12s linear !important;
}
html.perf-balanced .bus-node.bus-status-emphasis,
body.perf-balanced .bus-node.bus-status-emphasis{
  filter:none !important;
}

/* Low Power: remove expensive SVG/CSS paint effects. */
html.perf-low .bus-rect,
body.perf-low .bus-rect{
  filter:none !important;
  transition:none !important;
}
html.perf-low .bus-node,
body.perf-low .bus-node,
html.perf-low .bus-tag-rect,
body.perf-low .bus-tag-rect,
html.perf-low .bus-tag-text,
body.perf-low .bus-tag-text{
  transition:none !important;
  animation:none !important;
}
html.perf-low .card,
body.perf-low .card,
html.perf-low .scenario-command-panel,
body.perf-low .scenario-command-panel,
html.perf-low .sim-clock-panel,
body.perf-low .sim-clock-panel,
html.perf-low #standHoldMonitor,
body.perf-low #standHoldMonitor,
html.perf-low .bus-command-dialog,
body.perf-low .bus-command-dialog{
  backdrop-filter:none !important;
  box-shadow:0 8px 18px rgba(1,12,33,.18) !important;
}
html.perf-low .track-wrapper::before,
html.perf-low .track-wrapper::after,
body.perf-low .track-wrapper::before,
body.perf-low .track-wrapper::after{
  opacity:.28 !important;
}

/* High Quality restores existing visual behaviour. */
html.perf-quality .bus-rect.bus-close,
body.perf-quality .bus-rect.bus-close{
  animation:busPulseClose 1.4s ease-in-out infinite;
}
html.perf-quality .bus-rect.bus-wide,
body.perf-quality .bus-rect.bus-wide{
  animation:busPulseWide 2.0s ease-in-out infinite;
}

@media (max-width:950px){
  .command-field-performance{
    width:100% !important;
    max-width:none !important;
  }
  .command-field-performance #performanceModeSelect{
    width:100% !important;
    min-width:0 !important;
  }
}


/* =========================================================
   TOP CONTROL ALIGNMENT + LOW POWER DEFAULT CLEANUP
   Keeps demo/full simulator controls aligned and starts with no pulse animation.
   ========================================================= */

/* Full-width single aligned header row for demo and simulator. */
.scenario-command-panel{
  padding:8px 10px !important;
  overflow:visible !important;
}
.scenario-command-row{
  display:grid !important;
  grid-template-columns:112px minmax(230px, 300px) 80px 116px 130px 152px minmax(190px, 1fr) 270px 150px 88px !important;
  gap:8px !important;
  align-items:start !important;
  justify-content:stretch !important;
}
.occ-header-brand{
  grid-column:1 !important;
  grid-row:1 !important;
  align-self:center !important;
  min-width:0 !important;
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
}
.occ-header-brand h2{
  margin:0 !important;
  font-size:1rem !important;
  line-height:1 !important;
  white-space:nowrap !important;
}
.occ-header-brand .platform-home-btn{
  min-height:30px !important;
  height:30px !important;
  padding:0 10px !important;
  font-size:.70rem !important;
  white-space:nowrap !important;
}
.command-field-scenario{
  grid-column:2 !important;
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
}
.command-field-speed{
  grid-column:3 !important;
  width:80px !important;
  max-width:80px !important;
  min-width:0 !important;
}
.command-field-performance{
  grid-column:4 !important;
  width:116px !important;
  max-width:116px !important;
  min-width:0 !important;
}
.command-field-city{
  grid-column:5 !important;
  width:130px !important;
  max-width:130px !important;
  min-width:0 !important;
}
.command-field-driver-change{
  grid-column:6 !important;
  width:152px !important;
  max-width:152px !important;
  min-width:0 !important;
}
.embedded-ewt-slot{
  grid-column:7 !important;
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
}
.embedded-stand-slot{
  grid-column:8 !important;
  width:270px !important;
  max-width:270px !important;
  min-width:270px !important;
  justify-self:stretch !important;
}
.embedded-sim-clock-slot{
  grid-column:9 !important;
  width:150px !important;
  max-width:150px !important;
  min-width:150px !important;
  justify-self:stretch !important;
}
.scenario-command-actions{
  grid-column:10 !important;
  grid-row:1 !important;
  width:88px !important;
  min-width:88px !important;
  max-width:88px !important;
  margin-top:0 !important;
  justify-self:end !important;
  align-self:start !important;
}

/* Keep Speed, Performance, City Pack and Driver Change visually level. */
.command-field-speed,
.command-field-performance,
.command-field-city,
.command-field-driver-change{
  align-self:start !important;
}
.command-field-performance #performanceModeSelect,
.command-field-city #locationSelect,
.command-field-driver-change #driverChangePointSelect{
  width:100% !important;
  min-width:0 !important;
}
.command-field label{
  min-height:12px !important;
}

/* More compact stand/sim clock cards so the top row does not wrap or overlap. */
#standHoldMonitor .stand-hold-monitor-cols{
  grid-template-columns:1fr 1fr !important;
  gap:6px !important;
}
#standHoldMonitor .stand-hold-col{
  min-height:76px !important;
  padding:6px 7px !important;
}
#standHoldMonitor .stand-hold-title{
  font-size:.66rem !important;
  margin-bottom:3px !important;
}
#standHoldMonitor .stand-hold-meta{
  font-size:.56rem !important;
  margin-bottom:3px !important;
}
#standHoldMonitor .stand-hold-list{
  max-height:48px !important;
  gap:3px !important;
}
#standHoldMonitor .stand-hold-line,
#standHoldMonitor .stand-hold-row,
#standHoldMonitor .stand-hold-row.one-line{
  font-size:.56rem !important;
  padding:3px 5px !important;
}
.sim-clock-panel{
  min-height:76px !important;
  padding:6px 8px !important;
}
.sim-clock-box{
  min-width:33px !important;
  width:33px !important;
  height:27px !important;
}
.sim-clock-box span{
  font-size:.98rem !important;
}
.sim-clock-colon{
  font-size:1rem !important;
}

/* Start/Reset stack remains compact. */
.scenario-command-actions #togglePause,
.scenario-command-actions #resetTest{
  width:88px !important;
  min-width:88px !important;
  max-width:88px !important;
  height:24px !important;
  min-height:24px !important;
  padding:0 4px !important;
  font-size:.52rem !important;
}

/* Low Power is the startup default: no continuous animation anywhere in the bus layer. */
html.perf-low *,
body.perf-low *{
  animation-duration:0s !important;
}
html.perf-low .bus-rect,
html.perf-low .bus-rect.bus-close,
html.perf-low .bus-rect.bus-wide,
body.perf-low .bus-rect,
body.perf-low .bus-rect.bus-close,
body.perf-low .bus-rect.bus-wide{
  animation:none !important;
  filter:none !important;
  transition:none !important;
}

/* Medium screens: move EWT/stand/clock to a neat second row instead of wrapping randomly. */
@media (max-width:1500px){
  .scenario-command-row{
    grid-template-columns:112px minmax(230px, 1fr) 80px 116px 130px 152px 88px !important;
  }
  .embedded-ewt-slot{
    grid-column:2 / span 2 !important;
    grid-row:2 !important;
  }
  .embedded-stand-slot{
    grid-column:4 / span 2 !important;
    grid-row:2 !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
  }
  .embedded-sim-clock-slot{
    grid-column:6 !important;
    grid-row:2 !important;
  }
  .scenario-command-actions{
    grid-column:7 !important;
    grid-row:1 !important;
  }
}
@media (max-width:950px){
  .scenario-command-row{
    grid-template-columns:1fr !important;
  }
  .occ-header-brand,
  .command-field-scenario,
  .command-field-speed,
  .command-field-performance,
  .command-field-city,
  .command-field-driver-change,
  .embedded-ewt-slot,
  .embedded-stand-slot,
  .embedded-sim-clock-slot,
  .scenario-command-actions{
    grid-column:1 !important;
    grid-row:auto !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    justify-self:stretch !important;
  }
}


/* =========================================================
   SIMULATOR MODE: REMOVE SCHEDULE TEXT
   Keeps menu + Platform Menu button, hides only the unnecessary SCHEDULE heading.
   ========================================================= */
body .occ-header-brand h2{
  display:none !important;
}
body .occ-header-brand{
  min-width:auto !important;
  width:auto !important;
  max-width:none !important;
}

/* =========================================================
   LOW POWER MODE: REMOVE DECORATIVE CITY BACKGROUND IMAGES
   Applies only when Performance = Low Power.
   High Quality and Balanced keep the city photo/illustration backdrops.
   Route geometry, stop dots, buses, stand overlay and real map lines are untouched.
   ========================================================= */
html.perf-low body.simulator-layout,
body.simulator-layout.perf-low,
html[data-performance-mode="low"] body.simulator-layout,
body.simulator-layout[data-performance-mode="low"]{
  background:#eef2f6 !important;
}
html.perf-low body.simulator-layout .track-wrapper,
body.simulator-layout.perf-low .track-wrapper,
html[data-performance-mode="low"] body.simulator-layout .track-wrapper,
body.simulator-layout[data-performance-mode="low"] .track-wrapper{
  background:linear-gradient(180deg, #f6f8fb 0%, #e8edf5 100%) !important;
}
html.perf-low body.simulator-layout .track-wrapper::before,
body.simulator-layout.perf-low .track-wrapper::before,
html[data-performance-mode="low"] body.simulator-layout .track-wrapper::before,
body.simulator-layout[data-performance-mode="low"] .track-wrapper::before{
  background:none !important;
  background-image:none !important;
  opacity:0 !important;
  filter:none !important;
}
html.perf-low body.simulator-layout .track-wrapper::after,
body.simulator-layout.perf-low .track-wrapper::after,
html[data-performance-mode="low"] body.simulator-layout .track-wrapper::after,
body.simulator-layout[data-performance-mode="low"] .track-wrapper::after{
  display:none !important;
  content:"" !important;
}


/* FINAL FIX: City Pack header must show only City + Route in the select.
   Hide the old route detail pill so it cannot cover/compete with Driver Change. */
body .route-header-under-city,
body .scenario-command-actions .route-header-top,
body #routeHeader.route-header-under-city{
  display:none !important;
  visibility:hidden !important;
}
body .command-field-city #locationSelect{
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  overflow:hidden !important;
}


/* =========================================================
   FINAL FIX: CITY PACK DROPDOWN MUST NOT COVER DRIVER CHANGE
   City Pack now displays only City + Route number and keeps a narrow native select width.
   Driver Change is given its own spacing so the two controls do not compete visually.
   ========================================================= */
body.simulator-layout .scenario-command-row{
  grid-template-columns:112px minmax(230px, 300px) 80px 116px 112px 156px minmax(190px, 1fr) 270px 150px 88px !important;
  column-gap:8px !important;
}
body.simulator-layout .command-field-city{
  grid-column:5 !important;
  width:112px !important;
  min-width:112px !important;
  max-width:112px !important;
  overflow:visible !important;
}
body.simulator-layout .command-field-driver-change{
  grid-column:6 !important;
  width:156px !important;
  min-width:156px !important;
  max-width:156px !important;
  margin-left:4px !important;
  overflow:visible !important;
}
body.simulator-layout .command-field-city #locationSelect,
body.simulator-layout select#locationSelect{
  width:112px !important;
  min-width:112px !important;
  max-width:112px !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  padding-left:10px !important;
  padding-right:22px !important;
}
body.simulator-layout .command-field-city #locationSelect option,
body.simulator-layout select#locationSelect option{
  max-width:112px !important;
}
@media (max-width:1500px){
  body.simulator-layout .scenario-command-row{
    grid-template-columns:112px minmax(230px, 1fr) 80px 116px 112px 156px 88px !important;
  }
  body.simulator-layout .embedded-ewt-slot{
    grid-column:2 / span 2 !important;
    grid-row:2 !important;
  }
  body.simulator-layout .embedded-stand-slot{
    grid-column:4 / span 2 !important;
    grid-row:2 !important;
  }
  body.simulator-layout .embedded-sim-clock-slot{
    grid-column:6 !important;
    grid-row:2 !important;
  }
  body.simulator-layout .scenario-command-actions{
    grid-column:7 !important;
    grid-row:1 !important;
  }
}


/* === Selected Driver Change point highlight on AVL route diagram ===
   Text badge removed: selected changeover is indicated by colour only. === */
body.simulator-layout #simSvg .route-driver-change-connector{
  stroke:#6d28d9 !important;
  stroke-width:5.5 !important;
  stroke-dasharray:none !important;
  opacity:1 !important;
  filter:drop-shadow(0 0 8px rgba(109,40,217,.8)) !important;
}
body.simulator-layout #simSvg .route-point.route-driver-change-point{
  fill:#7c3aed !important;
  stroke:#fde68a !important;
  stroke-width:3.4 !important;
  filter:drop-shadow(0 0 11px rgba(124,58,237,.92)) !important;
}
body.simulator-layout #simSvg .route-label.route-driver-change-label{
  fill:#111827 !important;
  stroke:#fde68a !important;
  stroke-width:5.2px !important;
  paint-order:stroke fill !important;
  font-weight:1000 !important;
}
body.simulator-layout #simSvg .route-driver-change-badge,
body.simulator-layout #simSvg .route-driver-change-badge-bg,
body.simulator-layout #simSvg .route-driver-change-badge-text{
  display:none !important;
}

/* =========================================================
   G3 / non-16:9 fullscreen bottom KPI dock fix
   Keeps the bottom result card in one balanced row when Smart Full Screen is active.
   This is fullscreen-only and does not affect bus logic, route maps or AI review.
   ========================================================= */
html.avl-smart-fullscreen-fit-active body.simulator-layout #bottomDock{
  left:8px !important;
  right:8px !important;
  bottom:8px !important;
  gap:6px !important;
  pointer-events:none !important;
}
html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock{
  padding:7px 8px !important;
  border-radius:14px !important;
  max-width:none !important;
  width:auto !important;
  box-sizing:border-box !important;
}
html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-tiles{
  display:grid !important;
  grid-template-columns: repeat(7, minmax(72px, 1fr)) minmax(220px, 1.85fr) minmax(220px, 1.85fr) !important;
  grid-auto-rows:1fr !important;
  gap:6px !important;
  align-items:stretch !important;
  justify-content:stretch !important;
  flex-wrap:nowrap !important;
  overflow:visible !important;
}
html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-tile,
html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-tile.kpi-tile-wide,
html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-tile.action{
  min-width:0 !important;
  width:auto !important;
  max-width:none !important;
  flex:unset !important;
  padding:7px 8px !important;
  border-radius:12px !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
}
html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-label{
  font-size:9px !important;
  line-height:1.08 !important;
  letter-spacing:.055em !important;
  overflow-wrap:anywhere !important;
}
html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-value{
  margin-top:3px !important;
  font-size:18px !important;
  line-height:1.05 !important;
  gap:4px !important;
  min-width:0 !important;
}
html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-value.kpi-wrap{
  display:block !important;
  font-size:13px !important;
  line-height:1.15 !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
}
html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-unit,
html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-currency{
  font-size:10px !important;
  line-height:1 !important;
}
html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock #kpiComplianceHeadline{
  font-size:13px !important;
  line-height:1.12 !important;
}
html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock #kpiComplianceDetail,
html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-subvalue{
  margin-top:3px !important;
  font-size:10px !important;
  line-height:1.14 !important;
  letter-spacing:0 !important;
}
html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock #kpiActionRec{
  display:block !important;
  max-width:100% !important;
}
@media (max-width:1500px){
  html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-tiles{
    grid-template-columns: repeat(7, minmax(64px, 1fr)) minmax(190px, 1.75fr) minmax(190px, 1.75fr) !important;
    gap:5px !important;
  }
  html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-tile,
  html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-tile.kpi-tile-wide{
    padding:6px 7px !important;
  }
  html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-label{font-size:8.4px !important;}
  html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-value{font-size:16px !important;}
  html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-value.kpi-wrap{font-size:12px !important;}
  html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock #kpiComplianceHeadline{font-size:12px !important;}
  html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock #kpiComplianceDetail,
  html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-subvalue{font-size:9.4px !important;}
}
@media (max-width:1180px){
  html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-tiles{
    grid-template-columns: repeat(7, minmax(54px, 1fr)) minmax(160px, 1.55fr) minmax(160px, 1.55fr) !important;
    gap:4px !important;
  }
  html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-label{font-size:7.6px !important;}
  html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-value{font-size:14px !important;}
  html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-value.kpi-wrap{font-size:10.5px !important;}
  html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock #kpiComplianceHeadline{font-size:10.5px !important;}
  html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock #kpiComplianceDetail,
  html.avl-smart-fullscreen-fit-active body.simulator-layout #kpiDock .kpi-subvalue{font-size:8.4px !important;}
}


/* === FULLSCREEN TOP SCROLLBAR REMOVAL ONLY ===
   Use Smart Fullscreen Fit instead of a horizontal header scrollbar.
   Fullscreen-only; no simulator logic changes. */
html.avl-smart-fullscreen-fit-active body.simulator-layout .scenario-command-row{
  overflow-x:hidden !important;
  overflow-y:visible !important;
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
}
html.avl-smart-fullscreen-fit-active body.simulator-layout .scenario-command-row::-webkit-scrollbar{
  display:none !important;
  width:0 !important;
  height:0 !important;
}
html.avl-smart-fullscreen-fit-active body.simulator-layout{
  overflow:hidden !important;
}

/* =========================================================
   FINAL SIMULATOR-ONLY TOP HEADER AUTO-FIT / NO SCROLL
   - Normal simulator view: no horizontal top scrollbar at 100% zoom.
   - Fullscreen simulator view: header controls fit inside the blue working panel.
   - Demo simulator untouched.
   ========================================================= */
html body.simulator-layout,
html body.simulator-layout .page,
html body.simulator-layout .layout-top,
html body.simulator-layout .card.scenario,
html body.simulator-layout .scenario-command-panel{
  max-width:100vw !important;
  overflow-x:hidden !important;
  box-sizing:border-box !important;
}
html body.simulator-layout .card.scenario{
  padding-left:12px !important;
  padding-right:12px !important;
}
html body.simulator-layout .scenario-command-row{
  display:grid !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  grid-template-columns:118px minmax(112px,1.08fr) 64px 104px 96px 136px minmax(172px,.95fr) minmax(220px,1.35fr) 118px 72px !important;
  column-gap:5px !important;
  row-gap:4px !important;
  align-items:start !important;
  justify-content:stretch !important;
  overflow-x:hidden !important;
  overflow-y:visible !important;
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
  padding:0 !important;
}
html body.simulator-layout .scenario-command-row::-webkit-scrollbar{
  display:none !important;
  width:0 !important;
  height:0 !important;
}
html body.simulator-layout .occ-header-brand{
  grid-column:1 !important;
  grid-row:1 !important;
  min-width:0 !important;
  width:118px !important;
  max-width:118px !important;
  gap:5px !important;
  padding-right:0 !important;
  overflow:hidden !important;
}
html body.simulator-layout .occ-header-brand h2{
  display:none !important;
}
html body.simulator-layout .occ-brand-menu-icon{
  width:22px !important;
  min-width:22px !important;
  height:22px !important;
  font-size:13px !important;
}
html body.simulator-layout .platform-home-btn{
  width:90px !important;
  min-width:90px !important;
  max-width:90px !important;
  height:28px !important;
  min-height:28px !important;
  padding:0 6px !important;
  font-size:10px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
html body.simulator-layout .command-field-scenario{
  grid-column:2 !important;
  grid-row:1 !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  flex:unset !important;
}
html body.simulator-layout .command-field-scenario #scenarioSelect{
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
html body.simulator-layout .scenario-time-subrow{
  max-width:78px !important;
}
html body.simulator-layout .scenario-time-subrow #timeBandSelect{
  width:78px !important;
  min-width:78px !important;
  max-width:78px !important;
}
html body.simulator-layout .command-field-speed{
  grid-column:3 !important;
  width:64px !important;
  min-width:0 !important;
  max-width:64px !important;
  flex:unset !important;
}
html body.simulator-layout .command-field-speed .speed-field-inner{
  width:100% !important;
  min-width:0 !important;
  gap:0 !important;
}
html body.simulator-layout .command-field-speed #speedSelect{
  width:64px !important;
  min-width:64px !important;
  max-width:64px !important;
}
html body.simulator-layout .command-field-speed .top-speed-readout{
  display:none !important;
}
html body.simulator-layout .command-field-performance{
  grid-column:4 !important;
  width:104px !important;
  min-width:0 !important;
  max-width:104px !important;
  flex:unset !important;
}
html body.simulator-layout .command-field-performance #performanceModeSelect{
  width:104px !important;
  min-width:0 !important;
  max-width:104px !important;
}
html body.simulator-layout .command-field-city{
  grid-column:5 !important;
  width:96px !important;
  min-width:0 !important;
  max-width:96px !important;
  flex:unset !important;
}
html body.simulator-layout .command-field-city #locationSelect,
html body.simulator-layout select#locationSelect{
  width:96px !important;
  min-width:0 !important;
  max-width:96px !important;
  padding-left:8px !important;
  padding-right:20px !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  overflow:hidden !important;
}
html body.simulator-layout .command-field-driver-change{
  grid-column:6 !important;
  width:136px !important;
  min-width:0 !important;
  max-width:136px !important;
  margin-left:0 !important;
  flex:unset !important;
}
html body.simulator-layout .command-field-driver-change #driverChangePointSelect{
  width:136px !important;
  min-width:0 !important;
  max-width:136px !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  overflow:hidden !important;
}
html body.simulator-layout .embedded-ewt-slot,
html body.simulator-layout .embedded-ewt-slot.demo-ewt-after-dispatcher{
  grid-column:7 !important;
  grid-row:1 !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  height:76px !important;
  min-height:76px !important;
  max-height:76px !important;
  flex:unset !important;
}
html body.simulator-layout .embedded-ewt-slot #ewtStrip,
html body.simulator-layout #ewtStrip{
  position:static !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  height:76px !important;
  min-height:76px !important;
  max-height:76px !important;
  padding:7px 9px !important;
  overflow:hidden !important;
}
html body.simulator-layout #ewtStrip .ewt-hud-value{
  font-size:1.28rem !important;
}
html body.simulator-layout #ewtStrip .ewt-hud-target,
html body.simulator-layout #ewtStrip .ewt-hud-delta{
  font-size:.54rem !important;
}
html body.simulator-layout .embedded-stand-slot{
  grid-column:8 !important;
  grid-row:1 !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  flex:unset !important;
}
html body.simulator-layout #standHoldMonitor{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  height:76px !important;
  min-height:76px !important;
  max-height:76px !important;
}
html body.simulator-layout #standHoldMonitor .stand-hold-col{
  padding:6px 7px !important;
}
html body.simulator-layout #standHoldMonitor .stand-hold-title{
  font-size:.62rem !important;
}
html body.simulator-layout #standHoldMonitor .stand-hold-meta,
html body.simulator-layout #standHoldMonitor .stand-hold-line,
html body.simulator-layout #standHoldMonitor .stand-hold-row,
html body.simulator-layout #standHoldMonitor .stand-hold-row.one-line{
  font-size:.50rem !important;
}
html body.simulator-layout .embedded-sim-clock-slot{
  grid-column:9 !important;
  grid-row:1 !important;
  width:118px !important;
  min-width:0 !important;
  max-width:118px !important;
  flex:unset !important;
}
html body.simulator-layout .sim-clock-panel{
  width:118px !important;
  min-width:0 !important;
  max-width:118px !important;
  min-height:76px !important;
  height:76px !important;
  padding:6px 8px !important;
}
html body.simulator-layout .sim-clock-box{
  min-width:27px !important;
  width:27px !important;
  height:25px !important;
}
html body.simulator-layout .sim-clock-box span{
  font-size:.86rem !important;
}
html body.simulator-layout .sim-clock-panel-sub{
  font-size:.44rem !important;
}
html body.simulator-layout .scenario-command-actions{
  grid-column:10 !important;
  grid-row:1 !important;
  width:72px !important;
  min-width:0 !important;
  max-width:72px !important;
  display:flex !important;
  flex-direction:column !important;
  gap:5px !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  margin:0 !important;
  flex:unset !important;
}
html body.simulator-layout .scenario-command-actions #togglePause,
html body.simulator-layout .scenario-command-actions #resetTest{
  width:72px !important;
  min-width:0 !important;
  max-width:72px !important;
  height:25px !important;
  min-height:25px !important;
  padding:0 5px !important;
  font-size:.47rem !important;
}
@media (max-width:1320px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px minmax(100px,1fr) 60px 94px 88px 124px minmax(156px,.9fr) minmax(190px,1.15fr) 106px 68px !important;
    column-gap:4px !important;
  }
  html body.simulator-layout .platform-home-btn{width:84px !important;min-width:84px !important;max-width:84px !important;font-size:9px !important;}
  html body.simulator-layout .occ-header-brand{width:112px !important;max-width:112px !important;}
  html body.simulator-layout .command-field-speed, html body.simulator-layout .command-field-speed #speedSelect{width:60px !important;max-width:60px !important;}
  html body.simulator-layout .command-field-performance, html body.simulator-layout .command-field-performance #performanceModeSelect{width:94px !important;max-width:94px !important;}
  html body.simulator-layout .command-field-city, html body.simulator-layout .command-field-city #locationSelect{width:88px !important;max-width:88px !important;}
  html body.simulator-layout .command-field-driver-change, html body.simulator-layout .command-field-driver-change #driverChangePointSelect{width:124px !important;max-width:124px !important;}
  html body.simulator-layout .embedded-sim-clock-slot, html body.simulator-layout .sim-clock-panel{width:106px !important;max-width:106px !important;}
  html body.simulator-layout .scenario-command-actions, html body.simulator-layout .scenario-command-actions #togglePause, html body.simulator-layout .scenario-command-actions #resetTest{width:68px !important;max-width:68px !important;}
}
@media (max-width:1100px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px minmax(140px,1fr) 60px 96px 90px 130px 108px 74px !important;
    grid-auto-rows:auto !important;
  }
  html body.simulator-layout .embedded-ewt-slot{grid-column:1 / span 3 !important;grid-row:2 !important;}
  html body.simulator-layout .embedded-stand-slot{grid-column:4 / span 3 !important;grid-row:2 !important;}
  html body.simulator-layout .embedded-sim-clock-slot{grid-column:7 !important;grid-row:2 !important;}
  html body.simulator-layout .scenario-command-actions{grid-column:8 !important;grid-row:2 !important;}
}
html.avl-smart-fullscreen-fit-active body.simulator-layout .scenario-command-row{
  overflow-x:hidden !important;
  scrollbar-width:none !important;
}



/* === SCENARIO LENGTH ONLY FIX - simulator mode only ===
   Requested change: reduce the scenario window horizontal length only.
   No JS, scenario labels, demo layout, AI, route, map, or simulator logic changed. */
html body.simulator-layout .scenario-command-row{
  grid-template-columns:118px 170px 64px 104px 96px 136px minmax(172px,1.12fr) minmax(220px,1.45fr) 118px 72px !important;
}
html body.simulator-layout .command-field-scenario{
  grid-column:2 !important;
  grid-row:1 !important;
  width:170px !important;
  min-width:170px !important;
  max-width:170px !important;
  flex:0 0 170px !important;
}
html body.simulator-layout .command-field-scenario #scenarioSelect{
  width:170px !important;
  min-width:170px !important;
  max-width:170px !important;
  height:28px !important;
  min-height:28px !important;
  max-height:28px !important;
  padding:0 24px 0 10px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
html body.simulator-layout .scenario-time-subrow{
  width:170px !important;
  max-width:170px !important;
}
@media (max-width:1320px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px 150px 60px 94px 88px 124px minmax(156px,.98fr) minmax(190px,1.25fr) 106px 68px !important;
  }
  html body.simulator-layout .command-field-scenario,
  html body.simulator-layout .command-field-scenario #scenarioSelect{
    width:150px !important;
    min-width:150px !important;
    max-width:150px !important;
  }
  html body.simulator-layout .scenario-time-subrow{
    width:150px !important;
    max-width:150px !important;
  }
}
@media (max-width:1100px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px 150px 60px 96px 90px 130px 108px 74px !important;
  }
}


/* === FINAL SIMULATOR-ONLY SCENARIO LENGTH FIX ===
   Only changes the horizontal length of the Scenario control in simulator mode.
   No demo, logic, AI, route, map, or fullscreen-fit logic changes. */
html body.simulator-layout .scenario-command-row{
  grid-template-columns:118px 150px 64px 104px 96px 136px minmax(172px,.95fr) minmax(220px,1.35fr) 118px 72px !important;
}
html body.simulator-layout .command-field-scenario{
  grid-column:2 !important;
  grid-row:1 !important;
  width:150px !important;
  min-width:150px !important;
  max-width:150px !important;
  flex:0 0 150px !important;
}
html body.simulator-layout .command-field-scenario #scenarioSelect{
  width:150px !important;
  min-width:150px !important;
  max-width:150px !important;
  height:28px !important;
  min-height:28px !important;
  max-height:28px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
html body.simulator-layout .scenario-time-subrow{
  max-width:150px !important;
}
@media (max-width:1320px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px 140px 60px 94px 88px 124px minmax(156px,.9fr) minmax(190px,1.15fr) 106px 68px !important;
  }
  html body.simulator-layout .command-field-scenario,
  html body.simulator-layout .command-field-scenario #scenarioSelect{
    width:140px !important;
    min-width:140px !important;
    max-width:140px !important;
  }
  html body.simulator-layout .scenario-time-subrow{
    max-width:140px !important;
  }
}
@media (max-width:1100px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px 130px 60px 96px 90px 130px 108px 74px !important;
  }
  html body.simulator-layout .command-field-scenario,
  html body.simulator-layout .command-field-scenario #scenarioSelect{
    width:130px !important;
    min-width:130px !important;
    max-width:130px !important;
  }
  html body.simulator-layout .scenario-time-subrow{
    max-width:130px !important;
  }
}



/* === SIMULATOR ONLY: DRIVER CHANGE SPACE + SIM CLOCK 15% SIZE FIX ===
   Requested change only:
   1) move Driver Change control slightly right so it does not crowd/overlap City Pack
   2) make Sim Clock number window about 15% bigger
   Demo, AI, maps, bus logic, Supabase, fullscreen fit and route data are untouched. */
html body.simulator-layout .scenario-command-row{
  grid-template-columns:118px 150px 64px 104px 96px 154px minmax(160px,.82fr) minmax(210px,1.25fr) 136px 72px !important;
  column-gap:6px !important;
}
html body.simulator-layout .command-field-driver-change{
  grid-column:6 !important;
  grid-row:1 !important;
  width:140px !important;
  min-width:140px !important;
  max-width:140px !important;
  margin-left:12px !important;
  flex:0 0 140px !important;
}
html body.simulator-layout .command-field-driver-change #driverChangePointSelect{
  width:140px !important;
  min-width:140px !important;
  max-width:140px !important;
}
html body.simulator-layout .embedded-sim-clock-slot{
  grid-column:9 !important;
  grid-row:1 !important;
  width:136px !important;
  min-width:0 !important;
  max-width:136px !important;
  flex:unset !important;
}
html body.simulator-layout .sim-clock-panel{
  width:136px !important;
  min-width:0 !important;
  max-width:136px !important;
  min-height:82px !important;
  height:82px !important;
  padding:7px 9px !important;
}
html body.simulator-layout .sim-clock-display{
  gap:5px !important;
}
html body.simulator-layout .sim-clock-box{
  min-width:31px !important;
  width:31px !important;
  height:29px !important;
}
html body.simulator-layout .sim-clock-box span{
  font-size:.99rem !important;
  line-height:1 !important;
}
html body.simulator-layout .sim-clock-colon{
  font-size:1.08rem !important;
}
html body.simulator-layout .sim-clock-panel-title{
  font-size:.70rem !important;
}
html body.simulator-layout .sim-clock-panel-sub{
  font-size:.49rem !important;
}
@media (max-width:1320px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px 140px 60px 94px 88px 144px minmax(138px,.82fr) minmax(186px,1.10fr) 122px 68px !important;
    column-gap:5px !important;
  }
  html body.simulator-layout .command-field-driver-change{
    width:132px !important;
    min-width:132px !important;
    max-width:132px !important;
    margin-left:10px !important;
    flex-basis:132px !important;
  }
  html body.simulator-layout .command-field-driver-change #driverChangePointSelect{
    width:132px !important;
    min-width:132px !important;
    max-width:132px !important;
  }
  html body.simulator-layout .embedded-sim-clock-slot,
  html body.simulator-layout .sim-clock-panel{
    width:122px !important;
    max-width:122px !important;
  }
  html body.simulator-layout .sim-clock-box{
    min-width:29px !important;
    width:29px !important;
    height:27px !important;
  }
  html body.simulator-layout .sim-clock-box span{
    font-size:.94rem !important;
  }
}
@media (max-width:1100px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px 130px 60px 96px 90px 142px 124px 74px !important;
    column-gap:5px !important;
  }
  html body.simulator-layout .command-field-driver-change{
    width:132px !important;
    min-width:132px !important;
    max-width:132px !important;
    margin-left:8px !important;
  }
  html body.simulator-layout .command-field-driver-change #driverChangePointSelect{
    width:132px !important;
    min-width:132px !important;
    max-width:132px !important;
  }
  html body.simulator-layout .embedded-sim-clock-slot{
    grid-column:7 !important;
    grid-row:2 !important;
    width:124px !important;
    max-width:124px !important;
  }
  html body.simulator-layout .sim-clock-panel{
    width:124px !important;
    max-width:124px !important;
  }
}

/* === SIMULATOR ONLY: STAND WIDTH -30% + SIM CLOCK WIDTH +15% ===
   Requested change only:
   - reduce Stand A/B top header area width by 30%
   - increase Sim Clock window width by 15%
   No demo, AI, route, map, bus movement, Supabase or fullscreen logic changes. */
html body.simulator-layout .scenario-command-row{
  grid-template-columns:118px 150px 64px 104px 96px 154px minmax(160px,.82fr) minmax(147px,.875fr) 156px 72px !important;
}
html body.simulator-layout .embedded-stand-slot{
  grid-column:8 !important;
  grid-row:1 !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  flex:unset !important;
}
html body.simulator-layout #standHoldMonitor{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
}
html body.simulator-layout #standHoldMonitor .stand-hold-monitor-cols{
  grid-template-columns:1fr 1fr !important;
  gap:5px !important;
}
html body.simulator-layout .embedded-sim-clock-slot,
html body.simulator-layout .sim-clock-panel{
  width:156px !important;
  max-width:156px !important;
}
html body.simulator-layout .embedded-sim-clock-slot{
  grid-column:9 !important;
  grid-row:1 !important;
  min-width:0 !important;
  flex:unset !important;
}
html body.simulator-layout .sim-clock-panel{
  min-width:0 !important;
}
html body.simulator-layout .sim-clock-box{
  min-width:36px !important;
  width:36px !important;
}
@media (max-width:1320px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px 140px 60px 94px 88px 144px minmax(138px,.82fr) minmax(130px,.77fr) 140px 68px !important;
  }
  html body.simulator-layout .embedded-sim-clock-slot,
  html body.simulator-layout .sim-clock-panel{
    width:140px !important;
    max-width:140px !important;
  }
  html body.simulator-layout .sim-clock-box{
    min-width:33px !important;
    width:33px !important;
  }
}
@media (max-width:1100px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px 130px 60px 96px 90px 142px 143px 74px !important;
  }
  html body.simulator-layout .embedded-sim-clock-slot,
  html body.simulator-layout .sim-clock-panel{
    width:143px !important;
    max-width:143px !important;
  }
}

/* === SIMULATOR ONLY: START/RESET UNDER LIVE EWT + CLOCK NUMBERS -20% ===
   Requested change only:
   - Sim Clock number text reduced by 20%.
   - Start and Reset (Trainer) moved under Live EWT, side-by-side and centered.
   - Simulator mode only. Demo, AI, route data, maps, bus logic, Supabase and fullscreen fit untouched. */
html body.simulator-layout .scenario-command-row{
  grid-template-columns:118px 150px 64px 104px 96px 154px minmax(172px,.92fr) minmax(147px,.875fr) 156px !important;
  column-gap:6px !important;
  align-items:start !important;
}
html body.simulator-layout .embedded-ewt-slot,
html body.simulator-layout .embedded-ewt-slot.demo-ewt-after-dispatcher{
  grid-column:7 !important;
  grid-row:1 !important;
  height:112px !important;
  min-height:112px !important;
  max-height:112px !important;
  align-self:start !important;
}
html body.simulator-layout .embedded-ewt-slot #ewtStrip,
html body.simulator-layout #ewtStrip{
  height:76px !important;
  min-height:76px !important;
  max-height:76px !important;
}
html body.simulator-layout .scenario-command-actions{
  grid-column:7 !important;
  grid-row:1 !important;
  align-self:end !important;
  justify-self:center !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  height:28px !important;
  min-height:28px !important;
  max-height:28px !important;
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  gap:7px !important;
  align-items:center !important;
  justify-content:center !important;
  margin:0 !important;
  padding:0 !important;
  z-index:8 !important;
  overflow:visible !important;
}
html body.simulator-layout .scenario-command-actions #togglePause,
html body.simulator-layout .scenario-command-actions #resetTest{
  height:26px !important;
  min-height:26px !important;
  max-height:26px !important;
  width:82px !important;
  min-width:82px !important;
  max-width:82px !important;
  padding:0 6px !important;
  font-size:.49rem !important;
  line-height:1 !important;
  white-space:nowrap !important;
  text-align:center !important;
}
html body.simulator-layout .scenario-command-actions #resetTest{
  width:96px !important;
  min-width:96px !important;
  max-width:96px !important;
}
html body.simulator-layout .embedded-stand-slot{
  grid-column:8 !important;
  grid-row:1 !important;
}
html body.simulator-layout .embedded-sim-clock-slot{
  grid-column:9 !important;
  grid-row:1 !important;
}
html body.simulator-layout .sim-clock-box span{
  font-size:.79rem !important;
  line-height:1 !important;
}
html body.simulator-layout .sim-clock-colon{
  font-size:.86rem !important;
}
@media (max-width:1320px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px 140px 60px 94px 88px 144px minmax(162px,.90fr) minmax(130px,.77fr) 140px !important;
    column-gap:5px !important;
  }
  html body.simulator-layout .scenario-command-actions #togglePause{
    width:76px !important;
    min-width:76px !important;
    max-width:76px !important;
  }
  html body.simulator-layout .scenario-command-actions #resetTest{
    width:90px !important;
    min-width:90px !important;
    max-width:90px !important;
  }
  html body.simulator-layout .sim-clock-box span{
    font-size:.75rem !important;
  }
  html body.simulator-layout .sim-clock-colon{
    font-size:.82rem !important;
  }
}
@media (max-width:1100px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px 130px 60px 96px 90px 142px 164px 143px !important;
    column-gap:5px !important;
  }
  html body.simulator-layout .embedded-ewt-slot{
    grid-column:1 / span 3 !important;
    grid-row:2 !important;
  }
  html body.simulator-layout .scenario-command-actions{
    grid-column:1 / span 3 !important;
    grid-row:2 !important;
  }
  html body.simulator-layout .embedded-stand-slot{
    grid-column:4 / span 3 !important;
    grid-row:2 !important;
  }
  html body.simulator-layout .embedded-sim-clock-slot{
    grid-column:7 !important;
    grid-row:2 !important;
  }
}

/* === SIMULATOR ONLY: SIM CLOCK WIDTH +30%, HEIGHT -10%, NUMBER SIZE -15% ===
   Requested change only:
   - Increase Sim Clock panel width by 30%.
   - Reduce Sim Clock panel height by 10%.
   - Reduce Sim Clock number text by 15%.
   - Simulator CSS/HTML only. No demo or logic changes. */
html body.simulator-layout .scenario-command-row{
  grid-template-columns:118px 150px 64px 104px 96px 154px minmax(172px,.92fr) minmax(147px,.875fr) 203px !important;
}
html body.simulator-layout .embedded-sim-clock-slot,
html body.simulator-layout .sim-clock-panel{
  width:203px !important;
  min-width:203px !important;
  max-width:203px !important;
}
html body.simulator-layout .sim-clock-panel{
  height:74px !important;
  min-height:74px !important;
  max-height:74px !important;
  padding:6px 10px !important;
}
html body.simulator-layout .sim-clock-display{
  justify-content:center !important;
}
html body.simulator-layout .sim-clock-box span{
  font-size:.67rem !important;
  line-height:1 !important;
}
html body.simulator-layout .sim-clock-colon{
  font-size:.73rem !important;
  line-height:1 !important;
}
@media (max-width:1320px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px 140px 60px 94px 88px 144px minmax(162px,.90fr) minmax(130px,.77fr) 182px !important;
  }
  html body.simulator-layout .embedded-sim-clock-slot,
  html body.simulator-layout .sim-clock-panel{
    width:182px !important;
    min-width:182px !important;
    max-width:182px !important;
  }
  html body.simulator-layout .sim-clock-panel{
    height:72px !important;
    min-height:72px !important;
    max-height:72px !important;
  }
  html body.simulator-layout .sim-clock-box span{
    font-size:.64rem !important;
  }
  html body.simulator-layout .sim-clock-colon{
    font-size:.70rem !important;
  }
}
@media (max-width:1100px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px 130px 60px 96px 90px 142px 164px 186px !important;
  }
  html body.simulator-layout .embedded-sim-clock-slot,
  html body.simulator-layout .sim-clock-panel{
    width:186px !important;
    min-width:186px !important;
    max-width:186px !important;
  }
}



/* Hide Skip Stop control from UI only — logic retained for existing sessions/cancel safety. */
#btnSkip,
#busCmdSkip,
option[value="SKIP"] {
  display: none !important;
  visibility: hidden !important;
}

/* Dublin GTFS dense movement dots on command maps: small dots only, labels remain on official points. */
.bus-map-waypoint-stop{
  fill:#0f766e !important;
  stroke:#ffffff !important;
  stroke-width:1px !important;
  opacity:.72 !important;
}



/* === AVL ROUTE CONTROL POINT SELECTORS (Timing + Curtailment) === */
html body .command-field-timing-points,
html body .command-field-curtail-points{
  min-width:0 !important;
  max-width:100% !important;
  position:relative !important;
  overflow:visible !important;
  z-index:1200 !important;
}
html body .avl-control-dd{
  position:relative !important;
  width:100% !important;
  min-width:0 !important;
}
html body .avl-control-summary{
  width:100% !important;
  height:32px !important;
  min-height:32px !important;
  border-radius:10px !important;
  border:1px solid rgba(125, 211, 252, .35) !important;
  background:linear-gradient(180deg, rgba(6, 31, 60, .95), rgba(3, 18, 36, .96)) !important;
  color:#eaffff !important;
  font-size:10px !important;
  font-weight:950 !important;
  letter-spacing:.02em !important;
  padding:0 8px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:6px !important;
  cursor:pointer !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08) !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
html body .avl-control-summary::after{
  content:'▾';
  color:#7cf7ff;
  font-size:10px;
  flex:0 0 auto;
}
html body .avl-control-dd.open .avl-control-summary::after{content:'▴';}
html body .avl-control-menu{
  display:none !important;
  position:absolute !important;
  top:calc(100% + 6px) !important;
  left:0 !important;
  width:min(360px, 86vw) !important;
  max-height:265px !important;
  overflow:auto !important;
  border:1px solid rgba(124,247,255,.42) !important;
  border-radius:14px !important;
  background:linear-gradient(180deg, rgba(3, 15, 31, .98), rgba(2, 9, 20, .99)) !important;
  color:#eaffff !important;
  box-shadow:0 18px 50px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.08) !important;
  padding:8px !important;
  z-index:2147480000 !important;
}
html body .avl-control-dd.open .avl-control-menu{display:block !important;}
html body .avl-control-tools{
  display:flex !important;
  gap:6px !important;
  margin:0 0 7px !important;
  position:sticky !important;
  top:0 !important;
  padding-bottom:6px !important;
  background:linear-gradient(180deg, rgba(3,15,31,.99), rgba(3,15,31,.92)) !important;
  z-index:1 !important;
}
html body .avl-control-tools button{
  flex:1 1 auto !important;
  border:1px solid rgba(124,247,255,.30) !important;
  border-radius:999px !important;
  background:rgba(124,247,255,.10) !important;
  color:#dffaff !important;
  font-size:10px !important;
  font-weight:950 !important;
  padding:6px 8px !important;
  cursor:pointer !important;
}
html body .avl-control-choice{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  min-height:28px !important;
  padding:6px 7px !important;
  border-radius:10px !important;
  color:#eaffff !important;
  font-size:11px !important;
  line-height:1.2 !important;
  cursor:pointer !important;
}
html body .avl-control-choice:hover{background:rgba(124,247,255,.10) !important;}
html body .avl-control-choice input{width:auto !important;min-width:14px !important;accent-color:#7cf7ff !important;}
html body .avl-control-choice small{display:block;color:#9fb4cb;font-size:9px;font-weight:800;margin-top:2px;}
html body .avl-control-summary.has-any.timing{border-color:rgba(255,209,26,.75) !important;color:#fff7c7 !important;}
html body .avl-control-summary.has-any.curtail{border-color:rgba(124,247,255,.70) !important;color:#dffaff !important;}

/* Selected control point styling on the AVL diagram */
.route-control-timing-point{fill:#ffd11a !important;stroke:#2b2100 !important;stroke-width:1.6px !important;filter:drop-shadow(0 0 5px rgba(255,209,26,.65)) !important;}
.route-control-curtail-point{fill:#78d6ff !important;stroke:#06354d !important;stroke-width:1.1px !important;opacity:.92 !important;}
.route-control-both-point{fill:#ffd11a !important;stroke:#78d6ff !important;stroke-width:2.1px !important;filter:drop-shadow(0 0 6px rgba(255,209,26,.70)) !important;}
.route-control-timing-label{fill:#fff1a6 !important;font-weight:1000 !important;font-size:11px !important;paint-order:stroke !important;stroke:rgba(0,0,0,.74) !important;stroke-width:2.6px !important;}
.route-control-curtail-label{fill:#9fe8ff !important;font-weight:750 !important;font-size:9.4px !important;opacity:.88 !important;paint-order:stroke !important;stroke:rgba(0,0,0,.70) !important;stroke-width:2.2px !important;}
.route-control-both-label{fill:#fff1a6 !important;font-weight:1000 !important;font-size:11px !important;paint-order:stroke !important;stroke:rgba(0,0,0,.78) !important;stroke-width:2.8px !important;}
.route-control-timing-connector{stroke:#ffd11a !important;stroke-width:2.2px !important;opacity:.95 !important;}
.route-control-curtail-connector{stroke:#78d6ff !important;stroke-width:1.4px !important;opacity:.62 !important;stroke-dasharray:4 4 !important;}
.route-control-both-connector{stroke:#ffd11a !important;stroke-width:2.2px !important;opacity:.98 !important;}

html body.simulator-layout .command-field-timing-points{
  grid-column:4 !important;
  grid-row:2 !important;
  width:104px !important;
  max-width:104px !important;
}
html body.simulator-layout .command-field-curtail-points{
  grid-column:5 !important;
  grid-row:2 !important;
  width:96px !important;
  max-width:96px !important;
}
@media (max-width:1320px){
  html body.simulator-layout .command-field-timing-points{width:94px !important;max-width:94px !important;}
  html body.simulator-layout .command-field-curtail-points{width:88px !important;max-width:88px !important;}
}
@media (max-width:1100px){
  html body.simulator-layout .command-field-timing-points{grid-column:4 !important;grid-row:3 !important;width:96px !important;max-width:96px !important;}
  html body.simulator-layout .command-field-curtail-points{grid-column:5 !important;grid-row:3 !important;width:96px !important;max-width:96px !important;}
}

/* === ROUTE CONTROL POINTS LAYOUT/DROPDOWN FIX ===
   Align Timing/Curtailment under Performance/City and keep menus visible.
   CSS-only layout fix; no simulator logic changed.
*/
html body.simulator-layout .card.scenario,
html body.simulator-layout .scenario-command-panel,
html body.simulator-layout .scenario-command-row{
  overflow:visible !important;
}
html body.simulator-layout,
html body.simulator-layout .page,
html body.simulator-layout .layout-top{
  overflow-x:hidden !important;
}
html body.simulator-layout .command-field-timing-points,
html body.simulator-layout .command-field-curtail-points{
  grid-row:1 !important;
  align-self:start !important;
  margin-top:45px !important;
  position:relative !important;
  z-index:2147480500 !important;
  overflow:visible !important;
}
html body.simulator-layout .command-field-timing-points{
  grid-column:4 !important;
  width:104px !important;
  max-width:104px !important;
}
html body.simulator-layout .command-field-curtail-points{
  grid-column:5 !important;
  width:96px !important;
  max-width:96px !important;
}
html body.simulator-layout .command-field-timing-points label,
html body.simulator-layout .command-field-curtail-points label{
  margin-bottom:2px !important;
  line-height:1.02 !important;
}
html body.simulator-layout .avl-control-dd{
  position:relative !important;
  overflow:visible !important;
  z-index:2147480501 !important;
}
html body.simulator-layout .avl-control-summary{
  height:28px !important;
  min-height:28px !important;
  border-radius:10px !important;
}
html body.simulator-layout .avl-control-menu{
  position:absolute !important;
  display:none !important;
  top:calc(100% + 5px) !important;
  left:0 !important;
  width:280px !important;
  min-width:280px !important;
  max-width:min(360px, calc(100vw - 28px)) !important;
  max-height:255px !important;
  overflow:auto !important;
  z-index:2147480600 !important;
  pointer-events:auto !important;
}
html body.simulator-layout .avl-control-dd.open .avl-control-menu{
  display:block !important;
}
@media (max-width:1320px){
  html body.simulator-layout .command-field-timing-points{width:94px !important;max-width:94px !important;}
  html body.simulator-layout .command-field-curtail-points{width:88px !important;max-width:88px !important;}
  html body.simulator-layout .avl-control-menu{width:260px !important;min-width:260px !important;}
}
@media (max-width:1100px){
  html body.simulator-layout .command-field-timing-points{grid-column:4 !important;grid-row:1 !important;margin-top:45px !important;width:96px !important;max-width:96px !important;}
  html body.simulator-layout .command-field-curtail-points{grid-column:5 !important;grid-row:1 !important;margin-top:45px !important;width:96px !important;max-width:96px !important;}
}


/* === ROUTE CONTROL POINTS FINAL TOP ALIGN + FLOATING MENU FIX ===
   T Points / C Points sit in the top control row and their menus float above all panels. */
html body.simulator-layout .scenario-command-panel,
html body.simulator-layout .scenario-command-row{
  overflow:visible !important;
}
html body.simulator-layout .scenario-command-row{
  grid-template-columns:118px 150px 64px 104px 96px 82px 82px 154px minmax(172px,.90fr) minmax(147px,.82fr) 203px !important;
  column-gap:5px !important;
}
html body.simulator-layout .command-field-timing-points,
html body.simulator-layout .command-field-curtail-points{
  grid-row:1 !important;
  align-self:start !important;
  margin-top:0 !important;
  z-index:2147482800 !important;
  overflow:visible !important;
}
html body.simulator-layout .command-field-timing-points{
  grid-column:6 !important;
  width:82px !important;
  max-width:82px !important;
}
html body.simulator-layout .command-field-curtail-points{
  grid-column:7 !important;
  width:82px !important;
  max-width:82px !important;
}
html body.simulator-layout .command-field-driver-change{
  grid-column:8 !important;
}
html body.simulator-layout .embedded-ewt-slot,
html body.simulator-layout .embedded-ewt-slot.demo-ewt-after-dispatcher{
  grid-column:9 !important;
}
html body.simulator-layout .embedded-stand-slot{
  grid-column:10 !important;
}
html body.simulator-layout .embedded-sim-clock-slot{
  grid-column:11 !important;
}
html body.simulator-layout .command-field-timing-points label,
html body.simulator-layout .command-field-curtail-points label{
  font-size:9px !important;
  letter-spacing:.08em !important;
  line-height:1 !important;
  margin-bottom:3px !important;
  white-space:nowrap !important;
}
html body.simulator-layout .command-field-timing-points label::first-letter,
html body.simulator-layout .command-field-curtail-points label::first-letter{
  color:#fff7a6 !important;
}
html body.simulator-layout .avl-control-summary{
  height:30px !important;
  min-height:30px !important;
  padding:0 7px !important;
  font-size:9.2px !important;
}
html body.simulator-layout .avl-control-menu{
  position:fixed !important;
  z-index:2147483000 !important;
  display:none !important;
  box-shadow:0 22px 70px rgba(0,0,0,.62), 0 0 0 1px rgba(124,247,255,.22), inset 0 1px 0 rgba(255,255,255,.10) !important;
}
html body.simulator-layout .avl-control-dd.open .avl-control-menu{
  display:block !important;
}
@media (max-width:1320px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px 130px 58px 88px 82px 72px 72px 120px minmax(150px,.85fr) minmax(120px,.70fr) 160px !important;
    column-gap:4px !important;
  }
  html body.simulator-layout .command-field-timing-points{width:72px !important;max-width:72px !important;}
  html body.simulator-layout .command-field-curtail-points{width:72px !important;max-width:72px !important;}
  html body.simulator-layout .avl-control-summary{font-size:8.4px !important;padding:0 5px !important;}
}
@media (max-width:1100px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:110px 124px 56px 84px 78px 68px 68px 112px minmax(148px,.82fr) minmax(112px,.64fr) 150px !important;
  }
}

/* Keep Start/Reset attached under Live EWT after adding T/C point columns. */
html body.simulator-layout .scenario-command-actions{
  grid-column:9 !important;
  grid-row:1 !important;
}
@media (max-width:1320px){
  html body.simulator-layout .scenario-command-actions{grid-column:9 !important;grid-row:1 !important;}
}
@media (max-width:1100px){
  html body.simulator-layout .scenario-command-actions{grid-column:9 !important;grid-row:1 !important;}
}


/* === FINAL FIX: T/C POINTS TRUE TOP ROW + BODY-PORTAL FLOATING MENU + SELECTED NAMES === */
html body.simulator-layout .card.scenario,
html body.simulator-layout .scenario-command-panel,
html body.simulator-layout .scenario-command-row,
html body.simulator-layout .layout-top{
  overflow:visible !important;
}
html body.simulator-layout .scenario-command-row{
  display:grid !important;
  grid-template-columns:118px 150px 64px 104px 96px 82px 82px 154px minmax(260px,.95fr) minmax(255px,.88fr) 203px !important;
  grid-auto-rows:min-content !important;
  align-items:start !important;
  column-gap:6px !important;
  row-gap:5px !important;
}
html body.simulator-layout .occ-header-brand{grid-column:1 !important;grid-row:1 / span 2 !important;align-self:center !important;}
html body.simulator-layout .command-field-scenario{grid-column:2 !important;grid-row:1 !important;}
html body.simulator-layout .command-field-speed{grid-column:3 !important;grid-row:1 !important;}
html body.simulator-layout .command-field-performance{grid-column:4 !important;grid-row:1 !important;align-self:start !important;margin-top:0 !important;}
html body.simulator-layout .command-field-city{grid-column:5 !important;grid-row:1 !important;align-self:start !important;margin-top:0 !important;}
html body.simulator-layout .command-field-timing-points{grid-column:6 !important;grid-row:1 !important;width:82px !important;max-width:82px !important;align-self:start !important;margin-top:0 !important;}
html body.simulator-layout .command-field-curtail-points{grid-column:7 !important;grid-row:1 !important;width:82px !important;max-width:82px !important;align-self:start !important;margin-top:0 !important;}
html body.simulator-layout .command-field-driver-change{grid-column:8 !important;grid-row:1 !important;align-self:start !important;margin-top:0 !important;}
html body.simulator-layout .embedded-ewt-slot,
html body.simulator-layout .embedded-ewt-slot.demo-ewt-after-dispatcher{grid-column:9 !important;grid-row:1 !important;align-self:start !important;margin-top:0 !important;}
html body.simulator-layout .scenario-command-actions{grid-column:9 !important;grid-row:1 !important;align-self:end !important;justify-self:center !important;}
html body.simulator-layout .embedded-stand-slot{grid-column:10 !important;grid-row:1 !important;align-self:start !important;}
html body.simulator-layout .embedded-sim-clock-slot{grid-column:11 !important;grid-row:1 !important;align-self:start !important;}
html body.simulator-layout .command-field-timing-points label,
html body.simulator-layout .command-field-curtail-points label{
  font-size:9px !important;
  line-height:1 !important;
  letter-spacing:.08em !important;
  white-space:nowrap !important;
  margin:0 0 3px !important;
}
html body.simulator-layout .command-field-timing-points .avl-control-summary,
html body.simulator-layout .command-field-curtail-points .avl-control-summary{
  height:30px !important;
  min-height:30px !important;
  padding:0 7px !important;
  font-size:8.7px !important;
  width:100% !important;
}
html body.simulator-layout .avl-control-menu{display:none !important;}
html body.simulator-layout .avl-control-menu.avl-floating-control-menu{
  position:fixed !important;
  display:none !important;
  border:1px solid rgba(124,247,255,.58) !important;
  border-radius:14px !important;
  background:linear-gradient(180deg, rgba(3,15,31,.99), rgba(2,9,20,.99)) !important;
  box-shadow:0 26px 80px rgba(0,0,0,.72), 0 0 0 1px rgba(124,247,255,.20), inset 0 1px 0 rgba(255,255,255,.10) !important;
  padding:8px !important;
  z-index:2147483647 !important;
  pointer-events:auto !important;
  isolation:isolate !important;
}
html body.simulator-layout .avl-control-menu.avl-floating-control-menu.avl-floating-open{display:block !important;visibility:visible !important;opacity:1 !important;}
html body.simulator-layout #simSvg .route-waypoint-label.route-control-timing-label,
html body.simulator-layout #simSvg .route-waypoint-label.route-control-curtail-label,
html body.simulator-layout #simSvg .route-waypoint-label.route-control-both-label,
html body.simulator-layout #simSvg .route-waypoint-label-crisp.route-control-timing-label,
html body.simulator-layout #simSvg .route-waypoint-label-crisp.route-control-curtail-label,
html body.simulator-layout #simSvg .route-waypoint-label-crisp.route-control-both-label,
html body.simulator-layout svg .route-waypoint-label.route-control-timing-label,
html body.simulator-layout svg .route-waypoint-label.route-control-curtail-label,
html body.simulator-layout svg .route-waypoint-label.route-control-both-label,
html body.simulator-layout svg .route-waypoint-label-crisp.route-control-timing-label,
html body.simulator-layout svg .route-waypoint-label-crisp.route-control-curtail-label,
html body.simulator-layout svg .route-waypoint-label-crisp.route-control-both-label{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  font-size:10.8px !important;
  stroke-width:3.8px !important;
}
@media (max-width:1320px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px 132px 60px 94px 88px 72px 72px 132px minmax(220px,.88fr) minmax(215px,.78fr) 182px !important;
    column-gap:5px !important;
  }
  html body.simulator-layout .command-field-timing-points{width:72px !important;max-width:72px !important;}
  html body.simulator-layout .command-field-curtail-points{width:72px !important;max-width:72px !important;}
  html body.simulator-layout .command-field-timing-points .avl-control-summary,
  html body.simulator-layout .command-field-curtail-points .avl-control-summary{font-size:8px !important;padding:0 5px !important;}
}
@media (max-width:1100px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:110px 124px 56px 86px 78px 68px 68px 120px minmax(200px,.84fr) minmax(180px,.70fr) 170px !important;
    column-gap:4px !important;
  }
}


/* =========================================================
   FINAL ROUTE CONTROL POINT PLACEMENT FIX
   T Points sits directly under Performance.
   C Points sits directly under City Pack.
   Menus are body-portalled/fixed and always float over AVL/tables.
   ========================================================= */
html body.simulator-layout .scenario-command-panel,
html body.simulator-layout .scenario-command-row,
html body.simulator-layout .card.scenario,
html body.simulator-layout .layout-top{
  overflow:visible !important;
}
html body.simulator-layout .command-field-performance,
html body.simulator-layout .command-field-city{
  overflow:visible !important;
  position:relative !important;
  align-self:start !important;
}
html body.simulator-layout .command-field-performance > .route-control-field,
html body.simulator-layout .command-field-city > .route-control-field,
html body.simulator-layout .command-field-performance > .command-field-timing-points,
html body.simulator-layout .command-field-city > .command-field-curtail-points{
  display:flex !important;
  flex-direction:column !important;
  gap:3px !important;
  position:relative !important;
  grid-column:auto !important;
  grid-row:auto !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  margin:6px 0 0 0 !important;
  padding:0 !important;
  z-index:2147482200 !important;
  overflow:visible !important;
}
html body.simulator-layout .command-field-performance > .route-control-field label,
html body.simulator-layout .command-field-city > .route-control-field label{
  font-size:9px !important;
  line-height:1 !important;
  letter-spacing:.08em !important;
  margin:0 !important;
  color:#dbeafe !important;
  white-space:nowrap !important;
}
html body.simulator-layout .command-field-performance > .route-control-field .avl-control-summary,
html body.simulator-layout .command-field-city > .route-control-field .avl-control-summary{
  width:100% !important;
  height:28px !important;
  min-height:28px !important;
  max-height:28px !important;
  padding:0 8px !important;
  border-radius:10px !important;
  font-size:8.6px !important;
  line-height:1 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
html body.simulator-layout .command-field-performance > .route-control-field .avl-control-menu,
html body.simulator-layout .command-field-city > .route-control-field .avl-control-menu,
html body.simulator-layout .avl-control-menu{
  display:none !important;
}
html body.simulator-layout .avl-control-menu.avl-floating-control-menu,
body > .avl-control-menu.avl-floating-control-menu{
  position:fixed !important;
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  z-index:2147483647 !important;
  pointer-events:auto !important;
  border:1px solid rgba(124,247,255,.75) !important;
  border-radius:14px !important;
  background:linear-gradient(180deg, rgba(3,15,31,.99), rgba(1,7,18,.99)) !important;
  color:#fff !important;
  box-shadow:0 28px 86px rgba(0,0,0,.78), 0 0 0 1px rgba(124,247,255,.28), inset 0 1px 0 rgba(255,255,255,.12) !important;
  padding:8px !important;
  isolation:isolate !important;
}
html body.simulator-layout .avl-control-menu.avl-floating-control-menu.avl-floating-open,
body > .avl-control-menu.avl-floating-control-menu.avl-floating-open{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
}
body > .avl-control-menu .avl-control-choice,
html body.simulator-layout .avl-control-menu .avl-control-choice{
  display:flex !important;
  align-items:flex-start !important;
  gap:8px !important;
  padding:7px 8px !important;
  border-radius:9px !important;
  cursor:pointer !important;
  color:#eaf7ff !important;
}
body > .avl-control-menu .avl-control-choice:hover,
html body.simulator-layout .avl-control-menu .avl-control-choice:hover{
  background:rgba(59,130,246,.18) !important;
}
body > .avl-control-menu .avl-control-choice small,
html body.simulator-layout .avl-control-menu .avl-control-choice small{
  display:block !important;
  color:#82d8ff !important;
  font-size:10px !important;
  margin-top:2px !important;
}
body > .avl-control-menu .avl-control-tools,
html body.simulator-layout .avl-control-menu .avl-control-tools{
  display:flex !important;
  gap:6px !important;
  margin-bottom:6px !important;
  position:sticky !important;
  top:0 !important;
  background:rgba(3,15,31,.96) !important;
  padding-bottom:6px !important;
  z-index:2 !important;
}
body > .avl-control-menu .avl-control-tools button,
html body.simulator-layout .avl-control-menu .avl-control-tools button{
  border:1px solid rgba(124,247,255,.45) !important;
  border-radius:9px !important;
  background:rgba(30,64,175,.55) !important;
  color:#fff !important;
  font-weight:900 !important;
  padding:6px 10px !important;
}


/* === FINAL FIX: T/C POINTS NATIVE DROPDOWNS UNDER PERFORMANCE + CITY PACK === */
html body.simulator-layout .command-field-performance,
html body.simulator-layout .command-field-city{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  gap:4px !important;
  overflow:visible !important;
  position:relative !important;
}
html body.simulator-layout #timingPointsField,
html body.simulator-layout #curtailmentPointsField,
html body.simulator-layout .command-field-timing-points,
html body.simulator-layout .command-field-curtail-points{
  order:2 !important;
  display:flex !important;
  flex-direction:column !important;
  gap:3px !important;
  position:static !important;
  transform:none !important;
  left:auto !important;
  right:auto !important;
  top:auto !important;
  bottom:auto !important;
  grid-column:auto !important;
  grid-row:auto !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  margin:3px 0 0 0 !important;
  padding:0 !important;
  overflow:visible !important;
  z-index:auto !important;
}
html body.simulator-layout #timingPointsField label,
html body.simulator-layout #curtailmentPointsField label{
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  font-size:9px !important;
  line-height:1 !important;
  font-weight:900 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  color:#eaf7ff !important;
  white-space:nowrap !important;
}
html body.simulator-layout select.route-control-native-select,
html body.simulator-layout #timingPointsSummary.route-control-native-select,
html body.simulator-layout #curtailmentPointsSummary.route-control-native-select{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  height:28px !important;
  min-height:28px !important;
  max-height:28px !important;
  padding:0 24px 0 9px !important;
  border-radius:10px !important;
  border:1.5px solid rgba(124,247,255,.75) !important;
  background:#06233d !important;
  color:#fff9bf !important;
  font-family:inherit !important;
  font-size:9.2px !important;
  font-weight:1000 !important;
  letter-spacing:.02em !important;
  line-height:1 !important;
  text-transform:uppercase !important;
  outline:none !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 0 0 1px rgba(0,0,0,.18) !important;
  cursor:pointer !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  appearance:auto !important;
}
html body.simulator-layout #timingPointsSummary.route-control-native-select{
  border-color:#ffe45c !important;
  box-shadow:0 0 0 1px rgba(255,228,92,.35), inset 0 1px 0 rgba(255,255,255,.10) !important;
}
html body.simulator-layout #curtailmentPointsSummary.route-control-native-select{
  border-color:#7cf7ff !important;
  color:#dffcff !important;
}
html body.simulator-layout select.route-control-native-select option{
  background:#06233d !important;
  color:#ffffff !important;
  font-weight:800 !important;
  text-transform:none !important;
}
html body.simulator-layout select.route-control-native-select option.route-control-option-summary{
  color:#fff3a6 !important;
  font-weight:1000 !important;
}
html body.simulator-layout select.route-control-native-select option.route-control-option-tool{
  color:#7cf7ff !important;
  font-weight:1000 !important;
}
html body.simulator-layout .avl-control-menu,
html body.simulator-layout .avl-floating-control-menu,
body > .avl-floating-control-menu,
body > .avl-control-menu{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}


/* === FINAL FIX: Directional T/C points menu + compact driver-change width === */
html body.simulator-layout .command-field-driver-change,
html body.demo-layout .command-field-driver-change{
  width:92px !important;
  max-width:92px !important;
  min-width:86px !important;
}
html body.simulator-layout .command-field-driver-change #driverChangePointSelect,
html body.demo-layout .command-field-driver-change #driverChangePointSelect{
  width:92px !important;
  max-width:92px !important;
  min-width:86px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
html body.simulator-layout .command-field-performance,
html body.simulator-layout .command-field-city,
html body.demo-layout .command-field-performance,
html body.demo-layout .command-field-city{
  overflow:visible !important;
}
html body.simulator-layout .route-control-field,
html body.demo-layout .route-control-field{
  margin-top:6px !important;
  width:108px !important;
  max-width:108px !important;
  min-width:104px !important;
  overflow:visible !important;
  position:relative !important;
  z-index:50 !important;
}
html body.simulator-layout .route-control-field label,
html body.demo-layout .route-control-field label{
  font-size:10px !important;
  line-height:1 !important;
  letter-spacing:.08em !important;
}
html body.simulator-layout .route-control-field .avl-control-summary,
html body.demo-layout .route-control-field .avl-control-summary{
  width:108px !important;
  height:31px !important;
  max-width:108px !important;
  border-radius:10px !important;
  background:#071a2e !important;
  color:#fff7bf !important;
  border:1.5px solid rgba(78,235,255,.9) !important;
  box-shadow:0 0 0 1px rgba(0,0,0,.25), 0 0 14px rgba(78,235,255,.18) !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  cursor:pointer !important;
  padding:0 10px !important;
  text-align:left !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
html body.simulator-layout #timingPointsSummary,
html body.demo-layout #timingPointsSummary{ border-color:#ffe24a !important; }
.avl-route-control-panel{
  position:fixed !important;
  z-index:2147483647 !important;
  background:linear-gradient(180deg,#06182d,#0a2745) !important;
  color:#f3fbff !important;
  border:1.5px solid rgba(74,231,255,.96) !important;
  box-shadow:0 24px 70px rgba(0,0,0,.55),0 0 0 2px rgba(255,255,255,.05) inset !important;
  border-radius:16px !important;
  overflow:hidden !important;
  font-family:inherit !important;
}
.avl-route-control-panel.timing{ border-color:#ffdf3d !important; }
.avl-rc-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;background:rgba(255,255,255,.08);font-weight:900;text-transform:uppercase;letter-spacing:.06em;}
.avl-rc-x{width:28px;height:28px;border-radius:999px;border:1px solid rgba(255,255,255,.4);background:rgba(255,255,255,.10);color:#fff;font-size:20px;line-height:1;cursor:pointer;}
.avl-rc-help{font-size:12px;opacity:.86;padding:10px 14px;border-bottom:1px solid rgba(255,255,255,.09);}
.avl-rc-actions{display:flex;gap:8px;padding:10px 14px;border-bottom:1px solid rgba(255,255,255,.08);}
.avl-rc-actions button,.avl-rc-save{border:1px solid rgba(73,220,255,.75);background:rgba(73,220,255,.10);color:#eaffff;border-radius:999px;padding:8px 14px;font-weight:900;text-transform:uppercase;cursor:pointer;}
.avl-rc-list{max-height:calc(100vh - 280px);overflow:auto;padding:8px 10px;}
.avl-rc-row{display:grid;grid-template-columns:minmax(0,1fr) 62px 54px;align-items:center;gap:8px;padding:7px 6px;border-radius:10px;border-bottom:1px solid rgba(255,255,255,.04);}
.avl-rc-row:hover{background:rgba(255,255,255,.07);}
.avl-rc-main{display:flex;align-items:center;gap:8px;min-width:0;font-size:13px;font-weight:800;}
.avl-rc-main span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.avl-rc-main small{font-size:9px;opacity:.55;text-transform:uppercase;margin-left:auto;}
.avl-rc-dir{font-size:12px;font-weight:900;display:flex;align-items:center;gap:4px;color:#bff5ff;}
.avl-rc-row input{accent-color:#22d3ee;}
.avl-rc-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;background:rgba(255,255,255,.08);}
.avl-rc-status{font-size:12px;opacity:.85;}
.avl-rc-save{background:linear-gradient(135deg,#18d27b,#20b9ff) !important;color:#001728 !important;border:0 !important;min-width:98px;}


/* === FINAL VISIBLE ROUTE CONTROL PANEL + 50% DRIVER CHANGE WIDTH === */
html body.simulator-layout .command-field-driver-change,
html body.demo-layout .command-field-driver-change{
  width:72px !important;
  min-width:72px !important;
  max-width:72px !important;
  flex:0 0 72px !important;
}
html body.simulator-layout .command-field-driver-change #driverChangePointSelect,
html body.demo-layout .command-field-driver-change #driverChangePointSelect{
  width:72px !important;
  min-width:72px !important;
  max-width:72px !important;
  padding-left:7px !important;
  padding-right:16px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
html body.simulator-layout .route-control-field,
html body.demo-layout .route-control-field{
  overflow:visible !important;
  position:relative !important;
  z-index:70 !important;
}
html body.simulator-layout .command-field-performance > .route-control-field,
html body.demo-layout .command-field-performance > .route-control-field,
html body.simulator-layout .command-field-city > .route-control-field,
html body.demo-layout .command-field-city > .route-control-field{
  margin-top:5px !important;
  width:108px !important;
  min-width:108px !important;
  max-width:108px !important;
}
html body.simulator-layout .route-control-field .avl-control-summary,
html body.demo-layout .route-control-field .avl-control-summary{
  width:108px !important;
  min-width:108px !important;
  max-width:108px !important;
  height:30px !important;
  display:block !important;
  cursor:pointer !important;
}
.avl-route-control-panel.avl-route-control-final-visible{
  position:fixed !important;
  z-index:2147483647 !important;
  display:flex !important;
  flex-direction:column !important;
  background:linear-gradient(180deg,#061b32,#082844 60%,#071b30) !important;
  color:#f4fbff !important;
  border:2px solid rgba(70,232,255,.98) !important;
  box-shadow:0 28px 85px rgba(0,0,0,.62), 0 0 0 2px rgba(255,255,255,.05) inset !important;
  border-radius:16px !important;
  overflow:hidden !important;
  font-family:inherit !important;
}
.avl-route-control-panel.avl-route-control-final-visible.timing{border-color:#ffe24a !important;}
.avl-route-control-final-visible .avl-rc-head{
  position:sticky !important; top:0 !important; z-index:3 !important;
  display:flex !important; align-items:center !important; justify-content:space-between !important;
  padding:12px 14px !important; background:rgba(255,255,255,.10) !important;
  border-bottom:1px solid rgba(255,255,255,.13) !important;
}
.avl-route-control-final-visible .avl-rc-head b{font-weight:1000 !important;letter-spacing:.06em !important;text-transform:uppercase !important;}
.avl-route-control-final-visible .avl-rc-head-actions{display:flex !important;align-items:center !important;gap:8px !important;}
.avl-route-control-final-visible .avl-rc-help{font-size:12px !important;line-height:1.35 !important;opacity:.9 !important;padding:10px 14px !important;border-bottom:1px solid rgba(255,255,255,.10) !important;}
.avl-route-control-final-visible .avl-rc-actions{display:flex !important;align-items:center !important;gap:8px !important;padding:10px 14px !important;border-bottom:1px solid rgba(255,255,255,.08) !important;}
.avl-route-control-final-visible .avl-rc-actions button,
.avl-route-control-final-visible .avl-rc-save,
.avl-route-control-final-visible .avl-rc-x{
  border:1px solid rgba(74,232,255,.75) !important;
  background:rgba(74,232,255,.12) !important;
  color:#efffff !important;
  border-radius:999px !important;
  font-weight:1000 !important;
  text-transform:uppercase !important;
  cursor:pointer !important;
}
.avl-route-control-final-visible .avl-rc-actions button{padding:7px 12px !important;}
.avl-route-control-final-visible .avl-rc-search{margin-left:auto !important;min-width:150px !important;border-radius:999px !important;border:1px solid rgba(255,255,255,.25) !important;background:rgba(255,255,255,.08) !important;color:#fff !important;padding:7px 10px !important;font-weight:800 !important;}
.avl-route-control-final-visible .avl-rc-list{flex:1 1 auto !important;min-height:170px !important;overflow:auto !important;padding:8px 10px !important;}
.avl-route-control-final-visible .avl-rc-row{display:grid !important;grid-template-columns:minmax(0,1fr) 65px 55px !important;align-items:center !important;gap:8px !important;padding:7px 6px !important;border-radius:10px !important;border-bottom:1px solid rgba(255,255,255,.05) !important;}
.avl-route-control-final-visible .avl-rc-row:hover{background:rgba(255,255,255,.08) !important;}
.avl-route-control-final-visible .avl-rc-main{display:flex !important;align-items:center !important;gap:8px !important;min-width:0 !important;font-size:13px !important;font-weight:850 !important;}
.avl-route-control-final-visible .avl-rc-main span{overflow:hidden !important;text-overflow:ellipsis !important;white-space:nowrap !important;}
.avl-route-control-final-visible .avl-rc-main small{font-size:9px !important;opacity:.58 !important;text-transform:uppercase !important;margin-left:auto !important;}
.avl-route-control-final-visible .avl-rc-dir{display:flex !important;align-items:center !important;gap:4px !important;font-size:12px !important;font-weight:1000 !important;color:#c6f7ff !important;}
.avl-route-control-final-visible input{accent-color:#20d3ee !important;}
.avl-route-control-final-visible .avl-rc-foot{
  position:sticky !important; bottom:0 !important; z-index:3 !important;
  display:flex !important;align-items:center !important;justify-content:space-between !important;gap:12px !important;
  padding:12px 14px !important;background:rgba(255,255,255,.12) !important;border-top:1px solid rgba(255,255,255,.14) !important;
}
.avl-route-control-final-visible .avl-rc-status{font-size:11px !important;opacity:.88 !important;}
.avl-route-control-final-visible .avl-rc-save{padding:8px 18px !important;background:linear-gradient(135deg,#18d27b,#20b9ff) !important;color:#001728 !important;border:0 !important;min-width:86px !important;}
.avl-route-control-final-visible .avl-rc-x{width:30px !important;height:30px !important;font-size:20px !important;line-height:1 !important;background:rgba(255,255,255,.10) !important;}


/* === OTF FINAL FIX: T/C POINTS REOPEN + DRIVER CHANGE TRUE 50% WIDTH === */
html body.simulator-layout .command-field-driver-change,
html body.demo-layout .command-field-driver-change{
  width:72px !important;
  min-width:72px !important;
  max-width:72px !important;
  flex:0 0 72px !important;
  grid-column:auto !important;
}
html body.simulator-layout .command-field-driver-change #driverChangePointSelect,
html body.demo-layout .command-field-driver-change #driverChangePointSelect{
  width:72px !important;
  min-width:72px !important;
  max-width:72px !important;
  padding-left:7px !important;
  padding-right:16px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
html body.simulator-layout .command-field-performance,
html body.demo-layout .command-field-performance,
html body.simulator-layout .command-field-city,
html body.demo-layout .command-field-city{
  overflow:visible !important;
}
html body.simulator-layout #timingPointsField,
html body.demo-layout #timingPointsField,
html body.simulator-layout #curtailmentPointsField,
html body.demo-layout #curtailmentPointsField{
  position:relative !important;
  display:block !important;
  margin-top:6px !important;
  width:108px !important;
  min-width:108px !important;
  max-width:108px !important;
  z-index:120 !important;
  overflow:visible !important;
}
html body.simulator-layout #timingPointsField label,
html body.demo-layout #timingPointsField label,
html body.simulator-layout #curtailmentPointsField label,
html body.demo-layout #curtailmentPointsField label{
  display:block !important;
  font-size:10px !important;
  line-height:1 !important;
  letter-spacing:.08em !important;
  margin-bottom:4px !important;
  text-transform:uppercase !important;
}
html body.simulator-layout #timingPointsSummary,
html body.demo-layout #timingPointsSummary,
html body.simulator-layout #curtailmentPointsSummary,
html body.demo-layout #curtailmentPointsSummary{
  display:block !important;
  width:108px !important;
  min-width:108px !important;
  max-width:108px !important;
  height:30px !important;
  border-radius:10px !important;
  background:#071a2e !important;
  color:#fff7bf !important;
  font-weight:1000 !important;
  text-transform:uppercase !important;
  text-align:left !important;
  cursor:pointer !important;
  padding:0 18px 0 10px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
html body.simulator-layout #timingPointsSummary,
html body.demo-layout #timingPointsSummary{border:2px solid #ffe24a !important;}
html body.simulator-layout #curtailmentPointsSummary,
html body.demo-layout #curtailmentPointsSummary{border:2px solid #4eeaff !important;}
.avl-route-control-panel.otf-route-control-reopen-fixed{
  position:fixed !important;
  z-index:2147483647 !important;
  display:flex !important;
  flex-direction:column !important;
  background:linear-gradient(180deg,#061b32,#082844 62%,#071b30) !important;
  color:#f4fbff !important;
  border:2px solid rgba(70,232,255,.98) !important;
  box-shadow:0 28px 85px rgba(0,0,0,.62),0 0 0 2px rgba(255,255,255,.05) inset !important;
  border-radius:16px !important;
  overflow:hidden !important;
  font-family:inherit !important;
  pointer-events:auto !important;
}
.avl-route-control-panel.otf-route-control-reopen-fixed.timing{border-color:#ffe24a !important;}
.otf-route-control-reopen-fixed .avl-rc-head{position:sticky!important;top:0!important;z-index:3!important;display:flex!important;align-items:center!important;justify-content:space-between!important;padding:12px 14px!important;background:rgba(255,255,255,.10)!important;border-bottom:1px solid rgba(255,255,255,.13)!important;}
.otf-route-control-reopen-fixed .avl-rc-head b{font-weight:1000!important;letter-spacing:.06em!important;text-transform:uppercase!important;}
.otf-route-control-reopen-fixed .avl-rc-head-actions{display:flex!important;align-items:center!important;gap:8px!important;}
.otf-route-control-reopen-fixed .avl-rc-help{font-size:12px!important;line-height:1.35!important;opacity:.9!important;padding:10px 14px!important;border-bottom:1px solid rgba(255,255,255,.10)!important;}
.otf-route-control-reopen-fixed .avl-rc-actions{display:flex!important;align-items:center!important;gap:8px!important;padding:10px 14px!important;border-bottom:1px solid rgba(255,255,255,.08)!important;}
.otf-route-control-reopen-fixed .avl-rc-actions button,
.otf-route-control-reopen-fixed .avl-rc-save,
.otf-route-control-reopen-fixed .avl-rc-x{border:1px solid rgba(74,232,255,.75)!important;background:rgba(74,232,255,.12)!important;color:#efffff!important;border-radius:999px!important;font-weight:1000!important;text-transform:uppercase!important;cursor:pointer!important;}
.otf-route-control-reopen-fixed .avl-rc-actions button{padding:7px 12px!important;}
.otf-route-control-reopen-fixed .avl-rc-search{margin-left:auto!important;min-width:150px!important;border-radius:999px!important;border:1px solid rgba(255,255,255,.25)!important;background:rgba(255,255,255,.08)!important;color:#fff!important;padding:7px 10px!important;font-weight:800!important;}
.otf-route-control-reopen-fixed .avl-rc-list{flex:1 1 auto!important;min-height:170px!important;overflow:auto!important;padding:8px 10px!important;}
.otf-route-control-reopen-fixed .avl-rc-row{display:grid!important;grid-template-columns:minmax(0,1fr) 65px 55px!important;align-items:center!important;gap:8px!important;padding:7px 6px!important;border-radius:10px!important;border-bottom:1px solid rgba(255,255,255,.05)!important;}
.otf-route-control-reopen-fixed .avl-rc-row:hover{background:rgba(255,255,255,.08)!important;}
.otf-route-control-reopen-fixed .avl-rc-main{display:flex!important;align-items:center!important;gap:8px!important;min-width:0!important;font-size:13px!important;font-weight:850!important;}
.otf-route-control-reopen-fixed .avl-rc-main span{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;}
.otf-route-control-reopen-fixed .avl-rc-main small{font-size:9px!important;opacity:.58!important;text-transform:uppercase!important;margin-left:auto!important;}
.otf-route-control-reopen-fixed .avl-rc-dir{display:flex!important;align-items:center!important;gap:4px!important;font-size:12px!important;font-weight:1000!important;color:#c6f7ff!important;}
.otf-route-control-reopen-fixed input{accent-color:#20d3ee!important;}
.otf-route-control-reopen-fixed .avl-rc-foot{position:sticky!important;bottom:0!important;z-index:3!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;padding:12px 14px!important;background:rgba(255,255,255,.12)!important;border-top:1px solid rgba(255,255,255,.14)!important;}
.otf-route-control-reopen-fixed .avl-rc-status{font-size:11px!important;opacity:.88!important;}
.otf-route-control-reopen-fixed .avl-rc-save{padding:8px 18px!important;background:linear-gradient(135deg,#18d27b,#20b9ff)!important;color:#001728!important;border:0!important;min-width:86px!important;}
.otf-route-control-reopen-fixed .avl-rc-x{width:30px!important;height:30px!important;font-size:20px!important;line-height:1!important;background:rgba(255,255,255,.10)!important;}


/* === OTF FINAL HEADER GAP FIX: DR CH + LIVE EWT DIRECTLY NEXT TO IT ===
   Simulator mode only. Keeps T Points under Performance and C Points under City Pack.
   No bus logic, route-control logic, EWT calculations, maps, Supabase or demo layout changed. */
html body.simulator-layout .scenario-command-row{
  display:grid !important;
  grid-template-columns:118px 150px 64px 104px 96px 72px 320px 370px 198px !important;
  column-gap:6px !important;
  row-gap:5px !important;
  align-items:start !important;
  overflow:visible !important;
}
html body.simulator-layout .occ-header-brand{grid-column:1 !important;grid-row:1 / span 2 !important;align-self:center !important;}
html body.simulator-layout .command-field-scenario{grid-column:2 !important;grid-row:1 !important;}
html body.simulator-layout .command-field-speed{grid-column:3 !important;grid-row:1 !important;}
html body.simulator-layout .command-field-performance{grid-column:4 !important;grid-row:1 !important;}
html body.simulator-layout .command-field-city{grid-column:5 !important;grid-row:1 !important;}
html body.simulator-layout .command-field-driver-change{
  grid-column:6 !important;
  grid-row:1 !important;
  width:72px !important;
  min-width:72px !important;
  max-width:72px !important;
  flex:0 0 72px !important;
  margin:0 !important;
  align-self:start !important;
}
html body.simulator-layout .command-field-driver-change label{
  white-space:nowrap !important;
  text-align:left !important;
  letter-spacing:.08em !important;
}
html body.simulator-layout .command-field-driver-change #driverChangePointSelect{
  width:72px !important;
  min-width:72px !important;
  max-width:72px !important;
  padding-left:7px !important;
  padding-right:16px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
html body.simulator-layout .embedded-ewt-slot,
html body.simulator-layout .embedded-ewt-slot.demo-ewt-after-dispatcher{
  grid-column:7 !important;
  grid-row:1 !important;
  justify-self:start !important;
  align-self:start !important;
  margin:0 !important;
  width:320px !important;
  min-width:320px !important;
  max-width:320px !important;
  flex:0 0 320px !important;
}
html body.simulator-layout .scenario-command-actions{
  grid-column:7 !important;
  grid-row:1 !important;
  justify-self:center !important;
  align-self:end !important;
  margin:0 0 -39px 0 !important;
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
}
html body.simulator-layout .embedded-stand-slot{
  grid-column:8 !important;
  grid-row:1 !important;
  justify-self:start !important;
  align-self:start !important;
  width:370px !important;
  min-width:370px !important;
  max-width:370px !important;
}
html body.simulator-layout .embedded-sim-clock-slot{
  grid-column:9 !important;
  grid-row:1 !important;
  justify-self:start !important;
  align-self:start !important;
  width:198px !important;
  min-width:198px !important;
  max-width:198px !important;
}
html body.simulator-layout #timingPointsField,
html body.simulator-layout #curtailmentPointsField{
  grid-column:auto !important;
  grid-row:auto !important;
  position:relative !important;
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  margin-top:6px !important;
}
@media (max-width:1600px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px 132px 60px 94px 88px 72px minmax(250px,.95fr) minmax(250px,.88fr) 190px !important;
    column-gap:6px !important;
  }
  html body.simulator-layout .embedded-ewt-slot,
  html body.simulator-layout .embedded-ewt-slot.demo-ewt-after-dispatcher{
    width:auto !important;
    min-width:250px !important;
    max-width:none !important;
  }
  html body.simulator-layout .embedded-stand-slot{
    width:auto !important;
    min-width:250px !important;
    max-width:none !important;
  }
  html body.simulator-layout .embedded-sim-clock-slot{
    width:190px !important;
    min-width:190px !important;
    max-width:190px !important;
  }
}
@media (max-width:1280px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:104px 120px 56px 86px 82px 68px minmax(225px,.90fr) minmax(220px,.82fr) 170px !important;
    column-gap:5px !important;
  }
  html body.simulator-layout .command-field-driver-change,
  html body.simulator-layout .command-field-driver-change #driverChangePointSelect{
    width:68px !important;
    min-width:68px !important;
    max-width:68px !important;
  }
  html body.simulator-layout .embedded-ewt-slot,
  html body.simulator-layout .embedded-ewt-slot.demo-ewt-after-dispatcher{min-width:225px !important;}
  html body.simulator-layout .embedded-stand-slot{min-width:220px !important;}
  html body.simulator-layout .embedded-sim-clock-slot{width:170px !important;min-width:170px !important;max-width:170px !important;}
}


/* === OTF ABSOLUTE FINAL: SIMULATOR HEADER LEFT-ALIGNED ROW ===
   Cause fixed: older final inline/CSS grid blocks kept a dummy brand column before Scenario
   and forced Live EWT into a later grid column, so earlier EWT/DR CH moves did not win.
   This final block removes the dummy left grid column and starts the operational row at Scenario. */
html body.simulator-layout .scenario-command-panel{
  position:relative !important;
  overflow:visible !important;
  padding-left:10px !important;
  padding-right:10px !important;
}
html body.simulator-layout .scenario-command-row{
  display:grid !important;
  grid-template-columns:150px 64px 104px 104px 72px 320px 370px 198px !important;
  grid-auto-rows:min-content !important;
  column-gap:8px !important;
  row-gap:6px !important;
  align-items:start !important;
  justify-content:flex-start !important;
  justify-items:stretch !important;
  overflow:visible !important;
  width:100% !important;
  min-width:0 !important;
}
html body.simulator-layout .occ-header-brand{
  position:absolute !important;
  left:14px !important;
  top:82px !important;
  grid-column:auto !important;
  grid-row:auto !important;
  z-index:10060 !important;
  width:auto !important;
  max-width:none !important;
  align-self:auto !important;
  margin:0 !important;
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
}
html body.simulator-layout .occ-header-brand h2{display:none !important;}
html body.simulator-layout .command-field-scenario{
  grid-column:1 !important;
  grid-row:1 !important;
  width:150px !important;
  min-width:150px !important;
  max-width:150px !important;
  flex:0 0 150px !important;
  margin:0 !important;
}
html body.simulator-layout .command-field-scenario #scenarioSelect{
  width:150px !important;
  min-width:150px !important;
  max-width:150px !important;
  height:28px !important;
  min-height:28px !important;
  max-height:28px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
html body.simulator-layout .scenario-time-subrow{
  width:150px !important;
  max-width:150px !important;
}
html body.simulator-layout .command-field-speed{
  grid-column:2 !important;
  grid-row:1 !important;
  width:64px !important;
  min-width:64px !important;
  max-width:64px !important;
  margin:0 !important;
}
html body.simulator-layout .command-field-speed #speedSelect{
  width:64px !important;
  min-width:64px !important;
  max-width:64px !important;
}
html body.simulator-layout .command-field-performance{
  grid-column:3 !important;
  grid-row:1 !important;
  width:104px !important;
  min-width:104px !important;
  max-width:104px !important;
  margin:0 !important;
  overflow:visible !important;
  position:relative !important;
}
html body.simulator-layout .command-field-performance #performanceModeSelect{
  width:104px !important;
  min-width:104px !important;
  max-width:104px !important;
}
html body.simulator-layout .command-field-city{
  grid-column:4 !important;
  grid-row:1 !important;
  width:104px !important;
  min-width:104px !important;
  max-width:104px !important;
  margin:0 !important;
  overflow:visible !important;
  position:relative !important;
}
html body.simulator-layout .command-field-city #locationSelect,
html body.simulator-layout select#locationSelect{
  width:104px !important;
  min-width:104px !important;
  max-width:104px !important;
}
html body.simulator-layout .command-field-driver-change{
  grid-column:5 !important;
  grid-row:1 !important;
  width:72px !important;
  min-width:72px !important;
  max-width:72px !important;
  flex:0 0 72px !important;
  margin:0 !important;
}
html body.simulator-layout .command-field-driver-change #driverChangePointSelect{
  width:72px !important;
  min-width:72px !important;
  max-width:72px !important;
}
html body.simulator-layout .embedded-ewt-slot,
html body.simulator-layout .embedded-ewt-slot.demo-ewt-after-dispatcher{
  grid-column:6 !important;
  grid-row:1 !important;
  width:320px !important;
  min-width:320px !important;
  max-width:320px !important;
  justify-self:start !important;
  align-self:start !important;
  margin:0 !important;
  flex:0 0 320px !important;
}
html body.simulator-layout .embedded-ewt-slot #ewtStrip{
  width:100% !important;
  max-width:100% !important;
}
html body.simulator-layout .scenario-command-actions{
  grid-column:6 !important;
  grid-row:2 !important;
  justify-self:center !important;
  align-self:start !important;
  margin:0 !important;
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
}
html body.simulator-layout .embedded-stand-slot{
  grid-column:7 !important;
  grid-row:1 !important;
  width:370px !important;
  min-width:370px !important;
  max-width:370px !important;
  justify-self:start !important;
  align-self:start !important;
  margin:0 !important;
}
html body.simulator-layout .embedded-sim-clock-slot{
  grid-column:8 !important;
  grid-row:1 !important;
  width:198px !important;
  min-width:198px !important;
  max-width:198px !important;
  justify-self:start !important;
  align-self:start !important;
  margin:0 !important;
}
html body.simulator-layout #timingPointsField,
html body.simulator-layout #curtailmentPointsField{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  margin:5px 0 0 0 !important;
}
@media (max-width:1600px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:140px 60px 96px 96px 72px 300px 340px 190px !important;
    column-gap:6px !important;
  }
  html body.simulator-layout .command-field-scenario,
  html body.simulator-layout .command-field-scenario #scenarioSelect,
  html body.simulator-layout .scenario-time-subrow{width:140px !important;min-width:140px !important;max-width:140px !important;}
  html body.simulator-layout .command-field-performance,
  html body.simulator-layout .command-field-performance #performanceModeSelect,
  html body.simulator-layout .command-field-city,
  html body.simulator-layout .command-field-city #locationSelect{width:96px !important;min-width:96px !important;max-width:96px !important;}
  html body.simulator-layout .embedded-ewt-slot,
  html body.simulator-layout .embedded-ewt-slot.demo-ewt-after-dispatcher{width:300px !important;min-width:300px !important;max-width:300px !important;}
  html body.simulator-layout .embedded-stand-slot{width:340px !important;min-width:340px !important;max-width:340px !important;}
  html body.simulator-layout .embedded-sim-clock-slot{width:190px !important;min-width:190px !important;max-width:190px !important;}
}
@media (max-width:1280px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:132px 58px 92px 92px 72px 280px 310px 180px !important;
    column-gap:5px !important;
  }
  html body.simulator-layout .command-field-scenario,
  html body.simulator-layout .command-field-scenario #scenarioSelect,
  html body.simulator-layout .scenario-time-subrow{width:132px !important;min-width:132px !important;max-width:132px !important;}
  html body.simulator-layout .embedded-ewt-slot,
  html body.simulator-layout .embedded-ewt-slot.demo-ewt-after-dispatcher{width:280px !important;min-width:280px !important;max-width:280px !important;}
  html body.simulator-layout .embedded-stand-slot{width:310px !important;min-width:310px !important;max-width:310px !important;}
  html body.simulator-layout .embedded-sim-clock-slot{width:180px !important;min-width:180px !important;max-width:180px !important;}
}

/* === OTF FINAL WIDTH FIX: CITY PACK -15%, T/C POINTS -25% ===
   Scope: simulator mode only. Keeps existing header placement and logic unchanged. */
html body.simulator-layout .scenario-command-row{
  grid-template-columns:150px 64px 104px 88px 72px 320px 370px 198px !important;
}
html body.simulator-layout .command-field-city{
  width:88px !important;
  min-width:88px !important;
  max-width:88px !important;
}
html body.simulator-layout .command-field-city #locationSelect,
html body.simulator-layout select#locationSelect{
  width:88px !important;
  min-width:88px !important;
  max-width:88px !important;
}
html body.simulator-layout #timingPointsField,
html body.simulator-layout #curtailmentPointsField,
html body.simulator-layout .route-control-field{
  width:78px !important;
  min-width:78px !important;
  max-width:78px !important;
}
html body.simulator-layout #timingPointsField .avl-control-summary,
html body.simulator-layout #curtailmentPointsField .avl-control-summary,
html body.simulator-layout #timingPointsSummary,
html body.simulator-layout #curtailmentPointsSummary{
  width:78px !important;
  min-width:78px !important;
  max-width:78px !important;
}
@media (max-width:1600px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:140px 60px 96px 82px 72px 300px 340px 190px !important;
  }
  html body.simulator-layout .command-field-city,
  html body.simulator-layout .command-field-city #locationSelect,
  html body.simulator-layout select#locationSelect{
    width:82px !important;
    min-width:82px !important;
    max-width:82px !important;
  }
  html body.simulator-layout #timingPointsField,
  html body.simulator-layout #curtailmentPointsField,
  html body.simulator-layout .route-control-field,
  html body.simulator-layout #timingPointsField .avl-control-summary,
  html body.simulator-layout #curtailmentPointsField .avl-control-summary,
  html body.simulator-layout #timingPointsSummary,
  html body.simulator-layout #curtailmentPointsSummary{
    width:72px !important;
    min-width:72px !important;
    max-width:72px !important;
  }
}
@media (max-width:1280px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:132px 58px 92px 78px 72px 280px 310px 180px !important;
  }
  html body.simulator-layout .command-field-city,
  html body.simulator-layout .command-field-city #locationSelect,
  html body.simulator-layout select#locationSelect{
    width:78px !important;
    min-width:78px !important;
    max-width:78px !important;
  }
  html body.simulator-layout #timingPointsField,
  html body.simulator-layout #curtailmentPointsField,
  html body.simulator-layout .route-control-field,
  html body.simulator-layout #timingPointsField .avl-control-summary,
  html body.simulator-layout #curtailmentPointsField .avl-control-summary,
  html body.simulator-layout #timingPointsSummary,
  html body.simulator-layout #curtailmentPointsSummary{
    width:69px !important;
    min-width:69px !important;
    max-width:69px !important;
  }
}

/* === OTF FINAL HEADER SPACING FIX: SHIFT DR CH AND RIGHT-SIDE PANELS RIGHT ===
   Keeps Scenario, Speed, Performance, City Pack, T Points and C Points fixed.
   Adds a protected spacer before DR CH so it no longer visually touches/overlaps C Points.
   This block must stay last because older inline/style blocks force scenario-command-row columns. */
html body.simulator-layout .scenario-command-row{
  grid-template-columns:150px 64px 104px 88px 16px 72px 320px 370px 198px !important;
  column-gap:8px !important;
}
html body.simulator-layout .command-field-driver-change{
  grid-column:6 !important;
  grid-row:1 !important;
  width:72px !important;
  min-width:72px !important;
  max-width:72px !important;
  justify-self:start !important;
  margin:0 !important;
}
html body.simulator-layout .command-field-driver-change #driverChangePointSelect{
  width:72px !important;
  min-width:72px !important;
  max-width:72px !important;
}
html body.simulator-layout .embedded-ewt-slot,
html body.simulator-layout .embedded-ewt-slot.demo-ewt-after-dispatcher{
  grid-column:7 !important;
  grid-row:1 !important;
  justify-self:start !important;
  margin:0 !important;
}
html body.simulator-layout .scenario-command-actions{
  grid-column:7 !important;
  grid-row:2 !important;
  justify-self:center !important;
  margin:0 !important;
}
html body.simulator-layout .embedded-stand-slot{
  grid-column:8 !important;
  grid-row:1 !important;
  justify-self:start !important;
  margin:0 !important;
}
html body.simulator-layout .embedded-sim-clock-slot{
  grid-column:9 !important;
  grid-row:1 !important;
  justify-self:start !important;
  margin:0 !important;
}
@media (max-width:1600px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:140px 60px 96px 82px 14px 72px 300px 340px 190px !important;
    column-gap:6px !important;
  }
  html body.simulator-layout .command-field-driver-change{grid-column:6 !important;}
  html body.simulator-layout .embedded-ewt-slot,
  html body.simulator-layout .embedded-ewt-slot.demo-ewt-after-dispatcher{grid-column:7 !important;}
  html body.simulator-layout .scenario-command-actions{grid-column:7 !important;}
  html body.simulator-layout .embedded-stand-slot{grid-column:8 !important;}
  html body.simulator-layout .embedded-sim-clock-slot{grid-column:9 !important;}
}
@media (max-width:1280px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:132px 58px 92px 78px 10px 72px 280px 310px 180px !important;
    column-gap:5px !important;
  }
  html body.simulator-layout .command-field-driver-change{grid-column:6 !important;}
  html body.simulator-layout .embedded-ewt-slot,
  html body.simulator-layout .embedded-ewt-slot.demo-ewt-after-dispatcher{grid-column:7 !important;}
  html body.simulator-layout .scenario-command-actions{grid-column:7 !important;}
  html body.simulator-layout .embedded-stand-slot{grid-column:8 !important;}
  html body.simulator-layout .embedded-sim-clock-slot{grid-column:9 !important;}
}



/* === NO-FLICKER TABLE ACTION BUTTON PLACEMENT === */
html body.simulator-layout .scenario-view-toggle #manualLogToggleBtn.dispatch-fab.sim-table-action-btn,
html body.simulator-layout .scenario-view-toggle #dispatchToggleBtn.dispatch-fab.sim-table-action-btn,
html body.simulator-layout.demo-clean-controls .scenario-view-toggle #manualLogToggleBtn.dispatch-fab.demo-table-action-btn,
html body.simulator-layout.demo-clean-controls .scenario-view-toggle #dispatchToggleBtn.dispatch-fab.demo-table-action-btn{
  position:static !important;
  inset:auto !important;
  left:auto !important;
  right:auto !important;
  top:auto !important;
  bottom:auto !important;
  transform:none !important;
  width:auto !important;
  min-width:122px !important;
  max-width:none !important;
  height:30px !important;
  min-height:30px !important;
  max-height:30px !important;
  padding:0 13px !important;
  margin:0 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:999px !important;
  border:1px solid rgba(202,229,255,.28) !important;
  background:rgba(13,32,67,.86) !important;
  color:#ffffff !important;
  font-size:.7rem !important;
  line-height:1 !important;
  font-weight:1000 !important;
  letter-spacing:.075em !important;
  text-transform:uppercase !important;
  box-shadow:0 8px 18px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.10) !important;
  cursor:pointer !important;
  z-index:40 !important;
  pointer-events:auto !important;
  backdrop-filter:blur(8px) !important;
}
html body.simulator-layout .scenario-view-toggle #manualLogToggleBtn.dispatch-fab.sim-table-action-btn:hover,
html body.simulator-layout .scenario-view-toggle #dispatchToggleBtn.dispatch-fab.sim-table-action-btn:hover,
html body.simulator-layout.demo-clean-controls .scenario-view-toggle #manualLogToggleBtn.dispatch-fab.demo-table-action-btn:hover,
html body.simulator-layout.demo-clean-controls .scenario-view-toggle #dispatchToggleBtn.dispatch-fab.demo-table-action-btn:hover{
  background:linear-gradient(90deg,#266be8,#20c6df) !important;
  filter:brightness(1.06) !important;
}

/* OTF FIX: T/C point visual hierarchy only.
   Timing points are now thin/elegant labels; curtailment points inherit the former strong timing-point look.
   No route data, Supabase, schedule, or simulator logic changed. */
html body.simulator-layout #simSvg .route-control-timing-point,
html body.simulator-layout svg .route-control-timing-point{
  fill:#fff6b8 !important;
  stroke:#7a6112 !important;
  stroke-width:.85px !important;
  opacity:.82 !important;
  filter:none !important;
}
html body.simulator-layout #simSvg .route-control-timing-connector,
html body.simulator-layout svg .route-control-timing-connector{
  stroke:#e7c83d !important;
  stroke-width:.9px !important;
  opacity:.48 !important;
  stroke-dasharray:2 5 !important;
}
html body.simulator-layout #simSvg .route-control-timing-label,
html body.simulator-layout #simSvg .route-waypoint-label.route-control-timing-label,
html body.simulator-layout #simSvg .route-waypoint-label-crisp.route-control-timing-label,
html body.simulator-layout svg .route-control-timing-label,
html body.simulator-layout svg .route-waypoint-label.route-control-timing-label,
html body.simulator-layout svg .route-waypoint-label-crisp.route-control-timing-label{
  fill:#fff7cf !important;
  font-family:Inter, Arial, sans-serif !important;
  font-weight:520 !important;
  font-size:9.2px !important;
  letter-spacing:.035em !important;
  opacity:.92 !important;
  paint-order:stroke !important;
  stroke:rgba(0,0,0,.46) !important;
  stroke-width:1.15px !important;
  filter:none !important;
}
html body.simulator-layout #simSvg .route-control-curtail-point,
html body.simulator-layout #simSvg .route-control-both-point,
html body.simulator-layout svg .route-control-curtail-point,
html body.simulator-layout svg .route-control-both-point{
  fill:#ffd11a !important;
  stroke:#2b2100 !important;
  stroke-width:1.6px !important;
  opacity:1 !important;
  filter:drop-shadow(0 0 5px rgba(255,209,26,.65)) !important;
}
html body.simulator-layout #simSvg .route-control-curtail-connector,
html body.simulator-layout #simSvg .route-control-both-connector,
html body.simulator-layout svg .route-control-curtail-connector,
html body.simulator-layout svg .route-control-both-connector{
  stroke:#ffd11a !important;
  stroke-width:2.2px !important;
  opacity:.95 !important;
  stroke-dasharray:none !important;
}
html body.simulator-layout #simSvg .route-control-curtail-label,
html body.simulator-layout #simSvg .route-control-both-label,
html body.simulator-layout #simSvg .route-waypoint-label.route-control-curtail-label,
html body.simulator-layout #simSvg .route-waypoint-label.route-control-both-label,
html body.simulator-layout #simSvg .route-waypoint-label-crisp.route-control-curtail-label,
html body.simulator-layout #simSvg .route-waypoint-label-crisp.route-control-both-label,
html body.simulator-layout svg .route-control-curtail-label,
html body.simulator-layout svg .route-control-both-label,
html body.simulator-layout svg .route-waypoint-label.route-control-curtail-label,
html body.simulator-layout svg .route-waypoint-label.route-control-both-label,
html body.simulator-layout svg .route-waypoint-label-crisp.route-control-curtail-label,
html body.simulator-layout svg .route-waypoint-label-crisp.route-control-both-label{
  fill:#fff1a6 !important;
  font-weight:1000 !important;
  font-size:11px !important;
  opacity:1 !important;
  paint-order:stroke !important;
  stroke:rgba(0,0,0,.78) !important;
  stroke-width:2.8px !important;
  letter-spacing:0 !important;
}

/* OTF FIX: clean T/C route-point diagram visuals only.
   T points = thin, centred, readable. C/both points = stronger but non-yellow.
   No route data, Supabase, schedule, admin, HTML or JS changed. */
html body.simulator-layout #simSvg .route-control-timing-point,
html body.simulator-layout svg .route-control-timing-point{
  fill:#f8fafc !important;
  stroke:#475569 !important;
  stroke-width:.75px !important;
  opacity:.92 !important;
  filter:none !important;
}
html body.simulator-layout #simSvg .route-control-timing-connector,
html body.simulator-layout svg .route-control-timing-connector{
  stroke:#64748b !important;
  stroke-width:.7px !important;
  opacity:.42 !important;
  stroke-dasharray:2 5 !important;
  filter:none !important;
}
html body.simulator-layout #simSvg .route-control-timing-label,
html body.simulator-layout #simSvg .route-waypoint-label.route-control-timing-label,
html body.simulator-layout #simSvg .route-waypoint-label-crisp.route-control-timing-label,
html body.simulator-layout svg .route-control-timing-label,
html body.simulator-layout svg .route-waypoint-label.route-control-timing-label,
html body.simulator-layout svg .route-waypoint-label-crisp.route-control-timing-label{
  fill:#0f172a !important;
  color:#0f172a !important;
  font-family:Inter, Arial, sans-serif !important;
  font-weight:520 !important;
  font-size:10px !important;
  letter-spacing:.01em !important;
  text-anchor:middle !important;
  dominant-baseline:middle !important;
  alignment-baseline:middle !important;
  opacity:.96 !important;
  paint-order:stroke !important;
  stroke:rgba(255,255,255,.88) !important;
  stroke-width:1.45px !important;
  stroke-linejoin:round !important;
  filter:none !important;
}
html body.simulator-layout #simSvg .route-control-curtail-point,
html body.simulator-layout #simSvg .route-control-both-point,
html body.simulator-layout svg .route-control-curtail-point,
html body.simulator-layout svg .route-control-both-point{
  fill:#dbeafe !important;
  stroke:#1e3a8a !important;
  stroke-width:1.25px !important;
  opacity:.98 !important;
  filter:drop-shadow(0 0 3px rgba(30,58,138,.22)) !important;
}
html body.simulator-layout #simSvg .route-control-curtail-connector,
html body.simulator-layout #simSvg .route-control-both-connector,
html body.simulator-layout svg .route-control-curtail-connector,
html body.simulator-layout svg .route-control-both-connector{
  stroke:#2563eb !important;
  stroke-width:1.45px !important;
  opacity:.66 !important;
  stroke-dasharray:none !important;
  filter:none !important;
}
html body.simulator-layout #simSvg .route-control-curtail-label,
html body.simulator-layout #simSvg .route-control-both-label,
html body.simulator-layout #simSvg .route-waypoint-label.route-control-curtail-label,
html body.simulator-layout #simSvg .route-waypoint-label.route-control-both-label,
html body.simulator-layout #simSvg .route-waypoint-label-crisp.route-control-curtail-label,
html body.simulator-layout #simSvg .route-waypoint-label-crisp.route-control-both-label,
html body.simulator-layout svg .route-control-curtail-label,
html body.simulator-layout svg .route-control-both-label,
html body.simulator-layout svg .route-waypoint-label.route-control-curtail-label,
html body.simulator-layout svg .route-waypoint-label.route-control-both-label,
html body.simulator-layout svg .route-waypoint-label-crisp.route-control-curtail-label,
html body.simulator-layout svg .route-waypoint-label-crisp.route-control-both-label{
  fill:#0f172a !important;
  color:#0f172a !important;
  font-family:Inter, Arial, sans-serif !important;
  font-weight:760 !important;
  font-size:10.6px !important;
  letter-spacing:.005em !important;
  text-anchor:middle !important;
  dominant-baseline:middle !important;
  alignment-baseline:middle !important;
  opacity:1 !important;
  paint-order:stroke !important;
  stroke:rgba(255,255,255,.92) !important;
  stroke-width:1.75px !important;
  stroke-linejoin:round !important;
  filter:none !important;
}


/* OTF FIX: centre selected timing/curtailment point labels on the AVL spine.
   Selected detailed GTFS timing points now sit exactly between the inbound/outbound lines. */
html body.simulator-layout #simSvg .route-label.route-control-timing-label,
html body.simulator-layout #simSvg .route-label.route-control-curtail-label,
html body.simulator-layout #simSvg .route-label.route-control-both-label,
html body.simulator-layout #simSvg .route-waypoint-label.route-control-timing-label,
html body.simulator-layout #simSvg .route-waypoint-label.route-control-curtail-label,
html body.simulator-layout #simSvg .route-waypoint-label.route-control-both-label,
html body.simulator-layout svg .route-label.route-control-timing-label,
html body.simulator-layout svg .route-label.route-control-curtail-label,
html body.simulator-layout svg .route-label.route-control-both-label,
html body.simulator-layout svg .route-waypoint-label.route-control-timing-label,
html body.simulator-layout svg .route-waypoint-label.route-control-curtail-label,
html body.simulator-layout svg .route-waypoint-label.route-control-both-label{
  text-anchor:middle !important;
  dominant-baseline:central !important;
  alignment-baseline:central !important;
  baseline-shift:0 !important;
}


/* === Crystal-clear Stand A/B ETA departure table === */
html body.simulator-layout #standHoldMonitor{
  min-height:116px !important;
  max-height:126px !important;
  overflow:visible !important;
}
html body.simulator-layout #standHoldMonitor .stand-hold-monitor-cols{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;
  height:auto !important;
}
html body.simulator-layout #standHoldMonitor .stand-hold-col{
  min-height:104px !important;
  padding:7px 8px !important;
  overflow:hidden !important;
}
html body.simulator-layout #standHoldMonitor .stand-hold-title{
  font-size:.72rem !important;
  line-height:1 !important;
  margin:0 0 3px !important;
}
html body.simulator-layout #standHoldMonitor .stand-hold-meta{
  font-size:.56rem !important;
  line-height:1.05 !important;
  margin:0 0 4px !important;
  color:rgba(255,255,255,.84) !important;
}
html body.simulator-layout #standHoldMonitor .stand-hold-list{
  display:flex !important;
  flex-direction:column !important;
  gap:3px !important;
  max-height:none !important;
  overflow:visible !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-head,
html body.simulator-layout #standHoldMonitor .stand-eta-row{
  display:grid !important;
  grid-template-columns:0.70fr 1.05fr 1.15fr !important;
  align-items:center !important;
  gap:4px !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-head{
  color:#9df4ff !important;
  font-size:.48rem !important;
  font-weight:900 !important;
  letter-spacing:.05em !important;
  text-transform:uppercase !important;
  opacity:.95 !important;
  padding:0 4px !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-row{
  width:100% !important;
  min-height:19px !important;
  padding:3px 5px !important;
  border:1px solid rgba(255,255,255,.16) !important;
  border-radius:7px !important;
  background:rgba(255,255,255,.10) !important;
  color:#fff !important;
  cursor:pointer !important;
  font:inherit !important;
  text-align:left !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08) !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-row:hover{
  background:rgba(34,211,238,.20) !important;
  border-color:rgba(34,211,238,.55) !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-row.is-planned{
  background:rgba(250,204,21,.20) !important;
  border-color:rgba(250,204,21,.70) !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-row.at-stand{
  background:rgba(34,197,94,.20) !important;
  border-color:rgba(34,197,94,.55) !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-bus,
html body.simulator-layout #standHoldMonitor .stand-eta-sched,
html body.simulator-layout #standHoldMonitor .stand-eta-arr{
  font-size:.56rem !important;
  line-height:1.05 !important;
  font-weight:900 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-sched{ color:#ffffff !important; }
html body.simulator-layout #standHoldMonitor .stand-eta-arr{ color:#d9f99d !important; }
html body.simulator-layout #standHoldMonitor .stand-hold-empty{
  min-height:30px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:.60rem !important;
  color:rgba(255,255,255,.72) !important;
}


/* === OTF PATCH: wider crystal-clear Stand A/B monitor + modern stand departure modal === */
html body.simulator-layout .scenario-command-row{
  grid-template-columns:150px 64px 104px 88px 16px 72px 320px 481px 198px !important;
  column-gap:8px !important;
}
html body.simulator-layout .embedded-stand-slot{
  width:481px !important;
  min-width:481px !important;
  max-width:481px !important;
}
html body.simulator-layout #standHoldMonitor{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-head,
html body.simulator-layout #standHoldMonitor .stand-eta-row{
  grid-template-columns:0.72fr 1.15fr 1.22fr !important;
  gap:6px !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-row{
  min-height:22px !important;
  padding:4px 7px !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-bus,
html body.simulator-layout #standHoldMonitor .stand-eta-sched,
html body.simulator-layout #standHoldMonitor .stand-eta-arr{
  font-size:.60rem !important;
}
@media (max-width:1600px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:140px 60px 96px 82px 14px 72px 300px 442px 190px !important;
    column-gap:6px !important;
  }
  html body.simulator-layout .embedded-stand-slot{
    width:442px !important;
    min-width:442px !important;
    max-width:442px !important;
  }
}
@media (max-width:1280px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:132px 58px 92px 78px 10px 72px 280px 403px 180px !important;
    column-gap:5px !important;
  }
  html body.simulator-layout .embedded-stand-slot{
    width:403px !important;
    min-width:403px !important;
    max-width:403px !important;
  }
}


/* === OTF PATCH: Stand A/B 30% wider + four visible columns with planned HW === */
html body.simulator-layout .scenario-command-row{
  grid-template-columns:150px 64px 104px 88px 12px 72px 300px 626px 198px !important;
  column-gap:8px !important;
}
html body.simulator-layout .embedded-stand-slot{
  width:626px !important;
  min-width:626px !important;
  max-width:626px !important;
}
html body.simulator-layout #standHoldMonitor{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  min-height:116px !important;
  max-height:126px !important;
  overflow:visible !important;
}
html body.simulator-layout #standHoldMonitor .stand-hold-monitor-cols{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:10px !important;
}
html body.simulator-layout #standHoldMonitor .stand-hold-col{
  min-width:0 !important;
  overflow:visible !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-head,
html body.simulator-layout #standHoldMonitor .stand-eta-row{
  display:grid !important;
  grid-template-columns:58px 72px minmax(88px,1fr) 44px !important;
  align-items:center !important;
  gap:7px !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-head{
  padding:0 7px !important;
  font-size:.50rem !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-row{
  min-height:22px !important;
  padding:4px 7px !important;
  border-radius:8px !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-bus,
html body.simulator-layout #standHoldMonitor .stand-eta-sched,
html body.simulator-layout #standHoldMonitor .stand-eta-arr,
html body.simulator-layout #standHoldMonitor .stand-eta-hw{
  font-size:.60rem !important;
  line-height:1.05 !important;
  font-weight:1000 !important;
  white-space:nowrap !important;
  overflow:visible !important;
  text-overflow:clip !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-hw{
  color:#ffffff !important;
  text-align:right !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-arr{ color:#d9f99d !important; }
html body.simulator-layout #standHoldMonitor .stand-eta-sched{ color:#ffffff !important; }
@media (max-width:1600px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:132px 56px 88px 74px 8px 64px 270px 575px 170px !important;
    column-gap:5px !important;
  }
  html body.simulator-layout .embedded-stand-slot{
    width:575px !important;
    min-width:575px !important;
    max-width:575px !important;
  }
  html body.simulator-layout #standHoldMonitor .stand-eta-head,
  html body.simulator-layout #standHoldMonitor .stand-eta-row{
    grid-template-columns:54px 66px minmax(78px,1fr) 39px !important;
    gap:5px !important;
  }
  html body.simulator-layout #standHoldMonitor .stand-eta-bus,
  html body.simulator-layout #standHoldMonitor .stand-eta-sched,
  html body.simulator-layout #standHoldMonitor .stand-eta-arr,
  html body.simulator-layout #standHoldMonitor .stand-eta-hw{font-size:.56rem !important;}
}
@media (max-width:1280px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:128px 56px 88px 74px 8px 64px 250px 524px 165px !important;
    column-gap:4px !important;
  }
  html body.simulator-layout .embedded-stand-slot{
    width:524px !important;
    min-width:524px !important;
    max-width:524px !important;
  }
  html body.simulator-layout #standHoldMonitor .stand-eta-head,
  html body.simulator-layout #standHoldMonitor .stand-eta-row{
    grid-template-columns:50px 60px minmax(70px,1fr) 36px !important;
    gap:4px !important;
  }
}


/* === OTF PATCH: final stand monitor geometry + no scenario text block === */
html body.simulator-layout .scenario-header,
html body.simulator-layout .scenario-text,
html body.simulator-layout .track-wrapper .scenario-text{
  display:none !important;
  height:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
}
html body.simulator-layout .scenario-command-panel{
  padding-bottom:6px !important;
}
html body.simulator-layout #standHoldMonitor .stand-hold-list{
  display:flex !important;
  flex-direction:column !important;
  gap:3px !important;
  min-height:94px !important;
  max-height:none !important;
  overflow:visible !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-head,
html body.simulator-layout #standHoldMonitor .stand-eta-row{
  display:grid !important;
  grid-template-columns:56px 72px minmax(68px,1fr) 40px !important;
  align-items:center !important;
  gap:6px !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-head{
  font-size:.48rem !important;
  line-height:1 !important;
  padding:0 7px !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-row{
  min-height:21px !important;
  height:21px !important;
  padding:3px 7px !important;
  box-sizing:border-box !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-bus,
html body.simulator-layout #standHoldMonitor .stand-eta-sched,
html body.simulator-layout #standHoldMonitor .stand-eta-arr,
html body.simulator-layout #standHoldMonitor .stand-eta-hw{
  font-size:.56rem !important;
  line-height:1 !important;
  font-weight:1000 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  min-width:0 !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-hw{
  text-align:right !important;
  color:#ffffff !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-arr{ color:#d9f99d !important; }
html body.simulator-layout #standHoldMonitor .stand-eta-sched{ color:#ffffff !important; }

/* === OTF PATCH: SIMULATOR MODE SIM CLOCK UNDER PLATFORM MENU ===
   Scope: full simulator only. Demo mode remains unchanged.
   Moves the Sim Clock from the far-right header position to the left side directly under Platform Menu. */
html body.simulator-layout:not(.demo-clean-controls) .scenario-command-panel,
html body.simulator-layout:not(.demo-clean-controls) .scenario-command-row{
  position:relative !important;
  overflow:visible !important;
}

html body.simulator-layout:not(.demo-clean-controls) .scenario-command-row{
  display:grid !important;
  grid-template-columns:150px 64px 104px 88px 16px 72px 286px 620px !important;
  column-gap:12px !important;
  row-gap:8px !important;
  align-items:start !important;
  justify-content:start !important;
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}

html body.simulator-layout:not(.demo-clean-controls) .occ-header-brand{
  position:absolute !important;
  left:14px !important;
  top:82px !important;
  z-index:10060 !important;
}

html body.simulator-layout:not(.demo-clean-controls) .embedded-ewt-slot,
html body.simulator-layout:not(.demo-clean-controls) .embedded-ewt-slot.demo-ewt-after-dispatcher{
  grid-column:7 !important;
  grid-row:1 !important;
  width:286px !important;
  min-width:286px !important;
  max-width:286px !important;
  margin:0 !important;
  justify-self:start !important;
}

html body.simulator-layout:not(.demo-clean-controls) .embedded-stand-slot{
  grid-column:8 !important;
  grid-row:1 !important;
  width:620px !important;
  min-width:620px !important;
  max-width:620px !important;
  margin:0 !important;
  justify-self:start !important;
}

html body.simulator-layout:not(.demo-clean-controls) .embedded-sim-clock-slot{
  position:absolute !important;
  left:14px !important;
  top:124px !important;
  grid-column:auto !important;
  grid-row:auto !important;
  order:initial !important;
  width:190px !important;
  min-width:190px !important;
  max-width:190px !important;
  margin:0 !important;
  justify-self:start !important;
  align-self:start !important;
  z-index:10055 !important;
  pointer-events:auto !important;
}

html body.simulator-layout:not(.demo-clean-controls) .embedded-sim-clock-slot .sim-clock-panel{
  width:100% !important;
  min-width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}

html body.simulator-layout:not(.demo-clean-controls) .scenario-command-actions{
  grid-column:7 !important;
  grid-row:2 !important;
  justify-self:center !important;
  align-self:start !important;
  margin:0 !important;
}

@media (max-width:1600px){
  html body.simulator-layout:not(.demo-clean-controls) .scenario-command-row{
    grid-template-columns:132px 56px 88px 74px 8px 64px 260px 580px !important;
    column-gap:7px !important;
  }
  html body.simulator-layout:not(.demo-clean-controls) .embedded-ewt-slot,
  html body.simulator-layout:not(.demo-clean-controls) .embedded-ewt-slot.demo-ewt-after-dispatcher{width:260px !important;min-width:260px !important;max-width:260px !important;}
  html body.simulator-layout:not(.demo-clean-controls) .embedded-stand-slot,
  html body.simulator-layout:not(.demo-clean-controls) #standHoldMonitor{width:580px !important;min-width:580px !important;max-width:580px !important;}
  html body.simulator-layout:not(.demo-clean-controls) .embedded-sim-clock-slot{left:14px !important;top:124px !important;width:176px !important;min-width:176px !important;max-width:176px !important;}
}

@media (max-width:1360px){
  html body.simulator-layout:not(.demo-clean-controls) .scenario-command-row{
    grid-template-columns:128px 54px 84px 70px 6px 60px 240px 540px !important;
    column-gap:5px !important;
  }
  html body.simulator-layout:not(.demo-clean-controls) .embedded-stand-slot,
  html body.simulator-layout:not(.demo-clean-controls) #standHoldMonitor{width:540px !important;min-width:540px !important;max-width:540px !important;}
  html body.simulator-layout:not(.demo-clean-controls) .embedded-sim-clock-slot{width:166px !important;min-width:166px !important;max-width:166px !important;}
}
/* END OTF PATCH: SIMULATOR MODE SIM CLOCK UNDER PLATFORM MENU */

/* === OTF PATCH: PLATFORM MENU TOP-RIGHT + SIM CLOCK UNDER TIME ===
   Scope: full simulator only. Demo mode remains unchanged.
   - Platform Menu is parked in the top-right screen corner.
   - Sim Clock is moved up directly below the Time selector. */
html body.simulator-layout:not(.demo-clean-controls) .scenario-command-panel,
html body.simulator-layout:not(.demo-clean-controls) .scenario-command-row{
  position:relative !important;
  overflow:visible !important;
}

html body.simulator-layout:not(.demo-clean-controls) .occ-header-brand{
  position:fixed !important;
  top:10px !important;
  right:12px !important;
  left:auto !important;
  bottom:auto !important;
  grid-column:auto !important;
  grid-row:auto !important;
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:8px !important;
  overflow:visible !important;
  z-index:200000 !important;
  pointer-events:auto !important;
}

html body.simulator-layout:not(.demo-clean-controls) .occ-header-brand h2{
  display:none !important;
}

html body.simulator-layout:not(.demo-clean-controls) .occ-brand-menu-icon{
  width:24px !important;
  min-width:24px !important;
  height:24px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin:0 !important;
  flex:0 0 auto !important;
}

html body.simulator-layout:not(.demo-clean-controls) .occ-header-brand .platform-home-btn,
html body.simulator-layout:not(.demo-clean-controls) .platform-home-btn{
  position:static !important;
  inset:auto !important;
  width:auto !important;
  min-width:104px !important;
  max-width:none !important;
  height:30px !important;
  min-height:30px !important;
  margin:0 !important;
  padding:0 14px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  white-space:nowrap !important;
  overflow:visible !important;
  text-overflow:clip !important;
  transform:none !important;
  z-index:auto !important;
}

html body.simulator-layout:not(.demo-clean-controls) .embedded-sim-clock-slot{
  position:absolute !important;
  left:-14px !important;
  top:82px !important;
  grid-column:auto !important;
  grid-row:auto !important;
  order:initial !important;
  width:190px !important;
  min-width:190px !important;
  max-width:190px !important;
  margin:0 !important;
  justify-self:start !important;
  align-self:start !important;
  z-index:10055 !important;
  pointer-events:auto !important;
}

html body.simulator-layout:not(.demo-clean-controls) .embedded-sim-clock-slot .sim-clock-panel{
  width:100% !important;
  min-width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}

@media (max-width:1600px){
  html body.simulator-layout:not(.demo-clean-controls) .embedded-sim-clock-slot{
    left:-14px !important;
    top:82px !important;
    width:176px !important;
    min-width:176px !important;
    max-width:176px !important;
  }
  html body.simulator-layout:not(.demo-clean-controls) .occ-header-brand{
    top:8px !important;
    right:10px !important;
  }
}

@media (max-width:1360px){
  html body.simulator-layout:not(.demo-clean-controls) .embedded-sim-clock-slot{
    top:82px !important;
    width:166px !important;
    min-width:166px !important;
    max-width:166px !important;
  }
  html body.simulator-layout:not(.demo-clean-controls) .occ-header-brand .platform-home-btn,
  html body.simulator-layout:not(.demo-clean-controls) .platform-home-btn{
    min-width:96px !important;
    padding:0 10px !important;
    font-size:10px !important;
  }
}
/* END OTF PATCH: PLATFORM MENU TOP-RIGHT + SIM CLOCK UNDER TIME */



/* === OTF STABLE COMMAND CLICK CSS GUARD v1 === */
body.simulator-layout tr.live-bus-row,
body.simulator-layout .stand-row[data-bus-id],
body.simulator-layout .bus-node[data-bus-id],
body.simulator-layout .bus-rect[data-bus-id]{
  cursor:pointer !important;
}
body.simulator-layout #busCommandOverlay:not(.show),
body.simulator-layout #busLoginOverlay:not(.show){
  pointer-events:none !important;
}
/* === END OTF STABLE COMMAND CLICK CSS GUARD v1 === */


/* === OTF PATCH: no table command clicks + no animation performance mode ===
   Stand A/B and live table rows are information-only. Commands must be used from the dedicated controls / bus diagram.
   CSS animations/transitions are disabled to reduce browser lag on Cloudflare/fullscreen. */
.stand-eta-row,
.stand-row,
.live-bus-row {
  cursor: default !important;
  user-select: text !important;
}
.stand-eta-row.is-info-only,
.stand-row.is-info-only,
.live-bus-row.is-info-only {
  pointer-events: none !important;
}
.stand-eta-row:hover,
.stand-row:hover,
.live-bus-row:hover {
  transform: none !important;
  filter: none !important;
  box-shadow: none !important;
}
html.perf-low *, html.perf-low *::before, html.perf-low *::after,
body[data-performance-mode="low"] *, body[data-performance-mode="low"] *::before, body[data-performance-mode="low"] *::after {
  animation: none !important;
  transition: none !important;
  scroll-behavior: auto !important;
}


/* =========================================================
   Full Schedule popup sheet — print-style controller view
   Keeps the dashboard on LIVE TABLE only; full schedule opens in modal.
   ========================================================= */
.full-schedule-modal{
  position:fixed;
  inset:0;
  z-index:99999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:12px;
  background:rgba(0,10,28,.64);
}
.full-schedule-modal.is-open{ display:flex; }
.full-schedule-backdrop{ position:absolute; inset:0; }
.full-schedule-sheet{
  position:relative;
  width:min(98vw, 1760px);
  height:min(94vh, 1040px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border-radius:16px;
  background:#ffffff !important;
  color:#111827 !important;
  box-shadow:0 24px 80px rgba(0,0,0,.45);
  border:1px solid rgba(0,0,0,.22);
}
.full-schedule-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 14px;
  border-bottom:1px solid #d1d5db;
  background:#f3f4f6;
  color:#111827 !important;
}
.full-schedule-popup-title{
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:1rem;
  color:#111827 !important;
}
.full-schedule-popup-subtitle{ font-size:.78rem; color:#4b5563 !important; }
.full-schedule-actions{ display:flex; gap:8px; align-items:center; }
.full-schedule-actions .view-toggle{
  background:#0f3b73 !important;
  color:#fff !important;
  border:1px solid #0f3b73 !important;
  box-shadow:none !important;
}
.full-schedule-close-btn{ background:#374151 !important; }
.printable-schedule-area{
  flex:1 1 auto;
  overflow:auto;
  padding:12px;
  background:#ffffff !important;
  color:#111827 !important;
}
.print-sheet-head{
  display:grid;
  grid-template-columns: 1.1fr 1fr;
  align-items:start;
  gap:16px;
  margin-bottom:8px;
  color:#111827 !important;
  font-weight:800;
}
.print-route-name{
  font-size:1.35rem;
  line-height:1.05;
  color:#111827 !important;
  font-weight:950;
}
.print-meta-block,
.print-controller-block{
  font-size:.82rem;
  color:#111827 !important;
  line-height:1.45;
}
.print-spell-block{
  justify-self:end;
  background:#ffbf9f;
  padding:5px 12px;
  font-size:.72rem;
  color:#111827 !important;
  font-weight:900;
  text-transform:uppercase;
}
.full-schedule-popup-grid{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:10px;
  align-items:start;
  margin:0 !important;
}
.full-schedule-popup-grid .schedule-table-card{
  background:#ffffff !important;
  border:1px solid #111827 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  color:#111827 !important;
  overflow:hidden;
}
.full-schedule-popup-grid .schedule-title{
  margin:0;
  padding:5px 8px;
  text-align:center;
  color:#111827 !important;
  background:#f3f4f6 !important;
  border-bottom:1px solid #111827;
  font-size:.78rem;
  font-weight:950;
  letter-spacing:.08em;
}
.full-schedule-popup-grid .schedule-table-wrapper{
  margin:0 !important;
  max-height:calc(94vh - 150px) !important;
  overflow:auto !important;
  border:0 !important;
  border-radius:0 !important;
  background:#ffffff !important;
}
.full-schedule-popup-grid table{
  width:100%;
  border-collapse:collapse !important;
  color:#111827 !important;
  background:#fff !important;
  font-size:.58rem !important;
}
.full-schedule-popup-grid thead{
  position:sticky;
  top:0;
  z-index:2;
  background:#ffffff !important;
}
.full-schedule-popup-grid th,
.full-schedule-popup-grid td{
  border:1px solid #111827 !important;
  color:#111827 !important;
  box-shadow:none !important;
}
.full-schedule-popup-grid th{
  height:92px;
  min-width:22px;
  padding:4px 2px !important;
  text-align:center;
  vertical-align:bottom;
  background:#ffffff !important;
  font-size:.55rem !important;
  line-height:1.05;
  font-weight:900;
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  white-space:nowrap;
}
.full-schedule-popup-grid th.fs-head-basic{ background:#e8eef8 !important; }
.full-schedule-popup-grid th.fs-head-rf{ background:#fff200 !important; }
.full-schedule-popup-grid th.fs-head-recovery{ background:#f6b900 !important; }
.full-schedule-popup-grid th.fs-head-next{ background:#d1d5db !important; }
.full-schedule-popup-grid td{
  padding:2px 3px !important;
  text-align:center;
  white-space:nowrap !important;
  font-size:.56rem !important;
  background:#ffffff !important;
}
.full-schedule-popup-grid tr:nth-child(even) td{ background:#fff7ef !important; }
.full-schedule-popup-grid td.fs-bus,
.full-schedule-popup-grid td.fs-duty{ background:#b7f2c5 !important; font-weight:900; }
.full-schedule-popup-grid td.fs-rf{ background:#fff200 !important; font-weight:900; }
.full-schedule-popup-grid td.fs-recovery{ background:#f6b900 !important; font-weight:900; }
.full-schedule-popup-grid td.fs-next{ background:#d1d5db !important; }
.full-schedule-popup-grid td.fs-time{ background:#ffe0cc !important; }
.full-schedule-popup-grid tr.full-sched-row.bus-current td{ background:#fff3cd !important; }
.full-schedule-popup-grid tr.full-sched-row.bus-current td.bus-current-cell{ background:#00a651 !important; color:#fff !important; font-weight:950; }
body.full-schedule-modal-open{ overflow:hidden; }

@media (max-width: 1100px){
  .full-schedule-popup-grid{ grid-template-columns:1fr; }
  .print-sheet-head{ grid-template-columns:1fr 1fr; }
}

@media print{
  @page{ size:A4 landscape; margin:5mm; }
  body *{ visibility:hidden !important; }
  #fullScheduleModal,
  #fullScheduleModal *{ visibility:visible !important; }
  #fullScheduleModal{
    position:static !important;
    inset:auto !important;
    display:block !important;
    padding:0 !important;
    background:#fff !important;
  }
  .full-schedule-backdrop,
  .full-schedule-toolbar,
  .no-print{ display:none !important; }
  .full-schedule-sheet{
    width:100% !important;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
  }
  .printable-schedule-area{
    overflow:visible !important;
    padding:0 !important;
  }
  .full-schedule-popup-grid{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:4px !important;
  }
  .full-schedule-popup-grid .schedule-table-wrapper{
    max-height:none !important;
    overflow:visible !important;
  }
  .full-schedule-popup-grid table{ font-size:.46rem !important; }
  .full-schedule-popup-grid th{ height:78px; font-size:.44rem !important; padding:2px 1px !important; }
  .full-schedule-popup-grid td{ font-size:.44rem !important; padding:1px 2px !important; }
  .print-route-name{ font-size:1rem !important; }
  .print-meta-block,.print-controller-block,.print-spell-block{ font-size:.55rem !important; }
}


/* =========================================================
   Full Schedule popup readability/no-map-controls fix
   - hides route-map SCHEMATIC / REAL MAP controls while schedule sheet is open
   - forces high-contrast black text inside the schedule sheet
   ========================================================= */
body.full-schedule-modal-open .real-map-force-toggle,
body.full-schedule-modal-open .real-map-toggle,
body.full-schedule-modal-open .real-map-force-overlay,
body.full-schedule-modal-open #busMapOverlay .real-map-force-toggle,
body.full-schedule-modal-open #busMapOverlay .real-map-toggle{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

body.full-schedule-modal-open #fullScheduleModal.full-schedule-modal{
  z-index:2147483000 !important;
}
body.full-schedule-modal-open #fullScheduleModal .full-schedule-sheet{
  background:#ffffff !important;
  color:#07111f !important;
  opacity:1 !important;
}
body.simulator-layout.full-schedule-modal-open #fullScheduleModal,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal *,
body.full-schedule-modal-open #fullScheduleModal,
body.full-schedule-modal-open #fullScheduleModal *{
  text-shadow:none !important;
  filter:none !important;
}
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .printable-schedule-area,
body.full-schedule-modal-open #fullScheduleModal .printable-schedule-area{
  background:#ffffff !important;
  color:#07111f !important;
}
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid table,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid table{
  color:#07111f !important;
  background:#ffffff !important;
  font-size:.64rem !important;
  opacity:1 !important;
}
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid th,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid th,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td{
  color:#07111f !important;
  opacity:1 !important;
  font-weight:800 !important;
  border-color:#111827 !important;
  text-shadow:none !important;
}
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid th,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid th{
  color:#07111f !important;
  font-size:.62rem !important;
  font-weight:950 !important;
  background:#ffffff !important;
}
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td{
  color:#07111f !important;
  font-size:.64rem !important;
  font-weight:800 !important;
  background:#ffffff !important;
}
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid tr:nth-child(even) td,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid tr:nth-child(even) td{
  background:#fff1e6 !important;
}
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-bus,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-duty,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-bus,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-duty{
  background:#b7f2c5 !important;
  color:#07111f !important;
  font-weight:950 !important;
}
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-rf,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-rf{
  background:#fff200 !important;
  color:#07111f !important;
  font-weight:950 !important;
}
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-time,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-time{
  background:#ffd9c2 !important;
  color:#07111f !important;
}
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-recovery,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-recovery{
  background:#f6b900 !important;
  color:#07111f !important;
  font-weight:950 !important;
}
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-next,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-next{
  background:#d1d5db !important;
  color:#07111f !important;
}
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid th.fs-head-basic,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid th.fs-head-basic{ background:#e8eef8 !important; color:#07111f !important; }
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid th.fs-head-rf,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid th.fs-head-rf{ background:#fff200 !important; color:#07111f !important; }
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid th.fs-head-recovery,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid th.fs-head-recovery{ background:#f6b900 !important; color:#07111f !important; }
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid th.fs-head-next,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid th.fs-head-next{ background:#d1d5db !important; color:#07111f !important; }
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid tr.full-sched-row.bus-current td,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid tr.full-sched-row.bus-current td{
  background:#fff3cd !important;
  color:#07111f !important;
}
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid tr.full-sched-row.bus-current td.bus-current-cell,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid tr.full-sched-row.bus-current td.bus-current-cell{
  background:#008a41 !important;
  color:#ffffff !important;
  font-weight:950 !important;
}

@media print{
  body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid th,
  body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td{
    color:#07111f !important;
    opacity:1 !important;
    text-shadow:none !important;
    -webkit-print-color-adjust:exact !important;
    print-color-adjust:exact !important;
  }
}


/* Full Schedule duty break/finish cleanup */
.print-sheet-head{ grid-template-columns: 1.1fr 1fr !important; }
.print-controller-block,.print-spell-block{ display:none !important; }
.full-schedule-popup-grid th.fs-head-info{ background:#fde68a !important; color:#07111f !important; }
.full-schedule-popup-grid td.fs-info{ background:#ffffff !important; font-weight:900 !important; min-width:82px; }
.full-schedule-popup-grid td.fs-next-duty{ background:#e8eef8 !important; font-weight:900 !important; }
.full-schedule-popup-grid td.fs-info-break{ background:#fde68a !important; color:#111827 !important; }
.full-schedule-popup-grid td.fs-info-finish{ background:#fecaca !important; color:#7f1d1d !important; }
.full-schedule-popup-grid td.fs-info-relief{ background:#bfdbfe !important; color:#0f172a !important; }
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-info-break,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-info-break{ background:#fde68a !important; color:#111827 !important; font-weight:950 !important; }
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-info-finish,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-info-finish{ background:#fecaca !important; color:#7f1d1d !important; font-weight:950 !important; }
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-next-duty,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-next-duty{ background:#e8eef8 !important; color:#07111f !important; font-weight:950 !important; }
@media print{ .print-sheet-head{ grid-template-columns:1.1fr 1fr !important; } .print-controller-block,.print-spell-block{ display:none !important; } }


/* === FULL SCHEDULE SAFE REBUILD: information-only, readable, changeover highlighted === */
body.full-schedule-modal-open #fullScheduleModal .schedule-bus-dot,
body.full-schedule-modal-open #fullScheduleModal .schedule-bus-dots{ display:none !important; }
body.full-schedule-modal-open #fullScheduleModal .full-sched-row.bus-current td,
body.full-schedule-modal-open #fullScheduleModal .full-sched-row td.bus-current-cell,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-sched-row.bus-current td,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-sched-row td.bus-current-cell{
  outline:none !important;
  box-shadow:none !important;
}
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-rf-relief,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-rf-relief{
  background:#008c3a !important;
  color:#ffffff !important;
  font-weight:950 !important;
}
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-rf-finish,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-rf-finish{
  background:#e11d2e !important;
  color:#ffffff !important;
  font-weight:950 !important;
}
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-rf-mixed,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-rf-mixed{
  background:#f59e0b !important;
  color:#111827 !important;
  font-weight:950 !important;
}
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-info,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-next-duty,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-info,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-next-duty{
  color:#07111f !important;
  font-weight:950 !important;
  min-width:74px !important;
}
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-info-break,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-info-break{
  background:#fde68a !important;
  color:#111827 !important;
}
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-info-finish,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-info-finish{
  background:#fecaca !important;
  color:#7f1d1d !important;
}
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-info-relief,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-info-relief{
  background:#bfdbfe !important;
  color:#0f172a !important;
}
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid th,
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid th,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td{
  text-shadow:none !important;
  opacity:1 !important;
}
@media print{
  #fullScheduleModal .schedule-bus-dot,
  #fullScheduleModal .schedule-bus-dots{ display:none !important; }
}


/* === FULL SCHEDULE REAL-TIME DUTY LOGIC FIX: changeover point + no fake same-duty change === */
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid th.fs-changeover-head,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid th.fs-changeover-head{
  background:#7c3aed !important;
  color:#ffffff !important;
  box-shadow:inset 0 0 0 2px #facc15 !important;
  font-weight:1000 !important;
}
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-changeover-col,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-changeover-col{
  background:#ede9fe !important;
  color:#111827 !important;
  font-weight:950 !important;
}
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-changeover-cell,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-changeover-cell{
  background:#7c3aed !important;
  color:#ffffff !important;
  box-shadow:inset 0 0 0 2px #facc15 !important;
  font-weight:1000 !important;
}
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-duty-real-change,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-duty-real-change{
  border:2px solid #7c3aed !important;
}


/* === FULL SCHEDULE DUTY TAKEOVER FIX: true different-duty takeover only === */
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-next-duty,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-next-duty{
  min-width:96px !important;
}
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-info-break:not(.fs-duty-real-change),
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-info-break:not(.fs-duty-real-change){
  background:#fff3bf !important;
  color:#111827 !important;
}
body.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-duty-real-change,
body.simulator-layout.full-schedule-modal-open #fullScheduleModal .full-schedule-popup-grid td.fs-duty-real-change{
  box-shadow:inset 0 0 0 2px #6d28d9 !important;
}


/* === OTF FIX: TRUE LOW POWER VISUAL FAST PATH ===
   Low Power removes decorative visual costs across the simulator.
   Balanced and High Quality are left free to use their richer styling. */
html.perf-low body.simulator-layout .bus-status-emphasis,
body.simulator-layout[data-performance-mode="low"] .bus-status-emphasis,
html.perf-low body.simulator-layout .bus-selected .bus-rect,
body.simulator-layout[data-performance-mode="low"] .bus-selected .bus-rect,
html.perf-low body.simulator-layout #simSvg *,
body.simulator-layout[data-performance-mode="low"] #simSvg *{
  filter:none !important;
  text-shadow:none !important;
}
html.perf-low body.simulator-layout .track-wrapper,
body.simulator-layout[data-performance-mode="low"] .track-wrapper,
html.perf-low body.simulator-layout .scenario-command-panel,
body.simulator-layout[data-performance-mode="low"] .scenario-command-panel,
html.perf-low body.simulator-layout .kpi-tile,
body.simulator-layout[data-performance-mode="low"] .kpi-tile,
html.perf-low body.simulator-layout .full-schedule-sheet,
body.simulator-layout[data-performance-mode="low"] .full-schedule-sheet{
  box-shadow:none !important;
  backdrop-filter:none !important;
}
html.perf-low body.simulator-layout .headway-band,
body.simulator-layout[data-performance-mode="low"] .headway-band{
  opacity:1 !important;
}


/* === OTF PATCH: diversion reliability + low-power stand table no-hover v1 === */
html.perf-low body.simulator-layout .stand-row,
html.perf-low body.simulator-layout .stand-eta-row,
html.perf-low body.simulator-layout #standHoldMonitor .stand-eta-row,
html.perf-low body.simulator-layout .stand-row *,
html.perf-low body.simulator-layout .stand-eta-row *,
body.simulator-layout[data-performance-mode="low"] .stand-row,
body.simulator-layout[data-performance-mode="low"] .stand-eta-row,
body.simulator-layout[data-performance-mode="low"] #standHoldMonitor .stand-eta-row,
body.simulator-layout[data-performance-mode="low"] .stand-row *,
body.simulator-layout[data-performance-mode="low"] .stand-eta-row *{
  transition:none !important;
  animation:none !important;
  transform:none !important;
  filter:none !important;
  box-shadow:none !important;
  cursor:default !important;
}
html.perf-low body.simulator-layout .stand-row:hover,
html.perf-low body.simulator-layout .stand-eta-row:hover,
html.perf-low body.simulator-layout #standHoldMonitor .stand-eta-row:hover,
body.simulator-layout[data-performance-mode="low"] .stand-row:hover,
body.simulator-layout[data-performance-mode="low"] .stand-eta-row:hover,
body.simulator-layout[data-performance-mode="low"] #standHoldMonitor .stand-eta-row:hover{
  transform:none !important;
  filter:none !important;
  box-shadow:none !important;
  background:inherit !important;
  border-color:inherit !important;
}
html.perf-low body.simulator-layout #standHoldMonitor .stand-eta-row.at-stand:hover,
body.simulator-layout[data-performance-mode="low"] #standHoldMonitor .stand-eta-row.at-stand:hover{
  background:rgba(34,197,94,.20) !important;
  border-color:rgba(34,197,94,.55) !important;
}
html.perf-low body.simulator-layout #standHoldMonitor .stand-eta-row.is-planned:hover,
body.simulator-layout[data-performance-mode="low"] #standHoldMonitor .stand-eta-row.is-planned:hover{
  background:rgba(250,204,21,.20) !important;
  border-color:rgba(250,204,21,.70) !important;
}
/* === END OTF PATCH === */

/* === OTF PATCH: Stand A/B monitor pure information table - no hover/click v2 ===
   User requirement: the Stand A/B monitor is only an information table.
   No hover highlight, no pointer cursor, no transitions/animations on rows. */
html body.simulator-layout #standHoldMonitor .stand-eta-row,
html body.simulator-layout #standHoldMonitor .stand-eta-row *,
html body.simulator-layout #standHoldMonitor .stand-hold-row,
html body.simulator-layout #standHoldMonitor .stand-hold-row *,
html body.simulator-layout #standHoldMonitor .stand-hold-line,
html body.simulator-layout #standHoldMonitor .stand-hold-line *,
html body.simulator-layout .stand-row,
html body.simulator-layout .stand-row *{
  pointer-events:none !important;
  cursor:default !important;
  transition:none !important;
  animation:none !important;
  transform:none !important;
  filter:none !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-row:hover,
html body.simulator-layout #standHoldMonitor .stand-hold-row:hover,
html body.simulator-layout #standHoldMonitor .stand-hold-line:hover,
html body.simulator-layout .stand-row:hover{
  background:rgba(255,255,255,.10) !important;
  border-color:rgba(255,255,255,.16) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08) !important;
  transform:none !important;
  filter:none !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-row.at-stand:hover{
  background:rgba(34,197,94,.20) !important;
  border-color:rgba(34,197,94,.55) !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-row.is-planned:hover{
  background:rgba(250,204,21,.20) !important;
  border-color:rgba(250,204,21,.70) !important;
}
html body.simulator-layout #standHoldMonitor .stand-eta-row.at-stand.is-planned:hover{
  background:rgba(34,197,94,.20) !important;
  border-color:rgba(34,197,94,.55) !important;
}
/* === END OTF PATCH === */



/* === OTF PATCH: Performance hardened Low Power v1 === */
html.perf-low *, body.perf-low *,
html.avl-low-power-render-engine *, body.avl-low-power-render-engine *{
  animation: none !important;
  transition: none !important;
  scroll-behavior: auto !important;
  filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
}
html.perf-low .stand-eta-row:hover,
body.perf-low .stand-eta-row:hover,
html.perf-low .stand-row:hover,
body.perf-low .stand-row:hover,
html.perf-low .live-bus-row:hover,
body.perf-low .live-bus-row:hover,
html.avl-low-power-render-engine .stand-eta-row:hover,
body.avl-low-power-render-engine .stand-eta-row:hover,
html.avl-low-power-render-engine .stand-row:hover,
body.avl-low-power-render-engine .stand-row:hover,
html.avl-low-power-render-engine .live-bus-row:hover,
body.avl-low-power-render-engine .live-bus-row:hover{
  transform: none !important;
  outline: none !important;
  cursor: default !important;
  filter: none !important;
  box-shadow: none !important;
}
html.avl-low-power-render-engine .kpi-pulse,
body.avl-low-power-render-engine .kpi-pulse,
html.avl-low-power-render-engine .bus-status-emphasis,
body.avl-low-power-render-engine .bus-status-emphasis,
html.avl-low-power-render-engine .pulse,
body.avl-low-power-render-engine .pulse,
html.avl-low-power-render-engine .glow,
body.avl-low-power-render-engine .glow{
  animation: none !important;
}
#avlPerfMonitor{
  position: fixed;
  right: 12px;
  bottom: 12px;
  z-index: 999999;
  font-family: system-ui, -apple-system, Segoe UI, sans-serif;
  color: #eaffff;
  pointer-events: auto;
}
#avlPerfMonitor .avl-perf-chip{
  border: 1px solid rgba(64,224,255,.55);
  border-radius: 999px;
  background: rgba(2, 20, 36, .92);
  color: #bff7ff;
  font-weight: 900;
  font-size: 11px;
  letter-spacing: .06em;
  padding: 7px 10px;
  cursor: pointer;
}
#avlPerfMonitor .avl-perf-body{
  display: none;
  margin-top: 6px;
  width: 265px;
  border: 1px solid rgba(64,224,255,.35);
  border-radius: 14px;
  background: rgba(2, 13, 26, .96);
  padding: 10px 12px;
  line-height: 1.55;
  font-size: 12px;
}
#avlPerfMonitor.open .avl-perf-body{ display: block; }
#avlPerfMonitor .warn{ color:#ffd166; font-weight:900; }
#avlPerfMonitor .muted{ color:#9fc4dc; }
body.avl-low-power-render-engine #avlPerfMonitor .avl-perf-chip,
body.avl-low-power-render-engine #avlPerfMonitor .avl-perf-body{ box-shadow:none!important; }


/* === OTF FIX: Performance monitor always visible v2 === */
#avlPerfMonitor{
  position:fixed!important;top:8px!important;right:160px!important;bottom:auto!important;left:auto!important;
  z-index:2147483647!important;display:block!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;
}
#avlPerfMonitor .avl-perf-chip{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;
  min-width:188px!important;height:30px!important;padding:0 12px!important;border-radius:999px!important;
  border:1px solid rgba(56,189,248,.85)!important;background:linear-gradient(180deg,rgba(8,47,73,.98),rgba(12,74,110,.94))!important;
  color:#e0faff!important;font-size:11px!important;line-height:1!important;font-weight:1000!important;letter-spacing:.035em!important;
  cursor:pointer!important;white-space:nowrap!important;
}
#avlPerfMonitor .avl-perf-body{position:absolute!important;top:36px!important;right:0!important;bottom:auto!important;width:292px!important;}
@media(max-width:1100px){#avlPerfMonitor{right:12px!important;top:48px!important;}#avlPerfMonitor .avl-perf-chip{min-width:145px!important;font-size:10px!important;}}
/* === /OTF FIX === */


/* === OTF SUPER LIGHT VISUAL MODE V1 ===
   Absolute minimum paint cost for weak laptops and screen sharing. */
html.perf-superlight *,
body.perf-superlight *,
html.avl-super-light-render-engine *,
body.avl-super-light-render-engine *{
  animation:none !important;
  transition:none !important;
  scroll-behavior:auto !important;
}
html.perf-superlight .bus-rect,
body.perf-superlight .bus-rect,
html.perf-superlight .bus-node,
body.perf-superlight .bus-node,
html.perf-superlight .bus-tag-rect,
body.perf-superlight .bus-tag-rect,
html.perf-superlight .bus-tag-text,
body.perf-superlight .bus-tag-text{
  filter:none !important;
  box-shadow:none !important;
  text-shadow:none !important;
}
html.perf-superlight .card,
body.perf-superlight .card,
html.perf-superlight .scenario-command-panel,
body.perf-superlight .scenario-command-panel,
html.perf-superlight .sim-clock-panel,
body.perf-superlight .sim-clock-panel,
html.perf-superlight #standHoldMonitor,
body.perf-superlight #standHoldMonitor,
html.perf-superlight .bus-command-dialog,
body.perf-superlight .bus-command-dialog,
html.perf-superlight .stand-hold-monitor,
body.perf-superlight .stand-hold-monitor,
html.perf-superlight .live-table-card,
body.perf-superlight .live-table-card,
html.perf-superlight .metric-card,
body.perf-superlight .metric-card{
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  box-shadow:none !important;
  filter:none !important;
}
html.perf-superlight .track-wrapper,
body.perf-superlight .track-wrapper,
html.perf-superlight .avl-map-shell,
body.perf-superlight .avl-map-shell,
html.perf-superlight .route-diagram,
body.perf-superlight .route-diagram{
  background:#eef3fb !important;
}
html.perf-superlight .track-wrapper::before,
html.perf-superlight .track-wrapper::after,
body.perf-superlight .track-wrapper::before,
body.perf-superlight .track-wrapper::after{
  display:none !important;
}
html.perf-superlight .stand-row:hover,
body.perf-superlight .stand-row:hover,
html.perf-superlight .stand-hold-row:hover,
body.perf-superlight .stand-hold-row:hover,
html.perf-superlight #standHoldMonitor tr:hover,
body.perf-superlight #standHoldMonitor tr:hover{
  transform:none !important;
  filter:none !important;
  box-shadow:none !important;
  background:inherit !important;
  cursor:default !important;
}
html.perf-superlight .headway-pill,
body.perf-superlight .headway-pill,
html.perf-superlight .headway-bar,
body.perf-superlight .headway-bar{
  animation:none !important;
  transition:none !important;
  filter:none !important;
}
html.perf-superlight .city-bg,
body.perf-superlight .city-bg,
html.perf-superlight .background-video,
body.perf-superlight .background-video,
html.perf-superlight video,
body.perf-superlight video{
  display:none !important;
}
html.perf-superlight #avlPerfMonitor,
body.perf-superlight #avlPerfMonitor{
  filter:none !important;
  box-shadow:none !important;
}


/* === OTF FIX: Move PERF monitor into table action row v1 === */
html body #avlPerfMonitor.avl-perf-inline-tabs{
  position:static!important;
  top:auto!important;right:auto!important;bottom:auto!important;left:auto!important;
  transform:none!important;
  z-index:90!important;
  margin:0 0 0 auto!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  align-self:center!important;
  flex:0 0 auto!important;
  order:999!important;
  pointer-events:auto!important;
}
html body #avlPerfMonitor.avl-perf-inline-tabs .avl-perf-chip{
  height:30px!important;
  min-width:210px!important;
  padding:0 13px!important;
  font-size:11px!important;
  box-shadow:none!important;
}
html body #avlPerfMonitor.avl-perf-inline-tabs .avl-perf-body{
  position:absolute!important;
  top:34px!important;
  right:0!important;
  bottom:auto!important;
  left:auto!important;
  width:292px!important;
}
html body .scenario-view-toggle{position:relative!important;}
@media(max-width:1100px){
  html body #avlPerfMonitor.avl-perf-inline-tabs{margin-left:6px!important;}
  html body #avlPerfMonitor.avl-perf-inline-tabs .avl-perf-chip{min-width:150px!important;font-size:10px!important;padding:0 9px!important;}
}
/* === /OTF FIX === */


/* === OTF FIX: SIMULATOR START/RESET INLINE WITH SIM CLOCK v1 ===
   Simulator mode only: move Start/Reset higher onto the same control row as Sim Clock. */
html body.simulator-layout .scenario-command-row{
  grid-template-columns:118px 150px 64px 104px 96px 154px minmax(172px,.92fr) minmax(147px,.875fr) 203px 190px !important;
  align-items:start !important;
}
html body.simulator-layout .embedded-sim-clock-slot{
  grid-column:9 !important;
  grid-row:1 !important;
  align-self:start !important;
}
html body.simulator-layout .scenario-command-actions{
  grid-column:10 !important;
  grid-row:1 !important;
  align-self:center !important;
  justify-self:start !important;
  width:190px !important;
  min-width:190px !important;
  max-width:190px !important;
  height:32px !important;
  min-height:32px !important;
  max-height:32px !important;
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  gap:7px !important;
  align-items:center !important;
  justify-content:flex-start !important;
  margin:0 !important;
  padding:0 !important;
  z-index:9 !important;
}
html body.simulator-layout .scenario-command-actions #togglePause{
  width:82px !important;
  min-width:82px !important;
  max-width:82px !important;
  height:28px !important;
  min-height:28px !important;
  max-height:28px !important;
}
html body.simulator-layout .scenario-command-actions #resetTest{
  width:96px !important;
  min-width:96px !important;
  max-width:96px !important;
  height:28px !important;
  min-height:28px !important;
  max-height:28px !important;
}
@media (max-width:1320px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px 140px 60px 94px 88px 144px minmax(150px,.90fr) minmax(120px,.77fr) 182px 174px !important;
    column-gap:5px !important;
  }
  html body.simulator-layout .scenario-command-actions{
    width:174px !important;
    min-width:174px !important;
    max-width:174px !important;
  }
  html body.simulator-layout .scenario-command-actions #togglePause{width:76px !important;min-width:76px !important;max-width:76px !important;}
  html body.simulator-layout .scenario-command-actions #resetTest{width:90px !important;min-width:90px !important;max-width:90px !important;}
}
@media (max-width:1100px){
  html body.simulator-layout .scenario-command-row{
    grid-template-columns:112px 130px 60px 96px 90px 142px 164px 143px !important;
  }
  html body.simulator-layout .embedded-sim-clock-slot{grid-column:7 !important;grid-row:2 !important;}
  html body.simulator-layout .scenario-command-actions{grid-column:8 !important;grid-row:2 !important;width:143px !important;min-width:143px !important;max-width:143px !important;}
}
/* === /OTF FIX === */


/* === OTF FINAL: SIMULATOR START/RESET DIRECTLY UNDER LIVE EWT v2 === */
html body.simulator-layout:not(.demo-clean-controls) .embedded-ewt-slot{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  gap:6px !important;
  overflow:visible !important;
}
html body.simulator-layout:not(.demo-clean-controls) .embedded-ewt-slot .scenario-command-actions.scenario-command-actions-under-ewt{
  position:static !important;
  grid-column:auto !important;
  grid-row:auto !important;
  order:2 !important;
  width:190px !important;
  min-width:190px !important;
  max-width:190px !important;
  height:30px !important;
  min-height:30px !important;
  max-height:30px !important;
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  margin:0 auto !important;
  padding:0 !important;
  transform:none !important;
  z-index:80 !important;
}
html body.simulator-layout:not(.demo-clean-controls) .embedded-ewt-slot .scenario-command-actions.scenario-command-actions-under-ewt #togglePause,
html body.simulator-layout:not(.demo-clean-controls) .embedded-ewt-slot .scenario-command-actions.scenario-command-actions-under-ewt #resetTest{
  height:28px !important;
  min-height:28px !important;
  max-height:28px !important;
  margin:0 !important;
  line-height:1 !important;
}
html body.simulator-layout:not(.demo-clean-controls) .embedded-ewt-slot .scenario-command-actions.scenario-command-actions-under-ewt #togglePause{
  width:82px !important;
  min-width:82px !important;
  max-width:82px !important;
}
html body.simulator-layout:not(.demo-clean-controls) .embedded-ewt-slot .scenario-command-actions.scenario-command-actions-under-ewt #resetTest{
  width:96px !important;
  min-width:96px !important;
  max-width:96px !important;
}
@media (max-width:1600px){
  html body.simulator-layout:not(.demo-clean-controls) .embedded-ewt-slot .scenario-command-actions.scenario-command-actions-under-ewt{
    width:174px !important;
    min-width:174px !important;
    max-width:174px !important;
    gap:6px !important;
  }
  html body.simulator-layout:not(.demo-clean-controls) .embedded-ewt-slot .scenario-command-actions.scenario-command-actions-under-ewt #togglePause{width:76px !important;min-width:76px !important;max-width:76px !important;}
  html body.simulator-layout:not(.demo-clean-controls) .embedded-ewt-slot .scenario-command-actions.scenario-command-actions-under-ewt #resetTest{width:90px !important;min-width:90px !important;max-width:90px !important;}
}
/* === /OTF FINAL === */

/* === OTF FINAL FIX: SIMULATOR SIM CLOCK TINY HIGHER v1 ===
   Simulator mode only. Moves Sim Clock slightly up so it clears the legend/route area. */
html body.simulator-layout:not(.demo-clean-controls) .embedded-sim-clock-slot{
  top:112px !important;
}
@media (max-width:1600px){
  html body.simulator-layout:not(.demo-clean-controls) .embedded-sim-clock-slot{
    top:112px !important;
  }
}
@media (max-width:1360px){
  html body.simulator-layout:not(.demo-clean-controls) .embedded-sim-clock-slot{
    top:108px !important;
  }
}
/* === /OTF FINAL FIX === */