/* Graphics menu (js/fx.js): Minecraft "Video Settings" look */
.fxmenu{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:640px;max-width:calc(100vw - 32px);max-height:calc(100vh - 120px);overflow:auto;
 padding:14px 16px 16px;background:rgba(0,0,0,.72);border:2px solid #1a1a1a;box-shadow:0 0 0 2px #555;pointer-events:auto;z-index:6;color:#fff}
.fxmenu h2{margin:0 0 10px;text-align:center;font-size:18px;color:#fff;text-shadow:2px 2px 0 #3f3f3f}
.fxmenu h3{margin:12px 0 6px;font-size:13px;color:#aaa;text-shadow:2px 2px 0 #222;font-weight:400}
.fxmenu .fxgrid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.fxmenu .fxgrid .mcbtn{width:100%;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fxmenu .fxnote{font-size:12px;color:#ffaa00;margin-top:6px}
.fxmenu .fxdone{display:block;width:60%;margin:14px auto 0}
@media (max-width:560px){.fxmenu .fxgrid{grid-template-columns:1fr}}
.mcbtn.rec{color:#ff5555}
/* cinematic mode: no HUD, only the caption */
body.cinematic #hud,body.cinematic #ov{display:none}
#fxcap{position:fixed;left:56px;bottom:80px;max-width:calc(100vw - 112px);z-index:7;pointer-events:none;opacity:0;transform:translateX(-40px);transition:opacity .4s,transform .4s;
 background:rgba(16,0,16,.86);border:3px solid transparent;border-image:linear-gradient(#5000ff,#28007f) 1;padding:16px 18px;color:#fff;font-size:30px;line-height:1.2;text-shadow:3px 3px 0 #3f3f3f;font-family:MC,monospace}
#fxcap b{display:block;font-size:22px;color:#ffff55;margin-bottom:10px;letter-spacing:1px}
#fxcap.small{font-size:24px;padding:12px 16px}
#fxcap.show{opacity:1;transform:none}
body:not(.cinematic) #fxcap{display:none}
#fxhint{position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:7;pointer-events:none;font-family:MC,monospace;font-size:14px;color:#fff;text-shadow:2px 2px 0 #3f3f3f;
 background:rgba(0,0,0,.45);padding:4px 10px;opacity:0;transition:opacity .5s}
#fxhint.show{opacity:1}