body{background:radial-gradient(circle at 50% -20%,#143426 0,#081510 38rem);min-height:100vh}
main{max-width:1180px;padding:16px 24px 34px}
.masthead{align-items:center;padding:0 2px 14px;border-bottom:1px solid rgba(143,194,168,.16)}
.brand{display:flex;align-items:center;gap:12px}
.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:linear-gradient(145deg,var(--accent),#5eb875);color:#0a1a12;font-size:.76rem;font-weight:950;letter-spacing:.04em;box-shadow:0 8px 24px rgba(100,203,119,.17)}
.masthead .kicker{margin-bottom:2px;font-size:.63rem}.masthead h1{font-size:1.32rem;line-height:1.05;margin:0}.masthead #place{font-size:.75rem;margin:3px 0 0}.clock strong{font-size:1.65rem;line-height:1;font-weight:760}.clock span{display:block;margin-top:3px;font-size:.69rem}
.hero{padding:13px;margin:14px 0 26px;border-color:rgba(144,211,173,.25);background:linear-gradient(135deg,rgba(26,64,47,.86),rgba(11,30,22,.92));box-shadow:0 14px 40px rgba(0,0,0,.15)}
.hero-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 2px 9px}.hero-heading .kicker{margin:0}.notice{margin:0;padding:4px 9px;border:1px solid rgba(139,192,164,.16);background:rgba(4,17,11,.48);font-size:.7rem}
.direction-board{gap:10px}.direction-card{min-height:92px;grid-template-columns:46px 66px minmax(0,1fr) auto;gap:10px;padding:12px 14px;border-color:rgba(151,205,176,.19);background:rgba(6,23,15,.67);box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}.direction-card.london{border-left:3px solid var(--yellow)}.direction-card.stratford{border-left:3px solid var(--blue)}.direction-card .direction-arrow{font-size:2.75rem}.direction-count strong{font-size:2.6rem;letter-spacing:-.06em}.direction-service p{font-size:.63rem}.direction-service strong{font-size:1.02rem}.direction-service span{font-size:.79rem}.direction-service small{font-size:.69rem}
.spot-button{appearance:none;border:1px solid rgba(169,227,75,.52);border-radius:9px;background:rgba(169,227,75,.1);color:var(--accent);padding:8px 11px;font:inherit;font-size:.72rem;font-weight:850;cursor:pointer;transition:background .15s ease,border-color .15s ease,transform .15s ease}.spot-button:hover{background:rgba(169,227,75,.2);border-color:var(--accent);transform:translateY(-1px)}.spot-button:disabled{cursor:default;opacity:.7;transform:none}.train-card-main{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch}.list-spot{align-self:center;margin-right:13px}.spotted-row{background:rgba(169,227,75,.055)}.spotted-row time{color:var(--accent)}.spotted-badge{background:rgba(169,227,75,.08)}
.section-title{margin-bottom:9px}.section-title .kicker{font-size:.66rem;margin-bottom:3px}.section-title h2{font-size:1.2rem}.rows{border-color:rgba(132,187,158,.25);box-shadow:0 12px 34px rgba(0,0,0,.1)}.train-summary{padding:11px 16px;grid-template-columns:52px 96px minmax(220px,1fr) 140px 24px}.train-summary .direction-arrow{font-size:2.35rem}.train-summary time{font-size:1.08rem}.summary-copy strong{font-size:.92rem}.summary-copy span,.summary-meta span{font-size:.79rem}.calibration{border-radius:0 10px 10px 0}
@media(max-width:700px){main{padding:12px 12px 28px}.masthead{padding-bottom:11px}.brand{gap:9px}.brand-mark{width:32px;height:32px;border-radius:8px}.masthead h1{font-size:1.08rem}.masthead #place{font-size:.68rem}.clock strong{font-size:1.15rem}.clock span{max-width:145px;font-size:.62rem}.hero{padding:10px;margin:11px 0 22px}.hero-heading{margin-bottom:8px}.hero-heading .notice{max-width:55%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.direction-board{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.direction-card{min-height:134px;grid-template-columns:34px minmax(0,1fr);grid-template-rows:auto auto auto;padding:10px;gap:4px 7px}.direction-card .direction-arrow{grid-row:1/3;font-size:2rem}.direction-count strong{font-size:2.05rem}.direction-service{grid-column:2}.direction-service span{white-space:normal;font-size:.7rem;line-height:1.25}.direction-service small{font-size:.63rem}.direction-card>.spot-button{grid-column:1/3;width:100%;padding:6px}.train-card-main{grid-template-columns:minmax(0,1fr) 68px;min-width:0}.train-summary{min-width:0;padding:9px 6px 9px 9px;grid-template-columns:38px 76px minmax(0,1fr);gap:7px}.train-summary .expand-mark{display:none}.summary-copy span{display:none}.summary-copy strong{white-space:normal;line-height:1.08}.list-spot{width:62px;margin:8px 6px 8px 0;padding:6px 3px;font-size:.63rem}.section-title h2{font-size:1.06rem}}
@media(max-width:430px){.masthead #place{display:none}.clock span{max-width:120px}.direction-card{grid-template-columns:28px minmax(0,1fr)}.direction-card .direction-arrow{font-size:1.75rem}.direction-count strong{font-size:1.85rem}.direction-service strong{font-size:.91rem}.direction-service p{letter-spacing:.04em}}