*{box-sizing:border-box}
html,body{margin:0;background:#0d132c}
body.mouseando-game-page{font-family:"Courier New",monospace;color:#fff;background:#0d132c}
.mouseando-page{position:relative;width:min(1448px,100%);margin:0 auto;background:#0d132c}
.mouseando-mockup{display:block;width:100%;height:auto}
.mouseando-monitor{position:absolute;left:22.1%;top:6.45%;width:50.9%;height:35.2%;overflow:hidden;border-radius:4.6%/7%;background:#0c1124;z-index:8;box-shadow:inset 0 0 22px rgba(0,0,0,.65),0 0 0 1px rgba(255,220,148,.14)}
.mouseando-monitor::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:10;background:linear-gradient(180deg,rgba(255,255,255,.05),transparent 13%,transparent 86%,rgba(255,255,255,.02)),repeating-linear-gradient(to bottom,transparent 0 3px,rgba(255,255,255,.014) 4px,rgba(0,0,0,.03) 5px),radial-gradient(ellipse at center,transparent 62%,rgba(0,0,0,.14) 82%,rgba(0,0,0,.3) 100%)}
.fora-do-roteiro-copy-mask{position:absolute;left:73.7%;top:6.3%;width:19.3%;height:22.4%;z-index:11;padding:1.1% 1.1% 0;background:linear-gradient(145deg,rgba(43,16,32,.96),rgba(16,22,52,.95));border-radius:2px;color:#fff6eb;border:1px solid rgba(255,216,132,.18)}
.fora-do-roteiro-copy-mask h1{margin:0 0 5%;font-size:clamp(18px,2.35vw,35px);line-height:.92;letter-spacing:-.07em;color:#ffe094;text-shadow:3px 3px 0 #7b263d,0 0 18px rgba(255,208,102,.2)}
.fora-do-roteiro-copy-mask h2{margin:0 0 7%;font-size:clamp(8px,1vw,14px);line-height:1.14;color:#c4f2e8;text-align:center}
.fora-do-roteiro-copy-mask p{margin:0;font:400 clamp(7px,.82vw,12px)/1.42 system-ui,sans-serif;color:#ecedf7}
.mouseando-play{position:absolute;left:75.15%;top:28.7%;width:14.15%;height:6.25%;z-index:12;border-radius:10px;border:0;cursor:pointer}
.fora-do-roteiro-play-visible{background:linear-gradient(180deg,#fff0bf,#ffd970 58%,#da8d36);border:3px solid #fff7dc;box-shadow:0 4px 0 #7b263d,0 0 0 5px #20172d;color:#2b180d;font:900 clamp(9px,1.12vw,16px)/1 "Courier New",monospace;letter-spacing:.02em}
.fora-do-roteiro-play-visible span{font-size:1.5em}.mouseando-play:hover,.mouseando-play:focus-visible{outline:2px solid rgba(255,224,148,.95);outline-offset:2px;box-shadow:0 0 18px rgba(196,242,232,.35),0 4px 0 #7b263d,0 0 0 5px #20172d}
.mouseando-tools{position:absolute;left:75.1%;top:35.9%;width:14.3%;z-index:14;display:flex;flex-direction:column;gap:8px}
.mouseando-tools button{width:100%;border-radius:10px;padding:9px 10px;font:800 13px/1 "Courier New",monospace;cursor:pointer;text-transform:uppercase;letter-spacing:.03em}
.mouseando-full{border:2px solid #8060a8;background:linear-gradient(180deg,#ebd9ff,#b793eb);color:#221735;box-shadow:0 5px 0 rgba(34,23,53,.45)}
.mouseando-restart{border:1px solid rgba(239,220,190,.26);background:rgba(11,16,36,.96);color:#f4eee1;box-shadow:0 4px 10px rgba(0,0,0,.25);font-size:12px}
.fora-do-roteiro-bottom-mask{position:absolute;left:2.8%;right:2.8%;top:62.2%;height:30%;z-index:8;background:rgba(11,15,34,.97);border:1px solid #4f3d5a;border-radius:5px}
.fora-do-roteiro-story-card,.fora-do-roteiro-how-card,.fora-do-roteiro-scenes-card{position:absolute;z-index:9;background:#14192ddd;border:1px solid #4f3d5a;border-radius:5px;box-shadow:0 5px 16px #0008}
.fora-do-roteiro-story-card{left:3.7%;top:63.5%;width:31.5%;height:27.5%;padding:1.1%}
.fora-do-roteiro-story-card h2,.fora-do-roteiro-how-card h2,.fora-do-roteiro-scenes-card h2{margin:0 0 .7%;font-size:clamp(9px,1.45vw,21px);color:#ffe7af;letter-spacing:.03em}
.fora-do-roteiro-story-card img{position:absolute;left:1.5%;top:16%;width:34.5%;height:78%;object-fit:cover;border:1px solid #c4f2e8}
.fora-do-roteiro-story-text{position:absolute;left:39%;top:16%;right:3%;font:400 clamp(5.3px,.63vw,9.1px)/1.34 system-ui,sans-serif;color:#e8e8f2}
.fora-do-roteiro-story-text p{margin:0 0 4%}
.fora-do-roteiro-how-card{left:36.3%;top:63.5%;width:58%;height:10.3%;padding:1.1%}
.fora-do-roteiro-how-grid{display:grid;grid-template-columns:6% 25% 6% 25% 6% 1fr;align-items:center;gap:1.8%;height:64%}
.fora-do-roteiro-how-icon{display:grid;place-items:center;height:100%;border:1px solid #c4f2e8;border-radius:4px;color:#ffe7af;font-size:clamp(11px,2vw,28px)}
.fora-do-roteiro-how-grid p{margin:0;font:400 clamp(6px,.72vw,10.5px)/1.3 system-ui,sans-serif;color:#e8e8f2}
.fora-do-roteiro-how-grid strong{color:#ffe094}
.fora-do-roteiro-scenes-card{left:36.3%;top:74.4%;width:58%;height:16.6%;padding:1.1%}
.fora-do-roteiro-scenes-head{display:flex;justify-content:space-between;align-items:center}
.fora-do-roteiro-scenes-head span{color:#c4f2e8;font-size:clamp(6px,.72vw,10px)}
.fora-do-roteiro-scenes-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2%;height:74%}
.fora-do-roteiro-scenes-grid figure{margin:0;min-width:0}.fora-do-roteiro-scenes-grid img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border:1px solid #c4f2e8;border-radius:3px}
.fora-do-roteiro-scenes-grid figcaption{margin-top:2%;font-size:clamp(6px,.76vw,11px);font-weight:800;color:#ffe7af}
.mouseando-sr{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:900px){.mouseando-tools{left:74.6%;top:36.4%;width:15.3%;gap:6px}.mouseando-tools button{padding:7px 8px;font-size:10px}.fora-do-roteiro-story-text{font-size:clamp(4.6px,.61vw,7.5px)}.fora-do-roteiro-how-grid p{font-size:clamp(5px,.72vw,8px)}}


/* Jogo Fora do Roteiro integrado diretamente no monitor (sem iframe). */
#mouseandoForaDoRoteiroGame{position:absolute;inset:0;overflow:hidden;background:#080c1e;color:#fff3d6;font-family:system-ui,sans-serif;z-index:1}
#mouseandoForaDoRoteiroGame *{box-sizing:border-box}
#mouseandoForaDoRoteiroGame button{font:700 15px system-ui;border:1px solid #fff1ae;border-radius:8px;background:#f9d56b;color:#20192d;cursor:pointer;padding:13px 22px;box-shadow:0 5px 0 #9c6e3e}
#mouseandoForaDoRoteiroGame button:hover{background:#fff0b2}
#mouseandoForaDoRoteiroGame button:active{transform:translateY(2px);box-shadow:0 3px 0 #9c6e3e}
#mouseandoForaDoRoteiroGame button:focus-visible{outline:3px solid #8dfedc;outline-offset:5px}
#mouseandoForaDoRoteiroGame canvas{width:100%;height:100%;display:block;touch-action:none;cursor:none}
#mouseandoForaDoRoteiroGame #hud{position:absolute;left:5%;right:5%;top:3%;display:flex;align-items:center;justify-content:space-between;gap:10px;z-index:3}
#mouseandoForaDoRoteiroGame .stats{display:flex;gap:28px}
#mouseandoForaDoRoteiroGame .stat{color:#afa9b9;font-size:10px;letter-spacing:2px}
#mouseandoForaDoRoteiroGame .stat b{color:#fff4d1;display:block;font-size:clamp(18px,2.4vw,28px);font-variant-numeric:tabular-nums;letter-spacing:0}
#mouseandoForaDoRoteiroGame .controls{display:flex;gap:8px}
#mouseandoForaDoRoteiroGame .small{font-size:11px;padding:8px 12px;border-color:#52516b;background:#20243d;color:#f4e8cc;box-shadow:none}
#mouseandoForaDoRoteiroGame .small:hover{background:#39374e}
#mouseandoForaDoRoteiroGame .overlay{position:absolute;inset:0;background:#0b142c;display:flex;align-items:center;z-index:4}
#mouseandoForaDoRoteiroGame .overlay[hidden],#mouseandoForaDoRoteiroGame #hud[hidden],#mouseandoForaDoRoteiroGame #ready[hidden]{display:none}
#mouseandoForaDoRoteiroGame .art{position:absolute;width:100%;height:100%;object-fit:contain}
#mouseandoForaDoRoteiroGame .shade{position:absolute;inset:0;background:linear-gradient(90deg,#080e22ed,#080e22e5 30%,#080e2250 61%,transparent 90%)}
#mouseandoForaDoRoteiroGame .panel{position:relative;margin:5%;width:46%}
#mouseandoForaDoRoteiroGame .eyebrow{font-size:11px;letter-spacing:2.6px;color:#87ecd7;font-weight:700}
#mouseandoForaDoRoteiroGame .panel h1{font-size:clamp(27px,4.9vw,65px);line-height:1.01;letter-spacing:-2px;margin:16px 0;color:#ffde78;text-shadow:3px 4px 0 #99493e}
#mouseandoForaDoRoteiroGame .panel p{color:#e2d8cc;font-size:clamp(12px,1.45vw,17px);line-height:1.65;max-width:340px}
#mouseandoForaDoRoteiroGame .record{font-size:12px;color:#aaa4b3;margin-top:16px}
#mouseandoForaDoRoteiroGame .big{font-size:clamp(26px,4vw,58px);font-weight:800;color:#ffde78}
#mouseandoForaDoRoteiroGame .help{font-size:11px!important;color:#9d9ba9!important}
#mouseandoForaDoRoteiroGame #ready{position:absolute;bottom:3.8%;left:50%;transform:translateX(-50%);font-size:12px;padding:10px 20px;z-index:5}
#mouseandoForaDoRoteiroGame #ready:active{transform:translateX(-50%) translateY(2px)}
@media(max-width:600px){#mouseandoForaDoRoteiroGame .panel{width:61%;margin:4%}#mouseandoForaDoRoteiroGame .panel h1{margin:10px 0}#mouseandoForaDoRoteiroGame .panel p{margin:8px 0;line-height:1.4}#mouseandoForaDoRoteiroGame .help{display:none}#mouseandoForaDoRoteiroGame .eyebrow{font-size:9px;letter-spacing:1px}#mouseandoForaDoRoteiroGame .record{font-size:10px;margin-top:10px}#mouseandoForaDoRoteiroGame .stats{gap:14px}#mouseandoForaDoRoteiroGame .stat{font-size:8px;letter-spacing:1px}#mouseandoForaDoRoteiroGame .small{font-size:9px;padding:6px 9px}#mouseandoForaDoRoteiroGame button{padding:9px 16px;font-size:12px}#mouseandoForaDoRoteiroGame #ready{bottom:2.7%;padding:6px 14px;font-size:10px}}