/* D-GAME shared mirror-space game skin. */
:root {
  --dg-bg: #eef7ff;
  --dg-bg-soft: #d9e9f7;
  --dg-surface: rgba(248, 252, 255, 0.64);
  --dg-surface-strong: rgba(250, 253, 255, 0.84);
  --dg-surface-soft: rgba(82, 174, 232, 0.095);
  --dg-line: rgba(88, 148, 188, 0.22);
  --dg-line-strong: rgba(88, 148, 188, 0.34);
  --dg-text: #101822;
  --dg-muted: #5d6d80;
  --dg-accent: #24a8e6;
  --dg-accent-2: #ff5c96;
  --dg-warm: #8f82ff;
  --dg-danger: #ff4f72;
  --dg-success: #16a77d;
  --dg-shadow: 0 30px 90px rgba(36, 76, 116, 0.22);
  --dg-shadow-soft: 0 16px 40px rgba(36, 76, 116, 0.13);
  --dg-radius: 8px;
  --dg-radius-sm: 6px;
  --dg-font: "Inter", "Segoe UI", "Microsoft YaHei", system-ui, sans-serif;
  --dg-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --dg-board: rgba(185, 214, 234, 0.56);
  --dg-canvas: rgba(252, 254, 255, 0.78);
  --dg-control: rgba(250, 254, 255, 0.72);
  --dg-control-hover: rgba(255, 255, 255, 0.94);
  --dg-primary-text: #f8fdff;
  --dg-paper-grain: rgba(88, 148, 188, 0.035);
  --dg-backdrop: rgba(8, 20, 32, 0.42);
  --dg-mirror-line: rgba(70, 180, 242, 0.14);
  --dg-mirror-line-strong: rgba(255, 255, 255, 0.62);
  --dg-mirror-wash: rgba(190, 230, 255, 0.36);
  --dg-rim: rgba(154, 230, 255, 0.52);
  --dg-rim-pink: rgba(255, 92, 150, 0.28);
  --dg-glass-highlight: rgba(255, 255, 255, 0.62);
  --dg-light-strength: 36%;
  --dg-control-glint: rgba(255, 255, 255, 0.5);
  --dg-curtain-solid: #ffffff;
  --dg-curtain-pane: rgba(229, 246, 255, 0.86);
  --dg-curtain-glow: rgba(188, 238, 255, 0.74);
  --dg-curtain-beam: rgba(255, 255, 255, 0.96);
  --dg-depth-x: 0px;
  --dg-depth-y: 0px;
  --dg-depth-bg-x: 0px;
  --dg-depth-bg-y: 0px;
  --dg-glint-x: 50%;
  --dg-glint-y: 50%;
  --dg-tilt-x: 0deg;
  --dg-tilt-y: 0deg;
  --dg-tile-empty: rgba(212, 231, 244, 0.64);
  --dg-tile-2: #d9f5ff;
  --dg-tile-4: #dfe8ff;
  --dg-tile-8: #c5e5ff;
  --dg-tile-16: #b8f2e6;
  --dg-tile-32: #b5dcff;
  --dg-tile-64: #aab8ff;
  --dg-tile-128: #d4bcff;
  --dg-tile-256: #ffb9d4;
  --dg-tile-512: #ffc7aa;
  --dg-tile-1024: #f5df86;
  --dg-tile-2048: #7bdff2;
  --dg-tile-4096: #78f0c4;
  --dg-tile-8192: #9d8cff;
  --dg-tile-16384: #65c7ff;
  --dg-tile-32768: #ff79ac;
  --dg-tile-65536: #4be1d1;
  --dg-tile-super: #101a28;
  --dg-tile-dark-text: #142131;
  --dg-tile-light-text: #f8fdff;
}

html.dark {
  --dg-curtain-solid: #020714;
  --dg-curtain-pane: rgba(5, 18, 34, 0.9);
  --dg-curtain-glow: rgba(52, 180, 255, 0.5);
  --dg-curtain-beam: rgba(62, 196, 255, 0.72);
}

body.dg-game-shell[data-dg-theme="dark"] {
  --dg-bg: #030712;
  --dg-bg-soft: #081522;
  --dg-surface: rgba(13, 25, 38, 0.64);
  --dg-surface-strong: rgba(14, 29, 45, 0.86);
  --dg-surface-soft: rgba(126, 226, 255, 0.08);
  --dg-line: rgba(140, 226, 255, 0.18);
  --dg-line-strong: rgba(140, 226, 255, 0.3);
  --dg-text: #eaf8ff;
  --dg-muted: #90aabc;
  --dg-shadow: 0 30px 90px rgba(0, 0, 0, 0.56);
  --dg-shadow-soft: 0 16px 42px rgba(0, 0, 0, 0.36);
  --dg-board: rgba(18, 44, 64, 0.72);
  --dg-canvas: rgba(8, 18, 29, 0.72);
  --dg-control: rgba(18, 35, 52, 0.72);
  --dg-control-hover: rgba(26, 50, 72, 0.88);
  --dg-primary-text: #02101c;
  --dg-paper-grain: rgba(196, 242, 255, 0.04);
  --dg-backdrop: rgba(0, 5, 12, 0.64);
  --dg-mirror-line: rgba(92, 210, 255, 0.14);
  --dg-mirror-line-strong: rgba(198, 246, 255, 0.25);
  --dg-mirror-wash: rgba(34, 102, 150, 0.22);
  --dg-rim: rgba(66, 214, 255, 0.44);
  --dg-rim-pink: rgba(255, 92, 150, 0.22);
  --dg-glass-highlight: rgba(226, 250, 255, 0.28);
  --dg-control-glint: rgba(132, 232, 255, 0.22);
  --dg-curtain-solid: #020714;
  --dg-curtain-pane: rgba(5, 18, 34, 0.9);
  --dg-curtain-glow: rgba(52, 180, 255, 0.5);
  --dg-curtain-beam: rgba(62, 196, 255, 0.72);
  --dg-tile-empty: rgba(22, 45, 63, 0.8);
  --dg-tile-2: #17394d;
  --dg-tile-4: #1b315d;
  --dg-tile-8: #184b68;
  --dg-tile-16: #145b53;
  --dg-tile-32: #1d5482;
  --dg-tile-64: #343f8d;
  --dg-tile-128: #57428f;
  --dg-tile-256: #873a67;
  --dg-tile-512: #8f5239;
  --dg-tile-1024: #8a7630;
  --dg-tile-2048: #1a788a;
  --dg-tile-4096: #168667;
  --dg-tile-8192: #584fc2;
  --dg-tile-16384: #1a6e9f;
  --dg-tile-32768: #92345f;
  --dg-tile-65536: #137b74;
  --dg-tile-super: #06101a;
  --dg-tile-dark-text: #f8fdff;
  --dg-tile-light-text: #f8fdff;
}

body.dg-game-shell[data-dg-theme="dark"] button,
body.dg-game-shell[data-dg-theme="dark"] .btn,
body.dg-game-shell[data-dg-theme="dark"] .number-btn,
body.dg-game-shell[data-dg-theme="dark"] select,
body.dg-game-shell[data-dg-theme="dark"] input:not([type="file"]):not([type="checkbox"]):not([type="color"]) {
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.22);
}

* {
  box-sizing: border-box;
}

html {
  min-height: 100%;
  background: var(--dg-bg);
  overflow-x: hidden;
}

html.dg-game-document.dg-curtain-mounted,
html.dg-game-document-dank {
  height: 100%;
  overflow: hidden;
}

body.dg-game-shell {
  min-height: 100svh;
  max-width: 100vw;
  margin: 0;
  color: var(--dg-text);
  background:
    radial-gradient(circle at var(--dg-glint-x) var(--dg-glint-y), rgba(255, 255, 255, 0.92), rgba(178, 226, 255, 0.22) 15%, transparent 42%),
    radial-gradient(circle at 82% 16%, rgba(255, 92, 150, 0.105), transparent 32%),
    linear-gradient(128deg, rgba(255, 255, 255, 0.82) 0%, rgba(218, 240, 255, 0.42) 32%, transparent 58%),
    linear-gradient(236deg, rgba(72, 185, 242, 0.16) 0%, transparent 38%),
    linear-gradient(180deg, var(--dg-bg), var(--dg-bg-soft) 64%, #f8fcff),
    var(--dg-bg);
  font-family: var(--dg-font);
  line-height: 1.5;
  overflow-x: hidden;
  isolation: isolate;
  perspective: 1100px;
  transition: background-color 0.32s var(--dg-ease), color 0.32s var(--dg-ease);
}

body.dg-game-shell::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at var(--dg-glint-x) var(--dg-glint-y), rgba(255, 255, 255, 0.42), transparent 18%),
    linear-gradient(118deg, transparent 0 15%, var(--dg-mirror-line-strong) 15.1%, transparent 15.65%, transparent 46%, var(--dg-mirror-line) 46.15%, transparent 46.7%, transparent 78%, var(--dg-rim-pink) 78.1%, transparent 78.55%),
    linear-gradient(62deg, transparent 0 20%, var(--dg-mirror-line) 20.1%, transparent 20.7%, transparent 67%, var(--dg-rim) 67.1%, transparent 67.65%),
    repeating-linear-gradient(100deg, transparent 0 38px, var(--dg-paper-grain) 39px, transparent 40px),
    linear-gradient(180deg, var(--dg-mirror-wash), transparent 58%);
  background-size:
    100% 100%,
    86vmax 86vmax,
    72vmax 72vmax,
    100% 100%,
    100% 100%;
  background-position:
    0 0,
    var(--dg-depth-bg-x) var(--dg-depth-bg-y),
    calc(100% - var(--dg-depth-bg-x)) calc(100% - var(--dg-depth-bg-y)),
    0 0,
    0 0;
  opacity: 0.9;
  transform: translate3d(0, 0, -1px);
  filter: saturate(1.08) contrast(1.02);
  transition: opacity 0.32s var(--dg-ease), background-position 0.16s linear, filter 0.32s var(--dg-ease);
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.82), rgba(0, 0, 0, 0.4));
}

body.dg-game-shell::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 99998;
  pointer-events: none;
  visibility: hidden;
  opacity: 0;
  background: var(--dg-curtain-solid);
}

