*{box-sizing:border-box}
:root{color-scheme:light;--ink:#281e36;--muted:#60556e;--purple:#633795;--line:#e7dfef;--white:#fff;font-family:system-ui,-apple-system,"Segoe UI","Microsoft YaHei",sans-serif}
[hidden]{display:none!important}
body{margin:0;min-width:280px;min-height:100vh;background:radial-gradient(ellipse at 5% 0,#f1e0ff,transparent 48%),radial-gradient(ellipse at 95% 0,#ffece1,transparent 41%),#f8f4fb;color:var(--ink);font-size:15px}
main,header,footer{width:min(calc(100% - 32px),800px);margin:auto}
header{padding:22px 0;display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center;gap:8px;color:inherit;text-decoration:none;font-weight:800}
.brand span{display:grid;place-items:center;width:33px;height:33px;background:var(--purple);border-radius:10px;color:white}
nav{display:flex;flex-wrap:wrap;gap:10px}
a{color:var(--purple);text-underline-offset:3px}
.hero,.panel{background:#ffffffd9;border:1px solid #fff;box-shadow:0 5px 25px #46325c0b;border-radius:20px;padding:clamp(17px,4vw,30px);margin-bottom:16px}
.hero{background:linear-gradient(120deg,#f5e9ff,#fff0e8)}
.eyebrow{display:inline-block;margin:0 0 8px;color:var(--purple);font-size:12px;font-weight:800;letter-spacing:.08em}
h1,h2,h3,p{margin:0}h1{font-size:clamp(26px,6vw,39px);line-height:1.2;overflow-wrap:anywhere}h2{font-size:21px}h3{font-size:17px}
.hero p,.hint,.status{color:var(--muted);line-height:1.55;overflow-wrap:anywhere}.hero p,.hint{margin-top:7px}
form,.stack{display:grid;gap:13px;margin-top:14px}
label{display:grid;gap:6px;font-weight:650}form p{font-weight:400}
input,textarea,button{font:inherit}
input,textarea{width:100%;padding:10px 12px;line-height:1.45;border:1px solid #d5c7e0;border-radius:10px;background:white;color:var(--ink)}
textarea{resize:vertical}
button,.button{display:inline-flex;justify-content:center;align-items:center;text-align:center;gap:5px;width:fit-content;max-width:100%;border:0;border-radius:10px;background:var(--purple);color:white;font-weight:750;padding:10px 14px;text-decoration:none;cursor:pointer}
.secondary{color:var(--purple);background:#f1e9f9}
button:disabled{opacity:.6;cursor:wait}
:focus-visible{outline:3px solid #854db5;outline-offset:2px}
.actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.boxes{display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:13px}
.box{padding:14px;border-radius:13px;border:1px solid var(--line);background:#fcf9ff}
.box p{margin:6px 0 10px;color:var(--muted)}
.status:not(:empty){margin-top:6px}.status.bad{color:#952447}
.invite{border-radius:13px;background:#f7f2fc;padding:12px;margin-top:12px}
.invite-list{list-style:none;margin:12px 0 0;padding:0}.invite-list li{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 0;border-top:1px solid var(--line);overflow-wrap:anywhere}
footer{padding:8px 0 25px;color:var(--muted);font-size:13px}
.shop-search{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;align-items:end;margin-top:13px}
.shop-list{list-style:none;padding:0;margin:8px 0 0;max-height:250px;overflow:auto}
.shop-list li+li{margin-top:6px}
.shop-list button{width:100%;display:grid;gap:3px;text-align:left;justify-content:start;background:#f7f2fc;color:var(--ink);overflow-wrap:anywhere}
.shop-list button[aria-pressed="true"]{background:#eaddf7;box-shadow:inset 0 0 0 2px #9966bc}
.shop-list small{color:var(--muted);font-weight:500}
.selection-panel{border-color:#dcc8ee}
.shop-preview-actions{margin-top:12px}
.section-divider{height:1px;background:var(--line);margin:22px 0}
@media(max-width:480px){.shop-search{grid-template-columns:1fr}}
@media(max-width:480px){.boxes{grid-template-columns:1fr}.invite-list li{align-items:start}.invite-list li button{white-space:nowrap}}