*{box-sizing:border-box}body{margin:0;background:#07110c;color:#f5fff8;font-family:system-ui,-apple-system,Segoe UI,Arial,sans-serif}.app{max-width:920px;margin:auto;padding:16px}header,.hud{display:flex;justify-content:space-between;align-items:center;gap:12px}h1{margin:0;font-size:24px}h1 small{font-size:12px;color:#88c79e}p{color:#a9c2b1}.panel{background:#0e1d14;border:1px solid #244a31;border-radius:18px;padding:18px}.hidden{display:none!important}button{border:1px solid #356447;background:#13291b;color:white;border-radius:12px;padding:11px 15px;font-weight:700}.primary{background:#14833b;border-color:#21a64e}.cards{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:14px 0}.card{padding:12px 8px;border:1px solid #244a31;border-radius:13px;text-align:center;background:#0a160f}.card.lock{opacity:.35;filter:grayscale(1)}.card.current{outline:2px solid #31c962}.card b{display:block;font-size:13px}.card span{font-size:11px;color:#9ab5a2}.field{height:560px;position:relative;overflow:hidden;border-radius:18px;background:linear-gradient(#17211b 0 24%,#286238 24% 100%);border:1px solid #356447;touch-action:none;user-select:none}.crowd{position:absolute;inset:0 0 auto;height:135px;background:repeating-linear-gradient(90deg,#0d3b22 0 28px,#e9f1eb 28px 56px);opacity:.75}.ad{position:absolute;top:110px;left:0;right:0;background:#07110cbb;padding:8px;text-align:center;font-size:11px;letter-spacing:2px}.goal{position:absolute;top:160px;left:50%;transform:translateX(-50%);width:min(76%,610px);height:230px;border:8px solid #fff;border-bottom-width:5px;z-index:2}.net{position:absolute;inset:0;z-index:0;background:repeating-linear-gradient(0deg,transparent 0 22px,#ffffff26 23px),repeating-linear-gradient(90deg,transparent 0 31px,#ffffff26 32px)}.keeper{position:absolute;z-index:3;pointer-events:none;object-fit:contain;object-position:center;filter:drop-shadow(0 5px 5px #0008)}
.keeper.idle{left:50%;bottom:0;height:82%;width:34%;transform:translateX(-50%);object-fit:contain}
/* V4.4: each dive is a physically separate, full-body PNG. No CSS clipping and no ball baked into the sprite. */
.keeper.dive{left:50%;top:58%;width:72%;height:86%;transform:translate(-50%,-50%) scale(.58);transform-origin:center;object-fit:contain;opacity:1}
.keeper.dive.go{left:var(--kx);top:var(--ky);transform:translate(-50%,-50%) scale(.92) rotate(var(--lift));transition:left var(--kd) cubic-bezier(.12,.72,.2,1),top var(--kd) cubic-bezier(.12,.72,.2,1),transform var(--kd) cubic-bezier(.12,.72,.2,1)}
.spot{position:absolute;width:9px;height:9px;border-radius:50%;background:#fff9;left:50%;bottom:77px}.ball{border:0;background:none;padding:0;font-size:42px;line-height:1}.kick{position:absolute;left:50%;bottom:52px;transform:translateX(-50%);z-index:12;cursor:grab;touch-action:none;pointer-events:auto}.kick:active{cursor:grabbing}.fly{position:absolute;left:50%;top:150%;transform:translate(-50%,-50%);z-index:6;font-size:31px}.aim{position:absolute;width:48px;height:48px;border:2px dashed white;border-radius:50%;z-index:8;pointer-events:none}.msg{position:absolute;left:0;right:0;bottom:110px;text-align:center;font-size:30px;font-weight:900;text-shadow:0 2px 7px #000;z-index:10}.sub{position:absolute;left:0;right:0;bottom:86px;text-align:center;font-size:13px;z-index:10}.dots{text-align:center;font-size:24px;letter-spacing:8px;margin:8px}.power{height:8px;background:#183021;border-radius:8px;overflow:hidden;margin-top:10px}.power i{display:block;height:100%;width:0;background:#2bc65a}.help{text-align:center;font-size:12px}.big{font-size:44px;text-align:center}.actions{display:flex;justify-content:center;gap:10px}.hud span{display:block;color:#9ab5a2;font-size:12px}@media(max-width:650px){.cards{grid-template-columns:1fr 1fr}.field{height:480px}.goal{width:88%;height:195px;top:145px}.keeper.idle{height:82%;width:38%}.keeper.dive{width:84%;height:84%}.msg{bottom:92px;font-size:25px}.sub{bottom:70px}.app{padding:10px}h1{font-size:20px}}

.player-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:12px 0}.player-card{border:1px solid #315c43;background:#0b2015;border-radius:14px;padding:12px 8px;text-align:center;cursor:pointer;transition:.18s}.player-card:hover{transform:translateY(-2px)}.player-card.selected{outline:2px solid #fff;background:#174a2c}.player-card .num{font-size:27px;font-weight:900}.player-card b{display:block;font-size:12px}.player-card span{font-size:10px;opacity:.75}.player-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:8px 0 18px}.stat{font-size:10px}.stat i{display:block;height:6px;border-radius:5px;background:#203a2c;overflow:hidden;margin-top:4px}.stat i:after{content:'';display:block;width:var(--v);height:100%;background:#e9f6ee}.route-title{margin-top:18px}.shooter{pointer-events:none;position:absolute;z-index:8;left:37%;bottom:6%;width:72px;height:118px;transform:translateX(-50%);background:linear-gradient(90deg,#0d5b32,#168149 52%,#0d5b32);border-radius:28px 28px 10px 10px;box-shadow:0 7px 18px #0008;display:flex;align-items:center;flex-direction:column;color:white;transition:transform .24s ease}.shirt-name{font-size:9px;font-weight:800;margin-top:20px}.shirt-no{font-size:31px;font-weight:900;order:2;margin-top:2px}.shooter.run{transform:translate(58px,-24px) scale(.96)}.shooter.kickfx{transform:translate(78px,-28px) rotate(-9deg) scale(.94)}@media(max-width:700px){.player-cards{grid-template-columns:repeat(2,1fr)}.player-stats{grid-template-columns:repeat(2,1fr)}.shooter{width:56px;height:92px;bottom:8%;left:34%}.shirt-name{font-size:7px;margin-top:15px}.shirt-no{font-size:24px}}
/* V4.5.2: the ball stays visually above the kicker and remains easy to grab. */
.kick{z-index:20}.shooter{z-index:8}

/* V4.6: real penalty-taker sprites. Keeper/collision and one-ball logic unchanged. */
.shooter{pointer-events:none;position:absolute;z-index:8;left:32%;bottom:4%;width:150px;height:220px;transform:translateX(-50%);background:none!important;border-radius:0;box-shadow:none;display:block;transition:transform .24s ease;transform-origin:50% 100%}
.shooter img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 8px 8px #0008);user-select:none;-webkit-user-drag:none}
.shirt-name,.shirt-no{display:none!important}
.shooter.run{transform:translate(calc(-50% + 54px),-20px) scale(.96)}
.shooter.kickfx{transform:translate(calc(-50% + 76px),-25px) rotate(-6deg) scale(.94)}
@media(max-width:700px){.shooter{left:27%;bottom:5%;width:112px;height:172px}.shooter.run{transform:translate(calc(-50% + 42px),-16px) scale(.96)}.shooter.kickfx{transform:translate(calc(-50% + 58px),-20px) rotate(-6deg) scale(.94)}}

/* V4.6.1 — normalized player scale + more natural approach/contact prototype */
.shooter{width:var(--shooter-w,178px);height:var(--shooter-h,276px);left:29%;bottom:3%;transition:none;will-change:transform}
.shooter[data-player="batalla"]{--shooter-w:194px;--shooter-h:302px}
.shooter[data-player="belluschi"]{--shooter-w:194px;--shooter-h:304px}
.shooter[data-player="iheanacho"]{--shooter-w:188px;--shooter-h:300px}
.shooter[data-player="fernandao"]{--shooter-w:174px;--shooter-h:278px}
.shooter[data-player="volkan"]{--shooter-w:176px;--shooter-h:280px}
.shooter.approach{animation:approach461 245ms cubic-bezier(.22,.7,.25,1) forwards}
.shooter.plant{animation:plant461 105ms ease-out forwards}
.shooter.strike{animation:strike461 190ms cubic-bezier(.2,.8,.2,1) forwards}
.shooter.follow{animation:follow461 260ms ease-out forwards}
@keyframes approach461{0%{transform:translateX(-50%)}45%{transform:translate(calc(-50% + 26px),-7px) rotate(1deg)}100%{transform:translate(calc(-50% + 52px),-15px) rotate(2deg)}}
@keyframes plant461{0%{transform:translate(calc(-50% + 52px),-15px) rotate(2deg)}100%{transform:translate(calc(-50% + 66px),-18px) rotate(-2deg) skewX(-2deg)}}
@keyframes strike461{0%{transform:translate(calc(-50% + 66px),-18px) rotate(-2deg) skewX(-2deg)}48%{transform:translate(calc(-50% + 77px),-22px) rotate(-7deg) skewX(-5deg) scaleX(.985)}100%{transform:translate(calc(-50% + 84px),-20px) rotate(4deg) skewX(2deg)}}
@keyframes follow461{0%{transform:translate(calc(-50% + 84px),-20px) rotate(4deg)}100%{transform:translate(calc(-50% + 94px),-15px) rotate(1deg)}}
@media(max-width:700px){.shooter{left:25%;width:calc(var(--shooter-w,178px)*.72);height:calc(var(--shooter-h,276px)*.72);bottom:4%}}

/* V4.6.2 — body-height normalization. Wide source canvases no longer shrink Batalla/Iheanacho. */
.shooter img{width:auto!important;height:100%!important;max-width:none!important;position:absolute;left:50%;bottom:0;transform:translateX(-50%);object-fit:contain;object-position:center bottom}
.shooter[data-player="batalla"]{--shooter-w:220px;--shooter-h:330px}
.shooter[data-player="iheanacho"]{--shooter-w:205px;--shooter-h:320px}
@media(max-width:700px){
 .shooter[data-player="batalla"]{width:158px;height:238px}
 .shooter[data-player="iheanacho"]{width:148px;height:230px}
}

/* V4.6.3 — keeper normalization + stadium presentation polish */
body{background:radial-gradient(circle at 50% 0,#123c28 0,#07150e 42%,#030806 100%)}
.app{max-width:1040px}
header{padding:4px 4px 12px}header h1{letter-spacing:.5px;text-shadow:0 2px 18px #20b85d35}header p{margin:4px 0 0}
.panel{background:linear-gradient(180deg,#10271aee,#08150eee);border-color:#2c6543;box-shadow:0 18px 60px #0007,inset 0 1px #ffffff0a}
.player-card,.card{background:linear-gradient(180deg,#10291b,#09170f);border-color:#2b6041;box-shadow:inset 0 1px #ffffff0a}
.player-card.selected,.card.current{outline:2px solid #38e071;box-shadow:0 0 0 3px #1c6b3c66,0 0 24px #24d56430;background:linear-gradient(180deg,#195b34,#0d2919)}
.field{height:590px;background:linear-gradient(180deg,#07100d 0 8%,#10261a 8% 24%,#255f36 24% 100%);border-color:#2f7049;box-shadow:inset 0 0 90px #0008,0 18px 55px #0006}
.crowd{height:150px;background:radial-gradient(circle at 12% 55%,#dfe9e2 0 2px,transparent 3px),radial-gradient(circle at 27% 35%,#39a55d 0 3px,transparent 4px),radial-gradient(circle at 48% 62%,#f4f7f4 0 2px,transparent 3px),radial-gradient(circle at 72% 32%,#1c7541 0 3px,transparent 4px),radial-gradient(circle at 90% 58%,#e8f1eb 0 2px,transparent 3px),linear-gradient(180deg,#07100c,#123520);background-size:48px 42px,55px 48px,43px 38px,61px 46px,52px 44px,auto;opacity:1;filter:saturate(.9)}
.ad{top:118px;background:linear-gradient(90deg,#06110dcc,#0b3b25ee,#06110dcc);border-top:1px solid #55cf7d33;border-bottom:1px solid #55cf7d33;color:#d8ffe5;text-shadow:0 0 10px #2bff78;letter-spacing:2.4px}
.goal{top:165px;width:min(78%,650px);height:244px;border-width:7px;border-bottom-width:5px;filter:drop-shadow(0 4px 6px #0008)}
.net{background:repeating-linear-gradient(0deg,transparent 0 20px,#ffffff30 21px),repeating-linear-gradient(90deg,transparent 0 28px,#ffffff30 29px),linear-gradient(#07120b20,#07120b55)}
/* Idle PNGs are tightly cropped in V4.6.3, so equal CSS height means equal visible body height. */
.keeper.idle{left:50%;bottom:-1px;height:91%;width:auto;max-width:44%;transform:translateX(-50%);object-fit:contain;object-position:center bottom;filter:drop-shadow(0 8px 6px #0009)}
/* The bottom edge of the goal is the goal line; feet are anchored there before every kick. */
.goal:after{content:'';position:absolute;left:-7px;right:-7px;bottom:-5px;height:5px;background:#fff;z-index:4;box-shadow:0 0 8px #fff5;pointer-events:none}
.aim{border-color:#66ff9b;box-shadow:0 0 16px #39e87b88,inset 0 0 12px #39e87b44}
.power{height:11px;border:1px solid #2d6945;background:#07150d;box-shadow:inset 0 2px 5px #0008}.power i{background:linear-gradient(90deg,#20d866 0 58%,#f0cf3c 78%,#ef5a3c 100%);box-shadow:0 0 12px #33e97888}
button{transition:.18s ease}button:hover{transform:translateY(-1px);border-color:#5bd181}.primary{box-shadow:0 0 20px #1dbf5b22}
@media(max-width:650px){.field{height:500px}.goal{top:150px;height:205px;width:90%}.keeper.idle{height:91%;max-width:48%}.crowd{height:130px}.ad{top:104px}}

/* V4.6.7 — clean photorealistic stadium template. No baked-in players, ball or HUD. */
.field{
  height:590px;
  background-image:url('../assets/stadium-v10.png');
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  border-color:#2f7049;
  box-shadow:inset 0 0 55px #0004,0 18px 55px #0006;
}
/* Stadium art already contains crowd, TEKSAS, BURSASPORLUYUZ boards, goal and net. */
.crowd,.ad{display:none!important}
/* Keep an invisible goal coordinate box for keeper/ball physics, aligned to the goal in the background. */
.goal{
  top:55.8%;
  left:50%;
  width:43.2%;
  height:22.2%;
  transform:translateX(-50%);
  border:0!important;
  filter:none;
  background:transparent;
  overflow:visible;
}
.goal:after,.net{display:none!important}
/* Goalkeeper feet sit on the photographed goal line. */
.keeper.idle{bottom:0;height:94%;max-width:52%;}
/* Dive sprites remain dynamic and use the same physical goal box. */
.keeper.dive{top:54%;width:92%;height:120%;}
/* Put the penalty spot/ball and taker into the foreground perspective of the new scene. */
.spot{left:50%;bottom:8.4%;opacity:.55}
.kick{left:50%;bottom:6.6%;font-size:40px}
.shooter{left:29%;bottom:2.4%}
/* Reticle is game UI only; it is not baked into the stadium art. */
.aim{z-index:9}
@media(max-width:650px){
  .field{height:500px;background-position:center center}
  .goal{top:55.8%;width:43.2%;height:22.2%}
  .keeper.idle{height:94%;max-width:56%}
  .spot{bottom:8.4%}.kick{bottom:6.6%}
}


/* V4.6.8 — fixed penalty spot + single direction/power arrow */
/* The ball center is locked to the photographed penalty spot. Hover/pointer movement never moves it. */
.kick{left:50%!important;bottom:calc(8.4% + 4.5px)!important;transform:translate(-50%,50%)!important;transition:none!important}
.kick:hover,.kick:focus,.kick:active{left:50%!important;transform:translate(-50%,50%)!important}
/* Old reticle and separate power bar are retired in V4.6.8. */
.aim,.power{display:none!important}
.shot-arrow{position:absolute;height:0;z-index:19;transform-origin:0 50%;pointer-events:none;filter:drop-shadow(0 0 7px #33ff83aa)}
.shot-arrow i{position:absolute;left:0;right:13px;top:-3px;height:6px;border-radius:8px;background:linear-gradient(90deg,#55ff9a,#c8ff59 62%,#ffd44d);box-shadow:0 0 10px #36f58499}
.shot-arrow b{position:absolute;right:-1px;top:-9px;width:0;height:0;border-top:9px solid transparent;border-bottom:9px solid transparent;border-left:16px solid #ffd44d;filter:drop-shadow(0 0 4px #ffd44d)}
.shot-arrow span{position:absolute;right:4px;top:13px;background:#07150ddd;border:1px solid #4ad87a;border-radius:9px;padding:3px 7px;color:#fff;font-size:11px;font-weight:900;white-space:nowrap}
.help{margin:10px 0 0;color:#c8dfd0}.help b{color:#67ef96}
@media(max-width:650px){.kick{bottom:calc(8.4% + 4.5px)!important}.shot-arrow i{height:5px;top:-2.5px}.shot-arrow span{font-size:10px}}

/* V4.6.9 — direct goal target + pull-back power control */
.shot-arrow{display:none!important}
.target-dot{position:absolute;width:34px;height:34px;margin:-17px 0 0 -17px;border:2px solid #7dffab;border-radius:50%;z-index:20;pointer-events:none;box-shadow:0 0 0 5px #0b6f3733,0 0 16px #54ff9a;transition:transform .12s ease,opacity .12s ease}
.target-dot:before,.target-dot:after{content:'';position:absolute;background:#dffff0;opacity:.9}.target-dot:before{left:15px;top:-7px;width:2px;height:44px}.target-dot:after{top:15px;left:-7px;height:2px;width:44px}.target-dot i{position:absolute;inset:9px;border:2px solid #fff;border-radius:50%}.target-dot.locked{transform:scale(.78);opacity:.82}
.pull-line{position:absolute;height:0;z-index:19;transform-origin:0 50%;pointer-events:none;filter:drop-shadow(0 0 7px #33ff83aa)}
.pull-line i{position:absolute;left:0;right:0;top:-3px;height:6px;border-radius:8px;background:linear-gradient(90deg,#55ff9a,#dfff55 62%,#ffb83d);box-shadow:0 0 10px #36f58499}
.pull-line b{position:absolute;right:-16px;top:10px;background:#07150ddd;border:1px solid #4ad87a;border-radius:9px;padding:3px 7px;color:#fff;font-size:11px;font-weight:900;white-space:nowrap;transform:rotate(calc(-1 * var(--pull-angle,0deg)))}
.goal{cursor:crosshair}
@media(max-width:650px){.target-dot{width:30px;height:30px;margin:-15px 0 0 -15px}.target-dot:before{left:13px}.target-dot:after{top:13px}.pull-line i{height:5px;top:-2.5px}}


/* V4.6.12 — simple explicit curl selector */
.curve-selector{position:absolute;left:50%;bottom:1.2%;transform:translateX(-50%);z-index:24;display:flex;gap:6px;padding:5px;border-radius:14px;background:#06120dd9;border:1px solid #4dd67a55;box-shadow:0 5px 18px #0008;backdrop-filter:blur(5px)}
.curve-selector button{min-width:88px;padding:7px 10px;border-radius:10px;border:1px solid #356c49;background:#0b2115;color:#cce8d5;font-size:11px;font-weight:900;cursor:pointer;white-space:nowrap}
.curve-selector button.selected{background:linear-gradient(180deg,#1f8c4b,#125b31);border-color:#75f2a0;color:white;box-shadow:0 0 12px #35e47755;transform:none}
.curve-badge{position:absolute;left:calc(50% + 27px);bottom:10.8%;z-index:23;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#07150de8;border:1px solid #67ef96;color:#fff;font-size:19px;font-weight:900;box-shadow:0 0 12px #33ee7777;pointer-events:none}
@media(max-width:650px){.curve-selector{bottom:.8%;gap:3px;padding:4px}.curve-selector button{min-width:74px;padding:7px 6px;font-size:10px}.curve-badge{bottom:11.2%}}


/* V4.6.13 — translucent right-side shot style HUD */
.curve-selector{left:auto;right:1.2%;bottom:12%;transform:none;z-index:24;display:flex;flex-direction:column;gap:7px;width:104px;padding:10px 8px;border-radius:24px;background:rgba(4,18,11,.34);border:1px solid rgba(255,255,255,.24);box-shadow:0 8px 26px #0005;backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
.shot-style-title{text-align:center;font-size:9px;letter-spacing:1.3px;font-weight:900;color:#d9f4e2;opacity:.85;margin:0 0 2px}
.curve-selector button{min-width:0;width:100%;padding:5px 3px 7px;border:0;background:transparent;color:#fff;display:flex;flex-direction:column;align-items:center;gap:2px;border-radius:16px;font-size:10px;font-weight:800}
.curve-selector button strong{width:43px;height:43px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(255,255,255,.35);font-size:23px;line-height:1;background:rgba(5,20,12,.20)}
.curve-selector button span{white-space:nowrap;text-shadow:0 1px 3px #000}
.curve-selector button.selected{background:rgba(14,70,38,.22);border:0;box-shadow:none}
.curve-selector button.selected strong{border-color:#8df7ff;box-shadow:0 0 13px #60eaff, inset 0 0 10px #3bd7ff55;background:rgba(8,51,57,.36)}
.curve-selector button:hover{transform:none;background:rgba(255,255,255,.06)}
.curve-badge{left:calc(50% + 27px);bottom:10.8%}
.power-hud{position:absolute;left:50%;bottom:2.2%;transform:translateX(-50%);z-index:23;width:245px;padding:8px 13px 10px;border-radius:22px;background:rgba(4,18,11,.38);border:1px solid rgba(255,255,255,.20);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);pointer-events:none;text-align:center;box-shadow:0 6px 20px #0005}
.power-hud b{display:block;font-size:18px;margin-bottom:5px;text-shadow:0 2px 4px #000}
.power-segments{display:grid;grid-template-columns:repeat(10,1fr);gap:2px;height:10px}.power-segments i{border-radius:2px;background:#ffffff25}.power-segments i.on:nth-child(-n+6){background:#35e96d}.power-segments i.on:nth-child(n+7):nth-child(-n+8){background:#f0df45}.power-segments i.on:nth-child(n+9){background:#ff9b3f}
@media(max-width:650px){.curve-selector{right:1%;bottom:16%;width:82px;padding:7px 5px;gap:3px;border-radius:18px}.shot-style-title{font-size:7px}.curve-selector button{font-size:8px;padding:3px 2px 4px}.curve-selector button strong{width:34px;height:34px;font-size:18px}.power-hud{width:180px;bottom:1.3%;padding:6px 10px 8px}.power-hud b{font-size:14px;margin-bottom:3px}.power-segments{height:8px}.curve-badge{bottom:11.2%}}

/* V4.6.14 — power meter attached beneath shot-style controls */
.curve-selector .power-hud{
  position:relative!important; left:auto!important; right:auto!important; bottom:auto!important;
  transform:none!important; width:100%!important; box-sizing:border-box; margin-top:7px;
  padding:7px 6px 8px!important; border-radius:13px!important;
  background:rgba(0,0,0,.22)!important; border:1px solid rgba(255,255,255,.12)!important;
  box-shadow:none!important; backdrop-filter:none!important; -webkit-backdrop-filter:none!important;
}
.curve-selector .power-hud b{font-size:12px!important;margin-bottom:4px!important}
.curve-selector .power-segments{height:7px!important;gap:1px!important}
@media(max-width:650px){
  .curve-selector .power-hud{margin-top:5px;padding:5px 4px 6px!important;border-radius:10px!important}
  .curve-selector .power-hud b{font-size:10px!important}
  .curve-selector .power-segments{height:6px!important}
}

/* V4.6.15 — first-shot goal aiming tutorial */
.goal-aim-tutorial{
  position:absolute;
  left:28.5%; top:21.5%; width:43%; height:26%;
  z-index:16; pointer-events:none; opacity:1;
  transition:opacity .25s ease;
}
.goal-aim-tutorial.is-hidden{opacity:0}
.goal-aim-tutorial .demo-reticle{
  position:absolute; left:50%; top:50%;
  width:42px; height:42px; margin:-21px 0 0 -21px;
  display:grid; place-items:center;
  border:2px solid rgba(255,255,255,.58);
  border-radius:50%;
  color:rgba(255,255,255,.72);
  font-size:29px; line-height:1;
  text-shadow:0 0 12px rgba(95,220,255,.75);
  box-shadow:0 0 0 5px rgba(80,210,255,.08),0 0 18px rgba(80,210,255,.38);
  animation:goalDemoWander 6.8s ease-in-out infinite, goalDemoPulse 1.25s ease-in-out infinite alternate;
}
.goal-aim-tutorial .demo-label{
  position:absolute; left:50%; top:68%;
  transform:translateX(-50%);
  padding:5px 10px; border-radius:999px;
  white-space:nowrap;
  color:rgba(255,255,255,.78); background:rgba(0,0,0,.22);
  border:1px solid rgba(255,255,255,.16);
  font-size:11px; font-weight:800; letter-spacing:.08em;
  text-shadow:0 1px 5px rgba(0,0,0,.65);
}
@keyframes goalDemoWander{
  0%{left:18%;top:22%} 18%{left:18%;top:22%}
  25%{left:78%;top:68%} 40%{left:78%;top:68%}
  48%{left:79%;top:23%} 62%{left:79%;top:23%}
  70%{left:22%;top:67%} 84%{left:22%;top:67%}
  92%,100%{left:50%;top:48%}
}
@keyframes goalDemoPulse{
  from{transform:scale(.92);opacity:.52}
  to{transform:scale(1.06);opacity:.9}
}
@media(max-width:650px){
  .goal-aim-tutorial{left:20%;top:20%;width:60%;height:25%}
  .goal-aim-tutorial .demo-reticle{width:34px;height:34px;margin:-17px 0 0 -17px;font-size:23px}
  .goal-aim-tutorial .demo-label{font-size:9px;padding:4px 7px}
}

/* V4.6.16 — tutorial anchored to actual clickable goal rectangle */
.goal-area, #goalArea { position: relative; }
.goal-aim-tutorial{left:0!important;top:0!important;width:100%!important;height:100%!important;inset:0!important;overflow:hidden!important;}
.goal-aim-tutorial .demo-label{left:50%!important;top:8%!important;transform:translateX(-50%)!important;}
@keyframes goalDemoWander{
  0%,15%{left:14%;top:18%}
  22%,36%{left:84%;top:72%}
  43%,57%{left:84%;top:18%}
  64%,78%{left:14%;top:72%}
  86%,100%{left:50%;top:45%}
}

/* V4.6.17 — tutorial rebuilt against the exact gameplay goalBounds() coordinates */
.goal-aim-tutorial{display:none!important}
.goal-hint-v4617{
  position:absolute; z-index:18; pointer-events:none; display:none;
  width:38px; height:38px; margin:-19px 0 0 -19px;
  border:2px solid rgba(255,255,255,.58); border-radius:50%;
  color:rgba(255,255,255,.76); place-items:center;
  font-size:27px; line-height:1;
  text-shadow:0 0 12px rgba(92,230,255,.8);
  box-shadow:0 0 0 5px rgba(80,210,255,.08),0 0 18px rgba(80,210,255,.38);
  transition:left .9s ease-in-out,top .9s ease-in-out,opacity .2s ease;
}
.goal-hint-v4617.on{display:grid}
.goal-hint-label-v4617{
  position:absolute; z-index:18; pointer-events:none; display:none;
  transform:translate(-50%,-50%); padding:5px 10px; border-radius:999px;
  white-space:nowrap; color:rgba(255,255,255,.82); background:rgba(0,0,0,.30);
  border:1px solid rgba(255,255,255,.18); font-size:11px; font-weight:900;
  letter-spacing:.08em; text-shadow:0 1px 5px #000;
}
.goal-hint-label-v4617.on{display:block}
@media(max-width:650px){
 .goal-hint-v4617{width:32px;height:32px;margin:-16px 0 0 -16px;font-size:22px}
 .goal-hint-label-v4617{font-size:9px;padding:4px 7px}
}


/* V4.6.18 — clearer field composition */
.goal-hint-v4617,.goal-hint-label-v4617{display:none!important}
/* Move taker left/down so the goal mouth stays visually open. */
.shooter{left:20%!important;bottom:-1.5%!important}
@media(max-width:650px){.shooter{left:16%!important;bottom:-1%!important}}
/* Result banner now lives high on the field, away from keeper/ball. */
.msg{left:50%!important;right:auto!important;top:3.5%!important;bottom:auto!important;transform:translateX(-50%);width:max-content;max-width:88%;padding:8px 18px;border-radius:999px;background:rgba(4,18,11,.58);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(7px);font-size:28px!important;line-height:1.05;box-shadow:0 7px 24px #0007}
.sub{left:50%!important;right:auto!important;top:10.5%!important;bottom:auto!important;transform:translateX(-50%);width:max-content;max-width:86%;padding:4px 9px;border-radius:8px;background:rgba(0,0,0,.30);font-size:12px!important;text-shadow:0 1px 4px #000}
@media(max-width:650px){.msg{top:2.5%!important;font-size:21px!important;padding:7px 13px}.sub{top:9.5%!important;font-size:10px!important}}
/* Modern tactical reticle: double ring, center dot and rotating corner marks. */
.goal-hint-v4618{position:absolute;z-index:19;pointer-events:none;display:none;width:46px;height:46px;margin:-23px 0 0 -23px;border:2px solid rgba(214,255,244,.76);border-radius:50%;box-shadow:0 0 0 5px rgba(35,235,195,.08),0 0 19px rgba(66,255,220,.58),inset 0 0 13px rgba(66,255,220,.18);transition:left .86s cubic-bezier(.22,.75,.25,1),top .86s cubic-bezier(.22,.75,.25,1);animation:reticleBreath 1.15s ease-in-out infinite alternate}
.goal-hint-v4618.on{display:block}.goal-hint-v4618:before,.goal-hint-v4618:after{content:'';position:absolute;inset:7px;border:1px solid rgba(255,255,255,.55);border-radius:50%}.goal-hint-v4618:after{inset:-8px;border:0;background:linear-gradient(#bff 0 0) top/2px 8px no-repeat,linear-gradient(#bff 0 0) bottom/2px 8px no-repeat,linear-gradient(#bff 0 0) left/8px 2px no-repeat,linear-gradient(#bff 0 0) right/8px 2px no-repeat;animation:reticleSpin 3.6s linear infinite}.goal-hint-v4618 i{position:absolute;left:50%;top:50%;width:7px;height:7px;transform:translate(-50%,-50%);border-radius:50%;background:#eaffff;box-shadow:0 0 10px #5ff}.goal-hint-v4618 b,.goal-hint-v4618 span{position:absolute;display:block;left:50%;top:50%;width:18px;height:1px;background:rgba(210,255,250,.65);transform:translate(-50%,-50%)}.goal-hint-v4618 span{width:1px;height:18px}.goal-hint-v4618.flash{filter:brightness(1.65)}
@keyframes reticleBreath{from{opacity:.52;transform:scale(.92)}to{opacity:.9;transform:scale(1.06)}}@keyframes reticleSpin{to{transform:rotate(360deg)}}
/* Use the same visual language for the player's selected target. */
.target-dot{border-color:rgba(210,255,247,.92)!important;box-shadow:0 0 0 5px rgba(35,235,195,.10),0 0 18px rgba(66,255,220,.68)!important;animation:targetPulse4618 1s ease-in-out infinite alternate}.target-dot:before,.target-dot:after{background:#dffff8!important}.target-dot i{border-color:#fff!important}
@keyframes targetPulse4618{from{filter:brightness(.9)}to{filter:brightness(1.35)}}

/* V4.6.29 — Majdan frame rendering only; V4.6.28 keeper motion remains authoritative. */
.keeper.majdan29{
  object-fit:contain!important;
  object-position:center center!important;
}


/* V4.6.37 — goalkeeper dives are anchored to the goal-line baseline.
   Horizontal reach remains dynamic; no dive may move toward the penalty taker. */
.keeper.dive{
  left:50%!important;
  top:auto!important;
  bottom:0!important;
  width:92%!important;
  height:120%!important;
  transform:translateX(-50%) scale(.58)!important;
  transform-origin:center bottom!important;
  object-fit:contain!important;
  object-position:center bottom!important;
}
.keeper.dive.go{
  left:var(--kx)!important;
  top:auto!important;
  bottom:0!important;
  transform:translateX(-50%) scale(.92) rotate(var(--lift))!important;
  transform-origin:center bottom!important;
  transition:left var(--kd) cubic-bezier(.12,.72,.2,1),
             transform var(--kd) cubic-bezier(.12,.72,.2,1)!important;
}

/* V4.6.38 — Penaltı Arenası collectible cards (original design). */
.player-cards,.cards{display:grid;grid-template-columns:repeat(5,minmax(130px,1fr));gap:14px;align-items:stretch}
.fut-card,.keeper-fut{position:relative;overflow:hidden;min-height:270px;padding:10px 10px 8px!important;border:1px solid #c8a94d!important;border-radius:22px 22px 28px 28px!important;background:linear-gradient(145deg,#e4c96f 0%,#8d6b20 24%,#173d28 55%,#071b10 100%)!important;box-shadow:inset 0 0 0 2px #f8e59b33,0 12px 28px #0007!important;color:#fff}
.fut-card:before,.keeper-fut:before{content:"";position:absolute;inset:4px;border:1px solid #ffe9a755;border-radius:18px 18px 24px 24px;pointer-events:none}
.fut-rating,.kf-rating{position:absolute;z-index:3;left:14px;top:16px;font-size:27px;font-weight:950;line-height:.8;color:#fff4c5;text-shadow:0 2px 4px #0008}
.fut-rating small,.kf-rating small{display:block;font-size:9px;letter-spacing:1px;margin-top:7px}
.fut-no,.kf-level{position:absolute;z-index:3;right:13px;top:16px;font-size:10px;font-weight:900;background:#062b19cc;padding:4px 6px;border-radius:8px;border:1px solid #ffffff22}
.fut-photo,.kf-photo{height:145px;margin:12px 0 0;display:flex;align-items:flex-end;justify-content:center;position:relative}
.fut-photo img,.kf-photo img{height:100%;max-width:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 8px 6px #0008)}
.fut-name,.kf-name{position:relative;font-size:14px;font-weight:950;text-align:center;text-transform:uppercase;border-top:1px solid #e9ce7444;padding-top:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fut-role,.kf-role{text-align:center;font-size:9px;letter-spacing:1.1px;color:#e7d79c;text-transform:uppercase;margin:2px 0 6px}
.fut-stats,.kf-stats{display:grid;grid-template-columns:1fr 1fr;gap:3px 8px;padding:6px 9px;border-top:1px solid #ffffff1b;border-bottom:1px solid #ffffff1b;font-size:9px}
.fut-stats span,.kf-stats span{display:flex;justify-content:space-between}.fut-stats b,.kf-stats b{color:#ffe99a;font-size:11px}
.fut-brand{text-align:center;font-size:7px;letter-spacing:1.6px;color:#d6bd6e;margin-top:6px;font-weight:800}
.fut-card.selected,.keeper-fut.current{outline:2px solid #57f88e!important;transform:translateY(-5px);box-shadow:0 0 0 3px #0e6d38,0 15px 35px #0009,0 0 26px #3cff7655!important}
.keeper-fut.lock{filter:grayscale(.85);opacity:.38}
.selection-note{text-align:center;padding:7px;border-radius:10px;background:#0b2417;border:1px solid #315c43;font-size:11px;letter-spacing:.6px}
@media(max-width:900px){.player-cards,.cards{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 4px 15px}.fut-card,.keeper-fut{min-width:160px;scroll-snap-align:center}}

/* V4.6.40 — original-photo card portraits; faces are not regenerated. */
.fut-card .fut-photo{
  height:158px;
  margin:4px -7px 0;
  overflow:hidden;
  border-radius:14px 14px 4px 4px;
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 72%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 0%,#000 72%,transparent 100%);
}
.fut-card .fut-photo img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center bottom;
  transform:none!important;
  filter:drop-shadow(0 7px 7px #0008);
}
.fut-card .fut-rating{min-width:34px;text-align:center}

/* V4.6.41 — Bursaspor Efsaneleri green/gold shooter card redesign */
.player-cards{gap:12px!important;align-items:stretch}
.legend-card{position:relative;isolation:isolate;overflow:hidden;min-height:335px;padding:0 10px 12px!important;border:2px solid #e7c66b!important;border-radius:28px 28px 38px 38px!important;background:
radial-gradient(circle at 70% 18%,#2c9a5d77 0 18%,transparent 42%),
linear-gradient(150deg,#16623d 0%,#073a24 42%,#031b10 74%,#020d08 100%)!important;
box-shadow:inset 0 0 0 3px #fff1a522,inset 0 -35px 55px #0008,0 13px 28px #0009!important;color:#fff;cursor:pointer;transition:.2s}
.legend-card:before{content:"";position:absolute;inset:6px;border:1px solid #ffe6a45c;border-radius:23px 23px 33px 33px;z-index:0;pointer-events:none}
.legend-card:after{content:"";position:absolute;left:-35%;top:-15%;width:90%;height:130%;background:linear-gradient(110deg,transparent 30%,#fff3bb13 48%,transparent 64%);transform:rotate(8deg);z-index:0;pointer-events:none}
.legend-number{position:absolute;left:17px;top:25px;z-index:5;color:#ffe29a;font-size:32px;line-height:.8;font-weight:950;text-shadow:0 2px 6px #000}
.legend-number small{display:block;font-size:7px;letter-spacing:1px;margin-top:8px}
.legend-crown{position:absolute;left:24px;top:62px;z-index:5;color:#e8c45d;font-size:16px}
.legend-portrait{height:190px;margin:-1px -9px 0;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;position:relative;z-index:1}
.legend-portrait img{width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 9px 8px #000a)}
.legend-fade{position:absolute;z-index:2;left:8px;right:8px;top:135px;height:78px;background:linear-gradient(transparent,#07351fe8 70%,#062719)}
.legend-name{position:relative;z-index:4;margin-top:-24px;text-align:center;color:#ffe9b0;font-weight:950;font-size:17px;text-transform:uppercase;text-shadow:0 2px 5px #000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.legend-role{position:relative;z-index:4;text-align:center;margin:7px -3px 5px;padding:3px;background:linear-gradient(90deg,transparent,#0a743eaa,transparent);border-top:1px solid #d6ba5e55;border-bottom:1px solid #d6ba5e55;color:#e8f7e9;font-size:10px;font-weight:900;letter-spacing:1.3px}
.legend-stats{position:relative;z-index:4;display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:7px 2px 0}
.legend-stats span{text-align:center;font-size:7px;color:#e6d9a8;border-right:1px solid #d9c16a55}
.legend-stats span:last-child{border-right:0}.legend-stats b{display:block;color:#fff0b6;font-size:17px;margin-top:2px}
.legend-foot{position:relative;z-index:4;text-align:center;color:#e6c665;font-size:14px;margin-top:8px}.legend-foot small{font-size:6px;letter-spacing:1.6px;margin-left:4px}
.legend-card.selected{transform:translateY(-7px) scale(1.02);outline:2px solid #53ff8e!important;box-shadow:0 0 0 3px #0b6638,0 18px 38px #000a,0 0 30px #3cff7655!important}
@media(max-width:900px){.legend-card{min-width:175px!important;min-height:330px}.legend-portrait{height:188px}}

/* V4.6.42 — preserve ORIGINAL photo pixels; no AI face regeneration. */
.legend-portrait{
 height:215px!important;margin:-2px -10px 0!important;overflow:hidden!important;
 -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 67%,transparent 100%)!important;
 mask-image:linear-gradient(to bottom,#000 0%,#000 67%,transparent 100%)!important;
}
.legend-portrait img{
 width:100%!important;height:100%!important;object-fit:cover!important;
 object-position:center 18%!important;transform:none!important;
 filter:saturate(.95) contrast(1.02) drop-shadow(0 8px 7px #0008)!important;
}
.legend-card:nth-child(1) .legend-portrait img{object-fit:contain!important;object-position:center bottom!important;transform:scale(1.55)!important;transform-origin:center 72%!important}
.legend-card:nth-child(2) .legend-portrait img{object-position:center 12%!important}
.legend-card:nth-child(3) .legend-portrait img{object-position:center 13%!important}
.legend-card:nth-child(4) .legend-portrait img{object-position:center 15%!important}
.legend-card:nth-child(5) .legend-portrait img{object-position:center 10%!important}
.legend-number small{font-size:10px!important;color:#f7df8e!important;font-weight:950!important;letter-spacing:1.2px!important}

/* V4.6.43 — user-prepared transparent player PNGs + Bursaspor crest */
.legend-crown{display:none!important}
.legend-club-logo{position:absolute;right:16px;top:17px;width:43px;height:43px;object-fit:contain;z-index:6;filter:drop-shadow(0 2px 3px #0008)}
.legend-portrait{height:215px!important;margin:0 -9px!important;-webkit-mask-image:none!important;mask-image:none!important}
.legend-portrait img{width:100%!important;height:100%!important;object-fit:contain!important;object-position:center bottom!important;transform:none!important;filter:drop-shadow(0 8px 7px #0008)!important}
.legend-card:nth-child(1) .legend-portrait img,.legend-card:nth-child(2) .legend-portrait img,.legend-card:nth-child(3) .legend-portrait img,.legend-card:nth-child(4) .legend-portrait img,.legend-card:nth-child(5) .legend-portrait img{object-fit:contain!important;object-position:center bottom!important;transform:none!important}

/* V4.6.44 — latest transparent Bursaspor crest, 50% smaller */
.legend-club-logo{
 position:absolute!important;
 top:17px!important;
 right:17px!important;
 width:25px!important;
 height:25px!important;
 object-fit:contain!important;
 z-index:7!important;
 background:transparent!important;
 border:0!important;
 box-shadow:none!important;
 filter:drop-shadow(0 2px 2px rgba(0,0,0,.42))!important;
}
.legend-crown{display:none!important}

/* V4.6.45 */
.legend-club-logo{width:25px!important;height:25px!important}
/* Pull the dark name backing slightly lower to remove the visible gap. */
.legend-fade{top:142px!important;height:92px!important}
.legend-name{margin-top:-29px!important;padding-top:2px!important}
/* V4.6.46 — pre-match VS screen */
.vs-screen{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 42%,#0c5d38 0,#052c1c 36%,#010b07 78%);opacity:0;pointer-events:none;transition:opacity .3s ease}
.vs-screen.show{opacity:1;pointer-events:auto}.vs-stage{width:min(920px,94vw);text-align:center;color:#fff}.vs-kicker{font-size:12px;letter-spacing:4px;color:#e9cb72;font-weight:900;margin-bottom:12px}.vs-title{font-size:clamp(25px,4vw,46px);font-weight:950;margin:0 0 22px;text-shadow:0 4px 18px #000}.vs-duel{display:grid;grid-template-columns:1fr 110px 1fr;gap:18px;align-items:center}.vs-card{position:relative;height:min(490px,64vh);border:2px solid #d8b85b;border-radius:30px;background:linear-gradient(155deg,#17643e,#07341f 48%,#02150d);overflow:hidden;box-shadow:inset 0 0 0 3px #ffe8a51c,0 20px 60px #000a}.vs-card img{width:100%;height:72%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 12px 10px #0009)}.vs-card.keeper img{height:70%;margin-top:10px}.vs-meta{position:absolute;left:0;right:0;bottom:0;padding:30px 12px 20px;background:linear-gradient(transparent,#031a10 27%,#010b07 100%)}.vs-meta b{display:block;color:#ffe39a;font-size:clamp(20px,3vw,31px);text-transform:uppercase}.vs-meta span{font-size:12px;letter-spacing:2px;color:#b9d8c7}.vs-badge{font-size:clamp(44px,7vw,78px);font-weight:1000;color:#f4d16e;text-shadow:0 0 24px #e9b93c88}.vs-count{margin-top:18px;color:#d7eadf;font-size:13px;letter-spacing:1px}.vs-screen.go .vs-duel{animation:vsPunch .55s ease both}.vs-screen.go .vs-badge{animation:vsFlash .55s ease both}@keyframes vsPunch{50%{transform:scale(1.035)}100%{transform:scale(1)}}@keyframes vsFlash{50%{transform:scale(1.28);filter:brightness(1.8)}100%{transform:scale(1)}}
@media(max-width:650px){.vs-duel{grid-template-columns:1fr 58px 1fr;gap:7px}.vs-card{height:390px;border-radius:20px}.vs-meta{padding:28px 6px 15px}.vs-meta b{font-size:17px}.vs-meta span{font-size:9px}.vs-badge{font-size:38px}}