body.dg-game-shell[data-dg-theme="dark"] {
  background:
    radial-gradient(circle at var(--dg-glint-x) var(--dg-glint-y), rgba(70, 210, 255, 0.28), rgba(30, 96, 156, 0.08) 18%, transparent 48%),
    radial-gradient(circle at 80% 14%, rgba(255, 92, 150, 0.11), transparent 34%),
    linear-gradient(128deg, rgba(214, 250, 255, 0.055) 0%, rgba(32, 120, 176, 0.12) 34%, transparent 60%),
    linear-gradient(236deg, rgba(70, 214, 255, 0.085) 0%, transparent 42%),
    linear-gradient(180deg, var(--dg-bg), #02050c 62%, var(--dg-bg-soft)),
    var(--dg-bg);
}

body.dg-depth-disabled::before {
  --dg-world-reveal-opacity: 0.68;
  opacity: 0.68;
  filter: saturate(0.92) contrast(0.98);
}

body.dg-depth-enabled::before {
  --dg-world-reveal-opacity: 0.96;
  opacity: 0.96;
  filter: saturate(1.16) contrast(1.04);
}

body.dg-game-shell.dg-entering:not(.dg-curtain-mounted)::after {
  visibility: visible;
  opacity: 1;
}

body.dg-game-shell.dg-entering::before,
body.dg-game-shell.dg-entering .dg-mirror-field {
  opacity: 0;
  filter: blur(10px) saturate(0.82);
}

body.dg-game-shell.dg-world-revealing::before {
  animation: dgWorldReveal 2.18s cubic-bezier(0.16, 0.78, 0.18, 1) 0.34s both;
}

body.dg-game-shell.dg-world-revealing .dg-mirror-field {
  animation: dgWorldReveal 2.22s cubic-bezier(0.16, 0.78, 0.18, 1) 0.48s both;
}

.dg-mirror-field {
  position: fixed !important;
  inset: 0;
  width: 100vw;
  height: 100svh;
  z-index: 0 !important;
  pointer-events: none;
  overflow: hidden;
  overflow: clip;
  contain: layout paint size style;
  perspective: 900px;
  transform-style: preserve-3d;
}

.dg-mirror-shard {
  position: absolute;
  left: var(--dg-shard-x);
  top: var(--dg-shard-y);
  width: var(--dg-shard-w);
  height: var(--dg-shard-h);
  display: block;
  opacity: var(--dg-shard-opacity);
  border: 1px solid color-mix(in srgb, var(--dg-rim) 44%, transparent);
  border-radius: 6px;
  background:
    radial-gradient(circle at var(--dg-glint-x) var(--dg-glint-y), rgba(255, 255, 255, 0.62), transparent 28%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.2), rgba(72, 210, 255, 0.065) 46%, rgba(255, 92, 150, 0.07)),
    rgba(255, 255, 255, 0.08);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.36),
    inset 1px 0 0 rgba(255, 92, 150, 0.14),
    inset -1px 0 0 rgba(66, 214, 255, 0.2),
    0 18px 60px rgba(36, 118, 172, 0.12),
    0 0 var(--dg-shard-edge, 18px) color-mix(in srgb, var(--dg-rim) 18%, transparent);
  clip-path: var(--dg-shard-clip, polygon(8% 2%, 96% 12%, 88% 100%, 0 86%));
  transform:
    translate3d(var(--dg-depth-bg-x), var(--dg-depth-bg-y), var(--dg-shard-z))
    rotate(var(--dg-shard-rotate))
    rotateX(var(--dg-tilt-x))
    rotateY(var(--dg-tilt-y));
  transform-style: preserve-3d;
  translate: 0 0;
  animation: dgShardFloat var(--dg-shard-speed, 9s) ease-in-out var(--dg-shard-delay) infinite alternate;
  will-change: transform, opacity;
}

.dg-mirror-shard::before,
.dg-mirror-shard::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  pointer-events: none;
}

.dg-mirror-shard::before {
  border: 1px solid rgba(255, 255, 255, 0.42);
  box-shadow:
    0 0 18px color-mix(in srgb, var(--dg-rim) 24%, transparent),
    inset 0 0 18px rgba(255, 255, 255, 0.13);
  opacity: 0.62;
}

.dg-mirror-shard::after {
  background:
    linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.48), transparent) top / 100% 18px no-repeat,
    linear-gradient(180deg, transparent, rgba(255, 92, 150, 0.18), transparent) left / 16px 100% no-repeat,
    linear-gradient(180deg, transparent, rgba(66, 214, 255, 0.22), transparent) right / 16px 100% no-repeat;
  opacity: 0.56;
  mix-blend-mode: screen;
}

.dg-mirror-shard.is-front {
  opacity: var(--dg-shard-opacity);
  filter: blur(0.04px) saturate(1.14);
}

.dg-mirror-shard.is-back {
  opacity: var(--dg-shard-opacity);
  filter: blur(0.7px) saturate(0.86);
}

body.dg-depth-disabled .dg-mirror-shard {
  transform: translate3d(0, 0, 0) rotate(var(--dg-shard-rotate));
  translate: 0 0;
  animation-play-state: paused;
}

body.dg-game-shell[data-dg-theme="dark"] .dg-mirror-shard {
  background:
    radial-gradient(circle at var(--dg-glint-x) var(--dg-glint-y), rgba(88, 220, 255, 0.32), transparent 30%),
    linear-gradient(135deg, rgba(126, 226, 255, 0.1), rgba(12, 38, 68, 0.18) 48%, rgba(255, 92, 150, 0.05)),
    rgba(3, 12, 24, 0.2);
  border-color: rgba(126, 226, 255, 0.18);
  box-shadow:
    inset 0 1px 0 rgba(210, 250, 255, 0.16),
    inset 1px 0 0 rgba(255, 92, 150, 0.1),
    inset -1px 0 0 rgba(66, 214, 255, 0.22),
    0 18px 70px rgba(0, 0, 0, 0.26);
}

body.dg-game-shell > :not(.modal):not(.recordsModal):not(#recordsModal):not(#GameScoreLayer):not(#welcome):not(.dg-ui-root):not(.dg-game-toolbar):not(.dg-entry-curtain):not(.dg-mirror-field) {
  position: relative;
  z-index: 1;
}

body.dg-game-shell a {
  color: var(--dg-accent);
}

body.dg-game-shell button,
body.dg-game-shell .btn,
body.dg-game-shell .number-btn,
body.dg-game-shell select,
body.dg-game-shell input:not([type="file"]):not([type="checkbox"]):not([type="color"]) {
  min-height: 42px;
  border: 1px solid color-mix(in srgb, var(--dg-rim) var(--dg-light-strength), var(--dg-line));
  border-radius: var(--dg-radius);
  color: var(--dg-text);
  background:
    radial-gradient(circle at var(--dg-glint-x) var(--dg-glint-y), var(--dg-control-glint), transparent 36%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.62), rgba(255, 255, 255, 0.12)),
    var(--dg-control);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.54),
    inset 1px 0 0 color-mix(in srgb, var(--dg-rim-pink) var(--dg-light-strength), transparent),
    inset -1px 0 0 color-mix(in srgb, var(--dg-rim) var(--dg-light-strength), transparent),
    0 12px 28px rgba(36, 76, 116, 0.1);
  font-family: var(--dg-font);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0;
  outline: none;
  transition:
    transform 0.18s var(--dg-ease),
    border-color 0.18s var(--dg-ease),
    box-shadow 0.18s var(--dg-ease),
    background 0.18s var(--dg-ease),
    color 0.18s var(--dg-ease);
}

body.dg-game-shell,
body.dg-game-shell .score-board > div,
body.dg-game-shell .game-container,
body.dg-game-shell #gameContainer,
body.dg-game-shell .control-panel,
body.dg-game-shell .container,
body.dg-game-shell .modal-content,
body.dg-game-shell #welcome > .FILL.BOX-M,
body.dg-game-shell .dg-game-toolbar {
  transition:
    background-color 0.32s var(--dg-ease),
    color 0.32s var(--dg-ease),
    border-color 0.32s var(--dg-ease),
    box-shadow 0.32s var(--dg-ease);
}

body.dg-game-shell .score-board > div,
body.dg-game-shell .game-container,
body.dg-game-shell #gameContainer,
body.dg-game-shell .control-panel,
body.dg-game-shell .settings,
body.dg-game-shell .current-record,
body.dg-game-shell .container,
body.dg-game-shell #welcome > .FILL.BOX-M,
body.dg-game-shell #GameScoreLayer > .backcolor_promptbox {
  -webkit-backdrop-filter: blur(20px) saturate(1.18);
  backdrop-filter: blur(20px) saturate(1.18);
}

body.dg-game-shell .score-board > div,
body.dg-game-shell .game-container,
body.dg-game-shell #gameContainer,
body.dg-game-shell .control-panel,
body.dg-game-shell .settings,
body.dg-game-shell .current-record,
body.dg-game-shell .container,
body.dg-game-shell .modal-content,
body.dg-game-shell #welcome > .FILL.BOX-M,
body.dg-game-shell #GameScoreLayer > .backcolor_promptbox {
  position: relative;
  overflow: hidden;
  border-color: color-mix(in srgb, var(--dg-rim) var(--dg-light-strength), var(--dg-line)) !important;
}

body.dg-game-shell .score-board > div::after,
body.dg-game-shell .game-container::after,
body.dg-game-shell #gameContainer::after,
body.dg-game-shell .control-panel::after,
body.dg-game-shell .settings::after,
body.dg-game-shell .current-record::after,
body.dg-game-shell .container::after,
body.dg-game-shell .modal-content::after,
body.dg-game-shell #welcome > .FILL.BOX-M::after,
body.dg-game-shell #GameScoreLayer > .backcolor_promptbox::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  border-radius: inherit;
  background:
    radial-gradient(circle at var(--dg-glint-x) var(--dg-glint-y), color-mix(in srgb, var(--dg-glass-highlight) 88%, transparent), transparent 30%),
    linear-gradient(90deg, var(--dg-rim-pink), transparent 18% 82%, var(--dg-rim)),
    linear-gradient(180deg, rgba(255, 255, 255, 0.24), transparent 30% 70%, rgba(66, 214, 255, 0.08));
  opacity: 0.28;
  mix-blend-mode: screen;
  transform: translateZ(28px);
  transition: opacity 0.18s var(--dg-ease), background-position 0.16s linear;
}

body.dg-depth-enabled .score-board > div::after,
body.dg-depth-enabled .game-container::after,
body.dg-depth-enabled #gameContainer::after,
body.dg-depth-enabled .control-panel::after,
body.dg-depth-enabled .settings::after,
body.dg-depth-enabled .current-record::after,
body.dg-depth-enabled .container::after,
body.dg-depth-enabled .modal-content::after,
body.dg-depth-enabled #welcome > .FILL.BOX-M::after,
body.dg-depth-enabled #GameScoreLayer > .backcolor_promptbox::after {
  opacity: 0.42;
}

body.dg-game-shell button,
body.dg-game-shell .btn,
body.dg-game-shell .number-btn {
  cursor: pointer;
}

body.dg-game-shell button:hover,
body.dg-game-shell .btn:hover,
body.dg-game-shell .number-btn:hover,
body.dg-game-shell select:hover {
  border-color: color-mix(in srgb, var(--dg-rim) 62%, var(--dg-line));
  background: var(--dg-control-hover);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.72),
    inset 1px 0 0 var(--dg-rim-pink),
    inset -1px 0 0 rgba(64, 198, 255, 0.28),
    0 18px 42px rgba(36, 118, 172, 0.18);
  transform: translateY(-2px);
  opacity: 1;
}

body.dg-game-shell button:active,
body.dg-game-shell .btn:active,
body.dg-game-shell .number-btn:active {
  transform: translateY(0) scale(0.99);
}

body.dg-game-shell button:focus-visible,
body.dg-game-shell .btn:focus-visible,
body.dg-game-shell .number-btn:focus-visible,
body.dg-game-shell select:focus-visible,
body.dg-game-shell input:focus-visible {
  border-color: var(--dg-accent);
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--dg-accent) 22%, transparent),
    0 18px 42px rgba(36, 118, 172, 0.18);
}

body.dg-game-shell select {
  padding: 0 38px 0 14px;
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--dg-accent) 50%),
    linear-gradient(135deg, var(--dg-accent) 50%, transparent 50%),
    linear-gradient(180deg, var(--dg-control), var(--dg-control));
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 12px) 50%,
    0 0;
  background-size:
    6px 6px,
    6px 6px,
    100% 100%;
  background-repeat: no-repeat;
}

body.dg-game-shell input[type="color"] {
  width: 46px;
  height: 42px;
  padding: 3px;
  border: 1px solid var(--dg-line);
  border-radius: var(--dg-radius);
  background: var(--dg-surface-strong);
}

