@charset "UTF-8";
:root{color-scheme:dark;--ink:#131b1c;--panel:#172223;--lime:#dbff70;--text:#f1f4e9;--muted:#a3b2ad;--line:#ffffff20;--orange:#ff895e;--blue:#79c9f4;font-family:Inter,"Pretendard","Malgun Gothic",system-ui,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--text);overflow:hidden}button,input{font:inherit}button,a,input,summary{-webkit-tap-highlight-color:transparent}button,a,summary{touch-action:manipulation}button{cursor:pointer}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--lime);outline-offset:4px}input:focus{outline:1px solid var(--lime)}[hidden]{display:none!important}a{color:inherit;text-decoration:none}#game{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}#vignette{position:fixed;inset:0;background:linear-gradient(90deg,#101918fa 0%,#101918e8 34%,#10191875 62%,#10191816 100%);pointer-events:none}body.playing #vignette{background:radial-gradient(ellipse,transparent 50%,#0b131333)}#header{position:fixed;z-index:5;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:24px 36px;border-bottom:1px solid var(--line)}.back,.icon-btn{font-size:12px;color:var(--muted)}.back:hover{color:var(--lime)}.brand{display:flex;gap:8px;align-items:center;letter-spacing:2px;font-size:13px}.brand b{color:var(--lime)}.mark{width:18px;height:18px;border:2px solid var(--lime);border-radius:50%;position:relative;margin-right:6px}.mark:before,.mark:after{content:"";position:absolute;background:var(--lime)}.mark:before{width:24px;height:2px;left:-5px;top:6px}.mark:after{width:2px;height:24px;top:-5px;left:6px}.icon-btn{border:1px solid var(--line);background:#152122a6;padding:9px 13px;border-radius:8px;color:var(--text)}.menu{position:fixed;inset:76px 0 0;overflow:auto;padding:clamp(28px,5vh,70px) clamp(24px,6vw,110px) 65px;display:flex;align-items:center}.intro{width:460px;max-width:100%;position:relative;z-index:1}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;color:var(--lime);display:flex;align-items:center;gap:10px}.live-dot{width:6px;height:6px;background:var(--lime);border-radius:50%;box-shadow:0 0 16px var(--lime)}h1{font-size:clamp(44px,5vw,72px);line-height:1.12;letter-spacing:-4px;margin:24px 0;font-weight:850}h1 em{color:var(--lime);font-style:normal}.lead{font-size:15px;line-height:1.9;color:#bcc8be;margin:0 0 22px}.pills{display:flex;gap:8px;margin-bottom:26px}.pills span{font-size:11px;border:1px solid #ffffff24;padding:6px 10px;border-radius:4px;color:#ced7c8}.entry{max-width:370px}.entry label{display:flex;justify-content:space-between;color:#c5d0c7;font-size:11px;margin-bottom:8px}.entry label span{color:#73877e}input[type=text],input:not([type]){width:100%;border:1px solid var(--line);background:#101a1bbb;color:var(--text);padding:12px 14px;border-radius:7px;min-width:0}input::placeholder{color:#82948b}.primary,.secondary{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 18px;border-radius:7px;border:1px solid transparent;font-size:14px;font-weight:750}.primary{color:#162319;background:var(--lime);margin-top:12px;box-shadow:0 4px 25px #dbff7010}.primary:hover:not(:disabled){background:#e6ff9c;transform:translateY(-1px)}.primary span,.secondary span{font-size:10px;font-weight:500}.secondary{color:var(--text);background:#253332d9;border-color:#ffffff25;margin-top:9px}.secondary:hover:not(:disabled){background:#354641}.join{display:flex;gap:6px;margin-top:12px}.join input{font-size:12px;letter-spacing:1px}.join button{flex-shrink:0;border:1px solid var(--line);background:#182827;color:var(--lime);border-radius:7px;padding:0 15px;font-size:12px}.status{font-size:12px;line-height:1.65;color:var(--lime);min-height:18px;margin:9px 0}.settings{font-size:11px;color:var(--muted);line-height:1.8;max-width:370px;margin-top:10px}.settings summary{cursor:pointer}.settings p{padding:10px 0;margin:0}.settings label{display:flex;gap:12px;align-items:center}.settings input{accent-color:var(--lime);flex:1;min-width:0}kbd{background:#34413d;padding:2px 5px;border-radius:3px;font-size:10px}.network-note{font-size:10px;color:#83968b;max-width:370px;line-height:1.7;margin-top:17px}.arena-label{position:absolute;right:6vw;bottom:15vh;width:260px;text-shadow:0 2px 14px #0008}.arena-label>span{font-size:10px;letter-spacing:3px;color:var(--lime)}.arena-label h2{font-size:32px;line-height:1.25;letter-spacing:-1px;margin:16px 0}.arena-label p{font-size:12px;line-height:1.8}.arena-label>div{display:flex;gap:30px;margin-top:25px;padding-top:18px;border-top:1px solid #ffffff60}.arena-label>div span{font-size:10px;display:flex;flex-direction:column;gap:8px}.arena-label b{font-size:24px;font-variant-numeric:tabular-nums;font-weight:500}.menu-footer{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-between;padding:16px 36px;color:#b6c4b2;letter-spacing:1px;font-size:9px;border-top:1px solid var(--line);background:#13211c60;backdrop-filter:blur(8px)}
.overlay{position:fixed;inset:0;background:#0a151ba6;backdrop-filter:blur(12px);z-index:12;display:flex;justify-content:center;align-items:center;padding:22px;overflow:auto}.panel{background:linear-gradient(145deg,#243331f5,#142021fa);border:1px solid #ffffff25;box-shadow:0 30px 100px #0005;border-radius:16px;padding:36px;width:440px;max-width:100%;text-align:center}.panel .eyebrow{justify-content:center}.panel h2{font-size:27px;letter-spacing:-1px;line-height:1.3;margin:17px 0}.panel p{font-size:12px;color:#aabbb0;line-height:1.8}.panel .primary{justify-content:center}.room-code{font-size:30px;color:var(--lime);font-weight:700;letter-spacing:4px;font-variant-numeric:tabular-nums;background:#0d191b;padding:21px 10px;border-radius:8px;margin-top:20px;user-select:all}.row{display:flex;gap:8px}.row button{font-size:12px;justify-content:center}.players{display:flex;justify-content:space-between;gap:8px;align-items:center;background:#ffffff06;padding:20px 12px;border-radius:8px;margin-top:22px;font-size:12px}.players>span{display:flex;align-items:center;gap:6px}.players>span:nth-child(2){font-size:9px;color:#728b7e}.dot{width:7px;height:7px;border-radius:50%;display:inline-block}.blue{background:var(--blue)}.orange{background:var(--orange)}.text-btn{display:inline-block;border:0;background:transparent;color:var(--muted);padding:15px;font-size:12px;margin-top:5px}.text-btn:hover{color:white}.small{font-size:10px!important}.result-score{display:flex;justify-content:center;gap:25px;align-items:center;font-size:72px;margin:22px 0;font-variant-numeric:tabular-nums}.result-score b:first-child{color:var(--lime)}.result-score b:last-child{color:var(--orange)}.result-score span{font-size:34px;color:#71877c}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);margin:25px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0}.result-stats div{display:flex;flex-direction:column;gap:9px}.result-stats strong{font-size:24px}.result-stats span{font-size:10px;color:var(--muted)}
body.playing #header{display:none}#hud{position:fixed;inset:0;pointer-events:none}.scoreboard{position:absolute;top:20px;left:50%;transform:translateX(-50%);display:flex;background:#122223e6;backdrop-filter:blur(12px);border:1px solid #ffffff30;border-radius:10px;overflow:hidden;min-width:350px}.side{display:flex;align-items:center;gap:14px;padding:12px 20px;min-width:110px}.side span{font-size:11px;max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.side b{font-size:32px;line-height:1}.mine{border-bottom:3px solid var(--lime)}.mine b{color:var(--lime)}.enemy{border-bottom:3px solid var(--orange)}.enemy b{color:var(--orange)}.clock{padding:9px 20px;background:#0e191b;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:110px}.clock span{font-size:9px;color:#97ac9d;letter-spacing:1px}.clock strong{font-size:24px;font-variant-numeric:tabular-nums;line-height:1.3}.clock.urgent strong{color:var(--orange)}.connection-info{position:absolute;top:30px;left:28px;font-size:10px;background:#15252bb8;border-radius:5px;padding:8px 10px;color:#c7dcd3}.game-menu{position:absolute;right:24px;top:24px;pointer-events:auto}#crosshair{position:absolute;left:50%;top:50%;width:0;height:0;filter:drop-shadow(0 1px 1px #000)}#crosshair i{position:absolute;background:#e7ffbd}#crosshair i:nth-child(1){width:2px;height:6px;left:-1px;top:-11px}#crosshair i:nth-child(2){width:2px;height:6px;left:-1px;top:5px}#crosshair i:nth-child(3){width:6px;height:2px;left:-11px;top:-1px}#crosshair i:nth-child(4){width:6px;height:2px;left:5px;top:-1px}#crosshair b{position:absolute;width:2px;height:2px;left:-1px;top:-1px;background:white}#hitmarker{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font:40px/1 sans-serif;color:white;opacity:0;text-shadow:0 0 10px #111}#hitLabel{position:absolute;top:calc(50% + 30px);left:50%;transform:translateX(-50%);font-size:11px;color:var(--lime);opacity:0}.center-message{position:absolute;top:32%;left:0;right:0;display:flex;flex-direction:column;align-items:center;text-shadow:0 2px 14px #0008}.center-message strong{font-size:56px;font-weight:800}.center-message span{font-size:12px;padding:6px;background:#10202077;border-radius:4px}.center-message span:empty{display:none}.feed{position:absolute;right:26px;top:105px;background:#122223c9;padding:10px 14px;border-left:2px solid var(--lime);border-radius:4px;font-size:12px;opacity:0}.bottom-hud{position:absolute;bottom:32px;left:32px;right:32px;display:flex;justify-content:space-between;align-items:flex-end}.health{width:230px;background:#14232ce3;padding:15px 18px;border-radius:10px;border:1px solid #ffffff25}.health>span{display:flex;align-items:center;justify-content:space-between;font-size:11px}.health b{font-size:28px;line-height:1}.health-track{height:4px;background:#ffffff20;margin:10px 0}.health-track i{display:block;height:100%;background:var(--lime);transition:width .1s}.health small{font-size:9px;color:#a9c3b0}.weapon-info{background:#14232ce3;padding:14px 18px;min-width:130px;border-radius:10px;border:1px solid #ffffff25}.weapon-info>span{font-size:9px;color:#b5ccba;letter-spacing:1px}.weapon-info b{font-size:36px;line-height:1.2}.weapon-info small{font-size:15px;color:#859e90;margin-left:8px}.reload-track{height:3px;background:#ffffff20;margin-top:8px}.reload-track i{display:block;height:100%;background:var(--lime);width:0}#hurt{position:fixed;inset:0;pointer-events:none;box-shadow:inset 0 0 140px #f54a36;opacity:0;z-index:3}#resume{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;background:#101b1b33}#resume button{pointer-events:auto;display:flex;flex-direction:column;width:auto;padding:22px 35px;box-shadow:0 15px 60px #0005}#resume button span{font-size:11px;color:var(--muted)}#touchControls{display:none}#toast{position:fixed;z-index:30;bottom:30px;left:50%;transform:translateX(-50%);background:#deff83;color:#182515;padding:12px 20px;border-radius:8px;font-size:12px;opacity:0;pointer-events:none;transition:opacity .2s;max-width:90vw;text-align:center}
@media(max-height:1000px) and (min-width:761px){.menu{align-items:flex-start;padding-top:30px}h1{font-size:54px;margin:17px 0}.pills{margin-bottom:17px}.lead{margin-bottom:14px}.network-note{margin-top:8px}.arena-label{bottom:13vh}.entry .primary,.entry .secondary{padding:13px 18px}.menu-footer{position:fixed}}
@media(max-width:760px){#header{padding:18px 20px}.brand{font-size:10px;letter-spacing:1px}.back{font-size:10px}.icon-btn{font-size:10px;padding:8px}.menu{inset:65px 0 0;padding:32px 24px 65px;align-items:flex-start}.intro{width:100%;max-width:420px;margin:auto}h1{font-size:52px;letter-spacing:-3px}.entry,.settings,.network-note{max-width:100%}.arena-label{display:none}#vignette{background:linear-gradient(90deg,#101918ef,#101918a8)}.menu-footer{padding:14px 20px;font-size:8px}.menu-footer span:last-child{display:none}.panel{padding:25px}.room-code{font-size:25px;letter-spacing:3px}.scoreboard{top:12px;min-width:265px}.side{padding:10px;min-width:75px;gap:7px}.side span{max-width:45px;font-size:9px}.side b{font-size:25px}.clock{min-width:88px;padding:8px 12px}.clock strong{font-size:20px}.connection-info{top:84px;left:14px;font-size:9px}.game-menu{top:84px;right:14px}.feed{top:123px;right:14px;font-size:10px}.bottom-hud{bottom:20px;left:14px;right:14px}.health{width:160px;padding:10px 12px}.health small{font-size:8px}.weapon-info{min-width:90px;padding:10px 12px}.weapon-info b{font-size:28px}.center-message strong{font-size:42px}}
@media(pointer:coarse){body.playing #touchControls{display:block}#stick{position:absolute;left:max(26px,env(safe-area-inset-left));bottom:126px;width:112px;height:112px;border:1px solid #ffffff50;background:#14232c55;border-radius:50%;pointer-events:auto;touch-action:none;display:grid;place-items:center}#stick i{width:46px;height:46px;border-radius:50%;background:#e4ffba66;border:1px solid #e4ffba99;pointer-events:none}#touchFire{position:absolute;right:max(30px,env(safe-area-inset-right));bottom:145px;width:76px;height:76px;background:#dbff7055;border:2px solid #dbff70aa;border-radius:50%;color:#f1ffd6;font-size:14px;pointer-events:auto;touch-action:none;user-select:none}#touchFire:active{background:#dbff7099}.center-message{top:27%}}
@media(max-height:500px){.panel{padding:16px 25px;max-height:96vh;overflow:auto}.panel h2{font-size:22px;margin:10px 0}.room-code{padding:12px;margin-top:8px}.players{margin-top:12px;padding:12px}.result-score{font-size:44px;margin:12px}.result-stats{padding:12px 0;margin:14px 0}.bottom-hud{bottom:12px}.health{padding:10px 12px}.health small{display:none}#stick{bottom:94px;width:88px;height:88px}#touchFire{bottom:105px;width:62px;height:62px}.center-message{top:28%}.center-message strong{font-size:35px}}

.loadout{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;margin:12px 0 6px}.loadout button{background:#1e3034;color:#d8e5df;border:1px solid #ffffff26;border-radius:7px;padding:9px;text-align:left;font-size:12px}.loadout small{display:block;color:#9ab3a7;font-size:10px;margin-top:4px}.loadout button.selected,.weapon-bar button.selected{border-color:var(--lime);color:var(--lime);background:#344631}.weapon-note{font-size:10px;color:var(--muted);margin:6px 0 12px}.weapon-bar{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);display:flex;gap:5px;pointer-events:auto}.weapon-bar button{padding:10px;border:1px solid #ffffff35;border-radius:6px;background:#14232ce3;color:#dce8dc;font-size:11px}#scope{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at center,transparent 0 28vmin,#071011e8 29vmin);z-index:-1}#scope i,#scope b{position:absolute;background:#14251d;left:50%;top:50%;transform:translate(-50%,-50%)}#scope i{height:1px;width:56vmin}#scope b{height:56vmin;width:1px}#crosshair.shotgun{width:44px;height:44px;border:1px solid #e7ffbd99;border-radius:50%;transform:translate(-50%,-50%)}#crosshair.shotgun i{display:none}#crosshair.shotgun b{left:50%;top:50%}
@media(pointer:coarse){#touchScope{position:absolute;right:32px;bottom:234px;pointer-events:auto;background:#14232ce3;color:var(--lime);border:1px solid var(--lime);padding:12px;border-radius:8px}.weapon-bar{bottom:10px}.weapon-bar button{padding:10px 13px}.bottom-hud{bottom:60px}}
@media(max-width:600px){.weapon-bar{bottom:8px}.weapon-bar button{padding:8px;font-size:10px}.bottom-hud{bottom:48px}.weapon-info{min-width:105px;padding:10px}.health{width:155px}.loadout button{padding:8px}}

@media(min-width:901px){.menu{align-items:safe center}}

/* 조준선 간격(--gap)은 현재 탄 퍼짐에 따라 main.js가 정한다. */
#crosshair i{transition:transform .06s}#crosshair i:nth-child(1){transform:translateY(calc(-1*var(--gap,0px)))}#crosshair i:nth-child(2){transform:translateY(var(--gap,0px))}#crosshair i:nth-child(3){transform:translateX(calc(-1*var(--gap,0px)))}#crosshair i:nth-child(4){transform:translateX(var(--gap,0px))}
#damageDir{position:absolute;left:50%;top:50%;width:230px;height:230px;margin:-115px 0 0 -115px;opacity:0;pointer-events:none}#damageDir i{position:absolute;inset:0;border-radius:50%;border:5px solid transparent;border-top-color:#ff5b3a;filter:drop-shadow(0 0 8px #ff5b3a);-webkit-mask:linear-gradient(90deg,transparent 28%,#000 42%,#000 58%,transparent 72%);mask:linear-gradient(90deg,transparent 28%,#000 42%,#000 58%,transparent 72%)}
.bot-level{display:flex;align-items:center;gap:6px;margin:4px 0 0}.bot-level span{font-size:11px;color:#c5d0c7;margin-right:auto}.bot-level button{background:#1e3034;color:#d8e5df;border:1px solid #ffffff26;border-radius:7px;padding:7px 12px;font-size:12px}.bot-level button.selected{border-color:var(--lime);color:var(--lime);background:#344631}
/* 조준·스코프 감도 슬라이더 (로비 설정·일시정지 화면 공용) */
.sens-panel{display:grid;gap:10px;margin:6px 0 18px;padding:14px 16px;border:1px solid var(--line);border-radius:10px;background:#0c1718a0;text-align:left;font-size:12px;color:var(--muted)}
.sens-panel label,.settings label{display:grid;grid-template-columns:5.5em 1fr 3.4em;gap:12px;align-items:center}
.sens-panel input{accent-color:var(--lime);width:100%;min-width:0}
.sens-panel output,.settings output{color:var(--lime);font-variant-numeric:tabular-nums;text-align:right}
.settings .sens-hint{padding:4px 0 0}
/* 터치 이동 버튼: 발사 버튼 왼쪽 세로 줄 */
#touchControls .touch-move{position:absolute;right:calc(max(30px,env(safe-area-inset-right)) + 88px);bottom:132px;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.touch-move button{pointer-events:auto;touch-action:none;user-select:none;min-width:70px;padding:9px 10px;border-radius:8px;border:1px solid #ffffff50;background:#14232cc8;color:var(--text);font-size:12px}
.touch-move button.on{border-color:var(--lime);color:var(--lime);background:#253a1fd8}
/* 가로 화면: 오른쪽 아래 무기 정보 칸의 왼쪽에 세로로 */
@media(max-height:500px){#touchControls .touch-move{bottom:60px;right:calc(max(30px,env(safe-area-inset-right)) + 210px);gap:6px}.touch-move button{padding:7px 10px}}