:root {
  --roadmap-blood: #a30f27;
  --roadmap-blood-bright: #e23854;
  --roadmap-purple: #ae52ff;
  --roadmap-gold: #f3ce72;
  --roadmap-ink: #080407;
}

.roadmap-page {
  min-height: 100vh;
}

.roadmap-backdrop {
  position: relative;
  margin-top: 18px;
  padding: 34px 0 70px;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 4%, rgba(115, 18, 40, 0.22), transparent 28%),
    radial-gradient(circle at 9% 42%, rgba(126, 40, 196, 0.15), transparent 24%),
    linear-gradient(rgba(3, 2, 5, 0.66), rgba(3, 2, 5, 0.88)),
    url('/assets/cosmic-bg.jpg') center top / cover fixed;
  box-shadow: inset 0 0 90px 30px #030204;
}

.roadmap-backdrop::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.16;
  background-image:
    linear-gradient(90deg, transparent 49.8%, rgba(255, 255, 255, 0.05) 50%, transparent 50.2%),
    linear-gradient(transparent 49.8%, rgba(255, 255, 255, 0.035) 50%, transparent 50.2%);
  background-size: 46px 46px;
  mask-image: linear-gradient(transparent, #000 18%, #000 82%, transparent);
}

.roadmap-backdrop .section {
  width: min(calc(100% - 32px), 1420px);
}

.roadmap-hero {
  position: relative;
  z-index: 1;
  padding: clamp(38px, 6vw, 78px) 24px clamp(34px, 5vw, 64px);
  text-align: center;
}

.roadmap-back-link {
  display: inline-flex;
  margin-bottom: 24px;
  color: #caa7e7;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-decoration: none;
  text-transform: uppercase;
}

.roadmap-back-link:hover,
.roadmap-back-link:focus-visible {
  color: #ffe39a;
}

.roadmap-hero-eyebrow {
  margin: 0 0 10px;
  color: var(--roadmap-gold) !important;
  font-family: 'Cinzel', serif;
  font-size: clamp(0.72rem, 1.4vw, 0.86rem) !important;
  font-weight: 800;
  letter-spacing: 0.24em;
  text-transform: uppercase;
}

.roadmap-hero h1 {
  max-width: 1000px;
  margin: 0 auto;
  color: #fff7e5;
  font-family: 'Cinzel', serif;
  font-size: clamp(2.5rem, 7vw, 6.2rem);
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 0.94;
  text-shadow:
    0 5px 0 rgba(44, 5, 14, 0.8),
    0 0 30px rgba(176, 47, 84, 0.45),
    0 0 70px rgba(130, 40, 213, 0.32);
}

.roadmap-hero-lead {
  max-width: 740px;
  margin: 20px auto 0;
  color: #d8cadd !important;
  font-size: clamp(0.96rem, 1.8vw, 1.14rem) !important;
  font-weight: 600;
  line-height: 1.7 !important;
}

.roadmap-hero-runes {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  margin-top: 23px;
}

.roadmap-hero-runes span {
  width: min(15vw, 96px);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(242, 202, 106, 0.65));
}

.roadmap-hero-runes span:last-child {
  transform: scaleX(-1);
}

.roadmap-hero-runes i {
  width: 12px;
  height: 12px;
  border: 1px solid rgba(245, 207, 114, 0.8);
  background: #5a1427;
  box-shadow: 0 0 18px rgba(199, 48, 91, 0.8);
  transform: rotate(45deg);
}

.roadmap-journey {
  position: relative;
  z-index: 1;
}

.roadmap-shell {
  display: grid;
  grid-template-columns: minmax(390px, 0.92fr) minmax(0, 1.08fr);
  align-items: start;
  gap: clamp(20px, 3vw, 42px);
  padding: clamp(13px, 2vw, 26px);
  border: 1px solid rgba(226, 185, 132, 0.2);
  border-radius: 8px 26px 8px 26px;
  background:
    radial-gradient(circle at 8% 12%, rgba(161, 24, 50, 0.14), transparent 30%),
    radial-gradient(circle at 94% 88%, rgba(142, 49, 222, 0.11), transparent 26%),
    linear-gradient(145deg, rgba(23, 12, 15, 0.98), rgba(6, 4, 8, 0.99));
  box-shadow:
    inset 0 1px rgba(255, 255, 255, 0.05),
    inset 0 0 90px rgba(61, 7, 19, 0.18),
    0 38px 90px rgba(0, 0, 0, 0.58);
}

.roadmap-map-card {
  position: sticky;
  top: 112px;
  min-width: 0;
  padding: 8px;
  border: 1px solid rgba(211, 169, 106, 0.35);
  border-radius: 7px 20px 7px 20px;
  background: linear-gradient(145deg, #24140f, #080609 72%);
  box-shadow: inset 0 0 0 3px rgba(0, 0, 0, 0.5), 0 18px 42px rgba(0, 0, 0, 0.5);
}

.roadmap-stage {
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  border: 1px solid rgba(240, 197, 126, 0.35);
  border-radius: 4px 14px 4px 14px;
  background: #170b0c;
  box-shadow: inset 0 0 42px #000, 0 12px 30px rgba(0, 0, 0, 0.5);
}

.roadmap-terrain {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.94) contrast(1.04) brightness(0.78);
  transform: scale(1.012);
}

.roadmap-map-vignette {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.36), transparent 12% 88%, rgba(0, 0, 0, 0.42)),
    linear-gradient(rgba(0, 0, 0, 0.3), transparent 12% 88%, rgba(0, 0, 0, 0.48));
  box-shadow: inset 0 0 48px 10px rgba(0, 0, 0, 0.68);
}

