
.eh-trains {
    --eh-border: #d9dde3;
    --eh-soft: #f4f6f8;
    --eh-text: #14181f;
    --eh-muted: #667085;
    --eh-good: #18794e;
    --eh-warn: #9a6700;
    --eh-bad: #b42318;
    width: 100%;
    color: var(--eh-text);
    background: #fff;
    border: 1px solid var(--eh-border);
    border-radius: 14px;
    overflow: hidden;
    box-sizing: border-box;
    font-family: inherit;
}
.eh-trains * { box-sizing: border-box; }
.eh-trains-header {
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
    padding:22px 24px 18px;
}
.eh-trains-header h2 {
    margin:0;
    font-size:clamp(1.55rem, 4vw, 2.2rem);
    line-height:1.1;
}
.eh-trains-kicker {
    margin:0 0 6px;
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.12em;
    color:var(--eh-muted);
}
.eh-trains-subtitle {
    margin:6px 0 0;
    color:var(--eh-muted);
}
.eh-trains-live {
    white-space:nowrap;
    font-weight:700;
    font-size:.9rem;
    display:flex;
    align-items:center;
    gap:7px;
}
.eh-live-dot {
    width:9px;
    height:9px;
    display:inline-block;
    border-radius:50%;
    background:#16a34a;
    box-shadow:0 0 0 4px rgba(22,163,74,.12);
}
.eh-trains-tabs {
    display:flex;
    border-top:1px solid var(--eh-border);
    border-bottom:1px solid var(--eh-border);
    background:var(--eh-soft);
}
.eh-tab {
    appearance:none;
    border:0;
    border-right:1px solid var(--eh-border);
    background:transparent;
    padding:13px 24px;
    cursor:pointer;
    font:inherit;
    font-weight:700;
    color:var(--eh-muted);
}
.eh-tab.is-active {
    background:#fff;
    color:var(--eh-text);
    box-shadow:inset 0 -3px 0 currentColor;
}
.eh-board[hidden] { display:none !important; }
.eh-disruption {
    margin:16px 20px 0;
    padding:12px 14px;
    border-radius:8px;
    background:#fff7ed;
    border:1px solid #fed7aa;
    font-size:.92rem;
}
.eh-train-table { width:100%; }
.eh-train-row {
    display:grid;
    grid-template-columns:90px minmax(180px, 1fr) 90px minmax(135px, .7fr);
    gap:16px;
    align-items:center;
    padding:14px 24px;
    border-bottom:1px solid var(--eh-border);
}
.eh-train-head {
    padding-top:10px;
    padding-bottom:10px;
    background:#fafbfc;
    color:var(--eh-muted);
    font-size:.76rem;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.06em;
}
.eh-time {
    font-size:1.3rem;
    font-weight:800;
    font-variant-numeric:tabular-nums;
}
.eh-place {
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:3px;
}
.eh-place strong {
    font-size:1rem;
}
.eh-place small {
    color:var(--eh-muted);
}
.eh-place .eh-reason {
    color:var(--eh-bad);
}
.eh-platform { font-weight:700; }
.eh-status { font-weight:700; }
.eh-status.is-on-time { color:var(--eh-good); }
.eh-status.is-delayed { color:var(--eh-warn); }
.eh-status.is-cancelled { color:var(--eh-bad); }
.eh-board-message {
    padding:28px 24px;
    text-align:center;
    color:var(--eh-muted);
}
.eh-board-error { color:var(--eh-bad); }
.eh-debug {
    display:block;
    margin-top:6px;
    color:var(--eh-muted);
}
.eh-trains-footer {
    display:flex;
    justify-content:space-between;
    gap:15px;
    flex-wrap:wrap;
    padding:11px 24px;
    background:var(--eh-soft);
    color:var(--eh-muted);
    font-size:.78rem;
}
.eh-trains-error {
    padding:16px;
    border-color:#fecaca;
    background:#fff1f2;
    color:#991b1b;
}

@media (max-width: 700px) {
    .eh-trains-header { padding:18px 16px 14px; }
    .eh-tab { flex:1; padding:12px 14px; }
    .eh-train-head { display:none; }
    .eh-train-row {
        grid-template-columns:70px 1fr;
        grid-template-areas:
            "time place"
            "platform status";
        gap:7px 12px;
        padding:14px 16px;
    }
    .eh-time { grid-area:time; align-self:start; }
    .eh-place { grid-area:place; }
    .eh-platform { grid-area:platform; color:var(--eh-muted); font-size:.86rem; }
    .eh-platform::before { content:"Platform "; }
    .eh-status { grid-area:status; font-size:.9rem; }
    .eh-trains-footer { padding:10px 16px; }
}


