/* ==========================================================================
   AppComic — pixel-aligned H5 shell (ref: xiuxiu/uni-app comic SPA)
   Viewport: phone-first 375; desktop centered max 480.
   Tokens: --primary/--ac-primary (default #4caf50, bound to admin theme)
   ========================================================================== */

:root {
    /* Fallback green; ThemeRenderer injects --primary / --ac-* from admin color_primary */
    --primary: #4caf50;
    --primary-dark: #388e3c;
    --ac-primary: var(--primary);
    --ac-primary-dark: var(--primary-dark, #388e3c);
    --ac-muted: #757575;
    --ac-text: #222222;
    --ac-text-2: #666666;
    --ac-text-3: #999999;
    --ac-line: #e8e8e8;
    --ac-line-soft: #f0f0f0;
    --ac-bg: #f5f5f5;
    --ac-card: #ffffff;
    --ac-danger: #f44336;
    --ac-warn: #ff9800;
    --ac-orange: #ff7830;
    --ac-tab-h: 50px;
    --ac-nav-h: 44px;
    --ac-safe-b: env(safe-area-inset-bottom, 0px);
    --ac-safe-t: env(safe-area-inset-top, 0px);
    --ac-radius: 8px;
    --ac-radius-lg: 12px;
    --ac-max: 480px;
    --ac-gap: 8px;
}

/* ---------- Global app frame ---------- */
html { background: #e8e8e8; }
body.ac-app {
    background: var(--ac-bg) !important;
    color: var(--ac-text);
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue",
        "Microsoft YaHei", sans-serif;
    -webkit-font-smoothing: antialiased;
    max-width: var(--ac-max);
    margin: 0 auto !important;
    min-height: 100dvh;
    box-shadow: 0 0 0 1px rgba(0,0,0,0.06), 0 8px 32px rgba(0,0,0,0.08);
    position: relative;
}
body.ac-app *,
body.ac-app *::before,
body.ac-app *::after { box-sizing: border-box; }

/* Hide desktop chrome everywhere in this theme (mobile SPA) */
body.ac-app .topbar,
body.ac-app .header,
body.ac-app .header-mid,
body.ac-app .header-nav,
body.ac-app .header-vtype-seg,
body.ac-app .scroll-sidebar,
body.ac-app .mobile-nav,
body.ac-app .footer.footer--stream,
body.ac-app .udd,
body.ac-app .header__scroll-burger {
    display: none !important;
}

body.ac-app main.container,
body.ac-app main.ac-main {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 0 calc(var(--ac-tab-h) + var(--ac-safe-b) + 4px) !important;
    background: var(--ac-bg);
    min-height: calc(100dvh - var(--ac-tab-h) - var(--ac-safe-b));
}
body.ac-app.ac-hide-tabbar main.ac-main {
    padding-bottom: var(--ac-safe-b) !important;
}

/* Reader full bleed */
body.ac-app.manga-reader-page main.ac-main {
    padding: 0 !important;
    min-height: 100dvh;
    background: #111;
}

/* ---------- Bottom tab bar (dynamic: video subtypes + manga + 历史 + 帐号) ---------- */
.ac-tabbar {
    display: flex;
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    z-index: 900;
    width: 100%;
    max-width: var(--ac-max);
    height: calc(var(--ac-tab-h) + var(--ac-safe-b));
    padding: 0 0 var(--ac-safe-b);
    background: #fff;
    border-top: 1px solid #fff;
    box-shadow: 0 -1px 0 #e0e0e0;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.ac-tabbar::-webkit-scrollbar { display: none; }
body.ac-hide-tabbar .ac-tabbar { display: none !important; }
.ac-tabbar__item {
    flex: 1 1 0;
    min-width: 56px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    text-decoration: none;
    color: #757575;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.2;
    -webkit-tap-highlight-color: transparent;
    padding-top: 4px;
}
.ac-tabbar__ico {
    width: 24px;
    height: 24px;
    background-size: 24px 24px;
    background-repeat: no-repeat;
    background-position: center;
    display: block;
}
.ac-tabbar__item.is-active { color: var(--ac-primary); }

/* Tab icons set by inline style / classes from layout */
.ac-tabbar__item span.label {
    display: block;
    transform: scale(0.95);
    white-space: nowrap;
}

/* ---------- Sticky nav bar (secondary pages) ---------- */
.ac-nav {
    position: sticky;
    top: 0;
    z-index: 80;
    display: flex;
    align-items: center;
    min-height: var(--ac-nav-h);
    padding: 0 4px;
    background: #fff;
    border-bottom: 1px solid var(--ac-line-soft);
    /* for absolute .ac-nav__right */
}
.ac-nav__back {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ac-text);
    text-decoration: none;
    font-size: 18px;
    flex-shrink: 0;
    border: 0;
    background: none;
    cursor: pointer;
}
.ac-nav__title {
    flex: 1;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: var(--ac-text);
    margin-right: 40px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* When no back button, keep title truly centered */
.ac-nav:not(:has(.ac-nav__back)) .ac-nav__title {
    margin-right: 0;
}
.ac-nav--solo .ac-nav__title {
    margin-right: 0;
}
.ac-nav__right {
    position: absolute;
    right: 8px;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    gap: 4px;
}
.ac-nav__btn {
    height: 32px;
    padding: 0 10px;
    border: 0;
    background: none;
    color: var(--ac-primary);
    font-size: 14px;
    cursor: pointer;
}

/* Home top brand bar */
.ac-homebar {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: var(--ac-nav-h);
    padding: 0 12px;
    background: #fff;
    border-bottom: 1px solid var(--ac-line-soft);
    position: sticky;
    top: 0;
    z-index: 80;
}
.ac-homebar__brand {
    font-size: 17px;
    font-weight: 700;
    color: var(--ac-text);
    text-decoration: none;
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ac-homebar__search {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ac-text);
    text-decoration: none;
    font-size: 18px;
    border-radius: 50%;
}

/* ---------- Home shortcuts: single row, compact icons (up to 5) ---------- */
.ac-home-shortcuts {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 2px;
    padding: 12px 6px 10px;
    background: #fff;
    margin-bottom: 8px;
    overflow: hidden;
}
.ac-home-shortcut {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    text-decoration: none;
    color: var(--ac-text);
    font-size: 11px;
    line-height: 1.2;
    text-align: center;
    -webkit-tap-highlight-color: transparent;
}
.ac-home-shortcut > span:last-child {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.ac-home-shortcut__icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    color: #fff;
    background: linear-gradient(145deg, var(--ac-primary), var(--ac-primary-dark));
    box-shadow: 0 2px 6px rgba(76, 175, 80, 0.22);
}
.ac-home-shortcut:nth-child(1) .ac-home-shortcut__icon {
    background: linear-gradient(145deg, var(--ac-primary), var(--ac-primary-dark));
    box-shadow: 0 2px 6px rgba(76, 175, 80, 0.22);
}
.ac-home-shortcut:nth-child(2) .ac-home-shortcut__icon {
    background: linear-gradient(145deg, var(--ac-primary), var(--ac-primary-dark));
    box-shadow: 0 2px 6px rgba(76, 175, 80, 0.22);
}
.ac-home-shortcut:nth-child(3) .ac-home-shortcut__icon {
    background: linear-gradient(145deg, var(--ac-primary), var(--ac-primary-dark));
    box-shadow: 0 2px 6px rgba(76, 175, 80, 0.2);
}
.ac-home-shortcut:nth-child(4) .ac-home-shortcut__icon {
    background: linear-gradient(145deg, #ffb74d, #ff9800);
    box-shadow: 0 2px 6px rgba(255, 152, 0, 0.22);
}
.ac-home-shortcut:nth-child(5) .ac-home-shortcut__icon {
    background: linear-gradient(145deg, var(--ac-primary), var(--ac-primary-dark));
    box-shadow: 0 2px 6px rgba(76, 175, 80, 0.22);
}

/* ---------- Section ---------- */
.ac-section {
    background: #fff;
    margin-bottom: 8px;
    padding: 10px 12px 12px;
}
.ac-section__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    min-height: 28px;
}
.ac-section__title {
    font-size: 16px;
    font-weight: 700;
    color: var(--ac-text);
    margin: 0;
}
.ac-section__more {
    font-size: 12px;
    color: var(--ac-text-3);
    text-decoration: none;
}

/* ---------- Comic grid 2-col (ref list density) ---------- */
/* Force 2-column content grids (video + gallery) inside app frame */
body.ac-app .gallery-grid,
body.ac-app .content-grid--gallery,
body.ac-app .video-grid.gallery-grid,
body.ac-app .video-grid,
body.ac-app .content-grid,
body.ac-app .ac-comic-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px 8px !important;
    padding: 0 10px 12px !important;
    margin: 0 !important;
}
body.ac-app {
    --grid-cols: 2 !important;
}
body.ac-app.cols-2,
body.ac-app.cols-3,
body.ac-app.cols-4,
body.ac-app.cols-5,
body.ac-app.cols-6 {
    --grid-cols: 2 !important;
}

body.ac-app .video-card--gallery,
body.ac-app .comic-card {
    margin: 0 !important;
    border-radius: 6px;
    overflow: hidden;
    background: transparent;
    box-shadow: none;
}
body.ac-app .comic-card__thumb,
body.ac-app .video-card__thumb--portrait {
    aspect-ratio: 3 / 4.2;
    border-radius: 6px;
    overflow: hidden;
    background: #eaeaea;
}
body.ac-app .comic-card__thumb img,
body.ac-app .video-card__thumb--portrait img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
body.ac-app .comic-card__title,
body.ac-app .video-card__title {
    font-size: 13px !important;
    line-height: 1.35 !important;
    max-height: 2.7em;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 6px 0 2px !important;
    color: var(--ac-text) !important;
    font-weight: 500;
}
body.ac-app .comic-card__info,
body.ac-app .video-card__info {
    padding: 0 2px !important;
}
body.ac-app .comic-card__meta,
body.ac-app .video-card__meta,
body.ac-app .card-tax {
    font-size: 11px !important;
    color: var(--ac-text-3) !important;
}
body.ac-app .comic-card__badge,
body.ac-app .manga-detail__badge {
    font-size: 10px;
    padding: 1px 5px;
    border-radius: 2px;
}
body.ac-app .comic-card__badge--serial {
    background: rgba(76, 175, 80, 0.9);
    color: #fff;
}
body.ac-app .comic-card__chapters,
body.ac-app .video-card__duration {
    font-size: 10px !important;
    padding: 2px 5px !important;
    border-radius: 2px !important;
    background: rgba(0,0,0,0.55) !important;
}

/* sort tabs as pill row */
body.ac-app .sort-tabs,
body.ac-app .listing-tabs {
    display: flex;
    gap: 8px;
    padding: 0 12px 10px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    background: #fff;
}
body.ac-app .sort-tabs::-webkit-scrollbar { display: none; }
body.ac-app .sort-tabs a,
body.ac-app .listing-tabs a,
body.ac-app .sort-tab {
    flex: 0 0 auto;
    padding: 4px 12px;
    font-size: 13px;
    color: var(--ac-text-2);
    text-decoration: none;
    border-radius: 14px;
    background: #f5f5f5;
}
body.ac-app .sort-tabs a.active,
body.ac-app .sort-tabs a.is-active,
body.ac-app .sort-tab.is-active,
body.ac-app .sort-tab.active {
    background: rgba(76, 175, 80, 0.12);
    color: var(--ac-primary);
    font-weight: 600;
}

body.ac-app .section-title-row {
    padding: 10px 12px 6px;
    background: #fff;
    margin: 0;
}
body.ac-app .section-title {
    font-size: 16px;
    font-weight: 700;
}

/* pagination compact */
body.ac-app .pagination {
    display: flex;
    justify-content: center;
    gap: 12px;
    padding: 12px;
    font-size: 13px;
}

/* ---------- Category (二级筛选) ---------- */
.ac-cate {
    background: #fff;
    min-height: 40vh;
}
.ac-cate__filters {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 12px;
    background: #fff;
    border-bottom: 1px solid var(--ac-line-soft);
}
.ac-cate__row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.ac-cate__chip {
    display: inline-flex;
    align-items: center;
    height: 28px;
    padding: 0 12px;
    border-radius: 14px;
    font-size: 13px;
    color: var(--ac-text-2);
    background: #f5f5f5;
    text-decoration: none;
    border: 0;
}
.ac-cate__chip.is-active {
    background: var(--ac-primary);
    color: #fff;
}
.ac-cate__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px;
    background: #fff;
}
.ac-cate__cat {
    display: inline-flex;
    height: 30px;
    padding: 0 12px;
    border-radius: 4px;
    background: #f7f7f7;
    color: var(--ac-text);
    font-size: 13px;
    text-decoration: none;
    align-items: center;
}
.ac-cate__cat.is-active {
    background: rgba(76,175,80,0.12);
    color: var(--ac-primary);
    font-weight: 600;
}
.ac-cate__body {
    padding: 8px 0 0;
    background: var(--ac-bg);
}

/* ---------- Shelf 我的漫画 ---------- */
.ac-shelf__tabs {
    display: flex;
    background: #fff;
    border-bottom: 1px solid var(--ac-line-soft);
}
.ac-shelf__tab {
    flex: 1;
    text-align: center;
    height: 44px;
    line-height: 44px;
    font-size: 15px;
    color: var(--ac-text-2);
    text-decoration: none;
    position: relative;
}
.ac-shelf__tab.is-active {
    color: var(--ac-primary);
    font-weight: 600;
}
.ac-shelf__tab.is-active::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 28px;
    height: 3px;
    border-radius: 2px;
    background: var(--ac-primary);
}
.ac-shelf__toolbar {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 8px 12px;
    background: #fff;
    font-size: 13px;
    color: var(--ac-text-2);
}
.ac-empty {
    text-align: center;
    padding: 48px 20px;
    color: var(--ac-text-3);
    font-size: 14px;
    background: #fff;
}
.ac-empty__icon {
    font-size: 40px;
    opacity: 0.35;
    margin-bottom: 12px;
}