.roadmap-route-map {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.roadmap-route-map path {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.roadmap-route-shadow {
  stroke: rgba(22, 0, 4, 0.28);
  stroke-width: 12;
}

.roadmap-route-blood {
  stroke: rgba(76, 1, 13, 0.48);
  stroke-width: 8;
  filter: url('#roadmap-blood-texture');
}

.roadmap-route-markings {
  stroke: rgba(116, 4, 24, 0.68);
  stroke-width: 6;
  stroke-dasharray: 1 27;
}

.roadmap-route-progress {
  stroke: rgba(126, 2, 24, 0.72);
  stroke-width: 6;
  filter: url('#roadmap-blood-texture');
}

.roadmap-route-guide {
  stroke: transparent;
  stroke-width: 1;
}

.roadmap-traveler {
  --roadmap-facing: 1;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 5;
  width: clamp(60px, 7vw, 86px);
  aspect-ratio: 1168 / 1346;
  pointer-events: none;
  will-change: transform;
}

.roadmap-traveler img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 10px 6px rgba(0, 0, 0, 0.86)) drop-shadow(0 0 8px rgba(175, 73, 255, 0.45));
  transform: scaleX(var(--roadmap-facing));
  transform-origin: 50% 90%;
}

.roadmap-traveler.is-walking img {
  animation: roadmap-traveler-step 240ms steps(2, end) infinite;
}

.roadmap-stop-list {
  position: absolute;
  inset: 0;
  z-index: 6;
  pointer-events: none;
}

.roadmap-stop {
  position: absolute;
  display: grid;
  justify-items: center;
  gap: 4px;
  width: 108px;
  min-height: 88px;
  color: #fff;
  text-decoration: none;
  pointer-events: auto;
  transform: translate(-50%, -50%);
}

.roadmap-stop:nth-child(1) { left: 13.7%; top: 13.75%; }
.roadmap-stop:nth-child(2) { left: 84%; top: 25%; }
.roadmap-stop:nth-child(3) { left: 29%; top: 62%; }
.roadmap-stop:nth-child(4) { left: 76%; top: 87.5%; }

.roadmap-stop time {
  position: relative;
  display: grid;
  place-content: center;
  width: 66px;
  height: 66px;
  border: 3px solid #711522;
  border-radius: 50%;
  background:
    radial-gradient(circle at 36% 25%, rgba(255, 217, 176, 0.11), transparent 22%),
    radial-gradient(circle at 62% 72%, rgba(143, 4, 31, 0.72), transparent 44%),
    linear-gradient(145deg, #3c0a14, #100507 72%);
  color: #ffe6b1;
  line-height: 1;
  text-align: center;
  box-shadow: inset 0 0 0 3px #090405, inset 0 0 18px rgba(183, 10, 44, 0.38), 0 5px 0 #090405, 0 9px 19px rgba(0, 0, 0, 0.8);
  transition: opacity 160ms ease, transform 180ms ease, border-color 180ms ease, filter 180ms ease;
}

.roadmap-stop time::before {
  content: '';
  position: absolute;
  inset: -8px;
  border: 2px dotted rgba(126, 12, 31, 0.72);
  border-radius: 50%;
  transform: rotate(-8deg);
}

.roadmap-stop time::after {
  content: '';
  position: absolute;
  right: 7px;
  bottom: -10px;
  width: 17px;
  height: 14px;
  background: linear-gradient(145deg, #7f0b21, #29040b);
  clip-path: polygon(8% 0, 92% 0, 72% 38%, 84% 62%, 58% 100%, 34% 62%, 20% 82%, 24% 34%);
  filter: drop-shadow(0 4px 3px rgba(0, 0, 0, 0.65));
}

.roadmap-stop time strong {
  font-family: 'Cinzel', serif;
  font-size: 1.28rem;
}

.roadmap-stop time span {
  margin-top: 2px;
  font-size: 0.52rem;
  font-weight: 900;
  letter-spacing: 0.16em;
}

.roadmap-stop-name {
  max-width: 108px;
  padding: 5px 9px;
  border: 1px solid rgba(136, 21, 41, 0.72);
  border-radius: 3px;
  background: linear-gradient(180deg, rgba(55, 5, 17, 0.95), rgba(9, 4, 7, 0.96));
  color: #f1ddb5;
  font-size: 0.58rem;
  font-weight: 900;
  letter-spacing: 0.07em;
  line-height: 1.1;
  text-align: center;
  text-transform: uppercase;
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.72);
}

.roadmap-stop:hover time,
.roadmap-stop:focus-visible time,
.roadmap-stop.is-active time {
  border-color: #d5465d;
  filter: brightness(1.16);
  transform: translateY(-2px) scale(1.08);
  box-shadow: inset 0 0 0 3px #17050a, inset 0 0 20px rgba(218, 22, 61, 0.46), 0 5px 0 #18050b, 0 0 0 5px rgba(126, 12, 34, 0.28), 0 0 24px rgba(158, 48, 211, 0.42);
}

.roadmap-stop.is-active .roadmap-stop-name {
  border-color: rgba(211, 57, 82, 0.9);
  color: #ffe59b;
  background: rgba(74, 8, 28, 0.94);
}

.roadmap-journey.is-enhanced .roadmap-stop.is-occupied > time {
  opacity: 0;
  pointer-events: none;
}

.roadmap-stop:focus-visible {
  outline: 3px solid #ffe59b;
  outline-offset: 4px;
  border-radius: 10px;
}

.roadmap-map-hint {
  margin: 10px 4px 1px !important;
  color: #bca8b1 !important;
  font-size: 0.68rem !important;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-align: center;
  text-transform: uppercase;
}

.roadmap-details {
  min-width: 0;
}

.roadmap-panel-stack {
  display: grid;
  gap: 18px;
}

.roadmap-panel {
  position: relative;
  min-width: 0;
  padding: clamp(22px, 3.2vw, 38px);
  overflow: hidden;
  border: 1px solid rgba(211, 164, 108, 0.24);
  border-radius: 20px 5px 20px 5px;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.022) 1px, transparent 1px),
    linear-gradient(rgba(255, 255, 255, 0.018) 1px, transparent 1px),
    radial-gradient(circle at 93% 5%, rgba(160, 37, 71, 0.2), transparent 30%),
    linear-gradient(150deg, rgba(28, 13, 20, 0.98), rgba(7, 5, 10, 0.99) 68%);
  background-size: 24px 24px, 24px 24px, auto, auto;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 24px 52px rgba(0, 0, 0, 0.5);
}

