*{margin:0;padding:0;box-sizing:border-box}
html,body{width:100%;height:100%;overflow:hidden;background:#000;font-family:'Courier New',monospace}
#app{width:100%;height:100%;display:flex;align-items:center;justify-content:center;position:relative}
#canvas{display:block;background:#808080}
#overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:28px;text-shadow:0 2px 8px rgba(0,0,0,.9);flex-direction:column;gap:14px;z-index:10}
#overlay .big{font-size:52px;font-weight:bold;letter-spacing:1px}
#overlay .small{font-size:16px;opacity:.8;line-height:1.5}
#overlay .score{font-size:20px;opacity:.9}
#number-input{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;z-index:20}

.settings{display:flex;flex-direction:column;gap:10px;background:rgba(20,20,20,.85);border:1px solid rgba(255,255,255,.2);border-radius:8px;padding:18px 22px;min-width:420px}
.set-row{display:flex;align-items:center;justify-content:space-between;gap:20px}
.set-label{font-size:16px;opacity:.85;white-space:nowrap}
.set-opts{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.opt{display:flex;align-items:center;gap:5px;font-size:14px;opacity:.9;cursor:pointer;padding:4px 10px;border:1px solid rgba(255,255,255,.25);border-radius:5px;background:rgba(255,255,255,.04);text-shadow:none}
.opt:hover{background:rgba(255,255,255,.12)}
.opt input{accent-color:#2ecc71;cursor:pointer}
.start-btn{margin-top:6px;font-family:inherit;font-size:18px;font-weight:bold;color:#000;background:#2ecc71;border:none;border-radius:6px;padding:10px 28px;cursor:pointer;letter-spacing:1px}
.start-btn:hover{background:#27ae60}