[hidden]{display:none!important}.period-nav{display:flex;justify-content:space-around;gap:12px;padding:20px;background:white}.period-nav button{border:0;border-radius:12px;background:#fff;color:#596277;box-shadow:0 0 12px #e9effd;padding:13px 25px;font-size:16px;font-weight:600;cursor:pointer}.period-nav button[aria-pressed=true]{background:#507cff;color:white}.period-nav button:focus-visible{outline:3px solid #254dad;outline-offset:3px}.period-panel{margin:16px;padding:16px;background:#fff;border-radius:14px;color:#44536b}.period-panel h2{font-size:18px;font-weight:500}.period-status{min-height:2em;color:#66758a;font-size:14px}.road-stats{text-align:center;font-size:20px;padding:8px 0 20px}.period-grid{--cell:56px;display:flex;overflow-x:auto;width:100%;border-radius:10px;box-shadow:0 0 12px #e8eff8;scrollbar-color:#447fff #edf3ff;scrollbar-width:auto;margin:0 0 24px;background:#fff}.road-column{flex:0 0 var(--cell);border-right:1px solid #c1c1c1;box-sizing:border-box}.road-cell{width:100%;height:var(--cell);display:flex;align-items:center;justify-content:center;border-bottom:1px solid #c1c1c1;box-sizing:border-box}.road-cell:last-child{border-bottom:0}.road-dot{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;color:#fff;font-size:17px;font-weight:500}.road-dot.odd{background:#ff3636}.road-dot.even{background:#24b3a2}.road-next{background:#f0e5eb}.road-countdown{font-size:15px;color:#447fff;font-weight:600}.period-scroll{overflow:auto;max-height:650px}.period-panel table{border-collapse:collapse;width:100%;font-size:14px}.period-panel th{background:#91a1bd;color:white;position:sticky;top:0}.period-panel th,.period-panel td{text-align:left;padding:14px;border-bottom:1px solid #e4ebf5;white-space:nowrap}.period-panel td:nth-child(2){font-family:monospace}.period-panel tbody tr:nth-child(even){background:#e2f1ff}@media(max-width:600px){.period-panel{margin:8px;padding:10px}.period-grid{--cell:44px}.road-dot{width:32px;height:32px;font-size:15px}.period-nav{padding:12px;gap:8px}.period-nav button{padding:10px 18px}}

/* Match the existing 20-block view at desktop and mobile sizes. */
.period-panel{margin:0 16px 10px;padding:10px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,sans-serif}
.period-panel h2{font-size:16px;margin:8px 0;font-weight:600}
.period-status{font-size:12px;min-height:18px;margin:6px 0 10px}
.road-stats{font-size:12px;font-weight:600;line-height:30px;padding:0;margin:0 0 10px;height:30px}
.period-grid{--cell:42px;margin:0 0 20px;padding:0}
.road-dot{width:30px;height:30px;font-size:12px}
.road-countdown{font-size:12px}
.period-panel table{table-layout:fixed;font-size:12px}
.period-panel th{height:46px}
.period-panel td{height:44px}
.period-panel th,.period-panel td{padding:4px 10px;box-sizing:border-box;overflow:hidden;text-overflow:ellipsis}
.period-panel th:first-child,.period-panel td:first-child{width:120px}
.period-panel th:nth-child(3),.period-panel td:nth-child(3){width:100px}
.period-panel th:last-child,.period-panel td:last-child{width:130px;white-space:normal}
.period-panel td:nth-child(2){font-family:monospace;cursor:help}
@media(max-width:600px){.period-panel{margin:0 16px 10px;padding:10px}.period-grid{--cell:42px}.road-dot{width:30px;height:30px;font-size:12px}.period-panel table{font-size:11px}.period-panel th,.period-panel td{padding:4px}.period-panel th:first-child,.period-panel td:first-child{width:25%}.period-panel th:nth-child(2),.period-panel td:nth-child(2){width:35%}.period-panel th:nth-child(3),.period-panel td:nth-child(3){width:15%}.period-panel th:last-child,.period-panel td:last-child{width:25%}}

.road-column{border-right:0}.road-cell{width:42px;border-right:1px solid #c1c1c1}

/* Shared visual treatment with the original 20-block statistics. */
#app .header .logo{display:none!important}
.road-stats{display:flex;align-items:center;justify-content:center;gap:24px;color:#333;font-size:12px;font-weight:600;line-height:normal;height:30px;padding:0;margin:0 0 10px}
.road-stat{display:flex;align-items:center;gap:10px}
.road-stat-dot{display:flex;align-items:center;justify-content:center;width:30px;height:30px;flex:0 0 30px;border-radius:50%;color:#fff;font-size:12px;box-sizing:border-box}
.road-stat-dot.odd{background:#ff3636}.road-stat-dot.even{background:#24b3a2}

/* Reference tab metrics: 12px / 700, 70x34 CSS pixels. */
.period-nav button{font-family:"Helvetica Neue",Arial,sans-serif;font-size:12px;font-weight:700;width:70px;height:34px;min-width:70px;flex:0 0 70px;padding:0;border-radius:8px;line-height:normal;box-sizing:border-box}