/* Shared PokerDot type roles. Supporting copy never goes below Caption (12px). */
#device-host .sy-wallet .pd-wl-head{font-size:var(--pd-type-label)}
#device-host .sy-wallet .pd-wl-body{padding-top:16px}
#device-host .sy-wallet .sy-wallet-balance{height:192px!important}
#device-host .sy-wallet .pd-wl-kicker{font-size:var(--pd-type-caption);line-height:var(--pd-leading-caption)}
#device-host .sy-wallet .pd-wl-main,#device-host .sy-wallet .pd-wl-top[data-bonus="0"] .pd-wl-main{font-size:var(--pd-type-feature);line-height:48px}
#device-host .sy-wallet .pd-wl-cur{font-size:var(--pd-type-caption);height:32px}
#device-host .sy-wallet .pd-wl-bonus .pd-wl-sub span{font-size:var(--pd-type-caption);line-height:16px}
#device-host .sy-wallet .pd-wl-bonus .pd-wl-sub b{font-size:var(--pd-type-body);line-height:24px}
#device-host .sy-wallet .pd-wl-body>.pd-btn,#device-host .sy-wallet .pd-wl-actions>.pd-btn{font-size:var(--pd-type-label)!important;line-height:20px;min-height:52px;border-radius:12px}
#device-host .sy-wallet .pd-wl-support{font-size:var(--pd-type-label)!important;min-height:52px!important}
#device-host .sy-wallet .pd-wl-count{font-size:var(--pd-type-caption)}
#device-host .sy-wallet .pd-wl-alert{font-size:var(--pd-type-caption);line-height:16px}
#device-host .sy-wallet .pd-ares-push{padding:16px;gap:12px}
#device-host .sy-wallet .pd-ares-push-copy{gap:8px}
#device-host .sy-wallet .pd-ares-push-meta{font-size:var(--pd-type-caption);line-height:16px}
#device-host .sy-wallet .pd-ares-push-copy b{font-size:var(--pd-type-label);line-height:20px;overflow-wrap:anywhere}
#device-host .sy-wallet .pd-ares-push-copy small{font-size:var(--pd-type-caption);line-height:16px;color:#bbb1b8}
#device-host .sy-wallet .pd-ares-push-go{width:32px;height:32px}

/* The real aurora renderer is clipped to the card; every text layer stays above it. */
#device-host .sy-wallet-balance{isolation:isolate}
#device-host .sy-wallet-balance>.pd-wl-top,#device-host .sy-wallet-balance>.pd-wl-bonus{z-index:2}
#device-host .sy-balance-print{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;background:#090c10}
#device-host .sy-balance-print canvas{display:block;position:absolute;inset:0;width:100%;height:100%}
#device-host .sy-balance-shade{position:absolute;inset:0}

/* 01 / Print. Edge-to-edge moving ink, dark enough to keep the balance dominant. */
#device-host .sy-wallet[data-balance-variant="1"] .sy-wallet-balance{height:204px!important;background:#090c10!important}
#device-host .sy-wallet[data-balance-variant="1"] .sy-balance-print{opacity:.82}
#device-host .sy-wallet[data-balance-variant="1"] .sy-balance-shade{background:linear-gradient(100deg,#000e 0%,#0009 48%,#0003),linear-gradient(#0009,transparent 55%,#000c)}
#device-host .sy-wallet[data-balance-variant="1"] .pd-wl-bonus{border-color:#ffffff24}

/* 02 / Horizon. A low luminous band separates the large balance and its two accounts. */
#device-host .sy-wallet[data-balance-variant="2"] .sy-wallet-balance{height:220px!important}
#device-host .sy-wallet[data-balance-variant="2"] .sy-balance-print{inset:52px -16px 58px;opacity:.9}
#device-host .sy-wallet[data-balance-variant="2"] .sy-balance-print canvas{height:180%;top:-20%;transform:scaleX(1.15)}
#device-host .sy-wallet[data-balance-variant="2"] .sy-balance-shade{background:linear-gradient(#0d0f12 0%,#0d0f12ba 30%,transparent 78%,#0d0f12 100%)}
#device-host .sy-wallet[data-balance-variant="2"] .pd-wl-top{flex:none;height:112px}
#device-host .sy-wallet[data-balance-variant="2"] .pd-wl-mainwrap{align-items:flex-start;padding-top:18px}
#device-host .sy-wallet[data-balance-variant="2"] .pd-wl-bonus{margin-top:auto;padding-top:12px;border-top:0}

