/* 다시, 봄 — 밤에 여는 연애 앱. 숯빛 바탕 + 코랄 핑크, 스토리 카드, 둥근 글꼴 + 손글씨. */
:root{--bg:#121014;--bg2:#1d1a21;--ink:#f6eff2;--ink2:#b9adb5;--c:#ff6f8e;--cd:#ff8fa8;--line:#2c2731;
  --f:"Gowun Dodum",-apple-system,"Apple SD Gothic Neo",system-ui,sans-serif;--d:"Jua",sans-serif;--h:"Gaegu",cursive}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:#0b0a0d}
body{margin:0;font-family:var(--f);color:var(--ink);font-size:15.5px;line-height:1.55;background:#0b0a0d}
a{color:inherit;text-decoration:none}
.app{position:relative;max-width:480px;margin:0 auto;background:var(--bg);min-height:100vh}
.logo{position:absolute;z-index:4;top:14px;left:16px;font-family:var(--d);font-size:22px;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.5)}
.ph{background:#2a2530;color:#d9cfd6;display:grid;place-items:center;font-size:12px;font-weight:700;text-align:center;width:100%;overflow:hidden}
.stories{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.stories::-webkit-scrollbar{display:none}
.story{position:relative;flex:0 0 100%;scroll-snap-align:start}
.story .ph,.story img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.story::before{content:"";position:absolute;z-index:3;top:8px;left:12px;right:12px;height:3px;border-radius:3px;background:linear-gradient(90deg,#fff 33%,rgba(255,255,255,.35) 33%)}
.story:nth-child(2)::before{background:linear-gradient(90deg,#fff 66%,rgba(255,255,255,.35) 66%)}
.story:nth-child(3)::before{background:#fff}
.s-txt{position:absolute;left:0;right:0;bottom:0;padding:24px 20px 26px;background:linear-gradient(transparent,rgba(18,16,20,.92))}
.hand{font-family:var(--h);font-size:22px;color:var(--cd);margin:0 0 4px}
h1,h2{font-family:var(--d);font-weight:400;margin:0;line-height:1.25;letter-spacing:-.01em}
h1{font-size:34px}
.s-txt h2{font-size:30px}
.teaser{padding:26px 16px 8px;display:flex;flex-direction:column;gap:6px}
.bub{max-width:80%;padding:10px 14px;border-radius:20px;font-size:15px}
.bub.you{background:var(--bg2);border-bottom-left-radius:6px;align-self:flex-start}
.bub.me{background:var(--c);color:#24060d;border-bottom-right-radius:6px;align-self:flex-end}
.picks{display:flex;flex-direction:column;gap:12px;padding:18px 16px}
.pick{position:relative;display:block;border-radius:22px;overflow:hidden}
.pick .ph,.pick img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
.pick span{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;align-items:flex-end;padding:18px 18px 16px;background:linear-gradient(transparent,rgba(0,0,0,.8))}
.pick b{font-family:var(--d);font-weight:400;font-size:22px}
.pick i{font-style:normal;font-family:var(--f);font-size:12px;background:var(--c);color:#24060d;border-radius:999px;padding:2px 8px;vertical-align:4px}
.pick em{font-style:normal;font-family:var(--d);font-size:19px;color:var(--cd)}
.others{padding:10px 0 6px}
.others .hand{padding:0 16px}
.scroller{display:flex;gap:10px;overflow-x:auto;padding:6px 16px 4px;scrollbar-width:none}
.scroller::-webkit-scrollbar{display:none}
.scroller a{flex:0 0 132px;display:flex;flex-direction:column;justify-content:flex-end;height:150px;padding:14px;border-radius:20px;background:var(--bg2)}
.scroller b{font-family:var(--d);font-weight:400;font-size:18px;line-height:1.2}
.scroller s{color:var(--ink2);font-size:13px;margin-top:6px}
.scroller em{font-style:normal;color:var(--cd);font-size:15px;margin-top:2px}
.faq{padding:26px 16px 10px}
.faq h2{font-size:22px;margin-bottom:8px}
.about{color:var(--ink2);font-size:14px;margin:0 0 10px}
details{background:var(--bg2);border-radius:16px;padding:14px 16px;margin-bottom:8px}
summary{cursor:pointer;list-style:none}
summary::-webkit-details-marker{display:none}
summary::after{content:"⌄";float:right;color:var(--cd)}
details[open] summary::after{content:"⌃"}
details p{margin:8px 0 0;color:var(--ink2)}
details a{color:var(--cd)}
.foot{padding:20px 16px 30px;font-size:12px;color:#a59aa2;line-height:1.7}
.foot .biz a{color:#a59aa2}
.mine{display:inline-block;margin-top:12px;color:var(--cd);font-size:14px}
.sticky{position:sticky;z-index:9;bottom:calc(14px + env(safe-area-inset-bottom));display:block;margin:0 16px calc(14px + env(safe-area-inset-bottom));
  text-align:center;background:var(--c);color:#24060d;font-family:var(--d);font-size:19px;border-radius:999px;padding:15px;box-shadow:0 8px 24px rgba(255,111,142,.35)}

/* ── 신청: 밤 채팅 ───────────────────────── */
body.chat{background:#0b0a0d}
.chatwin{max-width:480px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;background:var(--bg)}
.chatbar{position:sticky;top:0;z-index:3;display:flex;align-items:center;gap:12px;height:56px;padding:0 16px;background:var(--bg);border-bottom:1px solid var(--line)}
.chatbar .back{font-size:22px;line-height:1}
.chatbar .who b{font-family:var(--d);font-weight:400;font-size:20px;color:var(--cd)}
.chatbar .restart{margin-left:auto;font:inherit;font-size:13px;color:var(--ink2);background:none;border:0;cursor:pointer}
.log{flex:1;padding:16px 14px 8px;display:flex;flex-direction:column}
.msg{max-width:80%;padding:10px 14px;border-radius:20px;font-size:15.5px;line-height:1.45;margin:3px 0;animation:in .2s both;word-break:keep-all;overflow-wrap:anywhere}
@keyframes in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.msg.bot{background:var(--bg2);border-bottom-left-radius:6px}
.msg.me{margin-left:auto;background:var(--c);color:#24060d;border-bottom-right-radius:6px}
.msg.edit{cursor:pointer}
.msg.typing{color:var(--ink2);letter-spacing:3px}
.msg.pay{background:#fff;color:#191519;max-width:92%}
.msg.pay .amt{font-family:var(--d);font-size:32px;display:block;margin:2px 0 6px;color:#d93a5e}
.msg.pay .acct{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:14px;font-weight:700}
.msg.pay .cp{font:inherit;font-size:12.5px;border:0;border-radius:999px;background:#191519;color:#fff;padding:4px 10px;cursor:pointer}
.msg.err{background:#3a1820;color:#ffc2cf}
.composer{position:sticky;bottom:0;z-index:3;padding:10px 12px calc(12px + env(safe-area-inset-bottom));background:var(--bg);border-top:1px solid var(--line)}
.composer form.row{display:flex;gap:8px;align-items:center}
.composer input,.composer textarea,.composer select{flex:1;min-width:0;font:inherit;font-size:16px;color:var(--ink);background:var(--bg2);border:1px solid transparent;border-radius:22px;padding:11px 15px;outline:none;color-scheme:dark}
.composer textarea{resize:none;height:84px;border-radius:16px}
.composer input:focus,.composer textarea:focus{border-color:var(--c)}
.composer input[type=file]{background:none;padding:6px 0}
.composer .send{flex:none;font-family:var(--d);font-size:16px;background:var(--c);color:#24060d;border:0;padding:11px 16px;border-radius:22px;cursor:pointer}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opts button{font:inherit;font-size:15px;color:var(--ink);background:var(--bg2);border:1px solid var(--line);padding:9px 15px;cursor:pointer;border-radius:999px}
.opts button.hot{background:var(--c);color:#24060d;border-color:var(--c)}
.opts.grid4{display:grid;grid-template-columns:repeat(4,1fr)}
.opts.grid4 button{padding:9px 0;font-size:13.5px}
.skip{display:block;margin:10px auto 0;background:none;border:0;color:var(--ink2);font:inherit;font-size:13.5px;text-decoration:underline;cursor:pointer}
.agree{font-size:12.5px;color:var(--ink2);margin:6px 0 10px;line-height:1.55}
.agree a{color:var(--cd)}
.warn{display:inline-block;font-family:var(--h);font-size:22px;color:var(--cd);margin:0 0 6px}
.thumbs{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}
.thumbs span{width:46px;height:80px;border-radius:6px;background:#333 center/cover}
.pick .ph span,.story .ph span{display:none}
.foot{padding-bottom:20px}