/* Blueprint world: cyanotype paper, white draughtsman lines, one orange packet. */
:root{
  --bg:#0c2747; --bg2:#0f3260; --panel:#123a6d; --panel2:#0a2040;
  --line:#8fbfff; --line2:#4f86c6; --faint:rgba(143,191,255,.16);
  --ink:#eef5ff; --dim:#a9c4e6; --mute:#6f92bd;
  --pkt:#ff7a1a; --pkt2:#ffb36b; --lemon:#ffe66d; --ok:#6ee7a8; --bad:#ff6b7a; --rails:#ff5d73;
  --serif:'Instrument Serif',Georgia,serif; --sans:'Familjen Grotesk',system-ui,sans-serif; --mono:'JetBrains Mono',ui-monospace,Menlo,monospace;
  --glow:#17457f55; --glow2:transparent; --gw:64px; --top:56px; --bot:64px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:19px;line-height:1.5;-webkit-font-smoothing:antialiased}
body{background-color:var(--bg);transition:background-color 1.1s;
  background-image:radial-gradient(1200px 700px at 70% -10%,var(--glow),transparent 60%),radial-gradient(900px 400px at 20% 115%,var(--glow2),transparent 70%),
  linear-gradient(var(--faint) 1px,transparent 1px),linear-gradient(90deg,var(--faint) 1px,transparent 1px);
  background-size:auto,auto,40px 40px,40px 40px;background-attachment:fixed}
body:after{content:"";position:fixed;inset:0;pointer-events:none;opacity:.07;mix-blend-mode:screen;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
#app{height:100vh;display:grid;grid-template-columns:var(--gw) 1fr;grid-template-rows:var(--top) 1fr var(--bot);grid-template-areas:"top top" "gauge stage" "bot bot"}
#top{grid-area:top;display:flex;align-items:center;gap:24px;padding:0 24px;border-bottom:1px dashed var(--line2)}
.brand{font-family:var(--mono);font-size:13px;letter-spacing:.14em;font-weight:700;display:flex;align-items:center;gap:10px}
.brand i{font-family:var(--serif);font-size:19px;letter-spacing:0;font-weight:400;color:var(--pkt2)}
.brand-dot{width:10px;height:10px;border-radius:50%;background:var(--pkt);box-shadow:0 0 12px var(--pkt)}
#crumb{flex:1;display:flex;gap:12px;align-items:baseline;font-family:var(--mono);font-size:13px;color:var(--dim)}
.crumb-n{color:var(--pkt2)} .crumb-t{color:var(--ink)} .crumb-side{border:1px dashed var(--lemon);color:var(--lemon);padding:0 8px;border-radius:99px;font-size:11px}
kbd{font-family:var(--mono);font-size:11px;border:1px solid var(--line2);padding:0 5px;border-radius:4px;margin-left:6px;color:var(--dim)}

/* depth gauge */
#gauge{grid-area:gauge;position:relative;margin:24px 0 24px 14px}


/* stage: fixed-size region; content never resizes it */
#stage{grid-area:stage;overflow:auto;position:relative;padding:0 40px}
.slide{min-height:100%;max-width:1180px;margin:0 auto;padding:28px 0 20px;display:flex;flex-direction:column;justify-content:center;gap:22px;animation:in .45s cubic-bezier(.2,.7,.2,1)}
@keyframes in{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
#bottom{grid-area:bot;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 24px;border-top:1px dashed var(--line2)}
#dots{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;flex:1}
.dot{position:relative;width:12px;height:12px;border-radius:50%;border:1.5px solid var(--line2);background:transparent;padding:0;cursor:pointer;transition:.2s}
.dot.seen{background:var(--line2)} .dot.on{background:var(--pkt);border-color:var(--pkt);transform:scale(1.35);box-shadow:0 0 10px var(--pkt)} .dot:hover{border-color:var(--ink)}

.btn{font:600 15px var(--sans);color:var(--ink);background:var(--panel);border:1.5px solid var(--line2);border-radius:10px;padding:9px 16px;cursor:pointer;transition:.15s}
.btn:hover:not(:disabled){border-color:var(--line);transform:translateY(-1px)} .btn:disabled{opacity:.3;cursor:default}
.btn.primary{background:var(--pkt);border-color:var(--pkt);color:#1a0d00} .btn.primary:hover:not(:disabled){background:var(--pkt2)}
.btn.primary.locked{background:transparent;color:var(--mute);border-color:var(--line2);border-style:dashed}
.btn.ghost{background:transparent} .btn.small{font-size:13px;padding:5px 10px}
.shake{animation:shake .35s}@keyframes shake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}

/* ---- type ---- */
h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0;line-height:1.02;letter-spacing:-.01em}
.display{font-size:clamp(46px,7vw,92px)} h1{font-size:clamp(38px,5vw,64px)} h2{font-size:clamp(30px,3.6vw,46px)} h3{font-size:26px}
em,.serif-i{font-family:var(--serif);font-style:italic;color:var(--pkt2);font-size:1.08em}
.lede{font-size:clamp(21px,2.2vw,27px);line-height:1.38;max-width:30em;color:var(--ink)}
.prose{max-width:34em;color:var(--dim)} .prose b,.prose strong{color:var(--ink);font-weight:600}
.small{font-size:15px} .dim{color:var(--dim)} .mute{color:var(--mute)}
code,.mono{font-family:var(--mono);font-size:.86em} code{background:var(--panel2);border:1px solid var(--faint);padding:1px 6px;border-radius:5px;color:var(--lemon)}
.kicker{font:700 12px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--pkt2)}
.center{align-items:center;text-align:center} .center .lede,.center .prose{margin-inline:auto}

/* layout helpers */
.row{display:flex;gap:20px;align-items:center;flex-wrap:wrap}.col{display:flex;flex-direction:column;gap:14px}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:44px;align-items:center}
.split.rev{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:20px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:900px){.split,.split.rev,.grid2,.grid3{grid-template-columns:1fr}#stage{padding:0 16px}:root{--gw:34px}.brand i{display:none}}

/* demo boxes */
.demo{background:var(--panel2);border:1.5px solid var(--line2);border-radius:14px;padding:18px;position:relative}
.demo.tall{min-height:min(52vh,460px)}
.demo-cap{font:600 12px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mute);margin-bottom:10px}
.card{background:var(--panel);border:1.5px solid var(--line2);border-radius:12px;padding:14px 16px}
.callout{border-left:3px solid var(--lemon);padding:6px 0 6px 16px;color:var(--ink);max-width:36em}
.callout.pkt{border-color:var(--pkt)} .callout.bad{border-color:var(--bad)}
.chip{display:inline-block;font:600 12px var(--mono);border:1px solid var(--line2);border-radius:99px;padding:2px 10px;color:var(--dim)}
.chip.pkt{background:var(--pkt);border-color:var(--pkt);color:#1a0d00}
.chip.ok{border-color:var(--ok);color:var(--ok)} .chip.bad{border-color:var(--bad);color:var(--bad)}

/* doors: side-path links, glow when hovered */
a.door,[data-go].door{color:var(--lemon);text-decoration:none;border-bottom:1.5px dashed var(--lemon);cursor:pointer;transition:.15s;font-weight:500}
a.door:hover{background:#ffe66d22} a.door:after{content:" ↳";font-size:.85em}
.door-card{display:block;text-decoration:none;color:var(--ink);background:var(--panel);border:1.5px dashed var(--lemon);border-radius:12px;padding:12px 16px;cursor:pointer;transition:.2s}
.door-card:hover{transform:translateY(-2px);background:#1a4a82}.door-card b{color:var(--lemon);display:block;font:700 12px var(--mono);letter-spacing:.12em;text-transform:uppercase;margin-bottom:2px}

/* form controls */
input[type=text],input:not([type]),textarea,select{font:500 16px var(--mono);background:var(--panel2);color:var(--ink);border:1.5px solid var(--line2);border-radius:8px;padding:8px 12px;outline:none}
input:focus,textarea:focus{border-color:var(--pkt)}
input[type=range]{accent-color:var(--pkt);width:100%}
.opt{display:block;width:100%;text-align:left;font:500 17px var(--sans);color:var(--ink);background:var(--panel);border:1.5px solid var(--line2);border-radius:10px;padding:12px 16px;cursor:pointer;margin:0 0 10px;transition:.15s}
.opt:hover{border-color:var(--line);background:#1a4a82} .opt.right{border-color:var(--ok);background:#0f4a3a} .opt.wrong{border-color:var(--bad);background:#4a1f34}

/* packet look */
.pkt{display:inline-block;background:var(--pkt);color:#1a0d00;font:700 12px var(--mono);border-radius:5px;padding:2px 7px;box-shadow:0 0 14px #ff7a1a88}
svg text{font-family:var(--mono);fill:var(--ink)} svg .dimtxt{fill:var(--dim)}
svg .ln{stroke:var(--line);fill:none;stroke-width:1.6} svg .ln2{stroke:var(--line2);fill:none;stroke-width:1.2;stroke-dasharray:5 4}
svg .box{fill:var(--panel);stroke:var(--line);stroke-width:1.5} svg .pk{fill:var(--pkt);filter:drop-shadow(0 0 6px var(--pkt))}

/* map */
#map{position:fixed;inset:0;background:#071a34ee;backdrop-filter:blur(8px);z-index:50;overflow:auto;padding:30px 40px}
.map-in{max-width:1300px;margin:0 auto}.map-head{display:flex;align-items:center;gap:20px;margin-bottom:24px}.map-head h2{font-size:52px}.map-sub{flex:1;color:var(--dim);font-family:var(--mono);font-size:13px}
.map-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:26px;align-items:start}
.zone-label{font:700 11px var(--mono);letter-spacing:.14em;color:var(--pkt2);text-transform:uppercase;margin-bottom:12px;border-bottom:1px dashed var(--line2);padding-bottom:8px}
.zone-server .zone-label{color:var(--rails)}
.node{border:1.5px solid var(--line2);border-radius:12px;padding:12px 14px;margin-bottom:12px;background:var(--panel2)}.node.here{border-color:var(--pkt);box-shadow:0 0 18px #ff7a1a33}
.node-t{all:unset;cursor:pointer;font:400 24px var(--serif);display:block}.node-t:hover{color:var(--pkt2)}.node-n{font:700 11px var(--mono);color:var(--pkt2);margin-right:10px;vertical-align:middle}
.node-b{font-size:14px;color:var(--dim);margin:2px 0 8px}.node-dots{display:flex;flex-wrap:wrap;gap:6px}
.nd{width:11px;height:11px;border-radius:50%;border:1.5px solid var(--line2);background:transparent;padding:0;cursor:pointer}.nd.seen{background:var(--line2)}.nd.on{background:var(--pkt);border-color:var(--pkt)}.nd.side{border-radius:2px;border-color:var(--lemon)}.nd.side.seen{background:var(--lemon)}
.map-foot{margin-top:24px}
body.map-open #stage{filter:blur(3px)}

.dot:before{content:'';position:absolute;inset:-8px}
.crumb-layer{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);border:1px solid var(--faint);border-radius:99px;padding:0 9px}

/* ================= v3: Miso's drafting table ================= */
/* depth changes the water: deeper = darker, Rails = warm indigo */
body[data-zone=wire]{--bg:#061a33;--glow:#0c4a6a44;--glow2:#0e6a8a33;--faint:rgba(120,210,255,.13)}
body[data-zone=proto]{--bg:#0a264c;--glow:#1a4a8a44;--glow2:#1a6aa022}
body[data-zone=server]{--bg:#1a1c48;--bg2:#22265e;--panel:#26346e;--panel2:#12153a;--line2:#5f78c8;--glow:#4a2a7a44;--glow2:#ff5d7328;--faint:rgba(170,180,255,.13)}
body[data-zone=client]{--bg:#0e3058;--glow:#2a5f9a55;--glow2:#ffb36b22}
body[data-zone=end]{--glow2:#ff7a1a22}
body[data-zone=server] .kicker,body[data-zone=server] em,body[data-zone=server] .crumb-n{color:#ff9aa8}

/* type flourishes */
em,.serif-i{font-style:italic}
h1 em,h2 em,.display em{text-decoration:underline wavy #ff7a1a99;text-decoration-thickness:1.4px;text-underline-offset:.14em;text-decoration-skip-ink:none}
.kicker{display:flex;align-items:center;gap:10px}
.kicker:before{content:"";flex:none;width:30px;height:9px;border:solid var(--pkt2);border-width:0 1.5px;background:linear-gradient(var(--pkt2),var(--pkt2)) center/100% 1.5px no-repeat;opacity:.8}
.hand{font-family:'Caveat','Bradley Hand',cursive;font-weight:600}

/* figures: every playable is a numbered drawing */
.slide{counter-reset:fig}
.demo{counter-increment:fig;background:linear-gradient(180deg,#ffffff07,transparent 40%),var(--panel2);
  box-shadow:inset 0 0 0 1px #ffffff08,0 12px 30px -18px #000}
.demo:before{content:"FIG. " counter(fig);position:absolute;top:-9px;left:18px;padding:0 8px;background:var(--bg);font:700 10px var(--mono);letter-spacing:.16em;color:var(--pkt2);border-radius:4px;transition:background-color 1.1s}
.demo:after{content:"";position:absolute;inset:-6px;pointer-events:none;opacity:.55;
  background:
   linear-gradient(var(--line),var(--line)) 0 0/16px 1.5px,linear-gradient(var(--line),var(--line)) 0 0/1.5px 16px,
   linear-gradient(var(--line),var(--line)) 100% 0/16px 1.5px,linear-gradient(var(--line),var(--line)) 100% 0/1.5px 16px,
   linear-gradient(var(--line),var(--line)) 0 100%/16px 1.5px,linear-gradient(var(--line),var(--line)) 0 100%/1.5px 16px,
   linear-gradient(var(--line),var(--line)) 100% 100%/16px 1.5px,linear-gradient(var(--line),var(--line)) 100% 100%/1.5px 16px;
  background-repeat:no-repeat}
.demo-cap{color:var(--dim)}
.card{box-shadow:0 8px 20px -14px #000}

/* header: the packet's trail across the whole trip */
#top{position:relative;border-bottom-style:dashed}
#trail{position:absolute;left:0;right:0;bottom:-2px;height:3px;pointer-events:none}
#trail .tr-fill{position:absolute;left:0;top:0;bottom:0;width:var(--p,0%);background:linear-gradient(90deg,transparent,var(--pkt) 85%);transition:width .9s cubic-bezier(.6,0,.2,1);border-radius:3px}
#trail .tr-pkt{position:absolute;left:var(--p,0%);top:-4px;width:18px;height:10px;margin-left:-14px;border-radius:3px;background:var(--pkt);box-shadow:0 0 14px var(--pkt),0 0 2px #fff8;transition:left .9s cubic-bezier(.6,0,.2,1)}
#trail .tr-pkt:after{content:"";position:absolute;right:3px;top:3px;width:4px;height:4px;border-radius:50%;background:#1a0d00}
#trail .tr-tick{position:absolute;top:-3px;width:1px;height:8px;background:var(--line2);opacity:.7}
body[data-zone=server] #trail .tr-fill{background:linear-gradient(90deg,transparent,var(--rails) 85%)}
.brand-dot{animation:pulse 2.4s infinite}
@keyframes pulse{50%{box-shadow:0 0 3px var(--pkt);transform:scale(.8)}}

/* gauge: a fathom rule with ticks per chapter, cat-eared marker */
#gauge{margin:20px 0 26px 10px}
.g-rail{position:absolute;left:28px;top:0;bottom:0;border-left:2px dashed var(--line2);opacity:.7}
.g-fill{position:absolute;left:27px;top:0;width:4px;height:calc(var(--y)*(100% - 14px) + 8px);background:linear-gradient(var(--pkt),var(--pkt2));border-radius:4px;box-shadow:0 0 12px #ff7a1a88;transition:height .7s cubic-bezier(.6,0,.2,1)}
#gauge[data-zone=server] .g-fill{background:var(--rails);box-shadow:0 0 12px #ff5d7388}
.g-tick{position:absolute;left:20px;width:18px;top:calc(var(--y)*(100% - 14px) + 6px);height:0;border-top:1.5px solid var(--line2)}
.g-tick.z-server{border-color:#ff9aa888;left:24px;width:10px}
.g-mark{position:absolute;left:19px;top:calc(var(--y)*(100% - 14px));width:20px;height:16px;transition:top .7s cubic-bezier(.6,0,.2,1)}
.g-mark b{position:absolute;inset:2px 1px 0;border-radius:50%;background:var(--pkt);box-shadow:0 0 0 3px #ff7a1a33,0 0 18px var(--pkt)}
.g-mark:before,.g-mark:after{content:"";position:absolute;top:-4px;width:0;height:0;border:4px solid transparent;border-bottom:8px solid var(--pkt)}
.g-mark:before{left:1px;border-left-width:2px;border-right-width:5px;transform:rotate(-12deg)}.g-mark:after{right:1px;border-right-width:2px;border-left-width:5px;transform:rotate(12deg)}
#gauge[data-zone=server] .g-mark b{background:var(--rails);box-shadow:0 0 0 3px #ff5d7333,0 0 18px var(--rails)}
#gauge[data-zone=server] .g-mark:before,#gauge[data-zone=server] .g-mark:after{border-bottom-color:var(--rails)}
.g-lab{position:absolute;left:42px;font:700 8.5px/1.1 var(--mono);color:var(--mute);text-transform:uppercase;letter-spacing:.1em;pointer-events:none}

/* stage furniture */
#stage{position:relative;z-index:1}
#scene,#stamp{position:fixed;pointer-events:none;z-index:0;transition:opacity .6s}
#scene{right:20px;bottom:calc(var(--bot) + 6px);width:min(34vw,470px);opacity:0}
#scene.on{opacity:.95}
#scene svg{width:100%;height:auto;overflow:visible}
#scene .ln,#scene svg .ln{stroke:var(--line);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#scene .fillp{fill:var(--panel2);stroke:var(--line);stroke-width:1.8}
#scene .lbl{font:600 11px var(--mono);fill:var(--dim)}
#scene .hand{font:600 24px 'Caveat','Bradley Hand',cursive;fill:var(--pkt2);stroke:none}
#scene .led{animation:led 1.6s infinite steps(2)}#scene .led.b{animation-delay:.5s}#scene .led.c{animation-delay:1.1s}
@keyframes led{50%{opacity:.15}}
#scene .z{animation:zz 3s infinite;opacity:0;font:600 26px 'Caveat',cursive;fill:var(--dim)}#scene .z.b{animation-delay:1s}
@keyframes zz{0%{opacity:0;transform:translate(0,6px)}30%{opacity:1}100%{opacity:0;transform:translate(10px,-18px)}}
#stamp{top:calc(var(--top) + 26px);right:34px;transform:rotate(-7deg);border:3px double var(--pkt);color:var(--pkt);padding:4px 16px 0;text-align:center;border-radius:8px;opacity:0;mix-blend-mode:screen}
#stamp.on{animation:thud .55s cubic-bezier(.2,1.4,.4,1) forwards}
@keyframes thud{from{opacity:0;transform:rotate(-14deg) scale(1.9)}to{opacity:.85;transform:rotate(-7deg) scale(1)}}
#stamp small{display:block;font:700 10px var(--mono);letter-spacing:.3em}
#stamp b{display:block;font:400 74px/.95 var(--serif);letter-spacing:-.02em}
#stamp span{display:block;font:600 22px/1 'Caveat',cursive;margin:0 0 6px}
body[data-zone=server] #stamp{border-color:var(--rails);color:var(--rails)}
.reg{position:fixed;width:22px;height:22px;pointer-events:none;opacity:.35;z-index:0;background:
  radial-gradient(circle,transparent 5px,var(--line) 5.5px,var(--line) 6.5px,transparent 7px),
  linear-gradient(var(--line),var(--line)) center/1.3px 100% no-repeat,linear-gradient(var(--line),var(--line)) center/100% 1.3px no-repeat}
@media (max-width:1250px){#scene,#stamp{display:none}}

/* Miso, walking the progress dots */
.miso{display:block;width:100%;height:auto;overflow:visible}
.miso *{stroke:var(--line);stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.miso .f{fill:var(--panel)} .miso .w{fill:#fff;stroke:none} .miso .pup{fill:#0a2040;stroke:none}
.miso .nose{fill:var(--pkt);stroke:var(--pkt)} .miso .tag{fill:var(--pkt);stroke:var(--pkt)} .miso .col{stroke:var(--pkt2)} .miso .ein{stroke:var(--pkt2);stroke-width:1.6}
.miso text{fill:#1a0d00;stroke:none;font:800 9px var(--mono)}
.miso .wh{stroke-width:1.3;opacity:.7}
.miso .e-h,.miso .e-s,.miso .e-d{display:none}
.miso[data-mood=happy] .e-o,.miso[data-mood=sleep] .e-o,.miso[data-mood=dizzy] .e-o{display:none}
.miso[data-mood=happy] .e-h,.miso[data-mood=sleep] .e-s,.miso[data-mood=dizzy] .e-d{display:inline}
.miso[data-mood=alarm] .pup{r:1.6}
.miso .tail{transform-origin:72px 86px;animation:tail 3.2s ease-in-out infinite}
.miso[data-mood=happy] .tail{animation-duration:.7s}
@keyframes tail{50%{transform:rotate(-14deg)}}
#miso{position:fixed;z-index:0;width:54px;left:0;top:0;pointer-events:none;transition:transform .9s cubic-bezier(.5,0,.2,1)}
#miso .say{position:absolute;left:50%;bottom:100%;transform:translate(-50%,2px);white-space:nowrap;font:600 21px 'Caveat',cursive;color:var(--pkt2);opacity:0;transition:opacity .3s}
#miso .say.on{opacity:1}
#miso.hop{animation:hop .5s}
@keyframes hop{40%{margin-top:-14px}}
@media (max-width:700px){#miso{display:none}}

/* map: the route */
.map-route{margin:0 0 28px;border:1.5px dashed var(--line2);border-radius:14px;background:#04122866;padding:6px 10px}
.route{width:100%;height:auto;display:block;overflow:visible}
.route .rt-lab{font:700 10px var(--mono);letter-spacing:.14em;fill:var(--mute);text-transform:uppercase}.route .rt-r{fill:#ff9aa8}
.route .rt-base{stroke:var(--line2);stroke-dasharray:2 6;opacity:.5}
.route .rt-track{fill:none;stroke:var(--line2);stroke-width:2;stroke-dasharray:5 5}
.route .rt-done{fill:none;stroke:var(--pkt);stroke-width:3.5;stroke-linecap:round;filter:drop-shadow(0 0 5px #ff7a1a)}
.route .rt-node{cursor:pointer;outline:none}
.route .rt-c{fill:var(--bg);stroke:var(--line);stroke-width:1.8}.route .rt-f{fill:var(--line2)}
.route .rt-node.rails .rt-c{stroke:#ff9aa8}.route .rt-node.rails .rt-f{fill:var(--rails)}
.route .rt-node:hover .rt-c,.route .rt-node:focus .rt-c{stroke:var(--pkt);stroke-width:3}
.route .rt-node.here .rt-c{stroke:var(--pkt);stroke-width:3}.route .rt-node.here .rt-f{fill:var(--pkt)}
.route .rt-n{font:700 10px var(--mono);fill:var(--dim)}.route .rt-t{font:400 20px var(--serif);fill:var(--pkt2)}
.route .rt-ears{fill:none;stroke:var(--pkt);stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01s!important;transition-duration:.01s!important}}