.starter-handoff-panel{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);
  gap:1.5rem;
  margin-bottom:1.25rem;
  padding:1.65rem;
  border-top:6px solid var(--starter-faction-color,#8f1f25);
  background:linear-gradient(135deg,#fffdf7,#f2e8d7);
  box-shadow:0 18px 38px rgba(45,33,22,.12)
}
.starter-handoff-panel>*{position:relative;z-index:1}
.starter-handoff-panel::after{
  content:"";
  position:absolute;
  z-index:0;
  left:36%;
  bottom:-11rem;
  width:min(42vw,520px);
  aspect-ratio:1;
  transform:translateX(-50%);
  background:var(--starter-faction-color,#8f1f25);
  -webkit-mask:var(--starter-faction-symbol) center/contain no-repeat;
  mask:var(--starter-faction-symbol) center/contain no-repeat;
  opacity:.085;
  pointer-events:none
}

/* Use the same typography roles as the rest of the Deckbuilder. The previous
 * heading referenced an obsolete --font-display token and fell back to Georgia,
 * while the adjacent link inherited the reading face. */
.starter-handoff-copy h2{
  margin:.15rem 0 .65rem;
  font-family:var(--historical);
  font-size:clamp(2rem,3vw,2.85rem);
  font-weight:400;
  line-height:1.02;
  letter-spacing:0
}
.starter-handoff-copy>p{
  max-width:760px;
  font-family:var(--reading);
  line-height:1.55
}
.starter-handoff-copy .is-success{
  color:var(--starter-faction-color,#236946);
  font-weight:600
}
.starter-handoff-copy .is-error{
  color:#9b2228;
  font-weight:700
}
.starter-handoff-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.7rem;
  margin-top:1.15rem
}
.starter-handoff-actions .button-like{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.75rem 1rem;
  border:1px solid #8f1f25;
  color:#8f1f25;
  background:#fff;
  font-family:var(--sans);
  font-weight:750;
  text-decoration:none
}
.starter-handoff-checklist{
  padding:1rem 1.1rem;
  background:#24211d;
  color:#fff8ed
}
.starter-handoff-checklist>strong{
  display:block;
  margin-bottom:.7rem;
  font-size:1.05rem
}
.starter-handoff-checklist label{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:.55rem;
  align-items:start;
  padding:.7rem;
  background:rgba(255,255,255,.07);
  line-height:1.4
}
.starter-handoff-checklist input{
  margin-top:.2rem;
  accent-color:#d8b75f
}
.starter-handoff-checklist ol{
  margin:.85rem 0 0;
  padding-left:1.25rem;
  color:#ded5c9
}
.starter-handoff-checklist li{
  margin:.4rem 0;
  line-height:1.4
}
.starter-handoff-panel.is-ready{border-top-color:var(--starter-faction-color,#8f1f25)}
.starter-handoff-panel.has-error{border-top-color:#a3272e}

@media(max-width:800px){
  .starter-handoff-panel{grid-template-columns:1fr}
  .starter-handoff-panel::after{
    left:auto;
    right:-8rem;
    bottom:-10rem;
    width:430px;
    transform:none
  }
}
@media print{
  .starter-handoff-panel{display:none!important}
}