body.dg-game-shell .primary,
body.dg-game-shell .btn-primary,
body.dg-game-shell #newGameBtn,
body.dg-game-shell #startBtn,
body.dg-game-shell #start-game,
body.dg-game-shell #ready-btn {
  border-color: color-mix(in srgb, var(--dg-accent) 62%, var(--dg-line)) !important;
  color: var(--dg-primary-text) !important;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--dg-glass-highlight) 22%, transparent), transparent 42%),
    linear-gradient(135deg, var(--dg-accent), color-mix(in srgb, var(--dg-accent) 62%, #0b5d92)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.34),
    inset 1px 0 0 var(--dg-rim-pink),
    0 18px 42px color-mix(in srgb, var(--dg-accent) 24%, transparent) !important;
}

body.dg-game-shell .danger,
body.dg-game-shell .btn-danger,
body.dg-game-shell #endGameBtn,
body.dg-game-shell #endBtn,
body.dg-game-shell #end-game {
  border-color: color-mix(in srgb, var(--dg-danger) 62%, var(--dg-line)) !important;
  color: #fff !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.2), transparent 44%),
    linear-gradient(135deg, var(--dg-danger), color-mix(in srgb, var(--dg-danger) 62%, #64172d)) !important;
}

body.dg-game-shell .btn-secondary,
body.dg-game-shell .btn-success {
  border-color: color-mix(in srgb, var(--dg-warm) 55%, var(--dg-line)) !important;
  color: var(--dg-primary-text) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.2), transparent 44%),
    linear-gradient(135deg, var(--dg-warm), color-mix(in srgb, var(--dg-warm) 58%, #224d92)) !important;
}

body.dg-game-shell .icp {
  display: block;
  margin: 12px auto 0;
  color: var(--dg-muted);
  font-size: 12px;
  text-align: center;
  text-decoration: none;
}

.dg-game-toolbar {
  position: fixed;
  top: max(12px, env(safe-area-inset-top));
  right: max(12px, env(safe-area-inset-right));
  z-index: 100010;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px;
  max-width: calc(100vw - 24px);
  color: var(--dg-text);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.42), transparent 48%),
    color-mix(in srgb, var(--dg-surface-strong) 78%, transparent);
  border: 1px solid var(--dg-line-strong);
  border-radius: var(--dg-radius);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.44),
    inset 1px 0 0 var(--dg-rim-pink),
    inset -1px 0 0 rgba(66, 214, 255, 0.18),
    var(--dg-shadow-soft);
  -webkit-backdrop-filter: blur(22px) saturate(1.22);
  backdrop-filter: blur(22px) saturate(1.22);
  animation: dgToolbarIn 0.42s var(--dg-ease);
}

.dg-toolbar-button {
  min-width: 54px !important;
  width: auto !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 12px !important;
  display: grid;
  place-items: center;
  box-shadow: none !important;
  color: var(--dg-text) !important;
  font-size: 13px !important;
  line-height: 1;
  white-space: nowrap;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.48), transparent 48%),
    color-mix(in srgb, var(--dg-control) 72%, transparent) !important;
}

.dg-toolbar-button.is-active {
  color: var(--dg-primary-text) !important;
  border-color: color-mix(in srgb, var(--dg-accent) 68%, var(--dg-line)) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.24), transparent 42%),
    linear-gradient(135deg, var(--dg-accent), color-mix(in srgb, var(--dg-accent) 68%, #0a4a82)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.34),
    inset 1px 0 0 var(--dg-rim-pink),
    0 12px 28px color-mix(in srgb, var(--dg-accent) 24%, transparent) !important;
}

.dg-theme-toggle.is-active {
  color: var(--dg-text) !important;
  border-color: color-mix(in srgb, var(--dg-rim) 62%, var(--dg-line-strong)) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.18), transparent 42%),
    linear-gradient(135deg, color-mix(in srgb, var(--dg-bg-soft) 65%, var(--dg-accent)), #06101a) !important;
}

.dg-toolbar-button:disabled {
  cursor: not-allowed;
  opacity: 0.48;
}

.dg-game-shell .dg-entry-surface {
  --dg-entry-delay: 0ms;
  --dg-entry-duration: 920ms;
  --dg-entry-x: 0px;
  --dg-entry-y: 0px;
  --dg-entry-z: -720px;
  --dg-entry-scale: 0.58;
  --dg-entry-rx: 0deg;
  --dg-entry-ry: 0deg;
  --dg-entry-rz: 0deg;
  --dg-entry-over-x: 0px;
  --dg-entry-over-y: 0px;
  --dg-entry-over-rx: 0deg;
  --dg-entry-over-ry: 0deg;
  --dg-entry-over-rz: 0deg;
  transform-origin: 50% 50%;
  backface-visibility: hidden;
}

.dg-game-shell:not(.dg-page-ready) .score-board,
.dg-game-shell:not(.dg-page-ready) .game-container,
.dg-game-shell:not(.dg-page-ready) #gameContainer,
.dg-game-shell:not(.dg-page-ready) .control-panel,
.dg-game-shell:not(.dg-page-ready) .controls,
.dg-game-shell:not(.dg-page-ready) .actions,
.dg-game-shell:not(.dg-page-ready) .number-selector,
.dg-game-shell:not(.dg-page-ready) .dg-touch-pad,
.dg-game-shell:not(.dg-page-ready) .container,
.dg-game-shell:not(.dg-page-ready) #welcome > .FILL.BOX-M {
  opacity: 0;
  filter: blur(12px) saturate(0.86);
}

.dg-game-shell:not(.dg-page-ready) .dg-entry-surface {
  transform:
    translate3d(
      calc(var(--dg-depth-x) + var(--dg-entry-x)),
      calc(var(--dg-depth-y) + var(--dg-entry-y)),
      var(--dg-entry-z)
    )
    scale(var(--dg-entry-scale))
    rotateX(calc(var(--dg-tilt-x) + var(--dg-entry-rx)))
    rotateY(calc(var(--dg-tilt-y) + var(--dg-entry-ry)))
    rotateZ(var(--dg-entry-rz));
}

.dg-game-shell.dg-page-ready .dg-entry-surface {
  animation: dgSurfaceFlyIn var(--dg-entry-duration) cubic-bezier(0.12, 0.76, 0.16, 1) var(--dg-entry-delay) backwards;
  will-change: transform, opacity, filter;
}

body.dg-animation-disabled.dg-page-ready .dg-entry-surface {
  animation: none !important;
}

body.dg-depth-enabled.dg-page-ready .score-board,
body.dg-depth-enabled.dg-page-ready .game-container,
body.dg-depth-enabled.dg-page-ready #gameContainer,
body.dg-depth-enabled.dg-page-ready .control-panel,
body.dg-depth-enabled.dg-page-ready .controls,
body.dg-depth-enabled.dg-page-ready .actions,
body.dg-depth-enabled.dg-page-ready .number-selector,
body.dg-depth-enabled.dg-page-ready .dg-touch-pad,
body.dg-depth-enabled.dg-page-ready .container,
body.dg-depth-enabled.dg-page-ready #gameBody,
body.dg-depth-enabled.dg-page-ready #welcome > .FILL.BOX-M {
  transform:
    translate3d(var(--dg-depth-x), var(--dg-depth-y), 0)
    rotateX(var(--dg-tilt-x))
    rotateY(var(--dg-tilt-y));
  transform-style: preserve-3d;
  will-change: transform;
  transition:
    transform 0.16s ease-out,
    background-color 0.32s var(--dg-ease),
    color 0.32s var(--dg-ease),
    border-color 0.32s var(--dg-ease),
    box-shadow 0.32s var(--dg-ease);
}

body.dg-depth-enabled.dg-page-ready .dg-game-toolbar {
  transform:
    translate3d(var(--dg-depth-x), var(--dg-depth-y), 0)
    rotateX(var(--dg-tilt-x))
    rotateY(var(--dg-tilt-y));
  transform-style: preserve-3d;
  will-change: transform;
  transition: transform 0.16s ease-out, background-color 0.32s var(--dg-ease), border-color 0.32s var(--dg-ease);
}

body.dg-depth-enabled.dg-page-ready button,
body.dg-depth-enabled.dg-page-ready .btn,
body.dg-depth-enabled.dg-page-ready .number-btn,
body.dg-depth-enabled.dg-page-ready select,
body.dg-depth-enabled.dg-page-ready input:not([type="file"]):not([type="checkbox"]):not([type="color"]) {
  transform: translateZ(14px);
  transform-style: preserve-3d;
}

body.dg-depth-enabled.dg-page-ready button:hover,
body.dg-depth-enabled.dg-page-ready .btn:hover,
body.dg-depth-enabled.dg-page-ready .number-btn:hover,
body.dg-depth-enabled.dg-page-ready select:hover {
  transform: translateY(-2px) translateZ(22px);
}

body.dg-depth-enabled.dg-page-ready button:active,
body.dg-depth-enabled.dg-page-ready .btn:active,
body.dg-depth-enabled.dg-page-ready .number-btn:active {
  transform: translateY(0) scale(0.99) translateZ(10px);
}

body.dg-depth-disabled.dg-page-ready:not(.dg-entering) .score-board,
body.dg-depth-disabled.dg-page-ready:not(.dg-entering) .game-container,
body.dg-depth-disabled.dg-page-ready:not(.dg-entering) #gameContainer,
body.dg-depth-disabled.dg-page-ready:not(.dg-entering) .control-panel,
body.dg-depth-disabled.dg-page-ready:not(.dg-entering) .controls,
body.dg-depth-disabled.dg-page-ready:not(.dg-entering) .actions,
body.dg-depth-disabled.dg-page-ready:not(.dg-entering) .number-selector,
body.dg-depth-disabled.dg-page-ready:not(.dg-entering) .dg-touch-pad,
body.dg-depth-disabled.dg-page-ready:not(.dg-entering) .container,
body.dg-depth-disabled.dg-page-ready:not(.dg-entering) #gameBody,
body.dg-depth-disabled.dg-page-ready:not(.dg-entering) #welcome > .FILL.BOX-M,
body.dg-depth-disabled.dg-page-ready:not(.dg-entering) .dg-game-toolbar,
body.dg-depth-disabled.dg-page-ready:not(.dg-entering) button,
body.dg-depth-disabled.dg-page-ready:not(.dg-entering) .btn,
body.dg-depth-disabled.dg-page-ready:not(.dg-entering) .number-btn,
body.dg-depth-disabled.dg-page-ready:not(.dg-entering) select {
  transform: none !important;
}

body.dg-game-dank.dg-page-ready #welcome[style*="display: none"] > .FILL.BOX-M,
body.dg-game-dank.dg-page-ready #welcome[style*="display:none"] > .FILL.BOX-M {
  animation: none;
}

.dg-theme-switching {
  animation: dgThemeSwitch 0.28s var(--dg-ease) both;
}

.dg-entry-curtain {
  position: fixed !important;
  inset: 0;
  z-index: 100020 !important;
  overflow: hidden;
  pointer-events: auto;
  background: var(--dg-curtain-solid);
  opacity: 1;
  perspective: 1200px;
}

.dg-entry-curtain__white,
.dg-entry-curtain__pane,
.dg-entry-curtain__tunnel,
.dg-entry-curtain__flare,
.dg-entry-curtain__grain {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.dg-entry-curtain__white {
  z-index: 6;
  background:
    radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--dg-curtain-beam) 34%, transparent), transparent 42%),
    var(--dg-curtain-solid);
}

