:root{font-family:ui-rounded,'Trebuchet MS',Arial,sans-serif;color:#294b3a;background:#18382e;font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden;min-height:100svh;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 10%,#53644a,#1d3d31 70%)}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;color:inherit;touch-action:manipulation}button:focus-visible{outline:3px solid #d77743;outline-offset:4px}#app{position:relative;width:min(100vw,600px,calc(100svh * .625));height:100svh;overflow:hidden;overflow:clip;background:#f5ddb3;box-shadow:0 0 100px #0004;isolation:isolate}canvas,#ui{position:absolute;inset:0;width:100%;height:100%}canvas{touch-action:none}#ui{pointer-events:none}#ui button,#overlay{pointer-events:auto}header{position:absolute;left:5%;right:5%;top:2.4%;display:flex;justify-content:flex-end;align-items:center}.icon{border:1px solid #33523b24;border-radius:50%;width:36px;height:36px;background:#fff4;font-size:18px}#round{font-weight:bold}#progress{opacity:.7}.eyebrow{font-size:9px;letter-spacing:1.5px;color:#7e735c;font-weight:bold}#capacity{position:absolute;left:8%;right:8%;top:58%;display:flex;align-items:center;gap:13px;font-size:11px}.bar{flex:1;height:9px;background:#c3a16a35;border-radius:20px;overflow:hidden;box-shadow:inset 0 1px 3px #77532c22}.bar i{display:block;height:100%;width:0;border-radius:20px;background:#6f8d4a;transition:width .25s,background .25s}#capacity b{font-size:15px}#lanes{position:absolute;left:10%;right:10%;top:60.416667%;height:47.916667%;display:flex;gap:1.666667%}.lane-button{flex:1;min-width:0;position:relative;background:transparent;border:0;border-radius:25px;box-shadow:0 0 0 0 #edb85e;transition:box-shadow .2s,background .2s}.lane-button:hover{background:#fff2}.lane-button:active{background:#fff4}.lane-button:disabled{cursor:default}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}#toast{position:absolute;top:60.8%;left:12%;right:12%;text-align:center;padding:8px 10px;border-radius:20px;background:#264c3ef0;color:#fff4d9;font-size:11px;opacity:0;transition:opacity .2s;transform:translateY(-50%)}#toast.show{opacity:1}.overlay{position:absolute;inset:0;background:#173b2dc9;backdrop-filter:blur(7px);z-index:5;display:grid;place-items:center;padding:8%}.overlay[hidden]{display:none}.modal{width:100%;background:#fff4da;border-radius:28px;padding:25px 25px 23px;text-align:center;box-shadow:0 20px 70px #0003;max-height:94%;overflow:auto}.modal-art{width:100px;height:90px;margin:-2px auto 8px;background-image:url('./assets/atlas.webp');background-size:400% 400%;background-position:0% 100%}.modal h1{font-family:Georgia,serif;font-size:29px;letter-spacing:-1px;margin:8px 0 14px;line-height:1.1}.modal p{font-size:13px;line-height:1.6;color:#74715c;margin:9px 0}.modal strong{color:#294b3a}.rules{display:grid;gap:9px;text-align:left;margin:17px 0}.rule{display:flex;align-items:center;gap:12px;font-size:12px;line-height:1.45;color:#6d7059}.rule em{font-style:normal;flex:0 0 28px;height:28px;display:grid;place-items:center;border-radius:50%;background:#e5e8cf;color:#36543c;font-weight:bold}.primary,.secondary{border:0;border-radius:15px;width:100%;padding:14px 12px;margin-top:9px;font-size:13px;font-weight:bold}.primary{background:#31563e;color:#fff2d5;box-shadow:0 4px 0 #203b2c}.secondary{background:#ebdfc4;color:#496045}.stats{display:flex;gap:10px;justify-content:center;margin:18px 0}.stats div{flex:1;background:#f2e8cd;padding:12px 4px;border-radius:14px;font-size:10px;color:#7a755e}.stats b{display:block;font-size:24px;color:#31563e;margin-bottom:4px}.stars{font-size:32px;letter-spacing:5px;color:#d79837}#loading{position:absolute;inset:0;background:#f5ddb3;display:grid;place-items:center;color:#31563e;font-size:20px;z-index:10}@media(max-width:400px){.modal{padding:20px}.modal h1{font-size:25px}.modal p,.rule{font-size:11px}.modal-art{width:80px;height:80px}}

.custom-form{display:grid;gap:15px;text-align:left;margin:20px 0 15px}
.custom-field{display:grid;grid-template-columns:1fr 58px;gap:7px 12px;align-items:center;font-size:12px;color:#456045}
.custom-field input[type=number]{width:58px;border:1px solid #d9ceb2;border-radius:9px;padding:7px 4px;background:#fffaf0;color:#31563e;font:inherit;text-align:center}
.custom-field input[type=range]{grid-column:1/-1;width:100%;accent-color:#5f804a;cursor:pointer}
.custom-form small{font-size:10px;color:#87816a;line-height:1.5}
.modal.custom .modal-art{display:none}.modal.custom h1{font-size:26px}.modal.custom p{font-size:11px}

.top-status{display:flex;flex-direction:column;gap:5px;font-size:13px}.top-status #progress{font-size:10px}.header-actions{display:flex;gap:8px;align-items:center}.header-actions #sound{font-size:16px}

#custom-error{color:#b24f38;font-size:12px;line-height:1.4;margin:0}.custom-field{row-gap:4px}.header-actions{display:flex;gap:6px}

.custom-check{display:flex;align-items:center;gap:10px;font-size:12px;color:#456045;cursor:pointer;min-height:44px}.custom-check input{width:20px;height:20px;accent-color:#5f804a;flex-shrink:0;margin:0}.custom-check small{display:block;margin-top:4px}

.difficulty-score{font-size:68px;font-weight:bold;line-height:1.15;color:#31563e;margin:18px 0 0}.difficulty-count{font-size:32px;font-weight:bold;margin:24px 0 14px}.difficulty-progress{display:block;width:100%;height:10px;border:0;border-radius:20px;overflow:hidden;accent-color:#78974b;margin:0 0 24px}.difficulty-progress::-webkit-progress-bar{background:#e5d9bb}.difficulty-progress::-webkit-progress-value{background:#78974b}.difficulty-progress::-moz-progress-bar{background:#78974b}

#autoplay svg{display:block;width:23px;height:23px;margin:auto}#autoplay .auto-pause{display:none}#autoplay[aria-pressed=true]{background:#31563e;color:#fff2d5;border-color:#31563e}#autoplay[aria-pressed=true] .auto-play{display:none}#autoplay[aria-pressed=true] .auto-pause{display:block}#autoplay:disabled{opacity:.55;cursor:default}

header{justify-content:space-between}.top-status #progress{font-size:17px;font-weight:bold;opacity:1;font-variant-numeric:tabular-nums}.custom-field[hidden]{display:none}

header .top-status{position:absolute;left:50%;transform:translateX(-50%)}.header-actions{margin-left:auto}.reward-counter{display:flex;align-items:center;gap:5px;white-space:nowrap}#coin-icon{display:block;width:22px;height:26px}#coin-icon svg{width:100%;height:100%}.top-status #progress{font-size:15px;width:74px;text-align:left}
@media(max-width:400px){.header-actions{gap:4px}.icon{width:32px;height:32px}}@media(max-width:340px){.icon{width:28px;height:28px}.header-actions{gap:3px}.top-status #progress{font-size:14px;width:70px}}
