:root{--bg:#fff6ec;--ink:#5a3e30;--line:#8a6450;--accent:#f08a4b;--accent-ink:#fff;--soft:#f6e3d0}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--ink);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;margin:0;font:16px/1.4 system-ui,-apple-system,Segoe UI,PingFang SC,Noto Sans,sans-serif}#app{flex-direction:column;max-width:480px;min-height:100dvh;margin:0 auto;padding:8px 12px 16px;display:flex}button{font:inherit;color:var(--ink);background:var(--soft);border:2px solid var(--line);cursor:pointer;border-radius:14px;padding:10px 14px}button:disabled{opacity:.4;cursor:default}button.primary{background:var(--accent);color:var(--accent-ink);border-color:#c96a32;font-weight:700}button.big{flex-direction:column;align-items:center;width:100%;padding:16px;font-size:24px;display:flex}button.big small{font-size:14px;font-weight:400}button.small{padding:4px 10px;font-size:14px}button.link{background:0 0;border:none;padding:4px;text-decoration:underline}.resources{justify-content:space-between;gap:6px;padding:6px 4px 10px;font-weight:600;display:flex}.resources span{align-items:center;gap:4px;display:flex}img.star{width:1.3em;height:1.3em}img.star.off{filter:grayscale();opacity:.35}.home{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:16px;display:flex}.home h1{margin:0;font-size:40px}.home .stars img.star{width:56px;height:56px}.home details{max-width:34em;font-size:14px}.bonus{gap:10px;display:flex}.play{flex-direction:column;flex:1;gap:10px;display:flex}.hud{justify-content:space-between;align-items:center;font-weight:600;display:flex}.hearts{color:#d9534f;letter-spacing:2px;font-size:22px}.board-wrap{justify-content:center;display:flex}.turf{touch-action:none;cursor:pointer;border-radius:12px;display:block}.tools{justify-content:center;gap:10px;display:flex}footer{opacity:.7;justify-content:space-between;align-items:center;gap:8px;padding-right:56px;font-size:12px;display:flex}.shade{z-index:10;background:#3c281e73;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.dialog{background:var(--bg);border:3px solid var(--line);text-align:center;border-radius:20px;flex-direction:column;gap:10px;width:min(100%,400px);padding:18px;display:flex}.dialog h2,.dialog p{margin:0}.dialog.ad{padding:40px 18px;font-size:20px}.dialog.ad small{opacity:.6;font-size:12px}.table{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.table .cell{border:2px solid var(--soft);border-radius:10px;flex-direction:column;gap:2px;padding:6px 2px;font-size:12px;display:flex}.table .cell.today{border-color:var(--accent);background:#ffe2cc}.table .cell.done{opacity:.45}.table .cell:last-child{grid-column:span 2}.toast{background:var(--ink);color:#fff;z-index:20;border-radius:20px;padding:10px 18px;font-weight:600;position:fixed;bottom:80px;left:50%;transform:translate(-50%)}.feedback-fab{z-index:5;border-radius:50%;width:48px;height:48px;padding:0;font-size:22px;position:fixed;bottom:14px;right:14px;box-shadow:0 2px 6px #3c281e40}.dialog.feedback textarea{width:100%;font:inherit;border:2px solid var(--soft);resize:vertical;border-radius:10px;padding:8px}.dialog.feedback small,.dialog.feedback label{font-size:13px}.dialog .status{min-height:1.2em;font-size:14px}.chips{justify-content:center;gap:8px;display:flex}.chip{width:48px;padding:8px 0}.chip.chosen{background:var(--accent);color:var(--accent-ink);border-color:#c96a32}.chip-ends{opacity:.7;justify-content:space-between;margin:-4px 22px 0;font-size:12px;display:flex}body{background-color:var(--bg);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cg fill='%23f0dcc6' opacity='0.55'%3E%3Cellipse cx='30' cy='38' rx='9' ry='7'/%3E%3Ccircle cx='20' cy='27' r='3.5'/%3E%3Ccircle cx='27' cy='22' r='3.5'/%3E%3Ccircle cx='34' cy='22' r='3.5'/%3E%3Ccircle cx='41' cy='27' r='3.5'/%3E%3Cellipse cx='88' cy='96' rx='9' ry='7' transform='rotate(-20 88 96)'/%3E%3Ccircle cx='77' cy='87' r='3.5'/%3E%3Ccircle cx='83' cy='81' r='3.5'/%3E%3Ccircle cx='91' cy='80' r='3.5'/%3E%3Ccircle cx='98' cy='84' r='3.5'/%3E%3C/g%3E%3C/svg%3E");animation:60s linear infinite drift}@keyframes drift{0%{background-position:0 0}to{background-position:120px -240px}}@media (prefers-reduced-motion:reduce){body,.mascot,.big.primary{animation:none!important}}button{transition:transform 80ms,box-shadow 80ms,filter .15s;box-shadow:0 3px #8a645059}button:hover:not(:disabled){filter:brightness(1.04)}button:active:not(:disabled){transform:translateY(2px)scale(.97);box-shadow:0 1px #8a645059}button.primary{box-shadow:0 4px #c96a32}button.primary:active:not(:disabled){box-shadow:0 1px #c96a32}button.link,.feedback-fab{box-shadow:none}.big.primary{animation:2.4s ease-in-out infinite breathe}@keyframes breathe{50%{transform:scale(1.025)}}.mascot{filter:drop-shadow(0 6px 4px #5a3e302e);width:112px;height:112px;margin-bottom:-18px;animation:2.6s ease-in-out infinite bob}@keyframes bob{50%{transform:translateY(-8px)rotate(-3deg)}}.home h1.title{text-shadow:0 3px #f08a4b40;animation:.5s cubic-bezier(.34,1.56,.64,1) both pop-in}.turf{box-shadow:0 8px 20px #5a3e3029}.shade{animation:.15s both fade-in}.dialog{animation:.28s cubic-bezier(.34,1.56,.64,1) both pop-in;box-shadow:0 12px 30px #3c281e40}.toast{animation:.35s cubic-bezier(.34,1.56,.64,1) both toast-in}@keyframes fade-in{0%{opacity:0}}@keyframes pop-in{0%{opacity:0;transform:scale(.8)}}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,20px)scale(.9)}}img.star.pop{animation:.45s cubic-bezier(.34,1.8,.64,1) both star-in}@keyframes star-in{0%{opacity:0;transform:scale(.2)rotate(-40deg)}}.resources .bump{animation:.45s cubic-bezier(.34,1.8,.64,1) bump}@keyframes bump{40%{color:var(--accent);transform:scale(1.35)}}.hearts{display:inline-block}.switches{gap:8px;display:flex}.chip-toggle{opacity:.55;border-radius:999px;padding:6px 12px;font-size:13px}.chip-toggle.on{opacity:1;background:#ffe2cc}.ico{vertical-align:middle;flex:none;width:1.4em;height:1.4em}.bar{gap:8px;padding:4px 0 8px;display:flex}.pill{border:2px solid var(--line);background:#fff;border-radius:999px;align-items:center;gap:4px;min-width:96px;padding:2px 4px 2px 2px;font-weight:800;display:flex;box-shadow:0 2px #8a64504d}.pill .ico{width:28px;height:28px;margin:-4px 0 -4px -6px}.pill b{text-align:center;flex:1}.pill .plus{color:#fff;width:24px;height:24px;box-shadow:none;background:#69db7c;border-color:#2f9e44;border-radius:50%;padding:0;font-weight:900;line-height:1}.pill.bump{animation:.45s cubic-bezier(.34,1.8,.64,1) bump}.home{gap:12px;position:relative}.home h1.title{color:var(--accent);-webkit-text-stroke:1.5px #7a4a2a;text-shadow:0 4px #7a4a2a;letter-spacing:1px;font-size:44px}.side{z-index:1;flex-direction:column;gap:12px;display:flex;position:absolute;top:0}.side.left{left:0}.side.right{right:0}.side-btn{background:#fff;border-radius:16px;flex-direction:column;align-items:center;gap:2px;width:64px;padding:6px 2px 4px;font-size:11px;font-weight:700;display:flex;position:relative}.side-btn .ico{width:34px;height:34px}.side-btn .dot{background:#ff6b6b;border:2px solid #fff;border-radius:50%;width:12px;height:12px;position:absolute;top:-3px;right:-3px}.side-btn.ready{background:#fff3bf;animation:1.2s ease-in-out infinite wiggle}@keyframes wiggle{0%,60%,to{transform:rotate(0)}70%{transform:rotate(-8deg)}80%{transform:rotate(8deg)}90%{transform:rotate(-4deg)}}.stage{place-items:center;width:200px;height:200px;display:grid;position:relative}.stage .glow{background:radial-gradient(circle,#fff3bf 0%,#fff3bf00 70%);border-radius:50%;animation:3s ease-in-out infinite breathe;position:absolute;inset:0}.home .mascot{width:168px;height:168px;margin:0;position:relative}.home .streak{align-items:center;gap:4px;margin:0;font-weight:600;display:flex}.level-btn{background:linear-gradient(#ffa94d,#f08a4b);border-radius:22px;max-width:300px;font-size:28px}.level-btn small{align-items:center;gap:4px;display:flex}.dialog{padding-top:26px;position:relative}.dialog-title{color:#fff;white-space:nowrap;text-shadow:0 2px #c96a32;background:linear-gradient(#ffa94d,#f08a4b);border:3px solid #c96a32;border-radius:14px;padding:6px 26px;font-size:18px;font-weight:800;position:absolute;top:-20px;left:50%;transform:translate(-50%)}.shade{flex-direction:column}.shade .close-x{box-shadow:none;background:0 0;border:none;margin-top:14px;padding:0}.shade .close-x .ico{width:44px;height:44px}button.wide{width:100%}button.short{opacity:.6}.hero{justify-content:center;display:flex}.hero .ico{filter:drop-shadow(0 4px 2px #5a3e3033);width:84px;height:84px}.chest-bounce .ico{animation:1s ease-in-out infinite bob}.row2{justify-content:center;gap:10px;display:flex}.row2>button{flex:1;justify-content:center;align-items:center;gap:4px;display:flex}.ad-btn{color:#fff;text-shadow:0 1px #2f9e44;background:linear-gradient(#8ce99a,#51cf66);border-color:#2f9e44;font-weight:800;box-shadow:0 4px #2f9e44}.reward-box{background:#fff3e6;border-radius:14px;justify-content:center;padding:8px;display:flex}.rws{flex-wrap:wrap;justify-content:center;gap:8px;display:inline-flex}.rw{align-items:center;gap:2px;font-weight:800;display:inline-flex}.toast{background:#5a3e30eb;align-items:center;gap:6px;display:flex}.muted{opacity:.65}.howto{opacity:.8;font-size:13px}.toggle-row{background:#fff;justify-content:space-between;align-items:center;font-weight:600;display:flex}.switch{background:#dee2e6;border-radius:999px;width:44px;height:24px;transition:background .2s;position:relative}.switch:after{content:"";background:#fff;border-radius:50%;width:18px;height:18px;transition:transform .2s cubic-bezier(.34,1.56,.64,1);position:absolute;top:3px;left:3px}.switch.on{background:#51cf66}.switch.on:after{transform:translate(20px)}.dialog details.how{text-align:left;font-size:13px}.table .cell{background:#fff;align-items:center}.table .cell .ico{width:22px;height:22px}.table .cell.today{animation:1.6s ease-in-out infinite breathe}.play-head{justify-content:space-between;align-items:center;display:flex}.play-head h2{margin:0}.play-title{flex-direction:column;align-items:center;display:flex}.play-title h2{font-size:22px}.icon-btn{background:#fff;border-radius:14px;width:44px;height:44px;padding:4px}.icon-btn .ico{width:30px;height:30px}.icon-btn.ghost{visibility:hidden}.hearts{gap:2px;display:flex}.hearts .ico{width:24px;height:24px}.rules{border:2px solid var(--soft);background:#fff;border-radius:14px;justify-content:space-between;gap:6px;padding:6px;display:flex}.rules>div{text-align:center;flex-direction:column;flex:1;align-items:center;gap:2px;font-size:11px;font-weight:600;display:flex}.mini{grid-template-columns:repeat(3,14px);gap:1px;display:grid}.mini i{text-align:center;color:#c0392b;background:#ffe8cc;border-radius:2px;width:14px;height:14px;font-size:9px;font-style:normal;line-height:14px}.mini i.g,.mini i.c,.mini i.y{background:#d0bfff}.mini i.w{background:#fff3e6}.mini i.c img{width:14px;height:14px}.progress{align-items:center;gap:6px;font-weight:800;display:flex}.progress img{width:28px;height:28px}.progress .track,.streak-bar .track{border:2px solid var(--line);background:#f1e3d3;border-radius:999px;flex:1;height:14px;position:relative;overflow:hidden}.progress .fill,.streak-bar .fill{background:linear-gradient(#ffd43b,#fab005);transition:width .35s cubic-bezier(.34,1.56,.64,1);position:absolute;inset:0 auto 0 0}.tools{align-items:flex-end;gap:14px}.tool{background:#fff;border-radius:20px;flex-direction:column;align-items:center;width:76px;padding:6px 2px;font-size:12px;font-weight:700;display:flex;position:relative}.tool .ico{width:36px;height:36px}.tool.small{opacity:.85;width:60px}.tool.small .ico{width:24px;height:24px}.badge{color:#fff;background:#ff6b6b;border:2px solid #fff;border-radius:999px;min-width:22px;height:22px;padding:0 5px;font-size:12px;font-style:normal;line-height:18px;position:absolute;top:-6px;right:-4px}.badge.plus{background:#51cf66}.tip-card{background:#fff;border:3px solid #fab005;border-radius:16px;flex-direction:column;gap:8px;padding:10px;animation:.28s cubic-bezier(.34,1.56,.64,1) both pop-in;display:flex}.tip-card[hidden]{display:none}.tip-body{text-align:left;align-items:flex-start;gap:8px;font-size:14px;display:flex}.tip-body p{margin:0}.tip-body .ico{width:30px;height:30px}.lesson-board{justify-content:center;display:flex}.lesson-text{text-align:left;font-size:14px}.shade.victory{color:#fff;background:radial-gradient(circle at 50% 38%,#ffc446,#6b4630 72%);gap:12px}.streak-bar{align-items:center;gap:6px;width:min(100%,360px);display:flex}.streak-bar .ico{width:36px;height:36px}.streak-bar .track{height:22px}.streak-bar .track span{text-align:center;color:var(--ink);font-size:12px;font-weight:800;line-height:18px;display:block;position:relative}.win-title{color:#ffd43b;-webkit-text-stroke:2px #7a4a2a;text-shadow:0 4px #7a4a2a;margin:0;font-size:46px;animation:.5s cubic-bezier(.34,1.8,.64,1) both pop-in}.medal{place-items:center;width:220px;height:190px;display:grid;position:relative}.medal .rays{background:repeating-conic-gradient(#ffffff47 0 10deg, #fff0 10deg 20deg);border-radius:50%;animation:14s linear infinite spin;position:absolute;inset:-40px;-webkit-mask:radial-gradient(circle,#000 30%,#0000 70%);mask:radial-gradient(circle,#000 30%,#0000 70%)}@keyframes spin{to{transform:rotate(360deg)}}.medal .disc{background:radial-gradient(circle at 40% 35%,#fff9db,#ffd43b);border:6px solid #f59f00;border-radius:50%;place-items:center;width:150px;height:150px;animation:.6s cubic-bezier(.34,1.8,.64,1) both pop-in;display:grid;position:relative;box-shadow:0 6px #b8860b}.medal .disc img{width:116px;height:116px;animation:2s ease-in-out infinite bob}.medal .laurel{position:absolute;bottom:0}.medal .laurel .ico{width:110px;height:150px}.medal .laurel.l{left:-6px}.medal .laurel.r{right:-6px;transform:scaleX(-1)}.victory .stars{gap:6px;display:flex}.victory .stars .ico{width:56px;height:56px}.victory .stars span:nth-child(2) .ico{width:70px;height:70px;margin-top:-14px}.victory .stars .off{filter:grayscale()brightness(1.4);opacity:.5}.pop{animation:.45s cubic-bezier(.34,1.8,.64,1) both star-in;display:inline-block}.won-reward{color:var(--ink);background:#ffffffeb;border-radius:999px;align-items:center;gap:10px;padding:6px 16px;font-weight:700;display:flex}.victory .row2{width:min(100%,360px)}.victory .big{padding:12px;font-size:20px}.victory .small-row .link{color:#fff;align-items:center;gap:4px;text-decoration:none;display:flex}.fly{z-index:30;pointer-events:none;animation:.8s cubic-bezier(.5,-.3,.7,1) both fly;position:fixed}.fly .ico{width:28px;height:28px}@keyframes fly{0%{transform:translate(0)scale(1.2)}to{transform:translate(var(--dx), var(--dy)) scale(.6);opacity:.6}}.skins{flex-direction:column;flex:1;gap:10px;display:flex}.tabs{gap:6px;display:flex}.tabs button{background:#fff;flex:1}.tabs button.on{background:var(--accent);color:#fff;border-color:#c96a32;font-weight:800}.owned{text-align:center;margin:0;font-weight:700}.skin-grid{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.skin{border:3px solid var(--soft);background:#fff;border-radius:16px;flex-direction:column;align-items:center;gap:4px;padding:8px 4px;font-size:13px;display:flex}.skin.using{border-color:#51cf66}.skin img{width:72px;height:72px}.skin .tag{color:#2f9e44;padding:4px 0;font-size:12px;font-weight:700}.skin button{align-items:center;gap:2px;display:flex}.skin button .ico{width:18px;height:18px}.swatch{background:var(--line);border-radius:8px;grid-template-columns:repeat(3,22px);gap:2px;padding:3px;display:grid}.swatch i{border-radius:3px;height:22px}.lb-list{flex-direction:column;gap:4px;max-height:50vh;display:flex;overflow-y:auto}.lb-row{text-align:left;background:#fff;border-radius:10px;align-items:center;gap:8px;padding:6px 10px;font-size:14px;display:flex}.lb-row .name{flex:1}.lb-row.me{background:#fff3bf;border:2px solid #fab005}.lb-row .rank{background:var(--soft);border-radius:50%;place-items:center;width:26px;height:26px;font-weight:800;display:grid}.rank.r1{background:#ffd43b}.rank.r2{background:#dee2e6}.rank.r3{background:#e8a87c}.lb-mine{margin-top:8px}.rules[hidden]{display:none}.tip-card{gap:6px;padding:8px 10px}.tip-card .row2 button{padding:6px 10px}b.sw{border:2px solid var(--line);vertical-align:-.2em;border-radius:4px;width:1.1em;height:1.1em;margin:0 2px;display:inline-block}body.won .bar{z-index:11;position:relative}
