:root{--bg:#140f0c;--ink:#f5e6d3;--accent:#e7c08a;--muted:#a89078;font-family:Georgia,serif;color:var(--ink);background:radial-gradient(700px 400px at 50% 0,#3a2414,transparent),var(--bg)}*{box-sizing:border-box}body{margin:0}#app{max-width:720px;margin:0 auto;padding:28px 16px 70px;text-align:center}.banner{background:#3b1510;color:#fecaca;border:1px solid #7f1d1d;border-radius:12px;padding:12px 14px;font-family:system-ui,sans-serif;font-size:.9rem;line-height:1.45;text-align:left;margin:12px 0 20px}.board{position:relative;margin:0 auto;width:min(100%,560px);aspect-ratio:4/3;border-radius:28px;background:linear-gradient(160deg,#2a1a12,#1a100c);border:3px solid #6b4423;box-shadow:inset 0 0 60px #0008;overflow:hidden}.letters{position:absolute;inset:18% 8% 28%;display:flex;flex-wrap:wrap;justify-content:center;align-content:center;gap:4px 6px;font-size:clamp(.7rem,2.2vw,1rem);letter-spacing:.08em;color:#e7c08a;opacity:.85;-webkit-user-select:none;user-select:none}.planchette{position:absolute;width:64px;height:48px;margin-left:-32px;margin-top:-24px;border-radius:50% 50% 40% 40%;background:radial-gradient(circle at 50% 40%,#f0d9b0,#8a6235);border:2px solid #5a3a1a;box-shadow:0 8px 20px #0008;transition:left 1.8s cubic-bezier(.2,.8,.2,1),top 1.8s cubic-bezier(.2,.8,.2,1);display:grid;place-items:center}.planchette:after{content:"";width:18px;height:18px;border-radius:50%;border:2px solid #3a2414;background:#0003}input,button{font:inherit}input{width:min(100%,420px);padding:12px 14px;border-radius:12px;border:1px solid #5a4030;background:#1a120e;color:var(--ink)}button{margin-top:12px;appearance:none;border:0;border-radius:999px;padding:12px 18px;background:linear-gradient(180deg,#e7c08a,#a67838);color:#1a0e08;font-weight:700;cursor:pointer}.answer{min-height:1.4em;margin-top:16px;color:var(--accent);font-size:1.2rem}.fine{color:var(--muted);font-size:.82rem;font-family:system-ui,sans-serif;margin-top:18px}
