
:root{--bg:#fff7f8;--card:#fff;--tx:#2a1a20;--mu:#7a6670;--pr:#e0245e;--bd:#f0dde2;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#1a1216;--card:#271b21;--tx:#f7eef1;--mu:#b9a5ad;--bd:#3a2a32}}
:root[data-theme=dark]{--bg:#1a1216;--card:#271b21;--tx:#f7eef1;--mu:#b9a5ad;--bd:#3a2a32}
*{box-sizing:border-box}html,body{margin:0}body{background:var(--bg);color:var(--tx);font:15px/1.4 system-ui,sans-serif;max-width:560px;margin:auto;min-height:100vh}
#app{padding:12px 12px 80px}h1{font-size:20px;margin:0 0 10px;color:var(--pr)}h2{font-size:17px;margin:12px 0 6px}
.c{background:var(--card);border:1px solid var(--bd);border-radius:16px;padding:12px;margin-bottom:10px}
button,.b{background:var(--pr);color:#fff;border:0;border-radius:12px;padding:10px 14px;font:inherit;font-weight:600;cursor:pointer}
.g{background:transparent;color:var(--tx);border:1px solid var(--bd)}
input,textarea{width:100%;padding:10px;border-radius:10px;border:1px solid var(--bd);background:var(--bg);color:var(--tx);font:inherit;margin:4px 0}
nav{position:fixed;bottom:0;left:0;right:0;max-width:560px;margin:auto;background:var(--card);border-top:1px solid var(--bd);display:flex;padding-bottom:env(safe-area-inset-bottom,0px)}
nav a{flex:1;text-align:center;padding:10px 0;font-size:12px;color:var(--mu);cursor:pointer}nav a b{display:block;font-size:20px}nav a.on{color:var(--pr)}
.ph{width:100%;height:340px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:110px;object-fit:cover;position:relative}
.dots{position:absolute;top:8px;left:8px;right:8px;display:flex;gap:4px}.dots i{flex:1;height:3px;border-radius:2px;background:#fff6}.dots i.on{background:#fff}
.row{display:flex;gap:8px;align-items:center}.av{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:26px;flex:none;object-fit:cover}
.m{max-width:80%;padding:8px 12px;border-radius:14px;margin:4px 0;background:var(--bd)}.m.me{background:var(--pr);color:#fff;margin-left:auto}
.pill{display:inline-block;background:var(--bd);border-radius:20px;padding:2px 10px;font-size:12px}
.mem{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.mem div{aspect-ratio:1;background:var(--pr);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:32px;color:#fff;cursor:pointer}.mem div.o{background:var(--card);border:1px solid var(--bd)}
.bl{filter:blur(6px)}#t{position:fixed;top:calc(12px + env(safe-area-inset-top,0px));left:50%;transform:translateX(-50%);background:#000c;color:#fff;padding:8px 16px;border-radius:20px;z-index:9;display:none}
.bd{display:grid;grid-template-columns:repeat(8,1fr);border-radius:8px;overflow:hidden;margin:10px 0}.bd div{aspect-ratio:1;display:flex;align-items:center;justify-content:center;background:#f0d9b5}.bd div.k{background:#8a5a3c}.bd div.s{outline:3px solid #ffd54a;outline-offset:-3px}.bd div.t{background:#5a8a3c}.pc{width:76%;height:76%;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px;box-shadow:0 2px 4px #0007}.p1{background:#d32f2f}.p2{background:#222}.tb{background:#1d6b3a;border-radius:14px;padding:10px;min-height:90px;display:flex;flex-wrap:wrap;gap:4px;margin:8px 0}.dt{display:inline-flex;background:#fffdf0;color:#111;border-radius:6px;border:1px solid #999;font-weight:700;cursor:pointer}.dt i{font-style:normal;width:26px;height:30px;display:flex;align-items:center;justify-content:center}.dt i+i{border-left:2px solid #333}.dt.on{outline:3px solid #ffd54a}.m3{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}.m3 div{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:28px;background:var(--bd);border-radius:8px}.m3 div.s{outline:3px solid var(--pr)}.pt{display:flex;gap:6px;flex-wrap:wrap}.pt>*{width:30%;height:90px;border-radius:10px;object-fit:cover}
body{--bg:#100f25;--card:#1b1a38;--tx:#f5f0e1;--mu:#a9a6c4;--pr:#e0b04a;--bd:#2e2c55}button,.b{color:#1a1530}.m.me{color:#1a1530}.bk{display:block;padding:10px 12px 0;color:var(--pr);text-decoration:none;font-size:13px}
button:disabled{opacity:.5} .row{flex-wrap:wrap} .row>*{min-width:0} .m{overflow-wrap:anywhere} .ph{height:min(340px,65vh)} nav button{flex:1;padding:8px 2px;background:none;color:var(--mu);font-size:12px} nav button.on{color:var(--pr)} nav b{display:block;font-size:20px} .bd button,.m3 button{padding:0;aspect-ratio:1;border-radius:2px} .bd button{background:#f0d9b5} .bd button.k{background:#8a5a3c} .selected{outline:3px solid gold;outline-offset:-3px} .photos{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px} .photos img{width:100%;aspect-ratio:1;object-fit:cover} label{display:block;margin:8px 0} select{max-width:100%;padding:8px} #notice{color:var(--pr);min-height:24px;padding:0 12px} a{color:var(--pr)} .mem button{aspect-ratio:1;padding:4px;font-size:25px} .m3 button{background:var(--bd);font-size:26px} .muted{color:var(--mu)}