/* ---------- Account 帐号 ---------- */
.ac-account {
    background: var(--ac-bg);
    min-height: 60vh;
    padding-bottom: 16px;
}
.ac-account__head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 22px 16px 28px;
    background: linear-gradient(160deg, var(--ac-primary) 0%, var(--ac-primary) 55%, var(--ac-primary-dark) 100%);
    color: #fff;
}
.ac-account__avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: rgba(255,255,255,0.25);
    border: 2px solid rgba(255,255,255,0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: 700;
    overflow: hidden;
    flex-shrink: 0;
}
.ac-account__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.ac-account__name {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
}
.ac-account__sub {
    font-size: 12px;
    opacity: 0.9;
    margin-top: 4px;
}
.ac-account__assets {
    display: flex;
    margin: -16px 12px 10px;
    background: #fff;
    border-radius: var(--ac-radius-lg);
    box-shadow: 0 2px 10px rgba(0,0,0,0.06);
    overflow: hidden;
}
.ac-account__asset {
    flex: 1;
    text-align: center;
    padding: 14px 6px;
    border-right: 1px solid var(--ac-line-soft);
    text-decoration: none;
    color: inherit;
}
.ac-account__asset:last-child { border-right: 0; }
.ac-account__asset-val {
    display: block;
    font-size: 18px;
    font-weight: 700;
    color: var(--ac-text);
    line-height: 1.2;
}
.ac-account__asset-lbl {
    display: block;
    font-size: 11px;
    color: var(--ac-muted);
    margin-top: 3px;
}
.ac-account__sign {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 12px 10px;
    padding: 12px 14px;
    background: #fff;
    border-radius: var(--ac-radius-lg);
}
.ac-account__sign-btn {
    border: 0;
    border-radius: 16px;
    height: 32px;
    padding: 0 16px;
    background: var(--ac-primary);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}
.ac-account__sign-btn:disabled {
    opacity: 0.5;
    cursor: default;
}
.ac-account__menu {
    margin: 0 12px 12px;
    background: #fff;
    border-radius: var(--ac-radius-lg);
    overflow: hidden;
}
.ac-account__row {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 50px;
    padding: 0 14px;
    border-bottom: 1px solid var(--ac-line-soft);
    text-decoration: none;
    color: var(--ac-text);
    font-size: 15px;
}
.ac-account__row:last-child { border-bottom: 0; }
.ac-account__row i.ac-ico {
    width: 22px;
    text-align: center;
    color: var(--ac-primary);
    font-size: 16px;
}
.ac-account__row-label { flex: 1; }
.ac-account__badge {
    font-size: 12px;
    color: #999;
    margin-right: 2px;
}
.ac-account__row .fa-chevron-right {
    color: #ccc;
    font-size: 12px;
}
.ac-account__row--danger {
    display: flex;
    justify-content: center;
    color: var(--ac-danger);
    margin: 10px 12px 0;
    background: #fff;
    border-radius: var(--ac-radius-lg);
    border-bottom: 0 !important;
}
.ac-account__edit {
    padding: 12px;
    margin: 12px;
    background: #fff;
    border-radius: var(--ac-radius-lg);
}
.ac-nav--embedded {
    position: relative;
    margin: -12px -12px 12px;
    border: 0;
    border-radius: var(--ac-radius-lg) var(--ac-radius-lg) 0 0;
}
.ac-nav--embedded .ac-nav__title {
    margin-right: 0;
}
.ac-account__save {
    width: 100%;
    margin-top: 16px;
}
.ac-account__body {
    padding: 0;
}

/* guest account */
.ac-account__guest {
    padding: 40px 20px;
    text-align: center;
    background: #fff;
}
.ac-account__guest-title {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 8px;
}
.ac-account__guest-sub {
    font-size: 13px;
    color: var(--ac-text-3);
    margin-bottom: 20px;
}
.ac-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    padding: 0 24px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    border: 0;
    cursor: pointer;
}
.ac-btn--primary {
    background: var(--ac-primary);
    color: #fff;
}
.ac-btn--outline {
    background: #fff;
    color: var(--ac-primary);
    border: 1px solid var(--ac-primary);
}
.ac-account__guest-actions {
    display: flex;
    gap: 12px;
    justify-content: center;
}

