/* Night Journey explorer. Scoped to .nj so light-theme pages do not wash out the sky. */
.nj{
  --bg:#0B0B0D; --panel:#1A1A1D; --ink:#F4EFE6; --ink-soft:#D6D2CB;
  --muted:#A6A6AD; --muted-2:#84848C; --brass:#C17834; --brass-hi:#E7BE8A;
  --line:rgba(244,239,230,.07); --line-2:rgba(244,239,230,.12);
  height:calc(100vh - 56px);min-height:680px;display:flex;flex-direction:column;overflow:hidden;
  background:var(--bg);color:var(--ink);font-family:'Inter','Noto Nastaliq Urdu',system-ui,sans-serif;
}
.nj *{box-sizing:border-box}
.nj-head{padding:30px 44px 0;display:flex;justify-content:space-between;align-items:flex-end}
.nj-eyebrow{font-size:11px;letter-spacing:.36em;text-transform:uppercase;color:var(--brass);font-weight:600;margin-bottom:10px}
.nj-titlerow{display:flex;align-items:baseline;gap:20px}
.nj-num{font-family:'Newsreader',Georgia,serif;font-size:22px;color:var(--muted-2)}
.nj-title{margin:0;font-size:38px;font-weight:700;letter-spacing:-.02em;font-family:'Inter','Noto Nastaliq Urdu',sans-serif}
.nj-headright{display:flex;align-items:center;gap:16px;padding-bottom:6px}
.nj-meta{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2);font-family:'Inter','Noto Nastaliq Urdu',sans-serif}
.nj-langbtn{font-size:12.5px;color:var(--ink-soft);border:1px solid rgba(244,239,230,.18);border-radius:999px;padding:5px 16px;cursor:pointer;user-select:none;font-family:'Inter','Noto Nastaliq Urdu',sans-serif;transition:all .3s;line-height:1.6;background:none}
.nj-langbtn:hover{border-color:var(--brass);color:var(--ink)}
.nj-pills{padding:18px 44px 16px;display:flex;gap:10px;flex-wrap:wrap}
.nj-pill{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--muted);border:1px solid var(--line-2);border-radius:999px;padding:8px 16px;cursor:pointer;transition:all .3s;font-family:'Inter','Noto Nastaliq Urdu',sans-serif;line-height:1.5;background:none}
.nj-pill:hover{color:var(--ink);border-color:rgba(231,190,138,.5)}
.nj-pill.on{color:var(--brass-hi);border-color:rgba(231,190,138,.5)}
.nj-main{flex:1;display:flex;min-height:0;border-top:1px solid var(--line)}
.nj-skywrap{flex:1;position:relative;min-width:0;background:var(--bg)}
.nj-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab}
.nj-hint{position:absolute;left:44px;top:20px;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-2);pointer-events:none;font-family:'Inter','Noto Nastaliq Urdu',sans-serif}
.nj-scrub{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:7px}
.nj-scrubbar{display:flex;align-items:center;gap:12px;background:rgba(11,11,13,.72);border:1px solid rgba(244,239,230,.1);border-radius:999px;padding:8px 16px;backdrop-filter:blur(6px)}
.nj-arrow{width:24px;height:24px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:11px;color:var(--muted);user-select:none;transition:color .2s;background:none;border:none}
.nj-arrow:hover{color:var(--brass-hi)}
.nj-dots{display:flex;align-items:center;gap:4px}
.nj-dot{width:13px;height:13px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.nj-dot i{width:5px;height:5px;border-radius:50%;background:rgba(244,239,230,.28);transition:all .3s}
.nj-dot.final i{background:rgba(201,164,107,.85)}
.nj-dot.on i{width:9px;height:9px;background:var(--brass-hi);box-shadow:0 0 10px rgba(231,190,138,.9)}
.nj-cap{font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted-2);pointer-events:none;font-family:'Inter','Noto Nastaliq Urdu',sans-serif}
.nj-zoom{position:absolute;right:20px;bottom:16px;display:flex;flex-direction:column;gap:8px}
.nj-zbtn{width:34px;height:34px;border-radius:50%;border:1px solid rgba(244,239,230,.18);background:rgba(11,11,13,.75);color:var(--ink-soft);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:16px;user-select:none}
.nj-zbtn:hover{border-color:var(--brass);color:var(--ink)}
.nj-panel{width:330px;border-left:1px solid var(--line);padding:32px 34px;display:flex;flex-direction:column;flex-shrink:0}
.nj-era{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--brass);font-weight:600;margin-bottom:14px;font-family:'Inter','Noto Nastaliq Urdu',sans-serif}
.nj-name{font-size:24px;font-weight:700;line-height:1.5;margin-bottom:6px;font-family:'Inter','Noto Nastaliq Urdu','Amiri',sans-serif}
.nj-honor{font-family:'Amiri',serif;font-size:.76em;line-height:0;vertical-align:-.06em;color:var(--brass-hi);display:inline-block;margin-inline-start:.22em}
.nj-count{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2);margin-bottom:24px;font-family:'Inter','Noto Nastaliq Urdu',sans-serif}
.nj-chapters{display:flex;flex-direction:column;overflow-y:auto}
.nj-ch{display:flex;align-items:baseline;gap:14px;padding:12px 0;border-top:1px solid var(--line)}
.nj-ch .st{color:var(--brass-hi);font-size:11px}
.nj-ch .n{font-family:'Newsreader','Noto Nastaliq Urdu',Georgia,serif;font-size:13px;color:var(--muted-2)}
.nj-ch .t{font-size:14px;color:var(--ink-soft);font-family:'Inter','Noto Nastaliq Urdu',sans-serif;line-height:1.8}
.nj-foot{margin-top:auto;padding-top:18px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2);line-height:1.9;font-family:'Inter','Noto Nastaliq Urdu',sans-serif}
/* Urdu mode: kill tracking (breaks Nastaliq joining), bump small sizes, RTL panel */
.nj[data-lang="ur"] .nj-meta,.nj[data-lang="ur"] .nj-pill,.nj[data-lang="ur"] .nj-hint,
.nj[data-lang="ur"] .nj-cap,.nj[data-lang="ur"] .nj-era,.nj[data-lang="ur"] .nj-count,
.nj[data-lang="ur"] .nj-foot{letter-spacing:0;font-size:13px}
.nj[data-lang="ur"] .nj-panel{direction:rtl}

