.ch-mobbex-ui {
    --ch-mobbex-primary: #1652b8;
    width: 100%;
    margin: 14px 0 18px;
    border: 1px solid rgba(0,0,0,.10);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
    overflow: hidden;
}
.ch-mobbex-ui__header {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 72px;
    padding: 13px 14px;
}
.ch-mobbex-ui__icon {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    color: var(--ch-mobbex-primary);
    background: color-mix(in srgb, var(--ch-mobbex-primary) 9%, white);
}
.ch-mobbex-ui__icon svg { width: 22px; height: 22px; fill: currentColor; }
.ch-mobbex-ui__icon.has-custom-image { overflow:visible; background:transparent; }
.ch-mobbex-ui__icon.is-strip { width:auto; height:auto; flex:0 1 190px; min-width:90px; max-width:190px; border-radius:0; }
.ch-mobbex-ui__icon-image { display:block; width:100%; height:auto; max-height:42px; object-fit:contain; object-position:left center; }
.ch-mobbex-ui__content { min-width: 0; flex: 1 1 auto; }
.ch-mobbex-ui__title { display:block; margin:0 0 2px; color:#222; font-size:15px; line-height:1.3; font-weight:700; }
.ch-mobbex-ui__description { margin:0; color:#6b7280; font-size:12px; line-height:1.45; }
.ch-mobbex-ui__cards { max-width: 145px; max-height: 36px; width:auto; height:auto; object-fit:contain; flex:0 1 auto; }
.ch-mobbex-ui__button {
    flex: 0 0 auto;
    min-height: 38px;
    padding: 0 18px;
    border: 1px solid var(--ch-mobbex-primary) !important;
    border-radius: 7px !important;
    background: var(--ch-mobbex-primary) !important;
    color: #fff !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: .02em;
    cursor: pointer;
    transition: transform .18s ease, opacity .18s ease, box-shadow .18s ease;
}
.ch-mobbex-ui__button:hover { opacity:.92; transform:translateY(-1px); box-shadow:0 5px 12px rgba(0,0,0,.12); }
.ch-mobbex-ui__button:disabled { cursor:wait; opacity:.55; transform:none; }
.ch-mobbex-ui__panel { display:none; border-top:1px solid rgba(0,0,0,.08); padding: 12px; }
.ch-mobbex-ui.is-open .ch-mobbex-ui__panel { display:block; animation:chMobbexReveal .24s ease both; }
.ch-mobbex-ui.is-open .ch-mobbex-ui__button { display:none; }
.ch-mobbex-ui__original-host { width:100%; }
.ch-mobbex-ui__status { display:none; margin:0; padding:10px 14px; font-size:12px; color:#9a3412; background:#fff7ed; border-top:1px solid #fed7aa; }
.ch-mobbex-ui.has-error .ch-mobbex-ui__status { display:block; }
@keyframes chMobbexReveal { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:none; } }
@media (max-width: 767px) {
    .ch-mobbex-ui__header { flex-wrap:wrap; gap:10px; padding:12px; }
    .ch-mobbex-ui__icon { width:34px; height:34px; flex-basis:34px; }
    .ch-mobbex-ui__icon.is-strip { width:auto; height:auto; flex:1 1 100%; max-width:220px; order:1; }
    .ch-mobbex-ui__icon.is-strip + .ch-mobbex-ui__content { flex:1 1 100%; order:2; }
    .ch-mobbex-ui__content { flex:1 1 calc(100% - 48px); }
    .ch-mobbex-ui__cards { order:3; max-width:130px; max-height:32px; }
    .ch-mobbex-ui__button { order:4; width:100%; }
    .ch-mobbex-ui__panel { padding:8px 0; }
}