/* 03 / Halo. A central balance framed by a round, slowly breathing auroral print. */
#device-host .sy-wallet[data-balance-variant="3"] .sy-wallet-balance{height:248px!important}
#device-host .sy-wallet[data-balance-variant="3"] .sy-balance-print{width:250px;height:190px;left:50%;top:0;inset-inline-end:auto;bottom:auto;transform:translateX(-50%);border-radius:50%;opacity:1;filter:brightness(1.5);mask-image:radial-gradient(ellipse,transparent 28%,#000 47%,#000 62%,transparent 72%)}
#device-host .sy-wallet[data-balance-variant="3"] .sy-balance-print canvas{width:150%;left:-25%;height:150%;top:-15%}
#device-host .sy-wallet[data-balance-variant="3"] .sy-balance-shade{background:radial-gradient(ellipse at 50% 55%,#05070a80 20%,transparent 65%)}
#device-host .sy-wallet[data-balance-variant="3"] .pd-wl-top{padding-top:42px;text-align:center}
#device-host .sy-wallet[data-balance-variant="3"] .pd-wl-kicker{padding-right:0}
#device-host .sy-wallet[data-balance-variant="3"] .pd-wl-mainwrap{justify-content:center;align-items:center}
#device-host .sy-wallet[data-balance-variant="3"] .pd-wl-cur{top:0}
#device-host .sy-wallet[data-balance-variant="3"] .pd-wl-bonus{padding-top:16px;margin-top:12px}

/* 04 / Diptych. An auroral main account, two distinct bonus accounts underneath. */
#device-host .sy-wallet[data-balance-variant="4"] .sy-wallet-balance{height:244px!important;padding:0!important;border:0!important;background:transparent!important;overflow:visible!important}
#device-host .sy-wallet[data-balance-variant="4"] .pd-wl-top{flex:none;height:152px;box-sizing:border-box;padding:16px;border:1px solid var(--pd-line);border-radius:16px;overflow:hidden}
#device-host .sy-wallet[data-balance-variant="4"] .pd-wl-cur{top:13px;right:16px}
#device-host .sy-wallet[data-balance-variant="4"] .sy-balance-print{bottom:auto;height:152px;border-radius:16px}
#device-host .sy-wallet[data-balance-variant="4"] .sy-balance-print canvas{transform:rotate(-18deg) scale(1.4)}
#device-host .sy-wallet[data-balance-variant="4"] .sy-balance-shade{background:linear-gradient(100deg,#080b0ef0,#080b0e99 55%,#080b0e22)}
#device-host .sy-wallet[data-balance-variant="4"] .pd-wl-bonus{display:grid;grid-template-columns:1fr 1fr;gap:12px;border:0;padding-top:0;margin-top:12px}
#device-host .sy-wallet[data-balance-variant="4"] .pd-wl-bonus button.pd-wl-sub{border:1px solid var(--pd-line);border-radius:12px;padding:12px;background:#0d0f12;min-height:80px;gap:8px}

/* 05 / Ledger. A vertical auroral security strip beside a clear stacked balance ledger. */
#device-host .sy-wallet[data-balance-variant="5"] .sy-wallet-balance{height:244px!important;padding-left:40px!important}
#device-host .sy-wallet[data-balance-variant="5"] .sy-balance-print{right:auto;width:24px;opacity:.9;border-right:1px solid #ffffff17}
#device-host .sy-wallet[data-balance-variant="5"] .sy-balance-print canvas{width:220px;left:-100px;height:100%}
#device-host .sy-wallet[data-balance-variant="5"] .sy-balance-shade{background:linear-gradient(#0006,transparent 60%,#0009)}
#device-host .sy-wallet[data-balance-variant="5"] .pd-wl-top{flex:none;height:96px}
#device-host .sy-wallet[data-balance-variant="5"] .pd-wl-bonus{display:flex;flex-direction:column;margin-top:8px;padding-top:8px}
#device-host .sy-wallet[data-balance-variant="5"] .pd-wl-bonus button.pd-wl-sub{display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:10px 0;gap:8px;min-height:44px;border:0}
#device-host .sy-wallet[data-balance-variant="5"] .pd-wl-bonus button.pd-wl-sub+button.pd-wl-sub{border-top:1px solid var(--pd-line);border-left:0;padding-left:0}
@media(max-width:350px){#device-host .sy-wallet[data-balance-variant="5"] .sy-wallet-balance{padding-left:32px!important}#device-host .sy-wallet[data-balance-variant="5"] .sy-balance-print{width:18px}}