/* Кошелёк: тёмная карточка с балансом на светлой странице */
.wl { gap: 18px; }
.wl-hero { display: grid; gap: 16px; padding: 20px; border-radius: var(--sp-r-xl); }
.wl-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.wl-net { display: inline-flex; align-items: center; gap: 8px; padding: 7px 13px; border-radius: 999px; font: 500 13px/1 var(--sp-body); color: var(--sp-on-ink); background: var(--sp-ink2); }
.wl-net i { width: 7px; height: 7px; border-radius: 50%; background: var(--sp-aurora); }
.wl-hero .sp-iconbtn { color: var(--sp-ink-dim); }
.wl-main { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.wl-label { font: 600 12px/1 var(--sp-body); letter-spacing: 0.06em; text-transform: uppercase; color: var(--sp-ink-dim); }
.wl-bal { margin-top: 10px; font: 650 clamp(34px, 10.5vw, 44px)/1 var(--sp-display); letter-spacing: -0.045em; font-variant-numeric: tabular-nums; } .wl-bal small { margin-left: 8px; font: 600 12px/1 var(--sp-body); letter-spacing: 0.08em; color: var(--sp-ink-dim); }
.wl-fiat { margin-top: 8px; font-size: 14px; color: var(--sp-ink-dim); }
.wl-hero-ico { flex: none; margin: -4px -4px -6px 0; }
.wl-addr { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 46px; padding: 0 14px; border-radius: 16px; background: var(--sp-ink2); font-size: 14.5px; color: var(--sp-on-ink); transition: filter var(--sp-t-fast); }
.wl-addr:active { filter: brightness(1.12); } .wl-addr .sp-num { flex: 1; }
.wl-addr i { font: 600 11px/1 var(--sp-body); letter-spacing: 0.05em; text-transform: uppercase; font-style: normal; color: var(--sp-ink-dim); } .wl-addr i.on { color: var(--sp-aurora); }
.wl-addr.add { justify-content: center; color: var(--sp-ion); } .wl-addr.add span { flex: none; }
.wl-acts { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; }
@media (max-width: 360px) { .wl-acts .wl-circ { width: 48px; height: 48px; } .wl-act { font-size: 12px; } }
.wl-act { display: grid; justify-items: center; gap: 8px; padding: 4px 0; font-size: 13px; font-weight: 500; text-align: center; }
.wl-circ { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--sp-panel); color: var(--sp-ion); box-shadow: var(--sp-shadow); transition: transform var(--sp-t-fast) var(--sp-ease), filter var(--sp-t-fast); }
.wl-circ.primary { background: var(--sp-ion); color: var(--sp-on-ion); box-shadow: none; }
.wl-act:active .wl-circ { transform: scale(0.92); }
.wl-assets { display: grid; gap: 8px; }
.wl-asset { display: flex; align-items: center; gap: 14px; width: 100%; padding: 14px 16px; border-radius: var(--sp-r-l); background: var(--sp-panel); box-shadow: var(--sp-shadow); text-align: left; }
button.wl-asset:active { background: var(--sp-panel2); }
.wl-asset b { display: block; font-weight: 600; font-size: 16px; } .wl-asset small { display: block; margin-top: 1px; font-size: 13px; color: var(--sp-dust); }
.wl-asset-v { display: grid; justify-items: end; font-weight: 600; font-size: 16px; } .wl-asset-v small { font-size: 13px; margin-top: 2px; font-weight: 400; }
.wl-stats { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 8px; }
.wl-stats > div { display: grid; gap: 6px; padding: 14px 16px; border-radius: var(--sp-r-l); background: var(--sp-panel); box-shadow: var(--sp-shadow); } .wl-stats b { font-weight: 600; font-size: 18px; }
.wl-tabs { margin-bottom: 10px; } .wl-pane { display: grid; gap: 4px; } .wl-pane > .sp-seg { justify-self: start; margin-bottom: 6px; }
.wl-ledger { width: 100%; max-width: 980px; margin-inline: auto; }
.wl-ledger .wl-tabs { display: flex; justify-content: center; padding: 5px; border-radius: 18px; background: var(--sp-panel2); }
.wl-ledger .wl-tabs .sp-seg { width: min(100%, 420px); justify-content: stretch; }.wl-ledger .wl-tabs .sp-seg button { flex: 1; text-align: center; }
.wl-op { display: flex; align-items: center; gap: 12px; width: calc(100% + 16px); padding: 10px 8px; margin: 0 -8px; border-radius: var(--sp-r-m); transition: background var(--sp-t-fast); }
.wl-op:active { background: var(--sp-panel); }
.wl-op-t { display: block; font-weight: 500; font-size: 15px; } .wl-op-s { display: block; font-size: 13px; color: var(--sp-dust); }
.wl-op-v { margin-left: auto; display: grid; justify-items: end; font-weight: 600; font-size: 15px; } .wl-op-v small { font-size: 12px; color: var(--sp-dust); font-weight: 400; }
.wl-wd { display: grid; gap: 8px; width: 100%; padding: 15px 16px; border-radius: var(--sp-r-l); background: var(--sp-panel); box-shadow: var(--sp-shadow); text-align: left; margin-bottom: 6px; }
.wl-wd-n { font-weight: 650; font-size: 19px; } .wl-wd-n small, .wl-sum-n small { font: 600 12px/1 var(--sp-body); color: var(--sp-dust); letter-spacing: 0.06em; } .wl-wd-s { font-size: 13px; color: var(--sp-dust); }
.wl-prog { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 2px; } .wl-prog span { display: grid; gap: 5px; font: 500 12px/1 var(--sp-body); color: var(--sp-faint); }
.wl-prog i { display: block; height: 4px; border-radius: 4px; background: var(--sp-panel2); } .wl-prog span.on { color: var(--sp-dust); } .wl-prog span.on i { background: var(--sp-ion); }
.wl-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; } .wl-steps i { height: 4px; border-radius: 4px; background: var(--sp-panel2); transition: background var(--sp-t); } .wl-steps i.on { background: var(--sp-ion); }
.wl-amt { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: var(--sp-r-l); background: var(--sp-panel2); }
.wl-amt input { flex: 1; min-width: 0; border: 0; background: none; outline: none; font: 650 38px/1.1 var(--sp-display); letter-spacing: -0.04em; color: var(--sp-star); } .wl-amt input::placeholder { color: var(--sp-faint); }
.wl-amt span { font: 600 13px/1 var(--sp-body); letter-spacing: 0.06em; color: var(--sp-dust); }
.wl-pick { display: grid; gap: 8px; }
.wl-opt { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 14px; border-radius: var(--sp-r-m); background: var(--sp-panel2); text-align: left; box-shadow: inset 0 0 0 1.5px transparent; transition: box-shadow var(--sp-t-fast); }
.wl-opt b { display: block; font-weight: 600; } .wl-opt small { display: block; font-size: 13px; color: var(--sp-dust); } .wl-opt > span { flex: 1; }
.wl-opt i { width: 22px; height: 22px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--sp-faint); } .wl-opt.on { box-shadow: inset 0 0 0 1.5px var(--sp-ion); } .wl-opt.on i { background: radial-gradient(circle, var(--sp-ion) 44%, transparent 48%); box-shadow: inset 0 0 0 1.5px var(--sp-ion); }
.wl-paste { display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center; }
.wl-sum { display: flex; align-items: center; gap: 14px; } .wl-sum > div { flex: 1; min-width: 0; } .wl-sum-n { margin-top: 6px; font-weight: 650; font-size: 28px; letter-spacing: -0.03em; }
.wl-done { display: grid; justify-items: center; gap: 6px; text-align: center; padding: 6px 0 4px; } .wl-done b { font: 650 19px/1.2 var(--sp-display); letter-spacing: -0.025em; } .wl-done p { max-width: 32ch; font-size: 14px; color: var(--sp-dust); }
.wl-qr-box { display: grid; place-items: center; padding: 18px; border-radius: var(--sp-r-l); background: #fff; justify-self: center; box-shadow: inset 0 0 0 1px var(--sp-line); } .wl-qr { width: min(240px, 62vw); height: auto; display: block; }

/* ── шапка: действия справа, мгновенный вывод, карточка депозита ── */
.wl-top-r { display: inline-flex; gap: 2px; }
.wl-res { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 54px; padding: 8px 14px 8px 10px; border-radius: 16px; background: var(--sp-ink2); color: var(--sp-on-ink); text-align: left; position: relative; overflow: hidden; transition: filter var(--sp-t-fast); }
.wl-res:active { filter: brightness(1.12); }
.wl-res b { display: block; font: 600 14.5px/1.2 var(--sp-body); } .wl-res small { display: block; margin-top: 2px; font-size: 12.5px; color: var(--sp-ink-dim); }
.wl-res-bar { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(255, 255, 255, 0.14); }
.wl-res-bar u { display: block; height: 100%; border-radius: 0 3px 3px 0; background: linear-gradient(90deg, #4ff0ae, #a7f3d0); box-shadow: 0 0 12px rgba(79, 240, 174, 0.8); transition: width 700ms var(--sp-ease); }
.wl-res-off { font: 600 11px/1 var(--sp-body); letter-spacing: 0.05em; text-transform: uppercase; font-style: normal; color: var(--sp-ink-dim); }
.wl-res.off .sp-3d { filter: grayscale(1); opacity: 0.55; }
.wl-dep { display: flex; align-items: center; gap: 14px; width: 100%; padding: 14px 16px; border-radius: var(--sp-r-l); background: var(--sp-panel); box-shadow: var(--sp-shadow); text-align: left; transition: background var(--sp-t-fast); }
.wl-dep:active { background: var(--sp-panel2); }
.wl-dep b { display: block; font-weight: 600; font-size: 15.5px; } .wl-dep small { display: block; margin-top: 2px; font-size: 13px; color: var(--sp-dust); }

/* ── «вау»-успех: зелёная галочка, расходящиеся кольца, искры, счётчик суммы ── */
.wf-done { display: grid; justify-items: center; gap: 8px; padding: 14px 0 6px; text-align: center; }
.wf-burst { position: relative; display: grid; place-items: center; width: 190px; height: 160px; }
.wf-check { position: relative; z-index: 2; overflow: visible; filter: drop-shadow(0 10px 22px rgba(16, 185, 129, 0.45)); animation: wf-pop 560ms var(--sp-ease) both; }
.wf-disc { transform-origin: 32px 32px; animation: wf-disc 520ms var(--sp-ease) both; }
.wf-tick { fill: none; stroke: #fff; stroke-width: 5.4; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 48; stroke-dashoffset: 48; animation: wf-draw 440ms 260ms cubic-bezier(0.5, 0, 0.2, 1) forwards; }
.wf-ring { position: absolute; left: 50%; top: 50%; width: 104px; height: 104px; margin: -52px 0 0 -52px; border-radius: 50%; border: 2px solid rgba(16, 185, 129, 0.55); opacity: 0; animation: wf-ring 1500ms var(--sp-ease) both; }
.wf-ring.r2 { animation-delay: 160ms; } .wf-ring.r3 { animation-delay: 320ms; border-width: 1.5px; }
.wf-spark { position: absolute; left: 50%; top: 50%; width: var(--s); height: var(--s); margin: calc(var(--s) / -2) 0 0 calc(var(--s) / -2); border-radius: 50%; background: radial-gradient(circle, #eafff6 0%, #4ff0ae 55%, transparent 72%); opacity: 0;
  transform: rotate(var(--a)) translateY(0); animation: wf-spark 1000ms var(--t) var(--sp-ease) both; }
.wf-title { margin-top: 2px; font: 650 20px/1.2 var(--sp-display); letter-spacing: -0.025em; animation: sp-rise 420ms 380ms var(--sp-ease) both; }
.wf-amt { font: 700 clamp(34px, 11vw, 44px)/1.05 var(--sp-display); letter-spacing: -0.045em; color: #10b981; animation: sp-rise 420ms 460ms var(--sp-ease) both; }
.wf-amt small { margin-left: 8px; font: 600 13px/1 var(--sp-body); letter-spacing: 0.08em; color: var(--sp-dust); }
.wf-sub { max-width: 34ch; font-size: 14px; color: var(--sp-dust); animation: sp-rise 420ms 540ms var(--sp-ease) both; }
@keyframes wf-pop { 0% { transform: scale(0.4); opacity: 0; } 60% { transform: scale(1.12); opacity: 1; } 100% { transform: scale(1); } }
@keyframes wf-disc { 0% { transform: scale(0.2); } 70% { transform: scale(1.06); } 100% { transform: scale(1); } }
@keyframes wf-draw { to { stroke-dashoffset: 0; } }
@keyframes wf-ring { 0% { opacity: 0.9; transform: scale(0.8); } 100% { opacity: 0; transform: scale(2.1); } }
@keyframes wf-spark { 0% { opacity: 0; transform: rotate(var(--a)) translateY(0) scale(0.4); } 25% { opacity: 1; } 100% { opacity: 0; transform: rotate(var(--a)) translateY(calc(var(--d) * -1)) scale(1); } }
@media (prefers-reduced-motion: reduce) { .wf-check, .wf-disc, .wf-ring, .wf-spark, .wf-title, .wf-amt, .wf-sub { animation: none; opacity: 1; } .wf-ring, .wf-spark { display: none; } .wf-tick { animation: none; stroke-dashoffset: 0; } }
html.lite .wf-spark, html.lite .wf-ring { display: none; }

/* ── перевод: поиск и список участников ── */
.wf-search { display: flex; align-items: center; gap: 10px; padding: 0 14px; min-height: 50px; border-radius: 16px; background: var(--sp-panel2); color: var(--sp-dust); }
.wf-search input { flex: 1; min-width: 0; border: 0; background: none; outline: none; font: 500 16px/1.2 var(--sp-body); color: var(--sp-star); } .wf-search input::placeholder { color: var(--sp-faint); }
.wf-people { display: grid; gap: 6px; }
.wf-person { display: flex; align-items: center; gap: 12px; width: 100%; padding: 10px 14px 10px 10px; border-radius: var(--sp-r-l); background: var(--sp-panel); box-shadow: var(--sp-shadow); text-align: left; transition: background var(--sp-t-fast), transform 90ms var(--sp-ease); }
.wf-person:active { background: var(--sp-panel2); transform: scale(0.985); }
.wf-person b { display: block; font-weight: 600; font-size: 15.5px; } .wf-person small { display: block; margin-top: 1px; font-size: 13px; color: var(--sp-dust); }
.wf-ava { flex: none; display: grid; place-items: center; border-radius: 50%; font: 650 14px/1 var(--sp-display); color: #fff; background: linear-gradient(135deg, hsl(var(--h) 70% 55%), hsl(calc(var(--h) + 40) 70% 42%)); }
.wf-to { display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px 5px 5px; border-radius: 999px; background: var(--sp-panel2); font-weight: 600; font-size: 14.5px; color: var(--sp-star); }

/* ── пополнение, депозит, резерв ── */
.wf-topup { display: grid; justify-items: center; gap: 12px; }
.wf-live { display: inline-flex; align-items: center; gap: 9px; padding: 8px 14px; border-radius: 999px; background: var(--sp-aurora-soft); color: var(--sp-aurora); font: 600 13px/1 var(--sp-body); }
.wf-live i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 0 currentColor; animation: wf-live 1.6s ease-out infinite; }
@keyframes wf-live { 0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.55); } 100% { box-shadow: 0 0 0 10px rgba(16, 185, 129, 0); } }
.wf-facts { display: grid; gap: 10px; padding: 14px 16px; border-radius: var(--sp-r-l); background: var(--sp-panel2); }
.wf-facts > div { display: flex; gap: 12px; align-items: flex-start; } .wf-facts .sp-icon, .wf-facts svg { flex: none; margin-top: 2px; color: var(--sp-aurora); }
.wf-facts b { display: block; font-weight: 600; font-size: 14.5px; } .wf-facts small { display: block; margin-top: 1px; font-size: 13px; line-height: 1.35; color: var(--sp-dust); }
.wf-dep-hero { display: flex; align-items: center; gap: 14px; padding: 16px; border-radius: var(--sp-r-l); background: var(--sp-ink-grad); color: var(--sp-on-ink); }
.wf-dep-hero b { font: 700 32px/1 var(--sp-display); letter-spacing: -0.04em; } .wf-dep-hero b small { font: 600 13px/1 var(--sp-body); letter-spacing: 0; color: var(--sp-ink-dim); }
.wf-dep-hero p { margin-top: 6px; font-size: 13.5px; line-height: 1.4; color: var(--sp-ink-dim); }
.wf-dep { display: grid; gap: 8px; padding: 16px; border-radius: var(--sp-r-l); background: var(--sp-panel); box-shadow: var(--sp-shadow); }
.wf-dep-p { font-weight: 650; font-size: 22px; letter-spacing: -0.03em; } .wf-dep-p small { font: 600 12px/1 var(--sp-body); color: var(--sp-dust); letter-spacing: 0.06em; }
.wf-dep-i { font-weight: 600; font-size: 16px; } .wf-dep-s { font-size: 13px; color: var(--sp-dust); }
.wf-dep-bar { height: 5px; border-radius: 5px; background: var(--sp-panel2); overflow: hidden; } .wf-dep-bar u { display: block; height: 100%; border-radius: 5px; background: linear-gradient(90deg, #10b981, #4ff0ae); transition: width 700ms var(--sp-ease); }
.wf-forecast { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; width: 100%; margin-top: 4px; }
.wf-forecast > div { display: grid; gap: 4px; padding: 10px 6px; border-radius: 14px; background: var(--sp-panel2); } .wf-forecast span { font-size: 11.5px; color: var(--sp-dust); } .wf-forecast b { font-size: 16px; font-weight: 650; }
.wf-res-hero { display: flex; align-items: center; gap: 16px; padding: 16px; border-radius: var(--sp-r-l); background: var(--sp-ink-grad); color: var(--sp-on-ink); }
.wf-res-hero.off { filter: grayscale(0.8); opacity: 0.8; }
.wf-res-hero b { font: 700 24px/1.1 var(--sp-display); letter-spacing: -0.035em; } .wf-res-hero b small { font: 600 12.5px/1 var(--sp-body); letter-spacing: 0; color: var(--sp-ink-dim); }
.wf-res-hero p { margin-top: 6px; font-size: 13.5px; line-height: 1.4; color: var(--sp-ink-dim); }
.wf-res-ring { flex: none; display: grid; place-items: center; width: 76px; height: 76px; border-radius: 50%; background: conic-gradient(#4ff0ae calc(var(--p) * 1%), rgba(255, 255, 255, 0.18) 0); position: relative; }
.wf-res-ring::before { content: ""; position: absolute; inset: 6px; border-radius: 50%; background: #1b46c2; } .wf-res-ring > * { position: relative; }

/* ── чеки ── */
.chq-card { position: relative; overflow: hidden; border-radius: 18px; aspect-ratio: 1376 / 752; background: linear-gradient(135deg, #0b1f3a, #06101f); box-shadow: var(--sp-shadow); }
.chq-img { display: block; width: 100%; height: 100%; object-fit: cover; }
.chq-fallback { position: absolute; inset: 0; display: grid; align-content: center; gap: 6px; padding: 0 8%; color: #fff; }
.chq-fallback b { font-size: clamp(36px, 12vw, 64px); font-weight: 800; line-height: 1; }
.chq-fallback small { color: #26c496; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.chq-list { display: grid; gap: 8px; }
.chq-row { display: flex; align-items: center; gap: 6px; padding: 12px 12px 12px 14px; border-radius: 16px; background: var(--sp-panel); }
.chq-row .sp-grow { min-width: 0; display: grid; gap: 2px; }
.chq-row small { color: var(--sp-dust); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wl-hold { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; padding: 12px 14px; border-radius: 16px; background: var(--sp-ink2); color: var(--sp-on-ink); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08); }
.wl-hold span { display: grid; gap: 4px; min-width: 0; }
.wl-hold small { font: 600 11.5px/1 var(--sp-body); letter-spacing: 0.05em; text-transform: uppercase; color: var(--sp-ink-dim); }
.wl-hold b { font: 650 17px/1.1 var(--sp-display); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.wl-hold b i { margin-left: 5px; font: 600 11px/1 var(--sp-body); font-style: normal; letter-spacing: 0.06em; color: var(--sp-ink-dim); }
.wl-hold span:first-child b { color: #ffd479; }
.wl-hold em { grid-column: 1 / -1; font: 500 12.5px/1.35 var(--sp-body); font-style: normal; color: var(--sp-ink-dim); }
@media (min-width: 960px) { .wl-ledger { max-width: none; } .wl-ledger .wl-pane { max-width: 1020px; margin-inline: auto; } }

/* Чеки и меню «Отправить» */
.wl-chq { display: grid; gap: 14px; }
.wl-chq .wl-sum { margin: 0; }
.wl-chq + .wl-chq { margin-top: 8px; }
.nw-row > .wl-opt-ico { width: 42px; height: 42px; border-radius: 14px; }

/* Меню «Отправить»: баланс и сетка крупных действий */
.wl-send-bal { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; border-radius: 16px; background: var(--sp-panel2); }
.wl-send-bal span { font-size: 13px; color: var(--sp-dust); }
.wl-send-bal b { display: inline-flex; align-items: center; gap: 6px; font-size: 17px; } .wl-send-bal small { font-size: 12px; color: var(--sp-dust); font-weight: 500; }
.wl-send-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.wl-send-tile { display: grid; align-content: start; gap: 4px; min-height: 128px; padding: 14px; border-radius: 20px; text-align: left; background: var(--sp-panel); box-shadow: inset 0 0 0 1px var(--sp-line); transition: transform 120ms ease, box-shadow 160ms ease; min-width: 0; }
.wl-send-tile:active { transform: scale(0.97); }
.wl-send-tile:hover { box-shadow: inset 0 0 0 1px var(--sp-ion-line, var(--sp-ion)); }
.wl-send-tile b { font-size: 15px; font-weight: 650; line-height: 1.25; } .wl-send-tile small { font-size: 12.5px; line-height: 1.35; color: var(--sp-dust); }
.wl-send-ico { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 8px; border-radius: 50%; color: var(--sp-ion); background: var(--sp-panel2); box-shadow: inset 0 0 0 1px var(--sp-btn-line); }
.wl-send-tile:focus-visible { outline: 2px solid var(--sp-ion); outline-offset: 2px; }
.wl-send-tile:disabled { opacity: 0.6; cursor: not-allowed; } .wl-send-tile:disabled:active { transform: none; }
@media (prefers-reduced-motion: reduce) { .wl-send-tile { transition: none; } .wl-send-tile:active { transform: none; } }
/* Шаги вывода заметнее в тёмной теме */
.wl-steps i { background: var(--sp-line2, rgb(148 163 184 / 0.35)); }

/* Главное действие кошелька — заметное и в тёмной теме */
.wl-acts .wl-act:first-child .wl-circ, .hm-bal-act .wl-circ.primary { background: linear-gradient(135deg, #3b82f6, #6366f1); color: #fff; box-shadow: 0 8px 22px rgb(59 130 246 / 0.35); }