.roadmap-panel::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 96px;
  height: 96px;
  border-top: 2px solid rgba(243, 204, 112, 0.58);
  border-left: 2px solid rgba(243, 204, 112, 0.58);
  pointer-events: none;
}

.roadmap-panel[hidden] {
  display: none;
}

.roadmap-journey.is-enhanced .roadmap-panel.is-active {
  animation: roadmap-panel-in 380ms ease both;
}

.roadmap-panel-heading {
  position: relative;
}

.roadmap-panel-heading time {
  color: var(--roadmap-gold);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.roadmap-panel-heading h2 {
  margin: 9px 0 10px;
  color: #fff6e6;
  font-family: 'Cinzel', serif;
  font-size: clamp(1.55rem, 3vw, 2.65rem);
  font-weight: 800;
  line-height: 1.05;
  text-shadow: 0 0 24px rgba(174, 47, 87, 0.3);
}

.roadmap-panel-heading p {
  margin: 0 !important;
  color: #cfc0d1 !important;
  font-size: 0.92rem !important;
  font-weight: 600;
  line-height: 1.6 !important;
}

.roadmap-feature-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px 12px;
  margin: 22px 0;
  padding: 0;
  list-style: none;
}

.roadmap-feature-list li {
  position: relative;
  min-height: 54px;
  padding: 12px 13px 12px 35px;
  border: 1px solid rgba(223, 181, 129, 0.13);
  border-radius: 9px 3px 9px 3px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(96, 11, 34, 0.07));
  color: #eee3ea;
  font-size: 0.79rem;
  font-weight: 700;
  line-height: 1.5;
}

.roadmap-feature-list li::before {
  content: '';
  position: absolute;
  top: 17px;
  left: 14px;
  width: 9px;
  height: 9px;
  background: linear-gradient(145deg, #f4d47e, #c52753 52%, #9c43e8);
  box-shadow: 0 0 10px rgba(201, 43, 84, 0.7);
  transform: rotate(45deg);
}

.roadmap-feature-list-single {
  grid-template-columns: 1fr;
}

.roadmap-feature-wide {
  grid-column: 1 / -1;
}

.roadmap-boss-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}

.roadmap-boss,
.roadmap-wide-media,
.roadmap-wheel-media,
.roadmap-cape-media,
.roadmap-interface-grid figure,
.roadmap-plane-media {
  position: relative;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(220, 177, 123, 0.2);
  border-radius: 11px 3px 11px 3px;
  background: radial-gradient(circle at 50% 40%, rgba(130, 43, 188, 0.2), transparent 50%), rgba(3, 3, 6, 0.86);
}

.roadmap-boss {
  display: grid;
  grid-template-rows: 150px auto;
}

.roadmap-boss-featured {
  border-color: rgba(205, 76, 238, 0.43);
}

.roadmap-boss img {
  align-self: center;
  width: 100%;
  height: 148px;
  padding: 7px;
  object-fit: contain;
  filter: drop-shadow(0 11px 9px rgba(0, 0, 0, 0.75));
  transition: transform 240ms ease, filter 240ms ease;
}

.roadmap-boss:hover img {
  filter: drop-shadow(0 13px 10px rgba(0, 0, 0, 0.8)) brightness(1.1);
  transform: translateY(-3px) scale(1.04);
}

.roadmap-boss figcaption,
.roadmap-interface-grid figcaption {
  position: relative;
  z-index: 2;
  padding: 9px 6px;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
  background: rgba(8, 4, 8, 0.92);
  color: #f4e2bd;
  font-family: 'Cinzel', serif;
  font-size: 0.65rem;
  font-weight: 800;
  line-height: 1.25;
  text-align: center;
}

.roadmap-boss figcaption span {
  display: block;
  margin-top: 3px;
  color: #cd8cf1;
  font-family: 'Inter', sans-serif;
  font-size: 0.51rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.roadmap-wide-media {
  min-height: 290px;
  aspect-ratio: 16 / 9;
}

.roadmap-competition-preview {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
  margin-top: 10px;
}

.roadmap-competition-preview img {
  width: 100%;
  height: 150px;
  padding: 16px;
  object-fit: contain;
  border: 1px solid rgba(139, 29, 53, 0.42);
  border-radius: 10px 3px 10px 3px;
  background: radial-gradient(circle, rgba(123, 29, 179, 0.2), transparent 58%), linear-gradient(145deg, rgba(32, 8, 17, 0.96), rgba(4, 3, 6, 0.98));
  filter: drop-shadow(0 10px 8px rgba(0, 0, 0, 0.55));
}

.roadmap-wide-media img,
.roadmap-plane-media > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.roadmap-wide-media::after,
.roadmap-plane-media::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 40%, rgba(5, 3, 7, 0.93));
  pointer-events: none;
}

