:root{--bg:#f6f3f0;--ink:#292635;--muted:#7b7380;--brand:#b76e83;--brand-deep:#8e3f60;--soft:#fbeaf0;--line:#e9e1e3;--cream:#fffdfa;--dark:#1b1b29;--mid:#3a3445;--shadow:0 18px 60px rgba(42,31,42,.09);--radius:22px;--font:-apple-system,BlinkMacSystemFont,"Pretendard Variable","Pretendard","Apple SD Gothic Neo","Malgun Gothic",sans-serif}
*{box-sizing:border-box}html{min-height:100%;scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--bg);font-family:var(--font);font-size:15px;-webkit-font-smoothing:antialiased;overflow-x:hidden}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.4;cursor:not-allowed}button:focus-visible,input:focus-visible{outline:3px solid #dca4b4;outline-offset:3px}a{color:inherit}img{display:block;max-width:100%}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
#app{min-height:100vh}.shell{max-width:1260px;padding:0 26px;margin:auto}.topbar{height:78px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid rgba(160,145,153,.2)}.brand{border:0;background:none;display:flex;align-items:center;gap:11px;padding:3px 0;color:inherit;text-align:left}.logo-sig{width:35px;height:35px;border-radius:50%;border:1px solid var(--brand);display:grid;place-items:center;color:var(--brand);font-size:20px;font-family:Georgia,serif}.brand-title{font-size:18px;font-weight:750;letter-spacing:-.07em;line-height:1.1}.brand-sub{display:block;font-size:9px;letter-spacing:.17em;font-weight:700;color:var(--muted);margin-top:5px}.nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.nav button{background:transparent;color:var(--muted);border:1px solid transparent;padding:10px 12px;border-radius:12px;font-size:13px;font-weight:650}.nav button:hover,.nav button.active{background:white;color:var(--ink);border-color:var(--line)}.nav .nav-rose{background:var(--brand-deep);color:white}.nav .nav-rose:hover{background:#713149;color:white}
.eyebrow{color:var(--brand-deep);font-size:11px;letter-spacing:.21em;font-weight:760}.small-label{color:var(--muted);font-size:11px;letter-spacing:.04em}.section-title{font-size:26px;letter-spacing:-.06em;line-height:1.3;margin:0}.heading-pair{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:22px}.heading-pair p{margin:8px 0 0;color:var(--muted);font-size:13px;line-height:1.7}.page{padding-top:36px;padding-bottom:70px}.divider{border-top:1px solid var(--line);margin:20px 0}.pill{display:inline-flex;gap:6px;align-items:center;border-radius:99px;background:#f5eaec;color:#98556a;padding:7px 11px;font-size:11px;font-weight:750;letter-spacing:.02em}.pill.mono{background:#eeecef;color:#746d7b}.pill.olive{background:#e8f0ec;color:#547668}.pill.dark{background:rgba(255,255,255,.16);color:#fff}
.btn{border:1px solid var(--line);background:#fff;color:var(--ink);padding:12px 17px;border-radius:13px;font-size:13px;line-height:1.5;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-align:center;transition:transform .15s,background .15s,border .15s}.btn:hover:not(:disabled){transform:translateY(-1px);border-color:#dcb5c0}.btn.primary{background:var(--brand-deep);color:#fff;border-color:var(--brand-deep)}.btn.primary:hover:not(:disabled){background:#77304d}.btn.dark{background:var(--dark);color:white;border-color:var(--dark)}.btn.ghost{background:transparent;border-color:#d8cbd0}.btn.soft{background:var(--soft);color:var(--brand-deep);border-color:var(--soft)}.btn.full{width:100%}.btn.tiny{padding:8px 10px;font-size:11px;border-radius:10px}.btn-row{display:flex;gap:10px;flex-wrap:wrap}.btn-row>*{flex:1;min-width:110px}.muted{color:var(--muted)}
.hero{margin-top:24px;position:relative;overflow:hidden;border-radius:28px;background:linear-gradient(115deg,#242030 1%,#4b3044 58%,#7d5963 100%);min-height:375px;color:white;display:grid;grid-template-columns:1.1fr .9fr;box-shadow:var(--shadow)}.hero:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 77% 40%,rgba(255,219,190,.28),transparent 56%);pointer-events:none}.hero-copy{position:relative;z-index:2;padding:57px 5% 48px 8%;display:flex;flex-direction:column;align-items:flex-start}.hero-copy .eyebrow{color:#edbbc8}.hero h1{font-family:Georgia,"Noto Serif KR",serif;font-size:clamp(48px,5.3vw,79px);letter-spacing:-.08em;line-height:1.13;margin:19px 0 6px;font-weight:650}.hero-en{font-size:11px;letter-spacing:.32em;color:#e5c9d5}.hero p{max-width:390px;color:#f0e5ea;line-height:1.85;font-size:14px;margin:26px 0}.hero .btn{padding:14px 30px}.hero-stills{position:relative;z-index:1;display:flex;align-items:flex-end;justify-content:center;margin-right:3%;padding-top:30px}.hero-stills:after{content:"";position:absolute;bottom:0;left:0;right:0;height:25%;background:linear-gradient(transparent,rgba(37,28,41,.54))}.hero-stills img{width:44%;height:330px;object-fit:cover;object-position:center 15%;border-radius:170px 170px 12px 12px;border:4px solid rgba(255,240,246,.2);box-shadow:0 10px 35px rgba(0,0,0,.24)}.hero-stills img+img{height:310px;transform:translateX(-19px)}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:22px 0}.stat{background:white;border:1px solid var(--line);padding:16px 19px;border-radius:16px}.stat strong{font-size:21px;font-weight:770;letter-spacing:-.04em}.stat span{display:block;color:var(--muted);font-size:11px;margin-top:5px}.two-cols{display:grid;grid-template-columns:1.45fr 1fr;gap:20px}.panel{background:var(--cream);border:1px solid var(--line);border-radius:20px;padding:23px}.panel h3{margin:0 0 15px;font-size:17px;letter-spacing:-.04em}.panel p{font-size:13px;color:var(--muted);line-height:1.8}.cast-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.cast-mini{border:0;padding:0;background:transparent;text-align:left}.cast-mini img{height:168px;width:100%;object-fit:cover;object-position:top;border-radius:12px;background:#f3dfe0}.cast-mini strong{display:block;font-size:12px;margin:8px 1px 2px}.cast-mini span{font-size:10px;color:var(--muted)}.notice-inline{font-size:12px;color:var(--muted);line-height:1.75}
.slots-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.slot-card{border:1px solid var(--line);border-radius:18px;padding:22px;background:#fff;min-height:212px;display:flex;flex-direction:column;gap:12px}.slot-card.filled{background:linear-gradient(145deg,#fff,#fdf7f8)}.slot-num{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:11px;letter-spacing:.12em;font-weight:750}.slot-card h3{margin:0;font-size:22px;letter-spacing:-.05em}.slot-card p{margin:0;color:var(--muted);font-size:12px;line-height:1.7}.slot-actions{margin-top:auto;display:flex;gap:8px;flex-wrap:wrap}.slot-actions .btn{flex:1}.name-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:34px;align-items:center;max-width:780px;margin:25px auto}.name-photo{border-radius:20px;width:100%;box-shadow:var(--shadow);border:1px solid var(--line)}.form-field{display:block;width:100%;padding:15px 16px;border:1px solid #d8cbd0;background:white;border-radius:12px;margin:13px 0;font-size:17px}.tiny-note{font-size:11px;color:var(--muted);line-height:1.7}.error{color:#a63b48;font-size:12px;margin-top:6px}
.game-hero{margin-top:22px;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px}.story-main{min-width:0}.episode-progress{display:flex;justify-content:space-between;gap:10px;align-items:center;margin:0 0 11px}.progress-track{height:5px;background:#eae2e5;border-radius:12px;overflow:hidden;margin-bottom:15px}.progress-track span{display:block;height:100%;background:linear-gradient(90deg,#b56c80,#e0adba);transition:width .3s}.stage{position:relative;overflow:hidden;min-height:325px;border-radius:22px;background:radial-gradient(circle at 63% 37%,#eac4c8 0%,#a47a8a 42%,#564657 100%);display:flex;align-items:flex-end;justify-content:center}.stage::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(41,29,45,.15) 70%,rgba(31,20,33,.65)),radial-gradient(ellipse at 23% 30%,rgba(254,248,235,.38),transparent 50%)}.stage[data-scene=house]{background:radial-gradient(circle at 50% 10%,#f6e4c9,#c6abb1 50%,#60596b)}.stage[data-scene=kitchen]{background:linear-gradient(130deg,#dfd6cb,#b6a3a1 52%,#7f686a)}.stage[data-scene=night]{background:radial-gradient(circle at 65% 25%,#ada0b5,#6c607c 45%,#2d3042)}.stage[data-scene=studio]{background:radial-gradient(circle at 50% 20%,#5a496e,#2e263d 65%,#171823)}.stage[data-scene=letter]{background:radial-gradient(circle at 50% 20%,#fae6ec,#bb8eaa 60%,#76516b)}.stage[data-scene=room]{background:radial-gradient(circle at 60% 10%,#f5d9ce,#c3a5aa 60%,#957989)}.stage[data-scene=terrace]{background:radial-gradient(circle at 80% 20%,#877b96,#48435f 55%,#242739)}.stage[data-scene=lounge]{background:radial-gradient(circle at 24% 30%,#dad3cd,#978797 55%,#51495c)}
.stage .stage-motif{position:absolute;inset:0;overflow:hidden;opacity:.5}.stage .stage-motif span{position:absolute;display:block;transform:rotate(-25deg);border:1px solid rgba(255,255,255,.23);width:140%;height:130px;top:31%;left:-13%;border-radius:50%}.stage .stage-motif span+span{top:58%;transform:rotate(17deg)}.stage img{position:relative;z-index:2;object-fit:cover;object-position:top;width:190px;height:276px;border-radius:130px 130px 0 0;border:2px solid rgba(255,255,255,.3);border-bottom:none;box-shadow:0 18px 35px rgba(25,16,22,.14);background:#f7e2e5}.stage img.side{width:160px;height:240px;transform:translateX(16px);opacity:.83;z-index:1}.stage img.front{transform:translateX(-3px)}.stage img.duo{transform:translateX(9px)}.stage .scene-badge{position:absolute;top:18px;left:22px;z-index:3;color:white;text-shadow:0 1px 7px rgba(0,0,0,.28);font-size:11px;letter-spacing:.12em;font-weight:750}.stage .stage-caption{position:absolute;right:16px;bottom:16px;color:white;z-index:4;background:rgba(24,19,32,.38);padding:7px 10px;border-radius:8px;font-size:10px;letter-spacing:.06em;backdrop-filter:blur(8px)}.story-panel{margin-top:13px;border:1px solid var(--line);border-radius:20px;background:white;padding:26px 29px;box-shadow:0 10px 30px rgba(60,45,53,.035)}.story-topline{display:flex;align-items:center;justify-content:space-between;gap:10px}.scene-title{font-size:21px;margin:9px 0 18px;letter-spacing:-.055em}.story-text{display:flex;flex-direction:column;gap:15px;margin-bottom:22px}.speech{background:#fbf7f7;padding:12px 15px;border-left:2px solid #d8a2af;border-radius:2px 11px 11px 2px;line-height:1.86;font-size:14px;white-space:pre-line}.speech .who{color:#9f5d75;font-size:12px;font-weight:750;margin-bottom:4px}.narration{font-size:14px;line-height:1.96;color:#55505c;white-space:pre-line}.narration.italic{font-style:italic;color:#8d6474}.caption-line{font-size:12px;line-height:1.8;color:#9c5874;background:#fbf0f3;padding:10px 12px;border-radius:9px}.options{display:flex;flex-direction:column;gap:9px;margin-top:19px}.choice-btn{border:1px solid #eadfe3;border-radius:13px;background:#fffafa;color:#3e3440;width:100%;text-align:left;padding:14px 16px;display:flex;align-items:flex-start;gap:12px;line-height:1.6}.choice-btn:hover{border-color:#c58099;background:#fff2f5}.choice-btn .choice-num{flex-shrink:0;color:#bb7d91;font-family:Georgia,serif;font-size:15px}.choice-btn .choice-sub{display:block;font-size:11px;color:#81747d;margin-top:3px}.story-footer{display:flex;justify-content:space-between;align-items:center;gap:9px;border-top:1px solid var(--line);padding-top:17px;margin-top:20px}.story-footer .btn{min-width:138px}.story-side{min-width:0}.side-sticky{position:sticky;top:15px;display:flex;flex-direction:column;gap:15px}.side-panel{padding:19px;background:white;border:1px solid var(--line);border-radius:17px}.side-panel h4{font-size:13px;letter-spacing:-.02em;margin:0 0 13px}.side-line{border-top:1px solid var(--line);padding:10px 0;font-size:12px;color:var(--muted);display:flex;justify-content:space-between;gap:9px}.side-line:first-of-type{border-top:0}.side-line b{color:var(--ink)}.side-help{font-size:11px;line-height:1.8;color:var(--muted)}.chip{display:inline-flex;align-items:center;gap:6px;border-radius:8px;padding:7px 9px;background:#f9eff3;color:#a16179;font-size:10px}.sidebar-cast{display:flex;gap:7px;overflow:hidden}.sidebar-cast img{height:71px;min-width:51px;width:51px;object-fit:cover;object-position:top;border-radius:7px}.completion-bar{margin-top:12px;font-size:11px;color:#867682}
.board{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.person-card{background:white;border:1px solid var(--line);border-radius:17px;overflow:hidden;min-width:0}.person-card img{width:100%;height:260px;object-fit:cover;object-position:top;background:#efd6d8}.person-card .person-meta{padding:15px}.person-card h3{font-size:17px;margin:0 0 4px}.person-card p{font-size:12px;color:var(--muted);line-height:1.65;margin:8px 0 0}.person-card .person-label{color:#9b6277;font-size:11px;font-weight:700}.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.cg{overflow:hidden;border:1px solid var(--line);background:white;border-radius:17px;cursor:pointer;text-align:left;padding:0}.cg-frame{position:relative;display:flex;align-items:flex-end;justify-content:center;gap:0;height:205px;background:radial-gradient(circle at 50% 10%,#f5dfe5,#bc93a1 65%,#6a4d67)}.cg-frame.night{background:radial-gradient(circle at 50% 20%,#91829c,#302c44)}.cg-frame.kitchen{background:radial-gradient(circle at 50% 20%,#e8d6ca,#ad9997)}.cg-frame.letter{background:radial-gradient(circle at 50% 20%,#f8e5ec,#bd92ab)}.cg-frame img{height:183px;width:128px;object-fit:cover;object-position:top;border-radius:70px 70px 0 0}.cg-frame img+img{margin-left:-29px}.cg-frame .locked-layer{position:absolute;inset:0;background:rgba(39,32,41,.7);display:grid;place-items:center;color:white;font-size:24px}.cg-desc{padding:12px 15px}.cg-desc strong{font-size:13px}.cg-desc p{font-size:11px;line-height:1.6;color:var(--muted);margin:6px 0 0}.ep-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.ep-card{padding:18px;background:#fff;border:1px solid var(--line);border-radius:15px;min-height:100px}.ep-card h4{font-size:14px;margin:10px 0 4px}.ep-card small{color:var(--muted);font-size:11px}.ep-card.locked{opacity:.52}.ep-card.live{border-color:#ba8295;background:#fff5f7}
.rewatch-layout{display:grid;grid-template-columns:240px 1fr;gap:18px}.rewatch-list{display:flex;flex-direction:column;gap:6px;max-height:720px;overflow:auto}.rewatch-list button{background:white;border:1px solid var(--line);border-radius:10px;padding:10px;text-align:left;font-size:12px;line-height:1.55}.rewatch-list button.active{background:#f9e7ed;border-color:#c893a6}.rewatch-panel{background:white;border:1px solid var(--line);padding:25px;border-radius:17px}.rewatch-panel .story-text{margin-top:17px}.rewatch-control{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:24px}.rewatch-control .btn{min-width:94px}.end-card{max-width:740px;background:#fff;border:1px solid var(--line);border-radius:24px;padding:36px;margin:36px auto 0;text-align:center}.end-card h2{font-family:Georgia,"Noto Serif KR",serif;letter-spacing:-.07em;font-size:35px;margin:10px 0}.end-card p{color:var(--muted);line-height:1.8}.end-portraits{display:flex;justify-content:center;margin:26px 0}.end-portraits img{height:152px;width:112px;object-fit:cover;object-position:top;border:4px solid white;border-radius:70px 70px 10px 10px;box-shadow:0 7px 20px rgba(25,23,28,.11)}.end-portraits img+img{margin-left:-20px}.taglist{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.taglist span{font-size:11px;background:#f8eef2;border-radius:99px;padding:7px 10px;color:#8a526a}.story-note{padding:15px 16px;background:#f8f3f4;border:1px solid var(--line);border-radius:13px;color:#756977;font-size:12px;line-height:1.8}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(15px);padding:12px 18px;background:#25212e;color:white;border-radius:13px;box-shadow:0 12px 35px rgba(0,0,0,.19);opacity:0;transition:.25s;pointer-events:none;font-size:13px;z-index:1000}#toast.visible{opacity:1;transform:translateX(-50%) translateY(0)}.modal-shade{position:fixed;inset:0;background:rgba(18,14,20,.74);z-index:90;display:grid;place-items:center;padding:18px}.modal{max-width:650px;width:100%;background:var(--cream);border-radius:22px;max-height:92vh;overflow:auto;padding:22px}.modal img{max-height:69vh;max-width:100%;width:auto;margin:auto;border-radius:13px}.modal h3{margin:10px 0 8px}.modal p{color:var(--muted);line-height:1.7}.utility-bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.mini-separator{width:1px;height:16px;background:var(--line)}.foot{border-top:1px solid var(--line);padding:25px 0 35px;color:var(--muted);font-size:11px;display:flex;justify-content:space-between;gap:20px;line-height:1.7}.warning{background:#fff8e9;color:#946435;border:1px solid #f3ddaf;border-radius:10px;padding:10px;font-size:11px;line-height:1.7}
@media(max-width:1000px){.game-hero{grid-template-columns:minmax(0,1fr) 245px}.cast-strip{grid-template-columns:repeat(4,minmax(0,1fr))}.board{grid-template-columns:repeat(3,1fr)}.person-card img{height:230px}.hero-stills img{height:300px}.hero-stills img+img{height:285px}}
@media(max-width:800px){.shell{padding:0 18px}.topbar{height:auto;min-height:70px;padding:12px 0;align-items:flex-start}.nav{gap:1px}.nav button{padding:8px 8px;font-size:11px}.hero{grid-template-columns:1fr 260px;min-height:320px}.hero-copy{padding:44px 15px 35px 35px}.hero h1{font-size:47px}.hero p{font-size:12px}.hero-stills img{height:258px}.hero-stills img+img{height:238px}.two-cols{grid-template-columns:1fr}.game-hero{grid-template-columns:1fr}.story-side{order:-1}.side-sticky{position:static;flex-direction:row}.side-panel{flex:1}.story-side .side-panel:nth-child(2){display:none}.stage{min-height:305px}.stage img{height:250px}.board{grid-template-columns:repeat(3,1fr)}.gallery-grid{grid-template-columns:repeat(2,1fr)}.ep-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){.shell{padding:0 13px}.topbar{display:block}.brand-title{font-size:16px}.nav{margin-top:11px;justify-content:space-between;overflow-x:auto;flex-wrap:nowrap;padding-bottom:2px}.nav button{white-space:nowrap;padding:8px 7px;font-size:11px}.page{padding-top:22px}.hero{display:block;min-height:390px;margin-top:13px}.hero-copy{padding:30px 24px 20px;min-height:244px}.hero h1{font-size:52px;margin-top:11px}.hero p{margin:16px 0;font-size:12px}.hero-stills{height:152px;margin:0;justify-content:flex-end;padding-right:22px}.hero-stills img{height:204px;width:142px;transform:translateY(-46px)}.hero-stills img+img{height:186px;width:130px;transform:translate(-17px,-42px)}.stats-grid{grid-template-columns:repeat(2,1fr);gap:9px;margin:14px 0}.stat{padding:12px}.stat strong{font-size:19px}.cast-strip{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.cast-mini img{height:112px;border-radius:9px}.cast-mini strong{font-size:11px}.cast-mini span{font-size:9px}.panel{padding:16px}.heading-pair{align-items:flex-start}.section-title{font-size:23px}.slots-grid{grid-template-columns:1fr;gap:11px}.slot-card{min-height:170px;padding:17px}.name-layout{grid-template-columns:1fr;gap:14px}.name-photo{height:200px;width:152px;object-fit:cover;object-position:top;margin:auto}.stage{min-height:240px;border-radius:16px}.stage img{height:222px;width:156px}.stage img.side{height:193px;width:138px}.stage .scene-badge{top:12px;left:13px;font-size:10px}.story-panel{padding:18px 17px;border-radius:16px}.scene-title{font-size:19px}.story-text{gap:12px}.speech,.narration{font-size:13px}.story-footer{align-items:stretch;flex-wrap:wrap}.story-footer .btn{min-width:0}.story-footer .btn.primary{width:100%}.story-side .side-panel{padding:12px}.side-panel h4{margin:0 0 5px}.side-line{padding:6px 0}.board{grid-template-columns:repeat(2,1fr);gap:9px}.person-card img{height:218px}.person-card .person-meta{padding:12px}.person-card h3{font-size:15px}.gallery-grid{gap:10px}.cg-frame{height:153px}.cg-frame img{height:136px;width:100px}.cg-frame img+img{margin-left:-28px}.ep-grid{grid-template-columns:repeat(2,1fr);gap:8px}.ep-card{padding:12px}.rewatch-layout{grid-template-columns:1fr}.rewatch-list{max-height:none;flex-direction:row;overflow-x:auto}.rewatch-list button{min-width:152px}.rewatch-panel{padding:17px}.end-card{padding:25px 18px}.end-card h2{font-size:28px}.foot{display:block;text-align:center}.btn-row>*{min-width:110px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}