*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
  :root {
    --void: #030712; --dark: #0a1628; --mid: #1e3a5f;
    --gold: #c8a96e; --gold-dim: #8a7048;
    --ice: #7dd3fc; --violet: #a78bfa; --violet-dim: #7c3aed;
    --white: #f0f4ff; --muted: #8899bb;
    --card-bg: rgba(14,26,52,0.82); --border: rgba(167,139,250,0.15);
  }
  html { scroll-behavior: smooth; }
  body { font-family:'Inter',sans-serif; background:var(--void); color:var(--white); min-height:100vh; overflow-x:hidden; }

  /* NAV */
  nav { position:fixed; top:0; left:0; right:0; z-index:100; display:flex; align-items:center; justify-content:space-between; padding:0 2.5rem; height:64px; background:rgba(3,7,18,.8); backdrop-filter:blur(20px); border-bottom:1px solid var(--border); }
  .nav-logo { font-family:'Orbitron',monospace; font-size:.9rem; font-weight:700; color:var(--white); letter-spacing:.08em; display:flex; align-items:center; gap:.7rem; text-decoration:none; }
  .nav-logo-icon { font-size:1.1rem; animation:spin-slow 20s linear infinite; display:inline-block; }
  @keyframes spin-slow { to { transform:rotate(360deg); } }
  .nav-links { display:flex; align-items:center; gap:2rem; list-style:none; }
  .nav-links a { font-size:.7rem; font-family:'Orbitron',monospace; letter-spacing:.1em; color:var(--muted); text-decoration:none; text-transform:uppercase; transition:color .2s; }
  .nav-links a:hover { color:var(--violet); }

  /* HERO */
  .hero { position:relative; height:88vh; min-height:560px; display:flex; flex-direction:column; align-items:center; justify-content:center; overflow:hidden; }
  .hero-bg { position:absolute; inset:0; background-image:url('https://upload.wikimedia.org/wikipedia/commons/thumb/c/c2/Solar_sys8.jpg/1920px-Solar_sys8.jpg'); background-size:cover; background-position:center 30%; filter:brightness(.4) saturate(1.25); transform:scale(1.05); z-index:0; }
  .hero-glow { position:absolute; width:700px; height:700px; border-radius:50%; background:radial-gradient(circle,rgba(124,58,237,.14) 0%,transparent 70%); top:45%; left:50%; transform:translate(-50%,-55%); z-index:1; pointer-events:none; }
  .hero-overlay { position:absolute; inset:0; background:linear-gradient(to bottom,rgba(3,7,18,.25) 0%,rgba(3,7,18,0) 35%,rgba(3,7,18,.85) 85%,rgba(3,7,18,1) 100%); z-index:1; }
  .hero-content { position:relative; z-index:2; text-align:center; padding:0 1.5rem; }
  .hero-eyebrow { font-family:'Orbitron',monospace; font-size:.62rem; letter-spacing:.42em; color:var(--violet); text-transform:uppercase; display:block; margin-bottom:1.2rem; }
  .hero-title { font-family:'Orbitron',monospace; font-size:clamp(2.6rem,6.5vw,5.5rem); font-weight:900; line-height:1.05; background:linear-gradient(135deg,#fff 0%,var(--violet) 50%,var(--gold) 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; margin-bottom:1rem; }
  .hero-sub { font-size:clamp(.9rem,2vw,1.1rem); color:var(--muted); font-weight:300; max-width:560px; margin:0 auto; line-height:1.7; }
  .scroll-hint { position:absolute; bottom:2rem; left:50%; transform:translateX(-50%); z-index:2; display:flex; flex-direction:column; align-items:center; gap:.4rem; color:var(--muted); font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; animation:bounce 2s infinite; }
  @keyframes bounce { 0%,100% { transform:translateX(-50%) translateY(0); } 50% { transform:translateX(-50%) translateY(7px); } }

  /* MAIN */
  main { position:relative; z-index:2; background:var(--void); padding:4.5rem 0 6rem; }
  .container { max-width:1300px; margin:0 auto; padding:0 2rem; }

  /* SEARCH */
  .search-section { text-align:center; margin-bottom:3.5rem; }
  .search-label { font-family:'Orbitron',monospace; font-size:.6rem; letter-spacing:.38em; color:var(--gold); text-transform:uppercase; display:block; margin-bottom:1.2rem; }
  .search-wrapper { position:relative; max-width:640px; margin:0 auto; }
  .search-icon { position:absolute; left:1.2rem; top:50%; transform:translateY(-50%); color:var(--muted); pointer-events:none; }
  #searchInput { width:100%; background:rgba(20,10,40,.9); border:1px solid rgba(167,139,250,.2); border-radius:3px; color:var(--white); font-family:'Inter',sans-serif; font-size:1rem; padding:1rem 2.5rem 1rem 3rem; outline:none; transition:border-color .3s,box-shadow .3s; }
  #searchInput::placeholder { color:var(--muted); }
  #searchInput:focus { border-color:rgba(167,139,250,.5); box-shadow:0 0 0 3px rgba(167,139,250,.08),0 0 30px rgba(167,139,250,.1); }
  .search-clear { position:absolute; right:1rem; top:50%; transform:translateY(-50%); background:none; border:none; color:var(--muted); cursor:pointer; font-size:1rem; display:none; transition:color .2s; }
  .search-clear:hover { color:var(--white); }
  .search-clear.visible { display:block; }
  .search-stats { margin-top:.9rem; font-size:.72rem; color:var(--muted); min-height:1.4em; font-family:'Orbitron',monospace; letter-spacing:.06em; }

  /* PEOPLE SECTION */
  .section-label { display:flex; align-items:baseline; gap:1rem; margin-bottom:2.5rem; padding-bottom:1rem; border-bottom:1px solid var(--border); }
  .section-label h2 { font-family:'Orbitron',monospace; font-size:.9rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
  .section-label span { font-size:.78rem; color:var(--muted); }
  .people-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:1.8rem; margin-bottom:5rem; }

  /* PERSON CARD */
  .person-card { position:relative; display:block; text-decoration:none; border-radius:6px; overflow:hidden; background:var(--card-bg); border:1px solid var(--border); transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .35s,box-shadow .35s; cursor:pointer; }
  .person-card:hover { transform:translateY(-8px); border-color:rgba(167,139,250,.45); box-shadow:0 20px 50px rgba(0,0,0,.55),0 0 0 1px rgba(167,139,250,.15); }
  .person-card.hidden { display:none; }
  .person-card.placeholder { cursor:default; opacity:.5; }
  .person-card.placeholder:hover { transform:none; border-color:var(--border); box-shadow:none; }
  .placeholder-badge { position:absolute; top:.7rem; right:.7rem; font-family:'Orbitron',monospace; font-size:.52rem; letter-spacing:.1em; color:var(--muted); background:rgba(3,7,18,.7); border:1px solid rgba(136,153,187,.25); padding:.22rem .55rem; border-radius:2px; z-index:5; }

  .person-photo { position:relative; width:100%; aspect-ratio:1/1; overflow:hidden; background:linear-gradient(160deg,#1e3a5f 0%,#0a1628 100%); }
  .person-photo img { width:100%; height:100%; object-fit:cover; object-position:center top; display:block; transition:transform .5s cubic-bezier(.2,.8,.2,1),filter .4s; filter:grayscale(15%) brightness(.92); }
  .person-card:hover .person-photo img { transform:scale(1.07); filter:grayscale(0%) brightness(.72); }
  .person-photo::after { content:''; position:absolute; bottom:0; left:0; right:0; height:55%; background:linear-gradient(to top,rgba(3,7,18,.88) 0%,transparent 100%); z-index:1; pointer-events:none; }
  .person-glow-ring { position:absolute; inset:0; border:1px solid transparent; transition:border-color .35s; z-index:3; }
  .person-card:hover .person-glow-ring { border-color:rgba(167,139,250,.4); }
  .person-overlay-icon { position:absolute; bottom:.9rem; right:.9rem; width:34px; height:34px; border-radius:50%; background:rgba(3,7,18,.75); border:1px solid rgba(167,139,250,.45); display:flex; align-items:center; justify-content:center; color:var(--violet); opacity:0; transform:scale(.7) translateY(6px); transition:opacity .3s,transform .3s; z-index:4; }
  .person-card:hover .person-overlay-icon { opacity:1; transform:scale(1) translateY(0); }
  .person-info { padding:1rem 1.2rem 1.2rem; }
  .person-name { font-family:'Orbitron',monospace; font-size:.82rem; font-weight:700; color:var(--white); margin-bottom:.35rem; line-height:1.3; }
  .person-role { font-size:.72rem; color:var(--violet); margin-bottom:.6rem; }
  .person-count { display:inline-flex; align-items:center; gap:.35rem; font-family:'Orbitron',monospace; font-size:.56rem; letter-spacing:.08em; color:var(--gold); background:rgba(200,169,110,.08); border:1px solid rgba(200,169,110,.2); padding:.26rem .65rem; border-radius:2px; }

  /* SEARCH RESULTS */
  #searchResultsSection { display:none; margin-bottom:4rem; }
  #searchResultsSection.visible { display:block; }
  .results-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:1.5rem; padding-bottom:1rem; border-bottom:1px solid var(--border); }
  .results-title { font-family:'Orbitron',monospace; font-size:.9rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
  .results-count { font-family:'Orbitron',monospace; font-size:.6rem; letter-spacing:.1em; color:var(--gold); background:rgba(200,169,110,.08); border:1px solid rgba(200,169,110,.2); padding:.3rem .75rem; border-radius:2px; }

  .result-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(380px,1fr)); gap:1.2rem; }

  .result-card {
    background:var(--card-bg); border:1px solid var(--border); border-radius:4px;
    overflow:hidden; display:flex; flex-direction:column;
    transition:transform .25s,border-color .25s,box-shadow .25s;
    text-decoration:none; color:inherit;
  }
  .result-card:hover { transform:translateY(-3px); border-color:rgba(167,139,250,.35); box-shadow:0 10px 32px rgba(0,0,0,.4); }

  .result-card-top { display:flex; gap:.9rem; padding:.9rem 1rem; align-items:flex-start; }
  .result-thumb { width:72px; height:41px; flex-shrink:0; border-radius:2px; overflow:hidden; background:#000; }
  .result-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
  .result-meta { flex:1; min-width:0; }
  .result-person { font-family:'Orbitron',monospace; font-size:.55rem; letter-spacing:.12em; color:var(--violet); text-transform:uppercase; margin-bottom:.3rem; }
  .result-title { font-size:.85rem; font-weight:600; color:var(--white); line-height:1.35; }
  .result-match-type { font-family:'Orbitron',monospace; font-size:.5rem; letter-spacing:.1em; padding:.18rem .5rem; border-radius:2px; text-transform:uppercase; white-space:nowrap; margin-top:.4rem; display:inline-block; }
  .match-title { background:rgba(167,139,250,.12); color:var(--violet); border:1px solid rgba(167,139,250,.25); }
  .match-topic { background:rgba(200,169,110,.1); color:var(--gold); border:1px solid rgba(200,169,110,.2); }
  .match-chapter { background:rgba(52,211,153,.1); color:#34d399; border:1px solid rgba(52,211,153,.2); }

  /* Matched chapters inside card */
  .result-chapters { border-top:1px solid rgba(167,139,250,.08); }
  .result-chapter-item {
    display:flex; align-items:center; gap:.7rem;
    padding:.5rem 1rem; border-bottom:1px solid rgba(167,139,250,.06);
    text-decoration:none;
  }
  .result-chapter-item:last-child { border-bottom:none; }
  .result-chapter-item:hover { background:rgba(167,139,250,.07); }
  .result-chap-time { font-family:'Orbitron',monospace; font-size:.58rem; color:var(--gold); min-width:36px; }
  .result-chap-label { font-size:.76rem; color:var(--muted); transition:color .2s; flex:1; }
  .result-chapter-item:hover .result-chap-label { color:var(--white); }
  .result-chap-play { color:var(--violet); opacity:0; transition:opacity .2s; }
  .result-chapter-item:hover .result-chap-play { opacity:1; }

  mark { background:rgba(200,169,110,.28); color:var(--gold); border-radius:2px; padding:0 2px; }

  .no-results { text-align:center; padding:3.5rem 2rem; display:none; }
  .no-results.visible { display:block; }
  .no-results h3 { font-family:'Orbitron',monospace; font-size:1rem; color:var(--muted); margin-bottom:.5rem; }
  .no-results p { font-size:.82rem; color:var(--gold-dim); }

  footer { text-align:center; padding:2.5rem; border-top:1px solid rgba(167,139,250,.1); font-size:.65rem; color:var(--muted); font-family:'Orbitron',monospace; letter-spacing:.1em; }

  @media (max-width:700px) {
    nav { padding:0 1.2rem; } .nav-links { display:none; }
    .container { padding:0 1rem; } .hero-title { font-size:2.2rem; }
    .people-grid { grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:1rem; }
    .result-grid { grid-template-columns:1fr; }
  }