/* 13 晕车防治指南 · 湖蓝 + 座位舱图；三段行程时间轴、交通方式图标 */
.ms { --a:#1d7188; --a2:#124f60; --asoft:#e2f1f5; }
:root[data-theme="dark"] .ms { --a:#75c8dc; --a2:#9adcea; --asoft:#123039; }
.ms-hero-grid { display:grid; grid-template-columns:.84fr 1.16fr; }
.ms-intro { background:linear-gradient(180deg,var(--card),var(--card2)); }
.ms-modes { display:grid; grid-template-columns:repeat(5,1fr); gap:6px; margin-top:24px; }
.ms-modes button { display:grid; place-items:center; gap:4px; padding:10px 2px; font-size:20px; background:var(--card2); border:1px solid var(--line2); border-radius:10px; cursor:pointer; }
.ms-modes button small { font-family:var(--fb); font-size:11px; color:var(--ink2); }
.ms-modes button.is-on { border-color:var(--a); background:var(--asoft); box-shadow:inset 0 0 0 1px var(--a); }
.ms-seat { padding:28px 30px; border-left:1px solid var(--line); background:var(--card); }
.ms-seat-hd { display:flex; align-items:baseline; justify-content:space-between; border-bottom:2px solid var(--a2); padding-bottom:10px; margin-bottom:14px; }
.ms-seat-hd b { font-family:var(--fd); font-size:19px; }
.ms-seat-hd span { font-family:var(--fm); font-size:11px; color:var(--a); }
.ms-cabin { background:var(--card2); border:1px solid var(--line); border-radius:16px; padding:12px 16px 14px; margin-bottom:16px; }
.ms-cabin-front { text-align:center; font-family:var(--fm); font-size:10.5px; letter-spacing:.1em; color:var(--muted); padding-bottom:9px; }
.ms-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; max-width:340px; margin:0 auto; }
.ms-grid button { aspect-ratio:1.35/1; border-radius:9px 9px 5px 5px; border:1px solid var(--line2); background:var(--card); color:var(--ink2); font-family:var(--fm); font-size:10.5px; cursor:pointer; position:relative; }
.ms-grid button:hover { border-color:var(--a); }
.ms-grid button.is-on { background:var(--a); border-color:var(--a); color:#fff; }
.ms-grid button.is-good::after { content:'·'; position:absolute; right:6px; top:0; font-size:18px; color:var(--ok); }
.ms-grid button.is-on.is-good::after { color:#fff; }
.ms-cabin-note { text-align:center; font-size:11.5px; color:var(--muted); line-height:1.7; margin-top:11px; }
.ms-row2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:12px; }
.ms-seat .h17-note b { color:var(--a2); }

.ms-timeline { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.ms-phase { position:relative; background:var(--card); border:1px solid var(--line); border-top:4px solid var(--a); border-radius:0 0 14px 14px; padding:18px; }
.ms-phase:nth-child(2) { border-top-color:#c39a45; } .ms-phase:nth-child(3) { border-top-color:var(--ok); }
.ms-phase span { font-family:var(--fm); font-size:10px; letter-spacing:.12em; color:var(--muted); }
.ms-phase b { display:block; font-family:var(--fd); font-size:18px; margin:6px 0 9px; }
.ms-phase ul { margin:0; padding-left:17px; }
.ms-phase li { font-size:12.5px; line-height:1.85; color:var(--ink2); margin-bottom:4px; }
.ms-summary-card { margin-top:14px; }
.ms-summary-card h3 { font-size:18px; margin-bottom:10px; }
.ms-summary { background:var(--card2); border-left:3px solid var(--a); border-radius:0 10px 10px 0; padding:12px 16px; font-size:14px; line-height:2; color:var(--ink2); }
.ms .h17-bench-in { border-top:4px solid var(--a); }
@media (max-width:900px){
    .ms-hero-grid,.ms-row2,.ms-timeline { grid-template-columns:1fr; }
    .ms-seat { border-left:0; border-top:1px solid var(--line); padding:24px 20px; }
    .ms-modes { grid-template-columns:repeat(3,1fr); }
}