.dg-entry-curtain__pane {
  z-index: 4;
  width: 56%;
  background:
    linear-gradient(120deg, color-mix(in srgb, var(--dg-curtain-beam) 42%, transparent), rgba(190, 236, 255, 0.22) 44%, rgba(255, 92, 150, 0.08)),
    linear-gradient(90deg, rgba(255, 255, 255, 0.34), transparent 32% 72%, rgba(70, 208, 255, 0.2)),
    var(--dg-curtain-pane);
  border: 1px solid rgba(255, 255, 255, 0.58);
  box-shadow:
    inset 0 0 40px rgba(255, 255, 255, 0.5),
    inset 1px 0 0 rgba(255, 92, 150, 0.18),
    inset -1px 0 0 rgba(70, 208, 255, 0.28),
    0 0 80px rgba(104, 204, 255, 0.18);
  -webkit-backdrop-filter: blur(18px) saturate(1.24);
  backdrop-filter: blur(18px) saturate(1.24);
}

.dg-entry-curtain__pane--left {
  right: 50%;
  transform-origin: 100% 50%;
  clip-path: polygon(0 0, 100% 0, 88% 100%, 0 100%);
}

.dg-entry-curtain__pane--right {
  left: 50%;
  transform-origin: 0 50%;
  clip-path: polygon(12% 0, 100% 0, 100% 100%, 0 100%);
}

.dg-entry-curtain__tunnel {
  z-index: 3;
  opacity: 0;
  background:
    radial-gradient(circle at 50% 50%, var(--dg-curtain-beam), var(--dg-curtain-glow) 12%, rgba(66, 184, 255, 0.2) 34%, transparent 66%),
    conic-gradient(from 42deg, transparent, rgba(255, 255, 255, 0.42), transparent, rgba(80, 210, 255, 0.2), transparent);
  mix-blend-mode: screen;
  transform: scale(0.62);
}

.dg-entry-curtain__flare {
  z-index: 5;
  opacity: 0;
  background:
    linear-gradient(90deg, transparent 10%, var(--dg-curtain-beam) 48%, var(--dg-curtain-glow) 53%, transparent 88%),
    radial-gradient(circle at 50% 50%, var(--dg-curtain-beam), transparent 44%);
  filter: blur(0.2px);
  transform: scaleX(0.26);
  mix-blend-mode: screen;
}

.dg-entry-curtain__grain {
  z-index: 7;
  opacity: 0.28;
  background:
    linear-gradient(118deg, transparent 0 18%, rgba(255, 255, 255, 0.38) 18.15%, transparent 18.7%, transparent 72%, rgba(255, 92, 150, 0.12) 72.15%, transparent 72.7%),
    linear-gradient(62deg, transparent 0 28%, rgba(72, 210, 255, 0.18) 28.15%, transparent 28.7%, transparent 64%, rgba(255, 255, 255, 0.26) 64.15%, transparent 64.7%);
  background-size: 84vmax 84vmax, 70vmax 70vmax;
}

body.dg-game-shell[data-dg-theme="dark"] .dg-entry-curtain__pane {
  background:
    linear-gradient(120deg, rgba(52, 180, 255, 0.22), rgba(20, 112, 170, 0.16) 46%, rgba(255, 92, 150, 0.08)),
    linear-gradient(90deg, rgba(255, 255, 255, 0.14), transparent 32% 72%, rgba(70, 208, 255, 0.16)),
    var(--dg-curtain-pane);
  border-color: rgba(126, 226, 255, 0.24);
}

.dg-entry-curtain--enter.is-running {
  animation: dgCurtainShellReveal 2.92s cubic-bezier(0.16, 0.78, 0.18, 1) forwards;
}

.dg-entry-curtain--enter.is-running .dg-entry-curtain__white {
  animation: dgCurtainWhiteLift 2.36s cubic-bezier(0.16, 0.78, 0.18, 1) forwards;
}

.dg-entry-curtain--enter.is-running .dg-entry-curtain__pane--left {
  animation: dgCurtainEnterLeft 2.32s cubic-bezier(0.16, 0.78, 0.18, 1) 0.16s forwards;
}

.dg-entry-curtain--enter.is-running .dg-entry-curtain__pane--right {
  animation: dgCurtainEnterRight 2.32s cubic-bezier(0.16, 0.78, 0.18, 1) 0.16s forwards;
}

.dg-entry-curtain--enter.is-running .dg-entry-curtain__tunnel {
  animation: dgCurtainTunnel 2.36s cubic-bezier(0.16, 0.78, 0.18, 1) 0.18s forwards;
}

.dg-entry-curtain--enter.is-running .dg-entry-curtain__flare {
  animation: dgCurtainFlare 2.24s cubic-bezier(0.16, 0.78, 0.18, 1) 0.24s forwards;
}

.dg-entry-curtain--enter.is-running .dg-entry-curtain__grain {
  animation: dgCurtainGrain 2.42s cubic-bezier(0.16, 0.78, 0.18, 1) forwards;
}

.dg-entry-curtain--exit {
  background: transparent;
}

.dg-entry-curtain--exit .dg-entry-curtain__pane,
.dg-entry-curtain--exit .dg-entry-curtain__tunnel,
.dg-entry-curtain--exit .dg-entry-curtain__flare,
.dg-entry-curtain--exit .dg-entry-curtain__grain {
  opacity: 0;
}

.dg-entry-curtain--exit[data-dg-exit-primed] {
  background: transparent !important;
}

.dg-entry-curtain--exit[data-dg-exit-primed] .dg-entry-curtain__white,
.dg-entry-curtain--exit[data-dg-exit-primed] .dg-entry-curtain__pane,
.dg-entry-curtain--exit[data-dg-exit-primed] .dg-entry-curtain__tunnel,
.dg-entry-curtain--exit[data-dg-exit-primed] .dg-entry-curtain__flare,
.dg-entry-curtain--exit[data-dg-exit-primed] .dg-entry-curtain__grain {
  opacity: 0 !important;
}

.dg-entry-curtain--exit .dg-entry-curtain__white {
  opacity: 0;
  background: var(--dg-curtain-solid);
}

.dg-entry-curtain--exit .dg-entry-curtain__pane--left {
  transform: translateX(-108%) rotateY(-18deg) scale(1.04);
}

.dg-entry-curtain--exit .dg-entry-curtain__pane--right {
  transform: translateX(108%) rotateY(18deg) scale(1.04);
}

.dg-entry-curtain--exit.is-running .dg-entry-curtain__white {
  animation: dgCurtainExitWhite 1.08s cubic-bezier(0.18, 0.82, 0.2, 1) forwards;
}

.dg-entry-curtain--exit.is-running .dg-entry-curtain__pane--left {
  animation: dgCurtainExitLeft 0.98s cubic-bezier(0.18, 0.82, 0.2, 1) forwards;
}

.dg-entry-curtain--exit.is-running .dg-entry-curtain__pane--right {
  animation: dgCurtainExitRight 0.98s cubic-bezier(0.18, 0.82, 0.2, 1) forwards;
}

.dg-entry-curtain--exit.is-running .dg-entry-curtain__flare {
  animation: dgCurtainExitFlare 1.02s cubic-bezier(0.18, 0.82, 0.2, 1) forwards;
}

/* Shared modal and notification layer. */
.dg-ui-root {
  position: fixed;
  inset: 0;
  z-index: 99999;
  pointer-events: none;
  font-family: var(--dg-font);
}

.dg-dialog-backdrop {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 18px;
  background: var(--dg-backdrop);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
  -webkit-backdrop-filter: blur(16px) saturate(1.12);
  backdrop-filter: blur(16px) saturate(1.12);
}

.dg-dialog-backdrop.is-open {
  opacity: 1;
  pointer-events: auto;
}

.dg-dialog {
  width: min(420px, calc(100vw - 32px));
  color: var(--dg-text);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.44), transparent 48%, rgba(66, 214, 255, 0.08)),
    color-mix(in srgb, var(--dg-surface-strong) 92%, transparent);
  border: 1px solid var(--dg-line-strong);
  border-radius: var(--dg-radius);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.42),
    inset 1px 0 0 var(--dg-rim-pink),
    inset -1px 0 0 rgba(66, 214, 255, 0.22),
    var(--dg-shadow);
  overflow: hidden;
  transform: translateY(8px) scale(0.98);
  transition: transform 0.2s var(--dg-ease);
  -webkit-backdrop-filter: blur(20px) saturate(1.08);
  backdrop-filter: blur(20px) saturate(1.08);
}

.dg-dialog-backdrop.is-open .dg-dialog {
  transform: translateY(0) scale(1);
}

.dg-dialog__bar {
  height: 3px;
  background: linear-gradient(90deg, transparent, var(--dg-accent), var(--dg-accent-2), transparent);
}

.dg-dialog__body {
  padding: 22px;
}

.dg-dialog__title {
  margin: 0 0 8px;
  color: var(--dg-text);
  font-size: 18px;
  font-weight: 800;
}

.dg-dialog__message {
  margin: 0;
  color: var(--dg-muted);
  font-size: 14px;
  line-height: 1.7;
  white-space: pre-wrap;
}

.dg-dialog__actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 0 22px 22px;
}

.dg-dialog__actions button {
  min-width: 88px;
  padding: 0 14px;
}

.dg-dialog__cancel {
  background: var(--dg-control) !important;
}

.dg-toast-stack {
  position: absolute;
  left: 50%;
  bottom: max(18px, env(safe-area-inset-bottom));
  display: grid;
  gap: 10px;
  width: min(420px, calc(100vw - 32px));
  transform: translateX(-50%);
  pointer-events: none;
}

.dg-toast {
  padding: 12px 14px;
  color: var(--dg-text);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.42), transparent 52%),
    var(--dg-surface-strong);
  border: 1px solid var(--dg-line);
  border-left: 3px solid var(--dg-accent);
  border-radius: var(--dg-radius);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.34),
    inset -1px 0 0 rgba(66, 214, 255, 0.18),
    var(--dg-shadow-soft);
  font-size: 13px;
  font-weight: 700;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.2s ease, transform 0.2s var(--dg-ease);
}

.dg-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.dg-toast.is-danger {
  border-left-color: var(--dg-danger);
}

.dg-toast.is-success {
  border-left-color: var(--dg-success);
}

/* Existing modal structures unified. */
body.dg-game-shell .modal,
body.dg-game-shell .recordsModal,
body.dg-game-shell #recordsModal,
body.dg-game-shell #GameScoreLayer {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100svh !important;
  z-index: 10000 !important;
  background: var(--dg-backdrop) !important;
  -webkit-backdrop-filter: blur(10px) saturate(1.02);
  backdrop-filter: blur(10px) saturate(1.02);
}

body.dg-game-shell .modal[style*="display: flex"],
body.dg-game-shell .modal[style*="display:flex"],
body.dg-game-shell .recordsModal[style*="display: block"],
body.dg-game-shell .recordsModal[style*="display:block"],
body.dg-game-shell #recordsModal[style*="display: block"],
body.dg-game-shell #recordsModal[style*="display:block"],
body.dg-game-shell #GameScoreLayer[style*="display: block"],
body.dg-game-shell #GameScoreLayer[style*="display:block"] {
  display: grid !important;
  place-items: center !important;
}

body.dg-game-shell .modal-content,
body.dg-game-shell #GameScoreLayer > .backcolor_promptbox {
  width: min(560px, calc(100vw - 32px)) !important;
  max-width: calc(100vw - 32px) !important;
  max-height: min(86svh, 760px) !important;
  margin: 0 auto !important;
  padding: clamp(18px, 4vw, 28px) !important;
  color: var(--dg-text) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.44), transparent 48%, rgba(66, 214, 255, 0.08)),
    var(--dg-surface-strong) !important;
  border: 1px solid var(--dg-line-strong) !important;
  border-radius: var(--dg-radius) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.42),
    inset 1px 0 0 var(--dg-rim-pink),
    inset -1px 0 0 rgba(66, 214, 255, 0.22),
    var(--dg-shadow) !important;
  overflow: auto !important;
  text-align: left !important;
  transform: none !important;
  top: auto !important;
  animation: dgModalIn 0.24s var(--dg-ease) both;
}

