:root{font-family:system-ui,-apple-system,"Pretendard","Noto Sans KR",sans-serif;color:#edf1fb;background:#0d1220;font-synthesis:none}
*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{overflow-x:hidden}button,input,textarea,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.hidden{display:none!important}.orb{position:fixed;z-index:-1;border-radius:100%;filter:blur(90px);pointer-events:none;opacity:.35}.orb-a{background:#5334ad;width:580px;height:450px;top:-180px;right:-210px}.orb-b{background:#174e82;width:540px;height:400px;left:-260px;bottom:-210px}.shell{max-width:1200px;margin:auto;min-height:100vh;padding:0 32px}.topbar{height:98px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff0e}.brand{display:flex;gap:12px;align-items:center}.brand-logo{border:1px solid #786ce1;background:linear-gradient(140deg,#8b81f9,#405cc8);border-radius:15px;display:grid;place-items:center;width:44px;height:44px;font-size:28px}.brand b{display:block;font-size:17px;letter-spacing:1px}.brand em{font-style:normal;color:#a9a5ff}.brand small{display:block;color:#788399;font-size:11px;margin-top:3px}.classic-link{border:1px solid #ffffff21;border-radius:10px;padding:11px 16px;color:#b8c2d6;font-size:12px;background:#ffffff07}.classic-link:hover{background:#ffffff13}.selection{padding:62px 0 70px}.eyebrow{font-size:12px;color:#aaadfa;letter-spacing:2.8px;font-weight:800}.spark{font-size:18px}.selection h1{font-size:clamp(29px,5vw,49px);line-height:1.27;letter-spacing:-1.9px;font-weight:800;margin:15px 0 12px}.selection h1 span{background:linear-gradient(115deg,#a4a2fc,#63c8f9);background-clip:text;-webkit-background-clip:text;color:transparent}.subtitle{color:#a8b1c5;font-size:15px;line-height:1.8;margin:0 0 34px}.controls{display:flex;gap:13px}.searchbox{display:flex;gap:11px;align-items:center;background:#171f33;border:1px solid #303a55;border-radius:12px;flex:1;max-width:530px;padding:0 17px;color:#9ea6c2}.searchbox span{font-size:24px}.searchbox input{background:transparent;border:none;outline:none;color:#fff;width:100%;height:49px;font-size:14px}.searchbox input::placeholder{color:#76809a}#originFilter{background:#171f33;color:#c1c9df;border:1px solid #303a55;padding:0 13px;border-radius:12px;font-size:13px}.counter{color:#8f9bb3;font-size:13px;margin:29px 0 15px}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.character{display:flex;flex-direction:column;text-align:left;min-height:207px;border:1px solid #2b354d;background:linear-gradient(155deg,#1b2540 0%,#161e31 95%);border-radius:17px;padding:22px 19px 17px;color:#fff;transition:transform .2s,border-color .2s,background .2s;overflow:hidden;position:relative}.character:hover{transform:translateY(-3px);border-color:#847de3;background:#252c4c}.character:focus-visible{outline:3px solid #928aff;outline-offset:2px}.character .symbol{font-size:29px;margin:0 0 15px}.character h3{font-size:17px;margin:0 0 7px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.character p{color:#a6b1c7;font-size:12px;line-height:1.55;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;flex:1}.character .tag{display:inline-flex;color:#a7aff9;font-size:11px;margin-top:14px;align-items:center;gap:4px}.character.default{background:linear-gradient(135deg,#494eaa,#2a4c83);border-color:#777cea}.character.default p{color:#dedfff}.character.default .tag{color:#f0eaff}.footnote{color:#76839f;font-size:11px;line-height:1.7;margin-top:30px}.chat{max-width:820px;margin:20px auto 0;height:calc(100vh - 118px);min-height:600px;border:1px solid #303a53;background:#131b2c;border-radius:19px;display:flex;flex-direction:column;overflow:hidden}.chat-top{display:flex;gap:12px;padding:15px 18px;align-items:center;border-bottom:1px solid #ffffff13}.ghost{width:38px;height:38px;border:1px solid #ffffff18;border-radius:10px;background:transparent;color:#c3cbdd;font-size:23px}.current-icon{font-size:22px;background:#30375e;width:40px;height:40px;display:grid;place-items:center;border-radius:12px}.current-text{flex:1;min-width:0}.current-text strong{display:block;font-size:16px}.current-text span{display:block;color:#8d99b4;font-size:11px;margin-top:3px}.textbutton{border:none;background:transparent;color:#a6b1cb;font-size:12px}.messages{flex:1;min-height:0;overflow-y:auto;padding:25px 25px 18px;display:flex;flex-direction:column;gap:18px}.bubble{max-width:88%;line-height:1.78;word-break:break-word;white-space:pre-wrap;font-size:14px;border-radius:15px;padding:13px 17px}.bubble.user{align-self:flex-end;background:#4d56a7;border-bottom-right-radius:5px}.bubble.assistant{align-self:flex-start;background:#252e44;border:1px solid #ffffff0d;border-bottom-left-radius:5px}.intro{align-self:center;text-align:center;max-width:560px;color:#afb9d1;line-height:1.8;padding:24px;font-size:14px}.intro .big{font-size:46px;margin-bottom:13px}.intro strong{display:block;font-size:20px;color:#e8ebf5;margin-bottom:8px}.bottom{border-top:1px solid #ffffff15;padding:12px 20px 15px}.compose-meta{display:flex;justify-content:space-between;align-items:center;color:#8a9bb7;font-size:11px;margin-bottom:11px}.search-mode select{font-size:11px;color:#c1c9e5;background:#202940;border:1px solid #394661;border-radius:7px;padding:4px 6px;margin-left:5px}#chatForm{display:flex;align-items:flex-end;gap:9px;background:#202940;border:1px solid #3d4863;border-radius:13px;padding:8px}.attach{font-size:23px;color:#a3b0d1;padding:4px 8px;cursor:pointer;line-height:31px}#prompt{flex:1;resize:none;border:0;background:transparent;color:#f6f8fd;min-height:35px;max-height:150px;outline:none;line-height:1.5;padding:6px 0}#prompt::placeholder{color:#7e8ba5}#send{border:0;border-radius:9px;background:#8283ef;color:#fff;font-size:21px;width:37px;height:37px}.chat-tip{color:#6e7c95;font-size:10px;text-align:center;margin:11px 0 0}.imgpreview{display:flex;align-items:center;gap:10px;font-size:12px;color:#b4c3d7;margin:9px 2px}.imgpreview img{width:45px;height:45px;object-fit:cover;border-radius:7px}.imgpreview button{background:transparent;border:none;color:#ef9da6}.busy{opacity:.65;pointer-events:none}#send:disabled{opacity:.45;cursor:not-allowed}@media(max-width:900px){.cards{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:650px){.shell{padding:0 15px}.topbar{height:72px}.selection{padding:38px 0 50px}.selection h1{letter-spacing:-1px}.subtitle{font-size:13px}.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.character{min-height:186px;padding:17px 13px}.character h3{font-size:15px}.character p{font-size:11px}.controls{flex-wrap:wrap}.searchbox{max-width:none;flex:1 0 100%}#originFilter{height:42px}.chat{height:calc(100dvh - 86px);min-height:400px;margin:8px auto;border-radius:13px}.messages{padding:17px 13px}.bubble{max-width:96%;font-size:13px}.bottom{padding:10px}.brand small{font-size:9px}.classic-link{font-size:11px;padding:8px 10px}}@media(max-width:355px){.cards{grid-template-columns:1fr}}

.source-credit{display:inline-block;color:#aaaaff;font-size:10px;margin-top:3px;text-decoration:underline;text-underline-offset:3px}

/* RAG provenance activity; no synthetic hidden chain-of-thought */
.stage-box{align-self:stretch;background:#17243c;border:1px solid #384c70;border-radius:13px;padding:12px 14px;line-height:1.5;word-break:break-word}
.stage-heading{font-size:13px;font-weight:700;color:#b6d3ff;margin-bottom:8px}
.stage-line{font-size:12px;color:#aebed9;margin:5px 0}
.stage-line.success{color:#8dd8c7}
.stage-line.warn{color:#f8ba9e}
.stage-line.muted{color:#788da9}
.stage-sources{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.stage-sources a{font-size:11px;color:#b9dcff;text-decoration:underline;text-underline-offset:2px;padding:4px 6px;background:#243655;border-radius:5px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.header-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:end}@media(max-width:650px){.header-actions{gap:4px}.header-actions .classic-link{font-size:10px;padding:8px 7px}}
/* v4: real character portraits, image history, and scene-driven chat */
.character{padding:0;min-height:228px}.character-portrait{height:158px;min-height:158px;display:grid;place-items:center;font-size:40px;background:linear-gradient(145deg,#2a3555,#172039);overflow:hidden}.character-portrait .avatar-photo{width:100%;height:100%;object-fit:cover;object-position:50% 18%;display:block}.character-info{padding:13px 15px 14px;display:flex;flex-direction:column;min-width:0;flex:1}.character-info h3{margin:0 0 5px}.character-info p{margin:0;flex:1}.character-info .tag{margin-top:8px}.character.default .character-portrait{background:linear-gradient(135deg,#6864d7,#2a4c83)}
.current-icon{overflow:hidden;flex-shrink:0}.current-icon .avatar-photo{width:100%;height:100%;object-fit:cover;object-position:center 16%}.avatar-fragment{display:contents}
.intro-avatar{width:110px;height:130px;border-radius:18px;overflow:hidden;display:grid;place-items:center;font-size:48px;background:#263858;margin:0 auto 12px}.intro-avatar .avatar-photo{height:100%;width:100%;object-fit:cover;object-position:center top}
.message-row{display:flex;align-items:flex-end;gap:8px;max-width:100%}.message-row.user{justify-content:flex-end}.message-avatar{border-radius:11px;width:36px;height:40px;flex-shrink:0;overflow:hidden;background:#344268;display:grid;place-items:center}.message-avatar .avatar-photo{width:100%;height:100%;object-fit:cover;object-position:center top}.message-row .bubble{max-width:min(88%,660px)}.message-image{width:auto;height:auto;max-width:min(100%,340px);max-height:340px;object-fit:contain;border-radius:11px;display:block;margin-top:8px;cursor:zoom-in;background:#151d32}.message-row.user .bubble{min-width:100px}
.scene-panel{padding:8px 16px 7px;border-bottom:1px solid #303a53;background:#1b2944;font-size:12px}.scene-panel select{background:#2b3853;color:#e5eaf7;border:1px solid #556789;border-radius:8px;padding:5px 9px;max-width:65vw}.scene-intro{background:#1d3045;border:1px solid #33516b;border-radius:12px;padding:14px 17px;align-self:stretch;font-size:12px;color:#b9cedd;line-height:1.8;white-space:pre-wrap}.scene-intro strong{display:block;font-size:13px;color:#dceafc;margin-bottom:8px}.scene-intro div{white-space:pre-wrap}
.controls{flex-wrap:wrap}#seriesFilter{background:#171f33;color:#c1c9df;border:1px solid #303a55;padding:0 13px;border-radius:12px;font-size:13px;max-width:240px}
@media(max-width:650px){.character{min-height:214px}.character-portrait{height:130px;min-height:130px}.character-info{padding:11px}.character-info h3{font-size:13px}.character-info p{font-size:10px}#seriesFilter{height:42px;flex:1;min-width:120px;max-width:100%}.scene-panel select{max-width:74vw}.message-avatar{width:31px;height:35px}}

/* v5: Double chat portrait width and height, without changing lobby card size. */
.chat-top .current-icon{width:80px;height:80px;min-width:80px;border-radius:15px;font-size:44px;overflow:hidden}
.message-row.assistant .message-avatar{width:72px;height:80px;min-width:72px;border-radius:14px}
.intro-avatar{width:220px;height:260px;max-width:80vw;border-radius:20px;font-size:92px}
.chat-top .current-icon .avatar-photo,.message-row .message-avatar .avatar-photo,.intro-avatar .avatar-photo{width:100%;height:100%;object-fit:cover}
/* Buttons remain visible on mobile without obscuring the title. */
.header-actions{flex-shrink:0}
.header-actions button.classic-link{font:inherit;font-size:12px;cursor:pointer}
.header-actions .classic-link{white-space:nowrap}
@media(max-width:650px){
 .header-actions button.classic-link{font-size:10px;padding:8px 7px}
 .brand small{font-size:9px}
 .brand-logo{width:36px;height:36px}
 .chat-top .current-icon{width:80px;height:80px;min-width:80px}
 .message-row.assistant .message-avatar{width:72px;height:80px;min-width:72px}
}
/* Admin-only browser CharX upload dialog */
.upload-dialog{color:#eef3ff;background:#172139;border:1px solid #546184;border-radius:19px;max-width:min(94vw,540px);width:100%;padding:25px;box-shadow:0 28px 75px #0009}
.upload-dialog::backdrop{background:rgba(3,8,18,.79);backdrop-filter:blur(5px)}
.upload-dialog .upload-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.upload-dialog h2{font-size:22px;margin:0 0 10px}
.upload-dialog p{line-height:1.75;font-size:13px;color:#abb9d4}
.upload-dialog b{color:#eef3ff}
.upload-dialog .upload-label{display:block;margin:17px 0 7px;color:#dbe5ff;font-size:13px;font-weight:600}
.upload-dialog input[type=file],.upload-dialog input[type=password]{width:100%;min-height:44px;color:#e6edff;background:#222f49;border:1px solid #4c5b80;border-radius:9px;padding:10px}
.upload-dialog input[type=file]::file-selector-button{color:#fff;background:#435a93;border:0;border-radius:6px;padding:7px 10px;margin-right:10px}
.upload-dialog .upload-hint{font-size:11px;color:#8998b3}
.upload-dialog .upload-close{font-size:16px;color:#bcc9e3;background:transparent;border:0;padding:10px}
.upload-dialog progress{width:100%;height:15px;accent-color:#8894fa}
.upload-dialog .upload-status{min-height:22px;white-space:pre-line;color:#cfdbf2}
.upload-dialog .upload-submit{width:100%;padding:13px;background:#656bd5;border:0;border-radius:10px;color:#fff;font-size:14px;font-weight:700}
.upload-dialog .upload-submit:disabled{opacity:.6;cursor:wait}
@media(max-width:500px){
  .topbar{height:auto;min-height:80px;gap:12px;padding:12px 0;flex-wrap:wrap}
  .header-actions{width:100%;justify-content:flex-end}
  .chat{height:calc(100dvh - 136px)}
}

/* v6 media composer and history editing */
.mic{border:1px solid #53638f;border-radius:9px;background:#273a55;color:#fff;min-width:36px;height:36px;font-size:19px;cursor:pointer}.mic.recording{background:#9b233e;animation:pulse 1s infinite}@keyframes pulse{50%{opacity:.5}}
.message-actions{display:flex;gap:8px;align-items:center;justify-content:flex-end;padding-top:7px}.message-actions button{color:#b6c9f8;background:#ffffff10;border:1px solid #ffffff1c;border-radius:7px;padding:3px 8px;font-size:11px;cursor:pointer}.message-actions button:hover{background:#ffffff23}
.attach-preview{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.attach-preview img{width:64px;height:64px;object-fit:cover;border-radius:6px}.attach-preview audio,.bubble audio{max-width:min(100%,310px)}.attach-preview button{background:none;border:none;color:#e6a7ad}.message-image{max-height:300px}.bubble audio{display:block;margin-top:8px}

/* v6 native video player for attachments and message history. */
.attached-video{max-width:min(280px,100%);max-height:170px;border-radius:10px;background:#000}
.message-video{display:block;max-width:min(100%,440px);max-height:310px;border-radius:10px;margin-top:8px;background:#000}

/* v7: collapsible chrome and activity, persistent media-only bubbles */
.header-fold>summary,.chat-header-fold>summary,.footer-fold>summary{cursor:pointer;color:#b5c4e4;font-size:12px;padding:8px 12px;user-select:none}
.header-fold>summary{border-bottom:1px solid #ffffff13}.header-fold>summary span{font-size:10px;color:#7f91b2;margin-left:12px}
.header-fold .topbar{min-height:64px;height:auto;padding:12px 0}.chat-header-fold .chat-top{padding:10px 15px}
.footer-fold{margin-bottom:6px}.footer-fold .chat-tip{margin:5px 0 12px}.footer-fold a{color:#aabcf7}
.compose-meta{flex-wrap:wrap;gap:8px;margin-top:8px}.log-choice select{background:#202940;color:#c1c9e5;border:1px solid #394661;border-radius:7px;padding:4px;font-size:11px}
body.chat-open{height:100dvh;overflow:hidden}body.chat-open .shell{height:100dvh;display:flex;flex-direction:column;padding-bottom:8px;min-height:0}
body.chat-open .header-fold{flex-shrink:0}body.chat-open .chat{flex:1;width:100%;min-height:0;height:auto;margin:6px auto 0;max-height:none}
.chat-header-fold{flex-shrink:0}.stage-box>summary{cursor:pointer;margin:0}.stage-box[open]>summary{margin-bottom:8px}
.stage-content{max-height:260px;overflow:auto}.scene-asset{display:block;max-width:100%;max-height:370px;object-fit:contain;border-radius:10px;margin:8px 0}
.bubble:has(>audio),.bubble:has(>video),.bubble:has(>img){min-width:160px}.upload-dialog{max-height:92dvh;overflow:auto}
@media(max-width:650px){body.chat-open .shell{padding:0 7px 5px}.header-fold .topbar{padding:7px 0;gap:6px;min-height:0}.chat-header-fold .current-icon{height:48px;width:48px;min-width:48px}.header-fold .brand small{display:none}.chat-header-fold>summary,.header-fold>summary,.footer-fold>summary{padding:6px 9px}.bottom{padding:7px}.messages{gap:12px}.scene-intro{max-height:180px;overflow:auto}}

/* V7 card fix: keep the current-scene preview at two readable mobile lines. */
.scene-intro{flex-shrink:0}
@media(max-width:650px){
 .scene-intro{max-height:none;overflow:visible;padding:10px 12px}
 .scene-intro .scene-text{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;line-height:1.65;min-height:3.3em;max-height:3.3em;overflow:hidden;white-space:normal;overflow-wrap:anywhere;word-break:keep-all}
 .scene-intro strong{margin-bottom:5px}
}
@font-face{font-family:PS5Math;src:url('/roleplay/fonts/latinmodern-math.otf') format('opentype');font-display:swap}
.rp-math{font-family:PS5Math,'Cambria Math','STIX Two Math',math;font-size:1.12em;white-space:normal;max-width:100%}
.rp-math[display="block"]{display:block math;overflow-x:auto;overflow-y:hidden;padding:.45em 0;margin:.35em 0;text-align:center}
.bubble,.bubble>div,.scene-text{min-width:0}
.chat-code{max-width:100%;overflow:auto;white-space:pre;padding:.7em;border-radius:.5em;background:rgba(0,0,0,.18)}
.math-source{white-space:pre-wrap;overflow-wrap:anywhere}