.eh-tab.is-hidden { display:none !important; }
.eh-replacement-row { background:#fffdf5; }
.eh-replacement-label {
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.04em;
    font-size:.68rem;
}
.eh-bus-platform {
    display:inline-flex;
    align-items:center;
    width:max-content;
    padding:3px 8px;
    border-radius:999px;
    background:#f2f4f7;
    font-size:.82rem;
}
@media (max-width:700px) {
    .eh-bus-platform::before { content:""; }
}


/* Rail disruption page */
.eh-disruptions-wrap .eh-trains-header { border-bottom:1px solid var(--eh-border); }
.eh-disruption-clear {
    display:flex;
    gap:16px;
    align-items:flex-start;
    padding:28px 24px;
    background:#f0fdf4;
}
.eh-disruption-clear-icon {
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:34px;
    height:34px;
    border-radius:50%;
    background:#dcfce7;
    color:var(--eh-good);
    font-size:1.2rem;
    font-weight:900;
}
.eh-disruption-clear strong { display:block; font-size:1.05rem; }
.eh-disruption-clear p { margin:5px 0 0; color:var(--eh-muted); }
.eh-disruption-list { padding:18px; background:#f8fafc; }
.eh-disruption-card {
    margin:0 0 16px;
    padding:20px;
    border:1px solid var(--eh-border);
    border-radius:12px;
    background:#fff;
}
.eh-disruption-card:last-child { margin-bottom:0; }
.eh-disruption-card h3 { margin:7px 0 0; font-size:1.2rem; line-height:1.3; }
.eh-disruption-tags { display:flex; flex-wrap:wrap; gap:7px; }
.eh-disruption-tag {
    display:inline-flex;
    padding:4px 8px;
    border-radius:999px;
    background:#fff7ed;
    color:#9a3412;
    font-size:.72rem;
    font-weight:800;
}
.eh-disruption-tag-muted { background:#f2f4f7; color:#475467; }
.eh-disruption-description { margin-top:14px; line-height:1.55; }
.eh-disruption-description p:first-child { margin-top:0; }
.eh-disruption-description p:last-child { margin-bottom:0; }
.eh-disruption-meta {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px 18px;
    margin-top:18px;
    padding-top:15px;
    border-top:1px solid var(--eh-border);
}
.eh-disruption-meta > div { display:flex; flex-direction:column; gap:2px; }
.eh-disruption-meta strong { font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--eh-muted); }
.eh-disruption-meta span { font-size:.9rem; }
@media (max-width:700px) {
    .eh-disruption-list { padding:12px; }
    .eh-disruption-card { padding:16px; }
    .eh-disruption-meta { grid-template-columns:1fr; }
    .eh-disruption-clear { padding:22px 16px; }
}


/* v1.4.2 planned engineering */
.eh-planned-engineering{
    display:flex;
    gap:12px;
    align-items:flex-start;
    margin:0 0 12px;
    padding:12px 14px;
    border:1px solid #d5a63a;
    border-left:5px solid #d5a63a;
    background:#fff9e9;
    border-radius:6px;
}
.eh-planned-engineering-badge{
    flex:0 0 auto;
    padding:4px 7px;
    border-radius:4px;
    background:#6f5200;
    color:#fff;
    font-size:10px;
    font-weight:800;
    letter-spacing:.05em;
}
.eh-planned-engineering-copy{
    min-width:0;
}
.eh-planned-engineering-copy strong,
.eh-planned-engineering-copy span,
.eh-planned-engineering-copy a{
    display:block;
}
.eh-planned-engineering-copy strong{
    font-size:14px;
    line-height:1.35;
}
.eh-planned-engineering-copy span{
    margin-top:4px;
    color:#56514a;
    font-size:12px;
    line-height:1.45;
}
.eh-planned-engineering-copy a{
    margin-top:5px;
    font-size:11px;
    font-weight:700;
}
.eh-service-alteration{
    display:block;
    margin-top:6px;
    padding:5px 7px;
    border-left:3px solid #d5a63a;
    background:#fff9e9;
    color:#5b4700;
    font-size:10px;
    line-height:1.4;
}
.eh-service-alteration strong{
    display:inline;
    font-size:9px;
    letter-spacing:.04em;
}
@media(max-width:700px){
    .eh-planned-engineering{display:block}
    .eh-planned-engineering-badge{display:inline-block;margin-bottom:7px}
}


/* v1.4.3 consistency + replacement bus + wider network */
.eh-board-engineering-strip{
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto auto;
    gap:8px 12px;
    align-items:center;
    margin:0 0 10px;
    padding:9px 11px;
    border-left:4px solid #d5a63a;
    background:#fff9e9;
    font-size:12px;
}
.eh-board-engineering-strip>strong{
    font-size:10px;
    letter-spacing:.05em;
    color:#6f5200;
}
.eh-board-engineering-strip>span{
    min-width:0;
    font-weight:700;
}
.eh-board-engineering-strip>small{
    color:#6a6254;
}
.eh-board-engineering-strip>a{
    font-weight:700;
    white-space:nowrap;
}
.eh-replacement-advisories{
    display:grid;
    gap:10px;
    margin:0 0 12px;
}
.eh-replacement-advisory{
    padding:13px 14px;
    border:1px solid #d5a63a;
    border-left:5px solid #d5a63a;
    background:#fff9e9;
    border-radius:6px;
}
.eh-replacement-advisory-label{
    display:inline-block;
    margin:0 0 5px;
    padding:3px 6px;
    border-radius:3px;
    background:#6f5200;
    color:#fff;
    font-size:9px;
    font-weight:800;
    letter-spacing:.06em;
}
.eh-replacement-advisory h3{
    margin:0 0 6px;
    font-size:16px;
    line-height:1.3;
}
.eh-replacement-advisory p{
    margin:5px 0 0;
    font-size:12px;
    line-height:1.5;
}
.eh-replacement-route{
    color:#4e4a42;
}
.eh-wider-engineering{
    margin-top:22px;
    padding-top:18px;
    border-top:1px solid #ddd;
}
.eh-wider-engineering-head h3{
    margin:2px 0 4px;
}
.eh-wider-engineering-head p:last-child{
    margin:0 0 12px;
    color:#64676b;
    font-size:12px;
    line-height:1.5;
}
.eh-wider-engineering-list{
    display:grid;
    gap:7px;
}
.eh-wider-engineering-item{
    display:grid;
    grid-template-columns:150px minmax(0,1fr);
    gap:12px;
    align-items:start;
    padding:10px 12px;
    border:1px solid #ddd;
    border-radius:5px;
    background:#fff;
    text-decoration:none;
}
.eh-wider-engineering-item:hover{
    background:#f7f7f7;
}
.eh-wider-engineering-item span{
    font-size:9px;
    font-weight:800;
    letter-spacing:.05em;
    color:#6f5200;
}
.eh-wider-engineering-item strong{
    color:#111;
    font-size:12px;
    line-height:1.4;
}
@media(max-width:700px){
    .eh-board-engineering-strip{
        grid-template-columns:1fr auto;
    }
    .eh-board-engineering-strip>strong,
    .eh-board-engineering-strip>span{
        grid-column:1 / -1;
    }
    .eh-wider-engineering-item{
        grid-template-columns:1fr;
        gap:4px;
    }
}


/* v1.4.4 fail-closed reliability */
.eh-status-verified,
.eh-status-unverified{
    display:flex;
    gap:10px;
    align-items:flex-start;
    margin:0 0 14px;
    padding:10px 12px;
    border-radius:5px;
    font-size:12px;
    line-height:1.45;
}
.eh-status-verified{
    border:1px solid #8fc79d;
    background:#f1faf3;
}
.eh-status-unverified{
    border:1px solid #d5a63a;
    background:#fff9e9;
}
.eh-status-verified strong,
.eh-status-unverified strong{
    flex:0 0 auto;
    font-size:10px;
    letter-spacing:.05em;
}
.eh-status-verified strong{color:#215d32}
.eh-status-unverified strong{color:#6f5200}
.eh-disruption-unknown{
    padding:14px;
    border:1px solid #d5a63a;
    border-left:5px solid #d5a63a;
    background:#fff9e9;
    border-radius:6px;
}
.eh-disruption-unknown strong{
    display:block;
    margin-bottom:4px;
}
.eh-disruption-unknown p{
    margin:0;
    font-size:12px;
    line-height:1.5;
}
.eh-board-warning{
    border-left:4px solid #d5a63a;
    background:#fff9e9;
}
.eh-supplementary-label{
    margin:0 0 6px;
    font-size:9px;
    font-weight:800;
    letter-spacing:.06em;
    color:#6f5200;
}
.eh-disruption-card.is-supplementary{
    border-style:dashed;
}
.eh-wider-structured{
    margin-top:22px;
    padding-top:18px;
    border-top:1px solid #ddd;
}
.eh-wider-structured-card{
    border-left:4px solid #4f6375;
}
@media(max-width:700px){
    .eh-status-verified,
    .eh-status-unverified{
        display:block;
    }
    .eh-status-verified strong,
    .eh-status-unverified strong{
        display:block;
        margin-bottom:4px;
    }
}


/* v1.4.5 replacement-route scoping */
.eh-replacement-scope{display:flex;gap:10px;align-items:flex-start;margin:0 0 10px;padding:9px 11px;border:1px solid #d9dde1;background:#f7f8f9;border-radius:5px;font-size:11px;line-height:1.45}.eh-replacement-scope strong{flex:0 0 auto;font-size:10px;letter-spacing:.04em}@media(max-width:700px){.eh-replacement-scope{display:block}.eh-replacement-scope strong{display:block;margin-bottom:4px}}
