@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=Noto+Sans+KR:wght@400;500;700&display=swap');
footer>div{flex-wrap:wrap}.touch{flex-wrap:wrap}
header .audio-volume{display:flex;align-items:center;gap:5px;font-size:10px;color:#aebaba;white-space:nowrap}header .audio-volume input{width:70px;accent-color:#e4b584}@media(max-width:700px){header{flex-wrap:wrap;gap:4px}header .audio-volume input{width:48px}}
#level-info{display:block;font:10px 'Noto Sans KR',sans-serif;letter-spacing:.3px;color:#b6e3df;margin-top:8px;text-shadow:0 1px 4px #000}
#stats-panel{position:absolute;z-index:5;inset:8% 25%;background:#101f2bf5;border:1px solid #b79a6a;padding:22px 30px;box-shadow:0 10px 70px #0009;overflow:auto;color:#e8dcc7}
#stats-panel[hidden]{display:none}#stats-panel h2{margin:8px 0}#stats-panel>small{font-size:9px;letter-spacing:3px;color:#d3b27f}#stats-panel p{font-size:11px;line-height:1.6;color:#a9c0bd}
.stat-row{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-top:1px solid #61737a66}.stat-row small{display:block;font-size:10px;color:#91b3b9;margin-top:4px}#stats-panel button{padding:8px 12px;color:#f6d9aa;background:#2d424e;border:1px solid #82938b;font-size:11px}#stats-panel button:disabled{opacity:.3;cursor:default}
@media(max-width:700px){#stats-panel{inset:3% 10%;padding:10px 16px}.stat-row{padding:5px 0}#stats-panel h2{font-size:18px}#level-info{font-size:7px}#stats-open{margin-left:auto}}
:root{color-scheme:dark;font-family:'Noto Sans KR',sans-serif;color:#e9e6de;background:#111416}*{box-sizing:border-box}body{margin:0}header{height:85px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff13}.brand{font-size:16px;letter-spacing:3px;font-weight:800;color:inherit;text-decoration:none}.brand span{color:#ed9c65;margin:0 15px}.episode{font-size:11px;letter-spacing:2px}.episode span{color:#707879}button{cursor:pointer;font:inherit}header button{border:1px solid #59605c;background:none;color:#b5b9b1;padding:9px 12px;font-size:10px;letter-spacing:1px}main{max-width:1360px;margin:auto;padding:28px 5%}.topline,.note{display:flex;justify-content:space-between;color:#858d8b;font-size:10px;letter-spacing:2px;padding-bottom:13px}.topline i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#d7ad76;margin-right:9px}.stage{position:relative;aspect-ratio:16/9;background:#8d7373;overflow:hidden;border:1px solid #ffffff20;box-shadow:0 25px 90px #0004}canvas{width:100%;height:100%;display:block;image-rendering:pixelated}.hud{position:absolute;inset:25px 27px auto;display:flex;justify-content:space-between;pointer-events:none;text-shadow:0 2px 4px #0007}.hud small{font-size:9px;letter-spacing:2px}.health{width:153px;height:5px;margin:10px 0;background:#1a252a99}.health div{height:100%;background:#f5c092;transition:width .15s}.hud #status{font-size:8px;letter-spacing:2px;color:#e6cec0}.mission{text-align:right;display:flex;flex-direction:column;gap:5px}.mission strong{font-family:'Barlow Condensed',sans-serif;font-size:29px;letter-spacing:3px}.mission>span{font-size:7px;letter-spacing:2px}#overlay{position:absolute;left:8%;top:20%}.tag{font-size:9px;letter-spacing:3px;color:#ffe2c1}h1{font-family:'Barlow Condensed',Impact,sans-serif;font-size:clamp(50px,9vw,126px);line-height:.8;margin:23px 0 20px;letter-spacing:-2px;font-weight:900}h1 em{color:#ffc68e;font-style:normal}#overlay p{font-size:12px;color:#f2d9c9;letter-spacing:2px}#overlay button,#message button{display:block;margin-top:25px;background:#f4c294;border:0;color:#222a2b;padding:14px 20px;min-width:185px;text-align:left;font-weight:700;font-size:12px}#overlay button span{float:right}#overlay>small{display:block;font-size:8px;letter-spacing:2px;margin-top:12px;color:#e7c6b5}.bottomhud{position:absolute;inset:auto 27px 18px;display:flex;justify-content:space-between;color:#c6c6b9;font-size:8px;letter-spacing:1px;pointer-events:none}footer{display:flex;justify-content:space-between;gap:15px;padding:20px 0;border-bottom:1px solid #ffffff13}footer>div{display:flex;align-items:center;gap:5px}kbd{border:1px solid #ffffff23;border-bottom:2px solid #ffffff30;border-radius:3px;min-width:23px;height:23px;padding:4px;font:9px monospace;text-align:center;color:#d6d6c9;background:#1c2223}footer span{font-size:10px;color:#89918e;margin:0 12px 0 3px}.note{padding-top:18px;font-size:9px;letter-spacing:1px}#message{position:absolute;inset:0;align-content:center;text-align:center;background:#101b24bb;backdrop-filter:blur(4px)}#message small{color:#edb886;letter-spacing:4px;font-size:10px}#message h2{font-size:35px}#message p{font-size:12px;color:#b9c6c5}#message button{margin:25px auto}.touch{display:none}@media(max-width:700px){header{height:65px}.episode{display:none}main{padding:20px 3%}.hud{inset:12px}.hud small{font-size:7px}.health{width:95px}.mission strong{font-size:20px}#overlay{top:18%}h1{margin:14px 0;font-size:60px}.tag{font-size:6px}#overlay p{font-size:9px}#overlay button{margin-top:10px;padding:9px;min-width:140px}#overlay>small{display:none}.bottomhud{inset:auto 12px 8px;font-size:6px}footer{flex-wrap:wrap}footer span{margin-right:4px;font-size:8px}kbd{font-size:8px}.note{font-size:7px}.touch{display:flex;gap:10px;justify-content:center;margin-top:20px}.touch button{touch-action:none;background:#242b2d;border:1px solid #72776a;color:#eee;padding:15px}.brand{font-size:13px}}