:root{color-scheme:light;font:16px/1.6 system-ui,sans-serif;color:#254636;background:#f6f3e7}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 90% 5%,#dbe8cc,transparent 45%),#f6f3e7}main{max-width:1100px;margin:auto;padding:32px 24px}header{margin-bottom:28px}h1{font-family:Georgia,serif;font-weight:500;font-size:48px;line-height:1.05;margin:12px 0}h1 span{display:block;font-style:italic;color:#8a4e24;font-size:.65em;margin-top:8px}header p{margin:16px 0 0;color:#526952}.eyebrow{font-size:11px;letter-spacing:.18em;font-weight:750;color:#5b704e}.layout{display:grid;grid-template-columns:minmax(0,420px) 1fr;gap:48px}.play{min-width:0}.stats{display:flex;justify-content:space-between;align-items:center;padding:12px 24px;background:#244d37;color:#ecf4d8;border-radius:18px 18px 0 0;font-size:10px;letter-spacing:.13em}.stats strong{display:block;font-size:28px;line-height:1.2;letter-spacing:0}.stats img{display:block;width:38px;height:38px;object-fit:contain}.bowl{position:relative;background:#f7e7b9;border:9px solid #b47743;border-top:0;border-radius:0 0 24px 24px;overflow:hidden;box-shadow:0 15px 30px #674a2215}canvas{display:block;width:100%;height:auto;touch-action:none;outline-offset:-4px}canvas:focus-visible{outline:4px solid #264d37}button{font:600 14px system-ui;padding:12px 14px;border:1px solid #a7b298;border-radius:10px;background:#fdfcf4;color:#254636;cursor:pointer}button:hover{background:#e8eddb}button:focus-visible{outline:3px solid #bd641e;outline-offset:3px}button:disabled{opacity:.45;cursor:default}#drop{background:#254d37;color:#fff;flex:1}kbd{font:10px system-ui;opacity:.7;margin-left:5px}.controls{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}#status{font-size:13px;min-height:42px;color:#56674e}aside{padding-top:26px}h2{font:normal 31px/1.2 Georgia,serif;margin:12px 0 22px}h3{font:normal 23px Georgia,serif;margin-top:34px}aside p{color:#53624b}#ladder{display:flex;flex-wrap:wrap;align-items:center;gap:5px;padding:18px 0}#ladder img{width:36px;height:36px;object-fit:contain}#ladder span{font-size:11px;color:#7d795f}.tip{padding:16px 20px;border-left:3px solid #bd8a42;background:#ebe8d6;border-radius:0 12px 12px 0;font-size:14px}footer{font-size:12px;color:#5f6b56;border-top:1px solid #d3d6bf;padding-top:22px;margin-top:30px}a{color:#78512d}#overlay{position:absolute;inset:0;background:#f7f3e8ed;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px;text-align:center;gap:12px}#overlay[hidden]{display:none}#overlay h2{margin:0}#overlay p{margin:4px 0 12px;max-width:290px}#overlay button{min-width:170px}@media(max-width:800px){main{padding:20px 14px}.layout{grid-template-columns:minmax(0,480px);justify-content:center;gap:10px}header{text-align:center}h1{font-size:40px}aside{padding:16px 10px}.controls button{padding:12px 10px}kbd{display:none}}
