@import"https://fonts.googleapis.com/css2?family=Manrope:wght@500;600;700;800&family=Noto+Sans+KR:wght@500;700;800&display=swap";:root{font-family:Manrope,Noto Sans KR,sans-serif;color:#edf0e8;background:#121515;--brass: #c9984d;--teal: #48c3af}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:linear-gradient(#111616aa,#111616aa),url(/assets/backdrop.webp) center/cover fixed}button{font:inherit}header{height:68px;padding:0 clamp(12px,4vw,52px);display:flex;align-items:center;justify-content:space-between;background:#111515ed;border-bottom:1px solid #8d6d3c}.brand{display:flex;align-items:center;gap:10px}.brand>span{width:38px;height:38px;background:var(--brass);color:#151918;border-radius:5px;display:grid;place-items:center}.brand svg{width:20px}.brand strong{display:block;font-size:15px}.brand small,.stage small{display:block;font-size:9px;color:#9ba09d;text-transform:uppercase}.stage{text-align:center}.stage strong{font-size:14px}.icon{width:40px;height:40px;border:1px solid #5d6663;border-radius:5px;background:#222827;color:#fff;display:grid;place-items:center;cursor:pointer}.icon svg{width:18px}.shell{min-height:calc(100svh - 68px);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px}.stats{width:min(960px,96vw);display:flex;justify-content:space-between;color:#bec5c1;font-size:12px;padding:6px 3px}.stats b{color:#fff}.viewport{width:min(960px,96vw);aspect-ratio:16/9;position:relative;border:1px solid #9a7843;border-radius:6px;overflow:hidden;background:#121819;box-shadow:0 24px 80px #000b}.viewport canvas{display:block;width:100%;height:100%}#flash{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;transition:.25s}#flash.danger{background:#d7393055}.shell nav{height:54px;display:flex;align-items:center;gap:8px;color:#aeb5b1;font-size:11px}.shell nav .icon:first-child{margin-right:20px}.shell nav .icon:last-child{margin-left:20px}.key{height:24px;min-width:24px;padding:0 6px;border:1px solid #737a77;background:#272d2c;display:grid;place-items:center;border-radius:3px;color:#f1eee5;font-size:9px}.key.wide{min-width:52px}.touch{display:none;width:min(420px,94vw);grid-template-columns:1fr 1fr 1.2fr;gap:8px;padding-top:8px}.touch button{height:56px;border:1px solid #707a76;border-radius:5px;background:#262c2bdf;color:#fff;font-size:24px;touch-action:none}.touch .jump{background:var(--brass);color:#161a19;border:0}dialog{width:min(370px,88vw);border:1px solid #a98245;border-radius:6px;background:#171c1b;color:#fff;text-align:center;padding:28px;box-shadow:0 30px 100px #000}dialog::backdrop{background:#070909cc;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}dialog small{color:#c6a266;font-size:10px}dialog h2{margin:5px 0}dialog p{color:#b2bab6;font-size:13px}dialog button{height:42px;width:100%;border:0;border-radius:5px;background:var(--teal);color:#14201e;font-weight:800;margin-top:12px}@media(max-width:700px){header{height:58px;padding:0 10px}.brand>span{width:34px;height:34px}.brand strong{font-size:13px}.brand small{display:none}.shell{min-height:calc(100svh - 58px);padding:6px}.stats{padding:3px}.shell nav{display:none}.touch{display:grid}.viewport{width:min(96vw,calc((100svh - 158px) * 16 / 9))}}@media(orientation:landscape)and (max-height:600px){header{height:48px;padding:0 10px}.brand small,.stage small{display:none}.brand>span{width:32px;height:32px}.shell{height:calc(100svh - 48px);min-height:0;padding:3px;align-items:flex-start;overflow:hidden}.stats,.viewport{width:min(65vw,calc((100svh - 88px) * 16 / 9))}.stats{padding:2px}.shell nav{display:none}.touch{display:grid;position:fixed;right:10px;bottom:10px;width:min(31vw,270px);grid-template-columns:1fr 1fr;z-index:4}.touch .jump{grid-column:1 / -1}.touch button{height:58px}}