body.dg-depth-enabled .dg-dialog-backdrop.is-open .dg-dialog,
body.dg-depth-enabled .modal[style*="display: flex"] .modal-content,
body.dg-depth-enabled .modal[style*="display:flex"] .modal-content,
body.dg-depth-enabled .recordsModal[style*="display: block"] .modal-content,
body.dg-depth-enabled .recordsModal[style*="display:block"] .modal-content,
body.dg-depth-enabled #recordsModal[style*="display: block"] .modal-content,
body.dg-depth-enabled #recordsModal[style*="display:block"] .modal-content,
body.dg-depth-enabled #GameScoreLayer[style*="display: block"] > .backcolor_promptbox,
body.dg-depth-enabled #GameScoreLayer[style*="display:block"] > .backcolor_promptbox {
  transform:
    translate3d(var(--dg-depth-x), var(--dg-depth-y), 0)
    rotateX(var(--dg-tilt-x))
    rotateY(var(--dg-tilt-y)) !important;
  transform-style: preserve-3d;
  transition: transform 0.16s ease-out;
}

body.dg-depth-disabled .dg-dialog,
body.dg-depth-disabled .modal-content,
body.dg-depth-disabled #GameScoreLayer > .backcolor_promptbox {
  transform: none !important;
}

body.dg-game-shell .modal-content h2,
body.dg-game-shell .modal-content h3,
body.dg-game-shell .modal-content h4 {
  color: var(--dg-text) !important;
}

body.dg-game-shell .history-item,
body.dg-game-shell .record-item {
  border-color: var(--dg-line) !important;
  color: var(--dg-muted) !important;
}

/* Direction pad shared by touch-first screens. */
.dg-touch-pad {
  display: none;
  grid-template-columns: repeat(3, 46px);
  grid-template-rows: repeat(3, 46px);
  gap: 8px;
  justify-content: center;
  align-items: center;
  margin: 12px auto 0;
  touch-action: manipulation;
}

.dg-touch-pad button {
  width: 46px;
  min-width: 46px;
  height: 46px;
  min-height: 46px;
  padding: 0;
  font-size: 18px;
  line-height: 1;
}

.dg-touch-pad [data-dir="up"] {
  grid-column: 2;
  grid-row: 1;
}

.dg-touch-pad [data-dir="left"] {
  grid-column: 1;
  grid-row: 2;
}

.dg-touch-pad [data-dir="right"] {
  grid-column: 3;
  grid-row: 2;
}

.dg-touch-pad [data-dir="down"] {
  grid-column: 2;
  grid-row: 3;
}

@media (hover: none), (max-width: 760px) {
  .dg-touch-pad {
    display: grid;
  }
}

/* 2048. */
body.dg-game-2048 {
  --cell-size: clamp(42px, 10vmin, 92px);
  --gap: clamp(5px, 1vmin, 10px);
  display: grid;
  grid-template-columns: minmax(260px, 360px) minmax(300px, auto);
  grid-template-areas:
    "stats board"
    "controls board"
    "footer footer";
  align-items: center;
  justify-content: center;
  gap: clamp(14px, 3vw, 34px);
  padding: clamp(14px, 3vw, 34px);
}

body.dg-game-2048 .score-board {
  grid-area: stats;
  align-self: end;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px !important;
  width: 100%;
  margin: 0 !important;
}

body.dg-game-2048 .score-board > div {
  min-height: 72px;
  padding: 12px;
  color: var(--dg-muted);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.46), rgba(255, 255, 255, 0.08) 52%, rgba(66, 214, 255, 0.08)),
    var(--dg-surface);
  border: 1px solid var(--dg-line);
  border-radius: var(--dg-radius);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.42),
    inset 1px 0 0 var(--dg-rim-pink),
    inset -1px 0 0 rgba(66, 214, 255, 0.2),
    var(--dg-shadow-soft);
  font-size: 13px;
}

body.dg-game-2048 .score-board span {
  display: block;
  margin-top: 4px;
  color: var(--dg-text);
  font-size: clamp(20px, 4vw, 30px);
  font-weight: 900;
  line-height: 1.05;
}

body.dg-game-2048 .game-container {
  grid-area: board;
  width: fit-content;
  min-width: min(calc(var(--cell-size) * 4 + var(--gap) * 5 + 30px), calc(100vw - 44px));
  min-height: min(calc(var(--cell-size) * 4 + var(--gap) * 5 + 30px), calc(100svh - 28px));
  max-width: calc(100vw - 44px) !important;
  max-height: calc(100svh - 28px) !important;
  margin: 0 !important;
  padding: clamp(8px, 1.4vw, 14px) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.48), rgba(255, 255, 255, 0.08) 48%, rgba(66, 214, 255, 0.08)),
    var(--dg-surface-strong) !important;
  border: 1px solid var(--dg-line-strong);
  border-radius: var(--dg-radius) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.44),
    inset 1px 0 0 var(--dg-rim-pink),
    inset -1px 0 0 rgba(66, 214, 255, 0.22),
    var(--dg-shadow) !important;
  overflow: auto !important;
}

body.dg-game-2048 .grid {
  gap: clamp(5px, 1vmin, 10px) !important;
  padding: clamp(5px, 1vmin, 10px) !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.16), transparent 48%),
    var(--dg-board) !important;
  border: 1px solid var(--dg-line);
  border-radius: var(--dg-radius) !important;
}

body.dg-game-2048 .cell {
  color: var(--dg-tile-dark-text) !important;
  background: var(--dg-tile-empty) !important;
  border: 1px solid color-mix(in srgb, var(--dg-line) 70%, transparent);
  border-radius: var(--dg-radius-sm) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.26),
    inset 1px 0 0 rgba(255, 92, 150, 0.08),
    inset -1px 0 0 rgba(66, 214, 255, 0.14),
    0 8px 16px rgba(20, 72, 112, 0.08);
  font-weight: 900;
  font-size: clamp(18px, calc(var(--cell-size) * 0.38), 40px) !important;
  animation: dgTileSettle 0.18s var(--dg-ease) both;
}

body.dg-game-2048 .cell[data-value="0"] {
  color: transparent !important;
}

body.dg-game-2048 .cell[data-value="2"] { background: var(--dg-tile-2) !important; color: var(--dg-tile-dark-text) !important; }
body.dg-game-2048 .cell[data-value="4"] { background: var(--dg-tile-4) !important; color: var(--dg-tile-dark-text) !important; }
body.dg-game-2048 .cell[data-value="8"] { background: var(--dg-tile-8) !important; color: var(--dg-tile-dark-text) !important; }
body.dg-game-2048 .cell[data-value="16"] { background: var(--dg-tile-16) !important; color: var(--dg-tile-dark-text) !important; }
body.dg-game-2048 .cell[data-value="32"] { background: var(--dg-tile-32) !important; color: var(--dg-tile-light-text) !important; }
body.dg-game-2048 .cell[data-value="64"] { background: var(--dg-tile-64) !important; color: var(--dg-tile-light-text) !important; }
body.dg-game-2048 .cell[data-value="128"] { background: var(--dg-tile-128) !important; color: var(--dg-tile-light-text) !important; }
body.dg-game-2048 .cell[data-value="256"] { background: var(--dg-tile-256) !important; color: var(--dg-tile-light-text) !important; }
body.dg-game-2048 .cell[data-value="512"] { background: var(--dg-tile-512) !important; color: var(--dg-tile-light-text) !important; }
body.dg-game-2048 .cell[data-value="1024"] { background: var(--dg-tile-1024) !important; color: var(--dg-tile-light-text) !important; }
body.dg-game-2048 .cell[data-value="2048"] { background: var(--dg-tile-2048) !important; color: var(--dg-tile-light-text) !important; }
body.dg-game-2048 .cell[data-value="4096"] { background: var(--dg-tile-4096) !important; color: var(--dg-tile-light-text) !important; }
body.dg-game-2048 .cell[data-value="8192"] { background: var(--dg-tile-8192) !important; color: var(--dg-tile-light-text) !important; }
body.dg-game-2048 .cell[data-value="16384"] { background: var(--dg-tile-16384) !important; color: var(--dg-tile-light-text) !important; }
body.dg-game-2048 .cell[data-value="32768"] { background: var(--dg-tile-32768) !important; color: var(--dg-tile-light-text) !important; }
body.dg-game-2048 .cell[data-value="65536"] { background: var(--dg-tile-65536) !important; color: var(--dg-tile-light-text) !important; }
body.dg-game-2048 .cell[data-value="1024"],
body.dg-game-2048 .cell[data-value="2048"] { font-size: clamp(16px, calc(var(--cell-size) * 0.3), 34px) !important; }
body.dg-game-2048 .cell[data-value="4096"],
body.dg-game-2048 .cell[data-value="8192"],
body.dg-game-2048 .cell[data-value="16384"],
body.dg-game-2048 .cell[data-value="32768"],
body.dg-game-2048 .cell[data-value="65536"] { font-size: clamp(14px, calc(var(--cell-size) * 0.24), 28px) !important; }

body.dg-game-2048 .controls {
  grid-area: controls;
  align-self: start;
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 10px !important;
  width: 100%;
  margin: 0 !important;
}

body.dg-game-2048 .controls select,
body.dg-game-2048 .controls button {
  width: 100%;
}

body.dg-game-2048 .dg-touch-pad {
  grid-column: 1 / -1;
}

body.dg-game-2048 > div[style*="width:100%"] {
  grid-area: footer;
}

/* Snake. */
body.dg-game-snake {
  display: grid !important;
  grid-template-columns: minmax(300px, min(64svh, 680px)) minmax(280px, 380px);
  align-items: center;
  justify-content: center;
  gap: clamp(14px, 3vw, 34px);
  padding: clamp(14px, 3vw, 34px) !important;
}

body.dg-game-snake #gameContainer {
  width: min(64svh, 58vw, 680px) !important;
  height: min(64svh, 58vw, 680px) !important;
  max-width: calc(100vw - 28px) !important;
  max-height: calc(100svh - 28px) !important;
  margin: 0 !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.28), transparent 48%),
    var(--dg-canvas) !important;
  border: 1px solid var(--dg-line-strong);
  border-radius: var(--dg-radius) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.38),
    inset 1px 0 0 var(--dg-rim-pink),
    inset -1px 0 0 rgba(66, 214, 255, 0.22),
    var(--dg-shadow) !important;
}

body.dg-game-snake #gameCanvas {
  width: 100%;
  height: 100%;
  background: var(--dg-canvas);
}

body.dg-game-snake .idle-animation::before {
  background:
    linear-gradient(
      120deg,
      transparent 38%,
      color-mix(in srgb, var(--dg-accent) 20%, transparent) 50%,
      transparent 62%
    ) !important;
  opacity: 0.28 !important;
  animation: dgSoftSheen 5.2s var(--dg-ease) infinite !important;
}

body.dg-game-snake #gameHUD {
  top: 12px !important;
  left: 12px !important;
  right: 12px !important;
  padding: 10px 12px !important;
  color: var(--dg-text) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.34), transparent 52%),
    color-mix(in srgb, var(--dg-surface-strong) 78%, transparent) !important;
  border: 1px solid var(--dg-line);
  border-radius: var(--dg-radius) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

body.dg-game-snake .control-panel {
  width: min(380px, 100%) !important;
  max-width: 100% !important;
  margin: 0 !important;
}

