/* Минимал-скин (00i/00j): плоские цвета, без градиентов, свечения, рамок и размытых теней. Всё в токенах :root. */
body{background:var(--page-bg);color:var(--text-2)}
.phone{border-radius:var(--r-phone);font-family:var(--font);background:var(--bg);box-shadow:var(--phone-shadow);font-variant-numeric:tabular-nums}
.top{display:grid;grid-template-columns:1fr auto;grid-template-rows:1fr 1fr;column-gap:16px;padding:14px 20px 8px;background:var(--bg)}
.stat{display:flex;align-items:center;gap:8px;border:0}
.stat .lbl{display:none}
.stat svg.hi{flex:none;width:var(--ico);height:var(--ico)}
.stat b{font-weight:800;white-space:nowrap;line-height:1;color:var(--text);margin:0;transform-origin:left}
.money{grid-row:1/3;gap:10px}.money svg.hi{width:30px;height:30px}.money b{font-size:36px;color:var(--money)}
.inc{justify-content:flex-end;align-self:end;padding-bottom:3px}.inc b{font-size:16px;color:var(--good)}
.bl{justify-content:flex-end;align-self:start;padding-top:3px}.bl b{font-size:16px}
.inc svg.hi,.bl svg.hi{width:16px;height:16px}
.field{background:var(--field)}
.toast{background:var(--surface-2);color:var(--text);font-weight:700;font-size:16px;padding:12px 20px;border-radius:12px;box-shadow:0 3px 0 rgba(0,0,0,.3);transition:transform .55s cubic-bezier(.2,1.3,.4,1),opacity .3s;opacity:0}
.toast.show{opacity:1}
.toast::before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--accent);margin-right:10px}
.buyzone{background:var(--bg)}
.buy{top:12px;height:96px;border-radius:var(--r-lg);padding:0 16px 0 24px;background:var(--accent);color:var(--accent-ink);box-shadow:0 var(--step) 0 var(--accent-step);transition:transform .08s,box-shadow .08s}
.buy:active{transform:translateY(var(--step));box-shadow:0 0 0 var(--accent-step)}
.buy-k{font-weight:800;font-size:22px}.buy-n{font-weight:600;font-size:13px;opacity:.72}
.buy-p{display:flex;align-items:center;gap:8px;font-weight:800;font-size:22px;color:var(--accent-ink);padding:0}
.buy-p::before{content:"";width:22px;height:22px;border-radius:50%;background:var(--accent-ink);flex:none}
.drawer{background:var(--surface);border-radius:24px 24px 0 0;box-shadow:none}
.handle i{width:40px;height:4px;border-radius:2px;background:var(--text-3)}
.tabs{padding:0 12px}
.tab{font-weight:700;font-size:13px;color:var(--text-3);position:relative;transition:color .2s}
.tab::after{content:"";position:absolute;left:30%;right:30%;bottom:2px;height:3px;border-radius:2px;background:var(--accent);transform:scaleX(0);transition:transform .3s cubic-bezier(.2,1.4,.4,1)}
.tab.on{color:var(--text)}.tab.on::after{transform:scaleX(1)}
.cards{padding:12px 20px 0;gap:0}
.card{background:transparent;box-shadow:none;border-radius:0;height:102px;grid-template-columns:44px 1fr 108px;gap:14px;padding:0;position:relative;overflow:hidden}
.card::before{display:none}
.ic{width:44px;height:44px;color:var(--accent);padding:6px}
.card .ic svg{width:100%;height:100%;fill:currentColor;stroke:none}
.card h3{font-weight:700;font-size:16px;color:var(--text)}
.lv{display:inline-block;margin-top:2px;font-weight:600;font-size:13px;color:var(--text-2);transform-origin:left}
.ef{font-weight:800;font-size:16px;margin-top:6px!important;overflow:hidden}
.ef em{color:var(--text-3);font-style:normal}.ef i{color:var(--text-3);margin:0 8px!important;font-style:normal}.ef b{color:var(--good);font-weight:800}
.pay{border-radius:var(--r);background:var(--accent);color:var(--accent-ink);height:56px;box-shadow:0 3px 0 var(--accent-step);transition:transform .08s,box-shadow .08s}
.pay:active{transform:translateY(3px);box-shadow:0 0 0 var(--accent-step)}
.pay small{display:none;font-weight:600;font-size:11px}.pay small:not(:empty){display:block}
.pay b{font-weight:800;font-size:15px}
.pay.no{background:var(--surface-2);color:var(--text-3);box-shadow:0 3px 0 rgba(0,0,0,.25)}
.card.locked{opacity:.45}.card.locked .pay{background:var(--surface-2);color:var(--text-3);box-shadow:none}
.card.locked .ef em{font-weight:600;font-size:13px}
.mode{padding:8px 20px 12px;gap:8px}
.mode button{font-weight:800;font-size:16px;color:var(--text-2);background:var(--surface-2);border-radius:var(--r);transition:background .2s,transform .12s cubic-bezier(.2,1.4,.4,1)}
.mode button.on{background:var(--text);color:var(--bg);transform:scale(1.04)}
.notes{color:var(--text-2)}
.sheen{position:absolute;top:0;bottom:0;left:0;width:36%;pointer-events:none;background:rgba(255,255,255,.12);transform:translateX(-120%) skewX(-18deg);z-index:3}
.fx-fly{position:absolute;z-index:20;pointer-events:none;font-weight:800;font-size:16px;color:var(--accent);white-space:nowrap}
.fx-dot{position:absolute;z-index:20;pointer-events:none;border-radius:2px;background:var(--accent)}
.fx-ring{position:absolute;z-index:20;pointer-events:none;border-radius:50%;background:var(--accent);opacity:.3}
.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:10px;border:0;background:var(--surface-2);color:var(--text);font:700 13px system-ui,sans-serif;cursor:pointer}
.demo button.on{background:var(--accent);color:var(--accent-ink)}
.tokens{width:min(390px,100%);font:12px/1.5 ui-monospace,Menlo,monospace;color:var(--text-2);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}