/* ---------- 加入代理 ---------- */
.ac-join-agent {
    padding: 12px 12px 24px;
}
.ac-join-agent__lead {
    margin: 0 0 12px;
    font-size: 13px;
    line-height: 1.55;
    color: var(--ac-text-2, #666);
}
.ac-join-agent__flash {
    margin: 0 0 12px;
    padding: 10px 12px;
    border-radius: 10px;
    font-size: 13px;
    line-height: 1.4;
}
.ac-join-agent__flash--ok {
    background: #ecfdf5;
    color: #047857;
}
.ac-join-agent__flash--err {
    background: #fef2f2;
    color: #b91c1c;
}
.ac-join-agent__card {
    background: #fff;
    border-radius: var(--ac-radius-lg, 12px);
    overflow: hidden;
    margin-bottom: 14px;
}
.ac-join-agent__card-title {
    padding: 12px 14px 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ac-text-2, #888);
}
.ac-join-agent__list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.ac-join-agent__row {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 56px;
    padding: 10px 14px;
    border-top: 1px solid var(--ac-line-soft, #f0f0f0);
}
.ac-join-agent__meta {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.ac-join-agent__label {
    font-size: 12px;
    color: var(--ac-muted, #999);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.ac-join-agent__label i {
    color: var(--ac-primary);
    width: 16px;
    text-align: center;
}
.ac-join-agent__value {
    font-size: 15px;
    font-weight: 600;
    color: var(--ac-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.ac-join-agent__copy {
    flex-shrink: 0;
    height: 32px;
    padding: 0 14px;
    border: 1px solid var(--ac-primary);
    background: #fff;
    color: var(--ac-primary);
    border-radius: 16px;
    font-size: 13px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
}
.ac-join-agent__copy.is-copied {
    background: var(--ac-primary);
    color: #fff;
}
.ac-join-agent__empty {
    margin: 0 0 14px;
    padding: 16px 14px;
    background: #fff;
    border-radius: var(--ac-radius-lg, 12px);
    font-size: 13px;
    color: var(--ac-text-2, #888);
}
.ac-join-agent__msg-btn {
    width: 100%;
    height: 44px;
    border-radius: 22px;
}
.ac-join-agent__sheet {
    position: fixed;
    inset: 0;
    z-index: 1200;
}
.ac-join-agent__sheet-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
}
.ac-join-agent__sheet-panel {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: 88vh;
    overflow: auto;
    background: #fff;
    border-radius: 16px 16px 0 0;
    padding: 0 16px calc(16px + var(--ac-safe-b, 0px));
}
.ac-join-agent__sheet-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 0 8px;
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 1;
}
.ac-join-agent__sheet-head h2 {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
}
.ac-join-agent__sheet-close {
    width: 32px;
    height: 32px;
    border: 0;
    background: #f3f4f6;
    border-radius: 50%;
    font-size: 20px;
    line-height: 1;
    color: #666;
    cursor: pointer;
}
.ac-join-agent__form {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-bottom: 8px;
}
.ac-join-agent__field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 13px;
    color: var(--ac-text-2, #555);
}
.ac-join-agent__field em {
    color: #e11d48;
    font-style: normal;
}
.ac-join-agent__field input,
.ac-join-agent__field textarea {
    border: 1px solid var(--ac-line-soft, #e5e7eb);
    border-radius: 10px;
    padding: 10px 12px;
    font-size: 14px;
    font-family: inherit;
    color: var(--ac-text);
    background: #fafafa;
    resize: vertical;
}
.ac-join-agent__field input:focus,
.ac-join-agent__field textarea:focus {
    outline: none;
    border-color: var(--ac-primary);
    background: #fff;
}
.ac-join-agent__submit {
    width: 100%;
    height: 44px;
    border-radius: 22px;
    margin-top: 4px;
}
[data-theme="dark"] .ac-join-agent__card,
[data-theme="dark"] .ac-join-agent__empty,
[data-theme="dark"] .ac-join-agent__sheet-panel {
    background: var(--ac-surface, #1a1a1a);
}
[data-theme="dark"] .ac-join-agent__copy {
    background: transparent;
}
[data-theme="dark"] .ac-join-agent__field input,
[data-theme="dark"] .ac-join-agent__field textarea {
    background: rgba(255,255,255,0.04);
    border-color: rgba(255,255,255,0.1);
    color: #eee;
}
[data-theme="dark"] .ac-join-agent__sheet-close {
    background: rgba(255,255,255,0.08);
    color: #ccc;
}

/* ---------- Detail 漫画详情 ---------- */
body.ac-app .manga-detail {
    background: #fff;
    /* room for fixed CTA (~58px) + safe area */
    padding-bottom: calc(72px + var(--ac-safe-b));
}
/* Detail/search have no tabbar — avoid CTA floating above ghost 50px gap */
body.ac-hide-tabbar .manga-detail {
    padding-bottom: calc(72px + var(--ac-safe-b));
}
body.ac-app .manga-detail__hero {
    display: flex;
    gap: 12px;
    padding: 12px;
    background: #fff;
    align-items: flex-start;
}
body.ac-app .manga-detail__cover {
    width: 110px;
    flex-shrink: 0;
    position: relative;
}
body.ac-app .manga-detail__cover img {
    width: 110px;
    height: 150px;
    object-fit: cover;
    border-radius: 4px;
    display: block;
}
body.ac-app .manga-detail__cover-placeholder {
    width: 110px;
    height: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f0f0f0;
    border-radius: 4px;
    color: #bbb;
}
body.ac-app .manga-detail__cover-stats {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    gap: 8px;
    justify-content: center;
    padding: 4px 2px;
    font-size: 10px;
    color: #fff;
    background: linear-gradient(transparent, rgba(0,0,0,.55));
    border-radius: 0 0 4px 4px;
}
body.ac-app .manga-detail__cover-badges {
    position: absolute;
    top: 4px;
    left: 4px;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
body.ac-app .manga-detail__title {
    font-size: 18px;
    font-weight: 700;
    color: #222;
    line-height: 1.35;
    margin: 0 0 8px;
}
body.ac-app .manga-detail__fields {
    font-size: 12px;
    color: #979797;
    list-style: none;
    padding: 0;
    margin: 0;
}
body.ac-app .manga-detail__fields li {
    margin-bottom: 4px;
    display: flex;
    align-items: flex-start;
    gap: 6px;
}
body.ac-app .manga-detail__fields a { color: #298ae8; text-decoration: none; }

body.ac-app .manga-detail__icon-bar {
    display: flex;
    justify-content: space-around;
    padding: 12px 8px;
    border-top: 1px solid #f4f4f4;
    border-bottom: 1px solid #f4f4f4;
    /* override simply grid 4-col */
    grid-template-columns: none !important;
}
body.ac-app .manga-detail__icon-action {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    color: #7c7c7c;
    background: none;
    border: 0;
    cursor: pointer;
    text-decoration: none;
    flex: 1;
    min-width: 0;
}
body.ac-app .manga-detail__icon-action + .manga-detail__icon-action {
    border-left: 0; /* kill simply card dividers that break 3-col flex */
}
body.ac-app .manga-detail__icon-action.active { color: var(--ac-danger); }
body.ac-app .manga-detail__icon-circle {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #f4f4f4;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
}

/* 立即阅读 sticky bottom */
body.ac-app .manga-detail__cta-row {
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    bottom: calc(var(--ac-tab-h) + var(--ac-safe-b));
    z-index: 70;
    width: 100%;
    max-width: var(--ac-max);
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 8px 12px;
    background: #fff;
    border-top: 1px solid #eee;
    box-shadow: 0 -2px 10px rgba(0,0,0,0.04);
    /* undo simply absolute flow leftovers */
    flex-wrap: nowrap !important;
}
body.ac-hide-tabbar .manga-detail__cta-row {
    bottom: var(--ac-safe-b);
}
body.ac-app .manga-detail__read-btn,
body.ac-app .manga-detail__cta-row .btn--primary {
    flex: 1;
    min-height: 42px;
    min-width: 0 !important;
    margin-left: 0 !important;
    border-radius: 21px !important;
    background: var(--ac-primary) !important;
    border-color: var(--ac-primary) !important;
    color: #fff !important;
    font-size: 15px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
body.ac-app .manga-detail__fav-btn {
    flex: 0 0 auto;
    min-width: 100px;
    min-height: 42px;
    border-radius: 21px;
    border: 1px solid var(--ac-primary);
    background: #fff;
    color: var(--ac-primary);
    font-size: 13px;
    font-weight: 600;
    padding: 0 12px;
    cursor: pointer;
}
body.ac-app .manga-detail__fav-btn.is-on {
    background: #e8f5e9;
}
body.ac-app .manga-detail__rating {
    display: none; /* hide score on mobile sticky, free room for CTAs */
}

body.ac-app .manga-detail__catalog {
    margin: 0;
    padding: 0 0 8px;
}
body.ac-app .manga-detail__catalog-head {
    padding: 12px 12px 4px;
    background: #fff;
}
body.ac-app .manga-detail__catalog-head .section-title {
    font-size: 15px;
    font-weight: 600;
    margin: 0;
}
body.ac-app .manga-detail__catalog-count {
    font-weight: 400;
    font-size: 13px;
    color: #999;
    margin-left: 4px;
}
body.ac-app .manga-detail__chapters {
    padding: 12px;
}
body.ac-app .manga-detail__chapter-list,
body.ac-app .gallery-chapters {
    list-style: none;
    padding: 0;
    margin: 0;
}
body.ac-app .gallery-chapters a,
body.ac-app .manga-detail__chapter-item {
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: 0 12px;
    border-bottom: 1px solid #f4f4f4;
    color: #333;
    text-decoration: none;
    font-size: 14px;
    gap: 8px;
}
body.ac-app .manga-detail__chapter-badge {
    flex-shrink: 0;
    color: #666;
    font-size: 13px;
}
body.ac-app .manga-detail__chapter-title {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
body.ac-app .manga-detail__chapter-pages {
    flex-shrink: 0;
    font-size: 12px;
    color: #bbb;
}
body.ac-app .manga-detail__synopsis {
    padding: 12px;
    font-size: 13px;
    color: #666;
    line-height: 1.6;
}
body.ac-app .manga-detail__synopsis-title {
    font-size: 15px;
    font-weight: 600;
    color: #222;
    margin: 0 0 8px;
}
body.ac-app .manga-detail__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0 12px 12px;
}
body.ac-app .manga-detail__tag {
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 12px;
    background: #f5f5f5;
    color: #666;
    text-decoration: none;
}

/* L2 listing minor */
body.ac-app .ac-listing-count {
    display: block;
    padding: 6px 12px 0;
    font-size: 12px;
    color: #999;
    background: #fff;
}
body.ac-app .performer-profile {
    background: #fff;
    padding: 12px;
}
body.ac-app .performer-profile__photo {
    width: 72px !important;
    height: 72px !important;
    border-radius: 50%;
    object-fit: cover;
}
body.ac-app .comments-section {
    padding: 12px;
    background: #fff;
    margin-top: 8px;
}
body.ac-app .comments-section .section-title {
    font-size: 15px;
    margin: 0 0 12px;
}
body.ac-app .comment-form__textarea,
body.ac-app .comment-form__input {
    width: 100%;
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    padding: 10px;
    font-size: 14px;
    margin-bottom: 8px;
}
body.ac-app .home-section {
    padding: 12px 0 0;
    background: #fff;
    margin-top: 8px;
}
body.ac-app .home-section > .section-title {
    padding: 0 12px 8px;
    font-size: 15px;
    margin: 0;
}

/* ---------- Reader ---------- */
body.ac-app .manga-read__header {
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: var(--ac-max);
    z-index: 100;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 8px;
    background: rgba(0,0,0,0.75);
    color: #fff;
}
body.ac-app .manga-read__back {
    color: #fff;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    max-width: 70%;
}
body.ac-app .manga-read__back-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
body.ac-app .manga-read__action {
    color: #fff;
    background: none;
    border: 0;
    font-size: 18px;
    width: 40px;
    height: 40px;
}
body.ac-app .manga-read__pages {
    padding-top: 44px;
    padding-bottom: 52px;
    background: #111;
}
body.ac-app .manga-read__bar {
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    width: 100%;
    max-width: var(--ac-max);
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: space-around;
    background: rgba(0,0,0,0.82);
    color: #fff;
    padding-bottom: var(--ac-safe-b);
    height: calc(50px + var(--ac-safe-b));
    min-height: calc(50px + var(--ac-safe-b));
}
body.ac-app .manga-read__bar a,
body.ac-app .manga-read__bar button,
body.ac-app .manga-read__bar span {
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    background: none;
    border: 0;
    padding: 8px 12px;
    cursor: pointer;
}
body.ac-app .manga-read__bar .is-disabled,
body.ac-app .manga-read__bar a.is-disabled {
    color: #7c7c7c;
    pointer-events: none;
    cursor: default;
}

/* ---------- Search ---------- */
.ac-search {
    background: #fff;
    min-height: 50vh;
}
.ac-search__bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: #fff;
    border-bottom: 1px solid var(--ac-line-soft);
}
.ac-search__form {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    height: 36px;
    padding: 0 12px;
    background: #f5f5f5;
    border-radius: 18px;
}
.ac-search__form input {
    flex: 1;
    border: 0;
    background: transparent;
    outline: none;
    font-size: 14px;
    height: 100%;
    min-width: 0;
}
.ac-search__cancel {
    font-size: 14px;
    color: var(--ac-text-2);
    text-decoration: none;
    white-space: nowrap;
}
.ac-search__block {
    padding: 12px 14px;
}
.ac-search__block-title {
    font-size: 14px;
    font-weight: 600;
    margin: 0 0 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.ac-search__block-title button {
    border: 0;
    background: none;
    color: var(--ac-text-3);
    font-size: 12px;
    cursor: pointer;
}
.ac-search__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.ac-search__tag {
    height: 30px;
    padding: 0 12px;
    border-radius: 15px;
    background: #f5f5f5;
    color: #666;
    font-size: 13px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    border: 0;
    cursor: pointer;
}
.ac-search__count {
    padding: 8px 12px;
    font-size: 12px;
    color: var(--ac-text-3);
    background: var(--ac-bg);
}

/* ---------- Auth ---------- */
.ac-auth-page {
    background: #fff;
    min-height: 70vh;
    padding: 0 0 24px;
}
.ac-auth-page .auth-card {
    border: 0;
    box-shadow: none;
    max-width: none;
    padding: 20px 20px 0;
}
.ac-auth-page .auth-card__title { display: none; }
.ac-auth-page .form-group label {
    font-size: 13px;
    color: #666;
}
.ac-auth-page input[type="text"],
.ac-auth-page input[type="password"],
.ac-auth-page input[type="email"] {
    height: 44px;
    border: 0;
    border-bottom: 1px solid #e0e0e0;
    border-radius: 0;
    background: transparent;
    font-size: 15px;
    width: 100%;
    outline: none;
}
.ac-auth-page .btn-primary,
.ac-auth-page .btn.btn-primary {
    width: 100%;
    height: 44px;
    border-radius: 22px;
    background: var(--ac-primary) !important;
    border: 0 !important;
    font-size: 16px;
    margin-top: 20px;
}
.ac-auth-page .auth-footer {
    text-align: center;
    margin-top: 16px;
    font-size: 13px;
    color: #999;
}
.ac-auth-page .auth-footer a { color: var(--ac-primary); }
.ac-auth-page .auth-tabs {
    display: flex;
    gap: 4px;
    margin-bottom: 16px;
    background: #f0f0f0;
    border-radius: 10px;
    padding: 3px;
}
.ac-auth-page .auth-tabs__btn {
    flex: 1;
    border: 0;
    background: transparent;
    min-height: 36px;
    border-radius: 8px;
    font-size: 13px;
    color: #666;
    cursor: pointer;
    font-family: inherit;
}
.ac-auth-page .auth-tabs__btn.active {
    background: #fff;
    color: var(--ac-primary);
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(0,0,0,.08);
}
.ac-auth-page .auth-panel { display: none; }
.ac-auth-page .auth-panel.active { display: block; }
.ac-auth-page__hint {
    font-size: 13px;
    color: #888;
    margin: 0 0 14px;
    line-height: 1.5;
}

/* ---------- Monetization pages ---------- */
body.ac-app .profile-mo-balance-card,
body.ac-app .profile-form__section {
    background: #fff;
    margin: 0 0 8px;
    border-radius: 0;
    box-shadow: none;
    padding: 14px 12px;
}
body.ac-app .profile-mo-balance__value {
    font-size: 32px;
    font-weight: 700;
    color: var(--ac-primary);
}
body.ac-app .profile-mo-package,
body.ac-app .profile-mo-plan {
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 12px;
    margin-bottom: 8px;
}
body.ac-app .profile-mo-package.is-selected,
body.ac-app .profile-mo-plan:hover {
    border-color: var(--ac-primary);
    background: #f1f8f2;
}
body.ac-app .btn-primary,
body.ac-app .profile-form__submit {
    background: var(--ac-primary) !important;
    border-color: var(--ac-primary) !important;
    border-radius: 22px !important;
}

/* pay checkout */
body.ac-app .pay-checkout,
body.ac-app .checkout-page {
    padding: 12px;
    background: #fff;
}

/* old topbar class alias */
.ac-topbar {
    position: sticky;
    top: 0;
    z-index: 80;
    display: flex;
    align-items: center;
    min-height: var(--ac-nav-h);
    padding: 0 4px;
    background: #fff;
    border-bottom: 1px solid var(--ac-line-soft);
}
.ac-topbar__back {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ac-text);
    text-decoration: none;
    font-size: 18px;
}
.ac-topbar__title {
    flex: 1;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    margin-right: 40px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* hide desktop search icon class leftover */
.ac-header-search { display: none; }

/* empty states */
body.ac-app .empty-state {
    padding: 40px 16px !important;
    background: #fff;
}
body.ac-app .empty-state__text {
    font-size: 14px;
    color: #999;
}

/* discover rail under categories */
body.ac-app .listing-discover {
    background: #fff;
    margin-top: 8px;
    padding-bottom: 12px;
}
body.ac-app .listing-chip-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px !important;
    background: #fff;
}
body.ac-app .listing-chip,
body.ac-app .category-chip {
    height: 30px;
    padding: 0 12px;
    border-radius: 4px;
    background: #f7f7f7;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    color: var(--ac-text);
}

/* history page same as shelf */
body.ac-app .user-page__header {
    display: none;
}

/* Sticky ads / chrome that fight the tabbar */
body.ac-app .ads-mobile-sticky,
body.ac-app .ad-mobile-sticky,
body.ac-app [data-ad-zone="mobile_sticky"],
body.ac-app .mobile-sticky-ad {
    bottom: calc(var(--ac-tab-h) + var(--ac-safe-b)) !important;
    max-width: var(--ac-max);
    left: 50% !important;
    transform: translateX(-50%);
}
body.ac-hide-tabbar .ads-mobile-sticky,
body.ac-hide-tabbar .ad-mobile-sticky {
    bottom: var(--ac-safe-b) !important;
}

/* Auth modal above tab bar (style.css uses z-index 2000; keep full-viewport backdrop) */
body.ac-app .auth-modal {
    z-index: 2000 !important;
}

/* Pay checkout App shell */
body.ac-app .pay-checkout {
    min-height: 50vh;
    background: #fff;
    padding: 0 0 24px;
}
body.ac-app .pay-checkout__card {
    border: 0;
    box-shadow: none;
    border-radius: 0;
    padding: 16px;
}
body.ac-app .pay-checkout__amount {
    font-size: 32px;
    color: var(--ac-primary);
    text-align: center;
    margin: 12px 0;
}

/* Video cards (non-gallery) tighter in app */
body.ac-app .video-card:not(.video-card--gallery) .video-card__thumb {
    border-radius: 6px;
    overflow: hidden;
    aspect-ratio: 16 / 10;
}
body.ac-app .video-card:not(.video-card--gallery) .video-card__title {
    font-size: 13px !important;
    -webkit-line-clamp: 2;
}

/* soft print color for dark mode off on app */
[data-theme="dark"] body.ac-app {
    --ac-bg: #121212;
    --ac-card: #1e1e1e;
    --ac-text: #eee;
}
[data-theme="dark"] body.ac-app .ac-tabbar {
    background: #1e1e1e;
    box-shadow: 0 -1px 0 #333;
}
[data-theme="dark"] body.ac-app .ac-homebar,
[data-theme="dark"] body.ac-app .ac-nav,
[data-theme="dark"] body.ac-app .ac-section,
[data-theme="dark"] body.ac-app .ac-home-shortcuts {
    background: #1e1e1e;
    color: #eee;
}

/* ==========================================================================
   Detail / Pay / VIP / Settings — App surfaces (ref comic H5)
   ========================================================================== */

/* ---- Detail ---- */
body.ac-app .ac-detail {
    background: #fff;
    min-height: 50vh;
    /* room for fixed CTA (≈58) + tabbar (50) + safe */
    padding-bottom: calc(58px + var(--ac-tab-h) + var(--ac-safe-b)) !important;
}
body.ac-app .ac-detail__nav .ac-nav__title {
    margin-right: 40px;
}
body.ac-app .ac-detail .manga-detail {
    padding-bottom: 12px !important;
    background: #fff;
}
body.ac-app .ac-detail__hero.manga-detail__hero {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 12px !important;
    padding: 12px !important;
    margin: 0 !important;
    align-items: flex-start !important;
}
body.ac-app .ac-detail .manga-detail__cover {
    width: 110px !important;
    flex-shrink: 0;
    position: relative;
}
body.ac-app .ac-detail .manga-detail__cover img {
    width: 110px !important;
    height: 150px !important;
    object-fit: cover;
    border-radius: 6px !important;
    box-shadow: 0 4px 12px rgba(0,0,0,.12) !important;
}
body.ac-app .ac-detail .manga-detail__title {
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    margin: 0 0 8px !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
body.ac-app .ac-detail .manga-detail__fields {
    gap: 6px !important;
}
body.ac-app .ac-detail .manga-detail__fields li {
    font-size: 12px !important;
    color: #888 !important;
}
body.ac-app .ac-detail .manga-detail__chapter-list {
    max-height: none !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    gap: 0 !important;
}
body.ac-app .ac-detail .manga-detail__chapter-item {
    padding: 0 12px !important;
    min-height: 46px;
    border-radius: 0 !important;
}
body.ac-app .ac-detail .manga-detail__synopsis {
    margin: 0 !important;
    padding: 12px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    border-top: 8px solid #f5f5f5 !important;
}
body.ac-app .ac-detail .manga-detail__catalog {
    margin: 0 !important;
    border-top: 8px solid #f5f5f5;
}
body.ac-app .ac-detail__similar,
body.ac-app .ac-detail__comments {
    border-top: 8px solid #f5f5f5;
    margin: 0 !important;
    padding: 12px 0 20px !important;
}
body.ac-app .ac-detail__comments {
    padding: 12px !important;
}
body.ac-app .ac-detail .flash {
    margin-bottom: 12px;
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 13px;
    background: #e8f5e9;
    color: #2e7d32;
}
/* CTA already fixed via body.ac-app .manga-detail__cta-row */

/* ---- 充值中心 (积分 / VIP 合并) ---- */
body.ac-app .profile-monetization {
    padding: 0 !important;
    background: var(--ac-bg);
}
body.ac-app .ac-pay-center {
    margin: 0;
}
body.ac-app .ac-pay-tabs {
    display: flex;
    gap: 0;
    margin: 0 12px 14px;
    padding: 4px;
    border-radius: 10px;
    background: #f2f3f5;
}
body.ac-app .ac-pay-tabs__tab {
    flex: 1;
    text-align: center;
    padding: 10px 8px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #666;
    text-decoration: none;
    transition: background 0.15s ease, color 0.15s ease;
}
body.ac-app .ac-pay-tabs__tab.is-active {
    background: #fff;
    color: var(--ac-primary, var(--primary, #4caf50));
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}
body.ac-app .ac-pay-panel[hidden] {
    display: none !important;
}
body.ac-app .ac-pay {
    background: var(--ac-bg);
    padding-bottom: 24px;
}
body.ac-app .ac-pay__hero {
    margin: 12px;
    padding: 22px 16px 18px;
    border-radius: 12px;
    background: linear-gradient(145deg, var(--ac-primary) 0%, var(--ac-primary) 55%, var(--ac-primary-dark) 100%);
    color: #fff;
    text-align: center;
    box-shadow: 0 6px 18px rgba(76, 175, 80, 0.28);
}
body.ac-app .ac-pay__hero-label {
    font-size: 13px;
    opacity: 0.9;
}
body.ac-app .ac-pay__hero-val {
    font-size: 40px;
    font-weight: 800;
    line-height: 1.15;
    margin: 6px 0 2px;
    letter-spacing: -0.5px;
}
body.ac-app .ac-pay__hero-unit {
    font-size: 13px;
    opacity: 0.95;
}
body.ac-app .ac-pay__hero-sub {
    margin-top: 12px;
    font-size: 12px;
    opacity: 0.88;
}
body.ac-app .ac-pay__dot { margin: 0 6px; opacity: 0.6; }
body.ac-app .ac-pay__alert {
    margin: 0 12px 10px;
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 13px;
}
body.ac-app .ac-pay__alert--err { background: #ffebee; color: #c62828; }
body.ac-app .ac-pay__alert--warn { background: #fff8e1; color: #f57f17; }
body.ac-app .ac-pay__section {
    margin: 0 12px 12px;
    padding: 14px 12px 16px;
    background: #fff;
    border-radius: 12px;
}
body.ac-app .ac-pay__sec-title {
    margin: 0 0 6px;
    font-size: 15px;
    font-weight: 700;
    color: #222;
}
body.ac-app .ac-pay__sec-hint {
    margin: 0 0 12px;
    font-size: 12px;
    color: #999;
    line-height: 1.5;
}
body.ac-app .ac-pay__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}
body.ac-app .ac-pay__pkg {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 96px;
    padding: 14px 6px 12px;
    border: 1.5px solid #e8e8e8;
    border-radius: 10px;
    background: #fafafa;
    cursor: pointer;
    font: inherit;
    color: inherit;
    -webkit-tap-highlight-color: transparent;
}
body.ac-app .ac-pay__pkg.is-selected,
body.ac-app .ac-pay__pkg:active {
    border-color: var(--ac-primary);
    background: #e8f5e9;
    box-shadow: 0 0 0 1px var(--ac-primary);
}
body.ac-app .ac-pay__pkg-badge {
    position: absolute;
    top: -1px;
    right: -1px;
    padding: 2px 6px;
    font-size: 10px;
    font-weight: 600;
    color: #fff;
    background: #ff7043;
    border-radius: 0 10px 0 8px;
}
body.ac-app .ac-pay__pkg-pts {
    font-size: 20px;
    font-weight: 800;
    color: #222;
    line-height: 1.2;
}
body.ac-app .ac-pay__pkg-unit {
    font-size: 11px;
    color: #888;
    margin-bottom: 4px;
}
body.ac-app .ac-pay__pkg-price {
    font-size: 13px;
    font-weight: 600;
    color: var(--ac-primary);
}
body.ac-app .ac-pay__tap-hint {
    margin: 12px 0 0;
    text-align: center;
    font-size: 12px;
    color: #aaa;
}
body.ac-app .ac-pay__ledger-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
body.ac-app .ac-pay__ledger-item {
    padding: 12px 0;
    border-bottom: 1px solid #f0f0f0;
}
body.ac-app .ac-pay__ledger-item:last-child { border-bottom: 0; }
body.ac-app .ac-pay__ledger-main {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
}
body.ac-app .ac-pay__ledger-type { font-size: 14px; color: #333; }
body.ac-app .ac-pay__ledger-amt { font-size: 14px; font-weight: 700; }
body.ac-app .ac-pay__ledger-item--in .ac-pay__ledger-amt { color: #43a047; }
body.ac-app .ac-pay__ledger-item--out .ac-pay__ledger-amt { color: #666; }
body.ac-app .ac-pay__ledger-note {
    margin-top: 4px;
    font-size: 12px;
    color: #999;
}
body.ac-app .ac-pay__ledger-meta {
    margin-top: 4px;
    font-size: 11px;
    color: #bbb;
}

/* ---- VIP ---- */
body.ac-app .ac-vip {
    background: var(--ac-bg);
    padding-bottom: 24px;
}
body.ac-app .ac-vip__banner {
    margin: 12px;
    padding: 28px 16px 24px;
    border-radius: 12px;
    text-align: center;
    color: #fff;
    background: linear-gradient(145deg, #ffb74d 0%, #ff9800 40%, #f57c00 100%);
    box-shadow: 0 6px 18px rgba(255, 152, 0, 0.3);
}
body.ac-app .ac-vip__banner-ico {
    font-size: 36px;
    margin-bottom: 8px;
    opacity: 0.95;
}
body.ac-app .ac-vip__banner-title {
    font-size: 20px;
    font-weight: 800;
}
body.ac-app .ac-vip__banner-sub {
    margin-top: 6px;
    font-size: 13px;
    opacity: 0.92;
}
body.ac-app .ac-vip__current {
    margin: 0 12px 12px;
    padding: 14px;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #ffe0b2;
}
body.ac-app .ac-vip__current-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
}
body.ac-app .ac-vip__current-label { font-size: 12px; color: #999; }
body.ac-app .ac-vip__current-badge {
    font-size: 11px;
    font-weight: 700;
    color: #e65100;
    background: #fff3e0;
    padding: 2px 8px;
    border-radius: 10px;
}
body.ac-app .ac-vip__current-name {
    font-size: 16px;
    font-weight: 700;
    color: #222;
}
body.ac-app .ac-vip__current-exp {
    margin-top: 4px;
    font-size: 12px;
    color: #888;
}
body.ac-app .ac-vip__benefits {
    list-style: none;
    margin: 10px 0 0;
    padding: 0;
}
body.ac-app .ac-vip__benefits li {
    font-size: 13px;
    color: #555;
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    gap: 6px;
}
body.ac-app .ac-vip__benefits i { color: var(--ac-primary); font-size: 12px; }
body.ac-app .ac-vip__section {
    margin: 0 12px;
}
body.ac-app .ac-vip__sec-title {
    font-size: 15px;
    font-weight: 700;
    margin: 0 4px 10px;
    color: #222;
}
body.ac-app .ac-vip__plan {
    position: relative;
    margin-bottom: 10px;
    padding: 14px;
    background: #fff;
    border-radius: 12px;
    border: 1.5px solid #eee;
}
body.ac-app .ac-vip__plan.is-hot {
    border-color: #ffb74d;
    background: linear-gradient(180deg, #fffaf3 0%, #fff 60%);
}
body.ac-app .ac-vip__plan-tag {
    position: absolute;
    top: 0;
    right: 12px;
    padding: 2px 8px;
    font-size: 10px;
    font-weight: 700;
    color: #fff;
    background: #ff9800;
    border-radius: 0 0 6px 6px;
}
body.ac-app .ac-vip__plan-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
body.ac-app .ac-vip__plan-title {
    font-size: 16px;
    font-weight: 700;
    color: #222;
}
body.ac-app .ac-vip__plan-days {
    margin-top: 2px;
    font-size: 12px;
    color: #999;
}
body.ac-app .ac-vip__plan-ben {
    margin-top: 4px;
    font-size: 12px;
    color: #666;
    line-height: 1.4;
}
body.ac-app .ac-vip__plan-buy {
    flex-shrink: 0;
    text-align: right;
}
body.ac-app .ac-vip__plan-price {
    font-size: 18px;
    font-weight: 800;
    color: #e65100;
    margin-bottom: 6px;
}
body.ac-app .ac-vip__plan-btn {
    min-width: 72px;
    height: 32px;
    padding: 0 14px;
    border: 0;
    border-radius: 16px;
    background: linear-gradient(90deg, #ffb74d, #ff9800);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
}

/* ---- 系统设置 ---- */
body.ac-app .ac-settings {
    background: var(--ac-bg);
    min-height: 60vh;
    padding-bottom: 32px;
}
body.ac-app .ac-settings__flash {
    margin: 10px 12px 0;
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 13px;
}
body.ac-app .ac-settings__flash--err { background: #ffebee; color: #c62828; }
body.ac-app .ac-settings__flash--ok { background: #e8f5e9; color: #2e7d32; }
body.ac-app .ac-settings__group {
    margin-top: 12px;
}
body.ac-app .ac-settings__group-title {
    padding: 0 16px 6px;
    font-size: 12px;
    color: #999;
}
body.ac-app .ac-settings__card {
    margin: 0 12px;
    padding: 4px 14px 12px;
    background: #fff;
    border-radius: 12px;
}
body.ac-app .ac-settings__avatar-row {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 0 8px;
}
body.ac-app .ac-settings__avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #e8f5e9;
    color: var(--ac-primary);
    font-size: 22px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
body.ac-app .ac-settings__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
body.ac-app .ac-settings__avatar-btn {
    font-size: 13px;
    color: var(--ac-primary);
    font-weight: 600;
    cursor: pointer;
}
body.ac-app .ac-settings__field {
    padding: 10px 0;
    border-top: 1px solid #f0f0f0;
}
body.ac-app .ac-settings__field label {
    display: block;
    font-size: 12px;
    color: #999;
    margin-bottom: 4px;
}
body.ac-app .ac-settings__field input {
    width: 100%;
    border: 0;
    outline: none;
    font-size: 15px;
    color: #222;
    background: transparent;
    padding: 4px 0;
    font-family: inherit;
}
body.ac-app .ac-settings__theme-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 50px;
    padding: 8px 14px !important;
    font-size: 15px;
}
body.ac-app .ac-settings__seg {
    display: flex;
    background: #f0f0f0;
    border-radius: 16px;
    padding: 2px;
    gap: 2px;
}
body.ac-app .ac-settings__seg-btn {
    border: 0;
    background: transparent;
    padding: 6px 12px;
    font-size: 12px;
    border-radius: 14px;
    color: #666;
    cursor: pointer;
    font-family: inherit;
}
body.ac-app .ac-settings__seg-btn.is-active {
    background: #fff;
    color: var(--ac-primary);
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(0,0,0,.08);
}
body.ac-app .ac-settings__save {
    display: flex;
    width: calc(100% - 24px);
    margin: 20px 12px 0;
    height: 44px;
    border-radius: 22px;
}
body.ac-app .ac-settings__logout {
    display: block;
    margin: 20px 12px 0;
    height: 44px;
    line-height: 44px;
    text-align: center;
    background: #fff;
    border-radius: 12px;
    color: #f44336;
    text-decoration: none;
    font-size: 15px;
    font-weight: 600;
}

[data-theme="dark"] body.ac-app .ac-pay-tabs {
    background: #2a2a2a;
}
[data-theme="dark"] body.ac-app .ac-pay-tabs__tab {
    color: #aaa;
}
[data-theme="dark"] body.ac-app .ac-pay-tabs__tab.is-active {
    background: #1e1e1e;
    color: var(--ac-primary, var(--primary, #4caf50));
}
[data-theme="dark"] body.ac-app .ac-pay__section,
[data-theme="dark"] body.ac-app .ac-vip__plan,
[data-theme="dark"] body.ac-app .ac-vip__current,
[data-theme="dark"] body.ac-app .ac-settings__card {
    background: #1e1e1e;
    border-color: #333;
}
[data-theme="dark"] body.ac-app .ac-pay__pkg {
    background: #2a2a2a;
    border-color: #444;
}
[data-theme="dark"] body.ac-app .ac-settings__field input {
    color: #eee;
}

/* ==========================================================================
   Video detail — force single column (viewport media never sees 480 body)
   ========================================================================== */
body.ac-app .video-page.ac-video,
body.ac-app .ac-video {
    display: block !important;
    grid-template-columns: none !important;
    gap: 0 !important;
    padding: 0 0 calc(var(--ac-tab-h) + var(--ac-safe-b) + 8px) !important;
    max-width: 100% !important;
    background: #fff;
}
body.ac-app .ac-video .video-info {
    padding: 10px 12px 8px !important;
    margin: 0 !important;
}
body.ac-app .ac-video__nav .ac-nav__title {
    font-size: 15px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: calc(100% - 88px);
}
body.ac-app .ac-video__main {
    width: 100% !important;
    max-width: 100% !important;
}
body.ac-app .ac-video .video-player,
body.ac-app .ac-video .player,
body.ac-app .ac-video .plyr,
body.ac-app .ac-video [data-player] {
    border-radius: 0 !important;
}

/* Multi-episode picker (detail page) */
body.ac-app .ac-ep-picker {
    margin: 0 0 8px;
    padding: 12px 12px 4px;
    background: var(--ac-surface, #fff);
}
body.ac-app .ac-ep-picker__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
}
body.ac-app .ac-ep-picker__title {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    color: var(--ac-text, #1a1a1a);
}
body.ac-app .ac-ep-picker__count {
    font-size: 12px;
    color: var(--ac-text-2, #888);
}
body.ac-app .ac-ep-picker__groups {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 10px;
}
body.ac-app .ac-ep-picker__group {
    appearance: none;
    border: 1px solid var(--ac-border, #e8e8e8);
    background: transparent;
    color: var(--ac-text-2, #666);
    font-size: 12px;
    font-family: inherit;
    padding: 5px 10px;
    border-radius: 6px;
    cursor: pointer;
    line-height: 1.2;
}
body.ac-app .ac-ep-picker__group.is-active {
    border-color: var(--primary);
    color: var(--primary);
    font-weight: 600;
}
body.ac-app .ac-ep-picker__panel {
    display: none;
}
body.ac-app .ac-ep-picker__panel.is-active {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    padding-bottom: 8px;
}
@media (min-width: 640px) {
    body.ac-app .ac-ep-picker__panel.is-active {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }
}
@media (min-width: 960px) {
    body.ac-app .ac-ep-picker__panel.is-active {
        grid-template-columns: repeat(10, minmax(0, 1fr));
    }
}
body.ac-app .ac-ep-picker__item {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 8px 4px 6px;
    border: 1px solid var(--ac-border, #e8e8e8);
    border-radius: 8px;
    text-decoration: none;
    color: var(--ac-text, #222);
    background: var(--ac-bg, #fafafa);
    font-size: 13px;
    font-weight: 600;
    transition: border-color .15s, color .15s, background .15s;
}
body.ac-app .ac-ep-picker__item:hover {
    border-color: var(--primary);
    color: var(--primary);
}
body.ac-app .ac-ep-picker__item.is-current {
    border-color: var(--primary);
    color: var(--primary);
    box-shadow: inset 0 0 0 1px var(--primary);
}
body.ac-app .ac-ep-picker__item.is-locked {
    color: var(--ac-text-2, #888);
}
body.ac-app .ac-ep-picker__no {
    line-height: 1.2;
}
body.ac-app .ac-ep-picker__item .tp-pay-meta {
    margin-top: 3px;
    font-size: 11px;
    font-weight: 600;
}
body.ac-app .manga-detail__chapter-item .tp-pay-meta,
body.ac-app .manga-read__catalog-item .tp-pay-meta {
    font-size: 12px;
    margin-left: auto;
}
body.ac-app .manga-detail__chapter-pages,
body.ac-app .manga-read__catalog-pages {
    margin-left: 6px;
}
[data-theme="dark"] body.ac-app .ac-ep-picker {
    background: var(--ac-surface, #1a1a1a);
}
[data-theme="dark"] body.ac-app .ac-ep-picker__item {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.08);
}

body.ac-app .ac-video .video-info__title {
    font-size: 16px !important;
    line-height: 1.4 !important;
    margin: 0 0 8px !important;
}
body.ac-app .ac-video .video-info__bar {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
}
body.ac-app .ac-video .video-info__stats {
    flex-wrap: wrap;
    gap: 8px 12px;
    font-size: 12px;
    color: #888;
}
body.ac-app .ac-video .video-info__actions {
    display: flex !important;
    flex-wrap: wrap;
    gap: 8px;
    width: 100%;
}
body.ac-app .ac-video .video-info__actions .vote-btn,
body.ac-app .ac-video .video-info__actions .fav-btn,
body.ac-app .ac-video .video-info__actions button {
    flex: 1 1 auto;
    min-height: 36px;
    border-radius: 18px !important;
    font-size: 13px !important;
}
body.ac-app .ac-video .video-meta,
body.ac-app .ac-video .video-description,
body.ac-app .ac-video .video-detail-section,
body.ac-app .ac-video .comments,
body.ac-app .ac-video .comments-section,
body.ac-app .ac-video .video-tags,
body.ac-app .ac-video .video-categories,
body.ac-app .ac-video .author-card,
body.ac-app .ac-video .author-grid {
    padding-left: 14px !important;
    padding-right: 14px !important;
    box-sizing: border-box;
}
body.ac-app .ac-video .video-detail-section {
    margin: 0 !important;
}
body.ac-app .ac-video .video-detail-block {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
body.ac-app .ac-video .comments,
body.ac-app .ac-video .comments-section {
    padding-top: 12px !important;
    padding-bottom: 16px !important;
    margin-top: 8px !important;
}
body.ac-app .ac-video .comments__header h3 {
    padding-left: 0;
    margin: 0 0 12px;
}
body.ac-app .ac-video .comment-form,
body.ac-app .ac-video .comments-list,
body.ac-app .ac-video .comment {
    max-width: 100%;
}
/* Theme-coherent letter avatars (green, not red/blue default) */
body.ac-app .comment__avatar,
body.ac-app .comment-form__avatar,
body.ac-app .author-card__avatar,
body.ac-app .performer-chip__initial,
body.ac-app .ac-settings__avatar {
    background: #e8f5e9 !important;
    color: var(--ac-primary) !important;
    background-image: none !important;
}
body.ac-app .author-card__avatar,
body.ac-app .comment-form__avatar {
    background: var(--ac-primary) !important;
    color: #fff !important;
}
body.ac-app .performer-chip__initial {
    background: var(--ac-primary) !important;
    color: #fff !important;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
body.ac-app .ac-video .video-info__actions .ac-video__report {
    flex: 0 0 auto;
    min-width: 40px;
}
/* Manga detail edge padding */
body.ac-app .ac-detail__tags,
body.ac-app .ac-detail .manga-detail__tags {
    padding-left: 14px !important;
    padding-right: 14px !important;
}
body.ac-app .ac-detail__comments,
body.ac-app .ac-detail .comments-section {
    padding-left: 14px !important;
    padding-right: 14px !important;
}
body.ac-app .ac-detail .manga-detail__hero {
    padding: 12px 14px !important;
}
body.ac-app .ac-detail .manga-detail__synopsis {
    padding-left: 14px !important;
    padding-right: 14px !important;
}
body.ac-app .ac-video__related {
    display: block !important;
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 12px 0 8px !important;
    border-top: 8px solid #f5f5f5;
    background: #fff;
}
body.ac-app .ac-video__related-title {
    margin: 0 12px 10px;
    font-size: 15px;
    font-weight: 700;
    color: #222;
}
body.ac-app .ac-video__related .related-grid,
body.ac-app .ac-video__more .video-grid {
    padding: 0 8px 8px !important;
}
body.ac-app .ac-video__more {
    border-top: 8px solid #f5f5f5;
    padding: 12px 0 24px;
    background: #fff;
    margin: 0 !important;
}
body.ac-app .ac-video__more .section-title {
    margin: 0 12px 10px;
    font-size: 15px;
    font-weight: 700;
}
body.ac-app .ac-video__more .recommended-more {
    padding: 8px 12px 0;
}
body.ac-app .ac-video__more .recommended-more__btn {
    width: 100%;
    height: 40px;
    border: 1px solid #e0e0e0;
    border-radius: 20px;
    background: #fff;
    color: #666;
    font-size: 13px;
}

/* ---- 任务中心 ---- */
body.ac-app .ac-tasks {
    padding: 12px 0 28px;
    background: var(--ac-bg);
}
body.ac-app .ac-tasks__card {
    margin: 0 12px 12px;
    padding: 14px;
    background: #fff;
    border-radius: 12px;
}
body.ac-app .ac-tasks__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
}
body.ac-app .ac-tasks__title {
    margin: 0 0 10px;
    font-size: 15px;
    font-weight: 700;
    color: #222;
}
body.ac-app .ac-tasks__head .ac-tasks__title { margin: 0; }
body.ac-app .ac-tasks__streak {
    font-size: 12px;
    color: var(--ac-primary);
    font-weight: 600;
}
body.ac-app .ac-tasks__status {
    margin: 0 0 12px;
    font-size: 13px;
    color: #666;
}
body.ac-app .ac-tasks__status.is-done { color: #43a047; }
body.ac-app .ac-tasks__cal {
    margin-bottom: 12px;
}
body.ac-app .ac-tasks__checkin-btn {
    width: 100%;
    height: 42px;
    border-radius: 21px;
}
body.ac-app .ac-tasks__checkin-btn.is-disabled,
body.ac-app .ac-tasks__checkin-btn:disabled {
    opacity: 0.55;
    cursor: default;
}
body.ac-app .ac-tasks__empty {
    margin: 0;
    font-size: 13px;
    color: #999;
    text-align: center;
    padding: 16px 0;
}
body.ac-app .ac-tasks__list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
body.ac-app .ac-tasks__item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding-top: 12px;
    border-top: 1px solid #f0f0f0;
}
body.ac-app .ac-tasks__item:first-child {
    padding-top: 0;
    border-top: 0;
}
body.ac-app .ac-tasks__item-main { flex: 1; min-width: 0; }
body.ac-app .ac-tasks__item-title {
    font-size: 14px;
    font-weight: 600;
    color: #222;
    margin-bottom: 4px;
}
body.ac-app .ac-tasks__item-desc {
    font-size: 12px;
    color: #888;
    margin-bottom: 4px;
}
body.ac-app .ac-tasks__item-reward {
    font-size: 12px;
    color: #ff9800;
    font-weight: 600;
    margin-bottom: 6px;
}
body.ac-app .ac-tasks__progress {
    height: 6px;
    background: #f0f0f0;
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 4px;
}
body.ac-app .ac-tasks__progress-bar {
    height: 100%;
    background: var(--ac-primary);
    border-radius: 3px;
}
body.ac-app .ac-tasks__meta {
    font-size: 11px;
    color: #999;
}
body.ac-app .ac-tasks__action {
    flex-shrink: 0;
    padding-top: 2px;
}
body.ac-app .ac-tasks__claim {
    min-width: 64px;
    height: 30px;
    padding: 0 12px;
    border-radius: 15px;
    font-size: 12px;
}
body.ac-app .ac-tasks__badge {
    display: inline-block;
    font-size: 11px;
    color: #999;
    padding: 4px 8px;
    background: #f5f5f5;
    border-radius: 10px;
}
body.ac-app .ac-tasks__badge.profile-mo-task__badge--done {
    color: #43a047;
    background: #e8f5e9;
}

/* ---- 已购 ---- */
body.ac-app .ac-unlocks {
    padding: 8px 0 28px;
    background: var(--ac-bg);
    min-height: 40vh;
}
body.ac-app .ac-unlocks__list {
    list-style: none;
    margin: 0;
    padding: 0 12px;
}
body.ac-app .ac-unlocks__item {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 56px;
    padding: 12px 14px;
    margin-bottom: 8px;
    background: #fff;
    border-radius: 12px;
}
body.ac-app .ac-unlocks__body { flex: 1; min-width: 0; }
body.ac-app .ac-unlocks__title {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #222;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
body.ac-app .ac-unlocks__meta {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: #999;
}
body.ac-app .ac-unlocks__go {
    color: #ccc;
    padding: 8px;
    text-decoration: none;
}
body.ac-app .ac-unlocks__empty {
    padding: 40px 20px;
    text-align: center;
}
body.ac-app .ac-unlocks__hint {
    margin: 8px 0 16px;
    font-size: 13px;
    color: #999;
}
body.ac-app .ac-unlocks__pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 12px;
}

/* ---- 推广 affiliate（保留 mo IDs，仅换 App 皮） ---- */
body.ac-app .ac-aff {
    padding: 12px 0 28px;
    background: var(--ac-bg);
}
body.ac-app .ac-aff .profile-form__section {
    margin: 0 12px 12px !important;
    padding: 14px !important;
    background: #fff !important;
    border-radius: 12px !important;
    border: 0 !important;
    box-shadow: none !important;
}
body.ac-app .ac-aff .profile-form__title {
    margin: 0 0 12px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #222 !important;
    display: flex;
    align-items: center;
    gap: 6px;
}
body.ac-app .ac-aff .profile-form__title i { color: var(--ac-primary); font-size: 14px; }
body.ac-app .ac-aff .profile-mo-stats {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
}
body.ac-app .ac-aff .profile-mo-stats__item {
    background: #f7faf7 !important;
    border-radius: 10px !important;
    padding: 12px 8px !important;
    text-align: center;
    border: 0 !important;
}
body.ac-app .ac-aff .profile-mo-stats__num {
    display: block;
    font-size: 18px;
    font-weight: 700;
    color: var(--ac-primary);
}
body.ac-app .ac-aff .profile-mo-stats__label {
    font-size: 11px;
    color: #888;
}
body.ac-app .ac-aff .profile-form__input-wrap input,
body.ac-app .ac-aff .profile-form__input-wrap select,
body.ac-app .ac-aff input[type="text"],
body.ac-app .ac-aff input[type="number"],
body.ac-app .ac-aff select,
body.ac-app .ac-aff textarea {
    width: 100%;
    min-height: 40px;
    border: 1px solid #e8e8e8 !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
    font-size: 14px !important;
    background: #fafafa !important;
    font-family: inherit;
}
body.ac-app .ac-aff .profile-mo-copy-row,
body.ac-app .ac-aff .profile-form__field .profile-mo-copy-row {
    display: flex;
    gap: 8px;
    align-items: stretch;
}
body.ac-app .ac-aff .profile-mo-copy-row__input { flex: 1; min-width: 0; }
body.ac-app .ac-aff .profile-mo-copy-btn,
body.ac-app .ac-aff .btn.btn-primary,
body.ac-app .ac-aff button.btn-primary {
    min-height: 40px !important;
    padding: 0 14px !important;
    border: 0 !important;
    border-radius: 20px !important;
    background: var(--ac-primary) !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    white-space: nowrap;
}
body.ac-app .ac-aff .btn.btn-secondary,
body.ac-app .ac-aff .btn.btn-sm {
    min-height: 34px !important;
    border-radius: 17px !important;
    font-size: 12px !important;
}
body.ac-app .ac-aff .profile-form__hint {
    font-size: 12px !important;
    color: #888 !important;
    line-height: 1.5;
}
body.ac-app .ac-aff .profile-mo-qrcode-section img,
body.ac-app .ac-aff #moAffQrcodeImg {
    max-width: 180px;
    display: block;
    margin: 8px auto;
    border-radius: 8px;
}

/* ---- 书架面板 / 访客 ---- */
body.ac-app .ac-shelf__panel {
    padding: 10px 8px 16px !important;
    background: #fff !important;
}
body.ac-app .ac-shelf__clear {
    border: 0;
    background: none;
    color: var(--ac-text-2);
    font-size: 13px;
    cursor: pointer;
    font-family: inherit;
    padding: 4px 8px;
}
body.ac-app .ac-guest-shelf {
    min-height: 50vh;
    background: var(--ac-bg);
}
body.ac-app .ac-guest-shelf__empty {
    padding: 48px 24px;
    text-align: center;
}
body.ac-app .ac-guest-shelf__hint {
    margin: 8px 0 20px;
    font-size: 13px;
    color: #999;
}
body.ac-app .ac-guest-shelf__actions {
    display: flex;
    gap: 10px;
    justify-content: center;
    flex-wrap: wrap;
}
body.ac-app .ac-guest-shelf__actions .ac-btn {
    min-width: 100px;
    height: 40px;
    border-radius: 20px;
}

/* ---- 收银台按钮 ---- */
body.ac-app .ac-checkout__account-row {
    display: flex;
    gap: 8px;
    align-items: center;
}
body.ac-app .ac-checkout__copy {
    flex-shrink: 0;
    height: 36px;
    padding: 0 14px;
    border-radius: 18px;
    font-size: 13px;
}
body.ac-app .ac-checkout__actions {
    margin-top: 20px;
}
body.ac-app .ac-checkout__actions .ac-btn {
    display: flex;
    width: 100%;
    height: 44px;
    border-radius: 22px;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

[data-theme="dark"] body.ac-app .ac-tasks__card,
[data-theme="dark"] body.ac-app .ac-unlocks__item,
[data-theme="dark"] body.ac-app .ac-aff .profile-form__section,
[data-theme="dark"] body.ac-app .ac-video,
[data-theme="dark"] body.ac-app .ac-video__related,
[data-theme="dark"] body.ac-app .ac-video__more {
    background: #1e1e1e;
}
[data-theme="dark"] body.ac-app .ac-tasks__item-title,
[data-theme="dark"] body.ac-app .ac-unlocks__title,
[data-theme="dark"] body.ac-app .ac-aff .profile-form__title {
    color: #eee !important;
}