/* ═══════════════════════════════════════════
   ВХОД
   ═══════════════════════════════════════════ */
.lg-card{
  background:var(--panel);border:1px solid var(--border);
  border-radius:16px;padding:34px 28px;backdrop-filter:blur(12px);
  text-align:center;
}
.lg-rune-img{
  height:38px;width:auto;margin:0 auto 10px;display:block;
  filter:drop-shadow(0 0 14px rgba(160,100,220,0.6));
}
.lg-title{
  font-family:'Cinzel',serif;font-size:24px;letter-spacing:3px;
  color:var(--gold-soft);margin-bottom:16px;
}
.lg-lead{font-size:14.5px;line-height:1.65;color:var(--text-dim);margin-bottom:20px}

.lg-card label{
  display:block;text-align:left;
  font-family:'Cinzel',serif;font-size:10px;letter-spacing:1.8px;
  text-transform:uppercase;color:var(--gold);margin-bottom:7px;
}
.lg-card input{
  width:100%;padding:13px 14px;margin-bottom:16px;
  background:rgba(5,3,8,0.55);color:var(--text);
  border:1px solid var(--border);border-radius:8px;
  font-family:'EB Garamond',Georgia,serif;font-size:16px;
  transition:border-color .3s;
}
.lg-card input:focus{outline:none;border-color:rgba(160,100,220,0.55)}
.lg-code{
  text-align:center;letter-spacing:11px;font-size:24px !important;
  font-family:'Cinzel',serif !important;
}
.lg-card .btn{width:100%;margin-top:0}

.lg-back{
  display:block;width:100%;margin-top:14px;padding:8px;cursor:pointer;
  background:none;border:none;color:var(--text-dim);
  font-family:'EB Garamond',serif;font-size:13.5px;
  text-decoration:underline;text-underline-offset:3px;
  transition:color .25s;
}
.lg-back:hover{color:var(--gold)}

.lg-resend{
  display:block;width:100%;margin-top:10px;padding:8px;cursor:pointer;
  background:none;border:none;color:var(--text-dim);
  font-family:'EB Garamond',serif;font-size:13.5px;
  text-decoration:underline;text-underline-offset:3px;
  transition:color .25s;
}
.lg-resend:hover:not(:disabled){color:var(--gold)}
.lg-resend:disabled{cursor:default;opacity:.55;text-decoration:none}

.lg-msg{margin-top:14px;font-size:13.5px;min-height:18px}
.lg-msg.ok{color:rgba(140,200,150,0.85)}
.lg-msg.bad{color:#e59595}

.lg-wait-note{
  margin-top:14px;font-size:13px;color:rgba(212,175,55,0.75);
  text-align:center;line-height:1.6;
}

#pending-reading{margin:18px 0}

.lg-spinner-rune{
  display:block;height:36px;width:auto;margin:0 auto 14px;
  filter:drop-shadow(0 0 14px rgba(160,100,220,0.6));
  animation:lgSpin 2.4s linear infinite;
}
@keyframes lgSpin{ from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
.lg-pending-status{font-size:14px;color:var(--text-dim);text-align:center;margin-top:14px}
.lg-pending-status.bad{color:#e59595}
.lg-pending-result{
  text-align:left;padding:24px 26px;margin-bottom:6px;
  background:rgba(160,100,220,0.06);border:1px solid rgba(212,175,55,0.18);
  border-radius:12px;font-size:16.5px;line-height:1.8;color:var(--text);
}
.lg-pending-interp{margin:0 0 16px}
.lg-pending-advice{
  margin:0;padding-top:16px;border-top:1px solid rgba(212,175,55,0.16);
  color:var(--gold-soft);font-style:italic;font-size:15.5px;
}

/* контейнер расширяется только когда показан ответ оракула —
   форма входа/кода остаётся узкой и компактной */
#lgContainer.lg-wide{max-width:640px !important;transition:max-width .3s ease}

.stone-packs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.stone-pack{
  display:flex;flex-direction:column;align-items:center;gap:6px;
  padding:16px 10px;cursor:pointer;
  background:rgba(160,100,220,0.06);border:1px solid rgba(212,175,55,0.18);
  border-radius:10px;transition:border-color .25s,background .25s;
  font-family:'EB Garamond',serif;
}
.stone-pack:hover:not(:disabled){border-color:rgba(212,175,55,0.45);background:rgba(160,100,220,0.1)}
.stone-pack:disabled{opacity:.5;cursor:default}
.stone-pack-name{font-family:'Cinzel',serif;font-size:12px;letter-spacing:1px;color:var(--gold-soft)}
.stone-pack-amount{font-size:13px;color:var(--text-dim)}
.stone-pack-price{font-family:'Cinzel',serif;font-size:16px;color:var(--gold)}

@media (max-width:760px){
  /* четыре пакета в ряд тесны на планшете — ломаем на две колонки */
  .stone-packs{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:480px){
  .stone-packs{grid-template-columns:1fr}
}
@media (max-width:700px){
  #lgContainer.lg-wide{max-width:94vw !important}
}

.lg-note{
  margin-top:20px;text-align:center;
  font-size:12px;line-height:1.6;color:rgba(200,185,154,0.4);
}
.lg-note a{color:rgba(200,185,154,0.6)}