h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

/* ZHubPro Blazor skeleton loading system */
.zhub-skeleton {
    display: block;
    position: relative;
    overflow: hidden;
    background: #e9ecef;
}

.zhub-skeleton::after {
    content: "";
    position: absolute;
    inset: 0;
    transform: translateX(-100%);
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent);
    animation: zhub-skeleton-shimmer 1.25s infinite;
}

.zhub-skeleton-table {
    display: grid;
    gap: .75rem;
}

.zhub-skeleton-table-row {
    display: grid;
    gap: .75rem;
    align-items: center;
}

.zhub-skeleton-card {
    display: grid;
    gap: .75rem;
    padding: 1rem;
    border: 1px solid #edf0f2;
    border-radius: .75rem;
    background: #fff;
}

.zhub-loading-overlay {
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: grid;
    place-items: center;
    background: rgba(255, 255, 255, .72);
}

.zhub-loading-box {
    display: grid;
    gap: .75rem;
    min-width: 220px;
    padding: 1rem;
    border-radius: .75rem;
    background: #fff;
    box-shadow: 0 .75rem 2rem rgba(15, 23, 42, .12);
    text-align: center;
}

.zhub-public-layout,
.zhub-admin-layout,
.zhub-auth-layout {
    min-height: 100vh;
}

.zhub-public-header,
.zhub-admin-sidebar {
    padding: 1rem;
}

.zhub-brand {
    font-weight: 700;
    text-decoration: none;
}

@keyframes zhub-skeleton-shimmer {
    100% {
        transform: translateX(100%);
    }
}

/* ZHubPro Blazor convert B06.1/B06.2 scaffold */
.zhub-public-main {
    min-height: calc(100vh - 64px);
}

.zhub-hero-panel,
.zhub-search-box,
.zhub-card,
.zhub-admin-metric,
.zhub-admin-module {
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 1rem;
    background: #fff;
}

.zhub-hero-panel,
.zhub-search-box {
    padding: 1.25rem;
}

.zhub-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: transform .15s ease, box-shadow .15s ease;
}

.zhub-card:hover,
.zhub-admin-metric:hover,
.zhub-admin-module:hover {
    transform: translateY(-2px);
    box-shadow: 0 1rem 2.5rem rgba(15, 23, 42, .08);
}

.zhub-card-cover {
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #f1f5f9;
}

.zhub-card-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.zhub-card-body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 1rem;
}

.zhub-card a {
    color: inherit;
    text-decoration: none;
}

.zhub-admin-layout {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    background: #f6f8fb;
}

.zhub-admin-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
}

.zhub-admin-menu {
    display: grid;
    gap: .25rem;
}

.zhub-admin-menu-group {
    margin: 1rem 0 .35rem;
    color: rgba(255, 255, 255, .55);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.zhub-admin-menu-link {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .65rem .75rem;
    border-radius: .75rem;
    color: rgba(255, 255, 255, .82);
    text-decoration: none;
}

.zhub-admin-menu-link:hover,
.zhub-admin-menu-link.active {
    background: rgba(255, 255, 255, .12);
    color: #fff;
}

.zhub-admin-content {
    min-width: 0;
}

.zhub-admin-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 70px;
    padding: 1rem 1.5rem;
}

.zhub-admin-main {
    padding: 1.5rem;
}

.zhub-admin-metric,
.zhub-admin-module {
    display: block;
    height: 100%;
    padding: 1rem;
    color: inherit;
    transition: transform .15s ease, box-shadow .15s ease;
}

.zhub-auth-layout {
    display: grid;
    place-items: center;
    padding: 2rem;
    background: #f6f8fb;
}

.zhub-auth-card {
    width: min(100%, 460px);
    padding: 1.5rem;
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 1rem;
    background: #fff;
}

@media (max-width: 991.98px) {
    .zhub-admin-layout {
        grid-template-columns: 1fr;
    }

    .zhub-admin-sidebar {
        position: static;
        height: auto;
    }
}

.zhub-admin-preview-table {
    table-layout: auto;
}

