/* source: components/post-card/box.php */ .archive-post-v2 { --card-accent: var(--theme-color, #16a34a); --card-bg: var(--bg-card, #ffffff); --card-border: var( --border-color, rgba(20,24,35,.08) ); --card-text: var( --text-primary, #1b1f2a ); --card-muted: var( --text-muted, #727986 ); --card-soft: color-mix( in srgb, var(--card-accent) 6%, transparent ); position: relative; display: block; width: 100%; height: 100%; overflow: hidden; isolation: isolate; border: 1px solid var(--card-border) !important; border-radius: 18px !important; background: linear-gradient( 145deg, var(--card-bg) 0%, var(--card-bg) 72%, color-mix( in srgb, var(--card-accent) 4%, var(--card-bg) ) 100% ); text-decoration: none !important; box-shadow: 0 2px 7px rgba(20,25,35,.025), 0 8px 22px rgba(20,25,35,.035); transition: transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s ease, border-color .25s ease; } .archive-post-v2.has-mod:not(.has-new):not(.has-update) { --card-accent: #e53935; background: linear-gradient( 145deg, color-mix( in srgb, #e53935 4.5%, var(--card-bg) ), var(--card-bg) 70%, color-mix( in srgb, #e53935 7%, var(--card-bg) ) ); } .archive-post-v2.has-new:not(.has-mod):not(.has-update) { --card-accent: #2196f3; background: linear-gradient( 145deg, color-mix( in srgb, #2196f3 4.5%, var(--card-bg) ), var(--card-bg) 70%, color-mix( in srgb, #2196f3 7%, var(--card-bg) ) ); } .archive-post-v2.has-update:not(.has-mod):not(.has-new) { --card-accent: #20a05a; background: linear-gradient( 145deg, color-mix( in srgb, #20a05a 4.5%, var(--card-bg) ), var(--card-bg) 70%, color-mix( in srgb, #20a05a 7%, var(--card-bg) ) ); } .archive-post-v2.has-mod.has-new { --card-accent: #2196f3; background: radial-gradient( circle at 15% 50%, rgba(33,150,243,.10), transparent 54% ), linear-gradient( 145deg, color-mix( in srgb, #2196f3 5%, var(--card-bg) ), var(--card-bg) 68%, color-mix( in srgb, #2196f3 8%, var(--card-bg) ) ); border-color: rgba(33,150,243,.16) !important; } .archive-post-v2.has-mod.has-update { --card-accent: #20a05a; background: radial-gradient( circle at 15% 50%, rgba(32,160,90,.10), transparent 54% ), linear-gradient( 145deg, color-mix( in srgb, #20a05a 5%, var(--card-bg) ), var(--card-bg) 68%, color-mix( in srgb, #20a05a 8%, var(--card-bg) ) ); border-color: rgba(32,160,90,.16) !important; } .archive-post-v2.has-new.has-update { --card-accent: #2196f3; background: linear-gradient( 145deg, color-mix( in srgb, #2196f3 4%, var(--card-bg) ), var(--card-bg) 64%, color-mix( in srgb, #20a05a 6%, var(--card-bg) ) ); } .archive-post-v2.has-mod.has-new.has-update { --card-accent: #2196f3; background: linear-gradient( 110deg, color-mix( in srgb, #2196f3 7%, var(--card-bg) ), var(--card-bg) 48%, color-mix( in srgb, #20a05a 7%, var(--card-bg) ) ); border-color: rgba(33,150,243,.15) !important; } .archive-post-v2::before { content: ""; position: absolute; top: 0; right: 20px; left: 20px; height: 2px; border-radius: 0 0 12px 12px; background: linear-gradient( 90deg, transparent, var(--card-accent), transparent ); opacity: .45; transform: scaleX(.55); transition: transform .3s ease, opacity .3s ease; z-index: 8; } .archive-post-v2:hover { transform: translateY(-4px); border-color: color-mix( in srgb, var(--card-accent) 26%, var(--card-border) ) !important; box-shadow: 0 9px 24px rgba(20,25,35,.055), 0 16px 38px color-mix( in srgb, var(--card-accent) 9%, transparent ); } .archive-post-v2:hover::before { transform: scaleX(1); opacity: .85; } .archive-post-status { position: absolute; top: 50%; left: -14px; right: 0; z-index: 1; display: flex; align-items: center; justify-content: center; pointer-events: none; user-select: none; transform: translateY(-50%) translateX(-8px) rotate(-5deg); white-space: nowrap; direction: ltr; } .archive-post-status .status-word { display: inline-block; font-family: inherit; font-weight: 1000; line-height: .85; letter-spacing: -2px; white-space: nowrap; opacity: .10; text-shadow: 0 1px 1px rgba(255,255,255,.08); } .archive-post-status .status-mod { color: #e53935; font-size: 65px; } .archive-thumb-status { position: absolute; top: 7px; right: 7px; z-index: 12; display: flex; align-items: center; gap: 4px; direction: ltr; pointer-events: none; } .archive-thumb-status .thumb-status-label { display: inline-flex; align-items: center; justify-content: center; min-width: 43px; height: 21px; padding: 0 7px; border-radius: 7px; color: #fff; font-size: 9px; font-weight: 800; line-height: 1; letter-spacing: .15px; white-space: nowrap; border: 1px solid rgba(255,255,255,.20); box-shadow: 0 3px 9px rgba(0,0,0,.16); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); } .archive-thumb-status .thumb-status-new { background: linear-gradient( 135deg, #2196f3, #1976d2 ); } .archive-thumb-status .thumb-status-update { background: linear-gradient( 135deg, #20a05a, #188548 ); } .archive-post-v2 .archive-card-inner { position: relative; z-index: 3; display: flex; align-items: center; min-height: 132px; padding: 12px; } .archive-post-v2 .archive-thumb { position: relative; width: 108px; height: 108px; flex: 0 0 108px; margin-left: 13px; overflow: hidden; border-radius: 17px; background: var(--bg-light,#f2f4f7); box-shadow: 0 5px 14px rgba(0,0,0,.075); transform: translateZ(0); z-index: 4; } .archive-post-v2 .archive-thumb::after { content: ""; position: absolute; inset: 0; border-radius: inherit; border: 1px solid rgba(255,255,255,.24); pointer-events: none; z-index: 8; } .archive-post-v2 .archive-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; transition: transform .4s cubic-bezier(.2,.8,.2,1); } .archive-post-v2:hover .archive-thumb img { transform: scale(1.07); } .archive-post-v2 .archive-image-views { position: absolute; left: 6px; bottom: 6px; z-index: 9; display: inline-flex; align-items: center; justify-content: center; min-height: 21px; padding: 3px 6px; border-radius: 6px; color: #fff !important; background: rgba(12,16,23,.68); border: 1px solid rgba(255,255,255,.16); backdrop-filter: blur(7px); -webkit-backdrop-filter: blur(7px); font-size: 8.5px; font-weight: 700; line-height: 1; white-space: nowrap; box-shadow: 0 3px 9px rgba(0,0,0,.20); } .archive-post-v2 .archive-image-views svg { width: 10px; height: 10px; margin-left: 4px; flex: 0 0 10px; fill: currentColor !important; opacity: .9; } .archive-post-v2 .archive-image-views span { display: inline-flex; align-items: center; direction: ltr; white-space: nowrap; } .archive-post-v2 .archive-info { position: relative; z-index: 4; min-width: 0; flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 6px; } .archive-post-v2 .archive-title { margin: 0 !important; color: var(--card-text); font-size: 14px; font-weight: 800; line-height: 1.45; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: color .2s ease; } .archive-post-v2:hover .archive-title { color: var(--card-accent); } .archive-post-v2 .archive-version { display: flex; align-items: center; min-width: 0; color: var(--card-muted) !important; font-size: 9.5px; font-weight: 600; line-height: 1.45; white-space: nowrap; } .archive-post-v2 .archive-version-text { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; } .archive-post-v2 .archive-size-box { display: block; min-width: 0; color: var(--card-muted) !important; font-size: 9.5px; font-weight: 600; line-height: 1.45; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .archive-post-v2 .archive-mod { display: flex; align-items: center; min-width: 0; color: #e53935 !important; font-size: 9.5px; font-weight: 700; line-height: 1.4; } .archive-post-v2 .archive-mod .mod-feature-text { min-width: 0; color: #e53935 !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .archive-post-v2 .archive-arrow { position: absolute; left: 10px; bottom: 10px; z-index: 6; display: flex; align-items: center; justify-content: center; width: 23px; height: 23px; border-radius: 8px; background: color-mix( in srgb, var(--card-accent) 7%, transparent ); color: var(--card-accent); opacity: 0; transform: translateX(4px); transition: opacity .22s ease, transform .22s ease; } .archive-post-v2 .archive-arrow svg { width: 9px; height: 9px; fill: currentColor !important; } .archive-post-v2:hover .archive-arrow { opacity: 1; transform: translateX(0); } body.dark-mode .archive-post-v2 { --card-bg: var(--bg-card,#1c2028); --card-text: #f1f3f5; --card-muted: #a7afb9; border-color: rgba(255,255,255,.075) !important; background: linear-gradient( 145deg, #1c2028, #1b1f26 72% ); box-shadow: 0 5px 18px rgba(0,0,0,.18); } body.dark-mode .archive-post-v2.has-mod.has-new { background: radial-gradient( circle at 15% 50%, rgba(33,150,243,.14), transparent 54% ), linear-gradient( 145deg, #1d2732, #1b1f26 70%, #1c2630 ); border-color: rgba(33,150,243,.21) !important; } body.dark-mode .archive-post-v2.has-mod.has-update { background: radial-gradient( circle at 15% 50%, rgba(32,160,90,.14), transparent 54% ), linear-gradient( 145deg, #1d2923, #1b1f26 70%, #1c2821 ); border-color: rgba(32,160,90,.21) !important; } body.dark-mode .archive-post-status .status-word { opacity: .125; } body.dark-mode .archive-post-status .status-mod { color: #ff4d4d; } body.dark-mode .archive-post-v2 .archive-thumb { background: #292e37; box-shadow: 0 5px 18px rgba(0,0,0,.38); } body.dark-mode .archive-post-v2 .archive-thumb::after { border-color: rgba(255,255,255,.08); } body.dark-mode .archive-post-v2 .archive-mod, body.dark-mode .archive-post-v2 .archive-mod .mod-feature-text { color: #ff4d4d !important; } @media (min-width: 992px) { .archive-post-v2 .archive-card-inner { min-height: 145px; padding: 14px; } .archive-post-v2 .archive-thumb { width: 112px; height: 112px; flex-basis: 112px; margin-left: 14px; border-radius: 18px; } .archive-post-status { left: -18px; transform: translateY(-50%) translateX(-12px) rotate(-5deg); } .archive-post-v2.status-one .archive-post-status .status-mod { font-size: 74px; } .archive-thumb-status { top: 8px; right: 8px; } .archive-thumb-status .thumb-status-label { min-width: 47px; height: 23px; padding: 0 8px; border-radius: 8px; font-size: 10px; } } @media (max-width: 991px) { .archive-post-v2 .archive-card-inner { min-height: 125px; padding: 10px; } .archive-post-v2 .archive-thumb { width: 100px; height: 100px; flex-basis: 100px; margin-left: 11px; border-radius: 16px; } .archive-post-status { left: -10px; transform: translateY(-50%) translateX(-8px) rotate(-5deg); } .archive-post-v2.status-one .archive-post-status .status-mod { font-size: 63px; } .archive-post-v2 .archive-title { font-size: 14px; } .archive-thumb-status { top: 7px; right: 7px; } .archive-thumb-status .thumb-status-label { min-width: 43px; height: 21px; padding: 0 7px; border-radius: 7px; font-size: 9px; } } @media (max-width: 767px) { .archive-post-v2 { border-radius: 15px !important; } .archive-post-v2 .archive-card-inner { min-height: 116px; padding: 8px; } .archive-post-v2 .archive-thumb { width: 96px; height: 96px; flex: 0 0 96px; margin-left: 10px; border-radius: 14px; } .archive-post-status { left: -7px; transform: translateY(-50%) translateX(-7px) rotate(-5deg); } .archive-post-v2.status-one .archive-post-status .status-mod { font-size: 52px; } .archive-thumb-status { top: 5px; right: 5px; gap: 3px; } .archive-thumb-status .thumb-status-label { min-width: 40px; height: 20px; padding: 0 6px; border-radius: 6px; font-size: 8px; box-shadow: 0 2px 7px rgba(0,0,0,.16); } .archive-post-v2 .archive-info { gap: 5px; } .archive-post-v2 .archive-title { font-size: 13px; line-height: 1.4; } .archive-post-v2 .archive-version, .archive-post-v2 .archive-size-box, .archive-post-v2 .archive-mod { font-size: 8.5px; } .archive-post-v2 .archive-image-views { left: 5px; bottom: 5px; min-height: 20px; padding: 3px 5px; font-size: 7.5px; border-radius: 6px; } .archive-post-v2 .archive-image-views svg { width: 9px; height: 9px; flex-basis: 9px; margin-left: 3px; } .archive-post-v2 .archive-arrow { display: none; } } @media (max-width: 480px) { .archive-post-v2 .archive-card-inner { min-height: 112px; padding: 7px; } .archive-post-v2 .archive-thumb { width: 94px; height: 94px; flex-basis: 94px; margin-left: 9px; border-radius: 13px; } .archive-post-status { left: -5px; transform: translateY(-50%) translateX(-6px) rotate(-5deg); } .archive-post-v2.status-one .archive-post-status .status-mod { font-size: 49px; } .archive-thumb-status { top: 5px; right: 5px; gap: 2px; } .archive-thumb-status .thumb-status-label { min-width: 38px; height: 18px; padding: 0 5px; border-radius: 5px; font-size: 7px; } .archive-post-v2 .archive-title { font-size: 12.5px; } .archive-post-v2 .archive-version, .archive-post-v2 .archive-size-box, .archive-post-v2 .archive-mod { font-size: 8px; } .archive-post-v2 .archive-image-views { left: 5px; bottom: 5px; min-height: 18px; padding: 2px 5px; font-size: 7px; border-radius: 5px; } .archive-post-v2 .archive-image-views svg { width: 8px; height: 8px; flex-basis: 8px; margin-left: 3px; } } @media (max-width: 350px) { .archive-post-v2 .archive-card-inner { padding: 6px; } .archive-post-v2 .archive-thumb { width: 88px; height: 88px; flex-basis: 88px; margin-left: 8px; } .archive-post-v2 .archive-title { font-size: 12px; } .archive-post-v2 .archive-version, .archive-post-v2 .archive-size-box, .archive-post-v2 .archive-mod { font-size: 7.5px; } } @media (prefers-reduced-motion: reduce) { .archive-post-v2, .archive-post-v2 *, .archive-post-v2::before { transition: none !important; animation: none !important; } } /* source: components/post-card/box-slider.php */ .hc-card { --hc-bg: var(--bg-card, #fff); --hc-border: var(--border-color, #e9e9e9); --hc-text: var(--text-primary, #202124); --hc-muted: var(--text-muted, #777); --hc-light: var(--bg-light, #f5f6f8); --hc-accent: var(--theme-color, #3b82f6); position: relative; width: 100%; min-width: 0; background: var(--hc-bg); border: 1px solid var(--hc-border); border-radius: 17px; overflow: hidden; box-shadow: 0 4px 16px rgba(0, 0, 0, .045); transition: transform .18s ease, box-shadow .18s ease; isolation: isolate; } .hc-card-link { display: block; color: inherit; text-decoration: none; } .hc-card-media { position: relative; margin: 10px 10px 0; aspect-ratio: 1 / 1; overflow: hidden; border-radius: 13px; background: var(--hc-light); } .hc-card-media img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; transition: transform .25s ease; } .hc-card:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(0, 0, 0, .09); } .hc-card:hover .hc-card-media img { transform: scale(1.035); } .hc-card-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient( to top, rgba(0, 0, 0, .46), rgba(0, 0, 0, 0) 48% ); pointer-events: none; z-index: 1; } .hc-card-views { position: absolute; top: 9px; left: 9px; display: inline-flex; align-items: center; gap: 5px; height: 27px; padding: 0 8px; background: rgba(0, 0, 0, .66); color: #fff; border-radius: 8px; font-size: 10px; font-weight: 700; line-height: 1; z-index: 4; } .hc-card-views svg { width: 14px; height: 14px; flex: 0 0 auto; } .hc-card-image-status { position: absolute; top: 9px; right: 9px; display: inline-flex; align-items: center; z-index: 4; pointer-events: none; } .hc-card-image-status-label { display: inline-flex; align-items: center; justify-content: center; min-height: 27px; padding: 0 9px; border-radius: 8px; color: #fff; font-size: 9px; font-weight: 800; line-height: 1; white-space: nowrap; box-shadow: 0 3px 9px rgba(0, 0, 0, .16); } .hc-card-image-status-label.new { background: #2196f3; } .hc-card-image-status-label.updated { background: #16a36a; } .hc-card-badges { position: absolute; right: 9px; bottom: 9px; left: 9px; display: flex; align-items: center; justify-content: flex-end; gap: 6px; z-index: 4; } .hc-card-badge { display: inline-flex; align-items: center; justify-content: center; min-height: 24px; padding: 0 8px; border-radius: 7px; color: #fff; background: rgba(0, 0, 0, .64); font-size: 9px; font-weight: 800; line-height: 1; white-space: nowrap; } .hc-card-badge.mod { background: #e53935; color: #fff; box-shadow: 0 3px 10px rgba(229, 57, 53, .28); } .hc-card-badge.popular { background: #f59e0b; color: #fff; } .hc-card-body { padding: 12px 11px 11px; } .hc-card-title { margin: 0; color: var(--hc-text); font-size: 13.5px; font-weight: 800; line-height: 1.7; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; min-height: calc(13.5px * 1.7 * 2); } .hc-card-meta { display: flex; align-items: center; gap: 6px; margin-top: 9px; } .hc-card-meta-item { display: flex; align-items: center; gap: 5px; min-width: 0; padding: 6px 7px; border-radius: 8px; background: var(--hc-light); color: var(--hc-muted); font-size: 9px; line-height: 1.2; flex: 1; } .hc-card-meta-item svg { width: 13px; height: 13px; flex: 0 0 auto; color: var(--hc-accent); } .hc-card-meta-value { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--hc-text); font-weight: 700; } .hc-card-mod { display: flex; align-items: center; gap: 6px; margin-top: 7px; padding: 6px 7px; border-radius: 8px; background: var(--hc-light); color: var(--hc-muted); font-size: 9px; line-height: 1.4; } .hc-card-mod svg { width: 13px; height: 13px; flex: 0 0 auto; color: var(--hc-accent); } .hc-card-mod-text { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .hc-card-mod-text strong { color: var(--hc-text); font-weight: 700; } .hc-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 9px; padding-top: 8px; border-top: 1px solid var(--hc-border); } .hc-card-status { color: var(--hc-muted); font-size: 9px; font-weight: 700; white-space: nowrap; } .hc-card-arrow { display: flex; align-items: center; justify-content: center; width: 25px; height: 25px; flex: 0 0 25px; border-radius: 7px; background: var(--hc-light); color: var(--hc-accent); } .hc-card-arrow svg { width: 14px; height: 14px; } [data-theme="dark"] .hc-card, .dark-mode .hc-card { box-shadow: 0 6px 20px rgba(0, 0, 0, .22); } [data-theme="dark"] .hc-card-meta-item, .dark-mode .hc-card-meta-item, [data-theme="dark"] .hc-card-mod, .dark-mode .hc-card-mod, [data-theme="dark"] .hc-card-arrow, .dark-mode .hc-card-arrow { background: rgba(255,255,255,.055); } [data-theme="dark"] .hc-card-footer, .dark-mode .hc-card-footer { border-color: rgba(255,255,255,.09); } @media (max-width: 768px) { .hc-card { border-radius: 15px; box-shadow: 0 3px 13px rgba(0,0,0,.045); } .hc-card-media { margin: 8px 8px 0; border-radius: 12px; } .hc-card-body { padding: 10px 9px 9px; } .hc-card-title { font-size: 12.5px; line-height: 1.7; min-height: calc(12.5px * 1.7 * 2); } .hc-card-meta { margin-top: 8px; gap: 5px; } .hc-card-meta-item { padding: 5px 6px; font-size: 8.5px; } .hc-card-meta-item svg { width: 12px; height: 12px; } .hc-card-mod { margin-top: 6px; padding: 5px 6px; font-size: 8.5px; } .hc-card-mod svg { width: 12px; height: 12px; } .hc-card-footer { margin-top: 7px; padding-top: 7px; } .hc-card-status { font-size: 8.5px; } .hc-card-arrow { width: 23px; height: 23px; flex-basis: 23px; } .hc-card-views { top: 7px; left: 7px; height: 25px; padding: 0 7px; font-size: 9px; } .hc-card-views svg { width: 13px; height: 13px; } .hc-card-image-status { top: 7px; right: 7px; } .hc-card-image-status-label { min-height: 25px; padding: 0 7px; border-radius: 7px; font-size: 8px; } .hc-card-badges { right: 7px; bottom: 7px; left: 7px; } .hc-card-badge { min-height: 22px; padding: 0 7px; border-radius: 6px; font-size: 8px; } } @media (max-width: 480px) { .hc-card-media { margin: 7px 7px 0; border-radius: 11px; } .hc-card-body { padding: 9px 8px 8px; } .hc-card-title { font-size: 12px; } .hc-card-image-status-label { min-height: 23px; padding: 0 6px; font-size: 7.5px; } .hc-card-views { height: 23px; padding: 0 6px; font-size: 8px; } .hc-card-badge { min-height: 21px; font-size: 7.5px; padding: 0 6px; } } @media (prefers-reduced-motion: reduce) { .hc-card, .hc-card img { transition: none !important; } .hc-card:hover { transform: none; } .hc-card:hover .hc-card-media img { transform: none; } } /* source: components/post-card/card-1.php */ .cpt-archive-card { position: relative; display: block; height: 180px; border-radius: 12px; overflow: hidden; background: var(--bg-light, #f0f2f5); box-shadow: 0 2px 8px rgba(0,0,0,0.1); } .cpt-archive-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } .cpt-archive-card-overlay { position: absolute; inset: 0; display: flex; align-items: flex-end; padding: 14px; background: linear-gradient(to top, rgba(0,0,0,0.75), transparent 65%); z-index: 2; } .cpt-archive-card-title { color: #fff; font-size: 0.9rem; font-weight: 700; margin: 0; line-height: 1.4; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } /* source: components/post-card/card-2.php */ .sidebar-cpt-card { position: relative; display: block; height: 160px; border-radius: 10px; overflow: hidden; background: var(--bg-light, #f0f2f5); box-shadow: 0 2px 8px rgba(0,0,0,0.08); } .sidebar-cpt-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } .sidebar-cpt-card-overlay { position: absolute; inset: 0; display: flex; align-items: flex-end; padding: 12px; background: linear-gradient(to top, rgba(0,0,0,0.75), transparent 65%); z-index: 2; } .sidebar-cpt-card-title { color: #fff; font-size: 0.875rem; font-weight: 700; margin: 0; line-height: 1.4; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } /* source: components/sidebar/main-sidebar.php */ .sb{background:var(--bg-card,#fff);border-radius:16px;padding:14px;margin-bottom:10px;transition:box-shadow .3s} .sb:hover{box-shadow:0 8px 30px rgba(0,0,0,.06)} .sb-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px} .sb-ttl{font-size:.95rem;font-weight:700;display:flex;align-items:center;gap:8px;margin:0;position:relative;padding-right:12px} .sb-ttl::before{content:'';position:absolute;right:0;top:50%;transform:translateY(-50%);width:3px;height:18px;background:var(--theme-color,#16a34a);border-radius:4px} .sb-ttl a{color:var(--text-primary,#222);text-decoration:none;transition:color .2s} .sb-ttl a:hover{color:var(--theme-color,#16a34a)} .sb-ttl svg{width:16px;height:16px;fill:var(--theme-color,#16a34a);flex-shrink:0;opacity:.8} .sb-btn{font-size:.7rem;font-weight:600;padding:5px 14px;border-radius:8px;background:var(--theme-color,#16a34a);color:var(--theme-contrast-text,#fff);text-decoration:none;transition:all .25s;white-space:nowrap;flex-shrink:0;letter-spacing:.3px;box-shadow:0 2px 8px rgba(22,163,74,.25)} .sb-btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(22,163,74,.35);color:#fff;text-decoration:none} .sb-btn:focus-visible,.sb-ttl a:focus-visible{outline:2px solid var(--theme-color,#16a34a);outline-offset:2px} .sb-banner{display:block;position:relative;border-radius:12px;overflow:hidden;aspect-ratio:16/10;background:var(--bg-light,#e9ecef)} .sb-banner img.bnr{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.4,0,.2,1),opacity .35s ease} .sb-banner:hover img.bnr{transform:scale(1.06)} .sb-banner .inf img{transition:opacity .3s ease} .sb-banner .ovl{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.85) 0%,rgba(0,0,0,.3) 50%,transparent 100%);display:flex;align-items:flex-end;padding:12px} .sb-banner .inf{display:flex;align-items:center;gap:8px;width:100%} .sb-banner .inf img{width:40px;height:40px;border-radius:10px;object-fit:cover;border:2px solid rgba(255,255,255,.3);flex-shrink:0} .sb-banner .inf .det{min-width:0;flex:1} .sb-banner .inf .det .nm{color:#fff;font-size:.78rem;font-weight:700;line-height:1.3;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 3px rgba(0,0,0,.4)} .sb-banner .inf .det .ver{color:rgba(255,255,255,.8);font-size:.65rem;margin-bottom:3px} .sb-banner .inf .det .tag{display:inline-block;font-size:.6rem;font-weight:700;padding:2px 7px;border-radius:5px;color:#fff;letter-spacing:.3px} .sb-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px} .sb-pill{display:inline-flex;align-items:center;gap:5px;padding:8px 10px;border-radius:10px;background:var(--bg-light,#f5f7fa);color:var(--text-secondary,#444);font-size:.73rem;font-weight:600;text-decoration:none;transition:all .25s;border:1px solid transparent;max-width:100%} .sb-pill svg{width:12px;height:12px;fill:var(--text-muted,#aaa);flex-shrink:0;transition:fill .25s;opacity:.7} .sb-pill span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .sb-pill:hover{background:rgba(22,163,74,.06);color:var(--theme-color,#16a34a);border-color:rgba(22,163,74,.12);transform:translateX(-3px);text-decoration:none} .sb-pill:hover svg{fill:var(--theme-color,#16a34a);opacity:1} .sb-empty{font-size:.75rem;color:var(--text-muted,#999);text-align:center;padding:10px 0;margin:0} body.dark-mode .sb{background:var(--bg-card,#1a1d24)!important} body.dark-mode .sb:hover{box-shadow:0 8px 30px rgba(0,0,0,.35)!important} body.dark-mode .sb-banner{background:var(--bg-light,#23272f)!important} body.dark-mode .sb-pill{background:var(--bg-light,#23272f)!important;color:var(--text-secondary,#adb5bd)!important;border-color:var(--border-color,rgba(255,255,255,.06))!important} body.dark-mode .sb-pill:hover{background:rgba(22,163,74,.15)!important;color:var(--theme-color,#16a34a)!important;border-color:rgba(22,163,74,.25)!important} @media(max-width:767px){.sb{padding:12px 10px;border-radius:14px}.sb-ttl{font-size:.88rem;padding-right:10px}.sb-ttl::before{width:3px;height:15px}.sb-btn{font-size:.66rem;padding:4px 10px;border-radius:6px}.sb-grid{grid-template-columns:1fr 1fr;gap:5px}.sb-pill{padding:7px 8px;font-size:.7rem}.sb-pill svg{width:11px;height:11px}} @media(max-width:380px){.sb-grid{grid-template-columns:1fr 1fr;gap:4px}.sb-pill{padding:6px 7px;font-size:.68rem;gap:3px}.sb-pill svg{width:10px;height:10px}} @media(prefers-reduced-motion:reduce){.sb,.sb-banner img.bnr,.sb-pill{animation:none!important;transition:none!important}} @media (min-width:992px){ #secondary.widget-area{align-self:flex-start;position:sticky;top:76px;} } body.dark-mode .sb{border-color:var(--border-color,rgba(255,255,255,.08))} /* source: components/sidebar/cpt-sidebar.php */ .cpt-sb{ background:var(--bg-card,#fff); border:1px solid var(--border-color,rgba(0,0,0,.06)); border-radius:16px;padding:14px;margin-bottom:10px; box-shadow:var(--shadow-card,0 2px 8px rgba(0,0,0,.04)); transition:box-shadow .25s ease,border-color .25s ease,background .25s ease; } .cpt-sb:hover{box-shadow:var(--shadow-elevated,0 10px 32px rgba(0,0,0,.08));border-color:rgba(var(--theme-color-rgb,22,163,74),.18)} .cpt-sb h2{ position:relative;margin:0 0 12px;padding:0 12px 12px 0; border-bottom:1px solid var(--border-color,rgba(0,0,0,.06)); color:var(--text-primary,#222);font-size:.95rem;font-weight:800; } .cpt-sb h2::before{content:"";position:absolute;right:0;top:1px;width:3px;height:18px;border-radius:4px;background:var(--theme-color,#16a34a)} .cpt-sb .sidebar-cpt-card{height:150px;border-radius:12px;background:var(--bg-light,#f0f2f5);box-shadow:none;border:1px solid var(--border-color,rgba(0,0,0,.05))} .cpt-sb .sidebar-cpt-card-title{font-size:.82rem;line-height:1.5} body.dark-mode .cpt-sb{background:var(--bg-card,#1a1d24);border-color:var(--border-color,rgba(255,255,255,.08))} @media(min-width:992px){#secondary.widget-area{align-self:flex-start;position:sticky;top:76px}} @media(max-width:767px){.cpt-sb{padding:12px 10px;border-radius:14px}.cpt-sb .sidebar-cpt-card{height:145px}}


/* BaziAndroid 4.0.53 — compact card metadata + non-overlapping slider badges */
.hc-card-title{
  display:block!important;
  min-height:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  -webkit-line-clamp:unset!important;
  -webkit-box-orient:unset!important;
}
.hc-card-meta{min-width:0!important}
.hc-card-meta-item{
  flex:1 1 0!important;
  min-width:0!important;
  max-width:calc(50% - 3px)!important;
}
.hc-card-meta-item.is-version .hc-card-meta-value{
  direction:ltr!important;
  unicode-bidi:plaintext!important;
  text-align:left!important;
}
.hc-card-meta-value{
  display:block!important;
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
}
/* Bottom corners have fixed jobs: release on right, connectivity on left. */
.hc-card-badges{
  right:7px!important;
  left:auto!important;
  bottom:7px!important;
  width:auto!important;
  max-width:calc(100% - 48px)!important;
  justify-content:flex-start!important;
}
.hc-card-badge{
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.hc-card-connectivity{
  left:7px!important;
  right:auto!important;
  bottom:7px!important;
}
/* Legacy watermark must never return if an old template fragment is cached. */
.archive-post-status{display:none!important}
@media(max-width:576px){
  .hc-card-title{font-size:13px!important;line-height:1.65!important}
  .hc-card-meta{gap:5px!important}
  .hc-card-meta-item{padding:6px!important;font-size:8.5px!important}
  .hc-card-meta-item svg{width:12px!important;height:12px!important}
  .hc-card-badges{max-width:calc(100% - 43px)!important}
}

/* source: components/home/home-category.php */ .hc { background: var(--bg-card, #fff); border-radius: 16px; padding: 16px; margin-bottom: 20px; transition: box-shadow .3s ease; } @media (min-width: 992px) { .hc { margin-top: 15px; } } .hc:hover { box-shadow: 0 8px 30px rgba(0,0,0,.06); } .hc-h { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; } .hc-t { font-size: 1.1rem; font-weight: 700; display: flex; align-items: center; gap: 8px; margin: 0; position: relative; padding-right: 14px; min-width: 0; } .hc-t::before { content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 4px; height: 20px; background: var(--theme-color, #16a34a); border-radius: 4px; } .hc-t a { color: var(--text-primary, #222); text-decoration: none; transition: color .2s ease; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .hc-t a:hover { color: var(--theme-color, #16a34a); } .hc-i { width: 18px; height: 18px; fill: var(--theme-color, #16a34a); flex-shrink: 0; opacity: .8; } .hc-btn { font-size: .72rem; font-weight: 600; padding: 6px 16px; border-radius: 8px; background: var(--theme-color, #16a34a); color: #fff !important; text-decoration: none; transition: all .25s ease; white-space: nowrap; flex-shrink: 0; letter-spacing: .3px; box-shadow: 0 2px 8px rgba(22,163,74,.25); } .hc-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(22,163,74,.35); color: #fff; text-decoration: none; } .hc-t a:focus-visible, .hc-btn:focus-visible { outline: 2px solid var(--theme-color, #16a34a); outline-offset: 2px; } .hc-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 32px 12px; color: var(--text-secondary, #8888aa); text-align: center; } .hc-empty svg { width: 34px; height: 34px; opacity: .4; fill: currentColor; } .hc-empty span { font-size: .82rem; font-weight: 600; } .hc-scroller-wrap { position: relative; width: 100%; margin: 0 -4px 6px; } .hc-scroller { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: stretch; gap: 12px; width: calc(100% + 8px); overflow-x: auto; overflow-y: hidden; padding: 5px 4px 13px; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; scroll-behavior: smooth; overscroll-behavior-x: contain; scrollbar-width: thin; scrollbar-color: var(--theme-color, #16a34a) var(--bg-light, #f0f2f5); cursor: grab; user-select: none; } .hc-scroller:active { cursor: grabbing; } .hc-scroller > .hc-card { display: block !important; flex: 0 0 210px !important; width: 210px !important; min-width: 210px !important; max-width: 210px !important; margin: 0 !important; padding: 0 !important; scroll-snap-align: start; box-sizing: border-box; } .hc-scroller::-webkit-scrollbar { height: 5px; } .hc-scroller::-webkit-scrollbar-track { background: var(--bg-light, #f0f2f5); border-radius: 10px; } .hc-scroller::-webkit-scrollbar-thumb { background: var(--theme-color, #16a34a); border-radius: 10px; } .hc-scroller::-webkit-scrollbar-thumb:hover { background: var(--theme-color, #16a34a); } .hc-scroller-nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; width: 34px; height: 34px; padding: 0; border: 1px solid var(--border-color, rgba(0,0,0,.08)); border-radius: 50%; background: var(--bg-card, #fff); color: var(--text-primary, #222); box-shadow: 0 3px 14px rgba(0,0,0,.12); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all .25s ease; font-size: 18px; font-weight: 700; line-height: 1; user-select: none; opacity: 0; pointer-events: none; } .hc-scroller-wrap:hover .hc-scroller-nav { opacity: 1; pointer-events: auto; } .hc-scroller-nav:hover { background: var(--theme-color, #16a34a); color: #fff; border-color: var(--theme-color, #16a34a); box-shadow: 0 5px 18px rgba(22,163,74,.30); transform: translateY(-50%) scale(1.05); } .hc-scroller-nav.prev { left: -2px; } .hc-scroller-nav.next { right: -2px; } body.dark-mode .hc-scroller::-webkit-scrollbar-track { background: var(--bg-light, #2a2d35); } body.dark-mode .hc-scroller-nav { background: var(--bg-card, #2a2d35); border-color: var(--border-color, rgba(255,255,255,.08)); color: var(--text-primary, #e8eaed); } body.dark-mode .hc-scroller-nav:hover { background: var(--theme-color, #16a34a); color: #fff; } @media (max-width: 991px) { .hc-scroller { gap: 11px; } .hc-scroller > .hc-card { flex-basis: 190px !important; width: 190px !important; min-width: 190px !important; max-width: 190px !important; } } @media (max-width: 768px) { .hc-scroller-nav { display: none !important; } .hc-scroller { gap: 10px; padding: 4px 4px 11px; scrollbar-width: none; } .hc-scroller::-webkit-scrollbar { display: none; } .hc-scroller > .hc-card { flex: 0 0 170px !important; width: 170px !important; min-width: 170px !important; max-width: 170px !important; } } @media (max-width: 576px) { .hc { padding: 12px 8px; border-radius: 12px; } .hc-t { font-size: .95rem; padding-right: 12px; } .hc-t::before { width: 3px; height: 16px; } .hc-btn { font-size: .68rem; padding: 5px 12px; border-radius: 6px; } .hc-scroller { gap: 9px; } .hc-scroller > .hc-card { flex: 0 0 165px !important; width: 165px !important; min-width: 165px !important; max-width: 165px !important; } } @media (max-width: 400px) { .hc-scroller { gap: 8px; } .hc-scroller > .hc-card { flex: 0 0 155px !important; width: 155px !important; min-width: 155px !important; max-width: 155px !important; } } @media (prefers-reduced-motion: reduce) { .hc, .hc-btn, .hc-scroller, .hc-scroller-nav { transition: none !important; scroll-behavior: auto !important; } } /* source: components/home/home-post-type.php */ .home-category-section { background: var(--bg-card, #fff); border: 1px solid var(--border-color, rgba(0,0,0,0.06)); border-radius: 14px; padding: 10px 10px 10px; margin-bottom: 10px; transition: all 0.3s ease; } .home-category-section:hover { box-shadow: var(--shadow-card, 0 4px 15px rgba(0,0,0,0.04)); } .section-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; padding-bottom: 12px; border-bottom: 1px solid var(--border-color, rgba(0,0,0,0.05)); } .section-title { font-size: 1.05rem; font-weight: 800; margin: 0; display: flex; align-items: center; gap: 8px; } .section-title a { color: var(--text-primary, #222); text-decoration: none; transition: color 0.2s; } .section-title a:hover { color: var(--theme-color, #16a34a); } .section-title-icon { width: 20px; height: 20px; fill: var(--theme-color, #16a34a); flex-shrink: 0; } .view-more-btn { font-size: 0.75rem; font-weight: 600; padding: 5px 14px; border-radius: 20px; border: 1.5px solid var(--theme-color, #16a34a); color: #fff !important; background: var(--theme-color, #16a34a); text-decoration: none; transition: all 0.25s ease; white-space: nowrap; flex-shrink: 0; } .view-more-btn:hover { background: var(--theme-color, #16a34a); color: #fff !important; text-decoration: none; } .media-card { display: block; position: relative; border-radius: 12px; overflow: hidden; aspect-ratio: 16 / 9; background: var(--bg-light, #e9ecef); text-decoration: none; } .media-card img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1); } .media-card:hover img { transform: scale(1.08); } .media-card-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.1) 50%, transparent 100%); display: flex; align-items: flex-end; padding: 14px; transition: background 0.3s ease; } .media-card:hover .media-card-overlay { background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.2) 60%, transparent 100%); } .media-card-title { color: #fff; font-size: 0.85rem; font-weight: 700; line-height: 1.5; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-shadow: 0 1px 3px rgba(0,0,0,0.4); } @media (max-width: 576px) { .home-category-section { padding: 7px 4px 4px; border-radius: 10px; } .section-title { font-size: 0.95rem; } .view-more-btn { font-size: 0.7rem; padding: 4px 10px; } .media-card-title { font-size: 0.8rem; } }

/* BaziAndroid 4.0.55 — immersive stories */
.baziandroid-stories{margin:0 0 12px;padding:12px 12px 9px;border:1px solid var(--border-color,rgba(15,23,42,.08));border-radius:18px;background:var(--bg-card,#fff);box-shadow:var(--shadow-card,0 2px 12px rgba(0,0,0,.035))}
.baziandroid-stories-head{display:flex;align-items:baseline;gap:9px;margin-bottom:8px}.baziandroid-stories-head h2{font-size:15px;margin:0;font-weight:900;color:var(--text-primary,#1f2937)}.baziandroid-stories-head span{font-size:10.5px;color:var(--text-muted,#788391)}
.baziandroid-stories-track{display:flex;gap:12px;overflow:auto;padding:3px 2px 5px;scrollbar-width:none;overscroll-behavior-x:contain}.baziandroid-stories-track::-webkit-scrollbar{display:none}.baziandroid-story{width:72px;flex:0 0 72px;border:0;background:transparent;padding:0;color:var(--text-primary,#1f2937);cursor:pointer}.baziandroid-story:focus-visible{outline:2px solid var(--theme-color,#16a34a);outline-offset:3px;border-radius:12px}
.baziandroid-story-ring{width:64px;height:64px;margin:auto;display:grid;place-items:center;border-radius:50%;padding:3px;background:conic-gradient(var(--theme-color,#16a34a),#22c55e,#0ea5e9,var(--theme-color,#16a34a));transition:filter .2s,opacity .2s}.baziandroid-story.is-seen .baziandroid-story-ring{background:color-mix(in srgb,var(--text-muted,#7b8490) 35%,transparent);filter:saturate(.35);opacity:.78}.baziandroid-story-image{width:100%;height:100%;display:block;border-radius:50%;padding:2px;background:var(--bg-card,#fff);overflow:hidden}.baziandroid-story-image img{width:100%;height:100%;object-fit:cover;border-radius:50%}.baziandroid-story-title{display:block;margin-top:5px;font-size:9.7px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.baziandroid-story-viewer{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;opacity:0;visibility:hidden;transition:opacity .18s ease,visibility .18s ease}.baziandroid-story-viewer.is-open{opacity:1;visibility:visible}.baziandroid-story-backdrop{position:absolute;inset:0;background:rgba(3,6,12,.88);backdrop-filter:blur(9px)}
.baziandroid-story-dialog{position:relative;width:min(430px,calc(100vw - 24px));height:min(760px,calc(100vh - 28px));border-radius:24px;overflow:hidden;background:#0d1118;box-shadow:0 25px 80px rgba(0,0,0,.48);touch-action:none}
.baziandroid-story-media{position:absolute;inset:0;overflow:hidden;background:#0d1118}.baziandroid-story-bg{position:absolute;inset:-8%;width:116%;height:116%;object-fit:cover;filter:blur(28px) brightness(.54) saturate(1.12);transform:scale(1.06);opacity:.88}.baziandroid-story-hero{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:transparent}.baziandroid-story-media.is-contain .baziandroid-story-hero{object-fit:contain;padding:12% 7% 28%;filter:drop-shadow(0 16px 40px rgba(0,0,0,.36))}.baziandroid-story-media.is-cover .baziandroid-story-bg{opacity:.30}
.baziandroid-story-dialog:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.10) 30%,rgba(3,7,12,.26) 56%,rgba(2,5,9,.94) 100%);pointer-events:none}.baziandroid-story-copy{position:absolute;right:20px;left:20px;bottom:max(22px,env(safe-area-inset-bottom));z-index:3;color:#fff;direction:rtl;text-align:right}.baziandroid-story-copy h3{margin:0 0 7px;font-size:20px;line-height:1.45;color:#fff;font-weight:900;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.baziandroid-story-copy p{font-size:11.5px;line-height:1.85;color:rgba(255,255,255,.78);margin:8px 0 12px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.baziandroid-story-copy a{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:9px 20px;border-radius:12px;background:var(--theme-color,#16a34a);color:#fff!important;font-size:12px;font-weight:900;text-decoration:none;box-shadow:0 10px 28px color-mix(in srgb,var(--theme-color,#16a34a) 28%,transparent)}
.baziandroid-story-meta,.baziandroid-story-badges{display:flex;align-items:center;flex-wrap:wrap;gap:6px}.baziandroid-story-meta{color:rgba(255,255,255,.78);font-size:10.5px;font-weight:750}.baziandroid-story-meta span+span:before{content:"•";margin-left:6px;color:rgba(255,255,255,.38)}.baziandroid-story-badges{margin-bottom:8px}.baziandroid-story-badges span{display:inline-flex;align-items:center;min-height:25px;padding:4px 8px;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(8px);font-size:9px;font-weight:850;color:#fff}.baziandroid-story-badges .is-updated{background:rgba(22,163,74,.28)}.baziandroid-story-badges .is-new{background:rgba(37,99,235,.30)}.baziandroid-story-badges .is-mod{background:rgba(220,38,38,.25)}.baziandroid-story-badges .is-offline{background:rgba(71,85,105,.42)}.baziandroid-story-badges .is-online{background:rgba(14,165,233,.26)}
.baziandroid-story-progress{position:absolute;top:max(10px,env(safe-area-inset-top));right:12px;left:12px;z-index:7;display:flex;gap:4px;height:3px}.baziandroid-story-progress span{flex:1 1 0;overflow:hidden;border-radius:99px;background:rgba(255,255,255,.25)}.baziandroid-story-progress i{display:block;width:100%;height:100%;background:#fff;transform:scaleX(0);transform-origin:right center;will-change:transform}.baziandroid-story-close,.baziandroid-story-nav{position:absolute;z-index:8;border:0;color:#fff;background:rgba(0,0,0,.38);backdrop-filter:blur(7px);cursor:pointer}.baziandroid-story-close{top:max(20px,calc(env(safe-area-inset-top) + 10px));left:14px;width:36px;height:36px;border-radius:50%;font-size:22px}.baziandroid-story-nav{top:50%;width:38px;height:58px;transform:translateY(-50%);font-size:26px;border-radius:12px}.baziandroid-story-nav.prev{right:10px}.baziandroid-story-nav.next{left:10px}html.baziandroid-story-lock{overflow:hidden}
body.dark-mode .baziandroid-stories,[data-theme="dark"] .baziandroid-stories{background:var(--bg-card,#191d23);border-color:var(--border-color,rgba(255,255,255,.08))}
@media(max-width:576px){.baziandroid-stories{margin-right:-2px;margin-left:-2px;padding:10px 8px 8px}.baziandroid-story{width:66px;flex-basis:66px}.baziandroid-story-ring{width:58px;height:58px}.baziandroid-story-dialog{width:100vw;height:100dvh;max-width:none;max-height:none;border-radius:0}.baziandroid-story-copy{right:18px;left:18px;bottom:max(24px,calc(env(safe-area-inset-bottom) + 12px))}.baziandroid-story-copy h3{font-size:19px}.baziandroid-story-media.is-contain .baziandroid-story-hero{padding:15% 7% 33%}.baziandroid-story-nav{width:34px;height:54px;opacity:.78}}
@media(prefers-reduced-motion:reduce){.baziandroid-story-viewer{transition:none!important}.baziandroid-story-progress i{animation:none!important}}

/* BaziAndroid 4.0.64 — video stories */
.baziandroid-story-ring{position:relative}
.baziandroid-story-video-mark{position:absolute;left:1px;bottom:1px;z-index:3;display:grid;place-items:center;width:19px;height:19px;border:2px solid var(--bg-card,#fff);border-radius:50%;background:#ef4444;color:#fff;font-size:8px;line-height:1;box-shadow:0 3px 9px rgba(0,0,0,.25)}
.baziandroid-story-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#05070b;z-index:1}
.baziandroid-story-video[hidden]{display:none!important}
.baziandroid-story-video-badge{position:absolute;top:max(25px,calc(env(safe-area-inset-top) + 15px));right:14px;z-index:6;display:inline-flex;align-items:center;min-height:26px;padding:4px 9px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(239,68,68,.78);backdrop-filter:blur(8px);color:#fff;font-size:9px;font-weight:900}
.baziandroid-story-video-badge[hidden]{display:none!important}
.baziandroid-story-media:has(.baziandroid-story-video:not([hidden])) .baziandroid-story-bg{opacity:.18;filter:blur(24px) brightness(.45)}
body.dark-mode .baziandroid-story-video-mark,[data-theme="dark"] .baziandroid-story-video-mark{border-color:var(--bg-card,#191d23)}

/* BaziAndroid 4.0.69 — story reactions + audio controls */
.baziandroid-story-actions{position:absolute;top:max(22px,calc(env(safe-area-inset-top) + 12px));right:14px;z-index:9;display:flex;align-items:center;gap:7px;direction:ltr}
.baziandroid-story-action{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:38px;height:36px;padding:0 10px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(0,0,0,.38);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);color:#fff;cursor:pointer;font-size:11px;font-weight:900;box-shadow:0 5px 18px rgba(0,0,0,.16)}
.baziandroid-story-action.is-like{min-width:54px}.baziandroid-story-like-icon{font-size:18px;line-height:1;color:#fff;transition:transform .18s ease,color .18s ease}.baziandroid-story-action.is-like.is-liked{background:rgba(225,29,72,.48);border-color:rgba(251,113,133,.36)}.baziandroid-story-action.is-like.is-liked .baziandroid-story-like-icon{color:#fb7185;transform:scale(1.12)}
.baziandroid-story-action.is-mute{width:38px;min-width:38px;padding:0;font-size:15px}.baziandroid-story-action[hidden]{display:none!important}
.baziandroid-story-heart-burst{position:absolute;left:50%;top:43%;z-index:10;display:block;color:#fb7185;font-size:92px;line-height:1;opacity:0;pointer-events:none;transform:translate(-50%,-50%) scale(.45);filter:drop-shadow(0 12px 24px rgba(0,0,0,.28))}.baziandroid-story-heart-burst.is-show{animation:baziStoryHeart .66s cubic-bezier(.2,.85,.25,1)}
@keyframes baziStoryHeart{0%{opacity:0;transform:translate(-50%,-50%) scale(.35)}22%{opacity:1;transform:translate(-50%,-50%) scale(1.12)}68%{opacity:1;transform:translate(-50%,-50%) scale(.94)}100%{opacity:0;transform:translate(-50%,-56%) scale(1.18)}}
.baziandroid-story-video-badge{top:max(66px,calc(env(safe-area-inset-top) + 56px))}
@media(max-width:576px){.baziandroid-story-actions{right:12px}.baziandroid-story-action{height:34px}.baziandroid-story-heart-burst{font-size:82px}}
@media(prefers-reduced-motion:reduce){.baziandroid-story-heart-burst.is-show{animation:none;opacity:1;transform:translate(-50%,-50%) scale(1)}}


/* BaziAndroid 4.0.70 — adaptive video orientation + ambient story controls */
.baziandroid-story-media{--story-ambient-rgb:18,24,34;background:radial-gradient(circle at 50% 36%,rgba(var(--story-ambient-rgb),.38),transparent 48%),linear-gradient(180deg,#0a0f17 0%,#05070b 100%)}
.baziandroid-story-media.is-video-landscape:before,.baziandroid-story-media.is-video-square:before{content:"";position:absolute;z-index:0;inset:12% 4% 24%;border-radius:30px;background:radial-gradient(ellipse at center,rgba(var(--story-ambient-rgb),.52),rgba(var(--story-ambient-rgb),.12) 48%,transparent 72%);filter:blur(22px);pointer-events:none}
.baziandroid-story-media.is-video-landscape .baziandroid-story-bg,.baziandroid-story-media.is-video-square .baziandroid-story-bg{opacity:.56!important;filter:blur(34px) brightness(.5) saturate(1.45)!important;transform:scale(1.15)}
.baziandroid-story-media.is-video-portrait .baziandroid-story-bg{opacity:.16!important}
.baziandroid-story-media.is-video-landscape .baziandroid-story-video{inset:42% auto auto 50%;width:calc(100% - 28px);height:auto;max-height:58%;aspect-ratio:var(--story-video-ratio,16/9);object-fit:contain;transform:translate(-50%,-50%);border-radius:18px;background:#05070b;box-shadow:0 20px 65px rgba(0,0,0,.5),0 0 54px rgba(var(--story-ambient-rgb),.24)}
.baziandroid-story-dialog.is-video-landscape{width:min(820px,calc(100vw - 28px));height:min(650px,calc(100vh - 30px))}
.baziandroid-story-media.is-video-portrait .baziandroid-story-video{inset:0;width:100%;height:100%;object-fit:cover;transform:none;border-radius:0}
.baziandroid-story-media.is-video-square .baziandroid-story-video{inset:42% auto auto 50%;width:min(88%,560px);height:auto;max-height:62%;aspect-ratio:1/1;object-fit:contain;transform:translate(-50%,-50%);border-radius:20px;box-shadow:0 18px 55px rgba(0,0,0,.46)}
.baziandroid-story-video-mark svg{width:10px;height:10px;fill:currentColor}
.baziandroid-story-actions{gap:9px!important}
.baziandroid-story-action{height:46px!important;min-width:46px!important;padding:0 13px!important;border-radius:999px!important;background:rgba(4,8,14,.48)!important;box-shadow:0 8px 24px rgba(0,0,0,.24)!important}
.baziandroid-story-action.is-like{min-width:68px!important}
.baziandroid-story-like-icon,.baziandroid-story-mute-icon{display:block;width:24px;height:24px;fill:currentColor;color:#fff;flex:0 0 24px}
.baziandroid-story-action.is-like.is-liked .baziandroid-story-like-icon{color:#fb7185;transform:scale(1.12)}
.baziandroid-story-action.is-mute{width:46px!important;padding:0!important}
.baziandroid-story-action.is-mute .icon-muted{display:none}.baziandroid-story-action.is-mute .icon-sound{display:block}.baziandroid-story-action.is-mute.is-muted .icon-muted{display:block}.baziandroid-story-action.is-mute.is-muted .icon-sound{display:none}
.baziandroid-story-heart-burst{width:104px;height:104px;font-size:0;color:#fb7185}.baziandroid-story-heart-burst svg{display:block;width:100%;height:100%;fill:currentColor}
@media(max-width:576px){.baziandroid-story-dialog.is-video-landscape,.baziandroid-story-dialog.is-video-portrait,.baziandroid-story-dialog.is-video-square{width:100vw;height:100dvh;max-width:none;max-height:none;border-radius:0}.baziandroid-story-media.is-video-landscape .baziandroid-story-video{top:41%;width:calc(100% - 18px);max-height:52%;border-radius:14px}.baziandroid-story-media.is-video-square .baziandroid-story-video{top:40%;width:86%;max-height:56%;border-radius:16px}.baziandroid-story-action{height:44px!important;min-width:44px!important}.baziandroid-story-action.is-like{min-width:66px!important}.baziandroid-story-action.is-mute{width:44px!important}.baziandroid-story-like-icon,.baziandroid-story-mute-icon{width:23px;height:23px}.baziandroid-story-heart-burst{width:92px;height:92px}}