/* =============================================================================
   Ashfall — nền dùng chung cho mọi trang
   Nạp TRƯỚC khối <style> của từng trang, để trang tự ghi đè phần riêng.
   map.html, blog-post-4.html và 404.html có bộ màu riêng — chúng tự định nghĩa
   lại :root sau file này nên vẫn giữ nguyên giao diện cũ.
   ============================================================================= */

:root{
  --bg:#100d0a;
  --bg-plate:#1a1510;
  --bg-plate-2:#221b14;
  --ink:#efe6d4;
  --muted:#a99a82;
  --muted-2:#75695a;
  --line:rgba(239,230,212,0.14);
  --line-strong:rgba(239,230,212,0.30);
  --ember:#ff9d47;
  --ember-dim:#c97a38;
  --crack:#cf4b3e;
  --moss:#8fa87f;
  --font-display:'Spectral', Georgia, 'Times New Roman', serif;
  --font-body:'Be Vietnam Pro', -apple-system, 'Segoe UI', sans-serif;
  --font-mono:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }
html,body{ margin:0; padding:0; }

a{ color:var(--ember); text-decoration:none; }
a:hover{ text-decoration:underline; }
:focus-visible{ outline:2px solid var(--ember); outline-offset:3px; border-radius:2px; }
::selection{ background:var(--ember); color:#1a1208; }

/* ------------------------------------------------- thanh điều hướng chung --- */
nav{
  position:fixed;
  top:0; left:0; right:0;
  z-index:1000;
  background:rgba(16,13,10,0.95);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
nav .nav-content{
  max-width:900px;
  margin:0 auto;
  padding:14px 26px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
}
nav .logo{
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.4rem;
  color:var(--ember);
  text-decoration:none;
  display:flex;
  align-items:center;
  gap:8px;
}
nav .logo img{ height:35px; width:auto; }
nav .nav-links{ display:flex; gap:22px; list-style:none; margin:0; padding:0; }
nav .nav-links a{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
  transition:color .2s ease;
}
nav .nav-links a:hover{ color:var(--ember); text-decoration:none; }
nav .nav-links a.active{ color:var(--ember); }

@media (max-width:620px){
  nav .nav-links{ overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; gap:12px; }
  nav .nav-links::-webkit-scrollbar{ display:none; }
  nav .nav-links li{ flex:0 0 auto; }
  nav .nav-links a{ font-size:10px; white-space:nowrap; }
  nav .nav-content{ gap:12px; }
}

/* --------------------------------- mục tài khoản do auth.js gắn vào nav --- */
nav .nav-links a.nav-account{ color:var(--ember); font-weight:700; }