/* DEEPMINE UI v4 — base element styles. */
@layer base {
  *, *::before, *::after { box-sizing: border-box; }
  html {
    height: 100%;
    background: var(--bg-0);
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
  }
  body {
    margin: 0;
    min-height: 100%;
    background: var(--bg-0);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-14);
    line-height: var(--lh-body);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overscroll-behavior: none;
    font-synthesis-weight: none;
  }
  h1, h2, h3, h4, h5, p, ul, ol, dl, dd, figure, blockquote { margin: 0; }
  ul, ol { padding: 0; list-style: none; }
  h1, h2, h3, h4 { font-weight: 700; line-height: var(--lh-tight); color: var(--text-1); letter-spacing: 0; }
  small { font-size: var(--fs-12); }
  b, strong { font-weight: 700; }
  strong, b, output, .num { font-variant-numeric: tabular-nums; }
  img, svg { display: block; max-width: 100%; }
  img { -webkit-user-drag: none; user-select: none; }
  a { color: var(--gold-200); text-decoration-color: rgb(246 214 143 / .4); text-underline-offset: 3px; }

  button, input, select, textarea { font: inherit; color: inherit; letter-spacing: inherit; }
  button {
    margin: 0;
    border: 0;
    padding: 0;
    background: none;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-user-select: none;
    user-select: none;
  }
  button:disabled { cursor: not-allowed; }
  input, select, textarea { min-width: 0; }
  :focus { outline: none; }
  :focus-visible { outline: 2px solid var(--gold-200); outline-offset: 2px; border-radius: 8px; }
  ::selection { background: rgb(245 200 105 / .35); color: var(--text-1); }

  [hidden]:not(#loading) { display: none !important; }
  .visually-hidden {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
  }

  /* Icons: Lucide line icons (icons.mjs) and the project game glyphs (ui/game-icons.mjs). */
  .icon { width: 18px; height: 18px; flex: none; }
  .currency-icon { flex: none; }
  .gi { width: 24px; height: 24px; flex: none; overflow: visible; }
  .gi .g-line { fill: var(--gi-line, #1a1206); }
  .gi .g-base { fill: var(--gi-base, var(--gold-300)); }
  .gi .g-shade { fill: var(--gi-shade, var(--gold-700)); }
  .gi .g-light { fill: var(--gi-light, var(--gold-50)); }
  .gi .g-wood { fill: var(--gi-wood, #9a6236); }
  .gi .g-wood-shade { fill: var(--gi-wood-shade, #6b3e1f); }
  .gi .g-metal { fill: var(--gi-metal, #d8e0dc); }
  .gi .g-metal-shade { fill: var(--gi-metal-shade, #8d9b96); }
  .gi .g-accent { fill: var(--gi-accent, var(--jade-300)); }
  .gi .g-accent-shade { fill: var(--gi-accent-shade, var(--jade-500)); }
  .gi .g-glow { fill: var(--gi-glow, #fff3c4); }
  .gi .g-stroke { fill: none; stroke: var(--gi-line, #1a1206); stroke-linecap: round; stroke-linejoin: round; }

  /* Scrollbars stay unobtrusive on desktop previews. */
  * { scrollbar-width: thin; scrollbar-color: rgb(206 228 196 / .18) transparent; }
  ::-webkit-scrollbar { width: 6px; height: 6px; }
  ::-webkit-scrollbar-thumb { background: rgb(206 228 196 / .18); border-radius: 6px; }
  ::-webkit-scrollbar-track { background: transparent; }

  @keyframes dm-spin { to { transform: rotate(360deg); } }
  @keyframes dm-fade-up { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
  @keyframes dm-pop { 0% { transform: scale(.92); } 60% { transform: scale(1.04); } 100% { transform: scale(1); } }
  @keyframes dm-shine { from { transform: translateX(-120%) skewX(-18deg); } to { transform: translateX(260%) skewX(-18deg); } }
  @keyframes dm-pulse-ring { 0% { transform: scale(.9); opacity: .65; } 100% { transform: scale(1.45); opacity: 0; } }
  @keyframes dm-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-2px); } }
  @keyframes dm-glint { 0%, 70%, 100% { opacity: 0; } 80% { opacity: 1; } }

  /* Reduced motion: the in-game toggle sets html.reduce-motion; the OS preference is honoured too. */
  html.reduce-motion *, html.reduce-motion *::before, html.reduce-motion *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
    scroll-behavior: auto !important;
  }
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
      animation-duration: 1ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 1ms !important;
      scroll-behavior: auto !important;
    }
  }
}

@layer base {
  .gi .o { stroke: var(--gi-line, #1a1206); stroke-width: 2px; paint-order: stroke fill; stroke-linejoin: round; stroke-linecap: round; }
}

@layer base {
  img.painted-art { object-fit: contain; }
}