:root {
  --g-rootmaze-sky-top: #9fd8f4;
  --g-rootmaze-sky-bottom: #e4f6ef;
  --g-rootmaze-hill-far: #b7dcae;
  --g-rootmaze-hill: #8cc47a;
  --g-rootmaze-grass: #7cc35e;
  --g-rootmaze-grass-dark: #4f9a42;
  --g-rootmaze-clay: #7a5236;
  --g-rootmaze-clay-deep: #4f3221;
  --g-rootmaze-clay-light: #9a6c48;
  --g-rootmaze-speck: rgba(40, 22, 10, 0.32);
  --g-rootmaze-soil: #b8895c;
  --g-rootmaze-soil-edge: #85603f;
  --g-rootmaze-root: #f6e3c0;
  --g-rootmaze-root-dark: #6b4425;
  --g-rootmaze-root-light: #fff3dc;
  --g-rootmaze-tip: #fff8e6;
  --g-rootmaze-tip-glow: #ffe9a6;
  --g-rootmaze-water: #5db8ea;
  --g-rootmaze-water-deep: #2f7fb8;
  --g-rootmaze-water-light: #c8f0ff;
  --g-rootmaze-rock: #9aa3ad;
  --g-rootmaze-rock-dark: #5d6672;
  --g-rootmaze-rock-light: #d1d7de;
  --g-rootmaze-seed: #d9913e;
  --g-rootmaze-seed-dark: #7a4a1c;
  --g-rootmaze-seed-cap: #9a6532;
  --g-rootmaze-gate: #a7a3a0;
  --g-rootmaze-gate-dark: #5f5a57;
  --g-rootmaze-gate-light: #d8d4cf;
  --g-rootmaze-sprout: #7cc24f;
  --g-rootmaze-worm: #f2a1a8;
  --g-rootmaze-worm-dark: #b8606c;
  --g-rootmaze-worm-band: rgba(176, 82, 96, 0.55);
  --g-rootmaze-sand: #e9cd92;
  --g-rootmaze-sand-dark: #d2ad6a;
  --g-rootmaze-arrow: rgba(120, 78, 30, 0.85);
  --g-rootmaze-pocket-dry: rgba(70, 120, 150, 0.35);
  --g-rootmaze-track: rgba(60, 34, 18, 0.22);
  --g-rootmaze-cursor: #ffffff;
  --g-rootmaze-hint: #ffe066;
  --g-rootmaze-chip: rgba(255, 250, 242, 0.92);
  --g-rootmaze-chip-ink: #4a3348;
  --g-rootmaze-sky-h: 150px;
  --g-rootmaze-spring-h: 26px;
  --g-rootmaze-bottom: 112px;
  --g-rootmaze-side: 12px;
  --g-rootmaze-max-cell: 60px;
  --g-rootmaze-radius: 0.28;
  --g-rootmaze-root-w: 0.26;
  --g-rootmaze-chip-fs: 14px;
  --g-rootmaze-float-fs: 18px;
  --g-rootmaze-banner-fs: 21px;
  --g-rootmaze-banner-sub: 15px;
  --g-rootmaze-banner-w: 320px;
  --g-rootmaze-badge-fs: 13px;
  --g-rootmaze-mech-img: 72px;
  --g-rootmaze-mech-w: 300px;
  --g-rootmaze-grow: 0.12s;
  --g-rootmaze-crawl: 0.22s;
  --g-rootmaze-flow: 1.1s;
  --g-rootmaze-btn: 46px;
  --g-rootmaze-btn-icon: 22px;
  --g-rootmaze-pad: 12px;
  --g-rootmaze-gap: 6px;
  --g-rootmaze-sr: 1px;
}

