:root{
  color-scheme:dark;
  --bg:#070913;
  --bg-soft:#0b1020;
  --panel:#10172a;
  --panel-2:#151e35;
  --panel-3:#1a2540;
  --text:#f7f8ff;
  --muted:#9aa6c4;
  --muted-2:#6e7a98;
  --line:#263250;
  --line-soft:rgba(100,120,170,.18);
  --accent:#7a5cff;
  --accent-2:#20c7d9;
  --accent-3:#ff4fd8;
  --success:#5ce1a6;
  --danger:#ff7087;
  --shadow:0 24px 70px rgba(0,0,0,.35);
  --radius:22px;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text)}
body{min-height:100vh;overflow-x:hidden;background:
radial-gradient(circle at 12% 10%,rgba(32,199,217,.10),transparent 26%),
radial-gradient(circle at 86% 3%,rgba(122,92,255,.14),transparent 28%),
radial-gradient(circle at 52% 100%,rgba(255,79,216,.05),transparent 30%),
linear-gradient(180deg,#080b15 0%,#070913 100%)}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.18;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,black,transparent 75%)}
a{color:inherit}.shell{width:min(1180px,calc(100% - 40px));margin-inline:auto}
.topbar{height:78px;display:flex;align-items:center;justify-content:space-between;gap:22px;padding:0 clamp(18px,4vw,58px);border-bottom:1px solid rgba(109,126,173,.18);background:rgba(7,9,19,.76);backdrop-filter:blur(22px);position:sticky;top:0;z-index:50}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:900;letter-spacing:-.02em;font-size:20px;white-space:nowrap}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:linear-gradient(135deg,var(--accent),#5c75ff 55%,var(--accent-2));box-shadow:0 10px 28px rgba(105,92,255,.28);font-size:13px;letter-spacing:.04em}
.nav{display:flex;align-items:center;gap:4px}.nav-link{color:var(--muted);text-decoration:none;font-size:14px;font-weight:750;padding:10px 13px;border-radius:10px;transition:.18s ease}.nav-link:hover,.nav-link.active{color:var(--text);background:rgba(255,255,255,.055)}
.topbar-actions{display:flex;align-items:center;gap:10px}.controller-status{display:flex;align-items:center;gap:10px;border:1px solid var(--line-soft);background:rgba(16,23,42,.72);padding:9px 12px;border-radius:12px;min-width:180px}.controller-dot{width:9px;height:9px;border-radius:50%;background:#69728a;box-shadow:0 0 0 4px rgba(105,114,138,.08);flex:0 0 auto}.controller-copy{display:flex;flex-direction:column;min-width:0;line-height:1.15}.controller-label{font-size:12px;font-weight:850}.controller-detail{font-size:10px;color:var(--muted-2);margin-top:3px;max-width:155px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.controller-status.is-connected{border-color:rgba(92,225,166,.30);background:rgba(20,69,57,.24)}.controller-status.is-connected .controller-dot{background:var(--success);box-shadow:0 0 0 4px rgba(92,225,166,.10),0 0 16px rgba(92,225,166,.35)}.controller-status.is-connected .controller-label{color:#b9f4d8}.controller-status.is-unsupported{opacity:.72}
.back-link{color:var(--muted);text-decoration:none;padding:10px 13px;border:1px solid var(--line-soft);border-radius:10px;background:rgba(255,255,255,.025)}.back-link:hover{color:var(--text);border-color:#3b4a70}
.eyebrow{display:inline-flex;align-items:center;gap:9px;color:#a7edf3;font-size:11px;font-weight:900;letter-spacing:.18em;margin-bottom:14px}.eyebrow::before{content:"";width:24px;height:1px;background:linear-gradient(90deg,var(--accent-2),transparent)}
.landing-hero{min-height:calc(100vh - 78px);display:grid;grid-template-columns:minmax(0,1.2fr) minmax(360px,.8fr);gap:58px;align-items:center;padding:76px 0 62px;position:relative}.landing-copy{position:relative;z-index:2}.landing-copy h1{font-size:clamp(54px,7.4vw,94px);line-height:.92;letter-spacing:-.065em;margin:0 0 26px;max-width:920px}.gradient-text{background:linear-gradient(100deg,#fff 6%,#b7c4ff 50%,#8debf0 95%);-webkit-background-clip:text;background-clip:text;color:transparent}.landing-copy p{font-size:clamp(17px,1.8vw,20px);line-height:1.75;color:var(--muted);max-width:760px;margin:0}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}.primary-link,.secondary-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:850;padding:15px 19px;border-radius:12px;transition:.18s ease}.primary-link{background:linear-gradient(135deg,var(--accent),#5d73ff);box-shadow:0 15px 34px rgba(91,88,255,.24)}.primary-link:hover{transform:translateY(-2px);box-shadow:0 18px 40px rgba(91,88,255,.34)}.secondary-link{border:1px solid var(--line);background:rgba(16,23,42,.62);color:#e4e8f7}.secondary-link:hover{border-color:#46577d;background:rgba(25,34,58,.8)}
.hero-metrics{display:flex;flex-wrap:wrap;gap:18px;margin-top:40px}.metric{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px}.metric strong{color:var(--text);font-size:18px}.metric-sep{width:1px;height:24px;background:var(--line)}
.hero-visual{position:relative;min-height:520px;display:grid;place-items:center}.glow-orb{position:absolute;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(115,92,255,.28),rgba(31,199,218,.08) 47%,transparent 70%);filter:blur(2px);animation:pulseGlow 6s ease-in-out infinite}.console-showcase{position:relative;width:min(100%,470px);border:1px solid rgba(124,145,204,.25);background:linear-gradient(155deg,rgba(25,34,59,.92),rgba(10,14,26,.96));border-radius:28px;padding:24px;box-shadow:var(--shadow);overflow:hidden}.console-showcase::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(255,255,255,.05),transparent 22%,transparent 72%,rgba(32,199,217,.05));pointer-events:none}.showcase-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:26px}.showcase-kicker{font-size:11px;letter-spacing:.16em;color:var(--muted);font-weight:850}.live-badge{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:800;color:#baf5da;background:rgba(92,225,166,.08);border:1px solid rgba(92,225,166,.18);padding:7px 9px;border-radius:999px}.live-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--success);box-shadow:0 0 10px rgba(92,225,166,.55)}
.showcase-screen{aspect-ratio:16/10;border:1px solid rgba(121,140,190,.2);background:linear-gradient(135deg,#0d1220,#121a30);border-radius:18px;padding:22px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;position:relative}.showcase-screen::after{content:"";position:absolute;inset:auto -20% -58% -20%;height:75%;background:radial-gradient(circle,rgba(35,199,218,.16),transparent 68%)}.screen-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.screen-tile{border:1px solid rgba(122,140,187,.18);background:rgba(255,255,255,.03);border-radius:14px;padding:15px}.screen-tile span{display:grid;place-items:center;width:42px;height:42px;border-radius:11px;background:#202b48;font-weight:950;margin-bottom:24px}.screen-tile strong{font-size:16px}.screen-tile small{display:block;color:var(--muted);margin-top:5px}.screen-status{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;margin-top:14px;position:relative;z-index:2}.showcase-controls{display:grid;grid-template-columns:1fr auto;align-items:center;gap:18px;margin-top:20px}.dpad{width:58px;height:58px;position:relative}.dpad::before,.dpad::after{content:"";position:absolute;background:#27324f;border:1px solid #364364;border-radius:6px}.dpad::before{width:22px;height:58px;left:18px}.dpad::after{width:58px;height:22px;top:18px}.ab-buttons{display:flex;gap:10px}.ab-buttons i{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:11px;font-weight:900;background:#2b3552;border:1px solid #3b486b}.ab-buttons i:last-child{margin-top:-18px;background:linear-gradient(145deg,#553e96,#2a3563)}
@keyframes pulseGlow{0%,100%{transform:scale(.96);opacity:.72}50%{transform:scale(1.06);opacity:1}}
.section{padding:92px 0}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:32px}.section-heading>div{max-width:760px}.section-heading h2,.about-section h2{font-size:clamp(34px,5vw,56px);letter-spacing:-.045em;line-height:1.03;margin:0}.section-heading p{color:var(--muted);max-width:420px;line-height:1.65;margin:0}
.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.feature-card{min-height:250px;border:1px solid var(--line-soft);background:linear-gradient(155deg,rgba(20,29,51,.78),rgba(10,14,26,.72));border-radius:19px;padding:24px;position:relative;overflow:hidden}.feature-card::after{content:"";position:absolute;width:130px;height:130px;border-radius:50%;right:-55px;bottom:-65px;background:radial-gradient(circle,rgba(122,92,255,.17),transparent 68%)}.feature-icon{width:48px;height:48px;border-radius:13px;display:grid;place-items:center;background:#202b49;border:1px solid #334263;margin-bottom:42px;font-weight:900}.feature-card h3{font-size:20px;margin:0 0 9px}.feature-card p{margin:0;color:var(--muted);line-height:1.65;font-size:14px}
.steps-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.steps-grid article{border-top:1px solid var(--line);padding:24px 4px}.step-number{color:#8fdfe8;font-size:12px;font-weight:900;letter-spacing:.12em}.steps-grid h3{font-size:21px;margin:16px 0 9px}.steps-grid p{color:var(--muted);line-height:1.65;margin:0}
.about-section{margin:26px auto 76px;border:1px solid var(--line-soft);background:linear-gradient(145deg,rgba(17,24,43,.78),rgba(9,13,24,.78));border-radius:24px;padding:clamp(30px,5vw,58px);display:grid;grid-template-columns:1fr 1fr;gap:46px;align-items:end;box-shadow:0 20px 60px rgba(0,0,0,.18)}.about-section p{color:var(--muted);line-height:1.8;margin:0}.legal-note{margin-bottom:74px;color:var(--muted);font-size:14px;border-left:2px solid var(--accent-2);padding-left:15px}.legal-note strong{color:var(--text)}.footer{border-top:1px solid var(--line-soft);padding:30px 0;color:var(--muted)}.footer .shell{display:flex;justify-content:space-between;gap:20px}
.catalog-page{padding:72px 0 90px}.catalog-heading{max-width:810px;margin-bottom:38px}.catalog-heading h1{font-size:clamp(50px,7vw,82px);letter-spacing:-.055em;line-height:.95;margin:0 0 18px}.catalog-heading p{font-size:18px;line-height:1.7;color:var(--muted);margin:0}.console-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.console-card{min-height:390px;padding:28px;border:1px solid var(--line-soft);background:linear-gradient(150deg,rgba(21,30,53,.9),rgba(9,13,24,.95));border-radius:24px;text-decoration:none;color:inherit;display:flex;flex-direction:column;justify-content:space-between;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;position:relative;overflow:hidden}.console-card::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 86% 8%,rgba(122,92,255,.16),transparent 30%);opacity:.7}.console-card.mame::before{background:radial-gradient(circle at 86% 8%,rgba(32,199,217,.16),transparent 30%)}.console-card:hover{transform:translateY(-5px);border-color:#465982;box-shadow:0 28px 60px rgba(0,0,0,.22)}.console-card>*{position:relative;z-index:1}.console-icon{width:68px;height:68px;display:grid;place-items:center;border-radius:18px;background:#202b48;border:1px solid #334263;font-weight:950;font-size:22px;box-shadow:0 12px 30px rgba(0,0,0,.18)}.console-tag{font-size:11px;letter-spacing:.16em;color:var(--muted);font-weight:900}.console-card h2{font-size:36px;margin:8px 0 12px;letter-spacing:-.03em}.console-card p{margin:0;color:var(--muted);line-height:1.65;max-width:560px}.card-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:26px}.card-action{font-weight:850}.compat-badge{font-size:11px;color:#bbf3da;border:1px solid rgba(92,225,166,.17);background:rgba(92,225,166,.07);padding:7px 9px;border-radius:999px}.notice{margin-top:20px;border:1px solid var(--line-soft);background:rgba(16,23,42,.66);padding:18px 20px;border-radius:14px;color:var(--muted)}.notice strong{color:var(--text)}
.emulator-page{padding:56px 0 76px}.emulator-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:30px}.emulator-heading h1{font-size:clamp(38px,5.5vw,64px);line-height:1;margin:0 0 14px;letter-spacing:-.045em}.emulator-heading p{font-size:17px;line-height:1.65;color:var(--muted);max-width:760px;margin:0}.status-dot{padding:9px 12px;border:1px solid var(--line-soft);background:rgba(16,23,42,.7);border-radius:999px;color:var(--muted);font-size:12px;font-weight:750}.loader-card{border:1px solid var(--line-soft);background:linear-gradient(150deg,rgba(17,25,45,.92),rgba(9,13,24,.94));border-radius:22px;padding:22px;box-shadow:0 20px 55px rgba(0,0,0,.17);transition:.2s ease}.drop-zone{min-height:300px;border:1.5px dashed #425476;border-radius:18px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:9px;cursor:pointer;background:linear-gradient(145deg,rgba(25,35,60,.52),rgba(13,18,32,.6));transition:.2s ease;padding:28px}.drop-zone:hover,.drop-zone.dragging{border-color:var(--accent-2);background:rgba(32,199,217,.055);transform:translateY(-1px)}.drop-icon{width:70px;height:70px;display:grid;place-items:center;border-radius:19px;background:#202b48;border:1px solid #334263;font-weight:950;font-size:23px;box-shadow:0 12px 30px rgba(0,0,0,.18)}.drop-zone strong{font-size:24px}.drop-zone span:not(.drop-icon),.drop-zone small{color:var(--muted)}.file-input{display:none}.selection-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:18px}.selection-row>span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted)}.primary-button{border:0;background:linear-gradient(135deg,var(--accent),#5b78ff);color:white;padding:14px 22px;border-radius:11px;font-weight:850;font-size:15px;cursor:pointer;white-space:nowrap;box-shadow:0 12px 26px rgba(91,88,255,.18)}.primary-button:disabled{opacity:.38;cursor:not-allowed;box-shadow:none}.helper{margin:14px 0 0;color:var(--muted);font-size:14px}.error-text{color:var(--danger)!important}.loader-card.compact .drop-zone{display:none}.emulator-stage{margin-top:22px;border:1px solid var(--line);border-radius:22px;overflow:hidden;background:#000;min-height:520px;box-shadow:0 22px 60px rgba(0,0,0,.34)}.emulator-stage #game{width:100%;height:min(72vh,760px);min-height:520px}.hidden{display:none}.tips-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:22px}.tips-grid article{border:1px solid var(--line-soft);background:rgba(16,23,42,.62);border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:8px}.tips-grid article span{color:var(--muted);line-height:1.55;font-size:14px}
@media(max-width:980px){.landing-hero{grid-template-columns:1fr;min-height:auto;padding-top:62px}.hero-visual{min-height:430px}.console-showcase{max-width:520px}.feature-grid{grid-template-columns:1fr}.section-heading{display:block}.section-heading p{margin-top:16px}.controller-detail{display:none}.controller-status{min-width:auto}.landing-copy h1{max-width:780px}}
@media(max-width:780px){.topbar{height:auto;min-height:68px;padding:10px 14px;flex-wrap:wrap}.shell{width:min(100% - 24px,1180px)}.nav{order:3;width:100%;justify-content:center;border-top:1px solid rgba(100,120,170,.12);padding-top:7px}.landing-hero{padding:52px 0}.hero-visual{min-height:360px}.glow-orb{width:320px;height:320px}.console-grid,.steps-grid,.tips-grid{grid-template-columns:1fr}.about-section{grid-template-columns:1fr}.footer .shell{flex-direction:column}.emulator-heading{display:block}.emulator-heading .status-dot{display:inline-block;margin-top:14px}.loader-card{padding:12px}.drop-zone{min-height:250px}.selection-row{align-items:stretch;flex-direction:column}.primary-button{width:100%}.emulator-stage,.emulator-stage #game{min-height:360px;height:65vh}.console-card{min-height:320px}.metric-sep{display:none}}
@media(max-width:560px){.brand span:last-child{display:none}.controller-status{padding:8px 10px}.controller-copy{display:none}.nav-link{font-size:12px;padding:8px 9px}.landing-copy h1{font-size:48px}.hero-actions{flex-direction:column}.primary-link,.secondary-link{width:100%}.hero-metrics{gap:12px}.console-showcase{padding:16px;border-radius:22px}.showcase-screen{padding:14px}.screen-tile{padding:12px}.section{padding:68px 0}.catalog-page{padding-top:48px}.catalog-heading h1{font-size:52px}.drop-zone strong{font-size:20px}}

/* === V4: more colorful, lively ProRetro visual language === */
:root{
  --bg:#090713;
  --bg-soft:#100b20;
  --panel:#151129;
  --panel-2:#1c1537;
  --panel-3:#241b46;
  --text:#fff9ff;
  --muted:#b7add0;
  --muted-2:#8f82aa;
  --line:#3a2b59;
  --line-soft:rgba(177,132,255,.18);
  --accent:#9c6bff;
  --accent-2:#25d6e4;
  --accent-3:#ff4fb7;
  --accent-4:#ff9f43;
  --accent-5:#7cf58f;
  --success:#72f0b5;
}
body{
  background:
    radial-gradient(circle at 8% 15%,rgba(255,79,183,.20),transparent 25%),
    radial-gradient(circle at 86% 10%,rgba(37,214,228,.18),transparent 27%),
    radial-gradient(circle at 50% 90%,rgba(156,107,255,.18),transparent 34%),
    linear-gradient(180deg,#0c0817 0%,#080711 48%,#0a0713 100%);
}
body::before{
  opacity:.25;
  background-image:
    linear-gradient(rgba(255,255,255,.026) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.026) 1px,transparent 1px);
  background-size:42px 42px;
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-2;
  background:
    radial-gradient(circle at 20% 75%,rgba(255,159,67,.08),transparent 22%),
    radial-gradient(circle at 78% 62%,rgba(124,245,143,.06),transparent 20%);
  filter:blur(14px);
}
.topbar{
  border-bottom:1px solid rgba(213,171,255,.18);
  background:rgba(12,8,23,.68);
  box-shadow:0 10px 38px rgba(0,0,0,.20);
}
.brand-mark{
  background:linear-gradient(135deg,#ff58bb 0%,#9b67ff 46%,#23d6df 100%);
  box-shadow:0 10px 30px rgba(156,107,255,.34),0 0 26px rgba(255,79,183,.13);
}
.nav-link:hover,.nav-link.active{
  background:linear-gradient(135deg,rgba(156,107,255,.16),rgba(255,79,183,.09));
  box-shadow:inset 0 0 0 1px rgba(194,158,255,.10);
}
.controller-status{
  background:linear-gradient(135deg,rgba(32,22,54,.72),rgba(14,19,37,.72));
  border-color:rgba(175,135,255,.20);
}
.eyebrow{color:#8ff6ee}.eyebrow::before{background:linear-gradient(90deg,#25d6e4,#ff4fb7,transparent)}
.gradient-text{
  background:linear-gradient(100deg,#ffffff 3%,#d8b9ff 30%,#ff78c8 58%,#6cecf0 88%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 22px rgba(156,107,255,.08));
}
.primary-link{
  background:linear-gradient(120deg,#8e5cff 0%,#cc5cff 45%,#ff5dac 100%);
  box-shadow:0 16px 40px rgba(167,83,255,.28),0 0 30px rgba(255,79,183,.09);
}
.primary-link:hover{box-shadow:0 18px 48px rgba(167,83,255,.38),0 0 38px rgba(255,79,183,.13)}
.secondary-link{
  background:linear-gradient(135deg,rgba(38,26,61,.74),rgba(18,25,45,.72));
  border-color:rgba(180,140,255,.25);
}
.glow-orb{
  width:470px;height:470px;
  background:radial-gradient(circle at 38% 38%,rgba(255,79,183,.38),rgba(153,93,255,.24) 36%,rgba(37,214,228,.12) 58%,transparent 72%);
  filter:blur(6px);
}
.console-showcase{
  border-color:rgba(207,169,255,.28);
  background:
    linear-gradient(150deg,rgba(42,28,68,.93),rgba(14,18,34,.97)),
    radial-gradient(circle at top right,rgba(37,214,228,.15),transparent 35%);
  box-shadow:0 28px 80px rgba(0,0,0,.40),0 0 70px rgba(145,89,255,.10);
}
.console-showcase::before{
  background:
    linear-gradient(120deg,rgba(255,255,255,.07),transparent 24%,transparent 70%,rgba(37,214,228,.07)),
    radial-gradient(circle at 15% 10%,rgba(255,79,183,.12),transparent 32%);
}
.showcase-screen{
  border-color:rgba(177,136,255,.28);
  background:
    radial-gradient(circle at 0% 0%,rgba(255,79,183,.13),transparent 28%),
    radial-gradient(circle at 100% 0%,rgba(37,214,228,.13),transparent 28%),
    linear-gradient(135deg,#151027,#11172d);
  box-shadow:inset 0 0 45px rgba(112,76,184,.10);
}
.screen-tile{
  border-color:rgba(195,160,255,.22);
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  box-shadow:0 10px 30px rgba(0,0,0,.16);
  transition:.2s ease;
}
.screen-tile:first-child{background:linear-gradient(145deg,rgba(134,92,255,.18),rgba(255,81,181,.07));}
.screen-tile:last-child{background:linear-gradient(145deg,rgba(37,214,228,.16),rgba(71,113,255,.06));}
.screen-tile:first-child span{background:linear-gradient(135deg,#7e56ff,#ff4fb7);box-shadow:0 8px 22px rgba(156,107,255,.24)}
.screen-tile:last-child span{background:linear-gradient(135deg,#18b9cf,#4b7dff);box-shadow:0 8px 22px rgba(37,214,228,.18)}
.feature-card{
  border-color:rgba(185,144,255,.20);
  background:
    radial-gradient(circle at 100% 0%,rgba(156,107,255,.08),transparent 30%),
    linear-gradient(155deg,rgba(31,22,51,.88),rgba(12,15,29,.82));
  box-shadow:0 18px 50px rgba(0,0,0,.18);
  transition:.22s ease;
}
.feature-card:hover{transform:translateY(-4px);border-color:rgba(215,177,255,.32);box-shadow:0 24px 58px rgba(0,0,0,.25)}
.feature-card:nth-child(1){background:radial-gradient(circle at 100% 0%,rgba(255,79,183,.17),transparent 31%),linear-gradient(155deg,rgba(42,21,50,.90),rgba(17,13,28,.86))}
.feature-card:nth-child(2){background:radial-gradient(circle at 100% 0%,rgba(37,214,228,.17),transparent 31%),linear-gradient(155deg,rgba(18,38,47,.90),rgba(12,15,28,.86))}
.feature-card:nth-child(3){background:radial-gradient(circle at 100% 0%,rgba(255,159,67,.15),transparent 31%),linear-gradient(155deg,rgba(44,30,24,.90),rgba(15,14,25,.86))}
.feature-card:nth-child(1) .feature-icon{background:linear-gradient(135deg,#a65cff,#ff4fb7)}
.feature-card:nth-child(2) .feature-icon{background:linear-gradient(135deg,#1dbfce,#4b7dff)}
.feature-card:nth-child(3) .feature-icon{background:linear-gradient(135deg,#ff9f43,#ff5d7a)}
.feature-icon{color:white;border-color:rgba(255,255,255,.12);box-shadow:0 10px 24px rgba(0,0,0,.20)}
.steps-grid article{position:relative;border-top-color:rgba(182,142,255,.22)}
.steps-grid article::before{content:"";position:absolute;left:0;top:-1px;width:34%;height:1px;background:linear-gradient(90deg,#ff4fb7,#8f63ff,#25d6e4)}
.about-section{
  border-color:rgba(188,147,255,.23);
  background:
    radial-gradient(circle at 0% 100%,rgba(255,79,183,.10),transparent 30%),
    radial-gradient(circle at 100% 0%,rgba(37,214,228,.10),transparent 30%),
    linear-gradient(145deg,rgba(31,21,50,.84),rgba(11,14,27,.84));
  box-shadow:0 25px 70px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.035);
}
.legal-note{border-left:2px solid transparent;border-image:linear-gradient(#ff4fb7,#25d6e4) 1}

/* Emulator catalog cards: stronger identity and color */
.catalog-page{position:relative}
.catalog-page::before{content:"";position:absolute;left:50%;top:40px;transform:translateX(-50%);width:min(980px,80vw);height:260px;background:radial-gradient(ellipse,rgba(156,107,255,.14),transparent 68%);filter:blur(12px);pointer-events:none;z-index:-1}
.console-grid{gap:24px}
.console-card{
  min-height:430px;
  padding:30px;
  border-color:rgba(202,163,255,.22);
  background:linear-gradient(150deg,rgba(32,24,53,.95),rgba(11,13,24,.97));
  box-shadow:0 24px 70px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.035);
}
.console-card::before{
  background:
    radial-gradient(circle at 88% 10%,rgba(154,92,255,.35),transparent 28%),
    radial-gradient(circle at 20% 110%,rgba(255,79,183,.22),transparent 34%);
  opacity:1;
}
.console-card::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(115deg,rgba(255,255,255,.06),transparent 20%,transparent 72%,rgba(255,79,183,.05));
  pointer-events:none;
}
.console-card.mame::before{
  background:
    radial-gradient(circle at 88% 10%,rgba(37,214,228,.34),transparent 28%),
    radial-gradient(circle at 18% 110%,rgba(74,125,255,.24),transparent 34%);
}
.console-card:hover{
  transform:translateY(-8px) scale(1.008);
  border-color:rgba(221,186,255,.42);
  box-shadow:0 34px 80px rgba(0,0,0,.34),0 0 55px rgba(148,89,255,.11);
}
.console-card.mame:hover{box-shadow:0 34px 80px rgba(0,0,0,.34),0 0 55px rgba(37,214,228,.10)}
.console-icon{
  width:82px;height:82px;border-radius:23px;
  background:linear-gradient(135deg,#7f53ff 0%,#b85cff 52%,#ff4fb7 100%);
  border-color:rgba(255,255,255,.13);
  box-shadow:0 18px 40px rgba(155,88,255,.30),inset 0 1px 0 rgba(255,255,255,.16);
  font-size:26px;
}
.console-card.mame .console-icon{
  background:linear-gradient(135deg,#16b9cc 0%,#2aa6e8 48%,#4d79ff 100%);
  box-shadow:0 18px 40px rgba(33,197,220,.24),inset 0 1px 0 rgba(255,255,255,.16);
}
.console-tag{color:#dfcfff}
.console-card.mame .console-tag{color:#aaf5f5}
.console-card h2{font-size:40px}
.console-card:first-child h2{background:linear-gradient(90deg,#fff,#d6b7ff,#ff80c6);-webkit-background-clip:text;background-clip:text;color:transparent}
.console-card.mame h2{background:linear-gradient(90deg,#fff,#9ef0f2,#8db0ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.card-action{display:inline-flex;align-items:center;gap:8px;padding:10px 13px;border-radius:10px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.07)}
.console-card:hover .card-action{background:rgba(255,255,255,.075)}
.compat-badge{background:rgba(114,240,181,.09);border-color:rgba(114,240,181,.22);box-shadow:0 0 22px rgba(114,240,181,.05)}
.notice{
  margin-top:26px;
  border-color:rgba(189,147,255,.22);
  background:linear-gradient(135deg,rgba(35,24,55,.76),rgba(14,19,34,.72));
  box-shadow:0 14px 38px rgba(0,0,0,.14);
}

/* Emulator pages */
.loader-card,.tips-grid article,.emulator-stage{
  border-color:rgba(188,146,255,.20)!important;
  background:
    radial-gradient(circle at 100% 0%,rgba(156,107,255,.08),transparent 28%),
    linear-gradient(150deg,rgba(29,21,49,.84),rgba(11,14,27,.88))!important;
  box-shadow:0 18px 52px rgba(0,0,0,.20);
}
.drop-zone{
  border-color:rgba(187,145,255,.28)!important;
  background:radial-gradient(circle at 50% 0%,rgba(156,107,255,.10),transparent 35%),rgba(255,255,255,.018)!important;
}
.drop-zone:hover,.drop-zone.is-dragover{
  border-color:#a873ff!important;
  box-shadow:0 0 0 4px rgba(156,107,255,.08),0 0 42px rgba(156,107,255,.10);
}
.primary-button{
  background:linear-gradient(120deg,#8d5cff,#c65cff,#ff59ab)!important;
  box-shadow:0 12px 30px rgba(155,87,255,.24);
}

@media(max-width:780px){
  .console-card{min-height:350px}
}

/* v5 - Universal Arcade compatibility UI */
.arcade-mode-card{
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:24px 26px;margin:0 0 20px;border:1px solid rgba(70,224,235,.22);border-radius:18px;
  background:radial-gradient(circle at 95% 0%,rgba(37,214,228,.16),transparent 32%),linear-gradient(145deg,rgba(17,37,48,.90),rgba(17,14,32,.90));
  box-shadow:0 18px 52px rgba(0,0,0,.20),0 0 48px rgba(37,214,228,.05)
}
.arcade-mode-copy h2{margin:5px 0 8px;font-size:25px}.arcade-mode-copy p{margin:0;color:var(--muted);max-width:680px;line-height:1.55}
.mini-label{display:block;color:#8ff6ee;font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.core-select-wrap{min-width:260px}.core-select-wrap>span{display:block;color:var(--muted-2);font-size:12px;margin-bottom:7px}
.core-select{width:100%;appearance:none;color:var(--text);background:linear-gradient(145deg,rgba(34,26,55,.95),rgba(13,20,35,.95));border:1px solid rgba(144,221,255,.22);border-radius:11px;padding:13px 38px 13px 14px;font:inherit;cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,#8ff6ee 50%),linear-gradient(135deg,#8ff6ee 50%,transparent 50%),linear-gradient(145deg,rgba(34,26,55,.95),rgba(13,20,35,.95));background-position:calc(100% - 19px) 50%,calc(100% - 13px) 50%,0 0;background-size:6px 6px,6px 6px,100% 100%;background-repeat:no-repeat}
.core-select option{background:#161124;color:#fff}
.arcade-extra-files{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}
.extra-file-card{position:relative;display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;padding:18px;border:1px solid rgba(134,190,255,.16);border-radius:15px;background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012))}
.extra-file-card strong{display:block;margin:4px 0 5px}.extra-file-card p{margin:0;color:var(--muted-2);font-size:13px;line-height:1.45}.extra-file-card code{color:#aaf5f5}
.small-file-button{display:inline-flex;align-items:center;justify-content:center;padding:10px 12px;border-radius:9px;border:1px solid rgba(82,222,235,.22);background:rgba(37,214,228,.075);font-size:12px;font-weight:800;cursor:pointer;white-space:nowrap}.small-file-button:hover{background:rgba(37,214,228,.13)}.small-file-button input{display:none}
.extra-file-name{grid-column:1/-1;color:var(--muted);font-size:12px;padding-top:2px;overflow-wrap:anywhere}
.compat-panel{display:flex;align-items:flex-start;gap:12px;margin-top:16px;padding:14px 16px;border:1px solid rgba(156,107,255,.18);border-radius:13px;background:rgba(156,107,255,.055)}
.compat-panel .compat-light{width:9px;height:9px;border-radius:50%;margin-top:5px;flex:0 0 auto;background:#8f82aa;box-shadow:0 0 14px rgba(143,130,170,.3)}
.compat-panel[data-state="ready"] .compat-light{background:#72f0b5;box-shadow:0 0 16px rgba(114,240,181,.55)}
.compat-panel strong{display:block;margin-bottom:3px}.compat-panel p{margin:0;color:var(--muted);font-size:13px;line-height:1.5}
.arcade-tips article:nth-child(1){background:radial-gradient(circle at 100% 0%,rgba(37,214,228,.11),transparent 32%),linear-gradient(150deg,rgba(20,36,46,.86),rgba(11,14,27,.88))!important}
.arcade-tips article:nth-child(2){background:radial-gradient(circle at 100% 0%,rgba(156,107,255,.11),transparent 32%),linear-gradient(150deg,rgba(29,21,49,.84),rgba(11,14,27,.88))!important}
.arcade-tips article:nth-child(3){background:radial-gradient(circle at 100% 0%,rgba(255,159,67,.10),transparent 32%),linear-gradient(150deg,rgba(42,29,22,.84),rgba(11,14,27,.88))!important}
@media(max-width:780px){.arcade-mode-card{align-items:stretch;flex-direction:column}.core-select-wrap{min-width:0}.arcade-extra-files{grid-template-columns:1fr}.extra-file-card{grid-template-columns:1fr}.small-file-button{justify-self:start}}

/* v6 - SteamGridDB dynamic console artwork */
.console-art-card{
  isolation:isolate;
  background:
    linear-gradient(180deg,rgba(7,9,18,.08) 0%,rgba(7,9,18,.28) 38%,rgba(7,9,18,.96) 100%),
    radial-gradient(circle at 86% 8%,rgba(122,92,255,.32),transparent 35%),
    linear-gradient(145deg,#22173c,#0c1120);
  background-size:cover;background-position:center;
  min-height:440px;padding:0;
}
.console-art-card.mame{background:
  linear-gradient(180deg,rgba(7,9,18,.06) 0%,rgba(7,9,18,.30) 38%,rgba(7,9,18,.96) 100%),
  radial-gradient(circle at 86% 8%,rgba(32,199,217,.30),transparent 35%),
  linear-gradient(145deg,#102a33,#0c1120)}
.console-art-card.has-sgdb-background{background-image:
  linear-gradient(180deg,rgba(5,7,14,.08) 0%,rgba(5,7,14,.18) 32%,rgba(5,7,14,.94) 83%,rgba(5,7,14,.99) 100%),
  var(--sgdb-background)}
.console-art-card::before{display:none}
.console-art-card::after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(105deg,rgba(118,70,255,.18),transparent 42%);pointer-events:none}
.console-art-card.mame::after{background:linear-gradient(105deg,rgba(31,214,228,.15),transparent 42%)}
.console-art-card>*{position:relative;z-index:1}
.console-card-head{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:22px 24px 0}
.console-title-art{display:flex;align-items:flex-end;min-height:170px;padding:26px 24px 10px}
.console-title-art img{display:block;max-width:min(76%,420px);max-height:145px;width:auto;height:auto;object-fit:contain;object-position:left bottom;filter:drop-shadow(0 12px 24px rgba(0,0,0,.45))}
.console-title-art.logo-loaded .console-title-fallback{display:none}
.console-title-fallback{font-size:clamp(42px,5vw,64px);line-height:.92;letter-spacing:-.055em;font-weight:950;color:#fff;text-shadow:0 10px 38px rgba(0,0,0,.5)}
.console-card-copy{margin-top:auto;padding:34px 24px 24px;background:linear-gradient(180deg,transparent,rgba(6,8,16,.42) 22%,rgba(6,8,16,.70));display:grid;gap:18px}
.console-card-copy p{color:#d6dbea;text-shadow:0 2px 14px rgba(0,0,0,.75)}
.console-card-copy .card-action{justify-self:start;background:rgba(10,12,22,.55);backdrop-filter:blur(12px)}
.console-art-card.artwork-loading{animation:artworkPulse 1.5s ease-in-out infinite alternate}
@keyframes artworkPulse{from{filter:saturate(.9)}to{filter:saturate(1.1)}}

.screen-art-tile{background-size:cover!important;background-position:center!important;overflow:hidden;position:relative;isolation:isolate}
.screen-art-tile.has-sgdb-background{background-image:linear-gradient(180deg,rgba(7,9,16,.12),rgba(7,9,16,.86)),var(--sgdb-background)!important}
.screen-art-tile>*{position:relative;z-index:1}
.screen-art-logo{min-height:58px;display:flex;align-items:flex-end}
.screen-art-logo img{display:block;max-width:150px;max-height:58px;object-fit:contain;object-position:left bottom;filter:drop-shadow(0 6px 12px rgba(0,0,0,.45))}
.screen-art-logo.logo-loaded strong{display:none}

@media(max-width:780px){
  .console-art-card{min-height:390px}
  .console-title-art{min-height:145px}
  .console-title-art img{max-width:88%;max-height:118px}
  .console-title-fallback{font-size:44px}
}


/* v7 - Homepage artwork wall + simplified arcade */
.hero-art-wall{min-height:560px;position:relative;display:grid;place-items:center;overflow:visible}
.platform-stack{position:relative;width:min(100%,610px);height:500px}
.platform-poster{position:absolute;display:block;overflow:hidden;border-radius:28px;border:1px solid rgba(255,255,255,.16);background-size:cover;background-position:center;text-decoration:none;box-shadow:0 30px 80px rgba(0,0,0,.38);isolation:isolate;transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease}
.platform-poster::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,8,16,.05),rgba(6,8,16,.20) 35%,rgba(6,8,16,.92) 100%);z-index:0}
.platform-poster::after{content:"";position:absolute;inset:0;z-index:0;opacity:.9;mix-blend-mode:screen;pointer-events:none}
.platform-poster.has-sgdb-background{background-image:var(--sgdb-background)}
.platform-poster-n64{left:4%;top:18px;width:66%;height:360px;transform:rotate(-4deg);background-image:radial-gradient(circle at 80% 10%,rgba(255,81,181,.38),transparent 34%),linear-gradient(145deg,#3b1c58,#12162e)}
.platform-poster-n64::after{background:radial-gradient(circle at 10% 10%,rgba(154,92,255,.34),transparent 32%)}
.platform-poster-mame{right:2%;bottom:28px;width:67%;height:350px;transform:rotate(3.5deg);background-image:radial-gradient(circle at 90% 10%,rgba(37,214,228,.32),transparent 32%),linear-gradient(145deg,#0c3a47,#11182f)}
.platform-poster-mame::after{background:radial-gradient(circle at 85% 15%,rgba(37,214,228,.30),transparent 32%)}
.platform-poster:hover{transform:translateY(-8px) rotate(0deg) scale(1.015);z-index:5;border-color:rgba(255,255,255,.30);box-shadow:0 38px 100px rgba(0,0,0,.48),0 0 60px rgba(153,93,255,.12)}
.platform-poster-glass{position:absolute;left:18px;right:18px;bottom:18px;z-index:2;padding:20px 22px;border-radius:20px;border:1px solid rgba(255,255,255,.14);background:linear-gradient(135deg,rgba(12,14,28,.68),rgba(12,16,30,.44));backdrop-filter:blur(16px) saturate(1.2);-webkit-backdrop-filter:blur(16px) saturate(1.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.platform-kicker{display:block;margin-bottom:8px;color:#b8c0dd;font-size:10px;font-weight:900;letter-spacing:.16em}
.platform-logo{display:flex;align-items:flex-end;min-height:60px;color:#fff;font-size:34px;font-weight:950;letter-spacing:-.04em;text-shadow:0 8px 28px rgba(0,0,0,.6)}
.platform-logo img{display:block;max-width:78%;max-height:72px;width:auto;height:auto;object-fit:contain;object-position:left center;filter:drop-shadow(0 8px 18px rgba(0,0,0,.5))}
.platform-logo.logo-loaded strong{display:none}
.platform-meta{display:flex;gap:8px;align-items:center;margin-top:10px;color:#d7def0;font-size:12px}
.platform-float-card{position:absolute;left:0;bottom:8px;z-index:9;display:flex;align-items:center;gap:12px;padding:13px 16px;border:1px solid rgba(255,255,255,.14);border-radius:16px;background:rgba(13,16,31,.72);backdrop-filter:blur(16px);box-shadow:0 18px 45px rgba(0,0,0,.3)}
.platform-float-card strong{display:block;font-size:13px}.platform-float-card small{display:block;margin-top:2px;color:var(--muted);font-size:11px}.float-dot{width:9px;height:9px;border-radius:50%;background:#72f0b5;box-shadow:0 0 18px rgba(114,240,181,.7)}

.arcade-fixed-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding:22px 24px;margin:0 0 20px;border:1px solid rgba(37,214,228,.20);border-radius:18px;background:radial-gradient(circle at 100% 0%,rgba(37,214,228,.14),transparent 32%),linear-gradient(145deg,rgba(17,37,48,.90),rgba(17,14,32,.90));box-shadow:0 18px 52px rgba(0,0,0,.20)}
.arcade-fixed-icon{width:54px;height:54px;display:grid;place-items:center;border-radius:15px;background:linear-gradient(135deg,rgba(37,214,228,.20),rgba(122,92,255,.18));border:1px solid rgba(121,236,244,.18);font-size:25px}
.arcade-fixed-card h2{margin:4px 0 5px;font-size:25px}.arcade-fixed-card p{margin:0;color:var(--muted);line-height:1.5;max-width:760px}
.fixed-core-pill{padding:9px 12px;border-radius:999px;border:1px solid rgba(114,240,181,.22);background:rgba(114,240,181,.08);color:#9bf4c8;font-size:12px;font-weight:900;letter-spacing:.06em}

@media(max-width:980px){.hero-art-wall{min-height:500px}.platform-stack{height:460px;max-width:560px;margin-inline:auto}}
@media(max-width:680px){.hero-art-wall{min-height:430px}.platform-stack{height:390px}.platform-poster-n64{left:0;width:78%;height:275px}.platform-poster-mame{right:0;width:78%;height:270px}.platform-poster-glass{left:12px;right:12px;bottom:12px;padding:15px}.platform-logo{font-size:27px;min-height:48px}.platform-logo img{max-height:58px}.platform-float-card{display:none}.arcade-fixed-card{grid-template-columns:auto 1fr}.fixed-core-pill{grid-column:1/-1;justify-self:start}}
