/* NihongoVS - Full color override */

/* Light */
[data-theme=light] { --bg:#fff; --fg:#111827; --fg2:#374151; --accent:#2563eb; --muted:#f1f5f9; --bdr:#e2e8f0; }
/* Dark */
[data-theme=dark] { --bg:#0f172a; --fg:#e2e8f0; --fg2:#94a3b8; --accent:#60a5fa; --muted:#1e293b; --bdr:#334155; }

html, body { background:var(--bg) !important; color:var(--fg) !important; font-weight:400; -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4,h5,h6 { color:var(--fg) !important; font-weight:800 !important; }
h1 { font-size:2rem !important; letter-spacing:-0.02em; }
h2 { font-size:1.5rem !important; }
p, li, td, th, span, div, section, article, main, blockquote, figcaption, label, strong, em, small {
  color: inherit !important;
}
p, li, td { font-weight:450; font-size:1rem; line-height:1.75; }
a { color:var(--accent) !important; text-decoration:none; font-weight:500; }
a:hover { text-decoration:underline; }

/* Skip link */
#skip-to-content { position:absolute!important;top:-9999px!important;left:-9999px!important; }

/* Header */
header { position:relative!important;top:auto!important;border-bottom:1px solid var(--bdr)!important;background:var(--bg)!important; }
header a[href*="nihongo-vs"] { font-weight:800!important;color:var(--accent)!important; }

/* Menu */
#menu-items { background:var(--bg)!important;border:1px solid var(--bdr)!important;border-radius:10px;padding:8px!important;box-shadow:0 4px 20px rgba(0,0,0,.2); }
#menu-items li { list-style:none!important; }
#menu-items li a { display:block!important;padding:12px 16px!important;border-radius:8px;font-weight:600!important;color:var(--fg)!important;font-size:1rem!important; }
#menu-items li a:hover { background:var(--muted)!important;color:var(--accent)!important; }
@media(min-width:640px){#menu-items{background:transparent!important;border:none!important;box-shadow:none;padding:0!important;}}

/* Hero */
main>section:first-child h1 { color:var(--fg)!important;font-weight:900!important;font-size:2.2rem!important; }
main>section:first-child p { color:var(--fg2)!important;font-weight:500!important;font-size:1.1rem!important; }

/* Search bar */
a[href*="search/"].flex { border-radius:10px!important;background:var(--muted)!important;border:1px solid var(--bdr)!important;color:var(--fg2)!important; }
a[href*="search/"].flex svg { width:18px!important;height:18px!important; }

/* Cards */
a[href*="-vs-"].group,a[href*="archetype/"].group {
  border-radius:10px!important;border:1px solid var(--bdr)!important;
  padding:1.2rem!important;background:var(--bg)!important;
  transition:border-color .2s,box-shadow .2s!important;
}
a[href*="-vs-"].group:hover,a[href*="archetype/"].group:hover {
  border-color:var(--accent)!important;box-shadow:0 4px 12px rgba(0,0,0,.08);
}
a[href*="-vs-"] h3,a[href*="archetype/"] h3 {
  font-weight:800!important;color:var(--accent)!important;font-size:1.05rem!important;
}
a[href*="-vs-"] p,a[href*="archetype/"] p {
  color:var(--fg2)!important;font-size:.9rem!important;line-height:1.6;font-weight:450;
}

/* JLPT badges */
span.rounded.bg-muted,a span[class*="rounded"][class*="bg-muted"] {
  background:var(--accent)!important;color:#fff!important;
  font-weight:700!important;font-size:.65rem!important;
  padding:3px 10px!important;border-radius:999px!important;
}

/* Category/JLPT nav */
section a[href*="category/"],section a[href*="jlpt/"] {
  display:inline-block;padding:8px 16px;border-radius:8px;
  background:var(--muted)!important;border:1px solid var(--bdr);margin:3px;
  font-weight:600;font-size:.85rem;text-decoration:none!important;
  color:var(--fg)!important;
}
section a[href*="category/"]:hover,section a[href*="jlpt/"]:hover {
  background:var(--accent)!important;border-color:var(--accent);color:#fff!important;
}

/* Tables */
table { width:100%;border-collapse:collapse;margin:1.5rem 0; }
th { background:var(--muted)!important;padding:10px 14px;font-weight:700;color:var(--fg)!important; }
td { padding:10px 14px;border-bottom:1px solid var(--bdr);color:var(--fg)!important; }

/* Blockquote */
blockquote { border-left:3px solid var(--accent);padding:12px 16px;background:var(--muted)!important;border-radius:0 8px 8px 0; }

/* Footer */
footer { border-top:1px solid var(--bdr)!important;padding:2rem 1rem!important;color:var(--fg2)!important; }

/* Icons */
#theme-btn svg,a[title="Search"] svg,a[aria-label="search"] svg { width:20px!important;height:20px!important; }
button svg { color:var(--fg)!important; }

/* Giant SVG fix */
main>svg,main section>svg { max-width:48px!important;max-height:48px!important; }

/* Mobile */
@media(max-width:640px){ .app-layout{padding-inline:16px!important;} }