/* ============ Nexaria — VERSÃO E CHANGELOG ============
 * Faixa de versão no modal de boas-vindas, link no rodapé da tela inicial
 * e modal do histórico completo de versões. */

/* ---- Faixa de versão no modal de boas-vindas ---- */
/* A faixa deixa o modal mais alto: garante rolagem em telas baixas. */
.welcome-modal { max-height:92vh; overflow-y:auto; }
.welcome-version { display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap;
  padding:12px 28px; border-top:1px solid #2a2f3a; border-bottom:1px solid #2a2f3a; background:#05070c66; }
.wv-tag { font-family:'Cinzel',serif; font-size:12px; letter-spacing:2px; color:#8f9ab5; text-transform:uppercase; }
.wv-tag b { color:var(--gold-hi); font-size:14px; letter-spacing:1px; }
.wv-link { background:none; border:1px solid #4a4234; border-radius:6px; padding:6px 14px; color:#d8c79a;
  font-size:12px; letter-spacing:1.5px; transition:.15s; }
.wv-link:hover { border-color:var(--gold); color:var(--gold-hi); background:#c8aa5a14; }

/* ---- Link de versão no rodapé da tela inicial ---- */
.foot-sep { opacity:.5; margin:0 8px; }
.foot-link { background:none; border:none; color:#8fa0c0; font-size:12px; letter-spacing:1px;
  text-decoration:underline; text-underline-offset:3px; padding:0; font-family:inherit; }
.foot-link:hover { color:var(--gold-hi); }

/* ---- Modal do changelog ---- */
.cl-overlay { position:fixed; inset:0; z-index:260; display:flex; align-items:center; justify-content:center;
  padding:20px; background:#000c; backdrop-filter:blur(6px); animation:clFade .25s ease; }
@keyframes clFade { from { opacity:0 } to { opacity:1 } }
.cl-modal { width:min(940px,96vw); height:min(760px,92vh); display:flex; flex-direction:column;
  background:linear-gradient(#0b0e15fa,#0d1118fc); border:2px solid var(--gold-dk); border-radius:14px;
  box-shadow:0 0 0 4px #00000055, 0 30px 80px #000d; overflow:hidden; animation:clSlide .3s cubic-bezier(.16,1,.3,1); }
@keyframes clSlide { from { transform:translateY(24px) scale(.98); opacity:0 } to { transform:none; opacity:1 } }

.cl-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px;
  padding:20px 24px 16px; border-bottom:1px solid #2a2f3a; background:#05070c55; }
.cl-head h2 { font-family:'Cinzel',serif; font-size:22px; font-weight:900; letter-spacing:3px; color:var(--gold-hi);
  text-shadow:0 0 18px #c8a02c44, 0 2px 0 #5a4310; }
.cl-head-sub { font-size:12.5px; color:#8f9ab5; margin-top:4px; }
.cl-head-sub b { color:var(--gold); }
.cl-x { background:none; border:1px solid #3a4152; border-radius:6px; width:32px; height:32px; flex:none;
  color:#b9c8e8; font-size:14px; line-height:1; transition:.15s; }
.cl-x:hover { border-color:var(--gold); color:var(--gold-hi); background:#c8aa5a14; }

.cl-body { flex:1; display:flex; min-height:0; }

/* Navegação lateral por versão */
.cl-nav { width:210px; flex:none; overflow-y:auto; padding:12px 10px; border-right:1px solid #2a2f3a; background:#05070c44; }
.cl-nav-item { display:block; width:100%; text-align:left; background:none; border:1px solid transparent;
  border-radius:7px; padding:8px 10px; margin-bottom:4px; color:#b9c8e8; transition:.15s; }
.cl-nav-item:hover { background:#c8aa5a10; border-color:#4a4234; }
.cl-nav-item.active { background:#c8aa5a1c; border-color:var(--gold-dk); }
.cl-nav-num { display:block; font-family:'Cinzel',serif; font-size:14px; letter-spacing:1px; color:var(--gold-hi); }
.cl-nav-item.active .cl-nav-num { color:var(--gold-hi); text-shadow:0 0 12px #c8a02c66; }
.cl-nav-title { display:-webkit-box; font-family:'Spectral',Georgia,serif; font-size:11px; line-height:1.35;
  color:#7b869f; margin-top:2px; overflow:hidden; -webkit-line-clamp:2; -webkit-box-orient:vertical; }

/* Conteúdo das versões */
.cl-content { flex:1; overflow-y:auto; padding:22px 26px 40px; scroll-behavior:smooth; }
.cl-empty { color:#8f9ab5; font-size:13px; }
.cl-version { padding-bottom:26px; margin-bottom:26px; border-bottom:1px solid #1e2330; }
.cl-version:last-child { border-bottom:none; margin-bottom:0; }
.cl-version-head { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.cl-num { font-family:'Cinzel',serif; font-size:26px; font-weight:900; letter-spacing:2px; color:var(--gold-hi);
  text-shadow:0 2px 0 #5a4310, 0 6px 16px #000; }
.cl-version.is-current .cl-num { text-shadow:0 0 22px #c8a02c77, 0 2px 0 #5a4310; }
.cl-badge { font-family:'Cinzel',serif; font-size:10px; letter-spacing:2px; text-transform:uppercase;
  color:#2a1c05; background:linear-gradient(#f0d48a,#c8a02c); border-radius:20px; padding:3px 10px; }
.cl-date { font-size:11.5px; color:#6b7690; letter-spacing:1px; margin-left:auto; }
.cl-version-title { font-family:'Cinzel',serif; font-size:16px; font-weight:700; color:var(--gold);
  margin:8px 0 6px; line-height:1.4; }
.cl-summary { font-size:13.5px; line-height:1.65; color:#c9c0a8; font-style:italic; }
.cl-note { font-size:12.5px; line-height:1.6; color:#c2b48c; background:#c8aa5a12; border-left:3px solid var(--gold-dk);
  border-radius:0 6px 6px 0; padding:9px 12px; margin-top:10px; }

.cl-highlights { margin-top:14px; background:#05070c88; border:1px solid #2a2f3a; border-radius:8px; padding:12px 14px; }
.cl-highlights-t { font-family:'Cinzel',serif; font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--gold); }
.cl-high-list { list-style:none; margin-top:8px; display:grid; grid-template-columns:1fr 1fr; gap:6px 16px; }
.cl-high-list li { font-size:12.5px; line-height:1.5; color:#d8cfb8; padding-left:16px; position:relative; }
.cl-high-list li::before { content:'✦'; position:absolute; left:0; top:0; color:var(--gold); font-size:11px; }

.cl-section { margin-top:16px; }
.cl-section h4 { font-family:'Cinzel',serif; font-size:13px; letter-spacing:1.5px; color:#b9c8e8;
  padding-bottom:5px; border-bottom:1px solid #232936; }
.cl-items { list-style:none; margin-top:8px; }
.cl-items li { font-size:13px; line-height:1.6; color:#a9b2c4; padding:2px 0 2px 16px; position:relative; }
.cl-items li::before { content:'•'; position:absolute; left:2px; color:#5d677d; }
.cl-items b, .cl-summary b, .cl-note b, .cl-high-list b { color:var(--gold-hi); font-weight:700; }

.cl-foot { display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:12px 24px; border-top:1px solid #2a2f3a; background:#05070c55; }
.cl-foot-note { font-size:11.5px; color:#6b7690; }
.cl-foot button { padding:9px 22px; font-size:12px; letter-spacing:2px; }

/* ---- Telas estreitas ---- */
@media (max-width:760px) {
  .cl-overlay { padding:0; }
  .cl-modal { width:100vw; height:100vh; border-radius:0; border-width:0 0 2px; }
  .cl-body { flex-direction:column; }
  .cl-nav { width:auto; display:flex; gap:6px; overflow-x:auto; overflow-y:hidden; padding:8px 10px;
    border-right:none; border-bottom:1px solid #2a2f3a; }
  .cl-nav-item { width:auto; flex:none; margin-bottom:0; padding:6px 12px; }
  .cl-nav-title { display:none; }
  .cl-content { padding:16px 16px 32px; }
  .cl-num { font-size:22px; }
  .cl-date { margin-left:0; width:100%; }
  .cl-high-list { grid-template-columns:1fr; }
  .cl-foot-note { display:none; }
}