html[data-yc-theme="fallback"] {
    background: #090f22;
}

html[data-yc-theme="fallback"] body {
    color: #f3f7ff;
    background:
        radial-gradient(circle at 18% -8%, rgba(76, 110, 255, 0.32), transparent 32%),
        radial-gradient(circle at 88% 12%, rgba(168, 94, 255, 0.26), transparent 34%),
        radial-gradient(circle at 80% 74%, rgba(35, 211, 255, 0.12), transparent 28%),
        linear-gradient(180deg, #090f22 0%, #111936 52%, #17113a 100%);
}

html[data-yc-theme="fallback"] body::before {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.055), transparent 42%),
        linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
    background-size: auto, 44px 44px, 44px 44px;
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.78), transparent 82%);
}

.theme-toggle {
    position: fixed;
    left: 12px;
    right: auto;
    bottom: max(16px, env(safe-area-inset-bottom));
    z-index: 1200;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 36px;
    padding: 0 12px;
    border: 1px solid rgba(77, 121, 255, 0.18);
    border-radius: 999px;
    color: #4d79ff;
    background: rgba(255, 255, 255, 0.86);
    box-shadow: 0 10px 24px rgba(56, 83, 125, 0.12);
    backdrop-filter: blur(14px);
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}

html[data-yc-theme="fallback"] .theme-toggle {
    color: #eaf1ff;
    background: rgba(19, 27, 57, 0.78);
    border-color: rgba(151, 173, 255, 0.26);
    box-shadow: 0 16px 34px rgba(0, 0, 0, 0.32), 0 0 22px rgba(77, 121, 255, 0.16);
}

html[data-yc-theme="fallback"] .brand-hero,
html[data-yc-theme="fallback"] .nav-card,
html[data-yc-theme="fallback"] .list-item,
html[data-yc-theme="fallback"] .site-row,
html[data-yc-theme="fallback"] .scan-card,
html[data-yc-theme="fallback"] .browser-mockup,
html[data-yc-theme="fallback"] .header-card,
html[data-yc-theme="fallback"] .guide-header {
    color: #f3f7ff;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.055)),
        rgba(13, 19, 43, 0.72);
    border-color: rgba(169, 188, 255, 0.18);
    box-shadow:
        0 22px 54px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(18px);
}

html[data-yc-theme="fallback"] .brand-hero::before {
    background:
        linear-gradient(140deg, rgba(123, 151, 255, 0.18), rgba(166, 97, 255, 0.08)),
        linear-gradient(110deg, transparent 0 34%, rgba(180, 203, 255, 0.2) 46%, transparent 58%),
        radial-gradient(circle at 24% 0%, rgba(107, 132, 255, 0.28), transparent 34%);
    background-size: auto, 220% 100%, auto;
    animation: heroSheen 7s ease-in-out infinite;
}

