:root {
    color-scheme: dark;
    --bg: #060b14;
    --card: #101826;
    --card-2: #0d1420;
    --text: #f5f7fb;
    --muted: #96a3b8;
    --line: #243247;
    --accent: #f4be3a;
    --success: #24b36b;
    --error: #db4d4d;
    --info: #2f6be6;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: radial-gradient(circle at top, #0a1423, var(--bg) 55%); color: var(--text); font-family: Inter, Arial, Helvetica, sans-serif; }
body { min-height: 100vh; }
a { color: inherit; }
.page { padding: 24px; }
.wrap { width: min(1240px, 100%); margin: 0 auto; }
.hero { background: linear-gradient(135deg, rgba(22,35,60,.96), rgba(10,19,33,.96)); border: 1px solid var(--line); border-radius: 26px; padding: 28px; box-shadow: 0 20px 50px rgba(0,0,0,.25); }
.hero.slim { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.eyebrow { margin: 0 0 8px; color: #c5d3ea; text-transform: uppercase; letter-spacing: .12em; font-size: 14px; }
h1 { margin: 0 0 10px; font-size: clamp(34px, 6vw, 56px); line-height: 1.05; }
h2 { margin: 0 0 12px; font-size: 22px; }
.subtitle { margin: 0; color: #d6e0f1; max-width: 980px; font-size: 16px; line-height: 1.6; }
.admin-subtitle { margin-top: 6px; }
.notice-list { display: grid; gap: 10px; margin-top: 20px; }
.notice-item { border: 1px solid var(--line); background: rgba(12, 19, 31, .86); border-radius: 14px; padding: 12px 14px; color: #dce6f5; line-height: 1.55; }
.notice { margin-top: 18px; padding: 14px 16px; border-radius: 14px; line-height: 1.55; border: 1px solid transparent; }
.notice-test { background: #3b2810; border-color: #8f6930; color: #ffe5b2; }
.notice-live { background: #13251a; border-color: #2d6e43; color: #ddffe7; }
.mode-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.mode-badge { display: inline-flex; align-items: center; border-radius: 999px; padding: 8px 12px; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.mode-badge.test { background: #3b2810; border: 1px solid #8f6930; color: #ffe5b2; }
.mode-badge.live { background: #13251a; border: 1px solid #2d6e43; color: #ddffe7; }
.layout { display: grid; gap: 18px; margin-top: 18px; grid-template-columns: 1.1fr 1fr .75fr; align-items: start; }
.card { background: rgba(13, 20, 32, .95); border: 1px solid var(--line); border-radius: 24px; padding: 22px; box-shadow: 0 10px 35px rgba(0,0,0,.18); }
.card-info { background: rgba(14, 24, 39, .95); }
.products { display: grid; gap: 16px; }
.product-card { display: block; cursor: pointer; }
.product-card input { position: absolute; opacity: 0; pointer-events: none; }
.product-content { border: 1px solid #28405f; border-radius: 20px; padding: 18px; background: #0a1422; transition: .2s ease; }
.product-card:hover .product-content { border-color: #3f628d; }
.product-card input:checked + .product-content { border-color: #4ea1ff; box-shadow: 0 0 0 1px rgba(78,161,255,.35) inset; }
.product-content strong { display: block; font-size: 18px; margin-bottom: 10px; }
.product-content p { margin: 8px 0 0; color: #d6e0f1; line-height: 1.5; }
.price { color: #79f0ab; font-weight: 700; }
.form-grid { display: grid; gap: 16px; }
.form-grid.narrow { max-width: 420px; }
.test-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
label { display: block; margin-bottom: 8px; font-weight: 600; }
input, select, button, textarea { font: inherit; }
input[type="text"], input[type="password"], select { width: 100%; border-radius: 16px; border: 1px solid #36507a; background: #09111d; color: var(--text); padding: 14px 16px; outline: none; }
input[type="text"]:focus, input[type="password"]:focus, select:focus { border-color: #6ca9ff; box-shadow: 0 0 0 3px rgba(108,169,255,.18); }
.field-help { margin: 8px 0 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.checkbox-row { display: flex; gap: 12px; align-items: flex-start; margin-top: 4px; color: #deebff; }
.checkbox-row input { margin-top: 4px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 0; border-radius: 16px; padding: 14px 18px; background: linear-gradient(180deg, #3e8cff, #2668db); color: #fff; cursor: pointer; text-decoration: none; font-weight: 700; }
.button.small { padding: 10px 14px; border-radius: 14px; font-size: 14px; }
.button.ghost { background: transparent; border: 1px solid #37517d; }
.sticky { position: sticky; top: 24px; }
.status-box { border-radius: 16px; padding: 14px 16px; line-height: 1.55; margin: 12px 0 16px; border: 1px solid transparent; white-space: pre-line; }
.status-box.success { background: rgba(19, 80, 47, .5); border-color: #2d6e43; color: #ddffe7; }
.status-box.error { background: rgba(97, 26, 26, .5); border-color: #8a2f2f; color: #ffe1e1; }
.status-box.info { background: rgba(18, 46, 88, .45); border-color: #31599a; color: #dce8ff; }
.small { font-size: 14px; line-height: 1.55; }
.muted { color: var(--muted); }
.section-intro { margin-top: -4px; margin-bottom: 14px; }
.checkout-note { margin-top: 14px; padding: 12px 14px; border-radius: 14px; background: rgba(12, 19, 31, .85); border: 1px solid var(--line); color: #dce6f5; line-height: 1.55; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: 14px 10px; border-bottom: 1px solid #203044; vertical-align: top; }
th { color: #b7c8e5; font-size: 13px; letter-spacing: .04em; text-transform: uppercase; }
pre { margin: 12px 0 0; padding: 14px; border-radius: 14px; background: #07101b; color: #d7e4f9; overflow: auto; white-space: pre-wrap; word-break: break-word; }
details summary { cursor: pointer; color: #cfe0fb; }
.log-cell { background: rgba(10, 18, 29, .55); }
.empty-cell { text-align: center; color: var(--muted); padding: 24px 12px; }
.stats-grid { display: grid; gap: 16px; margin-top: 18px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.stat-card { background: rgba(13, 20, 32, .95); border: 1px solid var(--line); border-radius: 22px; padding: 18px; box-shadow: 0 10px 35px rgba(0,0,0,.15); }
.stat-label { display: block; color: #b9c8de; font-size: 13px; text-transform: uppercase; letter-spacing: .06em; }
.stat-value { display: block; font-size: 30px; margin-top: 10px; }
.stat-help { display: block; color: var(--muted); font-size: 13px; margin-top: 8px; line-height: 1.45; }
.section-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 8px; }
.status-pill { display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; padding: 6px 10px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.badge-success { background: rgba(19, 80, 47, .55); border: 1px solid #2d6e43; color: #ddffe7; }
.badge-danger { background: rgba(97, 26, 26, .55); border: 1px solid #8a2f2f; color: #ffe1e1; }
.badge-warn { background: rgba(72, 52, 16, .58); border: 1px solid #8f6930; color: #ffe5b2; }
.badge-neutral { background: rgba(29, 41, 61, .75); border: 1px solid #41506a; color: #d7e4f9; }
.check-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.check-list li { padding: 12px 14px; border-radius: 12px; border: 1px solid #29364a; background: #121821; }
.check-list li.ok { border-color: #2d6e43; background: #13251a; color: #ddffe7; }
.check-list li.fail { border-color: #7d3131; background: #2a1515; color: #ffdede; }
.admin-wrap { display: grid; gap: 18px; }
@media (max-width: 1100px) {
    .layout { grid-template-columns: 1fr; }
    .sticky { position: static; }
    .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .page { padding: 14px; }
    .hero, .card { padding: 18px; border-radius: 20px; }
    .hero.slim { flex-direction: column; }
    .test-grid, .stats-grid { grid-template-columns: 1fr; }
    th, td { padding: 12px 8px; }
}


.coin-group-summary { align-items:flex-start; gap:16px; }
.coin-summary-actions { display:flex; align-items:center; gap:10px; margin-left:auto; flex-wrap:wrap; }
.coins-showcase { display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:16px; margin-top:16px; }
.product-card-coin { display:block; }
.coin-pack-card { min-height:220px; display:flex; flex-direction:column; justify-content:space-between; padding:0; overflow:hidden; background:linear-gradient(180deg, #0a1019 0%, #0d1420 40%, #121b29 100%); }
.coin-pack-top { padding:18px 18px 14px; min-height:82px; background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)); border-bottom:1px solid rgba(255,255,255,.08); display:grid; gap:10px; }
.coin-pack-badge { display:inline-flex; align-items:center; width:fit-content; padding:6px 10px; border-radius:999px; font-size:12px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; background:#0f1115; border:1px solid rgba(255,255,255,.12); }
.coin-pack-kicker { color:#c6d6f0; font-size:14px; }
.coin-pack-body { padding:18px; display:grid; gap:10px; }
.coin-pack-body strong { font-size:28px; line-height:1.1; margin:0; }
.coin-pack-body p { margin:0; color:#d6e0f1; }
.coin-pack-footer { padding:18px; display:flex; justify-content:flex-end; align-items:flex-end; min-height:72px; }
.coin-pack-footer .price { font-size:30px; line-height:1; color:#fff; font-weight:800; }
.product-card-coin input:checked + .coin-pack-card { border-color:#5aa2ff; box-shadow:0 0 0 1px rgba(90,162,255,.45) inset, 0 18px 40px rgba(0,0,0,.28); }
.product-card-coin:hover .coin-pack-card { border-color:#4f6e98; }
.premium-category .premium-item ul { margin:12px 0 0; padding-left:20px; color:#dce6f5; }
.premium-category .premium-item li { margin:6px 0; }
@media (max-width: 1200px) { .coins-showcase { grid-template-columns:repeat(3, minmax(0,1fr)); } }
@media (max-width: 760px) {
  .coin-group-summary { flex-direction:column; }
  .coin-summary-actions { margin-left:0; }
  .coins-showcase { grid-template-columns:1fr; }
  .coin-pack-body strong { font-size:24px; }
  .coin-pack-footer .price { font-size:26px; }
}