:root{
  --bg:#05070d;
  --panel:#0d111b;
  --panel-2:#121826;
  --panel-3:#181f2f;
  --text:#f5f7ff;
  --muted:#9ea9be;
  --line:#2a3448;
  --line-strong:#45536e;
  --violet:#b88cff;
  --cyan:#65e9ff;
  --gold:#ffd166;
  --green:#72f1a6;
  --red:#ff6f87;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body{overflow-x:hidden}
button,input,textarea{font:inherit}
.hidden,[hidden]{display:none!important}
#cosmicBackground{position:fixed;inset:0;width:100%;height:100%;z-index:0;background:#05070d;pointer-events:none}
.cosmicVignette{position:fixed;inset:0;z-index:1;pointer-events:none;border:clamp(10px,2vw,28px) solid rgba(5,7,13,.58)}
.site,.terminal-page{position:relative;z-index:2}
.site{min-height:100vh;padding:30px clamp(14px,4vw,58px) 70px}
.hero{max-width:1380px;margin:0 auto 30px;padding:22px 0 24px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:24px;align-items:flex-end;flex-wrap:wrap}
.brand{display:flex;gap:16px;align-items:center;max-width:760px}
.mark{width:64px;height:64px;flex:0 0 auto;border:2px solid var(--cyan);display:grid;place-items:center;background:#0b101b;color:var(--gold);font-size:32px;font-weight:1000;box-shadow:8px 8px 0 rgba(184,140,255,.18);transform:rotate(-5deg);border-radius:16px}
.brandCopy{min-width:0}
.eyebrow,.sectionEyebrow{font-size:11px;letter-spacing:2.4px;font-weight:1000;color:var(--cyan);text-transform:uppercase}
h1{font-size:clamp(44px,7vw,88px);letter-spacing:-4px;line-height:.86;margin:5px 0 0;text-shadow:4px 4px 0 rgba(184,140,255,.2)}
.tag{margin:12px 0 0;color:var(--muted);max-width:720px;line-height:1.5;font-size:14px}
.top-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;max-width:580px}
.navlink,.pill,.jgSmallBtn,.accountBadge{display:inline-flex;align-items:center;gap:6px;padding:9px 12px;border-radius:10px;border:1px solid var(--line);background:#0c111b;color:#dfe6f6;font-weight:900;font-size:12px;text-decoration:none;cursor:pointer}
.navlink:hover,.jgSmallBtn:hover{border-color:var(--cyan);background:#151d2b;color:#fff}
.pill{cursor:default;color:#aeb9cc}
.accountBadge{border-color:#326549;background:#0c2017;color:#caffdc}
.catalogBar{max-width:1380px;margin:0 auto 18px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.catalogBar strong{font-size:13px;letter-spacing:1.4px;text-transform:uppercase;color:#e9edfa}
.catalogBar span{font-size:12px;color:var(--muted)}
.grid{max-width:1380px;margin:0 auto;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}
.card{grid-column:span 4;border:1px solid var(--line);background:#0c111b;color:inherit;border-radius:18px;padding:10px 10px 14px;text-align:left;cursor:pointer;min-height:370px;box-shadow:0 18px 50px rgba(0,0,0,.34);transition:transform .18s ease,border-color .18s ease,background .18s ease;overflow:hidden;position:relative;width:100%}
#gameGrid .card:nth-child(1),#gameGrid .card:nth-child(2){grid-column:span 6}
.card:before{content:"";position:absolute;inset:0;border:1px solid transparent;border-radius:17px;pointer-events:none}
.card:hover,.card:focus-visible{transform:translateY(-6px);border-color:var(--line-strong);background:#111827;outline:none}
.card:focus-visible:before{border-color:var(--gold)}
.coverFrame{position:relative;width:100%;aspect-ratio:16/9;border:1px solid #323d54;background:#070b13;overflow:hidden;border-radius:12px;box-shadow:inset 0 0 0 4px rgba(0,0,0,.24)}
.coverFrame:after{content:"";position:absolute;inset:7px;border:1px solid rgba(255,255,255,.12);border-radius:7px;pointer-events:none}
.coverScene{display:block;width:100%;height:100%}
.coverImage{display:block;width:100%;height:100%;object-fit:cover;object-position:center;background:#05070d}
.cardCopy{padding:7px 6px 0}
.card h2{margin:9px 0 5px;font-size:clamp(20px,2vw,26px);letter-spacing:-.5px;line-height:1.05}
.card p{color:var(--muted);line-height:1.42;min-height:40px;margin:0;font-size:13px}
.gameMeta{display:flex;gap:6px;flex-wrap:wrap;margin-top:11px}
.metaChip{display:inline-flex;align-items:center;min-height:24px;padding:5px 8px;border-radius:7px;border:1px solid #334159;background:#111827;color:#d6deee;font-size:10px;font-weight:900;line-height:1}
.metaChip.version{border-color:#6e5d2b;color:#ffe69a;background:#211b0b}
.playRow{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:13px}
.play{display:inline-flex;padding:9px 12px;border-radius:9px;background:var(--gold);color:#12151b;font-weight:1000;font-size:12px}
.playArrow{font-size:18px;color:var(--cyan);transition:transform .18s ease}
.card:hover .playArrow{transform:translateX(4px)}
.note{font-size:10px;color:#758198;margin-top:9px;line-height:1.3}
.miniSection{max-width:1380px;margin:52px auto 0;padding-top:30px;border-top:1px solid var(--line)}
.sectionHead{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin:0 0 18px;flex-wrap:wrap}
.sectionHead h2{margin:4px 0 0;font-size:clamp(30px,5vw,50px);letter-spacing:-1.8px}
.sectionHead p{margin:7px 0 0;color:var(--muted);line-height:1.35}
.sectionCount{display:inline-flex;padding:8px 11px;border-radius:8px;border:1px solid #285a65;background:#0b2026;color:#c8f9ff;font-size:11px;font-weight:1000}
.miniGrid .card{grid-column:span 4;min-height:350px}

#playOverlay{position:fixed;inset:0;background:#080c18;z-index:1000;display:block;overflow:hidden;opacity:0;visibility:hidden;pointer-events:none}
#playOverlay.preloading{visibility:visible}
#playOverlay.active{opacity:1;visibility:visible;pointer-events:auto}
#frameWrap{position:absolute;inset:0;background:#080c18}
#gameFrame{position:absolute;inset:0;width:100%;height:100%;border:0;background:#080c18}
#loadingMsg{display:none}
.controls{position:absolute;left:12px;top:12px;display:flex;flex-direction:column;gap:7px;align-items:stretch;width:min(230px,calc(100vw - 24px));padding:9px;border:1px solid #4a566c;border-radius:13px;background:#080b11;box-shadow:0 16px 40px rgba(0,0,0,.55);opacity:0;pointer-events:none;transform:translateY(-8px);transition:opacity .1s linear,transform .1s linear;z-index:2147483601}
.controls.forceVisible{opacity:1;pointer-events:auto;transform:translateY(0)}
.gameTitleBadge,.controls button{border:1px solid #4a566c;background:#080b11;color:#fff;padding:9px 12px;border-radius:9px;font-weight:900}
.gameTitleBadge{max-width:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;color:#cfefff}
.controls button{cursor:pointer}
.controls button:hover{background:#182133;border-color:var(--cyan)}
.terminal-page{min-height:100vh;padding:30px clamp(12px,3vw,40px)}
.terminal-shell{max-width:1280px;margin:0 auto}
.terminal-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.terminal-head h2{font-size:clamp(32px,5vw,58px);line-height:1;margin:0}
.terminal-head p{color:var(--muted);margin:8px 0 0}
.terminal-tabs,.terminal-actions,.terminal-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}
.terminal-tabs button,.backlink,.terminal-actions button,.terminal-status{border:1px solid var(--line);border-radius:9px;background:#101622;color:white;padding:10px 14px;font-weight:900;cursor:pointer;text-decoration:none}
.terminal-tabs .active,.terminal-actions #runBtn{background:var(--gold);color:#15171d;border-color:var(--gold)}
.terminal-grid{display:grid;grid-template-columns:minmax(320px,1fr) minmax(320px,1fr);gap:16px}
.editor-panel,.output-panel{background:#0c111b;border:1px solid var(--line);border-radius:14px;padding:14px;min-height:620px}
.pane{display:none}.active-pane{display:block}
label,.preview-title{display:block;margin:0 0 8px;font-weight:1000;color:#ffe89a}
textarea{width:100%;min-height:112px;margin:0 0 12px;border-radius:10px;border:1px solid #2a3448;background:#05070d;color:#e9fff4;padding:12px;font:13px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;resize:vertical}
.js-pane textarea,.py-pane textarea{min-height:430px}
#preview{width:100%;height:360px;border:0;border-radius:10px;background:#fff}
#consoleOut{height:190px;margin:0;overflow:auto;background:#05070d;color:#91ffb3;border-radius:10px;padding:12px;font:13px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.terminal-status{cursor:default;padding:8px 11px;color:#b9c2d3;font-size:11px}
.terminal-status.running{color:#ffe89a;border-color:#6e5d2b}.terminal-status.ok{color:#baffca;border-color:#35684c}.terminal-status.error{color:#ffb9c8;border-color:#743544}
.terminal-tip,.terminal-draft-note{color:#8f9ab0;font-size:11px;line-height:1.35}
.terminal-pane-label{display:flex;justify-content:space-between;gap:8px;align-items:center}.terminal-pane-label small{font-size:10px;color:#8994aa;font-weight:700}

.escape-road-link{cursor:pointer;appearance:none}
#escapeRoadPage{position:fixed;inset:0;z-index:2147482500;background:#000;display:none;overflow:hidden}
#escapeRoadPage.active{display:block}
#escapeRoadFrame{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}
#escapeRoadBack{position:absolute;left:max(12px,env(safe-area-inset-left));top:max(12px,env(safe-area-inset-top));z-index:2147483601;border:1px solid #526078;border-radius:9px;background:#080b11;color:#fff;padding:10px 14px;font:900 13px/1 Arial,sans-serif;cursor:pointer}

#searchEnginePage{position:fixed;inset:0;z-index:2147482500;background:#fff;display:none;overflow:hidden}
#searchEnginePage.active{display:block}
#searchEngineFrame{position:absolute;inset:0;width:100%;height:100%;border:0;background:#fff}
#searchEngineBack{position:absolute;right:max(12px,env(safe-area-inset-right));top:max(12px,env(safe-area-inset-top));z-index:2147483601;border:1px solid #526078;border-radius:9px;background:#080b11;color:#fff;padding:10px 14px;font:900 13px/1 Arial,sans-serif;cursor:pointer;box-shadow:0 8px 26px rgba(0,0,0,.35)}

#jgCloudAlarm{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:2147483646;width:min(760px,calc(100vw - 28px));padding:13px 16px;border-radius:12px;border:1px solid var(--line-strong);background:#0c111b;box-shadow:0 18px 60px rgba(0,0,0,.55);font-weight:900;font-size:13px;line-height:1.35;display:none}
#jgCloudAlarm.show{display:block}#jgCloudAlarm.ok{border-color:#3e855d;color:#d9ffe5}#jgCloudAlarm.error{border-color:#a94459;color:#ffd4dc;background:#260810}#jgCloudAlarm.warn{border-color:#8a7130;color:#fff0a8}
#jgAuthOverlay{position:fixed;inset:0;z-index:2147483000;background:rgba(0,0,0,.88);display:grid;place-items:center;padding:18px}
#jgAuthOverlay.hidden{display:none!important}
.jgAuthBox{width:min(470px,calc(100vw - 28px));border:1px solid var(--line-strong);border-radius:20px;background:#0c111b;box-shadow:16px 16px 0 rgba(101,233,255,.08);padding:24px;color:#fff;text-align:left}
.jgAuthBox.dashboard-mode{width:min(780px,calc(100vw - 28px));max-height:calc(100vh - 36px);overflow:auto}
.jgAuthBox h2{font-size:clamp(30px,6vw,50px);line-height:.95;margin:0 0 8px}
.jgAuthBox p{margin:0 0 14px;color:var(--muted);line-height:1.4}
.jgAuthBox label{display:block;margin:11px 0 5px;font-weight:1000;color:#ffe89a}
.jgAuthBox input{width:100%;border:1px solid var(--line);background:#05070d;color:#fff;border-radius:10px;padding:13px 14px;font-size:18px;outline:none}
.jgAuthBox input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(255,209,102,.12)}
.jgAuthActions,.jgDashActions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.jgAuthActions button,.jgDashActions button{border:1px solid var(--line);border-radius:9px;background:#151c2a;color:white;padding:11px 14px;font-weight:1000;cursor:pointer}
.jgAuthActions button.primary,.jgDashActions .primary{border-color:var(--gold);background:var(--gold);color:#14161b}
.jgAuthActions button.danger,.jgDashActions .danger,.jgSmallBtn.danger{background:#281019;border-color:#7c3546;color:#ffd7df}
.jgAuthActions button:disabled,.jgDashActions button:disabled{opacity:.55;cursor:not-allowed}
.jgAuthStatus{min-height:20px;margin-top:12px;color:#ffe89a;font-size:13px;line-height:1.35;white-space:pre-wrap}
.jgAuthTiny,.jgDashSub,.jgDashEmpty{font-size:11px;color:#8f9ab0;line-height:1.35}
.jgListBox,.jgDeleteBox,.jgDashSection{margin-top:13px;border:1px solid var(--line);background:#101622;border-radius:13px;padding:12px}
.jgAccountChoice{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;margin:6px 0;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:#080b11;color:#fff;font-weight:900;cursor:pointer;text-align:left}
.jgWarn{color:#ffbac8;font-size:12px;line-height:1.35;margin-top:6px}
.jgLoginPanel.hidden,.jgDashboard.hidden,.jgListBox.hidden,.jgDeleteBox.hidden{display:none!important}
.jgDashHead{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.jgDashIdentity{display:flex;align-items:center;gap:12px}
.jgDashAvatar{width:58px;height:58px;border:2px solid var(--cyan);border-radius:15px;display:grid;place-items:center;background:#101622;color:var(--gold);font-size:31px;font-weight:1000;transform:rotate(-4deg)}
.jgDashUser{font-size:clamp(28px,5vw,46px);font-weight:1000;line-height:.95}
.jgDashStats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:18px 0}
.jgDashStat{border:1px solid var(--line);background:#101622;border-radius:12px;padding:13px}
.jgDashStat span{display:block;color:#929db1;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.6px}.jgDashStat b{display:block;margin-top:5px;font-size:18px;color:#fff}
.jgDashSection h3{margin:0 0 10px;font-size:16px}
.jgDashGames{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px}.jgDashGame{border:1px solid var(--line);background:#090d15;border-radius:9px;padding:10px}.jgDashGame b{display:block;font-size:13px}.jgDashGame span{display:block;color:#8f9ab0;font-size:11px;margin-top:4px}
.jgDashHighlights{display:flex;gap:8px;flex-wrap:wrap}.jgHighlight{border:1px solid #6e5d2b;background:#211b0b;border-radius:9px;padding:9px 11px;font-size:12px}
.jgDashActions .save,.jgSaveAll{background:#0d2017!important;border-color:#35684c!important;color:#d9ffe5!important}.jgRescue{border-color:#8a7130!important;background:#211b0b!important;color:#fff1ad!important}
.jgDangerNote{margin-top:10px;padding:10px 12px;border:1px solid #6e5d2b;border-radius:9px;background:#211b0b;color:#ffeaa0;font-size:11px;line-height:1.4}
.jgCloudBad{color:#ffb7c5!important}.jgCloudGood{color:#baffca!important}

@media(max-width:1000px){.card,.miniGrid .card{grid-column:span 6}#gameGrid .card:nth-child(1),#gameGrid .card:nth-child(2){grid-column:span 6}}
@media(max-width:820px){.terminal-grid{grid-template-columns:1fr}.gameTitleBadge{display:none}.controls button{padding:9px 10px}.hero{align-items:flex-start}.top-actions{justify-content:flex-start}.brand{align-items:flex-start}}
@media(max-width:620px){.site{padding:18px 12px 52px}.grid{gap:13px}.card,.miniGrid .card,#gameGrid .card:nth-child(1),#gameGrid .card:nth-child(2){grid-column:span 12}.card{min-height:0}.mark{width:52px;height:52px;font-size:26px}h1{font-size:43px;letter-spacing:-2.6px}.top-actions .pill{display:none}.jgDashStats{grid-template-columns:1fr}.jgAuthBox.dashboard-mode{width:min(96vw,780px)}.jgDashActions button{flex:1 1 150px}}
@media(prefers-reduced-motion:reduce){.card,.playArrow{transition:none}}