:root{--bg:#050913;--panel:#0b1220;--panel2:#10192a;--text:#f5f7fb;--muted:#a7b2c6;--line:#26334a;--pink:#ff2f75;--purple:#8b5cff;--cyan:#26d9ff;--green:#32df8b}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 50% -12%,#182640 0,#07101d 35%,#04070d 75%);color:var(--text);font-family:Inter,Arial,sans-serif;min-height:100vh}.rg-nav{height:78px;display:flex;align-items:center;padding:0 28px;border-bottom:1px solid #172238;background:rgba(3,7,14,.88);backdrop-filter:blur(14px);position:sticky;top:0;z-index:20}.rg-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;min-width:260px}.rg-brand-icon{font-size:40px;filter:drop-shadow(0 0 12px #7d5cff)}.rg-brand b{display:block;font-size:25px;line-height:.9;letter-spacing:-.04em}.rg-brand small{display:block;color:#27dcff;font-weight:900;font-size:13px;letter-spacing:.04em}.rg-nav nav{display:flex;gap:28px;align-items:center;flex:1;justify-content:center}.rg-nav nav a{color:#e6ebf4;text-decoration:none;font-weight:700;font-size:16px;padding:29px 0;position:relative}.rg-nav nav a:hover,.rg-nav nav a.active{color:#ff4f91}.rg-nav nav a.active:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--pink);box-shadow:0 0 12px var(--pink)}.rg-full{background:#0b1220;border:1px solid #344159;color:#fff;border-radius:12px;padding:11px 17px;font-weight:800;white-space:nowrap;cursor:pointer;text-decoration:none}.rg-wrap{max-width:1520px;margin:auto;padding:22px 18px 50px}.hero{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px;padding:30px 34px;border:1px solid #1c2940;border-radius:20px;background:linear-gradient(135deg,#0d1729,#08101c);box-shadow:0 20px 60px #0006}.rg-kicker{display:inline-block;color:#b8c3d7;font-size:12px;font-weight:900;letter-spacing:.12em}.hero h1{font-size:42px;margin:8px 0 5px;letter-spacing:-.04em}.hero p{margin:0;color:var(--muted)}.hero-play,.btn{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#ff2e74,#c51f59);color:#fff;border:0;border-radius:12px;padding:14px 20px;font-weight:900;text-decoration:none;cursor:pointer;box-shadow:0 10px 30px #ff2f7530}.hero-play:hover,.btn:hover{filter:brightness(1.08);transform:translateY(-1px)}.rg-filters{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0 22px}.rg-filter{border:1px solid var(--line);background:#0a111d;color:#e5ebf4;border-radius:10px;padding:10px 15px;text-decoration:none;font-weight:800}.rg-filter.active,.rg-filter:hover{background:var(--pink);border-color:var(--pink);color:#fff}.rg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}.rg-card{background:linear-gradient(180deg,#111b2b,#09101b);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 14px 40px #0007}.rg-cover{aspect-ratio:4/3;background:#070c14;display:flex;align-items:center;justify-content:center;overflow:hidden}.rg-cover img{width:100%;height:100%;object-fit:cover}.rg-placeholder{font-size:50px}.rg-card-body{padding:16px}.rg-system{color:#30dfb1;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.rg-name{font-size:19px;font-weight:900;margin:7px 0 14px}.rg-play{display:block;text-align:center;text-decoration:none;background:var(--pink);color:#fff;padding:12px;border-radius:10px;font-weight:900}.rg-empty{text-align:center;padding:60px 20px;border:1px dashed var(--line);border-radius:18px;color:var(--muted)}.local-wrap{max-width:1520px;margin:auto;padding:24px 18px 50px}.local-grid{display:grid;grid-template-columns:minmax(0,2.05fr) minmax(330px,.95fr);gap:18px}.upload-panel,.how-panel,.ready-section,.player-section{border:1px solid #1c2940;border-radius:18px;background:linear-gradient(145deg,#0d1728,#07101d);box-shadow:0 18px 55px #0007}.upload-panel{padding:28px}.section-title{display:flex;gap:15px;align-items:flex-start}.section-title>span{font-size:29px}.section-title h1{margin:0 0 9px;font-size:30px;letter-spacing:-.03em}.section-title p{margin:0;color:#aeb9cc;line-height:1.55}.drop{margin-top:20px;min-height:295px;border:1.5px dashed #a943e7;border-radius:18px;background:radial-gradient(circle at 50% 30%,#111a32,#08101e);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;transition:.2s}.drop.drag{border-color:var(--cyan);box-shadow:0 0 35px #26d9ff22;background:#0c1727}.drop input{display:none}.drop-icon{font-size:64px;line-height:1;margin-bottom:13px;filter:drop-shadow(0 0 14px #a45dff)}.drop h2{font-size:19px;margin:0 0 10px}.or{color:#aab5c9;margin-bottom:9px}.btn-big{font-size:16px;padding:13px 28px}.drop-hint{color:#9faac0;font-size:13px;line-height:1.6;margin-top:14px}.platforms{margin-top:10px;border:1px solid #223049;border-radius:14px;padding:14px 18px}.platforms>b{font-size:14px}.platforms>div{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.platforms span{border:1px solid #34445f;background:#0b1422;border-radius:8px;padding:8px 11px;color:#e0e7f1;font-size:12px;font-weight:700}.how-panel{padding:30px 26px}.how-panel h2{font-size:22px;margin:0 0 25px}.step{display:flex;gap:17px;margin:0 0 25px}.step i{font-style:normal;font-size:30px;width:32px;color:#b761ff;text-shadow:0 0 16px #b761ff}.step b{font-size:15px}.step p{color:#9faac0;font-size:13px;line-height:1.55;margin:8px 0 0}.ready-section{display:grid;grid-template-columns:minmax(0,2fr) minmax(310px,.9fr);gap:18px;margin-top:18px;padding:25px}.ready-title{display:flex;gap:14px;align-items:center}.ready-title>span{font-size:28px}.ready-title h2{margin:0;font-size:23px}.ready-title p{margin:6px 0 0;color:#a7b2c5}.files{display:grid;gap:10px;margin-top:20px}.file{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 15px;border:1px solid #25334a;border-radius:13px;background:#0c1524}.file-info{display:flex;align-items:center;gap:13px;min-width:0}.file-icon{font-size:27px}.file-info strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-info em{font-style:normal;color:#23e1b1;font-size:12px;font-weight:800}.file-info small{color:#8390a6;margin-left:7px}.play-btn{padding:11px 25px;min-width:125px}.notice{margin-top:17px;padding:12px 14px;color:#dce3ee;font-size:13px;line-height:1.6;border-top:1px solid #233149}.notice small{color:#8d99ad}.trouble{border:1px solid #26354d;border-radius:14px;padding:25px;background:#0a1321}.trouble h3{color:#ff55a0;margin:0 0 20px;font-size:18px}.trouble ul{padding:0;margin:0;list-style:none}.trouble li{margin:0 0 17px;padding-left:27px;position:relative;color:#d9e0eb;font-size:13px;line-height:1.45}.trouble li:before{content:"✓";position:absolute;left:0;color:#32df8b;font-weight:900;font-size:18px}.player-section{display:none;margin-top:18px;padding:18px}.player-section.visible{display:block}.player-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:15px}.player-kicker{color:#2ee0b2;font-size:11px;font-weight:900;letter-spacing:.12em}.player-head h2{margin:5px 0 0;font-size:22px}.btn.secondary{background:#1b273a;box-shadow:none}.player{background:#000;border-radius:13px;overflow:hidden;min-height:620px;border:1px solid #26334b;position:relative}.game-frame{display:block;width:100%;height:min(76vh,800px);min-height:540px;border:0;background:#000;position:relative;z-index:2}.game-loading{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:radial-gradient(circle at 50% 40%,#0c1730 0,#030710 58%,#010207 100%);padding:30px;transition:opacity .45s,visibility .45s}.game-loading.hidden{opacity:0;visibility:hidden;pointer-events:none}.loading-icon{font-size:72px;line-height:1;margin-bottom:18px;filter:drop-shadow(0 0 20px #a553ff);animation:loadPulse 1.4s ease-in-out infinite}.loading-title{font-size:29px;font-weight:1000;letter-spacing:.02em;background:linear-gradient(90deg,#ff3b8a,#9b5cff,#22d9ff);-webkit-background-clip:text;background-clip:text;color:transparent}.loading-dots{display:inline-block;width:28px;text-align:left;animation:dotPulse 1.2s steps(4,end) infinite}.loading-bar{width:min(460px,80%);height:7px;border-radius:99px;background:#151d32;margin-top:25px;overflow:hidden;box-shadow:0 0 18px #7d4fff22}.loading-bar-fill{width:8%;height:100%;border-radius:99px;background:linear-gradient(90deg,#ff3b8a,#985aff,#22d9ff);box-shadow:0 0 15px #a453ff;transition:width .35s ease}.loading-status{margin-top:16px;color:#dbe3ef;font-size:15px}.loading-percent{color:#25d8ff;font-weight:900;font-size:17px;margin-top:4px}.loading-steps{width:min(760px,92%);display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:30px;padding:20px 16px;border:1px solid #26354e;border-radius:16px;background:#080f1d}.loading-step{display:flex;flex-direction:column;align-items:center;gap:9px;color:#65728a;font-size:12px;font-weight:800;transition:.25s}.loading-step i{font-style:normal;font-size:27px;filter:grayscale(1);opacity:.55}.loading-step.active{color:#fff}.loading-step.active i{filter:none;opacity:1;text-shadow:0 0 16px #9b5cff;animation:stepPulse 1s ease-in-out infinite}.loading-step.done{color:#32df8b}.loading-step.done i{filter:none;opacity:1}.loading-tip{margin-top:24px;color:#aeb9cc;font-size:13px}.loading-tip b{color:#fff}@keyframes loadPulse{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.08);opacity:1}}@keyframes dotPulse{0%{opacity:.2}50%{opacity:1}100%{opacity:.2}}@keyframes stepPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}.rg-footer{margin-top:18px;border:1px solid #1b2940;border-radius:18px;background:#0a1220;padding:20px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px}.rg-footer b{display:block;color:#8f5dff;font-size:16px}.rg-footer span{display:block;color:#9ba7bb;margin-top:4px;font-size:13px}.footer-features{display:flex;gap:30px;flex-wrap:wrap}.footer-features span{color:#d7dfeb;font-size:13px}@media(max-width:1000px){.rg-nav{padding:0 14px}.rg-nav nav{gap:12px}.rg-nav nav a{font-size:13px}.rg-brand{min-width:190px}.local-grid,.ready-section{grid-template-columns:1fr}.hero{flex-direction:column;align-items:flex-start}.rg-footer{flex-direction:column;align-items:flex-start}}@media(max-width:700px){.rg-nav{height:auto;min-height:70px;flex-wrap:wrap;padding:10px 12px}.rg-nav nav{order:3;width:100%;overflow:auto;justify-content:flex-start}.rg-nav nav a{padding:10px 2px;white-space:nowrap}.rg-full{margin-left:auto}.rg-brand-icon{font-size:30px}.rg-brand b{font-size:20px}.hero h1{font-size:31px}.upload-panel,.how-panel,.ready-section{padding:18px}.drop{min-height:260px;padding:20px}.file{align-items:stretch}.file-info{min-width:0}.play-btn{min-width:100px}.player-head{align-items:flex-start;flex-direction:column}.game-frame{min-height:420px;height:65vh}.footer-features{gap:12px}.rg-wrap,.local-wrap{padding-left:10px;padding-right:10px}}/* v1.4 hardening: guaranteed loading overlay */
.player{isolation:isolate;position:relative;min-height:620px}
.game-frame{position:relative;z-index:1!important}
.game-loading{position:absolute!important;inset:0!important;z-index:999!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;box-sizing:border-box!important;background:radial-gradient(circle at 50% 40%,#0c1730 0,#030710 58%,#010207 100%)!important;color:#f5f7fb!important;padding:30px!important;font-family:Inter,Arial,sans-serif!important;opacity:1!important;visibility:visible!important}
.game-loading.hidden{opacity:0!important;visibility:hidden!important;pointer-events:none!important}
.loading-icon{font-size:72px!important;line-height:1!important;margin-bottom:18px!important}
.loading-title{font-size:29px!important;line-height:1.2!important;font-weight:900!important;color:#fff!important;background:none!important;-webkit-text-fill-color:initial!important}
.loading-dots{display:inline-block!important;width:28px!important;color:#22d9ff!important}
.loading-bar{display:block!important;width:min(460px,80%)!important;height:7px!important;border-radius:99px!important;background:#151d32!important;margin-top:25px!important;overflow:hidden!important}
.loading-bar-fill{display:block!important;width:8%;height:100%!important;border-radius:99px!important;background:linear-gradient(90deg,#ff3b8a,#985aff,#22d9ff)!important;transition:width .35s ease!important}
.loading-status{margin-top:16px!important;color:#dbe3ef!important;font-size:15px!important;line-height:1.4!important}
.loading-percent{color:#25d8ff!important;font-weight:900!important;font-size:17px!important;margin-top:4px!important}
.loading-steps{width:min(760px,92%)!important;display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:8px!important;margin-top:30px!important;padding:20px 16px!important;border:1px solid #26354e!important;border-radius:16px!important;background:#080f1d!important}
.loading-step{display:flex!important;flex-direction:column!important;align-items:center!important;gap:9px!important;color:#65728a!important;font-size:12px!important;font-weight:800!important}
.loading-step i{font-style:normal!important;font-size:27px!important}
.loading-step.active{color:#fff!important}.loading-step.done{color:#32df8b!important}
.loading-tip{margin-top:24px!important;color:#aeb9cc!important;font-size:13px!important;line-height:1.4!important}.loading-tip b{color:#fff!important}
@media(max-width:700px){.loading-steps{grid-template-columns:repeat(2,1fr)!important}.loading-title{font-size:23px!important}.loading-icon{font-size:56px!important}.loading-bar{width:90%!important}.game-loading{padding:18px!important}}

/* v1.5 layout: compact upload area so READY FILES stays visible */
@media(min-width:1001px){
  .local-wrap{padding-top:20px}
  .local-grid{align-items:start}
  .upload-panel{padding:24px}
  .section-title{gap:13px}
  .section-title>span{font-size:27px}
  .section-title h1{font-size:29px;margin-bottom:7px}
  .section-title p{line-height:1.45}
  .drop{margin-top:16px;min-height:205px;height:205px;padding:18px}
  .drop-icon{font-size:48px;margin-bottom:8px}
  .drop h2{font-size:18px;margin-bottom:7px}
  .or{margin-bottom:6px}
  .btn-big{font-size:15px;padding:11px 25px}
  .drop-hint{font-size:12px;line-height:1.45;margin-top:10px}
  .platforms{padding:11px 15px;margin-top:9px}
  .platforms>div{gap:6px;margin-top:8px}
  .platforms span{padding:7px 10px;font-size:11px}
  .how-panel{padding:25px 24px}
  .how-panel h2{margin-bottom:21px}
  .step{margin-bottom:20px;gap:14px}
  .step p{margin-top:5px}
}
@media(max-width:1000px){
  .drop{min-height:220px}
}

/* v1.7 graphics enhancement: EmulatorJS starts with 4xScaleHQ shader for smoother retro pixels. */
.player{background:#000;box-shadow:0 0 0 1px #17233a,0 20px 70px #0009}
.game-frame{image-rendering:auto;background:#000}
.player-kicker{color:#31dfff}

/* v2.8 graphics: make the emulator viewport present like a clean retro display. */
.player{background:#000;box-shadow:0 0 0 1px #17233a,0 24px 80px #000c}
.game-frame{background:#000}

/* v2.9 — two players, one keyboard */
.keyboard-panel{margin-top:22px;padding:22px 24px;background:linear-gradient(180deg,#091221,#060b14);border:1px solid #18263b;border-radius:18px;box-shadow:0 18px 50px #0008;color:#f5f7fb}
.keyboard-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.keyboard-head h2{margin:5px 0 5px;font-size:22px}.keyboard-head p{margin:0;color:#8fa0b8;font-size:13px}.kb-mode-badge{padding:10px 13px;border:1px solid #2a3952;border-radius:12px;color:#31dfff;font-weight:800;background:#0b1524}.keyboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:16px}.kb-card{border:1px solid #1b2a40;border-radius:14px;padding:15px 16px;background:#0a1220}.kb-card h3{margin:0 0 12px;font-size:13px;color:#ff4f8b;letter-spacing:.08em}.kb-line{display:flex;justify-content:space-between;gap:16px;padding:8px 0;border-top:1px solid #142238;font-size:12px}.kb-line:first-of-type{border-top:0}.kb-line span{color:#8fa0b8}.kb-line b{color:#fff;text-align:right}.kb-note{margin-top:14px;padding-top:12px;border-top:1px solid #17253a;color:#90a1b8;font-size:12px;line-height:1.45}
@media(max-width:700px){.keyboard-grid{grid-template-columns:1fr}.keyboard-head h2{font-size:18px}.kb-line{font-size:11px}}