body.dg-game-snake .settings,
body.dg-game-snake .current-record {
  gap: 10px !important;
  padding: 14px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.42), transparent 50%, rgba(66, 214, 255, 0.08)),
    var(--dg-surface);
  border: 1px solid var(--dg-line);
  border-radius: var(--dg-radius) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.36),
    inset 1px 0 0 var(--dg-rim-pink),
    inset -1px 0 0 rgba(66, 214, 255, 0.2),
    var(--dg-shadow-soft) !important;
}

body.dg-game-snake .settings > div {
  gap: 10px;
}

body.dg-game-snake .current-record {
  margin-top: 10px;
  color: var(--dg-muted);
}

body.dg-game-snake .current-record strong {
  color: var(--dg-text);
  font-size: 24px;
}

body.dg-game-snake .instruction-item,
body.dg-game-snake .skin-option {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.18), transparent 56%),
    var(--dg-surface-soft) !important;
  border: 1px solid var(--dg-line);
  border-radius: var(--dg-radius) !important;
}

body.dg-game-snake .instruction-icon {
  background: var(--dg-accent) !important;
  color: var(--dg-primary-text) !important;
}

/* Sudoku. */
body.dg-game-shudu {
  display: grid !important;
  place-items: center;
  padding: clamp(14px, 3vw, 34px) !important;
}

body.dg-game-shudu .container {
  width: min(1120px, 100%) !important;
  max-width: 1120px !important;
  min-height: min(760px, calc(100svh - 36px));
  padding: clamp(16px, 3vw, 28px) !important;
  gap: clamp(16px, 2vw, 24px) !important;
  color: var(--dg-text) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.48), rgba(255, 255, 255, 0.08) 46%, rgba(66, 214, 255, 0.08)),
    var(--dg-surface-strong) !important;
  border: 1px solid var(--dg-line-strong);
  border-radius: var(--dg-radius) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.42),
    inset 1px 0 0 var(--dg-rim-pink),
    inset -1px 0 0 rgba(66, 214, 255, 0.22),
    var(--dg-shadow) !important;
}

body.dg-game-shudu .container::before {
  height: 3px !important;
  background:
    linear-gradient(90deg, transparent, var(--dg-accent), var(--dg-accent-2), transparent) !important;
}

body.dg-game-shudu h1,
body.dg-game-shudu .start-screen h2,
body.dg-game-shudu .timer,
body.dg-game-shudu .stat-value {
  color: var(--dg-text) !important;
}

body.dg-game-shudu .start-screen p,
body.dg-game-shudu .control-label,
body.dg-game-shudu .stat-label {
  color: var(--dg-muted) !important;
}

body.dg-game-shudu .header {
  gap: 14px !important;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--dg-line);
}

body.dg-game-shudu .controls {
  gap: 12px !important;
}

body.dg-game-shudu .star {
  border-radius: var(--dg-radius-sm) !important;
  border: 1px solid var(--dg-line);
  color: rgba(238, 246, 255, 0.28) !important;
}

body.dg-game-shudu .star {
  background: var(--dg-surface-soft) !important;
}

body.dg-game-shudu .star.active {
  color: var(--dg-primary-text) !important;
  background: var(--dg-accent) !important;
}

body.dg-game-shudu .game-area {
  width: 100%;
  display: grid !important;
  justify-items: center;
}

body.dg-game-shudu .timer {
  border-color: var(--dg-line) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.32), transparent 56%),
    var(--dg-surface) !important;
  border-radius: var(--dg-radius) !important;
  box-shadow: none !important;
}

body.dg-game-shudu .sudoku-grid {
  width: min(58svh, 520px, 100%) !important;
  max-width: min(58svh, 520px, 100%) !important;
  border: 2px solid var(--dg-accent) !important;
  border-radius: var(--dg-radius) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.3),
    inset 1px 0 0 var(--dg-rim-pink),
    inset -1px 0 0 rgba(66, 214, 255, 0.2),
    var(--dg-shadow-soft) !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.16), transparent 48%),
    color-mix(in srgb, var(--dg-accent) 32%, var(--dg-board)) !important;
}

body.dg-game-shudu .cell {
  color: var(--dg-text) !important;
  background: var(--dg-canvas) !important;
  border-color: var(--dg-line) !important;
  font-weight: 700 !important;
}

body.dg-game-shudu .cell.fixed {
  color: var(--dg-accent) !important;
  background: color-mix(in srgb, var(--dg-accent) 10%, var(--dg-canvas)) !important;
}

body.dg-game-shudu .cell.highlighted {
  background: color-mix(in srgb, var(--dg-accent) 14%, var(--dg-canvas)) !important;
}

body.dg-game-shudu .cell.selected {
  background: color-mix(in srgb, var(--dg-accent-2) 16%, var(--dg-canvas)) !important;
  box-shadow: inset 0 0 0 2px var(--dg-accent-2);
}

body.dg-game-shudu .cell.error {
  color: var(--dg-danger) !important;
}

body.dg-game-shudu .cell.correct {
  color: var(--dg-success) !important;
}

body.dg-game-shudu .number-selector {
  grid-template-columns: repeat(10, minmax(36px, 1fr)) !important;
  max-width: min(100%, 560px) !important;
  gap: 8px !important;
}

body.dg-game-shudu .number-btn {
  height: 44px !important;
  min-height: 44px !important;
  aspect-ratio: auto !important;
  color: var(--dg-primary-text) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.24), transparent 44%),
    linear-gradient(135deg, var(--dg-accent), color-mix(in srgb, var(--dg-accent) 62%, #0b4e86)) !important;
}

body.dg-game-shudu .number-btn.clear {
  color: #fff !important;
  background: var(--dg-danger) !important;
}

body.dg-game-shudu .actions {
  gap: 10px !important;
}

body.dg-game-shudu .history-btn {
  position: static !important;
  justify-self: end;
  border-radius: var(--dg-radius) !important;
}

body.dg-game-shudu .result-stats,
body.dg-game-shudu .result-grid,
body.dg-game-shudu .history-list {
  background: var(--dg-surface-soft) !important;
  border: 1px solid var(--dg-line);
  border-radius: var(--dg-radius) !important;
}

body.dg-game-shudu .result-cell {
  color: var(--dg-text) !important;
  background: var(--dg-canvas) !important;
}

/* Dank rhythm game. */
body.dg-game-dank {
  min-height: 100svh;
  overflow: hidden;
}

body.dg-game-dank #gameBody {
  width: min(100vw, 680px) !important;
  max-width: 680px;
  min-height: 100svh;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.3), transparent 44%, rgba(66, 214, 255, 0.08)),
    color-mix(in srgb, var(--dg-surface) 52%, transparent);
  border-inline: 1px solid var(--dg-line);
  box-shadow:
    inset 1px 0 0 var(--dg-rim-pink),
    inset -1px 0 0 rgba(66, 214, 255, 0.22),
    var(--dg-shadow);
  -webkit-backdrop-filter: blur(18px) saturate(1.2);
  backdrop-filter: blur(18px) saturate(1.2);
}

body.dg-game-dank #GameLayerBG {
  background: color-mix(in srgb, var(--dg-canvas) 64%, transparent) !important;
}

body.dg-game-dank .block {
  border: 1px solid var(--dg-line);
  border-radius: var(--dg-radius) !important;
  background-color: var(--dg-canvas) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.26),
    inset 1px 0 0 rgba(255, 92, 150, 0.08),
    inset -1px 0 0 rgba(66, 214, 255, 0.14),
    var(--dg-shadow-soft) !important;
}

body.dg-game-dank .t1,
body.dg-game-dank .t2,
body.dg-game-dank .t3,
body.dg-game-dank .t4,
body.dg-game-dank .t5 {
  border: 1px solid color-mix(in srgb, var(--dg-accent) 54%, var(--dg-line));
  box-shadow: 0 12px 26px color-mix(in srgb, var(--dg-accent) 16%, transparent) !important;
}

body.dg-game-dank .tt1,
body.dg-game-dank .tt2,
body.dg-game-dank .tt3,
body.dg-game-dank .tt4,
body.dg-game-dank .tt5 {
  border: 1px solid color-mix(in srgb, var(--dg-warm) 58%, var(--dg-line));
  box-shadow: 0 12px 26px color-mix(in srgb, var(--dg-warm) 18%, transparent) !important;
}

body.dg-game-dank .bad {
  background-color: var(--dg-danger) !important;
}

body.dg-game-dank #GameTimeLayer {
  top: max(14px, env(safe-area-inset-top)) !important;
  color: var(--dg-text) !important;
  font-size: clamp(28px, 8vw, 58px) !important;
  font-weight: 900;
  text-shadow: none !important;
}

body.dg-game-dank #welcome {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10000 !important;
  display: grid;
  place-items: center;
  background: var(--dg-backdrop) !important;
  overflow: hidden !important;
  padding: clamp(10px, 2.2vw, 22px);
  -webkit-backdrop-filter: blur(14px) saturate(1.08);
  backdrop-filter: blur(14px) saturate(1.08);
}

@media (max-width: 520px) {
  .dg-game-toolbar {
    top: auto;
    right: max(10px, env(safe-area-inset-right));
    bottom: max(10px, env(safe-area-inset-bottom));
    gap: 6px;
    padding: 6px;
    transform-origin: 100% 100%;
  }

  .dg-toolbar-button {
    min-width: 46px !important;
    width: auto !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 9px !important;
    font-size: 12px !important;
  }

  body.dg-game-shell {
    padding-bottom: 74px !important;
  }

  body.dg-game-dank {
    padding-bottom: 0 !important;
  }
}

body.dg-game-dank #welcome[style*="display: block"],
body.dg-game-dank #welcome[style*="display:block"] {
  display: grid !important;
  place-items: center !important;
}

body.dg-game-dank #welcome > .FILL.BOX-M {
  position: static !important;
  display: grid !important;
  width: min(940px, calc(100vw - 24px));
  max-height: calc(100svh - 24px);
  padding: clamp(14px, 2.5vw, 22px);
  overflow: auto;
  color: var(--dg-text);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.42), transparent 48%, rgba(66, 214, 255, 0.08)),
    var(--dg-surface-strong);
  border: 1px solid var(--dg-line-strong);
  border-radius: var(--dg-radius);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.42),
    inset 1px 0 0 var(--dg-rim-pink),
    inset -1px 0 0 rgba(66, 214, 255, 0.22),
    var(--dg-shadow);
}

body.dg-game-dank #welcome > .FILL.BOX-M > div {
  width: 100%;
  margin: 0 auto !important;
  display: grid;
  grid-template-columns: minmax(240px, 0.92fr) minmax(280px, 1.08fr);
  grid-template-areas:
    "title actions"
    "preview actions"
    "presets presets"
    "settings settings";
  align-items: stretch;
  gap: 12px;
  text-align: left;
}

body.dg-game-dank .dg-dank-title-stack,
body.dg-game-dank .dg-dank-menu-body,
body.dg-game-dank .dg-dank-presets {
  width: 100%;
  display: grid;
  gap: 10px;
}

body.dg-game-dank .dg-dank-title-stack {
  grid-area: title;
  align-content: end;
  padding: clamp(14px, 2vw, 20px);
  background:
    radial-gradient(circle at var(--dg-glint-x) var(--dg-glint-y), color-mix(in srgb, var(--dg-control-glint) 70%, transparent), transparent 44%),
    color-mix(in srgb, var(--dg-surface-soft) 72%, transparent);
  border: 1px solid color-mix(in srgb, var(--dg-line) 82%, transparent);
  border-radius: var(--dg-radius);
}

body.dg-game-dank .dg-dank-title-stack[style*="display: block"],
body.dg-game-dank .dg-dank-menu-body[style*="display: block"] {
  display: grid !important;
}

