{"id":13,"date":"2026-01-09T17:27:55","date_gmt":"2026-01-10T00:27:55","guid":{"rendered":"https:\/\/rec0m88.com\/?page_id=13"},"modified":"2026-08-23T16:49:21","modified_gmt":"2026-08-23T22:49:21","slug":"download-rec0m88","status":"publish","type":"page","link":"https:\/\/rec0m88.com\/de\/download-rec0m88\/","title":{"rendered":"Rec0m88 herunterladen"},"content":{"rendered":"\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin=\"\">\n<link rel=\"stylesheet\" href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700&#038;family=Sora:wght@500;600;700&#038;family=JetBrains+Mono:wght@400;500;600&#038;display=swap\">\n\n<style>\n\/* =========================================================\n   REC0M88 \u2014 DOWNLOAD PAGE\n   Same design system as the Rec0m88 homepage: refined dark,\n   Sora \/ Inter \/ JetBrains Mono, hairline borders, restrained\n   cyan + violet accents. Everything is scoped to\n   .Rec0m88-container so it drops into WordPress cleanly.\n   ========================================================= *\/\n\n.Rec0m88-container {\n  \/* ---- Surface ramp ---- *\/\n  --r-bg:        #08090c;\n  --r-bg-2:      #0b0d11;\n  --r-surface:   #101319;\n  --r-surface-2: #151922;\n  --r-line:      rgba(255,255,255,.07);\n  --r-line-2:    rgba(255,255,255,.12);\n\n  \/* ---- Ink ---- *\/\n  --r-text:      #e8eaf0;\n  --r-body:      #a5abba;\n  --r-muted:     #6f7789;\n\n  \/* ---- Accent ---- *\/\n  --r-cyan:        #35d6ee;\n  --r-cyan-soft:   rgba(53,214,238,.12);\n  --r-violet:      #a68bfa;\n  --r-violet-soft: rgba(166,139,250,.12);\n  --r-amber:       #f0c24b;\n  --r-amber-soft:  rgba(240,194,75,.12);\n  --r-green:       #4ade80;\n  --r-green-soft:  rgba(74,222,128,.12);\n  --r-flame:       #fb7185;\n\n  \/* ---- Type ---- *\/\n  --r-display: 'Sora', 'Inter', system-ui, sans-serif;\n  --r-sans:    'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;\n  --r-mono:    'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;\n\n  \/* ---- Shape ---- *\/\n  --r-r-sm: 8px;\n  --r-r-md: 14px;\n  --r-r-lg: 20px;\n  --r-shadow: 0 1px 2px rgba(0,0,0,.4), 0 12px 32px -12px rgba(0,0,0,.7);\n  --r-max: 1220px;\n\n  margin: 0 auto !important;\n  padding: 0 !important;\n  position: relative;\n  z-index: 1;\n  background: var(--r-bg);\n  color: var(--r-body);\n  font-family: var(--r-sans);\n  font-size: 16px;\n  line-height: 1.65;\n  letter-spacing: -0.005em;\n  overflow-x: hidden;\n  \/* Never split a word across lines. *\/\n  word-break: normal;\n  overflow-wrap: normal;\n  hyphens: none;\n  text-wrap: pretty;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n.Rec0m88-container, .Rec0m88-container * { box-sizing: border-box; min-width: 0; }\n\n\/* Element resets wrapped in :where() so they carry ZERO element specificity \u2014\n   otherwise `.Rec0m88-container p` (0,1,1) would beat every component rule\n   (0,1,0) and silently kill its margins and colors. *\/\n.Rec0m88-container :where(img) { max-width: 100%; height: auto; display: block; }\n.Rec0m88-container :where(a) { text-decoration: none; color: inherit; }\n.Rec0m88-container :where(ul, ol, li) { margin: 0; padding: 0; list-style: none; }\n.Rec0m88-container :where(p) { margin: 0 0 1em; }\n.Rec0m88-container :where(h1, h2, h3, h4) { margin: 0; font-family: var(--r-display); color: var(--r-text); letter-spacing: -0.025em; line-height: 1.15; font-weight: 600; }\n.Rec0m88-container :where(strong) { color: var(--r-text); font-weight: 600; }\n\n.Rec0m88-container a:focus-visible,\n.Rec0m88-container button:focus-visible,\n.Rec0m88-container [tabindex]:focus-visible {\n  outline: 2px solid var(--r-cyan); outline-offset: 3px; border-radius: 4px;\n}\n\n.rw-cv { content-visibility: auto; contain-intrinsic-size: auto 900px; }\n\n\/* ---------- Icons ---------- *\/\n.icon { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }\n.icon svg { width: 100%; height: 100%; display: block; }\n.icon-sm { width: 18px; height: 18px; }\n.icon-md { width: 20px; height: 20px; }\n.icon-lg { width: 24px; height: 24px; }\n.icon-xl { width: 32px; height: 32px; }\n.icon-2xl { width: 40px; height: 40px; }\n.icon-cyan   svg { color: var(--r-cyan); }\n.icon-violet svg { color: var(--r-violet); }\n.icon-amber  svg { color: var(--r-amber); }\n.icon-green  svg { color: var(--r-green); }\n.icon-white  svg { color: var(--r-text); }\n.icon-muted  svg { color: var(--r-muted); }\n\n\/* =========================================================\n   LAYOUT PRIMITIVES\n   ========================================================= *\/\n.rw-s { max-width: var(--r-max); margin: 0 auto; padding: 96px 28px; position: relative; }\n.rw-s--tight { padding-top: 0; }\n\n.rw-kicker {\n  display: flex; align-items: baseline; gap: 10px;\n  font-family: var(--r-mono); font-size: .7rem; font-weight: 500;\n  letter-spacing: .16em; text-transform: uppercase; line-height: 1.6;\n  color: var(--r-muted); margin-bottom: 20px;\n}\n.rw-kicker::before { content: ''; flex: none; width: 22px; height: 1px; background: currentColor; opacity: .5; transform: translateY(-4px); }\n.rw-kicker--cyan { color: var(--r-cyan); }\n.rw-kicker--violet { color: var(--r-violet); }\n.rw-kicker--amber { color: var(--r-amber); }\n\n.rw-h2 { font-size: clamp(1.85rem, 3.2vw, 2.6rem); margin-bottom: 18px; text-wrap: balance; }\n.rw-lead { max-width: 68ch; font-size: 1.0625rem; color: var(--r-body); margin: 0 0 44px; }\n.rw-section-head { margin-bottom: 44px; }\n\n\/* =========================================================\n   ATOMS\n   ========================================================= *\/\n.rw-pill {\n  display: inline-flex; align-items: center; gap: 6px;\n  padding: 5px 11px; border-radius: 999px;\n  border: 1px solid var(--r-line-2); background: rgba(255,255,255,.03);\n  color: var(--r-body);\n  font-family: var(--r-mono); font-size: .68rem; font-weight: 500;\n  letter-spacing: .06em; text-transform: uppercase; white-space: nowrap;\n}\n.rw-pill--cyan   { color: var(--r-cyan);   border-color: rgba(53,214,238,.28);  background: var(--r-cyan-soft); }\n.rw-pill--violet { color: var(--r-violet); border-color: rgba(166,139,250,.28); background: var(--r-violet-soft); }\n.rw-pill--amber  { color: var(--r-amber);  border-color: rgba(240,194,75,.28);  background: var(--r-amber-soft); }\n.rw-pill--green  { color: var(--r-green);  border-color: rgba(74,222,128,.28);  background: var(--r-green-soft); }\n.rw-platform-row { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 26px; }\n\n.rw-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex-shrink: 0; }\n.rw-dot--live { background: var(--r-green); animation: rwPulse 2.4s ease-out infinite; }\n@keyframes rwPulse {\n  0%   { box-shadow: 0 0 0 0 rgba(74,222,128,.45); }\n  70%  { box-shadow: 0 0 0 7px rgba(74,222,128,0); }\n  100% { box-shadow: 0 0 0 0 rgba(74,222,128,0); }\n}\n\n.rw-btn {\n  display: inline-flex; align-items: center; justify-content: center; gap: 9px;\n  padding: 13px 22px; border-radius: var(--r-r-sm);\n  font-family: var(--r-sans); font-size: .9375rem; font-weight: 600;\n  letter-spacing: -0.01em; cursor: pointer; border: 1px solid transparent;\n  transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;\n}\n.rw-btn .rw-btn-icon { transition: transform .18s ease; }\n.rw-btn:hover .rw-btn-icon { transform: translateX(3px); }\n.rw-btn--primary { background: var(--r-cyan); color: #04161a; }\n.rw-btn--primary:hover { background: #5ee2f6; transform: translateY(-1px); }\n.rw-btn--primary .icon svg { color: #04161a; }\n.rw-btn--ghost { background: rgba(255,255,255,.04); border-color: var(--r-line-2); color: var(--r-text); }\n.rw-btn--ghost:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.22); transform: translateY(-1px); }\n.rw-btn--sm { padding: 10px 16px; font-size: .875rem; }\n.rw-btn--lg { padding: 16px 28px; font-size: 1rem; }\n\n.rw-textlink { display: inline-flex; align-items: center; gap: 7px; font-weight: 600; font-size: .9375rem; color: var(--r-text); transition: color .18s ease; }\n.rw-textlink span { transition: transform .18s ease; }\n.rw-textlink:hover { color: var(--r-cyan); }\n.rw-textlink:hover span { transform: translateX(3px); }\n\n\/* =========================================================\n   HERO\n   ========================================================= *\/\n.rw-hero {\n  position: relative; overflow: hidden;\n  border-bottom: 1px solid var(--r-line);\n  background:\n    radial-gradient(900px 500px at 12% -10%, rgba(53,214,238,.10), transparent 60%),\n    radial-gradient(760px 460px at 88% 8%, rgba(166,139,250,.10), transparent 62%),\n    var(--r-bg);\n}\n.rw-hero::before {\n  content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 0;\n  background-image:\n    linear-gradient(rgba(255,255,255,.022) 1px, transparent 1px),\n    linear-gradient(90deg, rgba(255,255,255,.022) 1px, transparent 1px);\n  background-size: 64px 64px;\n  mask-image: radial-gradient(ellipse 90% 70% at 50% 25%, #000 30%, transparent 78%);\n  -webkit-mask-image: radial-gradient(ellipse 90% 70% at 50% 25%, #000 30%, transparent 78%);\n}\n.rw-hero-inner {\n  position: relative; z-index: 1;\n  max-width: var(--r-max); margin: 0 auto; padding: 88px 28px 80px;\n  display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr);\n  gap: 64px; align-items: center;\n}\n.rw-hero-mark {\n  display: flex; align-items: center; gap: 20px; margin-bottom: 28px;\n}\n\/* App-icon scale: the mark carries the brand, the badge sits beside it. *\/\n.rw-logo-tile {\n  position: relative; flex-shrink: 0;\n  width: clamp(112px, 11vw, 156px); height: clamp(112px, 11vw, 156px);\n  border-radius: clamp(22px, 2.2vw, 32px); overflow: hidden;\n  border: 1px solid var(--r-line-2);\n  background: radial-gradient(120% 120% at 30% 12%, rgba(53,214,238,.10), transparent 62%), var(--r-surface);\n  box-shadow: var(--r-shadow);\n}\n.rw-logo-tile img { width: 100%; height: 100%; object-fit: cover; position: relative; z-index: 1; }\n.rw-logo-fallback {\n  position: absolute; inset: 0; display: grid; place-items: center;\n  font-family: var(--r-display); font-size: clamp(2.4rem, 4vw, 3.4rem); font-weight: 700;\n  letter-spacing: -0.05em; color: var(--r-cyan);\n}\n.rw-hero-badge {\n  display: inline-flex; align-items: center; gap: 10px;\n  padding: 6px 14px 6px 10px;\n  border: 1px solid var(--r-line-2); border-radius: 999px;\n  background: rgba(255,255,255,.035);\n  font-family: var(--r-mono); font-size: .72rem; letter-spacing: .04em; color: var(--r-body);\n}\n.rw-hero-badge b { color: var(--r-text); font-weight: 600; }\n.rw-hero-badge .sep { width: 1px; height: 12px; background: var(--r-line-2); }\n\n.rw-hero-h1 {\n  font-size: clamp(2.2rem, 4.4vw, 3.35rem);\n  line-height: 1.1; letter-spacing: -0.035em; font-weight: 700;\n  margin: 0 0 20px; text-wrap: balance;\n}\n.rw-hero-h1 em {\n  font-style: normal;\n  background: linear-gradient(100deg, var(--r-cyan) 0%, var(--r-violet) 100%);\n  -webkit-background-clip: text; background-clip: text;\n  -webkit-text-fill-color: transparent; color: var(--r-cyan);\n}\n.rw-hero-desc { font-size: 1.09rem; color: var(--r-body); max-width: 56ch; margin: 0 0 26px; }\n.rw-hero-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 22px; }\n.rw-hero-note {\n  display: flex; align-items: flex-start; gap: 9px;\n  font-family: var(--r-mono); font-size: .78rem; color: var(--r-muted);\n  border-top: 1px solid var(--r-line); padding-top: 18px; margin-top: 4px;\n}\n.rw-hero-note .tick { color: var(--r-cyan); flex-shrink: 0; }\n\n.rw-frame {\n  border: 1px solid var(--r-line-2); border-radius: var(--r-r-lg);\n  background: linear-gradient(180deg, var(--r-surface-2), var(--r-surface));\n  box-shadow: var(--r-shadow); overflow: hidden;\n}\n.rw-frame__bar { display: flex; align-items: center; gap: 8px; padding: 11px 14px; border-bottom: 1px solid var(--r-line); background: rgba(255,255,255,.02); }\n.rw-frame__dots { display: flex; gap: 6px; }\n.rw-frame__dots i { width: 9px; height: 9px; border-radius: 50%; background: rgba(255,255,255,.14); display: block; }\n.rw-frame__label { margin-left: 6px; font-family: var(--r-mono); font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; color: var(--r-muted); }\n.rw-frame__body { position: relative; aspect-ratio: 1 \/ 1; background: radial-gradient(600px 320px at 50% 30%, rgba(53,214,238,.10), transparent 70%), var(--r-bg-2); }\n.rw-frame__body img { width: 100%; height: 100%; object-fit: cover; position: relative; z-index: 1; }\n.rw-frame__fallback { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: var(--r-display); font-size: clamp(1.6rem, 4vw, 2.4rem); font-weight: 700; letter-spacing: -0.03em; color: rgba(255,255,255,.10); }\n.rw-hero-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }\n\n\/* =========================================================\n   STATS STRIP\n   ========================================================= *\/\n.rw-strip { border-bottom: 1px solid var(--r-line); background: var(--r-bg-2); }\n.rw-strip-inner { max-width: var(--r-max); margin: 0 auto; padding: 0 28px; display: grid; grid-template-columns: repeat(4, 1fr); }\n.rw-strip-cell { padding: 34px 20px; border-right: 1px solid var(--r-line); }\n.rw-strip-cell:first-child { padding-left: 0; }\n.rw-strip-cell:last-child { border-right: none; }\n.rw-strip-val {\n  font-family: var(--r-display); font-size: clamp(1.35rem, 2.2vw, 1.8rem);\n  font-weight: 700; letter-spacing: -0.03em; line-height: 1.15; color: var(--r-text);\n  margin-bottom: 6px; text-wrap: balance; font-variant-numeric: tabular-nums;\n}\n.rw-strip-val--cyan { color: var(--r-cyan); }\n.rw-strip-val--violet { color: var(--r-violet); }\n.rw-strip-val--amber { color: var(--r-amber); }\n.rw-strip-label { font-family: var(--r-mono); font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: var(--r-muted); line-height: 1.5; }\n\n\/* =========================================================\n   BENTO FEATURE GRID\n   ========================================================= *\/\n.bento-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 20px; }\n.bento-card {\n  position: relative; display: flex; flex-direction: column;\n  padding: 34px 32px; border: 1px solid var(--r-line);\n  border-radius: var(--r-r-lg); background: var(--r-surface);\n  transition: border-color .22s ease, transform .22s ease, box-shadow .22s ease;\n}\n.bento-card::before { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .22s ease; }\n.bento-card:hover { transform: translateY(-3px); box-shadow: var(--r-shadow); }\n.bento-card:hover::before { opacity: 1; }\n.bento-card > * { position: relative; z-index: 1; }\n\/* .bento-card is a column flexbox, so an inline-flex pill would stretch to\n   the full card width without this. *\/\n.bento-card > .rw-pill, .bento-card > .rw-btn { align-self: flex-start; }\n.bento-card h2 { font-size: clamp(1.35rem, 2.2vw, 1.75rem); letter-spacing: -0.028em; margin-bottom: 14px; }\n.bento-card p { color: var(--r-body); font-size: .98rem; }\n\n.bento-netplay { grid-column: span 12; }\n.bento-netplay::before { background: radial-gradient(620px 280px at 82% 110%, rgba(166,139,250,.10), transparent 65%); }\n.bento-netplay:hover { border-color: rgba(166,139,250,.32); }\n.bento-ra { grid-column: span 7; }\n.bento-ra::before { background: radial-gradient(520px 240px at 12% 0%, rgba(240,194,75,.09), transparent 65%); }\n.bento-ra:hover { border-color: rgba(240,194,75,.32); }\n.bento-cores { grid-column: span 5; }\n.bento-cores::before { background: radial-gradient(520px 240px at 88% 0%, rgba(53,214,238,.10), transparent 65%); }\n.bento-cores:hover { border-color: rgba(53,214,238,.32); }\n.bento-library { grid-column: span 12; }\n.bento-library::before { background: radial-gradient(620px 260px at 50% 0%, rgba(53,214,238,.06), transparent 68%); }\n.bento-library:hover { border-color: var(--r-line-2); }\n\n.bento-head { display: flex; align-items: center; gap: 11px; margin-bottom: 16px; }\n.bento-icon { width: 38px; height: 38px; border-radius: 10px; flex-shrink: 0; display: grid; place-items: center; border: 1px solid var(--r-line-2); }\n.bento-icon--cyan   { background: var(--r-cyan-soft);   border-color: rgba(53,214,238,.28); }\n.bento-icon--violet { background: var(--r-violet-soft); border-color: rgba(166,139,250,.28); }\n.bento-icon--amber  { background: var(--r-amber-soft);  border-color: rgba(240,194,75,.28); }\n.bento-icon--plain  { background: rgba(255,255,255,.04); }\n\n\/* Netplay split + node diagram *\/\n.netplay-split { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.85fr); gap: 48px; align-items: center; }\n.netplay-split-text .rw-btn { align-self: flex-start; margin-top: 6px; }\n.cp-nodes {\n  display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px;\n  align-items: center; justify-items: center; position: relative;\n}\n.cp-node {\n  width: 100%; display: flex; align-items: center; gap: 10px;\n  padding: 14px 16px; border-radius: var(--r-r-md);\n  border: 1px solid var(--r-line); background: var(--r-bg-2);\n  font-family: var(--r-mono); font-size: .7rem; letter-spacing: .08em;\n  text-transform: uppercase; color: var(--r-body);\n}\n.cp-node--xbox { border-color: rgba(74,222,128,.25); background: var(--r-green-soft); color: var(--r-green); }\n.cp-center {\n  grid-column: span 2; display: flex; align-items: center; justify-content: center; gap: 12px;\n  padding: 18px; border-radius: var(--r-r-md);\n  background: linear-gradient(135deg, rgba(166,139,250,.18), rgba(53,214,238,.14));\n  border: 1px dashed rgba(166,139,250,.45); color: var(--r-text);\n}\n.cp-center .label { font-family: var(--r-mono); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--r-violet); }\n\n\/* RetroAchievements badges *\/\n.ra-features { display: grid; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); gap: 14px; margin-top: 26px; }\n.ra-badge {\n  display: flex; flex-direction: column; align-items: flex-start; gap: 10px;\n  padding: 18px 16px; border-radius: var(--r-r-md);\n  border: 1px solid var(--r-line); background: var(--r-bg-2);\n  transition: border-color .2s ease, background .2s ease;\n}\n.ra-badge:hover { border-color: var(--r-line-2); background: var(--r-surface-2); }\n.ra-badge .ra-ring { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; border: 1px solid currentColor; }\n.ra-badge h4 { font-size: .875rem; font-weight: 600; letter-spacing: -0.015em; }\n\n\/* On-demand cores visual *\/\n.cores-visual {\n  margin-top: auto; padding-top: 26px; display: flex; align-items: center; justify-content: center;\n}\n.cores-visual .icon { color: var(--r-cyan); width: 78px; height: 78px; opacity: .85; }\n.cores-visual .icon svg { color: var(--r-cyan); }\n\n\/* Library feature tiles *\/\n.library-features { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; margin-top: 26px; }\n.library-feature { padding: 22px 20px; border-radius: var(--r-r-md); border: 1px solid var(--r-line); background: var(--r-bg-2); transition: border-color .2s ease, background .2s ease; }\n.library-feature:hover { border-color: var(--r-line-2); background: var(--r-surface-2); }\n.library-feature .icon { margin-bottom: 14px; }\n.library-feature h4 { font-size: .95rem; margin-bottom: 4px; letter-spacing: -0.015em; }\n.library-feature p { font-size: .85rem; color: var(--r-muted); margin: 0; line-height: 1.55; }\n\n\/* =========================================================\n   COMPATIBILITY\n   ========================================================= *\/\n.clarity-grid { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: 20px; }\n.clarity-box { padding: 32px 30px; border: 1px solid var(--r-line); border-radius: var(--r-r-lg); background: var(--r-surface); }\n.clarity-box h3 { display: flex; align-items: center; gap: 11px; font-size: 1.25rem; letter-spacing: -0.025em; margin-bottom: 8px; }\n.clarity-box .clarity-sub { font-size: .9rem; color: var(--r-muted); margin-bottom: 24px; }\n\n.hardware-list { display: grid; gap: 10px; }\n.hardware-item {\n  display: flex; align-items: center; gap: 12px;\n  padding: 14px 16px; border-radius: var(--r-r-md);\n  border: 1px solid var(--r-line); background: var(--r-bg-2);\n  font-size: .9375rem; font-weight: 500; color: var(--r-text);\n  transition: border-color .2s ease, background .2s ease;\n}\n.hardware-item:hover { border-color: var(--r-line-2); background: var(--r-surface-2); }\n.hardware-item .meta { margin-left: auto; font-family: var(--r-mono); font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; color: var(--r-muted); }\n\n.systems-cloud { display: flex; flex-wrap: wrap; gap: 9px; }\n.system-tag {\n  padding: 8px 14px; border-radius: 999px;\n  border: 1px solid var(--r-line); background: var(--r-bg-2);\n  font-size: .85rem; font-weight: 500; color: var(--r-body);\n  transition: border-color .2s ease, background .2s ease, color .2s ease;\n}\n.system-tag:hover { border-color: var(--r-line-2); background: var(--r-surface-2); color: var(--r-text); }\n.system-tag.is-new { border-color: rgba(53,214,238,.3); background: var(--r-cyan-soft); color: var(--r-cyan); }\n.system-tag.is-featured { border-color: rgba(240,194,75,.26); background: var(--r-amber-soft); color: var(--r-amber); }\n\n\/* =========================================================\n   GALLERY + LIGHTBOX\n   ========================================================= *\/\n.gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }\n.gallery-item {\n  aspect-ratio: 16 \/ 10; border-radius: var(--r-r-md); overflow: hidden;\n  border: 1px solid var(--r-line); background: var(--r-bg-2); cursor: zoom-in;\n  transition: border-color .22s ease, transform .22s ease;\n}\n.gallery-item:hover { border-color: rgba(53,214,238,.32); transform: translateY(-2px); }\n.gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }\n.gallery-item:hover img { transform: scale(1.04); }\n\n.lightbox {\n  display: none; position: fixed; inset: 0; z-index: 9999;\n  background: rgba(4,5,7,.94); backdrop-filter: blur(6px);\n  justify-content: center; align-items: center; padding: 32px;\n}\n.lightbox-content { max-width: 92%; max-height: 86vh; border-radius: var(--r-r-md); border: 1px solid rgba(255,255,255,.12); }\n.lightbox-close {\n  position: absolute; top: 20px; right: 24px; width: 44px; height: 44px;\n  display: flex; align-items: center; justify-content: center;\n  font-size: 1.8rem; line-height: 1; color: #e8eaf0; cursor: pointer;\n  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: 50%;\n  transition: background .18s ease;\n}\n.lightbox-close:hover { background: rgba(255,255,255,.14); }\n\n\/* =========================================================\n   DOWNLOAD SECTION\n   ========================================================= *\/\n.download-section { border-top: 1px solid var(--r-line); border-bottom: 1px solid var(--r-line); background: var(--r-bg-2); }\n.download-inner { max-width: var(--r-max); margin: 0 auto; padding: 88px 28px; }\n.download-buttons { display: grid; grid-template-columns: repeat(auto-fit, minmax(232px, 1fr)); gap: 14px; margin-bottom: 18px; }\n.download-btn {\n  display: flex; align-items: center; gap: 14px;\n  padding: 20px 22px; border-radius: var(--r-r-md);\n  border: 1px solid var(--r-line); background: var(--r-surface);\n  color: var(--r-text); transition: border-color .2s ease, background .2s ease, transform .2s ease;\n}\n.download-btn:hover { border-color: rgba(53,214,238,.4); background: var(--r-surface-2); transform: translateY(-2px); }\n.download-btn .db-text { display: flex; flex-direction: column; min-width: 0; }\n.download-btn .db-os { font-family: var(--r-display); font-size: 1rem; font-weight: 600; letter-spacing: -0.02em; }\n.download-btn .db-meta { font-family: var(--r-mono); font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; color: var(--r-muted); }\n.download-btn .db-arrow { margin-left: auto; color: var(--r-muted); transition: transform .2s ease, color .2s ease; }\n.download-btn:hover .db-arrow { transform: translateY(2px); color: var(--r-cyan); }\n.download-btn--xbox:hover { border-color: rgba(74,222,128,.4); }\n.download-btn--xbox:hover .db-arrow { color: var(--r-green); }\n\n.download-note { font-family: var(--r-mono); font-size: .74rem; color: var(--r-muted); letter-spacing: .03em; }\n\n.stats-breakdown { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 34px; }\n.stat-item {\n  display: flex; align-items: center; gap: 12px;\n  padding: 18px 20px; border-radius: var(--r-r-md);\n  border: 1px solid var(--r-line); background: var(--r-surface);\n}\n.stat-item .st-text { display: flex; flex-direction: column; min-width: 0; }\n.stat-value { font-family: var(--r-display); font-size: 1.2rem; font-weight: 700; letter-spacing: -0.025em; color: var(--r-text); line-height: 1.2; font-variant-numeric: tabular-nums; }\n.stat-label { font-family: var(--r-mono); font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; color: var(--r-muted); }\n\n\/* =========================================================\n   RELEASE NOTES\n   ========================================================= *\/\n.info-grid { display: grid; grid-template-columns: minmax(0,1fr); gap: 20px; }\n.info-card { padding: 34px 32px; border: 1px solid var(--r-line); border-radius: var(--r-r-lg); background: var(--r-surface); }\n.changelog-item { padding: 24px 26px; border-radius: var(--r-r-md); border: 1px solid var(--r-line); border-left: 2px solid var(--r-cyan); background: var(--r-bg-2); }\n.changelog-version { font-family: var(--r-display); font-size: 1.15rem; font-weight: 700; letter-spacing: -0.025em; color: var(--r-cyan); margin-bottom: 16px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; }\n.changelog-version .date { font-family: var(--r-mono); font-size: .72rem; font-weight: 400; letter-spacing: .06em; color: var(--r-muted); }\n.changelog-details { display: grid; gap: 10px; }\n.changelog-details li { position: relative; padding-left: 20px; font-size: .9375rem; color: var(--r-body); line-height: 1.6; }\n.changelog-details li::before { content: '\u25b8'; position: absolute; left: 0; top: 0; font-size: .7rem; line-height: 1.9; color: var(--r-amber); }\n.changelog-details li a { color: var(--r-cyan); border-bottom: 1px solid rgba(53,214,238,.3); }\n.changelog-foot { display: flex; justify-content: center; margin-top: 24px; }\n\n\/* =========================================================\n   ATTRIBUTION\n   ========================================================= *\/\n.project-attribution { border-top: 1px solid var(--r-line); background: var(--r-bg); }\n.attribution-inner { max-width: var(--r-max); margin: 0 auto; padding: 52px 28px 64px; text-align: center; }\n.attribution-mark { font-family: var(--r-display); font-size: 1.35rem; font-weight: 700; letter-spacing: -0.04em; color: var(--r-text); margin-bottom: 14px; }\n.attribution-mark span { color: var(--r-cyan); }\n.attribution-inner p { font-size: .9375rem; color: var(--r-body); max-width: 68ch; margin: 0 auto .5em; }\n.attribution-inner .fine { font-size: .85rem; color: var(--r-muted); }\n.attribution-inner a { color: var(--r-cyan); }\n.attribution-inner a:hover { text-decoration: underline; }\n\n\/* =========================================================\n   RESPONSIVE\n   ========================================================= *\/\n@media (max-width: 1024px) {\n  .bento-ra, .bento-cores { grid-column: span 12; }\n  .clarity-grid { grid-template-columns: 1fr; }\n  .netplay-split { grid-template-columns: 1fr; gap: 32px; }\n  .stats-breakdown { grid-template-columns: repeat(2, 1fr); }\n}\n@media (max-width: 960px) {\n  .rw-hero-inner { grid-template-columns: 1fr; gap: 44px; padding: 68px 24px 60px; }\n  .rw-hero-visual { max-width: 480px; }\n  .rw-s { padding: 72px 24px; }\n  .download-inner { padding: 72px 24px; }\n  .rw-strip-inner { grid-template-columns: repeat(2, 1fr); padding: 0 24px; }\n  .rw-strip-cell { padding: 26px 18px; }\n  .rw-strip-cell:nth-child(odd) { padding-left: 0; }\n  .rw-strip-cell:nth-child(even) { border-right: none; }\n  .rw-strip-cell:nth-child(3), .rw-strip-cell:nth-child(4) { border-top: 1px solid var(--r-line); }\n}\n@media (max-width: 620px) {\n  .bento-head { flex-direction: column; align-items: flex-start; gap: 14px; }\n  .clarity-box h3 { flex-direction: column; align-items: flex-start; gap: 12px; }\n  .rw-kicker { font-size: .65rem; letter-spacing: .12em; }\n  .rw-s, .download-inner, .rw-hero-inner, .attribution-inner { padding-left: 20px; padding-right: 20px; }\n  .rw-strip-inner { padding: 0 20px; }\n  .rw-strip-val { font-size: 1.15rem; }\n  .rw-hero-mark { flex-wrap: wrap; gap: 16px; }\n  .rw-logo-tile { width: 96px; height: 96px; border-radius: 20px; }\n  .rw-logo-fallback { font-size: 2.1rem; }\n  .bento-card, .clarity-box, .info-card { padding: 26px 22px; }\n  .rw-hero-cta { flex-direction: column; align-items: stretch; }\n  .rw-hero-cta .rw-btn { width: 100%; }\n  .cp-nodes { grid-template-columns: 1fr; }\n  .cp-center { grid-column: span 1; }\n  .stats-breakdown { grid-template-columns: 1fr; }\n  .gallery-grid { grid-template-columns: 1fr; }\n  .changelog-item { padding: 20px; }\n}\n@media (prefers-reduced-motion: reduce) {\n  .Rec0m88-container *, .Rec0m88-container *::before, .Rec0m88-container *::after {\n    animation-duration: .001ms !important; animation-iteration-count: 1 !important;\n    transition-duration: .001ms !important;\n  }\n}\n<\/style>\n\n<div class=\"Rec0m88-container\">\n\n  <!-- ==================== SVG ICON SPRITE ==================== -->\n  <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"display:none;\" aria-hidden=\"true\" focusable=\"false\">\n    <defs>\n      <symbol id=\"icon-windows\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M3 5.5L10.5 4.3V11.4H3V5.5ZM3 18.5V12.6H10.5V19.7L3 18.5ZM11.5 4.1L21 2.5V11.4H11.5V4.1ZM11.5 12.6H21V21.5L11.5 19.9V12.6Z\"><\/path><\/symbol>\n      <symbol id=\"icon-apple\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M18.71 19.5C17.88 20.74 17 21.95 15.66 21.97C14.32 22 13.89 21.18 12.37 21.18C10.84 21.18 10.37 21.95 9.1 22C7.79 22.05 6.8 20.68 5.96 19.47C4.25 17 2.94 12.45 4.7 9.39C5.57 7.87 7.13 6.91 8.82 6.88C10.1 6.86 11.32 7.75 12.11 7.75C12.89 7.75 14.37 6.68 15.92 6.84C16.57 6.87 18.39 7.1 19.56 8.82C19.47 8.88 17.39 10.1 17.41 12.63C17.44 15.65 20.06 16.66 20.09 16.67C20.06 16.74 19.67 18.11 18.71 19.5ZM13 3.5C13.73 2.67 14.94 2.04 15.94 2C16.07 3.17 15.6 4.35 14.9 5.19C14.21 6.04 13.07 6.7 11.95 6.61C11.8 5.46 12.36 4.26 13 3.5Z\"><\/path><\/symbol>\n      <symbol id=\"icon-linux\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M12.5 2C10.29 2 8.5 3.79 8.5 6C8.5 6.68 8.66 7.32 8.94 7.89L8.5 9L6.5 9C5.67 9 5 9.67 5 10.5C5 11.33 5.67 12 6.5 12H7.34L6.11 14.46C5.42 15.84 5 17.37 5 19C5 20.1 5.9 21 7 21H17C18.1 21 19 20.1 19 19C19 17.37 18.58 15.84 17.89 14.46L16.66 12H17.5C18.33 12 19 11.33 19 10.5C19 9.67 18.33 9 17.5 9H15.5L15.06 7.89C15.34 7.32 15.5 6.68 15.5 6C15.5 3.79 13.71 2 12.5 2ZM10.5 6C10.5 5.45 10.95 5 11.5 5C12.05 5 12.5 5.45 12.5 6C12.5 6.55 12.05 7 11.5 7C10.95 7 10.5 6.55 10.5 6ZM13.5 6C13.5 5.45 13.95 5 14.5 5C15.05 5 15.5 5.45 15.5 6C15.5 6.55 15.05 7 14.5 7C13.95 7 13.5 6.55 13.5 6ZM10 16C9.45 16 9 15.55 9 15C9 14.45 9.45 14 10 14C10.55 14 11 14.45 11 15C11 15.55 10.55 16 10 16ZM14 16C13.45 16 13 15.55 13 15C13 14.45 13.45 14 14 14C14.55 14 15 14.45 15 15C15 15.55 14.55 16 14 16Z\"><\/path><\/symbol>\n      <symbol id=\"icon-xbox\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M12 2a10 10 0 1 0 10 10A10 10 0 0 0 12 2Zm-1.8 14.8c-2.4-.6-4.4-2.5-5.3-4.9.4.2.9.4 1.4.4 1.7 0 3.2-1 3.8-2.4l1.7 2.5c1 1.4 1.4 2.8 1.4 4.2 0 .1-.2.2-.6.3l-.4-.1Zm7.5-4.4c-1.1 2.6-3.4 4.6-6.2 5.1v-.4c0-1.5.5-3 1.5-4.3l1.9-2.8c.7-1.5 2.3-2.4 4.1-2.4.4 0 .8 0 1.2-.2a8.2 8.2 0 0 1-2.5 4.3v.7Zm-6.8-8.1c2.3.8 4.1 2.7 4.8 5.1a5 5 0 0 0-3.5-1.3 5.3 5.3 0 0 0-4.1 2L7 8.5c-.6-.9-1.6-1.6-2.7-1.9a8.4 8.4 0 0 1 6.5-5.4l.4.1Z\"><\/path><\/symbol>\n      <symbol id=\"icon-netplay\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"2\" y=\"6\" width=\"20\" height=\"12\" rx=\"3\"><\/rect><circle cx=\"8\" cy=\"12\" r=\"2\"><\/circle><circle cx=\"16\" cy=\"10\" r=\"1\"><\/circle><circle cx=\"16\" cy=\"14\" r=\"1\"><\/circle><path d=\"M12 9v6\"><\/path><\/symbol>\n      <symbol id=\"icon-devices\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"2\" y=\"3\" width=\"14\" height=\"11\" rx=\"2\"><\/rect><rect x=\"16\" y=\"8\" width=\"6\" height=\"13\" rx=\"1\"><\/rect><line x1=\"9\" y1=\"17\" x2=\"9\" y2=\"20\"><\/line><line x1=\"5\" y1=\"20\" x2=\"13\" y2=\"20\"><\/line><line x1=\"18\" y1=\"18\" x2=\"20\" y2=\"18\"><\/line><\/symbol>\n      <symbol id=\"icon-controller\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M6 11h4M8 9v4\"><\/path><circle cx=\"17\" cy=\"10\" r=\"1\" fill=\"currentColor\"><\/circle><circle cx=\"15\" cy=\"12\" r=\"1\" fill=\"currentColor\"><\/circle><path d=\"M17.32 5H6.68a4 4 0 0 0-3.978 3.59c-.006.052-.01.101-.017.152C2.604 9.416 2 14.456 2 16a3 3 0 0 0 3 3c1.652 0 2.72-.97 3.678-2.166.27-.336.558-.663.862-.977A1.977 1.977 0 0 1 10.95 15h2.1a1.977 1.977 0 0 1 1.41.857c.304.314.591.641.862.977C16.28 18.03 17.348 19 19 19a3 3 0 0 0 3-3c0-1.544-.604-6.584-.685-7.258-.007-.05-.011-.1-.017-.152A4 4 0 0 0 17.32 5z\"><\/path><\/symbol>\n      <symbol id=\"icon-download\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4\"><\/path><polyline points=\"7 10 12 15 17 10\"><\/polyline><line x1=\"12\" y1=\"15\" x2=\"12\" y2=\"3\"><\/line><\/symbol>\n      <symbol id=\"icon-book\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M4 19.5A2.5 2.5 0 0 1 6.5 17H20\"><\/path><path d=\"M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z\"><\/path><line x1=\"8\" y1=\"7\" x2=\"16\" y2=\"7\"><\/line><line x1=\"8\" y1=\"11\" x2=\"14\" y2=\"11\"><\/line><\/symbol>\n      <symbol id=\"icon-library\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z\"><\/path><line x1=\"12\" y1=\"11\" x2=\"12\" y2=\"17\"><\/line><line x1=\"9\" y1=\"14\" x2=\"15\" y2=\"14\"><\/line><\/symbol>\n      <symbol id=\"icon-image\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"><\/rect><circle cx=\"8.5\" cy=\"8.5\" r=\"1.5\"><\/circle><polyline points=\"21 15 16 10 5 21\"><\/polyline><\/symbol>\n      <symbol id=\"icon-star\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polygon points=\"12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2\"><\/polygon><\/symbol>\n      <symbol id=\"icon-search\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"11\" cy=\"11\" r=\"8\"><\/circle><line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\"><\/line><\/symbol>\n      <symbol id=\"icon-organize\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"3\" width=\"7\" height=\"7\" rx=\"1\"><\/rect><rect x=\"14\" y=\"3\" width=\"7\" height=\"7\" rx=\"1\"><\/rect><rect x=\"14\" y=\"14\" width=\"7\" height=\"7\" rx=\"1\"><\/rect><rect x=\"3\" y=\"14\" width=\"7\" height=\"7\" rx=\"1\"><\/rect><\/symbol>\n      <symbol id=\"icon-key\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M21 2l-2 2m-7.61 7.61a5.5 5.5 0 1 1-7.778 7.778 5.5 5.5 0 0 1 7.777-7.777zm0 0L15.5 7.5m0 0l3 3L22 7l-3-3m-3.5 3.5L19 4\"><\/path><\/symbol>\n      <symbol id=\"icon-cloud\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M4 14.899A7 7 0 1 1 15.71 8h1.79a4.5 4.5 0 0 1 2.5 8.242\"><\/path><path d=\"M12 12v9\"><\/path><path d=\"m8 17 4 4 4-4\"><\/path><\/symbol>\n      <symbol id=\"icon-flame\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M8.5 14.5A2.5 2.5 0 0 0 11 12c0-1.38-.5-2-1-3-1.072-2.143-.224-4.054 2-6 .5 2.5 2 4.9 4 6.5 2 1.6 3 3.5 3 5.5a7 7 0 1 1-14 0c0-1.153.433-2.294 1-3a2.5 2.5 0 0 0 2.5 2.5Z\"><\/path><\/symbol>\n      <symbol id=\"icon-trophy\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M6 9H4.5a2.5 2.5 0 0 1 0-5H6\"><\/path><path d=\"M18 9h1.5a2.5 2.5 0 0 0 0-5H18\"><\/path><path d=\"M4 22h16\"><\/path><path d=\"M10 14.66V17c0 .55-.47.98-.97 1.21C7.85 18.75 7 20.24 7 22\"><\/path><path d=\"M14 14.66V17c0 .55.47.98.97 1.21C16.15 18.75 17 20.24 17 22\"><\/path><path d=\"M18 2H6v7a6 6 0 0 0 12 0V2Z\"><\/path><\/symbol>\n      <symbol id=\"icon-overlay\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"2\" y=\"4\" width=\"20\" height=\"14\" rx=\"2\"><\/rect><path d=\"M8 21h8\"><\/path><path d=\"M12 18v3\"><\/path><rect x=\"5\" y=\"7\" width=\"7\" height=\"4\" rx=\"1\"><\/rect><\/symbol>\n      <symbol id=\"icon-offline\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M2 8.5a16 16 0 0 1 20 0\"><\/path><path d=\"M5 12.5a11 11 0 0 1 14 0\"><\/path><path d=\"M8.5 16.4a6 6 0 0 1 7 0\"><\/path><circle cx=\"12\" cy=\"20\" r=\"1\" fill=\"currentColor\"><\/circle><\/symbol>\n      <symbol id=\"icon-link\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71\"><\/path><path d=\"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71\"><\/path><\/symbol>\n    <\/defs>\n  <\/svg>\n\n  <!-- ==================== HERO ==================== -->\n  <section class=\"rw-hero\">\n    <div class=\"rw-hero-inner\">\n\n      <div class=\"rw-hero-copy\">\n        <div class=\"rw-hero-mark\">\n          <span class=\"rw-logo-tile\">\n            <span class=\"rw-logo-fallback\" aria-hidden=\"true\">R<\/span>\n            <img src=\"https:\/\/rec0m88.com\/wp-content\/uploads\/2026\/01\/Rec0m88.png\" alt=\"Rec0m88 logo\" width=\"52\" height=\"52\" loading=\"eager\" decoding=\"async\">\n          <\/span>\n          <div class=\"rw-hero-badge\">\n            <span class=\"rw-dot rw-dot--live\"><\/span>\n            <b>Rec0m88<\/b>\n            <span class=\"sep\"><\/span>\n            <span id=\"hero-version-text\">Free \u00b7 all platforms<\/span>\n          <\/div>\n        <\/div>\n\n        <h1 class=\"rw-hero-h1\">\n          Download<br>\n          <em>Rec0m88.<\/em>\n        <\/h1>\n\n        <p class=\"rw-hero-desc\">\n          The Rec0m88 retro gaming emulator, with WebRTC netplay, local Nintendo DS link play,\n          and RetroAchievements built in. Now with GameCube and Wii support. Auto-scan your\n          library, pull cores on demand, and play cross-platform on Windows, macOS, Linux,\n          and <strong>Xbox Series X|S<\/strong>.\n        <\/p>\n\n        <div class=\"rw-hero-cta\">\n          <a href=\"#download\" id=\"main-download-btn\" class=\"rw-btn rw-btn--primary rw-btn--lg\">\n            <span class=\"icon icon-md\"><svg><use href=\"#icon-download\"><\/use><\/svg><\/span>\n            <span>Detecting your OS\u2026<\/span>\n          <\/a>\n          <a href=\"https:\/\/rec0m88.com\/setup-rec0m88\" class=\"rw-btn rw-btn--ghost rw-btn--lg\">\n            <span class=\"icon icon-md icon-muted\"><svg><use href=\"#icon-book\"><\/use><\/svg><\/span>\n            <span>View setup guide<\/span>\n          <\/a>\n        <\/div>\n\n        <div class=\"rw-platform-row\">\n          <span class=\"rw-pill rw-pill--cyan\">Windows<\/span>\n          <span class=\"rw-pill rw-pill--cyan\">macOS<\/span>\n          <span class=\"rw-pill rw-pill--cyan\">Linux<\/span>\n          <span class=\"rw-pill rw-pill--green\">Xbox Series X|S<\/span>\n        <\/div>\n\n        <div class=\"rw-hero-note\">\n          <span class=\"tick\">\u25b8<\/span><span>Completely free \u2014 no account, no subscription, no paywall.<\/span>\n        <\/div>\n      <\/div>\n\n      <div class=\"rw-hero-visual\">\n        <div class=\"rw-frame\">\n          <div class=\"rw-frame__bar\">\n            <div class=\"rw-frame__dots\"><i><\/i><i><\/i><i><\/i><\/div>\n            <span class=\"rw-frame__label\">Rec0m88 \u00b7 Library<\/span>\n          <\/div>\n          <div class=\"rw-frame__body\">\n            <div class=\"rw-frame__fallback\">REC0M88<\/div>\n            <img src=\"https:\/\/rec0m88.com\/wp-content\/uploads\/2026\/02\/rec0m88-idle.png\"\n                 alt=\"The Rec0m88 emulator interface showing the game library\"\n                 width=\"1024\" height=\"1024\" loading=\"eager\" fetchpriority=\"high\" decoding=\"async\">\n          <\/div>\n        <\/div>\n        <div class=\"rw-hero-tags\">\n          <span class=\"rw-pill\">WebRTC netplay<\/span>\n          <span class=\"rw-pill\">DS link play<\/span>\n          <span class=\"rw-pill\">RetroAchievements<\/span>\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/section>\n\n  <!-- ==================== STATS STRIP ==================== -->\n  <div class=\"rw-strip\">\n    <div class=\"rw-strip-inner\">\n      <div class=\"rw-strip-cell\">\n        <div class=\"rw-strip-val rw-strip-val--cyan\" id=\"total-downloads\">\u2026<\/div>\n        <div class=\"rw-strip-label\">Total Rec0m88 Installs<\/div>\n      <\/div>\n      <div class=\"rw-strip-cell\">\n        <div class=\"rw-strip-val rw-strip-val--violet\">20<\/div>\n        <div class=\"rw-strip-label\">Supported Consoles<\/div>\n      <\/div>\n      <div class=\"rw-strip-cell\">\n        <div class=\"rw-strip-val rw-strip-val--amber\">4<\/div>\n        <div class=\"rw-strip-label\">Platforms<\/div>\n      <\/div>\n      <div class=\"rw-strip-cell\">\n        <div class=\"rw-strip-val\">Free<\/div>\n        <div class=\"rw-strip-label\">Always &amp; Forever<\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <!-- ==================== FEATURE BENTO ==================== -->\n  <section class=\"rw-s rw-cv\">\n    <div class=\"rw-section-head\">\n      <div class=\"rw-kicker rw-kicker--cyan\">What&#8217;s inside Rec0m88<\/div>\n      <h2 class=\"rw-h2\">Built for playing together<\/h2>\n      <p class=\"rw-lead\" style=\"margin-bottom:0;\">\n        Rec0m88 treats multiplayer, achievements, and library management as core features rather\n        than add-ons \u2014 all of it shipping in a single free install.\n      <\/p>\n    <\/div>\n\n    <div class=\"bento-grid\">\n\n      <!-- Netplay -->\n      <article class=\"bento-card bento-netplay\">\n        <div class=\"netplay-split\">\n          <div class=\"netplay-split-text\">\n            <div class=\"bento-head\">\n              <div class=\"bento-icon bento-icon--violet\"><span class=\"icon icon-md icon-violet\"><svg><use href=\"#icon-netplay\"><\/use><\/svg><\/span><\/div>\n              <h2>Cross-platform Rec0m88 netplay<\/h2>\n            <\/div>\n            <div class=\"rw-platform-row\" style=\"margin-bottom:18px;\">\n              <span class=\"rw-pill rw-pill--violet\">WebRTC<\/span>\n              <span class=\"rw-pill\">No port forwarding<\/span>\n              <span class=\"rw-pill\">Live lobby<\/span>\n            <\/div>\n            <p>\n              Play with friends no matter what hardware they own. Rec0m88 opens a direct WebRTC\n              connection between players \u2014 no relay server in the middle and no router settings to\n              touch. Host a game on your PC and have friends join from their Xbox, Mac, or Linux\n              machine, or browse active sessions in the Live Lobby and jump straight in.\n            <\/p>\n            <p style=\"margin-bottom:20px;\">\n              Local <strong>Nintendo DS link play<\/strong> works between machines too \u2014 Rec0m88\n              tunnels the DS wireless link layer over the same WebRTC connection.\n            <\/p>\n            <a href=\"https:\/\/rec0m88.com\/netplay-lobby\/\" class=\"rw-btn rw-btn--ghost rw-btn--sm\">\n              Explore Rec0m88 netplay <span class=\"rw-btn-icon\">\u2192<\/span>\n            <\/a>\n          <\/div>\n\n          <div class=\"netplay-split-visual\">\n            <div class=\"cp-nodes\">\n              <div class=\"cp-node\"><span class=\"icon icon-md icon-cyan\"><svg><use href=\"#icon-windows\"><\/use><\/svg><\/span>Windows<\/div>\n              <div class=\"cp-node\"><span class=\"icon icon-md icon-cyan\"><svg><use href=\"#icon-apple\"><\/use><\/svg><\/span>macOS<\/div>\n              <div class=\"cp-center\">\n                <span class=\"icon icon-lg icon-violet\"><svg><use href=\"#icon-link\"><\/use><\/svg><\/span>\n                <span class=\"label\">WebRTC peer link<\/span>\n              <\/div>\n              <div class=\"cp-node\"><span class=\"icon icon-md icon-cyan\"><svg><use href=\"#icon-linux\"><\/use><\/svg><\/span>Linux<\/div>\n              <div class=\"cp-node cp-node--xbox\"><span class=\"icon icon-md icon-green\"><svg><use href=\"#icon-xbox\"><\/use><\/svg><\/span>Xbox<\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/article>\n\n      <!-- RetroAchievements -->\n      <article class=\"bento-card bento-ra\">\n        <div class=\"bento-head\">\n          <div class=\"bento-icon bento-icon--amber\"><span class=\"icon icon-md icon-amber\"><svg><use href=\"#icon-star\"><\/use><\/svg><\/span><\/div>\n          <h2>RetroAchievements, natively<\/h2>\n        <\/div>\n        <p>\n          Prove your skills and track your mastery of the classics. Rec0m88 integrates with\n          RetroAchievements directly \u2014 no separate client, no manual setup.\n        <\/p>\n\n        <div class=\"ra-features\">\n          <div class=\"ra-badge\">\n            <span class=\"ra-ring\" style=\"color:var(--r-flame);\"><span class=\"icon icon-sm\"><svg style=\"color:var(--r-flame)\"><use href=\"#icon-flame\"><\/use><\/svg><\/span><\/span>\n            <h4>Hardcore mode<\/h4>\n          <\/div>\n          <div class=\"ra-badge\">\n            <span class=\"ra-ring\" style=\"color:var(--r-amber);\"><span class=\"icon icon-sm icon-amber\"><svg><use href=\"#icon-trophy\"><\/use><\/svg><\/span><\/span>\n            <h4>Leaderboards<\/h4>\n          <\/div>\n          <div class=\"ra-badge\">\n            <span class=\"ra-ring\" style=\"color:var(--r-cyan);\"><span class=\"icon icon-sm icon-cyan\"><svg><use href=\"#icon-overlay\"><\/use><\/svg><\/span><\/span>\n            <h4>In-game overlay<\/h4>\n          <\/div>\n          <div class=\"ra-badge\">\n            <span class=\"ra-ring\" style=\"color:var(--r-green);\"><span class=\"icon icon-sm icon-green\"><svg><use href=\"#icon-offline\"><\/use><\/svg><\/span><\/span>\n            <h4>Offline sync<\/h4>\n          <\/div>\n        <\/div>\n      <\/article>\n\n      <!-- On-demand cores -->\n      <article class=\"bento-card bento-cores\">\n        <div class=\"bento-head\">\n          <div class=\"bento-icon bento-icon--cyan\"><span class=\"icon icon-md icon-cyan\"><svg><use href=\"#icon-cloud\"><\/use><\/svg><\/span><\/div>\n          <h2>On-demand cores<\/h2>\n        <\/div>\n        <span class=\"rw-pill rw-pill--cyan\" style=\"margin-bottom:16px;\">New in Rec0m88<\/span>\n        <p>\n          Emulation cores no longer ship with the build, so the initial Rec0m88 install stays\n          small. Download only the systems you actually want, straight from inside the emulator.\n        <\/p>\n        <div class=\"cores-visual\">\n          <span class=\"icon\"><svg><use href=\"#icon-cloud\"><\/use><\/svg><\/span>\n        <\/div>\n      <\/article>\n\n      <!-- Library -->\n      <article class=\"bento-card bento-library\">\n        <div class=\"bento-head\">\n          <div class=\"bento-icon bento-icon--plain\"><span class=\"icon icon-md icon-white\"><svg><use href=\"#icon-library\"><\/use><\/svg><\/span><\/div>\n          <h2>Smart library organizer<\/h2>\n        <\/div>\n        <span class=\"rw-pill\" style=\"margin-bottom:16px;\">Zero-config<\/span>\n        <p>\n          Manage your ROMs inside Rec0m88. Set your folder once and the app scans everything in\n          the background. Games are matched against RAWG &amp; IGDB for cover art, ratings, and\n          metadata automatically.\n        <\/p>\n\n        <div class=\"library-features\">\n          <div class=\"library-feature\">\n            <span class=\"icon icon-lg icon-cyan\"><svg><use href=\"#icon-search\"><\/use><\/svg><\/span>\n            <h4>Auto-scan<\/h4>\n            <p>Finds every ROM across subfolders.<\/p>\n          <\/div>\n          <div class=\"library-feature\">\n            <span class=\"icon icon-lg icon-violet\"><svg><use href=\"#icon-image\"><\/use><\/svg><\/span>\n            <h4>Auto-match<\/h4>\n            <p>Cover art fetched automatically.<\/p>\n          <\/div>\n          <div class=\"library-feature\">\n            <span class=\"icon icon-lg icon-amber\"><svg><use href=\"#icon-organize\"><\/use><\/svg><\/span>\n            <h4>Organize<\/h4>\n            <p>Sort by system, genre, or favorites.<\/p>\n          <\/div>\n          <div class=\"library-feature\">\n            <span class=\"icon icon-lg icon-white\"><svg><use href=\"#icon-key\"><\/use><\/svg><\/span>\n            <h4>Key import<\/h4>\n            <p>Load your API keys from a file.<\/p>\n          <\/div>\n        <\/div>\n      <\/article>\n\n    <\/div>\n  <\/section>\n\n  <!-- ==================== COMPATIBILITY ==================== -->\n  <section class=\"rw-s rw-s--tight rw-cv\">\n    <div class=\"rw-section-head\">\n      <div class=\"rw-kicker rw-kicker--violet\">Rec0m88 Compatibility<\/div>\n      <h2 class=\"rw-h2\">Where Rec0m88 runs, and what it plays<\/h2>\n    <\/div>\n\n    <div class=\"clarity-grid\">\n      <div class=\"clarity-box\">\n        <h3><span class=\"icon icon-md icon-cyan\"><svg><use href=\"#icon-devices\"><\/use><\/svg><\/span> Play on<\/h3>\n        <p class=\"clarity-sub\">One Rec0m88 build per platform, all free.<\/p>\n        <div class=\"hardware-list\">\n          <div class=\"hardware-item\"><span class=\"icon icon-md icon-cyan\"><svg><use href=\"#icon-windows\"><\/use><\/svg><\/span> Windows 10 &amp; 11 <span class=\"meta\">x64 \u00b7 ARM64<\/span><\/div>\n          <div class=\"hardware-item\"><span class=\"icon icon-md icon-cyan\"><svg><use href=\"#icon-apple\"><\/use><\/svg><\/span> macOS <span class=\"meta\">Intel \u00b7 Apple Silicon<\/span><\/div>\n          <div class=\"hardware-item\"><span class=\"icon icon-md icon-cyan\"><svg><use href=\"#icon-linux\"><\/use><\/svg><\/span> Linux <span class=\"meta\">.deb<\/span><\/div>\n          <div class=\"hardware-item\"><span class=\"icon icon-md icon-green\"><svg><use href=\"#icon-xbox\"><\/use><\/svg><\/span> Xbox Series X|S <span class=\"meta\">Dev Mode<\/span><\/div>\n        <\/div>\n      <\/div>\n\n      <div class=\"clarity-box\">\n        <h3><span class=\"icon icon-md icon-amber\"><svg><use href=\"#icon-controller\"><\/use><\/svg><\/span> 20 supported consoles<\/h3>\n        <p class=\"clarity-sub\">Download and manage the emulation cores you want, right inside Rec0m88.<\/p>\n        <div class=\"systems-cloud\">\n          <span class=\"system-tag is-new\">Nintendo Wii<\/span>\n          <span class=\"system-tag is-new\">GameCube<\/span>\n          <span class=\"system-tag is-featured\">Nintendo 64<\/span>\n          <span class=\"system-tag is-featured\">PlayStation<\/span>\n          <span class=\"system-tag is-featured\">Super Nintendo<\/span>\n          <span class=\"system-tag is-featured\">Sega Genesis<\/span>\n          <span class=\"system-tag is-featured\">Game Boy Advance<\/span>\n          <span class=\"system-tag is-featured\">NES<\/span>\n          <span class=\"system-tag\">Nintendo DS<\/span>\n          <span class=\"system-tag\">Atari 2600<\/span>\n          <span class=\"system-tag\">Atari 7800<\/span>\n          <span class=\"system-tag\">Atari Lynx<\/span>\n          <span class=\"system-tag\">Game Boy<\/span>\n          <span class=\"system-tag\">Game Boy Color<\/span>\n          <span class=\"system-tag\">PC Engine<\/span>\n          <span class=\"system-tag\">Sega 32X<\/span>\n          <span class=\"system-tag\">Sega Game Gear<\/span>\n          <span class=\"system-tag\">Sega Master System<\/span>\n          <span class=\"system-tag\">Virtual Boy<\/span>\n          <span class=\"system-tag\">WonderSwan<\/span>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ==================== GALLERY ==================== -->\n  <section class=\"rw-s rw-s--tight rw-cv\">\n    <div class=\"rw-section-head\">\n      <div class=\"rw-kicker rw-kicker--amber\">Screenshots<\/div>\n      <h2 class=\"rw-h2\">See Rec0m88 in action<\/h2>\n      <p class=\"rw-lead\" style=\"margin-bottom:0;\">Click any screenshot to open it full size.<\/p>\n    <\/div>\n    <div class=\"gallery-grid\">\n      <div class=\"gallery-item\"><img decoding=\"async\" src=\"https:\/\/rec0m88.com\/wp-content\/uploads\/2026\/02\/rec0m88-idle.png\" alt=\"Rec0m88 idle screen\" class=\"gallery-clickable-img\" loading=\"lazy\"><\/div>\n      <div class=\"gallery-item\"><img decoding=\"async\" src=\"https:\/\/rec0m88.com\/wp-content\/uploads\/2026\/02\/rec0m88-loaded.png\" alt=\"Playing a game in Rec0m88\" class=\"gallery-clickable-img\" loading=\"lazy\"><\/div>\n      <div class=\"gallery-item\"><img decoding=\"async\" src=\"https:\/\/rec0m88.com\/wp-content\/uploads\/2026\/02\/rec0m88-Library.png\" alt=\"The Rec0m88 game library\" class=\"gallery-clickable-img\" loading=\"lazy\"><\/div>\n      <div class=\"gallery-item\"><img decoding=\"async\" src=\"https:\/\/rec0m88.com\/wp-content\/uploads\/2026\/02\/rec0m88-idle-netplay.png\" alt=\"Rec0m88 netplay idle screen\" class=\"gallery-clickable-img\" loading=\"lazy\"><\/div>\n      <div class=\"gallery-item\"><img decoding=\"async\" src=\"https:\/\/rec0m88.com\/wp-content\/uploads\/2026\/02\/rec0m88-Multiselect.png\" alt=\"Rec0m88 multi-select feature\" class=\"gallery-clickable-img\" loading=\"lazy\"><\/div>\n      <div class=\"gallery-item\"><img decoding=\"async\" src=\"https:\/\/rec0m88.com\/wp-content\/uploads\/2026\/02\/rec0m88-netplay.png\" alt=\"Rec0m88 netplay in action\" class=\"gallery-clickable-img\" loading=\"lazy\"><\/div>\n      <div class=\"gallery-item\"><img decoding=\"async\" src=\"https:\/\/rec0m88.com\/wp-content\/uploads\/2026\/04\/RetroAchievement.png\" alt=\"RetroAchievements integration in Rec0m88\" class=\"gallery-clickable-img\" loading=\"lazy\"><\/div>\n      <div class=\"gallery-item\"><img decoding=\"async\" src=\"https:\/\/rec0m88.com\/wp-content\/uploads\/2026\/04\/RetroAchievements3.png\" alt=\"RetroAchievements interface in Rec0m88\" class=\"gallery-clickable-img\" loading=\"lazy\"><\/div>\n      <div class=\"gallery-item\"><img decoding=\"async\" src=\"https:\/\/rec0m88.com\/wp-content\/uploads\/2026\/04\/RetroProgress.png\" alt=\"RetroAchievements progress library in Rec0m88\" class=\"gallery-clickable-img\" loading=\"lazy\"><\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ==================== DOWNLOAD ==================== -->\n  <section id=\"download\" class=\"download-section rw-cv\">\n    <div class=\"download-inner\">\n      <div class=\"rw-section-head\">\n        <div class=\"rw-kicker rw-kicker--cyan\">Get Rec0m88<\/div>\n        <h2 class=\"rw-h2\">Download Rec0m88<\/h2>\n        <p class=\"rw-lead\" style=\"margin-bottom:0;\">Completely free. Pick your platform \u2014 Rec0m88 works out the right build and architecture for you.<\/p>\n      <\/div>\n\n      <div class=\"download-buttons\">\n        <a href=\"#\" class=\"download-btn download-link\" data-os=\"windows\">\n          <span class=\"icon icon-lg icon-cyan\"><svg><use href=\"#icon-windows\"><\/use><\/svg><\/span>\n          <span class=\"db-text\"><span class=\"db-os\">Windows<\/span><span class=\"db-meta\">.exe installer<\/span><\/span>\n          <span class=\"icon icon-md db-arrow\"><svg><use href=\"#icon-download\"><\/use><\/svg><\/span>\n        <\/a>\n        <a href=\"#\" class=\"download-btn download-link\" data-os=\"macos\">\n          <span class=\"icon icon-lg icon-cyan\"><svg><use href=\"#icon-apple\"><\/use><\/svg><\/span>\n          <span class=\"db-text\"><span class=\"db-os\">macOS<\/span><span class=\"db-meta\">.dmg \u00b7 Intel &amp; M-series<\/span><\/span>\n          <span class=\"icon icon-md db-arrow\"><svg><use href=\"#icon-download\"><\/use><\/svg><\/span>\n        <\/a>\n        <a href=\"#\" class=\"download-btn download-link\" data-os=\"linux\">\n          <span class=\"icon icon-lg icon-cyan\"><svg><use href=\"#icon-linux\"><\/use><\/svg><\/span>\n          <span class=\"db-text\"><span class=\"db-os\">Linux<\/span><span class=\"db-meta\">.deb \u00b7 amd64 &amp; arm64<\/span><\/span>\n          <span class=\"icon icon-md db-arrow\"><svg><use href=\"#icon-download\"><\/use><\/svg><\/span>\n        <\/a>\n        <a href=\"#\" class=\"download-btn download-link download-btn--xbox\" data-os=\"xbox\">\n          <span class=\"icon icon-lg icon-green\"><svg><use href=\"#icon-xbox\"><\/use><\/svg><\/span>\n          <span class=\"db-text\"><span class=\"db-os\">Xbox Series X|S<\/span><span class=\"db-meta\">.zip \u00b7 Dev Mode<\/span><\/span>\n          <span class=\"icon icon-md db-arrow\"><svg><use href=\"#icon-download\"><\/use><\/svg><\/span>\n        <\/a>\n      <\/div>\n\n      <p class=\"download-note\">\u25b8 No account required. Rec0m88 is free on every platform, forever.<\/p>\n\n      <div class=\"stats-breakdown\">\n        <div class=\"stat-item\">\n          <span class=\"icon icon-lg icon-cyan\"><svg><use href=\"#icon-windows\"><\/use><\/svg><\/span>\n          <span class=\"st-text\"><span id=\"windows-downloads\" class=\"stat-value\">\u2026<\/span><span class=\"stat-label\">Windows<\/span><\/span>\n        <\/div>\n        <div class=\"stat-item\">\n          <span class=\"icon icon-lg icon-cyan\"><svg><use href=\"#icon-apple\"><\/use><\/svg><\/span>\n          <span class=\"st-text\"><span id=\"mac-downloads\" class=\"stat-value\">\u2026<\/span><span class=\"stat-label\">macOS<\/span><\/span>\n        <\/div>\n        <div class=\"stat-item\">\n          <span class=\"icon icon-lg icon-cyan\"><svg><use href=\"#icon-linux\"><\/use><\/svg><\/span>\n          <span class=\"st-text\"><span id=\"linux-downloads\" class=\"stat-value\">\u2026<\/span><span class=\"stat-label\">Linux<\/span><\/span>\n        <\/div>\n        <div class=\"stat-item\">\n          <span class=\"icon icon-lg icon-green\"><svg><use href=\"#icon-xbox\"><\/use><\/svg><\/span>\n          <span class=\"st-text\"><span id=\"xbox-downloads\" class=\"stat-value\" style=\"color:var(--r-green);\">\u2026<\/span><span class=\"stat-label\">Xbox<\/span><\/span>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ==================== RELEASE NOTES ==================== -->\n  <section class=\"rw-s rw-cv\">\n    <div class=\"info-grid\">\n      <div class=\"info-card changelog-section\" id=\"changelog\">\n        <div class=\"rw-kicker rw-kicker--cyan\">Rec0m88 Release Notes<\/div>\n        <h2 class=\"rw-h2\" style=\"font-size:clamp(1.5rem,2.4vw,1.9rem);margin-bottom:24px;\">What&#8217;s new<\/h2>\n\n        <div class=\"changelog-item latest\" id=\"changelog-latest\">\n          <div class=\"changelog-version\" id=\"changelog-version\">Loading\u2026<\/div>\n          <ul class=\"changelog-details\" id=\"changelog-details\"><\/ul>\n        <\/div>\n\n        <div class=\"changelog-foot\">\n          <a href=\"https:\/\/rec0m88.com\/rec0m88-changelog\" class=\"rw-btn rw-btn--ghost rw-btn--sm\">\n            View full Rec0m88 history <span class=\"rw-btn-icon\">\u2192<\/span>\n          <\/a>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ==================== ATTRIBUTION ==================== -->\n  <div class=\"project-attribution rw-cv\">\n    <div class=\"attribution-inner\">\n      <div class=\"attribution-mark\">REC<span>0<\/span>M<span>88<\/span><\/div>\n      <p><strong>Rec0m88 Emulator<\/strong> \u2014 created and maintained by <a href=\"https:\/\/github.com\/s-coding23\" target=\"_blank\" rel=\"noopener\">@s-coding23<\/a>.<\/p>\n      <p class=\"fine\">\n        Inspired by s-coding23&#8217;s previous work and core contributions (including Dynamic Cheats and\n        WebRTC Netplay) to the <a href=\"https:\/\/emulatorjs.org\" target=\"_blank\" rel=\"noopener\">EmulatorJS<\/a> project.\n      <\/p>\n    <\/div>\n  <\/div>\n\n<\/div>\n\n<!-- Lightbox modal -->\n<div id=\"lightbox\" class=\"lightbox\">\n  <span class=\"lightbox-close\" role=\"button\" tabindex=\"0\" aria-label=\"Close screenshot\">\u00d7<\/span>\n  <img class=\"lightbox-content\" id=\"lightbox-img\" alt=\"Enlarged Rec0m88 screenshot\">\n<\/div>\n\n<!-- =========================================================\n     JAVASCRIPT \u2014 all original behaviour preserved:\n       0. Changelog loader        (\/app-files\/release-notes.md)\n       1. OS + architecture detection and download-link resolution\n       2. Download counters       (\/wp-json\/rec0m88\/v1\/downloads)\n       3. Screenshot lightbox\n     ========================================================= -->\n<script>\nif (document.querySelector('.Rec0m88-container')) {\n    document.addEventListener('DOMContentLoaded', () => {\n\n        \/\/ --- 0. CHANGELOG LOADER (release-notes.md) ---\n        const RELEASE_NOTES_PATH = '\/app-files\/release-notes.md';\n\n        function escapeHTML(str) {\n            return String(str).replace(\/[&<>\"']\/g, c => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '\"': '&quot;', \"'\": '&#39;' }[c] || c));\n        }\n\n        function parseReleaseNotes(md) {\n            const lines = md.split(\/\\r?\\n\/);\n            let version = '';\n            let date = '';\n            const items = [];\n\n            for (let raw of lines) {\n                const line = raw.trim();\n                if (!line) continue;\n\n                \/\/ # What's New in v4.0.0\n                const versionMatch = line.match(\/^#\\s+.*?v?(\\d+(?:\\.\\d+)+)\/i);\n                if (versionMatch && !version) { version = versionMatch[1]; continue; }\n\n                \/\/ *Released: 4\/27\/2026*  or  _Released: ..._\n                const dateMatch = line.match(\/^[*_]\\s*Released:\\s*(.+?)\\s*[*_]\\s*$\/i);\n                if (dateMatch && !date) { date = dateMatch[1]; continue; }\n\n                \/\/ ## Sub-heading -> rendered as bold prefix on next bullet, or its own bullet\n                const headingMatch = line.match(\/^#{2,}\\s+(.+?):?$\/);\n                if (headingMatch) { items.push({ type: 'heading', text: headingMatch[1].replace(\/:$\/, '') }); continue; }\n\n                \/\/ - bullet  or  * bullet\n                const bulletMatch = line.match(\/^[-*]\\s+(.+)$\/);\n                if (bulletMatch) { items.push({ type: 'bullet', text: bulletMatch[1] }); continue; }\n\n                \/\/ Plain paragraph line \u2014 treat as a bullet so nothing is lost\n                items.push({ type: 'bullet', text: line });\n            }\n\n            \/\/ Merge headings into the bullet that follows them (\"Heading: bullet text\")\n            const merged = [];\n            let pendingHeading = null;\n            for (const it of items) {\n                if (it.type === 'heading') { pendingHeading = it.text; continue; }\n                if (pendingHeading) {\n                    merged.push(`<strong>${escapeHTML(pendingHeading)}:<\/strong> ${escapeHTML(it.text)}`);\n                    pendingHeading = null;\n                } else {\n                    merged.push(escapeHTML(it.text));\n                }\n            }\n            if (pendingHeading) merged.push(`<strong>${escapeHTML(pendingHeading)}<\/strong>`);\n\n            return { version, date, items: merged };\n        }\n\n        async function loadChangelog() {\n            const versionEl = document.getElementById('changelog-version');\n            const detailsEl = document.getElementById('changelog-details');\n            if (!versionEl || !detailsEl) return;\n\n            try {\n                const res = await fetch(RELEASE_NOTES_PATH, { cache: 'no-cache' });\n                if (!res.ok) throw new Error('HTTP ' + res.status);\n                const md = await res.text();\n                const { version, date, items } = parseReleaseNotes(md);\n\n                if (version) {\n                    const dateHTML = date ? ` <span class=\"date\">Latest release \u00b7 ${escapeHTML(date)}<\/span>` : '';\n                    versionEl.innerHTML = `v${escapeHTML(version)}${dateHTML}`;\n                    \/\/ Mirror the resolved version into the hero badge.\n                    const heroVer = document.getElementById('hero-version-text');\n                    if (heroVer) heroVer.textContent = 'v' + version + ' \u00b7 free';\n                } else {\n                    versionEl.textContent = 'Latest release';\n                }\n\n                detailsEl.innerHTML = items.length\n                    ? items.map(t => `<li>${t}<\/li>`).join('')\n                    : '<li>See the full Rec0m88 changelog for details.<\/li>';\n            } catch (err) {\n                versionEl.textContent = 'Latest release';\n                detailsEl.innerHTML = '<li>Could not load release notes. <a href=\"https:\/\/rec0m88.com\/rec0m88-changelog\">View the full Rec0m88 changelog<\/a>.<\/li>';\n                console.warn('Rec0m88 changelog load failed:', err);\n            }\n        }\n\n        loadChangelog();\n\n        \/\/ --- 1. OS & ARCHITECTURE DETECTION ---\n        const DOWNLOADS_PATH = '\/downloads';\n        const XBOX_ZIP_NAME = 'Rec0m88-Xbox.zip';\n\n        \/\/ There is deliberately no hardcoded version number here any more.\n        \/\/ A pinned version goes stale the moment a new build ships, and if the\n        \/\/ latest.yml fetch fails the button then points at a filename that no\n        \/\/ longer exists and returns a 404. If we cannot resolve a real version\n        \/\/ we send people to the changelog page, which always exists and always\n        \/\/ links the current build.\n        const DOWNLOADS_FALLBACK_URL = 'https:\/\/rec0m88.com\/rec0m88-changelog';\n\n        function buildDownloadFiles(v) {\n            \/\/ Xbox ships under a stable filename, so it survives a failed\n            \/\/ version lookup and can always be linked directly.\n            const files = {\n                xbox: { x64: `${DOWNLOADS_PATH}\/${XBOX_ZIP_NAME}`, arm64: `${DOWNLOADS_PATH}\/${XBOX_ZIP_NAME}` }\n            };\n            if (!v) return files;\n\n            files.windows = { x64: `${DOWNLOADS_PATH}\/Rec0m88 Setup ${v}.exe`, arm64: `${DOWNLOADS_PATH}\/Rec0m88 Setup ${v}.exe` };\n            files.macos   = { x64: `${DOWNLOADS_PATH}\/Rec0m88-${v}.dmg`, arm64: `${DOWNLOADS_PATH}\/Rec0m88-${v}-arm64.dmg` };\n            files.linux   = { x64: `${DOWNLOADS_PATH}\/Rec0m88_${v}_amd64.deb`, arm64: `${DOWNLOADS_PATH}\/Rec0m88_${v}_arm64.deb` };\n            return files;\n        }\n\n        async function fetchVersionFromYml(ymlPath) {\n            try {\n                const resp = await fetch(ymlPath, { cache: 'no-store' });\n                if (!resp.ok) return null;\n                const text = await resp.text();\n                const match = text.match(\/^version:\\s*(.+)$\/m);\n                return match ? match[1].trim() : null;\n            } catch (e) { return null; }\n        }\n\n        async function resolveDownloadFiles() {\n            const ymlFiles = [`${DOWNLOADS_PATH}\/latest.yml`, `${DOWNLOADS_PATH}\/latest-mac.yml`, `${DOWNLOADS_PATH}\/latest-linux.yml`];\n            let version = null;\n            for (const yml of ymlFiles) {\n                version = await fetchVersionFromYml(yml);\n                if (version) break;\n            }\n            \/\/ version may still be null here. buildDownloadFiles handles that\n            \/\/ by returning only the links it can guarantee.\n            return buildDownloadFiles(version);\n        }\n\n        async function detectPlatform() {\n            const ua = navigator.userAgent;\n            let os = null; let arch = 'x64';\n            if (ua.includes('Xbox')) os = 'xbox';\n            else if (ua.includes('Win')) os = 'windows';\n            else if (ua.includes('Mac')) os = 'macos';\n            else if (ua.includes('Linux') && !ua.includes('Android')) os = 'linux';\n\n            if (ua.includes('aarch64') || ua.includes('arm64')) {\n                arch = 'arm64';\n            } else if (navigator.userAgentData?.getHighEntropyValues) {\n                try {\n                    const hints = await navigator.userAgentData.getHighEntropyValues(['architecture']);\n                    if (hints.architecture?.toLowerCase().includes('arm')) arch = 'arm64';\n                } catch (err) {}\n            }\n\n            if (os === 'macos' && arch === 'x64') {\n                try {\n                    const canvas = document.createElement('canvas');\n                    const gl = canvas.getContext('webgl') || canvas.getContext('experimental-webgl');\n                    if (gl) {\n                        const debugInfo = gl.getExtension('WEBGL_debug_renderer_info');\n                        if (debugInfo) {\n                            const renderer = gl.getParameter(debugInfo.UNMASKED_RENDERER_WEBGL).toLowerCase();\n                            if (renderer.includes('apple m') || renderer.includes('apple gpu')) arch = 'arm64';\n                        }\n                    }\n                } catch (e) {}\n            }\n            return { os, arch };\n        }\n\n        function getDownloadUrl(downloadFiles, os, arch) {\n            if (!downloadFiles[os]) return null;\n            return downloadFiles[os][arch] || downloadFiles[os]['x64'];\n        }\n\n        async function updateDownloadLinks() {\n            const [downloadFiles, platform] = await Promise.all([resolveDownloadFiles(), detectPlatform()]);\n            const { os: detectedOS, arch } = platform;\n\n            const mainBtn = document.getElementById('main-download-btn');\n            if (mainBtn) {\n                const iconHTML = mainBtn.querySelector('.icon')?.outerHTML || '';\n                if (detectedOS && downloadFiles[detectedOS]) {\n                    const friendlyNames = { windows: 'Windows', macos: 'macOS', linux: 'Linux', xbox: 'Xbox' };\n                    const archLabels = { windows: { x64: '', arm64: ' (ARM64)' }, macos: { x64: ' (Intel)', arm64: ' (Apple Silicon)' }, linux: { x64: ' (AMD64)', arm64: ' (ARM64)' }, xbox: { x64: ' Series X|S', arm64: ' Series X|S' } };\n                    const label = `Download for ${friendlyNames[detectedOS]}${archLabels[detectedOS]?.[arch] || ''}`;\n                    const url = getDownloadUrl(downloadFiles, detectedOS, arch);\n                    if (url) {\n                        mainBtn.innerHTML = `${iconHTML}<span>${label}<\/span>`;\n                        mainBtn.href = url;\n                        mainBtn.setAttribute('data-os', detectedOS);\n                    } else {\n                        mainBtn.innerHTML = `${iconHTML}<span>View all downloads<\/span>`;\n                        mainBtn.href = DOWNLOADS_FALLBACK_URL;\n                        mainBtn.removeAttribute('data-os');\n                    }\n                } else {\n                    mainBtn.innerHTML = `${iconHTML}<span>View all downloads<\/span>`;\n                    mainBtn.href = '#download';\n                }\n            }\n\n            document.querySelectorAll('.download-link[data-os]').forEach(button => {\n                const btnOS = button.dataset.os;\n                \/\/ Never leave a per-platform button pointing at a guessed\n                \/\/ filename. If the version lookup failed, send it somewhere real.\n                button.href = getDownloadUrl(downloadFiles, btnOS, arch) || DOWNLOADS_FALLBACK_URL;\n            });\n        }\n\n        \/\/ --- 2. DOWNLOAD COUNTER LOGIC ---\n        const API_BASE_URL = '\/wp-json\/rec0m88\/v1';\n        const totalEl = document.getElementById('total-downloads');\n        const windowsEl = document.getElementById('windows-downloads');\n        const macEl = document.getElementById('mac-downloads');\n        const linuxEl = document.getElementById('linux-downloads');\n        const xboxEl = document.getElementById('xbox-downloads');\n        let isFetching = false;\n\n        async function fetchAndUpdateCounts() {\n            if (isFetching) return;\n            isFetching = true;\n            try {\n                const response = await fetch(`${API_BASE_URL}\/downloads`, { cache: 'no-store' });\n                if (!response.ok) throw new Error();\n                const counts = await response.json();\n                updateCounts(counts);\n            } catch (error) {\n                if (totalEl) totalEl.textContent = 'Unavailable';\n            } finally {\n                isFetching = false;\n            }\n        }\n\n        async function incrementDownloadCount(os) {\n            try {\n                await fetch(`${API_BASE_URL}\/downloads\/${os}`, { method: 'POST', headers: { 'Content-Type': 'application\/json' }, cache: 'no-store' });\n            } catch (error) { console.warn('Failed to increment Rec0m88 download count:', error); }\n        }\n\n        function updateCounts(counts) {\n            const total = (counts.windows || 0) + (counts.macOS || 0) + (counts.linux || 0) + (counts.xbox || 0);\n            const formatter = new Intl.NumberFormat('en-US');\n            if (totalEl) totalEl.textContent = formatter.format(total);\n            if (windowsEl) windowsEl.textContent = formatter.format(counts.windows || 0);\n            if (macEl) macEl.textContent = formatter.format(counts.macOS || 0);\n            if (linuxEl) linuxEl.textContent = formatter.format(counts.linux || 0);\n            if (xboxEl) xboxEl.textContent = formatter.format(counts.xbox || 0);\n        }\n\n        document.querySelectorAll('.download-link, #main-download-btn').forEach(link => {\n            link.addEventListener('click', (e) => {\n                const os = link.getAttribute('data-os');\n                if (os && link.href && !link.href.includes('#')) {\n                    incrementDownloadCount(os);\n                    setTimeout(fetchAndUpdateCounts, 1500);\n                }\n            });\n        });\n\n        \/\/ --- 3. LIGHTBOX LOGIC ---\n        const lightbox = document.getElementById('lightbox');\n        const lightboxImg = document.getElementById('lightbox-img');\n        const closeBtn = document.querySelector('.lightbox-close');\n\n        document.querySelectorAll('.gallery-clickable-img').forEach(img => {\n            img.addEventListener('click', () => {\n                if (lightbox && lightboxImg) { lightbox.style.display = 'flex'; lightboxImg.src = img.src; }\n            });\n        });\n\n        const closeModal = () => { if (lightbox) lightbox.style.display = 'none'; };\n        if (closeBtn) {\n            closeBtn.addEventListener('click', closeModal);\n            \/\/ The close control is focusable, so make it operable from the keyboard too.\n            closeBtn.addEventListener('keydown', (e) => {\n                if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); closeModal(); }\n            });\n        }\n        if (lightbox) lightbox.addEventListener('click', (e) => { if (e.target === lightbox) closeModal(); });\n        document.addEventListener('keydown', (e) => { if (e.key === 'Escape') closeModal(); });\n\n        \/\/ --- 4. HERO SHOT FALLBACK ---\n        \/\/ If a screenshot 404s, hide the <img> so the framed REC0M88 placeholder\n        \/\/ shows instead of a broken-image icon.\n        document.querySelectorAll('.rw-frame__body img, .rw-logo-tile img').forEach(img => {\n            img.addEventListener('error', () => { img.style.display = 'none'; });\n            if (img.complete && img.naturalWidth === 0) img.style.display = 'none';\n        });\n\n        \/\/ --- INIT ---\n        updateDownloadLinks().then(fetchAndUpdateCounts);\n        document.addEventListener('visibilitychange', () => { if (!document.hidden) fetchAndUpdateCounts(); });\n    });\n}\n<\/script>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>R Rec0m88 Free \u00b7 all platforms Download Rec0m88. The Rec0m88 retro gaming emulator, with WebRTC netplay, local Nintendo DS link play, and RetroAchievements built in. Now with GameCube and Wii support. Auto-scan your library, pull cores on demand, and play cross-platform on Windows, macOS, Linux, and Xbox Series X|S. Detecting your OS\u2026 View setup guide&#8230;<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"wpai_generated_summary":"","_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"fullwidth","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"class_list":["post-13","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/rec0m88.com\/de\/wp-json\/wp\/v2\/pages\/13","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rec0m88.com\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/rec0m88.com\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/rec0m88.com\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rec0m88.com\/de\/wp-json\/wp\/v2\/comments?post=13"}],"version-history":[{"count":3,"href":"https:\/\/rec0m88.com\/de\/wp-json\/wp\/v2\/pages\/13\/revisions"}],"predecessor-version":[{"id":10834,"href":"https:\/\/rec0m88.com\/de\/wp-json\/wp\/v2\/pages\/13\/revisions\/10834"}],"wp:attachment":[{"href":"https:\/\/rec0m88.com\/de\/wp-json\/wp\/v2\/media?parent=13"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}