.archive-design-page:has(.robux-reference) { background:#e3e3e3; }
.robux-reference { max-width:970px; margin:0 auto; }
.robux-reference-header { display:flex; align-items:center; justify-content:space-between; margin:0 0 12px; }
.robux-reference-header h1 { margin:0; font-size:28px; font-weight:400; }
.robux-reference-header h1 sup { font-size:12px; }
.robux-reference-header img { width:115px; height:auto; }
.robux-reference-layout { display:grid; grid-template-columns:300px minmax(0,1fr); gap:39px; align-items:start; }
.robux-promo { height:332px; position:relative; padding:15px; background:#191919 url('/static/img/robux-archive-background.png') center top/300px auto no-repeat; border-radius:30px 0 30px 0; color:#fff; }
.robux-promo > img { position:absolute; width:180px; height:auto; top:-12px; right:-12px; }
.robux-promo-symbol { position:absolute; left:24px; top:26px; display:flex; align-items:center; justify-content:center; width:74px; height:74px; border:5px solid white; border-radius:50%; font-size:30px; font-weight:700; }
.robux-promo p { position:absolute; bottom:14px; left:15px; right:15px; margin:0; line-height:1.45; }
.robux-packages { min-width:0; }
.robux-unavailable { margin:0 0 8px; color:#757575; font-size:13px; }
.robux-pack-group h2 { margin:0 0 4px; font-size:23px; font-weight:300; }
.robux-pack { min-height:92px; background:white; display:flex; justify-content:space-between; align-items:flex-start; gap:15px; padding:12px 13px; margin-bottom:16px; }
.robux-amount { color:#00b55a; font-size:32px; line-height:38px; white-space:nowrap; }
.robux-amount span { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; margin-right:4px; border:2px solid #00b55a; border-radius:50%; font-size:14px; font-weight:700; vertical-align:3px; }
.robux-pack-action { position:relative; flex:0 1 300px; text-align:right; }
.robux-pack-action button { display:block; width:240px; max-width:100%; height:38px; margin-left:auto; border:0; border-radius:3px; background:#00b45c; color:white; font-size:16px; opacity:.7; cursor:not-allowed; }
.robux-membership { color:#aaa; margin-top:8px; font-size:13px; }.robux-membership a { color:#00a2ff; }
.robux-discount { position:absolute; top:0; right:220px; width:42px; height:42px; padding-top:5px; border-radius:50%; background:#e2231a; color:#fff; text-align:center; font-size:13px; line-height:13px; }
.robux-discount small { display:block; font-size:10px; }
@media(max-width:900px) { .robux-reference-layout { grid-template-columns:minmax(0,1fr); gap:20px; } .robux-promo { display:none; } }
@media(max-width:520px) { .robux-pack { flex-wrap:wrap; } .robux-pack-action { flex:1 1 100%; } .robux-pack-action button { width:100%; } .robux-discount { right:auto; left:-5px; } }