body.dg-game-dank #tt[style*="display: none"],
body.dg-game-dank #tt[style*="display:none"],
body.dg-game-dank #ttt[style*="display: none"],
body.dg-game-dank #ttt[style*="display:none"],
body.dg-game-dank #btn_group[style*="display: none"],
body.dg-game-dank #btn_group[style*="display:none"],
body.dg-game-dank #btn_group2[style*="display: none"],
body.dg-game-dank #btn_group2[style*="display:none"] {
  display: none !important;
}

body.dg-game-dank .dg-dank-menu-body {
  grid-area: preview;
  align-content: stretch;
  padding: 12px;
  background: color-mix(in srgb, var(--dg-surface-soft) 66%, transparent);
  border: 1px solid color-mix(in srgb, var(--dg-line) 72%, transparent);
  border-radius: var(--dg-radius);
}

body.dg-game-dank .dg-dank-lane-preview {
  min-height: clamp(132px, 24svh, 210px);
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

body.dg-game-dank .dg-dank-lane {
  position: relative;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--dg-rim) 42%, var(--dg-line));
  border-radius: var(--dg-radius);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--dg-accent) 20%, transparent), transparent 46%),
    color-mix(in srgb, var(--dg-control) 70%, transparent);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.26),
    inset 0 -18px 34px rgba(0, 0, 0, 0.12);
}

body.dg-game-dank .dg-dank-lane::before,
body.dg-game-dank .dg-dank-lane::after {
  content: "";
  position: absolute;
  left: 50%;
  width: 28px;
  height: 20px;
  border-radius: 7px;
  transform: translateX(-50%);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.52), transparent 42%),
    color-mix(in srgb, var(--dg-accent-2) 46%, var(--dg-accent));
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.16);
  animation: dgDankFoodDrop 1.9s linear infinite;
}

body.dg-game-dank .dg-dank-lane::after {
  width: 22px;
  height: 16px;
  animation-delay: -0.92s;
  opacity: 0.72;
}

body.dg-game-dank .dg-dank-lane:nth-child(2)::before {
  animation-delay: -0.32s;
}

body.dg-game-dank .dg-dank-lane:nth-child(3)::before {
  animation-delay: -0.68s;
}

body.dg-game-dank .dg-dank-lane:nth-child(4)::before {
  animation-delay: -1.08s;
}

body.dg-game-dank .dg-dank-lane b {
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: 8px;
  display: grid;
  place-items: center;
  height: 30px;
  color: var(--dg-primary-text);
  background: linear-gradient(135deg, var(--dg-accent), color-mix(in srgb, var(--dg-accent) 62%, #0b4e86));
  border-radius: var(--dg-radius-sm);
  font-size: 16px;
  font-weight: 900;
}

body.dg-game-dank .dg-dank-hint-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

body.dg-game-dank .dg-dank-hint-strip span,
body.dg-game-dank .dg-dank-notice {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 9px;
  color: var(--dg-muted) !important;
  background: color-mix(in srgb, var(--dg-control) 58%, transparent);
  border: 1px solid color-mix(in srgb, var(--dg-line) 76%, transparent);
  border-radius: var(--dg-radius-sm);
  font-size: clamp(12px, 1.5vw, 13px) !important;
  font-weight: 800;
  line-height: 1.2 !important;
}

body.dg-game-dank .welcome-bg {
  opacity: 0.12 !important;
  filter: saturate(0.8) contrast(0.92);
}

body.dg-game-dank .eattxt,
body.dg-game-dank .eattxtb,
body.dg-game-dank .eattxtbt,
body.dg-game-dank .text {
  color: var(--dg-text) !important;
  letter-spacing: 0;
}

body.dg-game-dank .dg-dank-title {
  width: 100%;
  margin: 0 !important;
  font-size: clamp(28px, 5.4vw, 48px) !important;
  font-weight: 900;
  line-height: 1.02 !important;
}

body.dg-game-dank .dg-dank-kicker {
  margin: 0 !important;
  color: var(--dg-accent) !important;
  font-size: clamp(13px, 2vw, 16px) !important;
  font-weight: 800;
  line-height: 1.35 !important;
}

body.dg-game-dank #tttt,
body.dg-game-dank .dg-dank-notice,
body.dg-game-dank .dg-dank-instructions {
  width: auto;
  margin: 0 auto !important;
  color: var(--dg-muted) !important;
  font-size: clamp(12px, 1.5vw, 13px) !important;
  line-height: 1.25 !important;
}

body.dg-game-dank .dg-dank-notice {
  color: var(--dg-accent-2) !important;
  font-weight: 800;
}

body.dg-game-dank #GameScoreLayer span[style*="color"],
body.dg-game-dank #welcome span[style*="color"] {
  color: var(--dg-accent-2) !important;
}

body.dg-game-dank #btn_group,
body.dg-game-dank #btn_group2,
body.dg-game-dank #setting1,
body.dg-game-dank #setting2 {
  width: 100%;
  margin-top: 0;
}

body.dg-game-dank #btn_group {
  grid-area: actions;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: stretch;
  gap: 10px;
}

body.dg-game-dank #btn_group2 {
  grid-area: presets;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

body.dg-game-dank #btn_group br,
body.dg-game-dank #btn_group2 br {
  display: none;
}

body.dg-game-dank #btn_group2 h2 {
  grid-column: 1 / -1;
  margin: 0 !important;
  color: var(--dg-muted) !important;
  font-size: clamp(12px, 1.7vw, 14px) !important;
  line-height: 1.2 !important;
}

body.dg-game-dank #setting1,
body.dg-game-dank #setting2 {
  grid-area: settings;
  display: grid;
  justify-items: center;
  gap: 10px;
  padding: 12px;
  background: color-mix(in srgb, var(--dg-surface-soft) 66%, transparent);
  border: 1px solid color-mix(in srgb, var(--dg-line) 72%, transparent);
  border-radius: var(--dg-radius);
}

body.dg-game-dank #setting1[style*="display: none"],
body.dg-game-dank #setting1[style*="display:none"],
body.dg-game-dank #setting2[style*="display: none"],
body.dg-game-dank #setting2[style*="display:none"] {
  display: none !important;
}

body.dg-game-dank #setting1[style*="display: block"],
body.dg-game-dank #setting1[style*="display:block"],
body.dg-game-dank #setting2[style*="display: block"],
body.dg-game-dank #setting2[style*="display:block"] {
  display: grid !important;
}

body.dg-game-dank #setting1 h3,
body.dg-game-dank #setting2 h3 {
  width: min(100%, 560px);
  margin: 0 !important;
  color: var(--dg-muted) !important;
  font-size: clamp(13px, 2vw, 16px) !important;
  line-height: 1.65 !important;
}

body.dg-game-dank .eatbutton,
body.dg-game-dank .jsbutton,
body.dg-game-dank .eatfile,
body.dg-game-dank .eatinput {
  border: 1px solid color-mix(in srgb, var(--dg-rim) var(--dg-light-strength), var(--dg-line)) !important;
  border-radius: var(--dg-radius) !important;
  color: var(--dg-text) !important;
  background:
    radial-gradient(circle at var(--dg-glint-x) var(--dg-glint-y), var(--dg-control-glint), transparent 42%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.36), transparent 52%),
    var(--dg-control) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.28),
    inset 1px 0 0 color-mix(in srgb, var(--dg-rim-pink) var(--dg-light-strength), transparent),
    inset -1px 0 0 color-mix(in srgb, var(--dg-rim) var(--dg-light-strength), transparent),
    0 14px 32px rgba(0, 0, 0, 0.18) !important;
}

body.dg-game-dank .eatbutton,
body.dg-game-dank .jsbutton {
  min-width: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 12px !important;
}

body.dg-game-dank #btn_group .eatbutton,
body.dg-game-dank #btn_group2 .eatbutton {
  min-height: 46px;
}

body.dg-game-dank #btn_group .eatbutton[onclick*="foreach"] {
  grid-column: 1 / -1;
  min-height: 36px;
  font-size: 12px !important;
}

body.dg-game-dank .eatinput {
  width: min(100%, 360px) !important;
  text-align: center !important;
}

body.dg-game-dank .eatfile {
  width: min(100%, 280px) !important;
  display: grid !important;
  place-items: center;
}

body.dg-game-dank #ready-btn,
body.dg-game-dank .jsbutton {
  color: var(--dg-primary-text) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.22), transparent 44%),
    linear-gradient(135deg, var(--dg-accent), color-mix(in srgb, var(--dg-accent) 62%, #0b4e86)) !important;
}

body.dg-game-dank #ready-btn {
  grid-column: 1 / -1;
  min-height: 68px !important;
  font-size: clamp(17px, 2.4vw, 22px) !important;
}

body.dg-game-dank .zantin {
  top: max(8px, env(safe-area-inset-top)) !important;
  width: auto !important;
  height: auto !important;
}

body.dg-game-dank input[type="checkbox"] + label::before {
  width: 22px !important;
  height: 22px !important;
  border: 1px solid var(--dg-line);
  border-radius: var(--dg-radius-sm) !important;
  background: var(--dg-control) !important;
  box-shadow: none !important;
}

body.dg-game-dank input[type="checkbox"]:checked + label::before {
  background: var(--dg-accent) !important;
}

@media (max-width: 780px), (max-height: 680px) {
  body.dg-game-dank #welcome > .FILL.BOX-M {
    width: min(620px, calc(100vw - 18px));
    max-height: calc(100svh - 18px);
    padding: 12px;
  }

  body.dg-game-dank #welcome > .FILL.BOX-M > div {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "title"
      "preview"
      "actions"
      "presets"
      "settings";
    gap: 9px;
  }

  body.dg-game-dank .dg-dank-title-stack {
    padding: 12px;
    text-align: center;
    justify-items: center;
  }

  body.dg-game-dank .dg-dank-lane-preview {
    min-height: clamp(92px, 24svh, 150px);
  }

  body.dg-game-dank #btn_group {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  body.dg-game-dank #btn_group2 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
  }

  body.dg-game-dank #ready-btn {
    min-height: 54px !important;
  }

  body.dg-game-dank #btn_group .eatbutton,
  body.dg-game-dank #btn_group2 .eatbutton {
    min-height: 38px;
    font-size: 12px !important;
  }
}

@media (max-width: 430px) {
  body.dg-game-dank #btn_group,
  body.dg-game-dank #btn_group2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.dg-game-dank #ready-btn,
  body.dg-game-dank #btn_group .eatbutton[onclick*="foreach"] {
    grid-column: 1 / -1;
  }

  body.dg-game-dank .dg-dank-hint-strip {
    justify-content: center;
  }
}

@media (orientation: portrait), (max-width: 780px) {
  body.dg-game-2048,
  body.dg-game-snake {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "stats"
      "board"
      "controls"
      "footer";
    align-content: start;
    padding: clamp(12px, 4vw, 22px) !important;
  }

  body.dg-game-snake {
    grid-template-areas: none;
  }

  body.dg-game-snake #gameContainer {
    width: min(92vw, 58svh, 620px) !important;
    height: min(92vw, 58svh, 620px) !important;
    justify-self: center;
  }

  body.dg-game-snake .control-panel {
    justify-self: center;
    width: min(620px, 100%) !important;
  }

  body.dg-game-2048 .score-board {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  body.dg-game-2048 .score-board > div {
    min-height: 58px;
    padding: 9px;
    font-size: 11px;
  }

  body.dg-game-2048 .score-board span {
    font-size: clamp(16px, 5vw, 22px);
  }

  body.dg-game-2048 .controls {
    grid-template-columns: 1fr 1fr;
  }

  body.dg-game-shudu .container {
    min-height: auto;
  }

  body.dg-game-shudu .number-selector {
    grid-template-columns: repeat(5, 1fr) !important;
  }

  body.dg-game-shudu .sudoku-grid {
    width: min(92vw, 56svh, 520px) !important;
    max-width: min(92vw, 56svh, 520px) !important;
  }
}

