/* ═══════════════════════════════════════════════════════
   Wayback by Razi — style.css v1.0.2
   Full theme isolation · polished spacing · dark-mode safe
═══════════════════════════════════════════════════════ */

/* ── Scoped reset ──────────────────────────────────────── */
#wbr-app, #wbr-app * {
    box-sizing: border-box !important;
    -webkit-font-smoothing: antialiased;
}
#wbr-app { margin: 0 !important; padding: 0 !important; }
#wbr-app h1, #wbr-app h2, #wbr-app h3,
#wbr-app p, #wbr-app ul, #wbr-app li,
#wbr-app a, #wbr-app label, #wbr-app span,
#wbr-app div, #wbr-app input, #wbr-app button {
    all: revert;
    box-sizing: border-box !important;
}

/* ── Container ─────────────────────────────────────────── */
#wbr-app {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    color: #111827 !important;
    background: #f8fafc !important;
    max-width: 580px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
}
#wbr-app .wbr-screen {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    padding: 32px 28px !important;
    margin: 0 !important;
}
.wbr-hidden { display: none !important; }

/* ── Typography reset inside app ──────────────────────── */
#wbr-app h2 {
    font-family: inherit !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    margin: 0 0 8px !important;
    line-height: 1.3 !important;
}
#wbr-app h3 {
    font-family: inherit !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    color: #0f172a !important;
    margin: 0 0 4px !important;
    line-height: 1.3 !important;
}
#wbr-app p {
    font-family: inherit !important;
    font-size: 14px !important;
    color: #4b5563 !important;
    margin: 0 !important;
    line-height: 1.6 !important;
}
#wbr-app a {
    color: #2563eb !important;
    text-decoration: none !important;
}
#wbr-app a:hover { text-decoration: underline !important; }

/* ── Trust pills ───────────────────────────────────────── */
.wbr-header {
    margin-bottom: 28px !important;
}
.wbr-trust-pills {
    display: flex !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
    margin-top: 14px !important;
    justify-content: center !important;
}
.wbr-trust-pills span {
    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #166534 !important;
    background: #f0fdf4 !important;
    border: 1px solid #bbf7d0 !important;
    border-radius: 20px !important;
    padding: 3px 11px !important;
    display: inline-block !important;
}

