*{box-sizing:border-box}
html,body{margin:0;height:100%;background:#05070d;color:#e8ecf4;font-family:-apple-system,"Pretendard","Noto Sans KR",sans-serif;word-break:keep-all}
#app{position:relative;height:100dvh;max-width:560px;margin:auto;overflow:hidden}
#bg{position:absolute;inset:0;background:#0b1220 center/cover no-repeat;transition:background-image .6s,filter .6s;filter:brightness(.55)}
#bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,7,13,.2) 0%,rgba(5,7,13,.85) 70%)}
.hidden{display:none!important}
.panel{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;justify-content:center;gap:14px;padding:28px}
h1{font-size:30px;margin:0;letter-spacing:-.5px}
.sub{color:#9aa4b8;font-size:14px;margin:0;line-height:1.6}
form{display:flex;flex-direction:column;gap:10px;margin-top:10px}
input,textarea{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);color:#fff;border-radius:10px;padding:13px;font-size:16px;font-family:inherit}
button{background:#2f6bff;color:#fff;border:0;border-radius:10px;padding:14px;font-size:16px;font-weight:700;font-family:inherit}
button.ghost{background:transparent;color:#9aa4b8;font-weight:500}
.err{color:#ff7a7a;font-size:14px;margin:0;min-height:1em}
#epList{display:flex;flex-direction:column;gap:10px}
.ep{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:16px;text-align:left;font-weight:600}
.ep small{display:block;color:#7dd3fc;font-weight:500;margin-top:4px}
.vent{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.vent label{font-size:14px;color:#cbd5e1}
#play{position:relative;z-index:1;height:100%}
#box{position:absolute;left:0;right:0;bottom:0;padding:22px 20px calc(22px + env(safe-area-inset-bottom));min-height:40%;display:flex;flex-direction:column;gap:12px}
#speaker{font-weight:800;color:#7dd3fc;min-height:1.2em}
#text{font-size:18px;line-height:1.75;min-height:4.5em}
#choices{display:flex;flex-direction:column;gap:10px}
#choices button{background:rgba(47,107,255,.18);border:1px solid #2f6bff;text-align:left;font-weight:600}
#tap{align-self:flex-end;color:#7dd3fc;animation:blink 1.2s infinite}
@keyframes blink{50%{opacity:.2}}
.flash{animation:flash .5s}
@keyframes flash{0%{filter:brightness(1.6)}100%{filter:brightness(.55)}}
.shake{animation:shake .35s}
@keyframes shake{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
#soundBtn{position:absolute;top:calc(12px + env(safe-area-inset-top));right:12px;z-index:3;width:40px;height:40px;padding:0;border-radius:50%;background:rgba(0,0,0,.45);font-size:18px}
