/* LeapCode roadmap.css (release 1.5). Namespaced .rm-.
   Full map: 3 rows stacked top to bottom (3 Point A, 2 Point B, 1 Let's Leap), each row's stations written left to right.
   Phones: everything stacks into 1 vertical list, no sideways scroll.
   Compact strip (check pages): 1 row on wide screens; on phones the station you are on and its neighbours. */
.rm{--rm-done:#0B8A6B;--rm-here:#D44040;--rm-todo:#1A1A1A;--rm-ink:var(--fg,#1A1A1A);--rm-muted:var(--fg-muted,#5E6D74);--rm-tint:var(--g-mist,#F7FAFC);--rm-line:var(--line,#D9DEDE);
  font-family:var(--font-body,"Source Sans 3",system-ui,sans-serif);color:var(--rm-ink);max-width:1200px;margin:0 auto}
.rm *{box-sizing:border-box}
.rm ol{list-style:none;margin:0;padding:0}
.rm-groups{display:grid;gap:18px}
.rm-grp{background:var(--gbg,var(--rm-tint));border:1px solid var(--gbd,var(--rm-line));border-radius:16px;padding:18px 18px 10px;display:grid;gap:14px}
.rm-grp--A{--gbg:#DCEAF8;--gbd:#86B3E3;--gac:#2F7BC8}
.rm-grp--B{--gbg:#FFE5DE;--gbd:#F0A592;--gac:#D9583F}
.rm-grp--E{--gbg:#D3F0E3;--gbd:#74C9A6;--gac:#12906B}
.rm-grp--S{--gbg:#F8E9BA;--gbd:#DDBB55;--gac:#B58A12}
.rm-grp{box-shadow:inset 5px 0 0 var(--gac,transparent)}
/* the 3-2-1 numeral, in the style of the old countdown */
.rm-grp__n{font:800 clamp(3.2rem,2.2rem + 4vw,5rem)/.9 var(--font-heading,"Source Sans 3",sans-serif);letter-spacing:-.04em;color:transparent;-webkit-text-stroke:2px #FF9B93;flex:none;min-width:.8em}
.rm-grp--B .rm-grp__n{-webkit-text-stroke-color:#FF6F66}
.rm-grp--E .rm-grp__n{color:var(--c-sol-text,#B83434);-webkit-text-stroke:0}
.rm-grp--S .rm-grp__n{font-size:clamp(2.4rem,1.8rem + 3vw,3.6rem);-webkit-text-stroke:0;color:inherit}
.rm-grp__h{display:flex;align-items:center;gap:14px;margin:0}
.rm-grp__t{margin:0;display:flex;flex-direction:column;gap:1px;font-family:var(--font-heading,"Source Sans 3",sans-serif)}
.rm-grp__t b{font-size:1.3rem;line-height:1.15;color:var(--rm-ink)}
.rm-grp__t span{font-size:.92rem;font-weight:600;color:var(--rm-muted)}
.rm-list{position:relative;display:grid;gap:10px;grid-template-columns:1fr}
.rm-s{position:relative;margin:0}
.rm-in{display:flex;align-items:flex-start;gap:12px;height:100%;min-height:44px;padding:12px;color:inherit;text-decoration:none;border-radius:12px;background:#fff;border:1px solid var(--rm-line)}
a.rm-in:hover,a.rm-in:focus-visible{border-color:var(--rm-here)}
a.rm-in:hover .rm-t,a.rm-in:focus-visible .rm-t{color:var(--c-sol-text,#B83434)}
a.rm-in:focus-visible{outline:3px solid var(--focus,#D44040);outline-offset:2px}
/* the number: inverse colours so it reads at a glance (dark fill, white numeral); done is green; you-are-here is the red gradient */
.rm-dot{position:relative;z-index:1;flex:0 0 38px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font:700 1rem var(--font-heading,"Source Sans 3",sans-serif);
  background:var(--rm-todo);border:3px solid var(--rm-todo);color:#fff}
.rm-s--done .rm-dot{background:var(--rm-done);border-color:var(--rm-done)}
.rm-s--here .rm-in{border-color:var(--rm-here);box-shadow:0 0 0 1px var(--rm-here) inset}
.rm-s--here .rm-dot{background:#D44040;border-color:#D44040}
.rm-txt{display:flex;flex-direction:column;gap:4px;min-width:0;padding-top:1px}
.rm-t{font:700 1rem/1.25 var(--font-heading,"Source Sans 3",sans-serif)}
.rm-s--here .rm-t{color:var(--c-sol-text,#B83434)}
/* the small line under a title: a tinted pill, dark text */
.rm-tag{align-self:flex-start;padding:2px 10px;border-radius:999px;background:#E6EDF1;color:#1A1A1A;font-size:.78rem;font-weight:700;letter-spacing:.01em}
.rm-c{font-size:.9rem;line-height:1.45;color:var(--rm-muted)}
.rm-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.rm-here{align-self:flex-start;margin-left:auto;flex:none;padding:3px 10px;border-radius:999px;background:var(--rm-here);color:#fff;font:700 .72rem var(--font-heading,"Source Sans 3",sans-serif);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
/* wide: each row = numeral and name on the left, the stations side by side on the right */
@media(min-width:900px){
  .rm-grp{grid-template-columns:230px 1fr;align-items:start;gap:20px;padding:20px}
  .rm-grp__h{align-self:center}
  .rm-list{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
  .rm-in{position:relative;z-index:1;flex-direction:column;gap:10px;padding:14px}
  .rm-here{position:absolute;top:10px;right:10px;margin:0}
}
@media(max-width:899.98px){.rm-s--here .rm-here{display:none}.rm-s--here .rm-t::after{content:" · you are here";font-weight:600;font-size:.85rem}}
@media(prefers-reduced-motion:no-preference){
  .rm-s--here .rm-dot{animation:rm-pulse 2.4s ease-in-out infinite}
  @keyframes rm-pulse{0%,100%{box-shadow:0 0 0 0 rgba(200,58,58,.45)}50%{box-shadow:0 0 0 8px rgba(200,58,58,0)}}
}
/* dark pages */
.dark .rm,.rm--dark{--rm-ink:#F2F4F4;--rm-muted:#A3B0B6;--rm-tint:#232323;--rm-line:#363636;--rm-todo:#F2F4F4}
.dark .rm .rm-in,.rm--dark .rm-in{background:#1A1A1A}
.dark .rm .rm-dot,.rm--dark .rm-dot{color:#1A1A1A}
.dark .rm .rm-tag,.rm--dark .rm-tag{background:#363636;color:#F2F4F4}

/* compact strip (check pages): captions off; 1 row on wide screens */
.rm[data-compact] .rm-c{display:none}
@media(min-width:900px){
  .rm[data-compact] .rm-groups{display:flex;flex-wrap:wrap;gap:10px}
  .rm[data-compact] .rm-grp{display:block;flex:1 1 auto;padding:10px 12px 8px}
  .rm[data-compact] .rm-grp__n{display:none}
  .rm[data-compact] .rm-grp__h{margin:0 0 8px}
  .rm[data-compact] .rm-grp__t b{font-size:1rem}
  .rm[data-compact] .rm-list{display:flex;gap:6px}
  .rm[data-compact] .rm-s{flex:1 1 0;min-width:74px}
  .rm[data-compact] .rm-in{flex-direction:column;align-items:center;text-align:center;gap:6px;padding:6px 4px;border-color:transparent;background:transparent}
  .rm[data-compact] .rm-s--here .rm-in{box-shadow:none;border-color:transparent}
  .rm[data-compact] .rm-dot{flex-basis:34px;width:34px;height:34px;font-size:.9rem}
  .rm[data-compact] .rm-txt{align-items:center}
  .rm[data-compact] .rm-t{font-size:.82rem}
  .rm[data-compact] .rm-tag{display:none}
  .rm[data-compact] .rm-here{display:none}
}
@media(max-width:899.98px){
  .rm[data-compact] .rm-groups{gap:0}
  .rm[data-compact] .rm-grp{display:block;padding:6px 12px 2px;border:0;background:transparent}
  .rm[data-compact] .rm-grp__h{display:none}
  .rm[data-compact] .rm-s:not(.rm-s--here):not(:has(+ .rm-s--here)):not(.rm-s--here + .rm-s){display:none}
  .rm[data-compact] .rm-grp:not(:has(.rm-s--here)):not(:has(.rm-s:has(+ .rm-s--here))):not(:has(.rm-s--here + .rm-s)){display:none}
}
.rm-more{margin:12px 0 0;font-size:.92rem}
.rm-more a{color:#A12A2A;font-weight:600}
.rm-strip{padding:22px 0;background:var(--g-mist,#F7FAFC);border-bottom:1px solid var(--line,#D9DEDE)}
.rm-strip h2{font:700 1.15rem var(--font-heading,"Source Sans 3",sans-serif);margin:0 0 4px;color:var(--fg-heading,#1A1A1A)}
.rm-strip .rm-sub{margin:0 0 14px;color:var(--fg-muted,#5E6D74);font-size:.95rem}
.rm-strip .rm-in-wrap{max-width:1200px;margin:0 auto;padding:0 clamp(16px,4vw,32px)}

/* home mode: 4 coloured rows on a soft red band (light), each row = the 3-2-1 numeral and name on the left, the stations side by side on the right */
.rm--home{--rm-ink:#1A1A1A;--rm-muted:#4D5A60}
.rm--home .rm-grp__n{-webkit-text-stroke:2.5px #D44040}
.rm--home .rm-grp--B .rm-grp__n{-webkit-text-stroke-color:#D44040}
.rm--home .rm-grp--E .rm-grp__n{color:var(--c-sol-text,#B83434);-webkit-text-stroke:0}
.rm--home .rm-grp--S .rm-grp__n{-webkit-text-stroke:0;color:inherit}
.rm--home .rm-in{background:#fff;border-color:rgba(26,26,26,.12)}
.rm--home .rm-tag,.rm--home .rm-c{display:none}
@media(min-width:900px){
  .rm--home .rm-grp{grid-template-columns:230px minmax(0,1fr)}
  .rm--home .rm-list{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
  .rm--home .rm-grp--E .rm-list{display:flex;gap:8px}
  .rm--home .rm-grp--E .rm-s{flex:1 1 auto}
  .rm--home .rm-t{white-space:nowrap}
  .rm--home .rm-grp--E .rm-in{padding:10px 8px;gap:6px}
  .rm--home .rm-grp--E .rm-t{font-size:.9rem}
  .rm--home .rm-grp--E .rm-s{min-width:0}
  .rm--home .rm-grp--E .rm-dot{flex-basis:26px;width:26px;height:26px;font-size:.78rem}
  .rm--home .rm-grp--S .rm-grp__n{font-size:3rem}
  .rm--home .rm-in{flex-direction:row;align-items:center;gap:10px;padding:10px 12px}
  .rm--home .rm-dot{flex-basis:30px;width:30px;height:30px;font-size:.85rem}
}
.h-link{color:inherit;text-decoration:none;border-bottom:3px solid #D44040}
.h-link:hover,.h-link:focus-visible{color:var(--c-sol-text,#B83434)}
.h-link:focus-visible{outline:3px solid var(--focus,#D44040);outline-offset:3px}
.tlink{color:#A12A2A;font-weight:600}