body {
  min-height: 100vh;
  background: radial-gradient(circle at 20% 20%, #132846 0%, var(--bg) 45%, #050c16 100%);
  background-image: radial-gradient(circle at 20% 20%, #132846 0%, var(--bg) 45%, #050c16 100%), url("/public/assets/ui/bg-pattern.svg");
  background-blend-mode: normal, soft-light;
}

.shell {
  width: min(1120px, 100% - 2rem);
  margin: 2rem auto;
  display: grid;
  gap: 1rem;
}

.panel {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1rem;
  box-shadow: var(--shadow);
}

.btn {
  display: inline-block;
  border: 1px solid rgba(226, 173, 88, 0.5);
  border-radius: 999px;
  padding: 0.55rem 1rem;
  background: linear-gradient(180deg, rgba(226, 173, 88, 0.2), rgba(226, 173, 88, 0.1));
  color: var(--text);
  text-decoration: none;
  cursor: pointer;
}

.btn-primary {
  border-color: var(--gold);
  background: linear-gradient(180deg, rgba(255, 204, 130, 0.36), rgba(226, 173, 88, 0.18));
}

@media (max-width: 720px) {
  .shell {
    width: min(1120px, 100% - 1rem);
    margin: 1rem auto;
  }
}