*{box-sizing:border-box}
body{margin:0;overflow:hidden;font-family:'Courier Prime',monospace;color:#3b1f0a;background:#f7c873}
canvas{position:fixed;inset:0;width:100vw;height:100vh;display:block;cursor:crosshair}
header{position:fixed;top:12px;left:0;right:0;text-align:center;pointer-events:none}
h1{font-family:'Lilita One',cursive;font-size:clamp(44px,10vw,110px);margin:0;color:#f2a81d;-webkit-text-stroke:3px #5a2e0c;text-shadow:6px 6px 0 #5a2e0c;letter-spacing:2px}
header p{margin:4px 12px;font-size:16px}
#controls{position:fixed;left:12px;bottom:40px;width:min(320px,calc(100vw - 24px));background:#fff4d6;border:3px solid #5a2e0c;border-radius:14px;padding:12px;box-shadow:6px 6px 0 #5a2e0c;font-size:14px}
label{display:block;margin:6px 0}
input[type=range]{width:100%;accent-color:#c46a12}
.row{display:flex;gap:8px}
button{flex:1;font-family:'Lilita One';font-size:18px;background:#f2a81d;color:#3b1f0a;border:3px solid #5a2e0c;border-radius:10px;padding:6px;cursor:pointer;box-shadow:3px 3px 0 #5a2e0c}
button:active{transform:translate(3px,3px);box-shadow:none}
#fact{margin:10px 0 0;min-height:3em;font-style:italic}
footer{position:fixed;bottom:8px;right:12px;font-size:13px}
footer a{color:#7a2e00;font-weight:bold}