/* SITHIYAM v5 — LANE B (page-scoped: ids, svg-internal, JS-created, states-on-descendants, media, keyframes)
   Hosted + linked from page head. NOT Webflow styles. */
:root{
  --paper:oklch(0.969 0.012 84);        /* Colour/Paper */
  --paper-2:oklch(0.946 0.015 80);      /* Colour/Paper 2 */
  --paper-3:oklch(0.912 0.018 77);      /* Colour/Paper 3 */
  --paper-live:oklch(0.969 0.012 84);   /* Colour/Paper Live (JS-driven) */
  --ink:oklch(0.205 0.018 56);          /* Colour/Ink */
  --ink-2:oklch(0.44 0.022 58);         /* Colour/Ink 2 */
  --line:oklch(0.205 0.018 56 / .16);   /* Colour/Line */
  --line-2:oklch(0.205 0.018 56 / .08); /* Colour/Line 2 */
  --accent:oklch(0.70 0.115 73);        /* Colour/Accent */
  --accent-ink:oklch(0.42 0.115 60);    /* Colour/Accent Ink */
  --terra:oklch(0.63 0.135 44);         /* Colour/Terracotta */
  --tea:oklch(0.52 0.072 156);          /* Colour/Tea */
  --night:oklch(0.205 0.02 58);         /* Colour/Night */
  --night-2:oklch(0.25 0.022 60);       /* Colour/Night 2 */
  --bone:oklch(0.93 0.014 82);          /* Colour/Bone */
  --pencil:oklch(0.36 0.06 58);         /* Colour/Pencil (JS-driven) */
  --f-display:"Bricolage Grotesque",sans-serif;  /* Type/Display */
  --f-serif:"Instrument Serif",serif;            /* Type/Serif */
  --f-mono:"JetBrains Mono",monospace;           /* Type/Mono */
  --f-hand:"La Belle Aurore",cursive;            /* Type/Hand */
  --f-scrawl:"Caveat",cursive;                   /* Type/Scrawl */
  --ease:cubic-bezier(.22,1,.36,1);     /* Motion/Ease */
  --slow:cubic-bezier(.16,1,.3,1);      /* Motion/Slow */
  --gutter:clamp(20px,5vw,84px);        /* Layout/Gutter */
  --lamp:0; /* 0=daylight … 1=lamplight; rises from "Two ways" onward, set per-frame in JS */
}
*{margin:0;padding:0;box-sizing:border-box}
body{background-color:var(--paper);color:var(--ink);font-family:var(--f-display);overflow-x:hidden}
::selection{background-color:var(--accent);color:var(--night)}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit;font-size:inherit;font-weight:inherit;font-style:inherit;line-height:inherit;background-color:transparent;background-image:none;border-width:0;border-style:none;cursor:pointer;color:inherit}
@keyframes writein{0%{clip-path:inset(-20% 102% -20% -2%);opacity:1}100%{clip-path:inset(-20% -2% -20% -2%);opacity:1}}
@keyframes twinkle{20%{opacity:.9}60%{opacity:.15}}
@keyframes rise{to{transform:translateY(0)}}
@keyframes dash620{to{stroke-dashoffset:0}}
@keyframes fade{to{opacity:1}}
@keyframes fillin{to{opacity:.45}}
@keyframes idash{from{stroke-dashoffset:1600}to{stroke-dashoffset:0}}
@keyframes pop{0%{opacity:0;transform:scale(.2)}70%{opacity:1;transform:scale(1.35)}100%{opacity:1;transform:scale(1)}}
@keyframes kbA{from{transform:scale(1.05) translate(1.2%,-.8%)}to{transform:scale(1.16) translate(-1.6%,1.2%)}}
@keyframes kbB{from{transform:scale(1.15) translate(-1.4%,1%)}to{transform:scale(1.05) translate(1.4%,-1%)}}
@keyframes pulse{50%{opacity:.25}}
@keyframes flip{0%{transform:rotateX(0)}49%{transform:rotateX(90deg)}51%{transform:rotateX(-90deg)}100%{transform:rotateX(0)}}
@keyframes dash400{to{stroke-dashoffset:0}}
@keyframes dash140{to{stroke-dashoffset:0}}
@keyframes birdsfly{0%{transform:translateX(0) translateY(0);opacity:0}6%{opacity:.55}50%{transform:translateX(60vw) translateY(-4vh);opacity:.55}94%{opacity:.4}100%{transform:translateX(118vw) translateY(-7vh);opacity:0}}
@keyframes flap{from{transform:scaleY(.75)}to{transform:scaleY(1.15)}}
@keyframes cardin{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:none}}
@keyframes boxdraw{to{stroke-dashoffset:0}}
@keyframes stampin{0%{opacity:0;transform:rotate(-11deg) scale(2.6)}70%{opacity:.9;transform:rotate(-11deg) scale(.94)}100%{opacity:.85;transform:rotate(-11deg) scale(1)}}
@keyframes drift{from{transform:translate(0,0)}to{transform:translate(var(--dx,18px),var(--dy,-26px))}}
.sf-star{position:absolute;width:2px;height:2px;border-radius:50%;background-color:var(--bone);animation:twinkle 3.8s infinite}
@keyframes twinkle{20%{opacity:.9}60%{opacity:.15}}
.route{position:absolute;top:0;left:0;width:100%;pointer-events:none;z-index:1;overflow:visible}
.route .rl{fill:none;stroke:var(--pencil);stroke-width:1.8;stroke-linecap:round;filter:url(#rough)}
.route .rl2{fill:none;stroke:var(--pencil);stroke-width:1;stroke-linecap:round;opacity:.3;filter:url(#rough)}
.route .tip{fill:var(--pencil)}
.route .stopring{fill:none;stroke:var(--accent-ink);stroke-width:1.7;filter:url(#rough)}
.route .leader{fill:none;stroke:var(--accent-ink);stroke-width:1.6;stroke-dasharray:4 6;opacity:0;transition:opacity .5s var(--ease);filter:url(#rough)}
.route .leader.on{opacity:.75}
.route .deco{stroke:var(--pencil);fill:none;opacity:0;transition:opacity .6s var(--ease)}
.route .deco.on{opacity:.5}
.route .sleeper{stroke-width:1.5}
.route .roadd{stroke-width:1.6}
.route .coastw{stroke-width:1.2}
.route .legnote{font-family:var(--f-mono);font-size:10px;letter-spacing:.24em;fill:var(--ink-2);opacity:0;transition:opacity .8s var(--ease)}
.route .legnote.on{opacity:.85}
.stop-note{position:absolute;z-index:2;font-family:var(--f-hand);font-size:clamp(19px,1.9vw,25px);color:var(--pencil);transform:rotate(-3.5deg);pointer-events:none;white-space:nowrap}
.v5-nav-mark .v5-star{color:var(--accent)}
.v5-nav-link:hover::after{width:100%}
.tripclock-svg{overflow:visible}
.v5-tripclock .arcpath{fill:none;stroke:var(--line);stroke-width:1}
.v5-tripclock .orb{fill:var(--accent)}
body.is-night-mode .v5-tripclock .orb{fill:var(--bone)}
.v5-minimap svg{width:100%;height:auto;overflow:visible;display:block;cursor:crosshair;touch-action:none}
body.has-cursor .v5-minimap svg{cursor:none}
.v5-minimap .mmisle{fill:oklch(0.5 0.03 70/.08);stroke:var(--pencil);stroke-width:5;opacity:.75}
.v5-minimap .mmroute{fill:none;stroke:var(--accent-ink);stroke-width:7;stroke-dasharray:24 30;opacity:.35}
.v5-minimap .mmtrod{fill:none;stroke:var(--accent-ink);stroke-width:9;stroke-linecap:round;opacity:.9}
.v5-minimap .mmdot{fill:var(--accent-ink);stroke:var(--paper-live);stroke-width:8}
.v5-pre .v5-pre-inner{text-align:center}
.v5-pre .v5-pre-mark{font-weight:800;letter-spacing:-.02em;font-size:1.3rem}
.v5-pre .v5-pre-mark .v5-star{color:var(--accent)}
.v5-pre .v5-pre-stage{height:min(34vh,300px);margin-top:20px;margin-bottom:0;margin-left:auto;margin-right:auto;display:grid;place-items:center}
.v5-pre .v5-pre-stage svg{height:100%;width:auto;overflow:visible;display:block}
.pisle{fill:none;stroke:var(--pencil);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;filter:url(#rough)}
.v5-pre .v5-pre-note{display:block;margin-top:16px;min-height:1.4em;font-family:var(--f-hand);font-size:21px;color:var(--pencil);transition:opacity .2s ease}
.v5-pre .v5-pre-count{display:block;margin-top:12px;font-family:var(--f-mono);font-size:.62rem;letter-spacing:.22em;color:var(--ink-2)}
@media (hover:hover) and (pointer:fine){
  body.has-cursor, body.has-cursor a, body.has-cursor button, body.has-cursor .v5-jrow, body.has-cursor .v5-crow, body.has-cursor .v5-shelf{cursor:none}
}
body[data-cur="link"] .v5-cur{width:11px;height:11px;background-color:var(--accent-ink)}
body[data-cur="link"] .v5-cur-ring{width:46px;height:46px;opacity:.85;border-color:var(--accent-ink)}
body[data-cur="trace"] .v5-cur-ring,body[data-cur="drag"] .v5-cur-ring{width:66px;height:66px;opacity:1;border-color:var(--accent-ink);background-color:oklch(0.99 0.005 84/.06);backdrop-filter:blur(1px)}
body[data-cur="trace"] .v5-cur-label,body[data-cur="drag"] .v5-cur-label{opacity:1}
body[data-cur="trace"] .v5-cur,body[data-cur="drag"] .v5-cur{width:4px;height:4px}
.rv{opacity:0;transform:translateY(30px) rotate(.4deg)}
.rv.in{opacity:1;transform:none;transition:opacity 1s var(--slow) var(--rvd,0s),transform 1s var(--slow) var(--rvd,0s)}
.ff-fly{position:absolute;width:3px;height:3px;border-radius:50%;background-color:var(--accent);box-shadow:0 0 6px 1px oklch(0.7 0.115 73/.5);animation:drift var(--d,7s) ease-in-out infinite alternate, twinkle 2.8s infinite}
@keyframes drift{from{transform:translate(0,0)}to{transform:translate(var(--dx,18px),var(--dy,-26px))}}
.v5-manifesto .w{display:inline-block;transform:translateY(.28em);transition:opacity .35s linear,transform .5s var(--slow)}
.v5-manifesto .w.lit{transform:translateY(0)}
.v5-tripclock svg{pointer-events:auto;cursor:ew-resize;touch-action:none}
.v5-tripclock:hover .arcpath{stroke:var(--accent-ink)}
@media (max-width:900px){
  .route .rl,.route .rl2,.route .stopring{filter:url(#roughM)}
  .v5-minimap{width:112px}
}
@media (max-width:600px){
  .v5-nav{padding-top:12px;padding-right:var(--gutter);padding-bottom:12px;padding-left:var(--gutter)}
  .v5-nav-right{gap:12px}
  .v5-nav-link{display:none}
  .stop-note{font-size:15px}
  .v5-minimap{width:96px;padding-top:8px;padding-right:8px;padding-bottom:7px;padding-left:8px}
  .v5-mm-label{font-size:.44rem;padding-top:3px;padding-right:7px;padding-bottom:3px;padding-left:7px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001s!important;transition-duration:.001s!important}
}
.v5-hero-h .v5-ln{
  display: block;
  overflow: hidden;
  padding-bottom: .06em;
}
.v5-hero-h .v5-ln:nth-child(2) .v5-ln-text{
  animation-delay: .14s;
}
@keyframes rise{
  to { transform: translateY(0); }
}
.v5-hero-h .v5-drawn{
  position: relative;
  display: inline-block;
}
.v5-hero-h .v5-drawn svg{
  position: absolute;
  left: 0;
  bottom: -.14em;
  width: 100%;
  height: .26em;
  overflow: visible;
}
.drawn-path{
  fill: none;
  stroke: var(--accent-ink);
  stroke-width: 3.2;
  stroke-linecap: round;
  opacity: .85;
  stroke-dasharray: 620;
  stroke-dashoffset: 620;
  animation: dash620 1.1s 1.35s var(--slow) forwards;
  filter: url(#rough);
}
@keyframes dash620{
  to { stroke-dashoffset: 0; }
}
@keyframes fade{
  to { opacity: 1; }
}
.v5-btn-text:hover .v5-arr{
  transform: translateX(5px);
}
.isle-svg{
  width: 100%;
  height: auto;
  max-height: 78svh;
  overflow: visible;
  display: block;
}
.isle{
  fill: none;
  stroke: var(--pencil);
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: url(#rough);
}
.isle2{
  fill: none;
  stroke: var(--pencil);
  stroke-width: 1;
  opacity: .28;
  transform: translate(3px, 2px);
  filter: url(#rough);
}
.isle-fill{
  fill: var(--paper-3);
  opacity: 0;
}
.v5-plate-wrap.live .isle-fill{
  animation: fillin 1.4s .15s var(--ease) forwards;
}
@keyframes fillin{
  to { opacity: .45; }
}
.iroute{
  fill: none;
  stroke: var(--accent-ink);
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-dasharray: 7 9;
  filter: url(#rough);
  opacity: 0;
}
.iroute.go{
  opacity: .95;
  stroke-dashoffset: 1600;
  animation: idash 2.2s linear forwards;
}
@keyframes idash{
  from { stroke-dashoffset: 1600; }
  to { stroke-dashoffset: 0; }
}
.istop{
  fill: var(--paper-live);
  stroke: var(--accent-ink);
  stroke-width: 2;
  opacity: 0;
  transform-origin: center;
  transform-box: fill-box;
}
.istop.pop{
  animation: pop .5s var(--slow) forwards;
}
@keyframes pop{
  0% { opacity: 0; transform: scale(.2); }
  70% { opacity: 1; transform: scale(1.35); }
  100% { opacity: 1; transform: scale(1); }
}
.ilabel{
  font-family: var(--f-hand);
  font-size: 22px;
  fill: var(--pencil);
  opacity: 0;
}
.ilabel.pop{
  animation: fade .6s var(--ease) forwards;
}
.v5-plate-wrap.live .v5-iplate-cap{
  animation: fade 1s .6s var(--ease) forwards;
}
.v5-plate-wrap.live .v5-iplate-note{
  animation: fade 1s 1s var(--ease) forwards;
}
.birds{
  position: absolute;
  top: 16vh;
  left: -12vw;
  z-index: 1;
  opacity: 0;
  animation: birdsfly 26s linear 6s infinite;
}
.bird-path{
  fill: none;
  stroke: var(--pencil);
  stroke-width: 1.6;
  stroke-linecap: round;
}
.b2{
  animation: flap 1.1s ease-in-out infinite alternate;
  transform-origin: center;
}
.b2-d1{
  animation-delay: .3s;
}
.b2-d2{
  animation-delay: .6s;
}
@keyframes birdsfly{
  0% { transform: translateX(0) translateY(0); opacity: 0; }
  6% { opacity: .55; }
  50% { transform: translateX(60vw) translateY(-4vh); opacity: .55; }
  94% { opacity: .4; }
  100% { transform: translateX(118vw) translateY(-7vh); opacity: 0; }
}
@keyframes flap{
  from { transform: scaleY(.75); }
  to { transform: scaleY(1.15); }
}
@keyframes pulse{
  50% { opacity: .25; }
}
.flap-cell{
  display: grid;
  place-items: center;
  width: clamp(20px, 2.2vw, 30px);
  height: clamp(30px, 3.2vw, 44px);
  background-color: oklch(0.205 0.02 58);
  color: oklch(0.93 0.014 82);
  font-family: var(--f-mono);
  font-weight: 500;
  font-size: clamp(.8rem, 1.3vw, 1.15rem);
  border-radius: 4px;
  box-shadow: inset 0 -1px 0 oklch(1 0 0 / .14), inset 0 12px 12px -12px oklch(0 0 0 / .6);
}
.flap-cell.flip{
  animation: flip .34s var(--ease);
}
@keyframes flip{
  0% { transform: rotateX(0); }
  49% { transform: rotateX(90deg); }
  51% { transform: rotateX(-90deg); }
  100% { transform: rotateX(0); }
}
svg.boxsvg{
  position: absolute;
  top: -1px;
  right: -1px;
  bottom: -1px;
  left: -1px;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  max-height: none;
  pointer-events: none;
  overflow: visible;
}
.boxsvg-rect{
  fill: none;
  stroke: var(--pencil);
  stroke-width: 1.8;
  filter: url(#rough);
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
}
.rv.in .boxsvg-rect,
[data-boxdrawn] .boxsvg-rect{
  animation: boxdraw 1.4s var(--slow) .1s forwards;
}
@keyframes boxdraw{
  to { stroke-dashoffset: 0; }
}
.v5-manifesto p{
  font-size: clamp(30px, 4.5vw, 62px);
  line-height: 1.22;
  letter-spacing: -.02em;
  font-weight: 500;
}
.v5-manifesto .w{
  opacity: .14;
  transition: opacity .35s linear;
}
.v5-manifesto .w.lit{
  opacity: 1;
}
#circled{
  position: relative;
  display: inline-block;
}
.circled-svg{
  position: absolute;
  left: -14%;
  top: -22%;
  width: 128%;
  height: 144%;
  overflow: visible;
  pointer-events: none;
}
.circled-path{
  fill: none;
  stroke: var(--accent-ink);
  stroke-width: 2.6;
  opacity: .8;
  filter: url(#rough);
  stroke-dasharray: 400;
  stroke-dashoffset: 400;
}
#circled.draw path{
  animation: dash400 .9s var(--slow) forwards;
}
@keyframes dash400{
  to { stroke-dashoffset: 0; }
}
.v5-manifesto .v5-sig{
  margin-top: 7vh;
  font-size: clamp(24px, 2.6vw, 32px);
}
@media (max-width: 900px){
  .v5-hero {
    grid-template-columns: 1fr;
  }

  .v5-hero-plate {
    padding-top: 2vh;
    padding-right: var(--gutter);
    padding-bottom: 8vh;
    padding-left: var(--gutter);
  }

  .v5-plate-wrap {
    width: min(72vw, 400px);
    margin-top: 0;
    margin-right: auto;
    margin-bottom: 0;
    margin-left: auto;
  }
}
@media (max-width: 600px){
  .v5-flap {
    gap: 2px;
  }

  .flap-cell {
    width: 12px;
    height: 26px;
    font-size: .58rem;
    border-radius: 3px;
  }

  .v5-dep {
    padding-top: 20px;
    padding-right: 16px;
    padding-bottom: 20px;
    padding-left: 16px;
  }

  .v5-dep-meta {
    margin-left: 0;
  }
}
@media (prefers-reduced-motion: reduce){
  *,
  *::before,
  *::after {
    animation-duration: .001s !important;
    transition-duration: .001s !important;
  }
}
.v5-wp[data-side="right"] .v5-wp-inner{
  margin-left: auto;
  flex-direction: row-reverse;
}
.v5-wp[data-side="right"] .v5-wp-body{
  text-align: right;
}
.v5-wp-pin img,
.v5-wp-pin video{
  width: 100%;
  aspect-ratio: 1 / 1.12;
  object-fit: cover;
  border-radius: 1px;
  filter: blur(12px) saturate(0.45) brightness(1.18);
  transition: filter 2s var(--ease) 0.35s;
}
.v5-wp.arrived .v5-wp-pin img,
.v5-wp.arrived .v5-wp-pin video{
  filter: none;
}
.v5-wp-pin .v5-pframe{
  display: block;
  overflow: hidden;
  border-radius: 1px;
}
.v5-wp-pin .v5-pframe img{
  animation: kbA var(--kbd, 16s) ease-in-out infinite alternate;
}
.v5-wp-pin .v5-pframe.v5-kb2 img{
  animation-name: kbB;
}
.v5-wp-pin .v5-plabel{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 6px;
  text-align: center;
  font-family: var(--f-hand);
  font-size: 18px;
  color: oklch(0.36 0.06 58);
}
.v5-wp-pin .v5-pstamp{
  position: absolute;
  top: 18px;
  right: 18px;
  font-family: var(--f-mono);
  font-size: 0.56rem;
  letter-spacing: 0.14em;
  color: oklch(0.98 0.005 84);
  background-color: oklch(0.205 0.018 56 / 0.5);
  padding-top: 5px;
  padding-right: 10px;
  padding-bottom: 5px;
  padding-left: 10px;
  border-radius: 100px;
  backdrop-filter: blur(3px);
}
.v5-wp.arrived .v5-wp-pin{
  opacity: 1;
  transform: rotate(var(--tilt, -3deg)) scale(1) translateY(0);
}
.v5-wp.arrived .v5-wp-pin:hover{
  transform: rotate(0deg) scale(1.03);
  transition-duration: 0.5s;
}
.v5-wp-body .v5-wp-day{
  font-family: var(--f-mono);
  font-size: 0.68rem;
  letter-spacing: 0.24em;
  color: var(--accent-ink);
  display: block;
  margin-bottom: 16px;
  opacity: 0;
  transition: opacity 0.6s var(--ease) 0.15s;
}
.v5-wp.arrived .v5-wp-body .v5-wp-day{
  opacity: 1;
}
.v5-wp.arrived .v5-wp-h3{
  opacity: 1;
  transform: none;
}
.v5-wp-body .v5-wp-note{
  display: block;
  margin-top: 18px;
  font-size: clamp(22px, 2.1vw, 29px);
}
.v5-wp .v5-wp-ghostno{
  position: absolute;
  z-index: -1;
  font-family: var(--f-serif);
  font-style: italic;
  font-size: clamp(160px, 24vw, 340px);
  color: var(--ink);
  opacity: 0.045;
  top: 50%;
  transform: translateY(-50%);
}
.v5-wp[data-side="left"] .v5-wp-ghostno{
  right: 6vw;
}
.v5-wp[data-side="right"] .v5-wp-ghostno{
  left: 6vw;
}
.v5-wp.arrived .v5-wp-pin.v5-tilt-a,
.v5-wp.arrived .v5-wp-pin.v5-tilt-b,
.v5-wp.arrived .v5-wp-pin.v5-tilt-c{
  transform: rotate(var(--tilt, -3deg)) scale(1) translateY(0);
}
.v5-wp.arrived .v5-wp-pin.v5-tilt-a:hover,
.v5-wp.arrived .v5-wp-pin.v5-tilt-b:hover,
.v5-wp.arrived .v5-wp-pin.v5-tilt-c:hover{
  transform: rotate(0deg) scale(1.03);
}
.v5-pframe.v5-kb-17s img{
  animation-duration: 17s;
}
.v5-pframe.v5-kb-21s img{
  animation-duration: 21s;
}
.v5-island-head .v5-lede{
  max-width: 380px;
  color: var(--ink-2);
  line-height: 1.6;
  font-size: 1rem;
}
.v5-plate .v5-shade{
  position: absolute;
  top:0;right:0;bottom:0;left:0;
  background-image: linear-gradient(200deg, transparent 46%, oklch(0.205 0.018 56 / 0.55));
  z-index: 2;
}
.v5-plate .v5-no{
  position: absolute;
  top: 16px;
  left: 20px;
  z-index: 3;
  font-family: var(--f-mono);
  font-size: 0.66rem;
  letter-spacing: 0.2em;
  color: oklch(0.98 0.005 84 / 0.9);
}
.v5-plate .v5-t{
  position: absolute;
  left: 22px;
  bottom: 20px;
  z-index: 3;
  color: oklch(0.98 0.005 84);
}
.v5-plate .v5-t .v5-mono{
  color: oklch(0.98 0.005 84 / 0.75);
  display: block;
  margin-top: 8px;
}
.v5-plate .v5-note{
  position: absolute;
  right: 20px;
  top: 16px;
  z-index: 3;
  font-family: var(--f-hand);
  font-size: clamp(16px, 1.6vw, 21px);
  color: oklch(0.98 0.005 84);
  transform: rotate(2.5deg);
}
.v5-plate-cta .v5-inner{
  padding-top: 0;
  padding-right: 8%;
  padding-bottom: 0;
  padding-left: 8%;
}
.v5-plate-cta .v5-scrawl{
  color: var(--accent);
  font-size: clamp(20px, 2vw, 26px);
  display: block;
  margin-top: 18px;
  margin-bottom: 26px;
  font-family: var(--f-scrawl);
}
.v5-wp.arrived .v5-visited{
  animation: stampin 0.45s var(--slow) 1.15s forwards;
}
@keyframes stampin{
  0% {
    opacity: 0;
    transform: rotate(-11deg) scale(2.6);
  }
  70% {
    opacity: 0.9;
    transform: rotate(-11deg) scale(0.94);
  }
  100% {
    opacity: 0.85;
    transform: rotate(-11deg) scale(1);
  }
}
@media (max-width: 900px){
  .v5-wp {
    min-height: 0;
  }

  .v5-wp-inner {
    flex-direction: column !important;
    align-items: flex-start;
    gap: 24px;
  }

  .v5-wp[data-side="right"] .v5-wp-body {
    text-align: left;
  }

  .v5-wp-pin {
    width: min(78vw, 360px);
  }

  .v5-wp .v5-wp-ghostno {
    font-size: clamp(120px, 30vw, 220px);
  }
}
@media (max-width: 600px){
  .v5-plate .v5-note {
    top: 42px;
  }

  .v5-wp-pin {
    width: min(84vw, 340px);
  }
}
@media (prefers-reduced-motion: reduce){
  *,
  *::before,
  *::after {
    animation-duration: 0.001s !important;
    transition-duration: 0.001s !important;
  }
}
.v5-jrow:hover .v5-jrow-sub{
  opacity:1
}
.jghost-img{
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  left:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  transition:opacity .35s
}
.jghost-img.show{
  opacity:1
}
.v5-hint b{
  color:var(--accent-ink)
}
.v5-cat-map svg{
  width:100%;
  height:auto;
  overflow:visible;
  display:block;
  max-height:72svh
}
.cisle{
  fill:var(--paper-3);
  fill-opacity:.4;
  stroke:var(--pencil);
  stroke-width:2.4;
  filter:url(#rough)
}
.croute{
  fill:none;
  stroke:var(--accent-ink);
  stroke-width:3.4;
  stroke-linecap:round;
  stroke-dasharray:8 10;
  filter:url(#rough);
  opacity:0;
  transition:opacity .3s
}
.croute.on{
  opacity:.95
}
.cchip{
  font-family:var(--f-mono);
  font-size:15px;
  letter-spacing:.1em;
  fill:var(--ink-2)
}
.cdot{
  fill:var(--paper-live);
  stroke:var(--accent-ink);
  stroke-width:2
}
.v5-crow-h3 .v5-it{
  font-size:.92em
}
.v5-crow:hover .v5-crow-go,
.v5-crow.hi .v5-crow-go{
  background-color:var(--ink);
  color:var(--paper-live)
}
.v5-crow:hover .v5-crow-extra,
.v5-crow.hi .v5-crow-extra{
  max-height:170px;
  opacity:1
}
.v5-cstopchips b{
  color:var(--accent-ink);
  font-weight:500;
  padding-top:0;
  padding-right:2px;
  padding-bottom:0;
  padding-left:2px
}
.v5-crow-extra .v5-btn-text{
  margin-top:12px;
  display:inline-flex;
  color:var(--accent-ink)
}
.v5-cat-blank p{
  max-width:420px;
  color:var(--ink-2);
  line-height:1.6;
  font-size:.95rem
}
@media (max-width:900px){
  .v5-cat-grid{
    grid-template-columns:1fr
  }

  .v5-cat-map{
    position:relative;
    top:auto
  }

  .v5-hint{
    text-align:left;
    max-width:100%
  }

  .v5-jghost{
    display:none
  }
}
@media (max-width:600px){
  .v5-cthumb{
    width:58px;
    height:44px
  }
}
.v5-hold-head p{
  margin-top: 3vh;
  margin-right: 0;
  margin-bottom: 0;
  margin-left: 0;
  color: var(--ink-2);
  line-height: 1.7;
  font-family: var(--f-serif);
  font-size: clamp(17px, 1.5vw, 21px);
}
.v5-hold-head p b{
  color: var(--ink);
}
.draft-arrow{
  position: absolute;
  left: -64px;
  top: 34%;
  width: 58px;
  height: 44px;
  overflow: visible;
}
.draft-arrow-path{
  fill: none;
  stroke: var(--pencil);
  stroke-width: 2;
  stroke-linecap: round;
  filter: url(#rough);
  stroke-dasharray: 140;
  stroke-dashoffset: 140;
}
.draft-arrow.draw .draft-arrow-path{
  animation: dash140 0.8s var(--slow) forwards;
}
@keyframes dash140{
  to {
    stroke-dashoffset: 0;
  }
}
.v5-jb-body .v5-mono{
  font-size: 0.54rem;
}
.v5-journal-copy > p{
  margin-top: 2.5vh;
  margin-right: 0;
  margin-bottom: 0;
  margin-left: 0;
  max-width: 460px;
  color: var(--ink-2);
  line-height: 1.7;
  font-family: var(--f-serif);
  font-size: 1.05rem;
}
.v5-journal-copy .v5-dl{
  margin-top: 4vh;
  margin-right: 0;
  margin-bottom: 0;
  margin-left: 0;
  display: flex;
  align-items: center;
  gap: 18px;
}
@media (max-width: 900px){
  .v5-hold-grid,
  .v5-journal {
    grid-template-columns: 1fr;
  }

  .v5-how-grid {
    grid-template-columns: 1fr;
  }

  .v5-step {
    border-left: 0;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: var(--line);
  }

  .draft-arrow {
    display: none;
  }
}
@media (max-width: 600px){
  .v5-jlistgrid {
    grid-template-columns: 1fr;
  }
}
.v5-explore .v5-sechead{
  padding-top:0;
  padding-right:var(--gutter);
  padding-bottom:0;
  padding-left:var(--gutter);
}
.v5-scard:hover .v5-scard-img{
  transform:scale(1.06);
}
.v5-scard .v5-ov{
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  left:0;
  background-image:linear-gradient(195deg,transparent 44%,oklch(0.205 0.018 56/.62));
  z-index:2;
}
.v5-scard .v5-schip{
  position:absolute;
  top:12px;
  left:12px;
  z-index:3;
  font-family:var(--f-mono);
  font-size:.54rem;
  letter-spacing:.14em;
  color:oklch(0.98 0.005 84);
  background:oklch(0.205 0.018 56/.45);
  padding-top:5px;
  padding-right:10px;
  padding-bottom:5px;
  padding-left:10px;
  border-radius:100px;
  backdrop-filter:blur(3px);
  text-transform:uppercase;
}
.v5-scard .v5-st{
  position:absolute;
  left:14px;
  right:14px;
  bottom:13px;
  z-index:3;
  color:oklch(0.98 0.005 84);
}
.v5-shelf-foot .v5-mono{
  white-space:nowrap;
}
.v5-story-quote .v5-it{
  color:var(--accent);
}
@media (max-width:900px){
  .v5-stats{
    grid-template-columns:1fr 1fr;
  }

  .v5-stat{
    border-left:0;
    border-top-width:1px;
    border-top-style:solid;
    border-top-color:var(--line-2);
  }
}
@media (max-width:600px){
  .v5-story-quote{
    min-height:0;
  }
}