/* The safe is one neutral container. League styling stays in the league row. */
#device-host .fr-hub .rbh>.rbce-card{gap:12px;padding:14px 16px;--safe-color:#d4e1ed}
#device-host .rbce-summary{display:grid;grid-template-columns:88px minmax(0,1fr) 28px;align-items:center;gap:12px;min-height:76px}
#device-host .rbce-summary>.pds-art{width:88px;height:76px;overflow:visible;mix-blend-mode:screen;transform:none;position:relative}
#device-host .rbce-summary>.pds-art>img{position:absolute;width:112px;height:112px;max-width:none;left:50%;top:0;transform:translateX(-50%);object-fit:contain;mask-image:linear-gradient(#000 0 60%,transparent 78%)}
/* Keep the info icon's enlarged tap targets anchored to the icon, not the card. */
#device-host .rbce-summary>.pdv-i{position:relative;inset:auto;align-self:start;flex:none;margin:0;width:28px;height:28px}
#device-host .rbce-total{min-width:0;display:flex;flex-direction:column;gap:2px}
#device-host .rbce-total>span{font:400 14px/20px var(--pd-font);color:#b7bdc7}
#device-host .rbce-total strong{font:700 32px/36px var(--pd-font);font-variant-numeric:tabular-nums;color:#f3f4f6;white-space:nowrap;letter-spacing:-.02em}
#device-host .rbce-total small{font:400 14px/20px var(--pd-font);color:#aeb4bf;letter-spacing:0}
#device-host .rbce-total>.rbce-status{display:flex;align-items:center;gap:6px;font:400 12px/16px var(--pd-font);color:#aeb4bf}
#device-host .rbce-total>.rbce-status[data-ready]{color:#a9ddbf}
#device-host .rbce-status>i{width:5px;height:5px;flex:none;border-radius:50%;background:#58c78a}
#device-host .rbce-available{display:flex;align-items:center;gap:8px;color:#b8e6c9;font:400 14px/20px var(--pd-font)}
#device-host .rbce-available i{width:6px;height:6px;background:#58c78a;border-radius:50%;box-shadow:0 0 8px #58c78a50;flex:none}
#device-host .rbce-hint{font:400 14px/20px var(--pd-font);color:#aeb4bf;margin:-4px 0 0}
#device-host .rbce-progress{display:flex;flex-direction:column;gap:8px}
#device-host .rbce-progress-label{display:flex;justify-content:space-between;gap:8px;font:400 13px/18px var(--pd-font);color:#aeb4bf}
#device-host .rbce-progress-label b{font-weight:400;color:#e5e7eb;white-space:nowrap}
#device-host .rbce-track{height:6px;border-radius:4px;background:#ffffff15;overflow:hidden}
#device-host .rbce-track>i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#d71921,#ff6877);transition:width .35s ease}
#device-host .rbce-card .rbce-open{position:relative;margin:0;min-height:44px;height:44px;font-size:14px}
#device-host .rbce-card .plw-league{margin-top:4px}
#device-host .rbce-opening{position:absolute;inset:0;z-index:60;display:flex;flex-direction:column;background:radial-gradient(ellipse at 50% 35%,#2d1a21 0,transparent 56%),#080a0c;color:#f2f3f5;font-family:var(--pd-font);overflow-y:auto}
#device-host .rbce-reveal{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:24px;text-align:center;min-height:0}
#device-host .rbce-reveal-art{width:min(62%,220px);aspect-ratio:1;flex:none}
#device-host .rbce-reveal-art>.pds-art{width:100%;height:100%}
#device-host .rbce-result{min-height:174px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;width:100%;padding-top:20px}
#device-host .rbce-result h2{font:700 20px/28px var(--pd-font);margin:0;outline:none}
#device-host .rbce-result p{font:400 15px/22px var(--pd-font);margin:0;color:#aeb4bf;max-width:300px}
#device-host .rbce-amount{font:700 clamp(42px,12vw,56px)/1.12 var(--pd-font);letter-spacing:-.03em;white-space:nowrap;font-variant-numeric:tabular-nums}
#device-host .rbce-credited{font:400 14px/20px var(--pd-font);color:#98d9b2;padding:8px 12px;border-radius:30px;background:#58c78a12}
#device-host .rbce-opening[data-paid=true] .rbce-result{animation:rbce-received .3s ease both}
#device-host .rbce-opening footer{padding:16px 24px 28px}
#device-host .rbce-opening footer .pd-btn{width:100%;min-height:52px}
#device-host .rbhi-safe{width:42px;height:46px;flex:none;display:block}
#device-host .rbhi-safe .pds-art{width:100%;height:100%}
#device-host .rbhi-row{display:grid;grid-template-columns:42px minmax(0,1fr) auto;column-gap:10px}
#device-host .rbhi-row .rbhi-safe{grid-column:1;grid-row:1/3}
#device-host .rbhi-row .rbhi-main{grid-column:2;grid-row:1/3}
#device-host .rbhi-row .rbhi-amt{grid-column:3;grid-row:1}
#device-host .rbhi-row .rbhi-pct{grid-column:3;grid-row:2;font-size:13px}
#device-host .pds-demo-controls[hidden]{display:none!important}
/* Detail routes fill the device. A raised transparent screen cannot cover the dock. */
#device-host:has(.pds-hub[data-rb-fullscreen="true"]) .pd-bottom-dock{display:none}
@keyframes rbce-received{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){#device-host .rbce-result,#device-host .rbce-track>i{animation:none!important;transition:none!important}}

@media(max-width:360px){#device-host .rbce-summary{grid-template-columns:76px minmax(0,1fr) 28px;gap:8px}#device-host .rbce-summary>.pds-art{width:76px;height:76px}}