*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#171c24;color:#f2f5f5;font-family:Arial,sans-serif;letter-spacing:0}canvas{display:block;touch-action:none}#scene{position:fixed;inset:0}header{position:fixed;top:26px;left:28px;right:28px;display:flex;justify-content:space-between;align-items:start;pointer-events:none}small{font-size:10px;color:#f1cf70;font-weight:bold}h1{font-size:26px;margin:8px 0;font-weight:600}.tools{display:flex;gap:8px}button,select{font:inherit;border:1px solid #ffffff45;border-radius:5px;background:#202830eb;color:#f2f5f5;cursor:pointer;touch-action:none;pointer-events:auto}button:hover{background:#3d474c}button:focus-visible,select:focus-visible{outline:2px solid #72e7c8;outline-offset:3px}.tools button{width:42px;height:42px;font-size:23px}aside{position:fixed;left:28px;top:128px;width:180px}select{padding:9px;width:100%;font-size:12px}#zone{font-size:12px;color:#c2cccf}.progress{height:5px;background:#ffffff25;overflow:hidden}.progress i{display:block;height:100%;background:#79eacb;width:0}.readout{display:flex;justify-content:space-between;font-size:12px;margin-top:12px}#health{color:#ff8b89}footer{position:fixed;bottom:28px;left:28px;right:28px;display:flex;align-items:center;justify-content:space-between}#distance{font-size:20px;font-variant-numeric:tabular-nums}#shield{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;width:190px;height:54px;overflow:hidden}#shield b{font-size:28px;color:#83e8d3}#shield span{font-size:13px}kbd{font:9px Arial;color:#a4b9bc}#charge{position:absolute;bottom:0;left:0;width:100%;height:3px;background:#83e8d3}.pad{display:none;position:fixed;left:16px;bottom:95px;grid-template-columns:repeat(3,43px);gap:4px}.pad button{height:43px;font-size:20px}.pad button:first-child{grid-column:2}.pad button:nth-child(2){grid-column:1}#overlay{position:fixed;inset:0;background:#141b22e6;backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:24px}#overlay[hidden]{display:none}h2{font-size:36px;margin:15px 0 0}#message{color:#c3d3d5;font-size:14px;line-height:1.7;max-width:340px}#continue{background:#f1cf70;color:#232b31;border:0;padding:15px 28px;margin-top:20px;font-weight:bold}@media(pointer:coarse),(max-width:700px){.pad{display:grid}}@media(max-width:600px){header{top:16px;left:16px;right:16px}h1{font-size:19px;max-width:185px}.tools button{width:36px;height:36px}aside{left:16px;top:107px;width:150px}footer{bottom:20px;left:16px;right:16px}#shield{width:160px}kbd{display:none}h2{font-size:28px}}
