.graphics-refresh{position:relative;isolation:isolate;overflow:hidden;padding:clamp(22px,4vw,46px);border:1px solid #50664f;border-radius:22px;background:radial-gradient(ellipse at 86% 0,#d7b65d19,transparent 32rem),linear-gradient(145deg,#17221a,#101612 72%);box-shadow:0 24px 70px #0003}
.graphics-refresh::before{position:absolute;inset:-2px;z-index:-1;content:"";pointer-events:none;background:radial-gradient(ellipse at 10% 45%,#64e5dc12,transparent 38%)}
.graphics-refresh-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:24px}
.graphics-refresh-heading>div{max-width:70ch}
.graphics-refresh-heading h2{margin:.35rem 0 .65rem;color:#f0dc9e;font:400 clamp(32px,5vw,54px)/1.05 Georgia,serif;letter-spacing:-.035em}
.graphics-refresh-heading p,.graphics-card-copy p,.spotlight-caption p{color:#c3cec1;line-height:1.7}
.graphics-refresh-heading .btn{flex:none;margin-bottom:4px}
.graphics-spotlight{position:relative;min-height:clamp(245px,39vw,490px);overflow:hidden;border:1px solid #d5c17f66;border-radius:18px;background:#0b100d}
.graphics-spotlight>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 58%;opacity:.88;transition:transform .6s cubic-bezier(.2,.7,.2,1),opacity .3s ease}
.graphics-spotlight:hover>img{transform:scale(1.018);opacity:1}
.spotlight-caption{position:absolute;inset:auto 0 0;padding:clamp(20px,4vw,40px);background:linear-gradient(0deg,#090d0cf2,#090d0cb8 65%,transparent)}
.spotlight-caption h3{max-width:18ch;margin:.35rem 0;color:#fff9e9;font:400 clamp(26px,4vw,43px)/1.08 Georgia,serif}
.spotlight-caption p{max-width:58ch;margin:.45rem 0 14px}
.graphics-tags{display:flex;flex-wrap:wrap;gap:8px}
.graphics-tags span{padding:6px 10px;border:1px solid #d5c17f60;border-radius:99px;background:#0a100d99;color:#f1d98e;font-size:11px;letter-spacing:.045em}
.graphics-controls{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0 14px}
.graphics-filter{min-height:42px;padding:9px 14px;border:1px solid #50664f;border-radius:99px;background:#111a14;color:#d8e1d4;font:600 12px/1.2 system-ui,sans-serif;cursor:pointer;transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease}
.graphics-filter:hover{transform:translateY(-1px);border-color:#dfc276;color:#f4db92}
.graphics-filter.is-active{border-color:#dfc276;background:linear-gradient(115deg,#dfc276,#f0d889);color:#111710;box-shadow:0 8px 22px #dfc27622}
.graphics-filter:focus-visible{outline:3px solid #66e5dc;outline-offset:3px}
.graphics-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:stretch}
.graphics-card{min-width:0;padding:clamp(16px,2.4vw,26px);border:1px solid #405347;border-radius:16px;background:linear-gradient(145deg,#1b2820,#131b16 72%);transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.graphics-card:hover{transform:translateY(-3px);border-color:#9e9562;box-shadow:0 18px 42px #0004}
.graphics-card-wide{grid-column:1/-1}
.graphics-card-copy .eyebrow,.spotlight-caption .eyebrow{color:#70e1d8}
.graphics-card-copy h3{margin:.35rem 0 .45rem;color:#f0d993;font:400 clamp(23px,3vw,31px)/1.12 Georgia,serif}
.graphics-card-copy p{margin:.35rem 0 1rem;font-size:14px}
.overlay-previews{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:12px;margin-top:16px}
.overlay-previews figure{display:grid;grid-template-rows:1fr auto;min-width:0;margin:0;padding:10px;border:1px solid #d9e2dd25;border-radius:11px;background:radial-gradient(ellipse at 50% 20%,#d7b65d14,transparent 70%),#0d1511}
.overlay-previews img{display:block;width:100%;max-height:170px;object-fit:contain}
.overlay-previews figure:last-child img{min-height:72px}
.overlay-previews figcaption{padding:8px 2px 1px;color:#bdcabb;font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.panel-previews{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:16px}
.panel-previews img{display:block;width:100%;height:auto;filter:drop-shadow(0 5px 8px #0006);transition:transform .18s ease}
.panel-previews img:hover{transform:translateX(3px)}
.icon-previews{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:17px}
.icon-previews img{display:block;width:100%;max-width:66px;aspect-ratio:1;justify-self:center;object-fit:contain;border:1px solid #d2b95842;border-radius:14px;background:radial-gradient(circle at 50% 30%,#ffdf5430,transparent 70%),#0e1511;box-shadow:0 8px 18px #0003}
.social-previews{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:11px;margin-top:17px}
.social-previews img{display:block;width:min(100%,66px);aspect-ratio:1;justify-self:center;object-fit:contain;filter:drop-shadow(0 6px 7px #0007);transition:transform .2s ease,filter .2s ease}
.social-previews img:hover{transform:translateY(-3px) scale(1.06);filter:drop-shadow(0 9px 10px #0008)}
.graphics-card:has(.royale-preview){display:grid;grid-template-columns:minmax(0,1.35fr) minmax(220px,.65fr);align-items:center;gap:clamp(18px,3vw,34px)}
.royale-preview{overflow:hidden;border:1px solid #e2b73370;border-radius:12px;background:#111}
.royale-preview img{display:block;width:100%;height:auto;transition:transform .5s ease}
.graphics-card:has(.royale-preview):hover .royale-preview img{transform:scale(1.025)}
.graphics-card-copy .text-link,.graphics-credit a{color:#77e5dc;font-weight:700}
.package-overview,.event-banner,.profile-grid figure,.screen-grid figure{min-width:0;margin:0;overflow:hidden;border:1px solid #d9e2dd25;border-radius:12px;background:#0d1511}
.package-overview img,.event-banner img{display:block;width:100%;height:auto}
.package-overview figcaption,.event-banner figcaption,.profile-grid figcaption,.screen-grid figcaption{padding:9px 12px;color:#c2cdbf;font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.package-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:center}
.package-details>img{display:block;width:100%;height:auto;max-height:120px;object-fit:contain;padding:10px;border:1px solid #d9e2dd25;border-radius:10px;background:#0b0e13}
.package-panels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;grid-column:1/-1}
.package-panels img{display:block;width:100%;height:auto;filter:drop-shadow(0 5px 8px #0007)}
.alert-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.alert-strip img{display:block;width:100%;height:auto;border-radius:8px}
.profile-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.profile-grid figure,.screen-grid figure{display:flex;flex-direction:column;justify-content:center}
.profile-grid img{display:block;width:100%;height:auto;aspect-ratio:3/1;object-fit:cover}
.profile-grid .profile-avatar img{width:min(100%,170px);aspect-ratio:1;align-self:center;object-fit:cover}
.screen-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.screen-grid img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.graphics-card[data-graphics-kind="fortnite"]{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:16px;align-items:center}
.graphics-card[data-graphics-kind="fortnite"]>.graphics-card-copy,.graphics-card[data-graphics-kind="fortnite"]>.alert-strip{grid-column:1/-1}
.graphics-card[data-graphics-kind="profiles"]>.graphics-card-copy,.graphics-card[data-graphics-kind="screens"]>.graphics-card-copy,.graphics-card[data-graphics-kind="fgc"]>.graphics-card-copy{grid-column:1/-1}
.graphics-card[data-graphics-kind="profiles"] .profile-grid{grid-column:1/-1}
.graphics-card[data-graphics-kind="screens"] .screen-grid,.graphics-card[data-graphics-kind="fgc"] .event-banner{grid-column:1/-1}
.graphics-card[data-graphics-kind="fortnite"] .package-overview{grid-column:1}
.graphics-card[data-graphics-kind="fortnite"] .package-details{grid-column:2;grid-row:2}
.graphics-card[data-graphics-kind="fortnite"] .alert-strip{grid-row:3}
.graphics-credit{margin:18px 0 0;padding:14px 16px;border-left:2px solid #dfc276;background:#0b120d66;color:#aebdaf;font-size:12px;line-height:1.65}
.graphics-credit a{white-space:nowrap}
.graphics-status{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.graphics-card[hidden]{display:none!important}
@media(max-width:760px){.graphics-refresh-heading{align-items:flex-start;flex-direction:column}.graphics-refresh-heading .btn{width:100%;justify-content:center}.graphics-gallery{grid-template-columns:minmax(0,1fr)}.graphics-card-wide{grid-column:auto}.graphics-card:has(.royale-preview){grid-template-columns:1fr}.graphics-card[data-graphics-kind="fortnite"]{grid-template-columns:1fr}.graphics-card[data-graphics-kind="fortnite"] .package-overview,.graphics-card[data-graphics-kind="fortnite"] .package-details{grid-column:1;grid-row:auto}.overlay-previews{gap:7px}.overlay-previews figure{padding:7px}.overlay-previews img{max-height:120px}.social-previews{grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.graphics-spotlight{min-height:340px}.graphics-spotlight>img{object-position:55% center}}
@media(max-width:440px){.graphics-refresh{padding:18px 14px}.graphics-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.graphics-filter{padding:9px 7px}.icon-previews{grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}.social-previews{grid-template-columns:repeat(4,minmax(0,1fr))}.panel-previews,.package-panels{grid-template-columns:1fr}.profile-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.screen-grid{grid-template-columns:1fr}.alert-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.spotlight-caption{padding:20px 16px}.graphics-credit{font-size:11px}}
@media(prefers-reduced-motion:reduce){.graphics-card,.graphics-filter,.graphics-spotlight>img,.panel-previews img,.social-previews img,.royale-preview img{transition:none!important}.graphics-card:hover,.graphics-filter:hover{transform:none}}
