#full-area.dungeon-dash {
  width: 100%;
  height: 100vh;
  position: absolute;
  overflow: hidden;
  background: #120f1c;
  user-select: none;
  font-family: "Fredoka", "Segoe UI", system-ui, sans-serif;
  color: #fff7e6;
}
#full-area.dungeon-dash .dd-hud, #full-area.dungeon-dash .dd-hud *, #full-area.dungeon-dash .dd-meter, #full-area.dungeon-dash .dd-meter *, #full-area.dungeon-dash .dd-boost, #full-area.dungeon-dash .dd-boost *, #full-area.dungeon-dash section, #full-area.dungeon-dash section * {
  font-family: "Fredoka", "Segoe UI", system-ui, sans-serif;
  letter-spacing: 0;
  line-height: 1.2;
  margin: 0;
}
#full-area.dungeon-dash #game-area {
  position: absolute;
  width: 1280px;
  height: 720px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) scale(1) !important;
}
#full-area.dungeon-dash #gameContainer {
  position: absolute;
  width: 1280px;
  height: 720px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  overflow: hidden;
  background: #1a1714;
}
#full-area.dungeon-dash #dd-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  outline: none;
}
#full-area.dungeon-dash button {
  font-family: "Bungee", "Arial Black", Impact, sans-serif;
  border: 0;
  background: none;
  color: inherit;
  outline: none;
  cursor: pointer;
  padding: 0;
  margin: 0;
}
#full-area.dungeon-dash .dd-hud, #full-area.dungeon-dash .dd-meter, #full-area.dungeon-dash .dd-count, #full-area.dungeon-dash section {
  position: absolute;
  transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
}
#full-area.dungeon-dash .dd-hud, #full-area.dungeon-dash .dd-meter {
  opacity: 0;
  pointer-events: none;
}
#full-area.dungeon-dash section {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
#full-area.dungeon-dash[data-state=play] .dd-hud, #full-area.dungeon-dash[data-state=play] .dd-meter {
  opacity: 1;
  pointer-events: auto;
}
#full-area.dungeon-dash[data-state=splash] .dd-splash, #full-area.dungeon-dash[data-state=levels] .dd-select, #full-area.dungeon-dash[data-state=done] .dd-done {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
#full-area.dungeon-dash .dd-hud {
  top: 16px;
  left: 22px;
  right: 22px;
  height: 58px;
}
#full-area.dungeon-dash .dd-hud-left {
  position: absolute;
  left: 30px;
  top: 0;
  display: flex;
  align-items: center;
  gap: 18px;
  height: 54px;
}
#full-area.dungeon-dash .dd-stat-level {
  display: flex;
  align-items: center;
  gap: 9px;
}
#full-area.dungeon-dash .dd-stat-level b {
  font-family: "Lilita One", "Arial Black", Impact, sans-serif;
  font-weight: 400;
  font-size: 38px;
  line-height: 1;
  color: #ffc928;
  text-shadow: -3px -3px 0 #14162b, 0 -3px 0 #14162b, 3px -3px 0 #14162b, -3px 0 0 #14162b, 3px 0 0 #14162b, -3px 3px 0 #14162b, 0 3px 0 #14162b, 3px 3px 0 #14162b, 0 6px 0 #14162b;
}
#full-area.dungeon-dash .dd-door-icon {
  width: 34px;
  height: 44px;
  background: url("/media/games/dungeon-dash/images/closed-wood-door.webp") center bottom/contain no-repeat;
  filter: drop-shadow(0 3px 0 #14162b);
}
#full-area.dungeon-dash .dd-progress {
  position: absolute;
  left: 50%;
  top: 4px;
  width: 440px;
  height: 50px;
  transform: translateX(-50%);
}
#full-area.dungeon-dash .dd-progress-track {
  position: absolute;
  left: 0;
  right: 0;
  top: 14px;
  height: 24px;
  border-radius: 12px;
  border: 4px solid #14162b;
  background: #c9c1b4;
  box-shadow: 0 4px 0 #14162b, inset 0 4px 0 #a39a8c;
}
#full-area.dungeon-dash .dd-progress-track::after {
  content: "";
  position: absolute;
  right: -24px;
  top: -26px;
  width: 42px;
  height: 52px;
  background: url("/media/games/dungeon-dash/images/open-portculis.webp") center bottom/contain no-repeat;
  filter: drop-shadow(0 3px 0 #14162b);
}
#full-area.dungeon-dash .dd-progress-fill {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 0;
  border-radius: 8px;
  background: #ffc928;
  box-shadow: inset 0 -5px 0 #d27a12, inset 0 3px 0 #ffe48a;
}
#full-area.dungeon-dash .dd-progress-marks i {
  position: absolute;
  bottom: 5px;
  width: 12px;
  height: 45px;
  margin-left: -6px;
  background: url("/media/games/dungeon-dash/images/torch-out.webp") center bottom/12px 45px no-repeat;
  filter: drop-shadow(0 2px 0 #14162b);
}
#full-area.dungeon-dash .dd-progress-marks i.is-lit {
  background: url("/media/games/dungeon-dash/images/torch.webp") 0 0/72px 45px no-repeat;
  animation: ddTorchMark 0.55s steps(6) infinite;
}
#full-area.dungeon-dash .dd-progress-head {
  position: absolute;
  left: 0;
  top: 50%;
  width: 42px;
  height: 36px;
  margin: -20px 0 0 -21px;
  background: url("/media/games/dungeon-dash/images/ui/ninja-head.webp") center/contain no-repeat;
  filter: drop-shadow(0 3px 0 #14162b);
}
#full-area.dungeon-dash .dd-quit {
  position: relative;
  width: 46px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #c9c1b4;
  border: 4px solid #14162b;
  border-radius: 50%;
  box-shadow: 0 4px 0 #14162b;
  border-width: 3px;
  box-shadow: 0 4px 0 #14162b, inset 0 -4px 0 #a39a8c;
  transition: translate 0.12s ease;
}
#full-area.dungeon-dash .dd-quit svg {
  width: 26px;
  height: 26px;
  margin: -3px 0 0 -2px;
}
#full-area.dungeon-dash .dd-quit:hover, #full-area.dungeon-dash .dd-quit.sog-focused, #full-area.dungeon-dash .dd-quit:focus-visible {
  translate: 0 -2px;
}
#full-area.dungeon-dash .dd-quit:active {
  translate: 0 3px;
  box-shadow: 0 1px 0 #14162b, inset 0 -4px 0 #a39a8c;
}
#full-area.dungeon-dash .dd-meter {
  left: 52px;
  bottom: 84px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}
