:root{
  --rose:#b8475f; --rose-d:#9a3850; --ink:#2b2b33; --muted:#8a8a96;
  --bg:#faf7f5; --card:#fff; --line:#ece6e3;
  --yes:#1f9d5c; --yes-bg:#e6f5ec; --no:#d23b46; --no-bg:#fbe9ea;
  --maybe:#c98a14; --maybe-bg:#fbf1dc; --none:#9aa0ab; --none-bg:#eef0f3;
  --shadow:0 1px 3px rgba(40,20,25,.08),0 6px 20px rgba(40,20,25,.05);
}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);background:var(--bg);line-height:1.45}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif;font-weight:600;margin:.2em 0}
h1{font-size:1.5rem}h2{font-size:1.15rem}h3{font-size:1rem}
a{color:var(--rose);text-decoration:none}
.muted{color:var(--muted);font-size:.86rem}
.hint{color:var(--muted);font-size:.78rem;margin:.2rem 0 0}
hr{border:none;border-top:1px solid var(--line);margin:1rem 0}

/* top bar */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  background:var(--card);border-bottom:1px solid var(--line);padding:.6rem 1rem;position:sticky;top:0;z-index:5}
.brand{display:flex;align-items:center;gap:.5rem;color:var(--ink)}
.brand-mark{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:9px;
  background:var(--rose);color:#fff;font-weight:700;font-family:Georgia,serif;letter-spacing:.5px}
.brand-mark.big{width:64px;height:64px;font-size:1.5rem;border-radius:16px}
.brand-name{font-family:Georgia,serif;font-weight:600}
.topnav{display:flex;align-items:center;gap:1rem}
.topnav a{color:var(--ink);font-size:.9rem}
.logout{margin:0}.logout button{background:none;border:none;color:var(--muted);cursor:pointer;font-size:.9rem}

.wrap{max-width:1000px;margin:0 auto;padding:1.1rem}
@media(max-width:560px){.brand-name{display:none}.wrap{padding:.8rem}}

.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1rem;flex-wrap:wrap}
.back{font-size:.82rem;color:var(--muted)}
.head-actions{display:flex;gap:.5rem;flex-wrap:wrap}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.35rem;background:var(--card);border:1px solid var(--line);
  color:var(--ink);padding:.55rem .9rem;border-radius:10px;font-size:.9rem;cursor:pointer;box-shadow:var(--shadow)}
