:root{--bg:#fffaf7;--panel:#fff;--bd:#efe2db;--accent:#e5486e;--dim:#9b8e88;--text:#2a2320;--up:#2e9e6b;--down:#d1445f;--well:#fdf3ef;--up-rgb:46 158 107}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.6 Pretendard Variable,Pretendard,Noto Sans KR,system-ui,sans-serif;height:var(--app-height,100vh);flex-direction:column}body,header{display:flex}header{align-items:center;gap:12px;padding:10px 16px;background:var(--panel);border-bottom:1px solid var(--bd)}header h1{font-size:16px;margin:0;font-weight:800}header .sub{font-size:12px;color:var(--dim)}.brand{display:flex;flex-direction:column;gap:7px;flex:1 1;min-width:0}.titlerow{display:flex;align-items:baseline;gap:10px}.tabrow{display:flex;align-items:center;gap:12px;flex-wrap:wrap;width:100%}.tabrow[hidden]{display:none}.tabrow #graph-open{margin-left:auto}#tabs{display:inline-flex;gap:2px;background:var(--well);border:1px solid var(--bd);border-radius:6px;padding:2px}#tabs .tab{border:none;background:transparent;padding:5px 14px;border-radius:4px;font-size:12.5px;color:var(--dim);cursor:pointer}@media (hover:hover){#tabs .tab:hover{color:var(--accent)}}#tabs .tab.active{background:#fff;color:var(--text);font-weight:700;box-shadow:0 1px 2px rgba(0,0,0,.06)}.packpick{font-size:12px;color:var(--dim);display:flex;align-items:center;gap:6px}.packpick select{border:1px solid var(--bd);border-radius:4px;padding:4px 8px;font-size:12px;font-family:inherit;color:var(--text);background:#fff;cursor:pointer;max-width:230px}#settings-wrap{position:relative;display:inline-flex}header button#settings-open{padding:5px 12px;border:1px solid var(--bd);border-radius:6px;background:#fff;cursor:pointer;font-size:12.5px;color:var(--text)}@media (hover:hover){header button#settings-open:hover{border-color:var(--accent);color:var(--accent)}}#settings-panel{position:absolute;top:calc(100% + 6px);right:0;z-index:40;background:#fff;border:1px solid var(--bd);border-radius:10px;box-shadow:0 12px 34px rgba(0,0,0,.14);padding:12px 14px;min-width:210px;display:flex;flex-direction:column;gap:9px}#settings-panel[hidden]{display:none}#settings-panel .sp-head{font-size:11px;font-weight:800;color:var(--dim);letter-spacing:.08em;text-transform:uppercase}#settings-panel .sp-hint{font-weight:600;font-size:10.5px;letter-spacing:0;text-transform:none;color:var(--dim);opacity:.8}#settings-panel .sp-row{display:flex;align-items:center;justify-content:space-between;gap:14px;font-size:12.5px;color:var(--text)}#settings-panel .sp-row select{border:1px solid var(--bd);border-radius:4px;padding:4px 8px;font-size:12px;font-family:inherit;color:var(--text);background:#fff;cursor:pointer}header button#reset{padding:5px 12px;border:1px solid var(--bd);border-radius:6px;background:#fff;cursor:pointer;font-size:12.5px;color:var(--text)}@media (hover:hover){header button#reset:hover{border-color:var(--accent);color:var(--accent)}}#hud{display:flex;justify-content:center;background:var(--panel);border-bottom:1px solid var(--bd)}#hud .row{max-width:760px;justify-content:space-between;gap:18px;padding:9px 18px}#hud .row,#meter{flex:1 1;display:flex;align-items:center}#meter{position:relative;gap:9px;font-size:12.5px;color:var(--dim);max-width:420px}#meter .bar{flex:1 1;height:10px;border-radius:6px;background:var(--well);overflow:hidden;border:1px solid var(--bd)}#meter .fill{height:100%;width:0;background:var(--accent);transition:width .3s,background .3s}#meter .fill.flash-up{background:var(--up)}#meter .fill.flash-down{background:var(--down)}#meter .val{font-weight:800;color:var(--accent);min-width:5ch;text-align:right;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}#meter .delta{position:absolute;right:0;top:calc(100% + 2px);font-size:13px;font-weight:800;pointer-events:none;z-index:6;animation:delta-float 1.2s ease-out forwards}#meter .delta.up{color:var(--up)}#meter .delta.down{color:var(--down)}@keyframes delta-float{0%{opacity:0;transform:translateY(8px)}20%{opacity:1}to{opacity:0;transform:translateY(-8px)}}#timer{display:flex;align-items:baseline;gap:6px;font-size:12px;color:var(--dim);flex:none}#timer .t{font-weight:800;font-size:18px;color:var(--text);font-feature-settings:"tnum";font-variant-numeric:tabular-nums;letter-spacing:.02em}#timer.low .t{color:var(--down)}#view-data{flex:1 1;overflow:auto;padding:22px 28px 60px;background:var(--bg)}#view-data[hidden]{display:none}#view-play{flex:1 1;display:flex;flex-direction:column;min-height:0}#view-play[hidden]{display:none}#graph-overlay{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;background:rgba(42,35,32,.45)}#graph-overlay[hidden]{display:none}#graph-overlay .gpanel{background:#fff;border-radius:14px;box-shadow:0 18px 50px rgba(0,0,0,.25);width:min(92vw,900px);max-height:90vh;overflow:auto;padding:16px 22px 20px;display:flex;flex-direction:column}#graph-overlay .ghead{display:flex;align-items:center;gap:10px;margin-bottom:2px}#graph-overlay .ghead h2{font-size:12px;color:var(--accent);letter-spacing:.12em;text-transform:uppercase;margin:0 auto 0 0}#graph-overlay .ghead button{padding:4px 12px;border:1px solid var(--bd);border-radius:6px;background:#fff;cursor:pointer;font-size:12px;color:var(--text)}@media (hover:hover){#graph-overlay .ghead button:hover{border-color:var(--accent);color:var(--accent)}}#graph-overlay .legend{font-size:11px;color:var(--dim);margin:0 0 8px;line-height:1.5}#graph svg{display:block;width:100%;height:auto}header button#graph-open{padding:5px 12px;border:1px solid var(--bd);border-radius:6px;background:#fff;cursor:pointer;font-size:12.5px;color:var(--text)}@media (hover:hover){header button#graph-open:hover{border-color:var(--accent);color:var(--accent)}}header h1{cursor:pointer}@media (hover:hover){header h1:hover{color:var(--accent)}}#appbody,#viewcol{flex:1 1;display:flex;min-height:0}#viewcol{flex-direction:column;min-width:0}#sidebar{width:236px;flex:none;overflow-y:auto;background:var(--panel);border-right:1px solid var(--bd);padding:10px 8px 24px;display:flex;flex-direction:column;gap:2px}#sidebar .sb-head{font-size:11px;font-weight:800;color:var(--dim);letter-spacing:.08em;padding:10px 8px 4px}#sidebar .sb-item{display:flex;align-items:center;gap:9px;padding:7px 8px;border:1px solid transparent;border-radius:9px;background:transparent;cursor:pointer;font-family:inherit;text-align:left;width:100%}@media (hover:hover){#sidebar .sb-item:hover{background:var(--well)}}#sidebar .sb-item.current{background:var(--well);border-color:var(--accent);cursor:default}#sidebar .sb-face{width:36px;height:36px;border-radius:50%;border:1.5px solid var(--bd);background:var(--well) center/cover no-repeat;display:grid;place-items:center;font-size:14px;font-weight:800;color:var(--dim);overflow:hidden;flex:none}#sidebar .sb-text{min-width:0;flex:1 1}#sidebar .sb-name{font-size:13.5px;font-weight:800;color:var(--text);display:flex;align-items:center;gap:6px}#sidebar .sb-unlocked{font-size:9px;font-weight:800;color:var(--up);border:1px solid rgb(var(--up-rgb)/45%);background:linear-gradient(rgb(var(--up-rgb)/9%) 0 0),#fff;border-radius:999px;padding:1px 5px;line-height:1.35}#sidebar .sb-nick{font-size:11px;color:var(--dim);line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#cast-open{display:none}#cast-open .ham{display:block;width:18px;height:14px;background:linear-gradient(currentColor,currentColor) 0 0/100% 1.5px no-repeat,linear-gradient(currentColor,currentColor) 0/100% 1.5px no-repeat,linear-gradient(currentColor,currentColor) 0 100%/100% 1.5px no-repeat}#sidebar-backdrop{position:fixed;inset:0;background:rgba(42,35,32,.45);z-index:55}#sidebar-backdrop[hidden]{display:none}@media (max-width:680px){#cast-open{display:inline-flex;align-items:center;justify-content:center;align-self:center;padding:6px;border:none;background:transparent;color:var(--dim);cursor:pointer}@media (hover:hover){#cast-open:hover{color:var(--accent)}}#sidebar{position:fixed;left:0;top:0;bottom:0;width:min(82vw,300px);transform:translateX(-100%);transition:transform .25s ease;z-index:60;box-shadow:0 0 40px rgba(0,0,0,.28)}#sidebar.open{transform:translateX(0)}}main{min-width:0;min-height:0;max-width:760px;width:100%;margin:0 auto}#chat,main{flex:1 1;display:flex;flex-direction:column}#chat{overflow:auto;padding:18px 18px 8px;gap:9px}.msgrow{display:flex;gap:8px;align-items:flex-end;max-width:82%}.msgrow.npc{align-self:flex-start}.msgrow.me{align-self:flex-end;flex-direction:row-reverse}.pt{width:34px;height:34px;border-radius:50%;border:1.5px solid var(--bd);background:var(--well) center/cover no-repeat;flex:none;display:grid;place-items:center;font-size:13px;font-weight:700;color:var(--dim);overflow:hidden}.msg{padding:8px 12px;border-radius:13px;font-size:14px;line-height:1.5}.npc .msg{background:#fff;border:1px solid var(--bd);border-bottom-left-radius:4px}.me .msg{background:#fde7ee;border:1px solid #f5c9d7;border-bottom-right-radius:4px}.narr{align-self:center;color:var(--dim);font-size:12.5px;padding:2px 6px;text-align:center;white-space:pre-line}.msgrow.typing .msg{color:var(--dim);letter-spacing:2px;animation:typing-pulse 1s ease-in-out infinite}@keyframes typing-pulse{0%,to{opacity:.35}50%{opacity:1}}.ending{align-self:stretch;margin:8px 0;padding:14px 16px;border-radius:12px;border:1px solid var(--bd);background:var(--well);text-align:center}.ending .t{font-size:16px;font-weight:800;margin-bottom:6px}.ending.success .t{color:var(--up)}.ending.fail .t{color:var(--down)}.ending .x{font-size:13px;line-height:1.6;color:var(--text)}#actions{border-top:1px solid var(--bd);background:var(--panel);padding:12px 16px 16px;display:flex;flex-direction:column;gap:7px}#actions .cap{font-size:11px;color:var(--dim);letter-spacing:.1em;text-transform:uppercase}button.opt{padding:10px 14px;border:1px solid var(--bd);border-radius:10px;background:#fff;cursor:pointer;font-size:14px;color:var(--text);text-align:left;line-height:1.45}@media (hover:hover){button.opt:hover{border-color:var(--accent);background:var(--well)}}button.topic{padding:9px 14px;border:1px solid var(--bd);border-radius:20px;background:#fff;cursor:pointer;font-size:13.5px;color:var(--text)}@media (hover:hover){button.topic:hover{border-color:var(--accent);color:var(--accent)}}button.finish{padding:11px 14px;border:1px solid var(--accent);border-radius:10px;background:var(--accent);color:#fff;font-weight:800;font-size:14px;cursor:pointer}.topicrow{display:flex;flex-wrap:wrap;gap:7px}@media (max-width:680px){header{padding:8px 10px}header h1{font-size:15px}.titlerow .sub{display:none}.tabrow{gap:8px;row-gap:6px}.tabrow #graph-open{margin-left:auto}.tabrow #graph-open,.tabrow #reset,.tabrow #settings-open{height:32px;padding:0 10px;font-size:12px;display:inline-flex;align-items:center}#tabs .tab{height:26px;padding:0 12px;font-size:12px;display:inline-flex;align-items:center}.packpick{display:none}#hud .row{padding:8px 12px;gap:12px}#meter{max-width:none}}button.opt,button.topic{transition:opacity .15s,border-color .15s}#actions.locked button{pointer-events:none;opacity:.45}#actions.locked button.picked{opacity:1;border-color:var(--accent);background:var(--well)}.dv{max-width:1020px;margin:0 auto;display:flex;flex-direction:column;gap:26px}.dv section.card{border:1px solid #e5e5ea;border-radius:8px;background:#fcfcfc;padding:0;display:block;overflow:hidden}.dv h2{font-size:11px;margin:0;padding:9px 14px;color:#c0392b;letter-spacing:.12em;text-transform:uppercase;border-bottom:1px solid #e5e5ea;background:#f7f7f8}.dv .body{padding:12px 14px}.dv code.id{font:11.5px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;color:#455a64;background:#f7f7f8;border:1px solid #e5e5ea;border-radius:3px;padding:0 4px}.dv .ov{display:flex;flex-wrap:wrap;gap:5px 22px;font-size:12.5px;line-height:1.5;color:#1c1c1e}.dv .ov-item .k{color:#8e8e93;margin-right:6px}.dv .cast-hero{display:flex;gap:18px;align-items:flex-start;margin-bottom:16px}.dv .hero-pt{flex:0 0 auto;width:192px;height:192px;border-radius:12px;border:1.5px solid #e5e5ea;background:#f7f7f8 50%/cover no-repeat;display:grid;place-items:center;font-size:64px;font-weight:800;color:#8e8e93;overflow:hidden}.dv .hero-desc{flex:1 1;min-width:0;display:flex;flex-direction:column;gap:8px;padding-top:6px}.dv .hero-name{font-size:20px;font-weight:800;color:#1c1c1e;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.dv .hero-nick{font-size:12.5px;font-weight:700;color:#c0392b;background:#faeeec;border-radius:4px;padding:2px 8px}.dv .hero-role{font-size:12px;color:#8e8e93}.dv .hero-tag{font-size:14px;color:#1c1c1e;line-height:1.55;margin-top:2px}.dv .hero-tip{font-size:12.5px;color:#455a64;line-height:1.55;background:#f4f4f5;border:1px solid #e5e5ea;border-radius:6px;padding:8px 11px}.dv .hero-tip .tip-k{font-weight:700;color:#c0392b;margin-right:6px}@media (max-width:560px){.dv .cast-hero{flex-direction:column;text-align:center}.dv .cast-hero,.dv .hero-desc{align-items:center}}.dv .castgrid{display:flex;flex-wrap:nowrap;gap:10px;overflow-x:auto;padding-bottom:4px}.dv .npc{flex:0 0 auto;width:60px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px}.dv .npc .pt{width:48px;height:48px;border-radius:50%;border:1.5px solid #e5e5ea;background:#f7f7f8 50%/cover no-repeat;display:grid;place-items:center;font-size:16px;font-weight:700;color:#8e8e93;overflow:hidden}.dv .npc .nname{font-size:11.5px;font-weight:700;color:#1c1c1e;line-height:1.2;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dv .npc .nrole{font-size:10px;color:#8e8e93;line-height:1.2;max-width:100%;word-break:keep-all;overflow-wrap:break-word;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.dv .npc.xcard{display:none}.dv .castgrid.show-extras .npc.xcard{display:flex}.dv .extras-row{margin-top:12px}.dv .extras-btn{border:1px solid #e5e5ea;border-radius:4px;background:#fff;cursor:pointer;font-size:12px;color:#8e8e93;padding:4px 10px}.dv .extras-btn:hover{border-color:#c0392b;color:#c0392b}.dv .quests{display:flex;flex-direction:column;gap:14px}.dv .q{border:1px solid #e5e5ea;border-radius:8px;background:#fff;overflow:hidden}.dv .q>.qtop{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;padding:9px 12px;background:#f7f7f8;border-bottom:1px solid #e5e5ea}.dv .q .qtitle{font-size:14px;font-weight:800}.dv .q .qmeta{font-size:11.5px;color:#8e8e93}.dv .q .qmeta b{color:#455a64;font-weight:700}.dv .q .qdesc{font-size:12.5px;color:#1c1c1e;padding:9px 12px 4px;line-height:1.55}.dv .obj-list{padding:4px 12px 12px;display:flex;flex-direction:column;gap:10px}.dv .obj-card{border-left:3px solid #e5e5ea;padding:2px 0 2px 10px}.dv .obj-card .olabel{font-size:12.5px;font-weight:700;color:#1c1c1e}.dv .turns{margin-top:8px;display:flex;flex-direction:column;gap:7px}.dv .msgrow{display:flex;gap:7px;align-items:flex-end;max-width:88%}.dv .msgrow.n{align-self:flex-start}.dv .msgrow.p{align-self:flex-end;flex-direction:row-reverse}.dv .msgrow .av{width:30px;height:30px;border-radius:50%;border:1.5px solid #e5e5ea;background:#f7f7f8 50%/cover no-repeat;display:grid;place-items:center;font-size:11px;font-weight:700;color:#8e8e93;overflow:hidden;flex:none}.dv .line{padding:6px 11px;border-radius:11px;font-size:12.5px;line-height:1.5}.dv .line.p{background:#fdf1ef;border:1px solid #f0d4cf;border-bottom-right-radius:3px}.dv .line.n{background:#f4f4f5;border:1px solid #e5e5ea;border-bottom-left-radius:3px}.dv .beat{margin-top:8px}.dv .beat+.beat{margin-top:12px;padding-top:10px;border-top:1px dashed #e5e5ea}.dv .beat-label{font-size:11px;font-weight:700;color:#8e8e93;letter-spacing:.02em;margin-bottom:4px}.dv .beat .bn{font-size:12.5px;color:#1c1c1e;background:#f4f4f5;border:1px solid #e5e5ea;border-radius:10px;padding:6px 11px;display:inline-block;line-height:1.5}.dv .opts{margin-top:5px;display:flex;flex-direction:column;gap:4px}.dv .opt{font-size:12px;line-height:1.5;padding:6px 9px;border:1px solid #eee;border-radius:6px}.dv .opt .who{font-weight:700;color:#455a64;margin-right:2px}.dv .opt .opt-p{color:#1c1c1e}.dv .opt .opt-n{color:#5f6368;margin-top:2px;padding-left:14px;position:relative}.dv .opt .opt-n:before{content:"\21b3";position:absolute;left:0;color:#c0c0c6}.dv .opt .opt-n.variant{color:#8e5a2b}.dv .opt .opt-n em{color:#8e8e93}.dv .opt .aff{flex:none;font-weight:800;font-size:11px;padding:0 6px;border-radius:8px}.dv .opt .aff.pos{color:#2e7d32;background:#e7f6ee}.dv .opt .aff.neg{color:#b3261e;background:#fbe7ec}.dv .opt .aff.zero{color:#8e8e93;background:#f2f2f4}.dv .outcome{font-size:12.5px;line-height:1.55;padding:8px 0;border-bottom:1px solid #e5e5ea}.dv .outcome:last-child{border-bottom:none}.dv .outcome .oc-title{font-weight:800;margin-right:8px}.dv .outcome.success .oc-title{color:#2e7d32}.dv .outcome .ohead{margin-bottom:2px}.dv .outcome .osummary{color:#5f6368}.dv .outcome .olines{margin-top:8px;display:flex;flex-direction:column;gap:7px;max-width:560px}.dv .outcome .onarr{align-self:flex-start;color:#8e8e93;font-size:12px;text-align:left;line-height:1.55;padding:0 4px}.dv .outcome.fail .oc-title{color:#b3261e}#cg-root{flex:1 1;display:flex;flex-direction:column;min-height:0}