:root{--pp-paper:#FAFAF7;--pp-surface:#FFFFFF;--pp-ink:#1F2933;--pp-ink-soft:#5D6875;--pp-line:rgba(31, 41, 51, 0.12);--pp-accent:#2563EB;--pp-accent-soft:#DBEAFE;--pp-secondary:#A16207;--pp-warning:#B45309;--pp-rust:#B7410E;}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;background:var(--pp-paper,#0d1117);color:var(--pp-ink,#e6edf3);line-height:1.6;min-height:100vh;display:flex;flex-direction:column}
a{color:var(--pp-accent,#58a6ff);text-decoration:none}a:hover{color:var(--pp-secondary,#79c0ff)}
.top-nav{position:sticky;top:0;background:color-mix(in srgb,var(--pp-paper,#0d1117) 94%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--pp-line,#30363d);z-index:100}
.nav-inner{max-width:1200px;margin:0 auto;padding:.75rem 1.5rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.nav-brand{font-size:1.25rem;font-weight:700;color:var(--pp-ink,#e6edf3)}.nav-links{display:flex;gap:1.4rem;flex-wrap:wrap}.nav-links a{color:var(--pp-ink-soft,#8b949e);font-size:.9rem}.nav-links a:hover{color:var(--pp-ink,#e6edf3)}
.hero{text-align:center;padding:6rem 1.5rem 4rem;max-width:850px;margin:0 auto}.hero-logo{width:min(11rem,42vw);height:auto;margin:0 auto 1.5rem;display:block;filter:drop-shadow(0 1.5rem 2.5rem color-mix(in srgb,var(--pp-accent,#58a6ff) 18%,transparent))}
.hero h1{font-size:3.5rem;font-weight:800;margin-bottom:1rem}.tagline{font-size:1.5rem;color:var(--pp-accent,#58a6ff);margin-bottom:.75rem}.subtitle{font-size:1.1rem;color:var(--pp-ink-soft,#8b949e);max-width:660px;margin:0 auto 2rem}.hero-byline{color:var(--pp-ink-soft,#8b949e);margin:-1rem 0 2rem}.hero-byline a{font-weight:700}
.hero-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.btn{display:inline-block;padding:.75rem 1.5rem;border-radius:6px;font-weight:600}.btn-primary{background:var(--pp-accent,#58a6ff);color:var(--pp-paper,#0d1117)}.btn-secondary{border:1px solid var(--pp-line,#30363d);color:var(--pp-ink,#e6edf3)}
.features,.landing-content,.install-section,.comparison-content,.person-mention,.workflow-steps,.audience-grid,.trust-panel{max-width:1200px;margin:0 auto;padding:2rem 1.5rem 4rem;width:100%}
.features-grid,.audience-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}.feature-card,.audience-card{background:var(--pp-surface,#161b22);border:1px solid var(--pp-line,#30363d);border-radius:8px;padding:1.5rem}.feature-card.highlight{border-color:color-mix(in srgb,var(--pp-accent,#58a6ff) 35%,transparent);background:color-mix(in srgb,var(--pp-accent-soft,#58a6ff) 14%,transparent)}
.feature-card h3,.audience-card h3{font-size:1.1rem;margin-bottom:.5rem}.feature-card p,.audience-card p,.landing-content p,.section-heading p,.section-subtitle{color:var(--pp-ink-soft,#8b949e)}
.section-heading{display:grid;gap:.6rem;margin-bottom:1.5rem}.section-heading h2,.landing-content h2,.comparison-section h2{font-size:2rem;font-weight:800}
.workflow-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}.workflow-step{position:relative;display:grid;gap:.55rem;background:var(--pp-surface,#161b22);border:1px solid var(--pp-line,#30363d);border-radius:8px;padding:1.25rem}.workflow-index{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:999px;background:var(--pp-accent-soft,rgba(88,166,255,.16));color:var(--pp-ink,#e6edf3);font-weight:800}.workflow-step h3{font-size:1.05rem}.workflow-step p{color:var(--pp-ink-soft,#8b949e)}
.trust-panel{background:color-mix(in srgb,var(--pp-surface,#161b22) 72%,transparent);border-top:1px solid var(--pp-line,#30363d);border-bottom:1px solid var(--pp-line,#30363d);max-width:none}.trust-panel>.section-heading,.trust-list{max-width:1200px;margin-left:auto;margin-right:auto}.trust-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem}.trust-item{border-left:3px solid var(--pp-secondary,#79c0ff);padding:1rem 1rem 1rem 1.25rem;background:var(--pp-paper,#0d1117)}.trust-item h3{font-size:1rem;margin-bottom:.45rem}.trust-item p{color:var(--pp-ink-soft,#8b949e)}
.install-routes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}.install-route{display:flex;flex-direction:column;gap:.6rem;background:var(--pp-surface,#161b22);border:1px solid var(--pp-line,#30363d);border-radius:8px;padding:1.15rem;color:var(--pp-ink,#e6edf3);min-width:0}.install-route.recommended{border-color:color-mix(in srgb,var(--pp-secondary,#3fb950) 72%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--pp-secondary,#3fb950) 35%,transparent),0 0 0 4px color-mix(in srgb,var(--pp-secondary,#3fb950) 10%,transparent);background:color-mix(in srgb,var(--pp-secondary,#3fb950) 8%,var(--pp-surface,#161b22))}
.route-meta{color:var(--pp-ink-soft,#8b949e);font-size:.86rem}.route-badge{display:inline-block;margin-left:.35rem;color:var(--pp-secondary,#3fb950);font-weight:800}.install-route strong{font-size:1.1rem}.install-route p{color:var(--pp-ink-soft,#8b949e);font-size:.92rem}.command-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.35rem;align-items:stretch}.install-route pre,.secondary-routes pre,.landing-content pre{margin:0;background:color-mix(in srgb,var(--pp-paper,#05080d) 72%,#000);border:1px solid var(--pp-line,#30363d);border-radius:6px;padding:.85rem;white-space:pre;overflow:auto;scrollbar-width:thin}.install-route code,.secondary-routes code,.landing-content code{color:var(--pp-accent,#58a6ff);word-break:normal}.copy-command{border:1px solid var(--pp-line,#30363d);border-radius:6px;background:var(--pp-accent,#1f6feb);color:var(--pp-paper,#fff);font-weight:700;padding:0 .8rem;min-width:4.25rem}.route-link{justify-self:start;color:var(--pp-accent,#58a6ff);font-weight:700}
.secondary-routes{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.75rem;margin-top:1rem}.secondary-routes article{display:grid;gap:.45rem;border:1px solid var(--pp-line,#30363d);border-radius:8px;padding:.9rem;background:color-mix(in srgb,var(--pp-surface,#161b22) 62%,transparent);min-width:0}.secondary-routes span{color:var(--pp-ink-soft,#8b949e);font-size:.85rem}.secondary-routes strong{color:var(--pp-ink,#e6edf3)}.secondary-routes p{margin:0;color:var(--pp-ink-soft,#8b949e);font-size:.9rem}
.screenshots-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1.5rem}.screenshot-slot{display:flex;flex-direction:column;gap:.85rem;background:var(--pp-surface,#161b22);border:1px solid var(--pp-line,#30363d);border-radius:8px;padding:1.25rem;overflow:hidden}.lightbox-trigger{display:block;width:100%;padding:0;border:0;background:transparent;color:inherit;cursor:zoom-in}.lightbox-trigger:focus-visible{outline:3px solid var(--pp-accent,#58a6ff);outline-offset:3px}.screenshot-slot img{display:block;width:100%;height:clamp(12rem,18vw,15rem);object-fit:contain;background:color-mix(in srgb,var(--pp-paper,#05080d) 72%,#000);border:1px solid var(--pp-line,#30363d);border-radius:6px}.screenshot-slot figcaption{color:var(--pp-ink-soft,#8b949e);font-size:.92rem}
.games-matrix,.coverage-table{width:100%;border-collapse:collapse;background:var(--pp-surface,#161b22);border:1px solid var(--pp-line,#30363d);border-radius:8px;overflow:hidden;margin-top:1.5rem}.games-matrix th,.games-matrix td,.coverage-table th,.coverage-table td{padding:1rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--pp-line,#30363d)}.games-matrix th,.coverage-table th{color:var(--pp-ink,#e6edf3);font-size:.92rem}.games-matrix td,.coverage-table td{color:var(--pp-ink-soft,#8b949e)}
.game-slug{color:var(--pp-ink-soft,#8b949e);font-size:.8rem;margin-top:.25rem}.status-pill,.capability-pill{display:inline-flex;gap:.45rem;border-radius:999px;padding:.32rem .7rem;border:1px solid var(--pp-line,#30363d);font-size:.85rem;white-space:nowrap}.status-done,.capability-done{background:color-mix(in srgb,var(--pp-secondary,#3fb950) 16%,transparent);border-color:color-mix(in srgb,var(--pp-secondary,#3fb950) 42%,transparent)}.status-partial,.capability-partial{background:color-mix(in srgb,var(--pp-warning,#d29922) 16%,transparent);border-color:color-mix(in srgb,var(--pp-warning,#d29922) 42%,transparent)}.status-not_shipped,.capability-not_shipped{background:color-mix(in srgb,var(--pp-rust,#f85149) 16%,transparent);border-color:color-mix(in srgb,var(--pp-rust,#f85149) 42%,transparent)}
.capability-list{display:flex;flex-wrap:wrap;gap:.5rem}.capability-name{color:var(--pp-ink,#e6edf3)}.capability-value{color:var(--pp-ink-soft,#8b949e)}.badge{display:inline-block;padding:.15rem .5rem;border-radius:4px;font-size:.85rem;font-weight:600}.badge.high{background:color-mix(in srgb,var(--pp-secondary,#3fb950) 22%,transparent);color:var(--pp-secondary,#3fb950)}.badge.mid{background:color-mix(in srgb,var(--pp-warning,#d29922) 22%,transparent);color:var(--pp-warning,#d29922)}.badge.low{background:color-mix(in srgb,var(--pp-rust,#f85149) 22%,transparent);color:var(--pp-rust,#f85149)}
.comparison-section{margin-bottom:3rem}.site-footer{margin-top:auto;border-top:1px solid var(--pp-line,#30363d);padding:2rem 1.5rem}.footer-inner{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;gap:1rem;color:var(--pp-ink-soft,#8b949e);font-size:.85rem}.footer-links{display:flex;flex-wrap:wrap;gap:1rem}
.person-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1rem;align-items:center;background:var(--pp-surface,#161b22);border:1px solid var(--pp-line,#30363d);border-radius:8px;padding:1.25rem}.person-avatar{width:4.5rem;height:4.5rem;border-radius:999px;object-fit:cover;border:1px solid var(--pp-line,#30363d)}.person-card h3{font-size:1.25rem;margin-bottom:.2rem}.person-role,.person-attribution{color:var(--pp-ink-soft,#8b949e)}.person-links{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.75rem}.person-link{display:inline-flex;border:1px solid var(--pp-line,#30363d);border-radius:999px;padding:.25rem .65rem;font-size:.85rem}
body.lightbox-open{overflow:hidden}.image-lightbox{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:clamp(1rem,4vw,3rem);background:rgba(0,0,0,.82)}.image-lightbox.open{display:flex}.image-lightbox-panel{position:relative;display:grid;gap:.85rem;max-width:min(96vw,1200px);max-height:92vh}.image-lightbox-panel img{display:block;max-width:100%;max-height:78vh;object-fit:contain;border:1px solid var(--pp-line,#30363d);border-radius:8px;background:var(--pp-paper,#0d1117);box-shadow:0 1.25rem 3rem rgba(0,0,0,.42)}.image-lightbox-panel p{color:var(--pp-ink,#e6edf3);text-align:center}.image-lightbox-close{justify-self:end;border:1px solid var(--pp-line,#30363d);border-radius:6px;background:var(--pp-surface,#161b22);color:var(--pp-ink,#e6edf3);font-weight:700;padding:.5rem .8rem}
@media (max-width:1100px){.install-routes{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){.screenshots-grid{grid-template-columns:1fr}.games-matrix{display:block;overflow-x:auto}.nav-inner{align-items:flex-start;flex-direction:column}}
@media (max-width:640px){.hero{padding-top:4rem}.hero h1{font-size:2.5rem}.tagline{font-size:1.2rem}.features,.landing-content,.install-section,.comparison-content,.workflow-steps,.audience-grid,.trust-panel{padding-left:1rem;padding-right:1rem}.install-section .section-heading a{display:none}.install-routes,.secondary-routes{grid-template-columns:1fr;gap:.45rem}.secondary-routes{margin-top:.45rem}.install-route,.secondary-routes article{padding:.75rem;gap:.35rem}.install-route:not(.recommended),.secondary-routes article{background:color-mix(in srgb,var(--pp-surface,#161b22) 36%,transparent);padding:.6rem .65rem}.install-route p{display:none}.install-route strong{font-size:1rem}.route-meta,.secondary-routes span{font-size:.76rem}.command-row,.install-route:not(.recommended) .command-row,.secondary-routes .command-row{grid-template-columns:1fr;gap:.25rem}.install-route pre,.secondary-routes pre{padding:.5rem;font-size:.62rem;line-height:1.35;white-space:pre;overflow:visible}.install-route code,.secondary-routes code{word-break:normal}.copy-command{min-width:0;min-height:2.1rem;padding:0 .55rem;font-size:.76rem}.route-link{font-size:.9rem}.footer-inner{flex-direction:column;text-align:center}}