:root{--bg:#f4f7fb;--surface:#fff;--ink:#152238;--muted:#718096;--line:#e4eaf2;--accent:#315efb;--accent-soft:#edf2ff;--shadow:0 18px 60px #1c33500d}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;padding:24px 14px;background:radial-gradient(circle at 10% 0,#dce7ff 0,transparent 30%),var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}a{color:inherit;-webkit-tap-highlight-color:transparent}.hub{width:min(100%,900px);margin:auto;background:var(--surface);border:1px solid #fff;border-radius:32px;box-shadow:var(--shadow);overflow:hidden}.hero{text-align:center;padding:36px 24px 30px;background:linear-gradient(145deg,var(--hero-start),var(--hero-end))}.hero-top{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:24px;text-align:left}.eyebrow{font-size:11px;letter-spacing:.13em;font-weight:800;color:var(--accent)}.status{font-size:11px;color:var(--status-text);display:flex;align-items:center;gap:6px}.status span{width:7px;height:7px;border-radius:50%;background:var(--status-dot)}.profile-photo{width:116px;height:116px;border-radius:32px;object-fit:cover;border:5px solid var(--surface);box-shadow:0 12px 28px #243b641c}.hero h1{font-size:clamp(30px,5vw,46px);letter-spacing:-.045em;line-height:1.1;margin:20px 0 8px}.profile-title{margin:0;color:var(--accent);font-weight:750}.profile-bio{max-width:550px;margin:12px auto 0;color:var(--muted);line-height:1.6;font-size:14px}.hero-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:24px}.primary-btn,.secondary-btn{padding:12px 17px;border-radius:13px;text-decoration:none;font-size:13px;font-weight:750;display:inline-flex;gap:8px;align-items:center}.primary-btn{background:var(--accent);color:#fff;box-shadow:0 8px 20px #315efb2b}.secondary-btn{background:var(--surface);border:1px solid var(--line)}.quick-links{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:18px 24px;border-bottom:1px solid var(--line)}.quick-links a{display:flex;align-items:center;justify-content:center;gap:9px;padding:13px;background:var(--surface-soft);border:1px solid var(--line);border-radius:14px;text-decoration:none;font-size:13px;font-weight:700}.quick-links i{color:var(--accent)}.links-area{padding:30px 24px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:16px}.section-heading h2{font-size:25px;letter-spacing:-.035em;margin:7px 0 0}.link-count{font-size:12px;color:var(--muted);white-space:nowrap}.toolbar{margin:22px 0;display:flex;flex-direction:column;gap:12px}.search-box{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--surface-alt)}.search-box i{color:var(--muted)}.search-box input{border:0;outline:0;background:transparent;width:100%;font:inherit;font-size:14px;color:var(--ink)}.filters{display:flex;gap:7px;flex-wrap:wrap}.filter{border:1px solid var(--line);background:var(--surface);color:var(--muted);border-radius:99px;padding:8px 13px;font-size:12px;font-weight:700;cursor:pointer}.filter.active{background:var(--accent-soft);border-color:#c9d5ff;color:var(--accent)}.link-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.site-link{display:flex;align-items:center;gap:12px;min-width:0;padding:16px;text-decoration:none;border:1px solid var(--line);border-radius:18px;background:var(--surface);transition:transform .18s,border-color .18s,box-shadow .18s}.site-link.featured{border-color:#cbd7ff;background:linear-gradient(135deg,var(--surface),var(--surface-soft))}.site-icon{width:43px;height:43px;flex:0 0 43px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);border-radius:13px}.site-copy{min-width:0;display:flex;flex-direction:column;gap:5px}.site-copy strong{font-size:14px}.site-copy small{font-size:12px;color:var(--muted);line-height:1.45;overflow-wrap:anywhere}.site-arrow{margin-left:auto;color:var(--icon-muted);font-size:12px}.empty-state{text-align:center;color:var(--muted);padding:25px}.footer{text-align:center;padding:25px 24px 30px;border-top:1px solid var(--line);background:var(--surface-alt)}.footer p{font-size:12px;color:var(--muted);margin:0 0 14px}.social-grid{display:flex;justify-content:center;flex-wrap:wrap;gap:9px}.social-grid a{width:39px;height:39px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--social-text);text-decoration:none}.footer small{display:block;margin-top:18px;color:var(--footer-muted);font-size:11px}.site-link:focus-visible,.primary-btn:focus-visible,.secondary-btn:focus-visible,.filter:focus-visible,.quick-links a:focus-visible,.social-grid a:focus-visible{outline:3px solid #315efb55;outline-offset:3px}@media(hover:hover){.site-link:hover{transform:translateY(-3px);border-color:#c7d3f5;box-shadow:0 10px 25px #1c33500d}.quick-links a:hover{border-color:#c7d3f5}}@media(max-width:600px){body{padding:0}.hub{border-radius:0;border:0}.hero{padding:26px 18px}.hero-top{align-items:flex-start}.quick-links,.links-area{padding-left:16px;padding-right:16px}.link-grid{grid-template-columns:1fr}.section-heading h2{font-size:23px}.site-link{padding:14px}.profile-photo{width:104px;height:104px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.site-link.is-hidden{display:none!important}
/* =========================================================
   Theme system: Light / Dark / System
   ========================================================= */
:root {
  color-scheme: light;
  --bg: #f4f7fb;
  --surface: #ffffff;
  --surface-soft: #f8faff;
  --surface-alt: #fbfcff;
  --ink: #152238;
  --muted: #718096;
  --line: #e4eaf2;
  --accent: #315efb;
  --accent-soft: #edf2ff;
  --shadow: 0 18px 60px #1c33500d;
  --hero-start: #ffffff;
  --hero-end: #f5f8ff;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0b1120;
  --surface: #111827;
  --surface-soft: #172033;
  --surface-alt: #0f172a;
  --ink: #f8fafc;
  --muted: #aab6c7;
  --line: #293548;
  --accent: #7aa2ff;
  --accent-soft: #1b2b52;
  --shadow: 0 18px 60px #00000040;
  --hero-start: #172033;
  --hero-end: #101827;
  --status-text: #86d6a3;
  --status-dot: #4ade80;
  --icon-muted: #94a3b8;
  --social-text: #cbd5e1;
  --footer-muted: #94a3b8;
}

@media (prefers-color-scheme: dark) {
  html[data-theme="system"] {
    color-scheme: dark;
    --bg: #0b1120;
    --surface: #111827;
    --surface-soft: #172033;
    --surface-alt: #0f172a;
    --ink: #f8fafc;
    --muted: #aab6c7;
    --line: #293548;
    --accent: #7aa2ff;
    --accent-soft: #1b2b52;
    --shadow: 0 18px 60px #00000040;
    --hero-start: #172033;
    --hero-end: #101827;
  --status-text: #86d6a3;
  --status-dot: #4ade80;
  --icon-muted: #94a3b8;
  --social-text: #cbd5e1;
  --footer-muted: #94a3b8;
  }
}

html[data-theme="system"] {
  color-scheme: light;
}

.theme-control {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  box-shadow: 0 6px 20px #1c33500d;
}

.theme-option {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font-size: 14px;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}

.theme-option:hover {
  color: var(--ink);
  transform: translateY(-1px);
}

.theme-option.active {
  background: var(--accent);
  color: #fff;
  box-shadow: 0 4px 12px #315efb35;
}

.theme-option:focus-visible {
  outline: 3px solid #315efb55;
  outline-offset: 2px;
}

@media (max-width: 480px) {
  .theme-option { width: 34px; height: 34px; }
}

@media (prefers-reduced-motion: reduce) {
  .theme-option { transition: none; }
}

.hero-tools{display:flex;align-items:center;justify-content:flex-end;gap:10px}
@media(max-width:600px){.hero-tools{flex-wrap:wrap;justify-content:flex-end}.hero-top{gap:8px}}

/* Dark-theme readability refinements */
html[data-theme="dark"] body, html[data-theme="system"] body {
  color: var(--ink);
}
html[data-theme="dark"] .secondary-btn, html[data-theme="system"] .secondary-btn,
html[data-theme="dark"] .quick-links a, html[data-theme="system"] .quick-links a,
html[data-theme="dark"] .filter, html[data-theme="system"] .filter,
html[data-theme="dark"] .site-link, html[data-theme="system"] .site-link,
html[data-theme="dark"] .social-grid a, html[data-theme="system"] .social-grid a {
  color: var(--ink);
  background: var(--surface);
}
html[data-theme="dark"] .site-copy small, html[data-theme="system"] .site-copy small,
html[data-theme="dark"] .profile-bio, html[data-theme="system"] .profile-bio,
html[data-theme="dark"] .link-count, html[data-theme="system"] .link-count,
html[data-theme="dark"] .footer p, html[data-theme="system"] .footer p {
  color: var(--muted);
}
html[data-theme="dark"] .search-box, html[data-theme="system"] .search-box {
  background: var(--surface-soft);
  color: var(--ink);
}
html[data-theme="dark"] .search-box input, html[data-theme="system"] .search-box input {
  color: var(--ink);
}
html[data-theme="dark"] .search-box input::placeholder, html[data-theme="system"] .search-box input::placeholder {
  color: var(--muted);
  opacity: 1;
}
html[data-theme="dark"] .site-link.featured, html[data-theme="system"] .site-link.featured {
  border-color: #3b4d78;
}
html[data-theme="dark"] .filter.active, html[data-theme="system"] .filter.active {
  color: var(--accent);
  background: var(--accent-soft);
  border-color: #40558a;
}
html[data-theme="dark"] .hero, html[data-theme="system"] .hero {
  background: linear-gradient(145deg, var(--hero-start), var(--hero-end));
}
html[data-theme="dark"] .footer, html[data-theme="system"] .footer {
  background: var(--surface-alt);
}
