/* 第 14 輪 E 線：穿線服務區 */
.rs-wrap { padding: 4px 2px 12px; }
.rs-steps { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-bottom: 10px; }
.rs-steps span { padding: 4px 10px; border-radius: 999px; background: #ece8f8; color: #6b6590; font-weight: 800; font-size: 13px; }
.rs-steps span.on { background: #4a3fc4; color: #fff; }
.rs-steps .rs-coins { margin-left: auto; background: none; color: inherit; display: inline-flex; gap: 4px; align-items: center; }
.rs-rks, .rs-lns { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.rs-lns { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); }
.rs-rk, .rs-ln { text-align: left; border: 2px solid #d8d2ee; background: #fff; border-radius: 12px; padding: 10px; min-height: 64px; cursor: pointer; font: inherit; color: inherit; display: flex; flex-direction: column; gap: 4px; }
.rs-rk.on, .rs-ln.on, .rs-rk:hover, .rs-ln:hover { border-color: #4a3fc4; background: #f4f1ff; }
.rs-rk em { font-style: normal; font-size: 11px; background: #ffe28a; border-radius: 6px; padding: 0 6px; align-self: flex-start; }
.rs-rk small, .rs-ln small { color: #6b6590; font-size: 12.5px; line-height: 1.35; }
.rs-ln header, .rs-t header { display: flex; justify-content: space-between; align-items: baseline; gap: 6px; }
.rs-price { font-weight: 900; color: #b8860b; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rs-chip { align-self: flex-start; font-size: 12px; font-weight: 800; padding: 1px 8px; border-radius: 999px; }
.rs-fresh { background: #e3f6e9; color: #1b7a47; } .rs-half { background: #fff1cf; color: #9a6a00; } .rs-dead { background: #fde0e0; color: #b02a2a; }
.rs-bar { display: grid; grid-template-columns: 5.2em 1fr 2.4em; gap: 6px; align-items: center; font-size: 12.5px; }
.rs-bar i { height: 8px; background: #ece8f8; border-radius: 4px; overflow: hidden; display: block; } .rs-bar u { display: block; height: 100%; background: #4a3fc4; border-radius: 4px; }
.rs-bar b { text-align: right; font-variant-numeric: tabular-nums; } .rs-bar b.up { color: #1b9a4a; }
.rs-nav { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; } .rs-nav .gw-btn { min-height: 44px; min-width: 88px; }
.rs-slider { display: flex; align-items: center; gap: 8px; padding: 8px 0 6px; } .rs-trk { position: relative; flex: 1; padding: 0; } .rs-pm { min-width: 48px; min-height: 48px; font-size: 22px; padding: 0; } .rs-slider input { width: 100%; position: relative; z-index: 1; height: 32px; }
.rs-rec { position: absolute; top: 0; height: 32px; background: rgba(60, 190, 110, .28); border-radius: 6px; pointer-events: none; }
.rs-tv { font-size: 15px; } .rs-tv b { font-size: 30px; font-variant-numeric: tabular-nums; }
.rs-hint { display: flex; justify-content: space-between; gap: 10px; font-size: 12px; color: #6b6590; }
.rs-prev { margin: 10px 0; padding: 10px; background: #f4f1ff; border-radius: 12px; display: grid; gap: 6px; } .rs-prev h4 { margin: 0; }
.rs-prev .rs-bar { grid-template-columns: 9.5em 1fr 4em; }
.rs-warn { color: #b02a2a; font-weight: 800; margin: 2px 0 0; } .rs-ok { color: #1b7a47; font-weight: 800; margin: 2px 0 0; }
.rs-anim { text-align: center; } .rs-anim canvas { max-width: 70%; height: auto; background: #fafaf4; border-radius: 12px; }
.rs-st { margin-top: 10px; } .rs-strow { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; padding: 6px 0; border-bottom: 1px solid #eee; } .rs-strow small { flex-basis: 100%; color: #1b9a4a; }
.rs-strow em { font-style: normal; font-size: 11px; background: #ffe28a; border-radius: 6px; padding: 0 6px; }
@media (max-width: 480px) { .rs-lns, .rs-rks { grid-template-columns: 1fr 1fr; } .rs-lns { grid-template-columns: 1fr; } .rs-prev .rs-bar { grid-template-columns: 7.5em 1fr 3.6em; } }