:root{--ink:#2b2118;--paper:#fff7e8;--paper2:#f6ead2;--line:#e2cfae;--accent:#d9682b;--accent2:#b84f1a;--good:#2E7D32;--bad:#C62828;--gold:#c9a227;--muted:#7a6650}*{box-sizing:border-box}html,body{margin:0;height:100%;background:#3a3128;overflow:hidden;font-family:"Baloo 2",Trebuchet MS,system-ui,sans-serif;color:var(--ink);user-select:none;-webkit-user-select:none;touch-action:none}#app canvas{display:block}button{font:inherit;color:inherit;cursor:pointer}[hidden]{display:none!important}#hud{position:fixed;top:0;left:0;right:0;padding:calc(8px + env(safe-area-inset-top)) 12px 8px;display:flex;gap:8px;align-items:center;pointer-events:none;color:#fff;font-weight:700}.bagwrap{flex:1;max-width:300px;min-width:110px}.bar{position:relative;height:24px;border-radius:12px;background:#2b2118cc;overflow:hidden;border:2px solid #fff7e8}.bar>i{position:absolute;inset:0 auto 0 0;width:50%;background:linear-gradient(#e7b84a,#c9902a);transition:width .12s}.bar.low>i{background:linear-gradient(#e86a5a,#c62828)}.bar>span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:14px;text-shadow:0 1px 2px #000a}.chip{background:#2b2118cc;border:2px solid #fff7e8;border-radius:12px;padding:0 9px;height:28px;display:flex;align-items:center;font-size:15px;white-space:nowrap}.timer{margin-left:auto;font-size:17px;min-width:58px;justify-content:center}.icon{pointer-events:auto;width:34px;height:28px;border-radius:10px;border:2px solid #fff7e8;background:#2b2118cc;color:#fff;font-weight:800;font-size:13px;letter-spacing:1px}#xpBar{position:fixed;left:0;right:0;bottom:0;height:7px;background:#2b211899}#xpBar>i{display:block;height:100%;width:0;background:#7ec8e3;transition:width .15s}#status{position:fixed;left:50%;bottom:calc(16px + env(safe-area-inset-bottom));transform:translate(-50%);color:#fff;font-weight:700;text-shadow:0 1px 3px #000c;pointer-events:none;font-size:15px;white-space:nowrap;display:flex;gap:10px;align-items:center}#status .pip{display:inline-block;width:11px;height:11px;border-radius:50%;background:#7ec8e3;border:2px solid #fff;margin-left:3px}#status .pip.off{background:transparent}#toast{position:fixed;top:64px;left:50%;transform:translate(-50%);text-align:center;pointer-events:none;opacity:0;transition:opacity .3s;width:min(92vw,520px);background:#2b2118d9;border-radius:16px;padding:8px 14px;border:2px solid #fff7e855}#toast.on{opacity:1}#toast b{display:block;font-size:22px;color:#fff;text-shadow:0 2px 4px #000c;line-height:1.15}#toast small{display:block;font-size:15px;color:#ffe7b3;text-shadow:0 1px 3px #000c}#hopB{position:fixed;right:calc(18px + env(safe-area-inset-right));bottom:calc(30px + env(safe-area-inset-bottom));width:76px;height:76px;border-radius:50%;border:3px solid #fff7e8;background:#d9682bcc;color:#fff;font-weight:800;font-size:16px}#hopB:disabled{opacity:.45}#stick{position:fixed;width:110px;height:110px;margin:-55px 0 0 -55px;border-radius:50%;border:3px solid #fff8;background:#fff2;pointer-events:none}#stick i{position:absolute;left:50%;top:50%;width:44px;height:44px;margin:-22px;border-radius:50%;background:#fff9}.modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:#1c1510aa;padding:14px;overflow:auto}.modal.on{display:flex}.card{background:var(--paper);border-radius:20px;padding:20px;max-width:560px;width:100%;box-shadow:0 12px 40px #000a;text-align:center;border:3px solid var(--line);margin:auto}.card h1{margin:0;font-size:38px;line-height:1;color:var(--accent2)}.card h2{margin:0 0 8px;font-size:26px}.card h3{margin:14px 0 6px;font-size:15px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.card p{margin:6px 0;line-height:1.35}.tag{font-size:17px;margin-top:4px!important}.howto{font-size:14px;color:#5a4835;background:var(--paper2);border-radius:12px;padding:8px 12px}.row{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}.pick{border:3px solid var(--line);background:#fff;border-radius:14px;padding:8px 10px;text-align:left;line-height:1.25;position:relative}.pick b{display:block;font-size:17px}.pick small{color:var(--muted);font-size:13px;display:block}.pick.on{border-color:var(--accent);background:#fff1e3}.pick:disabled{opacity:.5;cursor:default}.pick img{float:right;width:40px;height:40px;margin:-2px -4px 0 4px;image-rendering:auto}.btn{margin-top:14px;padding:10px 34px;border-radius:14px;border:none;background:var(--accent);color:#fff;font-size:22px;font-weight:800;box-shadow:0 4px 0 var(--accent2)}.btn:active{transform:translateY(2px);box-shadow:0 2px 0 var(--accent2)}.btn.alt{background:#efe2c8;color:var(--ink);box-shadow:0 4px #cdb894;font-size:17px;padding:8px 18px}.foot{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:10px}.small{font-size:13px;color:var(--muted)}.opt{display:block;width:100%;margin:8px 0;padding:10px 14px;border-radius:14px;border:3px solid var(--line);background:#fff;text-align:left}.opt:hover,.opt:focus-visible{border-color:var(--accent);outline:none}.opt b{display:block;font-size:18px}.opt small{color:#6b5b4b;font-size:14px}.opt .lv{float:right;font-size:13px;color:var(--muted)}.perk{display:flex;gap:10px;align-items:center;text-align:left;padding:8px 0;border-bottom:1px solid var(--line)}.perk div{flex:1}.perk b{display:block}.perk small{color:var(--muted)}.perk .btn{margin:0;font-size:15px;padding:6px 12px;box-shadow:0 3px 0 var(--accent2)}.perk .btn:disabled{background:#cbb99a;box-shadow:none}.dots{color:var(--accent);letter-spacing:2px}.rep{font-size:22px;color:var(--good);font-weight:800}@media(max-width:480px){.chip{font-size:13px;padding:0 6px;height:26px}.timer{font-size:15px;min-width:48px}.card{padding:14px}.card h1{font-size:30px}.row{grid-template-columns:1fr 1fr}.pick b{font-size:15px}.pick small{font-size:12px}#toast b{font-size:18px}#toast{top:60px}}