html,body,#app{width:100%;height:100%;margin:0;overflow:hidden;background:#07090F;font-family:system-ui,sans-serif;}
#app{position:relative;touch-action:none;user-select:none;-webkit-user-select:none;}
canvas{display:block;width:100%;height:100%;touch-action:none;}
#hud-top{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:10px 14px;color:#8C96AC;font-size:13px;pointer-events:none;gap:8px;}
#hud-msg{color:#F4F7FF;font-weight:600;text-align:center;flex:1;}
#hud-timer{color:#52F2A8;font-weight:700;margin-right:10px;}
#hud-timer.danger{color:#FF4F6D;}
#hud-score{color:#FFE66D;font-weight:700;}
#hud-bottom{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:10px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));}
#ink-wrap{flex:1;height:16px;background:#0E1320;border-radius:8px;position:relative;overflow:hidden;}
#ink-bar{height:100%;width:100%;background:#58E8FF;border-radius:8px;transition:width .1s;}
#ink-bar.low{background:#FF9F43;}
#ink-label{position:absolute;inset:0;text-align:center;font-size:11px;line-height:16px;color:#07090F;font-weight:700;}
button{min-height:44px;padding:0 16px;border:none;border-radius:10px;background:#1A2236;color:#8C96AC;font-weight:700;font-size:14px;cursor:pointer;}
#btn-run.ready{background:#58E8FF;color:#07090F;animation:pulse 1s infinite;}
#btn-run:disabled{opacity:.4;cursor:default;}
@keyframes pulse{50%{transform:scale(1.05);}}
#overlay{position:absolute;inset:0;background:rgba(7,9,15,.82);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px;cursor:pointer;}
#overlay.hidden{display:none;}
#ov-title{color:#FF4F6D;font-size:34px;margin:0;letter-spacing:2px;}
#overlay.win #ov-title{color:#52F2A8;}
#ov-sub{color:#F4F7FF;margin:0;font-size:16px;}
#ov-btn{background:#58E8FF;color:#07090F;font-size:16px;padding:0 26px;min-height:52px;}
#ov-hint{color:#8C96AC;font-size:12px;}