.bannerPlayer{position:relative;flex-shrink:0;overflow:hidden;background:#e9eee5}
.bannerViewport{position:relative;height:clamp(90px,20vw,190px);overflow:hidden}
.bannerPlayer .bannerSlide,#banner .bannerSlide{position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:cover;display:block}
.bannerPlayer .bannerSlide[hidden],#banner .bannerSlide[hidden]{display:none}
.bannerControls{position:absolute;bottom:7px;left:50%;transform:translateX(-50%);display:flex;align-items:center;padding:0 5px;border-radius:24px;background:#142a20bb;max-width:95%}
.bannerControls button{border:none;color:white;background:transparent;cursor:pointer;padding:0;min-height:30px!important;height:30px;min-width:26px;line-height:1;font:14px sans-serif!important}
.bannerDot::after{content:'';display:block;margin:auto;width:6px;height:6px;border-radius:50%;background:#fff7}.bannerDot[aria-current=true]::after{background:white;width:14px;border-radius:4px}
.bannerPause{margin-left:4px}.bannerEmpty{padding:50px 22px;text-align:center;color:#62746b;font-size:14px;line-height:1.7}
.ui-admin .systemBanner{padding:0;overflow:hidden}.systemBannerHead{padding:24px;background:#203e30;color:white;display:flex;justify-content:space-between;align-items:center;gap:20px}.systemBannerHead h3{margin:0}.systemBannerHead p{color:#ccdbbf;margin-top:5px;font-size:13px}.systemBannerHead>span{white-space:nowrap;font-size:12px;background:#ffffff18;padding:6px 12px;border-radius:20px}
.systemBannerBody{padding:24px}.bannerUpload{display:block;border:1px dashed #9aaf8b;background:#f1f6eb;border-radius:12px;padding:18px;font-weight:700;color:#36572b;text-align:center;cursor:pointer;margin-bottom:20px}.bannerUpload input{display:block;margin:10px auto 0;max-width:100%;font-size:13px}
.bannerCards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:24px}.bannerCard{border:1px solid #dae3d2;border-radius:12px;overflow:hidden}.bannerCard img{display:block;width:100%;height:100px;object-fit:cover}.bannerCardFoot{display:flex;align-items:center;gap:5px;padding:8px}.bannerCardFoot b{margin-right:auto;font-size:12px}.bannerCardFoot button{border:0;background:#edf2e7;border-radius:6px;color:#34522b;min-width:32px;min-height:36px!important;font-size:12px;padding:5px}.bannerCardFoot button:disabled{opacity:.35}
.bannerSetup{display:grid;grid-template-columns:1fr 1fr;gap:24px}.bannerSetup h4{font-size:14px;margin-bottom:12px}.bannerEffects{display:flex;gap:6px;padding:4px;background:#e9efE3;border-radius:10px;margin-bottom:20px}.bannerEffects button{flex:1;border:0;background:transparent;border-radius:8px;color:#58704c;font-weight:700}.bannerEffects button[aria-pressed=true]{background:#17664b;color:white}
.bannerTiming label{display:flex;justify-content:space-between;font-size:13px;font-weight:650;margin-bottom:8px}.bannerTiming input{width:100%;accent-color:#17664b;margin-bottom:20px}.bannerSetup .bannerPlayer{border-radius:12px}.bannerSetup .bannerViewport{height:150px}.bannerHelp{font-size:12px;color:#62746b;line-height:1.6;margin-top:10px}.bannerMessage{font-size:13px;color:#436431;line-height:1.6;margin-top:16px}
@media(max-width:900px){.ui-admin .tabs button{flex:0 0 auto;min-width:90px}}
@media(max-width:600px){.systemBannerHead,.systemBannerBody{padding:18px 16px}.bannerCards{grid-template-columns:repeat(2,minmax(0,1fr))}.bannerSetup{grid-template-columns:minmax(0,1fr)}.bannerCard img{height:85px}.bannerCardFoot{gap:3px;padding:6px}.bannerCardFoot button{min-width:28px}.bannerControls button{min-width:24px}}

/* Keep the customer banner free of overlaid controls. */
#banner .bannerControls{display:none}