:root { --bg: #111018; --panel: #191722; --panel2: #201e2b; --line: #343142; --text: #f5f0e8; --muted: #a5a0b2; --purple: #a78bfa; --mint: #a7f3d0; --orange: #ffb86b; --display: "Arial Black", "Trebuchet MS", sans-serif; --brand-display: "Oxanium", "Arial Black", "Franklin Gothic Heavy", sans-serif; --mono: "Courier New", monospace; } * { box-sizing: border-box; } html { scroll-behavior: smooth; } body { margin: 0; background: var(--bg); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, sans-serif; } body[data-page="home"] { background: #0c0b19; } body[data-page="home"] > main, body[data-page="home"] > .site-footer { position: relative; z-index: 1; } body[data-page="ps1"] { --bg: #080d18; --panel: #101828; --panel2: #172238; --line: #263958; --text: #f2f6ff; --muted: #a5b3ca; --purple: #79a9ff; --mint: #7fe1a2; --orange: #ffd66f; background: #080d18; } body[data-page="snes"] { --bg: #100d18; --panel: #1a1623; --panel2: #252033; --line: #393149; --text: #f6f2fa; --muted: #aea9ba; --purple: #ad8ccf; --mint: #a7f3d0; --orange: #ffcf67; background: #100d18; } body[data-page="snes"] > main, body[data-page="snes"] > .site-footer { position: relative; z-index: 1; } body[data-page="snes"] .site-header { background: rgba(16,13,24,.94); border-bottom-color: #393149; } body[data-page="snes"] .brand-mark { filter: drop-shadow(0 3px 12px #9272b688); } body[data-page="snes"] .brand-copy strong { color: #e8e0f2; text-shadow: 1px 1px 0 #4d3d67; } body[data-page="snes"] .nav-link:hover, body[data-page="snes"] .nav-link.active { background: #282337; } body[data-page="snes"] .hero { border-bottom-color: #393149; background: linear-gradient(110deg,#151220cc,#24203333); } body[data-page="snes"] .eyebrow, body[data-page="snes"] .status-dot, body[data-page="snes"] .art-label { color: #c2a6e2; } body[data-page="snes"] .status-dot { background: #a7f3d0; box-shadow: 0 0 12px #a7f3d0; } body[data-page="snes"] h1 span { color: #bd9ddd; } body[data-page="snes"] .button-primary { background: #c2a6e2; color: #20162e; } body[data-page="snes"] .button-primary:hover { background: #dfc8f5; } body[data-page="snes"] .hero-grid { background-image: linear-gradient(#9d8ab744 1px,transparent 1px),linear-gradient(90deg,#9d8ab744 1px,transparent 1px); } body[data-page="snes"] .retro-backdrop { background: radial-gradient(ellipse at 50% 46%,#272136 0%,#16131f 43%,#0c0a11 100%); } body[data-page="snes"] .retro-backdrop::before { opacity: .48; } body[data-page="snes"] .retro-backdrop::after { opacity: .8; background: radial-gradient(ellipse at 22% 35%,#7f64ae2e,transparent 38%),radial-gradient(ellipse at 80% 40%,#bf465220,transparent 34%),radial-gradient(ellipse at 53% 72%,#3f956e18,transparent 42%); } body[data-page="snes"] .retro-sun { bottom: 19%; width: min(46vw,470px); aspect-ratio: 1; border: 1px solid #b8a0d02b; background: radial-gradient(circle,#47365f26 0 31%,#34284620 32% 55%,transparent 70%); box-shadow: 0 0 55px #8066a825,0 0 150px #49396d20; } body[data-page="snes"] .retro-sun::before { content: "16 BIT • 1990"; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); white-space: nowrap; color: #e9e0f1; opacity: .2; font: 800 29px/1 var(--brand-display); letter-spacing: .13em; text-shadow: 0 0 28px #b49bd3; } body[data-page="snes"] .retro-sun::after { content: ""; position: absolute; left: 50%; top: 69%; width: 145px; height: 3px; transform: translateX(-50%); border-radius: 4px; background: linear-gradient(90deg,#4777d1 0 25%,#dd5265 25% 50%,#51b87a 50% 75%,#e5bc46 75%); box-shadow: 0 0 18px #b49bd366; } body[data-page="snes"] .retro-horizon { background: linear-gradient(90deg,transparent,#8b70b888 25%,#c3a5df 50%,#8b70b888 75%,transparent); box-shadow: 0 0 22px #8b70b866; } body[data-page="snes"] .retro-floor { background-image: linear-gradient(#8068a455 1px,transparent 1px),linear-gradient(90deg,#70609055 1px,transparent 1px); } body[data-page="snes"] .retro-pixel-one { background: #dd5265; box-shadow: 0 0 13px #dd526577; } body[data-page="snes"] .retro-pixel-two { background: #51b87a; } body[data-page="snes"] .retro-pixel-three { background: #4777d1; } body[data-page="snes"] .site-footer { border-top-color: #393149; } body[data-page="snes"] .snes-collection-note { overflow: hidden; border-color: #494056; background: linear-gradient(120deg,#211c2bf5,#15121df2); box-shadow: 0 20px 70px #0007,0 0 36px #8c73ad18; } body[data-page="snes"] .snes-collection-note::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg,#4777d1 0 25%,#dd5265 25% 50%,#51b87a 50% 75%,#e5bc46 75%); } body[data-page="snes"] .snes-collection-note .download-button { background: #1c1826; border-color: #494056; } body[data-page="snes"] .snes-collection-note .download-button.emulator-download { background: #211c2d; border-color: #66547f; } body[data-page="snes"] .snes-collection-note .download-button.game-download { background: #24202c; border-color: #6e5e7c; } body[data-page="snes"] .snes-collection-note .download-button:hover { border-color: #c2a6e2; } .snes-collection-note { position: relative; z-index: 1; } body[data-page="snes"] .snes-console-art { right: 7%; width: min(38vw,440px); height: 320px; } body[data-page="snes"] .snes-logo-backdrop { position: absolute; z-index: 1; top: -32px; left: 50%; display: block; width: min(32vw,245px); height: auto; transform: translateX(-50%); filter: drop-shadow(0 0 17px #ad8ccf77); } .snes-console-photo { position: absolute; z-index: 2; inset: 42px 0 0; display: block; width: 100%; height: 250px; object-fit: contain; filter: drop-shadow(0 18px 22px #000b) drop-shadow(0 0 25px #8d76aa55); } .snes-image-credit { position: absolute; z-index: 3; right: 7px; bottom: 0; color: #b3acbe; font: 7px var(--mono); letter-spacing: .6px; opacity: .85; } .snes-image-credit:hover { color: #a7f3d0; } body[data-page="ps1"] > main, body[data-page="ps1"] > .site-footer { position: relative; z-index: 1; } .ps1-collection-note { position: relative; z-index: 1; } body[data-page="ps1"] .site-header { background: rgba(7,12,24,.94); border-bottom-color: #22314d; } body[data-page="ps1"] .brand-mark { filter: drop-shadow(0 3px 12px #5289ed88); } body[data-page="ps1"] .brand-copy strong { color: #dce8ff; text-shadow: 1px 1px 0 #294c83; } body[data-page="ps1"] .nav-link:hover, body[data-page="ps1"] .nav-link.active { background: #17233b; } body[data-page="ps1"] .hero { border-bottom-color: #263958; background: linear-gradient(110deg,#091020bb,#0d17322b); } body[data-page="ps1"] .eyebrow, body[data-page="ps1"] .status-dot, body[data-page="ps1"] .art-label { color: #91b8ff; } body[data-page="ps1"] .status-dot { background: #7fe1a2; box-shadow: 0 0 12px #7fe1a2; } body[data-page="ps1"] h1 span { color: #83adff; } body[data-page="ps1"] .button-primary { background: #83adff; color: #091326; } body[data-page="ps1"] .button-primary:hover { background: #b4ceff; } body[data-page="ps1"] .hero-grid { background-image: linear-gradient(#6b8cc455 1px,transparent 1px),linear-gradient(90deg,#6b8cc455 1px,transparent 1px); } body[data-page="ps1"] .ps1-logo-backdrop { position: absolute; z-index: 1; top: -58px; left: 50%; display: block; width: min(24vw,120px); height: auto; object-fit: contain; transform: translateX(-50%); opacity: .98; filter: drop-shadow(0 0 20px #4b81d966); } body[data-page="ps1"] .ps1-console-photo { filter: drop-shadow(0 18px 22px #000b) drop-shadow(0 0 25px #5788e655); } body[data-page="ps1"] .ps1-image-credit { color: #a5b3ca; } body[data-page="ps1"] .ps1-image-credit:hover { color: #7fe1a2; } body[data-page="ps1"] .ps1-collection-note { overflow: hidden; border-color: #31466a; background: linear-gradient(120deg,#101d33f5,#0d1424f2); box-shadow: 0 20px 70px #0007, 0 0 36px #31599a18; } body[data-page="ps1"] .ps1-collection-note::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg,#ed334b 0 25%,#ffd447 25% 50%,#65ca83 50% 75%,#4387df 75%); } body[data-page="ps1"] .ps1-collection-note .download-button { background: #101c30; border-color: #344b70; } body[data-page="ps1"] .ps1-collection-note .download-button.emulator-download { background: #12213b; border-color: #5276b2; } body[data-page="ps1"] .ps1-collection-note .download-button.bios-download { background: #122922; border-color: #397354; } body[data-page="ps1"] .ps1-collection-note .download-button.game-download { background: #2b1c28; border-color: #8b4655; } body[data-page="ps1"] .ps1-collection-note .download-button:hover { border-color: #9fc0ff; } body[data-page="ps1"] .site-footer { border-top-color: #263958; } body[data-page="ps1"] .ps1-console-art { right: 7%; width: min(38vw,440px); height: 320px; } .ps1-console-photo { position: absolute; z-index: 2; inset: 35px 0 0; display: block; width: 100%; height: 240px; object-fit: contain; filter: drop-shadow(0 18px 22px #0009) drop-shadow(0 0 20px #ffb86b44); } .ps1-image-credit { position: absolute; z-index: 3; right: 7px; bottom: 0; color: #b8b3c3; font: 7px var(--mono); letter-spacing: .6px; opacity: .8; } .ps1-image-credit:hover { color: var(--mint); } body[data-page="ps1"] .toolbar { grid-template-columns: minmax(210px,1fr) minmax(130px,175px); } .retro-backdrop { position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; background: linear-gradient(180deg,#0d0b1b 0%,#17132d 55%,#100d20 100%); } .retro-backdrop::before { content: ""; position: absolute; inset: -10%; opacity: .75; background-image: radial-gradient(2px 2px at 35px 45px,#fff 45%,transparent 55%),radial-gradient(1px 1px at 120px 95px,#d8ccff 45%,transparent 55%),radial-gradient(1.5px 1.5px at 220px 35px,#ffd8ae 45%,transparent 55%),radial-gradient(1px 1px at 285px 160px,#fff 45%,transparent 55%); background-size: 320px 230px, 390px 280px, 470px 340px, 540px 390px; animation: retro-stars-drift 100s linear infinite; } .retro-backdrop::after { content: ""; position: absolute; inset: 0; opacity: .5; background: radial-gradient(ellipse at 18% 25%,#7358bd38,transparent 38%),radial-gradient(ellipse at 86% 56%,#e85e8c20,transparent 36%); animation: retro-glow 9s ease-in-out infinite alternate; } .retro-sun { position: absolute; z-index: 1; left: 50%; bottom: 23%; width: min(42vw,390px); aspect-ratio: 1; border-radius: 50%; transform: translateX(-50%); background: repeating-linear-gradient(180deg,#141022 0 5px,transparent 5px 15px),linear-gradient(145deg,#ffe18b 5%,#ff9b79 48%,#eb5e9a 100%); box-shadow: 0 0 45px #f875a344,0 0 120px #a96ad233; animation: retro-sun-breathe 11s ease-in-out infinite alternate; } .retro-horizon { position: absolute; z-index: 3; top: 63%; left: 0; width: 100%; height: 1px; background: linear-gradient(90deg,transparent,#ffa6bb99 25%,#ffe18b 50%,#ffa6bb99 75%,transparent); box-shadow: 0 0 22px #f67ba5aa; } .retro-floor { position: absolute; z-index: 2; top: 62%; left: -55%; width: 210%; height: 85%; transform: perspective(360px) rotateX(61deg); transform-origin: center top; background-image: linear-gradient(#db7eab66 1px,transparent 1px),linear-gradient(90deg,#9f83fa55 1px,transparent 1px); background-size: 44px 34px; mask-image: linear-gradient(#000 0%,#000 68%,transparent 100%); animation: retro-floor-scroll 5s linear infinite; } .retro-pixel { position: absolute; z-index: 4; width: 6px; height: 6px; background: var(--mint); box-shadow: 0 0 13px #a7f3d077; opacity: .65; animation: retro-pixel-float 7s ease-in-out infinite alternate; } .retro-pixel-one { top: 27%; left: 12%; } .retro-pixel-two { top: 71%; right: 17%; width: 4px; height: 4px; background: var(--orange); animation-delay: -2s; } .retro-pixel-three { top: 48%; right: 9%; width: 5px; height: 5px; background: var(--purple); animation-delay: -4s; } body[data-page="ps1"] .retro-backdrop { background: radial-gradient(ellipse at 50% 46%,#16294b 0%,#0b1427 43%,#070b14 100%); } body[data-page="ps1"] .retro-backdrop::before { opacity: .48; } body[data-page="ps1"] .retro-backdrop::after { opacity: .8; background: radial-gradient(ellipse at 22% 35%,#2769c82e,transparent 38%),radial-gradient(ellipse at 80% 40%,#c9385220,transparent 34%),radial-gradient(ellipse at 53% 72%,#43b97518,transparent 42%); } body[data-page="ps1"] .retro-sun { bottom: 19%; width: min(46vw,470px); aspect-ratio: 1; border: 1px solid #86aaff2b; background: radial-gradient(circle,#294b8626 0 31%,#1b376b20 32% 55%,transparent 70%); box-shadow: 0 0 55px #4c82df25,0 0 150px #3265ba20; } body[data-page="ps1"] .retro-sun::before { content: "△ ○ × □"; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); white-space: nowrap; color: #e0e9ff; opacity: .19; font: 46px/1 var(--mono); letter-spacing: .13em; text-shadow: 0 0 28px #77a3ff; } body[data-page="ps1"] .retro-sun::after { content: ""; position: absolute; left: 50%; top: 69%; width: 145px; height: 3px; transform: translateX(-50%); border-radius: 4px; background: linear-gradient(90deg,#ed334b 0 25%,#ffd447 25% 50%,#65ca83 50% 75%,#4387df 75%); box-shadow: 0 0 18px #82aaff66; } body[data-page="ps1"] .retro-horizon { background: linear-gradient(90deg,transparent,#4387df88 25%,#9cbaff 50%,#4387df88 75%,transparent); box-shadow: 0 0 22px #4387df66; } body[data-page="ps1"] .retro-floor { background-image: linear-gradient(#638edc55 1px,transparent 1px),linear-gradient(90deg,#5f83c455 1px,transparent 1px); } body[data-page="ps1"] .retro-pixel-one { background: #ed5267; box-shadow: 0 0 13px #ed526777; } body[data-page="ps1"] .retro-pixel-two { background: #65ca83; } body[data-page="ps1"] .retro-pixel-three { background: #4387df; } @keyframes retro-stars-drift { from { background-position: 0 0,0 0,0 0,0 0; } to { background-position: 0 690px,0 480px,0 830px,0 560px; } } @keyframes retro-floor-scroll { from { background-position: 0 0,0 0; } to { background-position: 0 34px,44px 0; } } @keyframes retro-glow { from { opacity: .35; } to { opacity: .75; } } @keyframes retro-sun-breathe { from { filter: brightness(.92); transform: translateX(-50%) scale(.98); } to { filter: brightness(1.08); transform: translateX(-50%) scale(1.02); } } @keyframes retro-pixel-float { from { transform: translate3d(0,0,0); opacity: .35; } to { transform: translate3d(0,-16px,0); opacity: .85; } } @media (max-width: 720px) { .retro-sun { width: min(68vw,290px); bottom: 19%; } .retro-horizon { top: 67%; } .retro-floor { top: 66%; } } @media (prefers-reduced-motion: reduce) { .retro-backdrop::before, .retro-backdrop::after, .retro-sun, .retro-floor, .retro-pixel { animation: none; } } button, input, select { font: inherit; } button, a, select { -webkit-tap-highlight-color: transparent; } a { color: inherit; text-decoration: none; } button { cursor: pointer; } .scanlines { position: fixed; inset: 0; z-index: 10; pointer-events: none; opacity: .08; background: repeating-linear-gradient(0deg, transparent 0 3px, #000 4px 5px); } .site-header { min-height: 82px; padding: 0 clamp(20px, 5vw, 76px); display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid #292633; background: rgba(17,16,24,.92); position: relative; z-index: 12; } .brand { display: inline-flex; align-items: center; gap: 12px; flex-shrink: 0; } .brand-mark { display: block; width: 50px; height: 50px; flex: 0 0 auto; filter: drop-shadow(0 3px 10px #a78bfa55); } .brand-copy { display: flex; flex-direction: column; gap: 4px; } .brand-copy strong { color: #c5a4f5; font: 800 13px/1 var(--brand-display); letter-spacing: .25px; text-transform: uppercase; text-shadow: 1px 1px 0 #53317f; white-space: nowrap; } .brand-copy small { font: 9px var(--mono); color: var(--muted); letter-spacing: 1px; } .main-nav { display: flex; align-items: center; gap: 8px; } .nav-link { border: 0; background: transparent; color: var(--muted); font-size: 12px; padding: 11px 13px; border-radius: 7px; transition: .2s; } .nav-link:hover, .nav-link.active { color: var(--text); background: #282536; } .nav-link.active { box-shadow: inset 0 -2px var(--purple); } .nav-link.is-unavailable { cursor: not-allowed; opacity: .58; } .nav-link.is-unavailable:not(.active):hover { color: var(--muted); background: transparent; } .collection-unavailable { position: relative; z-index: 1; max-width: 760px; margin: 48px auto 70px; padding: 34px 28px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); text-align: center; } .collection-unavailable .eyebrow { margin-bottom: 10px; } .collection-unavailable h2 { margin: 0 0 12px; font: 800 clamp(20px, 3vw, 28px) var(--display); } .collection-unavailable > p:not(.eyebrow) { margin: 0; color: var(--muted); font-size: 13px; } .collection-unavailable .hero-actions { justify-content: center; margin-top: 22px; } .page-shortcut.is-unavailable { cursor: not-allowed; opacity: .58; } .page-shortcut.is-unavailable:hover { transform: none; border-color: color-mix(in srgb, var(--shortcut-accent) 42%, #343142); background: linear-gradient(135deg, color-mix(in srgb, var(--shortcut-accent) 13%, #191722), #171620); } .hero { min-height: 435px; padding: 68px clamp(20px, 8vw, 120px) 55px; position: relative; display: flex; align-items: center; overflow: hidden; border-bottom: 1px solid var(--line); } .hero-content { position: relative; z-index: 2; max-width: 650px; } .eyebrow { color: var(--mint); font: 10px var(--mono); letter-spacing: 1.8px; margin: 0 0 18px; } .status-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--mint); margin-right: 7px; box-shadow: 0 0 12px var(--mint); } h1, h2, h3, p { margin-top: 0; } h1 { font: 900 clamp(32px, 4.7vw, 57px)/1.08 var(--display); letter-spacing: -2px; margin-bottom: 19px; } h1 span { color: var(--purple); } .hero-description { max-width: 510px; color: #b8b3c3; font-size: 14px; line-height: 1.8; } .hero-actions { display: flex; align-items: center; gap: 18px; margin-top: 28px; flex-wrap: wrap; } .button { border: 1px solid transparent; display: inline-flex; justify-content: center; align-items: center; gap: 15px; padding: 13px 17px; border-radius: 5px; font-size: 12px; font-weight: 750; transition: transform .2s, background .2s; } .button:hover { transform: translateY(-2px); } .button-primary { background: var(--purple); color: #191324; } .button-primary:hover { background: #c4b5fd; } .button-secondary { background: #252331; border-color: #454052; color: var(--text); } .button-secondary:hover { background: #322e42; } .hero-note { font: 9px var(--mono); color: #8c879a; letter-spacing: 1px; } .hero-art { position: absolute; right: 10%; top: 50%; transform: translateY(-50%); width: 320px; height: 280px; } .orbit { position: absolute; border: 1px solid #39324f; border-radius: 50%; transform: rotate(-25deg); } .orbit-one { width: 310px; height: 150px; top: -13px; left: 5px; } .orbit-two { width: 260px; height: 220px; top: -48px; left: 30px; transform: rotate(45deg); } .pixel-sun { position: absolute; width: 120px; height: 120px; border-radius: 50%; top: 2px; left: 100px; opacity: .28; background: linear-gradient(135deg, #ffb86b, #ff4f91); box-shadow: 0 0 50px #ff7b9c36; } .hero-brand-lockup { position: absolute; z-index: 2; top: 14px; left: 50%; display: flex; width: 280px; flex-direction: column; align-items: center; justify-content: flex-start; gap: 5px; padding: 0; transform: translateX(-50%); } .hero-brand-mark { width: 96px; height: 96px; filter: drop-shadow(0 0 16px #ffb86b70); } .hero-brand-name { color: #d3baff; font: 800 17px/1 var(--brand-display); letter-spacing: .35px; text-transform: uppercase; text-shadow: 0 0 18px #9b70d577; white-space: nowrap; } .hero-brand-caption { color: var(--mint); font: 8px var(--mono); letter-spacing: 1.5px; } .art-label { position: absolute; font: 10px var(--mono); color: var(--mint); letter-spacing: 2px; } .label-a { right: -24px; top: 70px; transform: rotate(90deg); } .label-b { left: -12px; bottom: 13px; } .hero-grid { position: absolute; right: 0; top: 0; width: 45%; height: 100%; opacity: .14; background-image: linear-gradient(#746a94 1px,transparent 1px),linear-gradient(90deg,#746a94 1px,transparent 1px); background-size: 28px 28px; mask-image: linear-gradient(90deg,transparent,#000); } .stats-row { padding: 24px clamp(20px, 8vw, 120px); display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 1px solid var(--line); background: #15141d; } .stats-row div { display: flex; flex-direction: column; gap: 7px; padding-left: 24px; border-left: 1px solid #383344; } .stats-row strong { font: 24px var(--mono); color: var(--purple); } .stats-row span { color: var(--muted); font: 9px var(--mono); letter-spacing: 1px; } .library-section { padding: 68px clamp(20px, 8vw, 120px) 76px; } .section-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 30px; } .section-heading .eyebrow { margin-bottom: 10px; } h2 { font: 800 clamp(26px, 3vw, 36px)/1.2 var(--display); letter-spacing: -1px; margin-bottom: 0; } .section-heading h2 span { color: var(--purple); } .section-aside { color: var(--muted); font-size: 12px; line-height: 1.7; margin: 0 0 3px; text-align: right; } .toolbar { display: grid; grid-template-columns: minmax(210px, 1fr) repeat(3, minmax(130px, 175px)); gap: 10px; } .search-box { display: flex; align-items: center; gap: 10px; min-width: 0; border: 1px solid #3b374b; background: #1a1923; padding: 0 13px; border-radius: 5px; color: var(--purple); } .search-box > span { font-size: 25px; line-height: 1; } .search-box input { width: 100%; min-width: 0; color: var(--text); background: transparent; border: 0; outline: 0; padding: 13px 0; font-size: 12px; } .search-box input::placeholder { color: #777285; } kbd { border: 1px solid #4b465c; color: #928ba4; padding: 2px 6px; border-radius: 3px; font: 11px var(--mono); } .filter-label { display: flex; align-items: center; gap: 8px; border: 1px solid #3b374b; border-radius: 5px; background: #1a1923; padding: 0 10px; color: #898397; font: 9px var(--mono); letter-spacing: .5px; } .filter-label select { width: 100%; min-width: 0; color: var(--text); background: transparent; border: 0; outline: 0; padding: 13px 0; font: 11px system-ui; } .filter-label option { background: var(--panel); } .results-bar { display: flex; justify-content: space-between; align-items: center; padding: 23px 0 14px; color: var(--muted); font: 10px var(--mono); letter-spacing: .6px; } .text-button { border: 0; background: transparent; color: var(--purple); font: 10px var(--mono); } .game-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 18px; } .game-card { display: block; color: var(--text); text-decoration: none; background: var(--panel); border: 1px solid #302c3c; border-radius: 7px; overflow: hidden; transition: transform .2s, border-color .2s; min-width: 0; } .game-card:hover { transform: translateY(-4px); border-color: #7564a7; } .game-card.is-unavailable { background: #17151d; border-color: #282530; } .game-card.is-unavailable .card-body { background: #17151d; } .game-card.is-unavailable .card-body h3 { color: #aaa5b2; } .game-card.is-unavailable .card-body p { color: #777282; } .card-art { height: 155px; position: relative; display: grid; place-items: center; overflow: hidden; background: linear-gradient(135deg, var(--card-a,#40315d), var(--card-b,#1e243b)); } .card-art:before { content: ""; position: absolute; inset: 0; opacity: .25; background-image: linear-gradient(45deg, #fff 1px,transparent 1px),linear-gradient(-45deg, #fff 1px,transparent 1px); background-size: 18px 18px; } .card-art:after { content: ""; position: absolute; width: 145px; height: 145px; border: 1px solid #ffffff30; border-radius: 50%; } .game-card.is-unavailable .card-art:after { inset: 0; width: auto; height: auto; border: 0; border-radius: 0; background: #09080d99; z-index: 2; } .game-card.is-unavailable .card-art.has-cover .card-cover { filter: grayscale(.72) brightness(.55); } .card-symbol { position: relative; z-index: 3; font: 900 54px var(--mono); color: #fff; text-shadow: 4px 4px 0 #0005; } .card-platform { position: absolute; top: 10px; left: 10px; z-index: 4; padding: 5px 7px; border-radius: 3px; color: #f5f0e8; background: #111018b8; font: 9px var(--mono); } .card-kind { position: absolute; right: 10px; top: 10px; z-index: 4; padding: 5px 7px; background: var(--mint); color: #14251f; font: 9px var(--mono); border-radius: 3px; } .card-body { padding: 15px; } .card-meta { color: var(--purple); font: 9px var(--mono); letter-spacing: 1px; margin-bottom: 8px; } .card-body h3 { font-size: 16px; letter-spacing: -.4px; margin-bottom: 8px; line-height: 1.3; } .card-body p { min-height: 50px; color: var(--muted); font-size: 11px; line-height: 1.6; margin-bottom: 13px; } .card-bottom { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-top: 12px; border-top: 1px solid #34303f; } .card-bottom span { color: #8f899f; font: 9px var(--mono); } .availability-badge { padding: 4px 6px; border: 1px solid transparent; border-radius: 3px; font: 8px var(--mono); letter-spacing: .3px; white-space: nowrap; } .availability-badge.is-available { color: #a9e6c9; background: #1c342c; border-color: #335545; } .availability-badge.is-unavailable { color: #e5c1bc; background: #382725; border-color: #67413c; } .card-open { border: 0; color: var(--mint); background: transparent; font: 10px var(--mono); padding: 5px 0 5px 5px; } .empty-state { text-align: center; padding: 60px 20px; border: 1px dashed #454052; border-radius: 7px; } .empty-state > span { color: var(--purple); font-size: 32px; } .empty-state h3 { margin: 12px 0 6px; } .empty-state p { color: var(--muted); font-size: 12px; } .submission-banner { margin: 0 clamp(20px, 8vw, 120px) 70px; padding: 28px; display: flex; align-items: center; gap: 20px; border: 1px solid #3a354c; border-radius: 8px; background: linear-gradient(110deg,#201d2c,#171720); } .submission-icon { width: 48px; height: 48px; display: grid; place-items: center; flex-shrink: 0; background: #332b4a; color: var(--purple); font-size: 29px; border-radius: 6px; } .submission-banner > div:nth-child(2) { flex: 1; } .submission-banner .eyebrow { margin-bottom: 8px; font-size: 9px; } .submission-banner h2 { font-size: 19px; margin-bottom: 7px; } .submission-banner p:not(.eyebrow) { color: var(--muted); font-size: 11px; margin-bottom: 0; } .about-social { margin: 54px clamp(20px, 8vw, 120px) 70px; padding: 36px; border: 1px solid #62527d88; border-radius: 8px; background: linear-gradient(115deg,#201d2cf2,#171720ed); box-shadow: 0 20px 70px #0004; backdrop-filter: blur(4px); } .page-shortcuts { margin: 34px clamp(20px, 8vw, 120px) 0; } .shortcuts-heading { margin-bottom: 18px; } .shortcuts-heading .eyebrow { margin-bottom: 9px; } .shortcuts-heading h2 { font-size: clamp(22px, 2.5vw, 30px); } .shortcut-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } .page-shortcut { --shortcut-accent: var(--purple); min-height: 150px; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 20px; border: 1px solid color-mix(in srgb, var(--shortcut-accent) 42%, #343142); border-radius: 7px; background: linear-gradient(135deg, color-mix(in srgb, var(--shortcut-accent) 13%, #191722), #171620); transition: transform .2s, border-color .2s, background .2s; } .page-shortcut:hover { transform: translateY(-3px); border-color: var(--shortcut-accent); background: linear-gradient(135deg, color-mix(in srgb, var(--shortcut-accent) 20%, #191722), #171620); } .page-shortcut:focus-visible { outline: 2px solid var(--shortcut-accent); outline-offset: 3px; } .shortcut-ports { --shortcut-accent: #a7f3d0; } .shortcut-collections { --shortcut-accent: #83adff; } .shortcut-label { color: var(--shortcut-accent); font: 9px var(--mono); letter-spacing: 1.2px; } .page-shortcut strong { font: 800 clamp(16px, 1.8vw, 21px)/1.25 var(--brand-display); } .shortcut-action { display: flex; width: 100%; justify-content: space-between; align-items: center; padding-top: 11px; border-top: 1px solid #ffffff20; color: #c2bdce; font: 10px var(--mono); } .shortcut-action span { color: var(--shortcut-accent); font-size: 16px; } .about-social .eyebrow { margin-bottom: 10px; } .about-social h2 { max-width: 650px; margin-bottom: 12px; } .about-copy { max-width: 780px; margin: 18px 0 24px; } .about-copy p { color: #c2bdce; font-size: 13px; line-height: 1.9; margin-bottom: 13px; } .about-copy p:last-child { margin-bottom: 0; } .social-buttons { display: flex; flex-wrap: wrap; gap: 11px; } .social-youtube { background: #6d252c; border-color: #a33a43; color: #fff; } .social-youtube:hover { background: #873039; } .social-discord { background: #303878; border-color: #5865f2; color: #fff; } .social-discord:hover { background: #414ca0; } code { color: var(--mint); font: 11px var(--mono); } .site-footer { border-top: 1px solid #2d2938; padding: 26px clamp(20px, 5vw, 76px); display: flex; justify-content: space-between; align-items: center; gap: 18px; } .footer-brand .brand-mark { width: 42px; height: 42px; } .footer-brand .brand-copy strong { font-size: 10px; } .footer-brand .brand-copy small { font-size: 7px; } .site-footer > p { color: var(--muted); font-size: 11px; margin: 0; } .site-footer > span { color: #777285; font: 9px var(--mono); white-space: nowrap; } .details-dialog { width: min(680px, calc(100% - 28px)); max-height: 88vh; overflow: auto; padding: 0; border: 1px solid #4a435e; border-radius: 10px; background: var(--panel); color: var(--text); box-shadow: 0 25px 100px #000b; } .details-dialog.is-notice { width: min(420px, calc(100% - 28px)); overflow: hidden; } .details-dialog.is-notice .dialog-close { display: none; } .details-dialog::backdrop { background: #08070dcc; backdrop-filter: blur(5px); } .dialog-close { position: sticky; float: right; top: 10px; margin: 10px 10px -42px 0; z-index: 4; width: 32px; height: 32px; border: 1px solid #ffffff30; border-radius: 5px; background: #171520d9; color: white; font-size: 23px; } .availability-notice { padding: 32px 28px 28px; text-align: center; } .availability-notice .eyebrow { margin-bottom: 9px; } .availability-notice h2 { margin: 0 0 12px; font: 800 24px var(--display); } .availability-notice > p:not(.eyebrow) { color: #b9b3c6; font-size: 13px; line-height: 1.7; margin-bottom: 22px; } .availability-notice .button { min-width: 110px; } .detail-cover { min-height: 190px; display: grid; place-items: center; position: relative; overflow: hidden; background: linear-gradient(130deg,var(--card-a,#40315d),var(--card-b,#1e243b)); } .detail-cover:after { content: ""; position: absolute; width: 220px; height: 220px; border: 1px solid #ffffff40; border-radius: 50%; } .detail-cover span { z-index: 1; font: 900 76px var(--mono); text-shadow: 5px 5px #0005; } .detail-main { padding: 25px; } .detail-main h2 { font-size: 30px; margin: 8px 0 12px; } .detail-description { color: #bbb5c8; font-size: 13px; line-height: 1.8; } .detail-tags { display: flex; flex-wrap: wrap; gap: 7px; margin: 15px 0 22px; } .detail-tags span { color: var(--mint); background: #26352f; padding: 6px 8px; border-radius: 3px; font: 10px var(--mono); } .detail-block { border-top: 1px solid #393445; padding-top: 17px; margin-top: 17px; } .detail-block h3 { font: 11px var(--mono); color: var(--purple); letter-spacing: 1px; margin-bottom: 10px; } .detail-block p, .detail-block li { color: #b9b3c6; font-size: 12px; line-height: 1.7; } .detail-block ul { padding-left: 18px; margin: 0; } .link-list { display: grid; gap: 8px; } .external-link { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 13px; background: #242130; border: 1px solid #3c374b; border-radius: 5px; } .external-link:hover { border-color: var(--purple); } .external-link strong { display: block; font-size: 12px; margin-bottom: 4px; } .external-link small { color: var(--muted); font-size: 10px; } .external-link .arrow { color: var(--mint); font-size: 18px; } .toast { position: fixed; z-index: 30; bottom: 20px; left: 50%; transform: translate(-50%, 20px); padding: 12px 16px; background: var(--mint); color: #13251d; border-radius: 5px; font-size: 12px; opacity: 0; pointer-events: none; transition: .2s; } .toast.show { opacity: 1; transform: translate(-50%,0); } @media (max-width: 1000px) { .hero-art { right: 4%; opacity: .6; transform: translateY(-50%) scale(.8); } body[data-page="ps1"] .ps1-console-art { right: 2%; width: 380px; } body[data-page="snes"] .snes-console-art { right: 2%; width: 380px; } .hero-content { max-width: 590px; } .game-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } .toolbar { grid-template-columns: minmax(190px,1fr) repeat(2,minmax(130px,170px)); } .filter-label:last-child { grid-column: 2 / 4; } } @media (max-width: 720px) { .site-header { padding: 15px 18px; align-items: flex-start; flex-direction: column; gap: 13px; } .main-nav { width: 100%; overflow-x: auto; gap: 4px; padding-bottom: 2px; } .nav-link { white-space: nowrap; padding: 10px; } .hero { padding: 50px 22px; min-height: 420px; } .hero-art { right: -90px; top: 68%; opacity: .23; transform: translateY(-50%) scale(.9); } body[data-page="ps1"] .ps1-console-art { right: -110px; top: 66%; width: 350px; height: 280px; opacity: .4; } body[data-page="ps1"] .ps1-console-photo { height: 210px; } body[data-page="snes"] .snes-console-art { right: -110px; top: 66%; width: 350px; height: 280px; opacity: .4; } body[data-page="snes"] .snes-console-photo { height: 210px; } .hero-grid { width: 100%; opacity: .08; } h1 { letter-spacing: -1.5px; } .hero-description { max-width: 460px; } .stats-row { padding: 20px 22px; grid-template-columns: repeat(2,1fr); gap: 20px 0; } .stats-row div { padding-left: 14px; } .stats-row strong { font-size: 21px; } .library-section { padding: 48px 18px 55px; } .section-heading { align-items: flex-start; flex-direction: column; gap: 12px; } .section-aside { text-align: left; } .toolbar { grid-template-columns: 1fr 1fr; } body[data-page="ps1"] .toolbar { grid-template-columns: 1fr 1fr; } .search-box { grid-column: 1 / -1; } .filter-label:last-child { grid-column: auto; } .game-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px; } .card-art { height: 125px; } .card-symbol { font-size: 43px; } .card-body { padding: 12px; } .card-body h3 { font-size: 14px; } .card-body p { min-height: 66px; font-size: 10px; } .submission-banner { margin: 0 18px 45px; padding: 20px; flex-wrap: wrap; gap: 14px; } .submission-banner > div:nth-child(2) { min-width: calc(100% - 65px); } .submission-banner .button { margin-left: 62px; } .about-social { margin: 35px 18px 45px; padding: 24px 20px; } .page-shortcuts { margin: 30px 18px 0; } .shortcut-grid { grid-template-columns: 1fr; gap: 10px; } .page-shortcut { min-height: 125px; } .social-buttons .button { width: 100%; justify-content: space-between; } .site-footer { flex-wrap: wrap; padding: 24px 18px; } .site-footer > p { order: 3; width: 100%; } } @media (max-width: 390px) { .game-grid { grid-template-columns: 1fr; } .card-art { height: 160px; } .card-body p { min-height: 0; } .toolbar { grid-template-columns: 1fr; } body[data-page="ps1"] .toolbar { grid-template-columns: 1fr; } .search-box, .filter-label:last-child { grid-column: auto; } } /* Dedicated game / collection details */ .detail-hero { padding: 30px clamp(18px, 4vw, 32px) 24px; background: linear-gradient(135deg,var(--card-a),var(--card-b)); } .cover-pair { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 13px; max-width: 540px; margin: 0 auto 25px; perspective: 900px; } .physical-cover { position: relative; min-width: 0; aspect-ratio: 2 / 3; overflow: hidden; border: 1px solid #ffffff65; border-radius: 4px; box-shadow: 0 12px 25px #0005; background: linear-gradient(145deg,var(--card-a),var(--card-b)); } .physical-cover.front { transform: rotateY(5deg) rotate(-1deg); } .physical-cover.back { transform: rotateY(-5deg) rotate(1deg); } .physical-cover img { width: 100%; height: 100%; display: block; object-fit: cover; background: #14121c; } .cover-fallback { position: absolute; inset: 0; padding: 13px; display: flex; flex-direction: column; align-items: center; text-align: center; justify-content: space-around; color: #fff; background: linear-gradient(150deg,#ffffff12,transparent 50%),repeating-linear-gradient(0deg,transparent 0 5px,#00000008 6px 7px); } .cover-kicker,.cover-bottom { font: 8px var(--mono); letter-spacing: 1px; } .cover-symbol { font: 900 clamp(28px,7vw,55px) var(--mono); text-shadow: 3px 3px 0 #0007; } .cover-fallback strong { font: 900 clamp(12px,2.5vw,19px)/1.2 var(--display); text-transform: uppercase; text-shadow: 2px 2px #0006; overflow-wrap: anywhere; } .cover-fallback small { font: 8px var(--mono); letter-spacing: 1px; } .cover-fallback p { font-size: 9px; line-height: 1.55; text-align: left; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 8; -webkit-box-orient: vertical; } .detail-title-block { text-align: center; } .detail-title-block .eyebrow { margin-bottom: 9px; } .detail-main { padding: 25px clamp(18px,4vw,32px) 30px; } .detail-main .detail-block { margin-top: 0; margin-bottom: 24px; padding-top: 0; border: 0; } .detail-block .eyebrow { margin-bottom: 7px; font-size: 9px; } .detail-block h3 { font: 800 19px var(--display); color: var(--text); letter-spacing: -.4px; margin-bottom: 10px; } .original-description > p:last-child { color: #c3bdce; font-size: 13px; line-height: 1.85; margin-bottom: 0; } .instruction-list { padding-left: 19px; margin: 0 0 12px; } .instruction-list li { color: #c3bdce; font-size: 12px; line-height: 1.8; padding-left: 4px; margin-bottom: 4px; } .requirements { color: #a9a3b7; font-size: 11px; line-height: 1.7; margin: 12px 0 0; } .requirements strong { color: var(--orange); } .bios-resource { margin: 14px 0 0; font-size: 11px; } .bios-resource span { color: var(--muted); font: 9px var(--mono); margin-right: 8px; } .bios-resource a { color: var(--mint); text-decoration: underline; text-underline-offset: 3px; } .download-section { border-top: 1px solid #393445; padding-top: 22px; } .download-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; } .download-grid-triple { grid-template-columns: repeat(3,minmax(0,1fr)); } .download-button { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 15px; min-height: 76px; border: 1px solid #514764; border-radius: 6px; background: #252331; transition: .2s; } .download-button:hover { transform: translateY(-2px); border-color: var(--purple); } .download-button strong { display: block; font-size: 12px; margin-bottom: 6px; } .download-button small { display: block; color: #aaa4b8; font-size: 10px; line-height: 1.5; } .download-button b { color: var(--mint); font-size: 20px; } .download-button.emulator-download { background: #29243a; border-color: #6d5a91; } .download-button.bios-download { background: #222b38; border-color: #4d6886; } .download-button.game-download { background: #21352f; border-color: #3f6e5a; } .download-button.disabled { opacity: .55; cursor: not-allowed; } .download-note { color: #8f899f; font-size: 10px; line-height: 1.6; margin: 12px 0 0; } .detail-notice { margin: 20px 0 0; padding: 12px; border-left: 2px solid var(--orange); background: #2c261f; color: #c7b6a3; font-size: 10px; line-height: 1.6; } @media (max-width:480px) { .cover-pair{gap:9px}.cover-fallback{padding:8px}.cover-kicker,.cover-bottom{font-size:6px}.cover-fallback p{font-size:8px;-webkit-line-clamp:7}.download-grid{grid-template-columns:1fr}.download-button{min-height:68px} } /* Automatic covers from the xlenore PSX/PS2 cover collections */ .card-cover { position: absolute; inset: 0; z-index: 1; display: block; width: 100%; height: 100%; object-fit: contain; background: #14121c; } .card-art.has-cover:before, .card-art.has-cover:after, .card-art.has-cover .card-symbol { display: none; } .physical-cover.has-image .cover-fallback { display: none; } .physical-cover .cover-image { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; object-fit: cover; background: #14121c; } /* Console collection directory */ .console-collections { position: relative; z-index: 1; padding: 60px clamp(20px, 8vw, 120px) 70px; } .publisher-section { margin-bottom: 58px; scroll-margin-top: 24px; } .publisher-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 22px; padding-bottom: 15px; border-bottom: 1px solid #373344; } .publisher-heading .eyebrow { margin-bottom: 8px; } .publisher-heading h2 span { color: var(--purple); } .publisher-heading > p { margin: 0 0 4px; color: var(--muted); font-size: 12px; } .console-collection-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; } .console-collection-grid-single { grid-template-columns: minmax(0, calc((100% - 18px) / 2)); } .console-collection-card { --console-accent: #a78bfa; display: block; min-width: 0; overflow: hidden; border: 1px solid color-mix(in srgb, var(--console-accent) 38%, #343142); border-radius: 8px; background: linear-gradient(145deg,#1c1a28,#14131c); transition: transform .2s,border-color .2s,box-shadow .2s; } .console-collection-card:hover { transform: translateY(-4px); border-color: var(--console-accent); box-shadow: 0 16px 40px #0006,0 0 25px color-mix(in srgb,var(--console-accent) 15%,transparent); } .console-collection-card:focus-visible { outline: 2px solid var(--console-accent); outline-offset: 3px; } .console-ps1 { --console-accent: #83adff; } .console-snes { --console-accent: #bd9ddd; } .console-cover { position: relative; display: grid; place-items: center; overflow: hidden; aspect-ratio: 16 / 10; isolation: isolate; background: radial-gradient(ellipse at 50% 68%,color-mix(in srgb,var(--console-accent) 30%,transparent),transparent 48%),linear-gradient(135deg,#222039,#10111c 70%); } .console-cover::before { content: ""; position: absolute; z-index: -1; inset: 0; opacity: .36; background-image: linear-gradient(45deg,#ffffff16 1px,transparent 1px),linear-gradient(-45deg,#ffffff12 1px,transparent 1px); background-size: 22px 22px; } .console-cover::after { content: ""; position: absolute; z-index: -1; width: 70%; aspect-ratio: 1; border: 1px solid color-mix(in srgb,var(--console-accent) 30%,transparent); border-radius: 50%; box-shadow: 0 0 40px color-mix(in srgb,var(--console-accent) 12%,transparent),inset 0 0 40px color-mix(in srgb,var(--console-accent) 10%,transparent); } .console-generation,.console-cover-code { position: absolute; z-index: 3; color: #e5e2f0; font: 8px var(--mono); letter-spacing: 1px; text-shadow: 0 1px 8px #000; } .console-generation { top: 14px; left: 16px; } .console-cover-code { right: 14px; bottom: 12px; opacity: .7; font-size: 7px; } .console-wordmark { position: absolute; z-index: 2; top: 13%; left: 50%; display: block; width: min(40%,230px); height: 25%; object-fit: contain; transform: translateX(-50%); filter: drop-shadow(0 3px 10px #000a); } .ps1-wordmark { width: min(27%,150px); top: 10%; height: 30%; } .ps2-wordmark { width: min(35%,190px); top: 9%; height: 24%; filter: drop-shadow(0 0 12px #50caff8c); } .snes-wordmark { width: min(47%,270px); top: 10%; height: 26%; } .console-device { position: absolute; z-index: 1; left: 50%; bottom: 3%; display: block; width: 82%; height: 67%; object-fit: contain; transform: translateX(-50%); filter: drop-shadow(0 12px 12px #000b); } .ps1-device { width: 88%; height: 63%; bottom: 5%; } .ps2-device { width: 86%; height: 73%; bottom: 2%; } .snes-device { width: 90%; height: 69%; bottom: 2%; } .console-card-copy { padding: 20px; } .console-card-copy .eyebrow { margin-bottom: 8px; color: var(--console-accent); font-size: 8px; } .console-card-copy h3 { margin: 0 0 8px; font: 800 clamp(18px,2vw,24px)/1.25 var(--brand-display); } .console-card-copy p { min-height: 40px; margin: 0 0 17px; color: #b8b3c3; font-size: 11px; line-height: 1.7; } .console-card-action { display: flex; align-items: center; justify-content: space-between; padding-top: 12px; border-top: 1px solid #ffffff20; color: #e4dfed; font: 10px var(--mono); } .console-card-action b { color: var(--console-accent); font-size: 17px; } .collection-image-credits { margin: -25px 0 0; color: #7f7a8b; font: 9px/1.7 var(--mono); } .collection-image-credits a { color: #aaa1c1; text-decoration: underline; text-underline-offset: 3px; } .collection-image-credits a:hover { color: var(--mint); } /* PlayStation 2 system page */ body[data-page="ps2"] { --bg:#080f18;--panel:#101a27;--panel2:#172536;--line:#273b4f;--text:#eef8ff;--muted:#a8bbc9;--purple:#65d5ff;--mint:#81f3cf;--orange:#f6d477;background:#080f18; } body[data-page="ps2"] > main,body[data-page="ps2"] > .site-footer { position:relative;z-index:1; } body[data-page="ps2"] .site-header { background:rgba(7,14,22,.95);border-bottom-color:#20394c; } body[data-page="ps2"] .brand-mark { filter:drop-shadow(0 3px 12px #37b7ec88); } body[data-page="ps2"] .brand-copy strong { color:#e2f5ff;text-shadow:1px 1px 0 #1a4f6b; } body[data-page="ps2"] .nav-link:hover,body[data-page="ps2"] .nav-link.active { background:#14293a; } body[data-page="ps2"] .hero { border-bottom-color:#20394c;background:linear-gradient(110deg,#08121dcc,#0c20312e); } body[data-page="ps2"] .eyebrow,body[data-page="ps2"] .status-dot,body[data-page="ps2"] .art-label { color:#74d8ff; } body[data-page="ps2"] .status-dot { background:#81f3cf;box-shadow:0 0 12px #81f3cf; } body[data-page="ps2"] h1 span { color:#67d8ff; } body[data-page="ps2"] .button-primary { background:#67d8ff;color:#071722; } body[data-page="ps2"] .button-primary:hover { background:#a8eaff; } body[data-page="ps2"] .hero-grid { background-image:linear-gradient(#57b8e844 1px,transparent 1px),linear-gradient(90deg,#57b8e844 1px,transparent 1px); } body[data-page="ps2"] .retro-backdrop { perspective:1000px;background:radial-gradient(ellipse at 50% 54%,#18294f 0%,#101b38 39%,#0a1226 72%,#060a12 100%); } body[data-page="ps2"] .retro-backdrop::before { opacity:.3;background-image:radial-gradient(2px 2px at 35px 45px,#e8f4ff 45%,transparent 55%),radial-gradient(1px 1px at 120px 95px,#b6caff 45%,transparent 55%),radial-gradient(1.5px 1.5px at 220px 35px,#d9c9ff 45%,transparent 55%),radial-gradient(1px 1px at 285px 160px,#fff 45%,transparent 55%); } body[data-page="ps2"] .retro-backdrop::after { opacity:.8;background:linear-gradient(118deg,transparent 18%,#4b65a512 30%,#91a9ff35 34%,#d9e6ff18 36%,transparent 43%),linear-gradient(286deg,transparent 48%,#e886bf14 55%,#6cbaff32 60%,transparent 66%),radial-gradient(ellipse at 25% 35%,#657ecb24,transparent 40%),radial-gradient(ellipse at 74% 63%,#8368b526,transparent 42%);background-size:230% 100%,220% 100%,100% 100%,100% 100%;animation:ps2-boot-light 13s linear infinite; } body[data-page="ps2"] .retro-sun,body[data-page="ps2"] .retro-horizon,body[data-page="ps2"] .retro-floor,body[data-page="ps2"] .retro-pixel { display:none; } @keyframes ps2-boot-light { from { background-position:180% 0,0 0,0 0,0 0; } to { background-position:-50% 0,-120% 0,0 0,0 0; } } body[data-page="ps2"] .ps2-console-art { right:7%;width:min(38vw,440px);height:320px; } .ps2-logo-backdrop { position:absolute;z-index:1;top:-30px;left:50%;display:block;width:min(30vw,210px);height:auto;transform:translateX(-50%);filter:drop-shadow(0 0 18px #49cfff99); } .ps2-console-photo { position:absolute;z-index:2;inset:35px 0 0;display:block;width:100%;height:250px;object-fit:contain;filter:drop-shadow(0 18px 22px #000b) drop-shadow(0 0 25px #41b9e655); } .ps2-image-credit { position:absolute;z-index:3;right:7px;bottom:0;color:#a9c3d4;font:7px var(--mono);letter-spacing:.6px;opacity:.85; } .ps2-image-credit:hover { color:#81f3cf; } .ps2-crystal { --crystal-size:120px;position:absolute;z-index:2;top:var(--crystal-y);left:var(--crystal-x);width:var(--crystal-size);height:var(--crystal-size);transform-style:preserve-3d;filter:drop-shadow(0 0 26px #68baff80);opacity:.46;animation:ps2-crystal-float var(--crystal-speed,14s) linear infinite;animation-delay:var(--crystal-delay,0s);will-change:transform; } .ps2-crystal::after { content:"";position:absolute;inset:-42%;z-index:-1;border-radius:50%;background:radial-gradient(circle,#8abfff25,transparent 68%);filter:blur(15px);transform:translateZ(-30px); } .ps2-crystal-face { position:absolute;inset:0;border:1px solid #e7f4ff9c;background:linear-gradient(140deg,#f4f9ff2b,#8abfff0c 52%,#9fe4ff20);box-shadow:inset 0 0 25px #d7eaff20,0 0 12px #83c6ff18;backface-visibility:hidden; } .ps2-face-front { transform:translateZ(calc(var(--crystal-size) / 2)); } .ps2-face-back { transform:rotateY(180deg) translateZ(calc(var(--crystal-size) / 2)); } .ps2-face-right { transform:rotateY(90deg) translateZ(calc(var(--crystal-size) / 2));background:linear-gradient(150deg,#dcecff20,#64b9ff0b 70%,#ffffff13); } .ps2-face-left { transform:rotateY(-90deg) translateZ(calc(var(--crystal-size) / 2)); } .ps2-face-top { transform:rotateX(90deg) translateZ(calc(var(--crystal-size) / 2));background:linear-gradient(135deg,#ffffff35,#a8d8ff18); } .ps2-face-bottom { transform:rotateX(-90deg) translateZ(calc(var(--crystal-size) / 2)); } .ps2-crystal-one { --crystal-x:18%;--crystal-y:37%;--crystal-size:142px;--crystal-speed:13s; } .ps2-crystal-two { --crystal-x:76%;--crystal-y:26%;--crystal-size:96px;--crystal-speed:17s;--crystal-delay:-6s;opacity:.52; } .ps2-crystal-three { --crystal-x:67%;--crystal-y:72%;--crystal-size:61px;--crystal-speed:11s;--crystal-delay:-3s;opacity:.42; } @keyframes ps2-crystal-float { 0% { transform:translate3d(-36px,38px,-18px) rotateX(-24deg) rotateY(0deg) rotateZ(-12deg); } 25% { transform:translate3d(28px,-24px,12px) rotateX(22deg) rotateY(90deg) rotateZ(8deg); } 50% { transform:translate3d(54px,28px,-8px) rotateX(-12deg) rotateY(180deg) rotateZ(20deg); } 75% { transform:translate3d(-12px,-42px,16px) rotateX(28deg) rotateY(270deg) rotateZ(-9deg); } 100% { transform:translate3d(-36px,38px,-18px) rotateX(-24deg) rotateY(360deg) rotateZ(-12deg); } } .ps2-particle { --particle-color:#ffd38c;--particle-size:3px;position:absolute;z-index:3;top:var(--particle-y);left:var(--particle-x);width:var(--particle-size);height:var(--particle-size);border-radius:50%;background:var(--particle-color);box-shadow:0 0 7px 2px color-mix(in srgb,var(--particle-color) 70%,transparent),0 0 18px color-mix(in srgb,var(--particle-color) 48%,transparent);opacity:.25;animation:ps2-particle-drift var(--particle-speed,11s) linear infinite;animation-delay:var(--particle-delay,0s);will-change:transform,opacity; } .ps2-particle-one { --particle-x:18%;--particle-y:31%;--particle-color:#ffd68a;--particle-size:4px;--particle-speed:8s; } .ps2-particle-two { --particle-x:24%;--particle-y:69%;--particle-color:#ed95d0;--particle-speed:12s;--particle-delay:-4s; } .ps2-particle-three { --particle-x:39%;--particle-y:25%;--particle-color:#9edbff;--particle-size:5px;--particle-speed:10s;--particle-delay:-6s; } .ps2-particle-four { --particle-x:47%;--particle-y:62%;--particle-color:#c59cff;--particle-speed:13s;--particle-delay:-3s; } .ps2-particle-five { --particle-x:61%;--particle-y:34%;--particle-color:#f8b87e;--particle-size:4px;--particle-speed:9s;--particle-delay:-5s; } .ps2-particle-six { --particle-x:69%;--particle-y:73%;--particle-color:#81e5d1;--particle-size:5px;--particle-speed:12s;--particle-delay:-8s; } .ps2-particle-seven { --particle-x:78%;--particle-y:28%;--particle-color:#d49cff;--particle-speed:10s;--particle-delay:-2s; } .ps2-particle-eight { --particle-x:87%;--particle-y:57%;--particle-color:#ff9ea4;--particle-size:4px;--particle-speed:14s;--particle-delay:-10s; } .ps2-particle-nine { --particle-x:31%;--particle-y:46%;--particle-color:#8fbfff;--particle-size:2px;--particle-speed:9s;--particle-delay:-7s; } .ps2-particle-ten { --particle-x:55%;--particle-y:17%;--particle-color:#ffdc93;--particle-size:2px;--particle-speed:11s;--particle-delay:-9s; } .ps2-particle-eleven { --particle-x:73%;--particle-y:48%;--particle-color:#78dbff;--particle-size:2px;--particle-speed:13s;--particle-delay:-1s; } .ps2-particle-twelve { --particle-x:10%;--particle-y:49%;--particle-color:#ffabda;--particle-size:2px;--particle-speed:15s;--particle-delay:-12s; } @keyframes ps2-particle-drift { 0% { transform:translate3d(-14px,48px,0) scale(.5);opacity:0; } 12% { opacity:.95; } 55% { transform:translate3d(35px,-28px,0) scale(1.25);opacity:.82; } 88% { opacity:.75; } 100% { transform:translate3d(84px,-104px,0) scale(.7);opacity:0; } } body[data-page="ps2"] .ps2-collection-note { position:relative;z-index:1;overflow:hidden;border-color:#28506a;background:linear-gradient(120deg,#10243af5,#0b1723f2);box-shadow:0 20px 70px #0007,0 0 36px #1383b018; } body[data-page="ps2"] .ps2-collection-note::before { content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#2b82b6,#66ddff 36%,#7ef3ce 70%,#2e87d0); } body[data-page="ps2"] .ps2-collection-note .download-button { background:#0f1e2c;border-color:#31536a; } body[data-page="ps2"] .ps2-collection-note .download-button.emulator-download { background:#10283a;border-color:#35789c; } body[data-page="ps2"] .ps2-collection-note .download-button.bios-download { background:#102a29;border-color:#39796e; } body[data-page="ps2"] .ps2-collection-note .download-button.game-download { background:#182436;border-color:#3d617d; } body[data-page="ps2"] .ps2-collection-note .download-button:hover { border-color:#67d8ff; } body[data-page="ps2"] .site-footer { border-top-color:#20394c; } /* Console pages: NES, Game Boy Advance and Mega Drive */ body[data-page="nes"] { --bg:#111114;--panel:#1c1c20;--panel2:#28282d;--line:#414148;--text:#f7f5f2;--muted:#b5b1ae;--purple:#f04a52;--mint:#f6a44d;--orange:#f5d07a;background:#111114; } body[data-page="nes"] > main,body[data-page="nes"] > .site-footer,body[data-page="gba"] > main,body[data-page="gba"] > .site-footer,body[data-page="megadrive"] > main,body[data-page="megadrive"] > .site-footer { position:relative;z-index:1; } body[data-page="nes"] .site-header { background:rgba(17,17,20,.95);border-bottom-color:#38383d; } body[data-page="nes"] .brand-mark { filter:drop-shadow(0 3px 12px #d9434b88); } body[data-page="nes"] .brand-copy strong { color:#f4efeb;text-shadow:1px 1px 0 #713338; } body[data-page="nes"] .nav-link:hover,body[data-page="nes"] .nav-link.active { background:#2a2224; } body[data-page="nes"] .hero { border-bottom-color:#38383d;background:linear-gradient(110deg,#161619dc,#2c20202b); } body[data-page="nes"] .eyebrow,body[data-page="nes"] .status-dot,body[data-page="nes"] .art-label { color:#ff7476; } body[data-page="nes"] .status-dot { background:#f6a44d;box-shadow:0 0 12px #f6a44d; } body[data-page="nes"] h1 span { color:#ff7778; } body[data-page="nes"] .button-primary { background:#ef555b;color:#210e12; } body[data-page="nes"] .button-primary:hover { background:#ff8585; } body[data-page="nes"] .hero-grid { background-image:linear-gradient(#d65b5b2e 1px,transparent 1px),linear-gradient(90deg,#d65b5b2e 1px,transparent 1px); } body[data-page="nes"] .retro-backdrop { background:radial-gradient(ellipse at 51% 44%,#342326 0%,#1b191c 42%,#101013 100%); } body[data-page="nes"] .retro-backdrop::before { opacity:.22;background-image:repeating-linear-gradient(0deg,#fff 0 1px,transparent 1px 5px);background-size:100% 5px; } body[data-page="nes"] .retro-backdrop::after { opacity:.8;background:radial-gradient(ellipse at 50% 43%,#ee4d4d26,transparent 41%),radial-gradient(ellipse at 15% 72%,#f2a15114,transparent 36%); } .nes-screen-glow { position:absolute;left:50%;top:48%;width:min(67vw,760px);height:min(48vw,430px);border:1px solid #ff8f8f2a;border-radius:48% 48% 42% 42%;transform:translate(-50%,-50%);background:radial-gradient(ellipse,#ed676716 0 34%,#d4474710 57%,transparent 72%);box-shadow:0 0 80px #ee4d4d12,inset 0 0 90px #e3525213;animation:nes-screen-warm 8s ease-in-out infinite alternate; } .nes-signal-ring { position:absolute;top:24%;left:50%;width:min(68vw,760px);aspect-ratio:1;border:1px solid #f27c7130;border-radius:50%;transform:translateX(-50%) scaleY(.52);box-shadow:0 0 50px #e34b4b10,inset 0 0 45px #e34b4b0b;animation:nes-signal-breathe 12s ease-in-out infinite alternate; } .nes-pixel { position:absolute;width:5px;height:5px;background:#ff6a61;box-shadow:0 0 14px #ff6a61aa;animation:retro-pixel-float 7s ease-in-out infinite alternate; } .nes-pixel-one { top:26%;left:17%; }.nes-pixel-two { top:65%;left:78%;width:4px;height:4px;background:#f6a44d;animation-delay:-2s; }.nes-pixel-three { top:44%;right:12%;width:3px;height:3px;background:#f5d07a;animation-delay:-4s; }.nes-pixel-four { top:76%;left:31%;width:3px;height:3px;background:#e75766;animation-delay:-1s; } @keyframes nes-screen-warm { from { opacity:.65;filter:brightness(.88); } to { opacity:1;filter:brightness(1.16); } } @keyframes nes-signal-breathe { from { transform:translateX(-50%) scaleY(.48) scale(.97);opacity:.52; } to { transform:translateX(-50%) scaleY(.54) scale(1.04);opacity:.95; } } body[data-page="nes"] .nes-collection-note { position:relative;z-index:1;overflow:hidden;border-color:#57383c;background:linear-gradient(120deg,#251c20f5,#151417f2);box-shadow:0 20px 70px #0007,0 0 38px #d64d5015; } body[data-page="nes"] .nes-collection-note::before { content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#ef555b,#f6a44d 52%,#f4d078); } body[data-page="nes"] .nes-collection-note .download-button { background:#1b191c;border-color:#49373a; } body[data-page="nes"] .nes-collection-note .download-button.emulator-download { background:#271d21;border-color:#78444b; } body[data-page="nes"] .nes-collection-note .download-button:hover { border-color:#ff7778; } body[data-page="nes"] .site-footer { border-top-color:#38383d; } body[data-page="nes"] .nes-console-art { right:7%;width:min(38vw,440px);height:320px; } .nes-logo-backdrop { position:absolute;z-index:1;top:-25px;left:50%;display:block;width:min(32vw,230px);height:70px;object-fit:contain;transform:translateX(-50%);filter:drop-shadow(0 0 14px #ff777855); } .nes-console-photo { position:absolute;z-index:2;inset:37px 0 0;display:block;width:100%;height:250px;object-fit:contain;filter:drop-shadow(0 18px 22px #000b) drop-shadow(0 0 22px #e65a5450); } .nes-image-credit,.gba-image-credit,.megadrive-image-credit { position:absolute;z-index:3;right:7px;bottom:0;color:#b9b2b2;font:7px var(--mono);letter-spacing:.55px;opacity:.85; } .nes-image-credit:hover { color:#ff8585; } body[data-page="gba"] { --bg:#130e1b;--panel:#20182b;--panel2:#2d203b;--line:#493550;--text:#fbf4ff;--muted:#bcaec8;--purple:#d581ff;--mint:#b6ed64;--orange:#ffab64;background:#130e1b; } body[data-page="gba"] .site-header { background:rgba(19,14,27,.95);border-bottom-color:#493550; } body[data-page="gba"] .brand-mark { filter:drop-shadow(0 3px 12px #bc64e588); } body[data-page="gba"] .brand-copy strong { color:#f8edff;text-shadow:1px 1px 0 #633982; } body[data-page="gba"] .nav-link:hover,body[data-page="gba"] .nav-link.active { background:#2a1d37; } body[data-page="gba"] .hero { border-bottom-color:#493550;background:linear-gradient(110deg,#1b1125dc,#39234c2b); } body[data-page="gba"] .eyebrow,body[data-page="gba"] .status-dot,body[data-page="gba"] .art-label { color:#dc9bff; } body[data-page="gba"] .status-dot { background:#b6ed64;box-shadow:0 0 12px #b6ed64; } body[data-page="gba"] h1 span { color:#d78cff; } body[data-page="gba"] .button-primary { background:#d78cff;color:#21112c; } body[data-page="gba"] .button-primary:hover { background:#edc3ff; } body[data-page="gba"] .hero-grid { background-image:linear-gradient(#c06be433 1px,transparent 1px),linear-gradient(90deg,#c06be433 1px,transparent 1px); } body[data-page="gba"] .retro-backdrop { background:radial-gradient(ellipse at 57% 47%,#35213f 0%,#1c1425 45%,#100c17 100%); } body[data-page="gba"] .retro-backdrop::before { opacity:.35;background-image:radial-gradient(2px 2px at 35px 45px,#f4d8ff 45%,transparent 55%),radial-gradient(1px 1px at 120px 95px,#c7ffa5 45%,transparent 55%),radial-gradient(1.5px 1.5px at 220px 35px,#ffbd88 45%,transparent 55%); } body[data-page="gba"] .retro-backdrop::after { opacity:.85;background:linear-gradient(130deg,transparent 22%,#e184ff0b 35%,#c77bea32 40%,transparent 51%),linear-gradient(320deg,transparent 43%,#b1eb6930 50%,transparent 59%),radial-gradient(ellipse at 28% 35%,#bd62df24,transparent 39%);background-size:220% 100%,210% 100%,100% 100%;animation:gba-light-sweep 17s linear infinite; } @keyframes gba-light-sweep { from { background-position:160% 0,-100% 0,0 0; } to { background-position:-55% 0,110% 0,0 0; } } .gba-orbit { position:absolute;left:50%;top:47%;width:min(80vw,900px);height:min(44vw,500px);border:1px solid #df9cff2b;border-radius:50%;transform:translate(-50%,-50%) rotate(-18deg);box-shadow:0 0 70px #c35ae912,inset 0 0 55px #b85fe710;animation:gba-orbit-breathe 10s ease-in-out infinite alternate; } .gba-orbit-two { width:min(68vw,770px);height:min(34vw,390px);border-color:#b6ed6423;transform:translate(-50%,-50%) rotate(18deg);animation-delay:-4s; } .gba-light { position:absolute;width:8px;height:8px;border-radius:50%;background:#c5fa7d;box-shadow:0 0 9px 3px #c5fa7d66,0 0 34px 9px #b9ee5c26;animation:gba-light-drift 10s ease-in-out infinite alternate; } .gba-light-one { top:29%;left:18%; }.gba-light-two { top:66%;right:19%;width:5px;height:5px;background:#ed9aff;box-shadow:0 0 9px 3px #ed9aff77,0 0 34px 9px #d264ff2b;animation-delay:-3s; }.gba-light-three { top:46%;right:10%;width:4px;height:4px;background:#ffb76f;animation-delay:-6s; } @keyframes gba-orbit-breathe { from { opacity:.46;filter:brightness(.8); } to { opacity:.9;filter:brightness(1.2); } } @keyframes gba-light-drift { from { transform:translate3d(0,0,0) scale(.7);opacity:.45; } to { transform:translate3d(16px,-22px,0) scale(1.25);opacity:1; } } body[data-page="gba"] .gba-collection-note { position:relative;z-index:1;overflow:hidden;border-color:#593e68;background:linear-gradient(120deg,#271b32f5,#17111ff2);box-shadow:0 20px 70px #0007,0 0 38px #bd65e61b; } body[data-page="gba"] .gba-collection-note::before { content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#bd70ed,#e49cff 45%,#b9ed64); } body[data-page="gba"] .gba-collection-note .download-button { background:#211829;border-color:#523e5d; } body[data-page="gba"] .gba-collection-note .download-button.emulator-download { background:#2a1c35;border-color:#79519b; } body[data-page="gba"] .gba-collection-note .download-button:hover { border-color:#d78cff; } body[data-page="gba"] .site-footer { border-top-color:#493550; } body[data-page="gba"] .gba-console-art { right:7%;width:min(38vw,440px);height:320px; } .gba-logo-backdrop { position:absolute;z-index:1;top:-25px;left:50%;display:block;width:min(32vw,240px);height:70px;object-fit:contain;transform:translateX(-50%);filter:drop-shadow(0 0 15px #d78cff83); } .gba-console-photo { position:absolute;z-index:2;inset:42px 0 0;display:block;width:100%;height:245px;object-fit:contain;filter:drop-shadow(0 18px 22px #000b) drop-shadow(0 0 25px #b769e455); } .gba-image-credit:hover { color:#c4f481; } body[data-page="megadrive"] { --bg:#081321;--panel:#101e2b;--panel2:#172a3b;--line:#28445a;--text:#f1f8fd;--muted:#a6bdca;--purple:#54bce9;--mint:#7ce0d1;--orange:#f08c66;background:#081321; } body[data-page="megadrive"] .site-header { background:rgba(7,17,30,.96);border-bottom-color:#28445a; } body[data-page="megadrive"] .brand-mark { filter:drop-shadow(0 3px 12px #2793cb88); } body[data-page="megadrive"] .brand-copy strong { color:#e7f6ff;text-shadow:1px 1px 0 #205778; } body[data-page="megadrive"] .nav-link:hover,body[data-page="megadrive"] .nav-link.active { background:#142a3c; } body[data-page="megadrive"] .hero { border-bottom-color:#28445a;background:linear-gradient(110deg,#071728dc,#12314a2b); } body[data-page="megadrive"] .eyebrow,body[data-page="megadrive"] .status-dot,body[data-page="megadrive"] .art-label { color:#71cef2; } body[data-page="megadrive"] .status-dot { background:#7ce0d1;box-shadow:0 0 12px #7ce0d1; } body[data-page="megadrive"] h1 span { color:#5ac4ee; } body[data-page="megadrive"] .button-primary { background:#5ac4ee;color:#071826; } body[data-page="megadrive"] .button-primary:hover { background:#a8eaff; } body[data-page="megadrive"] .hero-grid { background-image:linear-gradient(#5bbce333 1px,transparent 1px),linear-gradient(90deg,#5bbce333 1px,transparent 1px); } body[data-page="megadrive"] .retro-backdrop { background:radial-gradient(ellipse at 50% 48%,#142d46 0%,#0a1a2b 47%,#050c15 100%); } body[data-page="megadrive"] .retro-backdrop::before { opacity:.25;background-image:radial-gradient(2px 2px at 35px 45px,#d8f4ff 45%,transparent 55%),radial-gradient(1px 1px at 120px 95px,#88d7ff 45%,transparent 55%),radial-gradient(1px 1px at 220px 35px,#ffc4a5 45%,transparent 55%); } body[data-page="megadrive"] .retro-backdrop::after { opacity:.8;background:linear-gradient(114deg,transparent 25%,#48bbef0a 35%,#54bce92c 40%,#e8faff18 42%,transparent 48%),linear-gradient(291deg,transparent 43%,#ed8b6530 50%,transparent 57%),radial-gradient(ellipse at 60% 45%,#2375a825,transparent 44%);background-size:230% 100%,220% 100%,100% 100%;animation:mega-light-rush 12s linear infinite; } @keyframes mega-light-rush { from { background-position:160% 0,-110% 0,0 0; } to { background-position:-70% 0,110% 0,0 0; } } .mega-disc { position:absolute;top:18%;left:50%;width:min(52vw,560px);aspect-ratio:1;border:1px solid #75cffa27;border-radius:50%;transform:translateX(-50%);background:repeating-radial-gradient(circle,transparent 0 35px,#7bd4ff0c 36px 37px,transparent 38px 68px);box-shadow:0 0 85px #3fa7df16,inset 0 0 70px #4eacde12;animation:mega-disc-turn 70s linear infinite; } @keyframes mega-disc-turn { to { transform:translateX(-50%) rotate(360deg); } } .mega-speedline { position:absolute;left:-18%;width:136%;height:1px;background:linear-gradient(90deg,transparent,#65caf055 35%,#b3efff88 50%,transparent 73%);box-shadow:0 0 12px #4bbef244;transform:rotate(-14deg);animation:mega-speed-pass 8s ease-in-out infinite; } .mega-speedline-one { top:32%; }.mega-speedline-two { top:55%;opacity:.55;animation-delay:-2.8s; }.mega-speedline-three { top:73%;opacity:.35;animation-delay:-5.2s; } @keyframes mega-speed-pass { 0%,100% { opacity:.18;transform:translateX(-12%) rotate(-14deg); } 50% { opacity:.78;transform:translateX(12%) rotate(-14deg); } } .mega-spark { position:absolute;width:5px;height:5px;border-radius:50%;background:#74d5f4;box-shadow:0 0 13px 4px #52b9eb77;animation:gba-light-drift 8s ease-in-out infinite alternate; }.mega-spark-one { top:28%;left:20%; }.mega-spark-two { top:67%;right:15%;background:#f0926d;box-shadow:0 0 13px 4px #f0926d77;animation-delay:-4s; }.mega-spark-three { top:46%;right:27%;width:3px;height:3px;animation-delay:-2s; } body[data-page="megadrive"] .megadrive-collection-note { position:relative;z-index:1;overflow:hidden;border-color:#2a4d65;background:linear-gradient(120deg,#10263af5,#0a1723f2);box-shadow:0 20px 70px #0007,0 0 38px #268cc21b; } body[data-page="megadrive"] .megadrive-collection-note::before { content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#167db2,#56c9ed 47%,#ef8967); } body[data-page="megadrive"] .megadrive-collection-note .download-button { background:#0e1d2b;border-color:#29475c; } body[data-page="megadrive"] .megadrive-collection-note .download-button.emulator-download { background:#10283a;border-color:#35789c; } body[data-page="megadrive"] .megadrive-collection-note .download-button:hover { border-color:#5ac4ee; } body[data-page="megadrive"] .site-footer { border-top-color:#28445a; } body[data-page="megadrive"] .megadrive-console-art { right:7%;width:min(38vw,440px);height:320px; } .megadrive-logo-backdrop { position:absolute;z-index:1;top:-22px;left:50%;display:block;width:min(37vw,280px);height:66px;object-fit:contain;transform:translateX(-50%);filter:drop-shadow(0 0 15px #61c8ee80); } .megadrive-console-photo { position:absolute;z-index:2;inset:39px 0 0;display:block;width:100%;height:250px;object-fit:contain;filter:drop-shadow(0 18px 22px #000b) drop-shadow(0 0 25px #329bc955); } .megadrive-image-credit:hover { color:#8fe8dc; } .console-nes { --console-accent:#ef6265; }.console-gba { --console-accent:#d78cff; }.console-megadrive { --console-accent:#59bfe7; } .console-collection-card.is-unavailable { cursor:not-allowed;filter:saturate(.5) grayscale(.25); } .console-collection-card.is-unavailable:hover { transform:none;border-color:color-mix(in srgb,var(--console-accent) 38%,#343142);box-shadow:none; } .console-unavailable-badge { position:absolute;z-index:4;top:13px;right:14px;padding:6px 8px;border:1px solid #67413c;border-radius:3px;background:#382725ed;color:#f0c8c1;font:8px var(--mono);letter-spacing:.5px; } .console-card-status { color:#d8aaa3; } .console-card-status b { color:#d8aaa3; } .console-nes .console-cover { background:radial-gradient(ellipse at 50% 68%,#d74b4b50,transparent 49%),linear-gradient(145deg,#37343a,#15151a 75%); } .console-gba .console-cover { background:radial-gradient(ellipse at 50% 70%,#ae5fd75a,transparent 48%),linear-gradient(145deg,#31223e,#16131f 75%); } .console-megadrive .console-cover { background:radial-gradient(ellipse at 50% 70%,#338ab550,transparent 48%),linear-gradient(145deg,#1e3549,#0e1621 75%); } .nes-wordmark { top:10%;width:min(31%,175px);height:25%;filter:drop-shadow(0 0 9px #f56a6a55); } .gba-wordmark { top:8%;width:min(42%,230px);height:29%;filter:drop-shadow(0 0 9px #d78cff66); } .megadrive-wordmark { top:9%;width:min(38%,215px);height:24%;filter:drop-shadow(0 0 9px #58bee966); } .nes-device { width:76%;height:62%;bottom:3%; }.gba-device { width:63%;height:70%;bottom:1%; }.megadrive-device { width:82%;height:65%;bottom:3%; } .console-collection-grid-trio { grid-template-columns:repeat(3,minmax(0,1fr)); } @media (max-width:1000px) { body[data-page="nes"] .nes-console-art,body[data-page="gba"] .gba-console-art,body[data-page="megadrive"] .megadrive-console-art { right:2%;width:380px; } .console-collection-grid-trio { grid-template-columns:repeat(2,minmax(0,1fr)); } } @media (max-width:720px) { body[data-page="nes"] .nes-console-art,body[data-page="gba"] .gba-console-art,body[data-page="megadrive"] .megadrive-console-art { right:-110px;top:66%;width:350px;height:280px;opacity:.42; } body[data-page="nes"] .nes-console-photo,body[data-page="gba"] .gba-console-photo,body[data-page="megadrive"] .megadrive-console-photo { height:210px; } .console-collection-grid-trio { grid-template-columns:1fr; } .nes-screen-glow { width:110vw;height:70vw; }.nes-signal-ring { width:120vw; } .gba-orbit { width:115vw;height:65vw; }.mega-disc { top:28%;width:95vw; } } @media (prefers-reduced-motion:reduce) { body[data-page="nes"] .retro-backdrop::after,body[data-page="gba"] .retro-backdrop::after,body[data-page="megadrive"] .retro-backdrop::after, .nes-screen-glow,.nes-signal-ring,.nes-pixel,.gba-orbit,.gba-light,.mega-disc,.mega-speedline,.mega-spark { animation:none; } } @media (max-width:1000px) { body[data-page="ps2"] .ps2-console-art { right:2%;width:380px; } } @media (max-width:720px) { .console-collections { padding:42px 18px 48px; } .publisher-heading { align-items:flex-start;flex-direction:column;gap:8px; } .console-collection-grid,.console-collection-grid-single { grid-template-columns:1fr; } .collection-image-credits { margin-top:-20px; } body[data-page="ps2"] .ps2-console-art { right:-110px;top:66%;width:350px;height:280px;opacity:.42; } body[data-page="ps2"] .ps2-console-photo { height:210px; } .ps2-crystal-one { --crystal-x:8%;--crystal-y:36%;--crystal-size:92px; } .ps2-crystal-two { --crystal-x:76%;--crystal-y:22%;--crystal-size:64px; } .ps2-crystal-three { --crystal-x:68%;--crystal-y:74%;--crystal-size:45px; } } @media (max-width:480px) { .console-card-copy { padding:17px; } .console-cover-code { max-width:60%;font-size:6px; } .ps2-crystal { opacity:.25; } .ps2-particle { opacity:.5; } } @media (prefers-reduced-motion:reduce) { body[data-page="ps2"] .retro-backdrop::after { animation:none; } .ps2-crystal,.ps2-particle { display:none; } } /* Neo Geo, FinalBurn Neo and Dreamcast collection pages */ body[data-page="neogeo"] { --bg:#17121b;--panel:#211923;--panel2:#2c2030;--line:#49333f;--text:#f7f1e8;--muted:#b8a9a7;--purple:#e6ad42;--mint:#70d4d0;--orange:#fa7948;background:#17121b; } body[data-page="neogeocd"] { --bg:#10191d;--panel:#182428;--panel2:#203236;--line:#315158;--text:#eff8f5;--muted:#a5bbb9;--purple:#58c4d2;--mint:#8be0c8;--orange:#f2a65a;background:#10191d; } body[data-page="finalburn"] { --bg:#111716;--panel:#1a201c;--panel2:#242b23;--line:#39483a;--text:#f4f7eb;--muted:#b1b9a9;--purple:#78dc80;--mint:#d2ee65;--orange:#f2a44f;background:#111716; } body[data-page="dreamcast"] { --bg:#171214;--panel:#22191b;--panel2:#302024;--line:#52333a;--text:#f8f2ec;--muted:#c0ada6;--purple:#f17b42;--mint:#f2c978;--orange:#e95d38;background:#171214; } body[data-page="neogeo"] > main,body[data-page="neogeo"] > .site-footer,body[data-page="neogeocd"] > main,body[data-page="neogeocd"] > .site-footer,body[data-page="finalburn"] > main,body[data-page="finalburn"] > .site-footer,body[data-page="dreamcast"] > main,body[data-page="dreamcast"] > .site-footer { position:relative;z-index:1; } body[data-page="neogeo"] .site-header,body[data-page="neogeocd"] .site-header,body[data-page="finalburn"] .site-header,body[data-page="dreamcast"] .site-header { background:color-mix(in srgb,var(--bg) 94%,transparent);border-bottom-color:var(--line); } body[data-page="neogeo"] .nav-link:hover,body[data-page="neogeo"] .nav-link.active,body[data-page="neogeocd"] .nav-link:hover,body[data-page="neogeocd"] .nav-link.active,body[data-page="finalburn"] .nav-link:hover,body[data-page="finalburn"] .nav-link.active,body[data-page="dreamcast"] .nav-link:hover,body[data-page="dreamcast"] .nav-link.active { background:var(--panel2); } body[data-page="neogeo"] .hero,body[data-page="neogeocd"] .hero,body[data-page="finalburn"] .hero,body[data-page="dreamcast"] .hero { border-bottom-color:var(--line);background:linear-gradient(110deg,color-mix(in srgb,var(--bg) 87%,transparent),color-mix(in srgb,var(--purple) 10%,transparent)); } body[data-page="neogeo"] .eyebrow,body[data-page="neogeo"] .status-dot,body[data-page="neogeo"] .art-label,body[data-page="neogeocd"] .eyebrow,body[data-page="neogeocd"] .status-dot,body[data-page="neogeocd"] .art-label,body[data-page="finalburn"] .eyebrow,body[data-page="finalburn"] .status-dot,body[data-page="finalburn"] .art-label,body[data-page="dreamcast"] .eyebrow,body[data-page="dreamcast"] .status-dot,body[data-page="dreamcast"] .art-label { color:var(--purple); } body[data-page="neogeo"] .status-dot,body[data-page="neogeocd"] .status-dot,body[data-page="finalburn"] .status-dot,body[data-page="dreamcast"] .status-dot { background:var(--mint);box-shadow:0 0 12px var(--mint); } body[data-page="neogeo"] h1 span,body[data-page="neogeocd"] h1 span,body[data-page="finalburn"] h1 span,body[data-page="dreamcast"] h1 span { color:var(--purple); } body[data-page="neogeo"] .button-primary,body[data-page="neogeocd"] .button-primary,body[data-page="finalburn"] .button-primary,body[data-page="dreamcast"] .button-primary { background:var(--purple);color:#171214; } body[data-page="neogeo"] .button-primary:hover,body[data-page="neogeocd"] .button-primary:hover,body[data-page="finalburn"] .button-primary:hover,body[data-page="dreamcast"] .button-primary:hover { filter:brightness(1.15); } body[data-page="neogeo"] .hero-grid,body[data-page="neogeocd"] .hero-grid,body[data-page="finalburn"] .hero-grid,body[data-page="dreamcast"] .hero-grid { background-image:linear-gradient(color-mix(in srgb,var(--purple) 28%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--purple) 28%,transparent) 1px,transparent 1px); } body[data-page="neogeo"] .retro-backdrop { background:radial-gradient(ellipse at 53% 46%,#49301f 0%,#231a20 44%,#100d13 100%); } body[data-page="neogeo"] .retro-backdrop::after { opacity:.75;background:radial-gradient(ellipse at 22% 35%,#e5a43b30,transparent 38%),radial-gradient(ellipse at 80% 55%,#cb3f3b24,transparent 37%); } body[data-page="neogeocd"] .retro-backdrop { background:radial-gradient(ellipse at 53% 46%,#1b4147 0%,#15252c 45%,#0b1117 100%); } body[data-page="neogeocd"] .retro-backdrop::after { opacity:.8;background:radial-gradient(ellipse at 22% 35%,#46c2d032,transparent 38%),radial-gradient(ellipse at 80% 55%,#4ee0c123,transparent 36%); } body[data-page="finalburn"] .retro-backdrop { background:radial-gradient(ellipse at 54% 50%,#28412a 0%,#1a221c 45%,#0c100f 100%); } body[data-page="finalburn"] .retro-backdrop::after { opacity:.8;background:radial-gradient(ellipse at 17% 40%,#79db4533,transparent 34%),radial-gradient(ellipse at 82% 53%,#d64cc024,transparent 38%); } body[data-page="dreamcast"] .retro-backdrop { background:radial-gradient(ellipse at 53% 46%,#482422 0%,#281a1e 43%,#100d11 100%); } body[data-page="dreamcast"] .retro-backdrop::after { opacity:.8;background:radial-gradient(ellipse at 22% 35%,#ec73302e,transparent 38%),radial-gradient(ellipse at 80% 55%,#e8bb4120,transparent 37%); } body[data-page="neogeo"] .site-footer,body[data-page="neogeocd"] .site-footer,body[data-page="finalburn"] .site-footer,body[data-page="dreamcast"] .site-footer { border-top-color:var(--line); } .console-page-note { position:relative;z-index:1;overflow:hidden;border-color:var(--line);background:linear-gradient(120deg,color-mix(in srgb,var(--panel) 95%,transparent),color-mix(in srgb,var(--bg) 94%,transparent));box-shadow:0 20px 70px #0007,0 0 38px color-mix(in srgb,var(--purple) 10%,transparent); } .console-page-note::before { content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--purple),var(--mint),var(--orange)); } .console-page-note .download-button { background:color-mix(in srgb,var(--panel) 85%,#000);border-color:var(--line); } .console-page-note .download-button.emulator-download { background:color-mix(in srgb,var(--panel2) 85%,#000);border-color:color-mix(in srgb,var(--purple) 52%,var(--line)); } .console-page-note .download-button:hover { border-color:var(--purple); } .neogeo-console-art,.neogeocd-console-art,.dreamcast-console-art { right:7%;width:min(38vw,440px);height:320px; } .dreamcast-console-art { z-index:1; } .neogeo-logo-backdrop,.neogeocd-logo-backdrop,.dreamcast-logo-backdrop { position:absolute;z-index:1;top:-22px;left:50%;display:block;width:min(35vw,250px);height:70px;object-fit:contain;transform:translateX(-50%);filter:drop-shadow(0 0 15px color-mix(in srgb,var(--purple) 72%,transparent)); } .neogeo-console-photo,.neogeocd-console-photo,.dreamcast-console-photo { position:absolute;z-index:2;inset:39px 0 0;display:block;width:100%;height:250px;object-fit:contain;filter:drop-shadow(0 18px 22px #000b) drop-shadow(0 0 25px color-mix(in srgb,var(--purple) 38%,transparent)); } .console-image-credit { position:absolute;z-index:3;right:7px;bottom:0;color:#c3b8b3;font:7px var(--mono);letter-spacing:.55px;opacity:.88; } .console-image-credit:hover { color:var(--mint); } .neo-energy-ring,.cd-orbit,.dreamcast-orbit { position:absolute;left:50%;top:46%;width:min(69vw,760px);aspect-ratio:1;border:1px solid color-mix(in srgb,var(--purple) 32%,transparent);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 70px color-mix(in srgb,var(--purple) 10%,transparent),inset 0 0 60px color-mix(in srgb,var(--purple) 10%,transparent);animation:console-ring-pulse 11s ease-in-out infinite alternate; } .cd-orbit-one { width:min(68vw,740px);transform:translate(-50%,-50%) rotateX(68deg); }.cd-orbit-two { width:min(52vw,580px);transform:translate(-50%,-50%) rotateX(68deg);animation-delay:-4s; } .dreamcast-orbit-one { width:min(65vw,720px);border-color:#f2c97835; }.dreamcast-orbit-two { width:min(46vw,510px);border-color:#f17b4230;animation-delay:-5s; } @keyframes console-ring-pulse { from { opacity:.35;filter:brightness(.8); } to { opacity:.85;filter:brightness(1.25); } } .neo-star,.cd-glint,.dreamcast-star { position:absolute;width:5px;height:5px;border-radius:50%;background:var(--mint);box-shadow:0 0 14px 4px color-mix(in srgb,var(--mint) 55%,transparent);animation:retro-pixel-float 8s ease-in-out infinite alternate; } .neo-star-one { top:28%;left:18%; }.neo-star-two { top:66%;right:18%;animation-delay:-3s; }.neo-star-three { top:42%;right:10%;width:3px;height:3px;animation-delay:-6s; } .cd-glint-one { top:29%;left:21%;background:#fff; }.cd-glint-two { top:66%;right:18%;width:3px;height:3px;background:#80f2e8;animation-delay:-4s; } .dreamcast-star-one { top:28%;left:18%;background:#f2c978; }.dreamcast-star-two { top:66%;right:18%;background:#f17b42;animation-delay:-3s; }.dreamcast-star-three { top:42%;right:10%;width:3px;height:3px;animation-delay:-6s; } .console-neogeo { --console-accent:#e9b44c; }.console-neogeocd { --console-accent:#59c6d2; }.console-finalburn { --console-accent:#7cdd83; }.console-dreamcast { --console-accent:#ef8148; } .neogeo-cover { background:radial-gradient(ellipse at 50% 68%,#da963b58,transparent 48%),linear-gradient(145deg,#42302e,#17141d 75%); } .neogeocd-cover { background:radial-gradient(ellipse at 50% 68%,#4bc4ce50,transparent 48%),linear-gradient(145deg,#243b40,#11171e 75%); } .finalburn-cover { background:radial-gradient(ellipse at 50% 72%,#75d44b46,transparent 48%),linear-gradient(145deg,#233b2b,#111611 75%); } .dreamcast-cover { background:radial-gradient(ellipse at 50% 69%,#ef784549,transparent 48%),linear-gradient(145deg,#49292c,#181316 75%); } .neogeo-wordmark,.neogeocd-wordmark { top:10%;width:min(43%,245px);height:26%; }.dreamcast-wordmark { top:6%;width:min(24%,130px);height:33%; } .neogeo-device { width:89%;height:65%;bottom:2%; }.neogeocd-device { width:94%;height:66%;bottom:2%; }.dreamcast-device { width:91%;height:65%;bottom:3%; } .finalburn-arcade-art { right:9%;width:min(34vw,390px);height:320px; } .hero-arcade-cabinet { position:absolute;left:50%;top:48%;width:205px;height:275px;transform:translate(-50%,-50%);clip-path:polygon(5% 0,95% 0,100% 100%,0 100%);border:2px solid #76de79;background:linear-gradient(155deg,#324330,#121a14 72%);box-shadow:0 0 35px #76de7940;filter:drop-shadow(0 20px 24px #000b); } .hero-arcade-cabinet::before { content:"";position:absolute;inset:8px 12px auto;height:12px;background:#c1e86b;box-shadow:0 0 16px #9bec6e; } .hero-arcade-marquee { position:absolute;top:10%;left:10%;width:80%;padding:8px 2px;border:1px solid #84de7b;color:#e2ff97;text-align:center;font:800 11px var(--brand-display);letter-spacing:1.2px;text-shadow:0 0 12px #84de7b; } .hero-arcade-screen { position:absolute;top:24%;left:14%;width:72%;height:39%;overflow:hidden;border:7px solid #20241d;border-radius:8px;background:repeating-linear-gradient(0deg,#111 0 3px,#263d24 4px 6px);box-shadow:0 0 0 1px #76de79,0 0 25px #79d75d55; } .hero-arcade-screen i { position:absolute;bottom:14%;width:23%;height:45%;background:#b8ec5b;clip-path:polygon(50% 0,100% 35%,73% 100%,16% 86%,0 34%);filter:drop-shadow(0 0 6px #b8ec5b); }.hero-arcade-screen i:nth-child(1) { left:14%; }.hero-arcade-screen i:nth-child(2) { left:41%;height:63%;background:#db5a9f; }.hero-arcade-screen i:nth-child(3) { right:9%;height:36%;background:#69c8ed; } .hero-arcade-controls { position:absolute;top:69%;left:25%;display:flex;align-items:center;gap:18px; }.hero-arcade-controls i { width:15px;height:15px;border:2px solid #e9ecda;border-radius:50%;background:#e55487;box-shadow:0 0 12px #e5548777; }.hero-arcade-controls b { width:6px;height:22px;border-radius:4px;background:#e9ecda;box-shadow:0 0 8px #fff8; } .hero-arcade-slot { position:absolute;bottom:8%;left:41%;width:18%;height:3px;background:#111;box-shadow:0 0 8px #9bec6e; } .arcade-beam { position:absolute;left:-20%;width:140%;height:2px;background:linear-gradient(90deg,transparent,#a3f25c99 42%,#ff5aa877 56%,transparent);transform:rotate(-15deg);animation:arcade-sweep 8s ease-in-out infinite; }.arcade-beam-one { top:36%; }.arcade-beam-two { top:64%;opacity:.5;animation-delay:-4s; } @keyframes arcade-sweep { 0%,100% { translate:-8% 0;opacity:.18; } 50% { translate:8% 0;opacity:.8; } } .arcade-grid-glow { position:absolute;left:50%;bottom:7%;width:min(62vw,660px);height:140px;transform:translateX(-50%) perspective(220px) rotateX(65deg);background-image:linear-gradient(#83de683d 1px,transparent 1px),linear-gradient(90deg,#83de683d 1px,transparent 1px);background-size:28px 22px;mask-image:linear-gradient(transparent,#000); } .arcade-pixel { position:absolute;width:5px;height:5px;background:#b5ee62;box-shadow:0 0 12px #9deb6177;animation:retro-pixel-float 7s ease-in-out infinite alternate; }.arcade-pixel-one { top:28%;left:19%; }.arcade-pixel-two { top:66%;right:16%;background:#f05b9d;animation-delay:-3s; }.arcade-pixel-three { top:46%;right:28%;width:3px;height:3px;animation-delay:-5s; } .mini-arcade-cabinet { position:absolute;left:50%;top:53%;width:92px;height:100px;transform:translate(-50%,-50%);border:2px solid #9deb61;border-radius:5px 5px 12px 12px;background:linear-gradient(145deg,#384632,#111811 75%);box-shadow:0 0 24px #8bde5266; } .mini-arcade-marquee { position:absolute;top:8%;left:8%;width:84%;padding:3px 0;border:1px solid #a6e565;color:#d7ff94;text-align:center;font:800 7px var(--brand-display);letter-spacing:.6px; } .mini-arcade-screen { position:absolute;top:27%;left:14%;width:72%;height:41%;border:4px solid #171d16;border-radius:4px;background:repeating-linear-gradient(0deg,#17221b 0 2px,#69d451 3px 4px);box-shadow:0 0 0 1px #8ddc5d; } .mini-arcade-controls { position:absolute;top:75%;left:23%;display:flex;align-items:center;gap:9px; }.mini-arcade-controls i { width:8px;height:8px;border-radius:50%;background:#ec589c;box-shadow:0 0 8px #ed599c; }.mini-arcade-controls b { width:4px;height:12px;border-radius:4px;background:#ddd; } .finalburn-arcade-art .art-label { color:#b8f074; } @media (max-width:1000px) { .neogeo-console-art,.neogeocd-console-art,.dreamcast-console-art { right:2%;width:380px; }.finalburn-arcade-art { right:2%;width:350px; } } @media (max-width:720px) { .neogeo-console-art,.neogeocd-console-art,.dreamcast-console-art { right:-110px;top:66%;width:350px;height:280px;opacity:.42; } body[data-page="dreamcast"] .hero { display:block; } body[data-page="dreamcast"] .dreamcast-console-art { position:relative;top:auto;right:auto;width:min(100%,320px);height:200px;margin:18px auto 0;opacity:.85;transform:none; } .neogeo-console-photo,.neogeocd-console-photo,.dreamcast-console-photo { height:210px; } body[data-page="dreamcast"] .dreamcast-console-photo { height:160px; } .finalburn-arcade-art { right:-80px;top:66%;width:300px;height:270px;opacity:.4; }.hero-arcade-cabinet { transform:translate(-50%,-50%) scale(.82); } .neo-energy-ring,.dreamcast-orbit { width:110vw; }.cd-orbit-one { width:110vw; }.cd-orbit-two { width:83vw; } } @media (prefers-reduced-motion:reduce) { .neo-energy-ring,.cd-orbit,.dreamcast-orbit,.neo-star,.cd-glint,.dreamcast-star,.arcade-beam,.arcade-pixel { animation:none; } }