.login-note { color: var(--muted); font-size: 0.75rem; }
.totals { margin: 0; color: var(--muted); font-size: 0.8rem; letter-spacing: 0.15em; text-transform: uppercase; }

.create { background: var(--ink); color: var(--bg); padding: 1.6rem; margin-bottom: 2rem; }
.create h2 { color: var(--gold); font-style: italic; }
.create-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem 1.4rem; align-items: end; }
.create-form label { display: grid; gap: 0.3rem; font-size: 0.65rem; text-transform: uppercase; letter-spacing: 0.2em; color: #cfc6b2; }
.create-form input, .create-form select { color: var(--bg); border-bottom-color: var(--gold); }
.create-form select option { color: var(--ink); }
.create-form .wide { grid-column: span 2; grid-template-columns: auto 1fr; align-items: end; }
.create-form .wide > :first-child { grid-column: 1 / -1; }
.slug-pre { font-size: 1rem; letter-spacing: 0; text-transform: none; padding-bottom: 0.55rem; color: var(--gold); }
.create-form .btn { background: var(--gold); border-color: var(--gold); color: var(--ink); }
.create-form .btn:hover { background: var(--bg); border-color: var(--bg); }
.create-form .err { grid-column: 1 / -1; color: #f0b8ad; }
@media (max-width: 560px) { .create-form .wide { grid-column: auto; } }

.secret { border: 2px solid var(--gold); background: var(--surface); padding: 1.4rem; margin-bottom: 2rem; }
.secret pre { background: var(--bg); padding: 1rem; white-space: pre-wrap; word-break: break-all; font-size: 0.85rem; }

.invites { list-style: none; padding: 0; margin: 0; display: grid; gap: 1px; background: color-mix(in srgb, var(--gold) 50%, transparent);
  border: 1px solid color-mix(in srgb, var(--gold) 50%, transparent); }
.inv { background: var(--surface); padding: 1.1rem 1.2rem; display: grid; grid-template-columns: 1.4fr 1fr auto; gap: 1rem; align-items: center; transition: background 0.2s; }
.inv:hover { background: #fff; }
.inv-name { font-family: var(--serif); font-size: 1.6rem; line-height: 1.1; }
.inv-meta { font-size: 0.75rem; color: var(--muted); margin-top: 0.2rem; }
.inv-nums { display: flex; gap: 1.4rem; }
.inv-nums b { display: block; font-family: var(--serif); font-weight: 400; font-size: 1.6rem; line-height: 1; }
.inv-nums span { font-size: 0.6rem; text-transform: uppercase; letter-spacing: 0.18em; color: var(--muted); }
.inv-links { display: flex; flex-wrap: wrap; gap: 0.35rem; justify-content: flex-end; }
.inv-links .btn { padding: 0.5rem 0.75rem; text-decoration: none; }
.inv.past { opacity: 0.6; }
@media (max-width: 760px) { .inv { grid-template-columns: 1fr; } .inv-links { justify-content: flex-start; } }
