:root {
  color-scheme: dark;
  --bg: #070811;
  --panel: rgba(18,20,36,.86);
  --text: #f6f7ff;
  --muted: #9ba2bd;
  --line: rgba(255,255,255,.1);
  --blue: #5d7cff;
  --cyan: #4be8ff;
  --pink: #ff4faa;
  --gold: #ffd166;
  --danger: #ff6b7a;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  background:
    radial-gradient(circle at 15% -10%, rgba(93,124,255,.22), transparent 34rem),
    radial-gradient(circle at 105% 10%, rgba(255,79,170,.15), transparent 30rem),
    var(--bg);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .16;
  background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 32px 32px;
  mask-image: linear-gradient(to bottom, black, transparent 75%);
}
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { color: inherit; cursor: pointer; }
.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 22px;
  min-height: 68px;
  padding: 0 max(18px, calc((100vw - 1120px) / 2));
  border-bottom: 1px solid var(--line);
  background: rgba(7,8,17,.78);
  backdrop-filter: blur(18px);
}
.brand { font-size: 22px; font-weight: 950; letter-spacing: -.06em; }
.brand span { font-weight: 400; }
nav { display: flex; align-self: stretch; gap: 24px; }
nav a { display: grid; place-items: center; border-bottom: 2px solid transparent; color: var(--muted); font-size: 14px; font-weight: 750; }
nav a:hover, nav a.current { color: var(--text); }
nav a.current { border-color: var(--cyan); }
.account { display: flex; justify-content: flex-end; align-items: center; gap: 12px; }
.account form { margin: 0; }
.admin-badge { padding: 7px 10px; border-radius: 999px; background: rgba(75,232,255,.1); color: var(--cyan); font-size: 11px; font-weight: 850; text-transform: uppercase; letter-spacing: .07em; }
.login-link, .text-button { border: 0; background: none; color: var(--muted); font-size: 14px; }
.login-link:hover, .text-button:hover { color: var(--text); }
.shell { position: relative; width: min(1120px, calc(100% - 32px)); margin: 0 auto; padding: 54px 0 70px; }
.hero { display: grid; grid-template-columns: 1.15fr .85fr; gap: 28px; align-items: end; margin-bottom: 34px; }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; margin-bottom: 18px; color: var(--cyan); font-size: 12px; font-weight: 850; letter-spacing: .18em; text-transform: uppercase; }
.eyebrow::before { content:""; width:8px; height:8px; border-radius:50%; background:currentColor; box-shadow:0 0 18px currentColor; }
h1 { margin:0; font-size:clamp(58px,9vw,112px); line-height:.83; letter-spacing:-.075em; }
h1 .sony { font-weight:350; }
h1 .fight { font-weight:950; color:transparent; -webkit-text-stroke:2px var(--text); text-shadow:6px 7px 0 rgba(93,124,255,.9),11px 12px 0 rgba(255,79,170,.42); }
.tagline { max-width:560px; margin:28px 0 0; color:var(--muted); font-size:clamp(16px,2vw,20px); line-height:1.55; }
.total-card { position:relative; overflow:hidden; padding:26px; border:1px solid var(--line); border-radius:22px; background:linear-gradient(145deg,rgba(93,124,255,.17),rgba(18,20,36,.82) 45%,rgba(255,79,170,.12)); box-shadow:0 28px 80px rgba(0,0,0,.28); }
.total-card::after { content:"₽"; position:absolute; right:-18px; bottom:-56px; color:rgba(255,255,255,.045); font-size:190px; font-weight:950; transform:rotate(-8deg); }
.total-label,.panel-kicker { color:var(--muted); font-size:12px; font-weight:850; letter-spacing:.12em; text-transform:uppercase; }
.total-value { position:relative; z-index:1; margin-top:8px; font-size:clamp(38px,5vw,62px); font-weight:900; letter-spacing:-.055em; }
.total-meta { position:relative; z-index:1; display:flex; gap:18px; margin-top:22px; color:var(--muted); font-size:13px; }
.total-meta strong { color:var(--text); }
.admin-panel { display:grid; grid-template-columns:.7fr 1.3fr; gap:28px; align-items:end; margin:0 0 22px; padding:24px; border:1px solid rgba(75,232,255,.2); border-radius:20px; background:linear-gradient(120deg,rgba(75,232,255,.08),rgba(93,124,255,.08)); }
.admin-panel h2 { margin:7px 0 0; font-size:25px; }
.add-game-form { display:grid; grid-template-columns:1fr 160px auto; gap:10px; align-items:end; }
label span { display:block; margin:0 0 7px 2px; color:var(--muted); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
input { width:100%; min-height:48px; padding:0 14px; border:1px solid transparent; border-radius:12px; outline:none; background:rgba(255,255,255,.06); color:var(--text); }
input:focus { border-color:rgba(75,232,255,.55); background:rgba(255,255,255,.085); }
.primary-button,.donate-button,.search-button { min-height:48px; padding:0 18px; border:0; border-radius:12px; background:linear-gradient(135deg,var(--blue),#7c5dff); color:white; font-weight:850; white-space:nowrap; }
.toolbar { position:sticky; top:80px; z-index:10; display:grid; grid-template-columns:minmax(220px,1fr) auto; gap:10px; margin-bottom:16px; padding:10px; border:1px solid var(--line); border-radius:18px; background:rgba(10,11,21,.88); backdrop-filter:blur(18px); }
.search-wrap { position:relative; }
.search-wrap::before { content:"⌕"; position:absolute; left:15px; top:50%; transform:translateY(-54%); color:var(--muted); font-size:24px; }
.search-wrap input { padding-left:43px; }
.filters { display:flex; gap:6px; }
.filters a { display:grid; place-items:center; min-height:48px; padding:0 16px; border:1px solid transparent; border-radius:12px; color:var(--muted); white-space:nowrap; }
.filters a:hover { color:var(--text); background:rgba(255,255,255,.05); }
.filters a.active { color:white; border-color:rgba(93,124,255,.45); background:rgba(93,124,255,.22); }
.list { display:grid; gap:9px; }
.game { display:grid; grid-template-columns:56px minmax(0,1fr) auto; gap:16px; align-items:center; min-height:86px; padding:13px 20px 13px 13px; border:1px solid var(--line); border-radius:17px; background:var(--panel); transition:transform .18s,border-color .18s; }
.game:hover { transform:translateY(-2px); border-color:rgba(93,124,255,.34); }
.rank { display:grid; place-items:center; width:56px; height:56px; border-radius:13px; background:rgba(255,255,255,.055); color:var(--muted); font-size:14px; font-weight:850; }
.game:nth-child(1) .rank { color:#16130a; background:linear-gradient(145deg,#fff3a6,var(--gold)); }
.game:nth-child(2) .rank { color:#17191d; background:linear-gradient(145deg,#f2f4ff,#aeb5c8); }
.game:nth-child(3) .rank { color:#21130f; background:linear-gradient(145deg,#ffc4a3,#c97e52); }
.name { font-size:clamp(15px,2vw,18px); font-weight:750; line-height:1.25; }
.status { display:inline-block; margin-top:5px; color:var(--muted); font-size:11px; font-weight:750; letter-spacing:.07em; text-transform:uppercase; }
.frozen .status { color:#aeb5c8; }
.completed .status { color:var(--cyan); }
.amount { min-width:116px; text-align:right; font-size:clamp(18px,2.4vw,24px); font-weight:900; letter-spacing:-.035em; white-space:nowrap; }
.game-admin { grid-column:2 / -1; display:grid; grid-template-columns:1fr auto auto; gap:9px; align-items:center; padding-top:12px; border-top:1px solid var(--line); }
.donation-form { display:grid; grid-template-columns:minmax(120px,220px) auto; gap:8px; }
.donation-form input { min-height:42px; }
.donate-button { min-height:42px; }
.complete-button { min-height:42px; padding:0 15px; border:1px solid rgba(255,107,122,.25); border-radius:12px; background:rgba(255,107,122,.08); color:#ff9aa5; font-weight:800; }
.complete-button:hover { background:rgba(255,107,122,.16); }
.current-button,.cover-button,.delete-button,.finish-current-button {
  display:grid;
  place-items:center;
  min-height:42px;
  padding:0 15px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:12px;
  background:rgba(255,255,255,.06);
  color:#f2f1e9;
  font-weight:800;
  white-space:nowrap;
}
.current-button:hover,.cover-button:hover { background:rgba(255,255,255,.12); }
.delete-button {
  border-color:rgba(255,107,122,.35);
  background:rgba(255,107,122,.09);
  color:#ffadb6;
}
.current-label {
  display:grid;
  place-items:center;
  min-height:42px;
  padding:0 14px;
  border:1px solid rgba(53,168,120,.35);
  border-radius:12px;
  background:rgba(53,168,120,.1);
  color:#7edbb5;
  font-size:12px;
  font-weight:850;
  text-transform:uppercase;
}
.empty { display:grid; gap:8px; padding:56px 20px; border:1px dashed var(--line); border-radius:22px; color:var(--muted); text-align:center; }
.empty strong { color:var(--text); font-size:22px; }
.compact-shell { max-width:900px; }
.page-heading { margin:30px 0 38px; }
.section-title { font-size:clamp(42px,7vw,78px); line-height:1; }
.page-heading p,.auth-card p { color:var(--muted); line-height:1.6; }
.auth-shell { position:relative; display:grid; place-items:center; min-height:calc(100vh - 68px); padding:28px 16px; }
.auth-card { width:min(480px,100%); padding:34px; border:1px solid var(--line); border-radius:24px; background:var(--panel); box-shadow:0 30px 90px rgba(0,0,0,.35); }
.auth-title { font-size:clamp(34px,6vw,52px); line-height:1; letter-spacing:-.05em; }
.auth-form { display:grid; gap:16px; margin-top:26px; }
.flash-stack { position:fixed; z-index:50; top:82px; right:18px; display:grid; gap:8px; width:min(380px,calc(100% - 36px)); }
.flash { padding:14px 16px; border:1px solid var(--line); border-radius:13px; background:#181b2d; box-shadow:0 14px 40px rgba(0,0,0,.3); }
.flash.success { border-color:rgba(75,232,255,.32); }
.flash.error { border-color:rgba(255,107,122,.35); color:#ffb4bc; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:850px) {
  .topbar { grid-template-columns:1fr auto; }
  .topbar nav { grid-row:2; grid-column:1 / -1; order:3; justify-content:center; min-height:48px; }
  .account { grid-column:2; }
  .shell { padding-top:38px; }
  .hero,.admin-panel { grid-template-columns:1fr; }
  .toolbar { top:126px; grid-template-columns:1fr; }
  .add-game-form { grid-template-columns:1fr 1fr; }
  .add-game-form .primary-button { grid-column:1 / -1; }
}
@media (max-width:560px) {
  .admin-badge { display:none; }
  .shell { width:min(100% - 22px,680px); }
  h1 { font-size:62px; }
  h1 .fight { -webkit-text-stroke-width:1px; text-shadow:4px 5px 0 rgba(93,124,255,.9),7px 8px 0 rgba(255,79,170,.42); }
  .filters { overflow-x:auto; }
  .filters a { flex:1; }
  .game { grid-template-columns:44px minmax(0,1fr); gap:11px; padding-right:13px; }
  .rank { width:44px; height:52px; }
  .amount { grid-column:2; min-width:0; text-align:left; margin-top:-6px; font-size:18px; }
  .game-admin { grid-column:1 / -1; grid-template-columns:1fr; }
  .donation-form { grid-template-columns:1fr auto; }
  .add-game-form { grid-template-columns:1fr; }
  .add-game-form .primary-button { grid-column:auto; }
  .auth-card { padding:25px; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; }
}

/* PS1-era redesign */
:root {
  --ps-gray: #b8b6aa;
  --ps-gray-light: #dad8cc;
  --ps-gray-dark: #77766f;
  --ps-black: #11131a;
  --ps-panel: #1a1d27;
  --ps-red: #e94b4b;
  --ps-blue: #3677d8;
  --ps-yellow: #f3c84b;
  --ps-green: #35a878;
}
body {
  background:
    radial-gradient(circle at 50% -20%, rgba(255,255,255,.7), transparent 32rem),
    repeating-linear-gradient(0deg, rgba(0,0,0,.025) 0 1px, transparent 1px 4px),
    var(--ps-gray);
  color: #f7f6ee;
}
body::before {
  opacity: .22;
  background-image:
    radial-gradient(circle at 20% 40%, rgba(0,0,0,.12) 0 1px, transparent 1px),
    radial-gradient(circle at 80% 65%, rgba(255,255,255,.25) 0 1px, transparent 1px);
  background-size: 5px 5px, 7px 7px;
  mask-image: none;
}
.topbar {
  grid-template-columns: auto auto 1fr auto;
  min-height: 72px;
  border: 0;
  border-bottom: 4px solid #3f403f;
  background:
    linear-gradient(180deg, #353741, #20222b 55%, #171920);
  box-shadow: inset 0 -1px rgba(255,255,255,.12), 0 6px 20px rgba(0,0,0,.25);
}
.brand {
  padding: 8px 13px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 5px;
  background: #0d0f15;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.035);
  font-size: 23px;
  text-transform: none;
}
.brand::after {
  content: "POWER";
  display: inline-block;
  margin-left: 9px;
  color: #777b86;
  font-size: 7px;
  letter-spacing: .15em;
  vertical-align: middle;
}
.ps-symbols {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-left: 4px;
}
.ps-symbols i { display: block; width: 11px; height: 11px; }
.symbol-triangle {
  width: 0!important;
  height: 0!important;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 11px solid var(--ps-green);
}
.symbol-circle { border: 2px solid var(--ps-red); border-radius: 50%; }
.symbol-cross { position: relative; transform: rotate(45deg); }
.symbol-cross::before,.symbol-cross::after { content:""; position:absolute; background:var(--ps-blue); border-radius:1px; }
.symbol-cross::before { width:11px; height:2px; left:0; top:4px; }
.symbol-cross::after { width:2px; height:11px; left:4px; top:0; }
.symbol-square { border: 2px solid var(--ps-yellow); }
.console-ridge {
  position: relative;
  z-index: 2;
  height: 12px;
  border-top: 1px solid rgba(255,255,255,.55);
  border-bottom: 1px solid rgba(0,0,0,.25);
  background: linear-gradient(180deg,var(--ps-gray-light),#a4a299);
  box-shadow: 0 6px 12px rgba(0,0,0,.15);
}
.console-ridge span {
  display: block;
  width: 120px;
  height: 4px;
  margin: 3px auto 0;
  border-radius: 99px;
  background: rgba(0,0,0,.22);
  box-shadow: inset 0 1px 2px rgba(0,0,0,.5), 0 1px rgba(255,255,255,.5);
}
nav { margin-left: auto; margin-right: auto; }
nav a.current { border-color: var(--ps-blue); }
.admin-badge {
  border: 1px solid rgba(53,168,120,.38);
  background: rgba(53,168,120,.13);
  color: #76d8af;
}
.shell { padding-top: 38px; }
.hero-stage {
  position: relative;
  min-height: 540px;
  margin-bottom: 30px;
  overflow: hidden;
  border: 9px solid #22242c;
  border-radius: 14px 14px 32px 14px;
  background: #070b12;
  box-shadow:
    0 3px 0 #65645e,
    0 7px 0 #45453f,
    0 20px 45px rgba(0,0,0,.28),
    inset 0 0 0 2px rgba(255,255,255,.08);
}
.hero-stage::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(90deg,#060910 0%,rgba(6,9,16,.97) 31%,rgba(6,9,16,.42) 61%,transparent 82%);
}
.hero-stage::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,transparent 1px 4px);
}
.hero-art {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.hero-copy {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: min(560px,58%);
  min-height: 540px;
  padding: 48px;
}
.hero-copy h1 { font-size: clamp(62px,8vw,100px); }
.hero-copy h1 .fight {
  -webkit-text-stroke: 2px #f2f0e7;
  text-shadow: 5px 6px 0 var(--ps-blue), 9px 10px 0 rgba(233,75,75,.75);
}
.eyebrow { color: var(--ps-yellow); }
.tagline { color: #b9bdca; }
.hero-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 28px;
}
.hero-stats > div {
  min-width: 110px;
  padding: 11px 14px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 5px;
  background: rgba(19,22,31,.78);
  box-shadow: inset 0 1px rgba(255,255,255,.05);
}
.hero-stats span {
  display: block;
  margin-bottom: 3px;
  color: #858b9c;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.hero-stats strong { font-size: 17px; }
.hero-stats > div:nth-child(1) { border-left: 3px solid var(--ps-blue); }
.hero-stats > div:nth-child(2) { border-left: 3px solid var(--ps-green); }
.hero-stats > div:nth-child(3) { border-left: 3px solid var(--ps-red); }
.now-playing {
  display:grid;
  grid-template-columns:66px minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
  width:min(520px,100%);
  margin-top:22px;
  padding:10px;
  border:1px solid rgba(243,200,75,.42);
  border-left:4px solid var(--ps-yellow);
  border-radius:6px;
  background:rgba(17,19,26,.9);
  box-shadow:inset 0 1px rgba(255,255,255,.07),0 8px 22px rgba(0,0,0,.25);
}
.now-cover {
  position:relative;
  width:58px;
  height:76px;
  overflow:hidden;
  border:2px solid #0a0c11;
  background:linear-gradient(145deg,var(--cover-a),var(--cover-base) 65%);
}
.now-cover img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}
.now-cover > span {
  position:absolute;
  left:6px;
  bottom:6px;
  color:white;
  font-size:17px;
  font-weight:950;
}
.now-copy { min-width:0; }
.now-copy > span {
  display:block;
  color:var(--ps-yellow);
  font-size:9px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.now-copy strong {
  display:block;
  margin-top:4px;
  overflow:hidden;
  color:white;
  font-size:18px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.now-copy small { display:block; margin-top:4px; color:#8f95a4; }
.finish-current-button {
  min-height:46px;
  border-color:rgba(53,168,120,.45);
  border-radius:5px;
  background:linear-gradient(180deg,#3eaa7d,#287656);
  box-shadow:inset 0 1px rgba(255,255,255,.2),0 2px 0 #174d38;
}
.empty-now { grid-template-columns:36px minmax(0,1fr); border-color:rgba(255,255,255,.17); border-left-color:#676b76; }
.now-indicator {
  width:20px;
  height:20px;
  margin:auto;
  border:3px solid #676b76;
  border-radius:50%;
  box-shadow:inset 0 0 0 4px #171a22;
}
.disc-button {
  position: absolute;
  z-index: 4;
  right: 17px;
  bottom: 17px;
  width: 34px;
  height: 34px;
  border: 1px solid #4f5158;
  border-radius: 50%;
  background: radial-gradient(circle,#11131a 0 35%,#333640 36% 40%,#1c1f27 41%);
  box-shadow: inset 0 0 0 3px #0b0d13,0 1px rgba(255,255,255,.1);
}
.disc-button span {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--ps-green);
  box-shadow: 0 0 8px var(--ps-green);
  transform: translate(-50%,-50%);
}
.admin-panel {
  border: 1px solid #46484e;
  border-top: 4px solid var(--ps-yellow);
  border-radius: 7px;
  background: linear-gradient(145deg,#292c36,#1b1e27);
  box-shadow: inset 0 1px rgba(255,255,255,.07),0 10px 24px rgba(0,0,0,.2);
}
.toolbar {
  top: 92px;
  border: 1px solid #52534f;
  border-radius: 7px;
  background: linear-gradient(180deg,#cac8bc,#aaa89e);
  box-shadow: inset 0 1px rgba(255,255,255,.85),0 7px 18px rgba(0,0,0,.2);
}
.toolbar input {
  border-color: rgba(0,0,0,.25);
  background: #171a22;
}
.filters a { color: #34353a; font-weight: 850; }
.filters a:hover { color:#111318; background:rgba(255,255,255,.28); }
.filters a.active {
  border-color: #484a50;
  background: #292c35;
  color: white;
  box-shadow: inset 0 1px rgba(255,255,255,.1),0 2px 4px rgba(0,0,0,.2);
}
.search-button,.primary-button,.donate-button {
  border: 1px solid rgba(0,0,0,.28);
  border-radius: 5px;
  background: linear-gradient(180deg,#4f83df,#2f5fab);
  box-shadow: inset 0 1px rgba(255,255,255,.35),0 2px 0 #1d3d74;
}
.list { gap: 8px; }
.game {
  grid-template-columns: 48px 68px minmax(0,1fr) auto;
  min-height: 102px;
  padding: 10px 16px 10px 10px;
  border: 1px solid #454751;
  border-left: 5px solid #5a5d66;
  border-radius: 6px;
  background:
    linear-gradient(90deg,rgba(255,255,255,.025),transparent 20%),
    linear-gradient(180deg,#20232e,#171a22);
  box-shadow: inset 0 1px rgba(255,255,255,.06),0 3px 7px rgba(0,0,0,.18);
}
.game:hover {
  transform: translateX(3px);
  border-color: #747781;
  border-left-color: var(--ps-blue);
}
.game.is-current {
  border-left-color:var(--ps-green);
  box-shadow:inset 0 1px rgba(255,255,255,.06),0 0 0 1px rgba(53,168,120,.22),0 3px 7px rgba(0,0,0,.18);
}
.game.is-current .status { color:#7edbb5; }
.game.frozen { border-left-color: var(--ps-yellow); }
.game.completed { border-left-color: var(--ps-green); }
.rank {
  width: 48px;
  height: 68px;
  border: 1px solid #474a54;
  border-radius: 3px;
  background: #11131a;
  font-family: "Courier New",monospace;
  font-size: 13px;
  box-shadow: inset 0 0 0 2px #090b0f;
}
.game:nth-child(1) .rank,.game:nth-child(2) .rank,.game:nth-child(3) .rank {
  color: var(--muted);
  background: #11131a;
}
.game-cover {
  position: relative;
  width: 68px;
  height: 88px;
  overflow: hidden;
  border: 2px solid #0d0f14;
  border-left: 6px solid rgba(255,255,255,.14);
  border-radius: 2px;
  background:
    linear-gradient(145deg,transparent 0 48%,rgba(255,255,255,.13) 49% 51%,transparent 52%),
    radial-gradient(circle at 70% 25%,var(--cover-b) 0 8%,transparent 9%),
    linear-gradient(145deg,var(--cover-a),var(--cover-base) 55%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12),4px 4px 0 rgba(0,0,0,.22);
}
.game-cover .cover-image {
  position: absolute;
  z-index: 4;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  background: var(--cover-base);
}
.game-cover::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .5;
  background:
    repeating-linear-gradient(45deg,transparent 0 9px,rgba(255,255,255,.09) 10px 11px),
    linear-gradient(180deg,transparent 70%,rgba(0,0,0,.55));
}
.game-cover::after {
  content: "01";
  position: absolute;
  right: 4px;
  bottom: 3px;
  color: rgba(255,255,255,.54);
  font: 7px/1 "Courier New",monospace;
  letter-spacing: .08em;
}
.cover-mark {
  position: absolute;
  z-index: 2;
  left: 7px;
  bottom: 9px;
  color: white;
  font-size: 20px;
  font-weight: 950;
  letter-spacing: -.08em;
  text-shadow: 2px 2px 0 rgba(0,0,0,.55);
}
.game-cover i {
  position: absolute;
  z-index: 1;
  right: -11px;
  top: 20px;
  width: 36px;
  height: 36px;
  border: 5px solid rgba(255,255,255,.14);
  border-radius: 50%;
}
.game-main { min-width: 0; }
.name { color:#f2f1e9; }
.amount { color:var(--ps-yellow); font-family:"Courier New",monospace; font-size:clamp(17px,2.2vw,22px); }
.game-admin { grid-column:3 / -1; }
.cover-form { margin:0; }
.cover-button { cursor:pointer; }
.completed-admin { grid-template-columns:1fr auto; }
.threshold-divider {
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:12px;
  align-items:center;
  margin:12px 0 10px;
  color:#34363d;
  font-family:"Courier New",monospace;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.threshold-divider span {
  padding:7px 10px;
  border:1px solid #555750;
  border-radius:3px;
  background:#c8c6ba;
  box-shadow:inset 0 1px rgba(255,255,255,.8);
}
.threshold-divider i {
  height:3px;
  background:repeating-linear-gradient(90deg,#42444a 0 12px,transparent 12px 18px);
}
.threshold-divider small { color:#66675f; font-size:9px; }
.completed-heading {
  position: relative;
  overflow: hidden;
  padding: 40px;
  border: 7px solid #24262f;
  border-radius: 10px 10px 26px 10px;
  background:
    linear-gradient(125deg,#10131b 0 63%,rgba(16,19,27,.55)),
    repeating-linear-gradient(90deg,transparent 0 30px,rgba(255,255,255,.03) 31px);
  box-shadow: 0 3px 0 #65645e,0 7px 0 #45453f,0 18px 40px rgba(0,0,0,.22);
}
.completed-heading::after {
  content: "";
  position: absolute;
  right: -30px;
  top: -80px;
  width: 280px;
  height: 280px;
  border: 42px solid rgba(53,168,120,.15);
  border-radius: 50%;
}
.archive-counter {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-top: 14px;
  padding: 8px 11px;
  border-left: 3px solid var(--ps-green);
  background: #1d2029;
}
.archive-counter strong { color:#7edbb5; font-size:22px; }
.archive-counter span { color:#8f95a4; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.auth-card {
  border: 7px solid #24262f;
  border-radius: 10px 10px 24px 10px;
  background: #191c25;
  box-shadow: 0 3px 0 #65645e,0 7px 0 #45453f,0 22px 50px rgba(0,0,0,.28);
}
.flash { border-radius:5px; background:#1b1e27; }
@media (max-width:850px) {
  .topbar { grid-template-columns:auto auto 1fr; }
  .topbar nav { grid-column:1 / -1; }
  .account { grid-column:3; grid-row:1; }
  .hero-stage,.hero-copy { min-height:500px; }
  .hero-copy { width:72%; padding:34px; }
  .hero-stage::before { background:linear-gradient(90deg,#060910 0%,rgba(6,9,16,.94) 42%,rgba(6,9,16,.35) 76%,transparent); }
  .toolbar { top:140px; }
  .game-admin { grid-template-columns:1fr auto; }
  .donation-form { grid-column:1 / -1; }
}
@media (max-width:560px) {
  .ps-symbols { display:none; }
  .topbar { grid-template-columns:auto 1fr; }
  .account { grid-column:2; }
  .hero-stage,.hero-copy { min-height:590px; }
  .hero-art { object-position:67% center; opacity:.57; }
  .hero-stage::before { background:linear-gradient(180deg,rgba(6,9,16,.3),#060910 76%); }
  .hero-copy { justify-content:flex-end; width:100%; padding:28px 22px; }
  .hero-copy h1 { font-size:64px; }
  .now-playing { grid-template-columns:54px minmax(0,1fr); }
  .now-cover { width:48px; height:64px; }
  .now-playing form { grid-column:1 / -1; }
  .hero-stats > div { min-width:calc(50% - 4px); }
  .game { grid-template-columns:38px 58px minmax(0,1fr); }
  .rank { width:38px; height:64px; }
  .game-cover { width:58px; height:70px; }
  .amount { grid-column:3; }
  .game-admin { grid-column:1 / -1; }
  .game-admin,.completed-admin { grid-template-columns:1fr; }
  .donation-form { grid-template-columns:1fr auto; }
  .current-button,.cover-button,.delete-button,.current-label { width:100%; }
  .threshold-divider { grid-template-columns:auto 1fr; }
  .threshold-divider small { display:none; }
  .completed-heading { padding:28px 22px; }
}