:root,[data-theme="light"]{
  --color-bg:#f4f7fb;
  --color-surface:#ffffff;
  --color-surface-2:#ffffff;
  --color-surface-offset:#eef4ff;
  --color-divider:#e6edf7;
  --color-border:#d7e2f0;
  --color-text:#0f172a;
  --color-text-muted:#5b6b82;
  --color-text-faint:#8ea0bb;
  --color-primary:#5b5cf0;
  --color-primary-hover:#4547d8;
  --color-primary-light:#ecebff;
  --color-success:#0f9f6e;
  --color-error:#d64545;
  --color-warning:#d58b0d;
  --radius-sm:10px;--radius-md:14px;--radius-lg:20px;--radius-xl:28px;
  --shadow-sm:0 10px 30px rgba(32,53,90,.07);
  --shadow-md:0 20px 45px rgba(44,72,122,.10);
  --shadow-lg:0 30px 70px rgba(45,58,90,.16);
}
[data-theme="dark"]{
  --color-bg:#081120;
  --color-surface:#0f1b31;
  --color-surface-2:#12213c;
  --color-surface-offset:#152746;
  --color-divider:#223555;
  --color-border:#294064;
  --color-text:#e9f0ff;
  --color-text-muted:#9cb1d2;
  --color-text-faint:#6d83a8;
  --color-primary:#8b82ff;
  --color-primary-hover:#766cf5;
  --color-primary-light:#1d2347;
  --shadow-sm:0 10px 25px rgba(0,0,0,.18);
  --shadow-md:0 18px 45px rgba(0,0,0,.28);
  --shadow-lg:0 28px 70px rgba(0,0,0,.35);
}
body{
  background:
    radial-gradient(circle at top left, rgba(91,92,240,.10), transparent 30%),
    radial-gradient(circle at top right, rgba(0,193,255,.10), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.45), transparent 30%),
    var(--color-bg);
}
[data-theme="dark"] body{
  background:
    radial-gradient(circle at top left, rgba(139,130,255,.15), transparent 28%),
    radial-gradient(circle at top right, rgba(0,204,255,.12), transparent 26%),
    linear-gradient(180deg, rgba(255,255,255,.02), transparent 30%),
    var(--color-bg);
}
.site-header{background:rgba(255,255,255,.72)!important;border-bottom:1px solid rgba(255,255,255,.35);backdrop-filter:blur(18px) saturate(150%);box-shadow:0 6px 24px rgba(28,47,78,.06)}
[data-theme="dark"] .site-header{background:rgba(8,17,32,.78)!important;border-bottom-color:rgba(255,255,255,.06);box-shadow:none}
.header-inner{height:74px;gap:1rem}
.site-logo{gap:.85rem}
.site-logo img{height:42px;width:auto}
.logo-text{font-size:1.2rem;letter-spacing:-.03em}
.logo-text::after{content:"Clue Atlas";display:block;font-size:.72rem;font-family:var(--font-body);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--color-text-faint)}
.header-search-wrap{max-width:520px}
.header-search-box{background:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 6px 18px rgba(28,47,78,.05)}
[data-theme="dark"] .header-search-box{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.08)}
.header-nav{display:flex;align-items:center;gap:.35rem}
.header-nav a{padding:.7rem .95rem;border-radius:999px;color:var(--color-text-muted);font-weight:700;font-size:.88rem}
.header-nav a:hover,.header-nav a[aria-current="page"]{background:var(--color-primary-light);color:var(--color-primary)}
.theme-toggle,.mobile-nav-btn{width:42px;height:42px;border-radius:14px;background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.48);box-shadow:var(--shadow-sm)}
[data-theme="dark"] .theme-toggle,[data-theme="dark"] .mobile-nav-btn{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.08)}
.hero{padding:2.5rem 0 1.25rem;position:relative;overflow:hidden}
.hero::before,.hero::after{content:"";position:absolute;border-radius:999px;filter:blur(8px);pointer-events:none}
.hero::before{width:280px;height:280px;left:-80px;top:-40px;background:linear-gradient(135deg,rgba(91,92,240,.18),rgba(0,193,255,.12))}
.hero::after{width:220px;height:220px;right:-40px;bottom:20px;background:linear-gradient(135deg,rgba(255,117,159,.14),rgba(91,92,240,.12))}
.hero-inner{max-width:1200px;margin:auto;padding:0 1rem}
.hero-inner > div{background:linear-gradient(180deg, rgba(255,255,255,.86), rgba(255,255,255,.72));border:1px solid rgba(255,255,255,.75);box-shadow:var(--shadow-lg);border-radius:32px;padding:clamp(1.35rem,3vw,2.6rem);position:relative;overflow:hidden}
[data-theme="dark"] .hero-inner > div{background:linear-gradient(180deg, rgba(15,27,49,.92), rgba(10,18,33,.92));border-color:rgba(255,255,255,.07)}
.hero-badge{display:inline-flex;align-items:center;gap:.5rem;background:var(--color-primary-light);color:var(--color-primary);padding:.55rem .95rem;border-radius:999px;font-size:.8rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.hero-title{font-size:clamp(2.4rem,5vw,4.8rem);max-width:12ch;letter-spacing:-.06em;margin:1rem 0 .8rem}
.hero-sub{max-width:58ch;font-size:1.06rem;color:var(--color-text-muted)}
.hero-search{margin-top:1.4rem;max-width:760px}
.hero-search-row{display:grid;grid-template-columns:1fr auto;gap:.8rem;padding:.8rem;border-radius:24px;background:rgba(255,255,255,.68);border:1px solid rgba(255,255,255,.8);box-shadow:var(--shadow-md)}
[data-theme="dark"] .hero-search-row{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.08)}
.hero-search-input{min-height:58px;padding:0 1rem;border:none;background:transparent;font-size:1.02rem}
.hero-search-btn{min-width:160px;border-radius:18px;background:linear-gradient(135deg,var(--color-primary),#00a7d8);color:#fff;font-weight:800;box-shadow:0 14px 35px rgba(91,92,240,.28)}
.hero-search-btn:hover{transform:translateY(-1px)}
.section{padding:1.2rem 0 1.8rem}
.section-alt{background:transparent}
.section-header{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin-bottom:1rem}
.section-title{font-size:clamp(1.35rem,2vw,2rem);letter-spacing:-.04em}
.section-link{font-weight:800;font-size:.9rem}
.stats-bar{padding:0 1rem;margin:.25rem auto 1.5rem;max-width:1200px}
.stats-bar-inner{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;background:linear-gradient(135deg,#101935,#192a51);color:#fff;border-radius:26px;padding:1.25rem 1.5rem;box-shadow:var(--shadow-md)}
.stat-item{display:flex;flex-direction:column;gap:.2rem;font-size:.92rem;color:rgba(255,255,255,.72)}
.stat-item strong{font-size:1.6rem;line-height:1;color:#fff;letter-spacing:-.03em}
.stat-div{display:none}
.puzzle-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.puzzle-card{background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(248,251,255,.94));border:1px solid rgba(215,226,240,.9);border-radius:24px;padding:1rem;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;min-height:210px;position:relative;overflow:hidden}
.puzzle-card::before{content:"";position:absolute;inset:auto -40px -40px auto;width:120px;height:120px;border-radius:999px;background:radial-gradient(circle, rgba(91,92,240,.10), transparent 70%)}
[data-theme="dark"] .puzzle-card{background:linear-gradient(180deg, rgba(18,33,60,.95), rgba(15,27,49,.95));border-color:rgba(255,255,255,.06)}
.puzzle-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.puzzle-card-title{font-size:1.08rem;line-height:1.3;letter-spacing:-.03em;margin:.85rem 0 auto}
.puzzle-card-meta{display:flex;gap:.45rem;flex-wrap:wrap}
.badge{padding:.4rem .7rem;font-size:.68rem;letter-spacing:.08em}
.puzzle-card-footer{display:flex;justify-content:space-between;align-items:center;margin-top:1rem;color:var(--color-text-muted);font-weight:700}
.puzzle-card-arrow{display:grid;place-items:center;width:40px;height:40px;border-radius:14px;background:var(--color-primary-light);color:var(--color-primary)}
.az-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.8rem}
.az-card{display:grid;place-items:center;min-height:78px;border-radius:22px;background:linear-gradient(180deg, rgba(255,255,255,.88), rgba(243,247,255,.92));border:1px solid rgba(215,226,240,.8);font-size:1.25rem;font-weight:900;color:var(--color-text);box-shadow:var(--shadow-sm)}
[data-theme="dark"] .az-card{background:linear-gradient(180deg, rgba(18,33,60,.95), rgba(15,27,49,.95));border-color:rgba(255,255,255,.06);color:#fff}
.widget{margin:1rem 0;background:linear-gradient(180deg, rgba(255,255,255,.9), rgba(248,251,255,.95));border:1px solid rgba(215,226,240,.8);border-radius:24px;box-shadow:var(--shadow-sm);overflow:hidden}
[data-theme="dark"] .widget{background:linear-gradient(180deg, rgba(18,33,60,.95), rgba(15,27,49,.95));border-color:rgba(255,255,255,.06)}
.widget-title{padding:1rem 1.15rem;border-bottom:1px solid var(--color-divider);font-size:1rem;font-weight:900;letter-spacing:-.02em}
.widget-body{padding:1rem 1.15rem}
.widget-recent-cards{display:grid;gap:.75rem}
.widget-recent-card,.widget-list li a{border-radius:18px;background:var(--color-surface-offset);padding:.9rem 1rem}
.site-footer{padding:1rem 0 0;background:transparent}
.footer-widgets{max-width:1200px;margin:0 auto;padding:0 1rem;display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:1rem}
.footer-col{background:linear-gradient(180deg, rgba(255,255,255,.86), rgba(248,251,255,.92));border:1px solid rgba(215,226,240,.85);border-radius:26px;padding:1.2rem;box-shadow:var(--shadow-sm)}
[data-theme="dark"] .footer-col{background:linear-gradient(180deg, rgba(18,33,60,.94), rgba(15,27,49,.96));border-color:rgba(255,255,255,.06)}
.footer-brand{display:flex;align-items:center;gap:.8rem;font-weight:900;font-size:1.1rem}
.footer-col-title{font-size:1rem;margin-bottom:.9rem}
.footer-mini-links,.footer-links-list{display:flex;flex-wrap:wrap;gap:.6rem;list-style:none}
.footer-mini-links a,.footer-links-list a{display:inline-flex;padding:.55rem .8rem;border-radius:999px;background:var(--color-surface-offset);font-weight:700;color:var(--color-text-muted)}
.footer-stat-stack{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}
.footer-stat-stack > div{background:var(--color-surface-offset);border-radius:18px;padding:.9rem;text-align:center}
.footer-stat-stack strong{display:block;font-size:1.25rem}
.footer-bottom{padding:1rem 0 1.5rem}
.footer-inner{max-width:1200px;margin:auto;padding:0 1rem;text-align:center;color:var(--color-text-muted)}
.search-dropdown{border-radius:20px}
@media (max-width: 1080px){.puzzle-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.footer-widgets{grid-template-columns:1fr 1fr}.footer-col:first-child{grid-column:1/-1}}
@media (max-width: 860px){.header-search-wrap{display:none}.stats-bar-inner{grid-template-columns:repeat(2,1fr)}.puzzle-grid,.az-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-title{max-width:none}.hero-search-row{grid-template-columns:1fr}.hero-search-btn{min-height:54px;width:100%}}
@media (max-width: 640px){.header-inner{height:68px}.header-nav{display:none}.hero{padding-top:1rem}.hero-inner>div{border-radius:24px;padding:1.1rem}.puzzle-grid,.footer-widgets,.az-grid{grid-template-columns:1fr}.stats-bar-inner{grid-template-columns:1fr}.footer-stat-stack{grid-template-columns:1fr 1fr}.logo-text::after{display:none}}