:root{
      --bg:#0b1210;
      --panel:rgba(0,0,0,.55);
      --panel2:rgba(0,0,0,.35);
      --line:rgba(255,255,255,.12);
      --text:rgba(255,255,255,.86);
      --muted:rgba(255,255,255,.62);
      --accent:#9cff00;
      --accent2:#ffe500;
      --shadow:0 18px 50px rgba(0,0,0,.55);
      --radius:18px;
    }

    *{box-sizing:border-box}
    body{
      margin:0;
      font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;
      color:var(--text);
      background: radial-gradient(1200px 800px at 30% 25%, rgba(70,140,90,.35), transparent 55%),
                  radial-gradient(900px 700px at 80% 30%, rgba(90,140,210,.25), transparent 55%),
                  linear-gradient(180deg, #07110e, #050907);
      min-height:100vh;
      display:flex;
      align-items:center;
      justify-content:center;
      padding:24px;
    }

    .frame{
      width:min(1180px, 100%);
      aspect-ratio: 16 / 10;
      border-radius:28px;
      overflow:hidden;
      box-shadow: var(--shadow);
      position:relative;
      background:
        radial-gradient(1200px 700px at 50% 70%, rgba(0,0,0,.15), rgba(0,0,0,.85)),
        url('https://images.unsplash.com/photo-1522778526097-ce0a22ceb253?auto=format&fit=crop&w=1800&q=70');
      background-size:cover;
      background-position:center;
    }

    .topbar{
      position:absolute;
      left:0; right:0; top:0;
      display:flex;
      gap:14px;
      padding:14px 16px;
      align-items:center;
      background: linear-gradient(180deg, rgba(0,0,0,.65), rgba(0,0,0,0));
      z-index:5;
    }

    .topTitle{
      font-weight:1000;
      letter-spacing:-.2px;
      font-size:18px;
      padding:10px 12px;
      border-radius:999px;
      background:rgba(0,0,0,.45);
      border:1px solid var(--line);
      backdrop-filter: blur(10px);
    }

    .topExtras{
      display:flex;
      gap:14px;
      align-items:center;
      width:100%;
    }

    /* Küçük rozet/etiketler (üst bar) */
    .badge{
      display:flex;
      cursor: default;
      gap:10px;
      align-items:center;
      padding:10px 12px;
      border-radius:999px;
      background: rgba(0,0,0,.35);
      border:1px solid var(--line);
      backdrop-filter: blur(10px);
      color: rgba(255,255,255,.78);
      font-size:12px;
      white-space:nowrap;
    }
    .pill{
      display:inline-flex;
      align-items:center;
      padding:6px 10px;
      border-radius:999px;
      font-weight:1000;
      letter-spacing:.2px;
      background: rgba(255,255,255,.06);
      border:1px solid rgba(255,255,255,.12);
      color: rgba(255,255,255,.86);
    }

    .ribbon{
      position:absolute;
      left:16px;
      top:16px;
      z-index:6;
      padding:10px 12px;
      border-radius:14px;
      background: linear-gradient(90deg, rgba(156,255,0,.95), rgba(255,229,0,.95));
      color:#0b0b0b;
      font-weight:1000;
      letter-spacing:.3px;
      box-shadow: 0 14px 28px rgba(0,0,0,.35);
    }

    .brand{
      position:absolute;
      left:22px;
      top:92px;
      z-index:3;
      text-shadow: 0 18px 40px rgba(0,0,0,.55);
      pointer-events:none;
    }
    .brand .sf{
      font-weight:1100;
      letter-spacing:-1px;
      font-size:74px;
      line-height:1;
    }
    .brand .sf .a{ color: var(--accent2); }
    .brand .sf .b{ color: var(--accent); }

    /* Ana yerleşim */
    .grid{
      position:absolute;
      inset:0;
      display:grid;
      grid-template-columns: 1.2fr 0.8fr;
      gap:18px;
      padding: 110px 18px 18px;
    }
    .rightCol{ display:flex; flex-direction:column; gap:12px; }

    /* Panel (kart) stili */
    .panel{
      background: var(--panel);
      border:1px solid var(--line);
      border-radius: var(--radius);
      backdrop-filter: blur(10px);
      box-shadow: 0 10px 24px rgba(0,0,0,.35);
    }

    /* Overlay açık tema (Alt menü tıklamaları) */
    #overlay.light{
      background:#ffffff;
      border:1px solid rgba(0,0,0,.12);
      box-shadow: 0 18px 50px rgba(0,0,0,.15);
      backdrop-filter: none;
      color:#111;
    }
    #overlay.light #overlaySubtitle{ color: rgba(0,0,0,.62) !important; }
    #overlay.light #overlayBody{ color: rgba(0,0,0,.78) !important; }
    #overlay.light .btn{ background: rgba(0,0,0,.04); border-color: rgba(0,0,0,.12); color: rgba(0,0,0,.78); }
    #overlay.light .btn.primary{ background: linear-gradient(90deg, rgba(156,255,0,.95), rgba(255,229,0,.95)); border:none; color:#0b0b0b; }

    /* Gazete alt bar (yalnızca gazete modunda görünür) */
    .subbar{ display:none; }

    /* Gazete standalone mod */
    body.mode-news{
      background:#f4f6f9;
      padding:0;
      align-items:stretch;
      justify-content:stretch;
    }
    body.mode-news .frame{
      width:100%;
      min-height:100vh;
      aspect-ratio:auto;
      border-radius:0;
      box-shadow:none;
      background:#fff;
    }
    body.mode-news .brand,
    body.mode-news .ribbon,
    body.mode-news .rightCol,
    body.mode-news .login,
    body.mode-news .nav,
    body.mode-news .footerNote{
      display:none !important;
    }
    body.mode-news .grid{ display:none !important; }
    body.mode-news .topbar{
      position:sticky;
      top:0;
      padding:0;
      height:92px;
      display:flex;
      align-items:stretch;
      gap:0;
      background:
        linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.55)),
        radial-gradient(900px 220px at 35% 50%, rgba(255,229,0,.22), transparent 55%),
        radial-gradient(900px 220px at 70% 50%, rgba(156,255,0,.18), transparent 55%),
        linear-gradient(90deg, #111, #2a2f3a);
      border-bottom:1px solid rgba(0,0,0,.18);
    }

    body.mode-news .topTitle{
      display:flex;
      align-items:center;
      gap:10px;
      padding:0 16px;
      font-size:44px;
      font-weight:1000;
      letter-spacing:-1px;
      background:transparent;
      border:none;
      color:#fff;
      text-shadow: 0 10px 28px rgba(0,0,0,.45);
      backdrop-filter:none;
      line-height:1;
      white-space:nowrap;
    }
    body.mode-news .topTitle .a{ color: var(--accent2); }
    body.mode-news .topTitle .b{ color: var(--accent); }

    body.mode-news #topExtras{
      display:flex;
      align-items:center;
      justify-content:flex-end;
      gap:12px;
      padding:0 16px;
      width:100%;
    }

    body.mode-news .newsBtn{
      position:relative;
      width:78px;
      height:66px;
      border-radius:16px;
      border:1px solid rgba(255,255,255,.14);
      background: rgba(0,0,0,.28);
      color: rgba(255,255,255,.9);
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      gap:6px;
      font-weight:900;
      cursor:pointer;
      user-select:none;
      overflow:hidden;
      isolation:isolate;
    }
    
    body.mode-news .newsBtn > *{
      position:relative;
      z-index:1;
    }
