.fgs-wrapper{ --fgs-bg:#0f172a; --fgs-card:#111827; --fgs-ink:#e5e7eb; --fgs-accent:#22d3ee; --fgs-win:#22c55e; --fgs-lose:#ef4444; font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji"; color:var(--fgs-ink); background:linear-gradient(180deg,#0b1020,#0f172a 30%); border-radius:1.25rem; padding:1rem; box-shadow:0 10px 40px rgba(0,0,0,.5);}
.fgs-toolbar{ display:flex; gap:.5rem; align-items:center; justify-content:space-between; flex-wrap:wrap; margin-bottom:.75rem}
.fgs-btn{ background:linear-gradient(180deg,#1f2937,#0b1020); color:var(--fgs-ink); border:1px solid #334155; padding:.5rem .8rem; border-radius:.75rem; cursor:pointer; transition:.15s transform, .15s box-shadow; box-shadow:0 2px 0 #000;}
.fgs-btn:hover{ transform:translateY(-1px); box-shadow:0 6px 16px rgba(0,0,0,.35)}
.fgs-status{ font-weight:700; letter-spacing:.3px}
.fgs-stage{ background:radial-gradient(60% 60% at 50% 0%, rgba(34,211,238,.08), transparent), #0b1020; border:1px solid #223; border-radius:1rem; min-height:320px; display:grid; place-items:center; padding:1rem; overflow:hidden}
.fgs-help-panel{ background:#0b1020; border:1px solid #334155; border-radius:.75rem; padding:.75rem; margin-top:.75rem}
.fgs-grid{ display:grid; gap:.5rem}
.fgs-card{ background:linear-gradient(180deg,#0f172a,#020617); border:1px solid #223; border-radius:.75rem; display:grid; place-items:center; aspect-ratio:1; user-select:none; cursor:pointer; font-size:1.5rem; position:relative; overflow:hidden}
.fgs-card.revealed{ outline:2px solid var(--fgs-accent)}
.fgs-badge{ padding:.2rem .5rem; border-radius:.5rem; font-size:.8rem; background:#111827; border:1px solid #334155}
.fgs-pads{ display:grid; grid-template-columns:repeat(2,minmax(120px,1fr)); gap:1rem; width:100%}
.fgs-pad{ height:120px; border-radius:1rem; border:2px solid #111; filter:saturate(1.2); cursor:pointer; box-shadow: inset 0 0 20px rgba(255,255,255,.05)}
.fgs-pad[data-color="g"]{ background:#16a34a}
.fgs-pad[data-color="r"]{ background:#ef4444}
.fgs-pad[data-color="b"]{ background:#3b82f6}
.fgs-pad[data-color="y"]{ background:#eab308}
.fgs-grid-ttt{ grid-template-columns:repeat(3, minmax(80px, 1fr)); width:min(420px,100%);}
.fgs-grid-memory{ grid-template-columns:repeat(4, minmax(60px, 1fr)); width:min(520px,100%);}
.fgs-grid-2048{ grid-template-columns:repeat(4, 1fr); width:min(520px,100%); padding:1rem}
.fgs-2048-cell{ position:relative; aspect-ratio:1; background:#111827; border-radius:.75rem; display:grid; place-items:center; font-weight:800; font-size:1.25rem}
.fgs-2048-n{ position:absolute; inset:.25rem; border-radius:.65rem; display:grid; place-items:center; padding:.25rem; background:#0b1020; border:1px solid #223}
.fgs-rps{ display:flex; gap:.75rem; flex-wrap:wrap; justify-content:center}
.fgs-rps .fgs-card{ width:120px; font-size:2rem}
.fgs-holes{ display:grid; grid-template-columns:repeat(3, 1fr); gap:1rem; width:min(500px,100%)}
.fgs-hole{ position:relative; height:120px; border-radius:1rem; background:linear-gradient(180deg,#020617,#0b1020); border:1px solid #223; overflow:hidden}
.fgs-mole{ position:absolute; left:50%; transform:translateX(-50%); bottom:-120px; width:80px; height:80px; border-radius:50%; background:#c084fc; transition:.1s}
.fgs-hole.show .fgs-mole{ bottom:10px}
.fgs-canvas{ width:min(560px,100%); height:360px; background:#020617; border-radius:1rem; border:1px solid #223}
.fgs-keys{ display:flex; gap:.5rem; flex-wrap:wrap}
.fgs-key{ border:1px solid #223; background:#0b1020; padding:.25rem .45rem; border-radius:.5rem}
.fgs-input{ background:#0b1020; border:1px solid #334155; color:#e5e7eb; border-radius:.5rem; padding:.5rem .6rem}