/* Tyluna — shared base styles. "Spark Stack" direction: dark ground, a
   coral-to-violet gradient carrying every primary action. Swap the
   :root values below to rebrand; component rules reference the tokens,
   not literal colors, so a palette swap cascades everywhere. Admin pages
   load assets/admin.css after this file to opt back into a light,
   high-density look better suited to data tables. */
:root{
  --ink:#FFFFFF;
  --paper:#150A1D;
  --card:#241531;
  --ground-raised:#2E1B3E;
  --primary:#FF3D81;
  --primary-dark:#B23BE0;
  --primary-light:#FF9FC4;
  --accent:#FFC24B;
  --muted:rgba(255,255,255,.64);
  --border:rgba(255,255,255,.12);
  --danger:#c0392b;
  --success:#1a6b3c;
  --grad-flame:linear-gradient(135deg,#FF4D6D,#FF3D81 45%,#B23BE0 75%,#7C3AED);
  --ph-wash:
    radial-gradient(circle at 25% 20%, rgba(255,77,109,.35), transparent 55%),
    radial-gradient(circle at 80% 80%, rgba(124,58,237,.4), transparent 55%),
    linear-gradient(160deg,#3A1E4A,#1C0F27 75%);
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Segoe UI',system-ui,sans-serif;background:var(--paper);color:var(--ink);min-height:100vh}
a{color:var(--primary-dark)}
.topbar{background:rgba(21,10,29,.75);backdrop-filter:blur(14px);color:var(--ink);padding:14px 24px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:50;border-bottom:1px solid var(--border)}
.topbar .brand{font-size:18px;font-weight:800;text-decoration:none;color:var(--ink);display:flex;align-items:center;gap:6px}
.topbar nav{display:flex;gap:18px;align-items:center}
.topbar nav a{color:var(--ink);text-decoration:none;font-size:14px;opacity:.75}
.topbar nav a.active{opacity:1;font-weight:700;color:var(--primary-light)}
.wrap{max-width:1100px;margin:0 auto;padding:24px}
.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:28px;box-shadow:0 20px 50px rgba(0,0,0,.35)}
.btn{display:inline-block;background:var(--grad-flame);color:#fff;border:none;padding:12px 22px;border-radius:999px;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit;text-decoration:none;text-align:center;transition:filter .15s ease}
.btn:hover{filter:brightness(1.1)}
.btn.secondary{background:var(--ground-raised);color:var(--ink);border:1.5px solid var(--border)}
.btn.secondary:hover{border-color:var(--primary);filter:none}
.btn.block{width:100%}
.btn:disabled{opacity:.5;cursor:not-allowed}
.field{margin-bottom:16px}
.field label{display:block;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;padding:12px 14px;background:var(--ground-raised);color:var(--ink);border:1.5px solid var(--border);border-radius:10px;font-size:15px;font-family:inherit}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--primary)}
.field textarea{resize:vertical;min-height:90px}
.alert{padding:12px 16px;border-radius:10px;margin-bottom:18px;font-size:14px}
.alert.error{background:#fde8e8;color:var(--danger)}
.alert.success{background:#e6f4ec;color:var(--success)}
.muted{color:var(--muted)}
.center{text-align:center}
.pill{display:inline-block;background:var(--primary-light);color:#3A0A2E;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px}
.grad-text{background:var(--grad-flame);-webkit-background-clip:text;background-clip:text;color:transparent}
.vbadge{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:var(--grad-flame);color:#fff;font-size:11px;font-weight:800;vertical-align:middle}