/*
 * MUGEX 2.12.6 — Mobile UX pass
 * Phone-only overrides. Desktop/tablet layouts above these breakpoints are intentionally untouched.
 */

/* JS may inject phone-only controls while the viewport is being resized.
 * Keep them inert on desktop so the approved desktop UI can never change. */
.mx-mobile-only,
.mx-reader-mobile-only { display: none !important; }

@media (max-width: 620px) {
  /* ---------- Shared mobile chrome ---------- */
  html { overflow-x: clip; }
  body { -webkit-text-size-adjust: 100%; }

  .mx-mobile-header {
    min-height: 56px !important;
    padding: 0 14px !important;
    border-bottom-color: rgba(43,48,56,.9) !important;
  }
  .mx-mobile-brand { width: 108px !important; min-width: 108px !important; }
  .mx-mobile-brand img { width: 106px !important; max-height: 48px !important; object-fit: contain !important; }
  .mx-mobile-actions { gap: 6px !important; }
  .mx-mobile-actions [data-mx-mobile-search-open] { display: none !important; }
  .mx-mobile-actions .mx-coin-balance {
    min-height: 34px !important;
    padding: 0 9px !important;
    border-radius: 999px !important;
    background: #10141a !important;
  }
  .mx-mobile-actions .mx-coin-balance strong { font-size: 11px !important; }
  .mx-coin-dot { flex: 0 0 auto; }

  .mx-mobile-bottom-nav {
    height: calc(64px + env(safe-area-inset-bottom)) !important;
    padding-bottom: max(4px, env(safe-area-inset-bottom)) !important;
    background: rgba(8,11,16,.97) !important;
    border-top: 1px solid #2b3038 !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
  }
  .mx-mobile-bottom-nav a { min-width: 0 !important; gap: 3px !important; font-size: 9px !important; }
  .mx-mobile-bottom-nav a svg { width: 18px !important; height: 18px !important; }

  /* Keep footer information, but remove mobile navigation duplication. */
  .mx-home-footer,
  .mx-discovery-footer,
  .mx-account-public-footer { padding-top: 24px !important; }
  .mx-home-footer-brand img,
  .mx-discovery-footer-brand img,
  .mx-account-public-footer-main > div img { width: 132px !important; }
  .mx-home-footer-brand p,
  .mx-discovery-footer-brand p,
  .mx-account-public-footer-main > div p { margin-top: 6px !important; font-size: 10px !important; }
  .mx-home-footer-main,
  .mx-discovery-footer-main,
  .mx-account-public-footer-main { gap: 18px !important; }
  .mx-home-footer-links > div:nth-child(1),
  .mx-home-footer-links > div:nth-child(2),
  .mx-discovery-footer nav > div:nth-child(1),
  .mx-discovery-footer nav > div:nth-child(2),
  .mx-account-public-footer-main nav > div:nth-child(1),
  .mx-account-public-footer-main nav > div:nth-child(2) { display: none !important; }
  .mx-home-footer-links,
  .mx-discovery-footer nav,
  .mx-account-public-footer-main nav {
    display: grid !important;
    grid-template-columns: minmax(0,1.35fr) minmax(0,.65fr) !important;
    gap: 16px !important;
  }
  .mx-home-footer-links > div,
  .mx-discovery-footer nav > div,
  .mx-account-public-footer-main nav > div { gap: 5px !important; }
  .mx-home-footer-links a,
  .mx-discovery-footer nav a,
  .mx-account-public-footer-main nav a { min-height: 26px !important; font-size: 9.5px !important; }
  .mx-home-footer-bottom,
  .mx-discovery-footer-bottom,
  .mx-account-public-footer-bottom { margin-top: 16px !important; padding-top: 12px !important; font-size: 8.5px !important; }

  /* ---------- Home: discovery first, less chrome ---------- */
  .mx-home-hero { min-height: 0 !important; }
  .mx-home-hero-inner {
    position: relative !important;
    display: block !important;
    width: calc(100% - 28px) !important;
    min-height: 0 !important;
    padding: 32px 0 34px !important;
  }
  .mx-home-hero-copy { max-width: none !important; }
  .mx-home-hero-copy > .mx-home-eyebrow,
  .mx-home-hero-copy > h1,
  .mx-home-hero-copy > .mx-home-hero-meta { margin-right: 118px !important; }
  .mx-home-hero h1 {
    max-width: 9.5ch !important;
    margin-top: 9px !important;
    margin-bottom: 10px !important;
    font-size: clamp(30px, 8.8vw, 38px) !important;
    line-height: 1.02 !important;
    letter-spacing: -.038em !important;
  }
  .mx-home-hero-meta { gap: 5px 12px !important; font-size: 10px !important; line-height: 1.35 !important; }
  .mx-home-hero-meta span:nth-child(n+3) { display: none !important; }
  .mx-home-hero-chips {
    margin-top: 13px !important;
    gap: 5px !important;
    flex-wrap: nowrap !important;
    overflow: hidden !important;
  }
  .mx-home-hero-chips .mx-chip { min-height: 28px !important; padding: 0 9px !important; font-size: 9px !important; }
  .mx-home-hero-chips .mx-chip:nth-child(n+4) { display: none !important; }
  .mx-home-hero-blurb {
    display: -webkit-box !important;
    margin-top: 14px !important;
    overflow: hidden !important;
    color: #b9c0ca !important;
    font-size: 12.5px !important;
    line-height: 1.58 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 4 !important;
  }
  .mx-home-hero-actions {
    display: grid !important;
    grid-template-columns: minmax(0,1.15fr) minmax(0,.85fr) !important;
    gap: 8px !important;
    margin-top: 18px !important;
  }
  .mx-home-hero-actions .mx-btn { min-width: 0 !important; width: 100% !important; min-height: 44px !important; padding-inline: 10px !important; font-size: 11px !important; }
  .mx-home-hero-cover-wrap {
    display: block !important;
    position: absolute !important;
    z-index: 3 !important;
    top: 31px !important;
    right: 0 !important;
    width: 104px !important;
    margin: 0 !important;
  }
  .mx-home-hero-cover { border-radius: 10px !important; box-shadow: 0 16px 34px rgba(0,0,0,.38) !important; }
  .mx-home-hero-cover-note { display: none !important; }

  .mx-home-section { padding: 28px 0 !important; }
  .mx-home-section-head { margin-bottom: 14px !important; }
  .mx-home-section-head h2 { font-size: 23px !important; }
  .mx-home-section-head small { font-size: 9px !important; }

  .mx-home-progress-card { border-radius: 10px !important; }
  .mx-home-progress-card > .mx-btn { min-height: 42px !important; }

  .mx-home-discovery-grid { gap: 11px !important; padding-bottom: 4px !important; }
  .mx-home-discovery-grid > .mx-home-novel-card { flex-basis: min(46vw, 164px) !important; }
  .mx-home-novel-card .mx-card-title {
    display: -webkit-box !important;
    min-height: 2.55em !important;
    overflow: hidden !important;
    font-size: 13px !important;
    line-height: 1.28 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }
  .mx-home-novel-card .mx-card-chips { margin-top: 7px !important; gap: 4px !important; white-space: nowrap !important; overflow: hidden !important; }
  .mx-home-novel-card .mx-card-chips .mx-chip { min-height: 24px !important; padding: 0 7px !important; font-size: 8px !important; }
  .mx-home-novel-card .mx-card-chips .mx-chip:nth-child(n+2) { display: none !important; }
  .mx-home-novel-card .mx-card-meta { margin-top: 6px !important; font-size: 9px !important; }

  .mx-home-updates-layout { display: block !important; }
  .mx-home-updates-list { overflow: hidden !important; }
  .mx-home-update-row { min-height: 62px !important; }
  .mx-home-update-copy { min-width: 0 !important; }
  .mx-home-update-copy strong {
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 11.5px !important;
  }
  .mx-home-update-copy span { font-size: 9px !important; }
  .mx-home-worlds-panel { margin-top: 16px !important; padding: 14px !important; }
  .mx-home-worlds-chips { flex-wrap: nowrap !important; overflow-x: auto !important; scrollbar-width: none !important; }
  .mx-home-worlds-chips::-webkit-scrollbar { display: none !important; }
  .mx-home-worlds-chips .mx-chip { flex: 0 0 auto !important; }

  .mx-home-community-card,
  .mx-home-newsletter-card { padding: 18px !important; }
  .mx-home-community-copy h2,
  .mx-home-community-copy h3,
  .mx-home-newsletter-card h2,
  .mx-home-newsletter-card h3 { font-size: 22px !important; line-height: 1.12 !important; }
  .mx-home-community-copy p,
  .mx-home-newsletter-card p { font-size: 11.5px !important; line-height: 1.55 !important; }

  /* ---------- Novels: compact search + real filter drawer ---------- */
  .mx-discovery-main { width: calc(100% - 22px) !important; padding-bottom: 78px !important; }
  .mx-discovery-hero { padding: 30px 2px 20px !important; }
  .mx-discovery-hero h1 { margin-top: 7px !important; font-size: 34px !important; line-height: 1.03 !important; }
  .mx-discovery-hero p {
    display: -webkit-box !important;
    margin-top: 10px !important;
    overflow: hidden !important;
    font-size: 11.5px !important;
    line-height: 1.55 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
  }
  .mx-discovery-controls {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important;
    gap: 8px !important;
    padding: 10px !important;
    border-radius: 11px !important;
  }
  .mx-discovery-search { grid-column: 1 / -1 !important; }
  .mx-discovery-search input,
  .mx-discovery-sort select { min-height: 44px !important; font-size: 16px !important; }
  .mx-discovery-sort { min-width: 0 !important; }
  .mx-discovery-sort select { width: 100% !important; }
  .mx-mobile-catalog-filter-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    min-height: 44px !important;
    padding: 0 12px !important;
    border: 1px solid #343c47 !important;
    border-radius: 8px !important;
    background: #0b0c10 !important;
    color: #f3eee4 !important;
    font: 750 11px/1 var(--mx-font-ui) !important;
  }
  .mx-mobile-catalog-filter-button b {
    display: none;
    min-width: 18px;
    height: 18px;
    place-items: center;
    border-radius: 999px;
    background: #d6a632;
    color: #090b0e;
    font-size: 9px;
  }
  .mx-mobile-catalog-filter-button.has-filters b { display: grid; }

  .mx-mobile-filter-placeholder + .mx-discovery-genres { display: none !important; }
  .mx-mobile-filters-backdrop {
    display: block !important;
    position: fixed !important;
    z-index: 1100 !important;
    inset: 0 !important;
    background: rgba(0,0,0,.68) !important;
    backdrop-filter: blur(3px) !important;
    -webkit-backdrop-filter: blur(3px) !important;
  }
  .mx-mobile-filters-sheet {
    display: grid !important;
    position: fixed !important;
    z-index: 1110 !important;
    left: 8px !important;
    right: 8px !important;
    bottom: max(8px, env(safe-area-inset-bottom)) !important;
    max-height: min(76vh, 620px) !important;
    display: grid !important;
    grid-template-rows: auto minmax(0,1fr) auto !important;
    overflow: hidden !important;
    border: 1px solid #38404b !important;
    border-radius: 18px !important;
    background: #10141a !important;
    box-shadow: 0 28px 80px rgba(0,0,0,.56) !important;
    transform: translateY(calc(100% + 24px)) !important;
    transition: transform 220ms cubic-bezier(.2,.8,.2,1) !important;
  }
  .mx-mobile-filters-backdrop[hidden],
  .mx-mobile-filters-sheet[hidden] { display: none !important; }
  .mx-mobile-filters-sheet.is-open { transform: translateY(0) !important; }
  .mx-mobile-filters-head,
  .mx-mobile-filters-foot {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    padding: 14px 16px !important;
    border-bottom: 1px solid #2b3038 !important;
  }
  .mx-mobile-filters-foot { border-top: 1px solid #2b3038 !important; border-bottom: 0 !important; }
  .mx-mobile-filters-head strong { font-size: 16px !important; }
  .mx-mobile-filters-head button,
  .mx-mobile-filters-foot button {
    min-height: 40px !important;
    padding: 0 13px !important;
    border: 1px solid #38404b !important;
    border-radius: 8px !important;
    background: #151a21 !important;
    color: #f3eee4 !important;
    font-weight: 750 !important;
  }
  .mx-mobile-filters-foot button:last-child { border-color: #d6a632 !important; background: #d6a632 !important; color: #0c0e12 !important; }
  .mx-mobile-filters-body { overflow-y: auto !important; overscroll-behavior: contain !important; padding: 2px 16px 18px !important; }
  .mx-mobile-filters-body .mx-discovery-genres {
    display: block !important;
    padding: 20px 0 2px !important;
    border-top: 0 !important;
  }
  .mx-mobile-filters-body .mx-discovery-genres + .mx-discovery-genres { margin-top: 14px !important; border-top: 1px solid #2b3038 !important; }
  .mx-mobile-filters-body .mx-discovery-section-head { margin-bottom: 12px !important; }
  .mx-mobile-filters-body .mx-discovery-section-head h2 { font-size: 18px !important; }
  .mx-mobile-filters-body .mx-discovery-filter-chips { gap: 7px !important; }
  .mx-mobile-filters-body .mx-discovery-filter-chips button { min-height: 36px !important; padding: 0 12px !important; font-size: 10px !important; }
  body.mx-mobile-modal-open { overflow: hidden !important; }

  .mx-discovery-library { padding: 28px 0 !important; border-top: 0 !important; }
  .mx-discovery-library .mx-discovery-section-head { margin-bottom: 14px !important; }
  .mx-discovery-grid { gap: 20px 11px !important; }
  .mx-discovery-cover { border-radius: 10px !important; }
  .mx-discovery-card-copy { padding-top: 9px !important; }
  .mx-discovery-card-title-row { display: block !important; }
  .mx-discovery-card h2 {
    display: -webkit-box !important;
    min-height: 2.55em !important;
    overflow: hidden !important;
    font-size: 13px !important;
    line-height: 1.28 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }
  .mx-discovery-status { display: inline-flex !important; margin-top: 5px !important; font-size: 7.5px !important; }
  .mx-discovery-author { display: none !important; }
  .mx-discovery-chips { margin: 7px 0 0 !important; }
  .mx-discovery-chips span { padding: 4px 7px !important; font-size: 8px !important; }
  .mx-discovery-chips span:nth-child(n+2) { display: none !important; }
  .mx-discovery-card-meta { margin-top: 7px !important; font-size: 8.5px !important; }
  .mx-discovery-open { display: none !important; }

  .mx-discovery-authors { padding: 28px 0 !important; }
  .mx-discovery-author-links { gap: 7px !important; }
  .mx-discovery-author-links a { min-height: 48px !important; padding-inline: 12px !important; font-size: 11px !important; }
  .mx-discovery-author-links > a:nth-child(n+5):not(.mx-mobile-author-visible) { display: none !important; }
  .mx-discovery-author-links.is-expanded > a { display: flex !important; }
  .mx-mobile-authors-toggle {
    display: block !important;
    width: 100% !important;
    min-height: 42px !important;
    margin-top: 9px !important;
    border: 1px solid #343c47 !important;
    border-radius: 8px !important;
    background: #11151b !important;
    color: #f3eee4 !important;
    font-weight: 750 !important;
  }

  /* Genre/trope directory stays browseable, but denser. */
  .mx-genre-directory { padding: 28px 0 !important; }
  .mx-genre-directory-grid { gap: 8px !important; }
  .mx-genre-directory-card { min-height: 74px !important; padding: 12px 32px 12px 12px !important; }
  .mx-genre-directory-card > span { font-size: 13px !important; }
  .mx-genre-directory-card strong { font-size: 8.5px !important; }

  /* Contact/support: retain approved surface, make tap targets comfortable. */
  .mx-contact-grid,
  .mx-contact-layout,
  .mx-support-public-grid { grid-template-columns: 1fr !important; }
  .mx-contact-form button[type="submit"],
  .mx-support-form button[type="submit"] { width: 100% !important; min-height: 46px !important; }

  /* ---------- Single Novel: primary action in the first screen ---------- */
  .mugex-novel-page { padding-inline: 0 !important; }
  .mx-novel-shell { border-radius: 0 !important; }
  .mx-novel-hero-inner {
    display: grid !important;
    grid-template-columns: 112px minmax(0,1fr) !important;
    grid-auto-flow: row !important;
    gap: 8px 14px !important;
    width: calc(100% - 28px) !important;
    padding: 28px 0 22px !important;
    align-items: start !important;
  }
  .mx-novel-cover-column,
  .mx-novel-hero-copy { display: contents !important; }
  .mx-novel-cover-media { grid-column: 1 !important; grid-row: 1 / span 4 !important; min-width: 0 !important; }
  .mx-novel-cover-shell { width: 112px !important; min-width: 112px !important; border-radius: 9px !important; }
  .mx-novel-cover-note {
    position: static !important;
    width: 100% !important;
    min-height: 0 !important;
    margin-top: 7px !important;
    padding: 8px 9px !important;
    border-radius: 7px !important;
    background: rgba(16,19,25,.92) !important;
  }
  .mx-novel-cover-note span { font-size: 7px !important; }
  .mx-novel-cover-note strong { margin-top: 2px !important; font-size: 10px !important; }
  .mx-novel-overline { grid-column: 2 !important; grid-row: 1 !important; margin: 0 !important; align-self: end !important; }
  .mx-novel-overline > span:last-child { display: none !important; }
  .mx-novel-hero h1 {
    grid-column: 2 !important;
    grid-row: 2 !important;
    max-width: none !important;
    margin: 0 !important;
    font-size: clamp(27px, 8vw, 35px) !important;
    line-height: 1.02 !important;
    letter-spacing: -.042em !important;
  }
  .mx-novel-author-line { grid-column: 2 !important; grid-row: 3 !important; margin: 2px 0 0 !important; font-size: 10px !important; line-height: 1.35 !important; }
  .mx-mobile-rating-summary {
    grid-column: 2 !important;
    grid-row: 4 !important;
    display: inline-flex !important;
    align-items: center !important;
    align-self: start !important;
    gap: 5px !important;
    width: max-content !important;
    max-width: 100% !important;
    margin-top: 3px !important;
    color: #d6a632 !important;
    font: 800 10px/1.2 var(--mx-font-ui) !important;
  }
  .mx-mobile-rating-summary small { color: #8791a0 !important; font-size: 8.5px !important; font-weight: 650 !important; }
  .mx-novel-taxonomy-groups { grid-column: 1 / -1 !important; grid-row: 5 !important; margin-top: 8px !important; }
  .mx-novel-taxonomy-group { margin-top: 0 !important; }
  .mx-novel-taxonomy-group + .mx-novel-taxonomy-group { margin-top: 8px !important; }
  .mx-novel-taxonomy-label { font-size: 7.5px !important; }
  .mx-novel-chips {
    margin-top: 6px !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    scroll-snap-type: x proximity !important;
  }
  .mx-novel-chips::-webkit-scrollbar { display: none !important; }
  .mx-novel-chips .mx-chip { flex: 0 0 auto !important; min-height: 28px !important; padding-inline: 9px !important; font-size: 9px !important; scroll-snap-align: start !important; }
  .mx-novel-synopsis {
    grid-column: 1 / -1 !important;
    grid-row: 6 !important;
    display: -webkit-box !important;
    margin: 7px 0 0 !important;
    overflow: hidden !important;
    font-size: 12px !important;
    line-height: 1.58 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 4 !important;
  }
  .mx-novel-synopsis.is-expanded { display: block !important; overflow: visible !important; }
  .mx-mobile-synopsis-toggle {
    display: inline-flex !important;
    grid-column: 1 / -1 !important;
    grid-row: 7 !important;
    justify-self: start !important;
    margin: -2px 0 1px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #d6a632 !important;
    font: 750 9.5px/1.4 var(--mx-font-ui) !important;
  }
  .mx-novel-actions {
    grid-column: 1 / -1 !important;
    grid-row: 8 !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    margin-top: 8px !important;
  }
  .mx-novel-actions .mx-btn { min-width: 0 !important; width: 100% !important; min-height: 44px !important; padding: 0 8px !important; font-size: 10.5px !important; }
  .mx-novel-actions .mx-btn:first-child:not([hidden]),
  .mx-novel-actions [data-mx-novel-start]:not([hidden]),
  .mx-novel-actions [data-mx-novel-continue]:not([hidden]) { grid-column: 1 / -1 !important; }
  .mx-novel-bookmark { width: 100% !important; }
  .mx-novel-bookmark span { position: static !important; width: auto !important; height: auto !important; overflow: visible !important; clip: auto !important; }
  .mx-novel-actions svg { width: 15px !important; height: 15px !important; }
  .mx-novel-follow-confirm,
  .mx-novel-follow-feedback,
  .mx-novel-resume-note { grid-column: 1 / -1 !important; }
  .mx-novel-follow-confirm { grid-row: 9 !important; }
  .mx-novel-follow-feedback { grid-row: 10 !important; }
  .mx-novel-resume-note { grid-row: 11 !important; }
  .mx-novel-rating {
    grid-column: 1 / -1 !important;
    grid-row: 12 !important;
    width: 100% !important;
    margin-top: 6px !important;
    padding: 11px 12px !important;
  }
  .mx-novel-rating-stars { justify-content: space-between !important; }
  .mx-rating-star { width: 42px !important; height: 42px !important; }

  .mx-novel-facts {
    width: calc(100% - 28px) !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  }
  .mx-novel-facts > div,
  .mx-novel-facts > div:nth-child(odd),
  .mx-novel-facts > div:nth-child(even) {
    min-width: 0 !important;
    padding: 12px 8px !important;
    border: 0 !important;
    border-right: 1px solid rgba(255,255,255,.08) !important;
  }
  .mx-novel-facts > div:last-child { border-right: 0 !important; }
  .mx-novel-facts span { font-size: 7px !important; }
  .mx-novel-facts strong { font-size: 9.5px !important; line-height: 1.35 !important; }

  .mx-novel-library { width: calc(100% - 28px) !important; padding: 28px 0 84px !important; }
  .mx-library-heading-row { margin-bottom: 14px !important; }
  .mx-library-heading-row h2 { font-size: 24px !important; }
  .mx-library-heading-row p { margin-top: 6px !important; font-size: 11px !important; line-height: 1.5 !important; }
  .mx-library-toolbar { gap: 8px !important; }
  .mx-library-status { margin: 9px 0 10px !important; font-size: 9px !important; }
  .mx-library-row { min-height: 64px !important; padding: 9px 10px !important; }
  .mx-library-row-title > strong { font-size: 11.5px !important; }
  .mx-library-row-badges { gap: 4px !important; }
  .mx-library-row-badges .mx-badge { font-size: 7px !important; }
  .mx-library-list > .mx-library-row.mx-mobile-chapter-hidden { display: none !important; }
  .mx-mobile-chapter-more {
    display: block !important;
    width: 100% !important;
    min-height: 44px !important;
    margin-top: 10px !important;
    border: 1px solid #38404b !important;
    border-radius: 9px !important;
    background: #11151b !important;
    color: #f3eee4 !important;
    font: 800 11px/1 var(--mx-font-ui) !important;
  }
  .mx-library-footer.is-public { padding-top: 8px !important; }
  .mx-library-footer.is-public [data-mx-library-more] { display: none !important; }

  .mx-series-related { width: calc(100% - 28px) !important; padding-bottom: 82px !important; overflow: hidden !important; }
  .mx-series-related-grid {
    display: flex !important;
    gap: 10px !important;
    margin-inline: -14px !important;
    padding: 0 14px 8px !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    scroll-snap-type: x mandatory !important;
  }
  .mx-series-related-grid::-webkit-scrollbar { display: none !important; }
  .mx-series-related-card { flex: 0 0 min(78vw, 290px) !important; grid-template-columns: 58px minmax(0,1fr) !important; scroll-snap-align: start !important; }

  /* ---------- Account: overview summarizes; Library owns collections ---------- */
  .mx-account-public-main { width: calc(100% - 18px) !important; padding-top: 14px !important; padding-bottom: 76px !important; }
  .mx-account-public-tabs {
    height: 52px !important;
    gap: 2px !important;
    padding: 0 7px !important;
    border-radius: 11px 11px 0 0 !important;
    overflow: hidden !important;
  }
  .mx-account-public-tabs a { flex: 1 1 auto !important; justify-content: center !important; padding: 0 7px !important; font-size: 11px !important; }
  .mx-account-public-tabs a:nth-child(2) { display: none !important; }
  .mx-account-public-tabs a.is-active:after { left: 8px !important; right: 8px !important; }

  .mx-account-public-hero {
    grid-template-columns: 58px minmax(0,1fr) !important;
    gap: 12px !important;
    padding: 17px !important;
  }
  .mx-account-public-avatar-control,
  .mx-account-public-avatar { width: 58px !important; height: 58px !important; }
  .mx-account-public-hero h1 { margin: 3px 0 5px !important; font-size: 26px !important; }
  .mx-account-public-hero p { display: -webkit-box !important; overflow: hidden !important; font-size: 10.5px !important; line-height: 1.48 !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 2 !important; }
  .mx-account-avatar-remove { display: none !important; }
  .mx-account-public-metrics,
  .mx-account-public-metrics.has-following {
    grid-column: 1 / -1 !important;
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    width: 100% !important;
    max-width: none !important;
    margin-top: 4px !important;
  }
  .mx-account-public-metrics > div,
  .mx-account-public-metrics.has-following > div { padding: 10px 5px !important; border-top: 0 !important; border-left: 1px solid #303742 !important; text-align: center !important; }
  .mx-account-public-metrics > div:first-child,
  .mx-account-public-metrics.has-following > div:first-child { border-left: 0 !important; }
  .mx-account-public-metrics span { font-size: 7px !important; }
  .mx-account-public-metrics strong { margin-top: 3px !important; font-size: 17px !important; }

  .mx-account-public-grid { gap: 10px !important; margin-top: 10px !important; }
  .mx-account-public-panel { padding: 13px !important; border-radius: 10px !important; }
  .mx-account-panel-head { margin-bottom: 11px !important; }
  .mx-account-panel-head h1,
  .mx-account-panel-head h2 { font-size: 20px !important; }
  .mx-account-progress-row { min-height: 64px !important; padding: 8px !important; }
  .mx-account-progress-copy strong { font-size: 11px !important; }
  .mx-account-progress-copy small { font-size: 8.5px !important; }
  .mx-account-summary > a { padding: 11px 0 !important; font-size: 12px !important; }

  /* These are useful on desktop Overview, but duplicate dedicated mobile destinations. */
  .mx-account-public-library,
  .mx-account-public-settings { display: none !important; }

  .mx-account-library-endpoint { padding-inline: 13px !important; }
  .mx-account-library-hero { gap: 12px !important; padding: 16px 0 !important; }
  .mx-account-library-hero h1 { font-size: 26px !important; }
  .mx-account-library-hero p { font-size: 11px !important; line-height: 1.5 !important; }
  .mx-account-library-total { display: none !important; }
  .mx-mobile-collection-tabs {
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 5px !important;
    margin: 2px 0 12px !important;
    padding: 4px !important;
    border: 1px solid #303742 !important;
    border-radius: 10px !important;
    background: #0c1016 !important;
  }
  .mx-mobile-collection-tabs button {
    min-height: 40px !important;
    padding: 0 6px !important;
    border: 0 !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: #8e98a7 !important;
    font: 750 10px/1 var(--mx-font-ui) !important;
  }
  .mx-mobile-collection-tabs button.is-active { background: #171c24 !important; color: #f3eee4 !important; box-shadow: inset 0 -2px 0 #d6a632 !important; }
  .mx-account-library-collection { padding: 10px 0 !important; border-top: 0 !important; }
  .mx-account-library-collection[hidden] { display: none !important; }
  .mx-account-empty { min-height: 150px !important; padding: 18px !important; }
  .mx-account-library-footer { padding-top: 14px !important; font-size: 9px !important; }

  /* Settings: keep success green as an accent, never as a giant canvas. */
  .mx-account-woo-endpoint { padding: 14px !important; }
  .mx-account-woo-endpoint > .mx-account-panel-head { margin-bottom: 12px !important; }
  .mx-account-woo-endpoint > .mx-account-panel-head .mx-account-kicker { display: none !important; }
  .mx-account-woo-endpoint > .mx-account-panel-head h1 { font-size: 25px !important; }
  .mx-account-endpoint-tools > .mx-account-kicker,
  .mx-account-endpoint-tools > h2 { display: none !important; }
  .mx-account-settings-grid { gap: 7px !important; }
  .mx-account-settings-link { min-height: 70px !important; padding: 11px !important; }
  .mx-account-settings-link strong { font-size: 11px !important; }
  .mx-account-settings-link small { font-size: 8.5px !important; }

  .mx-account-notification-settings {
    margin: 14px 0 18px !important;
    padding: 15px !important;
    border: 1px solid #31443c !important;
    border-left: 3px solid #55c991 !important;
    border-radius: 10px !important;
    background: #0d1117 !important;
    background-image: none !important;
    box-shadow: none !important;
    color: #f3eee4 !important;
    clip-path: none !important;
  }
  .mx-account-notification-settings::before,
  .mx-account-notification-settings::after { display: none !important; content: none !important; }
  .mx-account-notification-settings * { clip-path: none !important; }
  .mx-account-notify-head h2 { font-size: 21px !important; }
  .mx-account-notify-head p { font-size: 10.5px !important; }
  .mx-account-notify-field { padding: 11px !important; }
  .mx-account-notify-field strong { font-size: 11px !important; }
  .mx-account-notify-field small { font-size: 8.5px !important; }

  .mx-mobile-password-toggle {
    display: flex !important;
    width: 100% !important;
    min-height: 44px !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin: 8px 0 10px !important;
    padding: 0 12px !important;
    border: 1px solid #303742 !important;
    border-radius: 8px !important;
    background: #0d1117 !important;
    color: #f3eee4 !important;
    font-weight: 750 !important;
  }
  .mx-account-woocommerce fieldset.mx-mobile-password-collapsed { display: none !important; }

  /* ---------- Wallet: scale from dozens to hundreds of unlocks ---------- */
  .mx-wallet-account { overflow: hidden !important; }
  .mx-wallet-account-hero {
    grid-template-columns: minmax(0,1fr) 108px !important;
    gap: 12px !important;
    padding: 17px !important;
  }
  .mx-wallet-account-hero h1 { margin: 4px 0 7px !important; font-size: 27px !important; line-height: 1.04 !important; }
  .mx-wallet-account-hero p {
    display: -webkit-box !important;
    overflow: hidden !important;
    font-size: 10.5px !important;
    line-height: 1.5 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
  }
  .mx-wallet-account-actions { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 7px !important; margin-top: 13px !important; }
  .mx-wallet-account-actions a { width: 100% !important; min-height: 40px !important; padding-inline: 8px !important; font-size: 10px !important; }
  .mx-wallet-balance-card { min-height: 130px !important; padding: 12px 7px !important; border-radius: 10px !important; }
  .mx-wallet-balance-card span { font-size: 7px !important; }
  .mx-wallet-balance-card strong { font-size: 36px !important; }
  .mx-wallet-balance-card em { font-size: 10px !important; }
  .mx-wallet-balance-card small { display: none !important; }

  .mx-wallet-facts { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
  .mx-wallet-facts > div {
    min-height: 82px !important;
    padding: 11px 7px !important;
    border-right: 1px solid var(--mx-border) !important;
    border-bottom: 0 !important;
    text-align: center !important;
  }
  .mx-wallet-facts > div:last-child { border-right: 0 !important; }
  .mx-wallet-facts span { font-size: 7px !important; }
  .mx-wallet-facts strong { font-size: 15px !important; }
  .mx-wallet-facts small { font-size: 7.5px !important; line-height: 1.3 !important; }

  .mx-mobile-wallet-tabs {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 5px !important;
    margin: 12px 13px 0 !important;
    padding: 4px !important;
    border: 1px solid #303742 !important;
    border-radius: 10px !important;
    background: #0b0f15 !important;
  }
  .mx-mobile-wallet-tabs button {
    min-height: 40px !important;
    border: 0 !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: #8d97a5 !important;
    font-weight: 750 !important;
  }
  .mx-mobile-wallet-tabs button.is-active { background: #171c24 !important; color: #f3eee4 !important; box-shadow: inset 0 -2px 0 #d6a632 !important; }
  .mx-wallet-account-grid { display: block !important; }
  .mx-wallet-history-panel,
  .mx-wallet-unlocks-panel { padding: 16px 13px !important; border: 0 !important; }
  .mx-wallet-history-panel[hidden],
  .mx-wallet-unlocks-panel[hidden] { display: none !important; }
  .mx-wallet-activity-list,
  .mx-wallet-unlock-list { margin-top: 12px !important; gap: 7px !important; }
  .mx-wallet-activity-row { padding: 11px !important; gap: 8px !important; }
  .mx-wallet-activity-row strong { font-size: 10.5px !important; }
  .mx-wallet-activity-row small { font-size: 8px !important; }
  .mx-wallet-unlock-list a { min-height: 56px !important; padding: 9px 10px !important; }
  .mx-wallet-unlock-list strong { font-size: 10px !important; }
  .mx-wallet-activity-row.mx-mobile-wallet-hidden,
  .mx-wallet-unlock-list a.mx-mobile-wallet-hidden { display: none !important; }
  .mx-mobile-wallet-more {
    display: block !important;
    width: 100% !important;
    min-height: 42px !important;
    margin-top: 9px !important;
    border: 1px solid #303742 !important;
    border-radius: 8px !important;
    background: #11151b !important;
    color: #f3eee4 !important;
    font-weight: 750 !important;
  }

  .mx-mobile-catalog-filter-button[hidden],
  .mx-mobile-authors-toggle[hidden],
  .mx-mobile-synopsis-toggle[hidden],
  .mx-mobile-chapter-more[hidden],
  .mx-mobile-collection-tabs[hidden],
  .mx-mobile-password-toggle[hidden],
  .mx-mobile-wallet-tabs[hidden],
  .mx-mobile-wallet-more[hidden] { display: none !important; }

  /* Coin Store: keep packs scannable instead of one very long single-column form. */
  .mx-wallet-store-main { padding: 22px 11px 74px !important; }
  .mx-wallet-store-intro { gap: 12px !important; margin-bottom: 18px !important; }
  .mx-wallet-store-intro h1 { margin-bottom: 8px !important; font-size: 33px !important; }
  .mx-wallet-store-intro p { font-size: 11.5px !important; line-height: 1.55 !important; }
  .mx-wallet-account-link { min-height: 40px !important; font-size: 10px !important; }
  .mx-wallet-store-page .epw-cinema-titleblock { padding: 18px !important; }
  .mx-wallet-store-page .epw-cinema-titleblock h2 { font-size: 29px !important; }
  .mx-wallet-store-page .epw-cinema-balance { min-height: 112px !important; }
  .mx-wallet-store-page .epw-cinema-pack-grid { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .mx-wallet-store-page .epw-cinema-pack { min-height: 100px !important; padding: 12px !important; }
  .mx-wallet-store-page .epw-cinema-pack strong { font-size: 20px !important; }
}

/* Reader uses the existing 700px phone breakpoint. */
@media (max-width: 700px) {
  body.mugex-reader-body {
    --mx-reader-mobile-size: 19px;
    transition: background-color 160ms ease, color 160ms ease !important;
  }
  body.mugex-reader-body,
  body.mugex-reader-body .mugex-reader-main,
  body.mugex-reader-body .mugex-reader-content,
  body.mugex-reader-body .ccs-secure-reader,
  body.mugex-reader-body .ccs-basic-reader,
  body.mugex-reader-body .ccs-range-host,
  body.mugex-reader-body .ccs-reader-frame,
  body.mugex-reader-body .ccs-reader-content,
  body.mugex-reader-body .ccs-reader-chapter,
  body.mugex-reader-body .ccs-native-reader-chapter,
  body.mugex-reader-body .ccs-hybrid-reader-chapter {
    background-color: var(--mx-bg) !important;
    color: var(--mx-text) !important;
  }
  body.mugex-reader-body[data-theme="sepia"],
  body.mugex-reader-body[data-theme="sepia"] .mugex-reader-main,
  body.mugex-reader-body[data-theme="sepia"] .mugex-reader-content,
  body.mugex-reader-body[data-theme="sepia"] .ccs-secure-reader,
  body.mugex-reader-body[data-theme="sepia"] .ccs-reader-frame,
  body.mugex-reader-body[data-theme="sepia"] .ccs-reader-content,
  body.mugex-reader-body[data-theme="sepia"] .ccs-reader-chapter { background-color: #f1e8d7 !important; color: #2b241c !important; }
  body.mugex-reader-body[data-theme="light"],
  body.mugex-reader-body[data-theme="light"] .mugex-reader-main,
  body.mugex-reader-body[data-theme="light"] .mugex-reader-content,
  body.mugex-reader-body[data-theme="light"] .ccs-secure-reader,
  body.mugex-reader-body[data-theme="light"] .ccs-reader-frame,
  body.mugex-reader-body[data-theme="light"] .ccs-reader-content,
  body.mugex-reader-body[data-theme="light"] .ccs-reader-chapter { background-color: #f8f8f6 !important; color: #181a1f !important; }

  .mugex-reader-topbar {
    height: 54px !important;
    grid-template-columns: minmax(0,1fr) auto !important;
    gap: 8px !important;
    padding: 0 12px !important;
    transition: transform 200ms cubic-bezier(.2,.8,.2,1) !important;
  }
  body.mx-reader-bars-hidden .mugex-reader-topbar { transform: translateY(-100%) !important; }
  .mugex-reader-brand { display: none !important; }
  .mugex-reader-novel-link {
    justify-self: start !important;
    max-width: min(68vw, 300px) !important;
    padding: 0 !important;
    color: #c0c6cf !important;
    font-size: 10.5px !important;
    font-weight: 650 !important;
  }
  .mugex-reader-tools { gap: 5px !important; }
  .mugex-reader-tools > [data-mx-font],
  .mugex-reader-tools > [data-mx-theme],
  .mugex-reader-tools > .mx-reader-access-pill { display: none !important; }
  .mx-reader-sync-state {
    width: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
    padding: 0 !important;
    justify-content: center !important;
  }
  .mx-reader-sync-state [data-mx-reader-sync-label],
  .mx-reader-sync-state [data-mx-reader-sync-percent] { display: none !important; }
  .mx-mobile-reader-settings-toggle {
    display: inline-flex !important;
    min-width: 42px !important;
    height: 34px !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid #343a44 !important;
    border-radius: 8px !important;
    background: #12141a !important;
    color: #f3eee4 !important;
    font: 800 11px/1 var(--mx-font-ui) !important;
  }
  .mx-mobile-reader-settings-panel {
    display: block !important;
    position: fixed !important;
    z-index: 980 !important;
    top: 60px !important;
    right: 10px !important;
    width: min(300px, calc(100vw - 20px)) !important;
    padding: 14px !important;
    border: 1px solid #343a44 !important;
    border-radius: 13px !important;
    background: rgba(15,18,24,.98) !important;
    box-shadow: 0 22px 60px rgba(0,0,0,.5) !important;
    color: #f3eee4 !important;
    font-family: var(--mx-font-ui) !important;
    transform-origin: top right !important;
  }
  .mx-mobile-reader-settings-panel[hidden] { display: none !important; }
  .mx-mobile-reader-settings-panel strong { display: block !important; margin-bottom: 8px !important; font-size: 11px !important; }
  .mx-mobile-reader-size-row { display: grid !important; grid-template-columns: 44px 1fr 44px !important; gap: 7px !important; align-items: center !important; }
  .mx-mobile-reader-size-row button,
  .mx-mobile-reader-theme-row button {
    min-height: 40px !important;
    border: 1px solid #343a44 !important;
    border-radius: 8px !important;
    background: #171b22 !important;
    color: #f3eee4 !important;
    font-weight: 750 !important;
  }
  .mx-mobile-reader-size-value { text-align: center !important; color: #adb5c1 !important; font-size: 11px !important; }
  .mx-mobile-reader-theme-label { display: block !important; margin: 14px 0 8px !important; color: #8993a1 !important; font-size: 9px !important; font-weight: 750 !important; text-transform: uppercase !important; letter-spacing: .09em !important; }
  .mx-mobile-reader-theme-row { display: grid !important; grid-template-columns: repeat(3,1fr) !important; gap: 6px !important; }
  .mx-mobile-reader-theme-row button.is-active { border-color: #d6a632 !important; color: #e5bb53 !important; background: rgba(214,166,50,.1) !important; }

  .mugex-reader-main { padding: 28px 14px 62px !important; }
  .mugex-reader-title { margin-bottom: 22px !important; }
  .mugex-reader-title .eyebrow { font-size: 8px !important; letter-spacing: .18em !important; }
  .mugex-reader-title h1 { margin-top: 7px !important; font-size: 34px !important; line-height: 1 !important; }
  .mugex-reader-title .rule { margin-top: 13px !important; }
  .mx-reader-chapter-full-label { margin-top: 8px !important; font-size: 10px !important; }

  .mugex-reader-nav { margin-bottom: 26px !important; gap: 6px !important; }
  .mugex-reader-nav-button,
  .mugex-reader-chapters > button { min-height: 48px !important; padding: 7px 9px !important; }
  .mugex-reader-nav-button span,
  .mugex-reader-chapters > button span { font-size: 10px !important; }
  .mugex-reader-nav-button small,
  .mugex-reader-chapters > button small { font-size: 8px !important; }

  .mugex-reader-content {
    max-width: 100% !important;
    margin: 26px auto 48px !important;
    font-size: var(--mx-reader-mobile-size) !important;
    line-height: 1.72 !important;
  }
  .mugex-reader-content p { margin-bottom: 1.28em !important; }
  .ccs-reader-frame,
  .ccs-reader-content,
  .ccs-reader-chapter { font-size: inherit !important; line-height: inherit !important; }

  .mugex-reader-chapters-panel { border-radius: 14px 14px 0 0 !important; }
  .mx-reader-navigator-head { padding: 14px !important; }
  .mx-reader-navigator-search { padding: 12px 14px !important; }
  .mx-reader-navigator-search input { min-height: 44px !important; font-size: 16px !important; }
  .mx-reader-navigator-quick { gap: 6px !important; padding: 0 14px 12px !important; }

  .mugex-reader-end { padding-top: 24px !important; }
  .mugex-reader-end a { min-height: 48px !important; }

  .mx-reader-paywall { margin-top: 24px !important; }
}

@media (max-width: 390px) {
  .mx-home-hero-copy > .mx-home-eyebrow,
  .mx-home-hero-copy > h1,
  .mx-home-hero-copy > .mx-home-hero-meta { margin-right: 105px !important; }
  .mx-home-hero-cover-wrap { width: 92px !important; }
  .mx-home-hero h1 { font-size: 29px !important; }
  .mx-novel-hero-inner { grid-template-columns: 102px minmax(0,1fr) !important; }
  .mx-novel-cover-shell { width: 102px !important; min-width: 102px !important; }
  .mx-novel-actions .mx-btn { font-size: 9.5px !important; }
  .mx-wallet-account-hero { grid-template-columns: minmax(0,1fr) 96px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .mx-mobile-filters-sheet,
  .mugex-reader-topbar,
  .mx-mobile-reader-settings-panel { transition: none !important; }
}