/* Казуальный скин (00g/00h): всё через токены :root. Без glow: объём = нижняя грань + обводка. */
body{background:var(--page-bg);color:var(--page-text)}
.phone{border-radius:var(--r-phone);font-family:var(--font-head);background:var(--bg);box-shadow:var(--phone-shadow)}
.ol{font-family:var(--font-head);font-weight:900;color:var(--text);-webkit-text-stroke:var(--stroke) var(--outline);paint-order:stroke fill;letter-spacing:.01em}
.top{display:grid;grid-template-columns:1.75fr 1.25fr 1fr;gap:8px;padding:14px 12px 0;background:var(--hud);box-shadow:inset 0 -4px 0 var(--hud-edge),0 4px 0 var(--edge)}
.stat{position:relative;height:46px;margin-top:2px;padding:0 8px 0 40px;display:flex;align-items:center;border-radius:24px;background:var(--pill);border:3px solid var(--edge);box-shadow:inset 0 3px 0 rgba(0,0,0,.25),0 2px 0 rgba(255,255,255,.18)}
.stat .lbl{display:none}
.stat svg.hi{position:absolute;left:-9px;top:50%;width:46px;height:46px;margin-top:-26px}
.stat b{font-family:var(--font-num);font-weight:900;white-space:nowrap;color:var(--text);-webkit-text-stroke:3px var(--outline);paint-order:stroke fill;margin:0;line-height:1;transform-origin:left}
.money b{font-size:19px}.inc b{font-size:13px}.bl b{font-size:14px}
.field::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 5px var(--frame),inset 0 0 0 7px var(--frame-hi),inset 0 8px 0 7px rgba(0,0,0,.18)}
.toast{background:var(--cream);color:var(--text-dark);font-family:var(--font-head);font-weight:900;font-size:15px;padding:10px 20px 10px 14px;border-radius:24px;border:3px solid var(--edge);box-shadow:0 4px 0 var(--edge);display:flex;align-items:center;gap:8px}
.toast::before{content:"";width:22px;height:22px;flex:none;background:var(--star) center/contain no-repeat}
.buyzone{background:var(--zone)}
.buy{border-radius:var(--r-lg);padding:0 12px 0 18px;background:linear-gradient(var(--go-hi),var(--go) 42%,var(--go));border:4px solid var(--edge);box-shadow:inset 0 5px 0 rgba(255,255,255,.35),inset 0 -6px 0 var(--go-dark),0 var(--depth) 0 var(--edge);transition:transform .08s,box-shadow .08s;overflow:visible}
.buy:active{transform:translateY(var(--depth));box-shadow:inset 0 5px 0 rgba(255,255,255,.25),inset 0 -2px 0 var(--go-dark),0 0 0 var(--edge)}
.buy-k{font-family:var(--font-head);font-weight:900;font-size:22px;color:var(--text);-webkit-text-stroke:5px var(--outline);paint-order:stroke fill;line-height:1.05}
.buy-n{font-family:var(--font-head);font-weight:800;font-size:13px;color:var(--text);-webkit-text-stroke:3.5px var(--outline);paint-order:stroke fill}
.buy-p{display:flex;align-items:center;gap:6px;font-family:var(--font-num);font-weight:900;font-size:17px;color:var(--text);-webkit-text-stroke:3px var(--outline);paint-order:stroke fill;background:var(--pill);padding:9px 12px 9px 9px;border-radius:20px;border:3px solid var(--edge);box-shadow:inset 0 3px 0 rgba(0,0,0,.25)}
.buy-p::before{content:"";width:24px;height:24px;flex:none;background:var(--coin) center/contain no-repeat}
.drawer{background:var(--drawer);border:4px solid var(--edge);border-bottom:0;border-radius:var(--r-xl) var(--r-xl) 0 0;box-shadow:inset 0 5px 0 var(--drawer-hi),0 -4px 0 var(--drawer-rim)}
.handle{height:20px}.handle i{width:56px;height:8px;border-radius:5px;background:var(--cream);border:2px solid var(--edge)}
.tabs{padding:0 8px;gap:6px}
.tab{display:flex;align-items:center;justify-content:center;gap:4px;font-family:var(--font-head);font-weight:900;font-size:12px;color:var(--text);-webkit-text-stroke:3px var(--outline);paint-order:stroke fill;border-radius:14px;background:var(--tab);border:3px solid var(--edge);box-shadow:inset 0 3px 0 rgba(255,255,255,.28),0 3px 0 var(--edge);margin:0 0 4px;min-height:44px;position:relative;transition:transform .1s;padding:0 2px}
.tab svg{width:22px;height:22px;flex:none}
.tab:active{transform:translateY(3px);box-shadow:inset 0 3px 0 rgba(255,255,255,.2),0 0 0 var(--edge)}
.tab.on{background:var(--tab-on);transform:translateY(0)}
.badge{position:absolute;right:-5px;top:-8px;min-width:20px;height:20px;border-radius:10px;background:var(--bad);border:2.5px solid var(--edge);color:#fff;-webkit-text-stroke:0;font-size:12px;line-height:15px;text-align:center;font-weight:900}
.cards{padding:8px 10px 0;background:var(--sheet);margin:0 8px;border:3px solid var(--edge);border-radius:0 0 18px 18px;gap:7px}
.card{border-radius:var(--r);background:var(--cream);border:3px solid var(--card-edge);box-shadow:inset 0 0 0 2px var(--cream-hi),0 3px 0 var(--edge);color:var(--text-dark);height:98px;padding:8px 10px;grid-template-columns:54px 1fr 108px;position:relative;overflow:hidden}
.card::before{display:none}
.card:nth-child(1) .ic{background:var(--ic-bg1)}.card:nth-child(2) .ic{background:var(--ic-bg2)}.card:nth-child(3) .ic{background:var(--ic-bg3)}
.ic{width:54px;height:54px;border-radius:50%;padding:5px;border:3px solid var(--edge);box-shadow:inset 0 4px 0 rgba(255,255,255,.4)}
.ic svg{width:100%;height:100%;stroke:none;fill:none}
.card h3{font-family:var(--font-head);font-weight:900;font-size:15px;line-height:1.1;color:var(--text-dark)}
.lv{display:inline-block;margin-top:3px;font-family:var(--font-head);font-weight:900;font-size:11px;color:var(--text);-webkit-text-stroke:2.5px var(--outline);paint-order:stroke fill;background:var(--lv);border:2px solid var(--edge);border-radius:10px;padding:0 7px;transform-origin:left}
.ef{font-family:var(--font-num);font-weight:900;font-size:15px;margin-top:5px!important;overflow:hidden}
.ef em{color:var(--text-mute);font-style:normal}.ef i{color:var(--text-mute);margin:0 5px!important;font-style:normal}.ef b{color:var(--good-text);font-weight:900}
.pay{border-radius:16px;background:linear-gradient(var(--go-hi),var(--go) 45%,var(--go));border:3px solid var(--edge);box-shadow:inset 0 4px 0 rgba(255,255,255,.35),inset 0 -5px 0 var(--go-dark),0 4px 0 var(--edge);color:var(--text);margin-bottom:4px;transition:transform .08s,box-shadow .08s;height:62px}
.pay:active{transform:translateY(4px);box-shadow:inset 0 4px 0 rgba(255,255,255,.25),inset 0 -2px 0 var(--go-dark),0 0 0 var(--edge)}
.pay small{font-family:var(--font-head);font-weight:900;font-size:10px;-webkit-text-stroke:2.5px var(--outline);paint-order:stroke fill;opacity:1;display:none}
.pay small:not(:empty){display:block}
.pay b{display:flex;align-items:center;gap:4px;font-family:var(--font-num);font-weight:900;font-size:13px;-webkit-text-stroke:3px var(--outline);paint-order:stroke fill}
.pay b::before{content:"";width:18px;height:18px;flex:none;background:var(--coin) center/contain no-repeat}
.pay.no{filter:grayscale(.85) brightness(.9)}
.card.locked{background:var(--locked);border-color:var(--locked-edge)}.card.locked .ic{background:var(--locked-edge)}
.card.locked .pay{background:var(--locked-edge);box-shadow:inset 0 4px 0 rgba(255,255,255,.2),0 4px 0 var(--edge)}
.card.locked .pay b::before{display:none}.card.locked .ef em{font-family:var(--font-head);font-weight:800;font-size:12px}
.mode{padding:8px 10px 10px;gap:8px;background:transparent}
.mode button{font-family:var(--font-num);font-weight:900;font-size:16px;color:var(--text);-webkit-text-stroke:3px var(--outline);paint-order:stroke fill;border-radius:16px;background:var(--tab);border:3px solid var(--edge);box-shadow:inset 0 4px 0 rgba(255,255,255,.28),0 4px 0 var(--edge);transition:transform .1s}
.mode button.on{background:var(--tab-on);transform:translateY(3px);box-shadow:inset 0 4px 0 rgba(255,255,255,.3),0 1px 0 var(--edge)}
.notes{color:var(--page-text)}
/* анимации прокачки: без свечения */
.sheen{position:absolute;top:0;bottom:0;left:0;width:40%;pointer-events:none;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:translateX(-120%) skewX(-18deg);z-index:3}
.fx-fly{position:absolute;z-index:20;pointer-events:none;display:flex;align-items:center;gap:4px;font-family:var(--font-num);font-weight:900;font-size:16px;color:var(--text);-webkit-text-stroke:4px var(--outline);paint-order:stroke fill;white-space:nowrap}
.fx-dot{position:absolute;z-index:20;pointer-events:none;border-radius:50%;background:var(--spark);border:2px solid var(--edge)}
.fx-ring{position:absolute;z-index:20;pointer-events:none;border-radius:50%;border:4px solid var(--spark)}
.demo{width:min(390px,100%);display:flex;flex-wrap:wrap;gap:8px;justify-content:center;font:13px/1.2 system-ui,sans-serif}
.demo button{padding:10px 12px;min-height:44px;border-radius:12px;border:3px solid var(--edge);background:var(--tab);color:#fff;font:700 13px system-ui,sans-serif;cursor:pointer;box-shadow:0 3px 0 var(--edge)}
.demo button.on{background:var(--tab-on)}
.tokens{width:min(390px,100%);font:12px/1.5 ui-monospace,Menlo,monospace;color:var(--page-text);columns:2;column-gap:14px}
.tokens div{break-inside:avoid;display:flex;gap:6px;align-items:center}.tokens i{width:11px;height:11px;border-radius:3px;flex:none;box-shadow:inset 0 0 0 1px rgba(0,0,0,.35)}
