/* 西斯天堂: an independent visual system over the retained Sexhub layout and interactions. */
:root {
    color-scheme: light;
    --m4-bg-primary: #f7f8fa;
    --m4-bg-secondary: #ffffff;
    --m4-bg-tertiary: #eef0f4;
    --m4-bg-header: #ffffff;
    --m4-text-primary: #292e3c;
    --m4-text-secondary: #515969;
    --m4-text-muted: #626b7a;
    --m4-accent: #a43e61;
    --m4-accent-hover: #87324f;
    --m4-accent-text: #963657;
    --m4-accent-secondary: #a43e61;
    --m4-on-accent: #ffffff;
    --m4-border: #dfe3e9;
    --m4-border-hover: #cbd0da;
    --m4-card-bg: #ffffff;
    --m4-disabled-bg: #e7eaf0;
    --m4-disabled-fg: #646c7b;
    --m4-status-success: #28754d;
    --m4-status-error: #af3547;
    --m4-status-error-text: #af3547;
    --m4-status-info: #426690;
    --m4-card-radius: 14px;
    --lizhi-accent-soft: #f5e9ee;
    --lizhi-shadow: 0 4px 18px rgb(35 43 64 / .045);
    --lizhi-shadow-raised: 0 12px 30px rgb(35 43 64 / .11);
    --lizhi-header-shadow: 0 2px 14px rgb(35 43 64 / .04);
    font-family: "PingFang TC", "Microsoft JhengHei", "Noto Sans TC", system-ui, sans-serif;
}
body { font-family: inherit; }
::selection { background: var(--m4-accent); color: var(--m4-on-accent); }
:focus-visible { outline: 2px solid var(--m4-accent); outline-offset: 3px; }
.lizhi-brand { display: inline-flex; align-items: center; flex: 0 0 auto; }
.lizhi-brand img { display: block; width: 188px; max-width: 100%; height: 48px; object-fit: contain; }
[data-slot="site-header"] { box-shadow: var(--lizhi-header-shadow); }
.header-topbar { background: var(--m4-bg-secondary); }
.header-primary-row { background: var(--m4-bg-secondary); border-top-color: var(--m4-border); }
.header-navigation { gap: 8px; }
.header-nav-pill { padding-inline: 20px; font-size: 14px; font-weight: 600; letter-spacing: .025em; }
.header-nav-pill::after { height: 3px; border-radius: 3px 3px 0 0; }
.header-action, .header-directory-toggle { border-radius: 10px; }
.header-line-action { padding-inline: 18px; box-shadow: 0 3px 9px rgb(164 62 97 / .12); }
.header-service-panel { border-top-width: 1px; border-radius: 0 0 18px 18px; background: var(--m4-bg-secondary); box-shadow: var(--lizhi-shadow-raised); }
.header-directory-drawer { background: var(--m4-bg-secondary); box-shadow: var(--lizhi-shadow-raised); }
.header-drawer-header, .header-drawer-service-panel, .header-drawer-regions { background: var(--m4-bg-secondary); }
.header-menu-overlay { background: rgb(35 41 55 / .25); }
.home-welcome-title {
    margin-block: 7px 28px;
    padding-block: 14px 20px;
    border-bottom: 1px solid var(--m4-border);
    color: var(--m4-text-primary);
    font-size: clamp(24px,2.3vw,32px);
    font-weight: 600;
    letter-spacing: .07em;
    line-height: 1.5;
    text-align: left;
}
.home-service-header { margin-bottom: 22px; }
.home-service-title { gap: 14px; font-size: 25px; font-weight: 650; letter-spacing: .045em; }
.home-service-title-icon.category-icon { width: 39px; height: 52px; }
.home-module-title { font-size: 16px; font-weight: 600; letter-spacing: .025em; }
.home-service-cities {
    padding: 12px;
    border: 1px solid var(--m4-border);
    border-radius: 14px;
    background: var(--m4-bg-secondary);
    box-shadow: var(--lizhi-shadow);
}
.home-service-cities .home-ranking-city-grid.home-city-grid { gap: 18px; padding: 4px; }
.home-service-cities .home-city-name { color: var(--m4-text-secondary); font-size: 13px; font-weight: 600; }
.home-service-cities .home-city-services { gap: 7px; }
.home-service-cities .home-city-services a.city-choice {
    min-height: 42px;
    padding-inline: 4px;
    border: 1px solid var(--m4-border);
    border-radius: 8px;
    background: var(--m4-bg-primary);
    font-size: 12px;
    font-weight: 500;
}
.home-service-cities .home-city-services a.city-choice:hover { border-color: var(--m4-accent); background: var(--lizhi-accent-soft); color: var(--m4-accent-text); }
.city-choice-count { color: var(--m4-accent-text); font-variant-numeric: tabular-nums; }
.xbb-card {
    border: 1px solid var(--m4-border);
    border-radius: 14px;
    background: var(--m4-bg-secondary);
    box-shadow: var(--lizhi-shadow);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}