.roadmap-wide-media figcaption {
  position: absolute;
  right: 18px;
  bottom: 15px;
  left: 18px;
  z-index: 2;
  color: #fff0c1;
  font-family: 'Cinzel', serif;
  font-size: clamp(0.82rem, 1.6vw, 1.08rem);
  font-weight: 800;
  text-shadow: 0 2px 8px #000;
}

.roadmap-media-badge {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 2;
  padding: 8px 11px;
  border: 1px solid rgba(246, 211, 126, 0.72);
  border-radius: 4px;
  background: rgba(43, 7, 20, 0.92);
  color: #ffe08c;
  font-size: 0.62rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.roadmap-legendary-showcase {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(170px, 0.65fr);
  gap: 10px;
}

.roadmap-wheel-media,
.roadmap-cape-media {
  min-height: 292px;
}

.roadmap-wheel-media img,
.roadmap-cape-media img {
  width: 100%;
  height: 292px;
  padding: 8px;
  object-fit: contain;
  filter: drop-shadow(0 14px 13px rgba(0, 0, 0, 0.68));
}

.roadmap-wheel-media figcaption,
.roadmap-cape-media figcaption {
  position: absolute;
  right: 10px;
  bottom: 9px;
  left: 10px;
  z-index: 2;
  padding: 8px 9px;
  border: 1px solid rgba(245, 208, 118, 0.26);
  background: rgba(8, 4, 9, 0.88);
  color: #f5e3be;
  font-family: 'Cinzel', serif;
  font-size: 0.65rem;
  font-weight: 800;
  text-align: center;
  backdrop-filter: blur(5px);
}

.roadmap-cape-media figcaption span,
.roadmap-cape-media figcaption strong {
  display: block;
}

.roadmap-cape-media figcaption strong {
  margin-top: 2px;
  color: #ffdb72;
  font-size: 1.15rem;
}

.roadmap-interface-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.roadmap-interface-grid figure {
  display: grid;
  grid-template-rows: 180px auto;
}

.roadmap-interface-grid img {
  width: 100%;
  height: 180px;
  padding: 6px;
  object-fit: contain;
}

.roadmap-feature-list-compact {
  margin-bottom: 13px;
}

.roadmap-god-mode-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 14px;
}

