/* MGEE 2026 Official Stage artwork — STAFF PAGES ONLY.
   No admin styling, event pass artwork, data, JS or D1 changes.
   Approved official stage background for the staff portal; pre-launch deployment. */
.staff-shell {
  isolation: isolate;
  background: linear-gradient(180deg, #250611 0%, #4b081f 55%, #20050e 100%);
  color: #fff7e5;
}
.staff-shell::before {
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:0;
  left:0;
  right:0;
  top:0;
  height: min(60vw, 680px);
  min-height: 480px;
  background:
    linear-gradient(180deg,rgba(26,0,12,.28) 0%,rgba(29,3,15,0) 27%,rgba(45,5,20,0) 65%,#350919 100%),
    url('official-mgee-stage.webp') center 13px / cover no-repeat;
  opacity:1;
}
.staff-shell::after {
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(22,2,12,.20),transparent 32%,transparent 68%,rgba(22,2,12,.20));
}
.staff-shell .topbar {
  max-width:1280px;
  background:linear-gradient(180deg,rgba(28,4,16,.92),rgba(28,4,16,.40));
  border-radius: 0 0 16px 16px;
}
.staff-shell .staff-main {
  max-width:1200px;
  grid-template-columns: minmax(0, 1fr) minmax(340px,455px);
  gap:35px;
  align-items:end;
  margin: min(35vw, 400px) auto 0;
  padding: 0 30px 46px;
}
.staff-shell .splash-copy {
  background:linear-gradient(115deg,rgba(37,2,18,.90),rgba(57,7,27,.72));
  border:1px solid rgba(241,195,102,.50);
  border-left:4px solid #edbb58;
  border-radius:18px;
  box-shadow:0 16px 35px rgba(17,0,9,.30);
  padding:21px 26px 23px;
  backdrop-filter:blur(5px);
  max-width:535px;
}
.staff-shell .splash-copy h1 {font-size:clamp(2.6rem,4.9vw,4.4rem);margin:10px 0;}
.staff-shell .splash-copy .desc {font-size:1rem;color:#ffe6dd;}
.staff-shell .splash-copy .decor {margin:12px 0;}
.staff-shell .hero-trust {color:#ffe5bf;}
.staff-shell .entry-card {
  background:rgba(255,251,244,.98);
  border-color:#dfb968;
  box-shadow:0 20px 55px rgba(11,0,9,.48),0 0 0 1px rgba(255,206,125,.25);
}
.staff-shell .step-note {color:#a6752a;}
.staff-shell .entry-card h2 {color:#56142a;}
.staff-shell .primary-btn {background:linear-gradient(115deg,#7e1539,#aa2544);}
.staff-shell .staff-footer {max-width:1200px;color:#f0d4c2;}
@media (max-width:750px) {
  .staff-shell::before {
    top:53px;
    height: min(54vw, 240px);
    min-height: 0;
    background:
      linear-gradient(180deg,rgba(30,2,13,.04) 0%,rgba(32,4,14,0) 66%,#360919 100%),
      url('official-mgee-stage.webp') center top / contain no-repeat;
  }
  .staff-shell .topbar {padding:11px 16px;background:rgba(33,3,16,.96);border-radius:0;}
  .staff-shell .staff-main {display:flex;flex-direction:column;gap:15px;margin: min(53vw, 255px) auto 0;padding:0 14px 20px;align-items:stretch;}
  .staff-shell .splash-copy {
    width:100%;max-width:430px;margin:0 auto;
    background:rgba(43,5,23,.93);
    padding:12px 16px;
    border-radius:12px;
    text-align:center;
    border-left:1px solid #c99855;
  }
  .staff-shell .splash-copy h1 {font-size:2.2rem;line-height:1;margin:7px 0;}
  .staff-shell .splash-copy .eyebrow {font-size:.66rem;}
  .staff-shell .splash-copy .desc {font-size:.78rem;margin:4px auto;}
  .staff-shell .splash-copy .hero-trust {display:none;}
  .staff-shell .entry-card {max-width:430px;margin:auto;}
  .staff-shell .staff-footer{background:#230611;}
}
@media (max-width:400px) {
 .staff-shell .staff-main {margin-top:52vw;}
 .staff-shell .splash-copy h1 {font-size:2rem;}
}
@media print {
 .staff-shell::before,.staff-shell::after {display:none!important;}
 .staff-shell .staff-main {margin:0 auto!important;padding:0!important;}
}