#full-area.dungeon-dash .dd-meter-bar {
  position: relative;
  width: 318px;
  height: 28px;
  border: 4px solid #14162b;
  border-radius: 14px;
  background: #c9c1b4;
  box-shadow: 0 4px 0 #14162b, inset 0 4px 0 #a39a8c;
  overflow: hidden;
}
#full-area.dungeon-dash .dd-meter-fill {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 100%;
  transform-origin: left;
  transform: scaleX(0);
  background: #ffc928;
  box-shadow: inset 0 -6px 0 #d27a12, inset 0 4px 0 #ffe48a;
}
#full-area.dungeon-dash .dd-meter[data-mode=loud] .dd-meter-fill {
  background: #ff7a1a;
  box-shadow: inset 0 -6px 0 #b8400c, inset 0 4px 0 #ffb066;
}
#full-area.dungeon-dash .dd-meter-line {
  position: absolute;
  top: -2px;
  bottom: -2px;
  left: 40%;
  width: 4px;
  margin-left: -2px;
  background: #14162b;
}
#full-area.dungeon-dash .dd-boost {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}
#full-area.dungeon-dash .dd-boost .dd-mic {
  width: 26px;
  height: 26px;
  flex: none;
}
#full-area.dungeon-dash .dd-boost b {
  min-width: 44px;
  font-family: "Lilita One", "Arial Black", Impact, sans-serif;
  font-weight: 400;
  font-size: 22px;
  line-height: 1;
  color: #ffc928;
  text-shadow: -2px -2px 0 #14162b, 0 -2px 0 #14162b, 2px -2px 0 #14162b, -2px 0 0 #14162b, 2px 0 0 #14162b, -2px 2px 0 #14162b, 0 2px 0 #14162b, 2px 2px 0 #14162b, 0 5px 0 #14162b;
}
#full-area.dungeon-dash .dd-sens {
  --pct: 25%;
  -webkit-appearance: none;
  appearance: none;
  width: 222px;
  height: 18px;
  margin: 0;
  padding: 0;
  border-radius: 10px;
  border: 3px solid #14162b;
  background: linear-gradient(90deg, #ffc928 var(--pct), #c9c1b4 var(--pct));
  box-shadow: 0 3px 0 #14162b, inset 0 3px 0 rgba(20, 22, 43, 0.18);
  outline: none;
  cursor: pointer;
}
#full-area.dungeon-dash .dd-sens::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #ffc928;
  border: 4px solid #14162b;
  box-shadow: inset 0 -5px 0 #d27a12, 0 3px 0 #14162b;
  cursor: grab;
}
#full-area.dungeon-dash .dd-sens::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #ffc928;
  border: 4px solid #14162b;
  box-shadow: inset 0 -5px 0 #d27a12, 0 3px 0 #14162b;
  cursor: grab;
}
#full-area.dungeon-dash .dd-logo-svg {
  overflow: visible;
}
#full-area.dungeon-dash .dd-logo-svg, #full-area.dungeon-dash .dd-logo-svg * {
  font-family: "Lilita One", "Arial Black", Impact, sans-serif;
  letter-spacing: 2px;
}
#full-area.dungeon-dash .dd-logo-svg text {
  text-anchor: middle;
}
#full-area.dungeon-dash .dd-logo-svg .lt-edge {
  fill: #3b2313;
  stroke: #3b2313;
  stroke-width: var(--edge, 12px);
  stroke-linejoin: round;
}
#full-area.dungeon-dash .dd-logo-svg .lt-side {
  fill: var(--side, #d27a12);
}
#full-area.dungeon-dash .dd-logo-svg .lt-face {
  fill: var(--face, #ffc928);
}
#full-area.dungeon-dash .dd-count {
  position: absolute;
  left: 50%;
  top: 150px;
  width: 240px;
  height: 240px;
  margin-left: -120px;
  opacity: 0;
  pointer-events: none;
}
#full-area.dungeon-dash .dd-count svg {
  width: 100%;
  height: 100%;
  --edge: 20px;
}
#full-area.dungeon-dash[data-state=play] .dd-count.is-on {
  animation: ddCountPop 1s ease-out both;
}
#full-area.dungeon-dash .dd-splash {
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: 60px;
  cursor: pointer;
  background: radial-gradient(ellipse 55% 50% at 50% 45%, rgba(10, 8, 22, 0), rgba(10, 8, 22, 0.55));
}
#full-area.dungeon-dash .dd-splash-logo {
  width: 820px;
  height: auto;
  filter: drop-shadow(0 14px 0 rgba(20, 22, 43, 0.55));
  pointer-events: none;
}
#full-area.dungeon-dash[data-state=splash] .dd-splash-logo {
  animation: ddLogoIn 0.7s cubic-bezier(0.2, 1.6, 0.4, 1) both, ddFloat 3.2s 0.7s ease-in-out infinite;
}
#full-area.dungeon-dash .dd-select {
  inset: 0;
}
#full-area.dungeon-dash .dd-panel-head {
  position: absolute;
  left: 40px;
  right: 40px;
  top: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#full-area.dungeon-dash .dd-panel-title {
  display: block;
  width: 540px;
  height: auto;
  overflow: visible;
}
#full-area.dungeon-dash .dd-panel-title, #full-area.dungeon-dash .dd-panel-title * {
  font-family: "Lilita One", "Arial Black", Impact, sans-serif;
  font-size: 66px;
  letter-spacing: 2px;
}
#full-area.dungeon-dash .dd-doors {
  position: absolute;
  inset: 0;
}
#full-area.dungeon-dash .dd-door {
  position: absolute;
  width: 160px;
  height: 278px;
}
#full-area.dungeon-dash .dd-door:hover:not(.is-locked) .dd-door-num, #full-area.dungeon-dash .dd-door.sog-focused .dd-door-num, #full-area.dungeon-dash .dd-door:focus-visible .dd-door-num {
  scale: 1.12;
}
#full-area.dungeon-dash .dd-door.is-locked {
  cursor: default;
}
#full-area.dungeon-dash .dd-door-num {
  position: absolute;
  left: 50%;
  top: 14px;
  width: 90px;
  height: 70px;
  margin-left: -45px;
  transition: scale 0.15s ease;
}
#full-area.dungeon-dash .dd-door-num svg {
  width: 100%;
  height: 100%;
  --face: #e6e0d6;
  --side: #9a9184;
}
#full-area.dungeon-dash .dd-door-num text {
  font-size: 50px;
}
#full-area.dungeon-dash .dd-door.is-next .dd-door-num {
  animation: ddPlateBob 0.9s ease-in-out infinite alternate;
}
#full-area.dungeon-dash .dd-door.is-next .dd-door-num svg {
  --face: #ffc928;
  --side: #d27a12;
}
#full-area.dungeon-dash .dd-door.is-locked .dd-door-num svg {
  --face: #77717f;
  --side: #36323c;
}
#full-area.dungeon-dash .dd-done {
  inset: 0;
}
#full-area.dungeon-dash .dd-done-head {
  position: absolute;
  left: 0;
  right: 0;
  top: 116px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#full-area.dungeon-dash .dd-done-level {
  width: 300px;
  height: 42px;
  --face: #e6e0d6;
  --side: #9a9184;
}
#full-area.dungeon-dash .dd-done-title {
  width: 620px;
  height: 93px;
  margin-top: -2px;
  --edge: 16px;
}
#full-area.dungeon-dash .dd-done-time {
  position: absolute;
  left: 0;
  right: 0;
  top: 258px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
