@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(assets/fonts/barlow-0.ttf) format('truetype');
}
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(assets/fonts/barlow-1.ttf) format('truetype');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/plex-0.ttf) format('truetype');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(assets/fonts/plex-1.ttf) format('truetype');
}
:root{--bg:#0b0e13;--panel:#11151c;--line:#262c35;--muted:#717b89;--text:#e7ecef;--orange:#ff6038;--mono:'IBM Plex Mono',monospace;--display:'Barlow Condensed','Arial Narrow',sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:'Noto Sans KR',sans-serif;font-size:12px;background-image:radial-gradient(ellipse at 45% 35%,#1d253133,transparent 65%)}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;font:inherit}button:focus-visible,a:focus-visible{outline:2px solid #7be6ff;outline-offset:4px}.topbar{height:86px;margin:0 48px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:13px;text-decoration:none;color:var(--text);font-family:var(--display);font-size:24px;font-weight:700;letter-spacing:1px;align-items:center}.brandmark{color:var(--orange);border:1px solid #ff603859;width:40px;height:40px;display:grid;place-items:center;font:29px serif}.brand small{display:block;color:var(--muted);font:8px var(--mono);letter-spacing:1.3px;margin-top:4px}.system{display:flex;align-items:center;gap:10px;font:9px var(--mono);letter-spacing:.6px;color:#9aa3ac}.led{display:inline-block;width:5px;height:5px;background:#87dba7;box-shadow:0 0 9px #87dba777;border-radius:100%}.build{margin:0 18px;color:var(--muted)}#sound{border:1px solid var(--line);background:transparent;color:#bcc5cd;font:9px var(--mono);padding:9px 11px}.shell{display:grid;grid-template-columns:240px minmax(340px,480px) 240px;gap:40px;max-width:1120px;margin:34px auto 26px;align-items:start}.left-rail{padding-top:12px}.eyebrow{font:9px var(--mono);letter-spacing:1.6px;color:var(--orange)}h1{font-size:72px;font-weight:900;letter-spacing:-7px;line-height:1.05;margin:24px 0 17px}h1>span{display:block;font-family:var(--display);font-size:62px;letter-spacing:-.8px;line-height:.92;margin-top:16px;font-weight:800}.accent{color:var(--orange)}.intro{color:#939ca7;line-height:1.9;font-size:11px}.rule{height:1px;background:var(--line);margin:25px 0 20px}.label{display:flex;align-items:center;justify-content:space-between;font:10px var(--mono);letter-spacing:1px;color:#b7bfc8}.label>span{font-size:8px;color:var(--muted)}.score-label{font:9px var(--mono);color:var(--muted);margin-top:20px;letter-spacing:1px}.score{font:32px var(--display);letter-spacing:3px;margin:2px 0 14px}.stats{display:grid;gap:11px}.stats>div{display:flex;justify-content:space-between;font:9px var(--mono);color:var(--muted)}.stats strong{font-weight:400;color:#c9d2db;letter-spacing:1px}#lives{color:var(--orange)}#bombs{color:#85dce8}.controls{border-top:1px solid var(--line);margin-top:24px;padding-top:20px}.controls .label{margin-bottom:15px}.controls p{display:flex;justify-content:space-between;align-items:center;color:#8994a0;font-size:10px;margin:9px 0}kbd{color:#d3d8e0;background:#181d25;border:1px solid #2a323e;border-bottom:2px solid #343d49;min-width:38px;padding:3px 6px;text-align:center;font:9px var(--mono)}.rail-footer{font:7px var(--mono);color:#5d6978;letter-spacing:1px;margin-top:25px}.tiny-cross{color:#b0bac5;margin-right:6px}.cabinet{border:1px solid #353c47;box-shadow:0 20px 90px #0008;background:#090d14}.cabinet-top,.cabinet-bottom{display:flex;justify-content:space-between;align-items:center;height:32px;padding:0 13px;font:8px var(--mono);color:#8c97a5;letter-spacing:.6px;background:#131922}.cabinet-top{border-bottom:1px solid #303846}.cabinet-top .led{margin-right:7px}.cabinet-bottom{border-top:1px solid #303846}.cabinet-bottom b{font-weight:400;margin-left:10px;color:#bec8d3}.orange{color:var(--orange);margin-right:5px}.viewport{position:relative;width:100%;aspect-ratio:2/3;overflow:hidden;background:#090e1a}canvas{display:block;width:100%;height:100%;touch-action:none}.hud{position:absolute;top:17px;left:21px;right:21px;pointer-events:none}.boss-info{display:flex;justify-content:space-between;font:8px var(--mono);color:#919eaf;letter-spacing:1.5px}#bossName{font:22px var(--display);font-weight:600;letter-spacing:2px;margin:6px 0}.health-track{height:4px;background:#32303a;position:relative}.health-track #health{height:100%;width:100%;background:var(--orange);box-shadow:0 0 9px #ff60384d;transition:width .1s}.health-track>b{position:absolute;top:0;bottom:0;background:#11151c;width:2px;left:33.333%}.health-track>b:last-child{left:66.666%}.overlay{position:absolute;inset:0;background:linear-gradient(0deg,#070b14e8 2%,#070b14d9 45%,#070b1420 100%);display:flex;align-items:flex-end;padding:0 37px 53px}.overlay.hidden{display:none}.overlay-inner{width:100%}.overlay-title{font:700 55px/.96 var(--display);letter-spacing:-.5px;margin:17px 0 20px}.overlay-title em{font-style:normal;color:var(--orange)}.overlay p{font-size:10px;color:#a9b4c3;line-height:2;letter-spacing:.4px;margin:0 0 22px}.difficulty{display:flex;gap:6px;margin:0 0 14px}.difficulty button{background:#121923;border:1px solid #374251;color:#8796a8;font:9px var(--mono);padding:7px 13px;letter-spacing:1px}.difficulty button.selected{color:#ffe8df;border-color:#b95c40;background:#3b251f}.primary{display:flex;justify-content:space-between;align-items:center;background:var(--orange);border:0;color:#130e0d;width:100%;padding:17px 20px;font-weight:800;font-size:16px}.primary:hover{background:#ff825f}.primary span{font:10px var(--mono);font-weight:600;letter-spacing:.5px}.overlay-hint{display:block;text-align:center;font:8px var(--mono);letter-spacing:1.5px;color:#717f90;margin-top:15px}.right-rail{padding-top:12px}.directory{margin-top:17px;display:grid;gap:6px}.target{height:54px;border:1px solid #252c36;background:#11161d;display:flex;align-items:center;padding:5px 9px;gap:9px;position:relative;overflow:hidden}.target.active{border-color:#875241;background:linear-gradient(90deg,#43281f,#191c22)}.target.done{opacity:.52}.target.done:after{content:'CLEAR';position:absolute;right:9px;color:#9debb8;font:8px var(--mono)}.target-num{font:9px var(--mono);color:#677282}.target.active .target-num{color:var(--orange)}.target img{width:35px;height:38px;object-fit:contain;filter:saturate(.8)}.target-text{flex:1}.target-name{font:600 16px var(--display);letter-spacing:.9px}.target-type{font:8px var(--mono);color:#687586;margin-top:3px;letter-spacing:.2px}.target.active .target-type{color:#bd8b74}.mission{margin-top:22px;border-top:1px solid var(--line);padding-top:19px}.mission .eyebrow{color:#909dad;font-size:8px}.mission p{font-size:10px;color:#6e7c8e;line-height:1.9;margin:11px 0 17px}.mission-line{font:8px var(--mono);letter-spacing:1px;color:#a7b0bc}body>footer{margin:0 48px;border-top:1px solid var(--line);display:flex;justify-content:space-between;padding:18px 0;color:#55616f;font:8px var(--mono);letter-spacing:1px}footer b{font-weight:400;color:#929ba6;margin-left:12px}.notice{pointer-events:none;position:absolute;left:0;right:0;top:42%;text-align:center;font:600 34px var(--display);letter-spacing:5px;color:#ffddd0;text-shadow:0 0 25px #ff6038;opacity:0;transition:opacity .2s}.notice.visible{opacity:1}#touchControls{display:none;position:absolute;bottom:10px;left:10px;right:10px;justify-content:space-between;pointer-events:none}#touchControls button{pointer-events:auto;background:#142330bb;border:1px solid #56899b;color:#d0efff;padding:14px;font:10px var(--mono);touch-action:none}@media(min-width:1200px) and (max-height:900px){.shell{grid-template-columns:225px minmax(300px,420px) 225px;max-width:950px;gap:40px;margin-top:22px}.topbar{height:70px}h1{font-size:56px;margin-top:18px}h1>span{font-size:54px}.controls{margin-top:18px}.rule{margin:18px 0}.target{height:47px}.directory{gap:5px}.rail-footer{margin-top:15px}.overlay-title{font-size:50px}}@media(max-width:1150px){.shell{gap:24px;margin-left:24px;margin-right:24px;grid-template-columns:190px minmax(310px,480px) 190px}.topbar{margin:0 24px}h1>span{font-size:52px}.build{display:none}.target{gap:6px;padding-left:6px}.target img{width:28px}.target-name{font-size:14px}.target-type{font-size:7px}}@media(max-width:940px){.shell{grid-template-columns:minmax(300px,480px) 210px;justify-content:center}.left-rail{display:none}.topbar{height:68px}.overlay-title{font-size:55px}}@media(max-width:650px){.shell{display:block;margin:12px auto 15px;max-width:480px}.right-rail{display:none}.topbar{height:56px;margin:0 12px}.brand{font-size:19px;gap:9px}.brandmark{width:31px;height:31px;font-size:23px}.brand small{font-size:6px}.system{font-size:0;gap:4px}#sound{font-size:8px;padding:7px}.cabinet{border-left:0;border-right:0}.overlay{padding:0 30px 48px}.overlay-title{font-size:clamp(40px,12vw,60px)}body>footer{margin:0 14px;font-size:6px}.hud{left:15px;right:15px}#touchControls{display:flex}.overlay:not(.hidden)~#touchControls{display:none}}

.boss-picker{display:flex;align-items:center;gap:8px;padding:10px 12px;background:#131922;border-bottom:1px solid var(--line)}.boss-picker label{font-size:10px;color:#a9b4c3;white-space:nowrap}.boss-picker select{flex:1;min-width:0;padding:9px 5px;background:#0b1019;color:var(--text);border:1px solid #374251;font:11px var(--mono)}.boss-picker select:focus-visible{outline:2px solid #7be6ff;outline-offset:2px}.boss-picker button{padding:10px 8px;background:var(--orange);color:#130e0d;border:0;font-weight:700;white-space:nowrap}.target{width:100%;color:var(--text);text-align:left}.target:hover{border-color:var(--orange)}.target-text,.target-name,.target-type{display:block}

/* Fifteen-target directory and replay picker. */
.directory{max-height:650px;overflow:auto}.boss-picker{flex-wrap:wrap}.boss-picker select{min-width:0}#difficultySelect{flex:0 0 68px}.replay-picker{margin-top:18px;color:#b4c5d4;font-size:12px}.replay-picker input{display:block;max-width:100%;margin-top:8px}.overlay-title{font-size:clamp(30px,5vw,58px)}

.cabinet .replay-picker{margin:0;padding:12px 14px;background:#101720;border-top:1px solid #29323d}

/* Touch capability also covers tablets and phones in landscape. */
@media (any-pointer: coarse) {
  .viewport{width:min(100%,calc((100svh - 24px) * 2 / 3));margin-inline:auto}
  .overlay{overflow:auto;padding:16px 20px 24px}
  .overlay-inner{margin-top:auto}
  #touchControls{display:flex}
  #touchControls button{min-width:44px;min-height:44px;user-select:none;-webkit-user-select:none}
  .overlay:not(.hidden)~#touchControls{display:none}
  .overlay-hint{letter-spacing:0;line-height:1.7}
}

.difficulty-help{margin:0;padding:8px 12px;border-top:1px solid var(--line);font-size:10px;line-height:1.6;color:#a9b4c3}#combatDifficulty{color:#ffd0bb;letter-spacing:0}