.roadmap-god-mode-tags span {
  padding: 7px 10px;
  border: 1px solid rgba(244, 205, 111, 0.35);
  border-radius: 3px;
  background: linear-gradient(180deg, rgba(243, 204, 104, 0.1), rgba(141, 36, 206, 0.09));
  color: #f4e4b9;
  font-size: 0.6rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.roadmap-plane-media {
  height: clamp(270px, 32vw, 370px);
}

.roadmap-plane-media figcaption {
  position: absolute;
  bottom: 17px;
  left: 17px;
  z-index: 2;
  max-width: min(74%, 390px);
  padding: 11px 15px;
  border: 1px solid rgba(255, 225, 139, 0.43);
  border-radius: 5px;
  background: rgba(8, 4, 10, 0.86);
  color: #fff0c7;
  backdrop-filter: blur(7px);
}

.roadmap-plane-media figcaption span,
.roadmap-plane-media figcaption strong,
.roadmap-plane-media figcaption small {
  display: block;
}

.roadmap-plane-media figcaption span {
  color: #d9a2f7;
  font-size: 0.56rem;
  font-weight: 900;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.roadmap-plane-media figcaption strong {
  margin: 3px 0;
  color: #ffdc70;
  font-family: 'Cinzel', serif;
  font-size: clamp(1.4rem, 3vw, 2.1rem);
  line-height: 1;
}

.roadmap-plane-media figcaption strong em {
  color: #fff8df;
  font-size: 0.56em;
  font-style: normal;
}

.roadmap-plane-media figcaption small {
  color: #f3e8d2;
  font-size: 0.64rem;
  font-weight: 800;
}

.roadmap-controls {
  display: none;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  margin-top: 15px;
}

.roadmap-journey.is-enhanced .roadmap-controls {
  display: grid;
}

.roadmap-control {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 47px;
  padding: 10px 15px;
  border: 1px solid rgba(222, 177, 119, 0.3);
  border-radius: 8px 2px 8px 2px;
  background: linear-gradient(145deg, rgba(79, 13, 32, 0.88), rgba(13, 7, 14, 0.98));
  color: #f7e8dc;
  font-family: 'Cinzel', serif;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  cursor: pointer;
}

.roadmap-control-next { justify-self: end; }
.roadmap-control-previous { justify-self: start; }

.roadmap-control:hover:not(:disabled),
.roadmap-control:focus-visible:not(:disabled) {
  border-color: rgba(247, 210, 123, 0.76);
  filter: brightness(1.15);
  transform: translateY(-2px);
}

.roadmap-control:focus-visible {
  outline: 3px solid rgba(255, 226, 145, 0.88);
  outline-offset: 3px;
}

.roadmap-control:disabled {
  cursor: not-allowed;
  opacity: 0.35;
}

.roadmap-counter {
  min-width: 54px;
  color: #d8c7d4;
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-align: center;
}

.roadmap-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Winter chapter — a separate continuation beyond the September trail. */
.roadmap-winter-chapter {
  position: relative;
  z-index: 1;
  margin-top: clamp(30px, 5vw, 64px);
  scroll-margin-top: 104px;
}

.roadmap-winter-gate {
  position: relative;
  display: grid;
  width: min(100%, 920px);
  margin: 0 auto;
  padding: clamp(20px, 3vw, 30px) clamp(18px, 4vw, 42px);
  overflow: hidden;
  border: 1px solid rgba(201, 230, 241, 0.56);
  border-radius: 5px 22px 5px 22px;
  background:
    linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.075), transparent),
    radial-gradient(circle at 50% 0, rgba(155, 211, 235, 0.24), transparent 54%),
    linear-gradient(145deg, rgba(22, 45, 58, 0.98), rgba(7, 14, 20, 0.99) 66%);
  color: #f5fbff;
  font: inherit;
  text-align: center;
  box-shadow:
    inset 0 0 0 3px rgba(4, 8, 13, 0.7),
    inset 0 1px rgba(255, 255, 255, 0.2),
    0 20px 54px rgba(0, 0, 0, 0.52),
    0 0 30px rgba(96, 167, 203, 0.12);
  cursor: pointer;
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.roadmap-winter-gate::before,
.roadmap-winter-gate::after {
  content: '';
  position: absolute;
  pointer-events: none;
}

.roadmap-winter-gate::before {
  inset: 5px;
  border: 1px solid rgba(183, 226, 244, 0.16);
  border-radius: 2px 16px 2px 16px;
}

.roadmap-winter-gate::after {
  top: -43px;
  left: 50%;
  width: 180px;
  height: 72px;
  border-radius: 50%;
  background: rgba(159, 218, 242, 0.2);
  filter: blur(30px);
  transform: translateX(-50%);
}

.roadmap-winter-gate:hover,
.roadmap-winter-gate:focus-visible {
  border-color: #d9f4ff;
  box-shadow:
    inset 0 0 0 3px rgba(4, 8, 13, 0.72),
    inset 0 1px rgba(255, 255, 255, 0.28),
    0 22px 58px rgba(0, 0, 0, 0.56),
    0 0 36px rgba(130, 205, 235, 0.25);
  transform: translateY(-2px);
}

.roadmap-winter-gate:focus-visible {
  outline: 3px solid #effbff;
  outline-offset: 4px;
}

.roadmap-winter-gate-kicker {
  color: #a8d5e7;
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.roadmap-winter-gate > strong {
  margin-top: 5px;
  font-family: 'Cinzel', serif;
  font-size: clamp(1.35rem, 3vw, 2.2rem);
  letter-spacing: 0.015em;
  text-shadow: 0 3px 0 #071018, 0 0 22px rgba(194, 235, 251, 0.22);
}

.roadmap-winter-gate-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin-top: 11px;
  color: #e8c36c;
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.roadmap-winter-gate-action i {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid rgba(232, 195, 108, 0.52);
  border-radius: 50%;
  font-size: 0.8rem;
  font-style: normal;
  transition: transform 220ms ease;
}

.roadmap-winter-chapter.is-open .roadmap-winter-gate-action i {
  transform: rotate(180deg);
}

.roadmap-winter-content {
  margin-top: 20px;
  padding: clamp(13px, 2vw, 26px);
  border: 1px solid rgba(186, 222, 237, 0.3);
  border-radius: 8px 26px 8px 26px;
  background:
    radial-gradient(circle at 8% 12%, rgba(113, 181, 211, 0.14), transparent 30%),
    radial-gradient(circle at 94% 88%, rgba(103, 10, 30, 0.16), transparent 28%),
    linear-gradient(145deg, rgba(17, 34, 43, 0.98), rgba(5, 10, 15, 0.99));
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.08), 0 38px 90px rgba(0, 0, 0, 0.58);
}

.roadmap-winter-chapter.is-enhanced:not(.is-open) .roadmap-winter-content {
  display: none;
}

.roadmap-winter-chapter.is-open .roadmap-winter-content {
  animation: roadmap-winter-open 480ms ease both;
}

.roadmap-winter-heading {
  max-width: 800px;
  margin: 3px auto clamp(18px, 3vw, 30px);
  text-align: center;
}

.roadmap-winter-heading p,
.roadmap-winter-heading h2,
.roadmap-winter-heading span {
  margin: 0;
}

.roadmap-winter-heading p {
  color: #a8d5e7 !important;
  font-size: 0.64rem !important;
  font-weight: 900;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.roadmap-winter-heading h2 {
  margin-top: 5px;
  color: #f5fbff;
  font-family: 'Cinzel', serif;
  font-size: clamp(1.75rem, 4vw, 3.25rem);
  line-height: 1;
  text-shadow: 0 4px 0 rgba(4, 12, 18, 0.9), 0 0 28px rgba(153, 215, 239, 0.22);
}

.roadmap-winter-heading span {
  display: block;
  margin-top: 11px;
  color: #c6d8df;
  font-size: clamp(0.82rem, 1.5vw, 0.98rem);
  font-weight: 600;
}

.roadmap-winter-shell {
  display: grid;
  grid-template-columns: minmax(390px, 0.92fr) minmax(0, 1.08fr);
  align-items: start;
  gap: clamp(20px, 3vw, 42px);
}

.roadmap-winter-map-card {
  border-color: rgba(187, 225, 240, 0.4);
  background: linear-gradient(145deg, #1c3541, #060b10 72%);
  box-shadow: inset 0 0 0 3px rgba(0, 0, 0, 0.5), 0 18px 42px rgba(0, 0, 0, 0.56), 0 0 30px rgba(109, 184, 215, 0.1);
}

.roadmap-winter-stage {
  border-color: rgba(208, 236, 247, 0.46);
  background: #101d26;
}

.roadmap-terrain-winter {
  filter: saturate(0.88) contrast(1.05) brightness(0.79) hue-rotate(-4deg);
}

.roadmap-winter-ice,
.roadmap-winter-snow {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

.roadmap-winter-ice {
  background:
    linear-gradient(118deg, rgba(221, 246, 255, 0.1), transparent 19% 72%, rgba(186, 227, 244, 0.08)),
    radial-gradient(circle at 52% 45%, transparent 44%, rgba(13, 30, 42, 0.22) 100%);
  box-shadow: inset 0 0 58px 12px rgba(4, 14, 23, 0.72);
}

.roadmap-winter-snow {
  z-index: 4;
  opacity: 0.58;
  background-image:
    radial-gradient(circle, rgba(255, 255, 255, 0.92) 0 1px, transparent 1.8px),
    radial-gradient(circle, rgba(222, 245, 255, 0.7) 0 1.2px, transparent 2px),
    radial-gradient(circle, rgba(255, 255, 255, 0.52) 0 0.8px, transparent 1.6px);
  background-position: 8px 7px, 34px 19px, 17px 39px;
  background-size: 41px 47px, 67px 73px, 31px 59px;
  mask-image: linear-gradient(to bottom, #000, rgba(0, 0, 0, 0.62) 72%, transparent);
  animation: roadmap-snowfall 13s linear infinite;
}

.roadmap-winter-vignette {
  z-index: 2;
  background:
    linear-gradient(90deg, rgba(3, 10, 16, 0.43), transparent 13% 87%, rgba(3, 10, 16, 0.48)),
    linear-gradient(rgba(3, 10, 16, 0.28), transparent 13% 86%, rgba(3, 10, 16, 0.52));
}

.roadmap-winter-stop {
  z-index: 7;
  left: 18%;
  top: 73%;
}

.roadmap-winter-stop time {
  border-color: #8f2739;
  background:
    radial-gradient(circle at 32% 24%, rgba(228, 248, 255, 0.22), transparent 24%),
    radial-gradient(circle at 62% 72%, rgba(125, 7, 29, 0.78), transparent 45%),
    linear-gradient(145deg, #4b101b, #0c1116 72%);
  box-shadow: inset 0 0 0 3px #071017, inset 0 0 18px rgba(184, 31, 60, 0.44), 0 5px 0 #050b10, 0 9px 21px rgba(0, 0, 0, 0.84), 0 0 17px rgba(203, 236, 248, 0.18);
}

.roadmap-winter-stop .roadmap-stop-name {
  border-color: rgba(169, 213, 231, 0.58);
  background: linear-gradient(180deg, rgba(31, 66, 83, 0.96), rgba(7, 16, 23, 0.97));
  color: #f0faff;
}

.roadmap-winter-stop:hover time,
.roadmap-winter-stop:focus-visible time {
  border-color: #e8f9ff;
  box-shadow: inset 0 0 0 3px #071017, inset 0 0 18px rgba(184, 31, 60, 0.5), 0 5px 0 #050b10, 0 0 0 5px rgba(185, 227, 244, 0.22), 0 0 25px rgba(183, 230, 247, 0.34);
}

.roadmap-winter-traveler {
  position: absolute;
  z-index: 6;
  left: 50%;
  top: 90%;
  width: clamp(58px, 7vw, 82px);
  transform: translate(-50%, -88%);
  pointer-events: none;
}

.roadmap-winter-traveler img {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 10px 6px rgba(0, 0, 0, 0.9)) drop-shadow(0 0 7px rgba(204, 240, 255, 0.34));
}

.roadmap-winter-more {
  position: absolute;
  top: 8%;
  left: 17%;
  z-index: 7;
  width: 34%;
  margin: 0 !important;
  padding: 7px 9px;
  border: 1px solid rgba(202, 234, 247, 0.44);
  border-radius: 3px;
  background: rgba(7, 19, 27, 0.88);
  color: #eaf8fd !important;
  font-size: clamp(0.48rem, 0.9vw, 0.6rem) !important;
  font-weight: 900;
  letter-spacing: 0.08em;
  line-height: 1.25 !important;
  text-align: center;
  text-transform: uppercase;
  box-shadow: 0 7px 18px rgba(0, 0, 0, 0.72);
}

.roadmap-winter-panel {
  border-color: rgba(190, 225, 239, 0.32);
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.026) 1px, transparent 1px),
    linear-gradient(rgba(255, 255, 255, 0.022) 1px, transparent 1px),
    radial-gradient(circle at 92% 5%, rgba(110, 183, 214, 0.2), transparent 31%),
    linear-gradient(150deg, rgba(19, 40, 51, 0.98), rgba(5, 11, 16, 0.99) 70%);
  background-size: 24px 24px, 24px 24px, auto, auto;
}

.roadmap-winter-panel::before {
  border-color: rgba(211, 239, 249, 0.66);
}

.roadmap-winter-panel .roadmap-panel-heading time {
  color: #a9d9eb;
}

.roadmap-winter-panel .roadmap-panel-heading h2 {
  color: #f4fbff;
  text-shadow: 0 3px 0 rgba(4, 13, 19, 0.94), 0 0 24px rgba(146, 211, 235, 0.2);
}

.roadmap-winter-feature-list li {
  border-color: rgba(173, 215, 232, 0.22);
  background: linear-gradient(145deg, rgba(31, 67, 82, 0.58), rgba(7, 16, 23, 0.94));
}

.roadmap-winter-feature-list li::before {
  color: #e5f8ff;
  text-shadow: 0 0 12px rgba(198, 237, 251, 0.72);
}

.roadmap-winter-teasers {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  margin-top: 21px;
}

.roadmap-winter-teasers > span {
  display: grid;
  place-items: center;
  gap: 8px;
  min-height: 112px;
  padding: 13px 8px;
  border: 1px solid rgba(175, 220, 238, 0.3);
  border-radius: 12px 3px 12px 3px;
  background: linear-gradient(145deg, rgba(41, 84, 101, 0.52), rgba(6, 15, 21, 0.92));
  color: #eefaff;
  text-align: center;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.08), 0 12px 26px rgba(0, 0, 0, 0.28);
}

.roadmap-winter-teasers i {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(218, 243, 252, 0.55);
  border-radius: 50%;
  background: rgba(8, 24, 33, 0.76);
  color: #e7f9ff;
  font-family: 'Cinzel', serif;
  font-size: 1.25rem;
  font-style: normal;
  box-shadow: 0 0 19px rgba(145, 213, 238, 0.18);
}

.roadmap-winter-teasers strong {
  font-size: 0.63rem;
  letter-spacing: 0.07em;
  line-height: 1.25;
  text-transform: uppercase;
}

.roadmap-winter-coming {
  display: grid;
  gap: 4px;
  margin: 21px 0 0 !important;
  padding: 14px 16px;
  border-left: 3px solid #8bbfd4;
  background: linear-gradient(90deg, rgba(67, 119, 140, 0.2), transparent);
}

.roadmap-winter-coming span {
  color: #a9d5e5;
  font-size: 0.58rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.roadmap-winter-coming strong {
  color: #f0faff;
  font-family: 'Cinzel', serif;
  font-size: clamp(0.82rem, 1.4vw, 1rem);
}

.roadmap-small-fixes {
  position: relative;
  z-index: 1;
  padding-top: 27px;
}

.roadmap-patch-board {
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr);
  align-items: center;
  gap: clamp(18px, 3vw, 36px);
  padding: clamp(21px, 3vw, 31px);
  border: 1px solid rgba(213, 171, 110, 0.3);
  border-radius: 5px 18px 5px 18px;
  background: radial-gradient(circle at 8% 50%, rgba(151, 35, 72, 0.17), transparent 25%), linear-gradient(135deg, rgba(31, 17, 15, 0.98), rgba(8, 5, 9, 0.99));
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.04), 0 20px 42px rgba(0, 0, 0, 0.42);
}

.roadmap-patch-icon {
  position: relative;
  display: grid;
  place-items: center;
  width: 80px;
  height: 80px;
  border: 1px solid rgba(243, 204, 109, 0.42);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(156, 39, 80, 0.23), rgba(8, 5, 10, 0.94) 68%);
}

