/* games.css — FRONTEND. Styles for the phone games overlay. */
#ov{--display:'Lilita One',system-ui,sans-serif;--body:system-ui,-apple-system,'Segoe UI',sans-serif;--gold:#ffd23f;--green:#2FD36B;touch-action:pan-y;z-index:55;user-select:none}
#ov .btn{font:800 15px var(--body);padding:13px 14px;border-radius:14px;border:2px solid #3a4252;background:#292f3b;color:#fff;cursor:pointer;text-align:left}
#ov .btn.go{background:var(--green);border-color:#1da34d;text-align:center;color:#05301a}#ov .btn.big{font-size:22px;text-align:center;padding:18px;background:#FFD23F;border-color:#c99a00;color:#3a2a00}
.gchs{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px;justify-content:center}.gch{font-size:12px;font-weight:800;padding:5px 9px;border-radius:99px;background:#2a303c;color:#fff}.gch.up{color:#6ee7a0}.gch.down{color:#ff8f8f}
.pad,.fbtns2 button,.fwrap canvas{touch-action:none}
.tbn{color:#b9c6e6;line-height:1.45;font-size:14px;margin:4px 0 12px}
.gm{display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:center;width:100%;text-align:left;background:#ffffff12;border:1px solid #ffffff22;border-radius:16px;padding:12px;color:#fff;font:700 15px var(--body);margin-bottom:10px;cursor:pointer}.gm small{color:#9fb4dc;font-weight:600}.ge{font-size:30px;text-align:center}
/* overlay + landscape games */
#ov{position:fixed;inset:0;z-index:40;background:#07122b;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top,0px)}
#ov.rot{inset:auto;top:0;left:0;width:100vh;height:100vw;transform-origin:0 0;transform:translateX(100vw) rotate(90deg);padding-top:0}
.ovh{display:flex;justify-content:space-between;align-items:center;padding:10px max(16px,env(safe-area-inset-left,0px));color:#fff;font:400 20px var(--display)}
.ovh button{font:800 16px var(--body);background:#ffffff1a;color:#fff;border:1px solid #ffffff33;border-radius:99px;width:38px;height:38px}
.ovb{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;gap:8px;padding-bottom:max(12px,env(safe-area-inset-bottom,0px));overflow:auto}
#ov.land .ovh{position:absolute;top:0;left:0;right:0;z-index:60;background:none;pointer-events:none;padding:6px 10px}#ov.land .ovh b{display:none}#ov.land .ovh button{pointer-events:auto}
#ov.land .ovb{padding:0;gap:0;overflow:hidden}
.fwrap{position:relative;flex:1;min-height:0;width:100%;display:flex;justify-content:center;align-items:center}
.fwrap canvas{height:100%;max-width:100%;aspect-ratio:1120/720;touch-action:none}
.pad{position:absolute;left:0;top:0;bottom:0;width:42%;z-index:3}
.pad .ring{position:absolute;left:34px;bottom:34px;width:110px;height:110px;border-radius:50%;border:3px solid #ffffff66;background:#ffffff14}.pad .ring i{position:absolute;left:50%;top:50%;width:48px;height:48px;margin:-24px 0 0 -24px;border-radius:50%;background:#ffffffaa}
.fhud2{position:absolute;top:8px;left:50%;transform:translateX(-50%);z-index:4;background:#0009;color:#fff;font:700 14px var(--body);padding:6px 14px;border-radius:99px;white-space:nowrap}
.fbtns2{position:absolute;right:max(26px,env(safe-area-inset-right,0px));bottom:26px;z-index:4;display:flex;gap:14px;align-items:flex-end}
.fbtns2 button{font:400 22px var(--display);border:0;color:#05301a;background:#2FD36B;border-radius:50%;width:92px;height:92px;touch-action:none;display:grid;place-items:center;line-height:1}.fbtns2 button small{display:block;font:700 9px var(--body);opacity:.7}.fbtns2 #fpass{background:#38BDF8;color:#04223a;width:76px;height:76px}
.pw{position:absolute;right:0;bottom:104px;width:92px;height:8px;border-radius:99px;background:#ffffff33;overflow:hidden}.pw i{display:block;height:100%;width:0;background:#FFD23F}
.fcover,.rotcov{position:absolute;inset:0;background:#07122bef;display:grid;place-items:center;text-align:center;color:#fff;padding:20px;z-index:8}
.rotcov{position:fixed;z-index:50}.fcover h2,.rotcov h2{font-family:var(--display);font-weight:400;font-size:28px;margin:6px 0}.fcover p,.rotcov p{color:#b9c6e6;line-height:1.5;margin:8px 0 14px}

.cpw{position:relative;border-radius:16px;overflow:hidden;border:3px solid #fff;background:#fff}.csv{display:block;width:100%;height:auto}
.cbub{position:absolute;max-width:62%;background:#fff;color:#10131a;border-radius:14px;padding:6px 10px;font:800 12px var(--body);line-height:1.25;box-shadow:0 2px 8px #0004}
.ccap{margin:10px 2px;color:#dbe4ff;font-weight:700;font-size:14px;min-height:40px}.cnav{display:flex;justify-content:space-between;align-items:center;gap:8px}.cnav .btn{padding:11px 16px;text-align:center}
.shelf{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.cvr{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;border:0;border-radius:18px;padding:14px;color:#10131a;cursor:pointer;min-height:150px}.ce{font-size:34px}.cvr b{font:400 20px var(--display)}.cvr small{font-weight:700;font-size:12px}.cvr em{margin-top:auto;font-style:normal;font-size:11px;font-weight:800;opacity:.7}
.ayosc{display:flex;justify-content:space-between;font:400 20px var(--display);margin-bottom:8px}.ayob{display:grid;gap:10px;background:#7a4f2a;border-radius:18px;padding:12px;border:3px solid #4d2f14}.ayor{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
.pit{aspect-ratio:1;border-radius:50%;border:0;background:#3d2410;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;font:800 11px var(--body);padding:2px;box-shadow:inset 0 3px 8px #000a}.pit b{font:400 22px var(--display);line-height:1}.pit span{font-size:7px;color:#ffd9a3;line-height:1;word-break:break-all;max-width:90%}.pit.me:not([disabled]){background:#5a3516;outline:2px solid #FFD23F;cursor:pointer}.pit[disabled]{opacity:.9}
#ov canvas{position:static;inset:auto;width:auto;height:auto;display:block}
#ov .fwrap canvas{height:100%;width:auto;max-width:100%}