:root {
  color-scheme: dark;
  --bg: #0f0f0f;
  --card: #1f1f1f;
  --card-2: #272727;
  --text: #f1f1f1;
  --muted: #aaa;
  --line: #3a3a3a;
  --accent: #a970ff;
  --accent-strong: #c399ff;
  --danger: #ff8f8f;
  --success: #7ee2a8;
}

* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at 85% -10%, #282039 0, transparent 35%), var(--bg); color: var(--text); font: 15px/1.55 Arial, Helvetica, sans-serif; }
a { color: var(--accent-strong); }
button, input { font: inherit; }
button { border: 0; border-radius: 5px; cursor: pointer; background: var(--accent); color: #160c24; font-weight: 700; padding: 11px 18px; transition: filter .15s, transform .15s; }
button:hover { filter: brightness(1.12); }
button:active { transform: translateY(1px); }
button:disabled { cursor: wait; opacity: .6; }
.secondary-button { background: var(--card-2); border: 1px solid var(--line); color: var(--text); }
.site-header { align-items: center; border-bottom: 1px solid #292929; display: flex; gap: 13px; min-height: 76px; padding: 15px max(22px, calc((100vw - 1060px) / 2)); }
.admin-header { justify-content: flex-start; }
.admin-header > button { margin-left: auto; }
.brand-mark { align-items: center; background: #ff0033; border-radius: 7px; color: white; display: flex; font-size: 16px; height: 34px; justify-content: center; width: 44px; }
h1, h2, p { margin-top: 0; }
h1 { font-size: 19px; margin-bottom: 0; }
h2 { font-size: 24px; letter-spacing: -.02em; margin-bottom: 8px; }
.eyebrow { color: var(--accent-strong); font-size: 11px; font-weight: 700; letter-spacing: .11em; margin-bottom: 4px; text-transform: uppercase; }
.muted { color: var(--muted); }
.status-badge, .pill { border: 1px solid #5a4374; border-radius: 999px; color: var(--accent-strong); font-size: 11px; font-weight: 700; letter-spacing: .06em; padding: 4px 9px; text-transform: uppercase; }
.status-badge { margin-left: auto; }
.status-badge.closed { border-color: #694248; color: #ffaaa8; }
.container { margin: 0 auto; max-width: 1060px; padding: 34px 22px 50px; }
.card { background: rgba(31,31,31,.96); border: 1px solid #303030; border-radius: 10px; box-shadow: 0 10px 35px rgba(0,0,0,.18); margin-bottom: 20px; padding: 25px; }
.section-heading { align-items: flex-start; display: flex; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.total-count { color: var(--accent-strong); font-size: 20px; white-space: nowrap; }
.progress-track { background: #383838; border-radius: 99px; height: 8px; overflow: hidden; }
.progress-track.large { height: 12px; }
.progress-fill { background: linear-gradient(90deg, #8959dc, #c399ff); border-radius: inherit; height: 100%; transition: width .3s; width: 0; }
.bucket-list { display: grid; gap: 13px; grid-template-columns: repeat(5, 1fr); margin-top: 24px; }
.bucket-item { background: #242424; border-radius: 7px; padding: 13px; }
.bucket-label { display: block; font-size: 13px; font-weight: 700; margin-bottom: 9px; }
.bucket-meta { color: var(--muted); display: flex; font-size: 12px; justify-content: space-between; margin-top: 7px; }
.need-chip { color: var(--accent-strong); }
.need-chip.full { color: var(--success); }
.closed-banner { border-color: #674045; }
.closed-banner h2 { color: #ffaaa8; }
.gate-card { margin: 30px auto 20px; max-width: 730px; }
.inline-form { align-items: end; display: flex; gap: 10px; }
label, legend { display: block; font-size: 13px; font-weight: 700; margin-bottom: 8px; }
input { background: #141414; border: 1px solid #4a4a4a; border-radius: 5px; color: var(--text); outline: 0; padding: 11px 12px; width: 100%; }
input:focus { border-color: var(--accent); box-shadow: 0 0 0 2px rgba(169,112,255,.2); }
.inline-form input { flex: 1; }
.form-error { color: var(--danger); min-height: 22px; margin: 10px 0 0; }
.instructions { color: #ddd; margin: 0 0 13px; padding-left: 22px; }
.instructions li { margin-bottom: 6px; }
.example-figure { margin: 23px 0 0; }
.example-figure img { border: 1px solid var(--line); border-radius: 7px; display: block; max-height: 360px; max-width: 100%; object-fit: contain; }
figcaption { color: var(--muted); font-size: 12px; margin-top: 8px; }
.submission-form { margin-left: auto; margin-right: auto; max-width: 730px; }
.submission-form > input, .submission-form > label, .submission-form fieldset { margin-bottom: 18px; }
fieldset { border: 0; margin: 0; padding: 0; }
.radio-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.radio-pills label { background: #292929; border: 1px solid #464646; border-radius: 999px; color: #ddd; cursor: pointer; margin: 0; padding: 9px 13px; }
.radio-pills input { accent-color: var(--accent); margin-right: 7px; width: auto; }
.radio-pills label:has(input:checked) { background: #382656; border-color: var(--accent); color: white; }
.drop-zone { align-items: center; border: 1px dashed #636363; border-radius: 8px; display: flex; flex-direction: column; gap: 2px; justify-content: center; min-height: 122px; padding: 18px; position: relative; text-align: center; }
.drop-zone:hover, .drop-zone.dragging { background: #29213a; border-color: var(--accent); }
.drop-zone span { color: var(--muted); font-size: 13px; }
.drop-zone input { cursor: pointer; height: 100%; left: 0; opacity: 0; position: absolute; top: 0; }
.screenshot-hint { color: var(--muted); font-size: 12px; margin: -12px 0 0; }
.file-list { margin: 12px 0 18px; }
.file-row { align-items: center; background: #292929; border-radius: 6px; display: flex; gap: 10px; margin-bottom: 6px; padding: 9px 11px; }
.file-row .file-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.file-size { color: var(--muted); font-size: 12px; white-space: nowrap; }
.remove-file { background: transparent; color: var(--muted); font-size: 18px; padding: 0 4px; }
.file-progress { background: #444; border-radius: 99px; height: 4px; margin-top: 5px; overflow: hidden; }
.file-progress span { background: var(--accent); display: block; height: 100%; width: 0; }
.primary-button { width: 100%; }
.success-card { margin-left: auto; margin-right: auto; max-width: 730px; text-align: center; }
.success-icon { align-items: center; background: #183526; border-radius: 50%; color: var(--success); display: flex; font-size: 28px; height: 56px; justify-content: center; margin: 0 auto 18px; width: 56px; }
.success-quota { background: #292929; border-radius: 7px; margin: 20px auto; max-width: 450px; padding: 14px; text-align: left; }
.success-quota div { display: flex; justify-content: space-between; padding: 3px 0; }
.site-footer { color: #777; font-size: 12px; padding: 0 22px 35px; text-align: center; }
.hidden { display: none !important; }
.sr-only { height: 1px; margin: -1px; overflow: hidden; position: absolute; width: 1px; clip: rect(0,0,0,0); }
.narrow-card { max-width: 450px; }
.created-code { align-items: center; background: #302147; border: 1px solid #6d4e9b; border-radius: 6px; color: var(--accent-strong); display: flex; font-size: 23px; font-weight: 700; justify-content: space-between; letter-spacing: .16em; margin-top: 15px; padding: 12px 15px; }
.created-code button { font-size: 12px; letter-spacing: normal; padding: 7px 10px; }
.table-card { overflow: hidden; }
.table-scroll { overflow-x: auto; }
table { border-collapse: collapse; min-width: 780px; width: 100%; }
th, td { border-bottom: 1px solid #363636; padding: 12px 9px; text-align: left; vertical-align: top; }
th { color: var(--muted); font-size: 11px; letter-spacing: .07em; text-transform: uppercase; }
td { color: #ddd; font-size: 13px; }
td a { word-break: break-all; }
.table-action { background: transparent; color: var(--danger); padding: 3px 0; }
.file-link { display: block; font-size: 12px; margin-bottom: 4px; }

@media (max-width: 760px) {
  .site-header { padding: 13px 16px; }
  .container { padding: 22px 14px 38px; }
  .card { padding: 19px; }
  .bucket-list { grid-template-columns: 1fr; }
  .bucket-item { padding: 11px; }
  .inline-form { align-items: stretch; flex-direction: column; }
  .inline-form button { width: 100%; }
  .section-heading { flex-direction: column; gap: 6px; }
  .total-count { font-size: 17px; }
}