.nj button:focus-visible{outline:2px solid var(--brass-hi);outline-offset:3px}
.nj-canvas:active{cursor:grabbing}

@media (max-width: 1100px){
  .nj-head{padding:24px 26px 0}
  .nj-pills{padding:16px 26px 14px}
  .nj-panel{width:300px;padding:26px 24px}
  .nj-hint{left:26px}
}

@media (max-width: 900px){
  .nj{height:auto;min-height:calc(100vh - 56px);overflow:visible}
  .nj-head{align-items:flex-start;gap:18px;flex-wrap:wrap}
  .nj-headright{margin-left:auto}
  .nj-main{flex-direction:column}
  .nj-skywrap{height:62vh;min-height:480px;flex:none}
  .nj-panel{width:auto;border-left:0;border-top:1px solid var(--line);min-height:280px}
  .nj-chapters{max-height:280px}
}

@media (max-width: 640px){
  .nj{min-height:calc(100vh - 56px)}
  .nj-head{padding:22px 18px 0}
  .nj-pills{padding:14px 18px 12px;gap:7px;overflow-x:auto;flex-wrap:nowrap}
  .nj-pill{white-space:nowrap;padding:7px 12px;font-size:10px}
  .nj-title{font-size:30px}
  .nj-titlerow{gap:14px}
  .nj-headright{width:100%;justify-content:space-between}
  .nj-skywrap{height:58vh;min-height:420px}
  .nj-hint{left:18px;right:72px;line-height:1.5}
  .nj-scrub{bottom:12px;width:min(94vw,520px)}
  .nj-scrubbar{gap:7px;padding:7px 10px;max-width:100%;overflow-x:auto;border-radius:18px}
  .nj-dots{gap:2px}
  .nj-dot{width:11px;height:11px;flex:0 0 auto}
  .nj-zoom{right:12px;bottom:72px}
  .nj-panel{padding:24px 20px}
}
