*{box-sizing:border-box}
:root{--bg:#f6f1ea;--card:#fff;--ink:#2a2420;--muted:#7a6f66;--line:#e8e0d6;--ok:#2f7d4f;--warn:#b3261e}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
a{color:var(--accent)}
.top{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1.2rem;max-width:1100px;margin:0 auto}
.brand{font-weight:700;text-decoration:none;color:var(--ink)}
.top nav{display:flex;gap:1rem;align-items:center}
.top nav a{text-decoration:none;color:var(--muted)}
.wrap{max-width:720px;margin:0 auto;padding:0 1rem 4rem}
.wrap.wide{max-width:1100px}
.card{background:var(--card);border-radius:16px;padding:1.4rem 1.5rem;margin:0 0 1.1rem;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.narrowcard{max-width:460px;margin:3rem auto}
.danger{border:1px solid #f1c9c5}
h1{margin:0 0 .3rem;font-size:1.9rem;line-height:1.2}
h2{margin:0 0 .8rem;font-size:1.25rem;display:flex;align-items:baseline;gap:.6rem}
h3{margin:1rem 0 .3rem;font-size:.95rem;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.muted{color:var(--muted)} .small{font-size:.86rem}
.error{color:var(--warn)}
.flashes{margin:.5rem 0 1rem}
.flash{background:#eaf5ee;color:#1d5134;padding:.6rem .9rem;border-radius:10px;margin-bottom:.4rem}
.banner{width:100%;height:auto;display:block;border-radius:16px;margin-bottom:1.1rem}
.banner.preview{max-width:360px}
.hosted{color:var(--muted);margin:0 0 1rem}
.facts{list-style:none;padding:0;margin:0 0 1rem}
.facts li{display:flex;gap:.7rem;padding:.35rem 0}
.facts.plain li{display:list-item}
.ico{font-size:1.2rem}
.desc{border-top:1px solid var(--line);padding-top:1rem}
label{display:block;margin:.6rem 0;font-size:.9rem;color:var(--muted)}
input,textarea,select{display:block;width:100%;margin-top:.25rem;padding:.6rem .7rem;border:1px solid var(--line);border-radius:10px;font:inherit;color:var(--ink);background:#fff}
input[type=checkbox],input[type=radio]{display:inline;width:auto;margin:0 .35rem 0 0}
input[type=color]{padding:.2rem;height:2.6rem;width:5rem}
textarea{resize:vertical}
.row{display:flex;gap:.8rem;align-items:flex-end;flex-wrap:wrap}
.row>label,.row>input{flex:1 1 200px}
.row>.narrow{flex:0 0 150px}
label.check{flex:0 1 auto;display:flex;align-items:center;color:var(--ink);padding-bottom:.6rem}
.btn{display:inline-block;background:var(--accent);color:#fff;border:0;border-radius:10px;padding:.65rem 1.2rem;font:inherit;font-weight:600;cursor:pointer;text-decoration:none;margin:.3rem .2rem .3rem 0}
.btn.small{padding:.45rem .85rem;font-size:.9rem}
.btn.ghost{background:transparent;color:var(--accent);border:1.5px solid var(--accent)}
.btn.warn{background:var(--warn)}
.linkbtn{background:none;border:0;color:var(--muted);text-decoration:underline;cursor:pointer;font:inherit;font-size:.85rem;padding:0}
form.inline{display:inline}
.choices{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:.4rem}
.choice{margin:0;flex:1 1 120px}
.choice input{position:absolute;opacity:0}
.choice span{display:block;text-align:center;padding:.75rem;border:2px solid var(--line);border-radius:12px;color:var(--ink);font-weight:600;cursor:pointer}
.choice input:checked+span{border-color:var(--accent);background:var(--accent);color:#fff}
.choice input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.status{padding:.6rem .8rem;border-radius:10px;background:#f4efe8}
.save-acct{margin-top:1rem;border-top:1px solid var(--line);padding-top:.8rem}
.save-acct summary{cursor:pointer;color:var(--accent);font-weight:600}
.count{font-size:.9rem;color:var(--muted);font-weight:400}
.names{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.4rem}
.names li{background:#f4efe8;padding:.3rem .75rem;border-radius:999px}
.plus{color:var(--muted);font-size:.85rem}
.pot{list-style:none;padding:0;margin:0 0 .8rem}
.pot li{display:flex;justify-content:space-between;align-items:center;gap:.8rem;flex-wrap:wrap;padding:.6rem 0;border-bottom:1px solid var(--line)}
.pot li.open strong{color:var(--accent)}
.claim{display:flex;gap:.4rem;align-items:center}
.claim input{margin:0;padding:.4rem .6rem;width:14rem}
.add-dish input{margin:0}
.upload{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;margin-bottom:1rem}
.filepick input{display:none}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.6rem}
.grid figure{margin:0}
.grid img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;display:block}
.grid figcaption{font-size:.8rem;color:var(--muted);display:flex;justify-content:space-between}
.head-row{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;flex-wrap:wrap}
.evlist{list-style:none;padding:0;margin:1rem 0}
.evlist li{display:flex;gap:.8rem;align-items:center;flex-wrap:wrap;padding:.7rem 0;border-bottom:1px solid var(--line)}
.pill{font-size:.8rem;padding:.15rem .6rem;border-radius:999px;background:#f0ebe4;color:var(--ink);white-space:nowrap}
.s-yes{background:#e3f3e8;color:#1d5134}.s-maybe{background:#fbf1d9;color:#7a5a12}.s-no{background:#f6e3e1;color:#7d2a22}
.stats{display:flex;gap:1.6rem;flex-wrap:wrap;margin-top:.8rem}
.stats div{color:var(--muted);font-size:.85rem}.stats b{display:block;font-size:1.6rem;color:var(--ink)}
.tablewrap{overflow-x:auto}
table.guests{width:100%;border-collapse:collapse;font-size:.92rem}
.guests th{text-align:left;color:var(--muted);font-weight:500;font-size:.8rem;border-bottom:1px solid var(--line);padding:.4rem}
.guests td{border-bottom:1px solid var(--line);padding:.55rem .4rem;vertical-align:top}
details.edit summary{cursor:pointer;color:var(--accent);font-size:.85rem}
.editbox{position:absolute;right:1rem;z-index:5;background:#fff;border:1px solid var(--line);border-radius:12px;padding:.8rem 1rem;width:300px;box-shadow:0 8px 24px rgba(0,0,0,.12)}
.editbox label{margin:.35rem 0}
fieldset.send{border:1px solid var(--line);border-radius:12px;margin:1.2rem 0;padding:.6rem 1rem 1rem}
fieldset.send legend{font-weight:600;padding:0 .4rem}
.addguests{margin-top:1rem}
input.full{width:100%}
code{background:#f4efe8;padding:.1rem .35rem;border-radius:5px}
@media (max-width:600px){h1{font-size:1.55rem}.card{padding:1.1rem}.claim{width:100%}.claim input{flex:1;width:auto}}