@media (orientation: landscape) and (max-height: 560px) {
  body.dg-game-2048,
  body.dg-game-snake,
  body.dg-game-shudu {
    padding: 10px !important;
    gap: 10px;
  }

  body.dg-game-2048 .score-board {
    grid-template-columns: 1fr 1fr;
  }

  body.dg-game-2048 .score-board > div {
    min-height: 50px;
  }

  body.dg-game-snake #gameContainer {
    width: min(78svh, 52vw, 600px) !important;
    height: min(78svh, 52vw, 600px) !important;
  }

  body.dg-game-shudu .container {
    min-height: auto;
    padding: 12px !important;
  }

  body.dg-game-shudu .header {
    padding-bottom: 8px;
  }

  body.dg-game-shudu .sudoku-grid {
    width: min(70svh, 430px, 100%) !important;
    max-width: min(70svh, 430px, 100%) !important;
  }
}

@media (max-width: 480px) {
  body.dg-game-shell button,
  body.dg-game-shell .btn,
  body.dg-game-shell .number-btn,
  body.dg-game-shell select,
  body.dg-game-shell input:not([type="file"]):not([type="checkbox"]):not([type="color"]) {
    min-height: 40px;
    font-size: 13px;
  }

  body.dg-game-2048 .controls {
    grid-template-columns: 1fr;
  }

  body.dg-game-2048 .score-board {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.dg-game-snake .settings > div,
  body.dg-game-snake .current-record > div {
    flex-direction: column !important;
  }

  body.dg-game-snake .settings select,
  body.dg-game-snake .settings button,
  body.dg-game-snake .current-record button {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body.dg-game-shudu .header {
    align-items: stretch !important;
  }

  body.dg-game-shudu .controls {
    flex-direction: column;
  }

  body.dg-game-shudu .difficulty-selector {
    justify-content: center;
  }

  .dg-dialog__actions {
    flex-direction: column-reverse;
  }

  .dg-dialog__actions button {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.dg-game-shell *,
  .dg-dialog,
  .dg-dialog-backdrop,
  .dg-toast,
  .dg-entry-curtain,
  .dg-entry-curtain *,
  body.dg-game-shell::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }

  body.dg-game-shell::before {
    transition: none !important;
  }
}

@media (max-width: 520px) {
  body.dg-game-2048,
  body.dg-game-snake,
  body.dg-game-shudu {
    padding-bottom: 18px !important;
  }
}

@media (max-width: 900px), (max-height: 620px) {
  .dg-game-toolbar {
    top: max(10px, env(safe-area-inset-top)) !important;
    right: max(10px, env(safe-area-inset-right)) !important;
    bottom: auto !important;
    gap: 6px;
    padding: 6px;
    transform-origin: 100% 0;
  }

  .dg-toolbar-button {
    min-width: 46px !important;
    width: auto !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 9px !important;
    font-size: 12px !important;
  }

  body.dg-game-2048,
  body.dg-game-snake,
  body.dg-game-shudu {
    padding-top: 72px !important;
  }

  body.dg-game-dank {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .dg-touch-pad {
    grid-template-columns: repeat(4, 44px);
    grid-template-rows: 44px;
    gap: 7px;
  }

  .dg-touch-pad button {
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
  }

  .dg-touch-pad [data-dir="left"] {
    grid-column: 1;
    grid-row: 1;
  }

  .dg-touch-pad [data-dir="up"] {
    grid-column: 2;
    grid-row: 1;
  }

  .dg-touch-pad [data-dir="down"] {
    grid-column: 3;
    grid-row: 1;
  }

  .dg-touch-pad [data-dir="right"] {
    grid-column: 4;
    grid-row: 1;
  }
}

@keyframes dgSurfaceFlyIn {
  0% {
    opacity: 0;
    filter: blur(18px) saturate(0.78) brightness(1.18);
    transform:
      translate3d(
        calc(var(--dg-depth-x) + var(--dg-entry-x)),
        calc(var(--dg-depth-y) + var(--dg-entry-y)),
        var(--dg-entry-z)
      )
      scale(var(--dg-entry-scale))
      rotateX(calc(var(--dg-tilt-x) + var(--dg-entry-rx)))
      rotateY(calc(var(--dg-tilt-y) + var(--dg-entry-ry)))
      rotateZ(var(--dg-entry-rz));
  }
  48% {
    opacity: 0.88;
    filter: blur(3px) saturate(1.04) brightness(1.06);
  }
  74% {
    opacity: 1;
    filter: blur(0.8px) saturate(1.08) brightness(1.02);
    transform:
      translate3d(
        calc(var(--dg-depth-x) + var(--dg-entry-over-x)),
        calc(var(--dg-depth-y) + var(--dg-entry-over-y)),
        28px
      )
      scale(1.025)
      rotateX(calc(var(--dg-tilt-x) + var(--dg-entry-over-rx)))
      rotateY(calc(var(--dg-tilt-y) + var(--dg-entry-over-ry)))
      rotateZ(var(--dg-entry-over-rz));
  }
  100% {
    opacity: 1;
    filter: blur(0);
    transform:
      translate3d(var(--dg-depth-x), var(--dg-depth-y), 0)
      scale(1)
      rotateX(var(--dg-tilt-x))
      rotateY(var(--dg-tilt-y))
      rotateZ(0deg);
  }
}

@keyframes dgToolbarIn {
  0% {
    opacity: 0;
    transform: translateY(-8px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes dgShardFloat {
  0% {
    translate: calc(var(--dg-shard-float-x, 0.8vmax) * -1) calc(var(--dg-shard-float-y, 0.4vmax) * 0.6);
  }
  100% {
    translate: var(--dg-shard-float-x, 0.8vmax) calc(var(--dg-shard-float-y, 0.4vmax) * -1);
  }
}

@keyframes dgDankFoodDrop {
  0% {
    top: -28px;
    opacity: 0;
    scale: 0.9;
  }
  14% {
    opacity: 1;
  }
  82% {
    opacity: 1;
  }
  100% {
    top: calc(100% - 52px);
    opacity: 0;
    scale: 1.04;
  }
}

@keyframes dgLightGate {
  0% {
    opacity: 1;
    transform: scaleX(1);
    filter: brightness(1);
  }
  42% {
    opacity: 1;
    transform: scaleX(0.96);
    filter: brightness(1.08);
  }
  72% {
    opacity: 0.72;
    transform: scaleX(1.08);
    filter: brightness(1.18) blur(1px);
  }
  100% {
    visibility: hidden;
    opacity: 0;
    transform: scaleX(1.18);
    filter: brightness(1.08) blur(2px);
  }
}

@keyframes dgWorldReveal {
  0% {
    opacity: 0;
    filter: blur(12px) saturate(0.72) brightness(0.92);
  }
  46% {
    opacity: 0.34;
    filter: blur(7px) saturate(0.9) brightness(0.98);
  }
  100% {
    opacity: var(--dg-world-reveal-opacity, 0.96);
    filter: blur(0) saturate(1.16) contrast(1.04);
  }
}

@keyframes dgCurtainShellReveal {
  0% {
    opacity: 1;
    filter: brightness(1.08) saturate(1);
  }
  26% {
    opacity: 1;
    filter: brightness(1.02) saturate(0.96);
  }
  48% {
    opacity: 0.84;
    filter: brightness(0.96) saturate(0.9);
  }
  72% {
    opacity: 0.38;
    filter: brightness(0.9) saturate(0.86);
  }
  100% {
    opacity: 0;
    filter: brightness(0.82) saturate(0.78);
  }
}

@keyframes dgCurtainWhiteLift {
  0% {
    opacity: 1;
  }
  34% {
    opacity: 1;
  }
  66% {
    opacity: 0.68;
  }
  100% {
    opacity: 0;
  }
}

@keyframes dgCurtainEnterLeft {
  0% {
    opacity: 1;
    transform: translateX(0) rotateY(0deg) scale(1);
  }
  42% {
    opacity: 1;
    transform: translateX(-8%) rotateY(-3deg) scale(1.01);
  }
  100% {
    opacity: 0;
    transform: translateX(-108%) rotateY(-18deg) scale(1.05);
  }
}

@keyframes dgCurtainEnterRight {
  0% {
    opacity: 1;
    transform: translateX(0) rotateY(0deg) scale(1);
  }
  42% {
    opacity: 1;
    transform: translateX(8%) rotateY(3deg) scale(1.01);
  }
  100% {
    opacity: 0;
    transform: translateX(108%) rotateY(18deg) scale(1.05);
  }
}

@keyframes dgCurtainTunnel {
  0% {
    opacity: 0;
    transform: scale(0.62);
  }
  28% {
    opacity: 0.98;
    transform: scale(0.88);
  }
  72% {
    opacity: 0.78;
    transform: scale(1.72);
  }
  100% {
    opacity: 0;
    transform: scale(2.65);
  }
}

@keyframes dgCurtainFlare {
  0% {
    opacity: 0;
    transform: scaleX(0.26);
  }
  28% {
    opacity: 0.88;
    transform: scaleX(0.74);
  }
  68% {
    opacity: 0.74;
    transform: scaleX(1.24);
  }
  100% {
    opacity: 0;
    transform: scaleX(1.72);
  }
}

@keyframes dgCurtainGrain {
  0% {
    opacity: 0.36;
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    opacity: 0;
    transform: translate3d(0, -28px, 0) scale(1.04);
  }
}

@keyframes dgCurtainExitWhite {
  0% {
    opacity: 0;
  }
  58% {
    opacity: 0.62;
  }
  100% {
    opacity: 1;
  }
}

@keyframes dgCurtainExitLeft {
  0% {
    opacity: 0;
    transform: translateX(-108%) rotateY(-18deg) scale(1.04);
  }
  34% {
    opacity: 0.92;
  }
  76% {
    opacity: 1;
    transform: translateX(0) rotateY(0deg) scale(1);
  }
  100% {
    opacity: 0;
    transform: translateX(0) rotateY(0deg) scale(1.01);
  }
}

@keyframes dgCurtainExitRight {
  0% {
    opacity: 0;
    transform: translateX(108%) rotateY(18deg) scale(1.04);
  }
  34% {
    opacity: 0.92;
  }
  76% {
    opacity: 1;
    transform: translateX(0) rotateY(0deg) scale(1);
  }
  100% {
    opacity: 0;
    transform: translateX(0) rotateY(0deg) scale(1.01);
  }
}

@keyframes dgCurtainExitFlare {
  0% {
    opacity: 0;
    transform: scaleX(0.28);
  }
  54% {
    opacity: 0.84;
    transform: scaleX(1.06);
  }
  100% {
    opacity: 0;
    transform: scaleX(1.7);
  }
}

@keyframes dgModalIn {
  0% {
    opacity: 0;
    transform: translateY(10px) scale(0.98);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes dgThemeSwitch {
  0% {
    filter: brightness(1);
  }
  50% {
    filter: brightness(1.04);
  }
  100% {
    filter: brightness(1);
  }
}

@keyframes dgSoftSheen {
  0% {
    background-position: 140% 50%;
  }
  100% {
    background-position: -40% 50%;
  }
}

@keyframes dgTileSettle {
  0% {
    transform: scale(0.94);
  }
  100% {
    transform: scale(1);
  }
}
body.dg-game-shell[data-dg-theme="dark"] .dg-entry-curtain:not(.dg-entry-curtain--exit) {
  background:
    radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--dg-curtain-beam) 18%, transparent), transparent 38%),
    var(--dg-curtain-solid);
}