*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%;overflow:hidden;background:#0c1810;color:#eef5ef;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  user-select:none;-webkit-user-select:none;touch-action:none}
#game{position:fixed;inset:0;width:100%;height:100%;display:block;
  image-rendering:pixelated;image-rendering:crisp-edges}
.tvmode #game{image-rendering:auto}
.btn,h2,kbd,.set-label,#hud,#banner,.menu-console,.menu-ticker{
  font-family:ui-monospace,'SFMono-Regular',Menlo,Consolas,'Liberation Mono',monospace;
  font-variant-ligatures:none}

/* ---------- ekranlar ---------- */
.screen{position:fixed;inset:0;display:none;flex-direction:column;align-items:center;
  justify-content:flex-start;padding:24px 16px;overflow-y:auto;z-index:20;
  background:
    radial-gradient(circle at 18% 14%,rgba(90,214,114,.12),transparent 26%),
    radial-gradient(circle at 84% 82%,rgba(255,213,77,.07),transparent 28%),
    radial-gradient(ellipse at 50% -20%,#245b34 0%,#0c1810 66%);touch-action:pan-y}
.screen.active{display:flex}
.logo{font-size:clamp(54px,8.2vw,108px);font-weight:1000;line-height:.78;letter-spacing:-.07em;
  position:relative;isolation:isolate;white-space:nowrap;transform:skew(-7deg);filter:drop-shadow(0 18px 24px rgba(0,0,0,.5))}
.logo .lg{display:inline-block;color:#f7ffe5;-webkit-text-stroke:clamp(1px,.18vw,3px) #102015;
  text-shadow:3px 3px 0 #102015,6px 6px 0 #e84a33,9px 9px 0 #7c1f1e,
    0 0 24px rgba(255,231,87,.2)}
.logo>b{display:inline-block;margin-left:.04em;color:#ffe457;-webkit-text-stroke:clamp(1px,.16vw,2px) #102015;
  text-shadow:3px 3px 0 #102015,6px 6px 0 #e84a33;animation:menu-bang 1.8s steps(2,end) infinite}
.logo-ball{position:relative;display:inline-block;width:.68em;height:.68em;margin:0 .07em .01em .09em;
  vertical-align:.03em;border:.045em solid #102015;border-radius:50%;background:
    radial-gradient(circle at 50% 50%,#102015 0 16%,transparent 17%),
    radial-gradient(circle at 20% 25%,#102015 0 10%,transparent 11%),
    radial-gradient(circle at 82% 30%,#102015 0 9%,transparent 10%),
    radial-gradient(circle at 25% 78%,#102015 0 9%,transparent 10%),
    radial-gradient(circle at 73% 79%,#102015 0 9%,transparent 10%),#f8ffe9;
  box-shadow:3px 3px 0 #102015,6px 6px 0 #e84a33;animation:menu-ball-spin 4s linear infinite}
.tagline{margin-top:24px;color:#d8ead8;font-size:clamp(14px,1.55vw,18px);font-weight:650;
  line-height:1.45;max-width:540px;text-shadow:0 2px 8px #061008}
.btn{display:block;min-width:230px;min-height:52px;margin:12px auto;padding:14px 28px;
  font-size:18px;font-weight:700;color:#0c1810;background:#5ad672;border:0;
  border-radius:14px;cursor:pointer;transition:transform .1s,box-shadow .1s;
  box-shadow:0 4px 18px rgba(90,214,114,.35)}
.btn:active{transform:scale(.96)}
.btn.ghost{background:transparent;color:#9fd8aa;border:2px solid #2f6b3d;box-shadow:none}
h2{font-size:22px;margin:12px 0 18px;letter-spacing:1px}

/* ---------- ana menü: 96/97 açılı stadyum sunumu ---------- */
#scr-menu{padding:0;overflow:hidden;display:none;justify-content:center;align-items:stretch;
  background:#08120c;isolation:isolate}
#scr-menu.active{display:flex}
#scr-menu::before{content:"";position:absolute;inset:0;z-index:-3;pointer-events:none;background:
  linear-gradient(180deg,rgba(3,9,6,.12),rgba(3,9,6,.78)),
  radial-gradient(ellipse at 50% 8%,rgba(80,224,122,.28),transparent 42%),
  linear-gradient(125deg,#07130c 0%,#102e1b 43%,#07120c 100%)}
#scr-menu::after{content:"";position:absolute;inset:0;z-index:9;pointer-events:none;opacity:.16;
  background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(0,0,0,.34) 4px),
    radial-gradient(ellipse at center,transparent 42%,#020604 100%);mix-blend-mode:multiply}
.menu-world{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.menu-world::before{content:"";position:absolute;left:-5%;right:-5%;top:8%;height:34%;
  background:
    radial-gradient(circle at 20% 22%,#f9e85f 0 1px,transparent 2px) 0 0/18px 16px,
    radial-gradient(circle at 73% 58%,#e84a33 0 1.4px,transparent 2.5px) 0 0/24px 18px,
    linear-gradient(180deg,#13271a,#09130d);border-top:3px solid rgba(255,228,87,.34);
  transform:perspective(800px) rotateX(-4deg);box-shadow:0 14px 40px #030805}
.menu-crowd{position:absolute;top:12%;width:51%;height:27%;opacity:.83;mix-blend-mode:screen}
.crowd-home{left:-2%;background:radial-gradient(circle,#e84a33 0 2px,transparent 2.8px) 0 0/19px 16px}
.crowd-away{right:-2%;background:radial-gradient(circle,#5ad672 0 2px,transparent 2.8px) 0 0/19px 16px}
.menu-floodlight{position:absolute;top:-3%;width:38%;height:70%;filter:blur(1px);opacity:.35;
  background:conic-gradient(from 178deg at 50% 0,#fffbd4 0deg,transparent 21deg 339deg,#fffbd4 360deg)}
.light-left{left:-8%;transform:rotate(8deg)}.light-right{right:-8%;transform:rotate(-8deg)}
.menu-pitch{position:absolute;left:-17%;bottom:-46%;width:134%;height:108%;opacity:.78;
  transform:perspective(750px) rotateX(57deg) rotateZ(-3deg);transform-origin:50% 100%;
  border:4px solid rgba(227,255,224,.7);background:
    repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 8%,rgba(0,0,0,.075) 8% 16%),
    repeating-linear-gradient(0deg,#21753b 0 58px,#1b6934 58px 116px);
  box-shadow:inset 0 0 60px rgba(0,0,0,.45),0 -20px 80px rgba(52,221,94,.22)}
.menu-pitch::before,.menu-pitch::after{content:"";position:absolute;top:18%;bottom:18%;width:16%;
  border:4px solid rgba(238,255,235,.72)}
.menu-pitch::before{left:-4%}.menu-pitch::after{right:-4%}
.pitch-half{position:absolute;left:50%;top:0;bottom:0;border-left:4px solid rgba(238,255,235,.72)}
.pitch-circle{position:absolute;left:50%;top:50%;width:18%;aspect-ratio:1;border:4px solid rgba(238,255,235,.72);
  border-radius:50%;transform:translate(-50%,-50%)}
.pitch-box{position:absolute;left:50%;top:50%;width:10px;height:10px;border-radius:50%;
  transform:translate(-50%,-50%);background:#efffea;box-shadow:0 0 20px #efffea}
.menu-player{position:absolute;width:90px;height:178px;bottom:9%;filter:drop-shadow(10px 18px 5px rgba(0,0,0,.42));
  transform-origin:50% 100%;animation:menu-player-bob 1.1s ease-in-out infinite alternate}
.menu-player i{display:block;position:absolute}.mp-head{left:33px;top:0;width:34px;height:38px;border-radius:48% 48% 42% 42%;
  background:#c98354;border:4px solid #0a150d;z-index:5}.mp-head::after{content:"";position:absolute;left:4px;right:4px;top:-3px;height:10px;
  border-radius:50% 50% 20% 20%;background:#201710}
.mp-body{left:25px;top:33px;width:50px;height:72px;clip-path:polygon(15% 0,85% 0,100% 78%,72% 100%,28% 100%,0 78%);
  border:4px solid #0a150d;background:linear-gradient(100deg,#fff 0 28%,#e84a33 29% 72%,#fff 73%);z-index:4}
.mp-arm,.mp-leg{height:18px;border-radius:12px;border:4px solid #0a150d;transform-origin:8px 50%;z-index:3}
.mp-arm{top:47px;width:63px;background:#c98354}.mp-leg{top:99px;width:72px;background:#f3f7e7}
.player-home{left:12%;transform:rotate(-8deg) scale(1.08)}
.player-home .arm-a{left:8px;transform:rotate(134deg)}.player-home .arm-b{left:63px;transform:rotate(34deg)}
.player-home .leg-a{left:25px;transform:rotate(106deg)}.player-home .leg-b{left:48px;transform:rotate(18deg);width:84px}
.player-away{left:30%;bottom:17%;transform:scale(.72) rotate(7deg);animation-delay:-.45s;opacity:.88}
.player-away .mp-body{background:linear-gradient(100deg,#13243e 0 28%,#4c8be6 29% 72%,#13243e 73%)}
.player-away .arm-a{left:9px;transform:rotate(145deg)}.player-away .arm-b{left:60px;transform:rotate(28deg)}
.player-away .leg-a{left:25px;transform:rotate(112deg)}.player-away .leg-b{left:47px;transform:rotate(55deg)}
.menu-kick-ball{position:absolute;left:24%;bottom:14%;width:42px;height:42px;border:4px solid #08120c;border-radius:50%;
  background:radial-gradient(circle at 50% 50%,#101812 0 17%,transparent 18%),
    radial-gradient(circle at 20% 25%,#101812 0 9%,transparent 10%),
    radial-gradient(circle at 79% 29%,#101812 0 9%,transparent 10%),#f6ffea;
  box-shadow:0 0 28px rgba(255,232,87,.75),11px 17px 5px rgba(0,0,0,.35);
  animation:menu-kick 1.1s cubic-bezier(.35,.05,.65,.95) infinite alternate}
.menu-speedline{position:absolute;height:4px;border-radius:4px;background:linear-gradient(90deg,transparent,#ffe457);
  transform:rotate(-10deg);opacity:.7}.speedline-a{left:7%;bottom:19%;width:120px}.speedline-b{left:4%;bottom:23%;width:76px}
.menu-shell{position:relative;z-index:2;display:grid;grid-template-columns:minmax(420px,1.08fr) minmax(390px,.92fr);
  gap:clamp(34px,6vw,90px);align-items:center;width:min(1180px,calc(100% - 64px));min-height:calc(100vh - 52px);
  margin:0 auto;padding:42px 0 60px}
.menu-brand{align-self:center;padding-bottom:14vh}
.menu-eyebrow{display:flex;align-items:center;gap:13px;margin:0 0 20px;font-size:11px;font-weight:900;letter-spacing:2.6px;
  color:#d9efda;text-shadow:0 2px 5px #000}.menu-eyebrow::before{content:"";width:42px;height:5px;background:#ffe457;
  box-shadow:0 0 14px rgba(255,228,87,.7)}.menu-eyebrow b{padding:5px 8px;color:#0b170e;background:#ffe457;transform:skew(-8deg)}
.menu-features{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}.menu-features span{padding:7px 10px;border:1px solid rgba(170,232,180,.35);
  background:rgba(7,19,11,.66);color:#aee7b7;font-size:10px;font-weight:900;letter-spacing:1.3px;
  box-shadow:inset 3px 0 #5ad672;backdrop-filter:blur(5px)}
.menu-console{position:relative;width:100%;max-height:calc(100vh - 80px);overflow:auto;padding:18px;
  background:linear-gradient(145deg,rgba(20,41,27,.94),rgba(7,16,10,.97));
  border:1px solid rgba(152,231,166,.42);border-radius:3px 22px 3px 22px;
  box-shadow:0 28px 80px rgba(0,0,0,.58),inset 0 1px rgba(255,255,255,.1),-7px 7px 0 rgba(5,11,7,.72);
  scrollbar-width:thin;scrollbar-color:#3e8950 #0b170f}
.menu-console::before{content:"";position:absolute;inset:7px;pointer-events:none;border:1px solid rgba(255,255,255,.055);
  border-radius:1px 16px 1px 16px}
.menu-console-head{position:relative;display:flex;align-items:center;justify-content:space-between;margin:1px 2px 14px;
  padding:0 2px 10px;border-bottom:1px solid #2d5737;color:#eaf8ea;font-size:12px;font-weight:950;letter-spacing:2.2px}
.menu-console-head b{font-size:9px;color:#ffe457;animation:menu-start-blink 1.15s steps(2,end) infinite}
.menu-primary-actions{display:grid;gap:9px}.menu-action{position:relative;width:100%;min-width:0;min-height:66px;margin:0;
  padding:12px 72px 12px 68px;text-align:left;border-radius:2px 13px 2px 13px;overflow:hidden;
  border:1px solid rgba(255,255,255,.34);font-size:18px;line-height:1.05;letter-spacing:.25px;
  box-shadow:0 8px 16px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.3);transition:transform .13s,filter .13s,box-shadow .13s}
.menu-action::before{content:attr(data-code);position:absolute;left:0;top:0;bottom:0;width:52px;display:grid;place-items:center;
  color:#fff;font-size:20px;font-style:italic;background:rgba(6,15,9,.76);border-right:1px solid rgba(255,255,255,.25)}
.menu-action::after{content:attr(data-sub);position:absolute;left:69px;bottom:9px;font-size:10px;font-weight:750;
  letter-spacing:.4px;opacity:.67}.menu-action:hover,.menu-action:focus-visible{transform:translateX(-5px);filter:brightness(1.12);
  box-shadow:8px 8px 0 rgba(0,0,0,.38),0 0 25px rgba(90,214,114,.22);outline:2px solid #fff;outline-offset:2px}
.menu-action:active{transform:translateX(-2px) scale(.985)}
.menu-action.daily{color:#231b08;background:linear-gradient(115deg,#ffe457,#f7aa31)}
.menu-action.quick{color:#07140b;background:linear-gradient(115deg,#71ed82,#38bb64)}
.menu-action.cup{color:#f7f9ff;background:linear-gradient(115deg,#536fcf,#8b4bc4)}
.menu-secondary-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:11px}
.menu-secondary-actions .btn{min-width:0;min-height:40px;margin:0;padding:9px 5px;border-radius:8px;border:1px solid #315d3b;
  font-size:11px;color:#bcdcc2;background:rgba(6,15,9,.62)}
.menu-secondary-actions .btn:hover,.menu-secondary-actions .btn:focus-visible{color:#fff;border-color:#70dc82;background:#173622;outline:none}
.menu-secondary-actions .btn[hidden]{display:none}
.menu-ticker{position:absolute;z-index:7;left:0;right:0;bottom:0;height:32px;overflow:hidden;
  border-top:2px solid #07120c;background:#ffe457;color:#0b160e;font-size:12px;font-weight:1000;letter-spacing:1.8px;
  line-height:30px;white-space:nowrap;transform:skewY(-.35deg);transform-origin:left bottom}
.menu-ticker div{width:max-content;animation:menu-ticker 17s linear infinite}

@keyframes menu-bang{50%{transform:translateY(-3px) rotate(2deg)}}
@keyframes menu-ball-spin{to{transform:rotate(360deg)}}
@keyframes menu-player-bob{to{translate:0 -6px}}
@keyframes menu-kick{to{transform:translate(14px,-18px) rotate(65deg)}}
@keyframes menu-start-blink{50%{opacity:.28}}
@keyframes menu-ticker{to{transform:translateX(-50%)}}

/* haftanın form kartları */
#form-panel{position:relative;margin:12px 0 0;width:100%;background:rgba(7,17,10,.7);
  border:1px solid #294d32;border-radius:2px 12px 2px 12px;padding:10px 12px;text-align:center}
.form-title{font-size:13px;font-weight:900;letter-spacing:2px;color:#ffd54d;margin-bottom:10px}
.form-row{display:flex;align-items:center;gap:8px;padding:3px 0;font-size:12px;text-align:left}
.form-row .kit{width:18px;height:18px}
.form-team{opacity:.65;font-size:10px}
.form-not{margin-left:auto;font-size:11px;color:#7ee08a;opacity:.9}
#form-panel #form-share{position:absolute;right:8px;top:4px!important;min-height:28px!important;margin:0!important;
  padding:4px 8px!important;border-width:1px;font-size:10px!important}

/* takım kartları */
#team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:12px;width:100%;max-width:760px;padding-bottom:24px}
.teamcard{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 8px;
  min-height:96px;background:#14291b;border:2px solid #245030;border-radius:14px;
  color:#eef5ef;cursor:pointer;font-size:15px;transition:border-color .12s,transform .12s}
.teamcard:hover,.teamcard:active{border-color:#5ad672;transform:translateY(-2px)}
.kit{display:inline-block;width:26px;height:26px;border-radius:50%;
  border:2px solid rgba(255,255,255,.6);flex:none}
.tname{font-weight:700}
.tstars{color:#ffd54d;font-size:13px;letter-spacing:1px}

/* kupa */
#cup-list{width:100%;max-width:600px}
.cupmatch{display:flex;align-items:center;gap:8px;padding:10px 14px;margin:7px 0;
  background:#14291b;border:1px solid #245030;border-radius:12px;font-size:15px}
.cupmatch.mine{border-color:#5ad672;background:#183a22;box-shadow:0 0 14px rgba(90,214,114,.18)}
.cm-t{flex:1;display:flex;align-items:center;gap:8px;font-weight:600}
.cm-t.right{justify-content:flex-end}
.cm-s{min-width:56px;text-align:center;font-weight:900;font-size:17px;color:#7ee08a}
.cup-h-round{font-size:12px;opacity:.65;margin:4px 0}
.cup-buttons{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:14px 0}
.cup-buttons .btn{margin:0}

/* HUD */
#hud{display:none;position:fixed;top:10px;left:50%;transform:translateX(-50%);
  align-items:center;gap:14px;padding:9px 19px;background:linear-gradient(180deg,rgba(21,47,28,.95),rgba(7,17,10,.93));
  border:1px solid rgba(126,224,138,.58);border-radius:999px;z-index:15;backdrop-filter:blur(9px);
  box-shadow:0 8px 28px rgba(0,0,0,.52),0 0 22px rgba(90,214,114,.14),inset 0 1px rgba(255,255,255,.12)}
body:not(.tvmode) #hud{border-radius:3px;border-width:2px;backdrop-filter:none;
  box-shadow:4px 4px 0 rgba(3,10,5,.78),inset 0 0 0 1px rgba(255,255,255,.08)}
#hud-score{font-weight:900;font-size:17px;letter-spacing:1px;white-space:nowrap}
#hud-min{color:#7ee08a;font-weight:700;font-variant-numeric:tabular-nums}
#hud-energy{min-width:44px;color:#7ee08a;font-size:11px;font-weight:900;font-variant-numeric:tabular-nums}
#hud-energy.warn{color:#e8c23d}#hud-energy.low{color:#ff7468;animation:energy-pulse .8s steps(2,end) infinite}
#hud-action{display:none;align-items:center;gap:5px;min-width:70px;color:#d9eadc;font-size:9px;letter-spacing:1px}
#hud-action.on{display:flex}
#hud-action i{--charge:0%;display:block;width:46px;height:5px;border:1px solid rgba(255,255,255,.28);
  background:linear-gradient(90deg,#5ad672 0 var(--charge),rgba(255,255,255,.10) var(--charge) 100%)}
#hud-action.shoot i{background:linear-gradient(90deg,#ff6b5f 0 var(--charge),rgba(255,255,255,.10) var(--charge) 100%)}
#hud-action b{font-size:9px}
@keyframes energy-pulse{50%{opacity:.45}}
#hud-pause{background:none;border:0;color:#9fd8aa;font-size:17px;cursor:pointer;
  min-width:44px;min-height:32px}
.chip{width:11px;height:11px;border-radius:3px;display:inline-block;flex:none;
  border:1px solid rgba(255,255,255,.35);background:transparent}

/* TV Yayını skorbordu */
.tvmode #hud{background:linear-gradient(180deg,#14181d 0%,#242b33 100%);
  border:1px solid #46525e;border-radius:8px;box-shadow:0 6px 22px rgba(0,0,0,.5)}
.tvmode #hud-score{font-family:Verdana,Geneva,sans-serif;font-size:15px;letter-spacing:2px}
.tvmode #hud-min{color:#ffd54d;background:rgba(255,213,77,.12);padding:2px 8px;border-radius:5px}
.tvmode #hud-pause{color:#8fa2b3}

/* Maç bildirimi: sıradan olaylar sahayı kapatmayan yayın tipi bilgi bandıdır. */
#banner{position:fixed;top:14%;left:50%;transform:translate(-50%,-8px) scale(.96);
  max-width:min(78vw,620px);width:max-content;padding:7px 14px 7px 12px;border-radius:4px;
  background:linear-gradient(90deg,rgba(8,17,11,.94),rgba(15,31,20,.88));
  border:1px solid rgba(211,239,217,.3);border-left:4px solid #ffe35a;
  box-shadow:0 7px 22px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.07);
  font-size:clamp(12px,1.55vw,18px);font-weight:850;letter-spacing:.45px;color:#f5fff4;
  text-shadow:1px 2px 0 #071009;opacity:0;z-index:16;pointer-events:none;
  transition:opacity .15s,transform .2s;text-align:center;white-space:normal;line-height:1.15}
#banner.on{opacity:1;transform:translate(-50%,0) scale(1);animation:banner-in .24s steps(4,end)}
@keyframes banner-in{
  0%{filter:brightness(1.8);transform:translate(-50%,-8px) scale(.94)}
  100%{filter:brightness(1);transform:translate(-50%,0) scale(1)}
}
/* Devre ve eleme anları hâlâ güçlüdür; yalnızca bu olaylar merkez sahneyi alır. */
#banner.major{top:34%;max-width:90vw;padding:10px 19px;border-left-width:6px;
  font-size:clamp(20px,4.4vw,42px);letter-spacing:1.5px;
  background:linear-gradient(90deg,rgba(8,17,11,.96),rgba(24,52,31,.92));
  box-shadow:0 10px 30px rgba(0,0,0,.52),0 0 24px rgba(90,214,114,.2)}
#banner.major.on{animation:banner-major .38s cubic-bezier(.15,1.25,.35,1)}
@keyframes banner-major{
  0%{filter:brightness(2);transform:translate(-50%,-10px) scale(.72)}
  70%{filter:brightness(1.2);transform:translate(-50%,0) scale(1.04)}
  100%{filter:brightness(1);transform:translate(-50%,0) scale(1)}
}

/* kontrol ipucu (maç başında) */
#hint{position:fixed;left:50%;bottom:14%;transform:translate(-50%,10px);
  padding:10px 18px;border-radius:14px;background:rgba(10,22,14,.88);
  border:1px solid #2f6b3d;color:#dff3e3;font-size:14px;text-align:center;
  opacity:0;transition:opacity .3s,transform .3s;pointer-events:none;z-index:16;
  max-width:92vw;backdrop-filter:blur(6px);line-height:1.7}
#hint.on{opacity:1;transform:translate(-50%,0)}
#hint b{color:#7ee08a}
.hint-sub{display:block;font-size:12px;opacity:.7}
#game:focus{outline:none}

/* ilk maç eğitimi */
#tutorial{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;
  padding:20px;background:rgba(4,12,7,.82);backdrop-filter:blur(9px);z-index:40}
#tutorial[hidden]{display:none}
.tutorial-card{width:min(470px,94vw);padding:28px 26px 22px;text-align:center;
  background:linear-gradient(180deg,#183a22,#102518);border:2px solid #3d8b50;
  border-radius:22px;box-shadow:0 24px 80px rgba(0,0,0,.55)}
.tutorial-kicker{font-size:11px;font-weight:900;letter-spacing:2.4px;color:#ffd54d}
.tutorial-icon{width:76px;height:76px;margin:18px auto 8px;display:grid;place-items:center;
  border-radius:50%;font-size:37px;font-weight:900;color:#0c1810;background:#5ad672;
  box-shadow:0 0 28px rgba(90,214,114,.34)}
.tutorial-card h2{margin:10px 0 8px;font-size:25px}
.tutorial-card p{min-height:48px;line-height:1.55;color:#cfe8d4;font-size:15px}
#tutorial-keys{min-height:44px;margin:13px 0 5px;display:flex;align-items:center;
  justify-content:center;gap:8px;flex-wrap:wrap}
.tutorial-key{min-width:42px;padding:8px 10px;border:1px solid #4a8d5a;border-radius:9px;
  background:#0c1810;color:#eef5ef;font-weight:900;box-shadow:inset 0 -3px rgba(255,255,255,.06)}
#tutorial-dots{display:flex;justify-content:center;gap:7px;margin:16px 0 4px}
.tutorial-dot{width:8px;height:8px;border-radius:50%;background:#315d3b}
.tutorial-dot.on{width:22px;border-radius:8px;background:#5ad672}
.tutorial-actions{display:flex;gap:10px;justify-content:center;margin-top:12px}
.tutorial-actions .btn{min-width:125px;margin:0;font-size:16px}

@media (max-width:480px){
  .tutorial-card{padding:23px 18px 18px}
  .tutorial-actions .btn{min-width:0;flex:1;padding-left:12px;padding-right:12px}
}

/* dokunmatik kontroller */
#touchui{display:none;position:fixed;inset:0;pointer-events:none;z-index:14}
#stick{display:none;position:fixed;width:100px;height:100px;border-radius:50%;
  border:2px solid rgba(255,255,255,.35);background:rgba(255,255,255,.06)}
#knob{position:absolute;left:30px;top:30px;width:40px;height:40px;border-radius:50%;
  background:rgba(255,255,255,.45)}
.tbtn{position:fixed;width:76px;height:76px;border-radius:50%;border:2px solid rgba(255,255,255,.4);
  background:radial-gradient(circle at 35% 28%,rgba(160,255,175,.62),rgba(35,128,58,.66));
  color:#fff;font-weight:900;font-size:15px;pointer-events:auto;z-index:15;backdrop-filter:blur(4px);
  box-shadow:0 8px 24px rgba(0,0,0,.4),inset 0 2px rgba(255,255,255,.25),0 0 20px rgba(90,214,114,.22);
  transition:transform .08s,filter .08s,box-shadow .08s}
.tbtn:active{transform:scale(.88);filter:brightness(1.45);box-shadow:0 0 34px rgba(255,255,255,.55)}
#btn-shoot{right:22px;bottom:96px;background:radial-gradient(circle at 35% 28%,#ff9a8f,#b41f2b 70%);
  box-shadow:0 8px 24px rgba(0,0,0,.4),inset 0 2px rgba(255,255,255,.28),0 0 24px rgba(255,66,66,.28)}
#btn-pass{right:112px;bottom:30px}
#btn-switch{right:112px;bottom:120px;width:56px;height:56px;font-size:11px;
  color:#201b08;background:radial-gradient(circle at 35% 28%,#fff29a,#d9ad20 72%);
  box-shadow:0 8px 22px rgba(0,0,0,.38),inset 0 2px rgba(255,255,255,.34),0 0 20px rgba(255,213,77,.28)}

/* taktik kartları */
#tactic-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:12px;width:100%;max-width:820px;padding-bottom:20px}
.tacticcard{display:flex;flex-direction:column;align-items:center;gap:7px;padding:14px 10px;
  background:#14291b;border:2px solid #245030;border-radius:14px;color:#eef5ef;
  cursor:pointer;transition:border-color .12s,transform .12s}
.tacticcard:hover,.tacticcard:active{border-color:#5ad672;transform:translateY(-2px)}
.tacticcard.sel{border-color:#5ad672;background:#183a22}
.tacticcard canvas{border-radius:6px}
.tacticcard b{font-size:17px;letter-spacing:1px}
.tacticcard span{font-size:12px;opacity:.7;text-align:center;line-height:1.4}
#tactic-style{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:min(760px,94vw);margin:0 auto 14px}
#tactic-style>small{grid-column:1/-1;color:#71d785;font-size:9px;letter-spacing:2px;text-align:left}
#tactic-style button{display:flex;flex-direction:column;gap:3px;align-items:flex-start;padding:10px 12px;color:#a8c4ae;
  border:1px solid rgba(105,185,123,.25);background:rgba(6,18,10,.68);border-radius:5px;text-align:left;cursor:pointer}
#tactic-style button b{font-size:11px;letter-spacing:.8px;color:#e5f1e7}
#tactic-style button span{font-size:9px;line-height:1.35;opacity:.66}
#tactic-style button.sel{border-color:#5ad672;background:linear-gradient(135deg,rgba(33,92,48,.68),rgba(8,24,13,.9));
  box-shadow:inset 0 -2px #5ad672}

/* ayarlar */
.set-label{font-size:12px;font-weight:900;letter-spacing:2px;color:#7ee08a;margin:14px 0 8px}
.seg{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.seg button{min-height:48px;padding:8px 16px;border-radius:12px;border:2px solid #2f6b3d;
  background:transparent;color:#cfe8d4;font-size:15px;font-weight:700;cursor:pointer;line-height:1.3}
.seg button small{font-weight:400;font-size:11px;opacity:.75}
.seg button.sel{background:#5ad672;color:#0c1810;border-color:#5ad672}
.seg button.sel small{opacity:.85}

/* yardım */
.help-box{max-width:520px;background:#14291b;border:1px solid #245030;border-radius:14px;
  padding:20px 22px;line-height:1.8;font-size:15px}
.help-box b{color:#7ee08a}
kbd{background:#0c1810;border:1px solid #2f6b3d;border-radius:6px;padding:2px 8px;
  font-family:inherit;font-size:13px}

@media (max-width:600px){
  #team-grid{grid-template-columns:repeat(2,1fr)}
  #hud{gap:8px;padding:6px 12px;max-width:94vw}
  #hud-score{font-size:14px}
  #hud-min{font-size:13px}
  #hud .chip{display:none}#hud-energy{font-size:10px;min-width:38px}
}

@media (max-width:900px){
  #scr-menu{overflow-y:auto;overflow-x:hidden;justify-content:flex-start}
  .menu-shell{display:flex;flex-direction:column;gap:20px;width:min(560px,calc(100% - 28px));min-height:0;
    padding:30px 0 56px;margin:auto}
  .menu-brand{align-self:stretch;padding:0;text-align:center}.menu-eyebrow{justify-content:center;margin-bottom:16px}
  .menu-features{justify-content:center}.tagline{margin-left:auto;margin-right:auto;margin-top:18px}
  .menu-console{max-height:none}.menu-player{opacity:.32}.player-home{left:4%}.player-away{left:auto;right:4%}
  .menu-kick-ball{left:24%;opacity:.45}.menu-pitch{bottom:-29%;height:85%}
}

@media (max-width:480px){
  .menu-shell{gap:16px;padding-top:max(20px,env(safe-area-inset-top));width:calc(100% - 20px)}
  .menu-eyebrow{font-size:8px;letter-spacing:1.5px;gap:7px}.menu-eyebrow::before{width:18px;height:3px}
  .logo{font-size:clamp(52px,20vw,76px)}.tagline{margin-top:15px;font-size:13px;padding:0 12px}
  .menu-features{margin-top:13px}.menu-features span{padding:5px 7px;font-size:8px}
  .menu-console{padding:13px;border-radius:2px 16px 2px 16px;box-shadow:0 18px 45px rgba(0,0,0,.56),-4px 4px #050c08}
  .menu-console-head{font-size:10px;margin-bottom:10px}.menu-action{min-height:58px;padding:10px 56px 10px 56px;font-size:16px}
  .menu-action::before{width:43px;font-size:17px}.menu-action::after{left:57px;bottom:7px;font-size:8px}
  .menu-secondary-actions{grid-template-columns:repeat(3,1fr);gap:5px}.menu-secondary-actions .btn{font-size:9px;padding:7px 3px}
  #form-panel{padding:9px}.form-title{font-size:10px;text-align:left;margin-bottom:6px;letter-spacing:1.2px}
  .form-row{font-size:10px;padding:2px 0}.form-row .kit{width:14px;height:14px}.form-not{font-size:9px}
  #form-panel #form-share{font-size:8px!important}.menu-player{display:none}.menu-kick-ball{display:none}
  .menu-ticker{height:26px;font-size:9px;line-height:24px}.menu-world::before{top:5%;height:31%}
}

@media (prefers-reduced-motion:reduce){
  .logo>b,.logo-ball,.menu-player,.menu-kick-ball,.menu-console-head b,.menu-ticker div{animation:none!important}
}

/* gol klibi (GIF) */
#clip-box{margin-top:16px;display:flex;flex-direction:column;align-items:center;gap:8px}
.clip-img{max-width:min(300px,72vw);border-radius:12px;border:2px solid #2f6b3d;
  box-shadow:0 8px 26px rgba(0,0,0,.45)}
.clip-hint{font-size:12px;opacity:.7;text-align:center;max-width:300px}

/* turnuva seçimi */
#comp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
  gap:12px;width:100%;max-width:720px;padding-bottom:20px}
.compcard{display:flex;flex-direction:column;align-items:center;gap:6px;padding:18px 12px;
  background:#14291b;border:2px solid #245030;border-radius:14px;color:#eef5ef;
  cursor:pointer;transition:border-color .12s,transform .12s}
.compcard:hover,.compcard:active{border-color:#5ad672;transform:translateY(-2px)}
.compcard.kapali{opacity:.4;cursor:default}
.comp-ikon{font-size:30px}
.compcard b{font-size:17px}
.compcard span{font-size:12px;opacity:.72;text-align:center;line-height:1.4}
.comp-not{color:#ffd54d;font-weight:700}

/* grup tabloları */
.groupbox{background:#14291b;border:1px solid #245030;border-radius:12px;
  padding:10px 12px;margin:8px 0;width:100%;max-width:520px}
.groupbox.mine{border-color:#5ad672;background:#183a22}
.group-title{font-size:12px;font-weight:900;letter-spacing:2px;color:#7ee08a;margin-bottom:6px}
.gtable{width:100%;border-collapse:collapse;font-size:13px}
.gtable th{font-size:10px;opacity:.55;font-weight:600;text-align:center;padding:0 4px}
.gtable td{padding:3px 4px;text-align:center;font-variant-numeric:tabular-nums}
.gtable td.gt-n{text-align:left;display:flex;align-items:center;gap:6px}
.gtable .kit{width:15px;height:15px}
.gtable tr.adv td{color:#dff3e3}
.gtable tr.adv td.gt-n{border-left:3px solid #5ad672;padding-left:5px}
.gtable tr.me td{font-weight:800;color:#fff}
.gfix{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px;font-size:11px;opacity:.72}
.gfix span{background:#0c1810;border-radius:5px;padding:2px 7px}
.gfix span.bm{background:#2f6b3d;opacity:1;font-weight:700}
.champ-line{margin-top:12px;font-size:17px;text-align:center;color:#ffd54d}
.twc{font-size:11px;opacity:.66;letter-spacing:.3px}

/* kadro ekranı */
#squad-list{width:100%;max-width:640px}
.sqrow{display:grid;grid-template-columns:38px 1fr repeat(5,minmax(58px,72px));
  align-items:center;gap:6px;padding:7px 10px;margin:4px 0;font-size:12px;
  background:#14291b;border:1px solid #245030;border-radius:10px}
.sq-pos{font-weight:900;color:#7ee08a;font-size:11px}
.sq-name{font-weight:700;font-size:13px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sq-at{font-size:9px;opacity:.75;letter-spacing:.5px;text-align:center}
.bar{display:block;height:5px;background:#0c1810;border-radius:3px;overflow:hidden;margin-top:3px}
.bar i{display:block;height:100%;border-radius:3px}
.squad-note{max-width:620px;margin:-8px 0 14px;color:#8ca293;font-size:12px;line-height:1.5;text-align:center}
.squad-section{margin:14px 0 6px;padding:6px 10px;color:#78dc89;background:#0d1c12;border-left:3px solid #5ad672;
  font:900 11px ui-monospace,monospace;letter-spacing:1.6px}
.sqpick{width:100%;color:#eaf2eb;text-align:left;cursor:pointer}.sqpick:hover{border-color:#5ad672}
.sqpick.selected{border-color:#ffd54d;background:#2d2a18;box-shadow:0 0 0 2px rgba(255,213,77,.12)}
.sqpick.compatible{border-color:#5ad672;background:#173921}.sqpick.incompatible{opacity:.35;cursor:not-allowed}
.sq-energy{text-align:center;font-variant-numeric:tabular-nums}.sq-energy b{display:block;color:#5ad672;font-size:15px}
.sq-energy small{font-size:8px;opacity:.55}
#match-squad-meta{display:flex;gap:18px;align-items:center;margin-bottom:14px;padding:10px 15px;border-radius:10px;
  background:#14291b;color:#afc5b3;font-size:12px}#match-squad-meta b{font-size:18px;color:#7ee08a}
#match-squad-meta strong{color:#ffd54d;font-size:16px}
#match-squad-list{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:100%;max-width:780px}
.match-squad-col{min-width:0;padding:10px;background:#0d1c12;border:1px solid #23432c;border-radius:12px}
.match-squad-col h3{margin:2px 3px 9px;color:#78937e;font:900 10px ui-monospace,monospace;letter-spacing:1.5px}
.energy-player{display:grid;grid-template-columns:32px 1fr 90px 32px;align-items:center;gap:7px;width:100%;
  min-height:42px;margin:5px 0;padding:7px;color:#e9f2ea;background:#14291b;border:1px solid #294c32;border-radius:8px;cursor:pointer;text-align:left}
.energy-player:hover{border-color:#5ad672}.energy-player.selected{border-color:#ffd54d;background:#312d18}
.energy-player.incompatible{opacity:.35;cursor:not-allowed}.energy-player b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}
.ep-pos{color:#7ddf8e;font:900 9px ui-monospace,monospace}.ep-energy{height:7px;overflow:hidden;border-radius:5px;background:#071009}
.ep-energy i{display:block;height:100%}.energy-player strong{font-size:11px;text-align:right;font-variant-numeric:tabular-nums}
#match-sub-status{min-height:20px;margin-top:12px;color:#ffd54d;font-size:12px;text-align:center}
@media (max-width:640px){
  .sqrow{grid-template-columns:32px 1fr repeat(5,1fr);gap:4px;padding:6px}
  .sq-name{font-size:12px}
  #match-squad-list{grid-template-columns:1fr}.energy-player{grid-template-columns:28px 1fr 72px 28px}
}
#btn-sprint{right:22px;bottom:186px;width:62px;height:62px;font-size:13px;
  background:radial-gradient(circle at 35% 28%,#8fd6ff,#2461ad 72%);
  box-shadow:0 8px 24px rgba(0,0,0,.4),inset 0 2px rgba(255,255,255,.24),0 0 22px rgba(80,160,255,.25)}

/* kupa dolabı */
#cabinet-stats{width:100%;max-width:560px;margin-bottom:14px}
.cab-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.cab-k{background:#14291b;border:1px solid #245030;border-radius:12px;padding:12px 6px;text-align:center}
.cab-k b{display:block;font-size:22px;color:#7ee08a;font-variant-numeric:tabular-nums}
.cab-k span{font-size:11px;opacity:.66}
.cab-fav{margin-top:10px;font-size:13px;opacity:.85;display:flex;align-items:center;
  gap:6px;justify-content:center;flex-wrap:wrap}
#cabinet-list{width:100%;max-width:560px}
.cab-row{display:flex;align-items:center;gap:10px;padding:11px 14px;margin:6px 0;
  background:linear-gradient(90deg,#1a3d24,#14291b);border:1px solid #2f6b3d;border-radius:12px}
.cab-ikon{font-size:22px}
.cab-ad{font-weight:800;flex:1}
.cab-adet{color:#ffd54d;font-weight:900}
.cab-takim{font-size:11px;opacity:.6;max-width:40%;text-align:right}
.cab-bos{text-align:center;opacity:.6;font-size:14px;padding:24px}

/* ---------- v1.11 sade ana menü ---------- */
#scr-menu{padding:24px;overflow-y:auto;justify-content:center;align-items:center;
  background:#09120d;isolation:isolate}
#scr-menu::before{inset:0;z-index:-2;background:
  radial-gradient(circle at 50% 42%,rgba(64,154,83,.16),transparent 36%),
  linear-gradient(180deg,#0d1b12,#08100b)}
#scr-menu::after{display:none}
.menu-field-mark{position:fixed;z-index:-1;left:50%;top:50%;width:min(82vh,82vw);aspect-ratio:1;
  transform:translate(-50%,-50%);border:1px solid rgba(150,215,160,.055);border-radius:50%;pointer-events:none}
.menu-field-mark::before{content:"";position:absolute;left:50%;top:-60vh;bottom:-60vh;border-left:1px solid rgba(150,215,160,.045)}
.menu-field-mark::after{content:"";position:absolute;left:50%;top:50%;width:8px;height:8px;transform:translate(-50%,-50%);
  border-radius:50%;background:rgba(150,215,160,.08)}
.menu-card{width:min(520px,100%);padding:32px 32px 22px;background:rgba(10,22,14,.94);
  border:1px solid #23422c;border-radius:20px;box-shadow:0 24px 80px rgba(0,0,0,.42)}
.menu-brand{text-align:center;padding:0 0 26px}.menu-kicker{font:800 10px/1 ui-monospace,monospace;
  color:#70d482;letter-spacing:2.6px}.menu-logo{margin-top:12px;font:1000 clamp(42px,9vw,68px)/.9 ui-monospace,monospace;
  letter-spacing:-6px;color:#f1f7ed}.menu-logo span{color:#62d878;margin-left:-6px}
.menu-brand p{margin-top:13px;color:#819b87;font-size:13px;letter-spacing:.2px}
.menu-card .menu-primary-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.menu-card .menu-action{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;width:100%;
  min-width:0;min-height:78px;margin:0;padding:15px 16px;text-align:left;color:#eef7ed;background:#12271a;
  border:1px solid #294d33;border-radius:12px;box-shadow:none;overflow:visible;transition:.14s ease}
.menu-card .menu-action::before,.menu-card .menu-action::after{display:none}
.menu-card .menu-action span{font-size:15px;font-weight:850}.menu-card .menu-action small{margin-top:7px;color:#819a86;
  font-size:10px;font-weight:650}.menu-card .menu-action:hover,.menu-card .menu-action:focus-visible{transform:translateY(-2px);
  color:#fff;border-color:#5ad672;background:#17331f;outline:none;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.menu-card .menu-action:active{transform:scale(.98)}
.menu-card .menu-action.online{border-color:#386544}.menu-card .menu-action b,.beta-badge{display:inline-block;
  padding:3px 5px;border-radius:4px;background:#5ad672;color:#09200e;font-size:8px;letter-spacing:1px;vertical-align:2px}
.menu-card .menu-secondary-actions{display:flex;justify-content:center;gap:5px;margin-top:14px}
.menu-card .menu-secondary-actions .btn{flex:1;min-width:0;min-height:34px;margin:0;padding:7px 5px;
  color:#849b89;background:transparent;border:0;border-radius:7px;font-size:10px;box-shadow:none}
.menu-card .menu-secondary-actions .btn:hover{color:#dce9de;background:#102219}
.menu-form{margin-top:13px;border-top:1px solid #1e3826;padding-top:11px;color:#78917e;font-size:11px}
.menu-form summary{cursor:pointer;text-align:center;list-style:none}.menu-form summary::-webkit-details-marker{display:none}
.menu-form summary::after{content:" +";color:#5ad672}.menu-form[open] summary::after{content:" −"}
.menu-card #form-panel{margin-top:10px;background:#0d1c12;border:1px solid #203b28;border-radius:10px;padding:10px}
.menu-card .form-title{font-size:10px}.menu-card .form-row{font-size:10px}.menu-card #form-panel #form-share{top:5px!important}
.menu-version{margin-top:16px;text-align:center;color:#49604f;font:700 9px ui-monospace,monospace;letter-spacing:1.4px}

/* Logonun altında tek, okunaklı bir aksiyon döngüsü: koşu → temas → ağ. Menü
   sakin kalır; oyun vaadi statik bir futbol topu yerine hareketle anlatılır. */
.menu-vignette{position:relative;width:184px;height:54px;margin:17px auto 0;overflow:hidden;
  border:1px solid #21402a;border-radius:8px;background:linear-gradient(165deg,#173a22,#0d2114);
  box-shadow:inset 0 0 0 2px rgba(5,14,8,.55);image-rendering:pixelated}
.menu-vignette i{position:absolute;display:block}.mv-line{left:0;right:0;bottom:10px;height:2px;background:#8cbd91;opacity:.58}
.mv-line::after{content:"";position:absolute;left:62px;bottom:0;width:34px;height:18px;border:2px solid rgba(164,211,168,.38);border-bottom:0}
.mv-goal{right:9px;bottom:10px;width:28px;height:30px;border-left:3px solid #edf6e9;border-top:3px solid #edf6e9;border-bottom:3px solid #edf6e9}
.mv-net{right:4px;bottom:12px;width:31px;height:25px;opacity:.32;background:
  repeating-linear-gradient(0deg,transparent 0 5px,#dcebdc 5px 6px),
  repeating-linear-gradient(90deg,transparent 0 6px,#dcebdc 6px 7px);transform:skewY(-9deg)}
.mv-striker{left:28px;bottom:13px;width:9px;height:15px;border-radius:3px 3px 2px 2px;background:#ec5645;
  border:2px solid #061009;animation:mv-striker 3.2s steps(6,end) infinite}
.mv-striker::before{content:"";position:absolute;left:1px;top:-7px;width:5px;height:5px;border:2px solid #061009;border-radius:50%;background:#c88d68}
.mv-striker::after{content:"";position:absolute;left:4px;top:10px;width:14px;height:3px;background:#e9eee6;border:2px solid #061009;transform-origin:left;transform:rotate(-18deg)}
.mv-striker b{position:absolute;left:-5px;top:4px;width:14px;height:3px;background:#c88d68;border:2px solid #061009;transform:rotate(22deg)}
.mv-ball{left:51px;bottom:12px;width:7px;height:7px;border:2px solid #07110a;border-radius:50%;background:#f4f8ee;
  box-shadow:0 0 7px rgba(255,232,91,.35);animation:mv-ball 3.2s cubic-bezier(.2,.72,.36,1) infinite}
.mv-keeper{right:19px;bottom:15px;width:8px;height:17px;background:#f4c542;border:2px solid #061009;
  transform-origin:50% 100%;animation:mv-keeper 3.2s steps(4,end) infinite}
.mv-impact{right:8px;top:13px;width:4px;height:4px;background:#ffe45c;opacity:0;
  box-shadow:-6px 1px #ffe45c,6px -2px #fff,-2px 7px #fff;animation:mv-impact 3.2s steps(2,end) infinite}
@keyframes mv-striker{0%,20%{transform:translateX(0)}35%{transform:translateX(13px)}42%,100%{transform:translateX(15px) rotate(-5deg)}}
@keyframes mv-ball{0%,35%{transform:translate(0,0) rotate(0)}58%{transform:translate(70px,-23px) rotate(360deg)}72%,100%{transform:translate(112px,-9px) rotate(720deg)}}
@keyframes mv-keeper{0%,44%{transform:rotate(0)}58%,100%{transform:translate(-10px,-3px) rotate(-66deg)}}
@keyframes mv-impact{0%,67%{opacity:0;transform:scale(.4)}70%,78%{opacity:1;transform:scale(1)}80%,100%{opacity:0}}

/* ---------- arkadaş davetli online beta ---------- */
#scr-online{padding:22px 14px;background:#08110b;touch-action:pan-y}
.online-shell{width:min(680px,100%);margin:auto;padding:24px;border:1px solid #27472f;border-radius:18px;
  background:#0d1d13;box-shadow:0 24px 70px rgba(0,0,0,.45)}
.online-head{display:flex;align-items:center;justify-content:space-between}.online-head>div{display:flex;align-items:center;gap:10px}
.online-head h2{margin:0;font-size:19px}.online-close{width:40px;height:40px;border:0;border-radius:10px;
  color:#8ca393;background:#14271a;font-size:26px;cursor:pointer}
.online-lead{margin:16px 0 12px;color:#9ab09f;font-size:13px;line-height:1.55}
.online-account{display:flex;align-items:center;gap:10px;padding:10px 12px;margin-bottom:11px;border:1px solid #294a31;
  border-radius:12px;background:#0b1a10}.online-avatar{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;
  color:#061108;background:#62df78;font:900 16px ui-monospace,monospace}.online-account>span:nth-child(2){min-width:0;flex:1}
.online-account b,.online-account small{display:block}.online-account b{font-size:13px}.online-account small{margin-top:3px;color:#7f9584;font-size:10px}
.online-google{min-width:180px;text-align:right;color:#718277;font-size:9px}.online-google:empty{min-width:0}
.online-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:12px;padding:4px;border-radius:10px;background:#08150d}
.online-tabs button,.online-board-tabs button{border:0;border-radius:7px;color:#718377;background:transparent;font:850 10px ui-monospace,monospace;letter-spacing:.6px}
.online-tabs button{min-height:34px}.online-tabs button.sel,.online-board-tabs button.sel{color:#071209;background:#5ad672}
.online-mode-panel[hidden]{display:none}.online-ranked-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;
  padding:15px;border:1px solid #2d5938;border-radius:13px;background:linear-gradient(135deg,#10291a,#0a1710)}
.online-ranked-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:11px;background:#173b22;font-size:21px}
.online-ranked-card b,.online-ranked-card small{display:block}.online-ranked-card b{font:900 14px ui-monospace,monospace;color:#e8f5eb}
.online-ranked-card small{margin-top:5px;color:#809287;font-size:10px}.online-ranked-card .btn{width:auto;min-height:38px;margin:0;padding:9px 15px;font-size:11px}
.online-ranked-card .btn:disabled{opacity:.42;cursor:not-allowed}.online-queue,.online-ready{align-items:center;gap:12px;margin-top:10px;padding:13px;
  border:1px solid #385f42;border-radius:11px;background:#0e2115}.online-queue:not([hidden]),.online-ready:not([hidden]){display:flex}
.online-queue i{width:22px;height:22px;border:3px solid #284d32;border-top-color:#6ee283;border-radius:50%;animation:online-spin .75s linear infinite}
.online-queue span{flex:1}.online-queue b,.online-queue small{display:block}.online-queue b{font-size:12px}.online-queue small{margin-top:3px;color:#7f9184;font-size:9px}
.online-queue .btn,.online-ready .btn{width:auto;min-height:34px;margin:0;padding:8px 13px;font-size:10px}.online-ready{flex-wrap:wrap}.online-ready>b{color:#77e68b}
.online-ready #online-share-result{color:#ffd85a;border-color:#665728}
.online-ready>span{flex:1;color:#9aada0;font-size:11px}.online-board-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:9px}
.online-board-tabs button{min-height:31px;border:1px solid #294732}.online-board-tabs button.sel{border-color:#5ad672}
#online-board-meta{padding:7px 9px;color:#8fa293;font-size:10px;text-align:center}.season-memory{margin-bottom:8px;padding:8px 10px;
  border:1px solid #294633;border-radius:8px;color:#91a797;background:#0a1710;font:750 9px/1.45 ui-monospace,monospace;text-align:center}
.online-board-list{min-height:240px;border:1px solid #263e2c;border-radius:10px;overflow:hidden}
.online-board-list p{padding:25px;color:#77877c;text-align:center}.board-row{display:grid;grid-template-columns:34px 1fr auto;gap:8px;align-items:center;
  min-height:38px;padding:5px 11px;border-bottom:1px solid rgba(255,255,255,.045);font-size:11px}.board-row:last-child{border-bottom:0}
.board-row.me{background:rgba(90,214,114,.1)}.board-rank{color:#7d9082;font:900 11px ui-monospace,monospace}.board-score{color:#ffd85a;font:900 11px ui-monospace,monospace}
.board-section{padding:7px 11px;color:#68d77c;background:#09160e;border-bottom:1px solid #233d2a;
  font:900 9px ui-monospace,monospace;letter-spacing:1.4px}.board-gap{height:6px;background:#071009;border-bottom:1px solid #263e2c}
@keyframes online-spin{to{transform:rotate(360deg)}}
.online-status{margin-bottom:14px;padding:9px 12px;border-radius:9px;background:#10271a;color:#70da82;
  font:750 11px ui-monospace,monospace;letter-spacing:.5px}
.online-status.bad{color:#ff9688;background:#2c1715}.online-status.good{color:#8bf29c}
.online-role-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.online-role{min-height:106px;padding:18px;
  text-align:left;color:#eaf2eb;background:#12271a;border:1px solid #2b5035;border-radius:12px;cursor:pointer}
.online-role-grid[hidden]{display:none}
.online-role:hover{border-color:#5ad672}.online-role b,.online-role span{display:block}.online-role b{font-size:16px}
.online-role span{margin-top:9px;color:#8fa294;font-size:11px;line-height:1.45}
.online-panel{display:flex;flex-direction:column;gap:9px}.online-panel[hidden]{display:none}.online-panel label{margin-top:5px;
  color:#a9bbad;font-size:11px;font-weight:750}.online-panel textarea{width:100%;height:76px;resize:vertical;padding:10px;
  color:#b9d6bf;background:#071009;border:1px solid #294a31;border-radius:9px;font:10px/1.4 ui-monospace,monospace;
  user-select:text;-webkit-user-select:text;touch-action:pan-y}.online-panel .btn{width:100%;min-height:42px;margin:0;padding:10px;font-size:13px}
.online-copy{color:#b8d9be!important}
.online-note{margin-top:15px;color:#637568;font-size:10px;line-height:1.5;text-align:center}
#online-guest-stage{position:relative;overflow:hidden;border:1px solid #315b3a;border-radius:12px;background:#030704;aspect-ratio:16/9}
#online-guest-stage[hidden]{display:none}#online-video{display:block;width:100%;height:100%;object-fit:contain;background:#020302}
.online-score{position:absolute;left:50%;top:9px;transform:translateX(-50%);display:flex;gap:12px;padding:6px 11px;
  border-radius:6px;background:rgba(5,14,8,.86);font:800 11px ui-monospace,monospace}.online-score b{color:#74da84}
.online-score em{color:#ffd54d;font-style:normal}
#online-guest-banner{position:absolute;left:10%;right:10%;top:38%;text-align:center;color:#fff;
  font:900 clamp(20px,5vw,38px) ui-monospace,monospace;text-shadow:3px 3px #183c22}
.online-touch{display:none;position:absolute;inset:auto 0 8px;justify-content:space-between;padding:0 10px}
.online-dpad{display:grid;grid-template-columns:repeat(3,38px);grid-template-rows:repeat(2,38px)}
.online-dpad button,.online-buttons button{border:1px solid rgba(255,255,255,.35);color:#fff;background:rgba(8,25,13,.72);font-weight:850}
.online-dpad [data-dir="up"]{grid-column:2}.online-dpad [data-dir="left"]{grid-column:1}.online-dpad [data-dir="down"]{grid-column:2}.online-dpad [data-dir="right"]{grid-column:3}
.online-buttons{display:flex;align-items:flex-end;gap:6px}.online-buttons button{width:44px;height:44px;border-radius:50%;font-size:9px}

@media (max-width:600px){
  #scr-menu{padding:12px;justify-content:flex-start}.menu-card{margin:auto;padding:25px 16px 18px;border-radius:16px}
  .menu-brand{padding-bottom:20px}.menu-logo{letter-spacing:-5px}.menu-card .menu-action{min-height:70px;padding:13px}
  .menu-card .menu-secondary-actions .btn{font-size:9px}.menu-form{margin-top:10px}
  .online-shell{padding:17px}.online-role-grid{grid-template-columns:1fr}.online-touch{display:flex}
  .online-account{align-items:flex-start;flex-wrap:wrap}.online-google{width:100%;min-width:0;text-align:left}
  .online-ranked-card{grid-template-columns:auto 1fr}.online-ranked-card .btn{grid-column:1/-1;width:100%}
  #online-guest-stage{aspect-ratio:9/14}.online-note{font-size:9px}
}
@media (max-width:380px){.menu-card .menu-primary-actions{grid-template-columns:1fr}.menu-card .menu-action{min-height:58px}}

@media (prefers-reduced-motion:reduce){
  .menu-vignette i{animation:none!important}.mv-impact{display:none}.mv-ball{transform:translate(70px,-12px)}
}

/* ---------- kulüp, kadro ve turnuva görsel sistemi ---------- */
.screen-lead{max-width:680px;margin:-9px auto 18px;color:#809587;font-size:12px;line-height:1.5;text-align:center}

/* Prosedürel arma: takım renklerinden üretilir, harici/telifli logo kullanmaz. */
.club-crest{position:relative;display:inline-grid;place-items:center;width:42px;height:50px;flex:none;
  clip-path:polygon(50% 0,93% 15%,88% 70%,50% 100%,12% 70%,7% 15%);background:#071009;
  filter:drop-shadow(0 4px 2px rgba(0,0,0,.38));isolation:isolate}
.club-crest::before{content:"";position:absolute;inset:3px;z-index:-2;clip-path:inherit;background:var(--club1)}
.club-crest i{position:absolute;inset:6px;z-index:-1;clip-path:inherit;background:linear-gradient(135deg,var(--club1) 0 48%,var(--club2) 49% 100%)}
.club-crest.crest-stripes i{background:repeating-linear-gradient(90deg,var(--club1) 0 5px,var(--club2) 5px 9px)}
.club-crest.crest-half i{background:linear-gradient(90deg,var(--club1) 0 50%,var(--club2) 50%)}
.club-crest.crest-band i{background:linear-gradient(90deg,var(--club1) 0 31%,var(--club2) 32% 67%,var(--club1) 68%)}
.club-crest.crest-sleeves i{background:linear-gradient(135deg,var(--club2) 0 22%,var(--club1) 23% 77%,var(--club2) 78%)}
.club-crest>b{position:relative;color:#fff;font:1000 11px ui-monospace,monospace;letter-spacing:.4px;text-shadow:1px 1px 0 #061009,-1px -1px 0 #061009}
.club-crest>small{position:absolute;bottom:8px;color:rgba(255,255,255,.8);font:800 5px ui-monospace,monospace;letter-spacing:1px}
.club-crest.large{width:62px;height:72px}.club-crest.large>b{font-size:16px}.club-crest.large>small{bottom:11px;font-size:6px}
.club-crest.tiny{width:30px;height:35px}.club-crest.tiny>b{font-size:8px}.club-crest.tiny>small{bottom:5px;font-size:4px}
.club-crest.micro{width:19px;height:22px;filter:none}.club-crest.micro::before{inset:2px}.club-crest.micro i{inset:4px}.club-crest.micro>b{font-size:5px}.club-crest.micro>small{display:none}

/* Takım seçimi: kimlik + üç oyun ekseni + öne çıkan oyuncu. */
#team-grid{grid-template-columns:repeat(auto-fill,minmax(245px,1fr));max-width:1080px;gap:13px}
.teamcard{position:relative;display:flex;align-items:stretch;gap:12px;min-height:220px;padding:17px;
  overflow:hidden;text-align:left;background:linear-gradient(155deg,rgba(25,50,32,.98),rgba(10,24,15,.98));
  border:1px solid #31583a;border-radius:13px;box-shadow:0 10px 28px rgba(0,0,0,.24);transition:.16s ease}
.teamcard::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--club1),var(--club2))}
.teamcard::after{content:"";position:absolute;right:-44px;top:-48px;width:150px;height:150px;border:24px solid var(--club1);border-radius:50%;opacity:.055}
.teamcard:hover,.teamcard:focus-visible{border-color:var(--club2);transform:translateY(-3px);outline:none;
  box-shadow:0 15px 34px rgba(0,0,0,.34),0 0 0 2px color-mix(in srgb,var(--club1) 34%,transparent)}
.team-card-head{position:relative;z-index:1;display:grid;grid-template-columns:62px 1fr 42px;align-items:center;gap:11px}
.team-identity{min-width:0}.team-identity>small{display:block;color:#799081;font:800 8px ui-monospace,monospace;letter-spacing:1.2px}
.team-identity>b{display:-webkit-box;min-height:32px;margin:4px 0 5px;overflow:hidden;color:#f1f7f0;font-size:15px;line-height:1.05;
  -webkit-box-orient:vertical;-webkit-line-clamp:2}
.team-identity .tstars{font-size:10px}.team-ovr{display:grid;place-items:center;width:42px;height:46px;border:1px solid #42654a;border-radius:7px;
  color:#e9f5e8;background:#0b1a10;font:1000 18px ui-monospace,monospace}.team-ovr small{display:block;margin-top:-7px;color:#6f8575;font-size:6px;letter-spacing:1px}
.team-metrics{position:relative;z-index:1;display:grid;gap:6px;padding:10px 0;border-top:1px solid rgba(255,255,255,.055);border-bottom:1px solid rgba(255,255,255,.055)}
.team-metric{display:grid;grid-template-columns:28px 1fr 25px;align-items:center;gap:7px}.team-metric small{color:#7f9585;font:850 8px ui-monospace,monospace}
.team-metric>i{height:5px;overflow:hidden;background:#061009;border-radius:1px}.team-metric>i b{display:block;height:100%}.team-metric strong{color:#c9d9cd;font:900 9px ui-monospace,monospace;text-align:right}
.team-card-foot{position:relative;z-index:1;display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 8px;color:#829887;font:750 8px ui-monospace,monospace}
.team-card-foot span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.team-card-foot em{grid-column:2;grid-row:1/3;display:grid;place-items:center;min-width:29px;height:29px;border-radius:50%;font-style:normal;font-weight:1000}
.team-card-foot em.up{color:#80eb94;background:#153920}.team-card-foot em.down{color:#ff9b8e;background:#351b18}

/* Pixel oyuncu portresi; saç/ten/forma değerleri kadro verisinden gelir. */
.player-avatar{position:relative;width:34px;height:40px;flex:none;filter:drop-shadow(2px 3px 1px rgba(0,0,0,.34))}
.player-avatar::before{content:"";position:absolute;left:8px;top:2px;width:18px;height:17px;border:2px solid #071009;border-radius:45% 45% 40% 40%;background:var(--skin)}
.player-avatar::after{content:"";position:absolute;left:6px;bottom:0;width:22px;height:22px;border:2px solid #071009;border-radius:8px 8px 3px 3px;background:linear-gradient(90deg,var(--shirt) 0 48%,var(--shirt2) 49% 55%,var(--shirt) 56%)}
.player-avatar i{position:absolute;z-index:2;left:9px;top:0;width:16px;height:8px;border-radius:50% 50% 20% 20%;background:var(--hair)}
.player-avatar b{position:absolute;z-index:3;left:15px;top:11px;width:3px;height:2px;background:#20140d;box-shadow:7px 0 #20140d}
.player-avatar.small{width:27px;height:32px;transform:scale(.78);transform-origin:center}.player-avatar.small::after{height:19px}

/* Kadro planı: kulüp başlığı + taktik haritası + oyuncu kartları. */
#squad-list{max-width:840px}.squad-club-header{position:relative;display:grid;grid-template-columns:62px 1fr 170px;align-items:center;gap:15px;
  min-height:126px;margin-bottom:12px;padding:17px 19px;overflow:hidden;border:1px solid #365c40;border-radius:14px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--club1) 22%,#102518),#0b1a10 62%);box-shadow:0 12px 30px rgba(0,0,0,.26)}
.squad-club-header::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,var(--club1),var(--club2))}
.squad-club-copy small,.squad-club-copy span{display:block;color:#829687;font-size:9px}.squad-club-copy small{font:850 8px ui-monospace,monospace;letter-spacing:1.3px}
.squad-club-copy>b{display:block;margin:5px 0 7px;color:#f1f8f0;font-size:21px}.squad-club-copy strong{color:#ffe05a;font-size:13px}
.lineup-board{position:relative;width:164px;height:92px;border:1px solid rgba(220,244,221,.42);border-radius:5px;background:
  linear-gradient(90deg,transparent 49.5%,rgba(255,255,255,.28) 50%,transparent 50.5%),repeating-linear-gradient(90deg,#1d6132 0 20%,#215f34 20% 40%)}
.lineup-board::before{content:"";position:absolute;left:50%;top:50%;width:28px;height:28px;border:1px solid rgba(255,255,255,.28);border-radius:50%;transform:translate(-50%,-50%)}
.lineup-board>b{position:absolute;z-index:3;left:5px;top:4px;color:rgba(255,255,255,.7);font:900 7px ui-monospace,monospace}
.lineup-board>i{position:absolute;display:grid;place-items:center;width:13px;height:13px;border:1px solid #061009;border-radius:50%;transform:translate(-50%,-50%);
  color:#071009;background:#77df88;font:1000 6px ui-monospace,monospace;font-style:normal;box-shadow:0 1px 2px rgba(0,0,0,.45)}
.lineup-board>i.pos-gk{background:#ffd54d}.lineup-board>i.pos-def{background:#76d893}.lineup-board>i.pos-mid{background:#68b9ee}.lineup-board>i.pos-att{background:#ef7a62}
.squad-section{display:flex;align-items:center;justify-content:space-between;border-left:0;border-bottom:1px solid #2d5136;background:transparent;padding:8px 3px;margin-top:17px}
.squad-section span{color:#7ee08a}.squad-section small{color:#667a6b;font-size:8px;letter-spacing:.4px}
.sqrow{position:relative;grid-template-columns:34px 38px minmax(145px,1fr) minmax(220px,1.4fr) 44px;min-height:60px;padding:8px 11px;gap:8px;
  background:linear-gradient(100deg,#14291b,#102219);border:1px solid #294c32;border-left:3px solid #4b8160;border-radius:8px}
.sqrow.pos-gk{border-left-color:#e5c343}.sqrow.pos-att{border-left-color:#e46c56}.sqrow.pos-mid{border-left-color:#5aa8d6}.sqrow.pos-def{border-left-color:#5ad672}
.sq-shirt{display:grid;place-items:center;width:29px;height:34px;clip-path:polygon(12% 0,88% 0,100% 35%,82% 48%,82% 100%,18% 100%,18% 48%,0 35%);
  color:#071009;background:#d9ead9;font:1000 10px ui-monospace,monospace}.sq-player-copy{min-width:0}.sq-player-copy small{display:block;color:#74d988;font:850 8px ui-monospace,monospace;letter-spacing:.8px}
.sq-player-copy>b{display:block;margin-top:4px;overflow:hidden;color:#edf4ed;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.sq-player-copy em{padding:2px 4px;border-radius:3px;color:#2a2107;background:#ffe05a;font:900 6px ui-monospace,monospace;font-style:normal}
.sq-traits{display:flex;gap:4px;margin-top:5px}.sq-traits i{padding:2px 4px;border:1px solid rgba(108,188,128,.26);border-radius:3px;
  color:#9fd9aa;background:#10271a;font:850 6px ui-monospace,monospace;font-style:normal;letter-spacing:.3px}
.sq-attributes{display:grid;grid-template-columns:1fr 1fr;gap:5px 9px}.sq-attributes>span{display:grid;grid-template-columns:25px 1fr;align-items:center;gap:5px;color:#75887a;font:800 7px ui-monospace,monospace}
.sq-attributes .bar{height:4px;margin:0}.sq-rating{display:grid;place-items:center;width:42px;height:43px;border:1px solid #3b6244;border-radius:7px;background:#0a1810}
.sq-rating b{color:#f2f7f0;font:1000 17px ui-monospace,monospace}.sq-rating small{margin-top:-8px;color:#708276;font:800 6px ui-monospace,monospace}
.sqpick.selected{border-color:#ffe05a;border-left-color:#ffe05a;background:linear-gradient(100deg,#342f18,#1d2418)}

/* Maç içi kadro: yorgunluk bir bakışta, öneri yalnız bilgi amaçlıdır. */
#match-squad-meta{min-height:58px;padding:8px 13px;border:1px solid #345a3e;background:linear-gradient(110deg,#14291b,#0c1d12)}
#match-squad-meta>em{margin-left:auto;padding:6px 8px;border-radius:5px;color:#9be3a7;background:#16331e;font:850 8px ui-monospace,monospace;font-style:normal;letter-spacing:.5px}
.match-squad-col h3{display:flex;justify-content:space-between;align-items:center}.match-squad-col h3 span{color:#83df91}.match-squad-col h3 small{color:#65786a;font-size:7px}
.energy-player{grid-template-columns:30px minmax(110px,1fr) 86px 38px;min-height:49px;border-left:3px solid #5ad672}
.energy-player.pos-gk{border-left-color:#e5c343}.energy-player.pos-mid{border-left-color:#5aa8d6}.energy-player.pos-att{border-left-color:#e46c56}
.energy-player.exhausted{background:#2c1b17;border-color:#bd5649}.ep-copy{min-width:0}.ep-copy small{display:block;color:#78907e;font:800 7px ui-monospace,monospace}
.ep-copy b{display:block;margin-top:3px}.energy-player>strong small{display:block;color:#728276;font-size:6px}.energy-player.selected{box-shadow:inset 0 0 0 1px #ffe05a}

/* Turnuva seçimi ve ilerleme yolu. */
#comp-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));max-width:980px;gap:14px}
.compcard{position:relative;display:grid;grid-template-columns:78px 1fr;align-items:center;gap:14px;min-height:218px;padding:18px;overflow:hidden;
  text-align:left;background:linear-gradient(145deg,#142a1b,#0a1a10);border:1px solid #31563a;border-top:3px solid var(--comp-accent);border-radius:13px;box-shadow:0 12px 30px rgba(0,0,0,.25)}
.compcard::after{content:"";position:absolute;right:-42px;top:-42px;width:150px;height:150px;border:25px solid var(--comp-accent);border-radius:50%;opacity:.045}
.compcard:hover,.compcard:focus-visible{border-color:var(--comp-accent);transform:translateY(-3px);outline:none;box-shadow:0 16px 36px rgba(0,0,0,.34)}
.compcard .comp-visual,.compcard .comp-copy,.compcard .comp-route{opacity:1}
.comp-visual{position:relative;display:grid;place-items:center;width:74px;height:90px;border:1px solid color-mix(in srgb,var(--comp-accent) 48%,#27432f);border-radius:10px;
  background:linear-gradient(160deg,color-mix(in srgb,var(--comp-accent) 16%,#13261a),#09170e)}
.comp-visual>i{font-size:31px;font-style:normal;filter:drop-shadow(0 5px 3px rgba(0,0,0,.4))}.comp-visual>b{color:#fff;font:1000 17px ui-monospace,monospace}.comp-visual>small{margin-top:-7px;color:#75897b;font:800 6px ui-monospace,monospace;letter-spacing:1px}
.comp-copy{min-width:0}.comp-copy>small{display:block;color:var(--comp-accent);font:900 8px ui-monospace,monospace;letter-spacing:1.4px}.comp-copy>b{display:block;margin:5px 0;color:#eff7ef;font-size:19px}.comp-copy>span{display:block;color:#829487;font-size:10px;line-height:1.45}
.comp-route{grid-column:1/-1;display:flex;align-items:flex-start;justify-content:space-between;gap:2px;padding-top:11px;border-top:1px solid rgba(255,255,255,.06)}
.comp-route>i{position:relative;display:grid;justify-items:center;flex:1;font-style:normal}.comp-route>i:not(:last-child)::after{content:"";position:absolute;left:58%;right:-42%;top:8px;height:1px;background:#36533d}
.comp-route b{position:relative;z-index:1;display:grid;place-items:center;width:17px;height:17px;border:1px solid var(--comp-accent);border-radius:50%;color:var(--comp-accent);background:#0b1a10;font:900 7px ui-monospace,monospace}
.comp-route small{margin-top:5px;color:#6e8173;font:750 6px ui-monospace,monospace;text-align:center}.compcard>em{grid-column:1/-1;color:var(--comp-accent);font:900 8px ui-monospace,monospace;font-style:normal;letter-spacing:1px;text-align:right}

#cup-progress{display:flex;align-items:flex-start;justify-content:center;width:min(880px,100%);margin:0 auto 17px;padding:12px 18px;border:1px solid #2c4b34;border-radius:10px;background:#0b1b11}
#cup-progress>span{position:relative;display:grid;justify-items:center;flex:1;min-width:0;color:#65766a}
#cup-progress>span:not(:last-child)::after{content:"";position:absolute;left:58%;right:-42%;top:12px;height:2px;background:#294532}
#cup-progress>span.done:not(:last-child)::after{background:#5ad672}#cup-progress>span.done{color:#5ad672}
#cup-progress i{position:relative;z-index:1;display:grid;place-items:center;width:25px;height:25px;border:2px solid #35543d;border-radius:50%;background:#0b1b11;font:900 8px ui-monospace,monospace;font-style:normal}
#cup-progress span.done i{border-color:#5ad672;color:#071009;background:#5ad672}#cup-progress span.active i{border-color:#ffe05a;color:#ffe05a;box-shadow:0 0 14px rgba(255,224,90,.28)}
#cup-progress b{margin-top:7px;overflow:hidden;font:850 7px ui-monospace,monospace;letter-spacing:.6px;text-overflow:ellipsis;white-space:nowrap}#cup-progress span.active b{color:#ffe05a}
#cup-list{max-width:880px}.cupmatch{position:relative;display:grid;grid-template-columns:1fr 98px 1fr;min-height:76px;padding:12px 16px;margin:8px 0;
  background:linear-gradient(100deg,#14291b,#0d1d13);border:1px solid #2b4e34;border-radius:10px}.cupmatch.mine{border-color:#5ad672;background:linear-gradient(100deg,#183a22,#10281a)}
.cm-t{gap:9px}.cm-t>span:not(.club-crest){min-width:0}.cm-t small,.cm-t b{display:block}.cm-t small{color:#718376;font:800 7px ui-monospace,monospace}.cm-t b{margin-top:3px;overflow:hidden;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.cm-t.winner b{color:#8cf09c}.cm-t.winner::after{content:"✓";color:#5ad672;font-weight:1000}
.cm-score{display:grid;place-items:center;padding:5px;border-left:1px solid rgba(255,255,255,.06);border-right:1px solid rgba(255,255,255,.06)}.cm-score small{color:#697b6e;font:800 6px ui-monospace,monospace;letter-spacing:1px}.cm-score b{color:#fff;font:1000 18px ui-monospace,monospace}
.mine-ribbon{position:absolute;left:12px;top:-7px;padding:3px 6px;border-radius:3px;color:#071009;background:#5ad672;font:900 6px ui-monospace,monospace;font-style:normal;letter-spacing:.8px}
.groupbox{max-width:760px;padding:13px 15px}.gtable .club-crest{vertical-align:middle}.gtable td{padding:5px}.gtable tr.me{background:rgba(90,214,114,.09)}
.champion-hero{position:relative;display:grid;justify-items:center;min-height:250px;margin:18px auto;padding:25px;overflow:hidden;border:1px solid #6f632b;border-radius:14px;
  background:radial-gradient(circle at 50% 36%,rgba(255,224,90,.18),transparent 35%),linear-gradient(150deg,#252311,#0c1c11 62%);box-shadow:0 18px 42px rgba(0,0,0,.36)}
.champion-rays{position:absolute;inset:-80%;opacity:.1;background:repeating-conic-gradient(from 0deg,#ffe05a 0 8deg,transparent 8deg 18deg);animation:champion-spin 18s linear infinite}.champion-cup{position:relative;font-size:45px;filter:drop-shadow(0 8px 6px rgba(0,0,0,.4))}.champion-hero .club-crest{position:relative;margin:8px}.champion-hero>small{position:relative;color:#a99a53;font:900 8px ui-monospace,monospace;letter-spacing:2px}.champion-hero>b{position:relative;margin-top:5px;color:#fff;font-size:23px}.champion-hero>em{position:relative;margin-top:6px;color:#ffe05a;font:1000 12px ui-monospace,monospace;font-style:normal;letter-spacing:3px}
@keyframes champion-spin{to{transform:rotate(360deg)}}
#cup-history{width:min(880px,100%)}.cup-h-round{display:grid;grid-template-columns:90px 1fr;gap:8px;margin:7px 0;padding:8px 10px;border-left:2px solid #33573c;background:#0b1a10;opacity:1}
.cup-h-round>b{color:#78907e;font:850 8px ui-monospace,monospace}.cup-h-round>span{display:flex;flex-wrap:wrap;gap:5px}.cup-h-round i{padding:3px 6px;border-radius:3px;color:#7e9082;background:#12271a;font:750 7px ui-monospace,monospace;font-style:normal}.cup-h-round strong{color:#eaf1e9}

@media (max-width:700px){
  #tactic-style{grid-template-columns:1fr}.sq-traits{margin-top:3px}.sq-traits i{padding:1px 3px}
  #team-grid{grid-template-columns:1fr;width:min(100%,470px)}.teamcard{min-height:210px}
  .squad-club-header{grid-template-columns:54px 1fr}.squad-club-header .lineup-board{grid-column:1/-1;width:100%;height:108px}
  .sqrow{grid-template-columns:29px 32px 1fr 40px}.sq-attributes{grid-column:2/5;grid-row:2}.sq-rating{grid-column:4;grid-row:1}.sq-shirt{width:25px}.sq-player-copy>b{font-size:11px}
  #comp-grid{grid-template-columns:1fr}.compcard{min-height:210px}
  .cupmatch{grid-template-columns:1fr 62px 1fr;padding:11px 8px}.cupmatch .club-crest{display:none}.cm-t b{font-size:9px}.cm-score b{font-size:14px}
  #cup-progress{padding:9px 5px}#cup-progress b{font-size:5px}.cup-h-round{grid-template-columns:1fr}
}

@media (prefers-reduced-motion:reduce){.champion-rays{animation:none!important}}