.zhub-admin-preview-table td,
.zhub-admin-preview-table th {
    max-width: 340px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zhub-admin-autozip-status code,
.zhub-exclude-chip {
    display: inline-block;
    max-width: 100%;
    padding: .35rem .5rem;
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: .5rem;
    background: #f8fafc;
    color: #0f172a;
    overflow-wrap: anywhere;
}

/* ZHubPro Blazor convert B06.3 API compatibility */
.zhub-api-rule {
    height: 100%;
    padding: 1rem;
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 1rem;
    background: #fff;
}

.zhub-api-rule > i {
    display: inline-grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    margin-bottom: .75rem;
    border-radius: .75rem;
    background: rgba(13, 110, 253, .08);
}

.zhub-api-route-note td {
    border-top: 0;
    background: rgba(248, 250, 252, .72);
}

/* B05 legacy auth */
.zhub-auth-page {
    min-height: calc(100vh - 90px);
}

.zhub-auth-card {
    border-radius: 1rem;
}

.zhub-auth-icon {
    width: 56px;
    height: 56px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: rgba(13, 110, 253, .1);
    color: #0d6efd;
    font-size: 1.35rem;
}

.zhub-nav-avatar {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    object-fit: cover;
    margin-right: .35rem;
}

/* B06-B10 public detail/economy/launcher compatibility */
.zhub-detail-cover {
    max-height: 420px;
    object-fit: cover;
}

.zhub-rich-content img {
    max-width: 100%;
    height: auto;
    border-radius: 0.75rem;
}

.zhub-rich-content pre,
.zhub-rich-content code {
    white-space: pre-wrap;
}

.zhub-shop-buy-card {
    top: 1rem;
}


.zhub-route-progress-inline{position:fixed;top:0;left:0;right:0;height:3px;z-index:2147483640;pointer-events:none;overflow:hidden;opacity:0;transition:opacity .16s ease}.zhub-route-progress-inline::before{content:"";position:absolute;top:0;left:0;height:3px;width:100%;transform:translateX(-100%) scaleX(.32);transform-origin:left center;background:linear-gradient(90deg,var(--zh-primary,#17a899),var(--zh-primary-2,#25b8d6),var(--zh-orange,#ff8b3d));opacity:.9;z-index:2147483640;animation:zhub-route-run 1s ease-in-out infinite}html[data-zhub-navigating="true"] .zhub-route-progress-inline{opacity:1}@keyframes zhub-route-run{0%{transform:translateX(-100%) scaleX(.32)}50%{transform:translateX(30%) scaleX(.52)}100%{transform:translateX(100%) scaleX(.25)}}
.zhub-layout-widget-host:empty{display:none}.zhub-layout-widget-host{margin-bottom:1rem}

.zhub-table-pager{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap;margin:.65rem 0 0}.zhub-table-pager .pagination{margin-bottom:0}.zhub-table-pager .page-link{padding:.25rem .55rem;font-size:.85rem}.zhub-table-pager-info{font-size:.82rem;color:var(--bs-secondary-color,#6c757d)}.zhub-table-page-size{max-width:92px}.zhub-table-empty-row td{color:var(--bs-secondary-color,#6c757d);font-style:italic}.zhub-table-search-input{max-width:360px}.zhub-ajax-pill{font-weight:800;color:var(--zh-primary,#17a899)}

/* U01-U03 PHP layout parity shell overrides */
.admin-shell.zhub-admin-layout{display:grid;grid-template-columns:300px minmax(0,1fr);background:transparent}
.admin-shell .sidebar.zhub-admin-sidebar{min-height:100vh;height:100vh}
.admin-shell .sidebar a.active{background:rgba(255,255,255,.18);color:#fff}
.admin-shell .zhub-admin-topbar{min-height:0;margin-bottom:1rem}
.zhub-public-navbar .zhub-icon-btn{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center}
@media (max-width: 991.98px){.admin-shell.zhub-admin-layout{grid-template-columns:1fr}.admin-shell .sidebar.zhub-admin-sidebar{position:fixed;height:100vh;max-width:min(86vw,320px);transform:translateX(-105%);transition:transform .2s ease}.admin-sidebar-open .admin-shell .sidebar.zhub-admin-sidebar{transform:translateX(0)}}

/* Z99 parity hardening: generic PHP-style data table defaults. */
.zhub-object-table-search { min-width: min(22rem, 100%); }
.zhub-object-table .zhub-select-col { width: 2.75rem; }
.zhub-object-table .zhub-actions-col { width: 7rem; white-space: nowrap; }
.zhub-object-table .zhub-page-size { width: 5.25rem; }
.zhub-object-table tbody td { vertical-align: middle; }

/* Z99 mailbox/mailcenter parity hardening */
.account-item .account-main-button,
.account-item .account-main-button:hover,
.account-item .account-main-button:focus {
    color: inherit;
    box-shadow: none;
}
.account-item .account-row-actions .btn {
    border-radius: 999px;
}
html[data-zhub-navigating="true"] [data-zhub-route-body="true"] {
    opacity: .72;
    transition: opacity .12s ease-in-out;
}

/* Z99 content / commerce / file parity hardening */
.public-php-parity-page .object-fit-cover,
.file-card .object-fit-cover,
.shop-account-card .object-fit-cover,
.blog-hero-card .object-fit-cover {
    object-fit: cover;
}

.file-thumb {
    height: 170px;
}

.zhub-php-parity-crud .table td {
    max-width: 320px;
    overflow-wrap: anywhere;
}

.zhub-php-parity-crud textarea.form-control {
    font-family: inherit;
}

.forum-editor-modal .modal-dialog,
.note-modal.modal-dialog {
    max-width: min(1180px, calc(100vw - 1rem));
}

/* Z99 rich editor + file preview parity */
.zhub-rich-editor-textarea{min-height:320px;font-family:system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.65;resize:vertical}
.zhub-rich-editor-preview{min-height:320px;background:#fff}
.zhub-rich-editor-toolbar .btn{min-width:2.25rem}
.zhub-file-picker-thumb{height:150px;overflow:hidden}
.file-preview-frame{min-height:520px;overflow:auto}
.file-preview-iframe{min-height:520px;border:0;background:#fff}
.file-card .file-thumb{height:170px;overflow:hidden;cursor:pointer}
.shop-account-card .badge{font-weight:600}
.zhub-shop-secret-card code,.zhub-purchase-secret code{user-select:all}
.zhub-rich-editor-preview{cursor:default}
.zhub-rich-editor-textarea:focus{box-shadow:none;outline:0}


/* Z99 editor/manual IMAP patch */
html, body, input, textarea, select, button {
    font-family: "Roboto", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
}

.zhub-rich-editor {
    background: var(--zh-card, #fff);
    color: var(--zh-text, #0f172a);
    box-shadow: 0 10px 30px rgba(15, 23, 42, .06);
}

.zhub-rich-editor-toolbar {
    background: linear-gradient(180deg, rgba(248,250,252,.96), rgba(241,245,249,.92));
    border-color: var(--zh-border, #e2e8f0) !important;
}

.zhub-rich-editor-visual {
    min-height: 260px;
    outline: none;
    background: var(--zh-card, #fff);
    color: var(--zh-text, #0f172a);
    cursor: text;
}

.zhub-rich-editor-visual:empty::before {
    content: attr(data-placeholder);
    color: var(--zh-muted, #64748b);
}

.zhub-rich-editor-visual:focus {
    box-shadow: inset 0 0 0 2px rgba(59, 130, 246, .18);
}

.zhub-rich-editor-html,
.zhub-rich-editor-textarea {
    min-height: 260px;
    font-family: "Roboto Mono", Consolas, "Courier New", monospace;
    background: var(--zh-card, #fff);
    color: var(--zh-text, #0f172a);
}

.zhub-editor-font-select { width: 145px; }
.zhub-editor-size-select { width: 74px; }
.zhub-editor-color { width: 46px; min-height: 31px; padding: .15rem; }

.zhub-file-input-preview {
    width: 180px;
    aspect-ratio: 16 / 9;
    border: 1px solid var(--zh-border, #e2e8f0);
    border-radius: 14px;
    overflow: hidden;
    background: var(--zh-card-2, #f8fafc);
}

.zhub-file-input-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

html[data-theme="dark"] .card,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .table,
html[data-theme="dark"] .list-group-item {
    background-color: var(--zh-card) !important;
    color: var(--zh-text) !important;
    border-color: var(--zh-border) !important;
}

html[data-theme="dark"] .card-header,
html[data-theme="dark"] .card-footer,
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer,
html[data-theme="dark"] .table-light,
html[data-theme="dark"] .bg-light,
html[data-theme="dark"] .bg-white {
    background: var(--zh-card-2) !important;
    color: var(--zh-text) !important;
    border-color: var(--zh-border) !important;
}

html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] .input-group-text {
    background-color: #0b1627 !important;
    color: var(--zh-text) !important;
    border-color: var(--zh-border) !important;
}

html[data-theme="dark"] .form-control::placeholder {
    color: rgba(226, 232, 240, .5);
}

html[data-theme="dark"] .btn-outline-secondary {
    color: #cbd5e1;
    border-color: rgba(148, 163, 184, .4);
}

html[data-theme="dark"] .btn-outline-secondary:hover {
    background: rgba(148, 163, 184, .16);
    color: #fff;
}

/* Z99 smart mail toast UI */
.zhub-js-toast-stack { max-width: min(430px, calc(100vw - 1.25rem)); }
.zhub-toast-glass {
  --bs-toast-color: #fff;
  --bs-toast-bg: transparent;
  color: #fff !important;
  background: linear-gradient(135deg, rgba(15, 23, 42, .98), rgba(30, 64, 175, .97));
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.2) !important;
  backdrop-filter: blur(18px) saturate(150%);
  box-shadow: 0 18px 46px rgba(15, 23, 42, .36), inset 0 1px 0 rgba(255,255,255,.18) !important;
}
.zhub-toast-success { background: linear-gradient(135deg, rgba(6, 78, 59, .99), rgba(21, 128, 61, .98)); }
.zhub-toast-danger { background: linear-gradient(135deg, rgba(127, 29, 29, .99), rgba(190, 18, 60, .98)); }
.zhub-toast-warning { background: linear-gradient(135deg, rgba(120, 53, 15, .99), rgba(194, 65, 12, .98)); }
.zhub-toast-info { background: linear-gradient(135deg, rgba(8, 47, 73, .99), rgba(29, 78, 216, .98)); }
.zhub-toast-primary { background: linear-gradient(135deg, rgba(30, 41, 59, .99), rgba(37, 99, 235, .98)); }
.zhub-toast-secondary { background: linear-gradient(135deg, rgba(51, 65, 85, .99), rgba(71, 85, 105, .98)); }
.zhub-toast-inner { display: grid; grid-template-columns: 46px minmax(0, 1fr) 28px; gap: .75rem; align-items: start; padding: .98rem; }
.zhub-toast-icon { width: 42px; height: 42px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: rgba(255,255,255,.2); box-shadow: inset 0 0 0 1px rgba(255,255,255,.24); font-size: 1.12rem; text-shadow: 0 1px 1px rgba(0,0,0,.25); }
.zhub-toast-content { min-width: 0; color: #fff; }
.zhub-toast-title-row { display: flex; align-items: center; gap: .5rem; min-width: 0; }
.zhub-toast-title-row strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #fff; font-size: .96rem; font-weight: 800; letter-spacing: .01em; text-shadow: 0 1px 1px rgba(0,0,0,.25); }
.zhub-toast-title-row small { margin-left: auto; color: rgba(255,255,255,.88); white-space: nowrap; font-size: .72rem; font-weight: 700; }
.zhub-toast-message { color: #f8fafc; font-size: .9rem; font-weight: 600; line-height: 1.42; margin-top: .24rem; word-break: break-word; text-shadow: 0 1px 1px rgba(0,0,0,.18); }
.zhub-toast-action { display: inline-flex; align-items: center; width: fit-content; margin-top: .58rem; padding: .28rem .62rem; border-radius: 999px; background: rgba(255,255,255,.92); color: #0f172a; font-weight: 800; font-size: .76rem; box-shadow: 0 8px 18px rgba(15,23,42,.2); }
.zhub-toast-close { align-self: start; opacity: .95; filter: drop-shadow(0 1px 1px rgba(0,0,0,.35)); }
.zhub-toast-clickable { cursor: pointer; transition: transform .16s ease, filter .16s ease; }
.zhub-toast-clickable:hover { transform: translateY(-2px); filter: brightness(1.06); }
[data-bs-theme="dark"] .zhub-toast-glass { box-shadow: 0 18px 48px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.16) !important; }

/* Z99 communication/chat parity: compact responsive tables + Messenger-like dock */
.zhub-js-toast-item { color: #fff; }
.zhub-js-toast-item .zhub-toast-message,
.zhub-js-toast-item .zhub-toast-title-row { color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.18); }
.zhub-js-toast-item .zhub-toast-action { display:inline-flex; align-items:center; width:max-content; max-width:100%; margin-top:.35rem; padding:.2rem .55rem; border-radius:999px; background:rgba(255,255,255,.92); color:#0f172a; text-shadow:none; font-weight:800; }
.zhub-toast-primary,.zhub-toast-info { background:linear-gradient(135deg,#1558d6,#1495d8); }
.zhub-toast-success { background:linear-gradient(135deg,#147a45,#21a366); }
.zhub-toast-warning { background:linear-gradient(135deg,#a15c00,#d28a09); }
.zhub-toast-danger { background:linear-gradient(135deg,#b42318,#d64545); }
.zhub-toast-clickable { cursor:pointer; }

.zhub-chat-dock { position:fixed; right:18px; bottom:18px; z-index:1088; }
.zhub-chat-dock[data-zhub-draggable="true"] { right:auto; bottom:auto; touch-action:none; transition:left .18s ease, top .18s ease, transform .16s ease; }
.zhub-chat-dock[data-zhub-dragging="true"] { transition:none; cursor:grabbing; }
.zhub-chat-dock[data-zhub-draggable="true"] .zhub-chat-fab,
.zhub-chat-dock[data-zhub-draggable="true"] .zhub-chat-header { cursor:grab; touch-action:none; -webkit-user-select:none; user-select:none; }
.zhub-chat-dock[data-zhub-dragging="true"] .zhub-chat-fab,
.zhub-chat-dock[data-zhub-dragging="true"] .zhub-chat-header { cursor:grabbing; }
.zhub-chat-dock[data-zhub-dragging="true"] .zhub-chat-fab { transform:scale(1.04); box-shadow:0 18px 42px rgba(37,99,235,.28) !important; }
html.zhub-chat-dragging-page, html.zhub-chat-dragging-page * { cursor:grabbing !important; user-select:none !important; }
.zhub-chat-panel { width:min(390px,calc(100vw - 24px)); max-height:min(720px,calc(100vh - 32px)); background:var(--bs-body-bg); border:1px solid rgba(0,0,0,.08); display:flex; flex-direction:column; }
.zhub-chat-header { padding:.75rem .85rem; color:#fff; background:linear-gradient(135deg,#0d6efd,#6f42c1); }
.zhub-chat-header small { color:rgba(255,255,255,.75); }
.zhub-chat-header-icon { display:inline-grid; place-items:center; width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,.18); }
.zhub-chat-tabs .btn { border-radius:0 !important; }
.zhub-chat-body { min-height:270px; max-height:390px; overflow-y:auto; padding:.75rem; background:linear-gradient(180deg,rgba(13,110,253,.04),rgba(111,66,193,.04)); flex:1 1 auto; }
.zhub-chat-message { display:flex; gap:.55rem; align-items:flex-start; margin-bottom:.65rem; }
.zhub-chat-message.is-me { justify-content:flex-end; }
.zhub-chat-message.is-me .zhub-chat-bubble { flex:0 1 auto; max-width:82%; color:#fff; background:linear-gradient(135deg,#0d6efd,#5b6cff); border-color:transparent; border-bottom-right-radius:.35rem; }
.zhub-chat-message:not(.is-me) .zhub-chat-bubble { border-bottom-left-radius:.35rem; }
.zhub-chat-message.is-me .zhub-chat-meta, .zhub-chat-message.is-me .zhub-chat-meta strong { color:rgba(255,255,255,.82); }
.zhub-chat-message.is-me .zhub-chat-meta span { background:rgba(255,255,255,.18); color:#fff; }
.zhub-chat-message.is-new .zhub-chat-bubble { border-color:rgba(13,110,253,.38); box-shadow:0 8px 24px rgba(13,110,253,.12); }
.zhub-chat-message.is-pending { opacity:.72; }
.zhub-chat-bubble { min-width:0; flex:1; padding:.55rem .65rem; border-radius:1rem; background:var(--bs-body-bg); border:1px solid rgba(0,0,0,.06); }
.zhub-chat-meta { display:flex; flex-wrap:wrap; gap:.35rem; align-items:center; font-size:.76rem; color:var(--bs-secondary-color); }
.zhub-chat-meta strong { color:var(--bs-body-color); max-width:130px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.zhub-chat-meta span { border-radius:999px; padding:.05rem .4rem; background:var(--bs-tertiary-bg); }
.zhub-chat-text { overflow-wrap:anywhere; word-break:break-word; }
.zhub-chat-compose-bottom { flex:0 0 auto; }
.zhub-chat-input-row { display:flex; align-items:center; gap:.45rem; }
.zhub-chat-input-row .form-control { min-height:38px; background:var(--bs-tertiary-bg); border-color:transparent; }
.zhub-chat-send { width:38px; height:38px; display:inline-grid; place-items:center; flex:0 0 auto; }
.zhub-chat-search { position:relative; }
.zhub-user-search-results { position:absolute; left:.5rem; right:.5rem; top:calc(100% - .25rem); max-height:330px; overflow:auto; background:var(--bs-body-bg); border:1px solid rgba(0,0,0,.08); z-index:2; }
.zhub-user-result { width:100%; display:flex; gap:.55rem; align-items:center; padding:.5rem .6rem; border:0; background:transparent; text-align:left; }
.zhub-user-result:hover { background:var(--bs-tertiary-bg); }
.zhub-avatar-img,.zhub-avatar-fallback { flex:0 0 auto; border-radius:50%; object-fit:cover; box-shadow:0 0 0 2px rgba(255,255,255,.85); }
.zhub-avatar-fallback { display:inline-grid; place-items:center; font-weight:800; color:#fff; background:linear-gradient(135deg,#0d6efd,#6f42c1); }
.zhub-chat-fab { position:relative; display:inline-grid; place-items:center; width:58px; height:58px; border-radius:50%; border:0; color:#fff; background:linear-gradient(135deg,#0d6efd,#6f42c1); font-size:1.35rem; }
.zhub-chat-fab .badge { position:absolute; top:-4px; right:-4px; }

.table, .zhub-object-table, .data-table, .admin-table { table-layout:fixed; width:100%; }
.table th, .table td, .zhub-object-table th, .zhub-object-table td, .data-table th, .data-table td, .admin-table th, .admin-table td { white-space:normal !important; overflow-wrap:anywhere; word-break:break-word; vertical-align:middle; }
.table-responsive { scrollbar-width:thin; }
.zhub-admin-content .table-responsive, .zhub-public-layout .table-responsive { overflow-x:auto; }
@media (min-width: 992px) {
  .zhub-admin-content .table-responsive, .zhub-public-layout .table-responsive { overflow-x:visible; }
  .zhub-admin-content table, .zhub-public-layout table { font-size:.92rem; }
}
@media (max-width: 575.98px) {
  .zhub-chat-dock { right:8px; bottom:8px; left:8px; }
  .zhub-chat-panel { width:100%; max-height:calc(100vh - 16px); }
  .zhub-chat-body { max-height:calc(100vh - 330px); }
  .zhub-chat-fab { margin-left:auto; }
  .zhub-chat-dock[data-zhub-draggable="true"] { left:auto; right:auto; bottom:auto; width:max-content; max-width:calc(100vw - 16px); }
  .zhub-chat-dock[data-zhub-draggable="true"].is-open { width:auto; }
  .zhub-chat-dock[data-zhub-draggable="true"] .zhub-chat-panel { width:min(390px, calc(100vw - 16px)); max-height:calc(100vh - 16px); }
  .zhub-chat-dock[data-zhub-draggable="true"] .zhub-chat-fab { margin-left:0; }
}


/* Z99 release + mailbox iframe theme injection */
.viewer-frame.zhub-mail-frame,
iframe[data-zhub-mail-frame="true"] {
    width: 100%;
    min-height: min(62vh, 680px);
    border: 1px solid var(--zh-border, #d8e2ed);
    border-radius: 16px;
    background: var(--zh-card, #fff);
    color: var(--zh-text, #0f172a);
    display: block;
}
.zhub-mail-detail-tabs,
.zhub-mail-html-viewer,
.zhub-mail-text-viewer {
    background: var(--zh-card, #fff) !important;
    color: var(--zh-text, #0f172a) !important;
    border-color: var(--zh-border, #d8e2ed) !important;
}
html[data-theme="dark"] .viewer-frame.zhub-mail-frame,
html[data-theme="dark"] iframe[data-zhub-mail-frame="true"] {
    background: #0b1220;
    color: #e5edf8;
}
@media (max-width: 768px) {
    .viewer-frame.zhub-mail-frame,
    iframe[data-zhub-mail-frame="true"] {
        min-height: 56vh;
        border-radius: 12px;
    }
}

/* B32: Blazor-native SignalR toast should always render above public/admin shells. */
.zhub-toast-stack {
  z-index: 1125;
}

.zhub-toast-stack .zhub-toast-item {
  animation: zhubToastSlideIn .18s ease-out;
}

@keyframes zhubToastSlideIn {
  from { opacity: 0; transform: translateY(8px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* B33 compact CRUD/table + MySQL CSS theme manager */
.zhub-compact-table-wrap { max-width: 100%; overflow: auto; }
.zhub-compact-data-table th, .zhub-compact-data-table td, .zhub-auto-compact-table th, .zhub-auto-compact-table td { vertical-align: top; }
.zhub-short-group-cell { min-width: 220px; line-height: 1.45; }
.zhub-short-group-cell > div { border-bottom: 1px dashed rgba(148,163,184,.35); padding: .12rem 0; }
.zhub-short-group-cell > div:last-child { border-bottom: 0; }
.zhub-long-scroll-cell, .zhub-auto-long-cell { max-width: 420px; }
.zhub-long-scroll-cell { max-height: 150px; overflow: auto; border: 1px solid rgba(148,163,184,.35); background: rgba(248,250,252,.86); border-radius: 12px; padding: .65rem; }
.zhub-long-scroll-cell pre, .zhub-theme-preview-box pre { white-space: pre-wrap; word-break: break-word; margin: 0; font-size: .78rem; }
.zhub-auto-long-cell { max-height: 160px; overflow: auto; white-space: normal; word-break: break-word; }
.zhub-auto-short-cell { white-space: normal; }
.zhub-theme-choice-card { transition: transform .16s ease, box-shadow .16s ease; }
.zhub-theme-choice-card:hover { transform: translateY(-2px); box-shadow: 0 18px 44px rgba(15,23,42,.12) !important; }
.zhub-theme-preview-box { max-height: 130px; overflow: auto; border: 1px solid rgba(148,163,184,.35); border-radius: 14px; padding: .75rem; background: rgba(248,250,252,.84); }
[data-theme="dark"] .zhub-long-scroll-cell, [data-theme="dark"] .zhub-theme-preview-box { background: rgba(15,23,42,.72); border-color: rgba(148,163,184,.24); }
@media (max-width: 767.98px) {
  .zhub-auto-compact-table { min-width: 720px; }
  .zhub-long-scroll-cell, .zhub-auto-long-cell { max-width: 280px; }
}

/* B64 - mobile-friendly desktop skin after removing physical *Mobile route/layout runtime. */
.zhub-html-clamp {
    --zhub-clamp-lines: 2;
    display: -webkit-box;
    -webkit-line-clamp: var(--zhub-clamp-lines);
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
    overflow-wrap: anywhere;
    max-width: 100%;
}
.zhub-html-clamp :where(p,div,h1,h2,h3,h4,h5,h6,blockquote,ul,ol) {
    display: inline;
    margin: 0;
    padding: 0;
}
.zhub-html-clamp :where(br) { display: none; }
.zhub-html-clamp :where(img,video,iframe,table,pre,code) { display: none !important; }
.zhub-card-title { color: var(--bs-heading-color, #0f172a); font-weight: 800; line-height: 1.25; }
.zhub-card-summary { line-height: 1.55; }

.admin-shell .admin-mobile-toggle,
.admin-shell .admin-sidebar-backdrop { display: none; }
.admin-shell .admin-sidebar-backdrop { border: 0; padding: 0; }
@media (max-width: 991.98px) {
    .admin-shell.zhub-admin-layout { display: block !important; }
    .admin-shell .sidebar.zhub-admin-sidebar {
        position: fixed !important;
        inset: 0 auto 0 0 !important;
        width: min(86vw, 340px) !important;
        max-width: min(86vw, 340px) !important;
        height: 100dvh !important;
        min-height: 100dvh !important;
        overflow-y: auto !important;
        transform: translateX(-108%) !important;
        transition: transform .22s ease !important;
        z-index: 1045 !important;
        box-shadow: 0 24px 70px rgba(15,23,42,.28) !important;
    }
    html.admin-sidebar-open .admin-shell .sidebar.zhub-admin-sidebar,
    .admin-sidebar-open .admin-shell .sidebar.zhub-admin-sidebar {
        transform: translateX(0) !important;
    }
    .admin-shell .admin-mobile-toggle,
    body > .admin-mobile-toggle {
        display: inline-flex !important;
        align-items: center;
        gap: .45rem;
        position: fixed !important;
        left: 1rem !important;
        bottom: calc(1rem + env(safe-area-inset-bottom, 0px)) !important;
        z-index: 1055 !important;
        border: 1px solid rgba(15,23,42,.1) !important;
        background: rgba(255,255,255,.96) !important;
        color: #0f172a !important;
        border-radius: 999px !important;
        padding: .72rem 1rem !important;
        font-weight: 900 !important;
        box-shadow: 0 16px 42px rgba(15,23,42,.18) !important;
    }
    .admin-shell .admin-sidebar-backdrop,
    body > .admin-sidebar-backdrop {
        position: fixed !important;
        inset: 0 !important;
        z-index: 1040 !important;
        background: rgba(15,23,42,.48) !important;
        backdrop-filter: blur(5px) !important;
    }
    html.admin-sidebar-open .admin-shell .admin-sidebar-backdrop,
    html.admin-sidebar-open body > .admin-sidebar-backdrop,
    .admin-sidebar-open .admin-shell .admin-sidebar-backdrop {
        display: block !important;
    }
    .admin-shell .zhub-admin-content,
    .zhub-admin-content {
        padding: 1rem .78rem 5.25rem !important;
        width: 100% !important;
        max-width: 100vw !important;
        overflow-x: hidden !important;
    }
    .zhub-admin-topbar {
        border-radius: 1.15rem !important;
        background: rgba(255,255,255,.78) !important;
        backdrop-filter: blur(12px) !important;
        padding: .85rem !important;
        box-shadow: 0 12px 32px rgba(15,23,42,.08) !important;
    }
}

@media (max-width: 575.98px) {
    html { font-size: 15px; }
    body { -webkit-text-size-adjust: 100%; text-rendering: optimizeLegibility; }
    .container, .container-fluid { padding-left: .85rem !important; padding-right: .85rem !important; }
    h1, .h1 { font-size: clamp(1.55rem, 7vw, 2.05rem) !important; line-height: 1.16; letter-spacing: -.025em; }
    h2, .h2 { font-size: clamp(1.28rem, 5.6vw, 1.65rem) !important; line-height: 1.2; letter-spacing: -.018em; }
    h3, .h3 { font-size: clamp(1.12rem, 4.8vw, 1.38rem) !important; line-height: 1.24; }
    .h4, h4 { font-size: 1.08rem !important; }
    .h5, h5 { font-size: 1rem !important; }
    p, .text-muted, .small { line-height: 1.55; }
    .small { font-size: .84rem; }
    .card, .zhub-card, .zhub-search-box, .zhub-hero-panel {
        border-radius: 1.18rem !important;
        box-shadow: 0 12px 34px rgba(15,23,42,.08) !important;
    }
    .card-body, .zhub-card-body { padding: 1rem !important; }
    .btn { border-radius: .9rem; font-weight: 800; }
    .btn-sm { border-radius: .78rem; }
    .form-control, .form-select, .input-group-text { border-radius: .9rem; min-height: 42px; }
    .input-group > .form-control:not(:first-child), .input-group > .form-select:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
    .input-group > .form-control:not(:last-child), .input-group > .form-select:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
    .zhub-card-title { font-size: 1.02rem !important; letter-spacing: -.01em; }
    .zhub-card-summary { font-size: .88rem !important; }
    .blog-hero-card .card-body { padding: 1.1rem !important; }
    .list-group-item { border-radius: 1rem !important; margin-bottom: .65rem; border: 1px solid rgba(15,23,42,.08) !important; }
    .table-responsive { border-radius: 1rem; }
}

/* B80: smooth SPA/mail scroll targets */
html {
    scroll-behavior: smooth;
}

#admin-mail-account-section,
#admin-mail-list-section,
#adminMailViewerPane,
#mailbox-account-section,
#mailbox-email-section,
#mailbox-viewer-section,
#mailViewerPane,
#mailbox-game-note-section,
[data-mail-account-id],
[data-admin-mail-id],
.account-item,
.mail-item {
    scroll-margin-top: 88px;
}

.zhub-scroll-focus {
    animation: zhub-scroll-focus-pulse 1.35s ease-out 1;
}

.account-item,
.mail-item,
[data-mail-account-id],
[data-admin-mail-id],
.zhub-card,
.card,
.table tbody tr,
.btn {
    transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease, opacity .18s ease;
}

@keyframes zhub-scroll-focus-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(13, 110, 253, .32);
        transform: translateY(-1px);
    }
    65% {
        box-shadow: 0 0 0 .5rem rgba(13, 110, 253, 0);
        transform: translateY(0);
    }
    100% {
        box-shadow: none;
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    .zhub-scroll-focus,
    .account-item,
    .mail-item,
    [data-mail-account-id],
    [data-admin-mail-id],
    .zhub-card,
    .card,
    .table tbody tr,
    .btn {
        animation: none !important;
        transition: none !important;
    }
}

/* B63 form layout hardening: keep PHP form->table columns; only roles picker owns a full row. */

textarea.form-control,
.zhub-rich-editor,
.zhub-full-width-editor,
.zhub-rich-editor .zhub-rich-editor-textarea,
.zhub-rich-editor .zhub-rich-editor-visual,
.zhub-role-checkbox-picker {
    display: block;
    width: 100%;
    max-width: 100%;
}

.zhub-rich-editor,
.zhub-full-width-editor {
    grid-column: auto;
}

/* B63 Launcher PHP manager split: keep form/tooling on the left and data table on the right, like PHP manager pages. */
.zhub-launcher-php-manager {
    display: grid;
    grid-template-columns: minmax(320px, 420px) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.zhub-launcher-php-manager > form,
.zhub-launcher-php-manager > form + .card:not(.zhub-launcher-crud-panel) {
    grid-column: 1;
}

.zhub-launcher-php-manager > .zhub-launcher-crud-panel {
    grid-column: 2;
}

.zhub-launcher-php-manager > .card:not(.zhub-launcher-crud-panel):not(:has(+ .zhub-launcher-crud-panel)) {
    grid-column: 2;
}

@media (max-width: 991.98px) {
    .zhub-launcher-php-manager {
        display: block;
    }
}

/* B83 Story novel/comic module */
.zhub-story-page{--story-accent:var(--bs-primary,#0d6efd);--story-warm:#f59e0b}.story-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,520px);gap:1.25rem;align-items:center;padding:1.5rem;border-radius:1.5rem;background:linear-gradient(135deg,rgba(13,110,253,.12),rgba(245,158,11,.12));box-shadow:0 10px 30px rgba(0,0,0,.08)}.story-hero h1{font-weight:800;margin:0}.story-hero p{margin:.4rem 0 0;color:var(--bs-secondary-color,#6c757d)}.story-eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.75rem;font-weight:700;color:var(--story-accent)}.story-search-box{display:flex;gap:.5rem}.story-section{background:var(--bs-body-bg,#fff);border:1px solid rgba(127,127,127,.12);border-radius:1.25rem;padding:1rem;box-shadow:0 10px 24px rgba(0,0,0,.05)}.story-section-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}.story-section-head h2{font-size:1.1rem;margin:0;font-weight:800;color:var(--story-warm)}.story-cover-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(122px,1fr));gap:1rem}.story-cover-grid-featured{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.story-card{text-decoration:none;color:inherit;min-width:0}.story-card strong{display:block;margin-top:.55rem;font-size:.95rem;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.story-card small{color:var(--bs-secondary-color,#6c757d)}.story-cover{position:relative;aspect-ratio:3/4;border-radius:.75rem;overflow:hidden;background:#151515}.story-cover img{width:100%;height:100%;object-fit:cover;transition:transform .22s ease}.story-card:hover img{transform:scale(1.04)}.story-cover-empty{width:100%;height:100%;display:grid;place-items:center;background:linear-gradient(135deg,#e9ecef,#ced4da);color:#6c757d;font-size:2rem}.story-badge{position:absolute;top:.35rem;left:.35rem;border-radius:.35rem;padding:.15rem .35rem;font-size:.7rem;font-weight:700;color:#fff;background:var(--story-accent)}.story-badge.new{left:auto;right:.35rem;background:#22c55e}.story-badge.hot{background:#ef4444}.story-badge.score{background:#2563eb}.story-category-tags{display:flex;gap:.5rem;flex-wrap:wrap}.story-tag{border:1px solid rgba(245,158,11,.45);background:transparent;color:var(--story-warm);border-radius:.6rem;padding:.35rem .65rem}.story-tag.active,.story-tag:hover{background:var(--story-warm);color:#111}.story-update-list{border-radius:1rem;overflow:hidden;border:1px solid rgba(127,127,127,.12)}.story-update-row{display:grid;grid-template-columns:minmax(0,1fr) 120px 90px;gap:.75rem;align-items:center;padding:.65rem .85rem;text-decoration:none;color:inherit;border-bottom:1px solid rgba(127,127,127,.1)}.story-update-row:hover{background:rgba(13,110,253,.06)}.story-update-row em{font-style:normal;font-size:.7rem;color:#ef4444;border:1px solid #ef4444;border-radius:.25rem;padding:0 .25rem}.story-sidebar-card{background:var(--bs-body-bg,#fff);border:1px solid rgba(127,127,127,.12);border-radius:1.25rem;padding:1rem;box-shadow:0 10px 24px rgba(0,0,0,.05)}.story-sidebar-card h3{font-size:1rem;font-weight:800;margin-bottom:1rem}.story-side-cats{display:grid;grid-template-columns:1fr 1fr;gap:.4rem}.story-side-cats button{border:0;background:rgba(127,127,127,.08);border-radius:.5rem;padding:.35rem;text-align:left}.story-rank-row{display:flex;gap:.7rem;text-decoration:none;color:inherit;padding:.55rem 0;border-bottom:1px dashed rgba(127,127,127,.22)}.story-rank-row>span{width:1.6rem;height:1.6rem;border-radius:50%;display:grid;place-items:center;background:var(--story-accent);color:#fff;font-weight:800;font-size:.78rem}.story-rank-row strong{display:block;font-size:.9rem;line-height:1.2}.story-rank-row small{color:var(--bs-secondary-color,#6c757d)}.story-breadcrumb{display:flex;gap:.5rem;align-items:center;font-size:.9rem}.story-breadcrumb a{text-decoration:none}.story-detail-hero{display:grid;grid-template-columns:180px minmax(0,1fr);gap:1.25rem;background:var(--bs-body-bg,#fff);border-radius:1.25rem;padding:1.25rem;box-shadow:0 12px 30px rgba(0,0,0,.08)}.story-detail-cover{aspect-ratio:3/4;border-radius:.8rem;overflow:hidden;background:#151515}.story-detail-cover img{width:100%;height:100%;object-fit:cover}.story-detail-info h1{font-size:1.6rem;font-weight:800}.story-meta-line{display:flex;gap:.6rem;flex-wrap:wrap;margin:.65rem 0}.story-meta-line span{background:rgba(127,127,127,.1);border-radius:999px;padding:.25rem .65rem}.story-summary-text{font-size:1rem;line-height:1.75}.story-chapter-list{max-height:520px;overflow:auto;border-radius:.75rem;border:1px solid rgba(127,127,127,.12)}.story-chapter-list a{display:flex;justify-content:space-between;gap:1rem;text-decoration:none;color:inherit;padding:.7rem .9rem;border-bottom:1px solid rgba(127,127,127,.1)}.story-chapter-list a:hover{background:rgba(13,110,253,.06)}.zhub-reader-page{min-height:100vh;background:linear-gradient(180deg,rgba(127,127,127,.08),transparent)}.reader-title h1{font-size:1.35rem;font-weight:800;color:var(--bs-primary,#0d6efd);margin:0}.reader-title p{color:var(--bs-secondary-color,#6c757d);margin:0}.reader-toolbar{display:flex;justify-content:center;gap:.6rem;flex-wrap:wrap}.reader-chapter-drawer{max-height:260px;overflow:auto;border-radius:1rem;background:#fff;padding:.75rem;box-shadow:0 10px 25px rgba(0,0,0,.06)}.reader-chapter-drawer a{display:inline-block;margin:.25rem;padding:.35rem .55rem;border-radius:.5rem;background:#f1f3f5;text-decoration:none}.reader-chapter-drawer a.active{background:var(--bs-primary,#0d6efd);color:#fff}.novel-content-card{max-width:860px;margin:0 auto;background:#fff;border-radius:1.25rem;padding:2.5rem;font-family:Georgia,'Times New Roman',serif;font-size:1.18rem;line-height:2.05;box-shadow:0 10px 28px rgba(0,0,0,.06)}.novel-content-card p{margin-bottom:1.4rem}.comic-slide-shell{display:grid;grid-template-columns:250px minmax(0,1fr);gap:1.25rem;align-items:start}.comic-chapter-sidebar{position:sticky;top:1rem;max-height:calc(100vh - 2rem);overflow:auto;background:#fff;border-radius:1rem;padding:.75rem;box-shadow:0 10px 28px rgba(0,0,0,.07)}.comic-chapter-sidebar a{display:block;text-decoration:none;padding:.6rem .75rem;border-radius:.6rem}.comic-chapter-sidebar a.active,.comic-chapter-sidebar a:hover{background:var(--bs-primary,#0d6efd);color:#fff}.comic-slide-viewer{background:#fff;border-radius:1.25rem;padding:1rem;box-shadow:0 10px 28px rgba(0,0,0,.08)}.comic-slide-card{text-align:center}.comic-slide-card img{max-width:100%;max-height:78vh;object-fit:contain;border-radius:.75rem}.comic-slide-controls{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:1rem}.story-admin-thumb{width:46px;height:62px;object-fit:cover;border-radius:.45rem;background:#f1f3f5}.zhub-story-admin textarea{font-family:inherit}@media(max-width:991.98px){.story-hero{grid-template-columns:1fr}.story-search-box{flex-direction:column}.story-update-row{grid-template-columns:1fr}.story-detail-hero{grid-template-columns:120px 1fr}.comic-slide-shell{grid-template-columns:1fr}.comic-chapter-sidebar{position:relative;max-height:240px}.novel-content-card{padding:1.25rem;font-size:1.05rem}.story-cover-grid{grid-template-columns:repeat(auto-fill,minmax(105px,1fr))}}@media(max-width:575.98px){.story-detail-hero{grid-template-columns:1fr}.story-detail-cover{max-width:180px}.story-side-cats{grid-template-columns:1fr}.reader-toolbar .btn{flex:1 1 auto}}

/* B85 story admin split layout + comic slide reader */
.zhub-story-admin-list .zhub-admin-data-table td{vertical-align:middle}.story-admin-thumb-lg{width:72px;height:96px;object-fit:cover;border-radius:.75rem;background:#f1f3f5}.story-edit-card{border-radius:1.25rem;overflow:hidden}.story-editor-summary,.story-chapter-text-editor,.story-image-url-editor{min-height:360px;line-height:1.7}.story-chapter-text-editor{font-family:Georgia,'Times New Roman',serif;font-size:1.05rem}.story-image-url-editor{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,'Liberation Mono','Courier New',monospace}.story-category-checks{max-height:360px;overflow:auto;border:1px solid rgba(127,127,127,.18);border-radius:1rem;padding:.75rem;background:rgba(127,127,127,.04)}.story-category-check{display:flex;align-items:center;gap:.5rem;padding:.45rem .55rem;border-radius:.65rem;cursor:pointer}.story-category-check:hover{background:rgba(13,110,253,.08)}.story-cover-preview-card{border-radius:1rem;overflow:hidden}.story-cover-preview-card img{width:100%;max-height:430px;object-fit:cover}.story-image-preview-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:.5rem;max-height:420px;overflow:auto}.story-image-preview-list img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:.6rem;background:#f1f3f5}.story-category-desc{max-width:440px}.comic-slide-reader-mode .comic-sidebar-title{font-weight:800;margin:.25rem .5rem .6rem;color:var(--bs-primary,#0d6efd)}.comic-slide-status{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:.75rem;color:var(--bs-secondary-color,#6c757d);font-size:.92rem}.comic-slide-status span:first-child{font-weight:800;color:var(--bs-primary,#0d6efd)}.comic-slide-reader-mode .comic-slide-card{cursor:pointer;min-height:360px;display:grid;place-items:center;background:rgba(127,127,127,.06);border-radius:1rem;padding:.75rem}.comic-slide-reader-mode .comic-slide-card img{max-height:82vh}.comic-slide-counter{font-weight:800;min-width:82px;text-align:center}.comic-slide-thumbs{display:flex;gap:.5rem;overflow-x:auto;padding:.75rem .25rem .25rem;margin-top:.75rem}.comic-slide-thumbs button{position:relative;flex:0 0 62px;border:2px solid transparent;border-radius:.65rem;background:rgba(127,127,127,.08);padding:.2rem;overflow:hidden}.comic-slide-thumbs button.active{border-color:var(--bs-primary,#0d6efd)}.comic-slide-thumbs img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:.45rem}.comic-slide-thumbs span{position:absolute;left:.25rem;bottom:.25rem;background:rgba(0,0,0,.68);color:#fff;font-size:.7rem;border-radius:.35rem;padding:0 .25rem}@media(max-width:991.98px){.story-editor-summary,.story-chapter-text-editor,.story-image-url-editor{min-height:280px}.comic-slide-status{font-size:.82rem}.comic-slide-thumbs button{flex-basis:54px}}

/* B87 story chapter editor polish: rich text novel editor + sorted comic image rows */
.story-summary-rich-editor .zhub-rich-editor-visual,
.story-novel-rich-editor .zhub-rich-editor-visual{min-height:520px;line-height:1.8;font-size:1.03rem}
.story-novel-rich-editor .zhub-rich-editor-visual{font-family:Georgia,'Times New Roman',serif;font-size:1.12rem;line-height:2.05}
.story-comic-image-builder{display:flex;flex-direction:column;gap:.75rem}
.story-comic-image-row{display:grid;grid-template-columns:86px minmax(220px,1fr) minmax(220px,.8fr) auto;gap:.75rem;align-items:end;border:1px solid rgba(127,127,127,.18);background:rgba(127,127,127,.035);border-radius:1rem;padding:.75rem}
.story-comic-image-row:hover{background:rgba(13,110,253,.055);border-color:rgba(13,110,253,.22)}
.story-comic-image-actions{display:flex;gap:.45rem;align-items:center;justify-content:flex-end}.story-comic-image-actions .btn{width:38px;height:38px;display:grid;place-items:center;padding:0}
.story-comic-image-file input[type=file]{max-width:100%;font-size:.85rem}.story-image-preview-item{position:relative}.story-image-preview-item span{position:absolute;left:.35rem;bottom:.35rem;background:rgba(0,0,0,.68);color:#fff;border-radius:.4rem;font-size:.72rem;padding:.05rem .35rem}
@media(max-width:991.98px){.story-summary-rich-editor .zhub-rich-editor-visual,.story-novel-rich-editor .zhub-rich-editor-visual{min-height:360px}.story-comic-image-row{grid-template-columns:76px 1fr}.story-comic-image-file,.story-comic-image-actions{grid-column:1 / -1}.story-comic-image-actions{justify-content:flex-start}}
.story-category-rich-editor .zhub-rich-editor-visual{min-height:220px;line-height:1.7}

/* B89 home/news layout, story save feedback, currency UI, footer online stats */
.story-save-feedback{box-shadow:0 10px 24px rgba(25,135,84,.12);border:0}.story-save-feedback .btn{border-radius:999px}.zhub-news-index{background:var(--bs-body-bg,#fff)}.news-topline{display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid rgba(127,127,127,.16);padding-bottom:.75rem}.news-topline-left{display:flex;align-items:center;gap:.75rem;color:var(--bs-secondary-color,#6c757d);font-weight:700}.news-index-search{display:flex;min-width:min(420px,100%);border:1px solid rgba(127,127,127,.24);border-radius:999px;overflow:hidden;background:var(--bs-body-bg,#fff)}.news-index-search input{border:0;outline:0;flex:1;padding:.55rem 1rem;background:transparent;color:inherit}.news-index-search button{border:0;background:var(--bs-primary,#0d6efd);color:#fff;width:46px}.news-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:1.5rem;align-items:start}.news-hero-main{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:1rem}.news-lead-card,.news-small-card,.news-tile-card,.news-multi-card{text-decoration:none;color:inherit}.news-lead-image,.news-small-card>img,.news-small-card>.news-image-empty,.news-tile-card>img,.news-tile-card>.news-image-empty,.news-multi-card>img,.news-multi-card>.news-image-empty{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:.35rem;background:rgba(127,127,127,.12)}.news-lead-card h1{font-size:1.28rem;line-height:1.25;margin:.75rem 0 .35rem;font-weight:800}.news-lead-card p{color:var(--bs-secondary-color,#6c757d);line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.news-small-grid{display:grid;grid-template-columns:1fr 1fr;gap:.85rem}.news-small-card strong,.news-tile-card strong{display:block;font-size:.92rem;line-height:1.35;margin-top:.45rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.news-small-card:hover strong,.news-tile-card:hover strong,.news-side-row:hover span,.news-rank-row:hover strong,.story-home-row:hover span,.story-home-comic:hover strong{color:var(--bs-primary,#0d6efd)}.news-side-card,.news-block,.news-sidebar-box{background:var(--bs-body-bg,#fff);border:1px solid rgba(127,127,127,.14);border-radius:.75rem;box-shadow:0 10px 24px rgba(0,0,0,.04);padding:1rem}.news-side-tabs{display:flex;justify-content:space-between;border-bottom:1px solid rgba(127,127,127,.14);padding-bottom:.65rem;margin-bottom:.35rem}.news-side-row{display:flex;gap:.55rem;text-decoration:none;color:inherit;padding:.62rem 0;border-bottom:1px dashed rgba(127,127,127,.18);font-size:.94rem;line-height:1.35}.news-side-row i{color:var(--bs-primary,#0d6efd);margin-top:.15rem}.news-category-strip{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center}.news-category-strip a{border:1px solid rgba(13,110,253,.24);background:rgba(13,110,253,.06);border-radius:999px;padding:.38rem .9rem;text-decoration:none;font-size:.92rem;font-weight:700}.news-block-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}.news-block-head h2{font-size:1.2rem;line-height:1.25;margin:0;font-weight:800}.news-block-head a{font-size:.9rem;text-decoration:none}.news-card-grid{display:grid;gap:1rem}.news-card-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.news-tile-card small{color:var(--bs-secondary-color,#6c757d)}.story-home-list{border-top:1px solid rgba(127,127,127,.12)}.story-home-row{display:grid;grid-template-columns:minmax(0,1fr) 130px 64px;gap:.75rem;align-items:center;text-decoration:none;color:inherit;padding:.72rem 0;border-bottom:1px solid rgba(127,127,127,.11)}.story-home-row span{font-weight:650;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.story-home-row em{font-style:normal;color:var(--bs-primary,#0d6efd);font-size:.88rem}.story-home-row small{color:var(--bs-secondary-color,#6c757d);text-align:right}.story-home-comic-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem}.story-home-comic{text-decoration:none;color:inherit}.story-home-comic>div{aspect-ratio:3/4;border-radius:.55rem;overflow:hidden;background:rgba(127,127,127,.12);display:grid;place-items:center}.story-home-comic img{width:100%;height:100%;object-fit:cover}.story-home-comic strong{display:block;margin-top:.45rem;font-size:.9rem;line-height:1.28;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.story-home-comic small{color:var(--bs-secondary-color,#6c757d)}.news-rank-row{display:flex;gap:.75rem;text-decoration:none;color:inherit;padding:.7rem 0;border-bottom:1px dashed rgba(127,127,127,.18)}.news-rank-row span{flex:0 0 1.8rem;width:1.8rem;height:1.8rem;border-radius:50%;display:grid;place-items:center;background:var(--bs-primary,#0d6efd);color:#fff;font-weight:800}.news-rank-row strong{font-size:.95rem;line-height:1.35}.news-multimedia{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding:2rem max(1rem,calc(50vw - 660px));background:linear-gradient(135deg,var(--bs-primary,#0d6efd),#02a9d6);color:#fff}.news-multimedia .news-block-head a{color:#fff;margin-left:1rem}.news-multi-grid{display:grid;grid-template-columns:2fr repeat(4,1fr);gap:1rem}.news-multi-card strong{display:block;color:#fff;margin-top:.45rem;line-height:1.35}.news-image-empty{display:grid!important;place-items:center;color:var(--bs-secondary-color,#6c757d);font-size:1.6rem}.currency-wallet-card{border-radius:1.25rem;overflow:hidden}.currency-preset-row{display:flex;gap:.5rem;flex-wrap:wrap}.currency-balance-preview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}.currency-balance-preview>div{border:1px solid rgba(127,127,127,.14);background:rgba(127,127,127,.045);border-radius:1rem;padding:.9rem}.currency-balance-preview span{display:block;color:var(--bs-secondary-color,#6c757d);font-size:.82rem}.currency-balance-preview strong{font-size:1.05rem}.currency-chip-list{display:flex;flex-wrap:wrap;gap:.6rem}.currency-chip{border:1px solid rgba(13,110,253,.22);background:rgba(13,110,253,.055);border-radius:999px;padding:.5rem .75rem;display:flex;align-items:center;gap:.45rem}.currency-chip span{color:var(--bs-secondary-color,#6c757d)}.currency-chip em{font-style:normal;font-size:.72rem;background:var(--bs-primary,#0d6efd);color:#fff;border-radius:999px;padding:.1rem .4rem}.zhub-public-mini-footer{border-top:1px solid rgba(127,127,127,.12);padding:.55rem 1rem;background:rgba(127,127,127,.035)}.zhub-online-footer{display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap;color:var(--bs-secondary-color,#6c757d);font-size:.78rem}.zhub-online-footer span{display:inline-flex;align-items:center;gap:.3rem}.zhub-online-footer strong{color:var(--bs-body-color,#212529)}.novel-content-card{font-size:1.28rem;line-height:2.28;letter-spacing:.01em;max-width:920px}.novel-content-card p,.novel-content-card div,.novel-content-card li{line-height:2.28}.novel-content-card p{margin-bottom:1.85rem}.story-summary-text{font-size:1.06rem;line-height:1.95}.story-summary-text p{margin-bottom:1.1rem}.reader-title h1{font-size:1.55rem}.reader-title p{font-size:1rem}.story-chapter-list a{padding:.9rem 1rem;line-height:1.45}@media(max-width:1199.98px){.news-hero-grid{grid-template-columns:1fr}.news-hero-main{grid-template-columns:1fr}.news-card-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.story-home-comic-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.news-multi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:767.98px){.news-topline{align-items:stretch;flex-direction:column}.news-index-search{min-width:0}.news-small-grid,.news-card-grid-4,.currency-balance-preview{grid-template-columns:1fr}.story-home-row{grid-template-columns:1fr}.story-home-row small{text-align:left}.story-home-comic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.news-multi-grid{grid-template-columns:1fr 1fr}.novel-content-card{font-size:1.12rem;line-height:2;padding:1.35rem}.novel-content-card p,.novel-content-card div,.novel-content-card li{line-height:2}}

/* B90 story editor library picker, modal/form polish and reader readability */
[data-zhub-modal="true"] .modal-dialog {
    width: min(1360px, calc(100vw - 2rem));
    max-width: min(1360px, calc(100vw - 2rem));
    margin: 1.25rem auto;
}

[data-zhub-modal="true"] .modal-dialog.modal-lg {
    max-width: min(1180px, calc(100vw - 2rem));
}

[data-zhub-modal="true"] .modal-dialog.modal-sm {
    max-width: min(560px, calc(100vw - 2rem));
}

[data-zhub-modal="true"] .modal-content {
    border: 0;
    border-radius: 1.25rem;
    overflow: hidden;
    box-shadow: 0 28px 80px rgba(15, 23, 42, .2);
}

[data-zhub-modal="true"] .modal-header,
[data-zhub-modal="true"] .modal-footer {
    background: linear-gradient(180deg, rgba(248, 250, 252, .96), rgba(241, 245, 249, .88));
    border-color: rgba(127, 127, 127, .14);
}

[data-zhub-modal="true"] .modal-body {
    max-height: min(78vh, 840px);
    overflow: auto;
    padding: 1.25rem;
    background: linear-gradient(180deg, rgba(248, 250, 252, .35), rgba(255,255,255,.96));
}

[data-zhub-modal="true"] .form-control,
[data-zhub-modal="true"] .form-select,
.zhub-story-editor-page .form-control,
.zhub-story-editor-page .form-select,
.zhub-story-chapter-editor-page .form-control,
.zhub-story-chapter-editor-page .form-select {
    border-radius: .9rem;
    border-color: rgba(127, 127, 127, .2);
    min-height: 42px;
}

[data-zhub-modal="true"] .form-label,
.zhub-story-editor-page .form-label,
.zhub-story-chapter-editor-page .form-label {
    font-weight: 700;
    color: var(--bs-body-color, #111827);
}

.story-cover-library-field .zhub-file-input-preview {
    width: 220px;
    aspect-ratio: 3 / 4;
    box-shadow: 0 14px 28px rgba(15, 23, 42, .12);
}

.story-comic-image-url .zhub-file-library-input .input-group,
.story-cover-library-field .zhub-file-library-input .input-group {
    box-shadow: 0 10px 22px rgba(15, 23, 42, .05);
    border-radius: .95rem;
}

.story-comic-image-url .zhub-file-library-input .form-control,
.story-comic-image-url .zhub-file-library-input .btn,
.story-cover-library-field .zhub-file-library-input .form-control,
.story-cover-library-field .zhub-file-library-input .btn {
    min-height: 42px;
}

.story-save-feedback {
    position: sticky;
    top: .75rem;
    z-index: 10;
}

.story-novel-rich-editor .zhub-rich-editor,
.story-summary-rich-editor .zhub-rich-editor {
    border-color: rgba(13, 110, 253, .18) !important;
}

.story-novel-rich-editor .zhub-rich-editor-visual,
.story-novel-rich-editor .zhub-rich-editor-html {
    min-height: 620px;
    font-size: 1.14rem;
    line-height: 2.08;
    padding: 1.25rem !important;
}

.novel-content-card {
    font-size: clamp(1.18rem, 1.05rem + .35vw, 1.36rem);
    line-height: 2.35;
    letter-spacing: .012em;
    word-spacing: .08em;
    max-width: 960px;
    padding: clamp(1.5rem, 1rem + 2vw, 3.25rem);
}

.novel-content-card p,
.novel-content-card div,
.novel-content-card li {
    line-height: 2.35;
}

.novel-content-card p {
    margin: 0 0 2rem;
}

.novel-content-card img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 1.5rem auto;
    border-radius: .75rem;
}

.zhub-mega-dropdown .dropdown-item,
.zhub-mega-dropdown a {
    border-radius: .65rem;
    padding: .5rem .65rem;
}

html[data-theme="dark"] [data-zhub-modal="true"] .modal-header,
html[data-theme="dark"] [data-zhub-modal="true"] .modal-footer,
html[data-theme="dark"] [data-zhub-modal="true"] .modal-body {
    background: var(--zh-card, #111827);
}

@media (max-width: 767.98px) {
    [data-zhub-modal="true"] .modal-dialog {
        width: calc(100vw - 1rem);
        max-width: calc(100vw - 1rem);
        margin: .5rem auto;
    }

    [data-zhub-modal="true"] .modal-body {
        padding: .9rem;
        max-height: 82vh;
    }

    .novel-content-card {
        font-size: 1.12rem;
        line-height: 2.12;
        word-spacing: .04em;
    }

    .novel-content-card p,
    .novel-content-card div,
    .novel-content-card li {
        line-height: 2.12;
    }
}


/* B91 story overflow, cloud direct link mark, reader protection and modal/form polish */
.story-section,
.story-detail-hero,
.story-sidebar-card {
    min-width: 0;
}

.story-summary-text,
.story-summary-text * {
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.story-summary-text img,
.story-detail-page img {
    max-width: 100%;
    height: auto;
}
.story-detail-page img {
    
    height: 100%;;
}
.story-summary-text code,
.story-summary-text pre {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.zhub-cloud-direct-icon {
    display: inline-block;
    color: var(--bs-primary, #0d6efd);
    font-weight: 800;
    text-decoration: none;
}

a[data-zhub-cloud-direct="true"] {
    text-decoration-style: dotted;
    text-underline-offset: .18em;
}

.zhub-novel-protected {
    -webkit-user-select: none;
    user-select: none;
    cursor: default;
}

.zhub-novel-protected a,
.zhub-novel-protected button {
    -webkit-user-select: auto;
    user-select: auto;
}

.zhub-comic-protected img,
.comic-slide-card img,
.comic-slide-thumbs img {
    -webkit-user-drag: none;
    user-select: none;
}

.comic-slide-card {
    position: relative;
}

.comic-slide-card::after {
    content: "ZHubPro Reader";
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    padding: .18rem .55rem;
    border-radius: 999px;
    background: rgba(0, 0, 0, .42);
    color: rgba(255,255,255,.88);
    font-size: .72rem;
    pointer-events: none;
    opacity: .65;
}

.zhub-story-editor-page .story-edit-card,
.zhub-story-chapter-editor-page .story-edit-card {
    border: 1px solid rgba(13, 110, 253, .08) !important;
    box-shadow: 0 18px 38px rgba(15, 23, 42, .075) !important;
}

.zhub-story-editor-page .card-header,
.zhub-story-chapter-editor-page .card-header {
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.9)) !important;
    border-bottom: 1px solid rgba(127,127,127,.12);
}

.zhub-story-editor-page .btn,
.zhub-story-chapter-editor-page .btn,
[data-zhub-modal="true"] .btn {
    border-radius: .85rem;
}

.zhub-rich-editor-toolbar {
    gap: .35rem !important;
}

.zhub-rich-editor-toolbar .btn,
.zhub-rich-editor-toolbar .form-select,
.zhub-rich-editor-toolbar .form-control-color {
    border-radius: .65rem !important;
}

.zhub-file-library-input .input-group > .form-control:first-child {
    border-top-left-radius: .9rem;
    border-bottom-left-radius: .9rem;
}

.zhub-file-library-input .input-group > .btn:last-child {
    border-top-right-radius: .9rem;
    border-bottom-right-radius: .9rem;
}

.story-comic-image-row {
    box-shadow: 0 12px 26px rgba(15, 23, 42, .045);
}

@media (max-width: 767.98px) {
    .story-summary-text {
        font-size: 1rem;
        line-height: 1.85;
    }

    .comic-slide-card::after {
        right: .6rem;
        bottom: .6rem;
    }
}

/* B92 story backend protection: protected stream reader, text-as-image chunks, chapter/image quick jump */
.reader-toolbar-modern {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    flex-wrap: wrap;
    padding: .85rem;
    border: 1px solid rgba(127,127,127,.12);
    border-radius: 1.2rem;
    background: color-mix(in srgb, var(--zh-card, #fff) 92%, var(--bs-primary, #0d6efd) 8%);
    box-shadow: 0 14px 30px rgba(15, 23, 42, .06);
}

.reader-chapter-quickjump {
    display: flex;
    gap: .4rem;
    min-width: min(100%, 420px);
    flex: 1 1 360px;
}

.reader-chapter-quickjump .form-control,
.reader-chapter-select,
.comic-slide-number-input .form-control,
.comic-slide-number-input .input-group-text,
.comic-slide-number-input .btn {
    border-radius: .8rem;
}

.reader-chapter-select {
    width: min(100%, 260px);
    flex: 0 1 260px;
}

.story-protected-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    flex-wrap: wrap;
    padding: .65rem .9rem;
    border: 1px dashed rgba(13, 110, 253, .25);
    border-radius: 1rem;
    background: rgba(13, 110, 253, .055);
    color: color-mix(in srgb, var(--bs-primary, #0d6efd) 72%, #111827 28%);
    font-size: .92rem;
    font-weight: 600;
}

.comic-slide-jumpbar {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: .65rem;
    flex-wrap: wrap;
    margin: .8rem 0 1rem;
}

.comic-slide-number-input {
    max-width: 210px;
}

.comic-slide-nav-btn {
    position: absolute;
    z-index: 3;
    top: 50%;
    transform: translateY(-50%);
    width: 3.25rem;
    height: 3.25rem;
    border: 0;
    border-radius: 999px;
    background: rgba(15, 23, 42, .64);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 14px 28px rgba(15, 23, 42, .22);
    transition: transform .16s ease, background .16s ease, opacity .16s ease;
}

.comic-slide-nav-btn.prev { left: 1rem; }
.comic-slide-nav-btn.next { right: 1rem; }
.comic-slide-nav-btn:hover { transform: translateY(-50%) scale(1.05); background: rgba(13, 110, 253, .84); }
.comic-slide-nav-btn:disabled { opacity: .28; cursor: not-allowed; }

.novel-chunk-image-stack {
    display: grid;
    gap: 1.25rem;
}

.novel-chunk-image-stack img {
    width: 100%;
    max-width: 1080px;
    height: auto;
    display: block;
    margin: 0 auto;
    border-radius: 1rem;
    box-shadow: 0 14px 38px rgba(15, 23, 42, .06);
    pointer-events: none;
    -webkit-user-drag: none;
    user-select: none;
}

#zhub-story-screen-blackout {
    position: fixed;
    inset: 0;
    z-index: 2147483647;
    display: none;
    align-items: center;
    justify-content: center;
    background: #000;
    color: #fff;
    text-align: center;
    pointer-events: all;
}

#zhub-story-screen-blackout.active {
    display: flex;
}

#zhub-story-screen-blackout.devtools {
    cursor: not-allowed;
}

#zhub-story-screen-blackout > div {
    display: grid;
    gap: .55rem;
    padding: 2rem;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 1.5rem;
    background: rgba(255,255,255,.045);
}

#zhub-story-screen-blackout i {
    font-size: 2.4rem;
    opacity: .86;
}

#zhub-story-screen-blackout strong {
    font-size: 1.35rem;
}

#zhub-story-screen-blackout span {
    max-width: min(92vw, 560px);
    line-height: 1.65;
    color: rgba(255, 255, 255, .82);
}

#zhub-story-screen-blackout.devtools > div {
    border-color: rgba(255, 193, 7, .36);
    background: rgba(255, 193, 7, .06);
}

@media (max-width: 767.98px) {
    .reader-chapter-quickjump,
    .reader-chapter-select {
        flex-basis: 100%;
        width: 100%;
    }

    .comic-slide-nav-btn {
        width: 2.55rem;
        height: 2.55rem;
    }

    .comic-slide-nav-btn.prev { left: .35rem; }
    .comic-slide-nav-btn.next { right: .35rem; }
}

/* B95 SEO admin + reader protection recovery */
.seo-admin-page .card { overflow: hidden; }
.seo-settings-card .form-control,
.seo-settings-card .form-select { border-radius: 14px; min-height: 44px; }
.seo-settings-card textarea.form-control { min-height: 112px; }
.seo-status-box { background: color-mix(in srgb, var(--zhub-surface, #fff) 88%, var(--zhub-primary, #3b82f6) 12%); border: 1px solid rgba(148,163,184,.25); border-radius: 18px; padding: 16px; }
.seo-entry-table table { min-width: 820px; }
.seo-entry-table img { width: 72px; height: 44px; object-fit: cover; border-radius: 12px; border: 1px solid rgba(148,163,184,.3); }
#zhub-story-screen-blackout.active { display: flex !important; opacity: 1 !important; pointer-events: all !important; }
.zhub-reader-page[data-zhub-story-screen-guard="true"] .novel-content-card,
.zhub-reader-page[data-zhub-story-screen-guard="true"] .comic-slide-card,
.zhub-reader-page[data-zhub-story-screen-guard="true"] .comic-slide-thumbs { -webkit-user-select: none; user-select: none; }

/* B96 SEO robots.txt admin editor */
.seo-robots-card .seo-robots-editor {
    min-height: 320px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: .92rem;
    line-height: 1.55;
    white-space: pre;
    overflow: auto;
    border-radius: 16px;
}
.seo-robots-preview {
    background: color-mix(in srgb, var(--zhub-surface, #fff) 92%, #0f172a 8%);
    border: 1px dashed rgba(148,163,184,.45);
    border-radius: 18px;
    padding: 14px;
}
.seo-robots-preview pre {
    margin: 0;
    max-height: 220px;
    overflow: auto;
    white-space: pre-wrap;
    word-break: break-word;
    font-size: .86rem;
    line-height: 1.5;
}

/* B98 - Content view counters and statistics */
.zhub-view-chip,
.story-card-views,
.story-update-views {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    border-radius: 999px;
    padding: .18rem .55rem;
    background: color-mix(in srgb, var(--zhub-primary, #0d6efd) 10%, #fff);
    color: var(--zhub-primary, #0d6efd);
    font-weight: 700;
    white-space: nowrap;
}

.story-card-views {
    align-self: flex-start;
    margin-top: .25rem;
    font-size: .78rem;
}

.story-update-views {
    justify-self: end;
    font-size: .82rem;
}

.content-view-admin-page .content-view-metric-icon {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    background: color-mix(in srgb, var(--zhub-primary, #0d6efd) 12%, #fff);
    color: var(--zhub-primary, #0d6efd);
    font-size: 1.2rem;
}

.content-view-chart-card .content-view-bars {
    display: flex;
    align-items: end;
    gap: .45rem;
    overflow-x: auto;
    padding: .5rem .25rem 0;
}

.content-view-bar-wrap {
    min-width: 28px;
    flex: 1 0 28px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: end;
    gap: .35rem;
}

.content-view-bar {
    width: 100%;
    max-width: 38px;
    border-radius: 14px 14px 6px 6px;
    background: linear-gradient(180deg, color-mix(in srgb, var(--zhub-primary, #0d6efd) 85%, #fff), color-mix(in srgb, var(--zhub-primary, #0d6efd) 55%, #111));
    box-shadow: 0 10px 22px color-mix(in srgb, var(--zhub-primary, #0d6efd) 20%, transparent);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: .25rem;
    color: #fff;
    font-size: .7rem;
    font-weight: 800;
    transition: transform .15s ease, filter .15s ease;
}

.content-view-bar:hover {
    transform: translateY(-3px);
    filter: brightness(1.05);
}

.content-view-thumb {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    overflow: hidden;
    background: #f4f6fb;
    color: var(--zhub-primary, #0d6efd);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.content-view-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.content-view-table td,
.content-view-table th {
    vertical-align: middle;
}

@media (max-width: 768px) {
    .story-update-row {
        grid-template-columns: 1fr !important;
    }

    .story-update-views {
        justify-self: start;
    }
}
.story-update-row {
    grid-template-columns: minmax(0, 1fr) auto auto auto;
}

/* B99 - stable homepage view counters */
.news-card-meta{display:flex;align-items:center;gap:.65rem;flex-wrap:wrap;color:var(--bs-secondary-color,#6c757d);font-size:.82rem;font-weight:700;margin:.25rem 0 .35rem}.news-card-meta span{display:inline-flex;align-items:center;gap:.28rem}.news-card-meta.compact{font-size:.78rem;margin:.25rem 0 0}.news-card-meta.light{color:rgba(255,255,255,.86)}.news-view-widget-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.85rem}.news-view-widget{display:flex;align-items:center;gap:.75rem;text-decoration:none;color:inherit;border:1px solid rgba(127,127,127,.14);background:linear-gradient(135deg,rgba(13,110,253,.08),rgba(2,169,214,.06));border-radius:1rem;padding:.9rem 1rem;box-shadow:0 10px 24px rgba(0,0,0,.035);min-width:0}.news-view-widget>i{width:2.25rem;height:2.25rem;border-radius:50%;display:grid;place-items:center;background:var(--bs-primary,#0d6efd);color:#fff;flex:0 0 auto}.news-view-widget span{display:block;font-size:.78rem;color:var(--bs-secondary-color,#6c757d);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.news-view-widget strong{display:block;font-size:1.05rem;line-height:1;color:var(--bs-body-color,#212529)}.news-side-row{align-items:flex-start}.news-side-row span{flex:1;min-width:0}.news-side-row em,.news-rank-row em,.story-view-pill{font-style:normal;display:inline-flex;align-items:center;gap:.25rem;color:var(--bs-secondary-color,#6c757d);font-size:.78rem;font-weight:700;white-space:nowrap}.news-rank-row{align-items:flex-start}.news-rank-row strong{flex:1;min-width:0}.story-home-row{grid-template-columns:minmax(0,1fr) 130px 86px 64px}.story-view-pill{justify-content:flex-end}.story-home-comic .news-card-meta{margin-top:.25rem}.news-view-widget:hover,.news-small-card:hover .news-card-meta,.news-tile-card:hover .news-card-meta,.story-home-comic:hover .news-card-meta{color:var(--bs-primary,#0d6efd)}@media(max-width:991.98px){.news-view-widget-row{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:767.98px){.news-view-widget-row{grid-template-columns:1fr}.story-home-row{grid-template-columns:1fr}.story-view-pill{justify-content:flex-start}}

/* B103 browser push permission mini prompt */
.zhub-push-permission-banner {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 2147482000;
    max-width: min(420px, calc(100vw - 28px));
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .85rem .9rem;
    border-radius: 18px;
    background: color-mix(in srgb, var(--bs-body-bg, #fff) 92%, #111 8%);
    color: var(--bs-body-color, #111);
    border: 1px solid rgba(0,0,0,.12);
    box-shadow: 0 18px 50px rgba(0,0,0,.18);
}
.zhub-push-permission-banner div { min-width: 0; }
.zhub-push-permission-banner strong { display:block; font-size:.95rem; }
.zhub-push-permission-banner span { display:block; font-size:.82rem; opacity:.75; line-height:1.35; }
.zhub-push-permission-banner button { border:0; border-radius:999px; padding:.45rem .75rem; font-weight:700; }
.zhub-push-permission-banner [data-zhub-push-allow] { background: var(--bs-primary, #0d6efd); color:#fff; }
.zhub-push-permission-banner [data-zhub-push-close] { background: transparent; color: inherit; font-size:1.3rem; line-height:1; padding:.25rem .35rem; }
@media (max-width: 575.98px) {
    .zhub-push-permission-banner { left: 12px; right: 12px; bottom: 12px; }
}

/* B104 story reader readability: novel chunks as slides, larger comic/novel container */
.zhub-reader-page .container {
    max-width: min(100%, 1480px);
}

.novel-reader .novel-content-card {
    font-family: "Times New Roman", Roboto, Arial, serif;
    font-size: clamp(1.24rem, 1.08rem + .52vw, 1.52rem);
    line-height: 2.42;
    max-width: min(100%, 1040px);
    contain: content;
    overflow-wrap: anywhere;
    word-break: normal;
}

.novel-reader .novel-content-card p,
.novel-reader .novel-content-card div,
.novel-reader .novel-content-card li {
    line-height: 2.42;
}

.comic-reader .comic-slide-shell,
.novel-chunk-slide-shell {
    grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
}

.comic-slide-viewer,
.novel-chunk-slide-viewer {
    min-width: 0;
    overflow: hidden;
}

.comic-slide-reader-mode .comic-slide-card,
.novel-chunk-slide-card {
    min-height: min(76vh, 760px);
    padding: clamp(.6rem, .45rem + .8vw, 1.25rem);
}

.comic-slide-reader-mode .comic-slide-card img {
    max-height: 88vh;
    max-width: 100%;
    object-fit: contain;
}

.novel-chunk-slide-card img {
    width: min(100%, 1180px);
    height: auto;
    border-radius: 1rem;
    box-shadow: 0 16px 42px rgba(15, 23, 42, .08);
    background: #fffdf8;
}

.novel-chunk-thumbs button {
    flex: 0 0 96px;
}

.novel-chunk-thumbs img {
    aspect-ratio: 4 / 3;
    object-fit: cover;
    object-position: top left;
    background: #fffdf8;
}

.novel-chunk-number-input {
    max-width: 230px;
}

.zhub-reader-page[data-zhub-story-screen-guard="true"] .novel-chunk-slide-card,
.zhub-reader-page[data-zhub-story-screen-guard="true"] .novel-chunk-thumbs {
    -webkit-user-select: none;
    user-select: none;
}

@media (max-width: 991.98px) {
    .comic-reader .comic-slide-shell,
    .novel-chunk-slide-shell {
        grid-template-columns: 1fr;
    }

    .novel-chunk-sidebar {
        position: relative;
        max-height: 220px;
    }

    .novel-reader .novel-content-card {
        font-size: 1.18rem;
        line-height: 2.18;
        padding: 1.35rem;
    }

    .novel-reader .novel-content-card p,
    .novel-reader .novel-content-card div,
    .novel-reader .novel-content-card li {
        line-height: 2.18;
    }
}

.novel-content-card.novel-content-card--chunks {
    max-width: none;
    padding: 0;
    background: transparent;
    box-shadow: none;
    contain: none;
}

/* B110 story browser speech + public create/edit shortcuts */
.story-public-actions {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
}

.story-public-actions--reader,
.story-public-actions--detail {
    display: flex;
}

.story-speech-card {
    max-width: min(100%, 1040px);
    margin-inline: auto;
    border: 1px solid rgba(13, 110, 253, .16);
    border-radius: 1.25rem;
    padding: .85rem;
    background: linear-gradient(135deg, rgba(13, 110, 253, .08), rgba(245, 158, 11, .10));
    box-shadow: 0 14px 32px rgba(15, 23, 42, .06);
}

.story-speech-main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.story-speech-main strong,
.story-speech-main small {
    display: block;
}

.story-speech-main small {
    color: var(--bs-secondary-color, #6c757d);
    line-height: 1.45;
}

.story-speech-controls {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .45rem;
    flex-wrap: wrap;
}

.story-speech-controls .form-select {
    width: auto;
    min-width: 112px;
}

.story-speech-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    flex-wrap: wrap;
    margin-top: .65rem;
    color: var(--bs-secondary-color, #6c757d);
    font-size: .9rem;
}

@media (max-width: 575.98px) {
    .story-speech-controls,
    .story-speech-controls .btn,
    .story-speech-controls .form-select {
        width: 100%;
    }

    .story-public-actions,
    .story-public-actions .btn {
        width: 100%;
    }
}
/* B114 story browser speech voice install collapse */
.story-speech-help-card {
    max-width: min(100%, 1040px);
    margin-inline: auto;
    border: 1px solid rgba(245, 158, 11, .28);
    border-radius: 1.25rem;
    padding: .7rem;
    background: linear-gradient(135deg, rgba(245, 158, 11, .12), rgba(13, 110, 253, .06));
    box-shadow: 0 14px 32px rgba(15, 23, 42, .05);
}

.story-speech-help-toggle {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    border: 0;
    border-radius: 1rem;
    padding: .75rem .9rem;
    background: rgba(255, 255, 255, .84);
    color: var(--bs-body-color, #212529);
    text-align: left;
}

.story-speech-help-toggle span,
.story-speech-help-toggle small {
    display: block;
}

.story-speech-help-toggle span {
    font-weight: 700;
}

.story-speech-help-toggle small {
    color: var(--bs-secondary-color, #6c757d);
}

.story-speech-help-body {
    margin-top: .75rem;
    border-radius: 1rem;
    padding: 1rem;
    background: rgba(255, 255, 255, .92);
}

.story-speech-help-step {
    height: 100%;
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 1rem;
    padding: .95rem;
    background: rgba(248, 250, 252, .82);
}

.story-speech-help-step h3 {
    font-size: 1rem;
    font-weight: 800;
    margin-bottom: .65rem;
}

.story-speech-help-step ol {
    margin-bottom: .65rem;
    padding-left: 1.15rem;
}

.story-speech-help-step li + li {
    margin-top: .25rem;
}

.story-speech-help-note {
    border-radius: 999px;
    padding: .65rem .85rem;
    background: rgba(13, 110, 253, .08);
    color: var(--bs-secondary-color, #6c757d);
    font-size: .92rem;
}



/* B117 - Story reader mobile readability + social widgets */
.story-social-box,
.story-comments-box {
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 1.25rem;
    padding: 1rem;
    background: rgba(255, 255, 255, .9);
    box-shadow: 0 12px 28px rgba(15, 23, 42, .06);
}

.story-rating-widget {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .35rem .5rem;
}

.story-star-btn {
    width: 2.2rem;
    height: 2.2rem;
    border: 0;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(148, 163, 184, .16);
    color: #94a3b8;
    transition: transform .15s ease, background .15s ease, color .15s ease;
}

.story-star-btn:not(:disabled):hover {
    transform: translateY(-1px) scale(1.04);
}

.story-star-btn.active {
    background: rgba(245, 158, 11, .18);
    color: #f59e0b;
}

.story-comment-list {
    display: grid;
    gap: .75rem;
}

.story-comment-item {
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 1rem;
    padding: .85rem 1rem;
    background: rgba(248, 250, 252, .86);
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.story-comment-meta {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
    flex-wrap: wrap;
    margin-bottom: .35rem;
    color: #64748b;
    font-size: .9rem;
}

@media (max-width: 768px) {
    .zhub-reader-page .container {
        max-width: 100%;
        padding-left: .75rem;
        padding-right: .75rem;
    }

    .zhub-reader-page .reader-title h1 {
        font-size: clamp(1.45rem, 7vw, 2.15rem);
        line-height: 1.22;
    }

    .zhub-reader-page .reader-title p {
        font-size: clamp(1rem, 4.8vw, 1.25rem);
    }

    .zhub-reader-page .reader-toolbar-modern,
    .zhub-reader-page .reader-toolbar {
        gap: .55rem;
    }

    .zhub-reader-page .reader-toolbar-modern .btn,
    .zhub-reader-page .reader-toolbar .btn,
    .zhub-reader-page .reader-chapter-select,
    .zhub-reader-page .reader-chapter-quickjump .form-control {
        min-height: 2.75rem;
        font-size: 1rem;
    }

    .zhub-reader-page .reader-chapter-quickjump {
        width: 100%;
    }

    .novel-reader .novel-content-card {
        padding: 1rem .85rem;
        border-radius: 1rem;
        max-width: 100%;
    }

    .novel-reader .novel-content-card,
    .novel-reader .novel-content-card p,
    .novel-reader .zhub-rich-content,
    .novel-reader .zhub-rich-content p {
        font-size: clamp(1.12rem, 5vw, 1.34rem);
        line-height: 1.9;
    }

    .novel-reader .novel-chunk-slide-card img {
        width: 100%;
        max-width: 100vw;
        max-height: none;
        object-fit: contain;
    }

    .comic-slide-shell {
        grid-template-columns: 1fr !important;
        gap: .75rem;
    }

    .comic-chapter-sidebar {
        display: flex;
        overflow-x: auto;
        max-height: none;
        gap: .4rem;
        padding: .65rem;
    }

    .comic-chapter-sidebar a {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    .comic-slide-card {
        min-height: auto;
        padding: .4rem;
    }

    .comic-slide-card img {
        width: 100%;
        max-width: 100vw;
        max-height: calc(100vh - 8rem);
        object-fit: contain;
    }

    .comic-slide-nav-btn {
        width: 2.75rem;
        height: 2.75rem;
        font-size: 1.05rem;
    }

    .comic-slide-thumbs,
    .novel-chunk-thumbs {
        max-height: none;
        overflow-x: auto;
        display: flex;
        flex-wrap: nowrap;
        padding-bottom: .25rem;
    }

    .comic-slide-thumbs button,
    .novel-chunk-thumbs button {
        flex: 0 0 5.25rem;
    }

    .story-social-box,
    .story-comments-box {
        padding: .85rem;
        border-radius: 1rem;
    }

    .story-section-head {
        align-items: flex-start;
        gap: .4rem;
    }

    .story-section-head h2 {
        font-size: 1.2rem;
    }

    .story-star-btn {
        width: 2.55rem;
        height: 2.55rem;
        font-size: 1.05rem;
    }
}

@media (prefers-color-scheme: dark) {
    .zhub-reader-page .story-social-box,
    .zhub-reader-page .story-comments-box {
        background: rgba(15, 23, 42, .82);
        border-color: rgba(148, 163, 184, .18);
        box-shadow: 0 18px 34px rgba(0, 0, 0, .28);
    }

    .zhub-reader-page .story-comment-item {
        background: rgba(30, 41, 59, .72);
        border-color: rgba(148, 163, 184, .18);
        color: #d6d3c8;
    }

    .zhub-reader-page .story-comment-meta {
        color: #a8a29e;
    }
}

/* B126 emoji/sticker picker */
.zhub-emoji-picker{background:rgba(255,255,255,.92);border-radius:1rem;}
.zhub-emoji-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(38px,1fr));gap:.35rem;max-height:180px;overflow:auto;}
.zhub-emoji-item{border:1px solid rgba(15,23,42,.08);background:rgba(248,250,252,.96);border-radius:.8rem;min-height:38px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;transition:.15s ease;}
.zhub-emoji-item:hover{transform:translateY(-1px);box-shadow:0 .35rem 1rem rgba(15,23,42,.14);}
.zhub-emoji-item img,.zhub-inline-emoji{width:1.55em;height:1.55em;object-fit:contain;vertical-align:-.32em;border-radius:.35em;}
.zhub-emoji-admin-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.75rem;}
.zhub-emoji-admin-card{border:1px solid rgba(15,23,42,.08);border-radius:1rem;padding:.75rem;background:#fff;}
.zhub-emoji-admin-preview{height:54px;display:flex;align-items:center;justify-content:center;font-size:2rem;background:#f8fafc;border-radius:.8rem;}
.zhub-emoji-admin-preview img{max-height:46px;max-width:100%;object-fit:contain;}
[data-bs-theme="dark"] .zhub-emoji-picker,[data-theme="dark"] .zhub-emoji-picker{background:rgba(15,23,42,.95);}
[data-bs-theme="dark"] .zhub-emoji-item,[data-theme="dark"] .zhub-emoji-item{background:rgba(30,41,59,.95);border-color:rgba(148,163,184,.24);}

/* B130 realtime social/profile/layout */
.zhub-presence-admin .zhub-presence-metric-icon{width:48px;height:48px;border-radius:18px;display:inline-flex;align-items:center;justify-content:center;background:rgba(13,110,253,.12);color:#0d6efd;font-size:1.25rem}.zhub-presence-chart svg{width:100%;height:220px;display:block}.zhub-presence-chart .grid{stroke:rgba(148,163,184,.22);stroke-width:1;fill:none}.zhub-presence-chart .line-total,.zhub-presence-chart .line-member,.zhub-presence-chart .line-guest{fill:none;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}.zhub-presence-chart .line-total{stroke:currentColor}.zhub-presence-chart .line-member{stroke:#0d6efd}.zhub-presence-chart .line-guest{stroke:#6c757d}.zhub-chat-social-strip,.zhub-chat-friend-row{display:flex;gap:.45rem;overflow-x:auto;scrollbar-width:thin}.zhub-chat-social-chip,.zhub-chat-friend{display:inline-flex;align-items:center;gap:.45rem;border:1px solid rgba(148,163,184,.28);background:rgba(255,255,255,.78);border-radius:999px;padding:.25rem .45rem;white-space:nowrap;max-width:230px}.zhub-chat-friend{cursor:pointer}.zhub-chat-friend span,.zhub-chat-social-chip span{max-width:150px;overflow:hidden;text-overflow:ellipsis}.btn-xs{--bs-btn-padding-y:.1rem;--bs-btn-padding-x:.35rem;--bs-btn-font-size:.72rem}.zhub-public-online{background:linear-gradient(90deg,rgba(13,110,253,.06),rgba(25,135,84,.08))}.zhub-profile-cover-card{min-height:260px;border-radius:28px;overflow:hidden;background:linear-gradient(135deg,#0f172a,#2563eb 55%,#f97316);background-size:cover;background-position:center;position:relative;box-shadow:0 22px 55px rgba(15,23,42,.18)}.zhub-profile-cover-overlay{position:absolute;inset:auto 0 0 0;padding:2rem;display:flex;align-items:flex-end;gap:1rem;background:linear-gradient(180deg,transparent,rgba(15,23,42,.85))}.zhub-profile-timeline .card{overflow:hidden}.zhub-profile-post-card>.card-img-top{height:320px;object-fit:cover}.zhub-profile-post-body{font-size:1rem;line-height:1.7}.zhub-profile-post-gallery{display:block;width:100%;max-height:580px;object-fit:contain;background:#0f172a;border-radius:18px;margin-top:.75rem}.zhub-home-slider{background:linear-gradient(135deg,rgba(13,110,253,.09),rgba(255,193,7,.12));padding:1.25rem;overflow:hidden}.zhub-home-slider-viewport{overflow:hidden}.zhub-home-slider-track{display:flex;gap:1rem;min-width:max-content;animation:zhubHomeSlide 34s linear infinite}.zhub-home-slider:hover .zhub-home-slider-track{animation-play-state:paused}.zhub-home-slide-card{width:260px;background:rgba(255,255,255,.94);border:1px solid rgba(148,163,184,.18);border-radius:24px;overflow:hidden;color:inherit;text-decoration:none;box-shadow:0 18px 42px rgba(15,23,42,.12)}.zhub-home-slide-image{height:150px;background:linear-gradient(135deg,#1d4ed8,#9333ea);display:flex;align-items:center;justify-content:center;color:white;font-size:2rem}.zhub-home-slide-image img{width:100%;height:100%;object-fit:cover}.zhub-home-slide-card h3{font-size:1rem;font-weight:800;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.zhub-home-slide-card p{font-size:.85rem;color:#64748b;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.7em}@keyframes zhubHomeSlide{from{transform:translateX(0)}to{transform:translateX(-50%)}}.story-decoration-widget{background:linear-gradient(135deg,rgba(13,110,253,.10),rgba(124,58,237,.10));border:1px solid rgba(148,163,184,.20)}.story-decoration-icon{width:54px;height:54px;border-radius:20px;display:inline-flex;align-items:center;justify-content:center;background:#fff;color:#0d6efd;font-size:1.4rem}.story-cover-grid-novel{grid-template-columns:repeat(auto-fill,minmax(155px,1fr))}.story-card-novel .story-cover{aspect-ratio:3/4}.zhub-layout-widget-host{margin-bottom:1rem}.zhub-layout-widget-online_presence .zhub-online-footer-card{margin-bottom:1rem}
@media (max-width: 768px){.zhub-profile-cover-card{min-height:210px}.zhub-profile-cover-overlay{padding:1.25rem;align-items:center}.zhub-profile-cover-overlay .avatar-image{width:72px!important;height:72px!important}.zhub-home-slide-card{width:220px}.zhub-profile-post-card>.card-img-top{height:220px}}

/* B131 story reader/detail compact mobile polish */
.story-detail-page .story-detail-cover {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    background: #151515;
}

.story-detail-page .story-detail-cover img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center center;
    background: #151515;
}

.story-chapter-list a {
    align-items: flex-start;
    padding: .55rem .75rem !important;
    font-size: .88rem;
    line-height: 1.25;
}

.story-chapter-list a span,
.reader-chapter-drawer-list a,
.comic-chapter-sidebar a {
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.25;
}

.story-chapter-list a span {
    min-width: 0;
}

.story-chapter-list a small {
    flex: 0 0 auto;
    font-size: .72rem;
    line-height: 1.25;
    color: var(--bs-secondary-color, #6c757d);
}

.reader-chapter-drawer {
    overflow: hidden;
}

.reader-chapter-drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    margin-bottom: .65rem;
    padding: .1rem .15rem .55rem;
    border-bottom: 1px solid rgba(127,127,127,.12);
}

.reader-chapter-drawer-head strong {
    font-size: .92rem;
    line-height: 1.25;
}

.reader-chapter-drawer-list {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    max-height: 220px;
    overflow: auto;
    padding-right: .15rem;
}

.reader-chapter-drawer-list a {
    flex: 0 1 230px;
    margin: 0 !important;
    padding: .45rem .6rem !important;
    border-radius: .65rem;
    font-size: .82rem;
    min-height: 2.45rem;
}

.comic-chapter-sidebar a {
    font-size: .82rem;
    min-height: 2.45rem;
    padding: .48rem .62rem !important;
}

@media (min-width: 768px) {
    .reader-chapter-drawer-close {
        display: none !important;
    }
}

.comic-slide-reader-mode .comic-slide-card,
.novel-chunk-slide-card {
    max-height: none !important;
    overflow: visible !important;
    padding-left: calc(3.25rem + 1.25rem) !important;
    padding-right: calc(3.25rem + 1.25rem) !important;
}

.comic-slide-reader-mode .comic-slide-card img,
.novel-chunk-slide-card img {
    max-width: 100%;
    min-width: 0;
}

.comic-slide-nav-btn.prev {
    left: .75rem !important;
}

.comic-slide-nav-btn.next {
    right: .75rem !important;
}

@media (max-width: 767.98px) {
    .story-detail-page .story-detail-cover {
        max-width: 190px;
        margin: 0 auto;
    }

    .story-chapter-list {
        max-height: 420px;
    }

    .story-chapter-list a {
        gap: .5rem;
        padding: .5rem .6rem !important;
        font-size: .84rem;
    }

    .story-chapter-list a small {
        font-size: .68rem;
    }

    .reader-chapter-drawer {
        position: fixed;
        top: 4.65rem;
        left: .65rem;
        bottom: .75rem;
        z-index: 1085;
        width: min(86vw, 360px);
        max-height: none !important;
        display: flex;
        flex-direction: column;
        padding: .75rem;
        border: 1px solid rgba(127,127,127,.16);
        box-shadow: 0 22px 55px rgba(15,23,42,.24);
    }

    .reader-chapter-drawer-head {
        flex: 0 0 auto;
    }

    .reader-chapter-drawer-list {
        flex: 1 1 auto;
        display: grid;
        grid-template-columns: 1fr;
        gap: .4rem;
        max-height: none;
        overflow: auto;
        overscroll-behavior: contain;
        padding-right: .25rem;
    }

    .reader-chapter-drawer-list a {
        width: 100%;
        flex-basis: auto;
        min-height: 2.35rem;
        padding: .5rem .62rem !important;
        font-size: .8rem;
    }

    .reader-static-chapter-sidebar {
        display: none !important;
    }

    .comic-slide-reader-mode .comic-slide-card,
    .novel-chunk-slide-card {
        padding: .55rem !important;
        padding-bottom: 3.75rem !important;
    }

    .comic-slide-nav-btn {
        top: auto !important;
        bottom: .65rem;
        transform: none !important;
        width: 2.6rem;
        height: 2.6rem;
        font-size: 1rem;
    }

    .comic-slide-nav-btn:hover {
        transform: scale(1.04) !important;
    }

    .comic-slide-nav-btn.prev {
        left: calc(50% - 3.05rem) !important;
    }

    .comic-slide-nav-btn.next {
        right: calc(50% - 3.05rem) !important;
    }

    .comic-slide-card img {
        max-height: calc(100vh - 10rem) !important;
    }
}

/* B134 - Story reader mobile chapter drawer polish + draggable compact toggle */
.reader-mobile-chapter-fab {
    display: none;
}

@media (max-width: 767.98px) {
    .zhub-reader-page {
        --reader-drawer-width: min(78vw, 292px);
    }

    .zhub-reader-page .reader-chapter-toggle-btn {
        display: none !important;
    }

    .reader-mobile-chapter-fab {
        position: fixed;
        z-index: 1092;
        left: .38rem;
        top: 48vh;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: .22rem;
        width: 2.42rem;
        min-width: 2.42rem;
        height: 2.42rem;
        padding: 0;
        border: 1px solid rgba(255,255,255,.78);
        border-radius: 999px;
        background: rgba(17, 24, 39, .76);
        color: #fff;
        box-shadow: 0 10px 26px rgba(15, 23, 42, .26);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        touch-action: none;
        user-select: none;
        -webkit-user-select: none;
        cursor: grab;
        transition: transform .14s ease, background .14s ease, box-shadow .14s ease, opacity .14s ease;
    }

    .reader-mobile-chapter-fab i {
        margin: 0 !important;
        font-size: .98rem;
        line-height: 1;
    }

    .reader-mobile-chapter-fab span {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
    }

    .reader-mobile-chapter-fab:hover,
    .reader-mobile-chapter-fab:focus-visible,
    .reader-mobile-chapter-fab[aria-expanded="true"] {
        background: rgba(13, 110, 253, .9);
        box-shadow: 0 14px 30px rgba(13, 110, 253, .28);
    }

    .reader-mobile-chapter-fab:focus-visible {
        outline: 2px solid rgba(13, 110, 253, .28);
        outline-offset: 3px;
    }

    .reader-mobile-chapter-fab.is-touching,
    .reader-mobile-chapter-fab.is-dragging {
        cursor: grabbing;
        transform: scale(1.06);
        opacity: .96;
    }

    .zhub-reader-page .reader-chapter-drawer {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        bottom: 0 !important;
        z-index: 1090 !important;
        width: var(--reader-drawer-width) !important;
        max-width: 292px !important;
        max-height: 100dvh !important;
        margin: 0 !important;
        padding: .56rem .52rem .7rem !important;
        display: flex !important;
        flex-direction: column !important;
        border: 1px solid rgba(148, 163, 184, .22) !important;
        border-left: 0 !important;
        border-radius: 0 1.1rem 1.1rem 0 !important;
        background: rgba(255, 253, 247, .97) !important;
        box-shadow: 10px 0 34px rgba(15, 23, 42, .18) !important;
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
        overflow: hidden !important;
    }

    .zhub-reader-page .reader-chapter-drawer-head {
        position: sticky;
        top: 0;
        z-index: 1;
        flex: 0 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .4rem;
        margin: 0 0 .48rem !important;
        padding: .1rem .05rem .48rem !important;
        border-bottom: 1px solid rgba(148, 163, 184, .18) !important;
        background: transparent;
    }

    .zhub-reader-page .reader-chapter-drawer-head strong {
        min-width: 0;
        font-size: .82rem !important;
        line-height: 1.15 !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .zhub-reader-page .reader-chapter-drawer-close {
        flex: 0 0 auto;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        width: 1.85rem;
        height: 1.85rem;
        padding: 0 !important;
        border-radius: 999px !important;
        font-size: 0;
    }

    .zhub-reader-page .reader-chapter-drawer-close i {
        margin: 0 !important;
        font-size: .88rem;
    }

    .zhub-reader-page .reader-chapter-drawer-list {
        flex: 1 1 auto !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        align-content: start;
        gap: .32rem !important;
        max-height: none !important;
        min-height: 0;
        padding: .04rem .14rem .6rem .02rem !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        overscroll-behavior: contain;
        scrollbar-width: thin;
    }

    .zhub-reader-page .reader-chapter-drawer-list a {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 2.05rem !important;
        max-height: 2.82rem !important;
        margin: 0 !important;
        padding: .42rem .52rem !important;
        border: 1px solid rgba(148, 163, 184, .18) !important;
        border-radius: .72rem !important;
        background: rgba(255, 255, 255, .9) !important;
        color: #1f2937 !important;
        box-shadow: none !important;
        font-size: .75rem !important;
        font-weight: 650;
        line-height: 1.2 !important;
        text-decoration: none !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden !important;
        white-space: normal !important;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .zhub-reader-page .reader-chapter-drawer-list a:hover,
    .zhub-reader-page .reader-chapter-drawer-list a:focus-visible {
        border-color: rgba(13, 110, 253, .38) !important;
        background: rgba(13, 110, 253, .08) !important;
        color: #0f172a !important;
    }

    .zhub-reader-page .reader-chapter-drawer-list a.active {
        border-color: transparent !important;
        background: linear-gradient(135deg, rgba(13,110,253,.96), rgba(16,185,129,.9)) !important;
        color: #fff !important;
        box-shadow: 0 8px 18px rgba(13,110,253,.18) !important;
    }

    .zhub-reader-page .reader-chapter-drawer-list a.active::before {
        content: "";
        display: inline-block;
        width: .42rem;
        height: .42rem;
        margin-right: .28rem;
        border-radius: 999px;
        background: rgba(255, 255, 255, .92);
        vertical-align: .08rem;
    }

    .zhub-reader-page .comic-slide-viewer,
    .zhub-reader-page .novel-chunk-slide-viewer {
        border-radius: 1rem !important;
    }
}

@media (max-width: 360px) {
    .zhub-reader-page {
        --reader-drawer-width: min(82vw, 270px);
    }

    .reader-mobile-chapter-fab {
        width: 2.28rem;
        min-width: 2.28rem;
        height: 2.28rem;
        left: .26rem;
    }

    .zhub-reader-page .reader-chapter-drawer-list a {
        font-size: .71rem !important;
        padding: .38rem .48rem !important;
    }
}

@media (min-width: 768px) {
    .reader-mobile-chapter-fab {
        display: none !important;
    }
}

[data-bs-theme="dark"] .zhub-reader-page .reader-chapter-drawer,
[data-theme="dark"] .zhub-reader-page .reader-chapter-drawer {
    background: rgba(15, 23, 42, .96) !important;
    border-color: rgba(148, 163, 184, .22) !important;
}

[data-bs-theme="dark"] .zhub-reader-page .reader-chapter-drawer-list a,
[data-theme="dark"] .zhub-reader-page .reader-chapter-drawer-list a {
    background: rgba(30, 41, 59, .88) !important;
    color: #e5e7eb !important;
    border-color: rgba(148, 163, 184, .2) !important;
}

/* B135 - story import/reader sidebar/paged chapters/chat responsive polish */
.zhub-story-page .story-detail-cover,
.story-detail-page .story-detail-cover {
    display: grid;
    place-items: center;
    overflow: hidden;
}

.zhub-story-page .story-detail-cover img,
.story-detail-page .story-detail-cover img {
    width: 100%;
    height: 100%;
    object-fit: contain !important;
    object-position: center center;
    background: rgba(255,255,255,.7);
}

.story-chapter-search-row { margin: .75rem 0; }
.story-chapter-list-paged {
    display: grid;
    grid-template-columns: 1fr;
    gap: .55rem;
}
@media (min-width: 992px) {
    .story-chapter-list-paged { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.story-chapter-list-paged a,
.reader-chapter-drawer-list a,
.reader-sidebar-chapter-list a {
    min-width: 0;
    overflow: hidden;
}
.story-chapter-title-line,
.reader-chapter-drawer-list a > span,
.reader-sidebar-chapter-list a > span {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.25;
}
.story-chapter-list-paged small,
.reader-chapter-drawer-list small,
.reader-sidebar-chapter-list small {
    display: block;
    opacity: .76;
    font-size: .74rem;
    margin-top: .25rem;
}
.story-chapter-pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    margin-top: .85rem;
    flex-wrap: wrap;
    font-size: .85rem;
}
.story-chapter-pager.compact { gap: .35rem; font-size: .78rem; }

.reader-chapter-tools {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: .6rem 0;
    min-width: 0;
}
.reader-chapter-tools > input { min-width: 0; }
.reader-chapter-tools > span { flex: 0 0 auto; font-size: .78rem; opacity: .75; }
.reader-chapter-tools.compact { display: block; margin: .55rem 0; }
.reader-sidebar-chapter-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: .35rem;
    max-height: min(58vh, 560px);
    overflow: auto;
    padding-right: .2rem;
}
.reader-sidebar-chapter-list a,
.reader-chapter-drawer-list a {
    font-size: .84rem;
    line-height: 1.2;
    padding: .55rem .65rem !important;
    border-radius: .65rem !important;
}
.reader-chapter-drawer-list a.active,
.reader-sidebar-chapter-list a.active {
    min-height: unset !important;
    background: linear-gradient(135deg, rgba(22, 163, 74, .92), rgba(20, 184, 166, .82)) !important;
    color: #fff !important;
}
@media (max-width: 767.98px) {
    .reader-chapter-drawer {
        max-width: min(82vw, 310px);
        width: min(82vw, 310px);
        max-height: calc(100vh - 110px);
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }
    .reader-chapter-drawer-list { overflow: auto; flex: 1 1 auto; }
    .reader-mobile-chapter-fab {
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        padding: 0 !important;
        border-radius: 999px !important;
        font-size: .7rem !important;
        z-index: 1035 !important;
    }
    .reader-mobile-chapter-fab span { display: none !important; }
}

.zhub-reader-page > .container {
    max-width: min(1720px, calc(100vw - 24px));
}
@media (min-width: 1400px) {
    .comic-slide-shell.comic-slide-reader-mode,
    .novel-chunk-slide-shell.comic-slide-reader-mode {
        grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
    }
    .novel-reader article.story-reader-article,
    .zhub-reader-page .zhub-rich-content {
        max-width: min(1180px, 100%);
        margin-left: auto;
        margin-right: auto;
    }
}
.comic-slide-nav-btn.prev { left: max(.75rem, env(safe-area-inset-left)); }
.comic-slide-nav-btn.next { right: max(.75rem, env(safe-area-inset-right)); }
.comic-slide-card img { max-width: 100%; height: auto; }

.story-reader-lower-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}
.story-reader-lower-main { min-width: 0; }
.story-reader-side-panel {
    display: grid;
    gap: 1rem;
    min-width: 0;
}
@media (min-width: 1200px) {
    .story-reader-lower-grid {
        grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
    }
    .story-reader-side-panel {
        position: sticky;
        top: 82px;
        max-height: calc(100vh - 96px);
        overflow: auto;
        padding-right: .15rem;
    }
}
.story-reader-related-list,
.story-sidebar-widget-stack { display: grid; gap: 1rem; min-width: 0; }
.story-widget-row {
    display: flex;
    align-items: center;
    gap: .7rem;
    text-decoration: none;
    color: inherit;
    min-width: 0;
    padding: .55rem;
    border-radius: .85rem;
    border: 1px solid rgba(0,0,0,.06);
    background: rgba(255,255,255,.66);
}
.story-widget-row:hover { background: rgba(14, 165, 233, .08); }
.story-widget-cover {
    flex: 0 0 46px;
    width: 46px;
    height: 58px;
    border-radius: .7rem;
    overflow: hidden;
    display: grid;
    place-items: center;
    background: rgba(148,163,184,.16);
}
.story-widget-cover img { width: 100%; height: 100%; object-fit: cover; }
.story-widget-body { min-width: 0; display: grid; gap: .15rem; }
.story-widget-body strong,
.story-rank-row strong {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.story-widget-body small { color: #64748b; }
.story-reader-presence-summary {
    display: grid;
    gap: .15rem;
    padding: .6rem .75rem;
    border-radius: .85rem;
    background: rgba(16,185,129,.1);
    margin-bottom: .65rem;
}
.story-reader-person-row {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) auto;
    gap: .45rem;
    align-items: center;
    font-size: .86rem;
    padding: .45rem 0;
    border-bottom: 1px dashed rgba(100,116,139,.22);
}
.story-reader-person-row span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.story-reader-person-row small { color: #64748b; }
.story-reader-person-row.member i { color: #16a34a; }
.story-reader-person-row.guest i { color: #64748b; }
.story-reader-person-row.bot i { color: #f59e0b; }
.story-import-progress .progress { overflow: hidden; }
.zhub-chat-dock { max-width: min(100vw - 16px, 380px); }
.zhub-chat-panel { max-width: min(100vw - 16px, 380px); }

/* B135 chat CRUD mini actions */
.zhub-chat-actions{display:flex;gap:.35rem;align-items:center;justify-content:flex-end;margin-top:.2rem;font-size:.75rem;line-height:1}
.zhub-chat-actions .btn{padding:0 .15rem;font-size:.75rem;text-decoration:none}
.zhub-chat-message:not(.is-me) .zhub-chat-actions{justify-content:flex-start}

/* B136 - story reader left sidebar/layout/widgets responsive fix */
.story-reader-body-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
    min-width: 0;
}
.story-reader-left-panel,
.story-reader-main-panel {
    min-width: 0;
}
.story-reader-left-panel {
    order: 2;
    display: grid;
    gap: 1rem;
}
.story-reader-main-panel {
    order: 1;
}
.story-reader-left-panel .story-sidebar-widget-stack {
    gap: 1rem;
}
.story-reader-left-panel .story-reader-chapter-box,
.story-reader-left-panel .story-reader-social-box,
.story-reader-left-panel .story-reader-comments-box,
.story-reader-left-panel .story-sidebar-card {
    overflow: hidden;
}
.story-reader-left-panel .story-comment-list {
    max-height: min(46vh, 520px);
    overflow: auto;
    padding-right: .15rem;
}
.story-reader-main-panel .comic-slide-shell.comic-slide-reader-mode,
.story-reader-main-panel .novel-chunk-slide-shell.comic-slide-reader-mode {
    grid-template-columns: minmax(0, 1fr) !important;
}
.story-reader-main-panel .comic-slide-viewer,
.story-reader-main-panel .novel-content-card,
.story-reader-main-panel .story-speech-card,
.story-reader-main-panel .story-speech-help-card,
.story-reader-main-panel .story-reader-related-box {
    max-width: 100%;
}
@media (min-width: 1200px) {
    .story-reader-body-grid {
        grid-template-columns: minmax(300px, 380px) minmax(0, 1fr);
    }
    .story-reader-left-panel,
    .story-reader-main-panel {
        order: initial;
    }
    .story-reader-left-panel {
        position: sticky;
        top: 82px;
        max-height: calc(100vh - 96px);
        overflow: auto;
        padding-right: .2rem;
        align-self: start;
    }
    .story-reader-main-panel .novel-content-card {
        max-width: min(1180px, 100%);
    }
}
@media (max-width: 1199.98px) {
    .story-reader-left-panel {
        margin-top: .5rem;
    }
    .story-reader-left-panel .story-reader-chapter-box {
        display: none;
    }
    .story-reader-left-panel .story-comment-list {
        max-height: none;
        overflow: visible;
        padding-right: 0;
    }
}
@media (max-width: 575.98px) {
    .story-reader-body-grid {
        gap: .75rem;
    }
    .story-reader-left-panel .story-section,
    .story-reader-left-panel .story-sidebar-card,
    .story-reader-main-panel .story-section {
        border-radius: 1rem;
        padding: .8rem;
    }
    .story-reader-left-panel .story-section-head,
    .story-reader-main-panel .story-section-head {
        align-items: flex-start;
        gap: .5rem;
    }
    .story-reader-left-panel .story-section-head h2,
    .story-reader-main-panel .story-section-head h2 {
        font-size: .98rem;
    }
    .story-widget-row,
    .story-rank-row {
        max-width: 100%;
    }
}

/* B137 - unified content/story widgets, related slider, and thumb sizing */
:root {
    --zhub-story-thumb-ratio: 3 / 4;
    --zhub-story-thumb-mini-w: 54px;
    --zhub-story-thumb-mini-h: 72px;
    --zhub-story-thumb-radius: .85rem;
    --zhub-story-card-min: 132px;
    --zhub-story-card-lg-min: 150px;
    --zhub-story-widget-gap: .85rem;
}
.story-cover,
.story-detail-cover,
.story-home-comic > div,
.zhub-feed-thumb {
    aspect-ratio: var(--zhub-story-thumb-ratio);
}
.story-cover img,
.story-detail-cover img,
.story-home-comic img,
.story-widget-cover img,
.zhub-feed-thumb img,
.zhub-feed-mini-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.story-widget-cover,
.zhub-feed-mini-thumb {
    width: var(--zhub-story-thumb-mini-w);
    height: var(--zhub-story-thumb-mini-h);
    flex: 0 0 var(--zhub-story-thumb-mini-w);
    border-radius: var(--zhub-story-thumb-radius);
}
.story-cover-grid,
.zhub-story-related-slide-grid {
    grid-template-columns: repeat(auto-fill, minmax(var(--zhub-story-card-min), 1fr));
}
.zhub-story-card-slider { overflow: hidden; }
.zhub-story-card-slider-head > div:first-child { min-width: 0; }
.zhub-story-card-slider-head small { display: block; color: var(--bs-secondary-color,#6c757d); margin-top: .15rem; }
.zhub-story-card-slider-controls,
.zhub-content-widget-controls {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    white-space: nowrap;
}
.zhub-story-card-slider-controls span,
.zhub-content-widget-controls span {
    min-width: 46px;
    text-align: center;
    font-weight: 800;
    color: var(--bs-secondary-color,#6c757d);
    font-size: .82rem;
}
.zhub-story-related-slide-card .story-card-views {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    color: var(--bs-secondary-color,#6c757d);
    font-size: .78rem;
    margin-right: .45rem;
}
.zhub-content-widget {
    --zhub-widget-card-bg: var(--bs-body-bg,#fff);
    border: 1px solid rgba(127,127,127,.12);
    border-radius: 1.25rem;
    background: var(--zhub-widget-card-bg);
    box-shadow: 0 10px 24px rgba(0,0,0,.05);
    padding: 1rem;
    margin-bottom: 1rem;
    overflow: hidden;
    min-width: 0;
}
.zhub-content-widget-head,
.zhub-content-widget-group-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;
    margin-bottom: .9rem;
}
.zhub-content-widget-head h2 {
    margin: 0;
    font-size: 1.08rem;
    font-weight: 850;
    color: var(--bs-primary,#0d6efd);
}
.zhub-content-widget-head small,
.zhub-content-widget-kicker {
    color: var(--bs-secondary-color,#6c757d);
    font-size: .78rem;
}
.zhub-content-widget-kicker {
    display: block;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 800;
    margin-bottom: .15rem;
}
.zhub-feed-grid {
    display: grid;
    gap: var(--zhub-story-widget-gap);
    min-width: 0;
}
.zhub-feed-grid-slide,
.zhub-feed-grid-card {
    grid-template-columns: repeat(auto-fill, minmax(var(--zhub-story-card-min), 1fr));
}
.zhub-feed-grid-card_thumb {
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}
.zhub-feed-card,
.zhub-feed-card-thumb,
.zhub-feed-list-row,
.zhub-feed-todo-row {
    color: inherit;
    text-decoration: none;
    min-width: 0;
}
.zhub-feed-card {
    display: block;
    border: 1px solid rgba(127,127,127,.10);
    border-radius: 1rem;
    padding: .55rem;
    background: rgba(255,255,255,.72);
    transition: transform .18s ease, box-shadow .18s ease;
}
.zhub-feed-card:hover,
.zhub-feed-card-thumb:hover,
.zhub-feed-list-row:hover,
.zhub-feed-todo-row:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(15,23,42,.08);
}
.zhub-feed-thumb {
    position: relative;
    display: grid;
    place-items: center;
    border-radius: var(--zhub-story-thumb-radius);
    overflow: hidden;
    background: linear-gradient(135deg,rgba(13,110,253,.12),rgba(245,158,11,.16));
    color: var(--bs-primary,#0d6efd);
    font-size: 1.65rem;
}
.zhub-feed-thumb em {
    position: absolute;
    top: .35rem;
    left: .35rem;
    font-style: normal;
    font-size: .68rem;
    font-weight: 800;
    color: #fff;
    background: rgba(239,68,68,.92);
    border-radius: 999px;
    padding: .12rem .42rem;
}
.zhub-feed-card strong,
.zhub-feed-card-thumb strong,
.zhub-feed-list-row span,
.zhub-feed-todo-row span {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.25;
}
.zhub-feed-card strong {
    margin-top: .55rem;
    font-size: .94rem;
}
.zhub-feed-card small,
.zhub-feed-card-thumb small,
.zhub-feed-list-row small,
.zhub-feed-todo-row small,
.zhub-feed-meta,
.zhub-feed-card-thumb em {
    color: var(--bs-secondary-color,#6c757d);
    font-size: .78rem;
    font-style: normal;
}
.zhub-feed-meta {
    display: flex;
    align-items: center;
    gap: .25rem;
    flex-wrap: wrap;
    margin-top: .25rem;
}
.zhub-feed-card-thumb {
    display: flex;
    gap: .7rem;
    align-items: center;
    border: 1px solid rgba(127,127,127,.10);
    border-radius: 1rem;
    padding: .55rem;
    background: rgba(255,255,255,.72);
}
.zhub-feed-card-thumb-body {
    display: grid;
    gap: .12rem;
    min-width: 0;
}
.zhub-feed-mini-thumb {
    display: grid;
    place-items: center;
    overflow: hidden;
    background: rgba(148,163,184,.16);
    color: var(--bs-primary,#0d6efd);
}
.zhub-feed-list,
.zhub-feed-todo-list,
.zhub-content-widget-groups {
    display: grid;
    gap: .55rem;
}
.zhub-feed-list-row {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto auto;
    gap: .65rem;
    align-items: center;
    padding: .65rem .75rem;
    border-radius: .8rem;
    background: rgba(127,127,127,.055);
}
.zhub-feed-list-row em {
    color: var(--bs-secondary-color,#6c757d);
    font-style: normal;
    font-size: .78rem;
    white-space: nowrap;
}
.zhub-feed-todo-row {
    display: grid;
    grid-template-columns: 22px minmax(0,1fr) auto;
    gap: .55rem;
    align-items: center;
    padding: .55rem .65rem;
    border-radius: .75rem;
    background: rgba(16,185,129,.08);
}
.zhub-feed-todo-row i { color: #16a34a; }
.zhub-content-widget-group {
    border: 1px dashed rgba(127,127,127,.18);
    border-radius: 1rem;
    padding: .75rem;
    min-width: 0;
}
.zhub-content-widget-group-head strong {
    font-weight: 850;
    color: var(--bs-body-color,#212529);
}
.zhub-content-widget-group-head a {
    font-size: .82rem;
    text-decoration: none;
}
@media (min-width: 1400px) {
    .story-reader-body-grid {
        grid-template-columns: minmax(320px, 400px) minmax(0, 1fr);
    }
    .story-reader-main-panel .novel-content-card {
        max-width: min(1280px, 100%);
    }
    .zhub-reader-page > .container {
        max-width: 1600px;
    }
    .story-cover-grid,
    .zhub-story-related-slide-grid,
    .zhub-feed-grid-slide,
    .zhub-feed-grid-card {
        grid-template-columns: repeat(auto-fill, minmax(var(--zhub-story-card-lg-min), 1fr));
    }
}
@media (max-width: 767.98px) {
    :root {
        --zhub-story-card-min: 112px;
        --zhub-story-thumb-mini-w: 48px;
        --zhub-story-thumb-mini-h: 64px;
        --zhub-story-widget-gap: .65rem;
    }
    .zhub-content-widget,
    .zhub-story-card-slider {
        border-radius: 1rem;
        padding: .75rem;
    }
    .zhub-content-widget-head,
    .zhub-story-card-slider-head,
    .zhub-content-widget-group-head {
        align-items: flex-start;
        gap: .55rem;
    }
    .zhub-feed-grid-card_thumb,
    .zhub-feed-list-row {
        grid-template-columns: 1fr;
    }
    .zhub-feed-list-row em {
        white-space: normal;
    }
}
.story-home-novel-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.75rem}.story-home-novel-card{display:flex;gap:.7rem;align-items:center;text-decoration:none;color:inherit;border:1px solid rgba(127,127,127,.12);border-radius:1rem;padding:.6rem;background:rgba(255,255,255,.72)}.story-home-novel-card:hover{background:rgba(13,110,253,.06)}.story-home-novel-body{display:grid;gap:.12rem;min-width:0}.story-home-novel-body strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.25}.story-home-novel-body small,.story-home-novel-body em{color:var(--bs-secondary-color,#6c757d);font-size:.78rem;font-style:normal}.story-home-novel-body em{display:flex;gap:.25rem;align-items:center;flex-wrap:wrap}
.story-detail-cover img{object-fit:contain;background:rgba(15,23,42,.04)}

/* B138 - Reader chapter list is its own block, separate from widget/layout blocks */
.story-reader-left-panel > .story-reader-chapter-panel,
.story-reader-left-panel > .story-reader-social-panel,
.story-reader-left-panel > .story-reader-widget-panel {
    min-width: 0;
    display: grid;
    gap: 1rem;
}
.story-reader-left-panel > .story-reader-chapter-panel {
    isolation: isolate;
    position: relative;
    z-index: 2;
}
.story-reader-left-panel > .story-reader-chapter-panel .story-reader-chapter-box {
    margin: 0 !important;
    border: 1px solid rgba(37, 99, 235, .14);
    box-shadow: 0 14px 30px rgba(15, 23, 42, .06);
}
.story-reader-left-panel > .story-reader-social-panel .story-reader-social-box,
.story-reader-left-panel > .story-reader-social-panel .story-reader-comments-box,
.story-reader-left-panel > .story-reader-widget-panel .story-sidebar-widget-stack {
    margin: 0 !important;
}
.story-reader-left-panel > .story-reader-widget-panel {
    border-top: 1px dashed rgba(100, 116, 139, .24);
    padding-top: 1rem;
}
.story-reader-left-panel > .story-reader-widget-panel .story-sidebar-card,
.story-reader-left-panel > .story-reader-social-panel .story-section,
.story-reader-left-panel > .story-reader-chapter-panel .story-section {
    max-width: 100%;
}
.story-reader-left-panel > .story-reader-chapter-panel .reader-sidebar-chapter-list {
    contain: content;
}
@media (min-width: 1200px) {
    .story-reader-left-panel > .story-reader-chapter-panel {
        flex: 0 0 auto;
    }
    .story-reader-left-panel > .story-reader-social-panel,
    .story-reader-left-panel > .story-reader-widget-panel {
        flex: 0 0 auto;
    }
}
@media (max-width: 1199.98px) {
    .story-reader-left-panel > .story-reader-chapter-panel {
        display: none !important;
    }
    .story-reader-left-panel > .story-reader-widget-panel {
        padding-top: .75rem;
    }
}
@media (max-width: 575.98px) {
    .story-reader-left-panel > .story-reader-social-panel,
    .story-reader-left-panel > .story-reader-widget-panel {
        gap: .75rem;
    }
}

/* B139 - story audio fallback + upload diagnostics */
.story-audio-admin-card,
.story-audio-reader-card {
    border: 1px solid rgba(15, 23, 42, .10);
    border-radius: 1rem;
    background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,250,252,.94));
    box-shadow: 0 .75rem 2rem rgba(15, 23, 42, .06);
    overflow: hidden;
}

.story-audio-reader-card {
    padding: 1rem;
}

.story-audio-reader-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
    flex-wrap: wrap;
}

.story-audio-player {
    display: block;
    width: 100%;
    max-width: 100%;
}

.story-audio-youtube {
    position: relative;
    width: 100%;
    border-radius: 1rem;
    overflow: hidden;
    background: #0f172a;
    aspect-ratio: 16 / 9;
}

.story-audio-youtube iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.zhub-upload-raw-box,
textarea.zhub-upload-raw-box,
.file-library-admin-card textarea,
#file-upload-modal textarea {
    max-width: 100%;
    white-space: pre-wrap;
    word-break: break-word;
}

@media (max-width: 768px) {
    .story-audio-reader-card,
    .story-audio-admin-card {
        border-radius: .85rem;
    }

    .story-audio-reader-card {
        padding: .8rem;
    }
}

/* B142 - Internal slider captcha, no third-party captcha UI */
.zhub-slider-captcha-overlay {
    position: fixed;
    inset: 0;
    z-index: 2147482000;
    display: grid;
    place-items: center;
    padding: 16px;
    background: rgba(15, 23, 42, .52);
    backdrop-filter: blur(8px);
}
.zhub-slider-captcha-card {
    width: min(94vw, 390px);
    border-radius: 24px;
    background: #fff;
    color: #172033;
    padding: 24px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .32);
    position: relative;
    overflow: hidden;
}
.zhub-slider-captcha-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 6px;
    background: linear-gradient(90deg, #38bdf8, #22c55e, #f59e0b);
}
.zhub-slider-captcha-close {
    position: absolute;
    top: 10px;
    right: 12px;
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 999px;
    background: #f1f5f9;
    color: #334155;
    font-size: 20px;
    line-height: 1;
}
.zhub-slider-captcha-icon {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border-radius: 16px;
    color: #0f766e;
    background: #ccfbf1;
    margin-bottom: 12px;
}
.zhub-slider-captcha-card h2 {
    font-size: 1.25rem;
    margin: 0 32px 4px 0;
    font-weight: 800;
}
.zhub-slider-captcha-card p {
    color: #64748b;
    margin: 0 0 16px;
    font-size: .92rem;
}
.zhub-slider-captcha-track {
    --captcha-track-width: 280px;
    width: min(100%, var(--captcha-track-width));
    height: 46px;
    margin: 0 auto;
    border-radius: 999px;
    background: #eef2f7;
    border: 1px solid #dbe4ef;
    position: relative;
    overflow: hidden;
    touch-action: none;
    outline: none;
}
.zhub-slider-captcha-track:focus-visible {
    box-shadow: 0 0 0 .22rem rgba(13, 110, 253, .18);
}
.zhub-slider-captcha-target {
    position: absolute;
    top: 6px;
    bottom: 6px;
    border-radius: 999px;
    background: rgba(34, 197, 94, .24);
    border: 1px dashed rgba(22, 163, 74, .65);
}
.zhub-slider-captcha-fill {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 20px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(56,189,248,.32), rgba(34,197,94,.28));
}
.zhub-slider-captcha-knob {
    position: absolute;
    left: 4px;
    top: 4px;
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 999px;
    background: #0d6efd;
    color: #fff;
    display: grid;
    place-items: center;
    box-shadow: 0 8px 18px rgba(13, 110, 253, .35);
    cursor: grab;
    touch-action: none;
}
.zhub-slider-captcha-knob:active { cursor: grabbing; }
.zhub-slider-captcha-status {
    min-height: 20px;
    margin-top: 10px;
    text-align: center;
    color: #64748b;
    font-size: .82rem;
}
.zhub-slider-captcha-overlay.is-ok .zhub-slider-captcha-knob { background: #16a34a; }
.zhub-slider-captcha-overlay.is-shake .zhub-slider-captcha-card { animation: zhub-captcha-shake .28s ease-in-out; }
@keyframes zhub-captcha-shake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-8px); }
    75% { transform: translateX(8px); }
}
@media (max-width: 480px) {
    .zhub-slider-captcha-card { padding: 20px 16px; border-radius: 20px; }
    .zhub-slider-captcha-track { height: 44px; }
}
.captcha-admin-card { background: #fff; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.captcha-admin-card.is-enabled { border-color: rgba(13,110,253,.35) !important; box-shadow: 0 10px 28px rgba(13,110,253,.08); }
.captcha-admin-card:hover { transform: translateY(-1px); }

/* B143 - Slider captcha background image from File Library */
.zhub-slider-captcha-card.has-bg {
    background-image: linear-gradient(180deg, rgba(255,255,255,.90), rgba(255,255,255,.82)), var(--captcha-bg-image);
    background-size: cover;
    background-position: center;
}
.zhub-slider-captcha-card.has-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at top left, rgba(255,255,255,.45), transparent 42%), linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.52));
    z-index: 0;
    pointer-events: none;
}
.zhub-slider-captcha-card.has-bg > * {
    position: relative;
    z-index: 1;
}
.zhub-slider-captcha-card.has-bg::before {
    z-index: 2;
}
.zhub-slider-captcha-card.has-bg .zhub-slider-captcha-track {
    background: rgba(248, 250, 252, .88);
    border-color: rgba(148, 163, 184, .72);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 12px 28px rgba(15,23,42,.12);
}
.captcha-admin-bg-box {
    background: #f8fafc;
}
.captcha-admin-bg-preview {
    min-height: 118px;
    display: grid;
    place-items: center;
    background-color: #f1f5f9;
    background-size: cover;
    background-position: center;
}
.captcha-admin-bg-preview[style*="url"] {
    min-height: 150px;
}

/* B146 Public UI skin only: MudBlazor shell, app-like mobile, low-blue reading theme */
:root {
    --zhub-reader-bg: #f5f1e8;
    --zhub-public-bg: #f6f3ec;
    --zhub-public-surface: rgba(255, 253, 247, .94);
    --zhub-public-surface-solid: #fffdf7;
    --zhub-public-muted: #756f63;
    --zhub-public-text: #292721;
    --zhub-public-border: rgba(98, 90, 73, .14);
    --zhub-public-accent: #6f8f72;
    --zhub-public-accent-soft: rgba(111, 143, 114, .16);
    --zhub-public-warm: #c58b42;
    --zhub-public-shadow: 0 18px 46px rgba(72, 65, 52, .10);
    --zhub-public-radius: 24px;
    --bs-primary: #6f8f72;
    --bs-primary-rgb: 111,143,114;
    --bs-body-font-family: 'Nunito', 'Quicksand', 'Inter', 'Segoe UI', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    --bs-body-color: var(--zhub-public-text);
    --bs-body-bg: var(--zhub-public-bg);
}

html,
body {
    background: var(--zhub-public-bg);
    color: var(--zhub-public-text);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

.zhub-public-app-shell.mud-layout,
.zhub-public-layout {
    min-height: 100vh;
    background:
        radial-gradient(circle at 8% 0%, rgba(197, 139, 66, .10), transparent 34rem),
        radial-gradient(circle at 92% 16%, rgba(111, 143, 114, .12), transparent 34rem),
        var(--zhub-public-bg);
    font-family: var(--bs-body-font-family);
}

.zhub-public-left-rail.mud-drawer {
    width: 280px !important;
    border-right: 1px solid var(--zhub-public-border);
    background: rgba(255, 253, 247, .86);
    backdrop-filter: blur(18px);
    box-shadow: 8px 0 28px rgba(72, 65, 52, .05);
}

.zhub-left-rail-inner {
    min-height: 100%;
    display: flex;
    flex-direction: column;
    gap: .8rem;
    padding: 1.15rem .95rem 1rem;
}

.zhub-left-brand {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .7rem .72rem 1rem;
    text-decoration: none;
    color: var(--zhub-public-text);
}

.zhub-brand-mark {
    width: 44px;
    height: 44px;
    border-radius: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #779976, #caa15d);
    color: #fffaf0;
    box-shadow: 0 12px 30px rgba(111, 143, 114, .22);
}

.zhub-brand-copy strong,
.zhub-brand-copy small {
    display: block;
}

.zhub-brand-copy strong {
    font-size: 1.08rem;
    letter-spacing: .01em;
}

.zhub-brand-copy small {
    color: var(--zhub-public-muted);
    font-size: .76rem;
    line-height: 1.25;
}

.zhub-left-section {
    display: grid;
    gap: .28rem;
}

.zhub-left-label {
    padding: .65rem .75rem .28rem;
    font-size: .78rem;
    font-weight: 800;
    color: var(--zhub-public-muted);
    letter-spacing: .02em;
}

.zhub-left-link,
.zhub-left-group-title {
    display: flex;
    align-items: center;
    gap: .72rem;
    min-height: 42px;
    padding: .58rem .72rem;
    border-radius: 16px;
    color: var(--zhub-public-text);
    text-decoration: none;
    font-weight: 750;
    line-height: 1.2;
}

.zhub-left-link i,
.zhub-left-group-title i {
    width: 1.35rem;
    text-align: center;
    color: var(--zhub-public-muted);
}

.zhub-left-link span,
.zhub-left-group-title span {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zhub-left-link em {
    font-style: normal;
    font-size: .68rem;
    color: #fffdf7;
    background: var(--zhub-public-accent);
    border-radius: 999px;
    padding: .1rem .45rem;
}

.zhub-left-link:hover,
.zhub-left-link.active {
    color: var(--zhub-public-text);
    background: var(--zhub-public-accent-soft);
    box-shadow: inset 0 0 0 1px rgba(111, 143, 114, .14);
}

.zhub-left-link:hover i,
.zhub-left-link.active i {
    color: var(--zhub-public-accent);
}

.zhub-left-link-child {
    margin-left: 1rem;
    min-height: 38px;
    font-size: .92rem;
    color: var(--zhub-public-muted);
}

.zhub-left-group {
    display: grid;
    gap: .18rem;
}

.zhub-left-group-title {
    color: var(--zhub-public-muted);
    font-size: .9rem;
    min-height: 36px;
}

.zhub-left-spacer {
    flex: 1 1 auto;
}

.zhub-left-auth-card,
.zhub-left-profile-card {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-top: .6rem;
    padding: .85rem;
    border: 1px solid var(--zhub-public-border);
    border-radius: 22px;
    background: rgba(255, 255, 255, .65);
    box-shadow: 0 10px 24px rgba(72, 65, 52, .06);
}

.zhub-left-auth-card > i,
.zhub-left-profile-card > span,
.zhub-left-profile-card img {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    object-fit: cover;
    background: var(--zhub-public-accent-soft);
    color: var(--zhub-public-accent);
}

.zhub-left-auth-card strong,
.zhub-left-profile-card strong,
.zhub-left-auth-card small,
.zhub-left-profile-card small {
    display: block;
}

.zhub-left-auth-card small,
.zhub-left-profile-card small {
    color: var(--zhub-public-muted);
    font-size: .76rem;
    line-height: 1.25;
}

.zhub-left-auth-link {
    margin-left: auto;
    text-decoration: none;
    background: var(--zhub-public-accent);
    color: #fffdf7;
    border-radius: 999px;
    padding: .35rem .62rem;
    font-weight: 800;
    font-size: .78rem;
}

.zhub-public-mud-main {
    min-height: 100vh;
    padding: 0;
}

.zhub-public-mobile-topbar,
.zhub-public-desktop-topbar {
    position: sticky;
    top: 0;
    z-index: 1050;
    background: rgba(246, 243, 236, .82);
    backdrop-filter: blur(18px);
    border-bottom: 1px solid var(--zhub-public-border);
}

.zhub-public-mobile-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 62px;
    padding: .55rem .78rem;
}

.zhub-topbar-brand {
    text-decoration: none;
    color: var(--zhub-public-text);
    font-weight: 900;
    font-size: 1.08rem;
}

.zhub-topbar-actions {
    display: flex;
    align-items: center;
    gap: .35rem;
}

.zhub-topbar-icon,
.zhub-desktop-menu-toggle,
.zhub-soft-action {
    min-width: 42px;
    height: 42px;
    border: 1px solid var(--zhub-public-border);
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    padding: 0 .7rem;
    background: rgba(255, 253, 247, .82);
    color: var(--zhub-public-text);
    text-decoration: none;
    font-weight: 800;
    box-shadow: 0 8px 18px rgba(72, 65, 52, .06);
}

.zhub-topbar-icon:hover,
.zhub-desktop-menu-toggle:hover,
.zhub-soft-action:hover {
    color: var(--zhub-public-accent);
    border-color: rgba(111, 143, 114, .35);
}

.zhub-public-desktop-topbar {
    display: none;
    padding: .75rem 1rem;
}

.zhub-desktop-topbar-inner {
    display: flex;
    align-items: center;
    gap: .75rem;
    width: min(100%, 1760px);
    margin: 0 auto;
}

.zhub-public-search {
    flex: 1 1 auto;
    min-width: 0;
    height: 48px;
    border: 1px solid var(--zhub-public-border);
    border-radius: 18px;
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: 0 1rem;
    background: rgba(255, 253, 247, .84);
    box-shadow: 0 10px 24px rgba(72, 65, 52, .05);
}

.zhub-public-search i,
.zhub-right-search-card i {
    color: var(--zhub-public-muted);
}

.zhub-public-search input,
.zhub-right-search-card input {
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--zhub-public-text);
    font: inherit;
}

.zhub-public-actions {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex: 0 0 auto;
}

.zhub-soft-action em {
    position: absolute;
    top: -.25rem;
    right: -.25rem;
    min-width: 1.15rem;
    height: 1.15rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #bd6f45;
    color: #fffaf0;
    font-style: normal;
    font-size: .68rem;
}

.zhub-wallet-pill,
.zhub-user-chip {
    height: 42px;
    border: 1px solid var(--zhub-public-border);
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: 0 .78rem;
    background: rgba(255, 253, 247, .82);
    color: var(--zhub-public-text);
    font-weight: 800;
    box-shadow: 0 8px 18px rgba(72, 65, 52, .06);
}

.zhub-wallet-pill b {
    color: var(--zhub-public-accent);
}

.zhub-user-chip {
    border: 0;
}

.zhub-nav-avatar {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    object-fit: cover;
}

.zhub-user-dropdown {
    border: 1px solid var(--zhub-public-border);
    border-radius: 18px;
    padding: .55rem;
    box-shadow: var(--zhub-public-shadow);
}

.zhub-public-main {
    padding: .9rem .85rem 5.8rem;
}

.zhub-public-shell-grid {
    width: min(100%, 1760px);
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
}

.zhub-public-content-pane {
    min-width: 0;
}

.zhub-public-body-frame > .container,
.zhub-public-body-frame > .container-lg,
.zhub-public-body-frame > .container-xl,
.zhub-public-body-frame > .container-xxl,
.zhub-public-body-frame .zhub-reader-page > .container {
    max-width: 100% !important;
}

.zhub-public-body-frame .container {
    width: 100%;
}

.zhub-public-card,
.zhub-public-body-frame .card,
.zhub-public-body-frame .news-block,
.zhub-public-body-frame .story-section,
.zhub-public-body-frame .story-detail-hero,
.zhub-public-body-frame .story-sidebar-card,
.zhub-public-body-frame .news-sidebar-box,
.zhub-public-body-frame .news-side-card {
    border: 1px solid var(--zhub-public-border) !important;
    border-radius: var(--zhub-public-radius) !important;
    background: var(--zhub-public-surface) !important;
    box-shadow: var(--zhub-public-shadow) !important;
}

.zhub-public-right-rail {
    display: none;
    min-width: 0;
}

.zhub-right-search-card,
.zhub-right-widget {
    border: 1px solid var(--zhub-public-border) !important;
    border-radius: 24px !important;
    background: var(--zhub-public-surface) !important;
    box-shadow: 0 14px 34px rgba(72, 65, 52, .08) !important;
}

.zhub-right-search-card {
    height: 54px;
    display: flex;
    align-items: center;
    gap: .7rem;
    padding: 0 .9rem;
    margin-bottom: .9rem;
}

.zhub-right-search-card button {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 14px;
    background: var(--zhub-public-accent-soft);
    color: var(--zhub-public-accent);
}

.zhub-right-widget {
    margin-bottom: .9rem;
}

.zhub-widget-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .75rem;
}

.zhub-widget-title strong {
    font-size: 1rem;
}

.zhub-widget-title a,
.zhub-widget-title span {
    color: var(--zhub-public-muted);
    font-size: .82rem;
    text-decoration: none;
}

.zhub-right-link {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .62rem .2rem;
    color: var(--zhub-public-text);
    text-decoration: none;
    border-top: 1px dashed rgba(98, 90, 73, .12);
    font-weight: 750;
}

.zhub-right-link i {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--zhub-public-accent-soft);
    color: var(--zhub-public-accent);
}

.zhub-public-bottom-nav {
    position: fixed;
    left: .75rem;
    right: .75rem;
    bottom: .75rem;
    z-index: 1100;
    min-height: 62px;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: .25rem;
    padding: .35rem;
    border: 1px solid var(--zhub-public-border);
    border-radius: 24px;
    background: rgba(255, 253, 247, .92);
    backdrop-filter: blur(18px);
    box-shadow: 0 20px 48px rgba(72, 65, 52, .16);
}

.zhub-public-bottom-nav a {
    min-width: 0;
    border-radius: 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .12rem;
    color: var(--zhub-public-muted);
    text-decoration: none;
    font-size: .72rem;
    font-weight: 800;
}

.zhub-public-bottom-nav a i {
    font-size: 1.05rem;
}

.zhub-public-bottom-nav a.active {
    background: var(--zhub-public-accent-soft);
    color: var(--zhub-public-accent);
}

.zhub-public-mini-footer {
    padding: .25rem .85rem 5.6rem;
}

/* Reader comfort: larger rounded font, warm paper, low glare, no blue cast. */
.zhub-reader-page {
    background: linear-gradient(180deg, #f4efe3, #faf6ec) !important;
    color: #2d2920;
}

.zhub-reader-page .reader-title h1 {
    color: #5f795f !important;
    font-size: clamp(1.35rem, 3.6vw, 2.15rem) !important;
    line-height: 1.25;
}

.novel-reader .novel-content-card,
.novel-content-card {
    max-width: min(100%, 1020px) !important;
    background: #fffaf0 !important;
    color: #2d2920 !important;
    border: 1px solid rgba(98, 90, 73, .12) !important;
    border-radius: 28px !important;
    font-family: 'Nunito', 'Quicksand', 'Segoe UI', system-ui, sans-serif !important;
    font-size: clamp(1.22rem, 1.1vw + 1rem, 1.48rem) !important;
    line-height: 2.05 !important;
    letter-spacing: .006em;
    box-shadow: 0 20px 48px rgba(72, 65, 52, .10) !important;
}

.novel-reader .novel-content-card p,
.novel-reader .zhub-rich-content p {
    margin-bottom: 1.35rem !important;
}

.comic-reader .comic-slide-viewer,
.zhub-reader-page .comic-slide-viewer,
.zhub-reader-page .novel-chunk-slide-viewer {
    background: #fffaf0 !important;
    border: 1px solid rgba(98, 90, 73, .12) !important;
    border-radius: 28px !important;
    box-shadow: 0 18px 46px rgba(72, 65, 52, .10) !important;
}

@media (min-width: 992px) {
    .zhub-public-mobile-topbar {
        display: none;
    }

    .zhub-public-desktop-topbar {
        display: block;
    }

    .zhub-public-main {
        padding: 1.25rem 1.15rem 1.75rem;
    }

    .zhub-public-shell-grid {
        grid-template-columns: minmax(0, 1fr) 320px;
        gap: 1.15rem;
    }

    .zhub-public-right-rail {
        display: block;
        position: sticky;
        top: 88px;
        align-self: start;
        max-height: calc(100vh - 104px);
        overflow: auto;
        scrollbar-width: thin;
    }

    .zhub-public-bottom-nav {
        display: none;
    }

    .zhub-public-mini-footer {
        padding-bottom: 1.2rem;
    }
}

@media (min-width: 1280px) {
    .zhub-public-shell-grid {
        grid-template-columns: minmax(760px, 1fr) 330px;
        gap: 1.35rem;
    }
}

@media (min-width: 1540px) {
    .zhub-public-left-rail.mud-drawer {
        width: 296px !important;
    }

    .zhub-public-shell-grid,
    .zhub-desktop-topbar-inner {
        width: min(100%, 1840px);
    }

    .zhub-public-shell-grid {
        grid-template-columns: minmax(980px, 1fr) 340px;
    }
}

@media (max-width: 991.98px) {
    .zhub-public-left-rail.mud-drawer {
        width: min(84vw, 310px) !important;
    }

    .zhub-public-body-frame .row > [class*="col-"] {
        margin-bottom: .85rem;
    }

    .zhub-public-body-frame .news-card-grid,
    .zhub-public-body-frame .story-home-novel-grid,
    .zhub-public-body-frame .story-home-comic-grid {
        gap: .75rem;
    }

    .zhub-public-body-frame .story-detail-hero,
    .zhub-public-body-frame .story-hero {
        padding: 1rem !important;
    }

    .novel-reader .novel-content-card,
    .novel-content-card {
        padding: 1.2rem !important;
        border-radius: 22px !important;
    }
}

@media (max-width: 575.98px) {
    .zhub-public-main {
        padding-left: .55rem;
        padding-right: .55rem;
    }

    .zhub-public-mobile-topbar {
        min-height: 58px;
        padding-left: .55rem;
        padding-right: .55rem;
    }

    .zhub-topbar-icon {
        min-width: 39px;
        height: 39px;
        border-radius: 15px;
        padding: 0 .55rem;
    }

    .zhub-public-bottom-nav {
        left: .45rem;
        right: .45rem;
        bottom: .45rem;
        border-radius: 21px;
    }

    .zhub-public-bottom-nav a span {
        font-size: .66rem;
    }
}

[data-bs-theme="dark"],
[data-theme="dark"] {
    --zhub-public-bg: #1f211d;
    --zhub-public-surface: rgba(42, 42, 35, .94);
    --zhub-public-surface-solid: #2a2a23;
    --zhub-public-text: #eee9db;
    --zhub-public-muted: #c5bdac;
    --zhub-public-border: rgba(238, 233, 219, .13);
    --zhub-public-accent: #91aa87;
    --zhub-public-accent-soft: rgba(145, 170, 135, .16);
    --zhub-public-shadow: 0 18px 46px rgba(0, 0, 0, .22);
    --bs-body-color: var(--zhub-public-text);
    --bs-body-bg: var(--zhub-public-bg);
}

[data-bs-theme="dark"] .novel-reader .novel-content-card,
[data-bs-theme="dark"] .novel-content-card,
[data-theme="dark"] .novel-reader .novel-content-card,
[data-theme="dark"] .novel-content-card {
    background: #2c2a22 !important;
    color: #eee9db !important;
}


/* B147 public shell/mail skin polish: collapsible left rail + modal mailbox reader */
.zhub-left-brand-row {
    display: flex;
    align-items: center;
    gap: .45rem;
}

.zhub-left-brand-row .zhub-left-brand {
    flex: 1 1 auto;
    min-width: 0;
}

.zhub-left-collapse-btn {
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border: 1px solid var(--zhub-public-border);
    border-radius: 15px;
    background: rgba(255,255,255,.68);
    color: var(--zhub-public-muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 24px rgba(72, 65, 52, .08);
}

.zhub-left-collapse-btn:hover,
.zhub-desktop-menu-toggle:hover {
    color: var(--zhub-public-accent);
    background: var(--zhub-public-accent-soft);
}

@media (min-width: 992px) {
    .zhub-public-left-compact .zhub-public-left-rail.mud-drawer,
    .zhub-public-left-rail-compact.mud-drawer {
        width: 84px !important;
        overflow: visible !important;
    }

    .zhub-public-left-compact .mud-main-content {
        margin-left: 84px !important;
    }

    .zhub-public-left-compact .zhub-left-rail-inner {
        padding-left: .62rem;
        padding-right: .62rem;
        align-items: stretch;
    }

    .zhub-public-left-compact .zhub-left-brand-row {
        justify-content: center;
    }

    .zhub-public-left-compact .zhub-left-brand {
        justify-content: center;
        padding: .58rem .25rem .25rem;
    }

    .zhub-public-left-compact .zhub-brand-copy,
    .zhub-public-left-compact .zhub-left-label,
    .zhub-public-left-compact .zhub-left-link span,
    .zhub-public-left-compact .zhub-left-link em,
    .zhub-public-left-compact .zhub-left-group-title span,
    .zhub-public-left-compact .zhub-left-auth-card div,
    .zhub-public-left-compact .zhub-left-profile-card div,
    .zhub-public-left-compact .zhub-left-auth-link {
        display: none !important;
    }

    .zhub-public-left-compact .zhub-left-collapse-btn {
        position: absolute;
        top: .72rem;
        right: -.88rem;
        z-index: 9;
        width: 32px;
        height: 32px;
        border-radius: 999px;
    }

    .zhub-public-left-compact .zhub-brand-mark {
        width: 44px;
        height: 44px;
        border-radius: 17px;
    }

    .zhub-public-left-compact .zhub-left-link,
    .zhub-public-left-compact .zhub-left-group-title {
        position: relative;
        justify-content: center;
        gap: 0;
        min-height: 46px;
        padding: .55rem;
        border-radius: 17px;
    }

    .zhub-public-left-compact .zhub-left-link i,
    .zhub-public-left-compact .zhub-left-group-title i {
        width: auto;
        font-size: 1.08rem;
    }

    .zhub-public-left-compact .zhub-left-link-child {
        margin-left: 0;
    }

    .zhub-public-left-compact .zhub-left-link[data-rail-title]:hover::after,
    .zhub-public-left-compact .zhub-left-link[data-rail-title]:focus-visible::after {
        content: attr(data-rail-title);
        position: absolute;
        left: calc(100% + .65rem);
        top: 50%;
        transform: translateY(-50%);
        z-index: 1300;
        white-space: nowrap;
        max-width: 240px;
        overflow: hidden;
        text-overflow: ellipsis;
        padding: .45rem .7rem;
        border: 1px solid var(--zhub-public-border);
        border-radius: 14px;
        background: rgba(41, 39, 33, .94);
        color: #fffaf0;
        box-shadow: 0 16px 36px rgba(15, 23, 42, .22);
        font-size: .82rem;
        font-weight: 800;
        pointer-events: none;
    }

    .zhub-public-left-compact .zhub-left-auth-card,
    .zhub-public-left-compact .zhub-left-profile-card {
        justify-content: center;
        padding: .55rem;
    }
}

.public-mail-reader-modal .modal-content,
.note-modal .modal-content {
    border: 0;
    border-radius: 24px;
    background: var(--zhub-public-surface-solid, #fffdf7);
    box-shadow: 0 28px 72px rgba(72, 65, 52, .20);
}

.public-mail-reader-modal .modal-body {
    background: linear-gradient(180deg, rgba(111,143,114,.06), transparent 14rem);
}

.public-mail-reader-hint {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .75rem .9rem;
    border: 1px solid var(--zhub-public-border);
    border-radius: 18px;
    background: rgba(111,143,114,.08);
    color: var(--zhub-public-muted);
    font-size: .92rem;
    font-weight: 700;
}

.public-mail-reader-hint i {
    color: var(--zhub-public-accent);
}

.public-mail-reader-grid .mail-column-card,
#mailbox-account-section .mail-column-card,
#mailbox-game-note-section.note-card {
    border: 1px solid var(--zhub-public-border) !important;
    border-radius: 24px !important;
    background: var(--zhub-public-surface-solid, #fffdf7) !important;
    box-shadow: var(--zhub-public-shadow) !important;
    overflow: hidden;
}

#mailbox-account-section .mail-pane {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: .75rem;
    max-height: none;
}

#mailbox-account-section .account-item {
    border-radius: 20px;
    background: rgba(255,255,255,.7);
}

#mailbox-account-section .account-row-actions {
    justify-content: flex-start !important;
}

.public-mail-reader-modal .mail-pane {
    max-height: min(66vh, 720px);
    overflow: auto;
    padding-right: .2rem;
}

.public-mail-reader-modal .viewer-frame,
.public-mail-reader-modal .zhub-mail-frame {
    min-height: min(64vh, 760px);
    width: 100%;
    border: 1px solid var(--zhub-public-border);
    border-radius: 18px;
    background: #fff;
}

.public-mail-reader-modal .viewer-text {
    min-height: min(54vh, 640px);
    border: 1px solid var(--zhub-public-border);
    border-radius: 18px;
    padding: 1rem;
    background: #fffaf0;
    white-space: pre-wrap;
    line-height: 1.75;
}

@media (max-width: 991.98px) {
    .public-mail-reader-modal.modal-dialog {
        max-width: none;
        margin: .4rem;
    }

    .public-mail-reader-modal .modal-content {
        max-height: calc(100dvh - .8rem);
        border-radius: 22px;
    }

    .public-mail-reader-modal .modal-body {
        padding: .75rem;
    }

    .public-mail-reader-grid {
        gap: .75rem !important;
    }

    #mailbox-account-section .mail-pane {
        grid-template-columns: 1fr;
    }

    .public-mail-reader-modal .mail-pane {
        max-height: 38dvh;
    }

    .public-mail-reader-modal .viewer-frame,
    .public-mail-reader-modal .zhub-mail-frame,
    .public-mail-reader-modal .viewer-text {
        min-height: 48dvh;
    }
}


/* B148 public/admin UX polish: modern low-glare colors, readable active state, modal mail no auto-scroll. */
:root {
    --zhub-public-bg: #f3efe7;
    --zhub-public-surface: rgba(255, 252, 245, .96);
    --zhub-public-surface-solid: #fffcf5;
    --zhub-public-text: #27241f;
    --zhub-public-muted: #6e695f;
    --zhub-public-border: rgba(88, 78, 62, .16);
    --zhub-public-accent: #667f5d;
    --zhub-public-accent-strong: #50684a;
    --zhub-public-accent-soft: rgba(102, 127, 93, .18);
    --zhub-public-warm: #b98245;
    --zhub-public-active-bg: linear-gradient(135deg, #667f5d, #9d7a42);
    --zhub-public-active-text: #fffaf0;
    --zhub-public-shadow: 0 18px 48px rgba(54, 48, 39, .11);
}

.zhub-left-link.active,
.zhub-public-bottom-nav a.active,
.zhub-public-body-frame .active:not(.carousel-item):not(.page-link),
.account-item.active,
.mail-item.active {
    background: var(--zhub-public-active-bg) !important;
    color: var(--zhub-public-active-text) !important;
    border-color: rgba(80, 104, 74, .36) !important;
    box-shadow: 0 14px 34px rgba(80,104,74,.18) !important;
}

.zhub-left-link.active i,
.zhub-public-bottom-nav a.active i,
.account-item.active .mail-meta,
.account-item.active .small,
.mail-item.active .mail-meta,
.mail-item.active .mail-snippet {
    color: rgba(255, 250, 240, .88) !important;
}

.zhub-public-body-frame .btn-primary,
.zhub-public-actions .zhub-soft-action.active {
    background: var(--zhub-public-active-bg) !important;
    border-color: transparent !important;
    color: var(--zhub-public-active-text) !important;
}

.zhub-toast-glass {
    border: 1px solid rgba(255,250,240,.24) !important;
    border-radius: 22px !important;
    background: rgba(44, 40, 33, .94) !important;
    color: #fffaf0 !important;
    backdrop-filter: blur(18px);
}

.zhub-toast-primary .zhub-toast-icon,
.zhub-toast-info .zhub-toast-icon {
    background: rgba(145,170,135,.20) !important;
    color: #dcead4 !important;
}

.public-mail-reader-modal .mail-item.active {
    color: var(--zhub-public-active-text) !important;
}

.public-mail-reader-modal .modal-dialog {
    max-width: min(1320px, calc(100vw - 1.2rem));
}

.public-mail-reader-modal .mail-column-card .card-header {
    background: linear-gradient(135deg, #50684a, #8b6c3d) !important;
    color: #fffaf0 !important;
}

@media (min-width: 992px) {
    .public-mail-reader-grid {
        grid-template-columns: minmax(360px, 42%) minmax(0, 58%);
    }
}

[data-bs-theme="dark"],
[data-theme="dark"] {
    --zhub-public-bg: #20211c;
    --zhub-public-surface: rgba(42, 42, 35, .96);
    --zhub-public-surface-solid: #2a2a23;
    --zhub-public-text: #eee9db;
    --zhub-public-muted: #c8c0ae;
    --zhub-public-border: rgba(238,233,219,.14);
    --zhub-public-accent: #91aa87;
    --zhub-public-accent-strong: #a9c09a;
    --zhub-public-active-bg: linear-gradient(135deg, #75916a, #a8834a);
    --zhub-public-active-text: #fffaf0;
}


/* B152: public mobile-first shell polish + low-glare 4-theme-ready variables. */
:root {
    --zhub-public-bg: #f5f1e8;
    --zhub-public-surface: rgba(255, 253, 247, .97);
    --zhub-public-surface-solid: #fffdf7;
    --zhub-public-text: #25231f;
    --zhub-public-muted: #6e675c;
    --zhub-public-border: rgba(84, 75, 60, .15);
    --zhub-public-accent: #607b58;
    --zhub-public-accent-strong: #4e6847;
    --zhub-public-accent-soft: rgba(96, 123, 88, .17);
    --zhub-public-warm: #a8763f;
    --zhub-public-active-bg: linear-gradient(135deg, #536f4d, #9a7040);
    --zhub-public-active-text: #fffdf4;
    --zhub-public-shadow: 0 18px 46px rgba(48, 43, 34, .10);
    --zhub-public-radius: clamp(18px, 2vw, 26px);
}

.zhub-public-body-frame,
.zhub-public-body-frame .card,
.zhub-public-body-frame .form-control,
.zhub-public-body-frame .form-select,
.zhub-public-body-frame .btn,
.zhub-public-right-rail,
.zhub-public-bottom-nav {
    font-size: clamp(.92rem, .25vw + .86rem, 1.02rem);
}

.zhub-public-main {
    padding: clamp(.65rem, 2vw, 1.25rem) clamp(.55rem, 1.5vw, 1.2rem) 6.6rem;
}

.zhub-public-shell-grid {
    width: min(100%, 1880px);
    gap: clamp(.8rem, 1.4vw, 1.45rem);
}

.zhub-public-right-rail {
    display: grid;
    grid-template-columns: 1fr;
    gap: .85rem;
    align-content: start;
}

.zhub-right-search-card,
.zhub-right-widget,
.zhub-public-body-frame .card,
.zhub-public-card {
    border-color: var(--zhub-public-border) !important;
    background: var(--zhub-public-surface) !important;
    color: var(--zhub-public-text) !important;
}

.zhub-right-search-card,
.zhub-right-widget {
    margin-bottom: 0;
}

.zhub-left-link.active,
.zhub-left-link.active:hover,
.zhub-public-bottom-nav a.active,
.zhub-public-bottom-nav a.active:hover,
.zhub-public-body-frame .active:not(.carousel-item):not(.page-link):not(.dropdown-menu),
.account-item.active,
.mail-item.active,
.zhub-right-link.active {
    background: var(--zhub-public-active-bg) !important;
    color: var(--zhub-public-active-text) !important;
    border-color: rgba(83, 111, 77, .38) !important;
    box-shadow: 0 14px 32px rgba(83, 111, 77, .18) !important;
}

.zhub-left-link.active *,
.zhub-public-bottom-nav a.active *,
.account-item.active *,
.mail-item.active * {
    color: var(--zhub-public-active-text) !important;
}

.zhub-public-bottom-nav {
    min-height: 70px;
    padding: .42rem;
    border-radius: 26px;
    background: rgba(255, 253, 247, .94);
}

.zhub-public-bottom-nav a {
    min-height: 56px;
    gap: .16rem;
    border: 1px solid transparent;
    font-size: clamp(.72rem, 2.1vw, .82rem);
}

.zhub-public-bottom-nav a i {
    font-size: clamp(1.22rem, 4.2vw, 1.52rem);
    line-height: 1;
}

.zhub-public-bottom-nav a:not(.active):hover {
    background: rgba(96, 123, 88, .10);
    color: var(--zhub-public-accent-strong);
}

@media (max-width: 991.98px) {
    .zhub-public-shell-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .zhub-public-content-pane {
        order: 1;
    }

    .zhub-public-right-rail {
        order: 2;
        position: static;
        max-height: none;
        overflow: visible;
        display: grid;
        grid-template-columns: 1fr;
        gap: .82rem;
    }

    .zhub-right-search-card {
        height: 50px;
        border-radius: 20px !important;
    }

    .zhub-right-widget {
        border-radius: 22px !important;
        padding: .9rem !important;
    }

    .zhub-public-body-frame > .container,
    .zhub-public-body-frame > .container-fluid,
    .zhub-public-body-frame .container,
    .zhub-public-body-frame .container-fluid {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .zhub-public-body-frame .card,
    .zhub-public-card,
    .zhub-public-body-frame .news-block,
    .zhub-public-body-frame .story-section,
    .zhub-public-body-frame .story-detail-hero,
    .zhub-public-body-frame .story-sidebar-card,
    .zhub-public-body-frame .news-sidebar-box,
    .zhub-public-body-frame .news-side-card {
        border-radius: 20px !important;
        box-shadow: 0 12px 30px rgba(48, 43, 34, .08) !important;
    }
}

@media (min-width: 992px) {
    .zhub-public-shell-grid {
        grid-template-columns: minmax(720px, 1fr) minmax(300px, 330px);
    }

    .zhub-public-right-rail {
        position: sticky;
        top: 88px;
        max-height: calc(100vh - 104px);
        overflow: auto;
        scrollbar-width: thin;
    }
}

@media (min-width: 1320px) {
    .zhub-public-shell-grid {
        grid-template-columns: minmax(900px, 1fr) 340px;
    }
}

@media (min-width: 1680px) {
    .zhub-public-shell-grid,
    .zhub-desktop-topbar-inner {
        width: min(100%, 1960px);
    }

    .zhub-public-shell-grid {
        grid-template-columns: minmax(1120px, 1fr) 360px;
    }
}

@media (max-width: 575.98px) {
    .zhub-public-main {
        padding-bottom: 6.9rem;
    }

    .zhub-public-bottom-nav {
        left: .38rem;
        right: .38rem;
        bottom: .38rem;
        min-height: 72px;
    }

    .zhub-public-bottom-nav a span {
        font-size: .72rem;
    }
}

[data-bs-theme="dark"],
[data-theme="dark"] {
    --zhub-public-bg: #20201b;
    --zhub-public-surface: rgba(43, 42, 35, .97);
    --zhub-public-surface-solid: #2b2a23;
    --zhub-public-text: #f0eadc;
    --zhub-public-muted: #c8c0ae;
    --zhub-public-border: rgba(240, 234, 220, .14);
    --zhub-public-accent: #97ad8c;
    --zhub-public-accent-strong: #bdd0b3;
    --zhub-public-accent-soft: rgba(151, 173, 140, .17);
    --zhub-public-warm: #c49a61;
    --zhub-public-active-bg: linear-gradient(135deg, #78936d, #b0844d);
    --zhub-public-active-text: #fffaf0;
}

/* B153: stronger public operational-toast cleanup support + peach/dark low-glare polish + mailbox avatars. */
:root {
    --zhub-public-peach: #d99b87;
    --zhub-public-peach-soft: rgba(217, 155, 135, .18);
}

[data-bs-theme="dark"],
[data-theme="dark"] {
    --zhub-public-peach: #e1a992;
    --zhub-public-peach-soft: rgba(225, 169, 146, .18);
}

.zhub-public-body-frame .btn-primary,
.zhub-public-body-frame .text-bg-primary,
.zhub-public-body-frame .badge.text-bg-primary {
    background: var(--zhub-public-active-bg) !important;
    color: var(--zhub-public-active-text) !important;
    border-color: color-mix(in srgb, var(--zhub-public-accent) 46%, transparent) !important;
}

.zhub-public-body-frame .btn-outline-primary {
    color: var(--zhub-public-accent-strong) !important;
    border-color: color-mix(in srgb, var(--zhub-public-accent) 38%, transparent) !important;
    background: color-mix(in srgb, var(--zhub-public-surface-solid) 82%, transparent) !important;
}

.zhub-public-body-frame .btn-outline-primary:hover,
.zhub-public-body-frame .btn-outline-primary:focus-visible {
    background: var(--zhub-public-active-bg) !important;
    color: var(--zhub-public-active-text) !important;
}

.zhub-public-body-frame .active:not(.carousel-item):not(.page-link):not(.dropdown-menu) .text-muted,
.account-item.active .text-muted,
.mail-item.active .text-muted,
.account-item.active .mail-meta,
.mail-item.active .mail-meta,
.account-item.active .mail-snippet,
.mail-item.active .mail-snippet {
    color: color-mix(in srgb, var(--zhub-public-active-text) 84%, transparent) !important;
}

.mail-account-avatar {
    width: clamp(3.4rem, 4.8vw, 5rem);
    height: clamp(3.4rem, 4.8vw, 5rem);
    min-width: clamp(3.4rem, 4.8vw, 5rem);
    border-radius: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    font-size: clamp(1.35rem, 1.6vw, 2rem);
    letter-spacing: .02em;
    color: var(--zhub-public-active-text);
    background: linear-gradient(135deg, var(--zhub-public-accent), var(--zhub-public-peach));
    border: 1px solid color-mix(in srgb, var(--zhub-public-accent) 28%, transparent);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 12px 28px rgba(67, 58, 46, .13);
}

.account-item.active .mail-account-avatar {
    background: rgba(255,255,255,.20);
    border-color: rgba(255,255,255,.32);
    color: var(--zhub-public-active-text);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 12px 26px rgba(0,0,0,.14);
}

.account-main-button .account-email-title {
    font-size: clamp(.98rem, .35vw + .92rem, 1.12rem);
    line-height: 1.25;
}

.min-width-0 { min-width: 0 !important; }

@media (max-width: 575.98px) {
    .mail-account-avatar {
        width: 3.4rem;
        height: 3.4rem;
        min-width: 3.4rem;
        border-radius: 20px;
        font-size: 1.35rem;
    }

    .account-main-button .account-email-title {
        font-size: .98rem;
    }
}

[data-bs-theme="dark"] .zhub-public-body-frame,
[data-theme="dark"] .zhub-public-body-frame {
    background: radial-gradient(circle at top left, rgba(225,169,146,.07), transparent 30rem), var(--zhub-public-bg) !important;
    color: var(--zhub-public-text) !important;
}

[data-bs-theme="dark"] .zhub-public-body-frame .card,
[data-bs-theme="dark"] .zhub-public-body-frame .modal-content,
[data-bs-theme="dark"] .zhub-public-body-frame .dropdown-menu,
[data-bs-theme="dark"] .zhub-public-body-frame .list-group-item,
[data-theme="dark"] .zhub-public-body-frame .card,
[data-theme="dark"] .zhub-public-body-frame .modal-content,
[data-theme="dark"] .zhub-public-body-frame .dropdown-menu,
[data-theme="dark"] .zhub-public-body-frame .list-group-item {
    background: var(--zhub-public-surface) !important;
    color: var(--zhub-public-text) !important;
    border-color: var(--zhub-public-border) !important;
}

[data-bs-theme="dark"] .zhub-public-body-frame .form-control,
[data-bs-theme="dark"] .zhub-public-body-frame .form-select,
[data-bs-theme="dark"] .zhub-public-body-frame .input-group-text,
[data-theme="dark"] .zhub-public-body-frame .form-control,
[data-theme="dark"] .zhub-public-body-frame .form-select,
[data-theme="dark"] .zhub-public-body-frame .input-group-text {
    background: rgba(34, 32, 28, .96) !important;
    color: var(--zhub-public-text) !important;
    border-color: var(--zhub-public-border) !important;
}

[data-bs-theme="dark"] .zhub-public-body-frame .text-muted,
[data-theme="dark"] .zhub-public-body-frame .text-muted {
    color: var(--zhub-public-muted) !important;
}

/* B155: one global public sidebar. Page-specific sidebar blocks now render inside PublicLayout right rail. */
.zhub-page-sidebar-widget {
    overflow: hidden;
}

.zhub-widget-title-page strong {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    color: var(--zhub-public-text);
}

.zhub-global-sidebar-content {
    display: grid;
    gap: .88rem;
}

.zhub-page-sidebar-sections {
    display: grid;
    gap: .88rem;
}

.zhub-page-sidebar-section {
    display: grid;
    gap: .62rem;
    padding: .85rem;
    border: 1px solid color-mix(in srgb, var(--zhub-public-border) 80%, transparent);
    border-radius: 20px;
    background: color-mix(in srgb, var(--zhub-public-surface-solid, #fffdf7) 78%, transparent);
}

.zhub-page-sidebar-section h3 {
    display: flex;
    align-items: center;
    gap: .15rem;
    margin: 0;
    font-size: .98rem;
    font-weight: 850;
    letter-spacing: -.01em;
    color: var(--zhub-public-text);
}

.zhub-sidebar-link-list,
.zhub-sidebar-nav-list {
    display: grid;
    gap: .38rem;
}

.zhub-sidebar-link-list a,
.zhub-sidebar-nav-link {
    display: flex;
    align-items: center;
    gap: .55rem;
    min-width: 0;
    padding: .58rem .62rem;
    border-radius: 15px;
    color: var(--zhub-public-text);
    text-decoration: none;
    background: color-mix(in srgb, var(--zhub-public-surface) 82%, transparent);
    border: 1px solid transparent;
    line-height: 1.35;
}

.zhub-sidebar-link-list a:hover,
.zhub-sidebar-nav-link:hover {
    background: var(--zhub-public-accent-soft);
    color: var(--zhub-public-accent-strong);
    border-color: color-mix(in srgb, var(--zhub-public-accent) 30%, transparent);
}

.zhub-sidebar-nav-link.active,
.zhub-sidebar-chip.active {
    background: var(--zhub-public-active-bg) !important;
    color: var(--zhub-public-active-text) !important;
    border-color: color-mix(in srgb, var(--zhub-public-accent) 46%, transparent) !important;
    box-shadow: 0 12px 26px rgba(83, 111, 77, .16);
}

.zhub-sidebar-nav-link.active *,
.zhub-sidebar-chip.active * {
    color: var(--zhub-public-active-text) !important;
}

.zhub-sidebar-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

.zhub-sidebar-chip-list-vertical {
    display: grid;
    grid-template-columns: 1fr;
}

.zhub-sidebar-chip {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    width: fit-content;
    min-height: 36px;
    padding: .45rem .68rem;
    border: 1px solid var(--zhub-public-border);
    border-radius: 999px;
    background: color-mix(in srgb, var(--zhub-public-surface) 88%, transparent);
    color: var(--zhub-public-text);
    font-weight: 700;
    text-decoration: none;
}

.zhub-sidebar-chip-list-vertical .zhub-sidebar-chip {
    width: 100%;
    border-radius: 15px;
}

.zhub-sidebar-chip em {
    min-width: 24px;
    padding: .05rem .38rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--zhub-public-accent-soft) 70%, transparent);
    color: inherit;
    font-style: normal;
    font-size: .78rem;
    text-align: center;
}

.zhub-sidebar-story-list {
    display: grid;
    gap: .52rem;
}

.zhub-sidebar-story-item {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: .15rem .55rem;
    align-items: center;
    padding: .46rem;
    border-radius: 16px;
    color: var(--zhub-public-text);
    text-decoration: none;
    background: color-mix(in srgb, var(--zhub-public-surface) 88%, transparent);
    border: 1px solid transparent;
}

.zhub-sidebar-story-item:hover {
    background: var(--zhub-public-accent-soft);
    border-color: color-mix(in srgb, var(--zhub-public-accent) 26%, transparent);
}

.zhub-sidebar-story-item img,
.zhub-sidebar-story-item > span:first-child {
    grid-row: 1 / span 2;
    width: 48px;
    height: 64px;
    object-fit: cover;
    border-radius: 12px;
    background: var(--zhub-public-accent-soft);
}

.zhub-sidebar-story-item > span:first-child {
    display: grid;
    place-items: center;
    color: var(--zhub-public-accent-strong);
}

.zhub-sidebar-story-item strong,
.zhub-sidebar-story-item small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zhub-sidebar-story-item strong {
    font-size: .92rem;
    font-weight: 800;
}

.zhub-sidebar-story-item small {
    color: var(--zhub-public-muted);
    font-size: .78rem;
}

@media (max-width: 991.98px) {
    .zhub-page-sidebar-widget {
        order: -1;
    }

    .zhub-page-sidebar-section {
        padding: .75rem;
        border-radius: 18px;
    }

    .zhub-sidebar-chip-list-vertical {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .zhub-sidebar-chip-list-vertical {
        grid-template-columns: 1fr;
    }

    .zhub-sidebar-link-list a,
    .zhub-sidebar-nav-link,
    .zhub-sidebar-chip {
        min-height: 42px;
    }
}


/* B156: Public global sidebar width recovery.
   Keep a single global sidebar, but never let reader/forum/story main content collapse into a sidebar-sized column. */
.zhub-public-main {
    width: 100%;
    max-width: none !important;
}

.zhub-public-shell-grid,
.zhub-desktop-topbar-inner {
    width: min(100%, calc(100vw - 1.6rem));
    max-width: none !important;
}

.zhub-public-content-pane,
.zhub-public-body-frame,
.zhub-public-body-frame > * {
    min-width: 0;
    width: 100%;
    max-width: none !important;
}

.zhub-public-body-frame > .container,
.zhub-public-body-frame > .container-sm,
.zhub-public-body-frame > .container-md,
.zhub-public-body-frame > .container-lg,
.zhub-public-body-frame > .container-xl,
.zhub-public-body-frame > .container-xxl,
.zhub-public-body-frame .zhub-story-page,
.zhub-public-body-frame .forum-page,
.zhub-public-body-frame .forum-detail-page,
.zhub-public-body-frame .story-detail-page,
.zhub-public-body-frame .zhub-reader-page > .container {
    width: 100% !important;
    max-width: none !important;
}

/* Old page-level two-column layouts are now flattened because sidebar content lives in PublicLayout. */
.zhub-public-body-frame .forum-page > .row > [class*="col-lg-"],
.zhub-public-body-frame .forum-detail-page > .row > main[class*="col-lg-"],
.zhub-public-body-frame .story-detail-page > .row > [class*="col-lg-"],
.zhub-public-body-frame .zhub-story-page > .row > [class*="col-lg-"] {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
}

.zhub-public-body-frame .forum-page > .row > aside,
.zhub-public-body-frame .forum-detail-page > .row > aside,
.zhub-public-body-frame .story-detail-page > .row > aside,
.zhub-public-body-frame .zhub-story-page > .row > aside {
    display: none !important;
}

.zhub-reader-page,
.zhub-reader-page > .container,
.story-reader-main-panel,
.story-reader-article,
.story-reader-lower-grid,
.story-reader-lower-main {
    width: 100% !important;
    max-width: none !important;
    min-width: 0;
}

.novel-reader article.story-reader-article,
.zhub-reader-page .zhub-rich-content,
.novel-reader .novel-content-card,
.novel-content-card {
    width: 100% !important;
    max-width: min(100%, 1280px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.comic-reader .comic-slide-shell,
.novel-chunk-slide-shell {
    width: 100%;
    max-width: none !important;
}

.comic-reader .comic-slide-viewer,
.zhub-reader-page .comic-slide-viewer,
.zhub-reader-page .novel-chunk-slide-viewer {
    width: 100% !important;
    max-width: none !important;
}

@media (min-width: 992px) {
    .zhub-public-main {
        padding-left: clamp(.85rem, 1vw, 1.35rem);
        padding-right: clamp(.85rem, 1vw, 1.35rem);
    }

    .zhub-public-shell-grid {
        grid-template-columns: minmax(0, 1fr) clamp(286px, 20vw, 340px) !important;
        gap: clamp(.9rem, 1.1vw, 1.35rem);
    }

    .zhub-public-content-pane {
        min-width: min(0px, 100%);
    }
}

@media (min-width: 1280px) {
    .zhub-public-shell-grid {
        grid-template-columns: minmax(0, 1fr) clamp(300px, 18vw, 350px) !important;
    }
}

@media (min-width: 1540px) {
    .zhub-public-shell-grid,
    .zhub-desktop-topbar-inner {
        width: min(100%, calc(100vw - 2.2rem)) !important;
    }

    .zhub-public-shell-grid {
        grid-template-columns: minmax(0, 1fr) clamp(310px, 17vw, 360px) !important;
    }

    .novel-reader .novel-content-card,
    .novel-content-card {
        max-width: min(100%, 1360px) !important;
    }
}

@media (max-width: 991.98px) {
    .zhub-public-shell-grid {
        display: block;
        width: 100% !important;
    }

    .zhub-public-content-pane,
    .zhub-public-body-frame,
    .zhub-public-body-frame > .container,
    .zhub-reader-page > .container {
        width: 100% !important;
        max-width: none !important;
    }
}

/* B157: Public true full-width content recovery.
   The PublicLayout owns the only right sidebar. Everything inside the remaining
   main pane must be allowed to fill the whole available width after nav-left
   and global sidebar are reserved. */
.zhub-public-layout .zhub-public-mud-main.mud-main-content,
.zhub-public-layout .zhub-public-mud-main {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    overflow-x: clip;
}

.zhub-public-main,
.zhub-public-shell-grid,
.zhub-public-content-pane,
.zhub-public-body-frame,
.zhub-public-body-frame > * {
    box-sizing: border-box;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

.zhub-public-shell-grid {
    margin-left: 0 !important;
    margin-right: 0 !important;
    justify-content: stretch !important;
    align-items: start !important;
}

.zhub-public-content-pane {
    justify-self: stretch !important;
    align-self: stretch !important;
}

/* Bootstrap page containers inside PublicLayout are not allowed to keep their
   old centered max-width because the shell already supplies the page margins. */
.zhub-public-body-frame > .container,
.zhub-public-body-frame > .container-sm,
.zhub-public-body-frame > .container-md,
.zhub-public-body-frame > .container-lg,
.zhub-public-body-frame > .container-xl,
.zhub-public-body-frame > .container-xxl,
.zhub-public-body-frame > .container-fluid,
.zhub-public-body-frame .public-php-parity-page,
.zhub-public-body-frame .zhub-story-page,
.zhub-public-body-frame .forum-page,
.zhub-public-body-frame .forum-detail-page,
.zhub-public-body-frame .blog-page,
.zhub-public-body-frame .blog-detail-page,
.zhub-public-body-frame .shop-page,
.zhub-public-body-frame .file-library-page,
.zhub-public-body-frame .zhub-reader-page > .container {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Reader had an old internal two-column grid. After moving reader sidebar to
   the global right rail, that grid made the article occupy the old sidebar
   column. Force it back to one full-width column. */
.zhub-public-body-frame .story-reader-body-grid,
.zhub-public-body-frame .story-reader-lower-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    max-width: none !important;
}

.zhub-public-body-frame .story-reader-main-panel,
.zhub-public-body-frame .story-reader-article,
.zhub-public-body-frame .story-reader-lower-main,
.zhub-public-body-frame .comic-slide-shell,
.zhub-public-body-frame .novel-chunk-slide-shell,
.zhub-public-body-frame .comic-slide-viewer,
.zhub-public-body-frame .novel-chunk-slide-viewer,
.zhub-public-body-frame .story-reader-related-box,
.zhub-public-body-frame .story-speech-card,
.zhub-public-body-frame .story-speech-help-card,
.zhub-public-body-frame .story-audio-reader-card {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

.zhub-public-body-frame .novel-reader .novel-content-card,
.zhub-public-body-frame .novel-content-card {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Forum/story/detail rows should no longer reserve a hidden page-sidebar gap. */
.zhub-public-body-frame .forum-page > .row,
.zhub-public-body-frame .forum-detail-page > .row,
.zhub-public-body-frame .story-detail-page > .row,
.zhub-public-body-frame .zhub-story-page > .row,
.zhub-public-body-frame .blog-page > .row,
.zhub-public-body-frame .blog-detail-page > .row,
.zhub-public-body-frame .shop-page > .row {
    --bs-gutter-x: clamp(.85rem, 1.2vw, 1.35rem);
    width: auto !important;
}

.zhub-public-body-frame .forum-page > .row > main,
.zhub-public-body-frame .forum-page > .row > section,
.zhub-public-body-frame .forum-page > .row > div[class*="col-"],
.zhub-public-body-frame .forum-detail-page > .row > main,
.zhub-public-body-frame .forum-detail-page > .row > section,
.zhub-public-body-frame .forum-detail-page > .row > div[class*="col-"],
.zhub-public-body-frame .story-detail-page > .row > main,
.zhub-public-body-frame .story-detail-page > .row > section,
.zhub-public-body-frame .story-detail-page > .row > div[class*="col-"],
.zhub-public-body-frame .zhub-story-page > .row > main,
.zhub-public-body-frame .zhub-story-page > .row > section,
.zhub-public-body-frame .zhub-story-page > .row > div[class*="col-"] {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* On desktop, reserve only the global right rail. The main content pane receives
   all remaining space; no centered max-container is applied. */
@media (min-width: 992px) {
    .zhub-public-main {
        padding-left: clamp(.75rem, 1vw, 1.25rem) !important;
        padding-right: clamp(.75rem, 1vw, 1.25rem) !important;
    }

    .zhub-public-shell-grid {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) clamp(300px, 19vw, 360px) !important;
        gap: clamp(.9rem, 1.15vw, 1.45rem) !important;
    }

    .zhub-public-right-rail {
        width: 100% !important;
        min-width: 0 !important;
    }

    .zhub-public-body-frame .story-reader-body-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

@media (min-width: 1540px) {
    .zhub-public-shell-grid {
        grid-template-columns: minmax(0, 1fr) clamp(320px, 17vw, 380px) !important;
    }
}

/* Mobile already has bottom nav, so the left drawer should not consume space or
   appear as an awkward extra menu. */
@media (max-width: 991.98px) {
    .zhub-public-left-rail.mud-drawer {
        display: none !important;
        width: 0 !important;
        min-width: 0 !important;
    }

    .zhub-public-layout .zhub-public-mud-main.mud-main-content,
    .zhub-public-layout .zhub-public-mud-main {
        margin-left: 0 !important;
        width: 100% !important;
    }

    .zhub-public-shell-grid {
        display: block !important;
        width: 100% !important;
    }

    .zhub-public-content-pane,
    .zhub-public-body-frame,
    .zhub-public-body-frame > .container,
    .zhub-public-body-frame > .container-fluid,
    .zhub-reader-page > .container {
        width: 100% !important;
        max-width: none !important;
    }
}

/* B159 public mobile reader/menu/protection polish */
.zhub-public-bottom-nav {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}

.zhub-public-bottom-nav a,
.zhub-public-bottom-nav .zhub-bottom-more-btn {
    min-width: 0;
    border: 0;
    border-radius: 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .12rem;
    color: var(--zhub-public-muted);
    background: transparent;
    text-decoration: none;
    font-size: clamp(.68rem, 1.95vw, .8rem);
    font-weight: 850;
    line-height: 1.1;
    padding: .35rem .12rem;
}

.zhub-public-bottom-nav .zhub-bottom-more-btn {
    cursor: pointer;
    position: relative;
}

.zhub-public-bottom-nav .zhub-bottom-more-btn::before {
    content: "";
    position: absolute;
    inset: .32rem;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(96,123,88,.10), rgba(216,151,130,.12));
    opacity: .8;
    z-index: -1;
}

.zhub-public-bottom-nav a i,
.zhub-public-bottom-nav .zhub-bottom-more-btn i {
    font-size: clamp(1.18rem, 4vw, 1.46rem);
    line-height: 1;
}

.zhub-public-bottom-nav .zhub-bottom-more-btn:hover,
.zhub-public-bottom-nav .zhub-bottom-more-btn:focus-visible {
    color: var(--zhub-public-accent-strong, var(--zhub-public-accent));
    outline: none;
}

@media (max-width: 991.98px) {
    .zhub-public-left-rail.zhub-public-left-rail-mobile-open.mud-drawer {
        display: flex !important;
        width: min(88vw, 330px) !important;
        min-width: min(88vw, 330px) !important;
        max-width: min(88vw, 330px) !important;
        position: fixed !important;
        inset: 0 auto 0 0 !important;
        z-index: 1305 !important;
        border-radius: 0 28px 28px 0;
        box-shadow: 24px 0 70px rgba(15,23,42,.22) !important;
        transform: translateX(0) !important;
        visibility: visible !important;
    }

    .zhub-public-left-rail.zhub-public-left-rail-mobile-open .zhub-left-rail-inner {
        padding-bottom: 5.6rem;
        overflow: auto;
    }
}

@media (max-width: 430px) {
    .zhub-public-bottom-nav {
        left: .32rem !important;
        right: .32rem !important;
        bottom: .32rem !important;
        min-height: 70px !important;
        padding: .32rem !important;
        gap: .1rem !important;
    }

    .zhub-public-bottom-nav a,
    .zhub-public-bottom-nav .zhub-bottom-more-btn {
        border-radius: 15px;
        font-size: .64rem !important;
        padding-inline: .05rem;
    }
}

.zhub-reader-page .reader-chapter-drawer {
    background: color-mix(in srgb, var(--zhub-public-surface-solid, #fffdf7) 94%, transparent) !important;
    border: 1px solid var(--zhub-public-border, rgba(98,90,73,.14)) !important;
    box-shadow: 0 20px 58px rgba(48,43,34,.14) !important;
}

.zhub-reader-page .reader-chapter-drawer-list {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)) !important;
    gap: .56rem !important;
    padding: .12rem .18rem .24rem !important;
}

.zhub-reader-page .reader-chapter-drawer-list a.reader-chapter-card {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: center !important;
    gap: .65rem !important;
    min-height: 64px !important;
    padding: .64rem .72rem !important;
    border-radius: 18px !important;
    border: 1px solid color-mix(in srgb, var(--zhub-public-border, rgba(98,90,73,.14)) 80%, transparent) !important;
    background: color-mix(in srgb, var(--zhub-public-surface, #fffdf7) 88%, white 12%) !important;
    color: var(--zhub-public-text, #292721) !important;
    text-decoration: none !important;
    box-shadow: 0 8px 22px rgba(48,43,34,.055) !important;
}

.reader-chapter-number {
    width: clamp(54px, 13vw, 72px);
    min-height: 42px;
    border-radius: 16px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: .2rem .34rem;
    background: linear-gradient(135deg, rgba(96,123,88,.14), rgba(216,151,130,.13));
    color: var(--zhub-public-accent-strong, var(--zhub-public-accent));
    font-size: clamp(.72rem, 2.4vw, .86rem);
    font-weight: 950;
    white-space: nowrap;
}

.reader-chapter-copy {
    min-width: 0;
    display: grid !important;
    gap: .22rem;
}

.reader-chapter-title-text {
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
    font-size: clamp(.9rem, 2.9vw, 1rem);
    line-height: 1.25;
    font-weight: 850;
}

.reader-chapter-copy small {
    display: flex !important;
    align-items: center;
    gap: .32rem;
    color: var(--zhub-public-muted, #756f63) !important;
    font-size: clamp(.72rem, 2.35vw, .82rem) !important;
    line-height: 1.2;
    white-space: nowrap;
}

.zhub-reader-page .reader-chapter-drawer-list a.reader-chapter-card.active {
    background: var(--zhub-public-active-bg, linear-gradient(135deg,#536f4d,#9a7040)) !important;
    color: var(--zhub-public-active-text, #fffdf4) !important;
    border-color: transparent !important;
    box-shadow: 0 16px 38px rgba(83,111,77,.2) !important;
}

.zhub-reader-page .reader-chapter-drawer-list a.reader-chapter-card.active .reader-chapter-number {
    background: rgba(255,255,255,.18) !important;
    color: var(--zhub-public-active-text, #fffdf4) !important;
}

.zhub-reader-page .reader-chapter-drawer-list a.reader-chapter-card.active .reader-chapter-copy small,
.zhub-reader-page .reader-chapter-drawer-list a.reader-chapter-card.active .reader-chapter-title-text {
    color: var(--zhub-public-active-text, #fffdf4) !important;
}

@media (max-width: 575.98px) {
    .zhub-reader-page .reader-chapter-drawer {
        left: .48rem !important;
        right: .48rem !important;
        width: auto !important;
        top: 4.1rem !important;
        bottom: 5.35rem !important;
        border-radius: 24px !important;
        padding: .86rem !important;
    }

    .zhub-reader-page .reader-chapter-drawer-head {
        padding-bottom: .7rem !important;
        margin-bottom: .7rem !important;
    }

    .zhub-reader-page .reader-chapter-tools {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: .55rem !important;
        align-items: center !important;
        margin-bottom: .72rem !important;
    }

    .zhub-reader-page .reader-chapter-drawer-list {
        grid-template-columns: 1fr !important;
        max-height: none !important;
        overflow: auto !important;
        padding-right: .08rem !important;
    }

    .zhub-reader-page .reader-chapter-drawer-list a.reader-chapter-card {
        min-height: 68px !important;
        border-radius: 18px !important;
        padding: .66rem .68rem !important;
    }
}

[data-bs-theme="dark"] .zhub-reader-page .reader-chapter-drawer,
[data-theme="dark"] .zhub-reader-page .reader-chapter-drawer,
[data-bs-theme="dark"] .zhub-reader-page .reader-chapter-drawer-list a.reader-chapter-card,
[data-theme="dark"] .zhub-reader-page .reader-chapter-drawer-list a.reader-chapter-card {
    background: color-mix(in srgb, var(--zhub-public-surface-solid, #2b2a23) 92%, black 8%) !important;
    color: var(--zhub-public-text, #f0eadc) !important;
}

/* B165: public account menu, chat file attachments, library modals, mixed chart dashboard skin, Sakura-ready variables */
.zhub-left-profile-menu{padding:.6rem .7rem .85rem;display:grid;gap:.55rem;}
.zhub-left-profile-toggle{width:100%;border:1px solid var(--zhub-public-border,rgba(148,163,184,.22));background:linear-gradient(135deg,var(--zhub-public-surface,rgba(255,255,255,.95)),rgba(255,255,255,.78));color:var(--zhub-public-text,#172033);box-shadow:0 14px 36px rgba(15,23,42,.08);cursor:pointer;text-align:left;}
.zhub-left-profile-toggle.dropdown-toggle::after{margin-left:auto;opacity:.55;}
.zhub-left-profile-dropdown{min-width:290px;background:var(--zhub-public-surface-solid,#fff);color:var(--zhub-public-text,#172033);border:1px solid var(--zhub-public-border,rgba(148,163,184,.22))!important;}
.zhub-left-profile-dropdown .dropdown-item{font-weight:700;color:var(--zhub-public-text,#172033);padding:.62rem .75rem;}
.zhub-left-profile-dropdown .dropdown-item:hover,.zhub-left-profile-dropdown .dropdown-item.active{background:var(--zhub-public-active-bg,linear-gradient(135deg,#5b7f62,#c08a6d));color:var(--zhub-public-active-text,#fff)!important;}
.zhub-left-dropdown-avatar{width:42px;height:42px;border-radius:16px;object-fit:cover;display:inline-flex;align-items:center;justify-content:center;background:var(--zhub-public-accent-soft,rgba(91,127,98,.15));color:var(--zhub-public-accent-strong,#36583a);}
.zhub-left-logout-pill{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;border-radius:999px;text-decoration:none;background:rgba(220,53,69,.09);color:#b4232f;border:1px solid rgba(220,53,69,.18);font-weight:800;padding:.55rem .75rem;}
.zhub-left-logout-pill:hover{background:#dc3545;color:#fff;}
.zhub-public-left-rail-compact .zhub-left-profile-toggle div,.zhub-public-left-rail-compact .zhub-left-profile-toggle::after,.zhub-public-left-rail-compact .zhub-left-logout-pill span{display:none;}
.zhub-public-left-rail-compact .zhub-left-profile-menu{padding:.55rem .35rem;}
.zhub-public-left-rail-compact .zhub-left-logout-pill{width:44px;height:44px;padding:0;}
[data-bs-theme="dark"] .zhub-left-profile-dropdown,[data-theme="dark"] .zhub-left-profile-dropdown{background:var(--zhub-public-surface-solid,#1f2937);color:var(--zhub-public-text,#f3f4f6);box-shadow:0 24px 70px rgba(0,0,0,.45)!important;}
[data-bs-theme="dark"] .zhub-left-profile-dropdown .dropdown-item,[data-theme="dark"] .zhub-left-profile-dropdown .dropdown-item{color:var(--zhub-public-text,#f3f4f6);}
.zhub-chat-input-row{align-items:center;}
.zhub-chat-attach{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 34px;border-color:rgba(148,163,184,.4);}
.zhub-chat-library-picker{background:linear-gradient(135deg,rgba(148,163,184,.10),rgba(255,255,255,.55));border:1px dashed rgba(148,163,184,.42);border-radius:18px;padding:.55rem;}
.zhub-chat-library-picker .zhub-file-library-input>.input-group{gap:.35rem;}
.zhub-chat-library-picker .zhub-file-library-input .input-group>.form-control{border-radius:999px!important;font-size:.82rem;}
.zhub-chat-library-picker .zhub-file-library-input .input-group>.btn{border-radius:999px!important;}
.zhub-chat-attachment-preview{display:flex;align-items:center;justify-content:space-between;gap:.5rem;border-radius:999px;background:var(--zhub-public-accent-soft,rgba(91,127,98,.12));color:var(--zhub-public-text,#172033);padding:.35rem .45rem .35rem .7rem;font-size:.82rem;font-weight:700;}
.zhub-chat-attachment{display:flex;gap:.55rem;align-items:center;margin-top:.5rem;border-radius:16px;border:1px solid rgba(148,163,184,.24);background:rgba(255,255,255,.78);padding:.55rem;text-decoration:none;max-width:100%;}
.zhub-chat-attachment-file{color:inherit;}
.zhub-chat-attachment-file i{width:34px;height:34px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;background:var(--zhub-public-accent-soft,rgba(91,127,98,.15));color:var(--zhub-public-accent-strong,#36583a);}
.zhub-chat-attachment-file span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.zhub-chat-attachment-image{display:block;padding:.35rem;}
.zhub-chat-attachment-image img{width:100%;max-height:220px;object-fit:cover;border-radius:14px;display:block;background:#111827;}
.zhub-chat-attachment-image figcaption{font-size:.72rem;color:var(--zhub-public-muted,#64748b);padding:.25rem .2rem 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
[data-bs-theme="dark"] .zhub-chat-library-picker,[data-theme="dark"] .zhub-chat-library-picker{background:linear-gradient(135deg,rgba(148,163,184,.10),rgba(15,23,42,.55));border-color:rgba(148,163,184,.28);}
[data-bs-theme="dark"] .zhub-chat-attachment,[data-theme="dark"] .zhub-chat-attachment{background:rgba(15,23,42,.64);border-color:rgba(148,163,184,.25);}
.captcha-library-modal-picker .zhub-file-library-input>.input-group{gap:.35rem;}
.captcha-library-modal-picker .zhub-file-library-input .input-group>.form-control{border-radius:12px!important;}
.captcha-library-modal-picker .zhub-file-library-input .input-group>.btn{border-radius:12px!important;}
.zhub-mixed-chart-card,.content-view-chart-card{overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,250,252,.94));}
.zhub-mixed-chart-card>.card-header,.content-view-chart-card>.card-header{background:linear-gradient(90deg,rgba(21,94,38,.10),rgba(255,255,255,.72))!important;}
.zhub-chart-mode-select{max-width:190px;border-radius:999px;font-weight:700;}
.zhub-mixed-dashboard-card{background:radial-gradient(circle at top left,rgba(34,197,94,.08),transparent 35%),radial-gradient(circle at top right,rgba(244,114,182,.08),transparent 32%);}
.zhub-mixed-chart-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.75rem;}
.zhub-mixed-chip{border-radius:22px;background:rgba(255,255,255,.86);border:1px solid rgba(148,163,184,.22);padding:.75rem .85rem;display:grid;grid-template-columns:auto 1fr;column-gap:.65rem;align-items:center;box-shadow:0 14px 34px rgba(15,23,42,.07);}
.zhub-mixed-chip i{grid-row:1 / span 2;width:38px;height:38px;border-radius:15px;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#bfe6c2,#f7b6c8);color:#205a2b;}
.zhub-mixed-chip span{font-size:.78rem;color:#64748b;font-weight:700;}
.zhub-mixed-chip strong{font-size:1.18rem;color:#1f3d24;}
.content-view-bars,.zhub-bars{border-radius:26px;padding:1rem;background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(241,245,249,.72));border:1px solid rgba(148,163,184,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.7);}
.content-view-bar,.zhub-bars .bg-primary{background:linear-gradient(180deg,#2f7d3a,#9bcf94)!important;border-radius:999px 999px 9px 9px!important;box-shadow:0 10px 22px rgba(47,125,58,.18);}
.zhub-chart-mode-line .content-view-bar,.zhub-chart-mode-line .zhub-bars .bg-primary{min-height:10px!important;border-radius:999px!important;opacity:.88;transform:translateY(-12px);}
.zhub-chart-mode-compact{height:150px!important;padding:.7rem;}
.zhub-chart-mode-mixed .content-view-bar:nth-child(odd),.zhub-chart-mode-mixed .bg-primary:nth-child(odd){background:linear-gradient(180deg,#f4a7b9,#e0b56b)!important;}
.zhub-mixed-gauge-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.75rem;}
.zhub-mixed-gauge{min-height:110px;border-radius:28px;background:radial-gradient(circle at 50% 100%,rgba(47,125,58,.22) 0 38%,transparent 39%),linear-gradient(180deg,#fff,rgba(248,250,252,.94));border:1px solid rgba(148,163,184,.20);display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 16px 34px rgba(15,23,42,.08);}
.zhub-mixed-gauge span{font-size:2rem;font-weight:900;color:#246331;line-height:1;}
.zhub-mixed-gauge small{font-weight:800;color:#64748b;margin-top:.35rem;}
.zhub-presence-chart svg{border-radius:26px;background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(241,245,249,.72));border:1px solid rgba(148,163,184,.18);padding:.65rem;}
.zhub-presence-chart.zhub-chart-mode-bar svg .line-member,.zhub-presence-chart.zhub-chart-mode-bar svg .line-guest{opacity:.34;stroke-dasharray:5 8;}
.zhub-presence-chart.zhub-chart-mode-gauge svg{display:none;}
[data-bs-theme="dark"] .zhub-mixed-chart-card,[data-theme="dark"] .zhub-mixed-chart-card,[data-bs-theme="dark"] .content-view-chart-card,[data-theme="dark"] .content-view-chart-card{background:linear-gradient(180deg,rgba(30,41,59,.92),rgba(15,23,42,.92));}
[data-bs-theme="dark"] .zhub-mixed-dashboard-card,[data-theme="dark"] .zhub-mixed-dashboard-card{background:radial-gradient(circle at top left,rgba(74,222,128,.10),transparent 35%),radial-gradient(circle at top right,rgba(251,113,133,.12),transparent 35%);}
[data-bs-theme="dark"] .zhub-mixed-chip,[data-theme="dark"] .zhub-mixed-chip,[data-bs-theme="dark"] .content-view-bars,[data-theme="dark"] .content-view-bars,[data-bs-theme="dark"] .zhub-bars,[data-theme="dark"] .zhub-bars,[data-bs-theme="dark"] .zhub-mixed-gauge,[data-theme="dark"] .zhub-mixed-gauge,[data-bs-theme="dark"] .zhub-presence-chart svg,[data-theme="dark"] .zhub-presence-chart svg{background:rgba(15,23,42,.72);border-color:rgba(148,163,184,.22);color:#e5e7eb;}
[data-bs-theme="dark"] .zhub-mixed-chip strong,[data-theme="dark"] .zhub-mixed-chip strong,[data-bs-theme="dark"] .zhub-mixed-gauge span,[data-theme="dark"] .zhub-mixed-gauge span{color:#c7f9cc;}

/* B168 movie admin split: list / editor / episode manager */
.zhub-movie-admin .movie-admin-poster {
    width: 64px;
    height: 84px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(34, 197, 94, .08), rgba(59, 130, 246, .06));
}
.zhub-movie-admin .movie-admin-poster img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.zhub-movie-editor-page .movie-edit-card,
.zhub-movie-episode-page .card {
    border-radius: 1rem;
}
.zhub-movie-editor-page .zhub-rich-editor-visual {
    min-height: 420px;
}
@media (max-width: 768px) {
    .zhub-movie-admin .movie-admin-poster {
        width: 52px;
        height: 68px;
    }
    .zhub-movie-admin .btn-group,
    .zhub-movie-admin .text-nowrap {
        white-space: normal !important;
    }
}

/* B169: movie detail/watch split like story detail/reader */
.zhub-movie-detail-page,
.zhub-movie-watch-page {
    width: 100%;
    max-width: none;
}

.zhub-movie-detail-card,
.zhub-movie-watch-card,
.zhub-movie-episode-list-card {
    background: var(--zhub-surface, #fffaf0);
    color: var(--zhub-text, #203027);
}

.zhub-movie-poster-panel {
    min-height: 360px;
    background: linear-gradient(145deg, rgba(250, 218, 221, .36), rgba(218, 239, 225, .42));
    display: flex;
    align-items: stretch;
    justify-content: center;
}

.zhub-movie-poster-panel img {
    width: 100%;
    height: 100%;
    min-height: 360px;
    object-fit: cover;
}

.zhub-movie-poster-empty {
    width: 100%;
    min-height: 360px;
    display: grid;
    place-items: center;
    color: rgba(60, 76, 66, .58);
    font-size: clamp(3rem, 12vw, 6rem);
}

.zhub-movie-episode-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: .75rem;
}

.zhub-movie-episode-card {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .85rem 1rem;
    border-radius: 1.2rem;
    border: 1px solid var(--zhub-border, rgba(47, 74, 55, .14));
    background: var(--zhub-card, #ffffff);
    color: inherit;
    text-decoration: none;
    box-shadow: 0 14px 36px rgba(31, 54, 43, .06);
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.zhub-movie-episode-card:hover,
.zhub-movie-episode-card:focus-visible {
    transform: translateY(-2px);
    border-color: var(--zhub-primary, #6f9f7c);
    box-shadow: 0 18px 46px rgba(31, 54, 43, .12);
}

.zhub-movie-episode-number {
    width: 2.5rem;
    height: 2.5rem;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: var(--zhub-primary-soft, rgba(111, 159, 124, .16));
    color: var(--zhub-primary-strong, #366f46);
    font-weight: 800;
}

.zhub-movie-episode-body {
    min-width: 0;
    flex: 1 1 auto;
}

.zhub-movie-episode-body strong {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.35;
}

.zhub-movie-episode-body small {
    color: var(--zhub-muted, #6b756e);
}

.zhub-movie-watch-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    background: linear-gradient(135deg, rgba(255, 244, 232, .88), rgba(245, 226, 235, .74));
}

.zhub-movie-player iframe,
.zhub-movie-player video {
    width: 100%;
    height: 100%;
    border: 0;
}

@media (max-width: 767.98px) {
    .zhub-movie-poster-panel,
    .zhub-movie-poster-panel img,
    .zhub-movie-poster-empty {
        min-height: 260px;
    }

    .zhub-movie-episode-grid {
        grid-template-columns: 1fr;
    }

    .zhub-movie-watch-header {
        align-items: flex-start;
        flex-direction: column;
    }
}

html[data-bs-theme="dark"] .zhub-movie-watch-header,
body.zhub-public-dark .zhub-movie-watch-header {
    background: linear-gradient(135deg, rgba(51, 55, 48, .95), rgba(69, 48, 58, .82));
}


/* B181: public left rail width sync + TTS/admin polish */
@media (min-width: 992px) {
    .zhub-public-layout .zhub-public-mud-main.mud-main-content,
    .zhub-public-layout .zhub-public-mud-main {
        margin-left: 280px !important;
        width: calc(100% - 280px) !important;
        transition: margin-left .18s ease, width .18s ease;
    }

    .zhub-public-left-compact .zhub-public-mud-main.mud-main-content,
    .zhub-public-left-compact .zhub-public-mud-main {
        margin-left: 84px !important;
        width: calc(100% - 84px) !important;
    }
}

@media (min-width: 1540px) {
    .zhub-public-layout:not(.zhub-public-left-compact) .zhub-public-mud-main.mud-main-content,
    .zhub-public-layout:not(.zhub-public-left-compact) .zhub-public-mud-main {
        margin-left: 296px !important;
        width: calc(100% - 296px) !important;
    }
}

.story-audio-reader-card .alert {
    transition: background-color .18s ease, border-color .18s ease;
}

.zhub-story-tts-admin pre {
    white-space: pre-wrap;
    word-break: break-word;
    max-height: 220px;
    overflow: auto;
}