@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Poppins:wght@400;500;600;700;800&display=swap');

:root {
  color-scheme: light;
  --cream: #F7F3E2;
  --sand: #BEAA9A;
  --brown: #4F3026;
  --wine: #600000;
  --gold: #B89A5E;
  --ink: #2B1B16;
  --paper: #FFFDF7;
  --muted: #7D6E63;
  --line: rgba(79, 48, 38, .16);
  font-family: Poppins, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  background:
    radial-gradient(circle at top left, rgba(184,154,94,.22), transparent 36rem),
    linear-gradient(135deg, var(--cream), #efe5d9 48%, #e5d4c4);
  color: var(--ink);
  min-height: 100vh;
}
.app { width: min(980px, calc(100% - 32px)); margin: 32px auto; display: grid; gap: 18px; }
.wide { width: min(1240px, calc(100% - 32px)); }
.card {
  background: rgba(255, 253, 247, .88);
  border: 1px solid rgba(184,154,94,.28);
  border-radius: 26px;
  padding: 26px;
  box-shadow: 0 24px 70px rgba(79,48,38,.18);
  backdrop-filter: blur(10px);
}
.header { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:18px; }
h1 { margin: 0; font-family: "Instrument Serif", Georgia, serif; font-size: clamp(34px, 6vw, 58px); line-height: .92; font-weight: 400; color: var(--brown); }
h2 { margin: 0 0 14px; font-family: "Instrument Serif", Georgia, serif; font-size: 34px; font-weight: 400; color: var(--brown); }
.eyebrow { margin: 0 0 6px; color: var(--wine); font-weight:800; letter-spacing:.12em; text-transform:uppercase; font-size:12px; }
.pill, .nav-link { border:1px solid rgba(184,154,94,.52); color: var(--wine); background: rgba(247,243,226,.62); padding:8px 12px; border-radius:999px; font-size:13px; font-weight:700; text-decoration:none; }
.env-pill { color: var(--brown); border-color: rgba(96,0,0,.24); }
.top-actions { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:14px; }
.full { grid-column: 1 / -1; }
label { display:grid; gap:7px; color: var(--brown); font-size:14px; font-weight:600; }
input, select {
  border:1px solid var(--line);
  border-radius:14px;
  background: rgba(255,253,247,.84);
  color: var(--ink);
  padding:13px 14px;
  font:inherit;
  outline:none;
}
input:focus, select:focus { border-color: var(--gold); box-shadow:0 0 0 4px rgba(184,154,94,.18); }
button {
  border:0;
  border-radius:16px;
  padding:15px 18px;
  font-weight:800;
  color:#fff;
  background:linear-gradient(135deg,var(--wine),#8b2222);
  cursor:pointer;
  box-shadow: 0 10px 22px rgba(96,0,0,.18);
}
button:disabled { opacity:.55; cursor:wait; }
.hidden { display:none !important; }
.result-grid { display:grid; grid-template-columns: 220px 1fr; gap:20px; align-items:start; }
.qr { width:220px; height:220px; background:#fff; border-radius:18px; object-fit:contain; border: 1px solid var(--line); }
.copy { width:100%; min-height:86px; overflow-wrap:anywhere; background:#fff; border:1px solid var(--line); border-radius:14px; padding:12px; color:var(--ink); }
.actions { display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; }
.secondary, .secondary-mini { background:#fff !important; color:var(--brown) !important; border:1px solid var(--line) !important; box-shadow:none; }
.status { color:#126a3a; font-weight:800; }
.pending { color:var(--gold); }
.error { color:#b00020; font-weight:700; }
.hint, small, .summary span { color:var(--muted); }
.hint { font-size:12px; line-height:1.4; }
.filters { display:grid; grid-template-columns:minmax(280px,1fr) 190px 180px 170px 150px; gap:12px; }
#month { min-width:190px; padding-right:34px; }
.table-wrap { overflow:auto; }
table { width:100%; border-collapse:collapse; font-size:14px; }
th,td { text-align:left; border-bottom:1px solid var(--line); padding:12px; vertical-align:top; }
th { color:var(--wine); font-size:12px; text-transform:uppercase; letter-spacing:.06em; }
.summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:18px; }
.summary div { background:rgba(247,243,226,.7); border:1px solid var(--line); border-radius:16px; padding:14px; }
.summary strong { display:block; font-size:22px; color:var(--brown); }
.badge { display:inline-block; border-radius:999px; padding:5px 9px; background:#efe7dd; color:var(--brown); font-weight:700; }
.badge.paid { background:#dff3e8; color:#126a3a; }
.badge.awaiting_payment { background:#fbf0d8; color:#8a650f; }
.badge.error { background:#ffe0e4; color:#b00020; }
.env { display:inline-block; margin-top:6px; color:var(--muted); font-size:12px; }
.mini { padding:8px 10px; border-radius:10px; font-size:12px; box-shadow:none; }
.action-stack { display:flex; flex-direction:column; gap:7px; align-items:flex-start; }
.user-actions { display:flex; gap:7px; flex-wrap:wrap; }
.soft-divider { border:0; border-top:1px solid var(--line); margin:22px 0; }
.users-wrap { max-height:440px; }
.user-edit-row td { background:rgba(247,243,226,.55); }
.inline-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.inline-grid .full { grid-column:1/-1; }
select[multiple] { min-height:120px; }
.check-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:8px; max-height:220px; overflow:auto; border:1px solid var(--line); border-radius:14px; padding:10px; background:rgba(255,253,247,.72); }
.check-grid label { display:flex; align-items:center; gap:8px; font-size:12px; font-weight:600; color:var(--ink); }
.check-grid input { width:auto; padding:0; }
.admin-filters { margin-bottom:14px; }
.success-card { background:#dff3e8; border:1px solid #126a3a; border-radius:14px; padding:14px; margin-top:12px; color:var(--ink); }
.success-card p { margin:0 0 8px; }
.success-card p:last-child { margin-bottom:0; }
.pwd-row { display:flex; gap:10px; align-items:center; }
.pwd-value { flex:1; font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:15px; padding:10px 12px; background:#fff; border:1px solid var(--line); border-radius:10px; user-select:all; overflow-wrap:anywhere; }
.admin-toggle-header { margin-bottom:0; }
.auth-wall { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; padding: 20px; background: rgba(43,27,22,.42); backdrop-filter: blur(8px); }
.auth-box { width: min(420px, 100%); display: grid; gap: 14px; background: var(--paper); border: 1px solid rgba(184,154,94,.42); border-radius: 26px; padding: 26px; box-shadow: 0 30px 90px rgba(43,27,22,.35); }
.auth-box h2 { margin-bottom: 0; }
.auth-box button { width: 100%; }
.auth-badge.mini { padding: 8px 10px; }
@media (max-width: 820px) { .grid, .result-grid, .filters, .summary { grid-template-columns: 1fr; } .qr { width:100%; height:auto; max-width:260px; } .wide{width:min(100% - 18px,1240px)} .header{align-items:flex-start; flex-direction:column;} }