/*
 * martin-members: the member pages (login, lost password, account, billing, profile, goodbye,
 * signup, thanks, no access). Loaded on those pages only (Front\Pages::assets()).
 *
 * Two families, both ours and both kept as they are:
 * - .ilb-*: our redesigned aMember pages (amember-pro ilb-member.css, Sept 2026), ported
 *   unchanged except for what only aMember's markup needed (.am-* hooks) and the tokens,
 *   which now live on .mbr-front instead of :root;
 * - .mz-*: the signup card family of the approved mockup (docs/mockups/index.html, screens 7
 *   and 8: signup, thanks, no access), shared with the admin's offer preview
 *   (assets/admin/offer-card-preview.css, same rules scoped under .mbr-stage).
 * The member zone is always dark. Fonts come from martin-theme (Abel, Open Sans Condensed).
 */

.mbr-front {
    --ilb-pink: #cc0066;
    --ilb-pink2: #ff2d8a;
    --ilb-ink: #f5f5f5;
    --ilb-text: #d9d9e0;
    --ilb-muted: #a9a9b6;
    --ilb-bg: #111115;
    --ilb-card: #22222b;
    --ilb-card2: #2b2b35;
    --ilb-line: #3a3a47;
    --ilb-field: #0e0e12;
    --ilb-ok: #6fdc9f;
    --ilb-warn: #ffb45e;
    --ilb-err: #ff8a8a;
    --ilb-radius: 14px;
    --ilb-head: Abel, "Open Sans Condensed", sans-serif;
    --mz-pink: #cc0066; --mz-pink2: #ff2d8a; --mz-ink: #f5f5f5; --mz-text: #d9d9e0; --mz-muted: #a9a9b6;
    --mz-bg: #191919; --mz-card: #22222b; --mz-card2: #2b2b35; --mz-line: #3a3a47; --mz-field: #0e0e12;
    --mz-ok: #6fdc9f; --mz-warn: #ffb45e; --mz-err: #ff8a8a; --mz-terms: #ffb86b;
    --font-mz: "Open Sans Condensed", "Arial Narrow", "Roboto Condensed", sans-serif;
    font-family: var(--font-mz);
    font-weight: 300;
    text-align: left;
}
.mbr-front *, .mbr-front *::before, .mbr-front *::after { box-sizing: border-box; }
.mbr-front .mz-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.mbr-front .ico { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; vertical-align: -3px; flex: none; }
.mbr-front [hidden] { display: none !important; }
.mbr-front .sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ========== Our redesigned aMember pages (.ilb-*), ported ================================ */
.ilb-am, .ilb-pane { color: var(--ilb-text); line-height: 1.5; }
.ilb-am *, .ilb-pane * { box-sizing: border-box; }
.ilb-am a, .ilb-pane a { color: var(--ilb-pink2); text-decoration: none; }
.ilb-am a:hover, .ilb-pane a:hover { color: #ff7ab5; }
.ilb-ico { width: 1em; height: 1em; fill: currentColor; flex: none; vertical-align: -0.125em; }

/* ---------- Buttons & fields ---------------------------------------------- */
.ilb-am .ilb-btn, .ilb-pane .ilb-btn, .ilb-pane input.ilb-btn[type=submit] {
    display: inline-flex; align-items: center; justify-content: center; gap: .5em;
    padding: 14px 24px; font: 700 19px/1.2 "Open Sans Condensed", sans-serif; letter-spacing: .2px;
    color: #fff !important; background: var(--ilb-pink); border: 0; border-radius: 10px;
    cursor: pointer; text-decoration: none; text-align: center; width: auto; height: auto;
    box-shadow: 0 6px 20px rgba(204, 0, 102, .28); transition: background .15s, transform .15s, box-shadow .15s;
    -webkit-appearance: none; appearance: none;
}
.ilb-am .ilb-btn:hover, .ilb-pane .ilb-btn:hover { background: var(--ilb-pink2); transform: translateY(-1px); box-shadow: 0 8px 26px rgba(255, 45, 138, .35); }
.ilb-pane .ilb-btn:disabled { opacity: .55; cursor: default; transform: none; }
/* <input type=submit> buttons: keep the pink on hover whatever the theme sets */
.ilb-pane input.ilb-btn[type=submit]:hover, .ilb-pane input.ilb-btn[type=submit]:focus, .ilb-pane input.ilb-btn[type=submit]:active {
    background: var(--ilb-pink2) !important; border-color: transparent !important; color: #fff !important;
}
.ilb-pane input.ilb-btn[type=submit]:active { transform: none; box-shadow: 0 4px 14px rgba(255, 45, 138, .3); }
.ilb-pane input.ilb-btn[type=submit]:disabled { background: var(--ilb-pink) !important; }
.ilb-am .ilb-btn--ghost { background: transparent; border: 1px solid #45454f; box-shadow: none; color: var(--ilb-ink) !important; }
.ilb-am .ilb-btn--ghost:hover { background: #26262e; border-color: #5a5a66; box-shadow: none; }
.ilb-am .ilb-btn--block { display: flex; width: 100%; }

.ilb-pane .ilb-form { margin: 0; padding: 0; border: 0; background: none; box-shadow: none; text-align: left; }
.ilb-pane .ilb-field { margin: 0 0 16px; }
.ilb-pane .ilb-field label, .ilb-pane .ilb-label-row label {
    display: block; margin: 0 0 6px; font-size: 16px; font-weight: 400; color: var(--ilb-muted); letter-spacing: .2px;
}
.ilb-pane .ilb-label-row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.ilb-pane .ilb-forgot { font-size: 15px; }
.ilb-pane input[type=text], .ilb-pane input[type=password], .ilb-pane input[type=email] {
    display: block; width: 100% !important; max-width: none; height: auto; margin: 0;
    padding: 14px 16px; font-size: 18px; line-height: 1.3; font-family: inherit;
    color: #fff; background: var(--ilb-field); border: 1px solid #3a3a45; border-radius: 10px;
    box-shadow: none; transition: border-color .15s, box-shadow .15s;
}
.ilb-pane input[type=text]:focus, .ilb-pane input[type=password]:focus {
    outline: none; border-color: var(--ilb-pink2); box-shadow: 0 0 0 3px rgba(255, 45, 138, .22);
}
.ilb-pane input::placeholder { color: #6d6d78; }
.ilb-pane input:-webkit-autofill { -webkit-text-fill-color: #fff; -webkit-box-shadow: 0 0 0 1000px #15151b inset; caret-color: #fff; }

.ilb-pane .ilb-field { position: relative; }

.ilb-pane .ilb-check { display: flex; align-items: center; gap: 10px; margin: -4px 0 14px; font-size: 16px; color: var(--ilb-text); cursor: pointer; }
.ilb-pane .ilb-check input { width: 18px; height: 18px; accent-color: var(--ilb-pink); margin: 0; }
.ilb-pane input.ilb-btn[type=submit] { display: block; width: 100%; margin: 6px 0 0; padding: 16px 20px; font-size: 20px; }
.ilb-pane .ilb-help { margin: 14px 0 0; font-size: 15px; color: var(--ilb-muted); text-align: center; }


/* ---------- Login page ------------------------------------------------------ */
.ilb-auth-page { max-width: 520px; margin: 28px auto 48px; }
.ilb-auth {
    background: var(--ilb-card); border: 1px solid var(--ilb-line); border-radius: 18px; overflow: hidden;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .55), 0 0 0 1px rgba(255, 45, 138, .04);
}
/* Natural aspect ratio: the cover (photo 1.63:1, video GIF 16:9) is scaled to the card width, never cropped or distorted */
.ilb-auth-hero { position: relative; background: #000; overflow: hidden; }
.ilb-auth-hero img { display: block; width: 100%; height: auto; max-width: none; margin: 0; }
.ilb-auth-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(23, 23, 28, 0) 55%, rgba(23, 23, 28, .7) 84%, var(--ilb-card) 99%); }
.ilb-am .ilb-eyebrow {
    display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px;
    font-size: 13px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase;
    color: #fff; background: rgba(204, 0, 102, .85);
}
.ilb-am .ilb-eyebrow svg { width: 13px; height: 13px; fill: currentColor; }
.ilb-auth-hero .ilb-eyebrow { position: absolute; top: 14px; left: 14px; z-index: 1; }
.ilb-auth-body { position: relative; z-index: 1; margin-top: -26px; padding: 0 36px 32px; }
.ilb-auth .ilb-pane { margin: 0; text-align: left !important; }
.ilb-auth--plain .ilb-auth-body { margin-top: 0; padding-top: 32px; }
.ilb-pane .ilb-auth-title {
    margin: 0 0 4px; font: 400 38px/1.1 var(--ilb-head); color: #fff; text-align: center; letter-spacing: .5px;
    text-transform: none; background: none; border: 0; padding: 0;
}
.ilb-pane .ilb-auth-lead { margin: 0 0 22px; text-align: center; color: var(--ilb-muted); font-size: 17px; }
.ilb-pane .ilb-steps { margin: 10px 0 20px; padding: 0; list-style: none; counter-reset: ilbs; }
.ilb-pane .ilb-steps li { position: relative; margin: 0; padding: 5px 0 5px 36px; font-size: 16px; counter-increment: ilbs; }
.ilb-pane .ilb-steps li::before {
    content: counter(ilbs); position: absolute; left: 2px; top: 5px; width: 24px; height: 24px; border-radius: 50%;
    background: var(--ilb-pink); color: #fff; font-size: 13px; font-weight: 700;
    display: flex; align-items: center; justify-content: center;
}
.ilb-pane .ilb-or { display: flex; align-items: center; gap: 14px; margin: 24px 0 16px; color: #777783; font-size: 14px; text-transform: uppercase; letter-spacing: 2px; }
.ilb-pane .ilb-or::before, .ilb-pane .ilb-or::after { content: ""; flex: 1; height: 1px; background: var(--ilb-line); }
.ilb-pane .ilb-social { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px; }
.ilb-pane .ilb-social > * { margin: 0 !important; }
.ilb-pane .ilb-social img { display: block; border-radius: 4px; }
.ilb-auth-signup { margin: 22px 0 0; text-align: center; font-size: 18px; color: var(--ilb-muted); }


/* ---------- Member dashboard ------------------------------------------------ */
.ilb-dash { max-width: 1180px; margin: 0 auto 40px; font-size: 17px; }
.ilb-dash h1, .ilb-dash h2 { font-family: var(--ilb-head); font-weight: 400; color: #fff; text-transform: none; letter-spacing: .3px; }
.ilb-dash h2 { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; font-size: 26px; line-height: 1.2; }
.ilb-dash h2 .ilb-ico { color: var(--ilb-pink2); font-size: 22px; }
.ilb-card {
    background: var(--ilb-card); border: 1px solid var(--ilb-line); border-radius: var(--ilb-radius); padding: 22px 24px; margin: 0 0 20px;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .04);
}

.ilb-hero {
    display: grid; grid-template-columns: 1fr auto; gap: 24px 36px; align-items: center;
    margin: 0 0 20px; padding: 30px 34px; border-radius: 18px; border: 1px solid #5a2448;
    background: radial-gradient(160% 190% at 0% 0%, #5c1a45 0%, #45163a 30%, #33192f 62%, #2a2232 100%);
    box-shadow: 0 14px 36px rgba(0, 0, 0, .32), inset 0 1px 0 rgba(255, 255, 255, .06);
}
.ilb-hero--expired, .ilb-hero--new { border-color: #5e4128; background: radial-gradient(160% 190% at 0% 0%, #5a3616 0%, #432a15 30%, #33251c 62%, #2a2530 100%); }
.ilb-hero h1 { margin: 12px 0 8px; font-size: 48px; line-height: 1.05; }
.ilb-status { margin: 0 0 8px; font-size: 19px; line-height: 1.4; color: var(--ilb-ink); }
.ilb-status strong { font-weight: 700; }
.ilb-status .emoji { width: 1em !important; height: 1em !important; }
.ilb-status-when { color: var(--ilb-text); }
.ilb-dot { display: inline-block; margin: 0 8px 0 2px; vertical-align: 1px; width: 10px; height: 10px; border-radius: 50%; background: var(--ilb-ok); box-shadow: 0 0 0 4px rgba(111, 220, 159, .18); }
.ilb-status--off .ilb-dot { background: var(--ilb-warn); box-shadow: 0 0 0 4px rgba(255, 180, 94, .18); }
.ilb-hero-lead { margin: 0; max-width: 640px; color: var(--ilb-muted); }
.ilb-hero-cta { display: flex; flex-direction: column; gap: 10px; min-width: 250px; }
/* Under the hero buttons: the redesigned archive pages as chips (no link to /all-packs/) */
.ilb-hero-chips { display: flex; flex-wrap: wrap; gap: 6px; max-width: 300px; margin: 4px 0 0; }
.ilb-hero-chips-h { flex: 0 0 100%; margin: 0 0 2px; font-size: 14px; color: var(--ilb-muted); }
.ilb-am .ilb-hero-chips a {
    display: inline-flex; align-items: center; padding: 5px 11px; border-radius: 999px;
    background: rgba(0, 0, 0, .26); border: 1px solid rgba(255, 255, 255, .18); color: #fff;
    font-size: 14px; font-weight: 700; line-height: 1.25; white-space: nowrap; transition: background .15s, border-color .15s;
}
.ilb-am .ilb-hero-chips a:hover { background: var(--ilb-pink); border-color: var(--ilb-pink); color: #fff; }
/* Under "Hi {name}!": who is signed in; after the lead: the account buttons (replace aMember's tabs + the old Manage card) */
.ilb-hero-login { margin: -2px 0 12px; font-size: 17px; line-height: 1.3; color: var(--ilb-muted); overflow-wrap: anywhere; }
.ilb-hero-login b { color: #fff; font-weight: 700; }
.ilb-hero-acct { display: flex; flex-wrap: wrap; gap: 10px; margin: 20px 0 0; }
.ilb-am .ilb-hero-acct a {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 18px; border-radius: 10px;
    background: rgba(0, 0, 0, .26); border: 1px solid rgba(255, 255, 255, .18); color: #fff;
    font-size: 17px; font-weight: 700; line-height: 1.2; white-space: nowrap;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .2); transition: background .15s, border-color .15s, transform .15s;
}
.ilb-am .ilb-hero-acct a .ilb-ico { width: 18px; height: 18px; color: var(--ilb-pink2); transition: color .15s; }
.ilb-am .ilb-hero-acct a:hover { background: var(--ilb-pink); border-color: var(--ilb-pink); color: #fff; transform: translateY(-1px); }
.ilb-am .ilb-hero-acct a:hover .ilb-ico { color: #fff; }

.ilb-welcome { border-color: rgba(255, 45, 138, .45); background: linear-gradient(135deg, #2a0a1b, var(--ilb-card) 70%); }
.ilb-welcome p { margin: 0; }
.ilb-sign { font-family: var(--ilb-head); font-size: 1.15em; color: #fff; font-style: italic; }

.ilb-tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 0 0 26px; }
.ilb-am .ilb-tile {
    display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; padding: 28px 16px 24px; border-radius: var(--ilb-radius);
    background: var(--ilb-card); border: 1px solid var(--ilb-line); color: var(--ilb-ink);
    box-shadow: 0 10px 28px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .04);
    transition: border-color .15s, transform .15s, background .15s;
}
.ilb-am .ilb-tile:hover { border-color: var(--ilb-pink); background: var(--ilb-card2); transform: translateY(-2px); color: #fff; }
.ilb-tile .ilb-ico {
    width: 44px; height: 44px; margin: 0 0 14px; padding: 20px; border-radius: 50%; box-sizing: content-box; color: #fff;
    background: radial-gradient(circle at 30% 25%, #ff4f9e, var(--ilb-pink) 70%);
    box-shadow: 0 8px 22px rgba(204, 0, 102, .38); transition: transform .2s;
}
.ilb-am .ilb-tile:hover .ilb-ico { transform: scale(1.06); }
.ilb-tile b { font-size: 21px; font-weight: 700; }
.ilb-tile span { font-size: 15px; color: var(--ilb-muted); }

.ilb-section-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 14px; }
.ilb-section-head h2 { margin: 0; }
.ilb-am .ilb-section-head a {
    display: inline-flex; align-items: center; gap: 6px; padding: 7px 18px; border: 1.5px solid var(--ilb-pink2); border-radius: 999px;
    font-size: 16px; font-weight: 700; color: var(--ilb-pink2); transition: background .15s, color .15s;
}
.ilb-am .ilb-section-head a:hover { background: var(--ilb-pink2); color: #fff; }
.ilb-releases { margin: 0 0 26px; }
.ilb-release-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.ilb-am .ilb-release { position: relative; display: block; overflow: hidden; border-radius: 12px; background: #000; color: #fff; }
.ilb-release img { display: block; width: 100%; aspect-ratio: 1.63; object-fit: cover; transition: transform .35s; }
.ilb-release:hover img { transform: scale(1.05); }
.ilb-release span { position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 12px 9px; font-size: 15px; line-height: 1.25; background: linear-gradient(transparent, rgba(0, 0, 0, .88)); }
.ilb-release small { display: block; color: #c9c9d2; font-size: 13px; }
.ilb-tag { position: absolute; top: 8px; left: 8px; padding: 2px 7px; border-radius: 4px; background: var(--ilb-pink); color: #fff; font-size: 11px; font-weight: 700; font-style: normal; letter-spacing: .5px; }

/* My bookmarks (martin-bookmarks, 0.9.6): the latest 4 as compact rows; same rules in amember-pro ilb-member.css */
.ilb-bm { padding: 20px 22px 22px; }
.ilb-dash .ilb-bm h2 { margin: 0; }
.ilb-bm-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.ilb-bm-list > li { margin: 0; padding: 0; list-style: none; min-width: 0; }
.ilb-am .ilb-bm-item {
    display: flex; align-items: center; gap: 12px; height: 100%; padding: 8px 10px 8px 8px; border-radius: 10px;
    background: var(--ilb-card2); border: 1px solid var(--ilb-line); color: var(--ilb-ink); transition: border-color .15s, background .15s;
}
.ilb-am .ilb-bm-item:hover { border-color: var(--ilb-pink); background: #31313c; color: #fff; }
.ilb-bm-thumb { position: relative; flex: none; width: 88px; aspect-ratio: 110 / 70; overflow: hidden; border-radius: 7px; background: #000; }
.ilb-bm-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ilb-bm-text { min-width: 0; }
.ilb-bm-text b { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 15px; font-weight: 700; line-height: 1.25; overflow-wrap: anywhere; }
.ilb-bm-text small { display: block; margin-top: 2px; font-size: 13px; color: var(--ilb-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ilb-bm-empty { display: flex; align-items: center; gap: 12px; margin: 0; padding: 14px 16px; border-radius: 10px; border: 1px dashed var(--ilb-line); color: var(--ilb-muted); font-size: 16px; }
.ilb-bm-empty .ilb-ico { flex: none; width: 22px; height: 22px; color: var(--ilb-pink2); }
.ilb-bm-empty b { color: #fff; }

.ilb-dash-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 20px; align-items: start; }

/* Archive folders: collapsible */
.ilb-folders { padding: 0; }
.ilb-folders > summary { display: block; padding: 20px 56px 20px 24px; cursor: pointer; list-style: none; position: relative; }
.ilb-folders > summary::-webkit-details-marker { display: none; }
.ilb-folders > summary::after {
    content: ""; position: absolute; right: 24px; top: 50%; width: 10px; height: 10px; margin-top: -8px;
    border-right: 2px solid var(--ilb-muted); border-bottom: 2px solid var(--ilb-muted); transform: rotate(45deg); transition: transform .2s;
}
.ilb-folders[open] > summary::after { transform: rotate(225deg); margin-top: -3px; }
.ilb-folders-title { display: flex; align-items: center; gap: 10px; font-family: var(--ilb-head); font-size: 24px; color: #fff; }
.ilb-folders-title .ilb-ico { color: var(--ilb-pink2); }
.ilb-count { padding: 1px 9px; border-radius: 999px; background: #2c2c36; color: var(--ilb-text); font: 700 13px/1.6 "Open Sans Condensed", sans-serif; font-style: normal; }
.ilb-folders-sub { display: block; margin: 2px 0 0 34px; font-size: 15px; color: var(--ilb-muted); }
.ilb-folders[open] > summary { border-bottom: 1px solid var(--ilb-line); }

/* Newsletter card (status from the martin-mailinglist plugin) */
.ilb-mail {
    position: relative; overflow: hidden; margin: 0 0 20px; padding: 26px 28px 24px; border-radius: 18px;
    border: 1.5px solid transparent;
    background:
        radial-gradient(90% 120% at 100% 0%, rgba(255, 45, 138, .22), transparent 55%) padding-box,
        radial-gradient(70% 90% at 0% 100%, rgba(255, 184, 107, .10), transparent 60%) padding-box,
        linear-gradient(160deg, #2c2130, #22222b 60%) padding-box,
        linear-gradient(135deg, #ff2d8a, #ffb86b 45%, #cc0066 100%) border-box;
    box-shadow: 0 16px 40px rgba(0, 0, 0, .35), 0 0 0 1px rgba(255, 45, 138, .06), 0 0 42px rgba(255, 45, 138, .10);
}
.ilb-mail-head { display: flex; align-items: center; gap: 16px; margin: 0 0 14px; }
.ilb-mail-badge {
    flex: none; display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; border-radius: 50%;
    background: radial-gradient(circle at 30% 25%, #ffd29a, #ff4f9e 55%, var(--ilb-pink) 100%);
    box-shadow: 0 8px 22px rgba(255, 45, 138, .4), inset 0 1px 0 rgba(255, 255, 255, .35);
}
.ilb-mail-badge .ilb-ico { width: 30px; height: 30px; color: #fff; }
.ilb-mail-titles { flex: 1; min-width: 0; }
.ilb-mail-eyebrow { display: block; font-size: 13px; font-weight: 700; letter-spacing: 1.6px; text-transform: uppercase; color: #ffb86b; }
.ilb-dash .ilb-mail h2 { display: block; margin: 2px 0 0; font-size: 30px; line-height: 1.1; color: #fff; }
.ilb-mail-pill {
    flex: none; display: inline-flex; align-items: center; gap: 7px; padding: 6px 13px; border-radius: 999px;
    font-size: 14px; font-weight: 700; white-space: nowrap;
    color: #ffe2bd; background: rgba(255, 180, 94, .12); border: 1px solid rgba(255, 180, 94, .45);
}
.ilb-mail--on .ilb-mail-pill { color: #d7ffe8; background: rgba(111, 220, 159, .12); border-color: rgba(111, 220, 159, .5); }
.ilb-mail-pill .ilb-ico { width: 15px; height: 15px; }
.ilb-mail-pill .ilb-dot { margin: 0; box-shadow: none; background: var(--ilb-warn); }
.ilb-mail-lead { margin: 0 0 16px; font-size: 17px; line-height: 1.5; color: var(--ilb-text); }
.ilb-mail-lead b, .ilb-mail-meta b { color: #fff; font-weight: 700; word-break: break-word; }
.ilb-mail-perks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0 0 18px; padding: 0; list-style: none; }
.ilb-mail-perks li {
    display: flex; align-items: flex-start; gap: 10px; margin: 0; padding: 12px; list-style: none; border-radius: 12px;
    background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .07); font-size: 15px; line-height: 1.35; color: var(--ilb-muted);
}
.ilb-mail-perks li b { display: block; color: #fff; font-size: 16px; }
.ilb-mail-perks .ilb-ico { width: 20px; height: 20px; margin-top: 2px; color: var(--ilb-pink2); }
.ilb-mail--on .ilb-mail-perks .ilb-ico { color: var(--ilb-ok); }
.ilb-mail-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 18px; }
.ilb-mail--off .ilb-mail-foot { flex-direction: column; align-items: stretch; }
.ilb-mail-sub { width: 100%; padding: 17px 24px; font-size: 21px; }
.ilb-mail-meta { margin: 0; font-size: 15px; color: var(--ilb-muted); }
.ilb-mail--off .ilb-mail-meta { text-align: center; }
.ilb-mail-warn { margin: 0; padding: 12px 14px; border-radius: 10px; background: rgba(255, 180, 94, .1); border: 1px solid rgba(255, 180, 94, .4); color: #ffe2bd; font-size: 16px; }
.ilb-mail-msg { margin: 0; font-size: 17px; text-align: center; }
.ilb-mail-msg:empty { display: none; }
.ilb-mail-msg.ok { color: var(--ilb-ok); }
.ilb-mail-msg.err { color: var(--ilb-err); }
.ilb-am button.ilb-btn:disabled { opacity: .6; cursor: default; transform: none; }
@media (max-width: 700px) {
    .ilb-mail { padding: 20px 16px; }
    .ilb-mail-head { flex-wrap: wrap; gap: 12px; }
    .ilb-mail-badge { width: 50px; height: 50px; }
    .ilb-dash .ilb-mail h2 { font-size: 25px; }
    .ilb-mail-pill { order: -1; }
    .ilb-mail-perks { grid-template-columns: 1fr; }
    .ilb-mail-sub { font-size: 19px; }
}

.ilb-block form { margin: 0; }
.ilb-block, .ilb-block label { font-size: 16px; }

.ilb-help-card details { border-top: 1px solid var(--ilb-line); }
.ilb-help-card details:last-of-type { border-bottom: 1px solid var(--ilb-line); margin-bottom: 16px; }
.ilb-help-card summary { position: relative; padding: 12px 28px 12px 2px; cursor: pointer; list-style: none; color: var(--ilb-ink); font-size: 17px; }
.ilb-help-card summary::-webkit-details-marker { display: none; }
.ilb-help-card summary::after { content: "+"; position: absolute; right: 4px; top: 9px; font-size: 22px; line-height: 1; color: var(--ilb-pink2); }
.ilb-help-card details[open] summary::after { content: "\2212"; }
.ilb-help-card details p, .ilb-help-card details ol { margin: 0 0 14px; font-size: 16px; color: var(--ilb-text); }
.ilb-help-card details ol { padding-left: 22px; }
.ilb-help-card details li { margin: 0 0 6px; }

.ilb-signoff { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 10px 0 0; font-size: 20px; color: var(--ilb-text); }
.ilb-signoff .ilb-ico { color: var(--ilb-pink2); }

/* ---------- Responsive ---------------------------------------------------- */
@media (max-width: 1000px) {
    .ilb-dash-grid { grid-template-columns: 1fr; }
    .ilb-tiles, .ilb-release-grid { grid-template-columns: repeat(2, 1fr); }
    .ilb-bm-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
    .ilb-bm { padding: 16px 14px 16px; }
    .ilb-dash .ilb-bm h2 { font-size: 24px; }
    .ilb-am .ilb-bm .ilb-section-head a { padding: 6px 13px; font-size: 15px; white-space: nowrap; }
    .ilb-bm-list { grid-template-columns: 1fr; gap: 8px; }
    .ilb-auth-page { margin: 12px auto 32px; }
    .ilb-auth-body { padding: 0 20px 24px; }
    .ilb-pane .ilb-auth-title { font-size: 32px; }
    .ilb-hero { grid-template-columns: 1fr; padding: 22px 20px; gap: 18px; }
    .ilb-hero h1 { font-size: 38px; }
    .ilb-hero-cta { min-width: 0; }
    .ilb-hero-acct { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    .ilb-card { padding: 18px 16px; }
    .ilb-folders { padding: 0; }
    .ilb-folders > summary { padding: 18px 48px 18px 16px; }
    .ilb-folders .ilb-filter { margin: 14px 16px 2px; width: calc(100% - 32px); }
    .ilb-folders ul.ilb-folder-list { padding: 12px 16px 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ilb-folders-sub { margin-left: 0; }
    .ilb-tiles { gap: 10px; }
    .ilb-am .ilb-tile { padding: 20px 10px 16px; }
    .ilb-tile .ilb-ico { width: 32px; height: 32px; padding: 15px; margin-bottom: 10px; }
    .ilb-tile b { font-size: 18px; }
    .ilb-tile span { font-size: 14px; }
    .ilb-release-grid { gap: 10px; }
    .ilb-release span { font-size: 13px; padding: 20px 8px 7px; }
}

/* ---------- Billing + Profile pages ---------------------------------------- */
.ilb-page-head {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 30px;
    margin: 0 0 20px; padding: 26px 30px; border-radius: 18px; border: 1px solid #5a2448;
    background: radial-gradient(160% 190% at 0% 0%, #5c1a45 0%, #45163a 30%, #33192f 62%, #2a2232 100%);
    box-shadow: 0 14px 36px rgba(0, 0, 0, .32), inset 0 1px 0 rgba(255, 255, 255, .06);
}
.ilb-dash .ilb-page-head h1 { margin: 10px 0 4px; font-size: 42px; line-height: 1.05; }
.ilb-page-head p { margin: 0; color: var(--ilb-muted); }
.ilb-page-head-cta { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
/* "← USER DASHBOARD": the way back from every account sub-page (the aMember tabs are hidden) */
.ilb-am .ilb-back {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    padding: 12px 22px; border-radius: 10px; border: 1.5px solid rgba(255, 255, 255, .28);
    background: rgba(0, 0, 0, .28); color: #fff !important;
    font: 700 17px/1.2 "Open Sans Condensed", sans-serif; letter-spacing: 1.4px; text-transform: uppercase; white-space: nowrap;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .25); transition: background .15s, border-color .15s, transform .15s;
}
.ilb-am .ilb-back .ilb-ico { width: 20px; height: 20px; color: var(--ilb-pink2); transition: transform .15s; }
.ilb-am .ilb-back:hover { background: var(--ilb-pink); border-color: var(--ilb-pink); color: #fff !important; transform: translateY(-1px); }
.ilb-am .ilb-back:hover .ilb-ico { color: #fff; transform: translateX(-3px); }
.ilb-note { margin: 0 0 20px; padding: 12px 16px; border-radius: 12px; font-size: 16px; }
.ilb-note--ok { color: #d6ffe7; background: rgba(80, 220, 150, .1); border: 1px solid rgba(111, 220, 159, .45); }
.ilb-empty { margin: 0; color: var(--ilb-muted); }
.ilb-muted { color: var(--ilb-muted); }

/* Subscription cards */
.ilb-sub {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px;
    margin: 0 0 12px; padding: 18px 20px; border-radius: 14px; background: var(--ilb-card2); border: 1px solid var(--ilb-line);
    border-left: 4px solid var(--ilb-ok);
}
.ilb-sub--off { border-left-color: #6d6d78; }
.ilb-sub--warn { border-left-color: var(--ilb-warn); }
.ilb-sub--bad { border-left-color: var(--ilb-err); }
.ilb-sub-main { flex: 1 1 320px; min-width: 0; }
.ilb-dash .ilb-sub-title { margin: 0 0 4px; font: 700 20px/1.25 "Open Sans Condensed", sans-serif; color: #fff; }
.ilb-sub-terms { margin: 0 0 2px; font-size: 16px; color: var(--ilb-text); }
.ilb-sub-side { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px 10px; }
.ilb-badge { display: inline-block; padding: 4px 12px; border-radius: 999px; font-size: 14px; font-weight: 700; white-space: nowrap; }
.ilb-badge--on { color: #d7ffe8; background: rgba(111, 220, 159, .14); border: 1px solid rgba(111, 220, 159, .5); }
.ilb-badge--off { color: var(--ilb-text); background: rgba(255, 255, 255, .06); border: 1px solid #4a4a58; }
.ilb-badge--bad { color: #ffd6d6; background: rgba(255, 110, 110, .12); border: 1px solid rgba(255, 110, 110, .5); }
.ilb-badge--warn { color: #ffe2bd; background: rgba(255, 180, 94, .12); border: 1px solid rgba(255, 180, 94, .5); }
/* "Cancel Current Subscription": a real button, the size of the status badge beside it. */
.ilb-am .ilb-btn--cancel {
    padding: 4px 12px; border-radius: 999px; font-size: 14px; line-height: 1.5; letter-spacing: 0; white-space: nowrap;
    color: #ffd6d6 !important; background: transparent; border: 1px solid rgba(255, 138, 138, .6); box-shadow: none;
}
.ilb-am .ilb-btn--cancel:hover, .ilb-am .ilb-btn--cancel:focus-visible { color: #fff !important; background: rgba(255, 110, 110, .18); border-color: var(--ilb-err); box-shadow: none; }
/* Facts: started, access, invoice, username. */
.ilb-dash .ilb-sub-facts { flex: 1 1 100%; display: flex; flex-wrap: wrap; gap: 6px 26px; margin: 0; padding: 10px 0 0; border-top: 1px solid var(--ilb-line); font-size: 15px; }
.ilb-sub-facts > div { display: flex; gap: 6px; min-width: 0; }
.ilb-dash .ilb-sub-facts dt { margin: 0; color: var(--ilb-muted); font-weight: 400; }
.ilb-dash .ilb-sub-facts dd { margin: 0; color: #fff; font-weight: 700; overflow-wrap: anywhere; }
/* Past subscriptions: the latest shows, the older ones fold. */
.ilb-past { margin: 22px 0 0; }
.ilb-dash .ilb-past-title { margin: 0 0 10px; font: 700 15px/1.3 var(--font-mz); color: var(--ilb-muted); letter-spacing: 1.2px; text-transform: uppercase; }
.ilb-past .ilb-sub { opacity: .92; }
.ilb-past-more > summary { display: inline-flex; margin: 2px 0 10px; padding: 6px 0; color: var(--ilb-pink2); font-size: 17px; font-weight: 700; cursor: pointer; list-style: none; }
.ilb-past-more > summary::-webkit-details-marker { display: none; }
.ilb-past-more > summary:hover { color: #ff7ab5; }
.ilb-past-more > summary:focus-visible { outline: 2px solid var(--ilb-pink2); outline-offset: 3px; border-radius: 4px; }
.ilb-past-more .ilb-more-close, .ilb-past-more[open] .ilb-more-open { display: none; }
.ilb-past-more[open] .ilb-more-close { display: inline; }
/* No subscription at all: the way back. */
.ilb-comeback { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; padding: 16px 18px; border-radius: 12px; border: 1px dashed #4a4a58; background: rgba(0, 0, 0, .18); }
.ilb-comeback p { flex: 1 1 320px; margin: 0; font-size: 17px; }
/* More at CCBill (always last). */
.ilb-ccbill { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 30px; }
.ilb-ccbill > div { flex: 1 1 360px; }
.ilb-dash .ilb-ccbill h2 { margin-bottom: 6px; }
.ilb-ccbill p { margin: 0; color: var(--ilb-text); font-size: 17px; }

/* Payment table */
.ilb-table-wrap { overflow-x: auto; }
.ilb-am table.ilb-table { width: 100%; margin: 0; border-collapse: separate; border-spacing: 0; border: 0; background: none; font-size: 16px; }
.ilb-am table.ilb-table th {
    padding: 10px 14px; text-align: left; font-size: 13px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase;
    color: var(--ilb-muted); background: none; border: 0; border-bottom: 1px solid var(--ilb-line);
}
.ilb-am table.ilb-table td { padding: 13px 14px; border: 0; border-bottom: 1px solid var(--ilb-line); background: none; color: var(--ilb-text); vertical-align: top; }
.ilb-am table.ilb-table tbody tr:hover td { background: rgba(255, 255, 255, .03); }
.ilb-am table.ilb-table tbody tr:last-child td { border-bottom: 0; }
.ilb-am table.ilb-table .ilb-num { text-align: right; white-space: nowrap; }
.ilb-am table.ilb-table td b { color: #fff; }
.ilb-table .ilb-prod { color: #fff; }
.ilb-refund { display: block; font-size: 13px; color: var(--ilb-warn); }
.ilb-row-refund td { opacity: .8; }

/* Profile: avatar uploader card (martin-avatars plugin; its uploader.css does the layout) */
.ilb-avatar-up { padding: 24px 30px; }
.ilb-dash .ilb-avatar-up h2 { margin: 0 0 18px; }
.ilb-avatar-up .mav { gap: 26px; align-items: center; }
.ilb-avatar-up .mav-img { background: var(--ilb-card2); border: 3px solid var(--ilb-pink); box-shadow: 0 8px 22px rgba(204, 0, 102, .3); }
.ilb-avatar-up .mav-body p { margin: 0 0 16px; font-size: 16px; color: var(--ilb-text); }
.ilb-avatar-up .mav-canvas { background: var(--ilb-field); border: 1px solid var(--ilb-line); }
.ilb-avatar-up .mav-zoom { accent-color: var(--ilb-pink); }
.ilb-avatar-up .ilb-btn { padding: 12px 22px; font-size: 17px; }
.ilb-avatar-up .mav-msg { font-size: 15px; color: var(--ilb-muted); }
.ilb-avatar-up .mav-msg.is-ok { color: var(--ilb-ok); }
.ilb-avatar-up .mav-msg.is-err { color: var(--ilb-err); }
/* Dashboard hero: avatar beside the greeting */
.ilb-hero-hi { display: flex; align-items: center; gap: 16px; margin: 12px 0 8px; }
.ilb-hero-hi h1 { margin: 0; }
.ilb-am .ilb-hero-avatar {
    flex: none; display: block; width: 64px; height: 64px; border-radius: 50%; overflow: hidden;
    border: 2px solid var(--ilb-pink); box-shadow: 0 6px 18px rgba(204, 0, 102, .3); transition: transform .15s;
}
.ilb-am .ilb-hero-avatar:hover { transform: scale(1.05); }
.ilb-hero-avatar img { display: block; width: 100%; height: 100%; margin: 0; object-fit: cover; }
/* Profile: avatar (Gravatar) card, shown only when the martin-avatars plugin is off */
.ilb-avatar-card { display: flex; align-items: flex-start; gap: 24px; padding: 24px 30px; }
.ilb-avatar-img {
    flex: none; display: block; width: 96px; height: 96px; margin: 0; border-radius: 50%; object-fit: cover; background: var(--ilb-card2);
    border: 3px solid var(--ilb-pink); box-shadow: 0 8px 22px rgba(204, 0, 102, .3);
}
.ilb-avatar-text { flex: 1; min-width: 0; }
.ilb-dash .ilb-avatar-text h2 { margin: 0 0 8px; }
.ilb-avatar-text p { margin: 0 0 16px; font-size: 16px; color: var(--ilb-text); }
.ilb-avatar-text b { color: #fff; overflow-wrap: anywhere; }
.ilb-avatar-text .ilb-btn .ilb-ico { width: 16px; height: 16px; }
@media (max-width: 700px) {
    .ilb-page-head { padding: 20px 18px; }
    .ilb-dash .ilb-page-head h1 { font-size: 34px; }
    .ilb-page-head-cta { align-items: stretch; width: 100%; }
    .ilb-sub-side { justify-content: flex-start; }
    .ilb-form-card { padding: 20px 16px; }
    .ilb-avatar-card { flex-direction: column; align-items: center; gap: 14px; padding: 20px 16px; text-align: center; }
    .ilb-dash .ilb-avatar-text h2 { justify-content: center; }
    .ilb-avatar-text .ilb-btn { width: 100%; }
    .ilb-avatar-up { padding: 20px 16px; }
    .ilb-dash .ilb-avatar-up h2 { justify-content: center; }
    .ilb-avatar-up .mav { flex-direction: column; align-items: center; gap: 16px; text-align: center; }
    .ilb-avatar-up .mav-body { flex-basis: auto; width: 100%; }
    .ilb-avatar-up .mav-actions { flex-direction: column; }
    .ilb-avatar-up .ilb-btn { width: 100%; }
    .ilb-hero-avatar, .ilb-am .ilb-hero-avatar { width: 52px; height: 52px; }
    .ilb-am .ilb-back { width: 100%; }
    .ilb-am table.ilb-table thead { display: none; }
    .ilb-am table.ilb-table, .ilb-am table.ilb-table tbody, .ilb-am table.ilb-table tr, .ilb-am table.ilb-table td { display: block; width: 100%; }
    .ilb-am table.ilb-table tr { padding: 10px 0; border-bottom: 1px solid var(--ilb-line); }
    .ilb-am table.ilb-table td { display: flex; justify-content: space-between; gap: 12px; padding: 4px 0; border: 0; text-align: right; }
    .ilb-am table.ilb-table td::before { content: attr(data-label); color: var(--ilb-muted); font-size: 14px; text-align: left; }
    .ilb-am table.ilb-table .ilb-num { text-align: right; }
}

/* ---------- Goodbye / index page (/amember/) -------------------------------- */
.ilb-bye-page { max-width: 600px; margin: 28px auto 48px; }
.ilb-bye {
    background: var(--ilb-card); border: 1px solid var(--ilb-line); border-radius: 18px; overflow: hidden;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .55), 0 0 0 1px rgba(255, 45, 138, .04);
}
.ilb-bye .ilb-auth-hero .ilb-eyebrow .ilb-ico { width: 13px; height: 13px; }
.ilb-bye-body { position: relative; z-index: 1; margin-top: -26px; padding: 0 40px 32px; text-align: center; }
.ilb-bye--plain .ilb-bye-body { margin-top: 0; padding-top: 34px; }
.ilb-bye-page h1 {
    margin: 0 0 12px; font: 400 42px/1.08 var(--ilb-head); color: #fff; letter-spacing: .4px; text-transform: none;
}
.ilb-bye-body p { margin: 0 0 12px; font-size: 18px; color: var(--ilb-text); }
.ilb-bye-body .ilb-bye-lead { font-size: 19px; color: var(--ilb-ink); }
.ilb-bye-body .ilb-bye-sign { margin: 16px 0 22px; font-size: 20px; }
.ilb-bye-sign .ilb-sign { font-size: 1.3em; }
.ilb-bye-sign .ilb-ico { color: var(--ilb-pink2); vertical-align: -0.1em; }
.ilb-bye-cta { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 0 0 20px; }
.ilb-bye-cta .ilb-btn { min-width: 190px; }
.ilb-bye-body .ilb-bye-safe {
    display: flex; align-items: center; justify-content: center; gap: 8px; margin: 0; padding-top: 16px;
    border-top: 1px solid var(--ilb-line); font-size: 14px; color: var(--ilb-muted);
}
.ilb-bye-safe .ilb-ico { color: var(--ilb-ok); }

/* soft mailing-list nudge under the card */
.ilb-bye-mail {
    display: flex; align-items: center; gap: 14px; margin: 16px 0 0; padding: 14px 16px; border-radius: 14px;
    background: linear-gradient(135deg, rgba(255, 45, 138, .08), rgba(255, 184, 107, .05)); border: 1px solid rgba(255, 45, 138, .25);
}
.ilb-bye-mail-ico {
    flex: none; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%;
    background: rgba(255, 45, 138, .15); color: var(--ilb-pink2);
}
.ilb-bye-mail-ico .ilb-ico { width: 20px; height: 20px; }
.ilb-bye-mail-text { flex: 1; min-width: 0; font-size: 15px; line-height: 1.35; color: var(--ilb-muted); }
.ilb-bye-mail-text b { display: block; font-size: 16px; color: #fff; }
.ilb-bye-mail-act { flex: none; text-align: right; }
.ilb-am .ilb-btn--sm { padding: 8px 16px; font-size: 16px; }
.ilb-bye-mail-act .ilb-mail-sub { width: auto; }
.ilb-bye-mail-act .ilb-mail-msg { max-width: 220px; font-size: 14px; text-align: right; }

@media (max-width: 700px) {
    .ilb-bye-page { margin: 12px auto 32px; }
    .ilb-bye-body { padding: 0 20px 24px; }
    .ilb-bye-page h1 { font-size: 34px; }
    .ilb-bye-cta .ilb-btn { flex: 1 1 100%; }
    .ilb-bye-mail { flex-wrap: wrap; }
    .ilb-bye-mail-act { flex: 1 1 100%; text-align: left; }
    .ilb-bye-mail-act .ilb-mail-msg { max-width: none; text-align: left; }
}

/* ========== The signup card family (.mz-*), from the approved mockup ====================== */
.mz-card{overflow:hidden;background:var(--mz-card);border:1px solid var(--mz-line);border-radius:18px;box-shadow:0 24px 60px rgba(0,0,0,.55),0 0 0 1px rgba(255,45,138,.04);text-align:left}
.mz-hero{position:relative;background:#000;overflow:hidden}
.mz-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(23,23,28,0) 55%,rgba(34,34,43,.7) 84%,var(--mz-card) 99%)}
.mz-hero--lock .mz-art{filter:blur(6px) saturate(.8);transform:scale(1.08)}
.mz-hero--lock .mz-lock{position:absolute;inset:0;z-index:1;display:grid;place-items:center}
.mz-hero--lock .mz-lock span{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:rgba(15,15,18,.7);border:1px solid rgba(255,255,255,.18);color:#fff;box-shadow:0 8px 30px rgba(0,0,0,.5)}
.mz-hero--lock .mz-lock .ico{width:26px;height:26px}
.mz-eyebrow{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:rgba(204,0,102,.85);color:#fff;font:700 13px/1.4 var(--font-mz);letter-spacing:1.2px;text-transform:uppercase}
.mz-eyebrow .ico{width:13px;height:13px;stroke-width:2.5}
.mz-hero .mz-eyebrow{position:absolute;top:14px;left:14px;z-index:2}
.mz-body{position:relative;z-index:1;margin-top:-26px;padding:0 40px 34px}
.mz-body--plain{margin-top:0;padding-top:34px}
.mz-center{text-align:center}
.mz-head{margin:0 0 18px;text-align:center}
.mz-head .mz-eyebrow{margin:0 0 12px}
.mz-title{margin:0 0 6px;font:400 40px/1.1 "Abel","Arial Narrow",system-ui,sans-serif;color:#fff;letter-spacing:.5px;text-transform:none}
.mz-lead{font-size:17px;color:var(--mz-muted)}
.mz-lead b{color:#fff;font-weight:700}
.mz-perks{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;margin:0 0 26px;padding:0;list-style:none;font-size:16px}
.mz-perks li{display:inline-flex;align-items:center;gap:6px}
.mz-perks .ico{color:var(--mz-ok);stroke-width:2.6;width:15px;height:15px}
.mz-step{min-width:0;margin:0 0 22px;padding:0;border:0}
.mz-step legend{display:flex;align-items:center;gap:10px;width:100%;margin:0 0 14px;padding:0 0 10px;border-bottom:1px solid var(--mz-line);font:400 24px/1.2 "Abel","Arial Narrow",system-ui,sans-serif;color:#fff}
.mz-num{display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:50%;background:var(--mz-pink);color:#fff;font:700 14px/1 var(--font-mz)}
.mz-plans{display:grid;gap:12px}
.mz-plan{position:relative;display:grid;grid-template-columns:22px minmax(0,1fr) auto;column-gap:14px;align-items:start;padding:16px 18px;border:1.5px solid var(--mz-line);border-radius:12px;background:var(--mz-card2);cursor:pointer;transition:border-color .15s,background .15s,box-shadow .15s}
.mz-plan>input{width:20px;height:20px;margin:3px 0 0;accent-color:var(--mz-pink2);cursor:pointer}
.mz-plan:hover{border-color:#5a5a66;background:#30303b}
.mz-plan:has(>input:checked),.mz-plan--fixed{border-color:var(--mz-pink2);background:linear-gradient(135deg,rgba(255,45,138,.16),var(--mz-card2) 65%);box-shadow:0 0 0 3px rgba(255,45,138,.16),0 10px 26px rgba(0,0,0,.3)}
.mz-plan:has(>input:focus-visible){outline:2px solid var(--mz-pink2);outline-offset:3px}
.mz-plan--fixed{grid-template-columns:minmax(0,1fr) auto;cursor:default}
.mz-plan-name{display:block;font:700 19px/1.3 var(--font-mz);color:#fff;overflow-wrap:anywhere}
.mz-plan-desc{display:block;margin-top:4px;font-size:15px;line-height:1.45;color:var(--mz-muted)}
.mz-plan-price{text-align:right;white-space:nowrap}
.mz-plan-price b{display:block;font:700 23px/1.1 var(--font-mz);color:#fff}
.mz-plan-price s{display:block;font-size:15px;color:#7c7c89}
.mz-plan-price small{display:block;font-size:14px;color:var(--mz-muted)}
.mz-plan-price em{display:block;margin-top:5px;font-style:normal;font-weight:700;font-size:15px;color:var(--mz-terms)}
.mz-tag{position:absolute;top:-11px;right:16px;padding:1px 10px;border-radius:999px;background:linear-gradient(90deg,#cc0066,#ff2d8a);color:#fff;font:700 12px/1.7 var(--font-mz);letter-spacing:.9px;text-transform:uppercase;box-shadow:0 4px 12px rgba(204,0,102,.45)}
.mz-tag--alt{background:#3a3a47;box-shadow:none;color:#e6e6ee}
@media (max-width:560px){
  .mz-plan{grid-template-columns:22px minmax(0,1fr);padding:16px 14px}
  .mz-plan--fixed{grid-template-columns:minmax(0,1fr)}
  .mz-plan-price{grid-column:2;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;margin-top:10px;text-align:left;white-space:normal}
  .mz-plan--fixed .mz-plan-price{grid-column:1}
  .mz-plan-price em{flex-basis:100%;margin-top:0}
}
.mz-coupon{margin:0 0 22px}
.mz-coupon summary{display:inline-flex;align-items:center;gap:6px;color:var(--mz-pink2);font-size:16px;cursor:pointer;list-style:none}
.mz-coupon summary::-webkit-details-marker{display:none}
.mz-coupon summary .ico{width:15px;height:15px}
.mz-coupon-row{display:flex;gap:10px;margin-top:10px}
.mz-coupon-row .mz-input{flex:1;min-width:0;text-transform:uppercase}
.mz-applied{display:flex;align-items:center;gap:10px;margin:0 0 22px;padding:10px 14px;border:1px dashed rgba(111,220,159,.55);border-radius:10px;background:rgba(111,220,159,.08);color:#d6ffe7;font-size:16px}
.mz-applied .ico{color:var(--mz-ok);stroke-width:2.6}
.mz-applied code{font:700 14px ui-monospace,SFMono-Regular,Consolas,monospace;color:#fff;letter-spacing:.05em}
.mz-applied button{margin-left:auto;border:0;background:none;color:var(--mz-muted);cursor:pointer;font:inherit;font-size:15px}
.mz-applied button:hover{color:#fff}
.mz-field{margin:0 0 16px}
.mz-field>label,.mz-label{display:flex;justify-content:space-between;margin:0 0 6px;font-size:16px;color:var(--mz-muted);letter-spacing:.2px}
.mz-input{display:block;width:100%;padding:13px 16px;border:1px solid #3a3a45;border-radius:10px;background:var(--mz-field);color:#fff;font:300 17px/1.3 var(--font-mz);transition:border-color .15s,box-shadow .15s}
.mz-input::placeholder{color:#6d6d78}
.mz-input:focus{outline:none;border-color:var(--mz-pink2);box-shadow:0 0 0 3px rgba(255,45,138,.22)}
.mz-row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:560px){.mz-row2{grid-template-columns:1fr;gap:0}}
.mz-pass{position:relative}
.mz-pass .mz-input{padding-right:48px}
.mz-eye{position:absolute;right:8px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:34px;height:34px;border:0;border-radius:8px;background:none;color:#8a8a97;cursor:pointer}
.mz-eye:hover{color:#fff}
.mz-meter{display:flex;gap:4px;margin-top:8px}
.mz-meter span{flex:1;height:3px;border-radius:3px;background:#2c2c36}
.mz-meter span.on{background:var(--mz-ok)}
.mz-meter-l{margin-top:4px!important;font-size:14px;color:var(--mz-muted)}
.mz-google{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;padding:13px 18px;border:1px solid #dadce0;border-radius:10px;background:#fff;color:#1f1f1f;font:600 16px/1.2 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;cursor:pointer;transition:background .15s,box-shadow .15s}
.mz-google:hover{background:#f4f5f7;box-shadow:0 2px 10px rgba(0,0,0,.25)}
.mz-google svg{width:20px;height:20px}
.mz-or{display:flex;align-items:center;gap:14px;margin:20px 0 16px;color:#777783;font-size:14px;text-transform:uppercase;letter-spacing:2px}
.mz-or::before,.mz-or::after{content:"";flex:1;height:1px;background:var(--mz-line)}
.mz-hint{font-size:15px;color:var(--mz-muted);text-align:center}
.mz-signed{display:flex;align-items:center;gap:12px;padding:12px 16px;border:1px solid var(--mz-line);border-radius:12px;background:rgba(255,255,255,.04);font-size:16px}
.mz-signed .mbr-avatar{width:38px;height:38px;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
.mz-signed b{color:#fff}
.mz-signed .grow{flex:1;min-width:0}
.mz-signed small{display:block;font-size:14px;color:var(--mz-muted)}
.mz-summary{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 16px;margin:0 0 14px;padding:14px 18px;border:1px solid var(--mz-line);border-radius:12px;background:rgba(255,255,255,.03)}
.mz-summary span{font-size:16px;color:var(--mz-muted)}
.mz-summary b{font:700 26px/1.1 var(--font-mz);color:#fff}
.mz-summary p{flex-basis:100%;font-size:15px;color:var(--mz-muted)}
.mz-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;padding:14px 24px;border:0;border-radius:10px;background:var(--mz-pink);color:#fff!important;font:700 19px/1.2 var(--font-mz);letter-spacing:.2px;text-align:center;text-decoration:none;cursor:pointer;box-shadow:0 6px 20px rgba(204,0,102,.28);transition:background .15s,transform .15s,box-shadow .15s}
.mz-btn:hover{background:var(--mz-pink2);transform:translateY(-1px);box-shadow:0 8px 26px rgba(255,45,138,.35)}
.mz-btn:focus-visible{outline:2px solid #fff;outline-offset:2px}
.mz-btn .ico{width:18px;height:18px;stroke-width:2.4}
.mz-btn--block{display:flex;width:100%;padding:17px 20px;font-size:21px}
.mz-btn--ghost{background:transparent;border:1px solid #45454f;box-shadow:none;color:var(--mz-ink)!important}
.mz-btn--ghost:hover{background:#26262e;border-color:#5a5a66;box-shadow:none}
.mz-btn--sm{padding:10px 16px;font-size:17px}
.mz-trust{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 12px;margin-top:14px!important;font-size:15px;color:var(--mz-muted)}
.mz-trust span{display:inline-flex;align-items:center;gap:6px}
.mz-trust .ico{width:14px;height:14px;color:var(--mz-ok)}
.mz-trust b{color:#fff}
.mz-below{margin-top:20px!important;text-align:center;font-size:18px;color:var(--mz-muted)}
@media (max-width:560px){.mz-body{padding:0 18px 24px}.mz-body--plain{padding-top:24px}.mz-title{font-size:32px}.mz-lead{font-size:16px}.mz-btn--block{font-size:20px}}

/* thanks */
.mz-spinner{width:56px;height:56px;margin:4px auto 18px;border-radius:50%;border:4px solid #33333f;border-top-color:var(--mz-pink2);animation:mzSpin .9s linear infinite}
@keyframes mzSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.mz-spinner,.mbr-pulse::after{animation:none}}
.mz-proglist{display:grid;gap:10px;max-width:380px;margin:22px auto 20px;padding:0;list-style:none;text-align:left;font-size:17px}
.mz-proglist li{display:flex;align-items:center;gap:12px;color:#7c7c89}
.mz-proglist i{display:grid;place-items:center;flex:none;width:24px;height:24px;border-radius:50%;border:2px solid #3a3a47}
.mz-proglist .ico{width:13px;height:13px;stroke-width:3}
.mz-proglist .done{color:var(--mz-text)}
.mz-proglist .done i{border-color:var(--mz-ok);background:var(--mz-ok);color:#0f2a1c}
.mz-proglist .now{color:#fff;font-weight:700}
.mz-proglist .now i{border-color:#3a3a47;border-top-color:var(--mz-pink2);animation:mzSpin .9s linear infinite}
.mz-heart{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 14px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#ff4f9c,#cc0066);color:#fff;box-shadow:0 0 0 8px rgba(255,45,138,.14),0 10px 30px rgba(204,0,102,.45)}
.mz-heart .ico{width:28px;height:28px}
.mz-h2{margin:26px 0 12px;font:400 22px/1.2 "Abel","Arial Narrow",system-ui,sans-serif;color:#fff;display:flex;justify-content:space-between;align-items:baseline}
.mz-h2 a{font:300 16px var(--font-mz)}
.mz-releases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.mz-rel{position:relative;overflow:hidden;border-radius:10px;border:1px solid var(--mz-line)}
.mz-rel .mz-art{aspect-ratio:1.63/1}
.mz-rel span{position:absolute;left:8px;bottom:6px;right:8px;z-index:1;text-align:left;font-size:14px;line-height:1.2;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.8)}
.mz-rel span small{display:block;font-size:12px;color:#d0d0d8}
.mz-rel::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.75))}
@media (max-width:560px){.mz-releases{grid-template-columns:repeat(2,minmax(0,1fr))}.mz-releases .mz-rel:nth-child(3){display:none}}

/* no-access options */
.mz-options{display:grid;gap:12px;margin:0 0 20px}
.mz-option{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;align-items:center;padding:16px 18px;border:1.5px solid var(--mz-line);border-radius:12px;background:var(--mz-card2);color:var(--mz-text)!important;transition:border-color .15s,background .15s}
.mz-option:hover{border-color:#5a5a66;background:#30303b}
.mz-option--best{border-color:var(--mz-pink2);background:linear-gradient(135deg,rgba(255,45,138,.16),var(--mz-card2) 65%)}
.mz-option--best:hover{border-color:var(--mz-pink2)}
.mz-option .mz-plan-price{grid-row:1;grid-column:2}
.mz-option .mz-btn{grid-column:1/-1;justify-self:start;margin-top:8px}
@media (min-width:561px){.mz-option{grid-template-columns:minmax(0,1fr) auto auto}.mz-option .mz-btn{grid-column:3;grid-row:1;margin:0}}
.mz-folder{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:10px!important;font:13px ui-monospace,SFMono-Regular,Consolas,monospace;color:#7c7c89}

/* ========== Additions for the WordPress pages (M3) ========================================= */

/* Notices (aMember's .am-errors / .am-info look) */
.mbr-front .ilb-note { margin: 0 0 16px; padding: 12px 14px; border-radius: 10px; font-size: 16px; line-height: 1.45; }
.mbr-front .ilb-note--ok { color: #d6ffe7; background: rgba(80, 220, 150, .1); border: 1px solid rgba(111, 220, 159, .45); }
.mbr-front .ilb-note--err { color: #ffd6d6; background: rgba(255, 70, 70, .1); border: 1px solid rgba(255, 110, 110, .45); }
.mbr-front .ilb-note--info { color: #ffe2bd; background: rgba(255, 180, 94, .1); border: 1px solid rgba(255, 180, 94, .4); }
.mbr-front .ilb-note a, .mbr-front .mz-note a { color: #fff; text-decoration: underline; }

/* Show-password eye (replaces aMember's .am-switch-reveal) */
.ilb-pane .ilb-pass { position: relative; }
.ilb-pane .ilb-pass input { padding-right: 48px; }
.mbr-front .ilb-eye, .mbr-front .mz-eye {
    position: absolute; right: 8px; top: 50%; transform: translateY(-50%); display: grid; place-items: center;
    width: 34px; height: 34px; margin: 0; padding: 0; border: 0; border-radius: 8px; background: none; color: #8a8a97; cursor: pointer; box-shadow: none;
}
.mbr-front .ilb-eye:hover, .mbr-front .mz-eye:hover { color: #fff; background: none; }
.mbr-front .ilb-eye .ico, .mbr-front .mz-eye .ico { width: 18px; height: 18px; }
.ilb-pane button.ilb-btn[type=submit] { display: flex; width: 100%; margin: 6px 0 0; padding: 16px 20px; font-size: 20px; }
.ilb-pane .ilb-btn .ico { width: 18px; height: 18px; stroke-width: 2.4; }
.ilb-pane .mz-google { margin: 0; text-decoration: none; }
.ilb-pane .ilb-social .mz-google { width: 100%; }

/* Archive folders (our list; aMember rendered .am-list-resources) */
.mbr-front .ilb-filter {
    display: block; width: calc(100% - 48px); margin: 16px 24px 4px; padding: 11px 14px 11px 38px; font: 300 16px/1.3 var(--font-mz); color: #fff;
    background: var(--ilb-field) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23777783'%3E%3Cpath d='M10 2a8 8 0 0 1 6.3 12.9l5.4 5.4-1.4 1.4-5.4-5.4A8 8 0 1 1 10 2zm0 2a6 6 0 1 0 0 12 6 6 0 0 0 0-12z'/%3E%3C/svg%3E") no-repeat 12px center / 17px;
    border: 1px solid var(--ilb-line); border-radius: 10px; box-shadow: none;
}
.mbr-front .ilb-filter:focus { outline: none; border-color: var(--ilb-pink2); }
.ilb-folders ul.ilb-folder-list {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px;
    margin: 0; padding: 14px 24px 22px; list-style: none; border: 0; background: none;
}
.ilb-folders ul.ilb-folder-list > li { margin: 0; padding: 0; list-style: none; border: 0; background: none; }
.ilb-am .ilb-folders ul.ilb-folder-list > li > a {
    display: block; padding: 8px 12px; border-radius: 8px; border: 1px solid var(--ilb-line); background: var(--ilb-card2);
    color: var(--ilb-text); font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ilb-am .ilb-folders ul.ilb-folder-list > li > a:hover { border-color: var(--ilb-pink); color: #fff; }

/* Profile form (our fields; same look as the aMember form was given) */
.ilb-form-card { padding: 26px 30px; }
.ilb-form-card form { margin: 0; }
.ilb-form-card .ilb-field { margin: 0 0 18px; }
.ilb-form-card .ilb-field > label, .ilb-form-card .ilb-label { display: block; margin: 0 0 6px; color: var(--ilb-text); font-size: 16px; font-weight: 700; }
.ilb-form-card .ilb-field small { display: block; margin: 4px 0 0; font-size: 14px; color: var(--ilb-muted); }
/* Profile: the "show my nickname on my comments" switch */
.ilb-form-card .ilb-field > label.ilb-check { display: flex; align-items: center; gap: 10px; margin: 0; font-weight: 400; cursor: pointer; }
.ilb-form-card .ilb-check input { flex: 0 0 auto; width: 18px; height: 18px; margin: 0; accent-color: var(--ilb-pink); }
.ilb-form-card input[type=text], .ilb-form-card input[type=email], .ilb-form-card input[type=password], .ilb-form-card select {
    display: block; width: 100%; max-width: 520px; height: auto; margin: 0; padding: 12px 14px; font: 300 17px/1.3 var(--font-mz);
    color: #fff; background: var(--ilb-field); border: 1px solid #3a3a45; border-radius: 10px; box-shadow: none;
}
.ilb-form-card select { max-width: 320px; }
.ilb-form-card input:focus, .ilb-form-card select:focus { outline: none; border-color: var(--ilb-pink2); box-shadow: 0 0 0 3px rgba(255, 45, 138, .22); }
.ilb-form-card .ilb-row2 { display: grid; grid-template-columns: repeat(2, minmax(0, 260px)); gap: 0 16px; }
.ilb-form-card .ilb-pending { display: inline-block; margin-top: 6px; padding: 3px 10px; border-radius: 999px; font-size: 14px; color: #ffe2bd; background: rgba(255, 180, 94, .12); border: 1px solid rgba(255, 180, 94, .45); }
.ilb-form-card details.ilb-passbox { margin: 4px 0 20px; border-top: 1px solid var(--ilb-line); }
.ilb-form-card details.ilb-passbox > summary { padding: 14px 0 12px; color: var(--ilb-pink2); font-size: 17px; font-weight: 700; cursor: pointer; list-style: none; }
.ilb-form-card details.ilb-passbox > summary::-webkit-details-marker { display: none; }
.ilb-form-card .ilb-btn[type=submit] { padding: 14px 34px; }

/* Billing: confirm step and upgrade offer inside a subscription card */
.ilb-sub .ilb-confirm, .ilb-sub .ilb-upgrade {
    flex: 1 1 100%; margin: 4px 0 0; padding: 16px 18px; border-radius: 12px; background: rgba(0, 0, 0, .22); border: 1px solid var(--ilb-line);
}
.ilb-sub .ilb-confirm { border-color: rgba(255, 138, 138, .5); background: radial-gradient(160% 190% at 0% 0%, rgba(92, 26, 69, .55) 0%, rgba(42, 34, 50, .5) 100%); }
.ilb-sub .ilb-confirm p, .ilb-sub .ilb-upgrade p { margin: 0 0 12px; font-size: 16px; }
.ilb-sub .ilb-confirm b, .ilb-sub .ilb-upgrade b { color: #fff; }
.ilb-sub .ilb-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.ilb-sub form { margin: 0; }
.ilb-sub .ilb-upgrade { border-color: rgba(255, 45, 138, .45); background: linear-gradient(135deg, rgba(255, 45, 138, .12), rgba(0, 0, 0, .2) 70%); }
.ilb-sub .ilb-upgrade h4 { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; font: 700 18px/1.3 var(--font-mz); color: #fff; }
.ilb-sub .ilb-upgrade h4 .ilb-ico { color: var(--ilb-pink2); }
.ilb-sub .ilb-upgrade details > summary { display: inline-flex; list-style: none; cursor: pointer; }
.ilb-sub .ilb-upgrade details > summary::-webkit-details-marker { display: none; }
.ilb-sub .ilb-upgrade details[open] > summary { display: none; }
.ilb-am button.ilb-btn { font-family: var(--font-mz); }
.ilb-am .ilb-btn--sm { padding: 8px 16px; font-size: 16px; }
.ilb-am .ilb-btn--danger { background: #c9303f; box-shadow: 0 6px 20px rgba(201, 48, 63, .3); }
.ilb-am .ilb-btn--danger:hover { background: #e0424f; box-shadow: 0 8px 26px rgba(224, 66, 79, .35); }
.ilb-am .ilb-btn:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.ilb-dash .ilb-confirm-title { margin: 0 0 8px; font: 400 26px/1.15 var(--ilb-head); color: #fff; }

/* Cancel confirmation dialog (member.js opens it; without JavaScript the button is a link to the
   confirm step inside the card). */
.ilb-modal { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; padding: 16px; }
.ilb-modal-backdrop { position: absolute; inset: 0; background: rgba(8, 8, 12, .78); }
.ilb-modal-box {
    position: relative; width: 100%; max-width: 520px; max-height: calc(100vh - 32px); overflow: auto; padding: 26px 28px 24px;
    border-radius: 18px; border: 1px solid #5a2448; color: var(--ilb-text); font-size: 17px;
    background: radial-gradient(160% 190% at 0% 0%, #5c1a45 0%, #45163a 30%, #33192f 62%, #2a2232 100%);
    box-shadow: 0 24px 60px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .06);
}
.ilb-modal-box:focus { outline: none; }
.ilb-modal-box p { margin: 0 0 12px; }
.ilb-modal-box b { color: #fff; }
.ilb-modal-box .ilb-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; margin-top: 18px; }
.ilb-modal-box form { margin: 0; }
html.mbr-modal-open { overflow: hidden; }
@media (max-width: 560px) {
    .ilb-modal { align-items: flex-end; padding: 0; }
    .ilb-modal-box { max-width: none; border-radius: 18px 18px 0 0; padding: 22px 18px 20px; }
    .ilb-modal-box .ilb-actions form, .ilb-modal-box .ilb-actions .ilb-btn { width: 100%; }
    .ilb-sub .ilb-confirm .ilb-actions form, .ilb-sub .ilb-confirm .ilb-actions .ilb-btn { width: 100%; }
    .ilb-ccbill .ilb-btn, .ilb-comeback .ilb-btn { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .ilb-am .ilb-btn { transition: none; } }

/* ========== Signup, thanks, no access (.mz-*) ============================================== */
.mz-front { color: var(--mz-text); font: 300 18px/1.5 var(--font-mz); }
.mz-front a { color: var(--mz-pink2); text-decoration: none; }
.mz-front a:hover { color: #ff7ab5; }
.mz-front p { margin: 0; }
.mz-front :focus-visible { outline: 2px solid var(--mz-pink2); outline-offset: 2px; }
.mz-page { max-width: 620px; margin: 28px auto 48px; }
.mz-page--narrow { max-width: 700px; }
.mz-top { margin: 0 0 16px; }
.mz-front .mz-note { margin: 0 0 16px; padding: 12px 14px; border-radius: 10px; font-size: 16px; line-height: 1.45; }
.mz-front .mz-note--ok { color: #d6ffe7; background: rgba(80, 220, 150, .1); border: 1px solid rgba(111, 220, 159, .45); }
.mz-front .mz-note--err { color: #ffd6d6; background: rgba(255, 70, 70, .1); border: 1px solid rgba(255, 110, 110, .45); }
.mz-front .mz-note--info { color: #ffe2bd; background: rgba(255, 180, 94, .1); border: 1px solid rgba(255, 180, 94, .4); }
.mz-dry { margin: 0 0 16px; padding: 12px 14px; border: 1px dashed #5a5a66; border-radius: 10px; font: 13px/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; color: #c9c9d3; word-break: break-all; }
.mz-art--img { display: block; aspect-ratio: auto; }
.mz-art--img img { display: block; width: 100%; height: auto; max-height: 360px; object-fit: cover; margin: 0; }
.mz-art--none i { background: linear-gradient(180deg, #3a2a31, #1b1417); }
.mz-art--none i:nth-child(2) { background: linear-gradient(180deg, #4a3038, #1f1519); }
.mz-avatar { display: grid; place-items: center; flex: none; width: 38px; height: 38px; border-radius: 50%; overflow: hidden; background: #3a3a47; color: #fff; font: 700 14px/1 system-ui, sans-serif; }
.mz-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; margin: 0; }
.mz-coupon-row .mz-btn { flex: none; }
.mz-front button.mz-btn { font-family: var(--font-mz); }
.mz-applied button[name] { font-family: var(--font-mz); }
.mz-rel img { display: block; width: 100%; aspect-ratio: 1.63 / 1; object-fit: cover; margin: 0; }
.mz-thanks-slow { margin-top: 14px !important; }
@media (max-width: 700px) { .mz-page { margin: 12px auto 32px; } }

/* Match the live login card exactly: aMember's pages end up with 9px 13.5px field padding. */
.ilb-pane input[type=text], .ilb-pane input[type=password], .ilb-pane input[type=email] { padding: 9px 13.5px; }
.ilb-pane .ilb-pass input { padding-right: 48px; }
/* The Google button keeps Google's colours inside our link-coloured cards. */
.mbr-front a.mz-google, .mbr-front a.mz-google:hover { color: #1f1f1f; }

/* From the offer card preview (assets/admin/offer-card-preview.css), unscoped: the offer text and the art. */
.mz-art i{display:block;background:linear-gradient(180deg,#3a2a31,#1b1417)}
.mz-art i:nth-child(2){background:linear-gradient(180deg,#4a3038,#1f1519);border-radius:48% 48% 0 0/9% 9% 0 0}
.mz-text{margin:0 0 22px;font-size:16px;color:var(--mz-text);text-align:center}
.mz-text p{margin:0 0 8px}
.mz-text ul{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;margin:0;padding:0;list-style:none}
.mz-text li{display:inline-flex;align-items:center;gap:6px}
.mz-text li::before{content:"✓";color:var(--mz-ok);font-weight:700}
.mz-text a{color:var(--mz-pink2)}
.mz-plan[hidden]{display:none}
/* Theme input rules (type selectors) must not win over the card's fields. */
.mbr-front .mz-input, .mbr-front input.mz-input[type=email], .mbr-front input.mz-input[type=password], .mbr-front input.mz-input[type=text] {
    padding: 13px 16px; border: 1px solid #3a3a45; border-radius: 10px; background: var(--mz-field); color: #fff; font: 300 17px/1.3 var(--font-mz); box-shadow: none; height: auto; }
.mbr-front .mz-pass .mz-input { padding-right: 48px; }
.mbr-front .mz-input:focus { outline: none; border-color: var(--mz-pink2); box-shadow: 0 0 0 3px rgba(255, 45, 138, .22); }
/* No-access options on phones: name, then price, then the button (one column). */
@media (max-width: 560px) {
    .mz-option { grid-template-columns: minmax(0, 1fr); }
    .mz-option .mz-plan-price { grid-row: auto; grid-column: 1; margin-top: 4px; }
    .mz-folder { overflow-wrap: anywhere; }
}

/* ========== Social sign-in button (login page) ================================================
 * Same "Continue with Google" button as the aMember login and signup cards (amember-pro
 * ilb-member.css, "Social sign-in buttons"): dark surface, Google's standard "G" unaltered on a
 * white disc, Open Sans Condensed 700. Only Google here (Facebook is dropped at cutover).
 * Markup: templates/front/login.php. The .mz-google button (signup) is unchanged. */
.mbr-front .ilb-pane .ilb-social { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 12px; }
.mbr-front .ilb-sbtn {
    --ilb-sbtn-glow: rgba(66, 133, 244, .38);
    position: relative; display: flex; align-items: center; justify-content: center; gap: 12px;
    width: 100%; min-width: 0; height: 48px; margin: 0; padding: 0 16px; overflow: hidden;
    font: 700 17px/1 "Open Sans Condensed", sans-serif; letter-spacing: .3px; white-space: nowrap;
    text-transform: none; text-decoration: none; text-shadow: none;
    color: var(--ilb-ink) !important; background: var(--ilb-card) !important;
    border: 1px solid var(--ilb-line) !important; border-radius: 12px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 4px 14px rgba(0, 0, 0, .28);
    cursor: pointer; -webkit-tap-highlight-color: transparent;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background-color .16s ease;
}
@media (hover: hover) {
    .mbr-front .ilb-sbtn:hover {
        transform: translateY(-2px); color: #fff !important; background: var(--ilb-card2) !important; border-color: #56566a !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 12px 26px -8px rgba(0, 0, 0, .7), 0 0 22px -2px var(--ilb-sbtn-glow);
    }
}
.mbr-front .ilb-sbtn:active { transform: translateY(0); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 2px 8px rgba(0, 0, 0, .35); }
.mbr-front .ilb-sbtn:focus { outline: none; }
.mbr-front .ilb-sbtn:focus-visible {
    outline: none; border-color: var(--ilb-pink2) !important; box-shadow: 0 0 0 3px rgba(255, 45, 138, .45), 0 4px 14px rgba(0, 0, 0, .28);
}
.mbr-front .ilb-sbtn-mark { flex: none; display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 1px rgba(0, 0, 0, .08); }
.mbr-front .ilb-sbtn-mark svg { display: block; width: 18px; height: 18px; margin: 0; }
.mbr-front .ilb-sbtn-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; transition: opacity .16s; }
/* Loading: the click is on its way to Google (the pageshow script in login.php clears it on Back) */
.mbr-front .ilb-sbtn.is-busy { cursor: progress; }
.mbr-front .ilb-sbtn.is-busy .ilb-sbtn-label { opacity: .6; }
.mbr-front .ilb-sbtn.is-busy::after {
    content: ""; flex: none; width: 16px; height: 16px; margin-left: 2px; box-sizing: border-box;
    border: 2px solid rgba(255, 255, 255, .22); border-top-color: #fff; border-radius: 50%;
    animation: mbr-sbtn-spin .8s linear infinite;
}
@keyframes mbr-sbtn-spin { to { transform: rotate(360deg); } }
.mbr-front .ilb-sbtn[aria-disabled="true"] { opacity: .45; cursor: not-allowed; box-shadow: none; pointer-events: none; }
@media (max-width: 380px) { .mbr-front .ilb-sbtn { gap: 10px; padding: 0 12px; font-size: 16px; } }
@media (prefers-reduced-motion: reduce) {
    .mbr-front .ilb-sbtn { transition: none; }
    .mbr-front .ilb-sbtn:hover { transform: none; }
    .mbr-front .ilb-sbtn.is-busy::after { animation-duration: 2s; }
}
/* ========== End social sign-in button ========================================================= */

/* ========== Profile: Sign-in methods card ======================================================
 * Port of amember-pro ilb-member.css "Profile: Sign-in methods card". Markup: the card at the end
 * of templates/front/profile.php; data and actions: Front\Google::profile_card() / profile_post(). */
.mbr-front .ilb-signin { padding: 24px 30px; }
.mbr-front .ilb-dash .ilb-signin h2 { margin: 0 0 6px; }
.mbr-front .ilb-signin-lead { margin: 0 0 18px; font-size: 16px; color: var(--ilb-muted); }
.mbr-front .ilb-sl-note { margin: 0 0 16px; padding: 12px 14px; font-size: 16px; line-height: 1.45; border-radius: 10px; border: 1px solid; }
.mbr-front .ilb-sl-note--ok { color: #d6ffe7; background: rgba(80, 220, 150, .1); border-color: rgba(111, 220, 159, .45); }
.mbr-front .ilb-sl-note--err { color: #ffd6d6; background: rgba(255, 70, 70, .1); border-color: rgba(255, 110, 110, .45); }
.mbr-front .ilb-sl-note--info { color: var(--ilb-text); background: rgba(255, 255, 255, .04); border-color: var(--ilb-line); }
.mbr-front ul.ilb-sl-list { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.mbr-front .ilb-sl-row {
    display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin: 0; padding: 14px 16px; list-style: none;
    background: rgba(0, 0, 0, .16); border: 1px solid var(--ilb-line); border-radius: 12px;
}
.mbr-front .ilb-sl-row.is-linked { border-color: rgba(111, 220, 159, .32); }
.mbr-front .ilb-sl-mark { flex: none; display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; overflow: hidden; }
.mbr-front .ilb-sl-mark svg { display: block; width: 36px; height: 36px; }
.mbr-front .ilb-sl-mark--google { background: #fff; box-shadow: 0 0 0 1px rgba(0, 0, 0, .08); }
.mbr-front .ilb-sl-mark--google svg { width: 22px; height: 22px; }
.mbr-front .ilb-sl-info { flex: 1 1 180px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.mbr-front .ilb-sl-info b { font: 700 19px/1.2 "Open Sans Condensed", sans-serif; color: #fff; }
.mbr-front .ilb-sl-status { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 5px; font-size: 15px; color: var(--ilb-muted); }
.mbr-front .ilb-sl-status.is-on { color: var(--ilb-ok); }
.mbr-front .ilb-sl-status .ilb-ico { width: 15px; height: 15px; }
.mbr-front .ilb-sl-email { color: var(--ilb-text); overflow-wrap: anywhere; }
.mbr-front .ilb-sl-act { flex: none; display: flex; }
.mbr-front .ilb-sl-form { margin: 0; }
.mbr-front .ilb-sl-btn {
    --ilb-sbtn-glow: rgba(255, 255, 255, .14);
    position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    height: 44px; margin: 0; padding: 0 20px; white-space: nowrap;
    font: 700 16px/1 "Open Sans Condensed", sans-serif; letter-spacing: .3px; text-transform: none; text-shadow: none;
    color: var(--ilb-ink) !important; background: var(--ilb-card2) !important; border: 1px solid #45454f !important; border-radius: 12px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 4px 14px rgba(0, 0, 0, .28); cursor: pointer;
    -webkit-appearance: none; appearance: none; transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background-color .16s ease;
}
.mbr-front .ilb-sl-btn--google { --ilb-sbtn-glow: rgba(66, 133, 244, .38); }
.mbr-front .ilb-sl-btn--disconnect { color: var(--ilb-text) !important; background: transparent !important; box-shadow: none; }
.mbr-front .ilb-sl-btn--danger { color: #fff !important; background: #c62f45 !important; border-color: #c62f45 !important; }
@media (hover: hover) {
    .mbr-front .ilb-sl-btn:hover {
        transform: translateY(-2px); color: #fff !important; background: #33333f !important; border-color: #5a5a6a !important;
        box-shadow: 0 12px 26px -8px rgba(0, 0, 0, .7), 0 0 22px -2px var(--ilb-sbtn-glow);
    }
    .mbr-front .ilb-sl-btn--disconnect:hover { color: #ffd0d0 !important; border-color: rgba(255, 110, 110, .6) !important; background: rgba(255, 70, 70, .08) !important; box-shadow: none; }
    .mbr-front .ilb-sl-btn--danger:hover { background: #e0445b !important; border-color: #e0445b !important; box-shadow: 0 10px 24px -8px rgba(224, 68, 91, .6); }
}
.mbr-front .ilb-sl-btn:active { transform: translateY(0); }
.mbr-front .ilb-sl-btn:focus { outline: none; }
.mbr-front .ilb-sl-btn:focus-visible { outline: none; border-color: var(--ilb-pink2) !important; box-shadow: 0 0 0 3px rgba(255, 45, 138, .45); }
.mbr-front .ilb-sl-btn:disabled { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
.mbr-front .ilb-sl-btn.is-busy { cursor: progress; }
.mbr-front .ilb-sl-btn.is-busy::after {
    content: ""; flex: none; width: 14px; height: 14px; box-sizing: border-box;
    border: 2px solid rgba(255, 255, 255, .22); border-top-color: #fff; border-radius: 50%; animation: mbr-sbtn-spin .8s linear infinite;
}
.mbr-front .ilb-sl-pw { margin: 16px 0 0; padding: 14px 16px; border-radius: 12px; background: rgba(255, 180, 94, .08); border: 1px solid rgba(255, 180, 94, .45); }
.mbr-front .ilb-sl-pw p { margin: 0 0 12px; font-size: 16px; color: var(--ilb-text); }
.mbr-front .ilb-sl-pw b { font-weight: 700; color: var(--ilb-warn); }
.mbr-front .ilb-sl-small { margin: 10px 0 0; font-size: 15px; color: var(--ilb-muted); }
.mbr-front .ilb-sl-dlg {
    width: min(440px, calc(100vw - 32px)); max-width: none; margin: auto; padding: 24px; color: var(--ilb-text);
    background: var(--ilb-card); border: 1px solid var(--ilb-line); border-radius: 16px; box-shadow: 0 24px 60px rgba(0, 0, 0, .6);
}
.mbr-front .ilb-sl-dlg::backdrop { background: rgba(8, 8, 12, .72); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.mbr-front .ilb-sl-dlg h3 { margin: 0 0 10px; font: 400 26px/1.2 var(--ilb-head); color: #fff; text-transform: none; }
.mbr-front .ilb-sl-dlg p { margin: 0 0 14px; font-size: 16px; line-height: 1.5; }
.mbr-front .ilb-sl-label { display: block; margin: 4px 0 6px; font-size: 15px; color: var(--ilb-muted); }
.mbr-front .ilb-sl-input, .mbr-front .ilb-sl-input:focus {
    display: block; width: 100%; height: auto; margin: 0; padding: 12px 14px; font-size: 17px; font-family: inherit; color: #fff !important;
    background: var(--ilb-field) !important; border: 1px solid #3a3a45 !important; border-radius: 10px; box-shadow: none;
}
.mbr-front .ilb-sl-input:focus { outline: none; border-color: var(--ilb-pink2) !important; box-shadow: 0 0 0 3px rgba(255, 45, 138, .22); }
.mbr-front .ilb-sl-dlg-act { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin: 20px 0 0; }
@media (max-width: 700px) {
    .mbr-front .ilb-signin { padding: 20px 16px; }
    .mbr-front .ilb-sl-row { padding: 14px; }
    .mbr-front .ilb-sl-act, .mbr-front .ilb-sl-act .ilb-sl-form, .mbr-front .ilb-sl-act .ilb-sl-btn { width: 100%; }
    .mbr-front .ilb-sl-pw .ilb-sl-btn { width: 100%; white-space: normal; height: auto; min-height: 44px; padding: 10px 16px; }
    .mbr-front .ilb-sl-dlg-act { flex-direction: column-reverse; }
    .mbr-front .ilb-sl-dlg-act .ilb-sl-btn { flex: none; width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
    .mbr-front .ilb-sl-btn { transition: none; }
    .mbr-front .ilb-sl-btn:hover { transform: none; }
}
/* ========== End Sign-in methods card =========================================================== */