:root{
  --classic-orange: #ff6a00;
  --classic-amber:  #ffb155;
  --classic-deep:   #0b0b0b;
  --classic-bronze: #c06a1d;
}
.bg-classic{
  position: relative;
  display: block;
  padding: .6rem .9rem;
  margin: .5rem 0;
  border-radius: 12px;
  color: #eee;
  line-height: 1.55;
  background:
    radial-gradient(120% 90% at 10% 0%, rgba(255,168,72,.25), rgba(0,0,0,0) 60%),
    linear-gradient(180deg, rgba(255,121,32,.14), rgba(0,0,0,.52)),
    var(--classic-deep);
  border: 1px solid rgba(255,115,20,.32);
  box-shadow:
    inset 0 0 0.5px rgba(255,255,255,.12),
    0 6px 18px rgba(0,0,0,.45),
    0 0 16px rgba(255,106,0,.08);
  text-shadow: 0 1px 0 rgba(0,0,0,.35);
  overflow: hidden;
  animation: classicGlow 4.5s ease-in-out infinite;
}
@keyframes classicGlow{
  0%{   box-shadow: inset 0 0 .5px rgba(255,255,255,.12), 0 6px 18px rgba(0,0,0,.45), 0 0 12px rgba(255,106,0,.10);}
  50%{  box-shadow: inset 0 0 .5px rgba(255,255,255,.12), 0 6px 18px rgba(0,0,0,.45), 0 0 22px rgba(255,106,0,.18);}
  100%{ box-shadow: inset 0 0 .5px rgba(255,255,255,.12), 0 6px 18px rgba(0,0,0,.45), 0 0 12px rgba(255,106,0,.10);}
}
.bg-classic.is-title{ border-left: 6px solid var(--classic-bronze); padding-left: .8rem; }
.bg-classic:hover{ transform: translateY(-1px); transition: transform .18s ease, box-shadow .18s ease; box-shadow: inset 0 0 .5px rgba(255,255,255,.12), 0 10px 22px rgba(0,0,0,.55), 0 0 26px rgba(255,106,0,.22); }
li.bg-classic{ list-style:none; padding-left:1.2rem;}
li.bg-classic::before{ content:"◆"; color:var(--classic-amber); margin-right:.5rem; text-shadow:0 0 6px rgba(255,177,85,.65);}
.bg-classic a{ color:#ffd9a1; text-decoration:none; border-bottom:1px dashed rgba(255,177,85,.6);}
.bg-classic a:hover{ color:#fff0c9; border-bottom-color:rgba(255,177,85,1);}
.classic-stack > * + *{ margin-top:.6rem; }