@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=Noto+Sans+KR:wght@400;500;700;900&display=swap');
:root{--bg:#05080d;--panel:#0a1018;--line:#25313e;--text:#e8edf2;--muted:#748294;--cyan:#5ee5d3;--amber:#ffb34b;--red:#ff5f67}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:#05080d;color:var(--text);font-family:"Noto Sans KR",sans-serif;overflow-x:hidden}.noise{position:fixed;inset:0;pointer-events:none;opacity:.035;z-index:30;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.hidden{display:none!important}button,select,textarea{font:inherit}.boot-screen{min-height:100vh;display:grid;place-content:center;justify-items:center;background:radial-gradient(circle at 50% 45%,#172936 0,#070b11 38%,#030507 72%);text-align:center}.boot-mark{font-size:54px;color:var(--cyan);text-shadow:0 0 40px #54d7c7}.boot-screen p{font:11px "IBM Plex Mono";letter-spacing:.35em;color:var(--muted);margin:20px 0 4px}.boot-screen h1{font:600 clamp(34px,6vw,70px) "IBM Plex Mono";letter-spacing:.1em;margin:0}.boot-screen h1 span{color:var(--cyan)}.boot-screen button{margin-top:42px;border:1px solid #3e7c76;background:rgba(34,109,101,.15);color:var(--cyan);padding:15px 42px;cursor:pointer;letter-spacing:.12em}.boot-screen button:hover{background:#173c38}.boot-screen small{margin-top:14px;color:#536172;font-size:10px}.game{min-height:100vh;background:radial-gradient(circle at 50% 30%,#152230,#05080d 60%)}.topbar{height:72px;display:grid;grid-template-columns:240px 1fr auto 90px;align-items:center;border-bottom:1px solid var(--line);background:rgba(5,9,14,.94);padding:0 24px}.brand{display:flex;align-items:center;gap:12px}.brand>b{font-size:24px;color:var(--cyan)}.brand span{font:600 13px "IBM Plex Mono";letter-spacing:.1em}.brand small,.case-title small,.clock small{display:block;font:8px "IBM Plex Mono";color:var(--muted);letter-spacing:.14em}.case-title{padding-left:24px;border-left:1px solid var(--line)}.case-title b{font-size:12px}.runtime{display:flex;align-items:center;gap:8px;color:var(--muted);font:9px "IBM Plex Mono";padding-right:24px}.runtime i{width:6px;height:6px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan)}.clock{height:72px;border-left:1px solid var(--line);display:grid;place-content:center;text-align:center}.clock b{font:600 25px "IBM Plex Mono";color:var(--amber)}.layout{display:grid;grid-template-columns:230px minmax(560px,1fr) 280px;height:calc(100vh - 72px);min-height:650px}.panel{background:rgba(7,12,18,.93);padding:19px;overflow-y:auto}.left-panel{border-right:1px solid var(--line)}.right-panel{border-left:1px solid var(--line);display:flex;flex-direction:column}.panel-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.panel-title span{font:600 10px "IBM Plex Mono";letter-spacing:.18em}.panel-title small{font-size:9px;color:var(--muted)}.cast-card{position:relative;height:165px;margin-bottom:10px;border:1px solid var(--line);overflow:hidden;background:#101720;cursor:pointer}.cast-card img{width:100%;height:100%;object-fit:cover;object-position:center 23%;filter:saturate(.72) brightness(.68);transition:.3s}.cast-card:hover img,.cast-card.here img{filter:saturate(.95) brightness(.85);transform:scale(1.02)}.cast-card .gradient{position:absolute;inset:0;background:linear-gradient(transparent 35%,rgba(3,7,11,.93) 86%)}.cast-card .info{position:absolute;left:12px;right:10px;bottom:10px}.cast-card .info b,.cast-card .info small{display:block}.cast-card .info b{font-size:14px}.cast-card .info small{font-size:9px;color:#9ba8b6}.cast-card .location{position:absolute;top:8px;right:8px;background:rgba(5,9,14,.82);border:1px solid #344252;padding:4px 6px;font:8px "IBM Plex Mono";color:var(--muted)}.cast-card.here{border-color:#43877f}.cast-card.here .location{color:var(--cyan);border-color:#3f766f}.case-note{border-top:1px solid var(--line);margin-top:16px;padding-top:14px}.case-note small{font:9px "IBM Plex Mono";color:var(--amber)}.case-note p{font-size:10px;color:var(--muted);line-height:1.7}.map-panel{display:flex;flex-direction:column;min-width:0}.map-head{height:78px;padding:0 22px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:rgba(9,14,21,.7)}.map-head small{font:8px "IBM Plex Mono";color:var(--muted);letter-spacing:.14em}.map-head h2{margin:3px 0 0;font-size:19px}.scan-button{display:flex;align-items:center;gap:9px;text-align:left;background:#12211f;border:1px solid #315952;color:var(--cyan);padding:8px 13px;cursor:pointer}.scan-button i{width:15px;height:15px;border:1px solid var(--cyan);border-radius:50%;box-shadow:inset 0 0 8px rgba(94,229,211,.4)}.scan-button span,.scan-button small{display:block}.scan-button span{font-size:10px;font-weight:700}.scan-button small{color:#799b97;font-size:7px}.scan-button:disabled{filter:grayscale(1);opacity:.45;cursor:not-allowed}.map-wrap{position:relative;flex:1;min-height:450px;overflow:hidden;background:#03060a}.map-wrap>img{width:100%;height:100%;object-fit:cover;display:block;opacity:.83}.map-wrap:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle,transparent 40%,rgba(2,5,8,.55))}.scanline{position:absolute;z-index:4;top:0;left:0;right:0;height:1px;background:rgba(94,229,211,.24);box-shadow:0 0 18px var(--cyan);animation:scan 7s linear infinite}.map-node{position:absolute;z-index:6;transform:translate(-50%,-50%);background:rgba(5,10,15,.85);border:1px solid #536173;color:#b4c0cc;min-width:94px;padding:7px 9px;cursor:pointer;text-align:left;box-shadow:0 8px 20px rgba(0,0,0,.35)}.map-node b{display:block;font:9px "IBM Plex Mono";letter-spacing:.08em}.map-node small{font-size:8px;color:#667689}.map-node:before{content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:#667689;left:-3px;top:50%}.map-node:hover,.map-node.current{border-color:var(--cyan);color:var(--cyan);background:rgba(11,38,36,.92)}.map-node.current:before{background:var(--cyan);box-shadow:0 0 12px var(--cyan)}.map-node .crew-dots{position:absolute;right:5px;top:-8px;display:flex}.map-node .crew-dots i{width:16px;height:16px;border-radius:50%;border:1px solid #7aa49f;margin-left:-4px;background-size:cover;background-position:center}.location-strip{height:86px;border-top:1px solid var(--line);padding:12px 18px;display:flex;justify-content:space-between;align-items:center;background:#0a1018}.location-strip small{font:8px "IBM Plex Mono";color:var(--muted)}.location-strip p{font-size:10px;color:#9ba7b4;margin:3px 0 0}.present-crew{display:flex;gap:7px}.present-person{width:46px;height:54px;border:1px solid #40605d;background-size:cover;background-position:center 20%;cursor:pointer;position:relative}.present-person:after{content:"대화";position:absolute;inset:auto 0 0;background:rgba(2,8,9,.85);text-align:center;font-size:7px;color:var(--cyan)}.evidence-list{flex:1}.empty{border:1px dashed #273340;padding:25px 14px;text-align:center;color:#526171;font-size:10px}.evidence-card{border:1px solid var(--line);background:#0d151f;margin-bottom:9px;padding:11px;animation:appear .3s}.evidence-card span{font:8px "IBM Plex Mono";color:var(--cyan)}.evidence-card b{display:block;font-size:11px;margin:4px 0}.evidence-card p{font-size:9px;color:#8997a6;line-height:1.6;margin:0}.accuse{margin-top:14px;border:1px solid #773940;background:#251116;color:#ff8288;padding:13px;cursor:pointer;font-weight:700}.accuse:hover{background:#35161c}.toast{position:fixed;z-index:90;left:50%;bottom:30px;transform:translate(-50%,20px);background:#101923;border:1px solid #42665f;padding:12px 18px;font-size:11px;opacity:0;pointer-events:none;transition:.3s;box-shadow:0 12px 40px #000}.toast.show{opacity:1;transform:translate(-50%,0)}dialog{color:var(--text);background:#091019;border:1px solid #354352;padding:0;box-shadow:0 30px 120px #000}dialog::backdrop{background:rgba(0,3,7,.82);backdrop-filter:blur(7px)}.dialog-close{position:absolute;z-index:5;right:13px;top:9px;border:0;background:rgba(0,0,0,.5);color:#bac5d0;width:30px;height:30px;cursor:pointer;font-size:19px}.dialogue-dialog{width:min(900px,94vw)}.dialogue-layout{display:grid;grid-template-columns:310px 1fr;height:min(650px,84vh);overflow:hidden}.portrait-wrap{position:relative;overflow:hidden;background:#111}.portrait-wrap>img{width:100%;height:100%;object-fit:cover}.portrait-shade{position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(3,7,11,.95))}.portrait-meta{position:absolute;bottom:25px;left:22px}.portrait-meta small{font:9px "IBM Plex Mono";color:var(--cyan)}.portrait-meta h2{font-size:26px;margin:2px 0}.conversation{display:flex;flex-direction:column;min-width:0;min-height:0}.conversation>header{height:68px;border-bottom:1px solid var(--line);padding:14px 20px;display:flex;justify-content:space-between}.conversation>header>span{font:9px "IBM Plex Mono";letter-spacing:.15em;color:var(--muted)}.pressure{width:140px}.pressure small{display:flex;justify-content:space-between}.pressure>i{display:block;height:3px;background:#27323d;margin-top:8px}.pressure em{display:block;height:100%;width:0;background:var(--amber);transition:.3s}.messages{flex:1;min-height:0;overflow-y:auto;padding:20px}.message{max-width:82%;margin-bottom:14px}.message.player{margin-left:auto}.message small{display:block;color:var(--muted);font:8px "IBM Plex Mono";margin-bottom:4px}.message p{margin:0;background:#141e29;border-left:2px solid #566677;padding:10px 12px;font-size:11px;line-height:1.7;white-space:pre-wrap}.message.player p{background:#112522;border-left-color:var(--cyan)}.message.typing p{color:var(--muted)}#chatForm{display:grid;grid-template-columns:1fr 100px;border-top:1px solid var(--line)}#chatForm textarea{border:0;background:#0b121b;color:var(--text);resize:none;outline:0;padding:14px;font-size:11px}#chatForm button{border:0;border-left:1px solid var(--line);background:#132723;color:var(--cyan);cursor:pointer;font-size:10px}#chatForm button b{display:block;font-size:18px}.accuse-dialog{width:min(520px,92vw);padding:28px}.red-label{font:9px "IBM Plex Mono";color:var(--red);letter-spacing:.14em}.accuse-dialog h2{margin:5px 0}.accuse-dialog>p{font-size:11px;color:var(--muted)}#accuseForm{display:grid;gap:12px;margin-top:24px}#accuseForm label{font-size:10px;color:#9aa8b7}#accuseForm select{display:block;width:100%;margin-top:5px;background:#101923;color:var(--text);border:1px solid var(--line);padding:11px}#accuseForm button,.result-dialog>button{border:0;background:var(--red);color:white;padding:13px;cursor:pointer;font-weight:700}.result-dialog{width:min(480px,92vw);padding:28px;text-align:center}.result-dialog .result-icon{font-size:40px;color:var(--cyan)}.result-dialog h2{font-size:24px}.result-dialog p{font-size:11px;color:#a3afbb;line-height:1.8}.result-dialog>button{background:var(--cyan);color:#07100f}.result-dialog.fail .result-icon{color:var(--red)}@keyframes scan{from{top:0}to{top:100%}}@keyframes appear{from{opacity:0;transform:translateY(6px)}}@media(max-width:1050px){.layout{grid-template-columns:190px 1fr}.right-panel{position:fixed;z-index:20;right:0;top:72px;bottom:0;width:250px;transform:translateX(calc(100% - 8px));transition:.3s}.right-panel:hover{transform:none}.topbar{grid-template-columns:200px 1fr 80px}.runtime{display:none}}@media(max-width:720px){.topbar{height:auto;min-height:64px;grid-template-columns:1fr 60px;padding:8px 12px}.case-title{display:none}.layout{display:block;height:auto}.left-panel{display:flex;gap:8px;overflow-x:auto;padding:10px;border-bottom:1px solid var(--line)}.left-panel .panel-title,.case-note{display:none}.cast{display:flex;gap:8px}.cast-card{width:120px;height:130px;flex:0 0 auto;margin:0}.map-panel{min-height:calc(100vh - 150px)}.map-head{height:68px}.map-wrap{min-height:430px}.map-node{min-width:70px;padding:5px}.map-node b{font-size:7px}.map-node small{display:none}.right-panel{top:64px}.dialogue-layout{grid-template-columns:130px 1fr}.portrait-meta{left:10px;bottom:15px}.portrait-meta h2{font-size:17px}.portrait-meta small{font-size:7px}}