/* ── Form fields ───────────────────────────────────────── */
.wbr-field {
    margin-bottom: 20px !important;
}
.wbr-field label {
    display: block !important;
    font-family: inherit !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #374151 !important;
    text-transform: uppercase !important;
    letter-spacing: .06em !important;
    margin-bottom: 7px !important;
}
.wbr-req { color: #dc2626 !important; }
.wbr-field input[type="url"],
.wbr-field input[type="email"],
.wbr-field input[type="text"] {
    display: block !important;
    width: 100% !important;
    padding: 11px 14px !important;
    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #111827 !important;
    background: #ffffff !important;
    border: 1.5px solid #d1d5db !important;
    border-radius: 10px !important;
    outline: none !important;
    transition: border-color .15s !important;
    box-shadow: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
}
.wbr-field input:focus {
    border-color: #2563eb !important;
    box-shadow: 0 0 0 3px rgba(37,99,235,.1) !important;
}
.wbr-hint {
    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    color: #9ca3af !important;
    margin-top: 5px !important;
    line-height: 1.5 !important;
    display: block !important;
}
.wbr-hint a { color: #6b7280 !important; }

/* ── GDPR ──────────────────────────────────────────────── */
.wbr-gdpr-wrap {
    margin-bottom: 20px !important;
    padding: 14px 16px !important;
    background: #f9fafb !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 10px !important;
}
.wbr-gdpr-label {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    cursor: pointer !important;
}
.wbr-gdpr-label input[type="checkbox"] {
    width: 16px !important;
    height: 16px !important;
    flex-shrink: 0 !important;
    margin-top: 2px !important;
    accent-color: #2563eb !important;
    cursor: pointer !important;
}
.wbr-gdpr-label span {
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #6b7280 !important;
    line-height: 1.5 !important;
}

/* ── Inline error ──────────────────────────────────────── */
.wbr-inline-error {
    background: #fef2f2 !important;
    border: 1px solid #fecaca !important;
    border-radius: 10px !important;
    padding: 12px 14px !important;
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #dc2626 !important;
    margin-bottom: 16px !important;
    line-height: 1.5 !important;
}

/* ── Buttons ───────────────────────────────────────────── */
.wbr-btn-primary {
    display: block !important;
    width: 100% !important;
    background: #1e293b !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 10px !important;
    padding: 13px 20px !important;
    font-family: inherit !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    cursor: pointer !important;
    transition: background .15s, transform .1s !important;
    text-align: center !important;
    letter-spacing: -.01em !important;
}
.wbr-btn-primary:hover:not(:disabled)  { background: #334155 !important; }
.wbr-btn-primary:active:not(:disabled) { transform: scale(.98) !important; }
.wbr-btn-primary:disabled {
    background: #e2e8f0 !important;
    color: #94a3b8 !important;
    cursor: not-allowed !important;
}

.wbr-btn-outline {
    display: inline-block !important;
    background: #ffffff !important;
    color: #374151 !important;
    border: 1.5px solid #d1d5db !important;
    border-radius: 10px !important;
    padding: 10px 20px !important;
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: border-color .15s, background .15s !important;
    margin-top: 10px !important;
    text-align: center !important;
}
.wbr-btn-outline:hover { background: #f8fafc !important; border-color: #9ca3af !important; }

.wbr-btn-preview {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 10px 18px !important;
    background: #eff6ff !important;
    color: #1d4ed8 !important;
    border: 1.5px solid #bfdbfe !important;
    border-radius: 9px !important;
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    text-decoration: none !important;
    transition: background .15s, transform .1s !important;
}
.wbr-btn-preview:hover { background: #dbeafe !important; text-decoration: none !important; }

.wbr-btn-download {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 10px 18px !important;
    background: #16a34a !important;
    color: #ffffff !important;
    border: 1.5px solid #16a34a !important;
    border-radius: 9px !important;
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    text-decoration: none !important;
    transition: background .15s, transform .1s !important;
}
.wbr-btn-download:hover  { background: #15803d !important; text-decoration: none !important; }
.wbr-btn-download:active { transform: scale(.97) !important; }

.wbr-btn-cancel {
    display: inline-block !important;
    background: transparent !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 8px !important;
    padding: 7px 18px !important;
    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    color: #94a3b8 !important;
    cursor: pointer !important;
    transition: border-color .15s, color .15s !important;
}
.wbr-btn-cancel:hover:not(:disabled) { border-color: #fca5a5 !important; color: #dc2626 !important; }
.wbr-btn-cancel:disabled { opacity: .45 !important; cursor: not-allowed !important; }

/* ═══════════════════════════════════════════════════════
   S2 · Progress screen
═══════════════════════════════════════════════════════ */
.wbr-progress-card {
    /* uses the .wbr-screen base */
}

/* Site bar */
.wbr-site-bar {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
    padding: 10px 14px !important;
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    margin-bottom: 20px !important;
}
.wbr-site-domain { font-size: 13px !important; font-weight: 600 !important; color: #0f172a !important; font-family: inherit !important; }
.wbr-site-snap   { font-size: 11px !important; color: #94a3b8 !important; font-family: inherit !important; }
.wbr-site-pages  { font-size: 11px !important; color: #2563eb !important; font-weight: 600 !important; font-family: inherit !important; margin-left: auto !important; }

/* Status row */
.wbr-status-row {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #374151 !important;
    margin-bottom: 20px !important;
}
.wbr-spinner {
    width: 17px !important;
    height: 17px !important;
    border: 2.5px solid #e2e8f0 !important;
    border-top-color: #2563eb !important;
    border-radius: 50% !important;
    flex-shrink: 0 !important;
    animation: wbr-spin .7s linear infinite !important;
}
@keyframes wbr-spin { to { transform: rotate(360deg); } }

/* Counters */
.wbr-counters {
    display: grid !important;
    grid-template-columns: repeat(3,1fr) !important;
    gap: 10px !important;
    margin-bottom: 16px !important;
}
.wbr-ctr {
    text-align: center !important;
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    padding: 12px 8px !important;
}
.wbr-ctr span {
    display: block !important;
    font-family: inherit !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #2563eb !important;
    line-height: 1.2 !important;
    transition: transform .2s, color .2s !important;
}
.wbr-ctr small {
    font-family: inherit !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: .06em !important;
    color: #94a3b8 !important;
}

/* Progress bar */
.wbr-bar-bg {
    height: 8px !important;
    background: #f1f5f9 !important;
    border-radius: 4px !important;
    overflow: hidden !important;
    margin-bottom: 20px !important;
}
.wbr-bar {
    height: 100% !important;
    background: #2563eb !important;
    border-radius: 4px !important;
    width: 0 !important;
    transition: width .6s ease !important;
}

/* Done list */
.wbr-done-box {
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    margin-bottom: 14px !important;
}
.wbr-done-title {
    font-family: inherit !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .07em !important;
    color: #94a3b8 !important;
    background: #f8fafc !important;
    padding: 7px 14px !important;
    border-bottom: 1px solid #e2e8f0 !important;
}
#wbr-done-list { max-height: 150px !important; overflow-y: auto !important; }
.wbr-done-wait {
    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    color: #cbd5e1 !important;
    padding: 12px 14px !important;
    font-style: italic !important;
    margin: 0 !important;
}
.wbr-done-row {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 8px 14px !important;
    border-bottom: 1px solid #f1f5f9 !important;
    font-family: inherit !important;
    font-size: 12px !important;
    animation: wbr-fade-in .3s ease !important;
}
.wbr-done-row:last-child { border-bottom: none !important; }
@keyframes wbr-fade-in { from { opacity:0; transform:translateY(-3px); } to { opacity:1; transform:none; } }
.wbr-done-tick { color: #16a34a !important; font-size: 12px !important; flex-shrink: 0 !important; }
.wbr-done-link { display: flex !important; align-items: center !important; gap: 8px !important; text-decoration: none !important; color: inherit !important; flex: 1 !important; min-width: 0 !important; }
.wbr-done-link:hover .wbr-dl { color: #2563eb !important; text-decoration: underline !important; }
.wbr-dl  { font-weight: 500 !important; color: #0f172a !important; flex: 1 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; font-family: inherit !important; font-size: 12px !important; }
.wbr-dp  { font-family: inherit !important; font-size: 10px !important; color: #94a3b8 !important; max-width: 130px !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
.wbr-dsz { font-family: inherit !important; font-size: 10px !important; color: #cbd5e1 !important; margin-left: auto !important; white-space: nowrap !important; flex-shrink: 0 !important; }

/* Console log */
.wbr-log-box { border-radius: 10px !important; overflow: hidden !important; margin-bottom: 16px !important; }
.wbr-log-title {
    font-family: inherit !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    color: #64748b !important;
    background: #1e293b !important;
    padding: 7px 14px !important;
}
.wbr-log {
    background: #0f172a !important;
    padding: 10px 14px !important;
    height: 110px !important;
    overflow-y: auto !important;
    scroll-behavior: smooth !important;
}
.wbr-log-line {
    display: block !important;
    font-family: 'SFMono-Regular', 'Cascadia Code', Consolas, 'Liberation Mono', monospace !important;
    font-size: 11px !important;
    line-height: 1.7 !important;
    white-space: pre-wrap !important;
    word-break: break-all !important;
}
.wbr-ls { color: #86efac !important; }
.wbr-li { color: #64748b !important; }
.wbr-lw { color: #fde68a !important; }
.wbr-le { color: #fca5a5 !important; }

.wbr-cancel-row { text-align: center !important; padding-top: 4px !important; }

/* ═══════════════════════════════════════════════════════
   S3 · Aha moment
═══════════════════════════════════════════════════════ */

/* ── Block 1: Hero ─────────────────────────────────────── */
.wbr-aha-hero {
    background: #f0fdf4 !important;
    border: 1.5px solid #86efac !important;
    border-radius: 14px !important;
    padding: 28px 24px !important;
    text-align: center !important;
    margin-bottom: 18px !important;
    animation: wbr-pop .4s cubic-bezier(.34,1.56,.64,1) !important;
}
@keyframes wbr-pop { from { transform:scale(.93); opacity:0; } to { transform:scale(1); opacity:1; } }

.wbr-big-check {
    width: 52px !important;
    height: 52px !important;
    background: #16a34a !important;
    color: #ffffff !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    margin-bottom: 14px !important;
    box-shadow: 0 4px 12px rgba(22,163,74,.3) !important;
}
.wbr-check-blue { background: #2563eb !important; box-shadow: 0 4px 12px rgba(37,99,235,.3) !important; }

/* Force dark text on light green hero — critical override */
.wbr-aha-hero h2 {
    font-size: 21px !important;
    font-weight: 700 !important;
    color: #14532d !important;
    margin: 0 0 6px !important;
    line-height: 1.3 !important;
}
.wbr-aha-sub {
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #166534 !important;
    margin-bottom: 18px !important;
    line-height: 1.5 !important;
}
.wbr-aha-btns {
    display: flex !important;
    gap: 8px !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    margin-bottom: 12px !important;
}
.wbr-center-txt { text-align: center !important; }

/* ── Block 2: Restored pages ───────────────────────────── */
.wbr-rp-box {
    border: 1px solid #bbf7d0 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    margin-bottom: 16px !important;
}
.wbr-rp-title {
    font-family: inherit !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .07em !important;
    color: #166534 !important;
    background: #f0fdf4 !important;
    padding: 7px 14px !important;
    border-bottom: 1px solid #bbf7d0 !important;
}
.wbr-rp-row {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 9px 14px !important;
    border-bottom: 1px solid #f0fdf4 !important;
    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 400 !important;
}
.wbr-rp-row:last-child { border-bottom: none !important; }
.wbr-rp-tick { color: #16a34a !important; flex-shrink: 0 !important; font-size: 13px !important; }
.wbr-rp-link { display: flex !important; align-items: center !important; gap: 8px !important; flex: 1 !important; text-decoration: none !important; color: inherit !important; min-width: 0 !important; }
.wbr-rp-link:hover .wbr-rp-lbl { color: #2563eb !important; text-decoration: underline !important; }
.wbr-rp-lbl  { font-family: inherit !important; font-size: 13px !important; font-weight: 500 !important; color: #0f172a !important; flex: 1 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
.wbr-rp-path { font-family: inherit !important; font-size: 10px !important; color: #94a3b8 !important; max-width: 110px !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; flex-shrink: 0 !important; }
.wbr-rp-sz   { font-family: inherit !important; font-size: 11px !important; color: #cbd5e1 !important; margin-left: auto !important; white-space: nowrap !important; flex-shrink: 0 !important; }

/* ── Block 3: Gap bar ──────────────────────────────────── */
.wbr-gap-box {
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    padding: 16px !important;
    margin-bottom: 16px !important;
    background: #fafafa !important;
}
.wbr-gap-head {
    display: flex !important;
    justify-content: space-between !important;
    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    color: #6b7280 !important;
    margin-bottom: 10px !important;
}
.wbr-gap-label { font-weight: 700 !important; color: #0f172a !important; font-family: inherit !important; font-size: 12px !important; }
.wbr-gap-track {
    height: 10px !important;
    background: #f1f5f9 !important;
    border-radius: 5px !important;
    overflow: hidden !important;
    margin-bottom: 8px !important;
}
.wbr-gap-fill {
    height: 100% !important;
    background: #2563eb !important;
    border-radius: 5px !important;
    transition: width 1.2s cubic-bezier(.4,0,.2,1) !important;
    min-width: 6px !important;
}
.wbr-gap-foot {
    display: flex !important;
    justify-content: space-between !important;
    font-family: inherit !important;
    font-size: 11px !important;
    font-weight: 400 !important;
}
.wbr-gap-got    { color: #16a34a !important; font-weight: 600 !important; }
.wbr-gap-locked { color: #9ca3af !important; }

/* ── Block 4: Locked pages ─────────────────────────────── */
.wbr-locked-box {
    background: #fffbeb !important;
    border: 1.5px solid #fde68a !important;
    border-radius: 12px !important;
    padding: 16px !important;
    margin-bottom: 18px !important;
}
.wbr-locked-title {
    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #92400e !important;
    margin-bottom: 12px !important;
}
.wbr-locked-list {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 6px !important;
    margin-bottom: 8px !important;
}
.wbr-locked-row {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: #ffffff !important;
    border: 1px solid #fde68a !important;
    border-radius: 7px !important;
    padding: 7px 10px !important;
    font-family: inherit !important;
    font-size: 11px !important;
    overflow: hidden !important;
}
.wbr-lock-icon { flex-shrink: 0 !important; font-size: 11px !important; }
.wbr-lock-lbl  { flex: 1 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; color: #374151 !important; font-weight: 500 !important; font-family: inherit !important; font-size: 11px !important; }
.wbr-lock-path { display: none !important; }
.wbr-locked-more {
    font-family: inherit !important;
    font-size: 11px !important;
    color: #92400e !important;
    font-style: italic !important;
    margin-top: 6px !important;
}

/* ── Block 5: Upgrade plans ────────────────────────────── */
.wbr-upgrade-box {
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    padding: 22px 20px !important;
    background: #ffffff !important;
}
.wbr-upgrade-box h3 {
    font-size: 18px !important;
    font-weight: 700 !important;
    text-align: center !important;
    color: #0f172a !important;
    margin-bottom: 5px !important;
}

/* ── Countdown timer ─────────────────────────────────────────────── */
.wbr-countdown {
    text-align: center !important;
    font-size: 13px !important;
    color: #92400e !important;
    background: #fef9c3 !important;
    border: 1px solid #fbbf24 !important;
    border-radius: 8px !important;
    padding: 8px 14px !important;
    margin-bottom: 14px !important;
    font-weight: 500 !important;
}
.wbr-countdown #wbr-cd-time {
    font-weight: 700 !important;
    font-family: monospace !important;
    letter-spacing: .05em !important;
}

/* ── Trust line ──────────────────────────────────────────────────── */
.wbr-trust-line {
    text-align: center !important;
    font-size: 12px !important;
    color: #6b7280 !important;
    margin: 12px 0 0 !important;
    line-height: 1.6 !important;
}
.wbr-upgrade-sub {
    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    color: #94a3b8 !important;
    text-align: center !important;
    margin-bottom: 18px !important;
}
.wbr-plans {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
    margin-bottom: 14px !important;
}
.wbr-plan {
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 12px !important;
    padding: 16px !important;
    background: #ffffff !important;
    transition: border-color .15s !important;
}
.wbr-plan:hover { border-color: #94a3b8 !important; }
.wbr-plan-featured { border: 2px solid #2563eb !important; background: #f8fbff !important; }
.wbr-plan-badge {
    display: inline-block !important;
    font-family: inherit !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    background: #eff6ff !important;
    color: #1d4ed8 !important;
    padding: 3px 9px !important;
    border-radius: 20px !important;
    margin-bottom: 8px !important;
    letter-spacing: .02em !important;
}
.wbr-plan-name {
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #374151 !important;
    margin-bottom: 5px !important;
}
.wbr-plan-price {
    font-family: inherit !important;
    font-size: 26px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin-bottom: 10px !important;
    line-height: 1 !important;
}
.wbr-plan-price span {
    font-family: inherit !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    color: #94a3b8 !important;
}
.wbr-plan-feats {
    list-style: none !important;
    font-family: inherit !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    color: #4b5563 !important;
    margin-bottom: 14px !important;
    line-height: 1.9 !important;
    padding: 0 !important;
}
.wbr-plan-feats li::before { content: '✓ ' !important; color: #16a34a !important; font-weight: 700 !important; }
.wbr-pay-btn {
    display: block !important;
    width: 100% !important;
    background: #2563eb !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 9px !important;
    padding: 10px 12px !important;
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: background .15s, transform .1s !important;
    text-align: center !important;
    letter-spacing: -.01em !important;
}
.wbr-pay-btn:hover  { background: #1d4ed8 !important; }
.wbr-pay-btn:active { transform: scale(.97) !important; }
.wbr-pay-btn:disabled { opacity: .55 !important; cursor: not-allowed !important; }

/* ═══════════════════════════════════════════════════════
   S4 · Paid complete + Error
═══════════════════════════════════════════════════════ */
.wbr-success-box,
.wbr-error-box {
    text-align: center !important;
    padding: 36px 20px !important;
}
.wbr-success-box h2 { color: #0f172a !important; margin-bottom: 8px !important; }
.wbr-success-box p  { font-size: 14px !important; color: #6b7280 !important; margin-bottom: 20px !important; }
.wbr-error-box { background: #fef2f2 !important; border-radius: 12px !important; }
.wbr-error-box p {
    font-family: inherit !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #dc2626 !important;
    margin-bottom: 14px !important;
}

/* ── Responsive ────────────────────────────────────────── */
@media (max-width: 520px) {
    #wbr-app .wbr-screen { padding: 22px 18px !important; border-radius: 12px !important; }
    .wbr-plans  { grid-template-columns: 1fr !important; }
    .wbr-locked-list { grid-template-columns: 1fr !important; }
    .wbr-aha-btns { flex-direction: column !important; align-items: stretch !important; }
    .wbr-btn-preview, .wbr-btn-download { justify-content: center !important; }
    .wbr-counters { gap: 6px !important; }
    .wbr-rp-path { display: none !important; }
    .wbr-dp { display: none !important; }
    #wbr-app h2 { font-size: 19px !important; }
}