*{box-sizing:border-box}html,body{margin:0;height:100%}
body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;background:#f4f4f2;color:#1a1a1a;-webkit-text-size-adjust:100%}
a{color:#1a1a1a}
.wrap{max-width:640px;margin:0 auto;padding:24px 18px}
header.top{display:flex;align-items:center;gap:10px;padding:12px 16px;background:#fff;border-bottom:1px solid #e6e6e3;position:sticky;top:0;z-index:5}
header.top img{width:28px;height:28px}header.top b{font-size:16px;letter-spacing:.5px}header.top .sp{flex:1}
.btn{display:inline-block;border:0;border-radius:22px;background:#111;color:#fff;padding:12px 22px;font-size:16px;text-decoration:none;cursor:pointer}
.btn.ghost{background:#fff;color:#111;border:1px solid #cfcfca}.btn.sm{padding:6px 12px;font-size:13px}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.hero{text-align:center;padding:56px 0 24px}.hero img{width:72px;height:72px}.hero h1{font-size:26px;margin:18px 0 10px;line-height:1.4}
.muted{color:#777;font-size:13px;line-height:1.7}.card{background:#fff;border-radius:14px;padding:18px;margin:14px 0;line-height:1.75}
footer{text-align:center;padding:24px 0 36px}footer a{color:#888;font-size:13px;margin:0 8px}
/* chat */
.chat{display:flex;flex-direction:column;height:100dvh;height:100vh}
@supports(height:100dvh){.chat{height:100dvh}}
#log{flex:1;overflow-y:auto;padding:14px 12px 8px;-webkit-overflow-scrolling:touch}
.row{display:flex;margin:8px 0}.row.u{justify-content:flex-end}
.b{max-width:82%;padding:10px 13px;border-radius:16px;line-height:1.65;font-size:15px;white-space:pre-wrap;word-break:break-word}
.row.k .b{background:#fff;border:1px solid #e4e4e0;border-top-left-radius:6px}
.row.u .b{background:#1f1f1f;color:#fff;border-top-right-radius:6px}
.row.c .b{background:#fff;border:1px solid #d9cfba;border-top-left-radius:6px}
.b .wl{display:block;margin-top:10px;text-align:center}
.dots{display:inline-flex;gap:4px;padding:4px 2px}.dots i{width:7px;height:7px;border-radius:50%;background:#aaa;animation:d 1.2s infinite}
.dots i:nth-child(2){animation-delay:.2s}.dots i:nth-child(3){animation-delay:.4s}@keyframes d{0%,80%,100%{opacity:.25}40%{opacity:1}}
.slow{display:block;font-size:13px;color:#888;margin-top:4px}
.notice{text-align:center;color:#8a6d3b;font-size:13px;margin:10px 0}
#bar{background:#fff;border-top:1px solid #e6e6e3;padding:8px 10px calc(8px + env(safe-area-inset-bottom))}
#bar .in{display:flex;gap:8px;align-items:flex-end}
#t{flex:1;resize:none;border:1px solid #d6d6d2;border-radius:18px;padding:10px 14px;font-size:16px;max-height:140px;font-family:inherit;background:#fafaf8}
#cnt{font-size:11px;color:#999;text-align:right;padding:2px 6px 0}
#startbox{text-align:center;padding:30px 10px}
form.wl input,form.wl textarea{width:100%;border:1px solid #d6d6d2;border-radius:10px;padding:12px;font-size:16px;margin:6px 0 12px;font-family:inherit}