#full-area.dungeon-dash .dd-done-time b {
  font-family: "Lilita One", "Arial Black", Impact, sans-serif;
  font-weight: 400;
  font-size: 38px;
  line-height: 1;
  color: #fff;
  text-shadow: -3px -3px 0 #14162b, 0 -3px 0 #14162b, 3px -3px 0 #14162b, -3px 0 0 #14162b, 3px 0 0 #14162b, -3px 3px 0 #14162b, 0 3px 0 #14162b, 3px 3px 0 #14162b, 0 6px 0 #14162b;
}
#full-area.dungeon-dash .dd-hourglass {
  width: 30px;
  height: 38px;
  filter: drop-shadow(0 3px 0 #3b2313);
}
#full-area.dungeon-dash .dd-done-best {
  display: none;
  align-items: center;
  gap: 8px;
  margin-left: 22px;
}
#full-area.dungeon-dash .dd-done-best.is-on {
  display: flex;
}
#full-area.dungeon-dash .dd-done-best .dd-cup {
  width: 34px;
  height: 34px;
  filter: drop-shadow(0 3px 0 #3b2313);
}
#full-area.dungeon-dash .dd-done-best b {
  color: #ffc928;
}
#full-area.dungeon-dash .dd-seal {
  display: none;
  width: 66px;
  height: 66px;
  margin-left: 10px;
  rotate: -12deg;
  filter: drop-shadow(0 4px 0 #3b2313);
}
#full-area.dungeon-dash .dd-seal.is-on {
  display: block;
}
#full-area.dungeon-dash .dd-seal svg {
  width: 100%;
  height: 100%;
}
#full-area.dungeon-dash .dd-exit {
  position: absolute;
  top: 318px;
  width: 160px;
  height: 304px;
  margin-left: -80px;
}
#full-area.dungeon-dash .dd-exit.is-retry {
  left: 400px;
}
#full-area.dungeon-dash .dd-exit.is-next {
  left: 640px;
}
#full-area.dungeon-dash .dd-exit.is-switch {
  left: 880px;
}
#full-area.dungeon-dash .dd-exit:hover .dd-exit-icon, #full-area.dungeon-dash .dd-exit.sog-focused .dd-exit-icon, #full-area.dungeon-dash .dd-exit:focus-visible .dd-exit-icon {
  scale: 1.15;
}
#full-area.dungeon-dash[data-final="1"] .dd-exit.is-next {
  display: none;
}
#full-area.dungeon-dash .dd-exit-icon {
  position: absolute;
  left: 50%;
  top: 0;
  width: 66px;
  height: 66px;
  margin-left: -33px;
  overflow: visible;
  transition: scale 0.15s ease;
}
#full-area.dungeon-dash .dd-exit.is-next .dd-exit-icon {
  width: 76px;
  height: 76px;
  margin-left: -38px;
  top: -8px;
}
#full-area.dungeon-dash .dd-exit-label {
  position: absolute;
  left: 0;
  right: 0;
  top: 177px;
  transform: translateY(-50%);
  text-align: center;
  font-family: "Lilita One", "Arial Black", Impact, sans-serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 1.05;
  letter-spacing: 1px;
  color: #e6e0d6;
  text-shadow: -3px -3px 0 #14162b, 0 -3px 0 #14162b, 3px -3px 0 #14162b, -3px 0 0 #14162b, 3px 0 0 #14162b, -3px 3px 0 #14162b, 0 3px 0 #14162b, 3px 3px 0 #14162b, 0 6px 0 #14162b;
}
#full-area.dungeon-dash .dd-exit.is-next .dd-exit-label {
  color: #ffc928;
}
#full-area.dungeon-dash .dd-done.is-in .dd-done-level {
  animation: ddDropIn 0.5s 0.2s cubic-bezier(0.2, 1.4, 0.4, 1) both;
}
#full-area.dungeon-dash .dd-done.is-in .dd-done-title {
  animation: ddTitleIn 0.6s 0.3s cubic-bezier(0.2, 1.5, 0.4, 1) both;
}
#full-area.dungeon-dash .dd-done.is-in .dd-done-time {
  animation: ddRise 0.45s 0.65s ease-out both;
}
#full-area.dungeon-dash .dd-done.is-in .dd-seal.is-on {
  animation: ddStamp 0.35s 1.05s cubic-bezier(0.3, 1.6, 0.5, 1) both;
}
#full-area.dungeon-dash .dd-done.is-in .dd-exit-icon {
  animation: ddPopIn 0.4s cubic-bezier(0.2, 1.6, 0.4, 1) both;
}
#full-area.dungeon-dash .dd-done.is-in .is-retry .dd-exit-icon {
  animation-delay: 0.75s;
}
#full-area.dungeon-dash .dd-done.is-in .is-switch .dd-exit-icon {
  animation-delay: 0.95s;
}
#full-area.dungeon-dash .dd-done.is-in .is-next .dd-exit-icon {
  animation: ddPopIn 0.4s 0.85s cubic-bezier(0.2, 1.6, 0.4, 1) both, ddPlateBob 0.9s 1.3s ease-in-out infinite alternate;
}
#full-area.dungeon-dash .dd-done.is-in .dd-exit-label {
  animation: ddRise 0.4s 1s ease-out both;
}
#full-area.dungeon-dash .dd-done[data-exit] .dd-exit-label {
  animation: ddFadeOut 0.2s ease-out both;
}
@keyframes ddLogoIn {
  0% {
    opacity: 0;
    transform: scale(0.4) rotate(-6deg);
  }
  100% {
    opacity: 1;
    transform: scale(1) rotate(0);
  }
}
@keyframes ddFloat {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-8px);
  }
}
@keyframes ddPlateBob {
  from {
    translate: 0 0;
  }
  to {
    translate: 0 -6px;
  }
}
@keyframes ddCountPop {
  0% {
    opacity: 0;
    scale: 0.4;
  }
  16% {
    opacity: 1;
    scale: 1.12;
  }
  30% {
    scale: 1;
  }
  78% {
    opacity: 1;
    scale: 1;
  }
  100% {
    opacity: 0;
    scale: 0.88;
  }
}
@keyframes ddDropIn {
  from {
    opacity: 0;
    translate: 0 -40px;
  }
  to {
    opacity: 1;
    translate: 0 0;
  }
}
@keyframes ddTitleIn {
  from {
    opacity: 0;
    scale: 0.4;
  }
  to {
    opacity: 1;
    scale: 1;
  }
}
@keyframes ddRise {
  from {
    opacity: 0;
    translate: 0 16px;
  }
  to {
    opacity: 1;
    translate: 0 0;
  }
}
@keyframes ddStamp {
  from {
    opacity: 0;
    scale: 2.4;
    rotate: -40deg;
  }
  to {
    opacity: 1;
    scale: 1;
    rotate: -12deg;
  }
}
@keyframes ddFadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes ddPopIn {
  from {
    opacity: 0;
    scale: 0.3;
  }
  to {
    opacity: 1;
    scale: 1;
  }
}
@keyframes ddTorchMark {
  to {
    background-position: -72px 0;
  }
}
