/* Stardew-inspired 16-bit theme: banded summer sky, parchment panels,
   chunky wood borders, gold lettering, hard pixel shadows. */
:root {
  /* wood + paper */
  --outline: #3d1f08;
  --wood-dark: #5b2b0a;
  --wood: #8a5226;
  --wood-light: #b4762f;
  --paper: #ffe9b3;
  --paper-light: #fff3d1;
  --paper-dark: #f2c66f;
  --bevel: #d99c52;

  /* ink on paper */
  --ink: #4a2507;
  --ink-soft: #8a5a2b;
  --ink-on-wood: #ffe9b3;

  /* vivid SNES accents */
  --gold: #ffc400;
  --gold-light: #ffd95e;
  --sun: #ffc400;
  --red: #e8482c;
  --green: #52a821;
  --green-bright: #6fce2e;
  --mint: #2e9e58;
  --sky: #3f9bd8;
  --sky-light: #7ec0fa;
  --grape: #8a5fd0;
  --pink: #e8559b;
  --pink-deep: #c23579;

  /* legacy aliases — anything not re-skinned still lands on-palette */
  --bg-deep: #2e6da8;
  --bg-mid: #5fb9ef;
  --glass: rgba(91, 43, 10, 0.07);
  --glass-2: rgba(91, 43, 10, 0.12);
  --glass-line: rgba(91, 43, 10, 0.4);

  --slot-h: 15px;
  --radius: 8px;
  --font: "VT323", "Courier New", ui-monospace, monospace;
  --font-pixel: "Press Start 2P", "Courier New", ui-monospace, monospace;

  /* hard-edged pixel shadows (no blur anywhere) */
  --px-shadow: 0 6px 0 rgba(46, 21, 5, 0.35);
  --px-text: 2px 2px 0 rgba(46, 21, 5, 0.45);
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  height: 100%;
}

body {
  font-family: var(--font);
  font-size: 18px;
  color: var(--ink);
  overflow: auto;
  /* pixelized office wallpaper: dusty sage with a half-drop pixel-damask
     diamond motif and faint vertical stripe bands, tiled from an inline SVG */
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' shape-rendering='crispEdges'%3E%3Cg fill='%23fff7dd'%3E%3Cg opacity='0.20'%3E%3Crect x='10' y='2' width='4' height='4'/%3E%3Crect x='6' y='6' width='12' height='4'/%3E%3Crect x='2' y='10' width='20' height='4'/%3E%3Crect x='6' y='14' width='12' height='4'/%3E%3Crect x='10' y='18' width='4' height='4'/%3E%3C/g%3E%3Cg opacity='0.20'%3E%3Crect x='34' y='26' width='4' height='4'/%3E%3Crect x='30' y='30' width='12' height='4'/%3E%3Crect x='26' y='34' width='20' height='4'/%3E%3Crect x='30' y='38' width='12' height='4'/%3E%3Crect x='34' y='42' width='4' height='4'/%3E%3C/g%3E%3Cg opacity='0.12'%3E%3Crect x='34' y='10' width='4' height='4'/%3E%3Crect x='10' y='34' width='4' height='4'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") repeat,
    repeating-linear-gradient(90deg,
      rgba(255, 247, 221, 0.05) 0px, rgba(255, 247, 221, 0.05) 24px,
      rgba(46, 21, 5, 0.04) 24px, rgba(46, 21, 5, 0.04) 48px),
    linear-gradient(180deg, #a3b08a 0%, #97a57d 55%, #8a9970 100%);
  background-size: 96px 96px, auto, auto;
  background-attachment: fixed;
  user-select: none;
}

button {
  font-family: var(--font-pixel);
  border: 3px solid var(--wood-dark);
  cursor: pointer;
  border-radius: 6px;
  image-rendering: pixelated;
  transition: transform 0.08s, box-shadow 0.08s, filter 0.08s;
}
button:hover:not(:disabled) { filter: brightness(1.08); }
button:active:not(:disabled) { transform: translateY(3px); box-shadow: none !important; }
button:disabled { opacity: 0.45; cursor: default; }

button.primary {
  background: linear-gradient(180deg, var(--gold-light) 0%, var(--gold) 45%, #f08c1e 100%);
  color: var(--wood-dark);
  font-size: 14px;
  padding: 14px 38px;
  letter-spacing: 0.02em;
  text-shadow: 1px 1px 0 rgba(255, 243, 209, 0.6);
  box-shadow:
    0 5px 0 #8a3c0f,
    inset 0 2px 0 rgba(255, 255, 255, 0.55);
}

button.secondary {
  background: linear-gradient(180deg, var(--wood-light), var(--wood));
  color: var(--ink-on-wood);
  font-size: 11px;
  padding: 11px 22px;
  text-shadow: 1px 1px 0 rgba(46, 21, 5, 0.6);
  box-shadow:
    0 4px 0 var(--outline),
    inset 0 2px 0 rgba(255, 233, 179, 0.35);
}

h1, h2, h3 { margin: 0; }