/* hojas */
#sheet{position:fixed;inset:0;z-index:40;display:none}#sheet.open{display:block}
.sh-bg{position:absolute;inset:0;background:rgba(10,14,16,.5);animation:fade .2s}
.sh-p{position:absolute;left:0;right:0;bottom:0;max-width:600px;margin:0 auto;background:var(--surface);border-radius:28px 28px 0 0;padding:16px 18px calc(18px + env(safe-area-inset-bottom));max-height:92dvh;overflow:auto;animation:up .3s var(--spring);overscroll-behavior:contain}
.sh-h{display:flex;align-items:center;justify-content:space-between;gap:10px}.sh-h h2{font-size:1.2rem;overflow-wrap:anywhere}
.effs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.effb{border:2px solid var(--line);background:var(--bg);border-radius:14px;padding:10px 4px;display:flex;flex-direction:column;align-items:center;gap:2px;min-height:58px}
.effb small{color:var(--muted);font-weight:700;font-size:.7rem}.effb.on{border-color:var(--acc);background:var(--acc);color:var(--acc-ink)}.effb.on small{color:inherit;opacity:.85}
.dows{display:flex;gap:6px}.dowb{flex:1;min-height:46px;border-radius:14px;border:2px solid var(--line);background:var(--bg);font-weight:800}.dowb.on{background:var(--acc);border-color:var(--acc);color:var(--acc-ink)}
.menu{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.mi-b{display:flex;align-items:center;gap:12px;border:0;background:var(--surface2);border-radius:16px;padding:0 16px;min-height:54px;font-weight:800;text-align:left}.mi-b .ic{width:22px;height:22px;color:var(--acc)}

/* modales y feedback */
#modal{position:fixed;inset:0;z-index:50;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(10,14,16,.55)}
#modal.open{display:flex;animation:fade .2s}
.m-card{width:100%;max-width:380px;background:var(--surface);border-radius:30px;padding:26px 22px 22px;text-align:center;animation:pop .45s var(--spring);max-height:92dvh;overflow:auto;display:flex;flex-direction:column;align-items:center;gap:8px}
.m-card h2{font-size:1.8rem;letter-spacing:-.02em;line-height:1.1}.m-card p{color:var(--muted)}.m-card p b{color:var(--ink)}
.m-kick{font-size:.75rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)!important}
.m-card .btn{width:100%;margin-top:12px;flex:none}
.m-burst{width:130px;height:130px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,var(--xp) 0,transparent 68%);animation:glowp 1.8s ease-in-out infinite}
.m-burst.gold{--c:var(--xp)}.trophy-big{color:#B07A00}.trophy-big .ic{width:64px;height:64px}
.m-home{width:100%}.m-home svg{width:100%;height:auto;display:block;border-radius:20px}
.m-medal .medal{width:120px;height:auto;animation:pop .6s var(--spring)}
.m-card .rar{background:none;padding:0;margin:0;font-size:.75rem}
.tag-new{background:var(--xp);color:#5A3F00;font-weight:800;border-radius:99px;padding:5px 14px;font-size:.85rem}
.m-list{list-style:none;padding:0;margin:4px 0 0;display:flex;flex-direction:column;gap:6px}.m-list li{display:flex;align-items:center;gap:8px;font-weight:800;justify-content:center}.m-list .ic{color:var(--acc)}
.m-score{display:flex;gap:18px;justify-content:center;font-weight:700}.m-score b{font-size:1.4rem;margin-left:4px}.m-score .p0,.m-score .p1{color:var(--c)}
.m-prize{display:flex;align-items:center;gap:8px;background:var(--surface2);border-radius:14px;padding:10px 14px;font-weight:800;color:var(--ink)!important}
.m-chest svg{width:150px;height:auto}.shake-c svg{animation:wobble 1.4s ease-in-out infinite}
.reveal-c{display:flex;flex-direction:column;align-items:center;gap:8px;animation:pop .6s var(--spring) .15s both}
#fx{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:60;display:none}
#fxl{position:fixed;inset:0;pointer-events:none;z-index:55;overflow:hidden}
.xpf{position:fixed;transform:translate(-50%,-10px);font-weight:800;font-size:1.5rem;color:var(--acc);text-shadow:0 2px 0 var(--surface),0 0 12px var(--surface);animation:floatup 1.1s ease-out forwards;white-space:nowrap}
#banner{position:fixed;left:50%;top:calc(12px + env(safe-area-inset-top));transform:translate(-50%,-90px);z-index:58;background:var(--ink);color:var(--bg);border-radius:99px;padding:11px 18px;display:flex;align-items:center;gap:10px;font-weight:800;font-size:.9rem;box-shadow:0 10px 30px rgba(0,0,0,.3);transition:transform .45s var(--spring);max-width:92vw;pointer-events:none}
#banner.show{transform:translate(-50%,0)}#banner .ic{color:var(--xp)}
#toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom));transform:translate(-50%,30px);opacity:0;pointer-events:none;z-index:70;background:#20272A;color:#fff;border-radius:20px;padding:12px 12px 14px 16px;display:flex;align-items:center;gap:14px;width:min(92vw,460px);box-shadow:0 14px 34px rgba(0,0,0,.35);transition:transform .35s var(--spring),opacity .2s;overflow:hidden}
#toast.show{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.tx{flex:1;min-width:0}.tx b{display:block;font-size:1.25rem;color:var(--xp);line-height:1.1}.tx span{font-size:.72rem;color:#C9D2D6;line-height:1.3;display:block;margin-top:2px}
.undo{border:0;background:rgba(255,255,255,.14);color:#fff;border-radius:14px;padding:0 14px;min-height:44px;display:flex;align-items:center;gap:6px;font-weight:800;flex:none}
.tbar{position:absolute;left:0;bottom:0;height:4px;width:100%;background:var(--xp);transform-origin:left;animation:tbar linear forwards}
body.glow::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:59;background:radial-gradient(circle at 50% 45%,rgba(255,200,61,.45),transparent 60%);animation:fade .7s reverse}

/* onboarding */
#onb{position:fixed;inset:0;z-index:80;background:var(--bg);display:none;overflow:auto}#onb.open{display:block}
.onb-c{max-width:460px;margin:0 auto;padding:calc(28px + env(safe-area-inset-top)) 22px 40px;display:flex;flex-direction:column;gap:8px;min-height:100dvh;justify-content:center}
.onb-c h2{font-size:1.9rem;letter-spacing:-.02em;line-height:1.1}.onb-c>p{color:var(--muted)}
.onb-c>.btn,.onb-c>.row-btns{margin-top:18px}.onb-art svg{width:100%;max-width:300px;height:auto;display:block;margin:0 auto 6px}
.onb-dots{display:flex;gap:6px;justify-content:center;margin-bottom:10px}.onb-dots i{width:8px;height:8px;border-radius:99px;background:var(--line);transition:.3s}.onb-dots i.on{width:26px;background:var(--acc)}
.onb-opts{display:flex;flex-direction:column;gap:10px;margin-top:10px}
.onb-o{border:2px solid var(--line);background:var(--surface);border-radius:20px;padding:16px;text-align:left;display:flex;flex-direction:column;gap:3px}
.onb-o b{font-size:1.05rem}.onb-o span{font-size:.85rem;color:var(--muted)}.onb-o:first-child{border-color:var(--acc)}