* { box-sizing: border-box; }
:root { font-family: Inter, "Segoe UI", sans-serif; font-size: 16px; }
body { margin: 0; min-height: 100svh; }
[hidden] { display: none !important; }
button, input, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:disabled { cursor: wait; opacity: .65; }
a { color: inherit; }
:focus-visible { outline: 3px solid #4a83fa; outline-offset: 3px; }
.message { margin: 0; line-height: 1.5; overflow-wrap: anywhere; }
.message:empty { display: none; }
.landing {
  color: #fff1ce;
  background: #201114 url("/assets/bgpc.webp") center center / cover no-repeat fixed;
}
.landing-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 22px clamp(18px, 5vw, 68px); background: linear-gradient(#1c080cda, transparent); }
.landing-header img { display: block; object-fit: contain; filter: brightness(0) saturate(100%) invert(87%) sepia(39%) saturate(830%) hue-rotate(330deg); }
.support-link { color: #ffdda1; text-decoration: none; padding: 9px 14px; border: 1px solid #ffcb7866; border-radius: 99px; background: #300e15ca; font-size: .86rem; }
.hero { display: grid; justify-items: center; padding: clamp(16px, 4.5vh, 46px) 16px 96px; }
.hero h1 { margin: 0 0 3px; width: min(680px, 100%); }
.hero h1 img { display: block; width: 100%; height: auto; filter: drop-shadow(0 12px 24px #27080ebd); }
.gold-card { color: #fff1ce; border: 1px solid #f5b958; border-radius: 22px; background: linear-gradient(155deg, #581d22, #310f18 67%); box-shadow: inset 0 0 0 4px #ffbe5d1f, 0 16px 46px #1d050cb8; }
.lookup-card { width: min(100%, 440px); padding: 27px; display: grid; gap: 14px; }
.lookup-card label { font-weight: 650; }
.code-field { display: flex; align-items: center; gap: 10px; padding: 0 14px; border: 1px solid #e7ad576e; background: #230e15; border-radius: 10px; }
.code-field:focus-within { outline: 2px solid #ffcb76; }
.code-field input { width: 100%; color: #fff7e6; background: transparent; border: 0; outline: none; min-height: 49px; text-transform: uppercase; letter-spacing: .09em; }
.code-field input::placeholder { color: #d8bda9; text-transform: none; letter-spacing: normal; }
.gold-button { display: block; width: 100%; border: 1px solid #ffdf8c; border-radius: 10px; padding: 13px 14px; text-align: center; text-decoration: none; font-weight: 750; background: linear-gradient(#fff0ae, #ffca64 52%, #e9932e); color: #421913; }
.gold-button:hover { filter: brightness(1.08); }
.gold-button[aria-disabled="true"] { opacity: .6; cursor: default; filter: none; }
.landing .message { color: #ffdeb0; }
dialog { max-height: calc(100svh - 32px); }
dialog::backdrop { background: #11080bd6; }
.result { width: min(490px, calc(100% - 32px)); padding: 28px; }
.result h2 { margin: 0 28px 21px 0; color: #ffdb91; }
.close-button { position: absolute; right: 12px; top: 9px; background: transparent; color: inherit; border: 0; font-size: 1.85rem; min-width: 36px; }
.result dl { margin: 0 0 18px; }
.result dl div { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid #ffd68a35; }
.result dt { color: #e9cbb3; }
.result dd { margin: 0; text-align: right; font-weight: 650; overflow-wrap: anywhere; min-width: 0; }
.result .reward { color: #ffda80; }
.result .gold-button { margin-top: 12px; }
.admin { background: #f4f6fc; color: #182541; }
.admin-header { padding: 16px clamp(18px, 5vw, 70px); display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid #dfe5f0; background: white; }
.admin-header img { object-fit: contain; }
.admin-header nav, .admin-title, .records-head, .editor-actions { display: flex; align-items: center; gap: 12px; justify-content: space-between; flex-wrap: wrap; }
.admin-header a { font-size: .9rem; color: #344b77; }
.admin-main { max-width: 1240px; padding: 32px 18px; margin: auto; }
.admin h1 { margin: 0; font-size: clamp(1.5rem, 4vw, 2.2rem); }
.admin h2 { font-size: 1.15rem; margin: 0; }
.panel { background: white; border: 1px solid #dfe5f0; border-radius: 16px; padding: 20px; }
.login, .editor form { display: grid; gap: 14px; }
.login { width: min(100%, 420px); margin: 8vh auto 0; padding: 26px; }
.admin label { display: grid; gap: 7px; font-size: .9rem; font-weight: 650; }
.admin input, .admin textarea { width: 100%; min-width: 0; border: 1px solid #cbd5e8; color: inherit; border-radius: 8px; padding: 10px 12px; background: #fff; }
.primary, .secondary { padding: 9px 13px; border-radius: 8px; font-size: .9rem; font-weight: 650; border: 1px solid #cbd5e8; }
.primary { background: #215cde; border-color: #215cde; color: white; }
.secondary { background: #fff; color: #2a4272; }
.primary:hover, .secondary:hover { filter: brightness(.95); }
.settings { margin: 20px 0 12px; display: flex; align-items: end; gap: 12px; flex-wrap: wrap; }
.settings label { width: min(100%, 400px); }
.admin .message { color: #2e4c84; }
.records { margin-top: 16px; }
.records-head { margin-bottom: 16px; }
.records-head input { width: min(100%, 250px); }
.table-wrap { overflow: auto; }
table { width: 100%; border-collapse: collapse; text-align: left; min-width: 835px; }
th, td { border-bottom: 1px solid #e5eaf3; padding: 11px 9px; font-size: .86rem; overflow-wrap: anywhere; max-width: 200px; }
th { background: #f4f7fd; }
.row-actions { display: flex; flex-wrap: wrap; gap: 5px; }
.row-actions button { padding: 5px 7px; font-size: .78rem; }
.badge { display: inline-block; padding: 5px 8px; background: #e9efff; border-radius: 8px; color: #244695; }
.badge.pending { background: #fff2da; color: #704604; }
.badge.paid { background: #ddf4e8; color: #176143; }
.badge.disabled { background: #eceef3; color: #4e5667; }
.editor { width: min(470px, calc(100% - 32px)); color: inherit; }
.editor-actions { justify-content: flex-end; }
@media (max-width: 650px) {
  .landing { background-image: url("/assets/bgmb.webp"); background-attachment: scroll; }
  .landing-header { padding: 18px; }
  .landing-header img { width: 85px; }
  .hero { padding-top: clamp(30px, 9svh, 90px); }
  .lookup-card, .result { padding: 20px; }
  .panel { padding: 15px; }
}