  /* ================= THE OBSERVATORY ================= */
  .observatory-orbit{
    position:relative; width:100%; max-width:900px;
    height:min(70vmin,560px); min-height:360px; margin:0 auto;
    cursor:grab; border-radius:6px; overflow:hidden;
  }
  .observatory-orbit:active{ cursor:grabbing; }
  .observatory-orbit canvas{
    position:absolute; inset:0; width:100%; height:100%; display:block;
    opacity:0; transition:opacity 1.6s ease;
  }
  .observatory-orbit canvas.ready{ opacity:1; }
  .observatory-vignette{
    position:absolute; inset:0; pointer-events:none;
    background:radial-gradient(ellipse at center, transparent 52%, rgba(2,1,6,.6) 100%);
  }
  .observatory-hint{
    position:absolute; bottom:14px; left:50%; transform:translateX(-50%); z-index:2;
    font-family:var(--font-display); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase;
    color:var(--muted); opacity:.75; pointer-events:none; transition:opacity .8s ease;
    white-space:nowrap;
  }
  .observatory-hint.hidden{ opacity:0; }
  .observatory-reset{
    position:absolute; top:14px; right:14px; z-index:2;
    font-family:var(--font-display); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase;
    color:var(--gold-bright); background:rgba(5,3,11,.5); border:1px solid rgba(214,182,115,.35);
    padding:8px 14px; border-radius:20px; cursor:pointer; transition:all .3s;
    opacity:0; pointer-events:none;
  }
  .observatory-reset.show{ opacity:1; pointer-events:auto; }
  .observatory-reset:hover{ border-color:var(--gold); background:rgba(157,92,255,.2); }

  @media(max-width:600px){
    .observatory-orbit{ height:78vmin; min-height:320px; }
    .observatory-hint{ font-size:9px; }
  }
  @media (prefers-reduced-motion: reduce){
    .observatory-orbit canvas{ transition:none; }
  }

  /* ---------- World discovery panel ---------- */
  .world-modal{
    position:fixed; inset:0; z-index:255; display:flex; align-items:center; justify-content:center;
    padding:24px; opacity:0; pointer-events:none; transition:opacity .5s ease;
  }
  .world-modal.active{ opacity:1; pointer-events:auto; }
  .world-modal-dim{
    position:absolute; inset:0;
    background:radial-gradient(circle at 50% 50%, rgba(20,8,36,.85), rgba(2,1,6,.96) 80%);
    backdrop-filter:blur(3px);
  }
  .world-modal-panel{
    position:relative; max-width:420px; width:90vw; padding:40px 34px; text-align:center;
    transform:scale(.94); transition:transform .5s cubic-bezier(.16,1,.3,1);
  }
  .world-modal.active .world-modal-panel{ transform:scale(1); }
  .world-modal-close{
    position:absolute; top:14px; right:16px; background:none; border:none; cursor:pointer;
    font-size:22px; color:var(--muted); line-height:1; transition:color .3s;
  }
  .world-modal-close:hover{ color:var(--gold-bright); }
  .world-modal-icon{ font-size:40px; margin-bottom:10px; }
  .world-modal-status{
    display:inline-block; margin-bottom:14px; font-family:var(--font-display); font-size:10.5px;
    letter-spacing:.16em; text-transform:uppercase; padding:3px 12px; border-radius:20px;
  }
  .world-modal-panel h3{ font-size:22px; color:var(--ink); margin-bottom:14px; }
  .world-modal-panel p{ font-size:16px; line-height:1.65; color:var(--muted); margin-bottom:26px; }
  .world-modal-actions{ display:flex; flex-direction:column; gap:12px; }
  .world-modal-actions .btn:disabled{ opacity:.4; cursor:not-allowed; }
  .world-modal-actions .btn:disabled:hover{ transform:none; box-shadow:none; }

  .codex-search{
    display:flex; align-items:center; gap:14px; padding:16px 22px; margin-bottom:40px;
    border:1px solid rgba(214,182,115,.3);
  }
  .codex-search input{
    background:none; border:none; outline:none; color:var(--ink); font-family:var(--font-body); font-size:18px; font-style:italic; flex:1;
  }
  .codex-search input::placeholder{ color:var(--muted); }
  .codex-tabs{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:38px; }
  .codex-tab{
    font-family:var(--font-display); font-size:11.5px; letter-spacing:.16em; text-transform:uppercase;
    padding:9px 18px; border:1px solid rgba(214,182,115,.25); color:var(--muted); cursor:pointer; transition:all .3s;
  }
  .codex-tab.active, .codex-tab:hover{ color:var(--gold-bright); border-color:var(--gold); background:rgba(157,92,255,.1); }
  .codex-grid{ display:grid; gap:1px; background:var(--hair); border:1px solid var(--hair); }
  .codex-entry{ background:var(--void); padding:24px 26px; display:none; }
  .codex-entry.show{ display:block; }
  .codex-entry .cat{ font-family:var(--font-display); font-size:10.5px; letter-spacing:.18em; color:var(--gold); text-transform:uppercase; }
  .codex-entry h4{ font-size:20px; margin:10px 0 8px; color:var(--ink); }
  .codex-entry p{ font-size:15.5px; color:var(--muted); line-height:1.6; }
  @media(min-width:720px){ .codex-grid{ grid-template-columns:repeat(2,1fr);} }
  @media(min-width:1080px){ .codex-grid{ grid-template-columns:repeat(3,1fr);} }
