:root{--page: #0f0b06;--ink: #f1e5c4;--muted: #a99a72;--gold: #e6c46e;--gold-deep: #c9a24b;--red: #d8a08f}*{box-sizing:border-box}html,body{margin:0;background:var(--page);color:var(--ink);font-family:Noto Sans KR,Pretendard,sans-serif;-webkit-font-smoothing:antialiased}button{font:inherit}.btn{min-height:48px;padding:12px 18px;border-radius:12px;border:1px solid rgba(216,178,92,.45);background:#d8b25c1a;color:var(--gold);font-weight:700;font-size:.95rem;cursor:pointer}.btn.gold{width:100%;color:#171208;background:linear-gradient(180deg,#e6c46e,#c9a24b);border:none;box-shadow:0 8px 28px #e6c46e40}.btn.ghost{color:var(--muted);background:transparent;border-color:#d8b25c4d}.btn:active{transform:scale(.98)}.stage{width:100%;max-width:480px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column;background:var(--page)}@media(min-width:560px){.stage{box-shadow:0 0 0 1px #d8b25c2e,0 30px 80px #0009}}.scene{position:relative;width:100%;aspect-ratio:2 / 3;max-height:66dvh;overflow:hidden;background:#000}.cold .scene{max-height:none;aspect-ratio:2 / 3}.cold .panel{display:none}.title{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:6px;padding:0 20px 28px;text-align:left;background:linear-gradient(180deg,#0f0b061a,#0f0b0600 30%,#0f0b06bf 62%,#0f0b06f5);border:none;color:var(--ink);cursor:pointer;font:inherit}.rays{position:absolute;top:-20%;left:20%;width:60%;height:90%;background:radial-gradient(ellipse at 50% 0%,#fff0c88c,#fff0c800 65%);pointer-events:none;animation:rays 4s ease-in-out infinite;mix-blend-mode:screen}@keyframes rays{0%,to{opacity:.55;transform:scaleX(1)}50%{opacity:1;transform:scaleX(1.25)}}.title-kicker{font-size:.7rem;letter-spacing:.18em;color:var(--muted)}.title-logo{font-family:Nanum Myeongjo,serif;font-size:3.4rem;line-height:1;font-weight:700;letter-spacing:.04em;color:#fff3cf;text-shadow:0 0 24px rgba(230,196,110,.85),0 0 60px rgba(230,196,110,.45),0 2px 0 rgba(0,0,0,.6);animation:glow 2.4s ease-in-out infinite}@keyframes glow{0%,to{text-shadow:0 0 24px rgba(230,196,110,.85),0 0 60px rgba(230,196,110,.45),0 2px 0 rgba(0,0,0,.6)}50%{text-shadow:0 0 34px rgba(255,220,140,1),0 0 90px rgba(230,196,110,.7),0 2px 0 rgba(0,0,0,.6)}}.title-ep{margin-top:2px;padding:4px 10px;border:1px solid rgba(230,196,110,.7);border-radius:999px;font-size:.82rem;color:var(--gold)}.title-hook{margin-top:8px;font-size:.95rem;line-height:1.6;color:#e6d3a4}.title-cta{margin-top:12px;align-self:stretch;text-align:center;padding:14px;border-radius:12px;color:#171208;font-weight:800;font-size:1rem;background:linear-gradient(180deg,#e6c46e,#c9a24b);box-shadow:0 8px 28px #e6c46e59;animation:breathe 1.8s ease-in-out infinite}.scene-art{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.dark{position:absolute;top:0;right:0;bottom:0;left:0;background:#05030100;transition:background .8s ease;pointer-events:none}.dark.on{background:#0503012e}.flash{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 55%,#fff0c8e6,#fff0c800 60%)}.tone-light .flash{animation:flash .7s ease-out}.tone-open .flash{animation:flash 1s ease-out;background:radial-gradient(circle at 50% 20%,#fffadcf2,#fffadc00 70%)}@keyframes flash{0%{opacity:0}15%{opacity:1}to{opacity:0}}.tone-shake .scene{animation:shake .5s ease}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-5px)}80%{transform:translate(5px)}}.failed .scene-art{filter:saturate(.4) brightness(.7);transition:filter .4s}.spot{position:absolute;transform:translate(-50%,-50%);background:none;border:none;padding:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:56px;min-height:56px;justify-content:center}.spot .ring{width:30px;height:30px;border-radius:50%;border:2px solid rgba(255,240,200,.35);background:#fff0c814}.spot .tag{font-size:.72rem;padding:2px 7px;border-radius:999px;background:#0f0b06b3;color:var(--muted);white-space:nowrap}.spot.live .ring{border-color:var(--gold);background:#e6c46e38;box-shadow:0 0 18px #e6c46e99;animation:breathe 1.6s ease-in-out infinite}.spot.live .tag{color:var(--ink)}.spot:disabled{opacity:.5}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.18)}}.panel{flex:1;padding:12px 16px calc(16px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:10px;max-width:560px;width:100%;margin:0 auto}.hud{display:flex;justify-content:space-between;align-items:center;font-size:.78rem;color:var(--muted)}.sleep{display:flex;align-items:center;gap:8px}.sleep-cells{display:inline-flex;gap:3px}.sleep-cells i{width:16px;height:10px;border-radius:3px;background:#2f6b46}.sleep-cells i.half{background:linear-gradient(90deg,#2f6b46 50%,#3a2a1a 50%)}.sleep-cells i.empty{background:#3a2a1a}.line{margin:0;font-family:Nanum Myeongjo,serif;font-size:1.05rem;line-height:1.75;min-height:3.5rem}.line-shake{color:var(--red)}.line-open{color:var(--gold)}.acts{display:flex;gap:8px}.acts .btn{flex:1}.acts .btn.gold{flex:2;width:auto}.acts .btn.ghost{writing-mode:horizontal-tb;white-space:nowrap}.end{margin-top:6px;display:grid;gap:10px}.end-grade{margin:0;font-size:.9rem;color:var(--muted)}.end-grade b{color:var(--gold);font-size:1.1rem}.verse{margin:0;padding:12px 14px;border:1px solid rgba(230,196,110,.6);border-radius:12px;background:#e6c46e1a;font-family:Nanum Myeongjo,serif;line-height:1.8}.verse-ref{display:block;margin-top:6px;font-size:.78rem;color:var(--gold-deep);font-family:Noto Sans KR,sans-serif}.sheet-scrim{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;background:#0f0b06d9;display:flex;align-items:flex-end}.sheet{width:100%;max-height:80dvh;overflow:auto;background:#f4efe4;color:#1c1a17;border-radius:16px 16px 0 0;padding:16px 18px calc(8px + env(safe-area-inset-bottom))}.sheet-title{margin:0 0 10px;font-size:.78rem;letter-spacing:.12em;color:#6f675d}.v{margin:0 0 8px;font-family:Nanum Myeongjo,serif;line-height:1.8}.vn{color:#9a7016;font-size:.8rem;margin-right:4px}.sheet .btn.ghost{width:100%;margin-top:8px;color:#1c1a17;border-color:#1c1a174d;background:#f4efe4;box-shadow:0 -12px 16px #f4efe4}@media(prefers-reduced-motion:reduce){.cold-art,.spot.live .ring,.tone-shake .scene,.flash,.touch,.rays,.title-logo,.title-cta,.scene-art-in{animation:none!important}.verse-cap{animation:none;opacity:1}}.spot.person .ring{border-color:#c8deff8c;background:#c8deff1f;box-shadow:0 0 14px #c8deff59}.spot.person .tag{color:#dbe8ff}.spot.person.live .ring{border-color:#e8f1ff;background:#dcebff4d;box-shadow:0 0 22px #c8deffd9;animation:breathe 1.6s ease-in-out infinite}.spot.person.live .tag{color:#fff}.scene-art-in{animation:artin 1.1s ease-in-out both}@keyframes artin{0%{opacity:0}to{opacity:1}}.line-hint{color:var(--muted)}@media(max-width:559px){.title{padding-bottom:calc(124px + env(safe-area-inset-bottom))}.title-cta{position:fixed;left:0;right:0;margin:0 auto;bottom:calc(16px + env(safe-area-inset-bottom));width:min(100vw - 40px,440px);z-index:5}.sheet .btn.ghost{position:sticky;bottom:0}}.hubstage{min-height:100dvh}.hub{position:relative;width:100%;height:100dvh;overflow:hidden;background:linear-gradient(180deg,#05070f,#0d0c12 38%,#1a1409 72%,#2a1d0a)}.hub-sky{position:absolute;top:0;right:0;bottom:0;left:0}.hub-sky canvas{display:block;width:100%!important;height:100%!important}.hub-wings{position:absolute;left:50%;bottom:-52%;width:175%;max-width:none;transform:translate(-50%);transform-origin:50% 100%;pointer-events:none;opacity:.92;filter:drop-shadow(0 0 30px rgba(255,230,160,.35));animation:wings 5s ease-in-out infinite}@keyframes wings{0%,to{transform:translate(-50%) translateY(0) scale(1)}50%{transform:translate(-50%) translateY(-10px) scale(1.02)}}.hub-top{position:absolute;left:0;right:0;top:0;padding:calc(14px + env(safe-area-inset-top)) 18px 24px;display:grid;gap:4px;pointer-events:none;background:linear-gradient(180deg,#05070fd9,#05070f00)}.hub-kicker{font-family:Nanum Myeongjo,serif;font-size:1.5rem;font-weight:700;color:#fff3cf;letter-spacing:.06em;text-shadow:0 0 18px rgba(230,196,110,.7)}.hub-line{margin:0;font-size:.86rem;color:#cbbd97;line-height:1.5}.hub-count{font-size:.74rem;color:var(--gold);letter-spacing:.08em}.hub-label{position:absolute;left:0;top:0;display:flex;flex-direction:column;align-items:center;gap:1px;padding:6px 10px 5px;border:none;border-radius:10px;background:#0a08049e;color:var(--ink);cursor:pointer;will-change:transform;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);box-shadow:0 0 0 1px #e6c46e59,0 0 18px #e6c46e26}.hub-label b{font-family:Nanum Myeongjo,serif;font-size:.95rem;white-space:nowrap}.hub-label i{font-style:normal;font-size:.68rem;color:var(--muted);white-space:nowrap}.hub-label:after{content:"";position:absolute;left:50%;top:100%;width:1px;height:14px;background:linear-gradient(#e6c46eb3,#e6c46e00)}.hub-label.locked{opacity:.55;box-shadow:0 0 0 1px #e6c46e2e}.hub-label.done i{color:var(--gold)}.hub-label.edge{opacity:.75}.hub-label.edge:after{display:none}.hub-card{position:absolute;left:12px;right:12px;bottom:calc(14px + env(safe-area-inset-bottom));padding:16px 18px;border-radius:16px;background:#0f0b06e0;border:1px solid rgba(230,196,110,.45);box-shadow:0 20px 60px #0009,0 0 40px #e6c46e1f;display:grid;gap:6px;animation:cardup .45s ease-out both}@keyframes cardup{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}.hub-card-place{font-size:.74rem;color:var(--gold);letter-spacing:.08em}.hub-card-title{font-family:Nanum Myeongjo,serif;font-size:1.7rem;color:#fff3cf;text-shadow:0 0 16px rgba(230,196,110,.5)}.hub-card-hook{margin:0;font-family:Nanum Myeongjo,serif;line-height:1.6;color:#e6d3a4}.hub-card-grade{font-size:.78rem;color:var(--muted)}.hub-card-acts{display:flex;gap:8px;margin-top:6px}.hub-card-acts .btn.gold{flex:2;width:auto}.hub-card-acts .btn.ghost{flex:1}@media(min-width:560px){.hub{height:100dvh}}.guide{margin:0;padding:8px 12px;border-left:2px solid var(--gold);font-size:.86rem;line-height:1.5;color:var(--gold);background:#e6c46e12}@media(prefers-reduced-motion:reduce){.hub-wings,.hub-card{animation:none!important}}.tone-knock .scene-art{animation:knock .9s ease-out;transform-origin:64% 50%}@keyframes knock{0%,to{transform:scale(1)}6%{transform:scale(1.012) translate(1px)}12%{transform:scale(1)}30%{transform:scale(1.012) translate(-1px)}36%{transform:scale(1)}52%{transform:scale(1.014) translate(1px)}60%{transform:scale(1)}}.tone-knock .flash{animation:flash .9s ease-out;background:radial-gradient(circle at 64% 50%,#ffdca073,#ffdca000 35%)}@media(prefers-reduced-motion:reduce){.tone-knock .scene-art{animation:none}}.hub-vignette{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,#0000 45%,#0504028c)}@media(min-width:560px){.hub-wings{bottom:-46%;width:160%}}.hub-label[hidden]{display:none}.hub-next{position:absolute;left:12px;right:12px;bottom:calc(14px + env(safe-area-inset-bottom));display:flex;align-items:stretch;gap:8px;padding:10px 10px 10px 14px;border-radius:14px;background:#0f0b06d1;border:1px solid rgba(230,196,110,.35);box-shadow:0 16px 40px #00000080;animation:cardup .5s ease-out both}.hub-next-pick{flex:1;display:grid;gap:1px;text-align:left;padding:0;border:none;background:none;color:var(--ink);cursor:pointer;min-width:0}.hub-next-kicker{font-size:.7rem;color:var(--gold);letter-spacing:.08em}.hub-next-pick b{font-family:Nanum Myeongjo,serif;font-size:1.15rem;color:#fff3cf;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hub-next-pick i{font-style:normal;font-size:.74rem;color:var(--muted);white-space:nowrap}.hub-next .btn.gold.hub-next-go{width:auto;flex:0 0 auto;padding:12px 16px;min-height:48px;align-self:center}