html[data-yc-theme="fallback"] .brand-title {
    color: transparent;
    background: linear-gradient(90deg, #9ec3ff 0%, #d8c2ff 30%, #ffffff 52%, #8ee7ff 76%, #9ec3ff 100%);
    background-size: 260% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    text-shadow: 0 0 26px rgba(117, 146, 255, 0.42);
}

html[data-yc-theme="fallback"] .brand-title::after {
    background: linear-gradient(110deg, transparent 0 38%, rgba(190, 219, 255, 0.74) 48%, transparent 60%);
}

html[data-yc-theme="fallback"] .brand-slogan,
html[data-yc-theme="fallback"] .card-desc,
html[data-yc-theme="fallback"] .page-desc,
html[data-yc-theme="fallback"] .g-desc,
html[data-yc-theme="fallback"] .site-info h3,
html[data-yc-theme="fallback"] .footer,
html[data-yc-theme="fallback"] .list-arrow {
    color: #aab6d6;
}

html[data-yc-theme="fallback"] .card-title,
html[data-yc-theme="fallback"] .list-text,
html[data-yc-theme="fallback"] .page-title,
html[data-yc-theme="fallback"] .g-title,
html[data-yc-theme="fallback"] .site-url,
html[data-yc-theme="fallback"] .section-title {
    color: #f3f7ff;
}

html[data-yc-theme="fallback"] .section-title::before {
    background: linear-gradient(180deg, #77a6ff, #bd8bff);
    box-shadow: 0 0 16px rgba(119, 166, 255, 0.46);
}

html[data-yc-theme="fallback"] .notice-bar {
    background: rgba(255, 255, 255, 0.095);
    box-shadow:
        inset 0 0 0 1px rgba(169, 188, 255, 0.16),
        0 12px 26px rgba(0, 0, 0, 0.18);
}

html[data-yc-theme="fallback"] .notice-icon {
    color: #ffffff;
    background: linear-gradient(135deg, #ff8abd, #7b6ee8);
    box-shadow: 0 0 18px rgba(255, 138, 189, 0.3);
}

html[data-yc-theme="fallback"] .marquee-text {
    color: #ffffff;
}

html[data-yc-theme="fallback"] .nav-card::before,
html[data-yc-theme="fallback"] .list-item::before,
html[data-yc-theme="fallback"] .site-row::before {
    background: radial-gradient(circle at var(--press-x, 50%) var(--press-y, 40%), rgba(132, 162, 255, 0.24), transparent 34%);
}

html[data-yc-theme="fallback"] .nav-card::after,
html[data-yc-theme="fallback"] .list-item::after,
html[data-yc-theme="fallback"] .site-row::after {
    background: linear-gradient(115deg, transparent 0 34%, rgba(181, 203, 255, 0.18) 46%, transparent 58%);
}

html[data-yc-theme="fallback"] .nav-card:hover,
html[data-yc-theme="fallback"] .list-item:hover,
html[data-yc-theme="fallback"] .site-row:hover {
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.07)),
        rgba(17, 25, 54, 0.82);
    border-color: rgba(151, 173, 255, 0.34);
    box-shadow:
        0 24px 56px rgba(0, 0, 0, 0.4),
        0 0 28px rgba(77, 121, 255, 0.14);
}

html[data-yc-theme="fallback"] .card-icon-box,
html[data-yc-theme="fallback"] .list-icon,
html[data-yc-theme="fallback"] .platform-icon {
    color: #ffffff;
    background: linear-gradient(135deg, #4d79ff 0%, #7b6ee8 56%, #d27dff 100%);
    box-shadow: 0 14px 30px rgba(77, 121, 255, 0.24), 0 0 24px rgba(123, 110, 232, 0.18);
}

html[data-yc-theme="fallback"] .site-index,
html[data-yc-theme="fallback"] .tip-num {
    color: #dbe6ff;
    background: rgba(126, 151, 255, 0.14);
}

html[data-yc-theme="fallback"] .qr-box,
html[data-yc-theme="fallback"] .mockup-btn,
html[data-yc-theme="fallback"] .g-icon {
    background: rgba(255, 255, 255, 0.075);
    border-color: rgba(169, 188, 255, 0.16);
}

html[data-yc-theme="fallback"] .big-btn {
    color: #ffffff;
    background: linear-gradient(135deg, #4d79ff, #7b6ee8);
    box-shadow: 0 16px 32px rgba(77, 121, 255, 0.24);
}

html[data-yc-theme="fallback"] .scan-line {
    background: linear-gradient(90deg, transparent, #9ec3ff, transparent);
}

html[data-yc-theme="fallback"] .speed-fast {
    color: #9ff7d2;
    background: rgba(61, 214, 147, 0.14);
}

html[data-yc-theme="fallback"] .speed-medium {
    color: #ffd98f;
    background: rgba(255, 199, 96, 0.14);
}

html[data-yc-theme="fallback"] .speed-slow {
    color: #ff9ab0;
    background: rgba(255, 110, 143, 0.14);
}

html[data-yc-theme="fallback"] .speed-checking {
    color: #aab6d6;
    background: rgba(255, 255, 255, 0.08);
}

html[data-yc-theme="fallback"] .cursor-dot {
    background: #eaf1ff;
    border-color: #7ea6ff;
    box-shadow:
        0 0 0 5px rgba(126, 166, 255, 0.12),
        0 0 20px rgba(126, 166, 255, 0.46);
    mix-blend-mode: screen;
}

html[data-yc-theme="fallback"] .cursor-outline {
    border-color: rgba(126, 166, 255, 0.48);
    background:
        radial-gradient(circle, rgba(126, 166, 255, 0.12) 0 26%, transparent 28%),
        radial-gradient(circle, rgba(189, 139, 255, 0.18), transparent 68%);
}

html[data-yc-theme="fallback"] .chat-button {
    background:
        radial-gradient(circle at 32% 24%, rgba(255, 255, 255, 0.24), transparent 28%),
        linear-gradient(135deg, #4d79ff 0%, #7b6ee8 52%, #d27dff 100%);
    color: #fff;
    box-shadow: 0 16px 34px rgba(77, 121, 255, 0.28), 0 0 24px rgba(123, 110, 232, 0.22);
}

@media (max-width: 420px) {
    .theme-toggle {
        left: 12px;
        right: auto;
        bottom: max(16px, env(safe-area-inset-bottom));
    }

    .theme-toggle span {
        display: none;
    }
}