@import "./gate-premium.css";
@import "./game-premium.css";
@import "./loot-premium.css";
@import "./player-panels.css";
:root {
  color-scheme: dark;
  --gold: #d6bb7e;
  --muted: #b3b5a8;
  --ink: #101811;
  --line: #b19b5b45;
  --panel: #141c18ec;
  font-family: Inter, system-ui, sans-serif;
  color: #f3eddb;
  font-size: 14px;
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  overflow: hidden;
  background: #121b19;
}
button,
input {
  font: inherit;
}
button {
  cursor: pointer;
  color: inherit;
  border: 1px solid var(--line);
  background: #222d26;
  border-radius: 5px;
  transition:
    background 0.15s,
    border 0.15s;
}
button:hover {
  background: #3b4637;
  border-color: #d4bc82;
}
button:disabled {
  opacity: 0.55;
  cursor: wait;
}
input {
  width: 100%;
  background: #101711a8;
  border: 1px solid #b9a97040;
  border-radius: 4px;
  color: #f5f0e3;
  padding: 12px;
  outline: none;
}
input:focus {
  border-color: var(--gold);
}
[hidden] {
  display: none !important;
}
#world {
  display: block;
  width: 100vw;
  height: 100dvh;
  touch-action: none;
  user-select: none;
}
#world.camera-dragging {
  cursor: grabbing;
}
.panel {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 6px;
  box-shadow: 0 8px 28px #0005;
  backdrop-filter: blur(12px);
}
.crest {
  width: 58px;
  height: 65px;
  display: grid;
  place-items: center;
  border: 1px solid #c4b06f;
  border-radius: 22px 22px 26px 26px;
  font: 46px Georgia;
  color: var(--gold);
  background: linear-gradient(140deg, #485342, #1b2923);
  box-shadow: inset 0 0 0 4px #18211c;
}