.roadmap-patch-icon span,
.roadmap-patch-icon span::before {
  width: 12px;
  height: 50px;
  border-radius: 3px;
  background: linear-gradient(90deg, #81542f, #eabc68 45%, #674125);
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.58);
}

.roadmap-patch-icon span { position: relative; transform: rotate(43deg); }
.roadmap-patch-icon span::before { content: ''; position: absolute; transform: rotate(90deg); }

.roadmap-patch-copy p,
.roadmap-patch-copy h2 { margin: 0; }

.roadmap-patch-copy > p:first-child {
  color: #d399f4 !important;
  font-size: 0.61rem !important;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.roadmap-patch-copy h2 {
  margin: 5px 0 7px;
  color: #fff0c9;
  font-family: 'Cinzel', serif;
  font-size: clamp(1.5rem, 2.7vw, 2.15rem);
}

.roadmap-patch-copy > p:last-child {
  color: #bcaeb8 !important;
  font-size: 0.78rem !important;
  font-weight: 600;
  line-height: 1.5 !important;
}

.roadmap-patch-board ul {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.roadmap-patch-board li {
  position: relative;
  display: grid;
  gap: 5px;
  padding: 16px 18px 16px 42px;
  border: 1px solid rgba(231, 193, 143, 0.16);
  border-radius: 9px 2px 9px 2px;
  background: rgba(255, 255, 255, 0.035);
}

.roadmap-patch-board li::before {
  content: '\2713';
  position: absolute;
  top: 17px;
  left: 16px;
  color: #e2a9ff;
  font-size: 0.95rem;
  font-weight: 900;
}

.roadmap-patch-board li strong {
  color: #f8e4b8;
  font-family: 'Cinzel', serif;
  font-size: 0.8rem;
}

.roadmap-patch-board li span {
  color: #c5b8c1;
  font-size: 0.77rem;
  font-weight: 600;
  line-height: 1.48;
}

.roadmap-home-cta {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
  padding-top: 32px;
}

@keyframes roadmap-traveler-step {
  0%, 100% { transform: scaleX(var(--roadmap-facing)) translateY(0) rotate(-1deg); }
  50% { transform: scaleX(var(--roadmap-facing)) translateY(-5px) rotate(1deg); }
}

@keyframes roadmap-panel-in {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes roadmap-winter-open {
  from { opacity: 0; transform: translateY(-12px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes roadmap-snowfall {
  from { background-position: 8px 7px, 34px 19px, 17px 39px; }
  to { background-position: -33px 101px, 101px 165px, -14px 157px; }
}

@media (max-width: 1120px) {
  .roadmap-shell { grid-template-columns: minmax(340px, 0.82fr) minmax(0, 1.18fr); }
  .roadmap-winter-shell { grid-template-columns: minmax(340px, 0.82fr) minmax(0, 1.18fr); }
  .roadmap-feature-list { grid-template-columns: 1fr; }
  .roadmap-boss-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .roadmap-boss { grid-template-rows: 128px auto; }
  .roadmap-boss img { height: 126px; }
}

@media (max-width: 900px) {
  .roadmap-shell { grid-template-columns: 1fr; }
  .roadmap-winter-shell { grid-template-columns: 1fr; }
  .roadmap-map-card { position: relative; top: auto; width: min(100%, 570px); margin-inline: auto; }
  .roadmap-details { width: min(100%, 760px); margin-inline: auto; }
  .roadmap-patch-board { grid-template-columns: 72px minmax(0, 1fr); }
  .roadmap-patch-board ul { grid-column: 1 / -1; }
  .roadmap-patch-icon { width: 66px; height: 66px; }
  .roadmap-patch-icon span, .roadmap-patch-icon span::before { height: 42px; }
}

@media (max-width: 560px) {
  .roadmap-backdrop { padding-top: 12px; }
  .roadmap-backdrop .section { width: min(calc(100% - 18px), 1420px); }
  .roadmap-hero { padding-inline: 8px; }
  .roadmap-hero h1 { font-size: clamp(2.25rem, 13vw, 3.55rem); }
  .roadmap-shell { gap: 15px; padding: 8px; border-radius: 5px 16px 5px 16px; }
  .roadmap-winter-chapter { margin-top: 28px; }
  .roadmap-winter-gate { padding: 18px 12px; border-radius: 4px 16px 4px 16px; }
  .roadmap-winter-gate-kicker { font-size: 0.56rem; letter-spacing: 0.14em; }
  .roadmap-winter-gate > strong { font-size: clamp(1.15rem, 6vw, 1.55rem); }
  .roadmap-winter-gate-action { font-size: 0.56rem; }
  .roadmap-winter-content { padding: 8px; border-radius: 5px 16px 5px 16px; }
  .roadmap-winter-heading { padding: 10px 7px 0; }
  .roadmap-winter-heading h2 { font-size: clamp(1.55rem, 9vw, 2.2rem); }
  .roadmap-winter-shell { gap: 15px; }
  .roadmap-winter-traveler { width: clamp(48px, 15vw, 62px); }
  .roadmap-winter-more { width: 39%; font-size: 0.43rem !important; }
  .roadmap-winter-teasers { gap: 5px; }
  .roadmap-winter-teasers > span { min-height: 96px; padding: 10px 4px; }
  .roadmap-winter-teasers i { width: 34px; height: 34px; font-size: 1rem; }
  .roadmap-winter-teasers strong { font-size: 0.5rem; }
  .roadmap-map-card { padding: 7px; }
  .roadmap-map-topline { font-size: 0.52rem; }
  .roadmap-stop { width: 82px; min-height: 72px; }
  .roadmap-stop time { width: 52px; height: 52px; }
  .roadmap-stop time strong { font-size: 1rem; }
  .roadmap-stop-name { max-width: 82px; padding: 4px 6px; font-size: 0.49rem; }
  .roadmap-traveler { width: clamp(48px, 15vw, 64px); }
  .roadmap-panel { padding: 19px 13px; }
  .roadmap-panel-heading p { font-size: 0.82rem !important; }
  .roadmap-feature-list { gap: 7px; margin: 17px 0; }
  .roadmap-feature-list li { min-height: 0; padding: 10px 10px 10px 30px; font-size: 0.73rem; }
  .roadmap-boss { grid-template-rows: 112px auto; }
  .roadmap-boss img { height: 110px; }
  .roadmap-wide-media { min-height: 215px; aspect-ratio: 4 / 3; }
  .roadmap-competition-preview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .roadmap-competition-preview img { height: 130px; padding: 13px; }
  .roadmap-media-badge { top: 9px; right: 9px; font-size: 0.52rem; }
  .roadmap-legendary-showcase { grid-template-columns: 1fr; }
  .roadmap-wheel-media, .roadmap-cape-media { min-height: 240px; }
  .roadmap-wheel-media img, .roadmap-cape-media img { height: 240px; }
  .roadmap-interface-grid { grid-template-columns: 1fr; }
  .roadmap-interface-grid figure { grid-template-rows: 180px auto; }
  .roadmap-interface-grid img { height: 180px; }
  .roadmap-plane-media { height: 290px; }
  .roadmap-plane-media figcaption { right: 11px; bottom: 11px; left: 11px; max-width: none; }
  .roadmap-controls { gap: 5px; }
  .roadmap-control { min-height: 44px; padding: 8px 9px; font-size: 0.59rem; }
  .roadmap-counter { min-width: 37px; font-size: 0.59rem; }
  .roadmap-patch-board { grid-template-columns: 54px minmax(0, 1fr); gap: 13px; padding: 17px 14px; }
  .roadmap-patch-board ul { grid-template-columns: 1fr; }
  .roadmap-patch-icon { width: 52px; height: 52px; }
  .roadmap-patch-icon span, .roadmap-patch-icon span::before { width: 9px; height: 32px; }
}

@media (prefers-reduced-motion: reduce) {
  .roadmap-hero.reveal,
  .roadmap-map-card.reveal,
  .roadmap-details.reveal,
  .roadmap-winter-chapter.reveal,
  .roadmap-small-fixes.reveal,
  .roadmap-home-cta.reveal {
    opacity: 1;
    transform: none;
  }

  .roadmap-page *,
  .roadmap-page *::before,
  .roadmap-page *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .roadmap-boss:hover img,
  .roadmap-stop:hover time,
  .roadmap-stop:focus-visible time,
  .roadmap-stop.is-active time,
  .roadmap-control:hover:not(:disabled),
  .roadmap-control:focus-visible:not(:disabled) {
    transform: none;
  }
}