*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:#eaffdf;background:linear-gradient(135deg,#baff43 0%,#51c83d 34%,#17853a 67%,#042c17 100%);min-height:100vh}nav{height:72px;position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:0 7%;background:rgba(3,24,12,.92);backdrop-filter:blur(12px);box-shadow:0 5px 25px #0005}.logo{font-size:25px;font-weight:900;color:#fff}.logo span{color:#baff43}.links{display:flex;gap:30px}.links a{color:#fff;text-decoration:none;font-weight:bold}.links a:hover{color:#baff43}.hamb{display:none;background:none;border:0;color:white;font-size:26px}header{min-height:460px;display:flex;align-items:center;padding:65px 8%;position:relative;overflow:hidden}.hero{max-width:700px}.badge,small{font-size:12px;font-weight:900;letter-spacing:3px;color:#baff43}.hero h1{font-size:clamp(48px,8vw,88px);line-height:.95;margin:15px 0;letter-spacing:-4px}.hero p{font-size:19px;line-height:1.6;max-width:600px;color:#e2f5d7}.mainbtn{display:inline-block;margin-top:12px;background:#0a2715;color:#fff;text-decoration:none;padding:15px 24px;border-radius:13px;font-weight:900;border:1px solid #baff43}.hero:after{content:"";position:absolute;right:-100px;width:440px;height:440px;border-radius:50%;background:#cfff6c33;box-shadow:0 0 100px #baff4333}section{padding:75px 8%}.heading h2,.info h2{font-size:43px;margin:8px 0 35px}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}.gamecard{border:1px solid #ffffff35;background:#052b1688;color:#fff;text-align:left;border-radius:24px;padding:30px;cursor:pointer;min-height:190px;transition:.25s;box-shadow:0 15px 35px #001c0a33}.gamecard:hover{transform:translateY(-6px);background:#06391dcc;border-color:#baff43}.gamecard span{font-size:46px}.gamecard h3{font-size:25px;margin:15px 0 7px}.gamecard p{color:#cfe9c5;margin:0;line-height:1.5}.info{background:#031b0d}.info h2{margin-bottom:8px}.info p{color:#cfe9c5}footer{text-align:center;padding:30px;background:#02150a;color:#baff43;font-weight:bold}.modal{display:none;position:fixed;inset:0;z-index:50;background:#001307cc;backdrop-filter:blur(9px);align-items:center;justify-content:center;padding:15px}.modal.active{display:flex}.box{position:relative;background:#efffdf;color:#132c18;width:min(700px,96vw);max-height:94vh;overflow:auto;border-radius:25px;padding:34px;box-shadow:0 25px 80px #0009}.close{position:absolute;right:15px;top:12px;border:0;background:#092718;color:white;border-radius:50%;width:36px;height:36px;font-size:24px;cursor:pointer}.title{text-align:center;margin:0 0 12px;font-size:30px}.status{text-align:center;font-weight:bold;margin:10px}.btn{border:0;background:#123c20;color:#fff;border-radius:11px;padding:12px 18px;font-weight:bold;cursor:pointer}.btn:hover{background:#20723a}.board{display:grid;justify-content:center;gap:8px;margin:18px auto}.cell{width:68px;height:68px;border:2px solid #79a75d;background:#dff7b9;border-radius:11px;font-size:31px;font-weight:bold;cursor:pointer}.memory{grid-template-columns:repeat(4,68px)}.memory .cell:not(.open){font-size:0}.memory .open{background:white}.choices{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:20px}.tile{width:82px;height:82px;border-radius:15px;border:3px solid #6d974f;cursor:pointer;font-size:35px;background:#d9f5ad}.pattern{display:flex;justify-content:center;align-items:center;gap:10px;flex-wrap:wrap;margin:22px}.pattern .piece{width:65px;height:65px;border-radius:12px;display:grid;place-items:center;font-size:30px;background:#d8f5ae;border:2px solid #76a255}.canvas{display:block;width:min(600px,100%);height:auto;background:#092818;border-radius:16px;margin:10px auto}.controls{display:grid;grid-template-columns:repeat(3,60px);gap:7px;justify-content:center;margin:13px auto}.controls button{width:60px;height:50px;border:0;border-radius:12px;background:#123c20;color:#fff;font-size:21px;font-weight:bold;touch-action:manipulation}.controls button:nth-child(1){grid-column:2}.controls button:nth-child(2){grid-column:1}.controls button:nth-child(3){grid-column:2}.controls button:nth-child(4){grid-column:3}.center{text-align:center}.dino-controls{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.dino-controls button{min-width:130px}@media(max-width:700px){.links{display:none;position:absolute;top:72px;left:0;right:0;background:#031b0d;padding:20px;flex-direction:column;text-align:center}.links.open{display:flex}.hamb{display:block}.grid{grid-template-columns:1fr}header{padding:55px 7%;min-height:430px}.hero h1{letter-spacing:-2px}section{padding:55px 7%}.box{padding:30px 15px}.memory{grid-template-columns:repeat(4,57px)}.memory .cell{width:57px;height:57px}.pattern .piece{width:55px;height:55px}}
/* Custom Dino visuals */
.dino-wrap{position:relative}
.dino-hud{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-weight:900;margin-bottom:8px}
.dino-night{background:#07152b!important}

.skin-panel{background:#dff4c7;border:1px solid #9fc47e;border-radius:15px;padding:10px;margin:8px auto 12px;max-width:620px}
.skin-title{text-align:center;font-weight:900;margin-bottom:7px}
.skin-list{display:flex;justify-content:center;gap:7px;flex-wrap:wrap}
.skin-btn{border:2px solid #8fb46d;background:#efffdf;border-radius:10px;padding:7px 10px;cursor:pointer;font-weight:800;font-size:13px}
.skin-btn.selected{border-color:#17652f;background:#baff43}
.revive{font-size:13px;padding:8px 14px;margin-top:5px}

.difficulty{max-width:480px;margin:15px auto;text-align:center}
.difficulty h3{margin:5px 0 8px;font-size:22px}
.diff-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}
.diff-btn{border:2px solid #91b76e;background:#efffdf;color:#15301b;border-radius:12px;padding:13px 8px;font-weight:900;cursor:pointer}
.diff-btn:hover,.diff-btn.selected{background:#baff43;border-color:#17652f}
.diff-desc{font-size:13px;color:#50704c;margin:8px 0 12px}

.coin-hud{display:inline-block;background:#082d17;color:#dfffbd;border:1px solid #7fac55;border-radius:12px;padding:7px 12px;font-weight:800;margin:8px 0}
.page-coins{font-size:14px}
.skin-btn.locked{opacity:.65;filter:saturate(.65)}
.skin-btn.locked::after{content:" 🔒"}
.coin-reward{font-size:13px;color:#41613d;margin-top:8px}
.final-title{font-size:25px;font-weight:900;text-align:center}

/* Mobile-first difficulty selection */
.difficulty{width:100%;max-width:520px;margin:18px auto;text-align:center}
.diff-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:100%}
.diff-btn{width:100%;min-height:64px;padding:14px 10px;font-size:16px;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.diff-btn:active{transform:scale(.97)}
@media(max-width:600px){
  .modal{padding:8px}
  .box{width:100%;max-height:96vh;padding:28px 12px;border-radius:20px}
  .difficulty{margin-top:10px}
  .diff-grid{grid-template-columns:1fr;gap:10px}
  .diff-btn{min-height:68px;font-size:18px}
  .difficulty h3{font-size:24px}
  .diff-desc{font-size:14px;line-height:1.4}
  .skin-btn{min-height:55px;touch-action:manipulation}
}

.gamecard,.btn,.skin-btn,.close{touch-action:manipulation;-webkit-tap-highlight-color:transparent}

.range-wrap{position:relative;width:100%;max-width:900px;margin:auto}
.range-hud{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;font-weight:900;margin-bottom:8px}
.range-canvas{width:100%;height:auto;border-radius:18px;display:block;touch-action:none;cursor:crosshair}
.range-controls{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:10px}
.range-fire{min-width:150px;font-size:18px}
.range-message{text-align:center;font-weight:900;min-height:24px;margin-top:7px}
@media(max-width:600px){.range-canvas{min-height:230px;object-fit:cover}.range-fire{width:85%;min-height:58px;font-size:20px}}

/* V8 Campo de tiro — responsive sizing */
.range-wrap{max-width:760px;margin:8px auto 0}
.range-canvas{width:100%;max-height:420px;aspect-ratio:16/9;object-fit:cover}
@media(max-width:600px){
  .range-wrap{max-width:100%;padding:0 2px}
  .range-canvas{max-height:none;min-height:0;height:auto;aspect-ratio:16/9}
  .range-hud{font-size:13px}
}

.gamecard{width:100%}