/* Dark theme for /index.html. Applies only under html[data-theme="dark"], which
   components/preferences.js sets. The block between the sentinels is
   generated by scripts/build_dark_theme.mjs; never edit it by hand. Anything
   after it is hand-written and wins at equal specificity. */

/* DARK_THEME:GENERATED:START */
/* Generated by scripts/build_dark_theme.mjs. Do not edit by hand. */
html[data-theme="dark"]{--bg:#192030;--bg2:#171d2c;--bg3:#1d2639;--surface:#171d2c;--surface2:#192030;--border:#212a40;--accent:#7bb3f4;--accent2:#8abff5;--mint:#6FE3B4;--text:#c4d1d9;--muted:#afbac0;--white:#d2e7f5}
html[data-theme="dark"] body{background:var(--bg);color:var(--text)}
html[data-theme="dark"] .hero-grid-bg{background-image:linear-gradient(rgba(14,103,208,0.09) 1px, transparent 1px), linear-gradient(90deg, rgba(14,103,208,0.09) 1px, transparent 1px)}
html[data-theme="dark"] .hero-glow{background:radial-gradient(circle, rgba(14,103,208,0.15) 0%, transparent 70%)}
html[data-theme="dark"] .hero-badge{background:rgba(14,103,208,0.1);border:1px solid rgba(14,103,208,0.3);color:var(--accent)}
html[data-theme="dark"] .hero-badge::before{background:var(--accent)}
html[data-theme="dark"] h1{color:var(--white)}
html[data-theme="dark"] h1 .highlight{color:transparent}
html[data-theme="dark"] .hero-desc{color:var(--muted)}
html[data-theme="dark"] .hero-desc strong{color:var(--text)}
html[data-theme="dark"] .btn-primary{background:var(--accent);color:#fff}
html[data-theme="dark"] .btn-primary:hover{background:var(--accent2);box-shadow:0 8px 30px rgba(14,103,208,0.3)}
html[data-theme="dark"] .btn-secondary{background:transparent;color:var(--text);border:1px solid var(--border)}
html[data-theme="dark"] .btn-secondary:hover{border-color:var(--accent);color:var(--accent)}
html[data-theme="dark"] .btn-topmate{background:#1e293b;color:#fff}
html[data-theme="dark"] .btn-topmate:hover{background:#0f172a;box-shadow:0 6px 20px rgba(15,23,42,0.25)}
html[data-theme="dark"] .hero-stats{border-top:1px solid var(--border)}
html[data-theme="dark"] .stat-num{color:var(--white)}
html[data-theme="dark"] .stat-num span{color:var(--accent)}
html[data-theme="dark"] .stat-label{color:var(--muted)}
html[data-theme="dark"] .section-label{color:var(--accent)}
html[data-theme="dark"] .section-title{color:var(--white)}
html[data-theme="dark"] .section-sub{color:var(--muted)}
html[data-theme="dark"] #youtube{background:var(--bg2)}
html[data-theme="dark"] .video-card{background:var(--surface);border:1px solid var(--border)}
html[data-theme="dark"] .video-card:hover{border-color:var(--accent);box-shadow:0 10px 30px rgba(14,103,208,0.1)}
html[data-theme="dark"] .video-thumb{background:var(--bg3)}
html[data-theme="dark"] .play-btn{background:rgba(0,0,0,0.4)}
html[data-theme="dark"] .video-info h3{color:var(--white)}
html[data-theme="dark"] .video-meta{color:var(--muted)}
html[data-theme="dark"] #shorts{background:var(--bg)}
html[data-theme="dark"] .shorts-row::-webkit-scrollbar-thumb{background:var(--border)}
html[data-theme="dark"] .short-card{background:var(--surface);border:1px solid var(--border)}
html[data-theme="dark"] .short-card:hover{border-color:var(--accent);box-shadow:0 10px 30px rgba(14,103,208,0.1)}
html[data-theme="dark"] .short-thumb{background:var(--bg3)}
html[data-theme="dark"] .short-badge{background:var(--accent);color:#fff}
html[data-theme="dark"] .short-info h3{color:var(--white)}
html[data-theme="dark"] #instagram{background:var(--bg2)}
html[data-theme="dark"] .ig-card{border:1px solid var(--border);background:var(--surface)}
html[data-theme="dark"] .ig-card:hover{border-color:var(--accent);box-shadow:0 6px 20px rgba(37,99,235,0.10)}
html[data-theme="dark"] .ig-card img{background:#0b1220}
html[data-theme="dark"] .ig-play svg{color:#fff;background:rgba(0,0,0,0.35)}
html[data-theme="dark"] .ig-card-caption{color:var(--text)}
html[data-theme="dark"] .ig-card-date{color:var(--muted)}
html[data-theme="dark"] #contact{background:var(--bg2)}
html[data-theme="dark"] .social-icon{color:#fff;box-shadow:0 2px 12px rgba(0,0,0,0.1)}
html[data-theme="dark"] .social-icon:hover{box-shadow:0 6px 20px rgba(0,0,0,0.15)}
html[data-theme="dark"] .si-yt{background:#ff0000}
html[data-theme="dark"] .si-li{background:#0a66c2}
html[data-theme="dark"] .si-ig{background:radial-gradient(circle at 30% 107%, #5a562c 0%, #fd5949 45%, #d6249f 60%, #285aeb 90%)}
html[data-theme="dark"] .si-tg{background:#229ed9}
html[data-theme="dark"] .si-tm{background:#E44332}
html[data-theme="dark"] .social-tagline{color:var(--muted)}
html[data-theme="dark"] .post-card{background:var(--surface);border:1px solid var(--border)}
html[data-theme="dark"] .post-card::before{background:var(--accent)}
html[data-theme="dark"] .post-card:hover{border-color:rgba(14,103,208,0.35);box-shadow:0 10px 30px rgba(14,103,208,0.1)}
html[data-theme="dark"] .post-tag{background:rgba(14,103,208,0.1);border:1px solid rgba(14,103,208,0.2);color:var(--accent2)}
html[data-theme="dark"] .post-card p{color:var(--text)}
html[data-theme="dark"] .post-footer{color:var(--muted)}
html[data-theme="dark"] .post-link{color:var(--accent)}
html[data-theme="dark"] #casestudy{background:var(--bg)}
html[data-theme="dark"] footer{background:var(--bg2);border-top:1px solid var(--border)}
html[data-theme="dark"] .footer-logo{color:var(--white)}
html[data-theme="dark"] .footer-logo span{color:var(--accent)}
html[data-theme="dark"] .footer-links a{color:var(--muted)}
html[data-theme="dark"] .footer-links a:hover{color:var(--accent)}
html[data-theme="dark"] .footer-copy{color:var(--muted)}
html[data-theme="dark"] .hero-photo-ring{background:conic-gradient(var(--accent) 0deg, var(--accent2) 120deg, transparent 200deg, var(--accent) 360deg)}
html[data-theme="dark"] .hero-photo-ring-inner{background:var(--bg)}
html[data-theme="dark"] .hero-photo{border:3px solid var(--bg)}
html[data-theme="dark"] .hero-photo-badge{background:var(--accent);color:#fff;box-shadow:0 4px 16px rgba(14,103,208,0.4)}
html[data-theme="dark"] .hero-photo-dots{background-image:radial-gradient(circle, rgba(14,103,208,0.3) 1px, transparent 1px)}
html[data-theme="dark"]::-webkit-scrollbar-track{background:var(--bg)}
html[data-theme="dark"]::-webkit-scrollbar-thumb{background:var(--border)}
/* inline style attributes */
html[data-theme="dark"] [style*="background:#E9F0EB"]{background:#1d2639 !important}
html[data-theme="dark"] [style*="border-bottom:1px solid #dfe7e2"]{border-bottom:1px solid #2c3855 !important}
html[data-theme="dark"] [style^="color:#0E67D0"],html[data-theme="dark"] [style*=";color:#0E67D0"],html[data-theme="dark"] [style*="; color:#0E67D0"]{color:#7bb3f4 !important}
html[data-theme="dark"] [style*="background:#fee2e2"]{background:#3e1f1f !important}
html[data-theme="dark"] [style*="border-top:1px solid #dfe7e2"]{border-top:1px solid #2c3855 !important}
html[data-theme="dark"] [style^="color:#334155"],html[data-theme="dark"] [style*=";color:#334155"],html[data-theme="dark"] [style*="; color:#334155"]{color:#bfcad9 !important}
html[data-theme="dark"] [style^="color:#0E2A3C"],html[data-theme="dark"] [style*=";color:#0E2A3C"],html[data-theme="dark"] [style*="; color:#0E2A3C"]{color:#d2e7f5 !important}
html[data-theme="dark"] [style^="color:#64748b"],html[data-theme="dark"] [style*=";color:#64748b"],html[data-theme="dark"] [style*="; color:#64748b"]{color:#acb6c3 !important}
/* DARK_THEME:GENERATED:END */