/* The athlete's story, /traveler/story/ (traveler_story.js), on top of story.css. Every rule sits under .explainer.x-trav.
   The career chart: one mark per country that holds a piece of his record. Desktop draws the SVG; at 820 px and below the
   same facts show as a table, and at 700 px and below (screen) as one card per stop; print always gets the table. */
.explainer.x-trav{border-top:0}
.explainer.x-trav .x-hero h1{font:700 40px/1.1 Inter,system-ui,sans-serif;letter-spacing:-.015em;margin:10px 0 12px;text-wrap:balance}
.explainer.x-trav .x-lede{font:400 17px/1.55 Inter,system-ui,sans-serif;color:var(--x-g7);margin:0 0 12px;max-width:40em}
.explainer.x-trav .x-txt h2{font:700 30px/1.15 Inter,system-ui,sans-serif;margin:6px 0 14px;text-wrap:balance}
.explainer.x-trav .x-data:has(.x-tcareer){max-width:1072px}
.explainer.x-trav .x-tlegend{list-style:none;padding:0;margin:12px 0 0;display:flex;flex-wrap:wrap;gap:8px 18px;font:13px/1.45 Inter,system-ui,sans-serif;color:var(--x-g7)}
.explainer.x-trav .x-mk{display:inline-block;width:14px;height:14px;margin-right:6px;vertical-align:-2px;box-sizing:border-box}
.explainer.x-trav .x-mk-see{background:var(--x-ink)}.explainer.x-trav .x-mk-later{border:2px solid var(--x-ink);border-radius:50%}.explainer.x-trav .x-mk-other{border:2px dashed var(--x-ink)}.explainer.x-trav .x-mk-plan{border:1px solid #4B5563;background:#E5E7EB;border-radius:50%}
.explainer.x-trav .x-mk-x{color:#4B5563;margin-right:6px}
.explainer.x-trav .x-ttable{display:none}.explainer.x-trav .x-tcards{display:none}
.explainer.x-trav .x-ttab{border-collapse:collapse;width:100%;font:13px/1.4 Inter,system-ui,sans-serif}
.explainer.x-trav .x-ttab caption{text-align:left;font:600 12px/1.3 Inter,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--x-g5);padding:0 0 8px}
.explainer.x-trav .x-ttab th,.explainer.x-trav .x-ttab td{border-bottom:1px solid #E7E1D6;padding:5px 6px 5px 0;text-align:left;vertical-align:top;font-weight:400}
.explainer.x-trav .x-ttab thead th{font:400 11px "JetBrains Mono",ui-monospace,monospace;color:var(--x-g5)}
.explainer.x-trav .x-tcard{border-top:1px solid #E7E1D6;padding:10px 0}.explainer.x-trav .x-tcard p{margin:0;font:600 16px Inter,system-ui,sans-serif}
.explainer.x-trav .x-tcard dl{display:grid;grid-template-columns:auto 1fr;gap:3px 12px;margin:6px 0 0;font:15px/1.4 Inter,system-ui,sans-serif}.explainer.x-trav .x-tcard dt{color:var(--x-g5)}.explainer.x-trav .x-tcard dd{margin:0}
.explainer.x-trav .x-tquiz fieldset{border:0;border-top:1px solid #F3F4F6;padding:12px 0;margin:0;min-width:0}
.explainer.x-trav .x-tquiz legend{font:600 16px/1.4 Inter,system-ui,sans-serif;padding:0}
.explainer.x-trav .x-opt.x-answer{border:2px solid var(--x-ink)}
@media (max-width:820px){
 .explainer.x-trav .x-hero h1{font-size:32px}.explainer.x-trav .x-txt h2{font-size:26px}
 .explainer.x-trav .x-tgrid,.explainer.x-trav .x-tlegend{display:none}
 .explainer.x-trav .x-ttable{display:block;overflow-x:auto}
}
@media screen and (max-width:700px){
 .explainer.x-trav .x-ttab{display:none}.explainer.x-trav .x-tcards{display:block}
}
@media print{
 .explainer.x-trav .x-tgrid,.explainer.x-trav .x-tlegend{display:none!important}
 .explainer.x-trav .x-ttable{display:block!important}.explainer.x-trav .x-ttab{display:table!important;font-size:8.5pt}.explainer.x-trav .x-tcards{display:none!important}
 .explainer.x-trav .x-hero h1{font-size:24pt}.explainer.x-trav .x-txt h2{font-size:17pt}
 .explainer.x-trav .x-skip{display:none}
}
.explainer.x-trav .x-tnow{margin:0 0 18px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;font:15px/1.45 Inter,system-ui,sans-serif;color:var(--x-g7)}
.explainer.x-trav .x-tbtn{display:inline-flex;align-items:center;min-height:44px;padding:10px 18px;border:1.5px solid var(--x-acc);border-radius:8px;color:var(--x-acc);font:600 17px Inter,system-ui,sans-serif;text-decoration:none;background:#fff}.explainer.x-trav .x-tbtn:hover{background:var(--x-tint)}.explainer.x-trav .x-tbtn:focus-visible{outline:2px solid var(--x-acc);outline-offset:2px}
.explainer.x-trav .x-skip{display:inline-block;min-height:44px;padding:12px 0}
/* quiz: buttons and dividers that read on the paper page (UX review: #9CA3AF and #F3F4F6 fall under 3:1 here) */
.explainer.x-trav .x-opt{border-color:#6B7280}.explainer.x-trav .x-tquiz fieldset{border-top-color:#E7E1D6;padding-top:20px}
.explainer.x-trav .x-verdict{font-weight:600;color:var(--x-ink)}
@media print{.explainer.x-trav .x-ttable.x-tcareer .x-ttab{break-inside:avoid}}
@media print{.explainer.x-trav .x-tbtn,.explainer.x-trav .x-skip{display:none!important}.explainer.x-trav .x-txt h2{break-after:avoid}.explainer.x-trav .x-pic,.explainer.x-trav .x-src{break-inside:avoid}}
