.extra-page {
  min-height:100vh;
  padding-top:78px;
  background:
    radial-gradient(circle at 15% 10%,rgba(166,82,255,.13),transparent 32%),
    #070707;
}

.extra-hero {
  padding:90px 7% 55px;
}

.extra-hero h1 {
  margin:12px 0;
  font-size:clamp(52px,8vw,98px);
  line-height:.92;
  letter-spacing:-6px;
}

.extra-hero h1 span {
  display:block;
  color:transparent;
  background:linear-gradient(90deg,#fff,#c985ff,#ffb632);
  -webkit-background-clip:text;
  background-clip:text;
}

.extra-hero p {
  max-width:650px;
  color:#888;
  line-height:1.7;
}

.extra-content {
  padding:0 7% 95px;
}

.extra-card-list {
  display:grid;
  gap:16px;
}

.extra-card {
  padding:28px;
  border:1px solid var(--border);
  border-radius:22px;
  background:#101010;
}

.loading-card,
.empty-extra {
  min-height:240px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  color:#777;
}

.extra-icon {
  margin-bottom:12px;
  font-size:48px;
}

.extra-card h2 {
  margin:5px 0 9px;
  font-size:clamp(25px,4vw,38px);
  letter-spacing:-2px;
}

.extra-card p {
  color:#888;
  line-height:1.65;
}

.winner-card {
  display:grid;
  grid-template-columns:250px 1fr;
  gap:30px;
  align-items:center;
}

.winner-number {
  min-height:190px;
  display:grid;
  place-items:center;
  align-content:center;
  border:1px solid rgba(166,82,255,.25);
  border-radius:18px;
  background:
    radial-gradient(circle,rgba(166,82,255,.16),transparent 65%),
    #090909;
}

.winner-number span {
  color:#8e8e8e;
  font-size:9px;
  font-weight:900;
  letter-spacing:1.3px;
}

.winner-number strong {
  margin-top:7px;
  font-size:clamp(36px,6vw,63px);
  letter-spacing:-3px;
}

.winner-prize {
  color:#ddd!important;
  font-weight:800;
}

.winner-person {
  margin:18px 0;
  padding:13px;
  border:1px solid var(--border);
  border-radius:12px;
  background:#080808;
}

.winner-person span,
.history-stats span {
  display:block;
  color:#777;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:1px;
}

.winner-person strong,
.history-stats strong {
  display:block;
  margin-top:4px;
}

.extra-muted {
  font-size:11px;
}

.history-top {
  display:flex;
  justify-content:space-between;
  gap:20px;
}

.history-mode {
  height:max-content;
  padding:7px 10px;
  border-radius:999px;
  background:#1b1b1b;
  color:#bbb;
  font-size:9px;
  font-weight:900;
}

.history-stats {
  margin-top:22px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
}

.history-stats>div {
  padding:13px;
  border:1px solid var(--border);
  border-radius:12px;
  background:#090909;
}

.history-progress {
  height:8px;
  margin-top:17px;
  overflow:hidden;
  border-radius:999px;
  background:#232323;
}

.history-progress div {
  height:100%;
  background:linear-gradient(90deg,#9951ff,#d891ff);
}

.history-actions {
  margin-top:16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  color:#888;
  font-size:12px;
}

.legal-copy {
  display:grid;
  gap:14px;
}

.legal-copy .extra-card {
  max-width:980px;
}

.legal-copy .extra-card h2 {
  font-size:23px;
}

.legal-note {
  max-width:980px;
  padding:17px;
  border:1px solid rgba(255,182,50,.18);
  border-radius:13px;
  background:rgba(255,182,50,.06);
  color:#b7a783;
  font-size:11px;
  line-height:1.6;
}

@media(max-width:760px){
  .extra-page{padding-top:68px;}
  .extra-hero{padding:70px 5% 45px;}
  .extra-hero h1{letter-spacing:-4px;}
  .extra-content{padding:0 5% 75px;}
  .winner-card{grid-template-columns:1fr;}
  .winner-number{min-height:150px;}
  .history-top{flex-direction:column;}
  .history-stats{grid-template-columns:1fr;}
  .history-actions{align-items:flex-start;flex-direction:column;}
}