.xbb-card:hover { transform: translateY(-3px); scale: 1; border-color: var(--m4-border-hover); box-shadow: var(--lizhi-shadow-raised); }
.xbb-card [data-slot="card-body"] { padding: 12px 13px 14px; }
.xbb-card [data-slot="card-title"] { font-size: 17px; font-weight: 650; letter-spacing: .025em; }
.xbb-card [data-slot="card-location"] { margin-top: 4px; color: var(--m4-text-secondary); font-size: 13px; }
.v3-card-extra { margin-top: 9px; padding-top: 9px; border-top: 1px solid var(--m4-border); font-size: 14px; font-weight: 650; }
.v3-card-extra small { color: var(--m4-text-muted); font-size: 11px; font-weight: 400; }
.home-load-more { min-height: 44px; padding: 10px 26px; border: 1px solid var(--m4-border); border-radius: 10px; background: var(--m4-bg-secondary); color: var(--m4-accent-text); font-size: 14px; font-weight: 600; box-shadow: var(--lizhi-shadow); }
.home-load-more:hover { border-color: var(--m4-accent); background: var(--lizhi-accent-soft); }
.home-service-section + .home-service-section { border-color: var(--m4-border); }
.home-comparison-heading { font-weight: 650; letter-spacing: .035em; }
.home-comparison-shell { box-shadow: var(--lizhi-shadow); }
.home-comparison-table thead th { background: var(--lizhi-accent-soft); }
.home-comparison-table tbody th { background: var(--m4-bg-primary); }
.page-articles, [data-category-activity] { background: var(--m4-bg-secondary); box-shadow: var(--lizhi-shadow); }
.page-articles > header, [data-category-activity] > header { min-height: 49px; background: var(--m4-bg-secondary); }
.page-articles-grid > details { padding-block: 6px; }
.page-articles summary { color: var(--m4-text-primary); }
.sidebar-activity-row { background: var(--m4-bg-secondary); }
.sidebar-activity-row:hover { background: var(--lizhi-accent-soft); }
.sidebar-activity-copy, .sidebar-activity-meta { color: var(--m4-text-secondary); }
.article-index-card { background: var(--m4-bg-secondary); box-shadow: var(--lizhi-shadow); }
.article-index-card:hover { box-shadow: var(--lizhi-shadow-raised); }
.article-index-card-body { padding: 20px; }
.article-index-title, .catalog-page-title { font-weight: 650; letter-spacing: .04em; }
.catalog-sort-control, .catalog-mobile-locations, .catalog-sidebar, .catalog-sidebar-block { border-radius: 12px; background: var(--m4-bg-secondary); }
.catalog-mobile-locations.catalog-mobile-locations--directory { background: var(--m4-bg-secondary); }
.catalog-location-links a, .header-drawer-region a { border-radius: 7px; }
.catalog-location-links a[aria-current], .catalog-sort-tabs [aria-current="page"] { color: var(--m4-accent-text); background: var(--lizhi-accent-soft); }
.catalog-city-row .catalog-location-links a.city-choice { border: 1px solid var(--m4-border); border-radius: 8px; background: var(--m4-bg-secondary); }
.catalog-status { background: var(--m4-bg-secondary); }
.xbb-filter, .xbb-filter-panel, .info-dialog, .v3-media-lightbox { border: 1px solid var(--m4-border); border-radius: 16px; background: var(--m4-bg-secondary); color: var(--m4-text-primary); box-shadow: var(--lizhi-shadow-raised); }
.xbb-filter-header, .xbb-filter-footer { background: var(--m4-bg-secondary); }
.xbb-filter-title, .xbb-filter-section-title { color: var(--m4-text-primary); }
.xbb-filter-choice input:checked + span { border-color: var(--m4-accent); background: var(--m4-accent); color: var(--m4-on-accent); }
.xbb-filter-location input, .v3-exact-range input { background: var(--m4-bg-primary); }
.xbb-detail-gallery, .xbb-detail-summary, .xbb-detail-section { border-color: var(--m4-border); border-radius: 14px; }
.xbb-detail-book, .xbb-filter-apply { min-height: 44px; border-radius: 10px; background: var(--m4-accent); color: var(--m4-on-accent); }
.xbb-detail-book:hover { background: var(--m4-accent-hover); }
.xbb-detail-tags a { border-radius: 7px; }
.xbb-detail-tag-green { color: var(--m4-status-success); }
.xbb-detail-tag-red { color: var(--m4-status-error-text); }
.xbb-detail-book:focus-visible { outline-offset: 4px; }
.v3-contact-dialog h2 { font-weight: 600; letter-spacing: .04em; }
.prose-storefront { color: var(--m4-text-secondary); }
.prose-storefront :is(h1,h2,h3,strong) { color: var(--m4-text-primary); }
.prose-storefront a { color: var(--m4-accent-text); }
.xbb-footer { border-top: 1px solid var(--m4-border); background: var(--m4-bg-secondary); }
.xbb-footer-top { padding-block: 8px 24px; }
.xbb-footer-brand .lizhi-brand img { width: 180px; height: 48px; }
.xbb-footer-intro { color: var(--m4-text-secondary); line-height: 1.9; }
.xbb-footer-menu a { border-radius: 8px; }
.xbb-footer-city-services > a.city-choice { padding: 7px 10px; border: 1px solid var(--m4-border); border-radius: 7px; background: var(--m4-bg-primary); }
.xbb-footer-bottom { color: var(--m4-text-muted); font-size: 12px; letter-spacing: .025em; }
.v3-toast { border-radius: 12px; background: var(--m4-text-primary); color: var(--m4-bg-secondary); box-shadow: var(--lizhi-shadow-raised); }
@media (prefers-color-scheme: dark) {
    .sisi-brand-image { background: #ffffff; border-radius: 8px; }
    :root {
        color-scheme: dark;
        --m4-bg-primary: #15181f;
        --m4-bg-secondary: #1e222c;
        --m4-bg-tertiary: #272c38;
        --m4-bg-header: #1e222c;
        --m4-text-primary: #f2f3f7;
        --m4-text-secondary: #c1c7d2;
        --m4-text-muted: #a7b0c0;
        --m4-accent: #d991aa;
        --m4-accent-hover: #e5adc0;
        --m4-accent-text: #e5adc0;
        --m4-accent-secondary: #d991aa;
        --m4-on-accent: #29202a;
        --m4-border: #3b4352;
        --m4-border-hover: #596375;
        --m4-card-bg: #1e222c;
        --m4-disabled-bg: #343b49;
        --m4-disabled-fg: #a7b0c0;
        --m4-status-success: #88cda8;
        --m4-status-error: #ee9ba6;
        --m4-status-error-text: #ee9ba6;
        --m4-status-info: #a5c1e8;
        --lizhi-accent-soft: #372b37;
        --lizhi-shadow: 0 4px 18px rgb(0 0 0 / .12);
        --lizhi-shadow-raised: 0 12px 30px rgb(0 0 0 / .25);
        --lizhi-header-shadow: 0 2px 14px rgb(0 0 0 / .12);
    }
}
@media (max-width: 767px) {
    .lizhi-brand img { width: clamp(112px, 34vw, 152px); height: 42px; }
    .header-navigation { gap: 0; }
    .header-nav-pill { padding-inline: 12px; font-size: 13px; }
    .header-line-action { padding-inline: 10px; }
    .home-welcome-title { margin-bottom: 20px; padding-block: 8px 18px; font-size: 23px; letter-spacing: .03em; }
    .home-service-title { font-size: 22px; gap: 10px; }
    .home-service-cities { padding: 9px; }
    .home-service-comparison .home-comparison-shell { box-shadow: none; }
    .home-service-title-icon.category-icon { width: 33px; height: 44px; }
    .xbb-card [data-slot="card-body"] { padding: 10px; }
    .xbb-card [data-slot="card-title"] { font-size: 16px; }
    .xbb-card [data-slot="card-location"] { font-size: 12px; }
    .v3-card-extra { gap: 4px; font-size: 13px; }
    .article-index-card-body { padding: 12px; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation: none !important; transition: none !important; }
    .xbb-card:hover { transform: none; }
}