body.mode-news .newsBtn small{ font-size:11px; font-weight:900; opacity:.9; }
    body.mode-news .newsBtn .ico{
      width:34px;
      height:34px;
      border-radius:12px;
      display:grid;
      place-items:center;
      border:1px solid rgba(255,255,255,.16);
      background: rgba(255,255,255,.06);
      font-size:16px;
    }
    body.mode-news .newsBtn.back{
      width:auto;
      padding:0 14px;
      flex-direction:row;
      gap:10px;
    }
    body.mode-news .newsBtn.back .ico{ width:32px; height:32px; }
    body.mode-news .newsBtn.back span{ font-size:13px; letter-spacing:.2px; }

    body.mode-news .newsBtn.active{
      background: rgba(255,255,255,.10);
      border-color: rgba(255,255,255,.22);
      box-shadow: 0 10px 20px rgba(0,0,0,.25);
    }
    body.mode-news .newsBtn.active:after{
      content:"";
      position:absolute;
      left:14px;
      right:14px;
      bottom:3px;
      height:3px;
      z-index:0;
      pointer-events:none;
      border-radius:999px;
      background: linear-gradient(90deg, rgba(156,255,0,.95), rgba(255,229,0,.95));
      opacity:.9;
    }

    /* Üst bar hızlı menü (Dünya'nın yanında) */
    body.mode-news .topTabs{
      display:flex;
      gap:10px;
      align-items:center;
      height:66px;
      max-width: 560px;
      overflow:auto;
      -webkit-overflow-scrolling: touch;
      padding:0 2px;
    }
    body.mode-news .topTabs::-webkit-scrollbar{ height:6px; }
    body.mode-news .topTabs::-webkit-scrollbar-thumb{
      background: rgba(255,255,255,.18);
      border-radius:999px;
    }
    body.mode-news .topTabs::-webkit-scrollbar-track{ background: transparent; }

    body.mode-news .topTab{
      position:relative;
      height:66px;
      padding:0 14px;
      border-radius:16px;
      border:1px solid rgba(255,255,255,.14);
      background: rgba(0,0,0,.28);
      color: rgba(255,255,255,.92);
      display:flex;
      align-items:center;
      justify-content:center;
      font-weight:1000;
      cursor:pointer;
      user-select:none;
      white-space:nowrap;
      flex: 0 0 auto;
    }
    body.mode-news .topTab:hover{
      background: rgba(255,255,255,.08);
      border-color: rgba(255,255,255,.18);
    }
    body.mode-news .topTab.active{
      background: rgba(255,255,255,.10);
      border-color: rgba(255,255,255,.22);
      box-shadow: 0 10px 20px rgba(0,0,0,.25);
    }
    body.mode-news .topTab.active:after{
      content:"";
      position:absolute;
      left:14px;
      right:14px;
      bottom:8px;
      height:4px;
      border-radius:999px;
      background: linear-gradient(90deg, rgba(156,255,0,.95), rgba(255,229,0,.95));
      opacity:.9;
      pointer-events:none;
    }


    /* Dünya (ülke/lig listesi) — referans görsele yakın (klasik) */
    .worldWrap{ display:grid; gap:14px; }

    .worldBlock{
      border:1px solid rgba(0,0,0,.12);
      background:#fff;
      border-radius:6px;
      overflow:hidden;
      box-shadow: 0 8px 18px rgba(15,23,42,.06);
    }

    .worldBar{
      background:#dfeedd; /* açık yeşil */
      padding:6px 10px;
      font-weight:900;
      color:#000;
      border-bottom:1px solid rgba(0,0,0,.08);
    }

    .worldBody{
      display:grid;
      grid-template-columns: 240px 1fr;
      gap:14px;
      padding:12px;
      align-items:start;
    }

    .flagImg{
      width:220px;
      height:120px;
      border:1px solid rgba(0,0,0,.18);
      border-radius:4px;
      background:#f3f4f6;
      background-size:cover;
      background-position:center;
      box-shadow: 0 6px 14px rgba(0,0,0,.08);
    }


    .flagImgImg{
      width:220px;
      height:120px;
      border:1px solid rgba(0,0,0,.18);
      border-radius:4px;
      background:#f3f4f6;
      object-fit:cover;
      box-shadow: 0 6px 14px rgba(0,0,0,.08);
      display:block;
    }
    .flagImgEmoji{
      width:220px;
      height:120px;
      border:1px solid rgba(0,0,0,.18);
      border-radius:4px;
      background:#f3f4f6;
      box-shadow: 0 6px 14px rgba(0,0,0,.08);
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:64px;
      line-height:1;
    }
    .flagMiniImg{
      width:22px;
      height:14px;
      border-radius:2px;
      object-fit:cover;
      display:inline-block;
      border:1px solid rgba(0,0,0,.22);
      vertical-align:middle;
      margin-right:0px;
    }
    .flagMiniEmoji{
      width:22px;
      height:14px;
      border-radius:2px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      font-size:12px;
      line-height:1;
      border:1px solid rgba(0,0,0,.22);
      vertical-align:middle;
      margin-right:0px;
    }

    /* Data-URI SVG bayraklar (dış link yok) */
    .flag-tr{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='600' viewBox='0 0 30 20'%3E%3Crect width='30' height='20' fill='%23e30a17'/%3E%3Ccircle cx='12' cy='10' r='5' fill='%23fff'/%3E%3Ccircle cx='13.2' cy='10' r='4' fill='%23e30a17'/%3E%3Cpolygon fill='%23fff' points='18.2,10 16.2,10.65 17.4,9.05 16.0,7.75 18.0,7.95 18.9,6.2 19.4,8.05 21.4,8.15 19.7,9.25 20.4,11.1'/%3E%3C/svg%3E"); }
    .flag-es{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%203%202%27%3E%0A%3Crect%20width%3D%273%27%20height%3D%272%27%20fill%3D%27%23c60b1e%27%2F%3E%0A%3Crect%20y%3D%270.5%27%20width%3D%273%27%20height%3D%271%27%20fill%3D%27%23ffc400%27%2F%3E%0A%3C%21--%20simplified%20coat%20of%20arms%20--%3E%0A%3Cg%20transform%3D%27translate%280.75%201%29%20scale%280.22%29%27%3E%0A%20%20%3Cpath%20d%3D%27M-0.9-1.2%20h1.8%20v1.55%20c0%200.9-0.6%201.45-0.9%201.65-0.3-0.2-0.9-0.75-0.9-1.65z%27%20fill%3D%27%23b0002a%27%20stroke%3D%27%237a001c%27%20stroke-width%3D%270.12%27%2F%3E%0A%20%20%3Crect%20x%3D%27-0.55%27%20y%3D%27-0.95%27%20width%3D%271.1%27%20height%3D%270.95%27%20fill%3D%27%23f6d04d%27%20opacity%3D%270.9%27%2F%3E%0A%20%20%3Cpath%20d%3D%27M-1.1-1.25%20q1.1-0.9%202.2%200%27%20fill%3D%27none%27%20stroke%3D%27%23d4aa00%27%20stroke-width%3D%270.18%27%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E"); }
    .flag-gb{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='600' viewBox='0 0 60 30'%3E%3Crect width='60' height='30' fill='%23012169'/%3E%3Cpath d='M0 0 L60 30 M60 0 L0 30' stroke='%23fff' stroke-width='6'/%3E%3Cpath d='M0 0 L60 30 M60 0 L0 30' stroke='%23c8102e' stroke-width='3'/%3E%3Cpath d='M30 0 V30 M0 15 H60' stroke='%23fff' stroke-width='10'/%3E%3Cpath d='M30 0 V30 M0 15 H60' stroke='%23c8102e' stroke-width='6'/%3E%3C/svg%3E"); }
    .flag-fr{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='600' viewBox='0 0 3 2'%3E%3Crect width='1' height='2' x='0' fill='%230052a5'/%3E%3Crect width='1' height='2' x='1' fill='%23fff'/%3E%3Crect width='1' height='2' x='2' fill='%23ef4135'/%3E%3C/svg%3E"); }
    .flag-it{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='600' viewBox='0 0 3 2'%3E%3Crect width='1' height='2' x='0' fill='%23009246'/%3E%3Crect width='1' height='2' x='1' fill='%23fff'/%3E%3Crect width='1' height='2' x='2' fill='%23ce2b37'/%3E%3C/svg%3E"); }
    .flag-br{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='600' viewBox='0 0 20 14'%3E%3Crect width='20' height='14' fill='%23009b3a'/%3E%3Cpolygon points='10,1.2 18.8,7 10,12.8 1.2,7' fill='%23ffdf00'/%3E%3Ccircle cx='10' cy='7' r='3' fill='%23002776'/%3E%3C/svg%3E"); }

    .flag-za{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2060%2040%27%3E%0A%3Crect%20width%3D%2760%27%20height%3D%2720%27%20y%3D%270%27%20fill%3D%27%23de3831%27%2F%3E%0A%3Crect%20width%3D%2760%27%20height%3D%2720%27%20y%3D%2720%27%20fill%3D%27%23002395%27%2F%3E%0A%0A%3C%21--%20white%20border%20Y%20--%3E%0A%3Cpath%20d%3D%27M0%2C4%20L24%2C20%20L0%2C36%20L0%2C28.5%20L15%2C20%20L0%2C11.5%20Z%27%20fill%3D%27%23ffffff%27%2F%3E%0A%3Cpath%20d%3D%27M24%2C20%20L60%2C20%20L60%2C11.5%20L29%2C11.5%20L24%2C20%20L29%2C28.5%20L60%2C28.5%20L60%2C20%20Z%27%20fill%3D%27%23ffffff%27%2F%3E%0A%0A%3C%21--%20green%20Y%20--%3E%0A%3Cpath%20d%3D%27M0%2C7%20L21%2C20%20L0%2C33%20L0%2C27%20L12%2C20%20L0%2C13%20Z%27%20fill%3D%27%23007a4d%27%2F%3E%0A%3Cpath%20d%3D%27M21%2C20%20L60%2C20%20L60%2C14.5%20L26.5%2C14.5%20L21%2C20%20L26.5%2C25.5%20L60%2C25.5%20L60%2C20%20Z%27%20fill%3D%27%23007a4d%27%2F%3E%0A%0A%3C%21--%20yellow%20border%20at%20hoist%20--%3E%0A%3Cpath%20d%3D%27M0%2C6%20L18%2C20%20L0%2C34%20L0%2C30%20L12.5%2C20%20L0%2C10%20Z%27%20fill%3D%27%23ffb612%27%2F%3E%0A%0A%3C%21--%20black%20triangle%20--%3E%0A%3Cpath%20d%3D%27M0%2C8%20L16%2C20%20L0%2C32%20Z%27%20fill%3D%27%23000000%27%2F%3E%0A%0A%3C%2Fsvg%3E"); }
    .flag-de{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='440' height='240'%3E%3Crect width='440' height='80' y='0' fill='%23000'/%3E%3Crect width='440' height='80' y='80' fill='%23dd0000'/%3E%3Crect width='440' height='80' y='160' fill='%23ffce00'/%3E%3C/svg%3E"); }
    .flag-us{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='950' height='500' viewBox='0 0 19 10'%3E%3Crect width='19' height='10' fill='%23fff'/%3E%3Cg fill='%23b22234'%3E%3Crect y='0' width='19' height='0.76923'/%3E%3Crect y='1.53846' width='19' height='0.76923'/%3E%3Crect y='3.07692' width='19' height='0.76923'/%3E%3Crect y='4.61538' width='19' height='0.76923'/%3E%3Crect y='6.15385' width='19' height='0.76923'/%3E%3Crect y='7.69231' width='19' height='0.76923'/%3E%3Crect y='9.23077' width='19' height='0.76923'/%3E%3C/g%3E%3Crect width='7.6' height='5.38462' fill='%233c3b6e'/%3E%3Cg fill='%23fff'%3E%3C!-- yıldızlar (nokta) --%3E%3Ccircle cx='0.63' cy='0.60' r='0.09'/%3E%3Ccircle cx='1.53' cy='0.60' r='0.09'/%3E%3Ccircle cx='2.43' cy='0.60' r='0.09'/%3E%3Ccircle cx='3.33' cy='0.60' r='0.09'/%3E%3Ccircle cx='4.23' cy='0.60' r='0.09'/%3E%3Ccircle cx='5.13' cy='0.60' r='0.09'/%3E%3Ccircle cx='6.03' cy='0.60' r='0.09'/%3E%3Ccircle cx='0.18' cy='1.15' r='0.09'/%3E%3Ccircle cx='1.08' cy='1.15' r='0.09'/%3E%3Ccircle cx='1.98' cy='1.15' r='0.09'/%3E%3Ccircle cx='2.88' cy='1.15' r='0.09'/%3E%3Ccircle cx='3.78' cy='1.15' r='0.09'/%3E%3Ccircle cx='4.68' cy='1.15' r='0.09'/%3E%3Ccircle cx='5.58' cy='1.15' r='0.09'/%3E%3Ccircle cx='6.48' cy='1.15' r='0.09'/%3E%3Ccircle cx='7.38' cy='1.15' r='0.09'/%3E%3Ccircle cx='0.63' cy='1.70' r='0.09'/%3E%3Ccircle cx='1.53' cy='1.70' r='0.09'/%3E%3Ccircle cx='2.43' cy='1.70' r='0.09'/%3E%3Ccircle cx='3.33' cy='1.70' r='0.09'/%3E%3Ccircle cx='4.23' cy='1.70' r='0.09'/%3E%3Ccircle cx='5.13' cy='1.70' r='0.09'/%3E%3Ccircle cx='6.03' cy='1.70' r='0.09'/%3E%3Ccircle cx='0.18' cy='2.25' r='0.09'/%3E%3Ccircle cx='1.08' cy='2.25' r='0.09'/%3E%3Ccircle cx='1.98' cy='2.25' r='0.09'/%3E%3Ccircle cx='2.88' cy='2.25' r='0.09'/%3E%3Ccircle cx='3.78' cy='2.25' r='0.09'/%3E%3Ccircle cx='4.68' cy='2.25' r='0.09'/%3E%3Ccircle cx='5.58' cy='2.25' r='0.09'/%3E%3Ccircle cx='6.48' cy='2.25' r='0.09'/%3E%3Ccircle cx='7.38' cy='2.25' r='0.09'/%3E%3Ccircle cx='0.63' cy='2.80' r='0.09'/%3E%3Ccircle cx='1.53' cy='2.80' r='0.09'/%3E%3Ccircle cx='2.43' cy='2.80' r='0.09'/%3E%3Ccircle cx='3.33' cy='2.80' r='0.09'/%3E%3Ccircle cx='4.23' cy='2.80' r='0.09'/%3E%3Ccircle cx='5.13' cy='2.80' r='0.09'/%3E%3Ccircle cx='6.03' cy='2.80' r='0.09'/%3E%3Ccircle cx='0.18' cy='3.35' r='0.09'/%3E%3Ccircle cx='1.08' cy='3.35' r='0.09'/%3E%3Ccircle cx='1.98' cy='3.35' r='0.09'/%3E%3Ccircle cx='2.88' cy='3.35' r='0.09'/%3E%3Ccircle cx='3.78' cy='3.35' r='0.09'/%3E%3Ccircle cx='4.68' cy='3.35' r='0.09'/%3E%3Ccircle cx='5.58' cy='3.35' r='0.09'/%3E%3Ccircle cx='6.48' cy='3.35' r='0.09'/%3E%3Ccircle cx='7.38' cy='3.35' r='0.09'/%3E%3Ccircle cx='0.63' cy='3.90' r='0.09'/%3E%3Ccircle cx='1.53' cy='3.90' r='0.09'/%3E%3Ccircle cx='2.43' cy='3.90' r='0.09'/%3E%3Ccircle cx='3.33' cy='3.90' r='0.09'/%3E%3Ccircle cx='4.23' cy='3.90' r='0.09'/%3E%3Ccircle cx='5.13' cy='3.90' r='0.09'/%3E%3Ccircle cx='6.03' cy='3.90' r='0.09'/%3E%3Ccircle cx='0.18' cy='4.45' r='0.09'/%3E%3Ccircle cx='1.08' cy='4.45' r='0.09'/%3E%3Ccircle cx='1.98' cy='4.45' r='0.09'/%3E%3Ccircle cx='2.88' cy='4.45' r='0.09'/%3E%3Ccircle cx='3.78' cy='4.45' r='0.09'/%3E%3Ccircle cx='4.68' cy='4.45' r='0.09'/%3E%3Ccircle cx='5.58' cy='4.45' r='0.09'/%3E%3Ccircle cx='6.48' cy='4.45' r='0.09'/%3E%3Ccircle cx='7.38' cy='4.45' r='0.09'/%3E%3C/g%3E%3C/svg%3E"); }
    .flag-ar{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='300' viewBox='0 0 9 4.5'%3E%3Crect width='9' height='4.5' fill='%2374acdf'/%3E%3Crect y='1.5' width='9' height='1.5' fill='%23fff'/%3E%3Cg transform='translate(4.5 2.25)'%3E%3Ccircle r='0.28' fill='%23f6b40e'/%3E%3Cg fill='none' stroke='%23f6b40e' stroke-width='0.06'%3E%3Cpath d='M0,-0.52 L0,-0.34'/%3E%3Cpath d='M0,0.52 L0,0.34'/%3E%3Cpath d='M-0.52,0 L-0.34,0'/%3E%3Cpath d='M0.52,0 L0.34,0'/%3E%3Cpath d='M-0.37,-0.37 L-0.24,-0.24'/%3E%3Cpath d='M0.37,0.37 L0.24,0.24'/%3E%3Cpath d='M0.37,-0.37 L0.24,-0.24'/%3E%3Cpath d='M-0.37,0.37 L-0.24,0.24'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); }
    .flag-az{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='300' viewBox='0 0 12 6'%3E%3Crect width='12' height='2' y='0' fill='%2300b5e2'/%3E%3Crect width='12' height='2' y='2' fill='%23ef3340'/%3E%3Crect width='12' height='2' y='4' fill='%23509e2f'/%3E%3Cg transform='translate(6.2 3)'%3E%3Ccircle r='1.05' fill='%23fff'/%3E%3Ccircle cx='0.35' r='0.85' fill='%23ef3340'/%3E%3Cpolygon fill='%23fff' points='1.9,0 1.45,0.22 1.6,0.7 1.2,0.42 0.8,0.7 0.95,0.22 0.5,0 0.95,-0.22 0.8,-0.7 1.2,-0.42 1.6,-0.7 1.45,-0.22'/%3E%3C/g%3E%3C/svg%3E"); }

    .leagueClassic{ display:grid; gap:10px; }
    .leagueRow{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
      padding:2px 0;
    }
    .leagueRow .left{ display:flex; align-items:center; gap:10px; }
    .greenArrow{ width:14px; height:14px; display:inline-grid; place-items:center; color:#2e7d32; font-weight:900; }
    .leagueRow .txt{ color:#2e7d32; font-weight:800; }

    .icons{ display:flex; gap:8px; }
    .ic{
      width:18px;
      height:18px;
      border:1px solid rgba(0,0,0,.15);
      border-radius:2px;
      background:#fff;
      position:relative;
      overflow:hidden;
      box-shadow: 0 3px 8px rgba(0,0,0,.08);
    }
    .ic.chart:before{
      content:"";
      position:absolute;
      left:3px;
      bottom:3px;
      width:3px;
      height:8px;
      background:#d32f2f;
      box-shadow: 5px -2px 0 #2e7d32, 10px -4px 0 #1e88e5;
    }
    .ic.table:before{
      content:"";
      position:absolute;
      inset:3px;
      border:1px solid rgba(0,0,0,.18);
      background: repeating-linear-gradient(0deg, rgba(0,0,0,.08), rgba(0,0,0,.08) 1px, transparent 1px, transparent 5px),
                  repeating-linear-gradient(90deg, rgba(0,0,0,.08), rgba(0,0,0,.08) 1px, transparent 1px, transparent 6px);
    }

    .countryLinksClassic{
      margin-top:10px;
      color:#2f55a4;
      font-size:13px;
      font-weight:700;
    }
    .countryLinksClassic a{ color:#2f55a4; text-decoration:none; }

    /* Dünya > Sahipsiz takımlar aksiyonu */
    .freeList{ display:grid; gap:6px; margin-top:6px; }
    .freeRow{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding:6px 8px; border:1px solid rgba(15,23,42,.10); border-radius:10px; background:#fff; box-shadow:none; font-size:11px; }
    .freeRow .name{ font-weight:1000; color:#0f172a; }
    .freeRow .meta{ color: rgba(15,23,42,.62); font-size:11px; font-weight:800; margin-top:1px; }
    .presBtn{ display:inline-flex; align-items:center; gap:8px; border:none; cursor:pointer; padding:6px 8px; border-radius:999px; font-weight:1100; letter-spacing:.2px; background: rgba(239,68,68,.10); color: rgba(127,29,29,.95); border:1px solid rgba(239,68,68,.25); font-size:11px; }
    .redDot{ width:8px; height:8px; border-radius:99px; background:#ef4444; box-shadow: 0 0 0 5px rgba(239,68,68,.12); }
    @keyframes blink { 0%, 100% { opacity:1 } 50% { opacity:.25 } }
    .blink{ animation: blink 1s infinite; }
    .freeList .freeRow:nth-child(odd){ background:#fff; }
    .freeList .freeRow:nth-child(even){ background: rgba(15,23,42,.03); }

    /* Takım sayfası (klasik stil) */
    .teamPageWrap{ background:#ffffff; border:1px solid rgba(0,0,0,.12); border-radius:10px; box-shadow: 0 10px 24px rgba(15,23,42,.06); overflow:hidden; }
    .teamTopLinks{ background:#ffffff; border-bottom:1px solid rgba(0,0,0,.10); padding:6px 10px; font-size:12px; font-weight:800; color:#1f4aa8; display:flex; flex-wrap:wrap; gap:10px; }
    .teamTopLinks a{ color:#1f4aa8; text-decoration:none; }
    .teamTopLinks a:hover{ text-decoration:underline; }

    .teamBody{ padding:12px; display:grid; grid-template-columns: 1fr; gap:14px; }
    .teamSide{ border-right:1px solid rgba(0,0,0,.10); padding-right:10px; }
    .teamSide .miniBox{ border:1px solid rgba(0,0,0,.12); border-radius:10px; padding:12px; background: linear-gradient(180deg, #ffffff, #f3f5f8); color: rgba(15,23,42,.70); font-weight:1000; font-size:13px; }
    .teamSide .sideLinks{ margin-top:10px; display:grid; gap:6px; }
    .teamSide .sideLinks a{ color:#1f4aa8; text-decoration:none; font-size:12px; font-weight:800; }
    .teamSide .sideLinks a:hover{ text-decoration:underline; }

    .teamMain h2{ margin:0; font-size:20px; color:#0f172a; letter-spacing:-.2px; }
    .teamMeta{ margin-top:6px; color: rgba(15,23,42,.62); font-weight:800; font-size:12.5px; }
    .teamInfoTable{ margin-top:10px; display:grid; gap:8px; }
    .pitchWrap{ margin-top:10px; border:1px solid rgba(0,0,0,.12); border-radius:14px; overflow:hidden; background:radial-gradient(ellipse at center, #7bb661 0%, #4e8c3a 100%); position:relative; width:100%; }
    .pitch{ padding:16px; display:grid; grid-template-rows: repeat(4, 1fr); grid-auto-rows: 1fr; height:clamp(360px, 50vh, 520px); }
    .pitchLine{ display:flex; justify-content:space-evenly; gap:10px; align-items:center; padding:0 6px; }
    .posNode{ display:flex; flex-direction:column; align-items:center; gap:6px; }
    .posBall{ width:28px; height:28px; border-radius:999px; background:#fff; border:2px solid rgba(15,23,42,.18); display:flex; align-items:center; justify-content:center; font-weight:1200; color:#1f4aa8; font-size:12px; }
    .posSel{ width:clamp(100px, 14vw, 150px); padding:8px 10px; border-radius:12px; border:1px solid rgba(15,23,42,.18); background:#fff; font-size:12px; }
    .posSlot{ display:flex; align-items:center; gap:6px; }
    .posMini{ font-weight:1000; color:#0f172a; font-size:12px; }
    @media (max-width: 860px){
      .pitch{ height:clamp(420px, 58vh, 580px); }
      .pitchLine{ gap:8px; }
      .posBall{ width:28px; height:28px; font-size:12px; }
      .posSel{ width:clamp(110px, 28vw, 160px); }
    }
    .tiRow{ display:grid; grid-template-columns: 160px 1fr; gap:10px; align-items:center; padding:7px 0; border-bottom:1px dotted rgba(0,0,0,.12); }
    .tiRow b{ color:#0f172a; font-size:13px; }
    .tiRow span{ color: rgba(15,23,42,.78); font-weight:800; font-size:13px; }
    .tiRow a{ color:#1f4aa8; text-decoration:none; font-weight:900; }
    .tiRow a:hover{ text-decoration:underline; }

    .teamRight{ display:none; }

    .presInline{ display:inline-flex; align-items:center; gap:8px; margin-left:8px; padding:6px 10px; border-radius:999px; border:1px solid rgba(239,68,68,.25); background: rgba(239,68,68,.10); color: rgba(127,29,29,.95); font-weight:1100; cursor:pointer; }
    .presInline .redDot{ width:9px; height:9px; box-shadow: 0 0 0 5px rgba(239,68,68,.12); }

    /* Lig yanında ikon buton (puan durumu) */
    .iconBtn{
      display:inline-grid;
      place-items:center;
      width:26px;
      height:22px;
      margin-left:8px;
      border-radius:2px;
      border:1px solid rgba(0,0,0,.15);
      background:#fff;
      cursor:pointer;
      box-shadow: 0 3px 8px rgba(0,0,0,.08);
      vertical-align:middle;
    }
    .iconBtn:hover{ filter: brightness(0.98); }
    .iconBtn .bars{ width:16px; height:14px; position:relative; }
    .iconBtn .bars:before{
      content:"";
      position:absolute;
      left:1px;
      bottom:1px;
      width:3px;
      height:7px;
      background:#d32f2f;
      box-shadow: 5px -2px 0 #2e7d32, 10px -4px 0 #1e88e5;
      border-radius:1px;
    }

    .teamBottomIcons{ border-top:1px solid rgba(0,0,0,.10); background:#ffffff; padding:10px 12px; display:flex; gap:14px; flex-wrap:wrap; justify-content:center; }
    .tbItem{ width:78px; text-align:center; color:#0f172a; font-weight:900; font-size:12px; cursor:pointer; }
    .tbIco{ width:42px; height:34px; margin:0 auto 6px; border:1px solid rgba(0,0,0,.12); border-radius:8px; background: linear-gradient(180deg, #ffffff, #f1f4f7); display:grid; place-items:center; color: rgba(15,23,42,.55); }

    /* Oyuncu listesi (referans görsele yakın tablo) */
    .rosterWrap{ background:#fff; border:1px solid rgba(0,0,0,.12); border-radius:10px; box-shadow: 0 10px 24px rgba(15,23,42,.06); overflow:hidden; }
    .rosterHead{ padding:10px 12px; background:rgba(15,23,42,.03); border-bottom:1px solid rgba(0,0,0,.10); display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
    .rosterHead b{ color:#0f172a; }
    .rosterTools{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
    .rosterTools input{ padding:10px 12px; border-radius:999px; border:1px solid rgba(0,0,0,.12); background:#fff; outline:none; font-size:13px; }
    .rosterTable{ width:100%; border-collapse:separate; border-spacing:0; }
    .rosterTable thead th{ text-align:left; padding:10px 12px; font-size:12px; color:rgba(15,23,42,.78); font-weight:1100; border-bottom:1px solid rgba(0,0,0,.10); background:#fff; position:sticky; top:0; z-index:1; }
    .rosterTable tbody td{ padding:10px 12px; border-bottom:1px solid rgba(0,0,0,.07); vertical-align:middle; font-size:13px; color:#0f172a; font-weight:900; }
    .rosterTable tbody tr:nth-child(even) td{ background:rgba(15,23,42,.02); }
    .posLink{ color:#1f4aa8; text-decoration:none; font-weight:1100; }
    .posLink:hover{ text-decoration:underline; }
    .posText{ color:#0f172a; font-weight:1100; }

    /* Oyuncu listesi: admin hızlı düzenle butonu (mevki solunda) */
    .posCell{ display:flex; align-items:center; gap:8px; }
    .rosterEditBtn.btn.tiny{ padding:4px 8px; border-radius:9px; font-size:11px; line-height:1; }
    .miniBars{ width:170px; min-height:26px; height:auto; display:flex; gap:2px; align-items:flex-end; flex-wrap:wrap; }
    .miniBars span{
      width:9px;
      flex:0 0 auto;
      border-radius:2px;
      border:1px solid rgba(0,0,0,.14);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.6), inset 0 -3px 8px rgba(0,0,0,.12), 0 1px 0 rgba(0,0,0,.35);
      display:block;
      opacity:.96;
      transition: height .15s ease-in-out;
    }
    .flags{ display:flex; gap:8px; align-items:center; justify-content:flex-end; }
    .pillMini{ display:inline-flex; align-items:center; justify-content:center; width:26px; height:18px; border-radius:6px; border:1px solid rgba(0,0,0,.12); background:#fff; font-size:11px; font-weight:1100; color:rgba(15,23,42,.75); }
    .price{ color:#0f172a; font-weight:1200; text-align:right; }
.offerCell{ text-align:right; }
/* Roster team: price & teklif ortala */
.rosterTable.roster-team th.priceHead, .rosterTable.roster-team td.price{ text-align:center !important; }
.rosterTable.roster-team th.offerHead, .rosterTable.roster-team td.offerCell{ text-align:center !important; }
    .tradeLink{ color:#c1121f; font-weight:1200; text-decoration:none; }
    .tradeLink:hover{ text-decoration:underline; }

    /* Uyruk + kolon hizalama: Oyuncu tabloları (Takım / Antrenman / Transfer) */
    .rosterTable.roster-team,
    .rosterTable.roster-training,
    .rosterTable.roster-market{
      table-layout: fixed;
    }

    /* Bayrak sütunu */
    .rosterTable th.natHead,
    .rosterTable td.natCol{
      text-align:center;
      padding-left:8px;
      padding-right:8px;
      white-space:nowrap;
    }

    /* Metinler taşmasın (kolonlar birbirine girmesin) */
    .rosterTable .playerLink{
      display:inline-block;
      max-width:100%;
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:nowrap;
      vertical-align:middle;
    }
    .rosterTable .posText{
      display:block;
      max-width:100%;
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:nowrap;
    }

/* Transfer listesi: takım bilgisi (Ad hücresi altında) */
.rosterTable .teamSub{
  margin-top:2px;
  font-size:12px;
  font-weight:900;
  line-height:1.1;
  color:rgba(15,23,42,.62);
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.rosterTable .teamMiniLink{
  color:rgba(15,23,42,.62);
  text-decoration:none;
}
.rosterTable .teamMiniLink:hover{ text-decoration:underline; }


    /* Takım oyuncu listesi:
       Kademe | Mevki | Bayrak | Ad | Yaş | Özellik | Fiyat | Teklif | (spacer)
       Notlar:
       - Admin’de ⛔ + ✎ ikonları ilk kolonda görünüyor. Bu kolon dar kalırsa butonlar kırpılır.
       - Mevki metni flex içinde ellipsis ile düzgün kısalsın (yarım/bozuk görünmesin).
       - Genel görünüm: “Tüm oyuncular” sayfasına yakın, dengeli ve muntazam. */
    .rosterTable.roster-team th:nth-child(1),
    .rosterTable.roster-team td:nth-child(1){ width:72px; padding-left:8px; padding-right:8px; }

    .rosterTable.roster-team th:nth-child(2),
    .rosterTable.roster-team td:nth-child(2){ width:180px; padding-right:12px; }

    .rosterTable.roster-team th:nth-child(3),
    .rosterTable.roster-team td:nth-child(3){ width:44px; }

    .rosterTable.roster-team th:nth-child(4),
    .rosterTable.roster-team td:nth-child(4){ width:240px; padding-left:10px; }

    .rosterTable.roster-team th:nth-child(5),
    .rosterTable.roster-team td:nth-child(5){ width:56px; text-align:right; white-space:nowrap; }

    .rosterTable.roster-team th:nth-child(6),
    .rosterTable.roster-team td:nth-child(6){ width:150px; }

    .rosterTable.roster-team th:nth-child(7),
    .rosterTable.roster-team td:nth-child(7){ width:120px; text-align:center; white-space:nowrap; }

    .rosterTable.roster-team th:nth-child(8),
    .rosterTable.roster-team td:nth-child(8){ width:120px; text-align:center; white-space:nowrap; padding-right:8px; }

    .rosterTable.roster-team th:nth-child(9),
    .rosterTable.roster-team td:nth-child(9){ padding-left:0; padding-right:0; }

    /* spacer: sağda boşluk bırakmasın; Teklif en sağda kalsın */
    .rosterTable.roster-team .spacerHead,
    .rosterTable.roster-team .spacerCol{ display:none; }

    /* Kademe hücresi: ikon/aksiyon butonları taşmasın */
    .rosterTable.roster-team .kademeCell{ gap:6px; justify-content:center; }

    /* Admin ikon butonları (dar kolonlarda taşma olmasın) */
    .rosterTable.roster-team .rosterEditBtn.btn.tiny,
    .rosterTable.roster-team .rosterDelBtn.btn.tiny{
      width:28px;
      height:24px;
      padding:0 !important;
      display:inline-flex;
      align-items:center;
      justify-content:center;
    }
    .rosterTable.roster-team .rosterDelBtn.btn.tiny{ margin-right:0 !important; }

    /* Mevki metni: flex içinde ellipsis düzgün çalışsın */
    .rosterTable.roster-team .posCell .posText{
      flex:1 1 auto;
      min-width:0;
    }

/* Antrenman:
       Mevki | Bayrak | Ad | Yaş | Özellik | Antrenman | (spacer) */
    .rosterTable.roster-training th:nth-child(1),
    .rosterTable.roster-training td:nth-child(1){ width:210px; padding-right:10px; }

    .rosterTable.roster-training th:nth-child(2),
    .rosterTable.roster-training td:nth-child(2){ width:44px; }

    .rosterTable.roster-training th:nth-child(3),
    .rosterTable.roster-training td:nth-child(3){ width:260px; padding-left:10px; }

    .rosterTable.roster-training th:nth-child(4),
    .rosterTable.roster-training td:nth-child(4){ width:60px; text-align:right; white-space:nowrap; }

    .rosterTable.roster-training th:nth-child(5),
    .rosterTable.roster-training td:nth-child(5){ width:200px; }

    .rosterTable.roster-training th:nth-child(6),
    .rosterTable.roster-training td:nth-child(6){ width:260px; text-align:right; }

    .rosterTable.roster-training th:nth-child(7),
    .rosterTable.roster-training td:nth-child(7){ padding-left:0; padding-right:0; }

    /* Transfer listesi:
   Mevki | Bayrak | Ad | Yaş | Özellik | Fiyat | Teklif | (spacer) */
.rosterTable.roster-market th:nth-child(1),
.rosterTable.roster-market td:nth-child(1){ width:210px; padding-right:10px; }

.rosterTable.roster-market th:nth-child(2),
.rosterTable.roster-market td:nth-child(2){ width:44px; }

.rosterTable.roster-market th:nth-child(3),
.rosterTable.roster-market td:nth-child(3){ width:260px; padding-left:10px; }

.rosterTable.roster-market th:nth-child(4),
.rosterTable.roster-market td:nth-child(4){ width:60px; text-align:right; white-space:nowrap; }

.rosterTable.roster-market th:nth-child(5),
.rosterTable.roster-market td:nth-child(5){ width:200px; }

.rosterTable.roster-market th:nth-child(6),
.rosterTable.roster-market td:nth-child(6){ width:120px; text-align:right; white-space:nowrap; }

.rosterTable.roster-market th:nth-child(7),
.rosterTable.roster-market td:nth-child(7){ width:130px; text-align:right; white-space:nowrap; }

/* spacer: kalan alanı alsın */
.rosterTable.roster-market th:nth-child(8),
.rosterTable.roster-market td:nth-child(8){ padding-left:0; padding-right:0; }



    /* Minibars → Fiyat / Teklif arası daha dengeli olsun */
    .rosterTable.roster-team th:nth-child(6),
    .rosterTable.roster-team td:nth-child(6),
    .rosterTable.roster-training th:nth-child(5),
    .rosterTable.roster-training td:nth-child(5),
    .rosterTable.roster-market th:nth-child(5),
    .rosterTable.roster-market td:nth-child(5){
      padding-right:8px;
    }

    .rosterTable.roster-team th:nth-child(7),
    .rosterTable.roster-team td:nth-child(7),
    .rosterTable.roster-market th:nth-child(6),
    .rosterTable.roster-market td:nth-child(6){
      padding-left:8px;
      padding-right:10px;
    }

    .rosterTable.roster-team th:nth-child(8),
    .rosterTable.roster-team td:nth-child(8),
    .rosterTable.roster-market th:nth-child(7),
    .rosterTable.roster-market td:nth-child(7){
      padding-left:8px;
    }



    /* Antrenman sayfası */
    .btn:disabled{ opacity:.55; cursor:not-allowed; }
    .trainSelect, .trainPlayerSelect{
      padding:10px 12px;
      border-radius:999px;
      border:1px solid rgba(0,0,0,.12);
      background:#fff;
      font-size:13px;
      font-weight:1000;
      color:rgba(15,23,42,.80);
      outline:none;
    }
    .trainSelect:focus, .trainPlayerSelect:focus{
      border-color: rgba(156,255,0,.45);
      box-shadow: 0 0 0 4px rgba(156,255,0,.16);
    }
    .trainHeaderRow{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      flex-wrap:wrap;
    }
    .trainHint{
      font-size:12px;
      font-weight:900;
      color: rgba(15,23,42,.62);
    }
    .trainLock{
      display:inline-flex;
      align-items:center;
      gap:10px;
      padding:8px 10px;
      border-radius:999px;
      border:1px solid rgba(239,68,68,.25);
      background: rgba(239,68,68,.10);
      color: rgba(127,29,29,.95);
      font-weight:1100;
    }
    .trainPill{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:8px 10px;
      border-radius:999px;
      border:1px solid rgba(15,23,42,.12);
      background: rgba(15,23,42,.03);
      color: rgba(15,23,42,.80);
      font-weight:1100;
      font-size:12.5px;
      white-space:nowrap;
    }
    .trainCountdown{
      font-variant-numeric: tabular-nums;
      letter-spacing:.3px;
    }
    .trainCell{
      display:flex;
      justify-content:flex-end;
      gap:10px;
      align-items:center;
      flex-wrap:wrap;
    }
    .trainFooter{
      padding:12px;
      border-top:1px solid rgba(0,0,0,.10);
      background: rgba(15,23,42,.02);
      display:flex;
      gap:10px;
      justify-content:flex-end;
      align-items:center;
      flex-wrap:wrap;
    }



    /* =========================================================
       Futbolcu Detay Sayfası (Klasik) — referans görsele yakın
       ========================================================= */
    .playerClassicWrap{
      background:#fff;
      font-family: Arial, Helvetica, sans-serif;
      color:#000;
    }
    .playerClassicTop{
      background: linear-gradient(#3a3a3a, #000);
      color:#ff9d00;
      font-weight:700;
      font-size:14px;
      padding:4px 8px;
      min-height:34px;
      border-bottom:1px solid #000;
      line-height:1.2;
      user-select:none;
    }
    .playerClassicTop a{
      color:#ff9d00;
      text-decoration:none;
      font-weight:700;
    }
    .playerClassicTop a:hover{ text-decoration:underline; }

    .playerClassicBody{
      display:grid;
      grid-template-columns: 420px 1fr;
      gap:0;
      padding:0;
    }
    .playerLeft{
      padding:10px 8px 14px 8px;
    }
    .playerRight{
      border-left:1px dotted #cfcfcf;
      padding:10px 10px 14px 10px;
    }

    .playerClassicName{
      display:inline-block;
      font-size:28px;
      font-weight:700;
      color:#2f55a4;
      text-decoration:none;
      margin:4px 0 10px;
    }
    .playerClassicName:hover{ text-decoration:underline; }

    .playerPic{
      width:240px;
      height:200px;
      border:1px solid #999;
      border-radius:10px;
      background:#fff;
      display:flex;
      align-items:center;
      justify-content:center;
      margin:6px 0 10px;
      overflow:hidden;
    }
    .playerPic svg{ width:180px; height:180px; }
    .playerPic img{ width:180px; height:180px; object-fit:contain; }

    .playerInfoTable{
      width:100%;
      border-collapse:collapse;
      font-size:15px;
    }
    .playerInfoTable td{
      padding:6px 0;
      vertical-align:top;
    }
    .playerInfoTable .label{ width:160px; color:#000; }
    .playerInfoTable .colon{ width:16px; color:#6b2aa8; font-weight:700; text-align:center; }
    .playerInfoTable .val{ font-weight:700; }

    .val-green{ color:#2e7d32; }
    .val-blue{ color:#2f55a4; }
    .val-purple{ color:#551a8b; }
    .val-maroon{ color:#7a0000; }

    .playerSep{
      border:none;
      border-top:1px dotted #cfcfcf;
      margin:10px 0;
    }

    .flagMini{
      width:22px;
      height:14px;
      display:inline-block;
      border:1px solid rgba(0,0,0,.22);
      border-radius:2px;
      background-size:cover;
      background-position:center;
      vertical-align:middle;
      margin-right:0px;
    }
    .limitBoot{ width:22px; height:22px; vertical-align:middle; }

.kademeIcon{
  width:26px;
  height:26px;
  vertical-align:middle;
}

/* Takım oyuncu listesi: satırı büyütmeden küçük kademe forması */
.kademeIconMini{
  width:18px;
  height:18px;
  display:block;
}
.kademeCell{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
}

    .playerOfferBlock{
      margin-top:18px;
      display:flex;
      flex-direction:column;
      align-items:center;
      gap:8px;
      width:240px;
    }
    .offerPaper{
      width:64px;
      height:64px;
      background: linear-gradient(180deg, #f1f1f1, #bcbcbc);
      border-radius:10px;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.85);
      opacity:.75;
    }
    .offerLink{
      color:#1e7f2a;
      font-weight:700;
      text-decoration:none;
      font-size:16px;
    }
    .offerLink:hover{ text-decoration:underline; }

    .playerLink{
      color:#1f4aa8;
      text-decoration:none;
      font-weight:1000;
    }
    .playerLink:hover{ text-decoration:underline; }

    /* Oyuncu özellik barları (detay sayfası) — daha kompakt */
    .skillList{ display:grid; gap:6px; }

    /* Sağ kolonda barlar:
       - Oyuncu bilgilerine yakın dursun (arada dev boşluk kalmasın)
       - Bir tık daha büyük/okunaklı olsun */
    .playerRight .skillList{
      width:100%;
      max-width:680px;
      margin-left:0;
    }

    .skillRow{
      display:grid;
      grid-template-columns: 130px 70px 1fr;
      align-items:center;
      gap:10px;
      font-size:14px;
    }
    .skillLabel{ color:#000; }
    .skillValue{
      color:#000;
      text-align:right;
      width:70px;
      font-variant-numeric: tabular-nums;
    }
    .barTrack{
      height:14px;
      background:#eee;
      border-radius:4px;
      border:1px solid rgba(0,0,0,.18);
      position:relative;
      overflow:hidden;
    }
    .barFill{ height:100%; width:0; }
    .fill-teal{ background: linear-gradient(180deg, #7bd0cf 0%, #49b1b7 55%, #1f6f7a 100%); }
    /* Stat renkleri (0-1000):
       0-200   #FFFFFF
       200-400 #D4AF37
       400-600 #008000
       600-800 #000080
       800-950  #b21000
       951-1000 #000000 */
    .fill-green{ background:#008000; }
    .fill-red{ background:#b21000; }
    .fill-purple{ background: linear-gradient(180deg, #b5a9d9 0%, #8a74c2 55%, #5a4299 100%); }
        .fill-white{ background:#FFFFFF; }
    .fill-gold{ background: linear-gradient(180deg, #fff700 0%, #ffd000 55%, #ffb300 100%); }
.fill-gray{ background: linear-gradient(180deg, #a9b4bf 0%, #7b8895 55%, #3f4b57 100%); }
    .fill-blue{ background:#000080; }
    .fill-yellow{ background:#D4AF37; }
    .fill-orange{ background: linear-gradient(180deg, #f1a274 0%, #de7e4b 55%, #a84a1e 100%); }
    .fill-black{ background:#000000; }

    .fatigueBall{
      width:18px;
      height:18px;
      border-radius:50%;
      border:1px solid rgba(0,0,0,.35);
      background: radial-gradient(circle at 35% 35%, #fff, #ddd 55%, #bbb 100%);
      box-shadow: inset 0 0 0 2px rgba(255,255,255,.6);
      display:inline-block;
      vertical-align:middle;
      margin-left:6px;
    }

    @media (max-width: 840px){
      .playerClassicBody{ grid-template-columns:1fr; }
      .playerRight{ border-left:none; border-top:1px dotted #cfcfcf; }
      .playerOfferBlock{ width:100%; }
      .playerPic{ width:100%; max-width:260px; }
    }

    /* Not: Önceki sürümde mobil/tablet için 4. kolon (mini barlar) gizleniyordu.
       Mobilde "oyuncu minibarları" görünmediği için bu kural kaldırıldı.
       Taşma kontrolü artık tablo scroll + daha akıllı kolon gizleme ile yapılıyor. */

    @media (max-width: 980px){
      .teamBody{ grid-template-columns: 1fr; }
      .teamSide{ border-right:none; padding-right:0; border-bottom:1px solid rgba(0,0,0,.10); padding-bottom:10px; }
      .teamRight{ grid-template-columns: 1fr; }
      .phRow{ grid-template-columns: 1fr 1fr; }
    }

    .crumbs{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin: 8px 0 14px; }
    .crumb{ font-weight:1000; font-size:12.5px; color: rgba(15,23,42,.70); cursor:pointer; user-select:none; }
    .crumb:hover{ text-decoration:underline; }
    .crumbSep{ color: rgba(15,23,42,.35); }

    .leagueDetailGrid{ display:grid; grid-template-columns: .8fr 1.2fr; gap:14px; }
    /*
      Not: Uygulama genelinde body metin rengi (dark tema) açık renk.
      Beyaz kartlar içinde (özellikle Puan Durumu / Lig detay) tablo metinleri
      ek renk verilmezse beyaz kalıp görünmeyebiliyor.
      Bu yüzden ldCard içinde varsayılan metin rengi koyuya çekildi.
    */
    .ldCard{ border:1px solid rgba(15,23,42,.10); border-radius:18px; background:#fff; box-shadow: 0 12px 26px rgba(15,23,42,.06); padding:14px; color: rgba(15,23,42,.88); }
    .ldCard table th,
    .ldCard table td{ color: rgba(15,23,42,.88); }
    .ldTitle{ font-weight:1100; color:#0f172a; font-size:16px; }
    .ldSub{ color: rgba(15,23,42,.62); font-size:13px; margin-top:6px; line-height:1.4; }
    .kv{ display:grid; gap:10px; margin-top:12px; }
    .kvRow{ display:flex; justify-content:space-between; gap:12px; padding:10px 12px; border:1px solid rgba(15,23,42,.08); border-radius:14px; background: rgba(15,23,42,.03); }
    .kvRow b{ color:#0f172a; }
    .kvRow span{ color: rgba(15,23,42,.70); font-weight:1000; }

    .teamList{ display:grid; gap:10px; }
    .teamRow{ display:flex; justify-content:space-between; gap:12px; align-items:center; padding:10px 12px; border:1px solid rgba(15,23,42,.10); border-radius:14px; background:#fff; }
    .teamRow .tName{ font-weight:1000; color:#0f172a; }
    .teamRow .tInfo{ color: rgba(15,23,42,.62); font-size:12px; font-weight:800; }

    @media (max-width: 860px){
      .leagueDetailGrid{ grid-template-columns:1fr; }
    }
    .countryLinksClassic a:hover{ text-decoration:underline; }

    @media (max-width: 860px){
      .worldBody{ grid-template-columns:1fr; }
      .flagImg{ width:100%; height:140px; }
    }

    body.mode-news .newsTopShadow{
      position:sticky;
      top:138px;
      height:10px;
      background: linear-gradient(180deg, rgba(0,0,0,.12), transparent);
      z-index:4;
    }

    body.mode-news #newsPage{
      display:block !important;
      max-width: 1180px;
      margin: 0 auto;
      padding: 18px 16px 34px;
    }

    body.mode-news .newsGrid{ gap:16px; }
    body.mode-news .newsCard{ border-radius:18px; }
    body.mode-news .newsTag{ background: rgba(0,0,0,.04); }

    /* Üst barın altındaki ikinci bar */
    body.mode-news .subbar{
      display:block;

      position:sticky;
      top:92px;
      z-index:5;
      background: rgba(255,255,255,.92);
      backdrop-filter: blur(10px);
      border-bottom:1px solid rgba(0,0,0,.08);
    }
    body.mode-news .subnav{
      max-width:1180px;
      margin:0 auto;
      padding:10px 16px;
      display:flex;
      gap:10px;
      align-items:center;
      overflow:auto;
      -webkit-overflow-scrolling: touch;
    }
    body.mode-news .subitem{
      border:1px solid rgba(0,0,0,.10);
      background: rgba(0,0,0,.03);
      color: rgba(0,0,0,.75);
      border-radius:999px;
      padding:10px 12px;
      font-weight:900;
      font-size:13px;
      cursor:pointer;
      white-space:nowrap;
      user-select:none;
    }
    body.mode-news .subitem.active{
      background: linear-gradient(90deg, rgba(156,255,0,.35), rgba(255,229,0,.35));
      border-color: rgba(0,0,0,.14);
      color:#111;
    }
    body.mode-news .subsep{
      width:1px;
      height:28px;
      background: rgba(0,0,0,.10);
      margin:0 2px;
      flex:0 0 auto;
    }

    .badge{
      background:rgba(0,0,0,.55);
      cursor: default;
      border:1px solid var(--line);
      border-radius:999px;
      padding:10px 12px;
      font-size:13px;
      color:var(--muted);
      display:flex;
      align-items:center;
      gap:10px;
      backdrop-filter: blur(10px);
    }
    .pill{
      padding:6px 10px;
      border-radius:999px;
      border:1px solid var(--line);
      color:var(--text);
      background:rgba(255,255,255,.06);
      font-weight:600;
    }

    .brand{
      position:absolute;
      left:18px;
      top:84px;
      display:flex;
      align-items:flex-end;
      gap:10px;
      transform: translateZ(0);
      user-select:none;
    }
    .brand .sf{
      font-size:66px;
      font-weight:900;
      letter-spacing:-1px;
      text-shadow: 0 10px 30px rgba(0,0,0,.55);
      line-height:1;
    }
    .brand .sf .a{ color: var(--accent2); }
    .brand .sf .b{ color: var(--accent); }
    .ribbon{
      position:absolute;
      left:-42px;
      top:24px;
      background: linear-gradient(90deg, rgba(156,255,0,.9), rgba(255,229,0,.9));
      color:#0a0a0a;
      font-weight:900;
      padding:10px 56px;
      transform: rotate(-35deg);
      border-radius:10px;
      box-shadow: 0 10px 30px rgba(0,0,0,.4);
      letter-spacing:.5px;
    }

    .grid{
      position:absolute;
      left:0; right:0; top:0; bottom:0;
      display:grid;
      grid-template-columns: 1.2fr .9fr;
      grid-template-rows: 1fr auto;
      padding:18px;
      gap:16px;
    }

    .rightCol{
      display:grid;
      grid-template-rows: auto 1fr;
      gap:16px;
      align-self:stretch;
      padding-top:58px;
    }

    .panel{
      background: var(--panel);
      border:1px solid var(--line);
      border-radius: var(--radius);
      backdrop-filter: blur(10px);
      box-shadow: 0 10px 24px rgba(0,0,0,.35);
    }

    /* Gazete gibi “beyaz zemin” isteyen sayfalar için */
    #overlay.light{
      background:#ffffff;
      border:1px solid rgba(0,0,0,.12);
      box-shadow: 0 18px 50px rgba(0,0,0,.15);
      backdrop-filter: none;
      color:#111;
    }
    #overlay.light #overlaySubtitle{ color: rgba(0,0,0,.62) !important; }
    #overlay.light #overlayBody{ color: rgba(0,0,0,.78) !important; }
    #overlay.light .btn{ background: rgba(0,0,0,.04); border-color: rgba(0,0,0,.12); color: rgba(0,0,0,.78); }
    #overlay.light .btn.primary{ background: linear-gradient(90deg, rgba(156,255,0,.95), rgba(255,229,0,.95)); border:none; color:#0b0b0b; }

    .newsGrid{ display:grid; grid-template-columns: 1fr 1fr 1fr; gap:14px; }
    .newsCol{ display:grid; gap:12px; align-content:start; }
    .newsCard{
      padding:14px;
      border:1px solid rgba(0,0,0,.10);
      border-radius:16px;
      background:#fff;
    }
    .newsCard h5{ margin:0; font-size:14px; letter-spacing:.2px; color:#0f172a; }
    .newsCard p{ margin:8px 0 0 0; color:#0f172a; line-height:1.35; font-size:13px; }
    .newsTag{
      display:inline-flex;
      align-items:center;
      gap:8px;
      margin-bottom:10px;
      padding:6px 10px;
      border-radius:999px;
      border:1px solid rgba(15,23,42,.18);
      background: rgba(15,23,42,.08);
      font-weight:1000;
      font-size:12px;
      color:#0f172a;
    }
    .newsList{ display:grid; gap:10px; }
    .newsRow{ display:flex; justify-content:space-between; gap:10px; padding:10px; border:1px solid rgba(15,23,42,.18); border-radius:14px; background: rgba(15,23,42,.06); color:#0f172a; }
    .newsRow strong{ font-weight:900; color:#0f172a; }
    .newsRow span{ color:#0f172a; font-weight:900; }
    .scoreBlue{ color:#1f4aa8; font-weight:1200; }
    .goalIco{ display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border-radius:999px; background:rgba(31,74,168,.10); color:#1f4aa8; font-size:13px; margin-right:8px; }

    @media (max-width: 860px){
      .newsGrid{ grid-template-columns:1fr; }
    }

    .stats{
      padding:12px;
    }
    .stats h4{
      margin:0 0 10px 0;
      font-size:14px;
      color:rgba(255,255,255,.8);
      letter-spacing:.2px;
    }
    .statRow{
      display:flex;
      align-items:center;
      justify-content:space-between;
      padding:8px 10px;
      border-top:1px solid var(--line);
      font-size:13px;
      color:var(--muted);
    }
    .statRow strong{
      color:var(--accent2);
      font-weight:800;
      letter-spacing:.2px;
    }
    .statRow strong.ok{ color: var(--accent); }

    .info{
      padding:16px;
      display:flex;
      flex-direction:column;
      gap:10px;
    }
    .info h3{
      margin:0;
      font-size:18px;
      color:var(--accent2);
    }
    .bullet{
      display:flex;
      gap:10px;
      line-height:1.35;
      color:rgba(255,255,255,.78);
    }
    .dot{
      width:8px;
      height:8px;
      border-radius:99px;
      background: var(--accent2);
      margin-top:7px;
      flex:0 0 auto;
      box-shadow: 0 0 0 4px rgba(255,229,0,.12);
    }

    .login{
      position:absolute;
      left:18px;
      bottom:76px; /* biraz daha aşağı */
      width:min(340px, 44%);
      padding:12px;
      border-radius: 14px;
      background: linear-gradient(180deg, rgba(0,0,0,.62), rgba(0,0,0,.35));
      border:1px solid var(--line);
      backdrop-filter: blur(10px);
    }

    /* Üye girişi kutusunu kompaktlaştır */
    .loginHeader{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
      margin-bottom:8px;
    }
    .loginHeader h4{margin:0; font-size:13px; color:rgba(255,255,255,.86)}
    .loginHeader .hint{font-size:11px; color:rgba(255,255,255,.55)}

    .formRow{display:grid; grid-template-columns: 105px 1fr; gap:10px; margin:8px 0; align-items:center;}
    label{font-size:12px; color:rgba(255,255,255,.7)}
    input{
      width:100%;
      padding:9px 10px;
      border-radius:12px;
      border:1px solid rgba(255,255,255,.14);
      background: rgba(255,255,255,.06);
      color:var(--text);
      outline:none;
    }
    input:focus{border-color: rgba(156,255,0,.55); box-shadow: 0 0 0 4px rgba(156,255,0,.12)}

    .actions{display:flex; gap:8px; justify-content:flex-end; margin-top:10px; flex-wrap:wrap;}
    .btn{
      padding:9px 11px;
      border-radius:999px;
      border:1px solid rgba(59,130,246,.35);
      background: linear-gradient(90deg, rgba(59,130,246,.18), rgba(59,130,246,.28));
      color: rgba(15,23,42,.96);
      font-weight:800;
      font-size:12px;
      cursor:pointer;
      user-select:none;
    }
    .btn.primary{
      background: linear-gradient(90deg, rgba(156,255,0,.95), rgba(255,229,0,.95));
      color:#0b0b0b;
      border: none;
    }

    .loginHeader{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
      margin-bottom:10px;
    }
    .loginHeader h4{margin:0; font-size:14px; color:rgba(255,255,255,.86)}
    .loginHeader .hint{font-size:12px; color:rgba(255,255,255,.55)}
    .formRow{display:grid; grid-template-columns: 120px 1fr; gap:10px; margin:10px 0; align-items:center;}
    label{font-size:13px; color:rgba(255,255,255,.7)}
    input{
      width:100%;
      padding:10px 12px;
      border-radius:12px;
      border:1px solid rgba(255,255,255,.14);
      background: rgba(255,255,255,.06);
      color:var(--text);
      outline:none;
    }
    input:focus{border-color: rgba(156,255,0,.55); box-shadow: 0 0 0 4px rgba(156,255,0,.12)}

    .actions{display:flex; gap:10px; justify-content:flex-end; margin-top:12px; flex-wrap:wrap;}
    .btn{
      padding:10px 12px;
      border-radius:999px;
      border:1px solid rgba(59,130,246,.35);
      background: linear-gradient(90deg, rgba(59,130,246,.18), rgba(59,130,246,.28));
      color: rgba(15,23,42,.96);
      font-weight:700;
      cursor:pointer;
      user-select:none;
    }
    .btn.primary{
      background: linear-gradient(90deg, rgba(156,255,0,.95), rgba(255,229,0,.95));
      color:#0b0b0b;
      border: none;
    }

    .nav{
      position:absolute;
      left:50%;
      bottom:16px;
      transform:translateX(-50%);
      z-index:6;
      display:flex;
      gap:10px;
      padding:8px 10px;
      background: rgba(0,0,0,.35);
      border: 1px solid var(--line);
      border-radius: 22px;
      backdrop-filter: blur(10px);
      max-width: calc(100% - 24px);
      overflow:auto;
      -webkit-overflow-scrolling: touch;
    }
    .nav a{
      width:66px;
      padding:8px 8px;
      border-radius:16px;
      text-decoration:none;
      color:rgba(255,255,255,.78);
      font-size:11px;
      display:flex;
      flex-direction:column;
      align-items:center;
      gap:6px;
      border:1px solid rgba(255,255,255,.10);
      background: rgba(255,255,255,.04);
      user-select:none;
    }
    .icon{
      width:30px;
      height:30px;
      border-radius:12px;
      background: rgba(255,255,255,.08);
      border:1px solid rgba(255,255,255,.12);
      display:grid;
      place-items:center;
      font-weight:900;
      color:rgba(255,255,255,.82);
    }

    .footerNote{
      position:absolute;
      right:16px;
      bottom:16px;
      font-size:11px;
      color:rgba(255,255,255,.45);
    }

    @media (max-width: 860px){
      .grid{grid-template-columns:1fr; grid-template-rows: 1fr auto;}
      .rightCol{padding-top:110px}
      .brand .sf{font-size:48px}
      .login{width: calc(100% - 36px)}
    }
  

    /* ==============================
       Gazete (mode-news) — gelişmiş görünüm
       Not: Bu blok altta olduğu için eski stilleri ezer.
    ============================== */

    body.mode-news{
      background:
        radial-gradient(900px 520px at 20% 10%, rgba(255,229,0,.10), transparent 55%),
        radial-gradient(900px 520px at 85% 15%, rgba(156,255,0,.08), transparent 55%),
        linear-gradient(180deg, #eef2f6, #f7f9fc);
    }

    body.mode-news .frame{ background: transparent; }

    /* Gazete sayfası container */
    body.mode-news #newsPage{
      max-width: 1180px;
      margin: 0 auto;
      padding: 18px 16px 34px;
    }

    .newsHeader{
      display:flex;
      align-items:flex-end;
      justify-content:space-between;
      gap:12px;
      flex-wrap:wrap;
      margin-bottom:14px;
    }
    .newsHeader h2{
      margin:0;
      font-size:24px;
      letter-spacing:-.2px;
      color:#0f172a;
    }
    .newsHeader .sub{
      margin-top:6px;
      font-size:13px;
      color:rgba(15,23,42,.62);
    }

    .newsTools{
      display:flex;
      gap:10px;
      align-items:center;
      flex-wrap:wrap;
    }

    .newsSearch{
      display:flex;
      align-items:center;
      gap:10px;
      padding:10px 12px;
      border-radius:999px;
      border:1px solid rgba(15,23,42,.12);
      background: rgba(255,255,255,.86);
      box-shadow: 0 12px 26px rgba(15, 23, 42, .06);
    }
    .newsSearch input{
      border:none;
      outline:none;
      background:transparent;
      color:#0f172a;
      width:220px;
      font-size:13px;
    }
    .newsChip{
      border:1px solid rgba(15,23,42,.12);
      background: rgba(255,255,255,.72);
      color: rgba(15,23,42,.70);
      border-radius:999px;
      padding:10px 12px;
      font-weight:1000;
      font-size:12.5px;
      cursor:pointer;
      user-select:none;
    }
    .newsChip.active{
      background: linear-gradient(90deg, rgba(156,255,0,.35), rgba(255,229,0,.35));
      color:#0f172a;
      border-color: rgba(15,23,42,.16);
    }

    .ticker{
      display:flex;
      gap:10px;
      align-items:center;
      padding:10px 12px;
      border-radius:16px;
      border:1px solid rgba(15,23,42,.12);
      background: rgba(255,255,255,.86);
      backdrop-filter: blur(10px);
      box-shadow: 0 12px 26px rgba(15, 23, 42, .06);
      margin-bottom:14px;
    }
    .badgeLive{
      font-weight:1100;
      letter-spacing:.25px;
      font-size:11px;
      padding:6px 10px;
      border-radius:999px;
      background: rgba(239,68,68,.12);
      border:1px solid rgba(239,68,68,.25);
      color: rgba(127,29,29,.95);
    }
    .ticker strong{ color:#0f172a; }
    .ticker span{ color: rgba(15,23,42,.70); font-size:13px; }

    .newsGrid{ display:grid; grid-template-columns: 1fr 1fr 1fr; gap:16px; }
    .newsCol{ display:grid; gap:12px; align-content:start; }

    .newsCard{
      padding:14px;
      border:1px solid rgba(15, 23, 42, .10);
      border-radius:18px;
      background: linear-gradient(180deg, #ffffff, #fbfcff);
      box-shadow: 0 12px 26px rgba(15, 23, 42, .06);
      transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    }
    .newsCard:hover{
      transform: translateY(-2px);
      box-shadow: 0 18px 38px rgba(15, 23, 42, .10);
      border-color: rgba(15, 23, 42, .16);
    }

    .newsTag{
      display:inline-flex;
      align-items:center;
      gap:8px;
      margin-bottom:10px;
      padding:7px 10px;
      border-radius:999px;
      border:1px solid rgba(15,23,42,.10);
      background: rgba(15,23,42,.04);
      font-weight:1100;
      font-size:12px;
      color: rgba(15,23,42,.72);
    }
    .tag-transfer{ background: rgba(156,255,0,.14); border-color: rgba(156,255,0,.35); }
    .tag-loto{ background: rgba(255,229,0,.16); border-color: rgba(255,229,0,.42); }
    .tag-zengin{ background: rgba(90,140,210,.14); border-color: rgba(90,140,210,.30); }

    .newsCard h5{ margin:0; font-size:15px; letter-spacing:.1px; color:#0f172a; }
    .newsMeta{ margin-top:8px; display:flex; gap:8px; flex-wrap:wrap; align-items:center; color: rgba(15,23,42,.62); font-size:12px; }
    .newsDot{ width:4px; height:4px; border-radius:99px; background: rgba(15,23,42,.28); }
    .newsCard p{ margin:10px 0 0 0; color: rgba(15,23,42,.72); line-height:1.45; font-size:13px; }

    .hero{ padding:0; overflow:hidden; }
    .heroTop{
      height:140px;
      background:
        radial-gradient(900px 180px at 20% 40%, rgba(255,229,0,.35), transparent 60%),
        radial-gradient(900px 180px at 75% 55%, rgba(156,255,0,.26), transparent 60%),
        linear-gradient(90deg, rgba(17,17,17,.92), rgba(42,47,58,.92));
      position:relative;
    }
    .heroTop:after{
      content:"";
      position:absolute;
      inset:0;
      background: linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.55));
      opacity:.55;
    }
    .heroBody{ padding:14px; }

    .miniGrid{ display:grid; gap:10px; }
    .mini{
      padding:12px;
      border-radius:16px;
      border:1px solid rgba(15,23,42,.10);
      background: rgba(255,255,255,.72);
    }
    .miniTitle{ font-weight:1100; color:#0f172a; font-size:13px; }
    .miniText{ margin-top:6px; color: rgba(15,23,42,.70); font-size:12.5px; line-height:1.35; }

    .rankRow{ display:flex; justify-content:space-between; gap:10px; padding:10px 10px; border:1px solid rgba(15,23,42,.08); border-radius:14px; background: rgba(15,23,42,.03); }
    .rankRow strong{ font-weight:1100; color:#0f172a; }
    .rankRow span{ color: rgba(15,23,42,.62); font-weight:1000; }

    @media (max-width: 860px){
      .newsGrid{ grid-template-columns:1fr; }
      .newsSearch input{ width: 160px; }
    }

    /* ====== İstek: 5.YIL şeridi kaldır + sağ kolon (istatistik/bilgi) küçült ====== */
    .ribbon{ display:none !important; }

    /* Giriş (Bağlan) ve Üye Ol ekranlarında üst bar görünmesin */
    body:not(.mode-news):not(.mode-player) .topbar{ display:none !important; }


    /* Giriş ekranında sağdaki kutuları daha kompakt yap */
    body:not(.mode-news):not(.mode-register) .rightCol{ gap:10px; padding-top:82px; display:flex; flex-direction:column; }

    /* Sağ kolonun (blurlu panellerin) kapladığı alanı küçült */
    body:not(.mode-news):not(.mode-register) .grid{ grid-template-columns: 1.35fr .65fr; }
    body:not(.mode-news):not(.mode-register) .panel{ backdrop-filter: blur(6px); border-radius:16px; }
    body:not(.mode-news):not(.mode-register) .stats{ padding:9px; }
    body:not(.mode-news):not(.mode-register) .stats h4{ font-size:12px; margin:0 0 8px 0; letter-spacing:.15px; }
    body:not(.mode-news):not(.mode-register) .statRow{ padding:5px 8px; font-size:12px; }

    body:not(.mode-news):not(.mode-register) .info{ padding:11px; gap:7px; }
    body:not(.mode-news):not(.mode-register) .info h3{ font-size:14px; margin:0; }
    body:not(.mode-news):not(.mode-register) .bullet{ font-size:12px; line-height:1.32; }
    body:not(.mode-news):not(.mode-register) .dot{ width:7px; height:7px; margin-top:6px; box-shadow: 0 0 0 3px rgba(255,229,0,.12); }

    /* ==============================
       ÜYE OL (mode-register) — referans görsele yakın beyaz sayfa
       - Maç saatleri kutusu YOK
       - Server seçimi YOK
    ============================== */

    body.mode-register{
      background:#f4f6f9;
      padding:0;
      align-items:stretch;
      justify-content:stretch;
    }
    body.mode-register .frame{
      width:100%;
      min-height:100vh;
      aspect-ratio:auto;
      border-radius:0;
      box-shadow:none;
      background:#fff;
    }
    body.mode-register .brand,
    body.mode-register .ribbon,
    body.mode-register .rightCol,
    body.mode-register .login,
    body.mode-register .nav,
    body.mode-register .footerNote,
    body.mode-register .newsTopShadow,
    body.mode-register #newsSubbar{
      display:none !important;
    }
    body.mode-register .grid{ display:none !important; }
    body.mode-register .topbar{
      position:sticky;
      top:0;
      padding:0;
      height:92px;
      display:flex;
      align-items:stretch;
      gap:0;
      background:
        linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.55)),
        radial-gradient(900px 220px at 35% 50%, rgba(255,229,0,.22), transparent 55%),
        radial-gradient(900px 220px at 70% 50%, rgba(156,255,0,.18), transparent 55%),
        linear-gradient(90deg, #111, #2a2f3a);
      border-bottom:1px solid rgba(0,0,0,.18);
      z-index:10;
    }
    body.mode-register .topTitle{
      display:flex;
      align-items:center;
      gap:10px;
      padding:0 16px;
      font-size:44px;
      font-weight:1000;
      letter-spacing:-1px;
      background:transparent;
      border:none;
      color:#fff;
      text-shadow: 0 10px 28px rgba(0,0,0,.45);
      backdrop-filter:none;
      line-height:1;
      white-space:nowrap;
    }
    body.mode-register .topTitle .a{ color: var(--accent2); }
    body.mode-register .topTitle .b{ color: var(--accent); }

    body.mode-register #topExtras{
      display:flex;
      align-items:center;
      justify-content:flex-end;
      gap:12px;
      padding:0 16px;
      width:100%;
    }

    body.mode-register #newsPage{
      display:block !important;
      max-width: 1180px;
      margin: 0 auto;
      padding: 18px 16px 34px;
    }


    /* ==============================
       FUTBOLCU DETAY (mode-player) — referans görsel gibi klasik tam sayfa
    ============================== */
    body.mode-player{
      background:#ffffff;
      padding:0;
      align-items:stretch;
      justify-content:stretch;
    }
    body.mode-player .frame{
      width:100%;
      min-height:100vh;
      aspect-ratio:auto;
      border-radius:0;
      box-shadow:none;
      background:#fff;
    }
    body.mode-player .brand,
    body.mode-player .ribbon,
    body.mode-player .rightCol,
    body.mode-player .login,
    body.mode-player .nav,
    body.mode-player .footerNote,
    body.mode-player .newsTopShadow,
    body.mode-player .grid{
      display:none !important;
    }
    body.mode-player #newsPage{
      display:block !important;
      max-width:none;
      margin:0;
      padding:0;
    }

    .regGrid{
      display:grid;
      grid-template-columns: 1.45fr .55fr;
      gap:16px;
      align-items:start;
    }
    @media (max-width: 980px){
      .regGrid{ grid-template-columns:1fr; }
    }

    .regCard{
      border:1px solid rgba(0,0,0,.12);
      border-radius:8px;
      overflow:hidden;
      background:#fff;
      box-shadow: 0 10px 24px rgba(15,23,42,.06);
    }
    .regHead{
      background: linear-gradient(180deg, rgba(0,0,0,.75), rgba(0,0,0,.55));
      color:#ffe500;
      font-weight:1000;
      padding:10px 12px;
      border-bottom:1px solid rgba(0,0,0,.18);
    
      display:flex;
      align-items:center;
      gap:10px;
    }
    .regHeadTitle{ flex:1; }
    .regBack{
      border-radius:6px;
      padding:6px 10px;
      border:1px solid rgba(255,255,255,.18);
      background: rgba(255,255,255,.08);
      color: rgba(255,255,255,.92);
      font-weight:1100;
      cursor:pointer;
    }
    .regBack:hover{ filter:brightness(1.05); }

    .regBody{ padding:14px; }

    .regRow{
      display:grid;
      grid-template-columns: 150px 1fr;
      gap:12px;
      align-items:center;
      margin:10px 0;
    }
    .regRow label{ color: rgba(15,23,42,.75); font-weight:800; font-size:13px; }
    .regRow input,
    .regRow select{
      padding:10px 12px;
      border-radius:4px;
      border:1px solid rgba(0,0,0,.18);
      background:#fff;
      color:#111;
      outline:none;
    }
    .regRow input:focus,
    .regRow select:focus{
      border-color: rgba(46,125,50,.55);
      box-shadow: 0 0 0 4px rgba(46,125,50,.12);
    }

    .regNote{
      margin-top:10px;
      padding:12px;
      border:1px solid rgba(0,0,0,.12);
      border-radius:6px;
      background: rgba(15,23,42,.03);
      color: rgba(15,23,42,.72);
      font-weight:800;
      font-size:12.5px;
      line-height:1.45;
    }

    .regActions{ display:flex; justify-content:flex-end; gap:10px; margin-top:14px; flex-wrap:wrap; }
    .regBtn{
      border-radius:6px;
      padding:10px 14px;
      border:1px solid rgba(0,0,0,.18);
      background:#fff;
      font-weight:1000;
      cursor:pointer;
    }
    .regBtn.primary{
      background: linear-gradient(90deg, rgba(156,255,0,.95), rgba(255,229,0,.95));
      border:none;
      color:#0b0b0b;
    }

    .sideCard{
      border:1px solid rgba(0,0,0,.12);
      border-radius:8px;
      overflow:hidden;
      background:#fff;
      box-shadow: 0 10px 24px rgba(15,23,42,.06);
    }
    .sideHead{
      background: rgba(15,23,42,.06);
      padding:10px 12px;
      font-weight:1100;
      color:#0f172a;
      border-bottom:1px solid rgba(0,0,0,.08);
    }
    .sideBody{ padding:12px; color: rgba(15,23,42,.72); font-weight:800; font-size:12.5px; line-height:1.45; }
    .sideBody ul{ margin:8px 0 0 18px; padding:0; }
    .sideBody li{ margin:8px 0; }

  

    /* === Klasik "Tamam" görsel butonu (PNG) === */
    .okBtnImg{
      width:120px;
      height:18px;
      border:none;
      padding:0;
      background: transparent;
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAASCAYAAACQCxruAAAFHUlEQVR4AexYbWyTVRg9vG3HxraO0tExNjYYGEYENKg/CIlBWTJIREURE1CMBn8AEoySQEIwUYgEjT9EQviIEcGYmRjxDxgNIRBxsGRmYNxnu+6jG3FM2fe6re/7Xu+5s6UZM21HCWVpk5M+93nOc+7tPb33bapBvrw+j9hzbJt49/gm8d7XSTzMe0AP6SU9ldZCq6qtFJ9f2IsRexe0TBOwJfEw7wE9pJf0tLL6mtBOXzwCYTOgm4EkJtEe0NNvLh2FNpjaFXdje8wRdOvDcddNfgljO4T+1G5owiqbRPzQJwzYHTORnjUDt/1+6HHUTmrF5pOw6tB0U0e8MCAEshwuFBUUIj83D6mZDnT2DNyT/s6SAzi++dxdYD5e657MOpopdMQDfkxB1vQczJtTKA014GnyormpFfZ0yz3pf/rzLrz51SoF/ioMxsw7M2aiOHcpCmYUjTsH6+G18bhptjSlwdr/7QNr5LFOzfAxc4kMLSCfl9FCpFiAtKkYyx8UFkyfPgtz5cnV5RVdXVsHj7sJs10W6GLkLv7Y/mjHNDjIXThrKXaVfoI1S17F1mf24YO1R0PzvF96CMTWlftU7fXlO1WdXPYsK1wR4h5af0ZprH9iC45s/BGO9GxVoz5r1GUf49WLX1Fzkkv94FoS+T1qg5FihS3LidzcBRApd0wehg0zHLnS3AIY0tya/8ydlSPiai43MdzgqrZy7Chbh/3ntqt3ASFP4uPKHCFM/NFWgT1nNys8W/w8Tvz6seKeuHIQKxc+p3jUfOt0icqTe6HuLJ6c+7Sq6fJmo+b+89tVnbVC5yNqLnJZK84dnY86iQrNMHREgiUlFWny+i1yzUO23QlY7TCnpEJHGpyOPBQUFIDPsaC5rpny2pfP9ki6sdYhX8GeVOs0bFmxGwdfPIXv3q5AUXYxTNNQn0XI3wKeW9Uq7h3skl2Au+NPNe7zd4P1oM7apa9h75rDoMYLj22GKb8crFGro6cN7Oe4b6gHns4apcFxvxyTwziRoRkBgUgY6uuHMDV09/fCYrXi0fmL4MopQt7sBcjPzwe/7bV1DWh0NyPbocPUI2tGmnO8Op0K5jc9tUOuCTh68QDWfbEMN3wVoXmlv6GY/PA+ro115lctXIfl80rwQ+UppXGm/DCEMbr2cB65zBOMCWqQwziRoZkBE5FgjBj421uLto6baPQ1wWqzYs7sPGS7nJDdqKttgNfdAmdmAEKXmSg0I805Xp1GBfM59jxcb74Kd3s1plkykJGSKU0dnVve1qGY/PA+U65P1eUa062ZuN5yDVXeq2oPXBl5oInsCedxzDzBmFAaUotxIkPT5QmOBoERE90+L9rab8LtbZTPKXm1m6Y0140maW5W2ggMeXKj0Zooh0YFe89XfY9tJfvw4UvHFNKn2mEYAOvCFKGY4/A+clhn/nLNLyhd8rLq/2zjt5jvWgRD/lPLWjhPjWU+WOOYGuQwTmRo+rCBqDGkY+AvH3yt7Wiob0R9rTTX04IM6xB4yqPWiWXOMG7pR4tDa7104ye8c3IDyq58ie0nNuCNw6tRWf+bqu8+vSUUc03hfeSwznxbR4vqowZz1Cm7fFJphPPIZZ5gTJBPDuNEhryihbyeYoA8ycbtTrQ0+9DsaUUGhiDkLWA+ALTf8uH3+vLY1j9mnb19PUqD7w/iM9zvOaXBptygWGHA1t+DdN0/gd5Y50ryTfl7YaLQAn4DSUzePdD+8Q7gDpLxZNuLfwEAAP//uJDI4AAAAAZJREFUAwA8BwR3o90baQAAAABJRU5ErkJggg==");
      background-size: 120px 18px;
      background-repeat:no-repeat;
      background-position:center;
      cursor:pointer;
      display:inline-block;
      vertical-align:middle;
      user-select:none;
    }
    .okBtnImg:hover{ filter: brightness(1.05); }
    .okBtnImg:active{ transform: translateY(1px); }
    .okBtnImg:focus{ outline: 2px solid rgba(156,255,0,.55); outline-offset: 3px; border-radius: 3px; }
    .okBtnImg:disabled{
      opacity:.55;
      filter: grayscale(.35) brightness(.95);
      cursor:not-allowed;
      transform:none;
    }

    /* Admin Panel */
    .flagMini{
      width:22px; height:14px; border-radius:2px; display:inline-block;
      border:1px solid rgba(0,0,0,.22);
      background-size:cover;
      background-position:center;
      vertical-align:middle;
      margin-right:0px;
    }
    .flag-generic{ background: linear-gradient(135deg, rgba(34,197,94,.35), rgba(59,130,246,.35)); }
    .adminGrid{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:14px;
    }
    @media (max-width: 980px){
      .adminGrid{ grid-template-columns: 1fr; }
    }
    .adminCard{
      border:1px solid rgba(15,23,42,.10);
      border-radius:16px;
      background: rgba(255,255,255,.75);
      box-shadow: 0 10px 20px rgba(2,6,23,.06);
      margin-bottom:10px;
      overflow:hidden;
    }
    .adminCardHead{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
      padding:10px 12px;
      background: rgba(241,245,249,.85);
      border-bottom:1px solid rgba(15,23,42,.08);
    }
    .adminCardBody{ padding:10px 12px; }
    .adminRow{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
      padding:8px 0;
      border-bottom:1px dashed rgba(15,23,42,.10);
    }
    .adminRow:last-child{ border-bottom:none; }
    .btn.tiny{
      padding:6px 10px;
      border-radius:10px;
      font-size:12px;
      background: linear-gradient(90deg, rgba(59,130,246,.20), rgba(59,130,246,.30));
      border:1px solid rgba(59,130,246,.40);
      color: rgba(15,23,42,.96);
    }
    .btn.danger{
      background: linear-gradient(90deg, rgba(239,68,68,.92), rgba(176,0,0,.92));
      border:none;
      color:#fff;
    }


    /* Pro Admin Panel (v2) */
    .apShell{
      background: rgba(255,255,255,.85);
      border:1px solid rgba(0,0,0,.10);
      border-radius:22px;
      padding:14px;
      color: rgba(15,23,42,.95);
      box-shadow: 0 18px 50px rgba(0,0,0,.08);
    }
    .apHeader{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:12px;
      flex-wrap:wrap;
      margin-bottom:10px;
    }
    .apHeaderRight{
      display:flex;
      gap:10px;
      align-items:center;
      flex-wrap:wrap;
      justify-content:flex-end;
    }
    .apTitle{ font-size:22px; font-weight:1000; letter-spacing:.2px; color: rgba(2,6,23,.96); }
    .apSub{ font-weight:850; opacity:.75; margin-top:2px; }
    .apTabs{
      display:flex; gap:8px; flex-wrap:wrap;
      padding:6px;
      background: rgba(15,23,42,.04);
      border:1px solid rgba(15,23,42,.08);
      border-radius:16px;
      margin-bottom:12px;
    }
    .apTab{
      appearance:none; border:1px solid rgba(15,23,42,.10);
      background: rgba(255,255,255,.65);
      padding:9px 12px;
      border-radius:14px;
      font-weight:950;
      cursor:pointer;
      color: rgba(15,23,42,.92);
      transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
    }
    .apTab:hover{ transform: translateY(-1px); box-shadow: 0 10px 25px rgba(0,0,0,.08); }
    .apTab.active{
      background: rgba(156,255,0,.22);
      border-color: rgba(156,255,0,.45);
      box-shadow: 0 12px 28px rgba(156,255,0,.10);
    }

    .apSubTabs{
      display:flex;
      gap:8px;
      flex-wrap:wrap;
      padding:6px;
      background: rgba(15,23,42,.03);
      border:1px solid rgba(15,23,42,.10);
      border-radius: 18px;
      margin: 0 0 12px 0;
    }
    .apSubTab{
      appearance:none;
      border:1px solid rgba(15,23,42,.12);
      background: rgba(255,255,255,.70);
      padding:8px 10px;
      border-radius: 16px;
      font-weight: 950;
      cursor: pointer;
      color: rgba(15,23,42,.92);
      transition: transform .12s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease;
      font-size: 13px;
      line-height: 1;
    }
    .apSubTab:hover{ transform: translateY(-1px); box-shadow: 0 10px 25px rgba(0,0,0,.06); }
    .apSubTab.active{
      background: rgba(156,255,0,.22);
      border-color: rgba(156,255,0,.45);
      box-shadow: 0 12px 28px rgba(156,255,0,.10);
    }
    .apBulkNationRow{ display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap; }
    .apToggle{ display:flex; gap:8px; align-items:center; font-weight:950; opacity:.92; }
    .apToggle span{ color: rgba(2,6,23,.98) !important; }
    .apToggle input{ accent-color: #1f4aa8; }
    .apSearch input{
      width: 220px;
      padding:10px 12px;
      border-radius:14px;
      border:1px solid rgba(15,23,42,.14);
      background: rgba(255,255,255,.78);
      font-weight:900;
      color: rgba(15,23,42,.92);
    }
    .apBody{ min-height: 360px; }
    .apLayout{
      display:grid;
      grid-template-columns: 1.7fr 1fr;
      gap:12px;
      align-items:start;
    }
    @media (max-width: 980px){
      .apLayout{ grid-template-columns: 1fr; }
      .apSearch input{ width: 100%; }
    }
    .apCard{
      background: rgba(255,255,255,.92);
      border:1px solid rgba(15,23,42,.10);
      border-radius:18px;
      padding:12px;
      box-shadow: 0 10px 30px rgba(0,0,0,.06);
    }
    .apCardTitle{ font-weight:1000; margin-bottom:10px; }
    .apTable{ width:100%; border-collapse:collapse; overflow:hidden; }
    .apTable thead th{
      text-align:left;
      font-size:12px;
      letter-spacing:.3px;
      text-transform:uppercase;
      font-weight:1000;
      padding:10px 10px;
      border-bottom:1px solid rgba(15,23,42,.10);
      color: rgba(15,23,42,.70);
    }
    .apTable tbody td{
      padding:10px 10px;
      border-bottom:1px solid rgba(15,23,42,.08);
      font-weight:900;
      color: rgba(15,23,42,.92);
      vertical-align:middle;
    }
    .apTable tbody tr:hover td{ background: rgba(15,23,42,.03); }
    .apTable tbody tr.isInactive td{ opacity:.55; }
    .apEmptyCell{ padding:14px 10px; opacity:.75; font-weight:950; }
    .apCellFlag .flagMini{ transform: translateY(1px); }
    .apMono{ font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-weight:950; }
    .apBadge{
      display:inline-flex; align-items:center; gap:6px;
      padding:6px 10px;
      border-radius:999px;
      font-weight:1000;
      font-size:12px;
      border:1px solid rgba(15,23,42,.12);
      background: rgba(255,255,255,.7);
    }
    .apBadge.ok{ background: rgba(34,197,94,.14); border-color: rgba(34,197,94,.25); color: rgba(20,83,45,.95); }
    .apBadge.off{ background: rgba(148,163,184,.22); border-color: rgba(148,163,184,.35); color: rgba(30,41,59,.92); }
    .apActions{ display:flex; gap:8px; justify-content:flex-end; }
    .apBtn{
      appearance:none;
      padding:8px 10px;
      border-radius:12px;
      border:1px solid rgba(59,130,246,.35);
      background: linear-gradient(90deg, rgba(59,130,246,.16), rgba(59,130,246,.26));
      font-weight:950;
      cursor:pointer;
      color: rgba(15,23,42,.96);
    }
    .apBtn.warn{
      background: linear-gradient(90deg, rgba(245,158,11,.28), rgba(245,158,11,.36));
      border-color: rgba(245,158,11,.45);
      color: rgba(120,53,15,.98);
    }
    .apBtn.dangerStrong{
      background: linear-gradient(90deg, rgba(239,68,68,1), rgba(176,0,0,.95));
      border: none;
      color: #fff;
      box-shadow: 0 2px 6px rgba(176,0,0,.25);
    }
    .apForm label{ display:block; font-weight:950; opacity:.82; margin:10px 0 6px; }
    .apForm input, .apForm select{
      width:100%;
      padding:10px 12px;
      border-radius:14px;
      border:1px solid rgba(15,23,42,.14);
      background: rgba(255,255,255,.85);
      color: rgba(15,23,42,.95);
      font-weight:900;
    }
    .apForm input:disabled{ opacity:.7; }

    /* Admin panel kartlarının içindeki inputlar global (dark) input stilini ezsin.
       Aksi halde yazı beyaz kalıp beyaz zeminde görünmüyor. */
    .apCard input:not([type]),
    .apCard input[type="text"],
    .apCard input[type="number"],
    .apCard input[type="search"],
    .apCard input[type="url"],
    .apCard input[type="email"],
    .apCard input[type="password"],
    .apCard textarea,
    .apCard select{
      background: rgba(255,255,255,.85) !important;
      color: rgba(15,23,42,.95) !important;
      border: 1px solid rgba(15,23,42,.14) !important;
    }
    .apCard input::placeholder,
    .apCard textarea::placeholder{ color: rgba(15,23,42,.45) !important; }
    .apToggleLine{ display:flex; gap:10px; align-items:center; margin-top:10px; }
    .apFormBtns{ display:flex; gap:10px; flex-wrap:wrap; margin-top:12px; }
    .apHint{ margin-top:10px; opacity:.78; font-weight:900; }
    .apRow{ display:flex; gap:10px; align-items:end; justify-content:space-between; flex-wrap:wrap; margin-bottom:10px; }
    .apField{ min-width: 240px; flex: 1 1 auto; }
    .apFieldLbl{ font-weight:950; opacity:.78; margin-bottom:6px; }
    .apTools{ display:flex; gap:10px; flex-wrap:wrap; }
    .apEmpty{ padding:16px; font-weight:950; opacity:.85; }

/* Supabase strict-mode notice */
.sbNotice{
  margin: 10px 0 14px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.06);
}
.sbNotice.warn{
  border-color: rgba(255,80,80,.35);
  background: rgba(255,80,80,.08);
}
.sbNoticeMsg{
  margin-top: 6px;
  font-size: 12px;
  line-height: 1.35;
  opacity: .85;
}




/* -------------------------
   Global Supabase işlem ekranı
   (Sayfayı kilitle + ortada spinner)
   ------------------------- */
.sfBusyOverlay{
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(2px);
  z-index: 999999;
  pointer-events: all;
  cursor: wait;
}
.sfBusyOverlay.on{ display:flex; }

.sfBusyBox{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap: 12px;
  padding: 18px 20px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(20,24,20,.62);
  box-shadow: 0 12px 50px rgba(0,0,0,.55);
  color: rgba(255,255,255,.92);
  text-align:center;
  min-width: 220px;
}

.sfSpinner{
  width: 52px;
  height: 52px;
  border-radius: 999px;
  border: 5px solid rgba(255,255,255,.22);
  border-top-color: rgba(255,255,255,.92);
  animation: sfSpin 0.9s linear infinite;
}

@keyframes sfSpin{
  to{ transform: rotate(360deg); }
}

.sfBusyText{
  font-size: 14px;
  font-weight: 950;
  letter-spacing: .2px;
  opacity: .92;
}

body.sf-busy{
  /* Kullanıcı etkileşimini overlay yakalar; burada sadece küçük ipucu */
  cursor: wait;
}

    /* -------------------------
       Mobil stabilite yamaları
       (PC görünümü bozulmadan)
       ------------------------- */
    @media (max-width: 560px){
      body{
        overflow-x:hidden;
        padding:12px;
        align-items:stretch;
        justify-content:flex-start;
      }

      /* Landing (giriş) ekranı: 16:10 kart küçülmesin */
      .frame{
        width:100%;
        height: calc(100vh - 24px);
        aspect-ratio:auto;
      }

      .login{
        left:12px;
        right:12px;
        width:auto;
        bottom:96px;
      }

      .topbar{ flex-wrap:wrap; gap:8px; padding:10px 10px; }
      .topTitle{ font-size:16px; padding:8px 10px; }
      .topRight{ flex-wrap:wrap; gap:8px; justify-content:flex-end; }
      .badge{ padding:8px 10px; font-size:12px; }

      .grid{ padding:110px 10px 18px; gap:12px; }
      .card{ padding:14px; }
      .pill{ font-size:12px; padding:6px 10px; }

      /* Admin panel ve formlar */
      .apRow{ flex-direction:column !important; align-items:stretch !important; }
      .apField{ width:100% !important; }
      input, select, textarea{ width:100%; max-width:100%; }

      /* Kart gridleri tek kolona */
      .newsGrid{ grid-template-columns:1fr !important; }

      /* Tablolar taşmasın */
      table{ display:block; width:100%; overflow-x:auto; -webkit-overflow-scrolling: touch; }
      th, td{ white-space:nowrap; }

      /* Alt menü: daha dar */
      .nav{ bottom:10px; gap:8px; padding:8px 8px; }
      .nav a{ width:60px; }
    }
/* ==========================================================
   Login ekranı sadeleştirme + Şifremi Unuttum akışı (2025-12-25)
   - Sağ kolon / alt bar kaldırıldı
   - Şifremi Unuttum (kırmızı) + Üye Ol (koyu yeşil)
   - /forgot ve /reset standalone sayfaları
   ========================================================== */

/* Giriş ekranında (login) grid tek kolon olsun (sağ kolon yok) */
body:not(.mode-news):not(.mode-register):not(.mode-player):not(.mode-forgot):not(.mode-reset) .grid{
  grid-template-columns: 1fr !important;
}

/* Alt menü kaldırıldığı için giriş kartını daha aşağı değil, en alta yaklaştır */
body:not(.mode-news):not(.mode-register):not(.mode-player):not(.mode-forgot):not(.mode-reset) .login{
  bottom: 18px !important;
}

/* Buton varyantları */
.btn.register{
  background: linear-gradient(90deg, rgba(16, 118, 46, .95), rgba(9, 88, 33, .95)) !important;
  border: none !important;
  color: #fff !important;
}
.btn.register:hover{ filter: brightness(1.06); }

.btn.danger{
  background: linear-gradient(90deg, rgba(220, 38, 38, .95), rgba(153, 27, 27, .95)) !important;
  border: none !important;
  color: #fff !important;
}
.btn.danger:hover{ filter: brightness(1.06); }

/* Çok küçük ekranlarda kayıt/şifre sayfalarında label-input taşmasın */
@media (max-width: 520px){
  .regRow{ grid-template-columns: 1fr !important; gap: 6px !important; }
}

/* ==============================
   ŞİFREMİ UNUTTUM (mode-forgot)
   ============================== */

body.mode-forgot,
body.mode-reset{
  background:#f4f6f9;
  padding:0;
  align-items:stretch;
  justify-content:stretch;
}

body.mode-forgot .frame,
body.mode-reset .frame{
  width:100%;
  min-height:100vh;
  aspect-ratio:auto;
  border-radius:0;
  box-shadow:none;
  background:#fff;
}

/* Eski giriş elemanlarını gizle */
body.mode-forgot .brand,
body.mode-reset .brand,
body.mode-forgot .ribbon,
body.mode-reset .ribbon,
body.mode-forgot .rightCol,
body.mode-reset .rightCol,
body.mode-forgot .login,
body.mode-reset .login,
body.mode-forgot .nav,
body.mode-reset .nav,
body.mode-forgot .footerNote,
body.mode-reset .footerNote,
body.mode-forgot .newsTopShadow,
body.mode-reset .newsTopShadow,
body.mode-forgot #newsSubbar,
body.mode-reset #newsSubbar,
body.mode-forgot .grid,
body.mode-reset .grid{
  display:none !important;
}

/* İçerik alanı */
body.mode-forgot #newsPage,
body.mode-reset #newsPage{
  display:block !important;
  max-width: 1180px;
  margin: 0 auto;
  padding: 18px 16px 34px;
}

/* Topbar (login'de gizliydi) bu modlarda görünür olsun */
body.mode-forgot .topbar,
body.mode-reset .topbar{
  display:flex !important;
  position:sticky;
  top:0;
  padding:0;
  height:92px;
  align-items:stretch;
  gap:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.55)),
    radial-gradient(900px 220px at 35% 50%, rgba(255,229,0,.22), transparent 55%),
    radial-gradient(900px 220px at 70% 50%, rgba(156,255,0,.18), transparent 55%),
    linear-gradient(90deg, #111, #2a2f3a);
  border-bottom:1px solid rgba(0,0,0,.18);
  z-index:10;
}

body.mode-forgot .topTitle,
body.mode-reset .topTitle{
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 16px;
  font-size:44px;
  font-weight:1000;
  letter-spacing:-1px;
  background:transparent;
  border:none;
  color:#fff;
  text-shadow: 0 10px 28px rgba(0,0,0,.45);
  backdrop-filter:none;
  line-height:1;
  white-space:nowrap;
}

body.mode-forgot #topExtras,
body.mode-reset #topExtras{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  padding:0 16px;
  width:100%;
}


/* ==========================================================
   Login ekranı sadeleştirme + Şifremi Unuttum akışı (2025-12-25)
   ========================================================== */

/* Giriş ekranında (login) grid tek kolon olsun (sağ kolon yok) */
body:not(.mode-news):not(.mode-register):not(.mode-player):not(.mode-forgot):not(.mode-reset) .grid{
  grid-template-columns: 1fr !important;
}

/* Alt menü kalktığı için login kartını biraz aşağıdan yukarı al */
body:not(.mode-news):not(.mode-register):not(.mode-player):not(.mode-forgot):not(.mode-reset) .login{
  bottom: 18px !important;
}

/* Özel buton renkleri */
.btn.register{
  background: linear-gradient(90deg, rgba(20,120,35,.95), rgba(10,85,25,.95));
  border: 1px solid rgba(0,0,0,.0);
  color: #fff;
}
.btn.register:hover{ filter: brightness(1.06); }

.btn.danger{
  background: linear-gradient(90deg, rgba(220,38,38,.92), rgba(153,27,27,.92));
  border: 1px solid rgba(0,0,0,.0);
  color: #fff;
}
.btn.danger:hover{ filter: brightness(1.06); }

/* Küçük ekranlarda register/forgot form satırları taşmasın */
@media (max-width: 520px){
  .regRow{ grid-template-columns: 1fr; gap:6px; }
}

/* ==============================
   ŞİFREMİ UNUTTUM (mode-forgot) + ŞİFRE SIFIRLA (mode-reset)
   - Üye Ol sayfasıyla aynı beyaz standalone görünüm
============================== */

body.mode-forgot,
body.mode-reset{
  background:#f4f6f9;
  padding:0;
  align-items:stretch;
  justify-content:stretch;
}

body.mode-forgot .frame,
body.mode-reset .frame{
  width:100%;
  min-height:100vh;
  aspect-ratio:auto;
  border-radius:0;
  box-shadow:none;
  background:#fff;
}

body.mode-forgot .brand,
body.mode-forgot .ribbon,
body.mode-forgot .rightCol,
body.mode-forgot .login,
body.mode-forgot .nav,
body.mode-forgot .footerNote,
body.mode-forgot .newsTopShadow,
body.mode-forgot #newsSubbar,
body.mode-forgot .grid,
body.mode-reset .brand,
body.mode-reset .ribbon,
body.mode-reset .rightCol,
body.mode-reset .login,
body.mode-reset .nav,
body.mode-reset .footerNote,
body.mode-reset .newsTopShadow,
body.mode-reset #newsSubbar,
body.mode-reset .grid{
  display:none !important;
}

body.mode-forgot #newsPage,
body.mode-reset #newsPage{
  display:block !important;
  max-width: 920px;
  margin: 0 auto;
  padding: 18px 16px 34px;
}

/* Login ekranında topbar gizliydi; forgot/reset ekranlarında tekrar göster */
body.mode-forgot .topbar,
body.mode-reset .topbar{
  display:flex !important;
  position:sticky;
  top:0;
  padding:0;
  height:92px;
  align-items:stretch;
  gap:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.55)),
    radial-gradient(900px 220px at 35% 50%, rgba(255,229,0,.22), transparent 55%),
    radial-gradient(900px 220px at 70% 50%, rgba(156,255,0,.18), transparent 55%),
    linear-gradient(90deg, #111, #2a2f3a);
  border-bottom:1px solid rgba(0,0,0,.18);
  z-index:10;
}

body.mode-forgot .topTitle,
body.mode-reset .topTitle{
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 16px;
  font-size:38px;
  font-weight:1000;
  letter-spacing:-1px;
  background:transparent;
  border:none;
  color:#fff;
  text-shadow: 0 10px 28px rgba(0,0,0,.45);
  backdrop-filter:none;
  line-height:1;
}

body.mode-forgot .topExtras,
body.mode-reset .topExtras{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  padding:0 12px;
}

/* Üst barda teklif uyarısı (renderTopExtras içinde) */
.offerNotice{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:56px;
  padding:0 12px;
  border-radius:14px;
  border:1px solid rgba(239,68,68,.35);
  background: rgba(239,68,68,.12);
  color: rgba(127,29,29,.98);
  font-weight:1100;
  text-decoration:none;
  white-space:nowrap;
}
.offerNotice:hover{ filter: brightness(0.98); }


/* ==========================================================
   Mobil: Uygulama (mode-news) Scroll + Responsive düzeltmeler
   - Mobilde sayfa aşağı/yana kaymama sorunu: 560px altında .frame sabit yükseklik + overflow:hidden
     olduğu için içerik kırpılıyordu.
   - Bu blok, login ekranını bozmadan sadece uygulama modlarında scroll'u geri getirir.
   ========================================================== */

@media (max-width: 560px){
  /* App modlarında body padding'i sıfırla (üst barlar full genişlik) */
  body.mode-news,
  body.mode-register,
  body.mode-player,
  body.mode-forgot,
  body.mode-reset{
    padding:0 !important;
    overflow-x:hidden;
    align-items:stretch !important;
    justify-content:flex-start !important;
  }

  /* Önceki "mobil stabilite" kuralı .topbar/.topExtras'a genel müdahale ediyordu.
     Uygulama modlarında (mode-news/register/forgot/reset) üst barı tekrar sabit hale getiriyoruz. */
  body.mode-news .topbar,
  body.mode-register .topbar,
  body.mode-forgot .topbar,
  body.mode-reset .topbar{
    flex-wrap:nowrap !important;
    height:92px !important;
    padding:0 !important;
    border-radius:0 !important;
  }

  body.mode-news .topTitle,
  body.mode-register .topTitle,
  body.mode-forgot .topTitle,
  body.mode-reset .topTitle{
    width:auto !important;
    order:0 !important;
  }

  body.mode-news #topExtras,
  body.mode-register #topExtras,
  body.mode-forgot #topExtras,
  body.mode-reset #topExtras{
    order:0 !important;
    width:100% !important;
    justify-content:flex-end !important;
    padding:0 10px !important;
  }

  /* Scroll'u frame içine al (sticky barlar daha stabil) */
  body.mode-news .frame,
  body.mode-register .frame,
  body.mode-player .frame,
  body.mode-forgot .frame,
  body.mode-reset .frame{
    height:100vh !important;
    min-height:100vh !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    -webkit-overflow-scrolling: touch;
  }

  /* İçerik kenar boşlukları */
  body.mode-news #newsPage,
  body.mode-register #newsPage,
  body.mode-forgot #newsPage,
  body.mode-reset #newsPage{
    padding: 12px 12px 26px !important;
  }

  /* Üst bar: daha kompakt */
  body.mode-news .topTitle,
  body.mode-register .topTitle,
  body.mode-forgot .topTitle,
  body.mode-reset .topTitle{
    font-size:32px !important;
    padding:0 12px !important;
  }

  /* Üst bar sağ taraf: yatay kaydırma (butonlar taşmasın) */
  body.mode-news #topExtras,
  body.mode-register #topExtras,
  body.mode-forgot .topExtras,
  body.mode-reset .topExtras{
    overflow-x:auto;
    -webkit-overflow-scrolling: touch;
    gap:8px !important;
    padding:0 10px !important;
    white-space:nowrap;
  }

  /* iOS/Android: scrollbar görünmesin */
  body.mode-news #topExtras::-webkit-scrollbar,
  body.mode-register #topExtras::-webkit-scrollbar,
  body.mode-forgot .topExtras::-webkit-scrollbar,
  body.mode-reset .topExtras::-webkit-scrollbar{ height:0; }

  body.mode-news .newsBtn,
  body.mode-register .newsBtn,
  body.mode-forgot .newsBtn,
  body.mode-reset .newsBtn,
  .offerNotice{
    height:56px;
    width:auto;
    min-width:64px;
    padding:0 10px;
    border-radius:14px;
  }

  body.mode-news .newsBtn .ico,
  body.mode-register .newsBtn .ico,
  body.mode-forgot .newsBtn .ico,
  body.mode-reset .newsBtn .ico{
    width:32px;
    height:32px;
    border-radius:12px;
  }

  body.mode-news .topTabs{
    height:56px;
    overflow-x:auto;
    -webkit-overflow-scrolling: touch;
  }
  body.mode-news .topTab{ height:56px; padding:0 12px; border-radius:14px; }

  /* Alt bar (subbar) daha kompakt */
  body.mode-news .subnav{ padding:8px 10px !important; gap:8px; }
  body.mode-news .subitem{ padding:9px 11px; font-size:12.5px; }

  /* Takım sayfası bilgi satırları */
  .tiRow{ grid-template-columns: 120px 1fr !important; gap:8px !important; }

  /* Sistem (formasyon) sahası: küçük ekranda kesilmesin */
  .pitch{ padding:10px !important; height:clamp(360px, 62vh, 560px) !important; }
  .pitchLine{ gap:6px !important; padding:0 4px !important; }
  .posBall{ width:24px !important; height:24px !important; font-size:11px !important; }
  .posSel{ width:clamp(90px, 25vw, 130px) !important; padding:7px 8px !important; border-radius:10px !important; }

  /* Oyuncu mini barları: mobilde görünür ve daha kompakt */
  .miniBars{ width:160px; }

  /* Tablo taşmaları: mobilde yatay scroll çalışsın */
  table{ display:block; width:100%; overflow-x:auto; -webkit-overflow-scrolling: touch; }
  th, td{ white-space:nowrap; }

  /* Daha iyi kolon yönetimi: 
     - Takım oyuncuları: Teklif kolonunu gizle
     - Transfer market: Takım + Teklif kolonlarını gizle (mobilde genişlik kazan)
     - Antrenman: tüm kolonlar kalsın (zaten 5 kolon)
  */
  table.rosterTable.roster-team thead th:nth-child(6),
  table.rosterTable.roster-team tbody td:nth-child(6){ display:none; }

  table.rosterTable.roster-market thead th:nth-child(5),
  table.rosterTable.roster-market tbody td:nth-child(5){ display:none; }
  table.rosterTable.roster-market thead th:nth-child(7),
  table.rosterTable.roster-market tbody td:nth-child(7){ display:none; }

  /* İç scroll alanları (70vh) mobilde daha esnek olsun */
  .rosterWrap > div[style*="max-height"]{
    max-height:none !important;
  }
}



    /* Admin: Oyuncu detay düzenleme */
    .playerNameRow{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
    }
    .playerEditBtn{ white-space:nowrap; }

    .playerEditPanel{
	      /* daha kompakt bir kart: tek ekranda mümkün olduğunca çok alan görünsün */
	      margin:4px 0 10px;
	      padding:8px;
      border:1px solid #d9d9d9;
      border-radius:10px;
      background:#fafafa;
	      max-width:760px;
	      box-sizing:border-box;
    }
    .playerEditTitle{
      font-weight:1000;
	      margin-bottom:6px;
      letter-spacing:.2px;
    }
    .playerEditGrid{
      display:grid;
	      /* kolon boşlukları minimum: alan kaybetmeden tüm alanlar görünsün */
	      grid-template-columns: repeat(3, minmax(140px, 1fr));
	      gap:6px;
	      margin-bottom:6px;
    }
    @media (max-width: 900px){
      .playerEditGrid{ grid-template-columns: 1fr; }
    }
    .peLabel{
	      font-size:11px;
      font-weight:900;
      color:rgba(0,0,0,.72);
	      margin-bottom:3px;
    }
    .peField select,
    .peInput{
      width:100%;
	      padding:6px 8px;
      border:1px solid #cfcfcf;
      border-radius:8px;
	      font-size:12px;
      color:#000;
      background:#fff;
      box-sizing:border-box;
    }
	    /* Select/input alanları aşırı geniş görünmesin */
	    .peField select{ max-width: 260px; }
	    .peInput[type="number"],
	    #peAge,
	    #peHeight{ max-width: 160px; }
	    #pePos,
	    #peFoot{ max-width: 180px; }
    .peHint{
	      font-size:11px;
      color:rgba(0,0,0,.65);
	      padding:6px 8px;
      border:1px dashed #d0d0d0;
      border-radius:8px;
      background:#fff;
	      line-height:1.2;
    }
    .playerEditStats{
      border-top:1px dashed #d8d8d8;
	      padding-top:8px;
	      margin-top:4px;
	      /* statları iki kolona böl: panel boyu kısalsın */
	      display:grid;
	      grid-template-columns: repeat(2, minmax(0, 1fr));
	      gap:4px 10px;
    }
	    @media (max-width: 900px){
	      .playerEditStats{ grid-template-columns: 1fr; }
	    }
    .peStatRow{
      display:grid;
      /* Slider alanı genişlesin: max=1000 iken sağa "tam" otursun, boşluk hissi olmasın */
      /* sağdaki değer alanını daralt + slider kolonu genişlet; slider ile değer arasındaki boşluğu minimize et */
      grid-template-columns: minmax(120px, 1fr) minmax(0, 2.6fr) 44px;
      align-items:center;
      gap:3px;
      padding:2px 0;
    }
    @media (max-width: 900px){
      .peStatRow{ grid-template-columns: 1fr; }
      .peStatVal{ text-align:left; }
    }
    .peStatLabel{
	      font-size:12px;
      font-weight:900;
      color:#000;
    }
    .peStatVal{
      text-align:right;
      font-variant-numeric: tabular-nums;
      color:#000;
      font-weight:1000;
	      font-size:12px;
      padding-left:4px;
    }
    .peStatSlider{
      width:100%;
      display:block;
      margin:0;
      box-sizing:border-box;
    }

    /* === Custom range UI (1000 iken thumb en sağa dayansın) === */
    .peSliderWrap{
      position:relative;
      width:100%;
      --thumb-size:18px;
      --p:0;
      height: var(--thumb-size);
      display:flex;
      align-items:center;
    }
    .peSliderWrap .peStatSliderNative{
      position:absolute;
      inset:0;
      width:100%;
      height: var(--thumb-size);
      opacity:0;
      cursor:pointer;
      /* Keep the invisible native range above the painted UI so the grab point matches the thumb */
      z-index:2;
    }
    .peSliderUi{
      position:relative;
      width:100%;
      height:8px;
      background:#d0d0d0;
      border-radius:999px;
      /* Let pointer events pass through to the native range input */
      pointer-events:none;
      z-index:1;
    }
    .peSliderFill{
      position:absolute;
      left:0;
      top:0;
      height:100%;
      width: calc(var(--p) * 100%);
      background:#a046d3;
      border-radius:999px;
    }
    .peSliderThumb{
      position:absolute;
      top:50%;
      left: calc((100% - var(--thumb-size)) * var(--p));
      width: var(--thumb-size);
      height: var(--thumb-size);
      background:#a046d3;
      border-radius:50%;
      transform: translateY(-50%);
      box-shadow: 0 0 0 1px rgba(0,0,0,.10);
    }
    .peSliderWrap:focus-within .peSliderUi{
      outline: 2px solid rgba(31,74,168,.25);
      outline-offset: 4px;
    }
    .playerEditActions{
      display:flex;
	      gap:8px;
      justify-content:flex-end;
	      margin-top:6px;
	      /* butonlar her zaman görünür kalsın */
	      position: sticky;
	      bottom: 0;
	      padding-top:6px;
	      background: linear-gradient(to bottom, rgba(250,250,250,0.0), rgba(250,250,250,0.9) 30%, rgba(250,250,250,1));
    }
    .peStatus{
      margin-top:8px;
      font-size:12px;
      color:rgba(0,0,0,.65);
      min-height:16px;
    }

/* === Admin: Puan durumu (Takım Sil / Düzenle / Ekle) === */
.sfAdminTeamBtns{
  display:flex;
  gap:6px;
  align-items:center;
  flex-wrap:nowrap;
  justify-content:flex-start;
}
.btn.edit{
  background: #7dd3fc !important;
  color: #0f172a !important;
  border-color: rgba(0,0,0,.18) !important;
}
.btn.addGreen{
  background: #22c55e !important;
  color:#0f172a !important;
  border-color: rgba(0,0,0,.18) !important;
}
.sfAddTeamRowBox{
  display:flex;
  gap:10px;
  align-items:center;
  padding:10px 12px;
}
.sfAddTeamRowBox input{
  flex:1;
  min-width: 180px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.18);
  background:#fff;
  color:#000;
  font-weight:900;
  outline:none;
}
.sfAddTeamRowBox input::placeholder{ color: rgba(0,0,0,.45); }

/* Modal */
.sfModalBackdrop{
  position:fixed;
  inset:0;
  background: rgba(0,0,0,.60);
  z-index: 9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 18px;
}
.sfModal{
  width: min(560px, 100%);
  background:#fff;
  border-radius: 16px;
  border:1px solid rgba(0,0,0,.18);
  box-shadow: 0 18px 60px rgba(0,0,0,.35);
  overflow:hidden;
}
.sfModalHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding: 14px 16px;
  border-bottom:1px solid rgba(0,0,0,.10);
  background: rgba(15,23,42,.02);
}
.sfModalHeader .title{
  font-weight:1100;
  color:#0f172a;
  font-size:14px;
}
.sfModalHeader .close{
  width:34px;
  height:34px;
  border-radius: 12px;
  border:1px solid rgba(0,0,0,.18);
  background:#fff;
  cursor:pointer;
  font-weight:1200;
  color:#0f172a;
}
.sfModalBody{
  padding: 16px;
  display:grid;
  gap: 12px;
}
.sfField label{
  display:block;
  font-size:12px;
  font-weight:1000;
  color: rgba(15,23,42,.75);
  margin-bottom:6px;
}
.sfField input,
.sfField select{
  width:100%;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.18);
  background:#fff;
  color:#000;
  font-weight:900;
  outline:none;
}
.sfModalFooter{
  padding: 14px 16px;
  border-top:1px solid rgba(0,0,0,.10);
  display:flex;
  justify-content:flex-end;
  gap:10px;
}
.sfHint{
  font-size:12px;
  color: rgba(0,0,0,.60);
  line-height:1.35;
}



/* Match Test modals: keep as a medium card and scroll inside */
.mtModal{
  /* width/height are mostly set inline; this class is for internal sizing tweaks */
}
.mtModal .sfModalBody{
  /* safety if inline is overridden */
  overflow:auto;
  min-height:0;
}
.mtModal .pitch{
  height: clamp(280px, 42vh, 420px);
  padding: 12px;
}
.mtModal .pitchLine{ gap:8px; }
.mtModal .posBall{ width:26px; height:26px; font-size:11px; }
.mtModal .posSel{
  width: clamp(92px, 18vw, 150px);
  padding: 7px 9px;
  font-size: 12px;
}
.mtModal .teamInfoTable{ width: 240px; }



/* === Puan Durumu: tek parça tablo, ince çizgiler, zebra satırlar === */
.sfLeagueTable{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
}
.sfLeagueTable th,
.sfLeagueTable td{
  border:0.5px solid rgba(0,0,0,.16);
  padding:8px 10px;
  line-height:1.2;
  vertical-align:middle;
}
.sfLeagueTable thead th{
  background: rgba(15,23,42,.03);
  /* Başlıklar kalın olmayacak (sadece P sütunu bold) */
  font-weight:400;
  color:#0f172a;
}
.sfLeagueTable tbody tr:nth-child(even){
  background: rgba(15,23,42,.03);
}

/* Ülke/Lig hızlı geçiş alanı (puan durumu üstü) */
.sfStandingsJump{
  display:flex;
  gap:14px;
  align-items:flex-end;
  flex-wrap:wrap;
  margin: 10px 0 6px;
}
.sfStandingsJump .sfField{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width: 180px;
}
.sfStandingsJump label{
  font-size:12px;
  color: rgba(15,23,42,.75);
}
.sfStandingsJump select{
  padding:10px 12px;
  border:1px solid rgba(0,0,0,.14);
  border-radius:10px;
  background:#fff;
  color:#0f172a;
  outline:none;
}
.sfStandingsJump select:focus{
  border-color: rgba(59,130,246,.55);
  box-shadow: 0 0 0 3px rgba(59,130,246,.15);
}

/* Kolon genişlikleri ve hizalar */
.sfLeagueTable .col-actions{ width:140px; text-align:left; }
.sfLeagueTable .col-rank{ width:44px; text-align:center; font-weight:400; }
.sfLeagueTable .col-team{ text-align:left; }
.sfLeagueTable .col-num{ width:40px; text-align:center; }
.sfLeagueTable .col-avg{ width:52px; text-align:center; font-weight:400; }
.sfLeagueTable .col-points{ width:44px; text-align:center; font-weight:700; color:#000; }

/* P sütunu başlığı da koyu ve vurgulu */
.sfLeagueTable thead th.col-points{ font-weight:700 !important; color:#000; }

/* P sütunu (puan) koyu siyah ve vurgulu */
.sfLeagueTable tbody td.col-points{ color:#000 !important; font-weight:700 !important; }

/* Puan durumu: takım adının yanında başkan adı (küçük, silik gri) */
.sfPresidentMini{
  margin-left:8px;
  font-size:0.5em;
  color: rgba(0,0,0,.55);
  font-weight:600;
}

/* Başkan kendi liginde kendi takım satırını hafif sarı görsün */
.sfLeagueTable tbody tr.sfMyTeamRow{
  background: rgba(253, 230, 138, .35) !important; /* açık sarı */
}

/* Admin ek satır stilleri */
.sfAdminAddHint{
  color:rgba(15,23,42,.55);
  font-size:12px;
}
.sfAdminAddBoxCell{ padding:0; }
.sfAdminAddRow td{ background: rgba(34,197,94,.03); }

/* ------------------------------------------------------------
   Roster: genel UI (sortable head, delete button, pager, wide search)
------------------------------------------------------------ */
.rosterTable thead th.sortable{ cursor:pointer; user-select:none; }
.rosterTable thead th.sortable .sortArrow{ font-size:11px; opacity:.65; margin-left:6px; }

.rosterDelBtn.btn.tiny{ padding:4px 8px; border-radius:9px; font-size:11px; line-height:1; margin-right:6px; }

/* Oyuncular (tüm sistem) sayfasında arama kutusu daha geniş olsun */
.rosterToolsWide input{ width: min(560px, 55vw); max-width: 760px; }

/* Oyuncular arama grubu (input + Ara butonu) */
.rosterSearchGroup{ display:flex; align-items:center; gap:10px; }
.rosterSearchGroup .btn{ white-space:nowrap; }

/* Roster sayfalarında input yazı rengi (beyaz zemin üstünde beyaz yazı olmasın) */
.rosterWrap .rosterTools input,
.rosterWrap .rosterSearchGroup input{
  background:#FFFFFF !important;
  color:#0f172a !important;
  border:1px solid rgba(15,23,42,.18) !important;
}
.rosterWrap .rosterTools input::placeholder,
.rosterWrap .rosterSearchGroup input::placeholder{
  color:rgba(15,23,42,.45) !important;
}

/* Sayfa altı paginator */
.allPlayersFooter{ display:flex; justify-content:flex-end; padding-top:10px; }
.sfPager .pgWrap{
  display:flex;
  align-items:center;
  border:1px solid rgba(15,23,42,.16);
  border-radius:14px;
  overflow:hidden;
  background:#fff;
}
.sfPager .pgBtn{
  border:0;
  background:transparent;
  padding:12px 18px;
  font-weight:1000;
  font-size:18px;
  color:rgba(15,23,42,.85);
  cursor:pointer;
}
.sfPager .pgBtn:hover{ background:rgba(15,23,42,.04); }
.sfPager .pgBtn.active{ background:rgba(0,128,0,.18); color:rgba(15,23,42,.95); }
.sfPager .pgBtn.nav{ font-size:20px; }
.sfPager .pgEll{ padding:0 18px; font-weight:1000; opacity:.65; }

/* Admin bakım (backfill) durum satırı */
.sfBackfillStatus{
  margin-top:8px;
  padding:8px 10px;
  border:1px dashed rgba(15,23,42,.22);
  background:rgba(212,175,55,.12);
  border-radius:10px;
  font-size:12px;
  color:rgba(15,23,42,.85);
}

.pager{ display:flex; align-items:center; gap:8px; }
.pagerLabel{ font-size:12px; font-weight:1000; opacity:.75; min-width:72px; text-align:center; }

/* roster-all: takım listesiyle aynı kolon genişlikleri */
.rosterTable.roster-all{ table-layout: fixed; }
.rosterTable.roster-all th:nth-child(1), .rosterTable.roster-all td:nth-child(1){ width:72px; }
.rosterTable.roster-all th:nth-child(2), .rosterTable.roster-all td:nth-child(2){ width:180px; }
.rosterTable.roster-all th:nth-child(3), .rosterTable.roster-all td:nth-child(3){ width:44px; }
.rosterTable.roster-all th:nth-child(4), .rosterTable.roster-all td:nth-child(4){ width:240px; }
.rosterTable.roster-all th:nth-child(5), .rosterTable.roster-all td:nth-child(5){ width:56px; }
.rosterTable.roster-all th:nth-child(6), .rosterTable.roster-all td:nth-child(6){ width:150px; }
.rosterTable.roster-all th:nth-child(7), .rosterTable.roster-all td:nth-child(7){ width:120px; }
.rosterTable.roster-all th:nth-child(8), .rosterTable.roster-all td:nth-child(8){ width:120px; }
.rosterTable.roster-all th:nth-child(9), .rosterTable.roster-all td:nth-child(9){ width:100%; }

.rosterTable.roster-all th.priceHead, .rosterTable.roster-all td.price{ text-align:center !important; }
.rosterTable.roster-all th.offerHead, .rosterTable.roster-all td.offerCell{ text-align:center !important; }
.rosterTable.roster-all th.spacerHead, .rosterTable.roster-all td.spacerCol{ display:none; }
.rosterTable.roster-all .kademeCell{ gap:6px; }
.rosterTable.roster-all .rosterDelBtn.btn.tiny{ margin-right:0; }

/* Admin ikon butonları (dar kolonlarda taşma olmasın) */
.rosterTable.roster-all .rosterEditBtn.btn.tiny,
.rosterTable.roster-all .rosterDelBtn.btn.tiny{
  width:28px;
  height:24px;
  padding:0 !important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

@media (max-width: 640px){
  .rosterToolsWide input{ width: min(420px, 70vw); }
  .pagerLabel{ min-width:56px; }
}


/* ─────────────────────────────────────────────────────────────────────────────
   Training V2 UI
   ───────────────────────────────────────────────────────────────────────────── */

.trainTabs{
  display:flex;
  gap:10px;
  align-items:center;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  padding:4px 2px;
}

.trainTab{
  height:40px;
  padding:0 14px;
  border-radius:14px;
  border:1px solid rgba(0,0,0,.12);
  background: rgba(15,23,42,.02);
  color: rgba(15,23,42,.80);
  font-weight:1000;
  cursor:pointer;
  white-space:nowrap;
}

.trainTab.active{
  background: rgba(156,255,0,.18);
  border-color: rgba(156,255,0,.35);
  box-shadow: 0 10px 20px rgba(0,0,0,.10);
}

.trainTabs.sub .trainTab{
  height:36px;
  border-radius:12px;
  font-size:13px;
}

.techPick{
  width:18px;
  height:18px;
}

/* =====================
   Match Engine V2 styles
   ===================== */
.sfMatchV2Head{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;}
.sfMatchV2Teams{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.sfMatchV2Team{font-weight:700;}
.sfMatchV2Score{font-size:18px;font-weight:800;padding:4px 10px;border-radius:10px;background:rgba(255,255,255,0.06);}
.sfMatchV2Meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.sfBadge{display:inline-block;padding:3px 8px;border-radius:999px;background:rgba(255,255,255,0.06);font-size:12px;}
.sfBadgeLive{background:rgba(220, 38, 38, 0.2);border:1px solid rgba(220, 38, 38, 0.5);}
.sfMatchV2Actions{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;}
.sfMatchV2SectionTitle{font-weight:700;margin-bottom:8px;}
.sfMatchV2Feed{max-height:420px;overflow:auto;border:1px solid rgba(255,255,255,0.08);border-radius:12px;padding:8px;}
.sfMatchV2Event{display:flex;gap:8px;padding:6px 4px;border-bottom:1px dashed rgba(255,255,255,0.06);}
.sfMatchV2Event:last-child{border-bottom:0;}
.sfMatchV2Minute{min-width:44px;opacity:0.8;}
.sfMatchV2Text{flex:1;}
.sfMatchV2Side{margin-top:8px;}
.sfMatchV2SideTitle{font-weight:700;margin-bottom:6px;}
.sfMatchV2SideCols{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
@media(max-width:720px){.sfMatchV2SideCols{grid-template-columns:1fr;}}
.sfMatchV2Small{font-size:12px;opacity:0.8;}
.sfMatchV2Grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
@media(max-width:720px){.sfMatchV2Grid2{grid-template-columns:1fr;}}
.sfMatchV2SubRow{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:center;}
@media(max-width:720px){.sfMatchV2SubRow{grid-template-columns:1fr;}}


/* ---------------------------------------------------------
   FIX: Readability on light cards (white on white issues)
   - Makes generic text inside .newsCard readable by default
   - Adds muted color override for light cards
   - Improves live match (V2) badges + feed borders on white background
--------------------------------------------------------- */
.muted{ color: var(--muted); }

.newsCard{ color:#0f172a; }
.newsCard .muted{ color: rgba(15,23,42,.72); }

.newsCard .sfBadge{
  background: rgba(15,23,42,.06);
  border: 1px solid rgba(15,23,42,.12);
  color: rgba(15,23,42,.78);
}
.newsCard .sfBadge.live{
  background: rgba(239,68,68,.12);
  border-color: rgba(239,68,68,.25);
  color: rgba(127,29,29,.95);
}

.newsCard .sfMatchV2Score{ background: rgba(15,23,42,.06); }

.newsCard .sfMatchV2Feed{
  border-color: rgba(15,23,42,.12);
  background: rgba(255,255,255,.72);
}
.newsCard .sfMatchV2Event{ border-bottom-color: rgba(15,23,42,.10); }
.newsCard .sfMatchV2Minute{ opacity: .72; }

/* Live feed highlights by event type (optional, harmless if class not present) */
.newsCard .sfMatchV2Event--goal{ background: rgba(156,255,0,.16); border-radius: 10px; }
.newsCard .sfMatchV2Event--yellow{ background: rgba(255,229,0,.16); border-radius: 10px; }
.newsCard .sfMatchV2Event--red{ background: rgba(239,68,68,.12); border-radius: 10px; }
.newsCard .sfMatchV2Event--sub{ background: rgba(90,140,210,.12); border-radius: 10px; }
.newsCard .sfMatchV2Event--save{ background: rgba(59,130,246,.10); border-radius: 10px; }
.newsCard .sfMatchV2Event--miss{ background: rgba(15,23,42,.04); border-radius: 10px; }
.newsCard .sfMatchV2Event--corner{ background: rgba(90,140,210,.08); border-radius: 10px; }
.newsCard .sfMatchV2Event--offside{ background: rgba(15,23,42,.04); border-radius: 10px; }
.newsCard .sfMatchV2Event--ht,
.newsCard .sfMatchV2Event--start2,
.newsCard .sfMatchV2Event--end{ background: rgba(15,23,42,.06); border-radius: 10px; }



/* Match V2 control grid (was missing) */
.sfMatchV2Grid{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:end;}
@media(max-width:720px){.sfMatchV2Grid{grid-template-columns:1fr;}}