.mth{--mth-bg:#0f0e0c;--mth-ink:#f4f1ebd6;--mth-fine:#f4f1eb8f;--mth-hatch:#f4f1eb70;--mth-faint:#f4f1eb42;--mth-star:#f4f1ebcc;--mth-accent:#ff7a5c;color:#f4f1eb;font-family:var(--font-sans);position:relative;container:mth/inline-size}.mth__art{aspect-ratio:1600/400;-webkit-user-select:none;user-select:none;position:relative}.mth__plate{width:100%;height:100%;display:block;position:absolute;inset:0;overflow:visible}.mth-s{fill:none;stroke:var(--mth-ink);stroke-width:1px;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.mth-s--edge{stroke-width:1.05px}.mth-s--fine{stroke:var(--mth-fine);stroke-width:.85px}.mth-s--hatch{stroke:var(--mth-hatch);stroke-width:.7px}.mth-s--faint{stroke:var(--mth-faint);stroke-width:.8px}.mth-s--dash{stroke:var(--mth-faint);stroke-width:.8px;stroke-dasharray:2 3}.mth-s--course{stroke:var(--mth-fine);stroke-width:.9px;stroke-dasharray:5 4}.mth-s--hot{stroke:#fffdf8;stroke-width:1.5px}.mth-st{fill:none;stroke:var(--mth-star);stroke-linecap:round;vector-effect:non-scaling-stroke}.mth-st--s{stroke-width:1.1px}.mth-st--m{stroke-width:2.4px}.mth-st--l{stroke-width:3.6px}.mth-disc{fill:var(--mth-bg);stroke:none}.mth-rule{fill:none;stroke:#fff;stroke-width:36px;stroke-linecap:round;stroke-dasharray:1000 1000;stroke-dashoffset:0}.mth__hot,.mth__bloom{opacity:0}.mth__light{fill:var(--mth-accent);opacity:.55}.mth[data-lights] .mth__light{animation:3.6s ease-in-out infinite mth-beacon}@keyframes mth-beacon{0%,62%,to{opacity:.35}72%{opacity:1}84%{opacity:.5}}.mth__ship,.mth__tip{--k:calc(100cqw / 1600)}.mth__ship{--sx:var(--wsx);--sy:var(--wsy);--sr:var(--wsr);--ship-cu:var(--wship);z-index:2;width:calc(var(--ship-cu) * var(--k));aspect-ratio:var(--ship-ratio);transform-origin:0 0;transform:translate(calc(var(--sx) * var(--k)), calc(var(--sy) * var(--k))) rotate(var(--sr)) translate(calc(-1 * var(--ship-ox)), calc(-1 * var(--ship-oy)));pointer-events:none;will-change:transform;position:absolute;top:0;left:0}.mth__ship-svg{width:100%;height:100%;display:block;position:relative;overflow:visible}.mth__ship-mark{fill:var(--mth-bg);stroke:var(--mth-ink);stroke-width:.9px;stroke-linejoin:round;vector-effect:non-scaling-stroke}.mth__ship-light{fill:var(--mth-accent)}.mth__ship-glow{background:radial-gradient(closest-side, color-mix(in srgb, var(--mth-accent) 55%, transparent), transparent);opacity:.75;will-change:opacity;border-radius:50%;position:absolute}.mth[data-lights] .mth__ship-glow{animation:3.4s ease-in-out infinite mth-breathe}@keyframes mth-breathe{0%,to{opacity:.45}50%{opacity:1}}.mth__tip{z-index:3;background:var(--mth-accent);opacity:0;visibility:hidden;width:7px;height:7px;transform:translate(calc(var(--tx,0) * var(--k)), calc(var(--ty,0) * var(--k)));pointer-events:none;border-radius:50%;margin:-3.5px 0 0 -3.5px;position:absolute;top:0;left:0;box-shadow:0 0 10px 2px #ff7a5c80}.mth__steps{grid-template-columns:repeat(5,minmax(0,1fr));margin:18px 0 0;padding:0;list-style:none;display:grid}.mth__step{text-align:center;padding:0 12px;position:relative}.mth__name{color:#f4f1eb;letter-spacing:-.01em;text-wrap:balance;margin:0;font-size:1rem;font-weight:500;line-height:1.3}.mth__line{color:#a9a296;text-wrap:pretty;margin:8px 0 0;font-size:.875rem;line-height:1.5}.mth__step:before{content:"";background:#3a3630;width:22px;height:1.5px;margin:0 auto 12px;transition:background-color .3s;display:block}.mth__step[data-on]:before{background:var(--mth-accent)}html[data-motion=reduced] .mth__step:before{transition:none}.mth__stn,.mth__rail{display:none}.mth-stage{container:mthstage/inline-size}.mth-stage>.demo-stage__pause{top:10px;bottom:auto;right:10px}@container mthstage not (min-width:760px){.mth-stage>.demo-stage__pause{top:4px;right:0}}@container mth not (min-width:760px){.mth__art{display:none}.mth__steps{grid-template-columns:minmax(0,1fr);margin:0;padding-top:52px}.mth__step{--stn:84px;grid-template-columns:var(--stn) minmax(0, 1fr);text-align:left;grid-template-rows:auto auto 1fr;align-items:start;column-gap:16px;padding:0 0 34px;display:grid}.mth__step:last-child{padding-bottom:0}.mth__step:before{content:none}.mth__stn{width:var(--stn);height:var(--stn);grid-area:1/1/span 3;display:block}.mth__stn svg{width:100%;height:100%;display:block;overflow:visible}.mth__name,.mth__line{grid-column:2;max-width:52ch}.mth__name{text-wrap:pretty;padding-top:10px;transition:color .3s;position:relative}.mth__name:before{content:"";background:var(--mth-accent);opacity:0;border-radius:50%;width:5px;height:5px;transition:opacity .3s;position:absolute;top:calc(7.5px + .65em);left:-12px}.mth__step[data-on] .mth__name{color:#fff}.mth__step[data-on] .mth__name:before{opacity:1}html[data-motion=reduced] .mth__name,html[data-motion=reduced] .mth__name:before{transition:none}.mth__rail{left:calc(var(--stn) / 2 - .5px);top:calc(var(--stn) - 9px);pointer-events:none;width:1px;display:block;position:absolute;bottom:-9px}.mth__rail-line{background:repeating-linear-gradient(to bottom, var(--mth-fine) 0 5px, transparent 5px 9px);width:100%;height:100%;position:absolute;top:0;left:0}.mth__rail-pen,.mth__rail-light{opacity:0;visibility:hidden;pointer-events:none;border-radius:50%;position:absolute;top:0;left:0}.mth__rail-pen{z-index:2;background:var(--mth-accent);width:7px;height:7px;margin:-3.5px 0 0 -3px;box-shadow:0 0 10px 2px #ff7a5c80}.mth__rail-light{z-index:1;background:var(--mth-bg);border:1px solid #f4f1eb;width:9px;height:9px;margin:-4.5px 0 0 -4px;box-shadow:0 0 0 3px #ff7a5c33}}