.btn:hover{border-color:#dcd3cf}
.btn-primary{background:var(--rose);border-color:var(--rose);color:#fff}
.btn-primary:hover{background:var(--rose-d);border-color:var(--rose-d)}
.btn[disabled]{opacity:.45;cursor:not-allowed;box-shadow:none}

/* cards / dashboard */
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem}
.ev-card{display:flex;flex-direction:column;gap:.7rem;background:var(--card);border:1px solid var(--line);
  border-radius:16px;padding:1rem;box-shadow:var(--shadow);color:var(--ink)}
.ev-card:hover{transform:translateY(-2px);transition:.15s}
.ev-card-foot{border-top:1px solid var(--line);padding-top:.5rem}

/* KPI */
.kpi-row{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem}
.kpi-row.big{grid-template-columns:repeat(6,1fr);margin:1rem 0;gap:.6rem}
@media(max-width:620px){.kpi-row.big{grid-template-columns:repeat(3,1fr)}}
.kpi{background:var(--none-bg);border-radius:12px;padding:.6rem .4rem;text-align:center;display:flex;flex-direction:column}
.kpi b{font-size:1.5rem;font-family:Georgia,serif;line-height:1}
.kpi span{font-size:.7rem;color:var(--muted);margin-top:.25rem;text-transform:uppercase;letter-spacing:.4px}
.kpi-yes{background:var(--yes-bg)}.kpi-yes b{color:var(--yes)}
.kpi-yescount b{color:var(--yes)}
.kpi-maybe{background:var(--maybe-bg)}.kpi-maybe b{color:var(--maybe)}
.kpi-no{background:var(--no-bg)}.kpi-no b{color:var(--no)}
.kpi-pending b{color:var(--none)}

/* action bar */
.actions{display:flex;gap:.6rem;flex-wrap:wrap;margin:1rem 0}
.actions form{margin:0}

/* two columns */
.cols{display:grid;grid-template-columns:300px 1fr;gap:1rem;align-items:start}
@media(max-width:780px){.cols{grid-template-columns:1fr}}
.add-box,.list-box{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:1rem;box-shadow:var(--shadow)}
.stack{display:flex;flex-direction:column;gap:.5rem}

/* inputs */
.inp{width:100%;padding:.6rem .7rem;border:1px solid var(--line);border-radius:10px;font-size:.92rem;background:#fff}
.inp:focus{outline:none;border-color:var(--rose);box-shadow:0 0 0 3px rgba(184,71,95,.12)}

/* filters */
.filters{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.7rem}
.pill{padding:.3rem .7rem;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:.82rem}
.pill.on{background:var(--rose);border-color:var(--rose);color:#fff}
.search{margin-bottom:.7rem}

/* guest list */
.guests{display:flex;flex-direction:column}
.guest{display:flex;align-items:center;justify-content:space-between;gap:.6rem;
  padding:.6rem .2rem;border-bottom:1px solid var(--line)}
.guest:last-child{border-bottom:none}
.g-main{display:flex;flex-direction:column;min-width:0}
.g-name{font-weight:600}
.g-contact{font-size:.78rem}
.g-meta{display:flex;align-items:center;gap:.45rem}
.g-extra{font-size:.75rem;background:var(--none-bg);color:var(--muted);border-radius:6px;padding:.05rem .35rem}
.dot.sent{color:var(--yes);font-size:.8rem}
.chip{font-size:.74rem;font-weight:600;padding:.2rem .55rem;border-radius:999px;white-space:nowrap}
.chip-Y{background:var(--yes-bg);color:var(--yes)}
.chip-N{background:var(--no-bg);color:var(--no)}
.chip-M{background:var(--maybe-bg);color:var(--maybe)}
.chip-none{background:var(--none-bg);color:var(--none)}
.x{border:none;background:none;color:var(--muted);font-size:1.2rem;line-height:1;cursor:pointer;padding:0 .2rem}
.x:hover{color:var(--no)}
.empty-list{padding:1rem 0}

/* banners / toasts */
.banner{padding:.7rem .9rem;border-radius:10px;margin-bottom:1rem;font-size:.9rem}
.banner.warning{background:var(--maybe-bg);color:#8a5d00;border:1px solid #f0dca8}
.toasts{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem}
.toast{padding:.6rem .85rem;border-radius:10px;font-size:.9rem;border:1px solid var(--line);background:#fff}
.toast.success{background:var(--yes-bg);color:#0f6e3e;border-color:#bfe6cd}
.toast.error{background:var(--no-bg);color:#9a2730;border-color:#f3c7cb}
.toast.warning{background:var(--maybe-bg);color:#8a5d00;border-color:#f0dca8}
.toast.info{background:#eaf2fb;color:#1c4e80;border-color:#cfe0f3}

/* forms */
.form-card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:1.2rem;box-shadow:var(--shadow);max-width:640px}
.field{margin-bottom:.9rem}
.field label{display:block;font-size:.82rem;color:var(--muted);margin-bottom:.25rem}
.field input,.field textarea,.field select{width:100%;padding:.6rem .7rem;border:1px solid var(--line);border-radius:10px;font-size:.92rem;font-family:inherit}
.field.has-error input{border-color:var(--no)}
.err{color:var(--no);font-size:.78rem;margin:.2rem 0 0}
.form-actions{display:flex;gap:.6rem;margin-top:.5rem}
.empty{text-align:center;padding:3rem 1rem;color:var(--muted)}
.empty .btn{margin-top:1rem}

/* login */
.login-body{display:grid;place-items:center;min-height:100vh;background:linear-gradient(160deg,#f3e7e9,#faf7f5)}
.login-card{background:#fff;border-radius:20px;padding:2rem;box-shadow:var(--shadow);width:min(92vw,360px);text-align:center}
.login-brand{margin-bottom:.6rem}
.login-card h1{font-size:1.25rem;margin:.3rem 0 0}
.login-card form{margin-top:1rem}

/* ===== Invitation wizard ===== */
.wizard{display:grid;grid-template-columns:1fr 380px;gap:1.2rem;align-items:start}
@media(max-width:860px){.wizard{grid-template-columns:1fr}}
.wizard-form{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:1.1rem;box-shadow:var(--shadow)}
.steps{display:flex;gap:.35rem;flex-wrap:wrap;margin-bottom:1rem}
.step{border:1px solid var(--line);background:#fff;border-radius:999px;padding:.35rem .8rem;font-size:.82rem;cursor:pointer;color:var(--muted)}
.step.on{background:var(--rose);border-color:var(--rose);color:#fff}
.panel-step[hidden]{display:none}
.f{margin-bottom:.9rem}
.f > label{display:block;font-size:.8rem;color:var(--muted);margin-bottom:.3rem}
.f .inp,.wizard-form .inp{width:100%}
.wizard-form textarea.inp{min-height:70px;resize:vertical}
.wizard-form input[type=color].inp{width:46px;height:38px;padding:2px;cursor:pointer}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
@media(max-width:560px){.grid2{grid-template-columns:1fr}}
.swatches{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap}
.swatch{width:28px;height:28px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--line);cursor:pointer}
.swatch:hover{transform:scale(1.1)}
.switch{display:inline-flex;align-items:center;gap:.5rem;cursor:pointer;font-size:.9rem}
.switch.sm{font-size:.8rem;color:var(--muted)}
.toggle{margin:.5rem 0}
.chk{width:auto !important}
.reveal{border-left:3px solid var(--line);padding-left:.9rem;margin:.2rem 0 1rem}
.wizard-form hr{border:none;border-top:1px solid var(--line);margin:1rem 0}
.qrow{border:1px solid var(--line);border-radius:12px;padding:.7rem;margin-bottom:.7rem;display:flex;flex-direction:column;gap:.45rem;background:#fdfbfa}
.qrow-opts{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap}
.qrow-opts .x{margin-left:auto}
.wizard-nav{display:flex;gap:.6rem;align-items:center;margin-top:1rem;border-top:1px solid var(--line);padding-top:1rem}
.wizard-nav #next-step,.wizard-nav #publish{margin-left:auto}

.wizard-preview{position:sticky;top:5rem}
@media(max-width:860px){.wizard-preview{position:static}}
.phone{background:#1f1f24;border-radius:30px;padding:10px;box-shadow:var(--shadow);max-width:380px;margin:0 auto}
.phone iframe{width:100%;height:680px;border:none;border-radius:22px;background:#fff;display:block}
.preview-note{text-align:center;margin-top:.5rem}
