:root{color-scheme:dark}
*{box-sizing:border-box}
body{margin:0;background:#0b1020;color:#e8ecf8;font:16px/1.5 system-ui,sans-serif}
header,main{max-width:960px;margin:0 auto;padding:0 16px}
header h1{margin:20px 0 0;font-size:28px}header p{margin:4px 0 12px;color:#a9b3d1}
.bar{display:flex;gap:18px;align-items:center;flex-wrap:wrap;padding:8px 12px;background:#141b36;border-radius:8px 8px 0 0}
.bar strong{margin-right:auto}
.cv{position:relative;background:#000}
canvas{display:block;width:100%;height:min(62vh,520px);touch-action:none}
#over{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:rgba(5,8,20,.72)}
#over.on{display:flex}#over p{font-size:22px;margin:0}
.help{margin:0;padding:8px 12px;background:#141b36;border-radius:0 0 8px 8px;color:#a9b3d1;font-size:14px}
.pick .row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:8px 0}
button,select{font:inherit;background:#26356b;color:#fff;border:0;border-radius:6px;padding:8px 14px;cursor:pointer}
button:hover{background:#3447a0}select{background:#1a2347}
.doc li{margin:6px 0}.m{color:#a9b3d1}code{background:#1a2347;padding:1px 5px;border-radius:4px}.small{color:#8c97b8;font-size:14px}
