/* GAN89 component styles extracted from index.html.
   Original block order preserved exactly. */

/* Extracted inline component styles — block 1 */
.paylater-promo{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,#f0fdf4 0,#fcdcdc 100%);border:1px solid #ef8686;border-radius:8px;padding:8px 12px;font-size:13px;line-height:1.4;margin:8px 0}.paylater-promo-sm{padding:6px 10px;font-size:11px;gap:6px}.paylater-promo-md{padding:8px 12px;font-size:13px;gap:8px}.paylater-promo-lg{padding:10px 16px;font-size:14px;gap:10px}.paylater-icon{font-size:1.2em;flex-shrink:0}.paylater-text{display:flex;flex-direction:column;gap:2px}.paylater-text strong{color:#801515;font-weight:600}.paylater-text small{color:#ef4444;font-size:.85em;opacity:.9}.paylater-desktop-only{display:none}.paylater-mobile-only{display:flex}@media (min-width:641px){.paylater-desktop-only{display:flex}.paylater-mobile-only{display:none}}@media (max-width:640px){.paylater-promo{font-size:12px;padding:7px 10px}.paylater-promo-lg{font-size:13px;padding:8px 12px}}@media print{.paylater-promo{display:none!important}}.paylater-compact{display:inline-block;font-size:11px;font-weight:600;color:#960505;background:#d1fae5;padding:3px 8px;border-radius:4px;margin:6px 0 4px;line-height:1.3}@media (max-width:640px){.paylater-compact{font-size:10px;padding:2px 6px;margin:5px 0 3px}}@media print{.paylater-compact{display:none!important}}

/* Extracted inline component styles — block 2 */
.pd-voucher-dblmal{margin:10px 0;display:flex;flex-direction:column;gap:6px}.pdv-min-item{display:flex;align-items:center;gap:8px;padding:0;height:32px;transition:all .2s ease}.pdv-min-hidden{display:none}.pdv-min-disabled{opacity:.5}.pdv-badge-btn{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,#ea6666 0,#ea6666 100%);border:none;border-radius:8px;padding:3px;cursor:pointer;transition:all .2s ease;width:auto}.pdv-badge-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px rgba(102,126,234,.3)}.pdv-badge-btn:disabled{opacity:.6;cursor:not-allowed}.pdv-badge-icon{color:#fff;flex-shrink:0}.pdv-badge-text{font-size:14px;font-weight:700;color:#fff;white-space:nowrap}.pdv-badge-code{font-family:'Courier New',monospace;font-size:13px;font-weight:700;color:#fff;background:rgba(255,255,255,.2);padding:4px 8px;border-radius:4px;border:none;white-space:nowrap}.pdv-min-copy,.pdv-min-more{padding:4px 12px;font-size:12px;font-weight:600;border-radius:5px;border:1px solid #e2e8f0;background:#fff;color:#ea6666;cursor:pointer;transition:all .2s ease;white-space:nowrap}.pdv-min-copy:hover:not(:disabled),.pdv-min-more:hover{background:#ea6666;color:#fff;border-color:#ea6666}.pdv-min-copy:disabled{opacity:.4;cursor:not-allowed}.pdv-min-copy.copied{background:#c52222;color:#fff;border-color:#c52222}.pdv-min-more{margin-left:auto}.modal-close{position:absolute;top:20px;right:20px;background:none;border:none;cursor:pointer;color:#64748b;padding:4px;transition:color .2s ease}.modal-close:hover{color:#1e293b}.modal-body{margin-bottom:8px}.voucher-modal-content{text-align:center}.voucher-modal-badge{display:inline-flex;flex-direction:row;align-items:center;gap:6px;background:linear-gradient(135deg,#ea6666 0,#ea6666 100%);border-radius:10px;padding:8px 16px;margin-bottom:12px}.vmb-value{font-size:18px;font-weight:700;color:#fff;line-height:1}.vmb-label{font-size:18px;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.5px}.voucher-modal-code{font-family:'Courier New',monospace;font-size:14px;font-weight:700;color:#ea6666;background:rgba(102,126,234,.1);padding:6px 12px;border-radius:6px;border:2px dashed rgba(102,126,234,.3);display:inline-block;margin-bottom:10px}.voucher-modal-name{font-size:14px;font-weight:600;color:#1e293b;margin-bottom:16px}.voucher-modal-details{text-align:left;background:#f8fafc;border-radius:8px;padding:12px;margin-bottom:16px}.vmd-item{display:flex;align-items:flex-start;gap:8px;padding:6px 0;font-size:13px;color:#64748b;border-bottom:1px solid #e2e8f0}.vmd-item:last-child{border-bottom:none}.vmd-item svg{color:#ea6666;flex-shrink:0;margin-top:2px}.vmd-item strong{color:#1e293b}.modal-actions{padding:20px}.modal-btn-primary{background:linear-gradient(135deg,#ea6666 0,#a24b4b 100%);color:#fff}.modal-btn-primary:hover{opacity:.9;transform:translateY(-1px)}@media (max-width:640px){.pdv-min-item{gap:6px}.pdv-badge-btn{padding:3px;gap:6px}.pdv-badge-text{font-size:13px}.pdv-badge-code{font-size:12px;padding:3px 6px}.pdv-min-copy,.pdv-min-more{padding:3px 10px;font-size:11px}.modal-dialog{max-width:95%;margin:20px}.vmb-value{font-size:16px}.vmb-label{font-size:16px}.voucher-modal-code{font-size:13px;padding:5px 10px}}

/* Extracted inline component styles — block 3 */
.promo-endyear-dbl-banner{display:flex;align-items:center;gap:12px;padding:12px 16px;background:rgba(255,255,255,.8);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:2px solid rgba(242,140,26,.2);border-radius:12px;margin:16px 0;box-shadow:0 4px 16px rgba(0,0,0,.08);transition:all .3s ease}.promo-endyear-dbl-banner:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.12);border-color:rgba(242,140,26,.4)}.pey-icon{font-size:32px;line-height:1;flex-shrink:0}.pey-content{flex:1;min-width:0}.pey-content strong{display:block;font-size:14px;font-weight:700;color:#F21A1A;margin-bottom:2px}.pey-content span{display:block;font-size:13px;color:#64748b;line-height:1.4}.pey-link{flex-shrink:0;padding:8px 16px;background:linear-gradient(135deg,#F21A1A,#FFB84D);color:#fff;text-decoration:none;font-size:13px;font-weight:700;border-radius:8px;white-space:nowrap;transition:all .2s ease;box-shadow:0 2px 8px rgba(242,140,26,.25)}.pey-link:hover{transform:translateX(2px);box-shadow:0 4px 12px rgba(242,140,26,.35)}@media(max-width:640px){.promo-endyear-dbl-banner{flex-wrap:wrap;gap:8px;padding:10px 12px}.pey-icon{font-size:28px;align-self:flex-start}.pey-content{flex:1;min-width:0}.pey-content strong{font-size:12px}.pey-content span{font-size:11px;line-height:1.3}.pey-link{width:100%;flex-basis:100%;font-size:11px;padding:6px 12px;text-align:center}}@media print{.promo-endyear-dbl-banner{display:none!important}}

/* Extracted inline component styles — block 4 */
.pd-title-row{position:relative;margin-bottom:12px;padding-right:52px}.pd-title{margin:0!important}.pd-share-btn{position:absolute;top:0;right:0;width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;border:1px solid #e2e8f0;background:#fff;color:#64748b;cursor:pointer;transition:all .2s ease;-webkit-tap-highlight-color:transparent}.pd-share-btn:hover{background:#f8fafc;border-color:#cbd5e1;color:#0f172a;transform:translateY(-1px)}.pd-share-btn:active{transform:translateY(0)}.pd-share-btn svg{display:block}

.pd-share-modal-overlay{position:fixed;inset:0;background:rgba(15,23,42,.75);backdrop-filter:blur(4px);z-index:99999;display:none;align-items:center;justify-content:center;padding:0;animation:fadeIn .2s ease}.pd-share-modal-overlay.show{display:flex}.pd-share-modal{background:#fff;border-radius:20px;box-shadow:0 25px 50px -12px rgba(0,0,0,.25);max-width:480px;width:100%;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s cubic-bezier(.16,1,.3,1)}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes slideUp{from{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}

.pd-share-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid #f1f5f9}.pd-share-title{font-size:18px;font-weight:700;color:#0f172a;margin:0}.pd-share-close{width:32px;height:32px;border-radius:8px;border:0;background:transparent;color:#64748b;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s ease}.pd-share-close:hover{background:#f1f5f9;color:#0f172a}.pd-share-body{padding:24px;overflow-y:auto}

.pd-share-preview{display:flex;gap:12px;padding:16px;background:#f8fafc;border-radius:12px;margin-bottom:24px}.pd-share-preview-img{width:64px;height:64px;border-radius:8px;object-fit:cover;flex-shrink:0;border:1px solid #e2e8f0}.pd-share-preview-info{flex:1;min-width:0}.pd-share-preview-name{font-size:14px;font-weight:600;color:#0f172a;margin:0 0 4px 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.pd-share-preview-price{font-size:16px;font-weight:700;color:#e90e0e;margin:0}

.pd-share-label{font-size:13px;font-weight:600;color:#475569;margin:0 0 12px 0;text-transform:uppercase;letter-spacing:.5px}.pd-share-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:24px}.pd-share-option{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 8px;border:1.5px solid #e2e8f0;border-radius:12px;background:#fff;cursor:pointer;transition:all .2s ease;text-decoration:none;color:inherit}.pd-share-option:hover{border-color:#94a3b8;background:#f8fafc;transform:translateY(-2px)}.pd-share-option:active{transform:translateY(0)}

.pd-share-icon{width:40px;height:40px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;position:relative}.pd-share-icon svg{width:24px;height:24px;display:block}.pd-share-icon-whatsapp{background:linear-gradient(135deg,#25D366 0%,#128C7E 100%);color:#fff}.pd-share-icon-facebook{background:linear-gradient(135deg,#1877F2 0%,#0c63d4 100%);color:#fff}.pd-share-icon-twitter{background:linear-gradient(135deg,#1DA1F2 0%,#0d8bd9 100%);color:#fff}.pd-share-icon-telegram{background:linear-gradient(135deg,#0088cc 0%,#0077b3 100%);color:#fff}.pd-share-icon-email{background:linear-gradient(135deg,#EA4335 0%,#c5331f 100%);color:#fff}.pd-share-icon-copy{background:linear-gradient(135deg,#f1db63 0%,#e5d146 100%);color:#fff}.pd-share-icon-pdf{background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);color:#fff}.pd-share-name{font-size:12px;font-weight:600;color:#475569;text-align:center}

.pd-share-copy-section{background:#f8fafc;padding:16px;border-radius:12px}.pd-share-copy-input-wrap{display:flex;gap:8px}.pd-share-copy-input{flex:1;padding:12px 14px;border:1px solid #e2e8f0;border-radius:10px;font-size:14px;color:#0f172a;background:#fff;font-family:'Segoe UI',system-ui,sans-serif}.pd-share-copy-input:focus{outline:0;border-color:#e90e0e;box-shadow:0 0 0 3px rgba(14,165,233,.1)}.pd-share-copy-btn{padding:12px 20px;border:0;border-radius:10px;background:linear-gradient(135deg,#e90e0e 0%,#0284c7 100%);color:#fff;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}.pd-share-copy-btn:hover{background:linear-gradient(135deg,#0284c7 0%,#0369a1 100%);transform:translateY(-1px);box-shadow:0 4px 12px rgba(14,165,233,.3)}.pd-share-copy-btn:active{transform:translateY(0)}.pd-share-copy-btn svg{width:16px;height:16px}.pd-share-copy-btn.copied{background:linear-gradient(135deg,#c52222 0%,#ef4444 100%);pointer-events:none}

@media(max-width:640px){.pd-share-modal{border-radius:20px 20px 0 0;margin-top:auto;max-height:85vh}.pd-share-grid{grid-template-columns:repeat(3,1fr)}.pd-share-header{padding:16px 20px}.pd-share-body{padding:20px}.pd-share-btn{width:36px;height:36px}.pd-share-btn svg{width:18px;height:18px}}@media(max-width:480px){.pd-share-grid{grid-template-columns:repeat(3,1fr);gap:10px}.pd-share-option{padding:12px 6px}.pd-share-icon{width:36px;height:36px}.pd-share-icon svg{width:20px;height:20px}.pd-share-name{font-size:11px}}

.mf-share{background:#fff;color:#fb923c;border:2px solid #fb923c;display:inline-flex;align-items:center;justify-content:center}.mf-share:active{transform:scale(.95)}.mf-share svg{display:block}

@media(max-width:640px){.pd-share-btn{display:none!important}}

.stock-badge.in{background:#e6f9ec;color:#15803d;border-radius:999px;padding:4px 10px;font-weight:700}.stock-badge.out{background:#fee2e2;color:#b91c1c;border-radius:999px;padding:4px 10px;font-weight:700}

.stock-info-btn{--c:#e90e0e;--b:#bae6fd;--bg:#f0f9ff;--bg-h:#e0f2fe;--b-h:#e90e0e;margin-left:0;display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;padding:4px 10px;border-radius:999px;border:1.5px solid var(--b);background:var(--bg);color:var(--c);cursor:pointer;font-size:12px;font-weight:600;transition:all .2s ease;-webkit-tap-highlight-color:transparent}.stock-info-btn:hover{background:var(--bg-h);border-color:var(--b-h);color:#0284c7;transform:translateY(-1px);box-shadow:0 2px 8px rgba(14,165,233,.15)}.stock-info-btn:active{transform:translateY(0)}.stock-info-btn:focus-visible{outline:0;box-shadow:0 0 0 3px rgba(14,165,233,.2)}.stock-info-btn svg{width:14px;height:14px;flex-shrink:0}.stock-info-btn .btn-text{white-space:nowrap}

.stock-popover{position:absolute;z-index:9999;min-width:280px;max-width:92vw;background:#0b1220;color:#eef3ff;border:1px solid rgba(255,255,255,.08);border-radius:14px;box-shadow:0 20px 40px rgba(12,12,20,.45);padding:12px 12px 8px;display:none}.stock-popover.show{display:block}.stock-popover::before{content:"";position:absolute;top:-8px;left:24px;width:14px;height:14px;background:#0b1220;border-left:1px solid rgba(255,255,255,.08);border-top:1px solid rgba(255,255,255,.08);transform:rotate(45deg)}.sp-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.sp-title{font-weight:800;font-size:14px}.sp-close{background:transparent;border:0;color:#98a2b3;cursor:pointer}

.sp-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.sp-item{display:grid;grid-template-columns:1fr auto 32px;column-gap:12px;align-items:center;padding:10px 10px;min-height:44px;border-radius:10px;background:rgba(255,255,255,.03)}.sp-left{display:flex;align-items:center;gap:10px}.sp-dot{width:10px;height:10px;border-radius:999px;background:var(--dot,#60a5fa);display:inline-block}.sp-label{font-weight:600;font-size:13px}


.sp-qty{grid-column:2;justify-self:end;min-width:40px;text-align:right;font-weight:800;font-size:13px;color:#cfe4ff;font-variant-numeric:tabular-nums}

.sp-wa{
  grid-column:3; justify-self:end;
  width:32px; height:32px; min-width:32px; min-height:32px;
  box-sizing:border-box;
  padding:0; line-height:0; text-decoration:none; outline:0;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:999px; border:1px solid rgba(37,211,102,.60);  /* 1px untuk hasil “crisp” */
  background:rgba(37,211,102,.08); color:#25D366;
  transition:background-color .15s ease, border-color .15s ease, transform .05s ease;
  -webkit-tap-highlight-color:transparent;
}
.sp-wa:hover{background:rgba(37,211,102,.16);border-color:rgba(37,211,102,.75)}
.sp-wa:active{transform:translateY(.5px) scale(.98)}

.sp-wa svg{width:18px;height:18px;display:block;vertical-align:middle}
.stock-popover a{text-decoration:none}

#deskripsi img{max-width:200px!important;height:unset!important}@media(max-width:640px){.stock-popover{position:fixed;left:0;right:0;bottom:max(12px,env(safe-area-inset-bottom,12px));margin:0 10px;padding:14px 12px 10px;border-radius:16px}.stock-popover::before{display:none}.stock-info-btn{padding:4px 8px;gap:4px;border:0;background:transparent}.stock-info-btn:hover{background:transparent;box-shadow:none;transform:none}.stock-info-btn .btn-text{display:none}.stock-info-btn svg{width:16px;height:16px}.sp-item{grid-template-columns:1fr auto 36px}.sp-wa{width:36px;height:36px;min-width:36px;min-height:36px}.sp-wa svg{width:19px;height:19px}}

.stock-dot{position:absolute;bottom:8px;right:8px;width:8px;height:8px;border-radius:50%;box-shadow:0 1px 3px rgba(0,0,0,0.4);z-index:2;cursor:help}.stock-dot.ready{background:#10b981}.stock-dot.low{background:#f59e0b}.stock-dot.out{background:#ef4444}.stock-dot:hover{transform:scale(1.2);transition:transform 0.2s ease}@media(max-width:640px){.stock-dot{width:7px;height:7px;bottom:6px;right:6px}}

.pd-related-card .spec-chips{font-size:11px;color:#64748b;margin:4px 0 6px 0;line-height:1.3;font-weight:500}.pd-related-card .spec-chips .spec-divider{margin:0 4px;opacity:0.6}@media(max-width:640px){.pd-related-card .spec-chips{font-size:10px;margin:3px 0 5px 0}#deskripsi img{max-width:300px!important;height:unset!important;justify-self:center!important}}

.pwp-trigger-badge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px 4px;background:linear-gradient(135deg,#fbbf24 0%,#f59e0b 100%);color:#78350f;border-radius:6px;font-size:.65rem;font-weight:600;border:0}.pwp-trigger-badge svg{flex-shrink:0;width:12px;height:12px}
.pwp-deals-section{margin:0;padding:12px;background:linear-gradient(135deg,#fef3c7 0%,#fde68a 100%);border-radius:12px;border:2px solid #fbbf24}.pwp-deals-header{display:flex;gap:10px;margin-bottom:10px}.pwp-icon{flex-shrink:0;color:#f59e0b;width:18px;height:18px}.pwp-text .pwp-title{margin:0 0 2px 0;font-size:14px;font-weight:700;color:#78350f}.pwp-text .pwp-subtitle{margin:0;font-size:11px;color:#92400e;opacity:0.9}.pwp-deals-loading{text-align:center;padding:40px 0;color:#92400e}.pwp-spinner{width:40px;height:40px;border:3px solid #fbbf24;border-top-color:#f59e0b;border-radius:50%;animation:spin 0.8s linear infinite;margin:0 auto 12px}@keyframes spin{to{transform:rotate(360deg)}}
.pwp-deals-grid{display:flex;flex-direction:column;gap:6px}.pwp-deal-card{background:#fff;border-radius:6px;overflow:hidden;border:1px solid #fbbf24;display:flex;align-items:center;padding:8px;gap:10px}.pwp-deal-card:hover{background:#fef3c7}.pwp-deal-thumb{flex-shrink:0;width:50px;height:50px;background:#f8fafc;overflow:hidden;border-radius:4px}.pwp-deal-thumb img{width:100%;height:100%;object-fit:cover}.pwp-deal-badge{background:#dc2626;color:#fff;padding:2px 5px;border-radius:3px;font-size:9px;font-weight:700;margin-left:auto}.pwp-deal-info{flex:1;display:flex;flex-direction:column;gap:4px}.pwp-deal-name{font-size:12px;font-weight:600;color:#0f172a;margin:0;line-height:1.2}.pwp-deal-prices{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.pwp-deal-price{font-size:14px;font-weight:800;color:#dc2626;white-space:nowrap}.pwp-deal-original{font-size:11px;color:#64748b;text-decoration:line-through;white-space:nowrap}.pwp-cart-note{margin-top:8px;padding:6px 10px;background:#e0f2fe;border-left:2px solid#e90e0e;font-size:11px;color:#0c4a6e;border-radius:4px}
@media(max-width:640px){.pwp-deals-section{margin:12px 0;padding:10px;border-radius:10px}.pwp-deals-header{gap:8px}.pwp-text .pwp-title{font-size:13px}.pwp-text .pwp-subtitle{font-size:10px}.pwp-deal-card{padding:6px;gap:8px}.pwp-deal-thumb{width:45px;height:45px}.pwp-deal-name{font-size:11px}.pwp-deal-price{font-size:13px}.pwp-deal-original{font-size:10px}}

.preorder-badge{display:inline-flex;align-items:center;gap:5px;padding:6px 12px;background:linear-gradient(135deg,#8b5cf6 0%,#7c3aed 100%);color:#fff;border-radius:8px;font-size:13px;font-weight:700;border:0;box-shadow:0 2px 8px rgba(139,92,246,.25)}.preorder-badge svg{width:16px;height:16px;flex-shrink:0}.preorder-info{margin:12px 0;padding:14px;background:linear-gradient(135deg,#f5f3ff 0%,#ede9fe 100%);border:1.5px solid #c4b5fd;border-radius:12px}.preorder-info-header{display:flex;align-items:center;gap:8px;margin-bottom:10px}.preorder-info-icon{width:20px;height:20px;color:#7c3aed;flex-shrink:0}.preorder-info-title{font-size:14px;font-weight:700;color:#5b21b6;margin:0}.preorder-info-items{display:flex;flex-direction:column;gap:8px}.preorder-info-row{display:flex;align-items:center;justify-content:space-between;font-size:13px}.preorder-info-label{color:#6b21a8;font-weight:600}.preorder-info-value{color:#5b21b6;font-weight:700}.preorder-info-value.highlight{color:#dc2626;font-size:14px}.preorder-info-note{margin-top:10px;padding:8px 10px;background:#fef3c7;border-left:2px solid #f59e0b;font-size:12px;color:#78350f;border-radius:6px;line-height:1.4}@media(max-width:640px){.preorder-badge{font-size:12px;padding:5px 10px}.preorder-info{margin:10px 0;padding:12px}.preorder-info-title{font-size:13px}.preorder-info-row{font-size:12px}.preorder-info-note{font-size:11px;padding:6px 8px}}

/* Extracted inline component styles — block 5 */
#anlc-beauty-standalone-v1 {
        --rose-light: #ffd6df;
        --rose-main: #e87993;
        --rose-dark: #b84663;
        --cream: #fff8f5;
        --text-dark: #4b2430;
        display: flex;
        justify-content: center;
        padding: 20px;
        font-family: "Segoe UI", Arial, sans-serif;
    }

    #anlc-beauty-standalone-v1 * {
        box-sizing: border-box;
    }

    #anlc-beauty-standalone-v1 .beauty-wrapper {
        width: 100%;
        max-width: 440px;
        padding: 30px;
        overflow: hidden;
        position: relative;
        text-align: center;
        border-radius: 26px;
        border: 3px solid var(--rose-main);
        background:
            radial-gradient(circle at top right, rgba(255, 214, 223, 0.9), transparent 38%),
            linear-gradient(145deg, #fffaf8, #fbe7ec);
        box-shadow: 0 15px 45px rgba(184, 70, 99, 0.25);
    }

    #anlc-beauty-standalone-v1 .beauty-wrapper::before,
    #anlc-beauty-standalone-v1 .beauty-wrapper::after {
        content: "";
        position: absolute;
        border-radius: 50%;
        pointer-events: none;
        background: rgba(232, 121, 147, 0.12);
    }

    #anlc-beauty-standalone-v1 .beauty-wrapper::before {
        width: 170px;
        height: 170px;
        top: -90px;
        left: -70px;
    }

    #anlc-beauty-standalone-v1 .beauty-wrapper::after {
        width: 130px;
        height: 130px;
        right: -60px;
        bottom: -60px;
    }

    #anlc-beauty-standalone-v1 .beauty-label {
        position: relative;
        z-index: 2;
        display: inline-block;
        margin-bottom: 10px;
        padding: 6px 15px;
        color: #fff;
        font-size: 0.75rem;
        font-weight: 700;
        letter-spacing: 1.5px;
        border-radius: 30px;
        text-transform: uppercase;
        background: linear-gradient(135deg, var(--rose-main), var(--rose-dark));
    }

    #anlc-beauty-standalone-v1 .beauty-title {
        position: relative;
        z-index: 2;
        margin: 0 0 8px;
        color: var(--text-dark);
        font-size: 1.45rem;
        line-height: 1.35;
        text-transform: uppercase;
        letter-spacing: 1.5px;
    }

    #anlc-beauty-standalone-v1 .beauty-subtitle {
        position: relative;
        z-index: 2;
        margin: 0 0 22px;
        color: #825461;
        font-size: 0.92rem;
        line-height: 1.6;
    }

    #anlc-beauty-standalone-v1 .treatment-box {
        position: relative;
        z-index: 2;
        display: flex;
        justify-content: center;
        gap: 12px;
        padding: 16px;
        margin-bottom: 22px;
        border-radius: 18px;
        border: 1px solid rgba(184, 70, 99, 0.25);
        background: rgba(255, 255, 255, 0.82);
        box-shadow: inset 0 0 18px rgba(232, 121, 147, 0.1);
    }

    #anlc-beauty-standalone-v1 .treatment-window {
        width: 88px;
        height: 108px;
        overflow: hidden;
        position: relative;
        border-radius: 14px;
        border: 2px solid var(--rose-light);
        background: linear-gradient(180deg, #fff, #fff2f5);
        box-shadow: 0 8px 18px rgba(184, 70, 99, 0.13);
    }

    #anlc-beauty-standalone-v1 .treatment-item {
        width: 100%;
        height: 108px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 2.8rem;
        text-shadow: 0 4px 10px rgba(184, 70, 99, 0.22);
    }

    #anlc-beauty-standalone-v1 .is-scanning {
        filter: blur(3px);
        animation: beauty-scan 0.12s infinite linear;
    }

    @keyframes beauty-scan {
        0% {
            transform: translateY(0);
        }

        100% {
            transform: translateY(-108px);
        }
    }

    #anlc-beauty-standalone-v1 .beauty-button {
        position: relative;
        z-index: 2;
        width: 100%;
        padding: 13px 24px;
        border: none;
        border-radius: 30px;
        color: #fff;
        cursor: pointer;
        font-size: 1rem;
        font-weight: 800;
        letter-spacing: 0.8px;
        background: linear-gradient(180deg, #ef8da4, #c34d6a);
        box-shadow: 0 5px 0 #98364e;
        transition: 0.2s ease;
    }

    #anlc-beauty-standalone-v1 .beauty-button:hover {
        filter: brightness(1.06);
        transform: translateY(-1px);
    }

    #anlc-beauty-standalone-v1 .beauty-button:active {
        transform: translateY(3px);
        box-shadow: 0 2px 0 #98364e;
    }

    #anlc-beauty-standalone-v1 .beauty-button:disabled {
        opacity: 0.55;
        cursor: not-allowed;
        filter: grayscale(0.5);
        transform: none;
    }

    #anlc-beauty-standalone-v1 .beauty-status {
        position: relative;
        z-index: 2;
        min-height: 65px;
        margin-top: 18px;
        padding: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #714652;
        font-size: 0.95rem;
        line-height: 1.5;
        border-radius: 15px;
        background: rgba(255, 255, 255, 0.58);
    }

    #anlc-beauty-standalone-v1 .glow-result {
        color: var(--rose-dark);
        font-size: 1.12rem;
        font-weight: 800;
        animation: beauty-glow 0.55s infinite alternate;
    }

    @keyframes beauty-glow {
        from {
            transform: scale(1);
            text-shadow: 0 0 4px rgba(232, 121, 147, 0.3);
        }

        to {
            transform: scale(1.05);
            text-shadow:
                0 0 12px rgba(232, 121, 147, 0.65),
                0 0 22px rgba(255, 214, 223, 0.9);
        }
    }

    #anlc-beauty-standalone-v1 .beauty-note {
        position: relative;
        z-index: 2;
        margin-top: 15px;
        color: #9a6c77;
        font-size: 0.76rem;
        line-height: 1.45;
    }

    @media (max-width: 480px) {
        #anlc-beauty-standalone-v1 {
            padding: 12px;
        }

        #anlc-beauty-standalone-v1 .beauty-wrapper {
            padding: 24px 16px;
        }

        #anlc-beauty-standalone-v1 .treatment-box {
            gap: 8px;
            padding: 12px;
        }

        #anlc-beauty-standalone-v1 .treatment-window {
            width: 78px;
            height: 98px;
        }

        #anlc-beauty-standalone-v1 .treatment-item {
            height: 98px;
            font-size: 2.45rem;
        }
    }

/* Extracted inline component styles — block 6 */
/* ===============================
   WRAPPER
================================ */
.sea-urchin-container-v3{
  display:flex;
  justify-content:center;
  padding:16px 10px;
  font-family:"Orbitron","Poppins",system-ui,sans-serif;
}

/* ===============================
   MACHINE CORE (PTW SIMPLE)
================================ */
.sea-urchin-machine-v3{
  position:relative;
  width:100%;
  max-width:520px;
  padding:16px;
  border-radius:16px;
  overflow:hidden;
  isolation:isolate;

  background:
    radial-gradient(circle at 15% 0%, rgba(255, 0, 0, 0.14), transparent 48%),
    radial-gradient(circle at 85% 100%, rgba(255, 0, 0, 0.14), transparent 55%),
    linear-gradient(145deg,#210000,#0f0000);

  border:1px solid rgba(255, 0, 0, 0.45);

  box-shadow:
    inset 0 0 18px rgba(255, 0, 0, 0.25),
    0 0 18px rgba(255, 0, 0, 0.35);

  color:#eaffff;
}

/* HUD SWEEP (lebih halus) */
.sea-urchin-machine-v3::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(120deg, transparent 40%, rgba(0,255,255,.08), transparent 65%);
  animation:hudSweep 7s linear infinite;
  pointer-events:none;
  opacity:.8;
}

/* ===============================
   TITLE
================================ */
.sea-urchin-title-v3{
  text-align:center;
  margin:0 0 12px;
  font-size:15px;
  font-weight:900;
  letter-spacing:1px;
  text-shadow:0 0 6px rgba(255, 0, 0, 0.9);
}

/* ===============================
   CONTROLS
================================ */
.sea-urchin-controls-v3{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  padding:12px;
  border-radius:14px;

  background:rgba(0, 0, 0, 0.4);
  border:1px solid rgba(255, 0, 0, 0.35);
  box-shadow: inset 0 0 14px rgba(255, 0, 0, 0.22);
}

.sea-urchin-controls-v3 label{
  display:grid;
  gap:6px;
  font-size:10px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color:#ff9b9b;
}

.sea-urchin-controls-v3 select,
.sea-urchin-controls-v3 input{
  background:rgba(32, 31, 0, 0.92);
  color:#eaffff;
  border:1px solid rgba(255, 0, 0, 0.5);
  border-radius:10px;
  padding:7px 9px;
  font-weight:700;
  font-size:12px;
  outline:none;
  box-shadow: inset 0 0 10px rgba(0,200,255,.20);
}

/* BUTTON */
#btnCrabRandom{
  grid-column:span 2;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;

  background:linear-gradient(145deg,#8d1111,#c51010);
  border:none;
  color:#001018;
  font-weight:900;
  letter-spacing:.8px;
  border-radius:14px;
  cursor:pointer;
  padding:10px 12px;
  font-size:12px;

  box-shadow:0 0 16px rgba(255, 0, 0, 0.7);
  transition:.2s ease;
}

#btnCrabRandom:active{ transform:scale(.98); }
#btnCrabRandom:disabled{ opacity:.75; cursor:not-allowed; }

/* ===============================
   MAIN RESULT
================================ */
.sea-urchin-main-result-v3{
  margin-top:12px;
  padding:12px;
  border-radius:14px;

  background:rgba(30, 27, 0, 0.78);
  border:1px solid rgba(255, 0, 0, 0.35);
  box-shadow: inset 0 0 16px rgba(255, 0, 0, 0.26);
}

.sea-urchin-status-v3{
  text-align:center;
  font-weight:800;
  letter-spacing:.8px;
  color:#ff9b9b;
  margin-bottom:10px;
  font-size:11px;
}

.sea-urchin-highlight-box{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding-bottom:10px;
  margin-bottom:10px;
  border-bottom:1px dashed rgba(255, 0, 0, 0.3);
}

.k, .k-rtp{
  font-size:10px;
  color:#ff9b9b;
  text-transform:uppercase;
}

.v-game{
  font-size:14px;
  font-weight:900;
  color:#ffffff;
  margin-top:6px;
  line-height:1.2;
}

.provider-info{ margin-top:8px; font-size:11px; color:#fea3a3; opacity:.95; }
.k-small{ color:#ff9b9b; font-size:10px; }
.v-small{ color:#ffeaea; font-weight:900; }

.v-rtp-huge{
  font-size:2.4em;
  font-weight:900;
  color:#8d1111;
  text-shadow:0 0 10px rgba(255, 0, 0, 0.7);
  line-height:1;
  letter-spacing:1px;
}

/* DETAILS */
.sea-urchin-details-v3{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  background:rgba(0,0,0,.30);
  padding:10px;
  border-radius:12px;
}

.k-detail{
  font-size:9px;
  color:#ff8f8f;
  text-transform:uppercase;
}
.v-detail{
  font-size:12px;
  font-weight:800;
  color:#ffffff;
  margin-top:4px;
  letter-spacing:.8px;
}

.sea-urchin-tip-v3{
  margin-top:10px;
  font-size:10px;
  color:#fea3a3;
  opacity:.9;
  text-align:center;
}

/* ALTS */
.sea-urchin-alts-v3{
  margin-top:12px;
  padding:12px;
  border-radius:14px;
  background:rgba(0,0,0,.40);
  border:1px solid rgba(255, 0, 0, 0.35);
}
.sea-urchin-alts-title-v3{
  font-weight:900;
  color:#ff9b9b;
  margin-bottom:10px;
  font-size:12px;
}
.sea-urchin-alt-list-v3{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}

.sea-urchin-alt-item{
  background:rgba(0,14,34,.86);
  border-radius:12px;
  padding:10px;
  border-left:3px solid rgba(255, 0, 0, 0.9);
}
.sea-urchin-alt-item .g{ font-weight:900; color:#eaffff; font-size:12px; }
.sea-urchin-alt-item .p{ font-size:10px; color:#ff9b9b; margin-top:4px; }
.sea-urchin-alt-item .r{ margin-top:6px; font-weight:900; color:#8d1111; letter-spacing:.8px; font-size:12px; }

.sea-urchin-note-v3{
  margin-top:10px;
  font-size:10px;
  color:#fea3a3;
  opacity:.85;
  text-align:center;
}

/* MOBILE */
@media(max-width:420px){
  .sea-urchin-highlight-box{flex-direction:column}
  .sea-urchin-details-v3{grid-template-columns:1fr}
}

/* ANIM */
@keyframes hudSweep{
  0%{transform:translateX(-110%)}
  100%{transform:translateX(110%)}
}
@keyframes pulse{0%{opacity:.55}50%{opacity:1}100%{opacity:.55}}

/* Extracted inline component styles — block 7 */
.qoala-banner-card{padding:0;overflow:hidden}.qoala-banner{background:linear-gradient(135deg, #2fd406 0%, #16b208 100%);padding:12px 16px;display:flex;align-items:center;justify-content:space-between;color:white;text-decoration:none;min-height:60px}.qoala-banner-content{display:flex;align-items:center;gap:12px}.qoala-icon{display:flex;align-items:center;justify-content:center}.qoala-shield-img{width:36px;height:36px;object-fit:contain;opacity:0.9}.qoala-title{font-weight:600;font-size:14px;line-height:1.2}.qoala-subtitle{font-size:12px;opacity:0.9;line-height:1.2}.qoala-cta{background:rgba(255,255,255,0.2);color:white;padding:6px 12px;border-radius:6px;font-size:12px;font-weight:600;text-decoration:none;transition:background 0.2s ease;border:1px solid rgba(255,255,255,0.3)}.qoala-cta:hover{background:rgba(255,255,255,0.3);color:white}@media(max-width:768px){.qoala-banner{padding:10px 12px}.qoala-title{font-size:17px}.qoala-subtitle{font-size:11px}}

/* Extracted inline component styles — block 8 */
.tnt-review-mecha{
  background: radial-gradient(circle at center, #2f0000, #140000);
  border: 2px solid #8d1111;
  border-radius: 14px;
  padding: 20px;
  color: #eaffff;
  font-family: 'Orbitron', sans-serif;
  position: relative;
  overflow: hidden;
  box-shadow: 0 0 25px #8d1111, inset 0 0 20px rgba(255, 0, 0, 0.2);
}

/* scanline */
.tnt-review-mecha::before{
  content:"";
  position:absolute;
  inset:0;
  background: repeating-linear-gradient(
    to bottom,
    rgba(255, 8, 0, 0.08),
    rgba(255, 0, 0, 0.08) 1px,
    transparent 2px,
    transparent 4px
  );
  pointer-events:none;
}

.tnt-header h2{
  font-size: 18px;
  color:#8d1111;
  text-shadow:0 0 10px #8d1111,0 0 20px #8d1111;
  margin-bottom:5px;
}

.tnt-header p{
  font-size:12px;
  opacity:0.8;
  margin-bottom:15px;
}

.tnt-slider{
  position:relative;
  height:90px;
}

.tnt-slide{
  position:absolute;
  width:100%;
  opacity:0;
  transform:translateX(40px);
  transition:all .6s ease;
}

.tnt-slide.active{
  opacity:1;
  transform:translateX(0);
}

.tnt-name{
  font-size:14px;
  color:#8d1111;
  margin-bottom:5px;
  text-shadow:0 0 6px #8d1111;
}

.tnt-comment{
  font-size:13px;
  line-height:1.5;
}

/* glowing border animation */
@keyframes pulseGlow{
  0%{box-shadow:0 0 10px #8d1111;}
  50%{box-shadow:0 0 25px #8d1111;}
  100%{box-shadow:0 0 10px #8d1111;}
}

.tnt-review-mecha{
  animation:pulseGlow 2.5s infinite;
}

/* Extracted inline component styles — block 9 */
.cyber-mecha {
  font-family: 'Orbitron', sans-serif;
  max-width: 900px;
  margin: 40px auto;
  padding: 25px;
  border-radius: 18px;
  background: radial-gradient(circle at top, #2f0202, #140000 70%);
  border: 1px solid rgba(255, 0, 0, 0.4);
  box-shadow: 0 0 25px rgba(255, 0, 0, 0.35),
              inset 0 0 25px rgba(255, 0, 0, 0.15);
  position: relative;
  overflow: hidden;
}

/* scanline effect */
.cyber-mecha::before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    to bottom,
    rgba(255, 0, 0, 0.03),
    rgba(255, 0, 0, 0.03) 1px,
    transparent 1px,
    transparent 3px
  );
  pointer-events: none;
}

.pd-full-desc-title {
  text-align: center;
  font-size: 22px;
  font-weight: 800;
  color: #8d1111;
  margin-bottom: 25px;
  text-shadow: 0 0 10px #8d1111, 0 0 20px #ff0000;
  letter-spacing: 1px;
}

/* FAQ BOX */
.faq-item {
  margin-bottom: 15px;
  border-radius: 12px;
  border: 1px solid rgba(0,200,255,0.25);
  background: rgba(0,30,60,0.45);
  backdrop-filter: blur(8px);
  transition: all 0.3s ease;
  overflow: hidden;
}

.faq-item:hover {
  border-color: rgba(255, 0, 0, 0.8);
  box-shadow: 0 0 15px rgba(255, 0, 0, 0.4);
}

/* QUESTION */
.faq-question {
  padding: 14px 18px;
  cursor: pointer;
  font-size: 14px;
  color: #fea3a3;
  position: relative;
}

.faq-question::after {
  content: "＋";
  position: absolute;
  right: 15px;
  color: #8d1111;
  font-weight: bold;
  transition: 0.3s;
}

/* ACTIVE */
.faq-item.active .faq-question::after {
  content: "−";
}

/* ANSWER */
.faq-answer {
  max-height: 0;
  overflow: hidden;
  padding: 0 18px;
  font-size: 13px;
  color: #dcffd9;
  line-height: 1.6;
  transition: all 0.35s ease;
}

.faq-item.active .faq-answer {
  max-height: 200px;
  padding: 10px 18px 18px;
}

/* glow text */
.glow {
  color: #8d1111;
  text-shadow: 0 0 8px #8d1111, 0 0 18px #ff0000;
}

.glow-strong {
  color: #ff0000;
  text-shadow: 0 0 10px #ff0000, 0 0 25px #ff0000;
}

/* Extracted inline component styles — block 10 */
.cyber-mecha {
  max-width: 800px;
  margin: 40px auto;
  background: radial-gradient(circle at top, rgba(160, 0, 0, 0.6), #8a0303c5 70%);
  border-radius: 16px;
  border: 1px solid rgba(255, 0, 0, 0.4);
  box-shadow:
    0 0 25px rgba(255, 0, 0, 0.4), inset 0 0 20px rgba(255, 0, 0, 0.2);
  padding: 25px;
  font-family: 'Orbitron', sans-serif;
  color: #ffd8d8;
  position: relative;
  overflow: hidden;
}

/* scanline overlay */
.cyber-mecha::before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    to bottom,
    rgba(255,255,255,0.03),
    rgba(255,255,255,0.03) 1px,
    transparent 1px,
    transparent 3px
  );
  pointer-events: none;
}

.pd-full-desc-title {
  text-align: center;
  font-size: 22px;
  color: #771717;
  letter-spacing: 2px;
  text-shadow: 0 0 12px #ff0000;
  margin-bottom: 20px;
}

.mecha-header h3 {
  text-align: center;
  font-size: 18px;
  color: #8d1111;
  text-shadow: 0 0 10px #ff0000;
  margin-bottom: 15px;
}

.mecha-image img {
  width: 100%;
  border-radius: 10px;
  border: 1px solid rgba(255, 0, 0, 0.5);
  box-shadow: 0 0 20px rgba(255, 0, 0, 0.4);
  margin-bottom: 20px;
}

.mecha-content p {
  font-size: 14px;
  line-height: 1.8;
  margin-bottom: 14px;
  color: #fea3a3;
}

.glow {
  color: #8d1111;
  text-shadow: 0 0 8px #8d1111;
  font-weight: 600;
}

.glow-strong {
  color: #ff0000;
  text-shadow:
    0 0 10px #f90000, 0 0 20px #ff0000;
  font-weight: 700;
}

.final-line {
  margin-top: 18px;
  padding: 10px;
  border: 1px solid rgba(255, 0, 0, 0.4);
  background: rgba(255, 0, 0, 0.08);
  border-radius: 8px;
  text-align: center;
}

/* Extracted inline component styles — block 11 */
.toast-root{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);display:flex;flex-direction:column;gap:10px;z-index:99999;pointer-events:none;max-width:min(92vw,540px)}.toast{display:grid;grid-template-columns:28px 1fr auto;gap:12px;background:#200b0b;color:#eef3ff;border:1px solid rgba(255,255,255,.08);padding:12px 14px;border-radius:12px;box-shadow:0 10px 30px rgba(20, 10, 10, 0.35);pointer-events:auto;overflow:hidden}.toast .ico{align-self:start;margin-top:2px}.toast .ttl{font-weight:700;line-height:1.25;font-size:14px;margin-bottom:4px}.toast .msg{opacity:.95;line-height:1.45;font-size:13px}.toast .actions{display:flex;gap:8px;align-self:center}.toast .btn{background:#e90e0e;color:#fff;border:0;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:700;cursor:pointer}.toast .btn.alt{background:transparent;color:#ff8f8f;border:1px solid rgba(255, 143, 143, 0.35)}.toast .close{background:transparent;border:0;color:#b39898;cursor:pointer;padding:4px;margin-left:6px}.toast.success{border-left:4px solid #c52222}.toast.info{border-left:4px solid #e90e0e}.toast.warn{border-left:4px solid #f59e0b}.toast .progress{position:absolute;left:0;bottom:0;height:3px;background:linear-gradient(90deg,#fa6060,#c52222);width:100%;transform-origin:left;animation:toastBar linear forwards}@keyframes toastBar{from{transform:scaleX(1)}to{transform:scaleX(0)}}@media(max-width:640px){.toast{grid-template-columns:24px 1fr auto;padding:12px}.toast .btn{padding:7px 10px}}

/* Extracted inline component styles — block 12 */
.toast .msg { word-break: break-word; overflow-wrap: anywhere; }

.toast-root { bottom: max(12px, env(safe-area-inset-bottom, 12px)); }

@media (max-width: 540px) {
  .toast-root {
    left: 0; right: 0; transform: none;
    padding: 0 12px;
    bottom: calc(max(12px, env(safe-area-inset-bottom, 12px)) + var(--fab-offset, 72px));
    max-width: none;
  }
  .toast {
    grid-template-columns: 1fr; /* 1 kolom */
    position: relative;
    padding: 14px 14px 12px 14px;
    border-radius: 16px;
  }
  .toast .ico {
    position: absolute; left: 14px; top: 14px;
    margin: 0; transform: translateY(1px);
  }
  .toast .cnt { padding-left: 34px; }
  .toast .ttl { font-size: 15px; margin-bottom: 6px; }
  .toast .msg { font-size: 13px; opacity: .96; }
  .toast .actions {
    margin-top: 12px; gap: 10px; width: 100%;
    display: grid; grid-template-columns: 1fr 1fr;
  }
  .toast .btn { width: 100%; min-width: 0; padding: 10px 0; }
  .toast .close { position: absolute; right: 6px; top: 6px; }
}

/* Extracted inline component styles — block 13 */
/* Chat Widget Styles - Lightweight & Dblmal */
            .chat-widget {
                position: fixed;
                bottom: 20px;
                right: 20px;
                z-index: 9999;
                font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
            }
            
            /* Hide floating button on mobile - use bottom nav instead */
            @media (max-width: 640px) {
                .chat-toggle-btn {
                    display: none !important;
                }
                
                /* Ensure popup is still visible on mobile even when button is hidden */
                .chat-widget {
                    display: block !important;
                }
                
                .chat-popup {
                    display: none; /* Hidden by default, shown via JS */
                }
                
                .chat-popup[style*="display: block"],
                .chat-popup[style*="display:block"] {
                    display: block !important;
                }
            }
            
            .chat-toggle-btn {
                width: 60px;
                height: 60px;
                border-radius: 50%;
                background: linear-gradient(135deg, #f21a1a 0%, #d90909 100%);
                border: none;
                color: white;
                cursor: pointer;
                box-shadow: 0 4px 12px rgba(242, 26, 26, 0.3);
                position: relative;
                transition: transform 0.2s, box-shadow 0.2s;
            }
            
            .chat-toggle-btn:hover {
                transform: scale(1.05);
                box-shadow: 0 6px 20px rgba(242, 26, 26, 0.4);
            }
            
            #chat-toggle-btn .chat-icon {
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                width: 28px !important;
                height: 28px !important;
            }
            
            .chat-unread-badge {
                position: absolute;
                top: -5px;
                right: -5px;
                background: #ef4444;
                color: white;
                border-radius: 12px;
                padding: 2px 6px;
                font-size: 11px;
                font-weight: 600;
                min-width: 20px;
                text-align: center;
            }
            
            .chat-popup {
                position: absolute;
                bottom: 80px;
                right: 0;
                width: 380px;
                max-width: calc(100vw - 40px);
                height: 500px;
                max-height: calc(100vh - 120px);
                background: white;
                border-radius: 12px;
                box-shadow: 0 10px 40px rgba(0,0,0,0.2);
                display: flex;
                flex-direction: column;
                overflow: hidden;
            }
            
            .chat-popup-header {
                background: linear-gradient(135deg, #F21A1A 0%, #D90909 100%);
                color: white;
                padding: 16px 20px;
                display: flex;
                justify-content: space-between;
                align-items: center;
                flex-shrink: 0;
            }
            
            .chat-header-title {
                display: flex;
                flex-direction: column;
                gap: 2px;
                min-height: 0;
            }
            
            .chat-popup-header h3 {
                margin: 0;
                font-size: 18px;
                font-weight: 600;
                line-height: 1.2;
            }
            
            .chat-operating-hours {
                font-size: 11px;
                opacity: 0.9;
                font-weight: 400;
                display: flex;
                align-items: center;
                gap: 4px;
                line-height: 1.2;
            }
            
            .chat-operating-hours svg {
                width: 12px;
                height: 12px;
                opacity: 0.8;
                flex-shrink: 0;
            }
            
            .chat-header-actions {
                display: flex;
                align-items: center;
                gap: 8px;
            }
            
            /* Notification Toggle Button */
            .btn-notif-toggle {
                background: none;
                border: none;
                color: white;
                font-size: 18px;
                cursor: pointer;
                padding: 4px 8px;
                transition: all 0.2s;
                opacity: 0.8;
            }
            
            .btn-notif-toggle:hover {
                opacity: 1;
                transform: scale(1.1);
            }
            
            /* Icon states */
            .btn-notif-toggle[data-status="not-subscribed"] svg {
                opacity: 0.7;
            }
            
            .btn-notif-toggle[data-status="not-subscribed"]:hover svg {
                opacity: 1;
            }
            
            .btn-notif-toggle[data-status="subscribed"] svg {
                opacity: 1;
                animation: bellRing 2s ease-in-out;
            }
            
            .btn-notif-toggle[data-status="blocked"] svg {
                color: #ff6b6b;
            }
            
            .btn-notif-toggle[data-status="not-supported"] {
                display: none !important;
            }
            
            @keyframes bellRing {
                0%, 100% { transform: rotate(0deg); }
                10%, 30% { transform: rotate(-10deg); }
                20%, 40% { transform: rotate(10deg); }
            }
            
            /* Notification Info Bar */
            .chat-notif-info-bar {
                position: absolute;
                top: 64px;
                left: 0;
                right: 0;
                background: linear-gradient(to right, #e3f2fd, #f5f5f5);
                border-bottom: 1px solid #fbbbbb;
                padding: 8px 12px;
                display: flex;
                align-items: center;
                gap: 8px;
                font-size: 12px;
                color: #616161;
                z-index: 10;
                animation: slideDown 0.3s ease;
            }
            
            .chat-notif-info-bar svg {
                flex-shrink: 0;
            }
            
            .chat-notif-info-bar .small {
                flex: 1;
                line-height: 1.4;
            }
            
            .chat-notif-info-bar .btn-dismiss {
                background: none;
                border: none;
                color: #9e9e9e;
                cursor: pointer;
                padding: 0 4px;
                font-size: 16px;
                transition: color 0.2s;
            }
            
            .chat-notif-info-bar .btn-dismiss:hover {
                color: #616161;
            }
            
            @keyframes slideDown {
                from {
                    max-height: 0;
                    opacity: 0;
                }
                to {
                    max-height: 50px;
                    opacity: 1;
                }
            }
            
            .chat-close-btn {
                background: none;
                border: none;
                color: white;
                font-size: 28px;
                line-height: 1;
                cursor: pointer;
                padding: 0;
                width: 30px;
                height: 30px;
            }
            
            .chat-popup-body {
                flex: 1 1 auto;
                display: flex;
                flex-direction: column;
                min-height: 0;
                overflow: hidden;
                height: calc(100% - 64px);
                position: relative;
                transition: padding-top 0.3s ease;
            }
            
            /* Add padding when info bar is visible */
            .chat-popup-body.has-info-bar {
                padding-top: 40px;
            }
            
            .chat-view {
                flex: 1 1 auto;
                display: none;
                flex-direction: column;
                min-height: 0;
                overflow: hidden;
            }
            
            #chat-list-view {
                display: flex;
            }
            
            #chat-messages-view {
                display: none;
            }
            
            #chat-messages-view.active {
                display: flex;
                flex-direction: column;
            }
            
            #chat-new-view {
                display: none;
            }
            
            #chat-new-view.active {
                display: flex;
            }
            
            .chat-conversations-list {
                flex: 1;
                overflow-y: auto;
                padding: 0;
                background: white;
            }
            
            /* Custom Scrollbar for Conversations List */
            .chat-conversations-list::-webkit-scrollbar {
                width: 6px;
            }
            
            .chat-conversations-list::-webkit-scrollbar-track {
                background: #f1f1f1;
            }
            
            .chat-conversations-list::-webkit-scrollbar-thumb {
                background: #F21A1A;
                border-radius: 3px;
            }
            
            .chat-conversations-list::-webkit-scrollbar-thumb:hover {
                background: #D90909;
            }
            
            /* Firefox */
            .chat-conversations-list {
                scrollbar-width: thin;
                scrollbar-color: #F21A1A #f1f1f1;
            }
            
            .chat-conversation-item {
                padding: 12px 16px;
                cursor: pointer;
                display: flex;
                gap: 12px;
                align-items: flex-start;
                transition: background 0.15s ease;
                color: #33371f;
                border-bottom: 1px solid #f0f0f0;
            }
            
            .chat-conversation-item:hover {
                background: #f5f5f5;
            }
            
            .chat-conversation-item.active {
                background: #FFF5EB;
            }
            
            /* WhatsApp-like Avatar */
            .conversation-avatar {
                width: 48px;
                height: 48px;
                border-radius: 50%;
                background: linear-gradient(135deg, #F21A1A 0%, #D90909 100%);
                flex-shrink: 0;
                display: flex;
                align-items: center;
                justify-content: center;
                color: white;
                font-weight: 600;
                font-size: 18px;
            }
            
            .conversation-avatar svg {
                width: 24px;
                height: 24px;
            }
            
            /* WhatsApp-like Content */
            .conversation-content {
                flex: 1;
                min-width: 0;
                display: flex;
                flex-direction: column;
                gap: 4px;
            }
            
            .conversation-header {
                display: flex;
                justify-content: space-between;
                align-items: center;
                gap: 8px;
            }
            
            .conversation-name {
                font-weight: 600;
                font-size: 15px;
                color: #111;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
            
            .conversation-time {
                font-size: 12px;
                color: #7d8166;
                flex-shrink: 0;
            }
            
            .conversation-preview {
                display: flex;
                justify-content: space-between;
                align-items: center;
                gap: 8px;
            }
            
            .conversation-message {
                font-size: 14px;
                color: #667781;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
                margin: 0;
                flex: 1;
            }
            
            .conversation-unread {
                background: #25D366;
                color: white;
                border-radius: 12px;
                padding: 2px 8px;
                font-size: 12px;
                font-weight: 600;
                min-width: 20px;
                text-align: center;
                flex-shrink: 0;
            }
            
            /* Active item styling */
            .chat-conversation-item.active .conversation-name {
                color: #F21A1A;
            }
            
            .chat-conversation-item.active .conversation-time {
                color: #F21A1A;
            }
            
            .chat-new-btn {
                margin: 12px;
                padding: 12px;
                background: linear-gradient(135deg, #F21A1A 0%, #D90909 100%);
                color: white;
                border: none;
                border-radius: 8px;
                cursor: pointer;
                font-weight: 500;
                font-size: 14px;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
                transition: all 0.2s;
                flex-shrink: 0;
            }
            
            .chat-new-btn:hover {
                transform: translateY(-1px);
                box-shadow: 0 4px 8px rgba(242, 26, 26, 0.3);
            }
            
            .chat-conversation-title {
                flex: 1;
                font-weight: 600;
                font-size: 16px;
                color: #371f1f;
            }
            
            .chat-messages-container {
                flex: 1;
                overflow-y: auto;
                padding: 16px;
                display: flex;
                flex-direction: column;
                gap: 8px;
                min-height: 0;
                background: #E5DDD5;
            }
            
            /* Custom Scrollbar for Messages Container */
            .chat-messages-container::-webkit-scrollbar {
                width: 6px;
            }
            
            .chat-messages-container::-webkit-scrollbar-track {
                background: rgba(0, 0, 0, 0.05);
            }
            
            .chat-messages-container::-webkit-scrollbar-thumb {
                background: rgba(242, 26, 26, 0.6);
                border-radius: 3px;
            }
            
            .chat-messages-container::-webkit-scrollbar-thumb:hover {
                background: #F21A1A;
            }
            
            /* Firefox */
            .chat-messages-container {
                scrollbar-width: thin;
                scrollbar-color: rgba(242, 26, 26, 0.6) rgba(0, 0, 0, 0.05);
            }
            
            /* WhatsApp Group-like Messages */
            .chat-message {
                display: flex;
                margin-bottom: 4px;
                animation: fadeIn 0.2s ease;
            }
            
            @keyframes fadeIn {
                from { opacity: 0; transform: translateY(10px); }
                to { opacity: 1; transform: translateY(0); }
            }
            
            .chat-message.mine {
                justify-content: flex-end;
            }
            
            .chat-message-bubble {
                max-width: 80%;
                padding: 6px 8px 8px 10px;
                border-radius: 8px;
                position: relative;
                box-shadow: 0 1px 0.5px rgba(0,0,0,0.13);
            }
            
            /* Bubble from others (Admin/CS) */
            .chat-message:not(.mine) .chat-message-bubble {
                background: #FFFFFF;
                border-radius: 0 8px 8px 8px;
            }
            
            /* Bubble tail for others */
            .chat-message:not(.mine) .chat-message-bubble::before {
                content: '';
                position: absolute;
                top: 0;
                left: -8px;
                width: 0;
                height: 0;
                border-style: solid;
                border-width: 0 8px 13px 0;
                border-color: transparent #FFFFFF transparent transparent;
            }
            
            /* Bubble from user (mine) */
            .chat-message.mine .chat-message-bubble {
                background: #f5d0d0; /* Light blue for user messages */
                border-radius: 8px 0 8px 8px;
            }
            
            /* Bubble tail for mine */
            .chat-message.mine .chat-message-bubble::before {
                content: '';
                position: absolute;
                top: 0;
                right: -8px;
                width: 0;
                height: 0;
                border-style: solid;
                border-width: 0 0 13px 8px;
                border-color: transparent transparent transparent #f5d0d0;
            }
            
            .message-sender {
                font-size: 12.5px;
                font-weight: 600;
                color: #F21A1A !important;
                margin-bottom: 4px;
            }
            
            .chat-message.mine .message-sender {
                display: none;
            }
            
            /* Message text */
            .message-text {
                font-size: 14px;
                line-height: 19px;
                color: #000000 !important;
                word-wrap: break-word;
                white-space: pre-wrap;
                margin-bottom: 4px;
            }
            
            /* Message metadata (time + status) */
            .message-meta {
                display: flex;
                align-items: center;
                justify-content: flex-end;
                gap: 4px;
                margin-top: 2px;
            }
            
            .message-time {
                font-size: 11px;
                color: #728166 !important;
                line-height: 15px;
            }
            
            /* Use multiple selectors to override global styles */
            .chat-message-bubble .message-status,
            .message-meta .message-status,
            .chat-message .message-status {
                width: 16px !important;
                height: 16px !important;
                min-width: 16px !important;
                min-height: 16px !important;
                max-width: 16px !important;
                max-height: 16px !important;
                flex-shrink: 0;
                color: #816666 !important;
                fill: currentColor !important;
            }
            
            .chat-message:not(.mine) .message-status {
                display: none;
            }
            
            /* Loading dots animation */
            @keyframes loadingDots {
                0%, 20% { content: '.'; }
                40% { content: '..'; }
                60%, 100% { content: '...'; }
            }
            
            .message-status.loading::after {
                content: '...';
                animation: loadingDots 1.5s infinite;
                font-size: 16px;
                line-height: 16px;
            }
            
            .message-status.loading path {
                display: none;
            }
            
            .message-status.failed {
                color: #ef4444 !important;
                cursor: pointer;
            }
            
            .message-status.sent {
                color: #816666 !important;
            }
            
            .chat-new-form {
                flex: 1;
                overflow-y: auto;
                padding: 16px;
                display: flex;
                flex-direction: column;
            }
            
            .chat-new-form form {
                display: flex;
                flex-direction: column;
                gap: 16px;
                flex: 1;
            }
            
            .chat-new-form .form-group {
                display: flex;
                flex-direction: column;
                gap: 6px;
            }
            
            .chat-new-form label {
                font-size: 14px;
                font-weight: 500;
                color: #513737;
            }
            
            .chat-new-form .form-control {
                width: 100%;
                padding: 10px 12px;
                border: 1px solid #dbd1d1;
                border-radius: 8px;
                font-size: 14px;
                font-family: inherit;
                transition: border-color 0.2s;
                box-sizing: border-box;
            }
            
            .chat-new-form .form-control:focus {
                outline: none;
                border-color: #F21A1A;
                box-shadow: 0 0 0 3px rgba(242, 26, 26, 0.1);
            }
            
            .chat-new-form textarea.form-control {
                resize: vertical;
                min-height: 100px;
            }
            
            .chat-new-form .btn {
                padding: 12px 20px;
                border: none;
                border-radius: 8px;
                font-size: 15px;
                font-weight: 500;
                cursor: pointer;
                transition: all 0.2s;
                text-align: center;
            }
            
            .chat-new-form .btn-primary {
                background: linear-gradient(135deg, #F21A1A 0%, #D90909 100%);
                color: white;
            }
            
            .chat-new-form .btn-primary:hover {
                transform: translateY(-1px);
                box-shadow: 0 4px 8px rgba(242, 26, 26, 0.3);
            }
            
            .chat-new-form .btn-primary:active {
                transform: scale(0.98);
            }
            
            .chat-new-form .btn-block {
                width: 100%;
                margin-top: auto;
            }
            
            .chat-message-form {
                padding: 12px;
                border-top: 1px solid #ebe5e5;
                display: flex;
                flex-wrap: wrap;
                gap: 8px;
                align-items: flex-end;
                flex-shrink: 0;
                background: white;
            }
            
            .chat-product-card {
                flex: 1 1 100%;
                max-width: 100%;
                display: flex;
                gap: 12px;
                padding: 12px;
                background: #f6f3f3;
                border-radius: 8px;
                margin-bottom: 4px;
                border: 1px solid #ebe5e5;
            }
            
            .chat-product-card img {
                width: 60px;
                height: 60px;
                object-fit: cover;
                border-radius: 6px;
                flex-shrink: 0;
            }
            
            .chat-product-card-content {
                flex: 1;
                min-width: 0;
            }
            
            .chat-product-card-name {
                font-weight: 500;
                font-size: 14px;
                color: #371f1f;
                margin-bottom: 4px;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
            
            .chat-product-card-variant {
                font-size: 12px;
                color: #806b6b;
                margin-bottom: 4px;
            }
            
            .chat-product-card-price {
                font-size: 13px;
                color: #ea6666;
                font-weight: 600;
            }
            
            .chat-product-card-remove {
                align-self: flex-start;
                background: none;
                border: none;
                color: #af9c9c;
                cursor: pointer;
                padding: 4px;
                font-size: 18px;
                line-height: 1;
                transition: color 0.2s;
            }
            
            .chat-product-card-remove:hover {
                color: #ef4444;
            }
            
            /* Product card in messages (read-only display) */
            .message-product-card {
                display: flex;
                gap: 10px;
                padding: 10px;
                background: rgba(255, 255, 255, 0.5);
                border-radius: 8px;
                margin-bottom: 6px;
                border: 1px solid rgba(0, 0, 0, 0.08);
                align-items: center;
            }
            
            .chat-message.mine .message-product-card {
                background: rgba(255, 255, 255, 0.7);
            }
            
            .message-product-card img {
                width: 50px;
                height: 50px;
                object-fit: cover;
                border-radius: 6px;
                flex-shrink: 0;
            }
            
            .message-product-info {
                flex: 1;
                min-width: 0;
            }
            
            .message-product-name {
                font-weight: 500;
                font-size: 13px;
                color: #371f1f;
                margin-bottom: 2px;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                line-height: 1.3;
            }
            
            .message-product-variant {
                font-size: 11px;
                color: #806b6b;
                margin-bottom: 2px;
            }
            
            .message-product-price {
                font-size: 12px;
                color: #ea6666;
                font-weight: 600;
            }
            
            .message-product-link {
                flex-shrink: 0;
                width: 32px;
                height: 32px;
                display: flex;
                align-items: center;
                justify-content: center;
                background: rgba(234, 102, 102, 0.1);
                border-radius: 6px;
                color: #ea6666;
                text-decoration: none;
                transition: all 0.2s;
            }
            
            .message-product-link:hover {
                background: #ea6666;
                color: white;
            }
            
            .message-product-link svg {
                width: 16px;
                height: 16px;
            }
            
            .chat-message-input {
                flex: 1;
                border: 1px solid #d1d5db;
                border-radius: 20px;
                padding: 10px 16px;
                resize: none;
                max-height: 100px;
                font-family: inherit;
                font-size: 14px;
                line-height: 1.5;
                box-sizing: border-box;
                overflow-y: hidden;
            }
            
            .chat-message-input:focus {
                outline: none;
                border-color: #F21A1A;
                box-shadow: 0 0 0 3px rgba(242, 140, 26, 0.1);
            }
            
            .chat-send-btn {
                width: 40px;
                height: 40px;
                border-radius: 50%;
                background: linear-gradient(135deg, #F21A1A 0%, #D90909 100%);
                border: none;
                color: white;
                cursor: pointer;
                flex-shrink: 0;
                display: flex;
                align-items: center;
                justify-content: center;
                transition: all 0.2s;
            }
            
            .chat-send-btn:hover {
                transform: scale(1.05);
                box-shadow: 0 2px 8px rgba(242, 26, 26, 0.3);
            }
            
            .chat-send-btn:active {
                transform: scale(0.95);
            }
            
            .chat-loading {
                text-align: center;
                padding: 20px;
                color: #806b6b;
            }
            
            /* Date Separator (WhatsApp-style) */
            .date-separator {
                display: flex;
                align-items: center;
                gap: 12px;
                margin: 24px 0 16px;
                opacity: 0;
                animation: fadeInSeparator 0.3s ease forwards;
            }

            @keyframes fadeInSeparator {
                from {
                    opacity: 0;
                    transform: translateY(-10px);
                }
                to {
                    opacity: 1;
                    transform: translateY(0);
                }
            }

            .date-separator-line {
                flex: 1;
                height: 1px;
                background: linear-gradient(90deg, transparent, rgba(0, 0, 0, 0.1) 50%, transparent);
            }

            .date-separator-text {
                flex-shrink: 0;
                padding: 4px 12px;
                background: #e9ecef;
                color: #7d6c6c;
                font-size: 11px;
                font-weight: 600;
                text-transform: uppercase;
                letter-spacing: 0.5px;
                border-radius: 12px;
                box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
            }
            
            /* Mobile responsive */
            @media (max-width: 640px) {
                .chat-popup {
                    position: fixed !important; /* Override absolute positioning */
                    bottom: 45px !important; /* Above bottom nav */
                    right: 0 !important;
                    left: 0 !important;
                    width: 100% !important;
                    max-width: 100% !important;
                    /* Use dvh (dynamic viewport height) for browser UI awareness */
                    height: calc(100dvh - 45px) !important;
                    max-height: calc(100dvh - 45px) !important;
                    /* Fallback for browsers that don't support dvh */
                    height: calc(var(--viewport-height, 100vh) - 45px) !important;
                    max-height: calc(var(--viewport-height, 100vh) - 45px) !important;
                    border-radius: 0 !important;
                    z-index: 9999 !important;
                }
                
                .chat-popup-header {
                    border-radius: 0;
                }
                
                .chat-messages-container,
                .chat-conversations-list {
                    /* Adjust for mobile keyboard using dynamic viewport */
                    max-height: calc(100dvh - 190px);
                    /* Fallback for browsers that don't support dvh */
                    max-height: calc(var(--viewport-height, 100vh) - 190px);
                }
            }

/* Extracted inline component styles — block 14 */
/* =========================================================
    🔴 FIXED FOOTER – CRIMSON MECHA MODE (GAN89)
   ========================================================= */

.dbl-red-fixed-footer {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 999;

  display: flex;
  align-items: center;
  justify-content: space-around;
  gap: 8px;

  padding: 11px 12px calc(11px + env(safe-area-inset-bottom));
  overflow: hidden;

  /* Background Merah Deep + Hitam */
  background: 
    radial-gradient(circle at 50% 0%, rgba(255, 0, 0, 0.25), rgba(20, 0, 0, 0.95) 60%, rgba(0, 0, 0, 1)),
    linear-gradient(180deg, rgba(40, 0, 0, 0.9), rgba(0, 0, 0, 1));

  border-top: 2px solid rgba(255, 0, 0, 0.7);
  border-radius: 20px 20px 0 0;

  box-shadow: 
    0 -12px 35px rgba(255, 0, 0, 0.2), 
    inset 0 1px 0 rgba(255, 255, 255, 0.1);

  font-family: "Orbitron", "Poppins", sans-serif;
}

/* 🌀 Scanline Halus (Red Cyber) */
.dbl-red-fixed-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(
    0deg,
    rgba(255, 0, 0, 0.03),
    rgba(255, 0, 0, 0.03) 1px,
    transparent 1px,
    transparent 4px
  );
  opacity: 0.8;
  mix-blend-mode: overlay;
}

/* ⚡ Crimson Sweep Animation */
.dbl-red-fixed-footer::after {
  content: "";
  position: absolute;
  top: 0; left: -160%;
  width: 60%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255, 0, 0, 0.4), transparent);
  transform: skewX(-25deg);
  animation: redShine 4s infinite;
  pointer-events: none;
}

@keyframes redShine {
  0% { left: -160%; }
  60% { left: 160%; }
  100% { left: 160%; }
}

/* =========================================================
   ITEM STYLE
   ========================================================= */

.dbl-red-fixed-footer a {
  flex: 1;
  max-width: 110px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 8px 4px;
  text-decoration: none;
  text-align: center;
  color: rgba(255, 200, 200, 0.9);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  transition: all 0.2s ease;
  position: relative;
}

.dbl-red-fixed-footer a:hover {
  color: #fff;
  filter: drop-shadow(0 0 8px rgba(255, 0, 0, 0.8));
  transform: translateY(-2px);
}

.dbl-red-fixed-footer img {
  width: 24px;
  height: 24px;
  filter: drop-shadow(0 0 5px rgba(255, 0, 0, 0.6));
  transition: transform 0.2s ease;
}

/* =========================================================
   CENTER CTA – THE CORE (GAN89)
   ========================================================= */

.dbl-red-fixed-footer .core-cta {
  background: rgba(255, 0, 0, 0.15);
  border: 1px solid rgba(255, 0, 0, 0.6);
  border-radius: 12px;
  box-shadow: 
    0 0 15px rgba(255, 0, 0, 0.3),
    inset 0 0 10px rgba(255, 0, 0, 0.2);
  transform: scale(1.05);
}

.dbl-red-fixed-footer .core-cta img {
  width: 28px;
  height: 28px;
  filter: drop-shadow(0 0 10px rgba(255, 0, 0, 1));
}

/* Pulse Effect for Core */
.dbl-red-fixed-footer .core-cta::before {
  content: "";
  position: absolute;
  inset: -5px;
  border-radius: 15px;
  background: radial-gradient(circle, rgba(255, 0, 0, 0.3), transparent 70%);
  animation: redPulse 2s ease-in-out infinite;
  z-index: -1;
}

@keyframes redPulse {
  0%, 100% { opacity: 0.4; transform: scale(1); }
  50% { opacity: 0.8; transform: scale(1.1); }
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 400px) {
  .dbl-red-fixed-footer a { font-size: 10px; }
  .dbl-red-fixed-footer img { width: 20px; height: 20px; }
  .dbl-red-fixed-footer .core-cta img { width: 24px; height: 24px; }
}