:root.is-dark {
  --g-rootmaze-sky-top: #1c2346;
  --g-rootmaze-sky-bottom: #45507e;
  --g-rootmaze-hill-far: #34506a;
  --g-rootmaze-hill: #2c4a43;
  --g-rootmaze-grass: #3f7a46;
  --g-rootmaze-grass-dark: #2a5532;
  --g-rootmaze-clay: #4a3222;
  --g-rootmaze-clay-deep: #2a1b12;
  --g-rootmaze-clay-light: #654531;
  --g-rootmaze-speck: rgba(0, 0, 0, 0.35);
  --g-rootmaze-soil: #7d5c41;
  --g-rootmaze-soil-edge: #5a4231;
  --g-rootmaze-root: #ead2a6;
  --g-rootmaze-root-dark: #3e2614;
  --g-rootmaze-root-light: #f5e3c4;
  --g-rootmaze-water: #3f95cc;
  --g-rootmaze-water-deep: #22608f;
  --g-rootmaze-water-light: #a6e1fb;
  --g-rootmaze-rock: #7b848e;
  --g-rootmaze-rock-dark: #434a54;
  --g-rootmaze-rock-light: #aeb6bf;
  --g-rootmaze-gate: #85817e;
  --g-rootmaze-gate-dark: #45413f;
  --g-rootmaze-gate-light: #b5b0aa;
  --g-rootmaze-sand: #b89d68;
  --g-rootmaze-sand-dark: #9a7f4c;
  --g-rootmaze-arrow: rgba(60, 38, 14, 0.9);
  --g-rootmaze-track: rgba(0, 0, 0, 0.25);
  --g-rootmaze-chip: rgba(36, 28, 60, 0.9);
  --g-rootmaze-chip-ink: #f6eefc;
}

#game-dom .g-rootmaze-ui {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

#game-dom .g-rootmaze-bar {
  position: absolute;
  left: var(--g-rootmaze-pad);
  right: var(--g-rootmaze-pad);
  bottom: var(--g-rootmaze-pad);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: max(var(--g-rootmaze-gap), var(--target-gap));
  pointer-events: none;
}

#game-dom .g-rootmaze-pad {
  display: flex;
  gap: max(var(--g-rootmaze-gap), var(--target-gap));
  padding: var(--g-rootmaze-gap);
  border-radius: var(--r-pill);
  background: var(--hud-glass);
  box-shadow: var(--clay);
  pointer-events: auto;
}

#game-dom .g-rootmaze-btn {
  pointer-events: auto;
  min-width: max(var(--g-rootmaze-btn), var(--target));
  height: max(var(--g-rootmaze-btn), var(--target));
  padding: 0 var(--gap-s);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--gap-xs);
  border: 0;
  border-radius: var(--r-pill);
  background: var(--hud-glass);
  box-shadow: var(--clay);
  color: var(--ink);
  font: inherit;
  font-weight: var(--fw-x);
  font-variant-numeric: tabular-nums;
  cursor: pointer;
  touch-action: manipulation;
}

#game-dom .g-rootmaze-go {
  min-width: calc(max(var(--g-rootmaze-btn), var(--target)) - var(--g-rootmaze-gap) * 2);
  height: calc(max(var(--g-rootmaze-btn), var(--target)) - var(--g-rootmaze-gap) * 2);
  padding: 0;
  background: transparent;
  box-shadow: none;
}

.lc #game-dom .g-rootmaze-go {
  min-width: var(--target);
  height: var(--target);
}

#game-dom .g-rootmaze-btn svg {
  width: var(--g-rootmaze-btn-icon);
  height: var(--g-rootmaze-btn-icon);
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#game-dom .g-rootmaze-btn:disabled {
  opacity: 0.45;
  cursor: default;
}

#game-dom .g-rootmaze-btn:active:not(:disabled) {
  transform: scale(var(--press-s));
}

#game-dom .g-rootmaze-sr {
  position: absolute;
  width: var(--g-rootmaze-sr);
  height: var(--g-rootmaze-sr);
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  pointer-events: none;
}

#game-dom .g-rootmaze-mech {
  pointer-events: auto;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(calc(100% - 2 * var(--gap-m)), var(--g-rootmaze-mech-w));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--gap-xs);
  padding: var(--gap-m);
  border-radius: var(--r-l);
  background: var(--surface);
  color: var(--ink);
  box-shadow: var(--clay), var(--shadow-sheet);
  text-align: center;
  animation: fade var(--t-med) var(--ease);
}

#game-dom .g-rootmaze-mech img {
  width: var(--g-rootmaze-mech-img);
  height: var(--g-rootmaze-mech-img);
}

#game-dom .g-rootmaze-mech b {
  font-size: var(--fs-m);
  font-weight: var(--fw-x);
}

#game-dom .g-rootmaze-mech p {
  margin: 0 0 var(--gap-xs);
  font-size: var(--fs-s);
  color: var(--ink-soft);
}

#game-dom .g-rootmaze-mech .btn {
  width: 100%;
}

:root.reduce-motion #game-dom .g-rootmaze-mech {
  animation: none;
}