/* 1. Theme: Emerald Pitch (Default) */
  :root, [data-theme="emerald"] {
    --bg:#0c1410; --surface:#142219; --surface-2:#1a2b20; --surface-3:#22382a;
    --border:#253d2d; --border-highlight:#365942;
    --ink:#eef6f1; --ink-dim:#9bb5a3; --ink-faint:#617a6a;
    --brand:#10b981; --brand-dark:#059669; --brand-tint:#064e3b;
    --accent:#f59e0b; --accent-tint:#78350f;
    --win:#10b981; --draw:#f59e0b; --loss:#ef4444;
    --topbar-bg: linear-gradient(180deg, #07381e, #092615);
    --card-shadow: 0 8px 32px rgba(0,0,0,0.35);
  }

  /* 2. Theme: Midnight Onyx & Neon */
  [data-theme="midnight"] {
    --bg:#090a0f; --surface:#11141d; --surface-2:#171c28; --surface-3:#202738;
    --border:#252d3d; --border-highlight:#3b475f;
    --ink:#f1f5f9; --ink-dim:#94a3b8; --ink-faint:#64748b;
    --brand:#00f59b; --brand-dark:#00c87e; --brand-tint:#053822;
    --accent:#ffb703; --accent-tint:#664901;
    --win:#00f59b; --draw:#ffb703; --loss:#ff3366;
    --topbar-bg: linear-gradient(180deg, #131722, #0d1017);
    --card-shadow: 0 8px 32px rgba(0,0,0,0.5);
  }

  /* 3. Theme: Champions League Navy & Gold */
  [data-theme="ucl"] {
    --bg:#070b19; --surface:#0d162e; --surface-2:#142042; --surface-3:#1d2d5a;
    --border:#253768; --border-highlight:#3b5496;
    --ink:#f8fafc; --ink-dim:#94a3b8; --ink-faint:#64748b;
    --brand:#38bdf8; --brand-dark:#2563eb; --brand-tint:#172554;
    --accent:#fbbf24; --accent-tint:#78350f;
    --win:#38bdf8; --draw:#fbbf24; --loss:#f43f5e;
    --topbar-bg: linear-gradient(180deg, #0f1c3f, #0a1329);
    --card-shadow: 0 8px 32px rgba(0,0,0,0.45);
  }

  /* 4. Theme: Modern Clean Light */
  [data-theme="light"] {
    --bg:#f1f5f3; --surface:#ffffff; --surface-2:#f8faf9; --surface-3:#e9efe9;
    --border:#dbe4de; --border-highlight:#b8ccc0;
    --ink:#0f1712; --ink-dim:#4b5563; --ink-faint:#9ca3af;
    --brand:#059669; --brand-dark:#047857; --brand-tint:#ecfdf5;
    --accent:#d97706; --accent-tint:#fef3c7;
    --win:#059669; --draw:#d97706; --loss:#dc2626;
    --topbar-bg: linear-gradient(180deg, #047857, #065f46);
    --card-shadow: 0 4px 20px rgba(0,0,0,0.08);
  }

  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:'Barlow',sans-serif; -webkit-font-smoothing:antialiased; transition:background-color .2s, color .2s;}
  h1,h2,h3,h4,h5{font-family:'Barlow Condensed',sans-serif;margin:0;letter-spacing:.3px;}
  
  /* Login: split screen (design supplied by the owner), scoped to #loginScreen */
  #loginScreen{position:fixed; inset:0; z-index:999; overflow-y:auto; display:grid; grid-template-columns:64% 36%; background:#061321; color:#f5f8fc; font-family:Inter,"Segoe UI",Arial,sans-serif; --lg-line:#25475f; --lg-muted:#a9c0d4; --lg-cyan:#19ccef; --lg-blue:#13a9ee;}
  #loginScreen svg{fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;}
  #loginScreen a{color:var(--lg-cyan); text-decoration:none; cursor:pointer;}
  #loginScreen a:hover{text-decoration:underline;}
  #loginScreen .lg-symbols{position:absolute; width:0; height:0; overflow:hidden;}
  #loginScreen .lg-hero{position:relative; isolation:isolate; overflow:hidden; padding:clamp(32px,5vw,88px); display:flex; flex-direction:column; justify-content:center; min-height:780px; background:radial-gradient(ellipse at 75% 50%,#07436070,transparent 65%),linear-gradient(160deg,#071422,#041521 60%,#02101b);}
  #loginScreen .lg-art{position:absolute; inset:0; width:100%; height:100%; z-index:-1;}
  #loginScreen .lg-hero:after{content:""; position:absolute; inset:0; background:linear-gradient(90deg,#03132140,transparent),linear-gradient(0deg,#03101bed,transparent 35%); z-index:-1;}
  #loginScreen .lg-brand{display:flex; align-items:center; gap:20px; font-size:clamp(30px,3.5vw,52px); font-weight:750; letter-spacing:-1.5px;}
  #loginScreen .lg-brand svg{width:74px; height:80px; flex-shrink:0; stroke-width:6;}
  #loginScreen .lg-brand span span{color:var(--lg-blue);}
  #loginScreen h1{font-family:inherit; font-size:clamp(32px,3.6vw,56px); line-height:1.13; letter-spacing:-1.5px; margin:82px 0 14px; font-weight:750; color:#f5f8fc;}
  #loginScreen .lg-intro{font-size:clamp(17px,1.5vw,23px); line-height:1.6; color:#b5cfe1; margin:0;}
  #loginScreen .lg-features{display:flex; margin-top:105px; max-width:580px;}
  #loginScreen .lg-feature{flex:1; padding:0 22px; border-left:1px solid #294456;}
  #loginScreen .lg-feature:first-child{padding-left:0; border:0;}
  #loginScreen .lg-feature svg{width:32px; height:32px; color:#48caff; margin-bottom:12px;}
  #loginScreen .lg-feature h2{font-family:inherit; font-size:16px; margin:0 0 10px; color:#f5f8fc; letter-spacing:0;}
  #loginScreen .lg-feature p{margin:0; font-size:14px; line-height:1.6; color:#b6cbdc;}
  #loginScreen .lg-tagline{margin-top:115px; font-size:10px; letter-spacing:4px; line-height:1.8; color:#8dc4dc;}
  #loginScreen .lg-tagline:after{content:""; display:block; width:34px; height:3px; background:var(--lg-cyan); margin-top:16px;}
  #loginScreen .lg-panel{position:relative; border-left:1px solid var(--lg-line); padding:100px clamp(28px,4vw,72px) 40px; display:flex; flex-direction:column; justify-content:center; background:radial-gradient(ellipse at 100% 0%,#0b2135,transparent 60%),#06121f;}
  #loginScreen .lg-language{position:absolute; right:40px; top:34px; font-size:12px; color:var(--lg-muted);}
  #loginScreen .lg-form{width:100%; max-width:440px; margin:auto;}
  #loginScreen h2.lg-welcome{font-family:inherit; font-size:clamp(25px,2.2vw,35px); letter-spacing:-.7px; margin:0 0 10px; color:#f5f8fc;}
  #loginScreen .lg-subtitle{color:var(--lg-muted); font-size:16px; margin:0 0 40px;}
  #loginScreen .lg-label{display:block; font-size:13px; font-weight:600; margin:24px 0 10px;}
  #loginScreen .lg-field{height:54px; border:1px solid #31526d; border-radius:7px; display:flex; align-items:center; padding:0 15px; gap:12px; background:#0a1b2b80;}
  #loginScreen .lg-field:focus-within{border-color:var(--lg-cyan); box-shadow:0 0 0 3px #19ccef12;}
  #loginScreen .lg-icon{width:22px; height:22px; flex-shrink:0; color:#adcde3;}
  #loginScreen .lg-field input{width:100%; min-width:0; color:#f5f8fc; border:0; outline:none; background:transparent; font:inherit; font-size:14px; height:100%; padding:0; box-shadow:none; border-radius:0;}
  #loginScreen .lg-field input::placeholder{color:#7893ac;}
  #loginScreen .lg-field input:-webkit-autofill{-webkit-box-shadow:0 0 0 100px #0c2033 inset; -webkit-text-fill-color:#f5f8fc; caret-color:#f5f8fc;}
  #loginScreen .lg-eye{padding:6px; background:none; border:0; color:var(--lg-muted); display:flex; cursor:pointer;}
  #loginScreen .lg-options{display:flex; align-items:center; justify-content:space-between; gap:14px; margin:23px 0 28px; font-size:13px;}
  #loginScreen .lg-remember{display:flex; align-items:center; gap:9px; cursor:pointer; white-space:nowrap;}
  #loginScreen .lg-remember input{width:18px; height:18px; accent-color:var(--lg-cyan); margin:0;}
  #loginScreen .lg-submit{display:flex; align-items:center; justify-content:center; gap:20px; width:100%; height:56px; border:0; border-radius:7px; background:linear-gradient(100deg,#20cfee,#11a9ef); color:#03121b; font:inherit; font-size:17px; font-weight:700; cursor:pointer; transition:filter .2s, transform .2s;}
  #loginScreen .lg-submit:hover{filter:brightness(1.1);}
  #loginScreen .lg-submit:active{transform:translateY(1px);}
  #loginScreen .lg-submit:disabled{opacity:.6; cursor:default;}
  #loginScreen .lg-pin{display:flex; align-items:center; justify-content:center; gap:10px; width:100%; height:48px; margin-top:12px; border:1px solid #e9b94966; border-radius:7px; background:linear-gradient(100deg,#e9b94914,#c98a2c10); color:#f1c862; font:inherit; font-size:15px; font-weight:700; cursor:pointer; transition:background .2s, border-color .2s;}
  #loginScreen .lg-pin:hover{border-color:#e9b949; background:#e9b94922;}
  #loginScreen .lg-pin .lg-icon{width:18px; height:18px;}
  #loginScreen .lg-register{text-align:center; font-size:14px; margin:28px 0; color:var(--lg-muted);}
  #loginScreen .lg-register a{font-weight:650; margin-left:5px;}
  #loginScreen .lg-help{display:flex; align-items:center; gap:16px; justify-content:center; margin-top:55px; font-size:14px; font-weight:600;}
  #loginScreen .lg-help:before, #loginScreen .lg-help:after{content:""; height:1px; background:var(--lg-line); flex:1;}
  #loginScreen .lg-help a{display:flex; gap:9px; align-items:center; white-space:nowrap;}
  #loginScreen .lg-footer{display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:64px; color:#849cb2; font-size:11px; line-height:1.9;}
  #loginScreen .lg-footer a{color:inherit;}
  #loginScreen .lg-legal{display:flex; flex-wrap:wrap; gap:11px;}
  #loginScreen .lg-motto{font-size:9px; letter-spacing:4px; text-align:right; line-height:2.3;}
  #loginScreen .lg-disc{color:#7f97ad; font-size:11.5px; line-height:1.6; margin:14px 0 0;}
  #loginErrorMsg{color:#ff8a8a; font-size:13.5px; line-height:1.6; margin:16px 0 0; min-height:0;}
  @media(min-width:1800px){#loginScreen .lg-hero{min-height:100vh; min-height:100dvh;}}
  @media(max-width:1100px){#loginScreen{grid-template-columns:55% 45%;} #loginScreen .lg-hero{padding:38px;} #loginScreen .lg-panel{padding:90px 32px 32px;} #loginScreen .lg-features{margin-top:75px;} #loginScreen .lg-feature{padding:0 14px;} #loginScreen .lg-tagline{letter-spacing:2.5px;} #loginScreen h1{margin-top:65px;} #loginScreen .lg-motto{display:none;}}
  @media(max-width:760px){
    #loginScreen{display:flex; flex-direction:column;}
    #loginScreen .lg-hero{min-height:0; padding:36px 26px 34px;}
    #loginScreen .lg-brand{font-size:32px; gap:12px;} #loginScreen .lg-brand svg{width:43px; height:48px;}
    #loginScreen h1{font-size:31px; margin-top:27px; letter-spacing:-1px;} #loginScreen .lg-intro{font-size:15px;}
    #loginScreen .lg-features{margin-top:30px; max-width:520px;} #loginScreen .lg-feature{padding:0 13px;}
    #loginScreen .lg-feature svg{width:23px; height:23px; margin-bottom:7px;} #loginScreen .lg-feature h2{font-size:13px; margin-bottom:6px;} #loginScreen .lg-feature p{font-size:11px;}
    #loginScreen .lg-tagline{display:none;}
    #loginScreen .lg-panel{border-left:0; border-top:1px solid var(--lg-line); padding:46px 26px 28px;}
    #loginScreen .lg-language{top:14px; right:26px; font-size:10px;}
    #loginScreen .lg-subtitle{margin-bottom:28px;} #loginScreen h2.lg-welcome{font-size:27px;}
    #loginScreen .lg-help{margin-top:32px;} #loginScreen .lg-footer{margin-top:38px;} #loginScreen .lg-options{font-size:12px;}
    #loginScreen .lg-art{opacity:.6;}
  }

  .brand .brand-mark{width:46px; height:46px; flex:none; filter:drop-shadow(0 0 8px rgba(56,182,255,.35));}
  .brand-word{font-family:'Nunito','Segoe UI',system-ui,sans-serif; font-weight:800!important; font-size:28px!important; letter-spacing:-.5px; background:none!important; -webkit-background-clip:border-box!important; background-clip:border-box!important; color:#fff!important; -webkit-text-fill-color:#fff!important;}
  .brand-word b{color:#38bdf8!important; -webkit-text-fill-color:#38bdf8!important; margin-left:0!important;}
  #loginScreen .lg-brand{font-family:'Nunito','Segoe UI',system-ui,sans-serif; font-weight:800; letter-spacing:-1px;}
  #loginScreen .lg-brand .lg-mark{width:74px; height:74px; flex-shrink:0; stroke-width:0; filter:drop-shadow(0 0 12px rgba(56,182,255,.4));}
  #loginScreen .lg-brand span span{color:#38bdf8;}
  #loginScreen .lg-or{display:none;}
  /* Login, phone: premium sheet. The hero no longer shrinks under the form; the form sits on a glass sheet with
     rounded top corners; fields, buttons and the error get depth and glow. Desktop is untouched. */
  @media(max-width:760px){
    #loginScreen{background:radial-gradient(120% 60% at 50% 0%,#0b3a5a 0%,transparent 60%),radial-gradient(90% 50% at 100% 100%,#0a2e45 0%,transparent 70%),#040e19;}
    #loginScreen > section{flex-shrink:0;}
    #loginScreen .lg-hero{padding:calc(30px + env(safe-area-inset-top)) 24px 58px; text-align:center; align-items:center; background:radial-gradient(70% 70% at 50% 30%,#0d4a6c66,transparent 70%);}
    #loginScreen .lg-hero:after{background:linear-gradient(0deg,#040e19 0%,transparent 45%);}
    #loginScreen .lg-art{opacity:.45;}
    #loginScreen .lg-brand{justify-content:center; font-size:30px; gap:12px;}
    #loginScreen .lg-brand .lg-mark{width:46px; height:46px; filter:drop-shadow(0 0 14px rgba(56,182,255,.55));}
    #loginScreen h1{font-size:27px; margin:20px 0 8px; letter-spacing:-.8px; background:linear-gradient(180deg,#ffffff 30%,#9fdcf5); -webkit-background-clip:text; background-clip:text; color:transparent;}
    #loginScreen .lg-intro{font-size:14.5px; color:#9fbdd2;}
    #loginScreen .lg-features{display:flex; justify-content:center; gap:8px; margin:22px auto 0; max-width:none;}
    #loginScreen .lg-feature, #loginScreen .lg-feature:first-child{flex:0 1 auto; display:flex; align-items:center; gap:7px; padding:7px 12px 7px 10px; border:1px solid #2a5d7a80; border-radius:999px; background:linear-gradient(180deg,#0f2c42b3,#0a1d2eb3); box-shadow:inset 0 1px 0 #ffffff12;}
    #loginScreen .lg-feature svg{width:16px; height:16px; margin:0; color:#5fd4ff;}
    #loginScreen .lg-feature h2{font-size:12px; font-weight:650; margin:0; color:#dcecf7;}
    #loginScreen .lg-feature p{display:none;}
    #loginScreen .lg-panel{margin-top:-30px; border:0; border-radius:28px 28px 0 0; padding:34px 22px calc(26px + env(safe-area-inset-bottom)); flex-grow:1; justify-content:flex-start;
      background:linear-gradient(180deg,#0c1f31f2 0%,#071523f7 38%,#050f1b 100%); box-shadow:0 -18px 50px #0009, inset 0 1px 0 #ffffff14;}
    #loginScreen .lg-panel:before{content:""; position:absolute; left:18%; right:18%; top:0; height:1px; background:linear-gradient(90deg,transparent,#3fd6ff,transparent); opacity:.8;}
    #loginScreen .lg-panel:after{content:""; position:absolute; left:50%; top:10px; width:38px; height:4px; margin-left:-19px; border-radius:4px; background:#ffffff1f;}
    #loginScreen .lg-language{top:20px; right:20px; padding:3px 9px; border:1px solid #2a4a62; border-radius:999px; font-size:10.5px; font-weight:650; letter-spacing:.6px; color:#9fbdd2; background:#0a1a2a;}
    #loginScreen h2.lg-welcome{font-size:25px; margin:4px 0 6px; letter-spacing:-.5px;}
    #loginScreen .lg-subtitle{font-size:14.5px; margin-bottom:22px;}
    #loginScreen .lg-label{font-size:12.5px; font-weight:600; color:#c4d8e6; margin:16px 0 8px;}
    #loginScreen .lg-field{height:56px; border-radius:14px; border-color:#22435b; padding:0 14px; background:linear-gradient(180deg,#0e2336,#0a1a2a); box-shadow:inset 0 1px 0 #ffffff0d, 0 4px 14px #0004; transition:border-color .2s, box-shadow .2s;}
    #loginScreen .lg-field:focus-within{border-color:#2fd3f4; box-shadow:0 0 0 4px #19ccef1f, 0 0 22px #19ccef26, inset 0 1px 0 #ffffff12;}
    #loginScreen .lg-field:focus-within .lg-icon{color:#4fdcff;}
    #loginScreen .lg-field input{font-size:16px;}
    #loginScreen .lg-field input:-webkit-autofill{-webkit-box-shadow:0 0 0 100px #0d2134 inset;}
    #loginScreen .lg-icon{width:20px; height:20px; color:#8fb4cc; transition:color .2s;}
    #loginScreen .lg-options{margin:16px 0 22px;}
    #loginScreen .lg-remember input{border-radius:5px;}
    #loginScreen .lg-options a{font-weight:600;}
    #loginScreen .lg-submit{position:relative; overflow:hidden; height:56px; border-radius:14px; gap:12px; font-size:16.5px; letter-spacing:.2px; background:linear-gradient(100deg,#3ee0f7 0%,#19c3f0 45%,#0f97e8 100%); box-shadow:0 12px 30px #13a9ee47, inset 0 1px 0 #ffffff66;}
    #loginScreen .lg-submit:after{content:""; position:absolute; top:0; bottom:0; left:-60%; width:45%; background:linear-gradient(100deg,transparent,#ffffff59,transparent); transform:skewX(-20deg); animation:lgShine 4.5s ease-in-out 1.2s infinite;}
    #loginScreen .lg-submit svg{transition:transform .2s;} #loginScreen .lg-submit:active svg{transform:translateX(3px);}
    #loginScreen .lg-or{display:flex; align-items:center; gap:12px; margin:16px 0 12px; font-size:11px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#6f8ca3;}
    #loginScreen .lg-or:before, #loginScreen .lg-or:after{content:""; flex:1; height:1px; background:linear-gradient(90deg,transparent,#24465e);}
    #loginScreen .lg-or:after{background:linear-gradient(90deg,#24465e,transparent);}
    #loginScreen .lg-pin{height:54px; margin-top:0; border-radius:14px; border:1px solid #e9b94980; background:linear-gradient(180deg,#2a2210,#17140c); color:#f4cf6e; box-shadow:0 8px 24px #e9b9491a, inset 0 1px 0 #ffe7a526;}
    #loginScreen .lg-pin .lg-icon{width:30px; height:30px; padding:6px; border-radius:50%; color:#1a1406; background:linear-gradient(135deg,#ffe08a,#d9a43a); box-shadow:0 0 12px #e9b94966;}
    #loginScreen .lg-pin:active{transform:translateY(1px);}
    #loginErrorMsg:not(:empty){display:flex; gap:10px; align-items:flex-start; margin-top:14px; padding:11px 14px; border:1px solid #ff6b6b40; border-radius:12px; background:#ff5a5a14; color:#ffa3a3; font-size:13px; line-height:1.5;}
    #loginErrorMsg:not(:empty):before{content:"!"; flex:none; width:18px; height:18px; margin-top:1px; border-radius:50%; display:grid; place-items:center; font-size:12px; font-weight:800; color:#2a0b0b; background:#ff8a8a;}
    #loginScreen .lg-register{margin:24px 0 0; font-size:14px;}
    #loginScreen .lg-help{margin-top:26px; font-size:13.5px;}
    #loginScreen .lg-help:before{background:linear-gradient(90deg,transparent,var(--lg-line));} #loginScreen .lg-help:after{background:linear-gradient(90deg,var(--lg-line),transparent);}
    #loginScreen .lg-footer{justify-content:center; margin-top:26px;}
    #loginScreen .lg-legal{justify-content:center;}
    #loginScreen .lg-disc{text-align:center; font-size:11px; color:#6a8399; margin-top:8px;}
  }
  @keyframes lgShine{0%{left:-60%;} 35%,100%{left:130%;}}
  @media(max-width:760px) and (prefers-reduced-motion:reduce){#loginScreen .lg-submit:after{animation:none; display:none;}}
  /* Register screen card (unchanged look) */
  .login-card{
    background: rgba(20, 34, 25, 0.9);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(52, 211, 153, 0.25);
    border-radius:24px;
    max-width:440px; width:100%; padding:36px 30px;
    box-shadow: 0 30px 80px rgba(0,0,0,0.7), 0 0 50px rgba(16, 185, 129, 0.12);
    text-align:center; position:relative; z-index: 2;
  }
  .login-logo{
    width:62px; height:62px; border-radius:16px; background:linear-gradient(135deg, var(--brand), #047857);
    display:flex; align-items:center; justify-content:center; font-size:30px; margin:0 auto 16px;
    box-shadow:0 8px 24px rgba(16,185,129,0.4), inset 0 1px 1px rgba(255,255,255,0.3);
    border: 1px solid rgba(255,255,255,0.15);
  }
  .login-title{
    font-size:34px; font-weight:800; color:#fff; letter-spacing: 0.5px;
    font-family: 'Barlow Condensed', sans-serif;
    display:flex; align-items:center; justify-content:center; gap:2px;
  }
  .login-title span.brand-accent{
    color: var(--brand);
  }
  .login-sub{font-size:13.5px; color:var(--ink-dim); margin:6px 0 22px; line-height:1.4;}
  .login-sep{display:flex; align-items:center; gap:10px; color:var(--ink-faint); font-size:12px; margin-bottom:18px;}
  .login-sep::before, .login-sep::after{content:""; flex:1; height:1px; background:var(--border);}
  /* Premium welcome card: the header's glass, a soft aurora behind it and a hairline glow on top */
  .home-hero{position:relative; isolation:isolate; overflow:hidden; display:flex; flex-direction:column; gap:14px; border-radius:20px; padding:20px 22px; margin-bottom:16px; border:1px solid rgba(255,255,255,.08); background:radial-gradient(120% 140% at 0% 0%, rgba(56,182,255,.16), transparent 55%), radial-gradient(90% 120% at 100% 100%, rgba(47,199,185,.12), transparent 60%), linear-gradient(160deg, color-mix(in srgb, var(--surface) 86%, #fff 4%), color-mix(in srgb, var(--surface) 92%, #000)); box-shadow:0 18px 40px -22px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.07);}
  .home-hero::before{content:""; position:absolute; left:8%; right:8%; top:0; height:1px; background:linear-gradient(90deg, transparent, #38b6ff 50%, transparent); opacity:.6;}
  .home-hero::after{content:""; position:absolute; z-index:-1; width:260px; height:260px; right:-60px; top:-130px; border-radius:50%; background:radial-gradient(circle, rgba(56,182,255,.22), transparent 70%); filter:blur(10px); pointer-events:none;}
  .hh-top{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:18px; align-items:center;}
  .hh-greet{min-width:0;}
  .hh-eyebrow{display:flex; align-items:center; gap:7px; font:700 11.5px/1 'Barlow',system-ui,sans-serif; letter-spacing:1.4px; text-transform:uppercase; color:var(--ink-dim); margin-bottom:8px;}
  .hh-live{width:7px; height:7px; border-radius:50%; background:#2fc7b9; box-shadow:0 0 0 3px rgba(47,199,185,.18), 0 0 10px #2fc7b9;}
  .home-hi{font-size:26px; line-height:1.15; font-weight:800; color:#fff; letter-spacing:-.2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .home-hi b{background:linear-gradient(90deg, #38b6ff, #2fc7b9); -webkit-background-clip:text; background-clip:text; color:transparent;}
  .home-date{font-size:13px; color:var(--ink-dim); margin-top:4px;}
  .home-go{display:flex; gap:8px; flex-wrap:wrap; margin-top:14px;}
  .home-go button{background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02)); border:1px solid rgba(255,255,255,.09); box-shadow:inset 0 1px 0 rgba(255,255,255,.06); color:var(--ink); border-radius:999px; padding:8px 14px; font:700 13px 'Barlow',sans-serif; cursor:pointer; transition:all .15s;}
  .home-go button:hover{border-color:var(--brand); color:#fff; transform:translateY(-1px);}
  .hh-tile{min-width:0; display:flex; gap:12px; border-radius:16px; padding:12px 14px; border:1px solid rgba(255,255,255,.08); background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.015)); box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 8px 20px -14px rgba(0,0,0,.8); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); color:var(--ink); text-align:left; font:inherit;}
  .hh-lbl{display:flex; align-items:center; gap:6px; font:700 11px/1.2 'Barlow',system-ui,sans-serif; letter-spacing:1px; text-transform:uppercase; color:var(--ink-dim);}
  .hh-sub{font-size:12px; color:var(--ink-dim);}
  /* Accuracy: ring and totals on top, then one column per day with its own rate */
  .hh-acc{flex-direction:column; gap:10px;}
  .hh-acc-head{display:flex; align-items:center; gap:12px;}
  .hh-ring{position:relative; flex:none; width:64px; height:64px; display:grid; place-items:center;}
  .hh-ring svg{position:absolute; inset:0; width:100%; height:100%; transform:rotate(-90deg);}
  .hh-ring circle{fill:none; stroke-width:6;}
  .hh-ring-bg{stroke:rgba(255,255,255,.08);}
  .hh-ring-fg{stroke:url(#hhGrad); stroke-linecap:round; stroke-dasharray:calc(var(--p) * 1) 100; transition:stroke-dasharray .8s cubic-bezier(.2,.8,.2,1);}
  .hh-ring::before{content:""; position:absolute; inset:8px; border-radius:50%; box-shadow:0 0 18px rgba(56,182,255,.35);}
  .hh-ring.lo .hh-ring-fg{stroke:#f59e0b;}
  .hh-ring.lo::before{box-shadow:0 0 18px rgba(245,158,11,.3);}
  .hh-ring b{position:relative; font:800 16px/1 'Barlow',system-ui,sans-serif; color:#fff;}
  .hh-acc-tx{display:flex; flex-direction:column; gap:4px; min-width:0; flex:1;}
  .hh-acc-tx .hh-sub{font-size:13px; color:var(--ink);}
  .hh-best{font-size:11.5px; font-weight:700; color:#4ade80;}
  .hh-best:empty{display:none;}
  .hh-bars{display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:6px; padding-top:8px; border-top:1px solid rgba(255,255,255,.06);}
  .hh-bar{display:flex; flex-direction:column; align-items:center; gap:3px; padding:4px 0; border:0; border-radius:10px; background:none; cursor:pointer; color:var(--ink-dim); font:inherit; transition:background .15s;}
  .hh-bar:disabled{cursor:default;}
  .hh-bar:not(:disabled):hover{background:rgba(255,255,255,.05);}
  .hh-bar em{font-style:normal; font:800 12.5px/1 'Barlow',system-ui,sans-serif; color:#fff;}
  .hh-bar.hi em{color:#4ade80;} .hh-bar.mid em{color:#fcd34d;} .hh-bar.lo em{color:#fb7185;} .hh-bar.none em{color:var(--ink-dim);}
  .hh-col{height:42px; width:18px; display:flex; align-items:flex-end; border-radius:6px; background:rgba(255,255,255,.05); overflow:hidden;}
  .hh-col i{display:block; width:100%; height:calc(var(--h) * 1%); border-radius:6px 6px 3px 3px; background:rgba(255,255,255,.12); transition:height .8s cubic-bezier(.2,.8,.2,1);}
  .hh-bar.hi i{background:linear-gradient(180deg, #4ade80, #10b981);} .hh-bar.mid i{background:linear-gradient(180deg, #fcd34d, #f59e0b);} .hh-bar.lo i{background:linear-gradient(180deg, #fb7185, #ef4444);}
  .hh-bar > span:not(.hh-col){font-size:11px; line-height:1; font-weight:700;}
  .hh-bar small{font-size:9.5px; line-height:1; opacity:.75; min-height:9.5px;}
  /* Rail: three slides side by side on wide screens, a sideways deck with dots on phones */
  .hh-rail{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px;}
  .hh-slide{flex-direction:column; gap:8px;}
  .hh-dots{display:none;}
  .hh-pick, .hh-ticket{cursor:pointer; transition:border-color .15s, transform .15s;}
  .hh-pick:disabled, .hh-ticket:disabled{cursor:default;}
  .hh-pick:not(:disabled):hover, .hh-ticket:not(:disabled):hover{border-color:color-mix(in srgb, var(--brand, #38b6ff) 60%, transparent); transform:translateY(-1px);}
  .hh-pick-body, .hh-ticket-body{display:flex; flex-direction:column; gap:8px; min-width:0; width:100%;}
  .hh-match{display:flex; align-items:center; gap:8px; min-width:0;}
  .hh-teams{display:flex; flex-direction:column; min-width:0;}
  .hh-teams b{font-size:14px; color:#fff; line-height:1.25; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
  .hh-teams small{font-size:11.5px; color:var(--ink-dim); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .hh-pick-row{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
  .hh-chip{padding:4px 10px; border-radius:999px; font-weight:800; font-size:12.5px; color:#04121f; background:linear-gradient(90deg, #38b6ff, #2fc7b9);}
  .hh-odd{font-weight:800; font-size:13px; color:#fff;}
  .hh-meter{display:flex; align-items:center; gap:8px;}
  .hh-meter > span{flex:1; height:6px; border-radius:99px; background:rgba(255,255,255,.08); overflow:hidden;}
  .hh-meter i{display:block; height:100%; border-radius:99px; background:linear-gradient(90deg, #2fc7b9, #4ade80);}
  .hh-meter b{font-size:13px; font-weight:800; color:#4ade80;}
  .hh-foot{font-size:10.5px; color:var(--ink-dim);}
  .hh-res{font-size:11px; font-weight:800; padding:2px 8px; border-radius:999px;}
  .hh-res.w{color:#4ade80; background:rgba(74,222,128,.14);} .hh-res.l{color:#f87171; background:rgba(248,113,113,.14);} .hh-res.p{color:#7dd3fc; background:rgba(56,182,255,.14);}
  .hh-more{margin-left:auto; border:0; background:none; color:var(--brand, #38b6ff); font:700 11px 'Barlow',sans-serif; letter-spacing:.4px; cursor:pointer; padding:0; text-transform:none;}
  .hh-rows{display:flex; flex-direction:column; gap:2px; min-width:0;}
  .hh-row{display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"h r" "a r" "l r"; align-items:center; column-gap:8px; row-gap:1px; padding:5px 4px; border:0; border-radius:8px; background:none; color:var(--ink); font:inherit; text-align:left; cursor:pointer;}
  .hh-row + .hh-row{border-top:1px solid rgba(255,255,255,.05);}
  .hh-row:not(:disabled):hover{background:rgba(255,255,255,.05);}
  .hh-row-t{display:flex; align-items:center; gap:6px; min-width:0;}
  .hh-row-t:first-child{grid-area:h;} .hh-row-t:nth-child(2){grid-area:a;}
  .hh-row-t .lc-crest{width:16px; height:16px; font-size:7px; flex:none;}
  .hh-row-t .lc-crest img{width:14px; height:14px;}
  .hh-row-t b{font-size:12.5px; line-height:1.25; font-weight:700; color:#fff; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .hh-row-l{grid-area:l; padding-left:22px; font-size:10.5px; color:var(--ink-dim); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .hh-row-r{grid-area:r; display:flex; flex-direction:column; align-items:flex-end; gap:3px;}
  .hh-row-r b{font-size:13px; font-weight:800; color:#4ade80;}
  .hh-row-p{font-size:10.5px; font-weight:800; color:#7dd3fc; border:1px solid rgba(56,182,255,.35); border-radius:6px; padding:1px 6px;}
  .hh-row-st{font-style:normal; display:inline-grid; vertical-align:-2px; margin-right:4px; width:13px; height:13px; border-radius:50%; place-items:center; color:#fff; font-size:8.5px; font-weight:800;}
  .hh-row-st.w{background:#16a34a;} .hh-row-st.l{background:#dc2626;}
  .hh-tk-head{display:flex; align-items:center; justify-content:space-between; gap:8px;}
  .hh-tk-head b{font-size:14px; color:#fff; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .hh-tk-odd{display:flex; align-items:baseline; gap:8px;}
  .hh-tk-odd b{font:800 26px/1 'Barlow',system-ui,sans-serif; background:linear-gradient(90deg, #fcd34d, #f59e0b); -webkit-background-clip:text; background-clip:text; color:transparent;}
  .hh-tk-odd small{font-size:11.5px; color:var(--ink-dim);}
  .hh-tk-legs{display:flex; flex-direction:column; gap:4px; font-size:12px; min-width:0;}
  .hh-tk-legs > span{display:flex; align-items:center; gap:6px; min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
  .hh-tk-legs i{flex:none; width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.3);}
  .hh-tk-legs i.w{background:#4ade80;} .hh-tk-legs i.l{background:#f87171;}
  .hh-tk-legs em{font-style:normal; margin-left:auto; padding-left:6px; font-weight:800; color:#7dd3fc;}
  .hh-tk-legs small{font-size:11px; color:var(--ink-dim);}
  @media (max-width:1100px){ .hh-top{grid-template-columns:1fr;} }
  .flt-bar{display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px 14px; padding:12px 16px; margin-bottom:14px; background:var(--surface-2);}
  .flt-search{flex:1 1 260px; min-width:200px;}
  .flt-search input{width:100%; padding:10px 14px; background:var(--surface); border:1px solid var(--border); border-radius:8px; color:var(--ink); font-size:13.5px;}
  .flt-f{display:flex; flex-direction:column; gap:4px; font-size:11px; font-weight:700; color:var(--ink-dim); text-transform:uppercase; letter-spacing:.3px;}
  .flt-f select{background:var(--surface); border:1px solid var(--border); color:var(--ink); border-radius:8px; padding:8px 10px; font-size:13px; min-width:120px; text-transform:none; letter-spacing:0; font-weight:600;}
  .flt-c{display:flex; align-items:center; gap:6px; font-size:12.5px; color:var(--ink); cursor:pointer; padding-bottom:9px;}
  .flt-reset{background:none; border:1px solid var(--border); color:var(--ink-dim); border-radius:8px; padding:8px 14px; font-weight:700; cursor:pointer; margin-bottom:1px;}
  .flt-reset:hover{color:var(--ink); border-color:var(--ink-dim);}
  .flt-count{margin-left:auto; font-size:12.5px; color:var(--ink-dim); padding-bottom:9px; font-weight:700;}
  .tp-tier{display:flex; gap:6px; margin:0 0 8px;}
  .tp-tier button{flex:1; background:var(--surface-3); border:1px solid var(--border); color:var(--ink-dim); border-radius:8px; padding:6px 8px; font:800 12px 'Barlow',sans-serif; cursor:pointer;}
  .tp-tier button small{font-weight:600; opacity:.8; margin-left:3px;}
  .tp-tier button.on{background:rgba(16,185,129,.16); border-color:var(--brand); color:var(--brand);}
  .tp-date{display:flex; align-items:center; justify-content:center; gap:10px; margin:2px 0 8px; font-size:12px; font-weight:700; color:var(--ink);}
  .tp-date button{background:var(--surface-3); border:1px solid var(--border); color:var(--ink); border-radius:6px; width:26px; height:22px; cursor:pointer; font-weight:800;}
  .tp-date button:disabled{opacity:.35; cursor:default;}
  .home-row2{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:14px;}
  @media(max-width:1300px){.home-row2{grid-template-columns:repeat(2,1fr);}}
  @media(max-width:700px){.home-row2{grid-template-columns:1fr;}}
  .hm-scroll{max-height:290px; overflow-y:auto; display:flex; flex-direction:column; gap:8px; margin-top:6px; padding-right:4px;}
  .hm-item{font-size:12.5px; line-height:1.45; color:var(--ink); border-left:3px solid var(--brand); padding:2px 0 2px 9px;}
  .hm-item b{display:block; font-size:12px; color:var(--ink-dim); margin-bottom:1px;}
  .wl{display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border-radius:50%; font-size:11px; font-weight:900; color:#fff; flex-shrink:0;} .wl.w{background:#16a34a;} .wl.l{background:#b91c1c;} .wl.v{background:#64748b;}
  .tk-status{display:inline-flex; align-items:center; gap:6px; font-weight:800;}
  .rd-row{display:grid; grid-template-columns:20px auto 1fr auto; gap:8px; align-items:center; font-size:12px; padding:6px 0; border-bottom:1px solid var(--border);}
  .rd-row .m{font-weight:700; line-height:1.2;} .rd-row .m span{display:block; font-weight:400; font-size:10.5px; color:var(--ink-faint);}
  .rd-edge{font-weight:800; color:#4ade80; font-size:13px; text-align:right;} .rd-edge small{display:block; font-weight:400; font-size:10px; color:var(--ink-faint);}
  .tk-leg{display:flex; justify-content:space-between; gap:8px; font-size:12.5px; padding:6px 0; border-bottom:1px solid var(--border);}
  .tk-leg span{color:var(--ink-dim); font-size:11px; display:block;}
  .tk-total{display:flex; justify-content:space-between; align-items:center; margin-top:8px; font-weight:800;}
  .tk-btn{width:100%; margin-top:10px; background:linear-gradient(135deg,var(--brand),var(--brand-dark)); color:#000; border:0; border-radius:8px; padding:10px; font-weight:800; cursor:pointer;}
  .ld-wrap{padding:22px 18px;}
  .ld-head{display:flex; align-items:center; justify-content:center; gap:10px; color:var(--ink-dim); font-weight:700; font-size:15px; margin-bottom:12px;}
  .ld-ball{display:inline-block; font-size:22px; animation:ldBounce .9s cubic-bezier(.3,.7,.4,1) infinite;}
  @keyframes ldBounce{0%,100%{transform:translateY(0) rotate(0);}50%{transform:translateY(-10px) rotate(180deg);}}
  .ld-dots b{display:inline-block; width:5px; height:5px; margin-left:3px; border-radius:50%; background:var(--brand); animation:ldDot 1.2s infinite;}
  .ld-dots b:nth-child(2){animation-delay:.2s;} .ld-dots b:nth-child(3){animation-delay:.4s;}
  @keyframes ldDot{0%,80%,100%{opacity:.2;}40%{opacity:1;}}
  .ld-bar{height:3px; background:var(--surface-3); border-radius:2px; overflow:hidden; margin:0 auto 18px; max-width:420px;}
  .ld-bar i{display:block; height:100%; width:35%; background:linear-gradient(90deg,transparent,var(--brand),transparent); animation:ldSlide 1.1s ease-in-out infinite;}
  @keyframes ldSlide{0%{transform:translateX(-100%);}100%{transform:translateX(300%);}}
  .sk-row{display:grid; grid-template-columns:.7fr 2.2fr 1.2fr 1.2fr 1fr; gap:14px; padding:16px 14px; margin-bottom:10px; background:var(--surface-2); border:1px solid var(--border); border-radius:12px;}
  .sk{display:block; height:16px; border-radius:6px; background:linear-gradient(90deg,var(--surface-3) 25%,rgba(255,255,255,.08) 50%,var(--surface-3) 75%); background-size:200% 100%; animation:skShine 1.3s linear infinite;}
  .sk-b{height:26px;} .sk-d{height:34px;}
  @keyframes skShine{0%{background-position:200% 0;}100%{background-position:-200% 0;}}
  @media(prefers-reduced-motion:reduce){.ld-ball,.ld-bar i,.sk,.ld-dots b{animation:none;}}
  #summaryModal{z-index:1000;}
  .sm-modal{max-width:940px;}
  .sm-modal .modal-head{padding:10px 16px;}
  .sm-modal .modal-body{padding:12px 16px;}
  .sm-story{background:var(--surface-2); border:1px solid var(--border); border-left:4px solid var(--brand); border-radius:8px; padding:8px 12px; font-size:12.5px; line-height:1.5; margin-bottom:10px;}
  .sm-story p{margin:0 0 4px;} .sm-story p:last-child{margin:0;}
  .sm-grid{display:grid; grid-template-columns:1fr 1fr; gap:4px 18px;}
  @media(max-width:760px){.sm-grid{grid-template-columns:1fr;}}
  .sm-sec{margin-bottom:6px;}
  .sm-sec h4{margin:0 0 3px; font-size:12px; color:var(--brand); letter-spacing:.3px;}
  .sm-tbl{width:100%; border-collapse:collapse; font-size:12px;}
  .sm-tbl td{padding:3px 6px; border-bottom:1px solid var(--border);}
  .sm-tbl td:nth-child(2), .sm-tbl td:nth-child(3){text-align:right; font-weight:700; white-space:nowrap;}
  .sm-tbl td small{display:block; font-weight:400; color:var(--ink-faint); font-size:10.5px;}
  .sm-main td{background:rgba(16,185,129,.10);}
  .sm-note{font-size:11px; color:var(--ink-faint); margin-top:6px;}
  .sm-head{padding:10px 16px !important; align-items:flex-start;}
  .sm-teams{display:flex; align-items:center; justify-content:center; gap:14px;}
  .sm-tn{font-weight:800; font-size:17px; color:#fff; flex:1; min-width:0;} .sm-tn.r{text-align:right;}
  .sm-crest{width:42px; height:42px; object-fit:contain; flex-shrink:0;} .sm-crest0{font-size:28px; text-align:center; line-height:42px;}
  .sm-time{text-align:center; min-width:70px;} .sm-time b{display:block; font-size:22px; line-height:1.1; color:#fff;} .sm-time small{color:var(--ink-dim); font-size:12px;}
  .sm-meta{display:flex; justify-content:center; gap:18px; margin-top:8px; font-size:11.5px; color:var(--ink-dim); font-weight:700; flex-wrap:wrap;}
  .sm-meta span{display:inline-flex; align-items:center; gap:5px;} .sm-lg{width:16px; height:16px; object-fit:contain;}
  .st{display:flex; height:30px; border-radius:8px; overflow:hidden; font-weight:800; font-size:12.5px; gap:2px;}
  .st>div{display:flex; align-items:center; justify-content:center; color:#04121f;}
  .st .h{background:linear-gradient(90deg,#10b981,#34d399);} .st .d{background:#94a3b8;} .st .a{background:linear-gradient(90deg,#38bdf8,#0ea5e9);}
  .st-l{display:flex; justify-content:space-between; gap:6px; font-size:10.5px; color:var(--ink-dim); margin:3px 2px 8px;} .st-l span{flex:1; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .odds3,.chips{display:grid; gap:6px; margin-bottom:6px;} .odds3{grid-template-columns:repeat(3,1fr);} .chips{grid-template-columns:1fr 1fr;}
  .odds3>div,.chips>div{background:var(--surface-2); border:1px solid var(--border); border-radius:8px; padding:5px 6px; text-align:center; display:flex; flex-direction:column; gap:1px; align-items:center;}
  .odds3 small,.chips small{font-size:10px; color:var(--ink-dim); font-weight:700;} .chips b{font-size:14px;}
  .odds3>div.on,.chips>div.on,.gb.on{border-color:var(--brand); box-shadow:0 0 0 1px var(--brand) inset; background:rgba(16,185,129,.10);}
  .od{font-weight:800; font-size:13px;} .od.book{color:var(--brand);} .od.fair{color:var(--ink-dim);} .od.none{color:var(--ink-faint); font-weight:600; font-size:11px;}
  .gb{display:grid; grid-template-columns:58px 1fr 38px 42px; gap:8px; align-items:center; padding:4px 6px; margin-bottom:4px; border:1px solid transparent; border-radius:8px; font-size:12px;}
  .gb .gl{font-weight:700;} .gb b{text-align:right;} .gb .od{text-align:right;}
  .gt{height:8px; background:var(--surface-3); border-radius:5px; overflow:hidden;} .gt i{display:block; height:100%; background:linear-gradient(90deg,#10b981,#34d399); border-radius:5px;}
  .cms{display:grid; grid-template-columns:1fr 1fr; gap:8px;}
  .cm{background:var(--surface-2); border:1px solid var(--border); border-radius:10px; padding:7px 9px;}
  .cm-top{display:flex; justify-content:space-between; align-items:baseline; font-size:12px;} .cm-top b{font-size:15px;} .cm-top span{color:var(--ink-dim); font-weight:700; font-size:11px;} .cm-top em{font-style:normal; color:var(--ink-faint);}
  .cm-bar{display:flex; height:6px; border-radius:4px; overflow:hidden; margin:5px 0; gap:2px;} .cm-bar .l{background:#10b981;} .cm-bar .r{background:#38bdf8;}
  .cm-line{display:flex; justify-content:space-between; align-items:center; font-size:11px; color:var(--ink-dim);} .cm-line b{color:var(--ink);}
  .pks{display:grid; grid-template-columns:1fr 1fr; gap:8px;}
  .pk{border:1px solid var(--border); border-radius:10px; padding:8px 10px; background:var(--surface-2);} .pk small{font-size:9.5px; color:var(--ink-dim); font-weight:800; letter-spacing:.3px;}
  .pk b{display:block; font-size:20px; margin:2px 0 4px;} .pk.main{border-color:var(--brand); background:rgba(16,185,129,.10);} .pk.alt{border-color:#f59e0b; background:rgba(245,158,11,.08);}
  .pk-p{height:6px; background:var(--surface-3); border-radius:4px; overflow:hidden;} .pk-p i{display:block; height:100%; background:var(--brand);} .pk.alt .pk-p i{background:#f59e0b;}
  .pk-f{display:flex; justify-content:space-between; margin-top:5px; font-weight:800; font-size:13px;}
  .qp{cursor:pointer; border-radius:8px; transition:transform .12s, box-shadow .12s, background .12s;}
  .qp-off{cursor:not-allowed; opacity:.75;}
  #qpToast{position:fixed; left:50%; bottom:84px; transform:translateX(-50%) translateY(10px); z-index:1200; background:var(--surface-3); color:var(--ink); border:1.5px solid var(--brand); border-radius:10px; padding:10px 16px; font-size:13px; font-weight:700; box-shadow:0 8px 28px rgba(0,0,0,.5); opacity:0; pointer-events:none; transition:opacity .2s, transform .2s;}
  #qpToast.show{opacity:1; transform:translateX(-50%);}
  .qp:hover{transform:translateY(-1px); box-shadow:0 0 0 1.5px var(--brand);}
  .qp.selected{box-shadow:0 0 0 2px var(--brand); background:rgba(16,185,129,.16);}
  #quickSlip{position:fixed; right:18px; bottom:18px; width:340px; max-height:72vh; z-index:940; display:none; flex-direction:column; background:var(--surface); border:1.5px solid var(--brand); border-radius:14px; box-shadow:0 14px 40px rgba(0,0,0,.55); overflow:hidden;}
  #quickSlip.open{display:flex; animation:qsIn .18s ease-out;}
  @keyframes qsIn{from{transform:translateY(14px); opacity:0;}to{transform:none; opacity:1;}}
  .qs-head{display:flex; justify-content:space-between; align-items:center; padding:10px 14px; background:var(--topbar-bg); border-bottom:1px solid var(--border);}
  .qs-head b{font-size:15px; color:#fff;} .qs-head button{background:none; border:0; color:var(--ink-dim); font-size:15px; cursor:pointer;}
  .qs-legs{overflow-y:auto; padding:4px 12px; flex:1;}
  .qs-leg{display:grid; grid-template-columns:auto 1fr auto auto; gap:8px; align-items:center; padding:8px 0; border-bottom:1px solid var(--border); font-size:12.5px;}
  .qs-leg span{display:block; color:var(--ink-dim); font-size:11px;} .qs-leg span i{font-style:normal; color:var(--ink-faint);}
  .qs-leg em{font-style:normal; font-weight:800; color:#fbbf24; font-size:14px;}
  .qs-leg button{background:none; border:0; color:var(--ink-faint); cursor:pointer;} .qs-leg button:hover{color:#f87171;}
  .qs-foot{padding:10px 14px 12px; border-top:1px solid var(--border);}
  .qs-row{display:flex; justify-content:space-between; font-size:12.5px; padding:2px 0; color:var(--ink-dim);} .qs-row b{color:var(--ink);} .qs-tot{color:#fbbf24 !important; font-size:17px;}
  .qs-go{width:100%; margin-top:8px; background:linear-gradient(135deg,var(--brand),var(--brand-dark)); color:#000; border:0; border-radius:8px; padding:10px; font-weight:800; cursor:pointer;}
  .qs-clear{width:100%; margin-top:6px; background:none; border:1px solid var(--border); color:var(--ink-dim); border-radius:8px; padding:7px; cursor:pointer; font-weight:700;}
  @media(max-width:700px){#quickSlip{left:8px; right:8px; bottom:104px; width:auto; max-height:60vh;}}
  .tk-module{margin-bottom:18px; padding-bottom:12px;}
  .tk-tabs{display:flex; gap:8px; overflow-x:auto; padding:2px 0 10px; scrollbar-width:thin;}
  .tk-tab{flex:1 0 auto; min-width:150px; display:flex; flex-direction:column; gap:2px; text-align:left; background:var(--surface-3); border:1px solid var(--border); color:var(--ink-dim); border-radius:12px; padding:9px 12px; cursor:pointer; transition:all .15s;}
  .tk-tab b{display:flex; align-items:center; justify-content:space-between; gap:8px; color:var(--ink); font-size:13.5px;}
  .tk-tab small{font-size:10.5px; line-height:1.3;}
  .tk-tab:hover{border-color:var(--brand);}
  .tk-tab.on{background:rgba(16,185,129,.14); border-color:var(--brand); box-shadow:0 0 0 1px var(--brand) inset;}
  .tk-body{display:grid; grid-template-columns:1.6fr 1fr; gap:18px; align-items:start;}
  @media(max-width:900px){.tk-body{grid-template-columns:1fr;}}
  .tk-legs .tk-leg{display:grid; grid-template-columns:22px auto 1fr auto; gap:10px; align-items:center; padding:9px 0; border-bottom:1px solid var(--border);}
  .tk-legs .tk-leg{text-align:left;}
  .tk-side{text-align:left;}
  .tk-legs .tk-leg .m b{display:block; font-size:13.5px;} .tk-legs .tk-leg .m span{display:block; font-size:11.5px; color:var(--ink-dim);}
  .tk-legs .tk-leg em{font-style:normal; font-weight:800; color:#fbbf24; font-size:16px;}
  .tk-fam{font-size:9.5px; padding:1px 6px; border-radius:6px; background:var(--surface-3); color:var(--ink-dim); font-weight:800; margin-left:6px;}
  .tk-side h4{margin:0 0 4px; font-size:16px; color:#fff;} .tk-side .tg{font-size:12px; color:var(--ink-dim); margin-bottom:10px;}
  .tk-chips{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:10px;} .tk-chips span{font-size:11px; font-weight:700; background:var(--surface-3); border:1px solid var(--border); border-radius:8px; padding:3px 8px;}
  .tk-big{display:flex; justify-content:space-between; align-items:baseline; font-weight:800; margin:6px 0;} .tk-big b{font-size:28px; color:#fbbf24;}
  .tk-warn{font-size:11.5px; line-height:1.5; color:var(--ink-dim); background:var(--surface-2); border-left:3px solid #f59e0b; border-radius:6px; padding:7px 10px; margin-top:8px;}
  .lg-jobs{display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:8px; margin-bottom:14px;}
  .lg-job{background:var(--surface-3); border:1px solid var(--border); border-radius:10px; padding:8px 10px; cursor:pointer; text-align:left; color:var(--ink);}
  .lg-job:hover,.lg-job.on{border-color:var(--brand);} .lg-job b{display:block; font-size:12.5px;} .lg-job small{color:var(--ink-dim); font-size:11px;}
  .lg-job.err{border-color:#b91c1c;} .lg-job .dot{display:inline-block; width:8px; height:8px; border-radius:50%; background:#16a34a; margin-right:6px;} .lg-job.err .dot{background:#ef4444;}
  .lg-bar{display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:10px;}
  .lg-bar select,.lg-bar input[type=search]{background:var(--surface-3); color:var(--ink); border:1px solid var(--border); border-radius:8px; padding:7px 10px; font-size:13px;}
  .lg-list{font-family:ui-monospace,Consolas,monospace; font-size:12px; max-height:64vh; overflow:auto; border:1px solid var(--border); border-radius:10px; background:var(--surface-2);}
  .lg-row{display:grid; grid-template-columns:132px 170px 1fr; gap:10px; padding:5px 10px; border-bottom:1px solid var(--border); align-items:baseline;}
  .lg-row .t{color:var(--ink-dim);} .lg-row .s{color:#7dd3fc; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .lg-row .m{word-break:break-word;}
  .lg-row.warn .m{color:#fbbf24;} .lg-row.error{background:rgba(185,28,28,.12);} .lg-row.error .m{color:#f87171;}
  @media(max-width:800px){.lg-row{grid-template-columns:1fr;}}
  .ag-head{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; margin-bottom:12px;}
  .ag-bar{display:flex; flex-wrap:wrap; gap:10px 16px; align-items:center; margin-bottom:12px;}
  .ag-day{display:flex; gap:6px; align-items:center;} .ag-day .btn{padding:6px 11px; font-size:13px;} .ag-day input{padding:6px 8px; font-size:13px; min-width:0;}
  .ag-check{font-size:12.5px; color:var(--ink-dim); display:flex; gap:6px; align-items:center; white-space:nowrap; margin:0;} .ag-check input{width:auto; min-width:0; margin:0; flex:none;}
  .ag-dg{background:var(--surface-2); border:1px solid var(--border); border-radius:10px; padding:10px 12px; margin-bottom:14px;}
  .ag-dg-top{display:flex; flex-wrap:wrap; gap:8px; align-items:center; justify-content:space-between;}
  .ag-dg-top small{color:var(--ink-dim); font-size:12px;}
  .ag-dg-btns{display:flex; flex-wrap:wrap; gap:6px;} .ag-dg-btns .btn{font-size:12.5px; padding:5px 10px;}
  .ag-dg textarea{width:100%; box-sizing:border-box; margin-top:8px; min-height:160px; max-height:420px; font:12px/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; resize:vertical; background:var(--surface-1, transparent); color:inherit; border:1px solid var(--border); border-radius:8px; padding:8px;}
  .ag-dg[hidden-body] textarea{display:none;}
  .ag-sc-p{display:flex; gap:4px;} .ag-sc-p .btn{font-size:12.5px; padding:5px 10px;} .ag-sc-p .btn.on{background:var(--accent, #3b82f6); color:#fff; border-color:transparent;}
  .ag-sc-wrap{overflow-x:auto; margin-top:8px;}
  .ag-sc-t{width:100%; border-collapse:collapse; font-size:12.5px; min-width:560px;}
  .ag-sc-t th{color:var(--ink-faint); font-size:11px; font-weight:600; text-align:right; padding:5px 6px; border-bottom:1px solid var(--border); white-space:nowrap;}
  .ag-sc-t td{padding:6px; border-bottom:1px solid var(--border); text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums;}
  .ag-sc-t th:first-child, .ag-sc-t td:first-child{text-align:left; white-space:normal;}
  .ag-sc-t td small{display:block; color:var(--ink-dim); font-size:11px;}
  .ag-bl-verdict{font-weight:700; font-size:14px; margin:6px 0;} .ag-bl-verdict.pos{color:var(--win);} .ag-bl-verdict.neg{color:var(--loss);} .ag-bl-note{font-size:12px; color:var(--ink-dim); margin-bottom:8px;}
  .pk-box{border:1px solid var(--border); border-radius:10px; padding:12px; margin-bottom:14px;} .pk-chips{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:8px;} .pk-chip{padding:6px 10px; border-radius:8px; background:rgba(255,255,255,0.04); font-size:12px; color:var(--ink-dim);} .pk-chip b{display:block; font-size:15px; color:var(--ink);} .pk-chip b.pos{color:var(--win);} .pk-chip b.neg{color:var(--loss);} .pk-spark{width:100%; height:60px; display:block;} .pk-note{font-size:11.5px; color:var(--ink-faint); margin-top:4px;}
  .adm-alerts{display:flex; flex-direction:column; gap:6px; margin-bottom:14px;} .adm-alert{padding:8px 12px; border-radius:8px; font-size:12.5px; font-weight:600;} .adm-alert.red{background:rgba(239,68,68,0.14); border:1px solid rgba(239,68,68,0.35); color:var(--loss);} .adm-alert.amber{background:rgba(245,158,11,0.12); border:1px solid rgba(245,158,11,0.3); color:#fbbf24;}
  .adm-actions-t{width:100%; border-collapse:collapse; font-size:12px; text-align:left;} .adm-actions-t th{padding:8px; color:var(--ink-faint); font-size:11px; text-transform:uppercase; border-bottom:1px solid var(--border);} .adm-actions-t td{padding:7px 8px; border-bottom:1px solid var(--border); vertical-align:top;} .adm-actions-t td small{display:block; color:var(--ink-faint);} .adm-actions-t .bad{color:var(--loss);}
  .ag-sc-shadow{display:inline-block; margin-left:6px; font-size:11px; color:var(--ink-dim); white-space:nowrap;} .ag-sc-flag{display:block; margin-top:4px; font-size:11px; padding:2px 4px; background:var(--panel-2,transparent); color:inherit; border:1px solid var(--line,#333); border-radius:6px;} tr.ag-sc-shadowed td{opacity:.6;}
  .ag-sc-v{display:inline-block; padding:2px 7px; border-radius:999px; font-size:11px; font-weight:700;}
  .ag-sc-v.KAZANDIRIYOR{background:rgba(34,197,94,.16); color:#4ade80;} .ag-sc-v.KAYBETTIRIYOR{background:rgba(239,68,68,.16); color:#f87171;}
  .ag-sc-v.BELIRSIZ{background:rgba(234,179,8,.16); color:#facc15;} .ag-sc-v.AZ_VERI{background:var(--surface-3, rgba(148,163,184,.15)); color:var(--ink-dim);}
  .ag-sc-t .pos{color:#4ade80;} .ag-sc-t .neg{color:#f87171;}
  .ag-sc-ns{margin-top:8px; font-size:12px; color:var(--ink-dim);}
  @media(max-width:720px){
    .ag-sc-t{min-width:0;} .ag-sc-t thead{display:none;} .ag-sc-note{display:none;}
    .ag-sc-t tr{display:grid; grid-template-columns:repeat(5,1fr); gap:2px 6px; padding:8px 0; border-bottom:1px solid var(--border);}
    .ag-sc-t td{border:0; padding:0; text-align:left;}
    .ag-sc-t td:nth-child(1){grid-column:1 / 4;} .ag-sc-t td:nth-child(2){grid-column:4 / 6; text-align:right;}
    .ag-sc-t td[data-l]::before{content:attr(data-l); display:block; color:var(--ink-faint); font-size:10.5px;}
  }
  .ag-sum{display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:14px;}
  .ag-sum div{background:var(--surface-2); border:1px solid var(--border); border-radius:10px; padding:8px 10px;} .ag-sum b{display:block; font-size:18px;} .ag-sum small{color:var(--ink-dim); font-size:11.5px;}
  .ag-list{display:flex; flex-direction:column; gap:10px;}
  /* Telefonda ajanlar ikon ızgarası (app.js renderAgents); dokunulan ajanın kartı ızgaranın altında açılır. */
  .ag-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px;}
  .ag-grid > .ag-card{grid-column:1 / -1; margin:2px 0 6px;}
  .ag-ico{display:flex; flex-direction:column; align-items:center; gap:2px; padding:6px 2px 4px; background:none; border:1px solid transparent; border-radius:12px; color:var(--ink); font:inherit; cursor:pointer; min-width:0;}
  .ag-ico .ag-av{width:40px; height:40px; font-size:20px;}
  .ag-ico .ag-av em{position:absolute; top:-4px; right:-6px; min-width:17px; height:17px; padding:0 4px; box-sizing:border-box; border-radius:999px; font-size:10.5px; font-weight:700; line-height:17px; font-style:normal; color:#fff; text-align:center;}
  .ag-ico .ag-av em.e{background:#ef4444;} .ag-ico .ag-av em.w{background:#d97706;}
  .ag-ico .n{font-size:11px; font-weight:700; line-height:1.2; text-align:center; max-width:100%; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
  .ag-ico small{font-size:10px; color:var(--ink-dim);}
  .ag-ico.idle{opacity:.55;}
  .ag-ico.on{background:color-mix(in srgb, var(--ag) 14%, var(--surface-2)); border-color:color-mix(in srgb, var(--ag) 60%, transparent);}
  .ag-hint{grid-column:1 / -1; font-size:12px; color:var(--ink-dim); text-align:center; padding:4px 0 2px;}
  .ag-card{background:var(--surface-2); border:1px solid var(--border); border-left:4px solid var(--ag); border-radius:12px; overflow:hidden;}
  .ag-card.idle{opacity:.6;} .ag-card.err{border-color:#b91c1c; border-left-color:var(--ag);}
  .ag-top{display:flex; gap:12px; align-items:center; padding:10px 12px; cursor:pointer; width:100%; background:none; border:0; color:var(--ink); text-align:left; font:inherit;}
  .ag-av{position:relative; flex:none; width:48px; height:48px; border-radius:50%; display:grid; place-items:center; font-size:25px; line-height:1; background:radial-gradient(circle at 30% 25%, color-mix(in srgb, var(--ag) 55%, transparent), color-mix(in srgb, var(--ag) 18%, var(--surface-3)) 70%); box-shadow:0 0 0 2px color-mix(in srgb, var(--ag) 70%, transparent), 0 4px 14px color-mix(in srgb, var(--ag) 25%, transparent);}
  .ag-av i{position:absolute; right:-1px; bottom:-1px; width:13px; height:13px; border-radius:50%; background:var(--ink-faint); border:2px solid var(--surface-2);}
  .ag-av i.on{background:#16a34a;} .ag-av i.on:after{content:""; position:absolute; inset:-4px; border-radius:50%; border:2px solid #16a34a; animation:agPulse 1.6s ease-out infinite;}
  .ag-av i.bad{background:#ef4444;}
  @keyframes agPulse{from{opacity:.9; transform:scale(.6);} to{opacity:0; transform:scale(1.6);}}
  @media (prefers-reduced-motion: reduce){.ag-av i.on:after{animation:none;}}
  .ag-who{flex:1; min-width:0;} .ag-who b{display:block; font-size:14px;} .ag-who small{display:block; color:var(--ink-dim); font-size:11.5px; line-height:1.4;}
  .ag-chips{display:flex; flex-wrap:wrap; gap:5px; justify-content:flex-end; flex:none; max-width:46%;}
  .ag-chip{font-size:11px; padding:2px 8px; border-radius:999px; background:var(--surface-3); color:var(--ink-dim); white-space:nowrap;} .ag-chip.e{background:rgba(185,28,28,.18); color:#f87171;} .ag-chip.w{background:rgba(217,119,6,.16); color:#fbbf24;}
  .ag-tl{border-top:1px solid var(--border); padding:4px 0;}
  .ag-row{display:grid; grid-template-columns:62px 150px 1fr; gap:10px; padding:4px 12px; font-size:12.5px; align-items:baseline;}
  .ag-row .t{font-family:ui-monospace,Consolas,monospace; color:var(--ink-dim);} .ag-row .s{color:var(--ag); font-weight:700; font-size:11.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .ag-row .m{word-break:break-word;}
  .ag-row.warn .m{color:#fbbf24;} .ag-row.error{background:rgba(185,28,28,.12);} .ag-row.error .m{color:#f87171;}
  .ag-row.min-cont .t{visibility:hidden;}
  .ag-more{display:block; margin:4px 12px 8px; padding:5px 10px; font-size:12px; background:none; border:1px dashed var(--border); border-radius:8px; color:var(--ink-dim); cursor:pointer;}
  .ag-empty{padding:8px 12px; font-size:12px; color:var(--ink-dim);}
  @media(max-width:720px){
    .ag-sum{grid-template-columns:repeat(2,1fr);}
    .ag-top{flex-wrap:wrap;} .ag-chips{max-width:none; width:100%; justify-content:flex-start; padding-left:60px;}
    .ag-row{grid-template-columns:48px 1fr; gap:2px 8px;} .ag-row .m{grid-column:2;}
    .ag-day input{width:136px;}
  }
  /* Telefonda Ajanlar: yönetim başlığı, açıklamalar ve rapor kartları daralır, ajan listesi ilk ekranda görünür.
     Rapor kartları (karne, harman, niş, sorun özeti) yalnızca başlık satırı olarak durur; başlığa dokununca açılır. */
  @media(max-width:720px){
    .adm-top{margin-bottom:8px !important; gap:8px !important; flex-wrap:nowrap !important;}
    .adm-top > div{min-width:0;}
    .adm-top h3{font-size:14px; line-height:1.25;}
    .adm-badge,.adm-desc{display:none !important;}
    .adm-top .btn{flex:none; white-space:nowrap;}
    #panel-admin .mt-adminrow{padding:6px 10px; margin-bottom:8px; font-size:12px; gap:6px; flex-wrap:nowrap;} #panel-admin .mt-why{display:none;}
    #panel-admin .mt-adminrow .btn{padding:4px 10px; font-size:11.5px; flex:none;}
    #panel-admin .adm-alerts{margin-bottom:8px; gap:4px;} #panel-admin .adm-alert{padding:5px 9px; font-size:11.5px;}
    #panel-admin .admin-subnav{padding-bottom:6px; gap:4px;}
    #panel-admin .admin-subtab{padding:6px 10px; font-size:12.5px;}
    #panel-admin .admin-layout{gap:10px;}
    .ag-head{margin-bottom:8px; flex-wrap:nowrap; align-items:baseline;}
    .ag-head h3{font-size:16px;}
    .ag-desc{display:none;}
    .ag-bar{gap:6px 12px; margin-bottom:8px;}
    .ag-day .btn{padding:5px 9px;}
    .ag-dg{padding:0; margin-bottom:6px;}
    .ag-dg .ag-dg-top{padding:7px 10px;} .ag-dg-t b{font-size:14px;}
    .ag-dg.ag-open{padding:0 10px 10px;} .ag-dg.ag-open .ag-dg-top{padding:8px 0;}
    .ag-dg-t{cursor:pointer; flex:1; min-width:0; display:flex; align-items:center; gap:6px; flex-wrap:wrap;}
    .ag-dg-t::after{content:'▾'; margin-left:auto; color:var(--ink-dim); font-size:13px; transition:transform .15s;}
    .ag-dg.ag-open .ag-dg-t::after{transform:rotate(180deg);}
    .ag-dg-t br{display:none;} .ag-dg-t small{flex-basis:100%; order:2;}
    .ag-dg:not(.ag-open) .ag-dg-t small,.ag-dg:not(.ag-open) .ag-dg-top > :not(.ag-dg-t),.ag-dg:not(.ag-open) > :not(.ag-dg-top){display:none;}
    .ag-sum{grid-template-columns:repeat(4,1fr); gap:6px; margin-bottom:10px;}
    .ag-sum div{padding:6px 7px;} .ag-sum b{font-size:15px;} .ag-sum small{font-size:10px; line-height:1.2; display:block;}
    .ag-dg.ag-open .ag-dg-t{flex-basis:100%;}
  }
  /* V-DİREKTÖR */
  .dr-head{display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:14px;}
  /* Balina Avı tab: view chips and shared explanation blocks */
  .vf-tabs{display:flex; gap:6px; flex-wrap:wrap; margin:6px 0;}
  .vf-ev{margin:3px 0 3px 18px; padding:0; font-size:12px;}
  .vf-ev li{margin:1px 0;}
  .vf-ev.pos li::marker{content:'＋ '; color:var(--win);}
  .vf-ev.neg li::marker{content:'－ '; color:var(--loss);}
  .vf-ev.inf li::marker{content:'· '; color:var(--ink-faint);}
  .vf-banner{display:flex; align-items:center; gap:8px; padding:7px 12px; border-radius:10px; background:var(--brand-tint); font-size:12.5px; margin-bottom:10px;}
  .vf-plain{font-size:13px; color:var(--ink); margin:6px 0 4px; line-height:1.45;}
  .vf-note{font-size:11px; color:var(--ink-faint); margin-top:6px; line-height:1.4;}
  /* Balina Avı (🐋 tab) */
  .wh-status{display:flex; gap:6px; flex-wrap:wrap; margin:2px 0 8px;}
  .wh-pill{font-size:11px; border:1px solid var(--border); border-radius:999px; padding:2px 9px; background:var(--surface); color:var(--ink-dim); white-space:nowrap;}
  .wh-pill b{color:var(--ink);} .wh-pill.ok{border-color:var(--win); color:var(--win);} .wh-pill.bad{border-color:var(--loss); color:var(--loss);} .wh-pill.warn{border-color:#f59e0b; color:#f59e0b;}
  .wh-tabs{display:flex; gap:4px; flex-wrap:wrap; margin:0 0 8px; border-bottom:1px solid var(--border); padding-bottom:6px;}
  .wh-tabs button{font-size:12px; padding:4px 11px; border-radius:999px; border:1px solid var(--border); background:var(--surface); color:var(--ink-dim); cursor:pointer; font-weight:600;}
  .wh-tabs button.on{border-color:var(--brand); background:var(--brand-tint); color:var(--brand);}
  .wh-tools{display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin-bottom:8px;}
  .wh-tools select,.wh-tools input{height:28px; padding:2px 8px; font-size:12px; border-radius:7px; border:1px solid var(--border); background:var(--surface); color:var(--ink); max-width:160px;}
  .wh-tools input[type=search]{max-width:150px;} .wh-tools input[type=number]{width:74px;}
  .wh-tools .btn{height:28px; padding:0 10px !important; font-size:12px !important;}
  .wh-wrap{overflow-x:auto; border:1px solid var(--border); border-radius:10px; background:var(--surface);}
  .wh-tbl{width:100%; border-collapse:collapse; font-size:12px; min-width:980px;}
  .cb-tbl{min-width:0;}
  .cb-tbl td:nth-child(n+3), .cb-tbl th:nth-child(n+3){white-space:nowrap; text-align:right;}
  .cb-legs{margin:0; padding-left:16px;}
  .cb-legs li{margin:1px 0;}
  .wh-tbl th{font-size:11px; color:var(--ink-dim); text-align:left; padding:6px 8px; border-bottom:1px solid var(--border); white-space:nowrap; position:sticky; top:0; background:var(--surface);}
  .wh-tbl td{padding:6px 8px; border-bottom:1px solid var(--border); vertical-align:top;}
  .wh-tbl tr.wh-row{cursor:pointer;} .wh-tbl tr.wh-row:hover td{background:rgba(127,127,127,.06);} .wh-tbl tr.wh-row.on td{background:var(--brand-tint);}
  .wh-tbl tr.wh-late td{opacity:.62;}
  .wh-tbl small,.wh-small{color:var(--ink-dim); font-size:11px;}
  .wh-m{font-weight:600; display:flex; align-items:center; gap:4px; flex-wrap:wrap;}
  .wh-dir{font-weight:700; white-space:nowrap;} .wh-dir.f{color:var(--win);} .wh-dir.a{color:var(--loss);} .wh-dir.n{color:var(--ink-faint);}
  .wh-bar{display:inline-block; width:46px; height:6px; border-radius:3px; background:rgba(127,127,127,.15); overflow:hidden; vertical-align:middle; margin-right:4px;}
  .wh-bar i{display:block; height:100%;}
  .wh-tg{font-size:10.5px; padding:1px 6px; border-radius:999px; border:1px solid var(--border); white-space:nowrap;}
  .wh-det td{background:var(--bg, transparent); padding:10px;}
  .wh-grid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px;}
  .wh-card{border:1px solid var(--border); border-radius:10px; background:var(--surface); padding:10px 12px; font-size:12px;}
  .wh-card h5{margin:0 0 6px; font-size:12px; color:var(--ink-dim); font-weight:700;}
  .wh-card.wide{grid-column:1 / -1;}
  .wh-kv{display:grid; grid-template-columns:auto 1fr; gap:2px 10px;} .wh-kv span:nth-child(odd){color:var(--ink-dim);}
  .wh-acts{display:flex; gap:6px; flex-wrap:wrap; margin-top:8px;} .wh-acts button{font-size:11.5px; padding:3px 10px; border-radius:7px; border:1px solid var(--border); background:var(--surface); color:var(--ink); cursor:pointer;} .wh-acts button.on{border-color:var(--brand); color:var(--brand);}
  .wh-form{display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:8px 14px; font-size:12px;}
  .wh-form label{display:flex; flex-direction:column; gap:3px; color:var(--ink-dim);} .wh-form label.chk{flex-direction:row; align-items:center; gap:6px; color:var(--ink);}
  .wh-form input,.wh-form select{height:28px; padding:2px 8px; font-size:12px; border-radius:7px; border:1px solid var(--border); background:var(--surface); color:var(--ink);}
  .wh-empty{padding:18px; text-align:center; color:var(--ink-dim); font-size:12.5px;}
  .wh-form label.chk{justify-content:flex-start;} .wh-form label.chk input[type=checkbox]{width:16px !important; height:16px !important; min-width:16px; padding:0; margin:0; flex:0 0 16px;}
  @media (max-width: 720px){
    .wh-grid{grid-template-columns:1fr;} .wh-tools select,.wh-tools input{max-width:48%; flex:1 1 46%;}
    .wh-wrap{overflow:visible; border:none; background:none;}
    .wh-tbl.ev{min-width:0;} .wh-tbl.ev tr:first-child{display:none;}
    .wh-tbl.ev tr.wh-row{display:grid; grid-template-columns:1fr 1fr; gap:2px 10px; border:1px solid var(--border); border-radius:10px; margin-bottom:8px; padding:8px 10px; background:var(--surface);}
    .wh-tbl.ev tr.wh-row td{border:none; padding:2px 0;} .wh-tbl.ev tr.wh-row td[data-l]::before{content:attr(data-l); display:block; font-size:10px; color:var(--ink-faint);}
    .wh-tbl.ev tr.wh-row td.wide{grid-column:1 / -1;}
    .wh-tbl.ev tr.wh-det{display:block;} .wh-tbl.ev tr.wh-det td{display:block; padding:4px 0;}
  }
  .ver-badge{position:relative; display:inline-flex; align-items:center; gap:4px; padding:5px 11px; border-radius:999px; border:1px solid var(--border); background:var(--surface); color:var(--ink-dim); font-size:12px; font-weight:700; cursor:default; margin-right:8px; white-space:nowrap;}
  .ver-badge .ver-pop{display:none; position:absolute; right:0; top:calc(100% + 6px); width:340px; max-width:80vw; background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:10px 12px; box-shadow:0 8px 24px rgba(0,0,0,.35); z-index:50; text-align:left; font-weight:400; color:var(--ink); font-size:12px; white-space:normal; line-height:1.4;}
  .ver-badge:hover .ver-pop,.ver-badge:focus .ver-pop,.ver-badge:focus-within .ver-pop{display:block;}
  .ver-pop h4{margin:0 0 2px; font-size:12.5px;}
  .ver-pop .d{color:var(--ink-faint); font-size:11px; margin-bottom:3px;}
  .ver-pop ul{margin:0 0 8px 16px; padding:0;}
  @media (max-width:720px){
    .ver-badge{padding:4px 8px; font-size:11px; margin-right:4px;}
  }
  /* Polymarket chips, tools and logos (Balina Avı, Kombineler, En iyi bahisçiler, Takım Eşleştirme) */
  .mf-chip{flex:none; display:inline-flex; align-items:center; gap:5px; padding:4px 10px; border-radius:999px; border:1px solid var(--border); background:var(--surface); font-size:12px; cursor:pointer; white-space:nowrap; color:var(--ink);}
  .mf-chip img{width:14px; height:14px; object-fit:contain;}
  .mf-chip small{color:var(--ink-dim);}
  .mf-chip.on{border-color:var(--brand); background:var(--brand-tint); font-weight:700;}
  .mf-tools{display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:10px;}
  .mf-tools select{padding:5px 10px; font-size:12.5px;}
  .mf-stamp{font-size:12px; color:var(--ink-dim);}
  .mf-league{border:1px solid var(--border); border-radius:10px; margin-bottom:10px; overflow:hidden; background:var(--surface);}
  .mf-logo{width:16px; height:16px; object-fit:contain; vertical-align:-3px; margin-right:4px;}
  .tm-row{display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1.3fr) minmax(0,.9fr) auto; gap:8px; align-items:center; padding:6px 10px; border-bottom:1px solid var(--border); font-size:12.5px;}
  .tm-row.head{font-size:10.5px; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.03em;}
  .tm-row.edit{background:var(--brand-tint);}
  .tm-row input{padding:5px 8px; font-size:12.5px; min-width:0;}
  .tm-p{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600;}
  .tm-p small{color:var(--ink-faint); font-weight:400; margin-left:6px;}
  .tm-a{display:flex; gap:6px; justify-content:flex-end; flex-wrap:wrap;}
  .tm-a .btn{font-size:11.5px; padding:4px 9px;}
  @media (max-width:760px){ .tm-row{grid-template-columns:1fr 1fr;} .tm-row.head{display:none;} }
  .dr-state{display:flex; align-items:center; gap:10px; font-size:15px; font-weight:800;}
  .dr-dot{width:12px; height:12px; border-radius:50%; background:var(--win); flex:none;}
  .dr-dot.warn{background:var(--draw);} .dr-dot.critical{background:var(--loss);} .dr-dot.idle{background:var(--ink-faint);} .dr-dot.info{background:#7dd3fc;}
  .dr-duties{display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:10px; margin-bottom:16px;}
  .dr-duty{background:var(--surface-2); border:1px solid var(--border); border-radius:10px; padding:10px 12px;}
  .dr-duty b{display:flex; align-items:center; gap:8px; font-size:13px;} .dr-duty small{display:block; color:var(--ink-dim); font-size:11.5px; margin-top:2px;}
  .dr-duty p{margin:6px 0 0; font-size:12px; color:var(--ink-dim); line-height:1.45;}
  .dr-find{border:1px solid var(--border); border-left:4px solid #7dd3fc; border-radius:10px; padding:10px 12px; margin-bottom:8px; background:var(--surface-2);}
  .dr-find.warn{border-left-color:var(--draw);} .dr-find.critical{border-left-color:var(--loss);} .dr-find.ack{opacity:.65;}
  .dr-find .h{display:flex; justify-content:space-between; gap:10px; align-items:flex-start;} .dr-find .h b{font-size:13px;}
  .dr-find .d{font-size:12.5px; color:var(--ink-dim); margin-top:4px; line-height:1.45;} .dr-find .s{font-size:12.5px; margin-top:4px;}
  .dr-find .m{font-size:11px; color:var(--ink-faint); margin-top:6px;} .dr-find .m a{color:var(--brand);}
  .dr-tag{font-size:10.5px; font-weight:800; padding:2px 7px; border-radius:6px; background:var(--surface-3); color:var(--ink-dim); white-space:nowrap;}
  .dr-bars{display:flex; flex-direction:column; gap:6px;}
  .dr-bar{display:grid; grid-template-columns:minmax(120px,210px) 1fr 70px; gap:10px; align-items:center; font-size:12.5px;}
  .dr-bar .tr{height:10px; background:var(--surface-3); border-radius:5px; overflow:hidden;} .dr-bar .tr i{display:block; height:100%; background:var(--brand); border-radius:5px;}
  .dr-bar .n{text-align:right; font-variant-numeric:tabular-nums;} .dr-bar .j{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .dr-grid2{display:grid; grid-template-columns:1fr 1fr; gap:14px;} @media(max-width:900px){.dr-grid2{grid-template-columns:1fr;}}
  .dr-daily{font-size:12.5px; border-bottom:1px solid var(--border); padding:8px 0;} .dr-daily:last-child{border-bottom:0;} .dr-daily ul{margin:4px 0 0; padding-left:18px; color:var(--ink-dim);}
  .lv-rules{display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:12px; margin-bottom:14px;}
  .lv-rule{background:var(--surface-3); border:1px solid var(--border); border-radius:12px; padding:12px;}
  .lv-rule h5{margin:0 0 4px; font-size:14px;} .lv-rule .w{font-size:11.5px; color:var(--ink-dim); line-height:1.45; min-height:32px;}
  .lv-rule .bet{display:inline-block; margin:6px 0; font-size:11px; font-weight:800; padding:2px 8px; border-radius:8px; background:rgba(16,185,129,.15); color:#34d399;}
  .lv-rec{display:flex; justify-content:space-between; align-items:baseline; font-size:12px; margin-top:6px;} .lv-rec b{font-size:20px;}
  .lv-bar{height:6px; border-radius:4px; background:var(--surface-2); overflow:hidden; margin-top:4px;} .lv-bar i{display:block; height:100%; background:#10b981;}
  .lv-row{display:grid; grid-template-columns:24px auto 1fr auto; gap:10px; align-items:center; padding:9px 0; border-bottom:1px solid var(--border);}
  .lv-row .m b{display:block; font-size:13.5px;} .lv-row .m span{display:block; font-size:11.5px; color:var(--ink-dim); line-height:1.4;}
  .lv-min{font-weight:800; color:#fbbf24; font-size:13px; text-align:right; white-space:nowrap;}
  .lv-cols{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px;} @media(max-width:1000px){.lv-cols{grid-template-columns:1fr;}}
  .lv-status{display:flex; gap:14px; flex-wrap:wrap; font-size:12.5px; color:var(--ink-dim); margin-bottom:12px;} .lv-status b{color:var(--ink);}
  .lv-subtabs{display:flex; gap:8px; margin-bottom:14px; flex-wrap:wrap;}
  /* LIVE_FOURTH_GOAL ("4. Gol") monitoring screen: compact one-card-per-match list, mobile first. */
  .fg-top{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:12px;}
  .fg-badge{display:inline-block; font-size:11px; font-weight:800; padding:3px 8px; border-radius:6px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink-dim);}
  .fg-badge.paper{color:#fbbf24; border-color:#fbbf24;} .fg-badge.live{color:var(--loss); border-color:var(--loss);}
  .fg-badge.ok{color:var(--win); border-color:var(--win);} .fg-badge.bad{color:var(--loss); border-color:var(--loss);}
  .fg-btn{padding:7px 12px; border-radius:8px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink); font-size:12px; font-weight:700; cursor:pointer;}
  .fg-btn.danger{border-color:var(--loss); color:var(--loss);}
  .fg-list{display:grid; gap:8px;}
  .fg-card{border:1px solid var(--border); border-radius:10px; padding:10px 12px; background:var(--surface-2); min-width:0;}
  .fg-card .h{display:flex; justify-content:space-between; gap:8px; align-items:baseline;}
  .fg-card .h b{font-size:13.5px; overflow-wrap:anywhere;} .fg-card .h .min{font-weight:800; color:var(--brand); white-space:nowrap;}
  .fg-card .sub{font-size:11.5px; color:var(--ink-dim); margin-top:2px;}
  .fg-grid{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:6px; margin-top:8px;}
  .fg-grid div{background:var(--surface); border-radius:7px; padding:5px 6px; min-width:0;}
  .fg-grid span{display:block; font-size:10px; color:var(--ink-faint);} .fg-grid b{font-size:12.5px;}
  .fg-why{font-size:11.5px; margin-top:7px; color:var(--ink-dim); overflow-wrap:anywhere;}
  .fg-why .d{font-weight:800;} .fg-why .d.ready{color:var(--win);} .fg-why .d.nobet{color:var(--draw);}
  .fg-sum{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:8px; margin-bottom:12px;}
  .fg-sum div{background:var(--surface-3); border:1px solid var(--border); border-radius:10px; padding:8px 10px; min-width:0;}
  .fg-sum span{display:block; font-size:10.5px; color:var(--ink-dim);} .fg-sum b{font-size:16px;}
  .fg-sec{font-size:11px; font-weight:800; color:var(--ink-dim); text-transform:uppercase; letter-spacing:.03em; margin:14px 0 2px;}
  .fg-sec:first-child{margin-top:0;}
  .fg-row{border-bottom:1px solid var(--border);} .fg-row:last-child{border-bottom:none;}
  .fg-row > summary{list-style:none; cursor:pointer; display:grid; grid-template-columns:22px minmax(0,1fr) auto; gap:8px; align-items:center; padding:8px 0;}
  .fg-row > summary::-webkit-details-marker{display:none;}
  .fg-row .ic{font-size:15px; text-align:center;}
  .fg-row .m b{display:block; font-size:13px; overflow-wrap:anywhere;}
  .fg-row .m span{display:block; font-size:11.5px; color:var(--ink-dim); line-height:1.4; overflow-wrap:anywhere;}
  .fg-row .r{text-align:right; white-space:nowrap;}
  .fg-row .m span span, .fg-row .m span strong{display:inline;}
  .fg-res{display:inline-block; font-size:10.5px; font-weight:800; padding:2px 7px; border-radius:6px; background:var(--surface-2); color:var(--ink-dim); border:1px solid var(--border);}
  .fg-res.won{color:var(--win); border-color:var(--win);} .fg-res.lost{color:var(--loss); border-color:var(--loss);}
  .fg-res.open{color:#fbbf24; border-color:#fbbf24;} .fg-res.live{color:var(--brand); border-color:var(--brand);}
  .fg-logo{width:16px; height:16px; object-fit:contain; vertical-align:-3px; margin-right:5px;} .fg-logo.after{margin:0 0 0 5px;}
  .fg-tick{display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border-radius:50%; font-size:12px; font-weight:900;}
  .fg-tick.ok{background:rgba(16,185,129,.18); color:var(--win);} .fg-tick.no{background:var(--surface-2); color:var(--ink-faint);}
  .fg-road{display:flex; flex-direction:column; gap:8px;}
  .fg-road .it{display:grid; grid-template-columns:22px minmax(0,1fr); gap:8px; align-items:start;}
  .fg-road .it b{font-size:12.5px;} .fg-road .it span{display:block; font-size:11.5px; color:var(--ink-dim); line-height:1.4;}
  .fg-road .it span.who{display:inline; font-size:10px; font-weight:800; color:var(--ink-faint); margin-left:6px;}
  .fg-prog{height:7px; border-radius:4px; background:var(--surface-2); overflow:hidden; margin:6px 0 2px;} .fg-prog i{display:block; height:100%; background:var(--brand);}
  .fg-ok{color:var(--win); font-weight:700;} .fg-no{color:var(--loss); font-weight:700;}
  .fg-det{display:flex; flex-wrap:wrap; gap:5px; padding:0 0 10px 30px;}
  .fg-det .full{flex-basis:100%; font-size:11px; color:var(--ink-dim);}
  .fg-more > summary{cursor:pointer; font-size:13px; font-weight:800;} .fg-more[open] > summary{margin-bottom:10px;}
  .fg-table{width:100%; border-collapse:collapse; font-size:11.5px;} .fg-table td,.fg-table th{padding:5px 4px; border-bottom:1px solid var(--border); text-align:left;}
  .fg-form{display:grid; grid-template-columns:repeat(auto-fill, minmax(150px,1fr)); gap:8px;}
  .fg-form label{font-size:11px; color:var(--ink-dim); display:flex; flex-direction:column; gap:3px;}
  .fg-form input,.fg-form select{padding:6px 8px; border-radius:7px; border:1px solid var(--border); background:var(--surface); color:var(--ink); font-size:12.5px; min-width:0;}
  .fg-scroll{overflow-x:auto;}
  /* Sessiz Volkan V2: inner tabs over the same compact rows as 4. Gol. */
  .vs-tabs{display:flex; gap:4px; flex-wrap:wrap; margin-bottom:10px; border-bottom:1px solid var(--border);}
  .vs-tabs button{padding:7px 11px; border:none; border-bottom:2px solid transparent; background:none; color:var(--ink-dim); font-size:12.5px; font-weight:700; cursor:pointer; margin-bottom:-1px;}
  .vs-tabs button.active{color:var(--brand); border-bottom-color:var(--brand);}
  .vs-pane{display:none;} .vs-pane.active{display:block;}
  .vs-checks{display:flex; flex-wrap:wrap; gap:4px 10px; flex-basis:100%; font-size:11px; color:var(--ink-dim);}
  .vs-checks .y{color:var(--win);} .vs-checks .n{color:var(--ink-faint);}
  @media (max-width: 640px){ .fg-grid{grid-template-columns:repeat(2, minmax(0,1fr));} .fg-sum{grid-template-columns:repeat(2, minmax(0,1fr));} .fg-det{padding-left:0;} }
  .lv-subtabs button{padding:9px 16px; border-radius:10px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink-dim); font-size:13px; font-weight:700; cursor:pointer;}
  .lv-subtabs button.active{background:var(--brand-tint); color:var(--brand); border-color:var(--brand);}
  /* Kupon Oku */
  .cs-drop{display:flex; align-items:center; justify-content:center; gap:14px; min-height:120px; padding:14px; border:2px dashed var(--border); border-radius:12px; background:var(--surface-2); cursor:pointer; text-align:center; color:var(--ink-dim); font-size:13px;}
  .cs-drop.over{border-color:var(--brand); background:var(--brand-tint);}
  .cs-drop img{max-height:220px; max-width:45%; border-radius:8px; object-fit:contain;}
  .cs-actions{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:12px;}
  /* Kupon Oku: reading progress */
  .cs-drop{position:relative; overflow:hidden;}
  .cs-drop.scanning{cursor:progress; border-color:var(--brand);}
  .cs-drop.scanning img{filter:saturate(.7) brightness(.85);}
  .cs-drop.scanning::after{content:''; position:absolute; left:0; right:0; top:0; height:42px; background:linear-gradient(180deg, transparent, var(--brand-tint) 70%, var(--brand) 100%); opacity:.85; animation:csBeam 1.6s ease-in-out infinite alternate; pointer-events:none;}
  @keyframes csBeam{from{transform:translateY(-42px);}to{transform:translateY(calc(var(--cs-h, 240px)));}}
  .cs-prog{margin-top:12px; padding:12px; border:1px solid var(--border); border-radius:12px; background:var(--surface-2);}
  .cs-prog-top{display:flex; align-items:center; gap:8px; margin-bottom:6px; font-size:12px; color:var(--ink-dim); font-variant-numeric:tabular-nums;}
  .cs-prog-top b{font-size:15px; font-weight:800; color:var(--ink); min-width:42px;}
  .cs-prog-stop{margin-left:auto; padding:3px 10px; border-radius:8px; border:1px solid var(--border); background:var(--surface); color:var(--ink-dim); font-size:12px; cursor:pointer;}
  .cs-prog-bar{height:8px; border-radius:6px; background:var(--surface-3); overflow:hidden;}
  .cs-prog-bar i{display:block; height:100%; width:0; border-radius:6px; background:linear-gradient(90deg, var(--brand), #38bdf8); transition:width .5s ease;}
  .cs-steps{list-style:none; margin:10px 0 0; padding:0; display:grid; gap:6px;}
  .cs-steps li{display:flex; align-items:center; gap:8px; font-size:13px; color:var(--ink-faint);}
  .cs-steps li .ic{width:18px; height:18px; flex:none; border-radius:50%; border:2px solid var(--border); display:inline-flex; align-items:center; justify-content:center; font-size:11px; font-weight:900;}
  .cs-steps li.on{color:var(--ink); font-weight:700;}
  .cs-steps li.on .ic{border-color:var(--brand); border-top-color:transparent; animation:csSpin .8s linear infinite;}
  .cs-steps li.ok{color:var(--ink-dim);} .cs-steps li.ok .ic{border-color:var(--win); background:var(--win); color:#fff;}
  .cs-steps li.skip{opacity:.5;} .cs-steps li.bad .ic{border-color:var(--loss); background:var(--loss); color:#fff;}
  @keyframes csSpin{to{transform:rotate(360deg);}}
  .cs-prog-note{margin-top:8px; font-size:12px; color:var(--ink-dim); min-height:1em;}
  @media (prefers-reduced-motion:reduce){.cs-drop.scanning::after,.cs-steps li.on .ic{animation:none;} .cs-prog-bar i{transition:none;}}
  .cs-status{font-size:12.5px; color:var(--ink-dim);}
  .cs-status.err{color:var(--loss);}
  .cs-edit{margin-top:14px; padding:12px; border:1px solid var(--border); border-radius:12px; background:var(--surface-2);}
  .cs-edit-head{font-weight:700; font-size:13px; margin-bottom:8px;} .cs-edit-head small{font-weight:400; color:var(--ink-faint);}
  .cs-row{display:grid; grid-template-columns:1fr 1fr 1.2fr 70px 30px; gap:6px; margin-bottom:6px;}
  .cs-row input[data-k="kickoff"]{grid-column:1 / 3;} .cs-row input[data-k="competition"]{grid-column:3 / 6;} .cs-row input.unc{border-color:#eab308; box-shadow:0 0 0 1px #eab308;}
  .cs-row input{min-width:0; padding:7px 8px; border-radius:8px; border:1px solid var(--border); background:var(--surface); color:var(--ink); font-size:13px;}
  .cs-row button{border:none; background:none; color:var(--ink-faint); cursor:pointer; font-size:16px;}
  .cs-sum{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:8px; margin:16px 0 10px;}
  .cs-sum div{background:var(--surface-2); border:1px solid var(--border); border-radius:10px; padding:10px; text-align:center;}
  .cs-sum small{display:block; font-size:10.5px; color:var(--ink-faint); text-transform:uppercase; font-weight:700;}
  .cs-sum b{display:block; font-family:'Barlow Condensed',sans-serif; font-size:22px; margin-top:2px;}
  .cs-notes{margin:0 0 12px; padding-left:18px; font-size:13px; line-height:1.55;}
  /* Kupon Oku: a slip line drawn like a match-list row (crests, kick-off, the pick with its confidence ring) */
  .cs-list{border:1px solid var(--border); border-radius:14px; background:var(--surface-2); overflow:hidden; margin-bottom:12px;}
  .cs-list-h{display:flex; align-items:center; gap:8px; padding:10px 12px; font-weight:800; font-size:14px; border-bottom:1px solid var(--border);}
  .cs-m{padding:8px 10px 10px; border-top:1px solid rgba(255,255,255,.07);}
  .cs-list-h + .cs-m{border-top:none;}
  .cs-m[data-home]{cursor:pointer;} .cs-m[data-home]:active{background:rgba(16,185,129,.08);}
  .cs-lg{display:flex; align-items:center; gap:5px; font-size:10.5px; font-weight:700; color:var(--ink-faint); min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-bottom:4px;}
  .cs-lg img{width:13px; height:13px; object-fit:contain; flex:none;}
  .cs-mr{display:grid; grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr) auto; align-items:center; column-gap:5px; min-height:40px;}
  .cs-t{display:flex; align-items:center; gap:5px; min-width:0; font-size:13px; font-weight:700; color:var(--ink);}
  .cs-t.h{justify-content:flex-end; text-align:right;}
  .cs-t span{min-width:0; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; line-height:1.2; hyphens:auto;}
  .cs-t img{width:26px; height:26px; object-fit:contain; flex:none;}
  .cs-k{text-align:center; font-size:13px; font-weight:800; color:var(--ink); font-variant-numeric:tabular-nums; line-height:1.15;}
  .cs-k small{display:block; font-size:9.5px; font-weight:600; color:var(--ink-faint);}
  .cs-pk{display:grid; grid-template-columns:auto auto; grid-template-rows:auto auto; grid-auto-flow:column; column-gap:5px; align-items:center; justify-items:center; min-width:58px; max-width:112px; padding:4px 6px; border-radius:9px; background:rgba(255,255,255,.06); line-height:1.15; text-align:center;}
  .cs-pk b{font-size:11.5px; font-weight:800; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%;}
  .cs-pk i{font-style:normal; font-size:11px; font-weight:800; color:#111; background:#f5c518; border-radius:5px; padding:0 4px; font-variant-numeric:tabular-nums;}
  .cs-vl{display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:7px; font-size:11.5px; color:var(--ink-faint);}
  /* Kupon Oku report: headline, per-selection detail, structure, missing data */
  .cs-head{margin:16px 0 10px; padding:12px 14px; border-radius:12px; border:1px solid var(--border); border-left:4px solid var(--draw); background:var(--surface-2); font-size:13.5px; line-height:1.55; color:var(--ink);}
  .cs-head p{margin:0 0 4px;} .cs-head p:last-child{margin:0;}
  .cs-ask{margin:0 0 10px; padding:10px 12px; border-radius:10px; background:rgba(234,179,8,.12); color:var(--ink); font-size:12.5px; line-height:1.5;}
  .cs-ask b{display:block; margin-bottom:3px;}
  .cs-vf{margin-left:auto; flex:none; font-size:10px; font-weight:800; padding:1px 7px; border-radius:999px; background:var(--surface-3); color:var(--ink-faint);}
  .cs-vf.ok{background:var(--brand-tint); color:var(--win);} .cs-vf.no{background:rgba(239,68,68,.15); color:var(--loss);} .cs-vf.amb{background:rgba(234,179,8,.15); color:var(--draw);}
  .cs-short{margin-top:6px; font-size:12px; color:var(--ink-dim); line-height:1.45;}
  .cs-dt{margin-top:6px; font-size:12.5px; line-height:1.5; color:var(--ink-dim);}
  .cs-dt summary{cursor:pointer; font-weight:700; color:var(--brand); font-size:12px;}
  .cs-dt h5{margin:8px 0 2px; font-size:11px; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-faint);}
  .cs-dt ul{margin:0; padding-left:18px;} .cs-dt p{margin:0;}
  .cs-box{border:1px solid var(--border); border-radius:12px; background:var(--surface-2); padding:12px 14px; margin-bottom:12px; font-size:13px; line-height:1.55;}
  .cs-box h4{margin:0 0 6px; font-size:14px;} .cs-box ul{margin:0; padding-left:18px;} .cs-box p{margin:0 0 6px;}
  /* Kupon Oku: compact result (summary first, every long text folded) */
  .cs-card .cs-sum{grid-template-columns:repeat(4, minmax(0,1fr)); gap:6px; margin:12px 0 8px;}
  .cs-card .cs-sum div{padding:7px 4px; border-radius:9px;}
  .cs-card .cs-sum small{font-size:9.5px; letter-spacing:.02em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .cs-card .cs-sum b{font-size:19px; line-height:1.1;}
  .cs-card .cs-head{margin:0 0 8px; padding:9px 12px; font-size:12.5px; line-height:1.5;}
  .cs-more summary{cursor:pointer; font-size:11.5px; font-weight:700; color:var(--brand); margin-top:2px;}
  .cs-more p{margin:4px 0 0;}
  .cs-lg > span{min-width:0; overflow:hidden; text-overflow:ellipsis;}
  .cs-chips{display:flex; flex-wrap:wrap; gap:4px; margin-top:5px;}
  .cs-chip{font-size:10.5px; font-weight:700; padding:1px 7px; border-radius:999px; background:var(--surface-3); color:var(--ink-dim); white-space:nowrap;}
  .cs-chip.up{background:var(--brand-tint); color:var(--win);} .cs-chip.down{background:rgba(239,68,68,.15); color:var(--loss);} .cs-chip.eq{background:rgba(234,179,8,.15); color:var(--draw);}
  .cs-m .cs-warn{margin-top:5px; font-size:11.5px; line-height:1.4;}
  .cs-m .cs-dt{margin-top:4px;}
  .cs-m .cs-dt summary{list-style:none; display:flex; align-items:flex-start; gap:6px; color:var(--ink-dim); font-weight:500;}
  .cs-m .cs-dt summary::-webkit-details-marker{display:none;}
  .cs-m .cs-dt summary::after{content:'▸'; flex:none; margin-left:auto; color:var(--brand); font-size:12px; line-height:1.45; transition:transform .15s;}
  .cs-m .cs-dt[open] summary::after{transform:rotate(90deg);}
  .cs-m .cs-dt summary .cs-short{margin:0; font-size:11.5px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
  .cs-m .cs-dt[open] summary .cs-short{display:block;}
  .cs-folds{display:grid; gap:6px; margin-bottom:8px;}
  .cs-fold{border:1px solid var(--border); border-radius:11px; background:var(--surface-2); font-size:12.5px; line-height:1.5; color:var(--ink-dim);}
  .cs-fold summary{cursor:pointer; list-style:none; display:flex; align-items:center; gap:6px; padding:9px 12px; font-weight:800; font-size:13px; color:var(--ink);}
  .cs-fold summary::-webkit-details-marker{display:none;}
  .cs-fold summary small{font-weight:700; font-size:10.5px; padding:0 6px; border-radius:999px; background:var(--surface-3); color:var(--ink-faint);}
  .cs-fold summary::after{content:'▸'; margin-left:auto; color:var(--brand); transition:transform .15s;}
  .cs-fold[open] summary::after{transform:rotate(90deg);}
  .cs-fold > div{padding:0 12px 10px;} .cs-fold ul{margin:0; padding-left:18px;} .cs-fold p{margin:0 0 6px;}
  .cs-money{display:flex; flex-wrap:wrap; gap:4px 12px; margin:0 0 8px; padding:7px 10px; border-radius:10px; background:var(--surface-2); border:1px solid var(--border); font-size:12.5px; font-weight:700; color:var(--ink);}
  .cs-money small{display:block; font-size:9.5px; font-weight:700; text-transform:uppercase; color:var(--ink-faint);}
  .cs-save{border:1px solid var(--brand); border-radius:12px; background:var(--brand-tint); padding:10px 12px; margin:0 0 8px;}
  .cs-save-h{font-weight:800; font-size:13.5px; color:var(--ink); margin-bottom:6px;} .cs-save-h small{display:block; font-weight:500; font-size:11.5px; color:var(--ink-dim);}
  .cs-save-row{display:flex; align-items:flex-end; gap:8px;}
  .cs-save-row label{display:flex; flex-direction:column; gap:3px; font-size:11px; font-weight:700; color:var(--ink-dim);}
  .cs-save-row input{width:110px; padding:7px 9px; border-radius:8px; border:1px solid var(--border); background:var(--surface); color:var(--ink); font-size:14px; font-weight:700;}
  .cs-save-ret{flex:1; min-width:0; font-size:12px; font-weight:700; color:var(--win); padding-bottom:8px;}
  .cs-save-row .btn{flex:none; padding:8px 14px;}
  .cs-save-note{margin-top:6px; font-size:11.5px; color:var(--draw);}
  .cs-save-msg{margin-top:6px; font-size:12.5px; color:var(--win);} .cs-save-msg.err{color:var(--loss);}
  .cs-link{border:none; background:none; color:var(--brand); font-weight:800; text-decoration:underline; cursor:pointer; padding:0; font-size:12.5px;}
  .scl-grade{display:flex; flex-wrap:wrap; align-items:center; gap:5px; padding:4px 8px 8px 36px; font-size:11px; color:var(--ink-dim);}
  .scl-grade button{padding:3px 8px; border-radius:7px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink); font-size:11px; font-weight:700; cursor:pointer;}
  /* After a result the upload area shrinks to a thumbnail row so the answer starts near the top. */
  .cs-done .cs-drop{flex-direction:row; min-height:0; padding:8px 10px; justify-content:flex-start; text-align:left; gap:10px;}
  .cs-done .cs-drop img{max-height:56px; max-width:44px;}
  .cs-done .cs-actions{margin-top:8px;}
  @media (max-width: 640px){
    .cs-card{padding:12px;}
    .cs-card .cs-intro > div{font-size:12px !important;}
    .cs-done .cs-intro > div{display:none;}
    .cs-done .cs-intro{margin-bottom:8px !important;}
    .cs-drop{min-height:96px;}
    .cs-drop img{max-height:150px;}
    .cs-card .cs-sum b{font-size:17px;}
    .cs-m{padding:7px 8px 8px;}
    .cs-pk{min-width:50px; padding:3px 5px;}
    .cs-row{grid-template-columns:1fr 1fr; }
    .cs-row input[data-k="selection"]{grid-column:1 / 3;} .cs-row input[data-k="kickoff"]{grid-column:1 / 2;} .cs-row input[data-k="competition"]{grid-column:2 / 3;}
  }
  .cs-edit summary{cursor:pointer; list-style:none;} .cs-edit summary::-webkit-details-marker{display:none;}
  .cs-edit[open] summary{margin-bottom:8px;}
  .cs-leg{border:1px solid var(--border); border-radius:12px; padding:12px; margin-bottom:10px; background:var(--surface-2);}
  .cs-leg-top{display:flex; justify-content:space-between; gap:8px; align-items:flex-start;}
  .cs-teams{font-weight:800; font-size:14px;} .cs-meta{font-size:11.5px; color:var(--ink-faint); margin-top:2px;}
  .cs-pick{display:flex; align-items:center; gap:6px; margin-top:8px; flex-wrap:wrap; font-size:13px;}
  .cs-pick .p{font-weight:700; padding:3px 8px; border-radius:6px; background:var(--surface-3);}
  .cs-pick .o{font-weight:800; padding:3px 8px; border-radius:6px; background:#f5c518; color:#111;}
  .cs-badge{font-size:11px; font-weight:800; padding:3px 8px; border-radius:20px; white-space:nowrap;}
  .cs-badge.değerli{background:var(--brand-tint); color:var(--win);} .cs-badge.adil{background:var(--surface-3); color:var(--draw);} .cs-badge.değersiz{background:rgba(239,68,68,.15); color:var(--loss);} .cs-badge.yok{background:var(--surface-3); color:var(--ink-faint);}
  .cs-bars{display:grid; grid-template-columns:96px 1fr 44px; gap:4px 8px; align-items:center; margin-top:10px; font-size:11.5px; color:var(--ink-dim);}
  .cs-bars .t{height:8px; border-radius:6px; background:var(--surface-3); overflow:hidden;} .cs-bars .t i{display:block; height:100%; border-radius:6px;}
  .cs-bars b{text-align:right; color:var(--ink);}
  .cs-say{font-size:12.5px; color:var(--ink-dim); margin-top:8px; line-height:1.5;}
  .sc-chip{font-size:11px; font-weight:700; padding:2px 8px; border-radius:999px; background:var(--surface-2); border:1px solid var(--border); color:var(--ink-dim); white-space:nowrap;}
  .sc-chip i{font-style:normal; font-weight:600; color:var(--ink-faint);}
  .sc-btn{border:1px solid var(--border); background:var(--surface-2); color:var(--ink-dim); border-radius:8px; font-size:11px; font-weight:700; padding:3px 8px; cursor:pointer;}
  .cs-warn{font-size:12.5px; color:var(--draw); margin-top:8px;}
  @media (max-width:640px){
    .cs-sum{grid-template-columns:repeat(2, minmax(0,1fr));}
    .cs-row{grid-template-columns:1fr 1fr; padding-bottom:8px; border-bottom:1px solid var(--border);} .cs-row input[data-k="selection"]{grid-column:1 / 2;} .cs-row button{justify-self:end;} .cs-row input[data-k="kickoff"], .cs-row input[data-k="competition"]{grid-column:auto;}
    .cs-drop{flex-direction:column;} .cs-drop img{max-width:100%;}
  }
  .lv-subpanel{display:none;} .lv-subpanel.active{display:block;}
  .ht-tools{display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:10px; font-size:12px; color:var(--ink-dim);}
  .ht-tools label{display:inline-flex !important; align-items:center; gap:6px; margin:0 !important; font-size:12px !important; color:var(--ink-dim);}
  .ht-tools label input[type=checkbox]{width:auto; margin:0;} .ht-tools select{padding:5px 8px; width:auto;}
  .ht-row{display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:10px; align-items:center; padding:10px 0; border-bottom:1px solid var(--border);}
  .ht-row .m b{display:block; font-size:13.5px;} .ht-row .m span{display:block; font-size:11.5px; color:var(--ink-dim);}
  .ht-pk{display:flex; gap:8px; text-align:center;}
  .ht-pk div{min-width:74px; padding:5px 8px; border-radius:10px; background:var(--surface-2); border:1px solid var(--border);}
  .ht-pk b{display:block; font-size:17px; font-weight:900; color:var(--brand);} .ht-pk small{display:block; font-size:10.5px; color:var(--ink-dim);}
  .ht-pk div.y{border-color:#16a34a;} .ht-pk div.n{border-color:#b91c1c; opacity:.8;}
  .ht-alt{grid-column:1 / -1; font-size:11px; color:var(--ink-dim); display:flex; gap:4px 12px; flex-wrap:wrap;}
  .ht-row.weak{opacity:.6;}
  .ht-pk b i{font-style:normal; font-size:.8em; margin-left:1px;} .ht-pk div.y b i{color:#16a34a;} .ht-pk div.n b i{color:#ef4444;}
  .ht-pk div.y{background:rgba(22,163,74,.12);} .ht-pk div.n b{color:var(--ink-dim);}
  .ht-live{color:#ef4444;}
  .ht-perf{margin-bottom:10px;} .ht-perf > button{padding:6px 12px; border-radius:8px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink); font-weight:700; font-size:12.5px; cursor:pointer;}
  .ht-perf .card{margin-top:8px;} .ht-perf h4{margin:0 0 6px; font-size:13.5px;}
  .ht-perf .pg{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px;}
  .ht-perf table{width:100%; border-collapse:collapse; font-size:12px;} .ht-perf td, .ht-perf th{padding:3px 6px; text-align:left; border-bottom:1px solid var(--border);} .ht-perf th{color:var(--ink-dim); font-weight:600;}
  .ht-perf .note{font-size:11.5px; color:var(--ink-dim); margin-top:6px;}
  .ht-head{display:none;}
  .ht-alt em{font-style:normal; color:#f59e0b;}
  .v2-kasa-detail{display:none;} .v2-kasa-detail.open{display:block; margin-top:8px;}
  .v2-kasa-chevron{font-weight:900; margin-left:4px; display:inline-block;}
  .lv-brain-badge{font-size:10px; font-weight:800; padding:3px 9px; border-radius:10px; white-space:nowrap;}
  .lv-brain-badge.on{background:rgba(16,185,129,0.15); color:#10b981; border:1px solid rgba(16,185,129,0.35);}
  .lv-brain-badge.off{background:rgba(148,163,184,0.15); color:#94a3b8; border:1px solid rgba(148,163,184,0.35);}
  .lv-brain-badge.auto-off{background:rgba(239,68,68,0.15); color:#ef4444; border:1px solid rgba(239,68,68,0.35);}
  .lv-brain-signals{display:flex; flex-direction:column; gap:8px; max-height:420px; overflow-y:auto;}
  .lv-brain-signal{background:var(--surface-3); border:1px solid var(--border); border-radius:8px; padding:8px 10px;}
  .lv-brain-signal-top{display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:12.5px;}
  .lv-ctx-chips{display:flex; flex-wrap:wrap; gap:5px; margin-top:6px;}
  .lv-ctx-chip{font-size:10.5px; padding:2px 7px; border-radius:6px; background:var(--surface-2); color:var(--ink-dim);}
  .lv-ctx-chip b{color:var(--ink);}

  /* V-List Şampiyon Formu: one wide, sortable row per match */
  .hfr-wrap{overflow:auto; max-height:calc(100vh - var(--kh-top, 140px) - var(--kh-bottom, 0px) - 16px); max-height:calc(100dvh - var(--kh-top, 140px) - var(--kh-bottom, 0px) - 16px); min-height:320px; border:1px solid var(--border); border-radius:12px; background:var(--surface); overscroll-behavior:contain;}
  /* Sticky header: the wrap is the ONE scroll container (both axes), so the head stays aligned with the body columns while
     scrolling sideways, and its height keeps it below the sticky top bar (--kh-top is measured in JS). */
  .hfr-head{position:sticky; top:0; z-index:6; box-shadow:0 2px 0 var(--border);}
  .hfr-head > div{background:var(--surface-2);}
  .hfr-grid{display:grid; grid-template-columns:76px minmax(0,2.5fr) minmax(0,1.55fr) repeat(4, minmax(0,0.82fr)) minmax(0,1.15fr) 88px 74px; min-width:1180px;}
  .hfr-head{background:var(--surface-2); border-bottom:1px solid var(--border);}
  .hfr-head > div{padding:8px 8px; font-family:'Barlow Condensed',sans-serif; font-weight:800; font-size:12px; letter-spacing:.03em; text-transform:uppercase; color:var(--ink-dim); border-right:1px solid var(--border); line-height:1.15; display:flex; align-items:center; min-width:0;}
  .hfr-head > div:last-child{border-right:none;}
  .hfr-head .c{justify-content:center;}
  .hfr-sort{cursor:pointer; user-select:none; gap:4px;}
  .hfr-sort:hover{color:var(--ink);}
  .hfr-sort .ar{opacity:.45; font-size:11px;}
  .hfr-sort.on{color:var(--brand);} .hfr-sort.on .ar{opacity:1;}
  .hfr-head .hfr-oddshead{flex-direction:column; align-items:stretch; padding:0;}
  .hfr-oddshead .t{padding:6px 8px 5px; text-align:center; border-bottom:1px solid var(--border); display:flex; justify-content:center;}
  .hfr-oddshead .subs{display:grid; grid-template-columns:repeat(5,1fr);}
  .hfr-oddshead .subs > div{padding:5px 1px; text-align:center; font-size:11px; white-space:nowrap; border-right:1px solid var(--border); display:flex; justify-content:center;}
  .hfr-oddshead .subs > div:last-child{border-right:none;}
  .hfr-row{position:relative; border-bottom:1px solid var(--border);}
  .hfr-row:hover{background:var(--surface-2);}
  .hfr-row.fortress{background:linear-gradient(90deg, rgba(245,158,11,0.07), transparent 40%);}
  .hfr-row.fortress::before{content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:#f59e0b;}
  .hfr-row > div{padding:8px 8px; border-right:1px solid var(--border); display:flex; flex-direction:column; justify-content:center; min-width:0;}
  .hfr-row > div:last-child{border-right:none;}
  .hfr-when{align-items:center; text-align:center;}
  .hfr-when .d{font-size:11px; font-weight:700; color:var(--ink-dim); white-space:nowrap;}
  .hfr-when .t{font-family:'Barlow Condensed',sans-serif; font-size:22px; font-weight:800; color:var(--ink); line-height:1.05;}
  .hfr-when .r{font-size:10px; color:var(--ink-faint);}
  .hfr-lg{display:flex; align-items:center; gap:6px; font-size:12px; font-weight:700; color:var(--ink-dim); margin-bottom:4px;}
  .hfr-match{display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:4px 6px;}
  .hfr-side{display:flex; flex-direction:column; gap:3px; min-width:0;}
  .hfr-side.away{align-items:flex-end; text-align:right;}
  .hfr-rank{font-size:10px; color:var(--ink-faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%;}
  .hfr-rank b{color:var(--ink-dim);}
  .hfr-team{display:flex; align-items:center; gap:6px; min-width:0; max-width:100%;}
  .hfr-side.away .hfr-team{flex-direction:row-reverse;}
  .hfr-team .hf-crest, .hfr-team .hf-crest-ph{width:24px; height:24px;}
  .hfr-team span{font-weight:800; font-size:13px; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .hfr-vs{font-family:'Barlow Condensed',sans-serif; font-size:13px; font-weight:800; color:var(--ink-faint); letter-spacing:.06em;}
  .hfr-flag{cursor:help;}
  .hfr-odds{display:grid !important; grid-template-columns:repeat(5,minmax(0,1fr)); align-items:center; gap:4px;}
  .hfr-odd{padding:7px 0; border:1px solid var(--border-highlight); border-radius:7px; background:var(--surface-2); text-align:center; font-family:'Barlow Condensed',sans-serif; font-size:15px; font-weight:800; color:var(--ink);}
  .hfr-odd.na{color:var(--ink-faint);}
  .hfr-met .v{font-family:'Barlow Condensed',sans-serif; font-size:21px; font-weight:800; line-height:1.05; color:var(--ink);}
  .hfr-met .bar{height:6px; border-radius:3px; background:var(--surface-3); overflow:hidden; margin:4px 0 5px;}
  .hfr-met .bar span{display:block; height:100%; border-radius:3px;}
  .hfr-met .s{font-size:10px; color:var(--ink-faint); line-height:1.4;}
  .hfr-met .s b{color:var(--ink-dim);}
  .hfr-karne{gap:6px; font-size:10.5px; color:var(--ink-faint); line-height:1.4;}
  .hfr-karne b{color:var(--ink-dim);}
  .hfr-karne .rec{font-weight:800; color:var(--ink); font-size:11.5px;}
  .hfr-data{align-items:center; gap:6px;}
  .hfr-chip{display:inline-flex; align-items:center; gap:4px; padding:3px 7px; border-radius:7px; font-size:10.5px; font-weight:800; white-space:nowrap;}
  .hfr-chip.ok{background:rgba(16,185,129,.15); color:#10b981;}
  .hfr-chip.warn{background:rgba(245,158,11,.15); color:#f59e0b;}
  .hfr-det-btn{padding:5px 9px; border-radius:7px; border:1px solid var(--brand); background:transparent; color:var(--brand); font-weight:800; font-size:11px; cursor:pointer; white-space:nowrap;}
  .hfr-det-btn.open{background:var(--brand-tint);}
  .hfr-conf{align-items:center;}
  .hfr-ring{width:50px; height:50px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:'Barlow Condensed',sans-serif; font-size:22px; font-weight:800; color:#fff; box-shadow:0 0 0 4px rgba(255,255,255,.04);}
  .hfr-ring.hi{background:radial-gradient(circle at 35% 30%, #34d399, #059669);}
  .hfr-ring.mid{background:radial-gradient(circle at 35% 30%, #fbbf24, #d97706);}
  .hfr-ring.lo{background:radial-gradient(circle at 35% 30%, #94a3b8, #475569);}
  .hfr-ring.na{background:var(--surface-3); color:var(--ink-faint); font-size:18px;}
  .hfr-conf .cap{font-size:10px; color:var(--ink-faint); margin-top:4px; text-align:center;}
  .hfr-detail{display:none; padding:14px 16px 16px; border-bottom:1px solid var(--border); background:var(--surface-2); min-width:1180px; box-sizing:border-box;}
  .hfr-detail.open{display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:18px;}
  .hfr-detail h6{margin:0 0 8px; font-size:12px; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-dim);}
  .hfr-fac{display:grid; grid-template-columns:minmax(0,1fr) 110px 44px; gap:8px; align-items:center; font-size:11.5px; color:var(--ink-dim); margin-bottom:5px;}
  .hfr-fac .track{position:relative; height:8px; background:var(--surface-3); border-radius:4px;}
  .hfr-fac .track::after{content:""; position:absolute; left:50%; top:-2px; bottom:-2px; width:1px; background:var(--border-highlight);}
  .hfr-fac .track span{position:absolute; top:0; bottom:0; border-radius:4px;}
  .hfr-fac .n{text-align:right; font-weight:800;}
  .hfr-h2h{font-size:12px; color:var(--ink-dim); display:flex; justify-content:space-between; gap:8px; padding:4px 0; border-bottom:1px dashed var(--border);}
  .hfr-h2h b{color:var(--ink);}
  .hf-crest{width:34px; height:34px; object-fit:contain; flex-shrink:0;}
  .hf-crest-ph{width:34px; height:34px; border-radius:50%; background:var(--surface-3); display:flex; align-items:center; justify-content:center; font-weight:800; color:var(--ink-dim); flex-shrink:0;}
  .hf-form{display:inline-flex; gap:2px; vertical-align:middle;}
  .hf-form i{font-style:normal; width:17px; height:17px; border-radius:4px; font-size:10px; font-weight:800; display:inline-flex; align-items:center; justify-content:center; color:#fff;}
  .hf-form i.W{background:#10b981;} .hf-form i.D{background:#64748b;} .hf-form i.L{background:#ef4444;}
  .hf-infobar{display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:10px;}
  .hf-stats{font-size:12px; color:var(--ink-faint);}
  .hf-stats b{color:var(--ink-dim);}
  .hf-info-btn{width:28px; height:28px; border-radius:50%; border:1.5px solid var(--brand); background:transparent; color:var(--brand); font:italic 800 15px Georgia, serif; cursor:pointer; flex-shrink:0;}
  .hf-info-btn[aria-expanded="true"]{background:var(--brand); color:var(--bg);}
  .hf-info{margin-bottom:12px;}
  .hfr-h2h .t{display:inline-flex; align-items:center; gap:5px;}
  .hfr-h2h .t img{width:16px; height:16px; object-fit:contain;}
  .hfr-h2h .win{color:#10b981; font-weight:800;}
  .hfr-note{font-size:11px; color:var(--ink-faint); margin-top:8px; line-height:1.5;}
  .hfr-chip.bad{background:rgba(239,68,68,.15); color:#ef4444;}
  .hfr-pick{font-size:10px; color:var(--ink-dim); margin-top:3px; text-align:center; line-height:1.3;}
  .hfr-pick b{color:var(--ink);}
  /* V-KAHİN Geçmiş */
  .kh-wait{margin:0 0 10px; padding:9px 12px; border-radius:9px; border:1px solid rgba(245,158,11,.35); background:rgba(245,158,11,.08); color:var(--ink-dim); font-size:12px; line-height:1.5;}
  .kh-wait b{color:#f59e0b;}
  .hf-msort{display:none;}
  .hf-filters{display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:0 0 10px;}
  .hf-fchip{background:var(--surface-2); color:var(--ink-dim); border:1px solid var(--border); border-radius:999px; padding:6px 11px; font-size:12px; font-weight:700; cursor:pointer; white-space:nowrap;}
  .hf-fchip.on{background:rgba(16,185,129,.14); color:var(--ink); border-color:#10b981;}
  .hf-filters select{width:auto; flex:none; background:var(--surface-2); color:var(--ink); border:1px solid var(--border); border-radius:999px; padding:6px 10px; font-size:12px; font-weight:700;}
  .hf-fcount{font-size:11.5px; color:var(--ink-faint); margin-left:auto;}
  /* V-List on phones: every wide table row becomes a card (header hidden, each value labelled), no sideways scroll. */
  @media (max-width:760px){
    #panel-vlist .lv-subtabs, .kh-subtabs{overflow-x:auto; flex-wrap:nowrap; scrollbar-width:none;}
    #panel-vlist .lv-subtabs::-webkit-scrollbar, .kh-subtabs::-webkit-scrollbar{display:none;}
    #panel-vlist .lv-subtabs button, .kh-subtabs button{flex:none;}
    .hf-infobar{align-items:flex-start;}
    .hf-msort{display:flex; gap:8px; align-items:flex-end; margin-bottom:10px;}
    .hf-msort label{flex:1; display:flex; flex-direction:column; gap:3px; font-size:10.5px; font-weight:700; text-transform:uppercase; color:var(--ink-faint);}
    .hf-msort select, .hf-msort button{background:var(--surface-2); color:var(--ink); border:1px solid var(--border); border-radius:8px; padding:8px 10px; font-size:13px;}
    .hf-msort button{flex:none; font-weight:700; cursor:pointer;}
    .hfr-wrap{max-height:none; min-height:0; overflow:visible; border:none; background:transparent;}
    .hfr-head{display:none !important;}
    .hfr-grid, .khr-grid{min-width:0 !important; grid-template-columns:repeat(4, minmax(0,1fr)) !important; gap:0;}
    .hfr-row, .khr-row{background:var(--surface); border:1px solid var(--border); border-radius:12px; margin-bottom:10px; overflow:hidden;}
    .hfr-row.fortress{background:linear-gradient(180deg, rgba(245,158,11,0.08), var(--surface) 60%);}
    .hfr-row > div, .khr-row > div{border-right:none; padding:8px 10px; position:relative;}
    .hfr-row > div:nth-child(1){grid-column:1 / 2; order:1; padding-top:12px;}
    .hfr-row > div:nth-child(2){grid-column:2 / 4; order:2; padding-top:12px;}
    .hfr-row > div:nth-child(10){grid-column:4 / 5; order:3; padding-top:12px;}
    .hfr-row > div:nth-child(3){grid-column:1 / -1; order:4; border-top:1px solid var(--border);}
    .hfr-row > div:nth-child(4){order:5;} .hfr-row > div:nth-child(5){order:6;} .hfr-row > div:nth-child(6){order:7;} .hfr-row > div:nth-child(7){order:8;}
    .hfr-row > div:nth-child(n+4):nth-child(-n+7){border-top:1px solid var(--border); padding:8px 7px;}
    .hfr-row > div:nth-child(8){grid-column:1 / 4; order:9; border-top:1px solid var(--border); flex-direction:row; flex-wrap:wrap; gap:4px 14px;}
    .hfr-row > div:nth-child(9){grid-column:4 / 5; order:10; border-top:1px solid var(--border);}
    .hfr-row > div:nth-child(n+4):nth-child(-n+7)::before{display:block; font-size:9.5px; font-weight:800; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-faint); margin-bottom:2px;}
    .hfr-row > div:nth-child(4)::before{content:'Ev galibiyet';}
    .hfr-row > div:nth-child(5)::before{content:'2+ fark';}
    .hfr-row > div:nth-child(6)::before{content:'1.5 Üst';}
    .hfr-row > div:nth-child(7)::before{content:'G + 1.5 Ü';}
    .hfr-met .v{font-size:18px;}
    .hfr-met .s{font-size:9.5px;}
    .hfr-when .t{font-size:20px;}
    .hfr-match{grid-template-columns:minmax(0,1fr); gap:4px;}
    .hfr-match .hfr-vs{display:none;}
    .hfr-side.away{align-items:flex-start; text-align:left;}
    .hfr-side.away .hfr-team{flex-direction:row;}
    .hfr-rank{display:none;}
    .hfr-team span{font-size:14px;}
    .hfr-odds{gap:5px;}
    .hfr-odd{position:relative; padding:14px 0 5px; font-size:15px;}
    .hfr-odd::before{position:absolute; top:2px; left:0; right:0; font-family:Inter,sans-serif; font-size:8.5px; font-weight:700; color:var(--ink-faint);}
    .hfr-odds .hfr-odd:nth-child(1)::before{content:'1';} .hfr-odds .hfr-odd:nth-child(2)::before{content:'X';} .hfr-odds .hfr-odd:nth-child(3)::before{content:'2';}
    .hfr-odds .hfr-odd:nth-child(4)::before{content:'KG Var';} .hfr-odds .hfr-odd:nth-child(5)::before{content:'2.5 Üst';}
    .hfr-ring{width:46px; height:46px; font-size:20px;}
    .hfr-data{gap:5px;}
    .hfr-data .hfr-chip{font-size:9.5px; padding:2px 5px;}
    .hfr-detail, .kh-detail{min-width:0 !important; padding:12px; border:1px solid var(--border); border-radius:12px; margin:-6px 0 10px;}
    .hfr-detail.open, .kh-detail.open{grid-template-columns:1fr; gap:12px;}
    .hfr-fac{grid-template-columns:minmax(0,1fr) 80px 38px;}
    /* Sonuçlar */
    /* Compact card: date/time, league, both teams and one box (probability, or the result). Tap for the rest. */
    .hfr-row, .khr-row{cursor:pointer; -webkit-tap-highlight-color:transparent;}
    .hfr-row:not(.open) > div:nth-child(n+3):nth-child(-n+9){display:none !important;}
    .hfr-row:not(.open) .hf-form, .hfr-row:not(.open) .hfr-pick{display:none;}
    .hfr-row:not(.open) > div:nth-child(1), .hfr-row:not(.open) > div:nth-child(2), .hfr-row:not(.open) > div:nth-child(10){padding-bottom:12px;}
    .hfr-row > div:nth-child(1){border-right:1px solid var(--border) !important; justify-content:center;}
    .hfr-row > div:nth-child(10){justify-content:center;}
    .hfr-ring{width:auto; min-width:66px; height:46px; padding:0 10px; border-radius:12px; font-size:24px; box-shadow:none;}
    .hfr-ring:not(.na)::before{content:'%'; font-size:.68em; margin-right:1px; opacity:.9;}
    .hfr-conf .cap{margin-top:3px;}
    .hfr-row:not(.open) .hfr-conf .cap::after, .khr-row:not(.open) > div:nth-child(2)::after{content:'▾ detay'; display:block; font-size:9.5px; color:var(--brand); font-weight:700; margin-top:3px; text-align:center;}
    .khr-row:not(.open) > div:nth-child(n+3){display:none !important;}
    .khr-row > div:nth-child(1){border-right:1px solid var(--border) !important; justify-content:center; padding-bottom:12px;}
    .khr-row > div:nth-child(2){padding-bottom:12px;}
    .khr-row:not(.open) > div:nth-child(2)::after{text-align:right; margin-top:2px;}
    .khr-row.open > div:nth-child(8){display:none !important;}
    .khr-row .kh-score{min-width:84px; padding:6px 10px; border-radius:12px; font-size:24px;}
    .khr-row .kh-score small{font-size:10px;}
    .khr-row > div:nth-child(1){grid-column:1 / 2; padding-top:12px;}
    .khr-row > div:nth-child(2){grid-column:2 / -1; padding-top:12px;}
    .khr-row > div:nth-child(3){grid-column:1 / 3; border-top:1px solid var(--border);}
    .khr-row > div:nth-child(4){grid-column:3 / 4; border-top:1px solid var(--border);}
    .khr-row > div:nth-child(6){grid-column:4 / 5; border-top:1px solid var(--border); order:0;}
    .khr-row > div:nth-child(5){grid-column:1 / -1; border-top:1px solid var(--border); order:1;}
    .khr-row > div:nth-child(7){display:none !important;}
    .khr-row > div:nth-child(8){grid-column:4 / 5; border-top:1px solid var(--border); order:2;}
    .khr-row > div:nth-child(3)::before, .khr-row > div:nth-child(4)::before, .khr-row > div:nth-child(6)::before{display:block; font-size:9.5px; font-weight:800; text-transform:uppercase; color:var(--ink-faint); margin-bottom:2px;}
    .khr-row > div:nth-child(3)::before{content:'Kayıtlı tahmin';}
    .khr-row > div:nth-child(4)::before{content:'Oran';}
    .khr-row > div:nth-child(6)::before{content:'Sonuç';}
    .khr-row .hfr-match{grid-template-columns:minmax(0,1fr) auto; gap:4px 8px; align-items:center;}
    .khr-row .hfr-match > :nth-child(1){grid-column:1; grid-row:1;}
    .khr-row .hfr-match > :nth-child(2){grid-column:2; grid-row:1 / 3;}
    .khr-row .hfr-match > :nth-child(3){grid-column:1; grid-row:2; flex-direction:row !important;}
    .khr-row .hfr-team span{font-size:13px; white-space:normal; overflow-wrap:anywhere; overflow:visible; text-overflow:clip; line-height:1.2;}
    .khr-row .hfr-team{align-items:center; min-width:0;}
    .kh-filters label{flex:1 1 calc(50% - 8px);}
    .kh-filters #khApply{flex:1 1 100%;}
    /* Maç Listesi and Korner rows */
    .vl-table-wrap{overflow:visible !important; border:none !important;}
    .vl-row.vl-head{display:none !important;}
    .vl-row{min-width:0 !important; grid-template-columns:repeat(4, minmax(0,1fr)) !important; gap:8px 6px; padding:10px 12px; margin:0 0 10px !important; border:1px solid var(--border); border-radius:12px !important; background:var(--surface); font-size:12px;}
    #vlMatchesTable .vl-row > div:nth-child(1){grid-column:2 / -1; order:1;}
    #vlMatchesTable .vl-row > div:nth-child(2){grid-column:1 / 2; order:0; font-weight:800; color:var(--ink);}
    #vlMatchesTable .vl-row > div:nth-child(3){grid-column:1 / -1; order:2;}
    #vlMatchesTable .vl-row > div:nth-child(5){grid-column:1 / 3; order:3;}
    #vlMatchesTable .vl-row > div:nth-child(11){grid-column:3 / -1; order:4;}
    #vlMatchesTable .vl-row > div:nth-child(4){order:5;} #vlMatchesTable .vl-row > div:nth-child(6){grid-column:2 / 4; order:6;}
    #vlMatchesTable .vl-row > div:nth-child(12){grid-column:4 / 5; order:7;}
    #vlMatchesTable .vl-row > div:nth-child(7){order:8;} #vlMatchesTable .vl-row > div:nth-child(8){order:9;} #vlMatchesTable .vl-row > div:nth-child(9){order:10;} #vlMatchesTable .vl-row > div:nth-child(10){order:11;}
    #vlMatchesTable .vl-row > div:nth-child(13){grid-column:1 / -1; order:12;}
    #vlMatchesTable .vl-row > div:nth-child(n+4):nth-child(-n+12)::before{display:block; font-size:9px; font-weight:800; text-transform:uppercase; color:var(--ink-faint); margin-bottom:1px;}
    #vlMatchesTable .vl-row > div:nth-child(4)::before{content:'xG';}
    #vlMatchesTable .vl-row > div:nth-child(5)::before{content:'Oranlar 1-X-2';}
    #vlMatchesTable .vl-row > div:nth-child(6)::before{content:'Gol pazarları';}
    #vlMatchesTable .vl-row > div:nth-child(7)::before{content:'Top. şut';}
    #vlMatchesTable .vl-row > div:nth-child(8)::before{content:'İsabetli şut';}
    #vlMatchesTable .vl-row > div:nth-child(9)::before{content:'Korner';}
    #vlMatchesTable .vl-row > div:nth-child(10)::before{content:'Kart';}
    #vlMatchesTable .vl-row > div:nth-child(11)::before{content:'Ana tercih';}
    #vlMatchesTable .vl-row > div:nth-child(12)::before{content:'Alternatif';}
    #vlCornersTable .vl-row > div:nth-child(1){grid-column:2 / -1;}
    #vlCornersTable .vl-row > div:nth-child(2){grid-column:1 / -1; order:1;}
    #vlCornersTable .vl-row > div:nth-child(3){grid-column:1 / 2; order:-1; font-weight:800; color:var(--ink);}
    #vlCornersTable .vl-row > div:nth-child(4){grid-column:1 / 3; order:2;}
    #vlCornersTable .vl-row > div:nth-child(5){grid-column:3 / -1; order:3;}
    #vlCornersTable .vl-row > div:nth-child(4)::before, #vlCornersTable .vl-row > div:nth-child(5)::before{display:block; font-size:9px; font-weight:800; text-transform:uppercase; color:var(--ink-faint); margin-bottom:1px;}
    #vlCornersTable .vl-row > div:nth-child(4)::before{content:'Ort. toplam korner';}
    #vlCornersTable .vl-row > div:nth-child(5)::before{content:'Önerilen bahis';}
    .date-strip .ds-hint{display:none;}
    .date-strip .ds-all{padding:7px 9px;}
  }
  .kh-subtabs{display:flex; gap:6px; margin-bottom:12px;}
  .kh-subtabs button{padding:7px 14px; border-radius:9px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink-dim); font-weight:700; font-size:12.5px; cursor:pointer;}
  .kh-subtabs button.active{background:var(--brand-tint); color:var(--brand); border-color:var(--brand);}
  .kh-filters{display:flex; flex-wrap:wrap; gap:8px; align-items:flex-end; margin-bottom:10px;}
  .kh-filt, .kh-note{margin-bottom:10px;}
  .kh-filt > summary, .kh-note > summary{cursor:pointer; list-style:none; font-size:12.5px; font-weight:700; color:var(--ink-dim); padding:8px 12px; border:1px solid var(--border); border-radius:10px; background:var(--surface-2); display:flex; justify-content:space-between; align-items:center;}
  .kh-filt > summary::-webkit-details-marker, .kh-note > summary::-webkit-details-marker{display:none;}
  .kh-filt[open] > summary{margin-bottom:8px;}
  #khCount{font-size:12px; font-weight:600; color:var(--ink-faint);}
  .kh-note{margin-top:10px;} .kh-note[open] > summary{margin-bottom:6px;}
  .kh-filters label{display:flex; flex-direction:column; gap:3px; font-size:10.5px; color:var(--ink-faint); font-weight:700; text-transform:uppercase;}
  .kh-filters input, .kh-filters select{background:var(--surface-2); color:var(--ink); border:1px solid var(--border); border-radius:7px; padding:6px 8px; font-size:12.5px;}
  .khr-grid{display:grid; grid-template-columns:84px minmax(0,2.6fr) minmax(0,1.3fr) 70px minmax(0,1.9fr) 96px minmax(0,0.9fr) 70px; min-width:1080px;}
  .khr-row > div{padding:7px 8px; border-right:1px solid var(--border); display:flex; flex-direction:column; justify-content:center; min-width:0; font-size:12px; color:var(--ink-dim);}
  .khr-row > div:last-child{border-right:none;}
  .khr-row{border-bottom:1px solid var(--border);}
  .khr-row:hover{background:var(--surface-2);}
  .kh-score{display:inline-flex; flex-direction:column; align-items:center; justify-content:center; min-width:54px; padding:3px 6px; border-radius:7px; font-family:'Barlow Condensed',sans-serif; font-weight:800; font-size:17px; line-height:1.05; border:1px solid var(--border-highlight); color:var(--ink); background:var(--surface-3);}
  .kh-score small{font-family:Inter,sans-serif; font-size:9px; font-weight:700; letter-spacing:0; opacity:.95;}
  .kh-score.green{background:#22c55e; border-color:#16a34a; color:#04210f;}
  .kh-score.darkgreen{background:#065f46; border-color:#047857; color:#ecfdf5;}
  .kh-score.red{background:#b91c1c; border-color:#dc2626; color:#fff1f2;}
  .kh-score.neutral{background:var(--surface-3); color:var(--ink-dim);}
  .kh-out{display:inline-block; padding:3px 8px; border-radius:7px; font-weight:800; font-size:11px; white-space:nowrap;}
  .kh-out.WIN{background:rgba(16,185,129,.18); color:#10b981;} .kh-out.LOSS{background:rgba(239,68,68,.16); color:#ef4444;}
  .kh-out.VOID{background:var(--surface-3); color:var(--ink-dim);} .kh-out.PENDING{background:rgba(245,158,11,.14); color:#f59e0b;} .kh-out.NB{background:var(--surface-3); color:var(--ink-faint);}
  .kh-mk{display:grid; grid-template-columns:1fr 1fr; gap:2px 8px; font-size:10.5px;}
  .kh-mk span b{color:var(--ink);}
  .kh-mk .w{color:#10b981;} .kh-mk .l{color:#ef4444;}
  .kh-detail{display:none; padding:12px 16px; background:var(--surface-2); border-bottom:1px solid var(--border); min-width:1080px; box-sizing:border-box; font-size:12px; color:var(--ink-dim);}
  .kh-detail.open{display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:16px;}
  .kh-detail h6{margin:0 0 6px; font-size:11.5px; text-transform:uppercase; color:var(--ink-dim);}
  .kh-kv{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:2px 10px; font-size:11.5px;}
  .kh-kv b{color:var(--ink); text-align:right;}
  .kh-sec{margin-bottom:14px;}
  .kh-sec > h4{margin:0 0 8px; font-size:14px;}
  .kh-cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:8px;}
  .kh-card{background:var(--surface-2); border:1px solid var(--border); border-radius:10px; padding:10px 12px; font-size:12px; color:var(--ink-dim);}
  .kh-card .v{font-family:'Barlow Condensed',sans-serif; font-size:22px; font-weight:800; color:var(--ink); line-height:1.1;}
  .kh-tbl{width:100%; border-collapse:collapse; font-size:12px;}
  .kh-tbl th, .kh-tbl td{padding:5px 7px; border-bottom:1px solid var(--border); text-align:left; vertical-align:top;}
  .kh-tbl th{color:var(--ink-faint); font-size:10.5px; text-transform:uppercase; background:var(--surface-2); position:sticky; top:0;}
  .kh-tbl td.n{text-align:right; font-variant-numeric:tabular-nums;}
  .kh-scroll{overflow:auto; max-height:420px; border:1px solid var(--border); border-radius:10px;}
  .kh-st{display:inline-block; padding:2px 7px; border-radius:6px; font-size:10.5px; font-weight:800; background:var(--surface-3); color:var(--ink-dim);}
  .kh-st.ok{background:rgba(16,185,129,.16); color:#10b981;} .kh-st.warn{background:rgba(245,158,11,.15); color:#f59e0b;} .kh-st.bad{background:rgba(239,68,68,.15); color:#ef4444;} .kh-st.info{background:rgba(56,189,248,.15); color:#38bdf8;}
  .kh-cal{display:flex; align-items:flex-end; gap:3px; height:70px; margin-top:6px;}
  .kh-cal div{flex:1; display:flex; flex-direction:column; justify-content:flex-end; gap:1px; position:relative;}
  .kh-cal i{display:block; width:100%; border-radius:2px 2px 0 0;}
  /* V-List: dense, sortable tables (shows more matches per screen than the card list) */
  .vl-table-wrap{overflow-x:auto; border:1px solid var(--border); border-radius:10px;}
  .vl-row{display:grid; align-items:center; gap:6px; padding:7px 10px; font-size:11.5px; border-bottom:1px solid var(--border); min-width:900px;}
  .vl-row:last-child{border-bottom:none;}
  .vl-row.vl-head{background:var(--surface-2); font-weight:800; text-transform:uppercase; font-size:10px; color:var(--ink-faint); position:sticky; top:0; z-index:1;}
  .vl-row.vl-head .vl-th{cursor:pointer; display:flex; align-items:center; gap:4px; justify-content:center; white-space:nowrap;}
  .vl-row.vl-head .vl-th:first-child, .vl-row.vl-head .vl-th:nth-child(2), .vl-row.vl-head .vl-th:nth-child(3){justify-content:flex-start;}
  .vl-row:not(.vl-head):hover{background:var(--surface-2);}
  .vl-cell{text-align:center; min-width:0;}
  .vl-cell.vl-left{text-align:left;}
  .vl-cell-team{display:flex; align-items:center; gap:5px; min-width:0;}
  .vl-crest{width:16px; height:16px; object-fit:contain; flex-shrink:0; border-radius:50%;}
  .vl-team-name{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:700; color:var(--ink); font-size:11.5px;}
  .vl-sub{font-size:9.5px; color:var(--ink-faint); display:block; margin-top:1px;}
  .vl-pill{display:inline-block; font-size:10px; font-weight:800; padding:2px 6px; border-radius:5px; background:var(--surface-3); color:var(--ink-dim); white-space:nowrap;}
  .vl-pill.brand{background:var(--brand-tint); color:var(--brand);}
  .vl-pill.accent{background:rgba(56,189,248,.15); color:#38bdf8;}
  .vl-star{color:var(--accent); font-size:10px;}
  @media (max-width:880px){
    .vl-row{min-width:1100px;}
  }
  .lv-rule{cursor:pointer;} .lv-rule:hover{border-color:var(--border-highlight);}
  .lv-sig-scroll{max-height:420px; overflow-y:auto;}
  .lv-sig-table{width:100%; border-collapse:collapse; font-size:12px;}
  .lv-sig-table .lv-day-row td{padding:8px 4px 4px; font-size:11px; font-weight:800; color:var(--ink-dim); text-transform:uppercase; letter-spacing:.03em; border-bottom:1px solid var(--border);}
  .lv-sig-table td{padding:7px 4px; border-bottom:1px solid var(--border); vertical-align:top;}
  .lv-sig-table th{padding:4px; font-size:10.5px; font-weight:700; color:var(--ink-faint); text-align:left; border-bottom:1px solid var(--border);}
  .lv-sig-table .sm{font-size:11px; color:var(--ink-dim); line-height:1.4;}
  .lv-kasa-kpi{display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:10px; margin-bottom:12px;}
  .lv-kasa-kpi .b{background:var(--surface-3); border:1px solid var(--border); border-radius:10px; padding:10px 12px;}
  .lv-kasa-kpi .b span{display:block; font-size:11px; color:var(--ink-dim); margin-bottom:2px;}
  .lv-kasa-kpi .b b{font-size:17px;}
  /* Main App Container */
  #mainApp{display:none; min-height:100vh; min-height:100dvh; flex-direction:column;}
  .app-inner{max-width:100%; width:100%; margin:0 auto; padding:0 24px; box-sizing:border-box; flex:1; display:flex; flex-direction:column;}

  /* Top Navigation */
  .legal-strip{font-size:11.5px; line-height:1.4; text-align:center; color:var(--ink-dim); padding:0 12px 6px; margin-top:-6px;}
  .legal-strip .ls-ver{display:none;}
  .legal-strip a{color:var(--brand); text-decoration:underline;}
  @media (max-width:600px){ .legal-strip{font-size:10.5px; padding:0 8px 4px;} }
  .topbar{background:var(--topbar-bg); border-bottom:1px solid var(--border); padding:12px 0 0; position:sticky; top:0; z-index:50;}
  .brand-row{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; gap:10px;}
  .brand{color:#fff; font-family:'Barlow Condensed',sans-serif; font-weight:800; font-size:22px; display:flex; align-items:center; gap:8px;}
  .brand{cursor:pointer; user-select:none; padding:4px 12px 4px 6px; border-radius:14px; border:1px solid transparent; transition:all .2s;}
  .brand:hover,.brand:focus-visible{background:rgba(255,255,255,.06); border-color:var(--border); transform:translateY(-1px); outline:none;}
  .brand:hover .logo-badge{box-shadow:0 0 18px var(--brand);}
  .brand-word{font-size:26px; letter-spacing:.4px; background:linear-gradient(90deg,#fff 0%,#fff 55%,var(--brand) 100%); -webkit-background-clip:text; background-clip:text; color:transparent;}
  .brand-word b{font-weight:800; color:var(--brand); -webkit-text-fill-color:var(--brand); margin-left:1px;}
  /* Header account: the member's avatar and the settings gear (both open the settings window) */
  .hdr-avatar{--ava:#38b6ff; width:36px; height:36px; border-radius:50%; border:2px solid var(--ava); background:color-mix(in srgb, var(--ava) 22%, var(--surface)); color:#fff; font:800 14px/1 'Barlow',system-ui,sans-serif; letter-spacing:.3px; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; padding:0; transition:transform .15s, box-shadow .15s;}
  .hdr-avatar.emoji{font-size:18px;}
  .hdr-avatar:hover{transform:scale(1.06); box-shadow:0 0 0 3px color-mix(in srgb, var(--ava) 30%, transparent);}
  .hdr-gear{width:36px; height:36px; border-radius:50%; border:1px solid var(--border); background:var(--surface); color:var(--ink-dim); display:inline-flex; align-items:center; justify-content:center; cursor:pointer; padding:0; transition:color .15s, transform .4s;}
  .hdr-gear svg{width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linejoin:round;}
  .hdr-gear:hover{color:var(--ink); transform:rotate(60deg);}
  .hdr-avatar:focus-visible, .hdr-gear:focus-visible, .hdr-ic:focus-visible{outline:2px solid var(--brand, #38b6ff); outline-offset:2px;}
  /* Premium header: a glass bar with a soft glow line under it, round glass icon buttons and a stacked wordmark */
  .topbar{background:linear-gradient(180deg, color-mix(in srgb, var(--surface) 70%, #000) 0%, color-mix(in srgb, var(--surface) 88%, transparent) 100%), var(--topbar-bg); backdrop-filter:saturate(160%) blur(14px); -webkit-backdrop-filter:saturate(160%) blur(14px); border-bottom:1px solid rgba(255,255,255,.06); box-shadow:0 10px 30px -18px rgba(0,0,0,.8);}
  .topbar::after{content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px; background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--brand, #38b6ff) 70%, transparent) 30%, #38b6ff 50%, color-mix(in srgb, var(--brand, #38b6ff) 70%, transparent) 70%, transparent); opacity:.55; pointer-events:none;}
  .brand-text{display:flex; flex-direction:column; justify-content:center; line-height:1; gap:3px; min-width:0;}
  .brand-tag{font:600 11px/1 'Barlow',system-ui,sans-serif; letter-spacing:1.4px; text-transform:uppercase; color:var(--ink-dim); opacity:.85;}
  .user-badge .hdr-ic, .user-badge .hdr-gear{width:40px; height:40px; border-radius:50%; border:1px solid rgba(255,255,255,.09); background:linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.02)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 4px 14px -6px rgba(0,0,0,.6); color:var(--ink); display:inline-flex; align-items:center; justify-content:center; cursor:pointer; padding:0; position:relative; transition:transform .15s, background .15s, color .15s;}
  .hdr-ic svg{width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;}
  .hdr-ic:hover, .hdr-ic[aria-expanded="true"]{background:linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.05)); color:#fff;}
  .hdr-ic:active, .hdr-gear:active, .hdr-avatar:active{transform:scale(.94);}
  .hdr-dot{position:absolute; top:6px; right:7px; width:8px; height:8px; border-radius:50%; background:#f2765f; box-shadow:0 0 0 2px color-mix(in srgb, var(--surface) 80%, #000), 0 0 8px #f2765f;}
  .hdr-dot[hidden]{display:none;}
  .user-badge .hdr-avatar{width:40px; height:40px; border:none; background:conic-gradient(from 210deg, var(--ava), #38b6ff, #2fc7b9, var(--ava)); padding:2px; box-shadow:0 0 14px -2px color-mix(in srgb, var(--ava) 60%, transparent);}
  .user-badge .hdr-avatar{position:relative; isolation:isolate;}
  .user-badge .hdr-avatar::after{content:""; position:absolute; inset:2px; border-radius:50%; background:color-mix(in srgb, var(--ava) 26%, #0b1220); z-index:-1;}
  /* Header panels */
  .hdr-veil{position:fixed; inset:0; z-index:90; background:rgba(3,7,15,.45); backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px);}
  .hdr-veil[hidden], .hdr-panel[hidden]{display:none;}
  .hdr-panel{position:fixed; z-index:91; top:72px; right:max(16px, calc((100vw - 1400px) / 2 + 16px)); width:400px; max-width:calc(100vw - 32px); max-height:min(70vh, 620px); display:flex; flex-direction:column; border-radius:18px; border:1px solid rgba(255,255,255,.1); background:linear-gradient(180deg, color-mix(in srgb, var(--surface) 92%, #fff 3%), var(--surface)); box-shadow:0 24px 60px -12px rgba(0,0,0,.75), inset 0 1px 0 rgba(255,255,255,.06); overflow:hidden; animation:mUp .18s ease-out;}
  .hp-search{width:520px;}
  .hp-head{display:flex; align-items:center; gap:10px; padding:14px 16px; border-bottom:1px solid var(--border);}
  .hp-head b{font-size:15px; color:var(--ink);}
  .hp-ver{font-size:11.5px; color:var(--ink-dim); border:1px solid var(--border); border-radius:999px; padding:2px 8px;}
  .hp-ver:empty{display:none;}
  .hp-x{margin-left:auto; width:30px; height:30px; flex:none; border-radius:50%; border:1px solid var(--border); background:transparent; color:var(--ink-dim); cursor:pointer; font-size:13px;}
  .hp-body{overflow:auto; padding:6px 8px 10px; overscroll-behavior:contain;}
  .hp-foot:empty{display:none;}
  .hp-foot{border-top:1px solid var(--border); padding:10px 12px;}
  .hp-link{width:100%; padding:10px; border-radius:12px; border:1px solid var(--border); background:transparent; color:var(--brand, #38b6ff); font-weight:700; cursor:pointer;}
  .hp-empty{padding:22px 12px; text-align:center; color:var(--ink-dim); font-size:13px;}
  .hp-note{border-radius:12px; margin:4px 0;}
  .hp-note summary{display:flex; gap:10px; align-items:center; padding:10px; cursor:pointer; list-style:none; border-radius:12px;}
  .hp-note summary::-webkit-details-marker{display:none;}
  .hp-note summary:hover{background:rgba(255,255,255,.04);}
  .hp-note .hp-ic{flex:none; width:34px; height:34px; border-radius:10px; display:flex; align-items:center; justify-content:center; background:color-mix(in srgb, var(--brand, #38b6ff) 16%, transparent);}
  .hp-tx{display:flex; flex-direction:column; gap:3px; min-width:0;}
  .hp-tx b{font-size:13.5px; color:var(--ink); line-height:1.25;}
  .hp-tx small{font-size:11.5px; color:var(--ink-dim);}
  .hp-note.new .hp-tx b::after{content:"Yeni"; margin-left:6px; font-size:10px; font-weight:800; color:#fff; background:#f2765f; border-radius:999px; padding:1px 6px; vertical-align:2px;}
  .hp-note ul{margin:0 10px 8px 54px; padding:0 0 0 14px; font-size:12.5px; line-height:1.45; color:var(--ink-dim);}
  .hp-note li{margin:3px 0;}
  .hp-sbar{display:flex; align-items:center; gap:10px; padding:12px 14px; border-bottom:1px solid var(--border);}
  .hp-sbar svg{width:20px; height:20px; flex:none; fill:none; stroke:var(--ink-dim); stroke-width:1.9; stroke-linecap:round;}
  .hp-sbar input::-webkit-search-cancel-button{-webkit-appearance:none; appearance:none;}
  .hp-sbar input{flex:1; min-width:0; background:transparent!important; border:none!important; outline:none; box-shadow:none!important; padding:6px 0!important; font-size:16px; color:var(--ink);}
  .hp-sec{padding:12px 8px 6px; font-size:11px; font-weight:800; letter-spacing:1px; text-transform:uppercase; color:var(--ink-dim);}
  .hp-tab, .hp-match{width:100%; display:flex; align-items:center; gap:12px; padding:10px; border-radius:12px; border:none; background:transparent; color:var(--ink); cursor:pointer; text-align:left; font:inherit;}
  .hp-tab{font-size:14px; font-weight:700;}
  .hp-tab span{margin-left:auto; color:var(--ink-dim); font-size:18px;}
  .hp-tab:hover, .hp-match:hover, .hp-tab:focus-visible, .hp-match:focus-visible{background:rgba(255,255,255,.05); outline:none;}
  .hp-when{flex:none; width:52px; display:flex; flex-direction:column; align-items:center; gap:3px; padding:6px 0; border-radius:10px; background:rgba(255,255,255,.04);}
  .hp-when b{font-size:14px;}
  .hp-when small{font-size:10.5px; color:var(--ink-dim);}
  .hp-teams{flex:1; min-width:0; display:flex; flex-direction:column; gap:5px; font-size:13.5px; font-weight:600;}
  .hp-teams span{display:flex; align-items:center; gap:7px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .hp-teams img, .hp-teams i{width:18px; height:18px; flex:none; object-fit:contain;}
  .hp-side{flex:none; max-width:42%; display:flex; flex-direction:column; align-items:flex-end; gap:5px; min-width:0;}
  .hp-lg{max-width:100%; font-size:11px; color:var(--ink-dim); text-align:right; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .hp-pick{display:inline-flex; align-items:center; gap:6px; padding:3px 8px 3px 3px; border-radius:999px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08); font-size:12.5px; white-space:nowrap;}
  .hp-pick b{color:var(--ink); font-weight:800;}
  .hp-pick i{font-style:normal; color:#f5c451; font-weight:800; font-variant-numeric:tabular-nums;}
  .hp-pick .c5{color:#22c55e;} .hp-pick .c4{color:#84cc16;} .hp-pick .c3{color:#eab308;} .hp-pick .c2{color:#f97316;} .hp-pick .c1{color:#ef4444;}
  .hp-pick.none{padding:3px 8px; color:var(--ink-faint, var(--ink-dim)); font-size:11px;}
  .hp-pick .ml-conf{width:22px; height:22px; border-radius:50%; border:1.5px solid currentColor; display:flex; align-items:center; justify-content:center; text-decoration:none; font-size:9.5px; font-weight:800; letter-spacing:-.3px; box-sizing:border-box; font-variant-numeric:tabular-nums;}
  /* Settings window: profile preview and form */
  .pf-card{display:flex; align-items:center; gap:14px; padding:14px; border-radius:14px; border:1px solid var(--border); background:linear-gradient(135deg, color-mix(in srgb, var(--brand, #38b6ff) 14%, var(--surface)), var(--surface));}
  .pf-card .pf-ava{--ava:#38b6ff; flex:none; width:58px; height:58px; border-radius:50%; border:3px solid var(--ava); background:color-mix(in srgb, var(--ava) 22%, var(--surface)); color:#fff; font:800 22px/1 'Barlow',system-ui,sans-serif; display:flex; align-items:center; justify-content:center;}
  .pf-card .pf-ava.emoji{font-size:30px;}
  .pf-who{display:flex; flex-direction:column; gap:3px; min-width:0;}
  .pf-who b{font-size:17px; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .pf-who small{font-size:12.5px; color:var(--ink-dim);}
  .pf-who i{font-size:12.5px; color:var(--ink-faint, var(--ink-dim)); overflow-wrap:anywhere;}
  .pf-who small:empty, .pf-who i:empty{display:none;}
  .pf-form{display:flex; flex-direction:column; gap:10px; margin-top:8px;}
  .pf-form label{display:flex; flex-direction:column; gap:4px; font-size:12px; color:var(--ink-dim);}
  .pf-lbl{font-size:12px; color:var(--ink-dim); margin-bottom:-4px;}
  .pf-emojis{display:grid; grid-template-columns:repeat(auto-fill, minmax(38px, 1fr)); gap:6px;}
  .pf-emojis button{height:38px; border-radius:10px; border:1px solid var(--border); background:var(--surface); font-size:19px; cursor:pointer; color:var(--ink); padding:0;}
  .pf-emojis button:first-child{font:800 13px/1 'Barlow',system-ui,sans-serif;}
  .pf-emojis button[aria-checked="true"]{border-color:var(--brand, #38b6ff); box-shadow:0 0 0 2px color-mix(in srgb, var(--brand, #38b6ff) 40%, transparent); background:color-mix(in srgb, var(--brand, #38b6ff) 14%, var(--surface));}
  .pf-colors{display:flex; flex-wrap:wrap; gap:8px;}
  .pf-colors button{width:30px; height:30px; border-radius:50%; border:2px solid transparent; background:var(--sw); cursor:pointer; padding:0;}
  .pf-colors button[aria-checked="true"]{border-color:#fff; box-shadow:0 0 0 2px var(--sw);}
  .pf-save{display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
  .pf-save span{font-size:12.5px;}
  .pf-save span.ok{color:var(--win, #22c55e);}
  .pf-save span.err{color:var(--loss, #ef4444);}
  .pf-logout{width:100%; margin-top:18px; background:transparent; border:1px solid color-mix(in srgb, var(--loss, #ef4444) 50%, transparent); color:#fca5a5;}
  .pf-logout:hover{background:#7f1d1d; color:#fff;}
  .prof-row{display:flex; justify-content:space-between; gap:12px; padding:9px 0; border-bottom:1px solid var(--border); font-size:13.5px;}
  .prof-row span:first-child{color:var(--ink-dim);}
  .theme-opts{display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:8px;}
  .theme-opt{background:var(--surface-3); border:1px solid var(--border); color:var(--ink); padding:10px; border-radius:10px; cursor:pointer; font-weight:700; font-size:12.5px; text-align:left;}
  .theme-opt.on{border-color:var(--brand); box-shadow:0 0 0 1px var(--brand);}
  .login-hist{font-size:12.5px; width:100%; border-collapse:collapse;}
  .login-hist td{padding:6px 4px; border-bottom:1px solid var(--border);}
  .pf2fa{font-size:13px; margin-top:6px;}
  .pf2fa-note{color:var(--ink-dim); font-size:12.5px; line-height:1.45; margin:4px 0 8px;}
  .pf2fa-qr{display:block; width:180px; height:180px; margin:8px auto; background:#fff; border-radius:8px; padding:6px;}
  .pf2fa-key{font-family:ui-monospace,monospace; font-size:13px; letter-spacing:.5px; word-break:break-all; background:var(--surface-2, rgba(255,255,255,.05)); padding:6px 8px; border-radius:6px; user-select:all;}
  .pf2fa-row{display:flex; gap:8px; margin-top:8px; flex-wrap:wrap;}
  .pf2fa-row input{flex:1; min-width:120px; padding:8px 10px; border-radius:8px; border:1px solid var(--border); background:transparent; color:inherit; font-size:14px;}
  .pf2fa-codes{display:grid; grid-template-columns:1fr 1fr; gap:4px 12px; font-family:ui-monospace,monospace; font-size:14px; margin:8px 0; user-select:all;}
  .pf2fa-err{color:#ef4444; font-size:12.5px; margin-top:6px; min-height:1em;}
  .pf2fa-on{color:#10b981; font-weight:700;}
  /* Settings window tabs (v3.107): one section at a time, the tab row stays on top while the window scrolls. */
  .pf-body{padding:0 22px 18px;}
  .pf-tabs{position:sticky; top:0; z-index:2; display:grid; grid-template-columns:repeat(4, 1fr); gap:4px; margin:0 -22px 14px; padding:10px 14px 8px; background:var(--surface); border-bottom:1px solid var(--border);}
  .pf-tabs button{display:flex; flex-direction:column; align-items:center; gap:3px; min-width:0; padding:7px 2px; border:1px solid transparent; border-radius:10px; background:transparent; color:var(--ink-dim); font:700 11.5px/1.15 inherit; cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .pf-tabs button i{font-style:normal; font-size:18px; line-height:1;}
  .pf-tabs button[aria-selected="true"]{color:var(--ink); background:color-mix(in srgb, var(--brand, #38b6ff) 14%, var(--surface)); border-color:color-mix(in srgb, var(--brand, #38b6ff) 45%, transparent);}
  .pf-tabs button:focus-visible{outline:2px solid var(--brand); outline-offset:1px;}
  .pf-h{margin-top:16px; font-weight:800; font-size:13px;}
  .pf-pane > .pf-h:first-child{margin-top:4px;}
  .pf-sws{margin-top:4px;}
  .ky-switch.pf-sw{margin-top:0; padding:11px 0; border-top:0; border-bottom:1px solid var(--border);}
  .ky-switch.pf-sw:has(input:disabled){cursor:default; opacity:.6;}
  .pf-sub{margin:0 0 4px; padding:2px 0 8px 12px; border-left:2px solid var(--border);}
  .pf-sub:empty{display:none;}
  .pf-sub .btn{margin-top:4px;}
  .pf-note-save{min-height:1.2em; margin-top:8px; font-size:12.5px; color:var(--ink-dim);}
  .pf-note-save.ok{color:var(--win, #22c55e);}
  .pf-note-save.err{color:var(--loss, #ef4444);}
  @media (max-width:480px){ .pf-body{padding:0 16px 16px;} .pf-tabs{margin:0 -16px 12px; padding:8px 10px 6px;} }
  .pf2fa-link{display:block; text-align:center; font-size:12.5px; color:var(--brand); margin:0 0 8px;}
  #profileModal{z-index:1100;}
  .brand .logo-badge{width:36px!important; height:36px!important; border-radius:11px!important; font-size:19px!important; box-shadow:0 0 12px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.3); transition:box-shadow .2s;}
  .brand .logo-badge{background:linear-gradient(135deg, var(--brand), var(--brand-dark)); color:#fff; width:30px; height:30px; border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:16px;}
  .brand .dot{color:var(--accent);}
  
  .header-actions{display:flex; align-items:center; gap:10px;}
  /* "Bize Ulaşın": a pill button with an icon, easy to spot on every screen */
  .contact-btn{white-space:nowrap; flex:none; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:9px 18px; border-radius:999px; border:1.5px solid var(--brand); background:rgba(16,185,129,0.12); color:var(--brand) !important; font:700 13.5px 'Barlow',system-ui,sans-serif; letter-spacing:.2px; text-decoration:none !important; cursor:pointer; box-shadow:0 2px 10px rgba(16,185,129,0.18); transition:background .15s, color .15s, transform .15s;}
  .contact-btn:hover{background:var(--brand); color:#04130c !important; transform:translateY(-1px);}
  .contact-btn .ci{display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:50%; background:var(--brand); color:#04130c; font-size:12px; line-height:1;}
  .contact-btn:hover .ci{background:#04130c; color:var(--brand);}
  .contact-btn.wide{display:flex; width:100%; margin-top:14px; padding:12px 18px; font-size:14.5px;}
  @media (max-width:700px){ .contact-btn.hdr .ct{display:none;} .contact-btn.hdr{padding:7px; } }
  .theme-select{background:rgba(0,0,0,0.25); border:1px solid var(--border); color:#fff; padding:6px 10px; border-radius:8px; font-size:12.5px; font-weight:700; cursor:pointer;}
  .theme-select option{background:var(--surface); color:var(--ink);}

  .user-badge{display:flex; align-items:center; gap:8px;}

  .tabs{display:flex; gap:4px; overflow-x:auto;}
  .tab{
    padding:10px 18px; color:rgba(255,255,255,0.7); font-family:'Barlow Condensed',sans-serif; font-weight:700;
    font-size:16px; cursor:pointer; border-radius:8px 8px 0 0; background:transparent; transition:all .2s; white-space:nowrap;
  }
  /* The tabs are buttons (keyboard and screen readers, audit F17); the button look is reset to the original tab look. */
  button.tab{border:0; margin:0; line-height:inherit; appearance:none; -webkit-appearance:none;}
  .tab:hover{color:#fff; background:rgba(255,255,255,0.06);}
  .tab:focus-visible{outline:2px solid var(--brand); outline-offset:-2px;}
  .tab.active{background:var(--surface); color:var(--brand); border-top:2px solid var(--brand);}

  /* Body Layout */
  .body-layout{display:flex; gap:18px; padding:16px 0; flex:1; position:relative;}
  
  /* Sidebar (Collapsible & Persistent) */
  .sidebar{
    width:240px; flex-shrink:0; background:var(--surface); border:1px solid var(--border); border-radius:12px;
    padding:8px; height:fit-content; position:sticky; top:80px; max-height:85vh; overflow-y:auto;
    transition: all .25s cubic-bezier(0.4, 0, 0.2, 1);
  }
  .sidebar.collapsed{
    width:0 !important; min-width:0 !important; padding:0 !important; margin:0 !important;
    border:none !important; opacity:0 !important; pointer-events:none !important; overflow:hidden !important;
  }
  .sidebar-header{
    display:flex; align-items:center; justify-content:space-between; padding:4px 6px 8px;
    border-bottom:1px solid var(--border); margin-bottom:8px;
  }
  .sidebar-toggle-btn{
    background:var(--surface-2); border:1px solid var(--border); color:var(--ink-dim);
    font-size:11px; font-weight:700; padding:3px 8px; border-radius:6px; cursor:pointer; transition:all .15s;
  }
  .sidebar-toggle-btn:hover{background:var(--surface-3); color:var(--brand);}
  
  .floating-sidebar-btn{
    display:inline-flex; align-items:center; gap:6px; background:var(--surface); border:1px solid var(--border-highlight);
    color:var(--brand); font-size:12px; font-weight:700; padding:6px 12px; border-radius:8px; cursor:pointer;
    margin-bottom:10px; box-shadow:0 2px 10px rgba(0,0,0,0.1); transition:all .15s;
  }
  .floating-sidebar-btn:hover{background:var(--surface-2); transform:translateY(-1px);}
  .ml-toolbar{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
  .ml-toolbar > .ml-sort{display:none;}
  .ml-toolbar > .ml-modesel{display:none;}
  /* Admin-only brain button beside the order box: opens the match list performance page. */
  .ml-brain{margin-left:auto; flex:none; width:38px; height:36px; display:inline-flex; align-items:center; justify-content:center; border-radius:999px; border:1px solid rgba(167,139,250,.55); background:rgba(167,139,250,.14); font-size:19px; line-height:1; cursor:pointer; padding:0; -webkit-tap-highlight-color:transparent;}
  .ml-brain[hidden]{display:none;}
  .ml-brain:active{transform:scale(.94);}
  /* League page and match list performance page */
  .pg-sub{font-size:12px; color:var(--brand); font-weight:700;}
  .pg-tabs{display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; padding:10px 16px; border-bottom:1px solid var(--border); background:var(--surface);}
  .pg-tabs::-webkit-scrollbar{display:none;}
  .pg-tabs .vm-tab-btn{flex:none; white-space:nowrap; font-family:inherit;}
  .pg-stats{display:grid; grid-template-columns:repeat(auto-fill, minmax(120px, 1fr)); gap:8px; margin-bottom:12px;}
  .pg-stat{background:var(--surface-2); border:1px solid var(--border); border-radius:12px; padding:10px 12px;}
  .pg-stat span{display:block; font-size:11.5px; color:var(--ink-dim); font-weight:600;}
  .pg-stat b{display:block; font-size:20px; font-weight:800; color:var(--ink); margin-top:2px; font-variant-numeric:tabular-nums;}
  .pg-stat small{display:block; font-size:11px; color:var(--ink-faint); margin-top:2px;}
  .pg-table{width:100%; border-collapse:collapse; font-size:13px; font-variant-numeric:tabular-nums;}
  .pg-table th{font-size:11px; color:var(--ink-faint); font-weight:700; text-align:center; padding:6px 4px; border-bottom:1px solid var(--border);}
  .pg-table td{text-align:center; padding:7px 4px; border-bottom:1px solid rgba(255,255,255,.06);}
  .pg-table th.l, .pg-table td.l{text-align:left;}
  .pg-table td.tm{max-width:150px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .lsc-stats{grid-template-columns:repeat(4, minmax(0, 1fr)); gap:6px;}
  .lsc-stats .pg-stat{padding:8px 9px;}
  .lsc-stats .pg-stat b{font-size:18px;}
  .lsc-stats .pg-stat small{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  @media (max-width:520px){ .lsc-stats{grid-template-columns:repeat(2, minmax(0, 1fr));} }
  .lsc-of{font-size:13px; color:var(--ink-faint); font-weight:700; font-style:normal;}
  i.lsc-u{font-style:normal;}
  .lsc-u.up{color:var(--win);} .lsc-u.down{color:var(--loss);}
  .lsc-chips{display:grid; grid-template-columns:repeat(auto-fit, minmax(140px, 1fr)); gap:6px; margin-bottom:6px;}
  .lsc-chip{border:1px solid var(--border); border-left-width:3px; border-radius:10px; padding:7px 10px; background:var(--surface-2);}
  .lsc-chip.good{border-left-color:var(--win);} .lsc-chip.bad{border-left-color:var(--loss);}
  .lsc-chip span{display:block; font-size:11px; color:var(--ink-dim); font-weight:600;}
  .lsc-chip b{font-size:16px; font-weight:800; color:var(--ink); margin-right:6px;}
  .lsc-chip small{font-size:11.5px; color:var(--ink-faint); font-variant-numeric:tabular-nums;}
  .lsc-table td, .lsc-table th{padding:6px 3px;}
  .lsc-bar{display:inline-block; vertical-align:middle; width:34px; height:5px; border-radius:3px; background:var(--surface-3); margin-right:5px; overflow:hidden;}
  .lsc-bar i{display:block; height:100%; background:var(--loss);} .lsc-bar i.up{background:var(--win);}
  .lsc-recent{list-style:none; margin:0; padding:0; font-size:12.5px;}
  .lsc-recent li{display:grid; grid-template-columns:44px minmax(0, 1fr) auto 32px 16px; gap:6px; align-items:center; padding:6px 2px; border-bottom:1px solid rgba(255,255,255,.06); font-variant-numeric:tabular-nums;}
  .lsc-recent .d{color:var(--ink-faint); font-size:11.5px;}
  .lsc-recent .m{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--ink);}
  .lsc-recent .s{color:var(--ink-dim); text-align:center;}
  .lsc-recent em{font-style:normal; font-weight:800; text-align:center;}
  .lsc-recent li.won em{color:var(--win);} .lsc-recent li.lost em{color:var(--loss);}
  .pg-table tr.today td{background:rgba(56,189,248,.10); font-weight:700;}
  .pg-table td.pts{color:var(--brand); font-weight:800;}
  .pg-note{font-size:12px; color:var(--ink-faint); margin-top:10px; line-height:1.45;}
  .pg-tm{display:inline-flex; align-items:center; gap:7px; min-width:0; max-width:100%; vertical-align:middle;}
  .pg-tm > span:last-child{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .pg-crest{width:20px; height:20px; object-fit:contain; flex:none; display:inline-block;}
  .pg-subtabs{display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; margin:-2px 0 12px; padding-bottom:2px;}
  .pg-subtabs::-webkit-scrollbar{display:none;}
  .pg-st{flex:none; font-family:inherit; font-size:12.5px; font-weight:700; padding:6px 12px; border-radius:999px; border:1px solid var(--border); background:none; color:var(--ink-dim); cursor:pointer; white-space:nowrap;}
  .pg-st.on{background:var(--brand-tint); border-color:rgba(16,185,129,.55); color:var(--brand);}
  .pg-sub2{font-size:11.5px; color:var(--ink-faint); margin-top:2px; line-height:1.35;}
  .pg-reasons{display:flex; flex-wrap:wrap; gap:6px;}
  .pg-reasons span{font-size:12.5px; padding:5px 10px; border-radius:999px; border:1px solid; color:var(--ink);}
  .pg-reasons b{font-variant-numeric:tabular-nums; margin-right:2px;}
  .pg-lesson{border:1px solid var(--border); border-left:3px solid #f87171; border-radius:10px; padding:9px 11px; margin-bottom:8px; font-size:13px; line-height:1.45; color:var(--ink-dim); background:var(--surface-2);}
  .pg-lesson.strong{border-left-color:#4ade80;}
  .pg-lt{font-weight:800; color:var(--ink); margin-bottom:3px;}
  /* İstatistik tab: one card per statistic, lessons as compact rows */
  .st-cards{display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:8px; margin:8px 0 4px;}
  .st-card{border:1px solid var(--border); border-radius:10px; background:var(--surface-2); padding:9px 10px; min-width:0;}
  .st-ch{display:flex; align-items:baseline; justify-content:space-between; gap:6px;}
  .st-ch b{font-size:13px; color:var(--ink);} .st-ch small{font-size:11px; color:var(--ink-faint);}
  .st-big{font-size:18px; font-weight:800; color:var(--ink); margin:3px 0 5px; font-variant-numeric:tabular-nums;}
  .st-big i{font-style:normal; color:var(--ink-faint); font-size:13px; margin:0 5px; font-weight:600;}
  .st-kv{display:flex; justify-content:space-between; gap:6px; font-size:12px; color:var(--ink-dim); line-height:1.6;}
  .st-kv b{color:var(--ink); font-variant-numeric:tabular-nums;} .st-kv b.up{color:#4ade80;} .st-kv b.down{color:#f87171;} .st-kv b.warn{color:#fbbf24;}
  .st-hint{font-weight:500; font-size:11px; color:var(--ink-faint); margin-left:4px;}
  .st-ls{border:1px solid var(--border); border-radius:10px; background:var(--surface-2); overflow:hidden;}
  .st-gh{display:flex; align-items:center; gap:6px; padding:6px 10px; font-size:11.5px; font-weight:800; letter-spacing:.02em; color:var(--ink-dim); background:var(--surface); border-top:1px solid var(--border);}
  .st-gh:first-child{border-top:0;} .st-gh small{font-weight:600; color:var(--ink-faint);}
  .st-row{display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:8px; padding:6px 10px; border-top:1px solid var(--border);}
  .st-ic{min-width:20px; height:20px; display:flex; align-items:center; justify-content:center; gap:4px; border-radius:5px; background:rgba(255,255,255,.06);}
  .st-ic .pg-crest{width:18px; height:18px;}
  .st-d{justify-self:end;}
  .st-nm{display:flex; flex-direction:column; min-width:0; line-height:1.25;}
  .st-nm b{font-size:13px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .st-nm small{font-size:11px; color:var(--ink-faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .st-d{font-size:14px; font-weight:800; font-variant-numeric:tabular-nums; padding:2px 7px; border-radius:7px;}
  .st-d.more{color:#60a5fa; background:rgba(96,165,250,.12);} .st-d.less{color:#fbbf24; background:rgba(251,191,36,.12);}
  @media (max-width:520px){ .st-cards{grid-template-columns:1fr 1fr;} .st-big{font-size:16px;} }
  /* Beyin tab: every learning module with what it applies */
  .br-live{display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--ink-dim); margin-bottom:8px;}
  .br-live i{width:8px; height:8px; border-radius:50%; background:#4ade80; box-shadow:0 0 0 3px rgba(74,222,128,.18); flex:none;}
  .br-live span{flex:1; min-width:0;}
  .br-think{flex:none; font-family:inherit; font-size:12px; font-weight:700; padding:5px 10px; border-radius:999px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink); cursor:pointer;}
  .br-think:disabled{opacity:.6; cursor:default;}
  .br-mods{display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:6px;}
  .br-mod{display:block; width:100%; text-align:left; font-family:inherit; border:1px solid var(--border); border-radius:9px; background:var(--surface-2); padding:7px 10px; font-size:12px; line-height:1.4; color:var(--ink-dim); min-width:0; cursor:pointer;}
  .br-mh{display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:2px;}
  .br-mh b{font-size:12.5px; color:var(--ink); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .br-mv{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
  .br-mod.open .br-mv{display:block;}
  .pg-flag{width:18px; height:13px; object-fit:cover; flex:none; display:inline-block; border-radius:2px; box-shadow:0 0 0 1px rgba(255,255,255,.12);}
  .br-chip{font-size:11px; font-weight:800; padding:2px 8px; border-radius:999px; white-space:nowrap;}
  .br-chip.applied{color:#4ade80; background:rgba(74,222,128,.12);} .br-chip.shadow{color:#94a3b8; background:rgba(148,163,184,.14);}
  .br-chip.waiting{color:#fbbf24; background:rgba(251,191,36,.12);} .br-chip.off{color:#f87171; background:rgba(248,113,113,.12);}
  .br-night td{background:var(--surface-2); font-size:12px; color:var(--ink-dim); padding-top:7px; padding-bottom:7px;}
  .br-night b{color:var(--ink);}
  .bd-day{border:1px solid var(--border); border-radius:14px; background:linear-gradient(180deg, rgba(255,255,255,.03), transparent 50%), var(--surface-2); padding:11px 13px; margin-bottom:10px;}
  .bd-day.today{border-color:rgba(56,189,248,.45); box-shadow:0 6px 18px rgba(56,189,248,.08);}
  .bd-h{display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:6px; font-size:14px; color:var(--ink);}
  .bd-rate{font-size:12px; font-weight:800; padding:2px 9px; border-radius:999px;}
  .bd-rate.good{color:#4ade80; background:rgba(74,222,128,.12);} .bd-rate.bad{color:#f87171; background:rgba(248,113,113,.12);}
  .bd-line{display:flex; gap:8px; align-items:flex-start; font-size:13px; line-height:1.45; color:var(--ink-dim); padding:3px 0;}
  .bd-line.good{color:var(--ink);} .bd-line.bad{color:#fca5a5;}
  .bd-ic{flex:none; width:20px; text-align:center;}
  .bc-recs{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin:2px 0 6px;}
  @media (max-width:520px){ .bc-recs{grid-template-columns:repeat(2,minmax(0,1fr));} }
  .bc-rec{display:flex; flex-direction:column; gap:1px; border:1px solid var(--border); border-radius:12px; background:var(--surface-2); padding:9px 10px; min-width:0;}
  .bc-rec small{font-size:11px; color:var(--ink-faint); font-weight:700; letter-spacing:.02em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .bc-rec b{font-size:18px; color:var(--ink); font-variant-numeric:tabular-nums;}
  .bc-rec span{font-size:11.5px; color:var(--ink-dim);} .bc-rec .up{color:#4ade80; font-weight:800;} .bc-rec .down{color:#f87171; font-weight:800;}
  .bc-rec.day{border-color:rgba(245,196,81,.45); background:linear-gradient(160deg, rgba(245,196,81,.12), transparent 70%), var(--surface-2);}
  .bc-ticket{position:relative; border:1px solid var(--border); border-radius:16px; background:linear-gradient(180deg, rgba(255,255,255,.03), transparent 40%), var(--surface-2); padding:12px 14px; margin-bottom:12px; box-shadow:0 6px 18px rgba(0,0,0,.18);}
  .bc-ticket.day{border-color:rgba(245,196,81,.55); background:radial-gradient(120% 80% at 100% 0%, rgba(245,196,81,.16), transparent 60%), linear-gradient(180deg, rgba(255,255,255,.04), transparent 40%), var(--surface-2); box-shadow:0 8px 26px rgba(245,196,81,.10), 0 6px 18px rgba(0,0,0,.2);}
  .bc-h{display:flex; align-items:center; gap:8px; margin-bottom:6px;}
  .bc-k{font-size:14.5px; font-weight:800; color:var(--ink); letter-spacing:.01em;}
  .bc-ticket.day .bc-k{color:#f5c451;}
  .bc-d{flex:1; min-width:0; font-size:11.5px; color:var(--ink-faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .bc-leg{display:grid; grid-template-columns:40px minmax(0,1fr) auto 22px; gap:8px; align-items:center; padding:8px 0; border-top:1px dashed var(--border); font-size:12.5px; color:var(--ink-dim);}
  .bc-leg small{display:block; font-size:11px; color:var(--ink-faint); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .bc-m{min-width:0;} .bc-m b{display:block; color:var(--ink); line-height:1.3; overflow-wrap:anywhere;}
  .bc-p{text-align:right;} .bc-p b{color:var(--ink);} .bc-t{font-variant-numeric:tabular-nums; color:var(--ink-faint); font-weight:700;} .bc-r{display:flex; justify-content:center;}
  .bc-dot{display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:50%; font-style:normal; font-size:11px; font-weight:900;}
  .bc-dot.won{background:rgba(74,222,128,.18); color:#4ade80;} .bc-dot.lost{background:rgba(248,113,113,.18); color:#f87171;}
  .bc-dot.void{background:rgba(148,163,184,.18); color:#94a3b8;} .bc-dot.open{border:2px solid rgba(251,191,36,.6); width:14px; height:14px;}
  .bc-f{display:grid; grid-template-columns:1fr 1fr; gap:8px; border-top:1px solid var(--border); padding-top:9px; margin-top:2px;}
  .bc-f div{display:flex; flex-direction:column;} .bc-f div:last-child{text-align:right;}
  .bc-f small{font-size:11px; color:var(--ink-faint);} .bc-f b{font-size:20px; color:var(--ink); font-variant-numeric:tabular-nums;}
  .bc-ticket.day .bc-f b{color:#f5c451;}
  /* The 2. kupon (all leagues): the same ticket in blue, under the gold Ana kupon. */
  .bc-ticket.sec{border-color:rgba(56,189,248,.45); background:radial-gradient(120% 80% at 100% 0%, rgba(56,189,248,.12), transparent 60%), linear-gradient(180deg, rgba(255,255,255,.04), transparent 40%), var(--surface-2);}
  .bc-ticket.sec .bc-k, .bc-ticket.sec .bc-f b{color:#7dd3fc;}
  .bc-rec.sec{border-color:rgba(56,189,248,.4); background:linear-gradient(160deg, rgba(56,189,248,.10), transparent 70%), var(--surface-2);}
  .bc-why{margin-top:8px; font-size:12px; line-height:1.45; color:var(--ink-dim); background:rgba(148,163,184,.08); border-radius:10px; padding:7px 9px;}
  .bc-ticket.empty .bc-why{margin-top:2px;}
  .bc-dayh{margin:14px 0 7px; font-size:12.5px; font-weight:800; color:var(--ink-dim); letter-spacing:.03em; text-transform:uppercase;}
  .bc-lg{width:16px; height:16px; object-fit:contain; vertical-align:-3px; margin-right:4px;}
  .bc-tm{white-space:nowrap;}
  .bc-vs{font-style:normal; color:var(--ink-faint); font-weight:600;}
  .bcs{position:sticky; top:0; z-index:3; display:flex; align-items:center; gap:6px; margin:0 -2px 4px; padding:6px 2px; background:linear-gradient(180deg, var(--surface) 80%, transparent);}
  .bcs-arr{flex:0 0 34px; height:52px; border-radius:12px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink); font-size:22px; line-height:1; cursor:pointer;}
  .bcs-arr:disabled{opacity:.3; cursor:default;}
  .bcs-track{flex:1; display:flex; gap:6px; overflow-x:auto; scroll-behavior:smooth; scrollbar-width:none; -webkit-mask-image:linear-gradient(90deg, transparent, #000 14px, #000 calc(100% - 14px), transparent);}
  .bcs-track::-webkit-scrollbar{display:none;}
  .bcs-chip{position:relative; flex:0 0 46px; height:52px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:0; border-radius:12px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink-dim); cursor:pointer; font-family:inherit; padding:0;}
  .bcs-chip small{font-size:10px; font-weight:700; text-transform:capitalize; white-space:nowrap;}
  .bcs-chip b{font-size:17px; color:var(--ink); font-variant-numeric:tabular-nums;}
  .bcs-chip.ahead{border-style:dashed;}
  .bcs-chip.on{border:1px solid rgba(245,196,81,.8); background:linear-gradient(160deg, rgba(245,196,81,.28), rgba(245,196,81,.06)); color:#f5c451; box-shadow:0 4px 14px rgba(245,196,81,.18);}
  .bcs-dot{position:absolute; bottom:4px; width:5px; height:5px; border-radius:50%;} .bcs-dot.won{background:#4ade80;} .bcs-dot.lost{background:#f87171;} .bcs-dot.open{background:#38bdf8;}
  .bc-dayh{display:flex; align-items:center; gap:8px; margin:6px 0 8px;}
  .bc-live{font-size:10.5px; font-weight:700; text-transform:none; letter-spacing:0; color:#38bdf8; background:rgba(56,189,248,.12); border-radius:999px; padding:2px 8px;}
  .bc-sec{border:1px solid var(--border); border-radius:14px; background:var(--surface-2); padding:10px 12px; margin:4px 0 10px;}
  .bc-sech{display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px;} .bc-sech b{font-size:13px; color:var(--ink);}
  .bc-seg{display:inline-flex; border:1px solid var(--border); border-radius:999px; padding:2px; background:var(--surface);}
  .bc-seg button{font-family:inherit; font-size:11.5px; font-weight:700; border:0; background:none; color:var(--ink-dim); padding:4px 10px; border-radius:999px; cursor:pointer;}
  .bc-seg button.on{background:rgba(245,196,81,.2); color:#f5c451;}
  .bc-sec .bc-recs{margin:0;} .bc-sec .bc-rec{background:var(--surface);}
  .lab-card{border:1px solid var(--border); border-radius:14px; background:var(--surface-2); padding:10px 12px; margin:0 0 10px;}
  .lab-h{display:flex; justify-content:space-between; align-items:flex-start; gap:8px; margin-bottom:8px;} .lab-h > div{min-width:0;}
  .lab-h small{display:block; font-size:11px; color:var(--ink-faint); font-weight:700;} .lab-h b{font-size:14px; color:#f5c451;}
  .lab-badge{flex:0 0 auto; font-size:10.5px; font-weight:700; color:var(--ink-dim); border:1px solid var(--border); border-radius:999px; padding:2px 8px;}
  .lab-head, .lab-row{display:grid; grid-template-columns:minmax(0,1fr) 46px 46px 54px; gap:6px; align-items:center;}
  .lab-head{font-size:10.5px; font-weight:700; color:var(--ink-faint); padding:0 8px 4px;} .lab-head span:not(:first-child){text-align:right;}
  .lab-row{padding:7px 8px; border-radius:10px;} .lab-row + .lab-row{margin-top:2px;}
  .lab-row.champ{background:rgba(245,196,81,.09);} .lab-row.champ b{color:#f5c451;}
  .lab-n{min-width:0;} .lab-n b{display:block; font-size:12.5px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .lab-c{text-align:right; font-size:12.5px; color:var(--ink-dim); font-variant-numeric:tabular-nums;} .lab-c.up{color:#4ade80; font-weight:800;} .lab-c.down{color:#f87171; font-weight:800;}
  .lab-more{display:block; width:100%; margin-top:6px; font-family:inherit; font-size:12px; font-weight:700; color:var(--ink-dim); background:none; border:1px dashed var(--border); border-radius:10px; padding:6px; cursor:pointer;}
  .bc-info{border:1px solid var(--border); border-radius:14px; padding:0 12px; margin-bottom:8px;}
  .bc-info summary{cursor:pointer; padding:10px 0; font-size:12.5px; font-weight:700; color:var(--ink-dim);}
  .bc-info p{font-size:12.5px; line-height:1.5; color:var(--ink-dim); margin:0 0 10px;}
  .lab-dots{display:flex; gap:3px; margin-top:4px;}
  .lab-d{width:7px; height:7px; border-radius:50%;} .lab-d.w{background:#4ade80;} .lab-d.l{background:#f87171;}
  .br-hero{position:relative; overflow:hidden; border:1px solid rgba(56,189,248,.28); border-radius:18px; padding:14px; margin-bottom:12px; background:radial-gradient(120% 90% at 0% 0%, rgba(56,189,248,.18), transparent 55%), radial-gradient(90% 80% at 100% 100%, rgba(167,139,250,.16), transparent 60%), var(--surface-2); box-shadow:0 10px 30px rgba(0,0,0,.22);}
  .br-hero.stale{border-color:rgba(251,191,36,.35);}
  .br-hero-top{display:flex; align-items:center; gap:10px; margin-bottom:12px;}
  .br-hero-id{flex:1; min-width:0; display:flex; align-items:center; gap:10px;}
  .br-hero-id > div{min-width:0;}
  .br-hero-id b{display:block; font-size:17px; color:var(--ink); letter-spacing:.01em;}
  .br-hero-id small{display:flex; align-items:center; gap:6px; font-size:12px; color:var(--ink-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .br-orb{flex:none; display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:12px; font-size:22px; background:linear-gradient(140deg, rgba(56,189,248,.35), rgba(167,139,250,.35)); box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);}
  .br-pulse{flex:none; width:8px; height:8px; border-radius:50%; background:#4ade80; box-shadow:0 0 0 0 rgba(74,222,128,.6); animation:brPulse 2s infinite;}
  .br-hero.stale .br-pulse{background:#fbbf24; animation:none;}
  @keyframes brPulse{0%{box-shadow:0 0 0 0 rgba(74,222,128,.55);} 70%{box-shadow:0 0 0 8px rgba(74,222,128,0);} 100%{box-shadow:0 0 0 0 rgba(74,222,128,0);}}
  .br-hero .br-think{padding:7px 14px; font-size:12.5px; border-color:rgba(56,189,248,.45); background:rgba(56,189,248,.12); color:var(--ink);}
  .br-tiles{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px;}
  .br-tile{min-width:0; border-radius:12px; padding:8px 9px; background:rgba(15,23,42,.28); box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);}
  .br-tile small{display:block; font-size:10.5px; font-weight:700; color:var(--ink-faint); letter-spacing:.03em; text-transform:uppercase; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .br-tile b{display:block; margin-top:2px; font-size:13.5px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  @media (max-width:420px){ .br-tiles{grid-template-columns:repeat(2,minmax(0,1fr));} }
  .br-genes{display:flex; flex-wrap:wrap; gap:6px; margin:8px 0;}
  .br-genes span{font-size:12px; color:var(--ink-dim); border:1px solid var(--border); border-radius:999px; padding:3px 9px; background:var(--surface-2);}
  .br-genes b{color:var(--ink); font-variant-numeric:tabular-nums;}
  .br-imps{display:flex; flex-direction:column; gap:5px;}
  .br-imp{display:grid; grid-template-columns:minmax(0,1fr) 90px 38px; align-items:center; gap:8px; font-size:12.5px; color:var(--ink-dim);}
  .br-imp span{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .br-imp i{height:7px; border-radius:4px; background:linear-gradient(90deg, #60a5fa var(--w), rgba(148,163,184,.15) var(--w));}
  .br-imp b{color:var(--ink); text-align:right; font-variant-numeric:tabular-nums;}
  .ky-brain{border:1px solid var(--border); border-left:3px solid #60a5fa; border-radius:10px; padding:8px 11px; margin:0 0 10px; font-size:12.5px; line-height:1.45; color:var(--ink-dim); background:var(--surface-2);}
  .ky-brain b{color:var(--ink);}
  .pg-toggle{display:flex; align-items:center; gap:8px; font-size:13px; font-weight:700; color:var(--ink); margin-top:4px;}
  .pg-toggle input{width:auto; flex:none; margin:0;}
  /* Kupon Yapıcı: a tap-first form (day pills, steppers, segments, slider, chips, switch) with the build button pinned. */
  .ky-hero{position:relative; overflow:hidden; border-radius:16px; padding:14px; margin-bottom:12px; border:1px solid var(--border-highlight);
    background:radial-gradient(120% 140% at 100% 0%, color-mix(in srgb, var(--brand) 22%, transparent), transparent 60%), linear-gradient(160deg, var(--surface-3), var(--surface-2));}
  .ky-hero-t{display:flex; align-items:center; gap:10px;}
  .ky-hero-i{flex:none; width:38px; height:38px; border-radius:12px; display:grid; place-items:center; font-size:19px; background:color-mix(in srgb, var(--brand) 18%, transparent); border:1px solid color-mix(in srgb, var(--brand) 40%, transparent);}
  .ky-hero-t b{display:block; font-family:'Barlow Condensed',sans-serif; font-size:21px; font-weight:800; letter-spacing:.2px; color:var(--ink); line-height:1.1;}
  .ky-hero-t small{display:block; font-size:12px; color:var(--ink-dim); margin-top:2px;}
  .ky-sum{display:flex; flex-wrap:wrap; gap:6px; margin-top:12px;}
  .ky-sum span{font-size:11.5px; font-weight:700; color:var(--ink); padding:4px 9px; border-radius:999px; background:color-mix(in srgb, var(--bg) 55%, transparent); border:1px solid var(--border); font-variant-numeric:tabular-nums;}
  .ky-group{border:1px solid var(--border); border-radius:16px; padding:12px; margin-bottom:10px; background:var(--surface-2);}
  .ky-gh{display:flex; flex-direction:column; gap:1px; margin:0 0 10px;}
  .ky-gh b{font-size:11px; font-weight:800; letter-spacing:.7px; text-transform:uppercase; color:var(--ink-faint);}
  .ky-gh small{font-size:11.5px; color:var(--ink-dim);}
  .ky-row + .ky-row{margin-top:14px; padding-top:12px; border-top:1px solid var(--border);}
  .ky-rl{display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin-bottom:8px;}
  .ky-rl b{font-size:13.5px; font-weight:700; color:var(--ink);}
  .ky-rl small{font-size:11.5px; color:var(--ink-faint);}
  .ky-rl output{font-size:15px; font-weight:800; color:var(--brand); font-variant-numeric:tabular-nums;}
  .ky-group button{font-family:inherit; cursor:pointer; -webkit-tap-highlight-color:transparent;}
  .ky-strat{display:grid; grid-template-columns:repeat(3, 1fr); gap:8px;}
  .ky-strat button{display:flex; flex-direction:column; align-items:center; gap:2px; padding:10px 4px; border-radius:13px; border:1px solid var(--border); background:var(--surface); color:var(--ink-dim); transition:border-color .15s, background .15s, transform .1s;}
  .ky-strat button i{font-style:normal; font-size:20px; line-height:1.2;}
  .ky-strat button b{font-size:13.5px; color:var(--ink);}
  .ky-strat button small{font-size:10.5px; text-align:center;}
  .ky-strat button.on{border-color:var(--brand); background:color-mix(in srgb, var(--brand) 14%, var(--surface)); box-shadow:0 0 0 1px var(--brand) inset, 0 6px 18px color-mix(in srgb, var(--brand) 18%, transparent);}
  .ky-strat button.on b{color:var(--brand);}
  .ky-group button:active{transform:scale(.97);}
  .ky-days{display:grid; grid-template-columns:repeat(7, 1fr); gap:0; border-radius:12px;}
  .ky-days button{display:flex; flex-direction:column; align-items:center; padding:7px 0; border:none; background:none; color:var(--ink-dim); min-width:0;}
  .ky-days button small{font-size:10px; font-weight:700; text-transform:capitalize; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%;}
  .ky-days button b{font-size:17px; font-weight:800; color:var(--ink); line-height:1.25; font-variant-numeric:tabular-nums;}
  .ky-days button.in{background:color-mix(in srgb, var(--brand) 16%, transparent);}
  .ky-days button.start{border-radius:12px 0 0 12px;} .ky-days button.end{border-radius:0 12px 12px 0;} .ky-days button.start.end{border-radius:12px;}
  .ky-days button.start, .ky-days button.end{background:linear-gradient(135deg, var(--brand), var(--brand-dark)); color:var(--bg);}
  .ky-days button.start b, .ky-days button.end b, .ky-days button.start small, .ky-days button.end small{color:var(--bg);}
  .ky-pair{display:grid; grid-template-columns:1fr 1fr; gap:8px;}
  .ky-step{display:flex; align-items:center; border:1px solid var(--border); border-radius:12px; background:var(--surface); overflow:hidden;}
  .ky-step button{flex:none; width:40px; height:44px; border:none; background:none; color:var(--brand); font-size:20px; font-weight:700;}
  .ky-step button:disabled{color:var(--ink-faint); opacity:.4; cursor:default;}
  .ky-step span{flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; line-height:1.1;}
  .ky-step span small{font-size:10px; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.4px;}
  .ky-step span b{font-size:16px; font-weight:800; color:var(--ink); font-variant-numeric:tabular-nums;}
  .ky-seg{display:flex; padding:3px; gap:3px; border-radius:12px; background:var(--surface); border:1px solid var(--border);}
  .ky-seg button{flex:1; min-width:0; height:36px; border:none; border-radius:9px; background:none; color:var(--ink-dim); font-size:13px; font-weight:700; transition:background .15s, color .15s;}
  .ky-seg button.on{background:linear-gradient(135deg, var(--brand), var(--brand-dark)); color:var(--bg); box-shadow:0 3px 10px color-mix(in srgb, var(--brand) 30%, transparent);}
  .ky-range{-webkit-appearance:none; appearance:none; width:100%; height:6px; border-radius:999px; margin:10px 0 4px; padding:0; border:none;
    background:linear-gradient(90deg, var(--brand) var(--p, 50%), var(--surface-3) var(--p, 50%));}
  .ky-range::-webkit-slider-thumb{-webkit-appearance:none; width:24px; height:24px; border-radius:50%; background:#fff; border:3px solid var(--brand); box-shadow:0 2px 8px rgba(0,0,0,.35); cursor:pointer;}
  .ky-range::-moz-range-thumb{width:20px; height:20px; border-radius:50%; background:#fff; border:3px solid var(--brand); box-shadow:0 2px 8px rgba(0,0,0,.35); cursor:pointer;}
  .ky-ticks{display:flex; justify-content:space-between; margin-top:6px; font-size:10.5px; color:var(--ink-faint);}
  .ky-chips{display:flex; flex-wrap:wrap; gap:6px;}
  .ky-chip{display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700; color:var(--ink-dim); padding:8px 12px; border-radius:999px; border:1px solid var(--border); background:var(--surface);}
  .ky-chip::before{content:'+'; font-weight:800; opacity:.7;}
  .ky-chip.on{color:var(--brand); border-color:color-mix(in srgb, var(--brand) 60%, transparent); background:color-mix(in srgb, var(--brand) 12%, var(--surface));}
  .ky-chip.on::before{content:'✓'; opacity:1;}
  .ky-switch{display:flex; align-items:center; gap:12px; margin-top:14px; padding-top:12px; border-top:1px solid var(--border); cursor:pointer;}
  .ky-switch > span{flex:1; min-width:0;}
  .ky-switch b{display:block; font-size:13.5px; color:var(--ink);}
  .ky-switch small{display:block; font-size:11.5px; color:var(--ink-dim); margin-top:2px;}
  .ky-switch input{position:absolute; opacity:0; width:1px; height:1px;}
  .ky-switch i{flex:none; position:relative; width:46px; height:28px; border-radius:999px; background:var(--surface-3); border:1px solid var(--border); transition:background .2s;}
  .ky-switch i::after{content:''; position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:50%; background:#fff; box-shadow:0 1px 4px rgba(0,0,0,.35); transition:transform .2s;}
  .ky-switch input:checked + i{background:var(--brand); border-color:var(--brand);}
  .ky-switch input:checked + i::after{transform:translateX(18px);}
  .ky-switch input:focus-visible + i{outline:2px solid var(--brand); outline-offset:2px;}
  .ky-cta{position:sticky; bottom:0; z-index:3; display:flex; gap:8px; margin:12px 0 0; padding:10px 0 calc(10px + env(safe-area-inset-bottom));
    background:linear-gradient(180deg, transparent, var(--surface) 30%);}
  .ky-cta .btn{flex:1; height:50px; font-size:17px; border-radius:14px; box-shadow:0 8px 24px color-mix(in srgb, var(--brand) 30%, transparent);}
  .ky-reset{flex:none; width:50px; height:50px; border-radius:14px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink-dim); font-size:20px; font-family:inherit; cursor:pointer;}
  [data-cout]:not(:empty){margin-top:6px;}
  .ky-card{border:1px solid var(--border); border-radius:16px; padding:12px; margin-bottom:12px; background:var(--surface-2);}
  .ky-card.best{border-color:color-mix(in srgb, var(--brand) 55%, transparent); background:linear-gradient(160deg, color-mix(in srgb, var(--brand) 9%, var(--surface-2)), var(--surface-2) 55%);}
  .ky-head{display:flex; justify-content:space-between; align-items:center; gap:8px; color:var(--ink); margin-bottom:10px;}
  .ky-head > div:first-child{display:flex; align-items:center; flex-wrap:wrap; gap:6px;}
  .ky-head b{font-size:15px;}
  .ky-head em{font-style:normal; font-size:10.5px; font-weight:800; padding:2px 8px; border-radius:999px; background:color-mix(in srgb, var(--accent) 18%, transparent); color:var(--accent);}
  .ky-head small{font-size:12px; color:var(--ink-faint);}
  .ky-total{text-align:right; line-height:1.05;}
  .ky-total small{display:block; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.4px;}
  .ky-total b{font-family:'Barlow Condensed',sans-serif; font-size:26px; font-weight:800; color:var(--brand); font-variant-numeric:tabular-nums;}
  .ky-card{padding:10px 12px;}
  .ky-head{margin-bottom:4px;} .ky-head small{width:100%;}
  .ky-tn{font-size:14px; font-weight:700; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .ky-ls{display:flex; align-items:center; gap:4px; white-space:nowrap; overflow:hidden;}
  .ky-ls img{width:13px !important; height:13px !important;}
  .ky-risk{margin-top:6px; font-size:11px;}
  .ky-btns{display:grid; grid-template-columns:1fr auto; gap:6px; margin-top:8px;}
  .ky-btns .btn{font-size:13px; padding:9px 12px; margin:0;}
  .ky-kpis{display:grid; grid-template-columns:repeat(2, 1fr); gap:6px; margin-bottom:8px;}
  .ky-kpis div{background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:7px 9px;}
  .ky-kpis span{display:block; font-size:10.5px; color:var(--ink-dim); font-weight:600;}
  .ky-kpis b{display:block; font-size:16px; font-weight:800; color:var(--ink); font-variant-numeric:tabular-nums;}
  .ky-leg{display:flex; align-items:center; gap:8px; padding:6px 0; border-top:1px solid var(--border);}
  .ky-lm{flex:1; min-width:0;}
  .ky-lp{flex:none; display:flex; flex-direction:column; align-items:flex-end; gap:2px; font-variant-numeric:tabular-nums;}
  .ky-lp b{font-size:12.5px; color:var(--brand); padding:2px 8px; border-radius:7px; background:color-mix(in srgb, var(--brand) 13%, transparent);} .ky-lp span{font-size:13px; font-weight:700; color:var(--ink);} .ky-lp i{font-style:normal; font-size:11px; font-weight:700; color:var(--ink-dim);}
  .ky-notes{display:flex; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; gap:4px; margin-top:3px;}
  .ky-notes span{flex:none; font-size:10px; font-weight:700; padding:0 6px; border-radius:999px; border:1px solid;}
  .ky-notes span.g{color:#4ade80; border-color:rgba(74,222,128,.45);} .ky-notes span.b{color:#f87171; border-color:rgba(248,113,113,.45);}
  .pg-h{font-size:13px; font-weight:800; color:var(--ink); margin:14px 0 8px;}

  .side-item{
    display:flex; align-items:center; gap:10px; padding:9px 12px; border-radius:8px; cursor:pointer;
    font-size:14px; font-weight:500; color:var(--ink-dim); transition:all .15s; margin-bottom:4px;
  }
  .side-item .flag, .country-header .flag{
    font-size:16px; width:22px; height:18px; text-align:center;
    display:inline-flex; align-items:center; justify-content:center; flex-shrink:0;
  }
  .side-item.active{background:var(--brand-tint); color:#fff; font-weight:700; border-left:3px solid var(--brand);}
  .side-item:hover:not(.active){background:var(--surface-2); color:var(--ink);}
  .side-sep{height:1px; background:var(--border); margin:6px 4px;}

  /* Collapsible Country Sidebar */
  .country-group{margin-bottom:4px;}
  .country-header{
    display:flex; align-items:center; justify-content:space-between; padding:8px 10px;
    border-radius:8px; cursor:pointer; font-size:13.5px; font-weight:700; color:var(--ink);
    background:var(--surface-2); transition:all .15s; user-select:none; margin-bottom:2px;
  }
  .country-header:hover{background:var(--surface-3); color:var(--brand);}
  .country-header .ch-left{display:flex; align-items:center; gap:8px;}
  .country-header .ch-arrow{font-size:11px; color:var(--ink-faint); transition:transform .2s;}
  .country-header.open .ch-arrow{transform:rotate(90deg);}
  .country-subleagues{display:none; padding-left:10px; margin-top:2px;}
  .country-subleagues.open{display:block;}
  .sub-league-item{
    display:flex; align-items:center; gap:8px; padding:6px 10px; border-radius:6px;
    font-size:12.5px; font-weight:600; color:var(--ink-dim); cursor:pointer; transition:all .15s; margin-bottom:2px;
  }
  .sub-league-item:hover{background:var(--surface-2); color:var(--ink);}
  .sub-league-item.active{background:var(--brand-tint); color:var(--brand); font-weight:700; border-left:2px solid var(--brand);}

  /* Kupon Editörü Studio Styles */
  .studio-grid{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px;}
  .studio-card{background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:20px; box-shadow:var(--card-shadow);}
  
  .tier-chips{display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; margin:8px 0 14px;}
  .tier-chip{
    background:var(--surface-2); border:1px solid var(--border); border-radius:10px; padding:10px;
    text-align:center; cursor:pointer; transition:all .2s; user-select:none;
  }
  .tier-chip:hover{background:var(--surface-3); border-color:var(--border-highlight);}
  .tier-chip.active{background:var(--brand-tint); border-color:var(--brand); box-shadow:0 0 0 2px rgba(16,185,129,0.3);}
  .tier-chip .t-icon{font-size:18px; margin-bottom:2px;}
  .tier-chip .t-title{font-size:13px; font-weight:800; color:var(--ink);}
  .tier-chip .t-sub{font-size:10.5px; color:var(--ink-dim); margin-top:2px;}

  .odds-quick-row{display:flex; gap:6px; flex-wrap:wrap; margin-top:6px;}
  .odds-quick-chip{
    background:var(--surface-2); border:1px solid var(--border); color:var(--ink); padding:5px 10px;
    border-radius:8px; font-size:12px; font-weight:700; cursor:pointer; transition:all .15s;
  }
  .odds-quick-chip:hover{background:var(--surface-3); border-color:var(--brand);}
  .odds-quick-chip.active{background:var(--brand); color:#000; font-weight:800; border-color:var(--brand);}

  .market-chips-grid{display:grid; grid-template-columns:repeat(2, 1fr); gap:8px; margin-top:8px;}
  .market-chip-box{
    display:flex; align-items:center; gap:8px; background:var(--surface-2); border:1px solid var(--border);
    padding:8px 12px; border-radius:8px; font-size:12.5px; font-weight:600; cursor:pointer; transition:all .15s; user-select:none;
  }
  .market-chip-box:hover{background:var(--surface-3);}
  .market-chip-box input[type="checkbox"]{width:16px; height:16px; accent-color:var(--brand); cursor:pointer;}

  .live-slip-box{background:linear-gradient(135deg, var(--surface), var(--surface-2)); border:1px solid var(--border-highlight); border-radius:14px; padding:20px;}
  .slip-summary-banner{
    display:grid; grid-template-columns:repeat(4, 1fr); gap:8px; background:var(--surface-3); border:1px solid var(--border);
    border-radius:10px; padding:12px; text-align:center; margin-bottom:16px;
  }
  .slip-stat-item .ss-lbl{font-size:10.5px; color:var(--ink-faint); text-transform:uppercase; font-weight:700;}
  .slip-stat-item .ss-val{font-family:'Barlow Condensed',sans-serif; font-size:22px; font-weight:800; margin-top:2px;}

  .leg-card{position:relative; background:linear-gradient(160deg,var(--surface) 0%,var(--surface-2) 100%); border:1px solid var(--border); border-radius:12px; padding:9px 14px 10px; margin-bottom:8px; overflow:hidden; transition:border-color .15s, box-shadow .15s; max-width:640px;}
  .leg-card::before{content:''; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--brand);}
  .leg-card.won::before{background:var(--win);} .leg-card.lost::before{background:var(--loss);} .leg-card.void::before{background:var(--ink-faint);}
  .leg-card.won{border-color:var(--win); box-shadow:0 0 0 1px var(--win), 0 0 14px -4px rgba(16,185,129,.45); background:linear-gradient(160deg, rgba(16,185,129,.08) 0%, var(--surface-2) 55%);}
  .leg-card.lost{border-color:var(--loss); box-shadow:0 0 0 1px var(--loss);}
  .leg-card:hover{border-color:var(--border-highlight); box-shadow:var(--card-shadow);}
  .lc-grid{display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:'league when' 'teams side'; gap:8px 14px; align-items:center;}
  .lc-league{grid-area:league; display:flex; align-items:center; gap:6px; font-size:11px; font-weight:700; color:var(--ink-dim); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .lc-league img{width:16px; height:16px; object-fit:contain; flex-shrink:0;}
  .lc-when{grid-area:when; display:flex; gap:6px; justify-content:flex-end;}
  .lc-chip{background:var(--surface-3); border:1px solid var(--border); border-radius:6px; padding:2px 8px; font-size:11px; font-weight:700; color:var(--ink); white-space:nowrap;}
  .lc-teams{grid-area:teams; display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:10px;}
  .lc-team{display:flex; align-items:center; gap:9px; min-width:0;}
  .lc-team.away{flex-direction:row-reverse; justify-content:flex-end;}
  .lc-crest{width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,0.07); display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; font-size:12px; font-weight:800; color:var(--ink-dim);}
  .lc-crest img{width:30px; height:30px; object-fit:contain;}
  .lc-name{font-weight:700; font-size:13.5px; line-height:1.2; color:var(--ink); overflow-wrap:anywhere;}
  .lc-vs{font-size:10px; font-weight:800; color:var(--ink-faint); letter-spacing:1px;}
  .lc-side{grid-area:side; display:grid; justify-items:end; gap:5px;}
  .lc-meta{display:flex; align-items:center; gap:10px; font-size:11.5px; color:var(--ink-dim); white-space:nowrap;}
  .lc-ev{font-weight:700;}
  .lc-act{display:flex; align-items:center; gap:9px;}
  .lc-pick{font-size:12px; font-weight:800; color:var(--brand); background:var(--brand-tint); border:1px solid rgba(16,185,129,0.3); padding:3px 9px; border-radius:6px; white-space:nowrap;}
  .lc-odd{font-family:'Barlow Condensed',sans-serif; font-size:22px; font-weight:800; color:var(--accent); line-height:1;}
  .lc-del{background:transparent; border:1px solid var(--border); color:var(--ink-faint); width:26px; height:26px; border-radius:7px; cursor:pointer;}
  .lc-del:hover{color:var(--loss); border-color:var(--loss);}
  .lc-reason{font-size:11.5px; color:var(--ink-dim); margin-top:7px;}
  .lc-result{font-weight:800;} .lc-result.won{color:var(--win);} .lc-result.lost{color:var(--loss);}
  @media (max-width:640px){
    .lc-grid{grid-template-columns:minmax(0,1fr); grid-template-areas:'league' 'when' 'teams' 'side';}
    .lc-when{justify-content:flex-start;}
    .lc-side{justify-items:start;}
  }
  .gen-loader{display:flex; flex-direction:column; align-items:center; gap:14px; padding:46px 20px; color:var(--ink-dim);}
  .gen-orbit{position:relative; width:74px; height:74px;}
  .gen-orbit::before{content:''; position:absolute; inset:0; border-radius:50%; border:3px solid var(--surface-3); border-top-color:var(--brand); border-right-color:#38bdf8; animation:genSpin 1s linear infinite;}
  .gen-orbit::after{content:''; position:absolute; inset:9px; border-radius:50%; border:2px dashed var(--border); animation:genSpin 2.6s linear infinite reverse;}
  .gen-ball{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:28px; animation:genBounce .9s ease-in-out infinite;}
  .gen-step{font-size:13px; font-weight:700; color:var(--ink); min-height:18px; transition:opacity .25s;}
  .gen-bar{width:min(260px,70%); height:5px; border-radius:3px; background:var(--surface-3); overflow:hidden;}
  .gen-bar i{display:block; height:100%; width:40%; border-radius:3px; background:linear-gradient(90deg,var(--brand),#38bdf8); animation:genSlide 1.3s ease-in-out infinite;}
  @keyframes genSpin{to{transform:rotate(360deg);}}
  @keyframes genBounce{0%,100%{transform:translateY(-3px) scale(1);}50%{transform:translateY(3px) scale(.92);}}
  @keyframes genSlide{0%{transform:translateX(-100%);}100%{transform:translateX(260%);}}
  @media (prefers-reduced-motion:reduce){.gen-orbit::before,.gen-orbit::after,.gen-ball,.gen-bar i{animation:none;}}
  .target-hint{font-size:11.5px; line-height:1.5; color:var(--accent); margin-top:8px; display:none;}
  .target-hint a{color:var(--brand); font-weight:800; cursor:pointer; margin-left:6px; text-decoration:underline;}
  .clamp-note{background:rgba(245,158,11,0.10); border:1px solid rgba(245,158,11,0.35); color:var(--accent); border-radius:10px; padding:8px 12px; font-size:12px; margin-bottom:10px;}
  .slip-leg-item{
    background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:12px 14px;
    margin-bottom:8px; display:flex; align-items:center; justify-content:space-between; gap:10px;
    transition:all .15s; position:relative;
  }
  .slip-leg-item:hover{border-color:var(--border-highlight); transform:translateX(2px);}
  .slip-leg-left{flex:1;}
  .slip-leg-left .s-teams{font-weight:700; font-size:14px; color:var(--ink);}
  .slip-leg-left .s-meta{font-size:11px; color:var(--ink-dim); margin-top:2px;}
  .slip-leg-left .s-reason{font-size:11px; color:var(--brand); margin-top:4px; font-style:italic;}
  .slip-leg-right{display:flex; align-items:center; gap:10px; text-align:right;}
  .slip-pick-tag{
    background:var(--brand-tint); border:1px solid rgba(16,185,129,0.3); color:var(--brand);
    font-family:'Barlow Condensed',sans-serif; font-size:15px; font-weight:800; padding:4px 10px; border-radius:6px;
  }
  .slip-remove-btn{
    background:rgba(239,68,68,0.1); border:1px solid rgba(239,68,68,0.25); color:var(--loss);
    width:28px; height:28px; border-radius:6px; display:flex; align-items:center; justify-content:center;
    font-size:13px; font-weight:bold; cursor:pointer; transition:all .15s;
  }
  .slip-remove-btn:hover{background:#ef4444; color:#fff;}

  .saved-coupon-card{
    background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:14px 16px;
    margin-bottom:12px; transition:all .2s;
  }
  .saved-coupon-card:hover{border-color:var(--border-highlight); box-shadow:var(--card-shadow);}
  .sc-header{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px; margin-bottom:10px;}
  .sc-title{font-weight:800; font-size:15px; color:var(--ink); font-family:'Barlow Condensed',sans-serif;}
  .sc-badge{font-size:11px; font-weight:800; padding:3px 8px; border-radius:6px; text-transform:uppercase;}
  .sc-badge.pending{background:rgba(245,158,11,0.15); color:var(--accent); border:1px solid rgba(245,158,11,0.3);}
  .sc-badge.won{background:rgba(16,185,129,0.15); color:var(--win); border:1px solid rgba(16,185,129,0.3);}
  .sc-badge.lost{background:rgba(239,68,68,0.15); color:var(--loss); border:1px solid rgba(239,68,68,0.3);}
  .sc-actions{display:flex; align-items:center; gap:6px;}
  .sc-btn-sm{background:var(--surface-2); border:1px solid var(--border); color:var(--ink); font-size:11.5px; font-weight:700; padding:5px 9px; border-radius:6px; cursor:pointer; display:inline-flex; align-items:center; gap:4px; transition:all .15s;}
  .sc-btn-sm:hover{background:var(--surface-3); color:var(--brand); border-color:var(--brand);}
  .sc-btn-load{background:var(--brand-tint); border:1px solid var(--brand); color:var(--brand); font-size:11.5px; font-weight:700; padding:5px 9px; border-radius:6px; cursor:pointer; display:inline-flex; align-items:center; gap:4px; transition:all .15s;}
  .sc-btn-load:hover{background:var(--brand); color:#000;}
  .sc-del-btn{background:rgba(239,68,68,0.1); border:1px solid rgba(239,68,68,0.25); color:var(--loss); font-size:11.5px; font-weight:700; padding:5px 8px; border-radius:6px; cursor:pointer; transition:all .15s;}
  .sc-del-btn:hover{background:var(--loss); color:#fff;}
  .sc-legs-container{margin:10px 0; display:flex; flex-direction:column; gap:6px; transition:max-height .3s ease;}
  .sc-legs-container.collapsed{display:none;}
  .sc-leg-row{background:var(--surface-2); border:1px solid var(--border); border-radius:8px; padding:8px 12px; display:flex; justify-content:space-between; align-items:center; gap:8px;}
  .sc-leg-row .scl-meta{font-size:11px; color:var(--ink-faint); margin-bottom:2px;}
  .sc-leg-row .scl-match{font-size:13.5px; font-weight:700; color:var(--ink);}
  .sc-leg-row .scl-pick{display:inline-block; font-size:11.5px; font-weight:800; color:var(--brand); background:var(--brand-tint); padding:2px 6px; border-radius:4px; margin-top:3px;}
  .sc-leg-row .scl-reason{font-size:11.5px; color:var(--ink-dim); margin-top:3px;}
  .sc-leg-row .scl-odds{font-family:'Barlow Condensed',sans-serif; font-size:16px; font-weight:800; color:var(--accent); text-align:right;}
  .sc-compact{padding:10px 12px; margin-bottom:8px;}
  .sc-top{display:flex; align-items:center; gap:6px; min-width:0;}
  .sc-top .sc-title{font-size:14.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0;}
  .sc-top .sc-badge{font-size:10px; padding:2px 6px; flex:none;}
  .sc-top .sc-odds{margin-left:auto; flex:none; font:800 18px/1 'Barlow Condensed',sans-serif; color:var(--accent);}
  .sc-sub{display:flex; flex-wrap:wrap; gap:4px 10px; font-size:11.5px; color:var(--ink-faint); margin:4px 0 8px;}
  .sc-sub b{font-weight:800;}
  .sc-compact .sc-actions{gap:6px;}
  .sc-compact .sc-btn-sm, .sc-compact .sc-btn-load, .sc-compact .sc-del-btn{padding:5px 9px; font-size:12px;}
  .sc-compact .sc-ic{padding:5px 8px; font-size:13px;}
  .sc-compact .sc-legs-btn{margin-right:auto;}
  .sc-compact .sc-legs-container{margin:8px 0 0; gap:4px;}
  .sc-compact .sc-leg-row{padding:4px 8px; gap:8px; justify-content:flex-start;}
  .sc-compact .sc-leg-row.won{border-color:rgba(16,185,129,.35);} .sc-compact .sc-leg-row.lost{border-color:rgba(239,68,68,.35);}
  .sc-leg-row .scl-mark{flex:none; font-size:13px;}
  .sc-leg-row .scl-main{flex:1; min-width:0;}
  .sc-compact .sc-leg-row .scl-match{font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  /* Home and away on their own lines, so a long home name no longer hides the away team. */
  .sc-leg-row .scl-team{font-size:12.5px; font-weight:700; line-height:1.15; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .sc-compact .sc-leg-row .scl-meta{margin:1px 0 0; font-size:10.5px; line-height:1.15; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .sc-leg-row .scl-end{flex:none; display:flex; flex-direction:column; align-items:flex-end; gap:2px;}
  .sc-compact .sc-leg-row .scl-pick{margin:0; font-size:11px; max-width:96px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .sc-footer{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px; padding-top:10px; border-top:1px solid var(--border); font-size:12.5px; color:var(--ink-dim);}


  /* Shot & Stats Cards */
  .shot-match-grid{display:grid; grid-template-columns:1fr; gap:12px;}
  .shot-card{background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:16px; box-shadow:var(--card-shadow); transition:all .2s;}
  .shot-card:hover{border-color:var(--border-highlight); transform:translateY(-1px);}
  .shot-grid3{display:grid; grid-template-columns:repeat(3, 1fr); gap:10px; margin-top:10px;}
  .shot-metric-box{background:var(--surface-2); border:1px solid var(--border); border-radius:8px; padding:10px; text-align:center;}
  .shot-metric-box .s-title{font-size:11px; color:var(--ink-faint); text-transform:uppercase; font-weight:700;}
  .shot-metric-box .s-val{font-family:'Barlow Condensed',sans-serif; font-size:18px; font-weight:800; color:var(--brand); margin:4px 0;}
  .shot-metric-box .s-sub{font-size:11px; color:var(--ink-dim);}

  .main{flex:1; min-width:0;}
  .panel{display:none;}
  .panel.active{display:block;}

  /* Banner Alert */
  .system-banner{
    background:linear-gradient(90deg, var(--surface-2), var(--surface)); border:1px solid var(--border); color:var(--brand);
    font-size:13px; padding:10px 14px; border-radius:10px; margin-bottom:14px; display:flex; align-items:center; justify-content:space-between;
  }
  .system-banner b{color:var(--ink);}

  /* Date Strip */
  .date-strip{display:flex; align-items:center; gap:4px; background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:8px 10px; margin-bottom:14px;}
  .ds-arrow{width:32px; height:32px; border-radius:8px; border:none; background:var(--surface-2); color:var(--ink); font-size:18px; cursor:pointer;}
  .ds-arrow:hover{background:var(--surface-3);}
  .ds-days{flex:1; display:flex; justify-content:space-around; overflow-x:auto; gap:4px;}
  .ds-day{display:flex; flex-direction:column; align-items:center; gap:2px; padding:6px 12px; border-radius:8px; cursor:pointer; min-width:60px;}
  .ds-day .wd{font-size:11px; font-weight:700; color:var(--ink-faint); letter-spacing:.4px;}
  .ds-day .dm{font-size:13px; color:var(--ink-dim); font-weight:600;}
  .ds-day.active{background:var(--brand-tint); border-bottom:2px solid var(--brand);}
  .ds-day.active .wd, .ds-day.active .dm{color:var(--brand); font-weight:700;}
  .ds-all{flex:none; padding:7px 12px; border-radius:8px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink-dim); font-size:12px; font-weight:700; cursor:pointer;}
  .ds-all.active{background:var(--brand-tint); border-color:var(--brand); color:var(--brand);}
  .ds-hint{flex:none; font-size:11px; color:var(--ink-faint); padding:0 4px; white-space:nowrap;}
  .ds-cal{width:36px; height:36px; border-radius:8px; border:1px solid var(--border); background:var(--surface-2); display:flex; align-items:center; justify-content:center; cursor:pointer; position:relative;}
  .ds-cal input{position:absolute; inset:0; opacity:0; cursor:pointer; width:100%; height:100%;}

  /* Match Card & Header Grid */
  .match-grid-row{
    display:grid;
    grid-template-columns: 85px minmax(260px, 1.3fr) 130px 180px 150px 112px;
    gap:12px;
    align-items:center;
  }

  .matches-table-header{
    background:var(--surface-2);
    border:1px solid var(--border);
    border-radius:10px;
    padding:10px 16px;
    margin-bottom:8px;
    font-family:'Barlow Condensed',sans-serif;
    font-size:13px;
    font-weight:700;
    color:var(--ink-dim);
    text-transform:uppercase;
    letter-spacing:0.6px;
    user-select:none;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  }
  .th-cell{
    display:flex;
    align-items:center;
    gap:6px;
  }
  .th-cell.th-center{
    justify-content:center;
    text-align:center;
  }
  .th-cell.sortable{
    cursor:pointer;
    transition:all .15s ease;
  }
  .th-cell.sortable:hover{
    color:var(--brand);
  }
  .th-cell.sortable.active{
    color:var(--brand);
    text-shadow: 0 0 10px rgba(16, 185, 129, 0.4);
  }
  .th-cell .sort-arrow{
    font-size:11px;
    opacity:0.4;
    transition:all .15s ease;
  }
  .th-cell.sortable:hover .sort-arrow,
  .th-cell.sortable.active .sort-arrow{
    opacity:1;
    color:var(--brand);
  }

  /* Match Card */
  .match-card{
    background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:14px 16px; margin-bottom:10px;
    transition:all .2s;
  }
  .match-card:hover{border-color:var(--border-highlight); transform:translateY(-1px); box-shadow:var(--card-shadow);}
  .match-card.is-won{
    border: 2.5px solid #22c55e !important;
    box-shadow: 0 0 18px rgba(34, 197, 94, 0.35), inset 0 0 14px rgba(34, 197, 94, 0.05) !important;
  }
  .match-card.is-won:hover{
    border-color: #22c55e !important;
    box-shadow: 0 0 26px rgba(34, 197, 94, 0.5), inset 0 0 14px rgba(34, 197, 94, 0.08) !important;
  }
  .mc-score-box{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-width: 40px;
    padding: 4px 7px;
    background: var(--surface-3);
    border: 1px solid var(--border-highlight);
    border-radius: 8px;
    flex-shrink: 0;
    transition: all 0.22s ease;
  }
  .mc-score-box.is-won-score{
    background: linear-gradient(135deg, rgba(34, 197, 94, 0.35) 0%, rgba(16, 185, 129, 0.5) 100%) !important;
    border: 2px solid #22c55e !important;
    box-shadow: 0 0 16px rgba(34, 197, 94, 0.55), inset 0 0 8px rgba(34, 197, 94, 0.25) !important;
  }
  .mc-score-box.is-lost-score{
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.25) 0%, rgba(185, 28, 28, 0.45) 100%) !important;
    border: 2px solid #ef4444 !important;
    box-shadow: 0 0 16px rgba(239, 68, 68, 0.55), inset 0 0 8px rgba(239, 68, 68, 0.25) !important;
  }
  .match-card.is-lost{
    border-color: rgba(239, 68, 68, 0.35) !important;
  }
  .match-card.is-lost:hover{
    border-color: rgba(239, 68, 68, 0.65) !important;
  }
  .mc-score-val{
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.1;
    text-align: center;
    color: #f8fafc;
  }
  .mc-score-box.is-won-score .mc-score-val{
    color: #4ade80 !important;
    font-size: 17px !important;
    font-weight: 900 !important;
    text-shadow: 0 0 8px rgba(74, 222, 128, 0.6) !important;
  }
  .score-won-tag{
    font-size: 8.5px;
    font-weight: 900;
    color: #ffffff;
    background: #16a34a;
    padding: 1.5px 5px;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    line-height: 1;
    margin-top: 1px;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.6);
  }
  .score-lost-tag{
    font-size: 8.5px;
    font-weight: 900;
    color: #ffffff;
    background: #dc2626;
    padding: 1.5px 5px;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    line-height: 1;
    margin-top: 1px;
    box-shadow: 0 0 6px rgba(220, 38, 38, 0.6);
  }
  .mc-time{text-align:center;}
  .mc-time .time{font-family:'Barlow Condensed',sans-serif; font-size:16px; font-weight:700; color:var(--ink);}
  .mc-time .status{font-size:10px; color:var(--ink-faint); text-transform:uppercase;}
  .mc-teams .league{font-size:11px; color:var(--brand); font-weight:600; margin-bottom:2px;}
  .mc-teams .name{font-weight:700; font-size:14px; color:var(--ink); display:flex; align-items:center; justify-content:flex-start; gap:8px;}
  .mc-teams .name.away{color:var(--ink-dim); font-weight:600;}
  .form-pills{display:flex; gap:3px;}
  .fpill{width:18px; height:18px; border-radius:4px; font-size:11px; font-weight:800; display:flex; align-items:center; justify-content:center; color:#fff; font-family:'Barlow Condensed',sans-serif;}
  .fpill.G, .fpill.W{background:#22c55e; color:#fff;} 
  .fpill.B, .fpill.D{background:#eab308; color:#000;} 
  .fpill.M, .fpill.L{background:#ef4444; color:#fff;}

  .odds-chip-row{display:flex; gap:4px; justify-content:center;}
  .odds-chip{background:var(--surface-2); border:1px solid var(--border); border-radius:6px; padding:4px 8px; font-size:12px; font-weight:700; font-family:'Barlow Condensed',sans-serif; min-width:36px; text-align:center;}
  .odds-chip span{display:block; font-size:9px; color:var(--ink-faint); font-weight:500;}

  .pred-box{
    background:var(--brand-tint); border:1px solid var(--border-highlight);
    border-radius:8px; padding:6px 10px; text-align:center;
  }
  .pred-box b{font-family:'Barlow Condensed',sans-serif; font-size:16px; color:var(--brand); font-weight:800;}
  .pred-box .prob{font-size:11px; color:var(--ink-dim);}

  .action-btns{display:flex; gap:6px; justify-content:center; align-items:center; width:100%;}
  .btn-icon{
    width:32px; height:32px; border-radius:8px; border:1px solid var(--border); background:var(--surface-2);
    color:var(--ink); font-size:14px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .15s;
  }
  .btn-icon:hover{background:var(--brand); color:#000; border-color:var(--brand);}
  .btn-icon.added{background:var(--accent); color:#000; border-color:var(--accent);}

  /* Analysis Tab & Simulation */
  .grid2{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px;}
  .card{background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:20px; box-shadow:var(--card-shadow);}
  .card h3, .card h4{color:var(--ink); margin-bottom:12px; display:flex; align-items:center; gap:8px;}

  /* Sleek & Compact Probability Segment Bar */
  .compact-prob-card{background:var(--surface-2); border:1px solid var(--border); border-radius:10px; padding:12px 16px; margin-bottom:14px;}
  .cp-meta{display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; margin-bottom:8px; text-align:center;}
  .cp-team{padding:4px 6px; border-radius:6px; background:var(--surface-3);}
  .cp-team .cp-name{display:block; font-size:12px; font-weight:600; color:var(--ink-dim); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .cp-team .cp-prob{font-family:'Barlow Condensed',sans-serif; font-size:20px; font-weight:800;}
  .cp-team .cp-odds{font-size:11px; color:var(--ink-faint);}
  .cp-bar{display:flex; height:10px; border-radius:5px; overflow:hidden; background:var(--surface-3); width:100%;}
  .cp-fill.home{background:var(--win);}
  .cp-fill.draw{background:var(--draw);}
  .cp-fill.away{background:var(--loss);}

  /* KPI Dashboard Grid */
  .kpi-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:14px; margin-bottom:18px;}
  .kpi-card{
    background:linear-gradient(180deg, rgba(20, 27, 45, 0.95) 0%, rgba(13, 19, 33, 0.95) 100%);
    border:1px solid rgba(56, 189, 248, 0.22);
    border-radius:12px;
    padding:12px 16px 20px;
    box-shadow:0 6px 20px rgba(0, 0, 0, 0.35);
    text-align:center;
    position:relative;
    overflow:hidden;
    cursor:pointer;
    transition:all 0.22s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .kpi-card:hover{
    transform:translateY(-2.5px);
    border-color:rgba(56, 189, 248, 0.5);
    box-shadow:0 10px 28px rgba(0, 150, 255, 0.16);
  }
  .kpi-card::before{
    content:""; position:absolute; top:0; left:0; right:0; height:3px;
    background:linear-gradient(90deg, #38bdf8, #2563eb, #10b981);
  }
  .kpi-card .k-top-row{
    display:flex; align-items:center; justify-content:space-between; margin-bottom:8px;
  }
  .kpi-card .k-title{
    font-size:11px; color:#94a3b8; text-transform:uppercase; font-weight:800; letter-spacing:0.4px;
    display:inline-flex; align-items:center; gap:5px;
  }
  .kpi-card .k-badge{
    font-size:9px; font-weight:800; padding:2px 7px; border-radius:10px; text-transform:uppercase; letter-spacing:0.4px;
  }
  .badge-green{background:rgba(16, 185, 129, 0.15); color:#10b981; border:1px solid rgba(16, 185, 129, 0.35);}
  .badge-blue{background:rgba(56, 189, 248, 0.15); color:#38bdf8; border:1px solid rgba(56, 189, 248, 0.35);}
  .badge-cyan{background:rgba(6, 182, 212, 0.15); color:#06b6d4; border:1px solid rgba(6, 182, 212, 0.35);}
  .badge-gold{background:rgba(245, 158, 11, 0.15); color:#f59e0b; border:1px solid rgba(245, 158, 11, 0.35);}
  .badge-red{background:rgba(239, 68, 68, 0.15); color:#ef4444; border:1px solid rgba(239, 68, 68, 0.35);}
  .kpi-card.v2-won{border-color:rgba(16, 185, 129, 0.55); background:linear-gradient(180deg, rgba(16, 185, 129, 0.14) 0%, rgba(13, 19, 33, 0.95) 100%);}
  .kpi-card.v2-lost{border-color:rgba(239, 68, 68, 0.55); background:linear-gradient(180deg, rgba(239, 68, 68, 0.14) 0%, rgba(13, 19, 33, 0.95) 100%);}

  .kpi-card{display:flex; flex-direction:column;}
  #kpiTopLeaguesList{flex:1; justify-content:space-around; gap:0 !important;}
  #kpiTopLeaguesList > div{font-size:12.5px !important;}
  #kpiTopLeaguesList img{width:18px !important; height:18px !important;}
  #kpiLast5DaysContainer{flex:1; margin-top:6px !important;}
  #kpiLast5DaysContainer table{height:100%; font-size:12.5px !important;}
  .kpi-rank.pick-w,.kpi-rank.pick-l{width:18px;height:18px;line-height:18px;text-align:center;font-size:11px;}
  .kpi-rank.pick-w{background:#16a34a;color:#fff;border-radius:50%;font-weight:800;}
  .kpi-rank.pick-l{background:#b91c1c;color:#fff;border-radius:50%;font-weight:800;}
  #kpiTopPicksList, #kpiMarketFlowList{flex:1; justify-content:space-around;}
  .kpi-tabs{display:flex; gap:4px; margin:2px 0 4px; flex-wrap:wrap;}
  .kpi-tab{flex:1; min-width:0; background:transparent; border:1px solid var(--border); color:var(--ink-dim); font-size:10.5px; font-weight:700; font-family:inherit; padding:3px 4px; border-radius:6px; cursor:pointer; white-space:nowrap; transition:all .15s;}
  .kpi-tab:hover{color:var(--ink); border-color:rgba(56,189,248,0.5);}
  .kpi-tab.active{color:var(--brand); background:var(--brand-tint); border-color:rgba(16,185,129,0.45);}
  .kpi-list{display:flex; flex-direction:column; gap:6px; margin-top:6px; text-align:left;}
  .kpi-row{display:flex; align-items:center; gap:8px; font-size:11px; min-height:30px;}
  .kpi-rank{color:var(--ink-faint); font-weight:800; width:12px; text-align:right; flex-shrink:0;}
  .kpi-crests{display:inline-flex; flex-shrink:0;}
  .kpi-crests .lc-crest{width:24px; height:24px; font-size:9px;}
  .leg-crests{position:relative; flex:none; width:36px; height:32px;}
  .leg-crests .lc-crest{position:absolute; width:22px; height:22px; font-size:8px; background:var(--surface-3); box-shadow:0 0 0 1.5px var(--surface);}
  .leg-crests .lc-crest img{width:18px; height:18px;}
  .leg-crests .lc-crest:first-child{left:0; top:0;} .leg-crests .lc-crest:last-child{right:0; bottom:0;}
  .kpi-crests .lc-crest img{width:19px; height:19px;}
  .kpi-crests .lc-crest + .lc-crest{margin-left:-7px; box-shadow:0 0 0 2px #0d1321;}
  .kpi-match{flex:1; min-width:0; line-height:1.25;}
  .kpi-match b{display:block; font-weight:700; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .kpi-match span{display:block; font-size:9.5px; color:var(--ink-faint); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .kpi-pick{font-size:10.5px; font-weight:800; color:var(--brand); background:var(--brand-tint); border:1px solid rgba(16,185,129,0.3); border-radius:5px; padding:1px 6px; white-space:nowrap;}
  .kpi-odd{font-family:'Barlow Condensed',sans-serif; font-size:15px; font-weight:800; color:var(--accent); flex-shrink:0; min-width:34px; text-align:right;}
  .kpi-val2{font-weight:800; flex-shrink:0; min-width:34px; text-align:right;}
  .kpi-empty{text-align:center; color:var(--ink-faint); font-size:11px; padding:14px 0;}
  .kpi-skel{height:30px; border-radius:6px; background:linear-gradient(90deg,rgba(148,163,184,0.06),rgba(148,163,184,0.14),rgba(148,163,184,0.06)); background-size:200% 100%; animation:kpiShimmer 1.4s linear infinite;}
  @keyframes kpiShimmer{to{background-position:-200% 0;}}
  .kpi-note{font-size:9.5px; color:var(--ink-faint); margin-top:8px; text-align:center;}
  .kpi-card .k-val{
    font-family:'Barlow Condensed',sans-serif; font-size:29px; font-weight:800; color:#38bdf8; line-height:1.1; margin:3px 0;
    text-shadow:0 0 16px rgba(56, 189, 248, 0.25);
  }
  .kpi-card .k-sub{
    font-size:12px; color:#cbd5e1; font-weight:600; margin-top:5px; display:flex; align-items:center; justify-content:center; gap:4px;
  }
  .kpi-card .k-foot{
    position:absolute; left:0; right:0; bottom:4px; font-size:10px; color:#64748b; font-weight:600; opacity:0; transition:opacity 0.2s ease;
  }
  .kpi-card:hover .k-foot{
    opacity:1; color:#38bdf8;
  }

  /* Verification Modal Styles */
  #verificationModal{position:fixed; inset:0; background:rgba(0,0,0,0.8); backdrop-filter:blur(8px); z-index:1100; display:none; align-items:center; justify-content:center; padding:16px;}
  .vm-card{background:#0d1322; border:1px solid #1e3a8a; border-radius:18px; max-width:880px; width:100%; max-height:88vh; overflow-y:auto; padding:24px; box-shadow:0 24px 70px rgba(0,0,0,0.9); color:#e2e8f0;}
  .vm-header{display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #1e293b; padding-bottom:14px; margin-bottom:16px;}
  .vm-tabs{display:flex; gap:8px; margin-bottom:16px; border-bottom:1px solid #1e293b; padding-bottom:10px;}
  #modalTabs{overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:thin;}
  #modalTabs .vm-tab-btn{flex:none; white-space:nowrap;}
  .vm-tab-btn{background:rgba(255,255,255,0.04); border:1px solid #242c44; color:#94a3b8; font-size:12px; font-weight:700; padding:8px 14px; border-radius:8px; cursor:pointer; transition:all 0.15s ease;}
  .vm-tab-btn.active{background:rgba(56, 189, 248, 0.15); border-color:#38bdf8; color:#38bdf8;}
  .vm-table{width:100%; border-collapse:collapse; font-size:12.5px; text-align:left;}
  .vm-table th{background:#111a2e; color:#94a3b8; font-weight:700; padding:10px 10px; border-bottom:1px solid #1e293b; font-size:11px; text-transform:uppercase;}
  .vm-table td{padding:10px 10px; border-bottom:1px solid #162036;}
  .vm-table tr:hover td{background:rgba(255,255,255,0.025);}


  /* DNA Badges */
  .dna-pill{display:inline-flex; align-items:center; gap:3px; font-size:10.5px; font-weight:700; padding:2px 7px; border-radius:12px; background:var(--surface-3); border:1px solid var(--border); color:var(--ink); margin-right:4px;}

  /* Similar Odds Modal & Table */
  #similarOddsModal{position:fixed; inset:0; background:rgba(0,0,0,0.75); backdrop-filter:blur(6px); z-index:1000; display:none; align-items:center; justify-content:center; padding:16px;}
  .so-card{background:#11121d; border:1px solid #2d2f45; border-radius:16px; max-width:1100px; width:100%; max-height:90vh; overflow-y:auto; padding:24px; box-shadow:0 24px 60px rgba(0,0,0,0.8); color:#e2e8f0;}
  .so-header{display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #24273d; padding-bottom:14px; margin-bottom:16px;}
  .so-table{width:100%; border-collapse:collapse; font-size:12.5px; text-align:left;}
  .so-table th{background:#181a29; color:#94a3b8; font-weight:700; padding:10px 8px; border-bottom:1px solid #2d2f45; font-size:11px; text-transform:uppercase;}
  .so-table td{padding:10px 8px; border-bottom:1px solid #1e2033;}
  .so-table tr:hover td{background:rgba(255,255,255,0.03);}
  .htft-badge{display:inline-block; font-family:'Barlow Condensed',sans-serif; font-weight:800; font-size:13px; padding:2px 8px; border-radius:4px; text-align:center;}
  .htft-badge.w11{background:#10b981; color:#000;}
  .htft-badge.wx1{background:#0ea5e9; color:#000;}
  .htft-badge.wxx{background:#f59e0b; color:#000;}
  .htft-badge.w22{background:#ec4899; color:#fff;}
  .htft-badge.other{background:#64748b; color:#fff;}
  /* Benzer Maçlar 2.0 */
  .sm-sec{background:#181a29; border:1px solid #2d2f45; border-radius:12px; padding:14px 16px; margin-bottom:14px;}
  .sm-sec h4{margin:0 0 10px; font-size:12px; letter-spacing:.6px; color:#94a3b8; text-transform:uppercase;}
  .sm-teams{display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap; font-weight:800; font-size:17px; color:#fff;}
  .sm-team{display:flex; align-items:center; gap:8px; min-width:0;}
  .sm-logo{width:28px; height:28px; object-fit:contain; flex-shrink:0;}
  .sm-logo.sm{width:18px; height:18px;}
  .sm-meta{text-align:center; font-size:12px; color:#94a3b8; margin-top:6px;}
  .sm-odds{display:flex; justify-content:center; gap:8px; margin-top:10px;}
  .sm-odd{background:#11121d; border:1px solid #2d2f45; border-radius:8px; padding:6px 14px; text-align:center; font-size:11px; color:#94a3b8;}
  .sm-odd b{display:block; font-size:15px; color:#fff; font-family:'Barlow Condensed',sans-serif;}
  .sm-tiles{display:grid; grid-template-columns:repeat(5,1fr); gap:8px;}
  .sm-tile{background:#11121d; border:1px solid #24273d; border-radius:10px; padding:10px; text-align:center;}
  .sm-tile .v{font-size:20px; font-weight:800; color:#fff; font-family:'Barlow Condensed',sans-serif;}
  .sm-tile .l{font-size:10.5px; color:#94a3b8; text-transform:uppercase; letter-spacing:.4px;}
  .sm-note{font-size:11.5px; color:#fbbf24; margin-top:8px; line-height:1.5;}
  .sm-muted{font-size:11px; color:#94a3b8; line-height:1.5;}
  .sm-bar{position:relative; height:6px; background:#24273d; border-radius:3px; min-width:80px;}
  .sm-bar .band{position:absolute; top:0; bottom:0; background:rgba(56,189,248,.35); border-radius:3px;}
  .sm-bar .pt{position:absolute; top:-3px; width:3px; height:12px; background:#38bdf8; border-radius:2px;}
  .sm-bar .pr{position:absolute; top:-3px; width:2px; height:12px; background:#f59e0b;}
  .sm-suf{display:inline-block; font-size:10.5px; font-weight:700; padding:2px 7px; border-radius:10px;}
  .sm-suf.iyi{background:rgba(16,185,129,.18); color:#34d399;} .sm-suf.orta{background:rgba(56,189,248,.18); color:#7dd3fc;}
  .sm-suf.zayıf{background:rgba(245,158,11,.18); color:#fbbf24;} .sm-suf.yetersiz{background:rgba(239,68,68,.18); color:#f87171;}
  .sm-score{display:inline-block; min-width:34px; text-align:center; font-weight:800; padding:2px 6px; border-radius:6px; background:#0b3b52; color:#7dd3fc; font-family:'Barlow Condensed',sans-serif; font-size:14px;}
  .sm-why{font-size:10.5px; color:#94a3b8; line-height:1.4;}
  .sm-verdict{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
  .sm-pick{background:#11121d; border:1px solid #24273d; border-radius:10px; padding:12px;}
  .sm-pick.main{border-color:#15803d; background:rgba(21,128,61,.08);}
  .sm-pick .t{font-size:11px; color:#94a3b8; text-transform:uppercase; letter-spacing:.5px;}
  .sm-pick .m{font-size:20px; font-weight:800; color:#fff; margin:4px 0;}
  .sm-kv{display:grid; grid-template-columns:auto 1fr; gap:3px 10px; font-size:12px;}
  .sm-kv span:nth-child(odd){color:#94a3b8;}
  .sm-more{display:block; margin:10px auto 0; background:#24273d; color:#e2e8f0; border:1px solid #2d2f45; border-radius:8px; padding:8px 16px; cursor:pointer; font-weight:700;}
  .sm-mcards, .sm-ncards{display:none;}
  .sm-card{background:#11121d; border:1px solid #24273d; border-radius:10px; padding:10px 12px; margin-bottom:8px; font-size:12.5px;}
  .sm-card .row{display:flex; justify-content:space-between; align-items:center; gap:8px; margin-top:4px;}
  .sm-modelpick{font-size:10.5px; color:#94a3b8; margin:0 0 6px; text-transform:uppercase; letter-spacing:.5px;}
  /* Performans: sade özet */
  .pf-verdict{border-radius:10px; padding:12px 14px; border:1px solid #2d2f45; background:#11121d;}
  .pf-verdict.iyi{border-color:rgba(16,185,129,.45); background:rgba(16,185,129,.08);}
  .pf-verdict.zayıf{border-color:rgba(245,158,11,.45); background:rgba(245,158,11,.08);}
  .pf-verdict.yetersiz{border-color:rgba(239,68,68,.45); background:rgba(239,68,68,.08);}
  .pf-vt{font-size:18px; font-weight:800; color:#fff;}
  .pf-verdict.iyi .pf-vt{color:#34d399;} .pf-verdict.zayıf .pf-vt{color:#fbbf24;} .pf-verdict.yetersiz .pf-vt{color:#f87171;}
  .pf-vs{font-size:13px; color:#e2e8f0; line-height:1.5; margin-top:4px;}
  .pf-vm{font-size:11px; color:#94a3b8; margin-top:6px;}
  .pf-pick{margin-top:12px;}
  .pf-ph{display:flex; justify-content:space-between; align-items:baseline; font-size:13px; color:#e2e8f0; font-weight:700;}
  .pf-ph b{font-size:22px; color:#fff; font-family:'Barlow Condensed',sans-serif;}
  .pf-bar{position:relative; height:10px; background:#24273d; border-radius:5px; margin:6px 0;}
  .pf-bar .hit{position:absolute; left:0; top:0; bottom:0; background:rgba(56,189,248,.6); border-radius:5px;}
  .pf-bar .exp{position:absolute; top:-3px; width:3px; height:16px; background:#f59e0b; border-radius:2px;}
  .pf-pl{display:flex; justify-content:space-between; gap:8px; font-size:11.5px; color:#94a3b8; margin-top:2px;}
  .pf-dot{display:inline-block; width:3px; height:10px; background:#f59e0b; border-radius:2px; margin-right:6px; vertical-align:-1px;}
  .pf-note{font-size:12px; color:#e2e8f0; margin-top:8px;}
  .pf-counts{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:8px;}
  .pf-counts div{background:#11121d; border:1px solid #24273d; border-radius:10px; padding:8px; text-align:center;}
  .pf-counts b{display:block; font-size:18px; color:#fff; font-family:'Barlow Condensed',sans-serif;}
  .pf-counts span{font-size:10.5px; color:#94a3b8;}
  .pf-wl{display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-bottom:8px;}
  .pf-wt{font-size:11px; color:#94a3b8; min-width:68px;}
  .pf-chip{font-size:12px; font-weight:700; padding:3px 9px; border-radius:12px;}
  .pf-chip small{font-weight:600; opacity:.85;}
  .pf-chip.iyi{background:rgba(16,185,129,.18); color:#34d399;} .pf-chip.zayıf{background:rgba(148,163,184,.15); color:#cbd5e1;} .pf-chip.yetersiz{background:rgba(239,68,68,.14); color:#f87171;}
  .pf-row{display:grid; grid-template-columns:1fr auto auto; gap:10px; align-items:center; font-size:12.5px; color:#e2e8f0; padding:6px 0; border-top:1px solid #24273d;}
  .pf-row:first-of-type{border-top:0;}
  .pf-teams{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .pf-score{color:#10b981;} .pf-res{font-size:11.5px; color:#cbd5e1; white-space:nowrap;}
  .pf-more{margin-top:4px;}
  .pf-more > summary{cursor:pointer; list-style:none; text-align:center; font-size:12.5px; font-weight:700; color:#94a3b8; background:#181a29; border:1px solid #2d2f45; border-radius:12px; padding:11px; margin-bottom:14px;}
  .pf-more > summary::-webkit-details-marker{display:none;}
  .pf-more > summary::after{content:' ▾';} .pf-more[open] > summary::after{content:' ▴';}
  @media (max-width:720px){
    .so-card{padding:16px 14px;}
    .sm-tiles{grid-template-columns:repeat(2,1fr);} .sm-tile:last-child{grid-column:span 2;}
    .sm-verdict{grid-template-columns:1fr;}
    .sm-mtable, .sm-ntable{display:none;}
    .sm-mcards, .sm-ncards{display:block;}
    .sm-teams{font-size:15px;}
  }

  /* Vault & Live Panels */
  .vault-hero{background:linear-gradient(135deg, var(--surface-2), var(--surface)); border:1px solid var(--border); border-radius:16px; padding:24px; margin-bottom:16px;}
  .live-radar-box{background:var(--surface-2); border:1px solid var(--border); border-radius:12px; padding:20px; text-align:center;}

  /* Referee & Injury Stat Grid */
  .ref-stat-box{background:var(--surface-3); border:1px solid var(--border); border-radius:8px; padding:8px 10px; text-align:center;}
  .ref-stat-box span{display:block; font-size:10.5px; color:var(--ink-faint); margin-bottom:2px;}
  .ref-stat-box b{font-family:'Barlow Condensed',sans-serif; font-size:16px; color:var(--ink);}

  .injury-badge{display:inline-flex; align-items:center; gap:4px; font-size:11.5px; padding:4px 8px; border-radius:6px; background:var(--surface-3); border:1px solid var(--border); margin:2px 4px 2px 0;}
  .pos-tag{font-size:9.5px; font-weight:800; padding:1px 4px; border-radius:3px; background:rgba(255,255,255,0.1); color:var(--brand);}

  /* Heatmap Matrix */
  .heat-wrap{overflow-x:auto;}
  table.heat{border-collapse:collapse; margin:0 auto;}
  table.heat th{font-size:11px; color:var(--ink-faint); padding:4px 6px; font-family:'Barlow Condensed',sans-serif;}
  table.heat td{width:36px; height:30px; text-align:center; font-size:11px; font-weight:700; border-radius:4px; font-family:'Barlow Condensed',sans-serif; transition:all .15s;}

  /* Super Brain Steps */
  .sb-step{display:flex; gap:14px; position:relative; padding-bottom:16px;}
  .sb-step:last-child{padding-bottom:0;}
  .sb-step::before{content:""; position:absolute; left:15px; top:32px; bottom:0; width:2px; background:var(--border);}
  .sb-step:last-child::before{display:none;}
  .sb-num{width:32px; height:32px; border-radius:50%; background:var(--surface-2); border:2px solid var(--border); display:flex; align-items:center; justify-content:center; font-weight:700; font-family:'Barlow Condensed',sans-serif; color:var(--ink-faint); z-index:1; flex-shrink:0;}
  .sb-step.done .sb-num{background:var(--brand); border-color:var(--brand); color:#000;}
  .sb-body{flex:1; background:var(--surface-2); border:1px solid var(--border); border-radius:10px; padding:12px 14px;}
  .sb-body h5{margin:0 0 4px; color:var(--ink); font-size:14px; display:flex; justify-content:space-between; align-items:center;}
  .sb-body p{margin:0; font-size:13px; color:var(--ink-dim); line-height:1.5;}
  .sb-cat-badge{font-size:10px; font-weight:700; padding:2px 6px; border-radius:4px; background:var(--surface-3); color:var(--brand);}
  .sb-highlight-pill{display:inline-block; font-size:11px; font-weight:600; padding:3px 8px; border-radius:6px; background:var(--brand-tint); color:var(--brand); margin-top:6px;}

  /* Learning Center */
  .metric-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:12px; margin-bottom:16px;}
  #learningMetrics{grid-template-columns:repeat(3, 1fr);}
  .metric-card{background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:16px; text-align:center;}
  .metric-card .num{font-family:'Barlow Condensed',sans-serif; font-size:32px; font-weight:800; color:var(--brand);}
  .metric-card .lbl{font-size:12px; color:var(--ink-dim); margin-top:4px;}

  .ls-box{background:var(--surface-2); border:1px solid var(--border); border-radius:10px; padding:12px 14px; display:flex; flex-direction:column; gap:4px;}
  .ls-box b{font-family:'Barlow Condensed',sans-serif; font-size:24px; font-weight:800; color:var(--brand);}
  .ls-box span{font-size:12px; color:var(--ink-dim); line-height:1.45;}
  .ls-row{display:flex; align-items:center; gap:10px; padding:5px 0; font-size:12.5px;}
  .ls-row > div{flex:1;}
  .ls-row .dim, .dim{color:var(--ink-faint); font-size:12px;}
  /* V-Kasa: compact */
  #autoMetrics{grid-template-columns:repeat(3, 1fr); gap:8px; margin-bottom:10px;}
  #autoMetrics .metric-card{padding:8px 10px;}
  #autoMetrics .metric-card .num{font-size:22px; line-height:1.15;}
  #autoMetrics .metric-card .lbl{font-size:11px; margin-top:2px;}
  #panel-otopilot .card{padding:12px 14px; margin-bottom:10px !important;}
  #panel-otopilot .vault-hero{padding:18px 20px;}
  .auto-hero-top{display:flex; align-items:center; gap:10px; margin-bottom:16px;}
  .auto-hero-badge{width:40px; height:40px; border-radius:12px; background:var(--surface-3); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; font-size:20px; flex-shrink:0;}
  .auto-hero-title{font-weight:800; font-size:15px; color:var(--accent);}
  .auto-hero-sub{font-size:11.5px; color:var(--ink-faint); margin-top:1px;}
  .auto-hero-row{display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:14px; margin-bottom:14px;}
  .auto-hero-num{font-family:'Barlow Condensed',sans-serif; font-size:40px; font-weight:800; line-height:1; margin:4px 0;}
  .auto-hero-pnl{font-size:12.5px; color:var(--ink-dim);}
  .vk-stats{display:flex; flex-wrap:wrap; gap:8px 22px; font-size:12.5px; color:var(--ink-dim); margin-top:10px;}
  .vk-stats b{color:var(--ink); font-size:14px;}
  .vk-mode{font-size:12.5px; color:var(--ink-dim); margin-top:10px; line-height:1.5;}
  .vk-how{margin-top:10px; font-size:12.5px; color:var(--ink-dim);}
  .vk-how ul{margin:6px 0 0 18px; padding:0; line-height:1.6;}
  .vk-chips{display:flex; flex-wrap:wrap; gap:6px; margin:8px 0;}
  .vk-chip{background:var(--surface-3); border:1px solid var(--border); border-radius:999px; padding:4px 10px; font-size:12px; color:var(--ink-dim);}
  .vk-chip b{color:var(--ink);}
  .vk-note{font-size:12.5px; line-height:1.5; padding:8px 10px; border-radius:10px; background:var(--surface-3); border:1px solid var(--border); margin:6px 0;}
  .vk-chip i{font-style:normal;} .vk-sh{display:none;}
  .vk-more{margin-top:4px;} .vk-more[open] > summary{display:none;}
  .vk-more > summary{cursor:pointer; color:var(--ink-faint); font-size:11.5px;}
  .auto-risk-chip{background:var(--surface-3); border:1px solid var(--border); border-radius:12px; padding:10px 16px; text-align:center; min-width:120px;}
  .auto-risk-chip .k-title{font-size:11px; color:var(--ink-faint); text-transform:uppercase; font-weight:700; letter-spacing:.3px;}
  .auto-risk-chip .k-val{font-family:'Barlow Condensed',sans-serif; font-size:17px; font-weight:800; margin-top:2px;}
  .auto-hero-note{font-size:12px; color:var(--ink-dim); line-height:1.6; border-top:1px solid var(--border); padding-top:12px;}
  .auto-decision-card{border-left:3px solid var(--accent);}
  @media (max-width:900px){ #autoMetrics{grid-template-columns:1fr 1fr;} .auto-hero-row{flex-direction:column; align-items:flex-start;} .auto-risk-chip{align-self:stretch;} }
  #panel-otopilot h4{font-size:14px;}
  .ab-grid, #autoSettled{display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)); gap:6px;}
  .ab{border:1px solid var(--border); border-radius:8px; padding:5px 8px; background:var(--surface-2); min-width:0;}
  .ab-head{display:flex; justify-content:space-between; align-items:center; gap:6px; font-size:11.5px; margin-bottom:1px;}
  .ab-leg{display:flex; align-items:center; gap:5px; padding:1px 0; font-size:11.5px; min-width:0; line-height:1.3;}
  .ab-leg .tm{display:flex; align-items:center; gap:3px; min-width:0; flex:1 1 auto;}
  .ab-leg .tm span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .ab-leg img{width:14px; height:14px; object-fit:contain; flex:none;}
  .ab-leg .ab-pk{flex:none; font-size:10.5px; color:var(--ink-dim); text-align:right; max-width:52%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .ab-leg .ab-pk b{color:var(--ink);}
  .ab details summary{cursor:pointer; font-size:10.5px; color:var(--ink-faint); margin-top:1px;}
  .ab details div{font-size:11px; line-height:1.4; color:var(--ink-dim); padding-top:2px;}
  .ab-log{max-height:330px; overflow:auto;}
  .ab-log .ls-row{padding:3px 0; gap:6px; border-bottom:1px solid var(--border);}
  .ab-log .ls-row:last-child{border-bottom:none;}
  @media (max-width:900px){ #autoMetrics{grid-template-columns:repeat(2, 1fr);} .ab-grid, #autoSettled{grid-template-columns:1fr;} }
  /* V-Kasa open coupon: one wide, readable card per coupon */
  #autoOpen{display:flex; flex-direction:column; gap:12px;}
  .vkc{border:1px solid var(--border); border-radius:14px; background:var(--surface-2); padding:14px 16px;}
  .vkc-head{display:flex; justify-content:space-between; align-items:flex-start; gap:12px; flex-wrap:wrap; margin-bottom:10px;}
  .vkc-title{font-size:16px; font-weight:800;}
  .vkc-sub{font-size:12.5px; color:var(--ink-dim); margin-top:3px;}
  .vkc-pay{text-align:right;}
  .vkc-pay .big{font-size:20px; font-weight:800; font-family:'Barlow Condensed',sans-serif;}
  .vkc-pay .lbl{font-size:11.5px; color:var(--ink-faint);}
  .vkc-leg{display:grid; grid-template-columns:24px minmax(0,1fr) auto; align-items:center; gap:10px; padding:10px 0; border-top:1px solid var(--border);}
  .vkc-st{font-size:16px; text-align:center;}
  .vkc-teams{display:flex; flex-direction:column; gap:4px; min-width:0;}
  .vkc-team{display:flex; align-items:center; gap:8px; font-size:14px; font-weight:700; min-width:0;}
  .vkc-team img{width:20px; height:20px; object-fit:contain; flex:none;}
  .vkc-team span{overflow-wrap:anywhere;}
  .vkc-meta{font-size:12px; color:var(--ink-dim); margin-top:2px;}
  .vkc-pick{text-align:right;}
  .vkc-pick .mk{font-size:13px; font-weight:700; background:var(--surface-3); border:1px solid var(--border); border-radius:8px; padding:4px 8px; display:inline-block;}
  .vkc-pick .od{font-size:18px; font-weight:800; font-family:'Barlow Condensed',sans-serif; margin-top:4px;}
  .vkc details{margin-top:8px; font-size:12px; color:var(--ink-dim);}
  @media (max-width:600px){ .vkc-pick .od{font-size:16px;} .vkc-team{font-size:13px;} }
  .ls-league{display:flex; align-items:center; gap:10px; background:var(--surface-2); border:1px solid var(--border); border-radius:10px; padding:8px 12px;}
  .ls-league img, .ls-nologo{width:26px; height:26px; object-fit:contain; flex-shrink:0; display:inline-flex; align-items:center; justify-content:center;}
  .ls-miss{display:flex; align-items:center; gap:12px; padding:8px 4px; border-bottom:1px solid var(--border); flex-wrap:wrap;}
  .ls-miss .nm{font-size:13px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:170px;}
  /* Öğrenme Merkezi: model vs market gate as cards, so a phone sees every number without side-scrolling */
  .og-more{margin-top:6px;} .og-more summary{cursor:pointer; color:var(--accent); font-weight:700; font-size:12px;}
  .ms-summary{background:var(--surface-2); border:1px solid var(--border); border-radius:12px; padding:12px 14px; margin-bottom:12px; font-size:12.5px; line-height:1.6; color:var(--ink-dim);}
  .ms-summary p{margin:0 0 6px;} .ms-summary-h{font-size:11px; text-transform:uppercase; letter-spacing:.3px; color:var(--ink-faint); font-weight:700; margin-bottom:6px;}
  .ms-summary-h b{color:var(--ink); text-transform:none; letter-spacing:0;}
  .ms-cards{display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap:10px;}
  .ms-card{background:var(--surface-2); border:1px solid var(--border); border-radius:12px; padding:12px; display:flex; flex-direction:column; gap:10px; min-width:0;}
  .ms-card.active{border-color:var(--brand); box-shadow:0 0 0 1px var(--brand-tint) inset;}
  .ms-head{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
  .ms-ver{font-size:16px; font-weight:800;}
  .ms-chip{font-size:10.5px; font-weight:700; padding:2px 8px; border-radius:999px; background:var(--surface-3); color:var(--ink-faint);}
  .ms-chip.on{background:var(--brand-tint); color:var(--brand);}
  .ms-pill{margin-left:auto; padding:3px 10px; border-radius:999px; font-size:11.5px; font-weight:700; white-space:nowrap;}
  .ms-n{display:flex; align-items:center; gap:10px; font-size:12px; color:var(--ink-dim);}
  .ms-n > span:first-child{white-space:nowrap;} .ms-n b{color:var(--ink);}
  .ms-bar{flex:1; min-width:40px; height:5px; border-radius:3px; background:var(--surface-3); overflow:hidden;}
  .ms-bar span{display:block; height:100%;}
  .ms-grid{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:6px;}
  .ms-grid > div{display:flex; flex-direction:column; gap:1px; background:var(--surface); border-radius:8px; padding:7px 8px; min-width:0;}
  .ms-grid span{font-size:10px; text-transform:uppercase; color:var(--ink-faint); font-weight:700; letter-spacing:.3px;}
  .ms-grid b{font-size:15px; font-variant-numeric:tabular-nums;}
  .ms-grid small{font-size:10.5px; color:var(--ink-faint); line-height:1.3; font-variant-numeric:tabular-nums;}
  .ms-note{font-size:11px; color:var(--ink-faint);}
  @media (max-width:640px){
    #learningMetrics{grid-template-columns:repeat(3, minmax(0,1fr)) !important; gap:6px; margin-bottom:12px;}
    #learningMetrics .metric-card{padding:10px 6px;}
    #learningMetrics .metric-card .num{font-size:24px;}
    #learningMetrics .metric-card .lbl{font-size:10.5px; line-height:1.3;}
    #panel-performans .card{padding:12px !important;}
    #panel-performans .ls-box b{font-size:20px;}
    #panel-performans .ls-miss{gap:8px; flex-wrap:nowrap;}
    #panel-performans .ls-miss .nm{max-width:90px; font-size:12px;}
    #panel-performans .ls-miss > div:nth-child(3){display:none !important;}
    #panel-performans .ls-miss b{white-space:nowrap; padding:0 2px !important;}
    #panel-performans .ls-miss > div:first-child, #panel-performans .ls-miss > div:last-child{width:auto !important; flex:none;}
    .ms-grid b{font-size:14px;}
  }
  .lesson-card{background:var(--surface); border:1px solid var(--border); border-left:4px solid var(--accent); border-radius:10px; padding:14px; margin-bottom:10px;}
  .lesson-card .tag{font-size:10px; font-weight:800; padding:2px 8px; border-radius:6px; background:var(--accent-tint); color:var(--accent); display:inline-block; margin-bottom:6px;}
  .lesson-card .text{font-size:13.5px; color:var(--ink);}
  .lesson-card .meta{font-size:11px; color:var(--ink-faint); margin-top:6px;}

  /* Coupon Slip */
  .coupon-item{background:var(--surface-2); border:1px solid var(--border); border-radius:8px; padding:10px 14px; margin-bottom:8px; display:flex; justify-content:space-between; align-items:center;}
  .coupon-item .teams{font-size:14px; font-weight:700; color:var(--ink);}
  .coupon-item .pick{color:var(--brand); font-family:'Barlow Condensed',sans-serif; font-size:16px; font-weight:800;}
  .btn-remove{background:transparent; border:none; color:var(--loss); font-size:16px; cursor:pointer;}

  /* Selectable pick (main / alternative). Tapping it adds the selection to the coupon. */
  .pick-chip{position:relative; display:flex; flex-direction:column; gap:2px; text-align:center; padding:6px 8px; border-radius:9px; border:1.5px solid rgba(34,197,94,0.35); background:rgba(34,197,94,0.08); cursor:pointer; user-select:none; transition:background .12s, border-color .12s, transform .06s;}
  .pick-chip.alt{border-color:rgba(251,191,36,0.40); background:rgba(251,191,36,0.07);}
  .pick-chip:hover{border-color:var(--brand); background:rgba(34,197,94,0.16);}
  .pick-chip.alt:hover{border-color:#fbbf24; background:rgba(251,191,36,0.15);}
  .pick-chip:active{transform:scale(0.98);}
  .pick-chip.selected{border-color:var(--brand); background:rgba(34,197,94,0.28); box-shadow:0 0 0 1px var(--brand) inset;}
  .pick-chip.alt.selected{border-color:#fbbf24; background:rgba(251,191,36,0.26); box-shadow:0 0 0 1px #fbbf24 inset;}
  .pick-chip.won{background:rgba(34,197,94,0.22); border-color:rgba(34,197,94,0.6);}
  .pick-chip.disabled{cursor:default; opacity:.85;}
  .pick-chip.disabled:hover{background:inherit; border-color:inherit;}
  .pick-chip .pc-role{font-size:8.5px; font-weight:800; letter-spacing:.5px; color:var(--ink-faint);}
  .pick-chip .pc-main{font-size:12px; font-weight:800; color:#4ade80;}
  .pick-chip.alt .pc-main{color:#fbbf24;}
  .pick-chip .pc-tag{position:absolute; top:4px; right:6px; font-size:9px; font-weight:900; color:var(--brand); display:none;}
  .pick-chip.selected .pc-tag{display:block;}
  .pick-chip.alt.selected .pc-tag{color:#fbbf24;}
  .pick-strip{display:grid; grid-template-columns:repeat(auto-fit, minmax(190px, 1fr)); gap:10px;}
  .pick-hit{display:inline-block; min-width:22px; padding:1px 6px; border-radius:5px; font-size:11px; font-weight:800; text-align:center;}
  .pick-hit.yes{background:rgba(34,197,94,0.20); color:#4ade80;}
  .pick-hit.no{background:rgba(239,68,68,0.16); color:#f87171;}
  .pick-hit.na{color:var(--ink-faint);}

  /* Floating coupon bar: shows once a selection exists, wherever you are in the app. */
  /* A small round coupon button at the bottom right; tapping it opens the Kupon Oluşturucu panel (3.43.1). */
  #couponDock{position:fixed; right:16px; bottom:18px; z-index:900; display:none;}
  #couponDock .cd-fab{position:relative; width:58px; height:58px; border-radius:50%; border:1.5px solid var(--brand); background:var(--surface-3); color:var(--ink); box-shadow:0 8px 24px rgba(0,0,0,.5); cursor:pointer; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; padding:0; -webkit-tap-highlight-color:transparent;}
  #couponDock .cd-fab .ic{font-size:21px; line-height:1;}
  #couponDock .cd-fab .od{font:800 11.5px/1 'Barlow Condensed',sans-serif; color:#fbbf24;}
  #couponDock .cd-fab .n{position:absolute; top:-5px; right:-5px; min-width:21px; height:21px; padding:0 5px; box-sizing:border-box; border-radius:11px; background:var(--brand); color:#000; font:800 12px/21px system-ui,sans-serif; text-align:center;}
  #couponDock.bump .cd-fab{animation:cdBump .35s ease-out;}
  @keyframes cdBump{0%{transform:scale(1);}40%{transform:scale(1.14);}100%{transform:scale(1);}}
  .stake-input{width:100%; max-width:110px; background:transparent; border:none; border-bottom:1.5px dashed rgba(56,189,248,0.55); border-radius:0; padding:0 2px; font:inherit; color:inherit; text-align:right;}
  .stake-input:focus{outline:none; border-bottom-style:solid; border-bottom-color:#38bdf8;}
  .stake-input.invalid{border-bottom-color:var(--loss); color:var(--loss);}
  .stake-input::-webkit-outer-spin-button,.stake-input::-webkit-inner-spin-button{opacity:.6;}
  .tier-hint{font-size:11px; color:var(--ink-faint); line-height:1.5; margin-top:6px;}

  /* Form inputs & buttons */
  select, input{background:var(--surface-2); color:var(--ink); border:1px solid var(--border); border-radius:8px; padding:10px 12px; font-size:14px; width:100%;}
  select:focus, input:focus{outline:none; border-color:var(--brand);}
  .btn{background:linear-gradient(135deg, var(--brand), var(--brand-dark)); color:#000; font-family:'Barlow Condensed',sans-serif; font-weight:800; font-size:16px; border:none; border-radius:8px; padding:10px 18px; cursor:pointer; transition:all .2s;}
  .btn:hover{filter:brightness(1.1); transform:translateY(-1px);}
  .btn-secondary{background:var(--surface-2); color:var(--ink); border:1px solid var(--border);}
  .btn-secondary:hover{background:var(--surface-3); color:var(--ink);}

  /* Settings Box & Input Groups */
  .api-box{background:var(--surface-2); border:1px solid var(--border); border-radius:10px; padding:16px; margin-bottom:14px;}
  .api-header{display:flex; justify-content:space-between; align-items:center; margin-bottom:6px; flex-wrap:wrap; gap:6px;}
  .api-input-group{display:flex; gap:8px; align-items:center;}
  .toggle-view-btn{background:var(--surface-3); border:1px solid var(--border); color:var(--ink-dim); padding:10px 12px; border-radius:8px; cursor:pointer; font-size:14px; flex-shrink:0;}
  .toggle-view-btn:hover{color:var(--ink);}

  /* Modal */
  .dos-actions{display:flex; gap:8px; padding:8px 16px 0;}
  .dos-actions button{flex:1 1 0; font-family:inherit; padding:9px 10px; border-radius:10px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink); font-weight:700; font-size:13px; cursor:pointer;}
  .dos-actions button:active{background:rgba(16,185,129,.18);}
  .modal-backdrop{display:none; position:fixed; inset:0; background:rgba(0,0,0,0.8); z-index:100; align-items:center; justify-content:center; padding:16px; overflow-y:auto;}
  /* The reset window opens over the login and register screens (z-index 999), so it must sit above them. */
  #forgotPasswordModal{z-index:1100;}
  .modal{background:var(--surface); border:1px solid var(--border); border-radius:16px; max-width:800px; width:100%; max-height:90vh; overflow-y:auto; box-shadow:0 20px 60px rgba(0,0,0,0.6);}
  .modal-head{background:var(--topbar-bg); padding:18px 24px; border-bottom:1px solid var(--border); display:flex; justify-content:space-between; align-items:center;}
  .modal-body{padding:20px 24px;}

  /* Password Strength Meter */
  .strength-meter {
    height: 4px;
    background: rgba(255,255,255,0.1);
    border-radius: 2px;
    margin-top: 6px;
    overflow: hidden;
    display: flex;
  }
  .strength-bar {
    height: 100%;
    width: 0%;
    transition: all .3s ease;
  }
  .strength-text {
    font-size: 11px;
    margin-top: 4px;
    text-align: right;
    font-weight: 600;
  }
  
  /* Admin Panel Specific Styling: a vertical left sidebar of sub-sections next to their content */
  .admin-layout {
    display: flex;
    gap: 20px;
    align-items: flex-start;
  }
  .admin-subnav {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 230px;
    flex-shrink: 0;
    border-right: 1px solid var(--border);
    padding-right: 16px;
  }
  .admin-subcontent-wrap {
    flex: 1;
    min-width: 0;
  }
  .admin-subtab {
    background: var(--surface-2);
    color: var(--ink-dim);
    border: 1px solid var(--border);
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 13.5px;
    font-weight: 700;
    cursor: pointer;
    transition: all .2s;
    white-space: nowrap;
    text-align: left;
    width: 100%;
  }
  .admin-subtab:hover {
    color: #fff;
    background: var(--surface-3);
  }
  .admin-subtab.active {
    background: var(--brand-tint);
    color: var(--brand);
    border-color: var(--brand);
  }
  @media (max-width: 880px) {
    /* stretch: with flex-start the column children took their content's width and wide tables pushed the page sideways */
    .admin-layout { flex-direction: column; align-items: stretch; }
    .admin-subnav {
      flex-direction: row;
      width: 100%;
      overflow-x: auto;
      border-right: none;
      border-bottom: 1px solid var(--border);
      padding-right: 0;
      padding-bottom: 10px;
    }
    .admin-subtab { width: auto; text-align: center; }
  }

  .spinner{display:inline-block; width:18px; height:18px; background:url('/loader.svg?v=3') center/contain no-repeat; vertical-align:-4px; margin-right:6px; filter:drop-shadow(0 0 4px rgba(56,182,255,.35));}
  @keyframes spin{to{transform:rotate(360deg);}}

  /* Big VmatchIQ loader: the logo fills up bar by bar (loader.svg), with a soft glow, the current step,
     and a progress bar that is real when the server reports "n/m", sliding otherwise. */
  .vm-loader{display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px; padding:34px 16px 30px;}
  .vm-loader-mark{position:relative; width:96px; height:96px; display:grid; place-items:center;}
  .vm-loader-mark::before{content:''; position:absolute; inset:-14px; border-radius:50%; background:radial-gradient(circle, rgba(56,182,255,.28) 0%, rgba(47,199,185,.12) 45%, transparent 70%); animation:vmGlow 3.2s ease-in-out infinite;}
  .vm-loader-mark::after{content:''; position:absolute; left:14%; right:14%; bottom:-6px; height:8px; border-radius:50%; background:radial-gradient(ellipse, rgba(56,182,255,.35), transparent 70%); filter:blur(2px); animation:vmGlow 3.2s ease-in-out infinite;}
  .vm-loader-mark img{position:relative; width:100%; height:100%; display:block;}
  @keyframes vmGlow{0%,100%{opacity:.45; transform:scale(.92);} 45%{opacity:1; transform:scale(1.04);}}
  .vm-loader-title{font-weight:800; font-size:15px; color:var(--ink); letter-spacing:.2px; margin-top:6px;}
  .vm-loader-title .ld-dots{margin-left:2px;}
  .vm-loader-step{font-size:12.5px; color:var(--brand); font-weight:700; min-height:16px;}
  .vm-loader-bar{width:min(360px, 80vw); height:6px; border-radius:999px; background:var(--surface-3); overflow:hidden; position:relative; margin-top:4px;}
  .vm-loader-bar i{position:absolute; top:0; bottom:0; left:0; border-radius:999px; background:linear-gradient(90deg,#2fc7b9,#8fdcff,#38b6ff); transition:width .6s ease;}
  .vm-loader-bar.indet i{width:35%; animation:ldSlide 1.4s ease-in-out infinite;}
  .vm-loader-bar:not(.indet) i::after{content:''; position:absolute; inset:0; background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent); background-size:200% 100%; animation:skShine 1.6s linear infinite;}
  .vm-loader-pct{font-size:11.5px; color:var(--ink-dim); font-variant-numeric:tabular-nums;}
  .vm-loader-note{font-size:11.5px; color:var(--ink-faint); max-width:460px; line-height:1.5;}
  .ld-ball img{width:30px; height:30px; display:block;}
  @media (prefers-reduced-motion:reduce){ .vm-loader .ld-dots b{animation:ldDot 1.2s infinite;} }


  /* Phone navigation: a floating glass tab bar of five equal buttons replaces the top tabs; "Daha" opens the Menu sheet */
  .m-nav, .m-sheet, .m-sheet-bg{display:none;}
  @keyframes mUp{from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:none;}}
  @keyframes mPulse{0%,100%{opacity:1;} 50%{opacity:.35;}} /* opacity only: runs on the compositor; a box-shadow pulse repainted the bottom bar every frame */
  @media (max-width:720px){
    .tabs{display:none;}
    .app-inner{padding:0 12px; padding-bottom:calc(104px + env(safe-area-inset-bottom));}
    .header-actions{display:none;} /* account, contact and sign-out live in the Menu sheet on phones */
    .brand-row{justify-content:center;}
    .topbar .app-inner{padding-bottom:0;} /* the bottom clearance belongs to the page, not to the header inside it */
    .hm-item{text-align:left;}
    .kpi-grid{grid-template-columns:1fr; gap:12px;}
    .kpi-card .k-top-row{flex-wrap:wrap; gap:6px;}
    .home-hero{padding:14px;}
    .m-nav{display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); position:fixed; left:10px; right:10px; bottom:calc(10px + env(safe-area-inset-bottom)); z-index:980; height:64px; padding:0 4px; border-radius:22px;
      background:linear-gradient(180deg, rgba(22,33,62,.92), rgba(9,15,34,.96)); -webkit-backdrop-filter:blur(18px) saturate(140%); backdrop-filter:blur(18px) saturate(140%);
      border:1px solid rgba(255,255,255,.09); box-shadow:0 12px 32px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.05);}
    .m-nav::before{content:""; position:absolute; top:-1px; left:16%; right:16%; height:1px; background:linear-gradient(90deg, transparent, rgba(16,185,129,.75), transparent);}
    .m-nav button{min-width:0; height:64px; background:none; border:none; color:#8ea0c4; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; cursor:pointer; position:relative; padding:0;
      font:700 10.5px 'Barlow Condensed',system-ui,sans-serif; letter-spacing:.35px; -webkit-tap-highlight-color:transparent; touch-action:manipulation;}
    .m-nav button > span{white-space:nowrap;}
    .m-nav svg{width:23px; height:23px; stroke:currentColor; fill:none; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; transition:transform .18s, filter .18s;}
    .m-nav button.active{color:var(--brand);}
    .m-nav button.active svg{transform:translateY(-1px); filter:drop-shadow(0 0 6px rgba(16,185,129,.6));}
    .m-nav button.active::after{content:""; position:absolute; bottom:5px; width:16px; height:3px; border-radius:2px; background:var(--brand); box-shadow:0 0 8px var(--brand);}
    .m-nav button:active svg{transform:scale(.9);}
    .m-nav .m-badge{position:absolute; top:8px; left:calc(50% + 6px); min-width:16px; height:16px; padding:0 4px; border-radius:8px; background:var(--brand); color:#04150f; font:800 10px/16px 'Barlow Condensed',sans-serif; text-align:center; box-shadow:0 0 0 2px rgba(9,15,34,.97);}
    .m-nav .live-dot{position:absolute; top:11px; left:calc(50% + 8px); width:7px; height:7px; border-radius:50%; background:#ef4444; animation:mPulse 1.8s infinite;}
    .m-sheet-bg.open{display:block; position:fixed; inset:0; z-index:960; background:rgba(3,7,18,.62); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);}
    .m-sheet.open{display:block; position:fixed; left:10px; right:10px; bottom:calc(92px + env(safe-area-inset-bottom)); z-index:970; padding:16px 14px 14px; border-radius:22px; overflow-y:auto;
      max-height:calc(100vh - 150px - env(safe-area-inset-bottom)); max-height:calc(100dvh - 150px - env(safe-area-inset-bottom)); background:linear-gradient(180deg, rgba(22,33,62,.985), rgba(10,17,38,.99)); border:1px solid rgba(255,255,255,.09); box-shadow:0 24px 60px rgba(0,0,0,.65); animation:mUp .22s ease-out;}
    .m-sheet .m-head{display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0 2px 12px;}
    .m-sheet .m-head b{font:800 17px 'Barlow Condensed',sans-serif; color:var(--ink);}
    .m-sheet .m-head small{font-size:11px; color:var(--ink-dim); padding:3px 9px; border-radius:10px; background:rgba(16,185,129,.12); border:1px solid rgba(16,185,129,.3);}
    .m-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
    .m-tile{display:flex; align-items:center; gap:10px; min-height:54px; box-sizing:border-box; width:100%; padding:9px 12px; border-radius:14px; text-align:left; text-decoration:none; cursor:pointer;
      background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.08); color:var(--ink); font:700 14px/1.15 'Barlow Condensed',system-ui,sans-serif; -webkit-tap-highlight-color:transparent;}
    .m-tile:active{background:rgba(16,185,129,.12); border-color:rgba(16,185,129,.4);}
    .m-tile .ti{flex:none; width:34px; height:34px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:18px; background:rgba(16,185,129,.14);}
    .m-tile.wide{grid-column:1 / -1;}
    .m-tile.danger{color:#fca5a5; border-color:rgba(239,68,68,.3);} .m-tile.danger .ti{background:rgba(239,68,68,.14);}
    #couponDock{right:12px; bottom:calc(96px + env(safe-area-inset-bottom));}
  }
  @media (max-width:340px){ .m-nav button{font-size:9.5px;} .m-nav{left:6px; right:6px;} }
  @media (prefers-reduced-motion:reduce){ .m-nav .live-dot,.m-sheet.open{animation:none;} }

  @media (max-width:880px){
    .body-layout{flex-direction:column;}
    .sidebar{width:100%; position:static; display:flex; overflow-x:auto; gap:6px;}
    .side-item{white-space:nowrap;}
    .side-sep{display:none;}
    .matches-table-header{display:none;}
    .match-grid-row{grid-template-columns:1fr; gap:10px;}
    .grid2, .metric-grid, .studio-grid{grid-template-columns:1fr;}
    .api-input-group{flex-direction:column; align-items:stretch;}
  }

  /* Match row on narrow screens: the same blocks as the wide row, stacked into a compact card */
  @media (max-width:900px){
    .match-card.match-grid-row{grid-template-columns:repeat(6, minmax(0,1fr)) !important; gap:8px !important; padding:10px !important; align-items:stretch !important;}
    .match-card .mc-time{grid-column:span 1; grid-row:1;}
    .match-card .mc-info{grid-column:span 4; grid-row:1;}
    .match-card .mc-score{grid-column:span 1; grid-row:1;}
    .match-card .mc-xg{grid-column:span 2; grid-row:2;}
    .match-card .mc-odds{grid-column:span 4; grid-row:2;}
    .match-card .mc-goals{grid-column:span 6; grid-row:3;}
    .match-card .mc-shots{grid-column:span 2; grid-row:4;}
    .match-card .mc-sot{grid-column:span 2; grid-row:4;}
    .match-card .mc-corners{grid-column:span 2; grid-row:4;}
    .match-card .mc-pick{grid-column:span 6; grid-row:5;}
    .match-card .mc-act{grid-column:span 6; grid-row:6; flex-direction:row !important;}
    .match-card .mc-act > *{flex:1;}
  }

  /* Match list on phones: compact filter bar, scrolling day strip, and a card built for a narrow screen.
     Kept last so it wins over the earlier narrow-screen rules. */
  .flt-toggle{display:none;}
  .flt-more{display:contents;}
  .mc-swipe{display:contents;}
  @media (max-width:720px){
    .flt-bar{padding:10px !important; gap:8px !important; margin-bottom:10px !important; align-items:stretch !important; border-radius:14px;}
    .flt-search{flex:1 1 0 !important; min-width:0 !important;}
    .flt-search input{padding:10px 12px; border-radius:12px; font-size:14px;}
    .flt-toggle{display:inline-flex; align-items:center; gap:6px; flex:none; padding:0 14px; border-radius:12px; border:1px solid var(--border); background:var(--surface); color:var(--ink); font:700 13px 'Barlow Condensed',sans-serif; cursor:pointer;}
    .flt-toggle b{min-width:18px; height:18px; padding:0 5px; border-radius:9px; align-items:center; justify-content:center; background:var(--brand); color:#04150f; font-size:11px;}
    .flt-bar.open .flt-toggle{border-color:var(--brand); color:var(--brand);}
    .flt-more{display:none;}
    .flt-bar.open .flt-more{display:grid; grid-template-columns:1fr 1fr; gap:8px; flex:1 1 100%; width:100%;}
    .flt-f select{min-width:0; width:100%; padding:9px 10px; border-radius:10px;}
    .flt-c{padding:9px 10px !important; border:1px solid var(--border); border-radius:10px; background:var(--surface); font-size:12px; line-height:1.25; align-items:center;}
    .flt-c input{flex:none; width:16px; height:16px; margin:0; padding:0;}
    .flt-reset{grid-column:1 / -1; margin:0; padding:9px; border-radius:10px;}
    .flt-count{flex:1 1 100%; margin:0 !important; padding:0 2px !important; font-size:12px; text-align:left;}
    .floating-sidebar-btn{padding:7px 12px !important; font-size:12px !important; margin-bottom:8px;}

    .date-strip{gap:6px; padding:6px; border-radius:14px; margin-bottom:12px; flex-wrap:nowrap;}
    .ds-arrow{display:none;}
    .ds-days{justify-content:flex-start; overflow-x:auto; gap:6px; scroll-snap-type:x proximity; scrollbar-width:none;}
    .ds-days::-webkit-scrollbar{display:none;}
    .ds-day{flex:none; min-width:54px; padding:6px 8px; scroll-snap-align:center; border-radius:12px;}
    .ds-cal, #refreshFixturesBtn{flex:none;}
    #refreshFixturesBtn{font-size:0 !important; padding:0 !important; width:36px; height:36px; border-radius:10px !important; margin-left:0 !important; display:flex; align-items:center; justify-content:center;}

    #fixturesList{display:flex; flex-direction:column; gap:12px;}
    .matches-table-header{display:none !important;}
    .match-card.match-grid-row{display:grid !important; grid-template-columns:repeat(12, minmax(0,1fr)) !important; gap:8px !important; padding:12px !important; border-radius:16px !important; align-items:stretch !important; margin:0 !important;
      background-image:linear-gradient(180deg, rgba(255,255,255,.035), transparent 45%);}
    .match-card > *{grid-row:auto !important; min-width:0;}
    .match-card > .mc-time{grid-column:1 / -1 !important; order:1; flex-direction:row !important; align-items:center !important; justify-content:flex-start !important; gap:8px !important; text-align:left !important;}
    .mc-time > :nth-child(1){font-size:15px !important;}
    .mc-time > :nth-child(2){font-size:11px !important;}
    .match-card > .mc-info{grid-column:1 / 10 !important; order:2; gap:7px !important;}
    .match-card > .mc-score{grid-column:10 / -1 !important; order:2; justify-content:center !important; align-self:end; gap:3px !important;}
    .mc-score > div:nth-child(1), .mc-score > div:nth-child(3){font-size:20px !important;}
    .mc-team{flex-direction:row !important; align-items:center !important; justify-content:space-between !important; gap:8px !important; flex:1; min-width:0;}
    .mc-team > div:first-child{min-width:0; flex:1;}
    .mc-team .form-pills{flex:none; gap:2px !important;} .mc-team .fpill{width:15px; height:15px; font-size:9.5px; border-radius:3px;}
    .match-card .mc-odds{grid-column:1 / 8 !important; order:3;}
    .match-card .mc-goals{grid-column:8 / -1 !important; order:3;}
    .mc-odds > div:last-child, .mc-goals > div:last-child{display:none !important;}
    .mc-odds [style*="padding:7px 4px"], .mc-goals [style*="padding:7px 4px"]{padding:6px 2px !important;}
    .match-card .mc-xg{grid-column:1 / -1 !important; order:4; flex-direction:row !important; flex-wrap:wrap; justify-content:space-between !important; align-items:baseline !important; gap:2px 10px !important; padding:6px 10px; border-radius:10px; background:rgba(255,255,255,.035); text-align:left !important;}
    .mc-xg > div{font-size:12px !important; margin:0 !important;} .mc-xg > div:nth-child(2){font-size:13px !important;}
    .match-card .mc-shots{grid-column:1 / 5 !important; order:5;}
    .match-card .mc-sot{grid-column:5 / 9 !important; order:5;}
    .match-card .mc-corners{grid-column:9 / -1 !important; order:5;}
    .match-card .mc-pick{grid-column:1 / -1 !important; order:6;}
    .match-card > .mc-act{grid-column:1 / -1 !important; order:7; flex-direction:row !important; gap:8px !important;}
    .mc-act button{flex:1 1 0 !important; width:auto !important; padding:9px 0 !important; border-radius:11px !important; font-size:16px !important;}
    .lc-top{padding:6px 2px 5px !important; gap:3px !important;}
    .lc-t{font-size:10.5px !important;}
    .lc-v{font-size:14.5px !important;}
    .lc-a{padding:1px 6px !important; font-size:10.5px !important; gap:4px !important; white-space:nowrap;}
    .lc-b{padding:4px 2px !important;}
    .lc-b > div:first-child{font-size:10px !important;}
    .lc-b span{font-size:13.5px !important;}
    .lc-basis{display:none !important;}
    .lc-empty{padding:7px 4px !important;}
    .match-card.mc-abst .mc-odds div[class^="qp"] > div:last-child, .match-card.mc-abst .mc-goals div[class^="qp"] > div:last-child{display:none !important;}
    .mc-act button{background:rgba(255,255,255,.06) !important; border:1px solid rgba(255,255,255,.12) !important; color:var(--ink) !important; padding:8px 0 !important;}
    .mc-act button:active{background:rgba(16,185,129,.18) !important;}
    #refreshFixturesBtn::before{content:"↻" !important; font-size:20px !important; color:#04150f; font-weight:800;}
    /* a fixture with no forecast has nothing to show in the statistics cells */
    .match-card.mc-abst .mc-xg, .match-card.mc-abst .mc-shots, .match-card.mc-abst .mc-sot, .match-card.mc-abst .mc-corners{display:none !important;}
  }

  /* Kupon AI (Kupon Editörü) on phones: the two-column studio breaks its width at any narrow screen
     (fixed further up for tablet, see .studio-grid in the 880px block); this trims padding and the
     several inner grids so nothing forces the page wider than the viewport. */
  @media (max-width:720px){
    .studio-grid{gap:12px !important; margin-bottom:12px !important;}
    .studio-card, .live-slip-box{padding:14px !important; border-radius:12px !important;}
    .studio-head{flex-wrap:wrap; gap:6px; row-gap:4px;}
    /* Each numbered section (date, tier, odds, markets, limit/league) carries its own inline
       margin-bottom (14-18px); tightened uniformly so five stacked sections read as one screen. */
    .studio-card > div{margin-bottom:10px !important;}
    .slip-head{flex-wrap:wrap; gap:8px;}
    .slip-head h3{font-size:16px;}
    .tier-chips{gap:6px !important;}
    .tier-chip{padding:8px 4px !important;}
    .tier-chip .t-sub{font-size:9.5px !important;}
    .market-chips-grid{grid-template-columns:1fr 1fr !important; gap:6px !important;}
    .market-chips-grid > label:last-child{grid-column:1 / -1;}
    .market-chip-box{padding:8px 8px !important; font-size:11.5px !important; gap:6px !important; line-height:1.25;}
    .market-chip-box input[type="checkbox"]{width:14px !important; height:14px !important; flex-shrink:0;}
    .slip-summary-banner{grid-template-columns:repeat(2, 1fr) !important; gap:10px 8px !important; padding:10px !important;}
    .slip-stat-item{min-width:0;}
    .slip-stat-item .ss-val{font-size:19px !important;}
    .slip-stat-item .ss-lbl{font-size:9.5px !important;}
    .studio-cta{grid-template-columns:1fr !important;}
    .studio-cta button{padding:12px !important; font-size:14px !important;}
    .kupon-pills{grid-template-columns:1fr 1fr !important; gap:8px !important;}
    .kupon-pills > div:last-child{grid-column:1 / -1;}
    #studioSlipLegsList{max-height:none !important;}

    /* Two screens' worth of criteria then two more of the slip was too much scroll on a phone;
       below this width the studio becomes two tabs instead of one long stack. */
    .studio-mtabs{display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:12px;}
    .studio-mtabs button{padding:10px; border-radius:10px; border:1px solid var(--border); background:var(--surface-2); color:var(--ink-dim); font-size:13px; font-weight:700;}
    .studio-mtabs button.active{background:var(--brand-tint); color:var(--brand); border-color:var(--brand);}
    .live-slip-box{display:none;}
    body.studio-tab-slip .studio-card{display:none;}
    body.studio-tab-slip .live-slip-box{display:block;}

    /* Canlı Takip (V-LIVE): never got its own mobile pass before — the rule cards, banner and
       tables just fell back to their desktop sizing at any width. */
    .system-banner{font-size:12px !important; padding:9px 11px !important; line-height:1.4;}
    .lv-status{font-size:11.5px !important; gap:8px 12px !important; margin-bottom:10px !important;}
    .lv-rules{gap:8px !important; margin-bottom:10px !important;}
    .lv-rule{padding:10px !important;}
    .lv-rule h5{font-size:13px !important;}
    .lv-rule .w{font-size:11px !important; min-height:0 !important;}
    .lv-cols{gap:10px !important; margin-bottom:10px !important;}
    .lv-row{grid-template-columns:20px auto 1fr auto !important; gap:6px !important; padding:7px 0 !important;}
    .lv-row .m b{font-size:12.5px !important;}
    .lv-row .m span{font-size:10.5px !important;}
    .lv-min{font-size:11.5px !important;}
    .lv-kasa-kpi{gap:8px !important; margin-bottom:10px !important;}
    .lv-kasa-kpi .b{padding:8px 10px !important;}
    .lv-kasa-kpi .b b{font-size:15px !important;}
    .lv-sig-scroll{max-height:360px !important;}
    .lv-sig-table{font-size:11px !important;}
    .lv-sig-table td{padding:6px 3px !important;}
  }
  @media (min-width:721px){ .studio-mtabs{display:none;} .st-custom-btn{display:none;} }

  /* Phones, iPhone and Android alike: a thin header that names the page, inputs large enough that
     iOS Safari does not zoom on focus, and room for the notch and home bar (viewport-fit=cover). */
  .m-title{display:none;}
  /* Landscape iPhones are wider than the phone breakpoint: keep the page clear of the notch there too */
  .app-inner{padding-left:max(24px, env(safe-area-inset-left)); padding-right:max(24px, env(safe-area-inset-right));}
  @media (max-width:720px){
    .topbar{padding-top:calc(6px + env(safe-area-inset-top));}
    .topbar .app-inner, .app-inner{padding-left:max(12px, env(safe-area-inset-left)); padding-right:max(12px, env(safe-area-inset-right));}
    .legal-strip{font-size:10.5px; padding:0 8px 4px; margin-top:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
    .legal-strip .ls-long{display:none;}
    .topbar.scrolled .legal-strip{display:none;}
    .brand-row{justify-content:flex-start; margin-bottom:0; min-height:44px; gap:8px;}
    .brand{padding:4px 4px 4px 0; gap:6px;}
    .brand .brand-mark{width:26px; height:26px;}
    .brand-word{display:none;}
    .m-title{display:block; flex:1; min-width:0; font:800 20px/1 'Barlow Condensed',system-ui,sans-serif; letter-spacing:.3px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
    /* Header on phones: one line of notice, then logo · section title · version · avatar · settings gear. Contact stays in the
       Menu sheet. */
    .legal-strip{text-align:center; letter-spacing:-.1px; position:relative; padding-left:62px; padding-right:62px;}
    /* The version, top right on phones (the header badge has no room there); a tap opens the bell's release notes. */
    .legal-strip .ls-ver:not([hidden]){display:block; position:absolute; right:10px; top:0; bottom:4px; margin:auto 0; padding:0 7px; border:1px solid var(--border); border-radius:999px; background:var(--surface); color:var(--brand, #38b6ff); font:700 10px/13px 'Barlow',system-ui,sans-serif; height:15px; cursor:pointer;}
    .brand-row{align-items:center;}
    .brand-row .header-actions{display:flex; flex:none; margin-left:auto; gap:0;}
    .brand-row .header-actions > :not(.user-badge){display:none;} /* the version lives in the bell panel on phones */
    .user-badge{gap:6px;}
    .user-badge .hdr-ic, .user-badge .hdr-gear, .user-badge .hdr-avatar{width:36px; height:36px;}
    .hdr-ic svg{width:19px; height:19px;}
    .brand-row .brand-word{display:block; font-size:19px!important; letter-spacing:-.3px;}
    .brand-row .brand-tag{display:none;}
    .brand-row .m-title{flex:none; font:700 12.5px/1 'Barlow',system-ui,sans-serif; letter-spacing:.4px; color:var(--brand, #38b6ff);}
    .brand-row .brand .brand-mark{width:30px; height:30px;}
    .hdr-panel{top:calc(62px + env(safe-area-inset-top)); left:max(10px, env(safe-area-inset-left)); right:max(10px, env(safe-area-inset-right)); width:auto; max-width:none; max-height:calc(100vh - 190px - env(safe-area-inset-top));}
    .brand-row .ver-badge{margin-right:0; padding:3px 9px; font-size:11px; line-height:16px;}
    .brand-row .ver-badge .ver-pop{position:fixed; left:max(12px, env(safe-area-inset-left)); right:max(12px, env(safe-area-inset-right)); top:calc(64px + env(safe-area-inset-top)); width:auto; max-width:none; max-height:60vh; overflow:auto;}
    input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]), select, textarea{font-size:16px !important;}
    .m-nav{grid-template-columns:repeat(5, minmax(0,1fr)); left:max(10px, env(safe-area-inset-left)); right:max(10px, env(safe-area-inset-right));}
    .m-nav button.m-more.open{color:var(--brand);}
    /* Şampiyon Formu: the scan and quota line is for the operator; on phones it opens with the "i" button */
    .hf-stats{display:none;}
    .hf-infobar{justify-content:flex-end;}
    .hf-infobar:has(.hf-info-btn[aria-expanded="true"]) .hf-stats{display:block;}
  }

  /* Home on phones: one screen. The seven cards sit side by side in a deck that swipes sideways;
     each card keeps a fixed height and scrolls inside itself. Match cards: teams and score on top,
     the forecast blocks in a sideways strip with the pick first. */
  .home-deck{display:contents;}
  .home-chips{display:none;}
  /* Şampiyon Formu karnesi (Maçlar Şampiyon Formu modu, V-List Şampiyon Formu sekmesi) */
  .cf-perf{background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:10px 12px; margin:0 0 10px; font-size:12px; line-height:1.5; color:var(--ink-dim);}
  .cf-perf > b{display:block; color:var(--ink); font-size:12.5px; margin-bottom:4px;}
  .cf-perf-row + .cf-perf-row{margin-top:4px; padding-top:4px; border-top:1px dashed var(--border);}
  .cf-perf-lbl{color:var(--ink); font-weight:600;}
  .cf-perf-row b{color:var(--win,#22c55e);}
  @media (max-width:720px){
    /* Phones: the old height. Greeting on top, then accuracy (left) beside a sideways rail (right) */
    .home-hero{padding:12px !important; margin-bottom:10px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.12fr); grid-template-areas:"g g" "a r" "a d"; gap:8px 8px; border-radius:18px;}
    .hh-top{display:contents;}
    .hh-greet{grid-area:g;} .hh-acc{grid-area:a;} .hh-rail{grid-area:r;} .hh-dots{grid-area:d;}
    .home-hero .home-go, .home-banner{display:none !important;}
    .home-hero .home-date{font-size:11.5px; margin-top:1px;}
    .home-hi{font-size:21px;}
    .hh-eyebrow{margin-bottom:4px; font-size:10px;}
    .hh-tile{padding:9px; border-radius:14px; gap:6px;}
    .hh-lbl{font-size:9.5px; letter-spacing:.5px;}
    .hh-acc{gap:6px;}
    .hh-acc-head{gap:6px; flex-direction:row-reverse; align-items:flex-start;}
    .hh-ring{width:42px; height:42px;} .hh-ring b{font-size:11.5px;} .hh-ring circle{stroke-width:7;}
    .hh-acc-tx{gap:2px;}
    .hh-acc-tx .hh-sub{font-size:10.5px; line-height:1.25;}
    .hh-best{display:none;}
    .hh-bars{gap:2px; padding-top:5px;}
    .hh-bar{padding:0; gap:2px;}
    .hh-bar em{font-size:9.5px;}
    .hh-col{height:26px; width:14px;}
    .hh-bar > span:not(.hh-col){font-size:9.5px;}
    .hh-bar small{display:none;}
    .hh-rail{display:flex; gap:8px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; overscroll-behavior-x:contain;}
    .hh-rail::-webkit-scrollbar{display:none;}
    .hh-slide{flex:0 0 100%; scroll-snap-align:start; gap:6px;}
    .hh-pick-body, .hh-ticket-body{gap:6px;}
    .hh-match{gap:6px;}
    .hh-match .kpi-crests .lc-crest{width:20px; height:20px; font-size:8px;} .hh-match .kpi-crests .lc-crest img{width:16px; height:16px;}
    .hh-teams b{font-size:12.5px;}
    .hh-teams small{font-size:10.5px;}
    .hh-pick-row{gap:5px;}
    .hh-chip{font-size:11px; padding:2px 8px;}
    .hh-odd{font-size:12px;}
    .hh-res{font-size:10px; padding:1px 6px;}
    .hh-meter b{font-size:11.5px;}
    .hh-foot{display:none;}
    .hh-row{padding:2px 0; column-gap:6px; row-gap:0;}
    .hh-row:nth-child(n+3){display:none;}
    .hh-row-t{gap:5px;}
    .hh-row-t b{font-size:11.5px; line-height:15px;}
    .hh-row-l{font-size:9.5px; line-height:12px; padding-left:21px;}
    .hh-row-r{gap:2px;}
    .hh-row-r b{font-size:11.5px;}
    .hh-row-p{font-size:9.5px; padding:0 5px;}
    .hh-row-st{width:12px; height:12px; font-size:8px;}
    .hh-list{gap:3px;} .hh-rows{gap:0;}
    .hh-tk-head b{font-size:12px;}
    .hh-tk-odd b{font-size:20px;}
    .hh-tk-odd small{font-size:10px;}
    .hh-tk-legs{font-size:10.5px; gap:2px;}
    .hh-tk-legs em{display:none;}
    .hh-dots{display:flex; justify-content:center; gap:5px; align-self:start;}
    .hh-dots i{width:5px; height:5px; border-radius:99px; background:rgba(255,255,255,.2); cursor:pointer; transition:width .2s, background .2s;}
    .hh-dots i.on{width:14px; background:linear-gradient(90deg, #38b6ff, #2fc7b9);}
    .home-chips{display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; margin:0 -12px 8px; padding:0 12px; scroll-padding-inline:12px;}
    .home-chips::-webkit-scrollbar{display:none;}
    .home-chips button{flex:none; padding:7px 12px; border-radius:20px; border:1px solid var(--border); background:var(--surface); color:var(--ink-dim); font:700 13px 'Barlow Condensed',system-ui,sans-serif; letter-spacing:.3px; cursor:pointer; -webkit-tap-highlight-color:transparent;}
    .home-chips button.on{color:var(--brand); border-color:var(--brand); background:rgba(16,185,129,.12);}
    .home-deck{display:flex; align-items:flex-start; gap:10px; overflow-x:auto; overflow-y:hidden; touch-action:pan-x pan-y; transition:height .2s ease; scroll-snap-type:x mandatory; scrollbar-width:none; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; margin:0 -12px; padding:0 12px; scroll-padding-inline:12px;}
    .home-deck::-webkit-scrollbar{display:none;}
    .home-deck > .kpi-grid, .home-deck > .home-row2{display:contents !important;}
    .home-deck .kpi-card{flex:0 0 100%; box-sizing:border-box; scroll-snap-align:start; scroll-snap-stop:always; margin:0 !important;
      height:auto; min-height:340px; min-width:0; overflow-x:clip; overflow-y:visible;}
    .home-deck .kpi-card .hm-scroll{max-height:none;}

    /* No backdrop blur on phones: these surfaces are near-opaque or full screen, and a blur behind a fixed bar
       or a full-screen window is redrawn on every scroll frame */
    .m-nav, .m-sheet-bg.open, #verificationModal, #similarOddsModal, #jvOverlay, .modal-backdrop{-webkit-backdrop-filter:none !important; backdrop-filter:none !important;}
    .m-nav{background:linear-gradient(180deg, #16213e, #090f22);}
    /* League menu: a full-screen list over the page (the side-by-side strip it was froze the screen) */
    #leagueSidebar:not(.collapsed){position:fixed !important; inset:0; z-index:1100; width:auto !important; max-height:none !important; height:100vh; height:100dvh;
      overflow-y:auto; overflow-x:hidden; border-radius:0; border:none; transition:none;
      padding:calc(10px + env(safe-area-inset-top)) 14px calc(20px + env(safe-area-inset-bottom)) !important; overscroll-behavior:contain;}
    #leagueSidebar:not(.collapsed) .sidebar-header{position:sticky; top:calc(-10px - env(safe-area-inset-top)); z-index:1; background:var(--surface); padding:10px 4px; margin:0 0 6px;}
    #leagueSidebar:not(.collapsed) .side-item, #leagueSidebar:not(.collapsed) .sub-league-item{white-space:normal; min-height:40px;}
    #leagueSidebar.collapsed{display:none !important;}
    /* Match list (mackolik layout): league header, then one line per match */
    #panel-liste.active{display:flex; flex-direction:column;}
    #panel-liste > .date-strip{order:-2;} #panel-liste > #matchFilters{order:-1;}
    #panel-liste .date-strip{gap:6px; padding:0; margin:0 0 10px; border:none; background:none; border-radius:0;}
    #panel-liste .ds-arrow{display:none;}
    #panel-liste .ds-days{justify-content:flex-start; gap:0; background:var(--surface); border:1px solid var(--border); border-radius:12px; scrollbar-width:none;}
    #panel-liste .ds-day{min-width:62px; padding:8px 6px 9px; border-radius:0; gap:1px; position:relative; background:none !important; border:none !important;}
    #panel-liste .ds-day .wd{font-size:13px; letter-spacing:0; font-weight:500; color:var(--ink-dim);}
    #panel-liste .ds-day .dm{font-size:13px; font-weight:500; color:var(--ink-dim);}
    #panel-liste .ds-day.active .wd{color:#fff; font-weight:800;} #panel-liste .ds-day.active .dm{color:#fff; font-weight:800; font-size:15px;}
    #panel-liste .ds-day.active::after{content:""; position:absolute; left:10px; right:10px; bottom:0; height:4px; border-radius:3px 3px 0 0; background:var(--brand);}
    #panel-liste .ds-cal{flex:none; width:44px; height:52px; border-radius:12px; background:var(--brand); border-color:var(--brand); font-size:20px;}
    #panel-liste #refreshFixturesBtn{flex:none; margin-left:0 !important; width:44px; height:52px; padding:0 !important; border-radius:12px !important; overflow:hidden; white-space:nowrap; font-size:0 !important;}
    #panel-liste #refreshFixturesBtn::before{content:"↻"; font-size:22px; font-weight:800;}
    #panel-liste .ml-toolbar{align-items:stretch; flex-wrap:nowrap; margin:0 0 8px;}
    #panel-liste .floating-sidebar-btn{padding:6px 12px !important; font-size:12.5px !important; margin:0 !important; min-height:34px; box-sizing:border-box;}
    #panel-liste #matchFilters{margin-bottom:10px;} #panel-liste #matchFilters .flt-count{display:none;}
    .ml-row.live .ml-st{font-size:10.5px; letter-spacing:-.2px;}
    #fixturesList{gap:10px;}
    .ml-league{background:var(--surface); border:1px solid var(--border); border-radius:14px; overflow:hidden; content-visibility:auto; contain-intrinsic-size:auto 220px;}
    .ml-lh{display:flex; align-items:center; gap:10px; padding:9px 12px; background:rgba(255,255,255,.05); min-height:44px; box-sizing:border-box;}
    .ml-flag{width:26px; height:26px; border-radius:50%; object-fit:cover; flex:none; display:inline-flex; align-items:center; justify-content:center; font-size:18px; line-height:1; overflow:hidden;}
    .ml-ln{flex:1; min-width:0; font-size:13.5px; font-weight:600; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
    .ml-star{flex:none; width:34px; height:34px; border:none; background:none; color:var(--ink-dim); font-size:22px; line-height:1; cursor:pointer; padding:0; -webkit-tap-highlight-color:transparent;}
    .ml-star.on{color:#facc15;}
    .ml-row{display:grid; grid-template-columns:32px minmax(0,1fr) 38px minmax(0,1fr) auto; align-items:center; column-gap:5px; min-height:46px; padding:0 6px 0 10px; cursor:pointer; -webkit-tap-highlight-color:transparent;}
    .ml-row + .ml-row{border-top:1px solid rgba(255,255,255,.07);}
    .ml-row:active{background:rgba(16,185,129,.10);}
    .ml-st{font-size:12px; font-weight:800; color:var(--ink); white-space:nowrap;}
    .ml-row:not(.live) .ml-st:not(:empty){font-variant-numeric:tabular-nums;}
    .ml-h, .ml-a{display:flex; align-items:center; gap:4px; min-width:0; font-size:13px; letter-spacing:-.1px; color:var(--ink);}
    .ml-h{justify-content:flex-end; text-align:right;}
    .ml-n{min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
    .ml-stack{display:flex; flex-direction:column; min-width:0; gap:2px;} .ml-h .ml-stack{align-items:flex-end;}
    .ml-stack .ml-n{line-height:15px;}
    .ml-dots{display:flex; gap:1.5px; line-height:0;} .ml-dots i{width:5px; height:5px; border-radius:50%; display:block; background:#ef4444;}
    .ml-dots i.w{background:#22c55e;} .ml-dots i.d{background:#eab308;}
    .ml-tst{display:flex; gap:3px;} .ml-h .ml-tst{justify-content:flex-end;}
    .ml-tst b{display:inline-block; padding:1px 5px; border-radius:999px; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.06); font-size:8.5px; line-height:10px; font-weight:600; color:var(--ink-dim); white-space:nowrap; font-variant-numeric:tabular-nums;}
    .ml-tst b.c5{color:#22c55e;} .ml-tst b.c4{color:#a3e635;} .ml-tst b.c3{color:#eab308;} .ml-tst b.c2{color:#f97316;} .ml-tst b.c1{color:#ef4444;}
    .ml-tst b[class]{border-color:currentColor; background:color-mix(in srgb, currentColor 12%, transparent);}
    .ml-h.win, .ml-a.win{font-weight:800;}
    .ml-crest{width:26px; height:26px; object-fit:contain; flex:none;}
    /* Crest with the team's league-table rank in small print under it */
    .ml-cw{display:inline-flex; flex-direction:column; align-items:center; flex:none; min-width:26px;}
    .ml-cw small{margin-top:1px; padding:0 3px; border-radius:4px; background:var(--surface-3); font-size:10px; line-height:12px; font-weight:800; color:var(--ink-dim); font-variant-numeric:tabular-nums;}
    .ml-ln[data-lgpage]{cursor:pointer;}
    .ml-ln[data-lgpage]::after{content:" ›"; color:var(--ink-faint); font-weight:700;}
    .ml-sc{text-align:center; font-size:13.5px; font-weight:800; color:var(--ink); white-space:nowrap; font-variant-numeric:tabular-nums;}
    .ml-row.live .ml-st, .ml-row.live .ml-sc{color:#ef4444;}
    .ml-sc.ml-cnt{display:flex; flex-direction:column; align-items:center; line-height:1.15;}
    .ml-sc.ml-cnt small{font-size:9.5px; font-weight:700; color:var(--ink-faint); white-space:nowrap;}
    .ml-pick{display:grid; grid-template-columns:auto auto; grid-auto-flow:column; grid-template-rows:auto auto; column-gap:4px; align-items:center; justify-items:center; justify-content:center; min-width:46px; max-width:80px; padding:3px 4px; border-radius:8px; background:rgba(255,255,255,.06); line-height:1.15; text-align:center;}
    .ml-pick b{font-size:11px; font-weight:800; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%;}
    .ml-pick i{font-style:normal; font-size:10.5px; font-weight:700; color:var(--ink-dim); font-variant-numeric:tabular-nums;}
    .ml-pick.alt b{color:#fbbf24;}
    .ml-pick.won{background:rgba(34,197,94,.22);} .ml-pick.won b, .ml-pick.won i{color:#4ade80;}
    .ml-pick.lost{background:rgba(239,68,68,.2);} .ml-pick.lost b, .ml-pick.lost i{color:#f87171;}
    .ml-pick .ml-conf{grid-row:1 / span 2; width:21px; height:21px; border-radius:50%; border:1.5px solid currentColor; display:flex; align-items:center; justify-content:center; text-decoration:none; font-size:9.5px; font-weight:800; letter-spacing:-.3px; color:var(--ink-dim); font-variant-numeric:tabular-nums; box-sizing:border-box;}
    /* Confidence ring on a colour scale: green for a strong call through yellow to red for a weak one */
    .ml-conf.c5{color:#22c55e;} .ml-conf.c4{color:#84cc16;} .ml-conf.c3{color:#eab308;} .ml-conf.c2{color:#f97316;} .ml-conf.c1{color:#ef4444;}
    .ml-pick.none{background:none; color:var(--ink-faint); font-size:12px;}
    .ml-toolbar > .ml-sort{display:flex; margin-left:auto; flex:none; gap:3px; padding:2px; background:var(--surface); border:1px solid var(--border-highlight); border-radius:8px; box-shadow:0 2px 10px rgba(0,0,0,0.1);}
    .ml-sort button{padding:5px 11px; border:none; border-radius:6px; background:none; color:var(--ink-dim); font-family:inherit; font-weight:700; font-size:12.5px; cursor:pointer; white-space:nowrap; -webkit-tap-highlight-color:transparent;}
    .ml-sort button.on{background:var(--brand); color:#04150f;}
    .ml-pick i.fair{font-style:italic; opacity:.75;}
    /* A finished match: a tick or a cross on the call's corner says whether it won. */
    .ml-pick{position:relative;}
    .ml-pick .ml-res{position:absolute; top:-7px; right:-7px; width:14px; height:14px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-style:normal; font-size:9.5px; font-weight:900; line-height:1; color:#fff; box-shadow:0 0 0 1.5px var(--surface);}
    .ml-pick.won .ml-res{background:#16a34a;} .ml-pick.lost .ml-res{background:#dc2626;}
    /* Long lists: cards outside the screen are not laid out or painted (each one holds its own sideways strip) */
    .match-card{content-visibility:auto; contain-intrinsic-size:auto 280px;}
    .match-card .mc-swipe{display:flex; grid-column:1 / -1 !important; order:3; gap:8px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; margin:0 -12px; padding:0 12px 2px; scroll-padding-inline:12px;}
    .match-card .mc-swipe::-webkit-scrollbar{display:none;}
    .match-card .mc-swipe > *{flex:0 0 auto; scroll-snap-align:start; min-width:0; box-sizing:border-box;}
    .match-card .mc-swipe > .mc-pick{order:-1; width:88%;}
    .match-card .mc-swipe > .mc-odds{width:66%;}
    .match-card .mc-swipe > .mc-goals{width:48%;}
    .match-card .mc-swipe > .mc-xg{width:44%; flex-direction:column !important; justify-content:center !important; align-items:center !important;}
    .match-card .mc-swipe > .mc-shots, .match-card .mc-swipe > .mc-sot, .match-card .mc-swipe > .mc-corners{width:40%;}
    .match-card .mc-act{order:4;}
    .match-card .mc-time > :nth-child(2){display:none !important;} /* the day is already picked in the strip above */
  }

  /* Phones: the big windows (match dossier, summary, similar odds, verification) open full screen with
     the header and tabs pinned; wide tables inside them turn into one card per row (see cardifyTables). */
  @media (max-width:720px){
    #leaguePageModal .modal-head, #mlPerfModal .modal-head{position:sticky; top:0; z-index:5; padding:calc(10px + env(safe-area-inset-top)) 14px 10px !important;}
    #leaguePageModal .pg-tabs, #mlPerfModal .pg-tabs{position:sticky; top:calc(56px + env(safe-area-inset-top)); z-index:4; padding:8px 14px;}
    #leaguePageModal .modal-body, #mlPerfModal .modal-body{padding:12px 14px !important;}
    #leaguePageModal, #mlPerfModal, #dossierModal, #summaryModal, #similarOddsModal, #verificationModal{padding:0 !important; align-items:stretch !important; justify-content:stretch !important; z-index:1150 !important;}
    #similarOddsModal, #verificationModal, #summaryModal{z-index:1200 !important;}
    #leaguePageModal > .modal, #mlPerfModal > .modal, #dossierModal > .modal, #summaryModal > .modal, #similarOddsModal > .so-card, #verificationModal > .vm-card{max-width:none !important; width:100% !important; height:100vh; height:100dvh; max-height:none !important;
      border-radius:0 !important; border:none !important; box-sizing:border-box; overflow-y:auto; overscroll-behavior:contain; padding-bottom:calc(16px + env(safe-area-inset-bottom)) !important;}
    #dossierModal .modal-head, #summaryModal .modal-head{position:sticky; top:0; z-index:5; padding:calc(10px + env(safe-area-inset-top)) 14px 10px !important;}
    #dossierModal .modal-head h3{font-size:17px;}
    #dossierModal .modal-body, #summaryModal .modal-body{padding:12px 14px !important;}
    #dossierModal #modalTabs{position:sticky; top:calc(56px + env(safe-area-inset-top)); z-index:4; margin:0 !important; padding:8px 14px !important; background:var(--surface); flex-wrap:nowrap; scrollbar-width:none;}
    #dossierModal #modalTabs::-webkit-scrollbar{display:none;}
    #similarOddsModal .so-header, #verificationModal .vm-header{position:sticky; top:0; z-index:5; background:inherit; padding-top:env(safe-area-inset-top);}
    .so-card{background:#11121d;} .vm-card{background:#0d1322;}
    #verificationModal .vm-tabs{overflow-x:auto; flex-wrap:nowrap; scrollbar-width:none;}
    #verificationModal .vm-tab-btn{flex:none; white-space:nowrap;}

    table.t-cards, table.t-cards > tbody{display:block; width:100% !important; min-width:0 !important;}
    table.t-cards > thead, table.t-cards tr.t-head{display:none;}
    table.t-cards tr{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px 12px; padding:10px 12px; margin-bottom:8px; border:1px solid rgba(255,255,255,.1); border-radius:12px; background:rgba(255,255,255,.03);}
    table.t-cards td{display:block; padding:0 !important; border:none !important; text-align:left !important; white-space:normal !important; min-width:0; font-size:13px; overflow-wrap:anywhere;}
    table.t-cards td[data-label]::before{content:attr(data-label); display:block; font:700 10.5px/1.3 'Barlow Condensed',system-ui,sans-serif; letter-spacing:.5px; text-transform:uppercase; color:#8ea0c4; margin-bottom:2px;}
    table.t-cards td.t-wide{grid-column:1 / -1;}
    [style*="overflow-x:auto"] > table.t-cards{margin:0;}

    /* small print that is read, not glanced at: never under 12px on a phone */
    .lv-ctx-chip, .kpi-note, .kpi-match span, .sm-why, .sm-modelpick, .lv-row .m span, .fg-sum span, .fg-grid span, .vl-sub, .kh-st, .lesson-card .tag, .kpi-tab, .fg-row .m span{font-size:12px !important;}
  }
  /* Sort switch (Lig / Saat / Güven): pill buttons with an icon each. */
  .ml-sort svg, .ml-sortsel svg{width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex:none;}
  .flt-sh{display:none;}
  .m-clamp{cursor:default;}
  /* Phones: compact screens. Maçlar filter panel, V-List lists in the Maçlar layout, Kupon, Geçmiş, V-Kasa, V2. */
  @media (max-width:720px){
    .flt-lg{display:none;} .flt-sh{display:inline;}
    #panel-liste .ml-toolbar{gap:6px;}
    /* Şampiyon Formu is the Maçlar list's 👑 mode on phones; V-List shows its tab on wide screens only (iko, 2026-10-20). */
    #vlSubtabs [data-vltab="homeform"]{display:none;}
    /* No V-List tab on phones (iko, 2026-10-20): the Menu's "Tahmin Geçmişi" tile opens its Geçmiş page alone; the match list is Maçlar, Korner is its 🚩 mode. */
    #vlSubtabs{display:none;}
    #panel-liste .floating-sidebar-btn{flex:0 1 auto; min-width:0; white-space:nowrap; min-height:36px !important; border-radius:999px !important;}
    .ml-toolbar > .ml-sort{gap:5px; padding:0; background:none; border:none; box-shadow:none;}
    .ml-toolbar > .ml-sort + .ml-brain{margin-left:0;}
    /* The mode box shows only the current mode's icon; the names are in the list it opens (iko, 2026-10-15). The
       select is laid invisibly over the pill so a tap still opens the phone's own picker. */
    .ml-toolbar > .ml-modesel{display:inline-flex; flex:none; margin-left:auto; padding:0 26px 0 12px; cursor:pointer;}
    .ml-modesel .ml-modeic{font-size:18px; line-height:1;}
    .ml-toolbar > .ml-modesel select{position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer;}
    .ml-modesel::after{right:11px;}
    .ml-toolbar > .ml-modesel + .ml-sort{margin-left:0;}
    /* The order box the same way: only the current order's icon, the names in the list it opens (iko, 2026-10-15). */
    .ml-sortsel.ml-iconsel{padding:0 26px 0 12px; cursor:pointer;}
    .ml-iconsel .ml-modeic{font-size:18px; line-height:1;}
    .ml-sortsel.ml-iconsel select{position:absolute; inset:0; width:100%; height:100%; opacity:0;}
    .ml-sortsel.ml-iconsel::after{right:11px;}
    .ml-sortsel{position:relative; display:inline-flex; align-items:center; gap:5px; min-height:36px; padding:0 30px 0 11px; border-radius:999px; border:1px solid rgba(16,185,129,.55); background:var(--surface); color:var(--brand); box-sizing:border-box;}
    .ml-sortsel::after{content:""; position:absolute; right:12px; top:50%; width:6px; height:6px; margin-top:-5px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg); pointer-events:none;}
    .ml-sortsel select{appearance:none; -webkit-appearance:none; border:none; background:none; color:var(--ink); font-family:inherit; font-weight:700; font-size:13px; padding:0; margin:0; width:auto; min-width:0; outline:none; cursor:pointer;}
    .ml-sortsel select option{background:var(--surface); color:var(--ink);}
    .ml-list{display:flex; flex-direction:column; gap:10px;}
    .ml-flat .ml-row{grid-template-rows:auto auto; padding-top:4px; padding-bottom:5px;}
    .ml-flat .ml-row > :not(.ml-rlg){grid-row:2;}
    .ml-rlg{grid-row:1; grid-column:1 / -1; display:flex; align-items:center; gap:4px; min-width:0; font-style:normal; font-size:10px; font-weight:700; color:var(--ink-faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
    .ml-rlg img{width:12px; height:12px; object-fit:contain; flex:none;}
    .ml-st small{display:block; font-size:9.5px; font-weight:600; color:var(--ink-faint); line-height:1.1;}
    .ml-flag.ml-lgo{object-fit:contain; border-radius:6px; background:rgba(255,255,255,.9); padding:2px; box-sizing:border-box;}

    /* Filter panel: label beside its box, three short rows instead of a screen */
    #matchFilters .flt-sortsel{display:none !important;}
    .flt-bar{padding:8px !important; gap:6px !important;}
    .flt-search input{padding:8px 12px;}
    .flt-toggle{padding:0 12px;}
    .flt-bar.open .flt-more{gap:6px;}
    .flt-f{flex-direction:row; align-items:center; gap:6px; min-width:0; padding:0 0 0 9px; border:1px solid var(--border); border-radius:10px; background:var(--surface); font-size:9.5px; letter-spacing:.4px;}
    .flt-f select{border:none; background:transparent; padding:6px 4px; border-radius:10px; flex:1; min-width:0;}
    .flt-c{padding:6px 8px !important; font-size:12px; white-space:nowrap;}
    .flt-reset{grid-column:auto; padding:6px; font-size:12.5px;}

    /* V-List: the explanation card shrinks to the count and the refresh button */
    .vl-mhead{padding:6px 10px !important; margin-bottom:8px !important;} .vl-mdesc{display:none;}
    .vl-mhead .btn{padding:5px 10px !important;}
    #vlMatchesTable .ml-toolbar{justify-content:flex-end; margin:0 0 8px;}
    .hf-msort{margin-bottom:8px;}
    .hf-msort select, .hf-msort button{padding:6px 10px;}
    .ml-row.hf-ml.fortress{background:linear-gradient(90deg, rgba(245,158,11,.08), transparent 55%);}
    .ml-row.open{background:rgba(16,185,129,.07);}
    .ml-league .hfr-detail, .ml-league .kh-detail{margin:0 !important; border:none !important; border-top:1px solid var(--border) !important; border-radius:0 !important; padding:10px 12px !important;}
    .hf-mini{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:6px;}
    .hf-mini span{display:flex; flex-direction:column; gap:1px; padding:5px 6px; border-radius:8px; background:var(--surface); font-size:10px; color:var(--ink-faint); font-weight:700; text-transform:uppercase; min-width:0;}
    .hf-mini b{font-size:13px; color:var(--ink); text-transform:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
    .ml-row.kh-ml{grid-template-columns:34px minmax(0,1fr) 54px minmax(0,1fr) auto;}
    .ml-row.kh-ml .kh-score{min-width:50px; padding:2px 4px; font-size:14px; border-radius:7px;}
    .ml-row.kh-ml .kh-score small{font-size:7.5px; max-width:48px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}

    /* Sub-tabs everywhere: one scrolling row of short pills */
    .lv-subtabs{flex-wrap:nowrap !important; overflow-x:auto; scrollbar-width:none; gap:6px !important; margin-bottom:10px !important;}
    .lv-subtabs::-webkit-scrollbar{display:none;}
    .lv-subtabs button{flex:none; padding:7px 12px !important; font-size:12.5px !important; border-radius:999px !important;}
    .kh-subtabs{margin-bottom:8px;} .kh-subtabs button{padding:6px 12px; border-radius:999px;}
    /* Long explanations: two lines, a tap opens the rest */
    .system-banner.m-clamp{cursor:pointer; margin-bottom:10px !important;}
    .system-banner.m-clamp > div{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
    .system-banner.m-clamp.open > div{display:block;}

    /* Geçmiş filters: two columns, small labels */
    .kh-filters{display:grid !important; grid-template-columns:1fr 1fr; gap:6px !important; margin-bottom:8px;}
    .kh-filters label{font-size:9.5px; gap:2px;}
    .kh-filters input, .kh-filters select{width:100%; min-width:0; box-sizing:border-box; padding:5px 8px;}
    .kh-filters #khApply{grid-column:1 / -1; padding:7px !important;}
    .kh-wait{padding:7px 10px; margin-bottom:8px;}

    /* Kupon editor */
    .studio-card, .live-slip-box{padding:12px !important;}
    .studio-head > span:last-child{display:none;}
    .studio-head{font-size:15px; margin-bottom:8px !important;}
    .studio-card > div{margin-bottom:8px !important;}
    .odds-quick-row{flex-wrap:nowrap !important; overflow-x:auto; scrollbar-width:none; gap:5px !important;}
    .odds-quick-row::-webkit-scrollbar{display:none;}
    .odds-quick-chip{flex:none; padding:6px 11px !important; font-size:12px !important;}
    .studio-card input[type="date"], .studio-card input[type="time"], .studio-card input[type="number"]{padding:5px 8px !important;}
    .tier-chip{padding:6px 4px !important;}
    .tier-chip .t-icon{display:none !important;}
    .studio-card label[style*="font-size:10.5px"]{font-size:10px !important; margin-bottom:1px !important;}
    .studio-card input[type="date"], .studio-card input[type="time"]{padding:4px 8px !important;}
    .ml-stack .ml-n{max-width:100%;}
    .hf-msort label{flex-direction:row; align-items:center; gap:6px;}
    .hf-msort select{flex:1; min-width:0;}
    .tier-chip .t-title{font-size:12px !important;}
    .tier-hint, .target-hint{font-size:11.5px !important; line-height:1.4 !important;}
    .studio-mtabs{margin-bottom:8px;} .studio-mtabs button{padding:8px;}

    /* V-Kasa */
    #panel-otopilot .vault-hero{padding:12px !important; margin-bottom:10px !important;}
    #panel-otopilot .auto-hero-top{margin-bottom:6px; gap:6px;}
    #panel-otopilot .auto-hero-badge{width:32px; height:32px; font-size:16px; border-radius:9px;}
    #panel-otopilot .auto-hero-top .btn{padding:5px 9px !important; font-size:11.5px !important;}
    #panel-otopilot .auto-risk-chip{padding:4px 9px !important;}
    #panel-otopilot .auto-hero-num{font-size:30px; margin:2px 0;}
    #panel-otopilot .auto-hero-pnl{font-size:11.5px;}
    .vk-stats{display:grid; grid-template-columns:1fr 1fr; gap:4px 10px; font-size:11.5px; margin-top:8px;}
    .vk-stats b{font-size:13px;} .vk-stats .dim{display:none;}
    .vk-mode, .vk-how{font-size:11.5px; margin-top:6px;}
    #autoSession{padding:10px 12px !important; margin-bottom:10px !important;}
    #autoSession h4{font-size:14px;}
    #autoSession .btn{padding:6px 10px !important; font-size:12px !important;}
    .vk-chips{gap:4px; margin:6px 0;} .vk-chip{padding:3px 8px; font-size:11px;}
    .vk-note{font-size:11.5px; padding:6px 8px;}
    #autoSession details summary{font-size:12.5px;}
    #panel-otopilot .card{padding:12px !important; margin-bottom:10px !important;}
    /* V-Kasa on phones: one header row, three small tiles, secondary text folded. */
    #panel-otopilot .vk-lg{display:none;} #panel-otopilot .vk-sh{display:inline;}
    #panel-otopilot .auto-hero-top{flex-wrap:nowrap !important;}
    #panel-otopilot .auto-hero-id{flex:1 1 auto; min-width:0; gap:8px !important;}
    #panel-otopilot .auto-hero-badge{display:none;}
    #panel-otopilot .auto-hero-sub{font-size:10.5px;}
    #panel-otopilot .auto-hero-ctl{flex:none; flex-wrap:nowrap !important; gap:5px !important;}
    #panel-otopilot .auto-hero-ctl .auto-risk-chip{padding:4px 8px !important;}
    #panel-otopilot .auto-hero-ctl .k-val{font-size:12px !important;}
    #panel-otopilot .auto-hero-top .auto-hero-ctl .btn{padding:5px 8px !important; min-width:32px;}
    .vk-mode{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; cursor:pointer;}
    .vk-mode.open{display:block;}
    #panel-otopilot .vk-how{margin-top:4px;}
    #autoSession > div:first-child{flex-wrap:nowrap !important;}
    #autoSession > div:first-child h4{min-width:0;}
    #autoSession .vk-chips{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:5px;}
    #autoSession .vk-chip{border-radius:9px; padding:4px 7px; display:flex; flex-direction:column; line-height:1.25; min-width:0;}
    #autoSession .vk-chip i{font-size:10px; color:var(--ink-faint);}
    #autoSession .vk-chip b{font-size:13px;}
    #autoSession .vk-chip small{font-size:10px; color:var(--ink-faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
    #autoSession .vk-dot{display:none;}
    #vkStartMsg:empty{display:none;}
    .vk-folds{border-top:1px solid var(--border); padding-top:6px;}
    .vk-folds > summary{cursor:pointer; font-weight:700; font-size:12.5px;}
    .vk-folds > details{padding:3px 0 3px 10px !important;}
    .vk-folds > details > div{margin-top:4px !important;}
    #aoSubtabs{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:6px; margin-bottom:10px;}
    #aoSubtabs button{padding:7px 4px; font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
    #panel-otopilot h4{margin-bottom:6px !important;}
    #autoOpen{gap:8px;}
    .vkc{padding:10px 12px; border-radius:12px;}
    .vkc-head{gap:4px 10px; margin-bottom:4px;}
    .vkc-title{font-size:14.5px;}
    .vkc-sub{font-size:11.5px; margin-top:1px;}
    .vkc-pay{text-align:left; display:flex; align-items:baseline; gap:6px; flex-wrap:wrap;}
    .vkc-pay .big{font-size:16px;} .vkc-pay .lbl{font-size:10.5px;}
    .vkc-leg{grid-template-columns:18px minmax(0,1fr) auto; gap:8px; padding:6px 0;}
    .vkc-st{font-size:13px;}
    .vkc-teams{gap:1px;}
    .vkc-team{font-size:12.5px; gap:6px;} .vkc-team img{width:16px; height:16px;}
    .vkc-meta{font-size:10.5px; margin-top:1px;}
    .vkc-pick .mk{font-size:11.5px; padding:2px 6px;}
    .vkc-pick .od{font-size:14px; margin-top:2px;}
    .vkc details{margin-top:4px; font-size:11.5px;}
    .grid2{grid-template-columns:1fr !important;}

    /* V2 */
    #panel-v2 .kpi-card{padding:12px !important; margin-bottom:10px !important;}
    #panel-v2 .tk-legs .tk-leg{grid-template-columns:18px auto minmax(0,1fr) auto; gap:6px; padding:6px 0;}
    #panel-v2 .tk-legs .tk-leg .m b{font-size:12.5px;} #panel-v2 .tk-legs .tk-leg em{font-size:14px;}
    #panel-v2 .tk-chips{gap:4px;} #panel-v2 .tk-chips span{padding:2px 6px;}
    /* İY/MS & Skor: one line per match; the reasoning opens on a tap. */
    #v2TabHtft .system-banner{margin-bottom:8px;}
    .ht-tools{gap:4px 10px; margin-bottom:6px;} .ht-tools #v2HtStats{flex-basis:100%; font-size:11px;}
    #v2Htft > .card{padding:0 10px !important;}
    .ht-row{grid-template-columns:auto minmax(0,1fr) auto; gap:0 8px; padding:7px 0; cursor:pointer; -webkit-tap-highlight-color:transparent;}
    .ht-row .kpi-crests{transform:scale(.85); transform-origin:left center;}
    .ht-row .m b{font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
    .ht-row .m span{font-size:10.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
    .ht-pk{gap:4px;} .ht-pk div{min-width:46px; padding:3px 4px; border-radius:8px;}
    .ht-pk b{font-size:14px; line-height:1.1;} .ht-pk small{font-size:9.5px;} .ht-pk .lbl{display:none;}
    .ht-head{display:flex; justify-content:flex-end; gap:4px; font-size:9.5px; color:var(--ink-dim); padding-top:6px;} .ht-head span{min-width:46px; text-align:center;}
    .ht-alt{display:none; font-size:10.5px; padding-top:5px;} .ht-row.open .ht-alt{display:flex;}
    .ht-perf .pg{grid-template-columns:1fr;} .ht-perf table{font-size:11px;}
    .ht-tools label{font-size:11.5px !important; gap:4px;} .ht-tools select{width:auto !important; min-width:0 !important; max-width:150px; padding:4px 6px !important; font-size:12px !important; height:auto !important; min-height:0 !important;}
    .v2-seg{grid-template-columns:repeat(3, minmax(0,1fr)) !important; gap:2px 8px !important;}
    .v2-seg > span:first-child, .v2-seg > span:last-child{grid-column:1 / -1;}
    #panel-v2 .card{padding:12px !important; margin-bottom:10px !important;}
    #v2KasaCards{grid-template-columns:repeat(3, minmax(0,1fr)) !important; gap:6px !important;}
    #v2KasaCards .metric-card{padding:8px !important;}
    #v2KasaCards .metric-val{font-size:16px !important;}
    #v2KasaCards .metric-lbl{font-size:10px !important;}
    #panel-v2 #v2TabKasa label input, #panel-v2 #v2TabKasa label select{width:100% !important; box-sizing:border-box;}
    #panel-v2 #v2TabKasa .card > div[style*="flex-wrap"] > label{flex:1 1 calc(50% - 12px);}
  }
  /* Kupon Oluşturucu on phones: two steps (1 Ayarlar, 2 Kuponum) that each fit one screen. */
  @media (max-width:720px){
    #panel-kupon > .system-banner{display:none !important;}
    .studio-grid{display:block !important; margin:0 !important;}
    .studio-grid > *{min-width:0; max-width:100%; box-sizing:border-box;}
    .studio-mtabs{display:grid !important; grid-template-columns:1fr 1fr; gap:0; padding:3px; margin-bottom:8px; border-radius:999px; background:var(--surface); border:1px solid var(--border);}
    .studio-mtabs button{display:flex; align-items:center; justify-content:center; gap:6px; padding:7px !important; border:none !important; border-radius:999px !important; background:none !important; font-size:13px !important;}
    .studio-mtabs button i{font-style:normal; width:18px; height:18px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:11px; background:var(--surface-3); color:var(--ink-dim);}
    .studio-mtabs button.active{background:var(--brand-tint) !important; color:var(--brand) !important;}
    .studio-mtabs button.active i{background:var(--brand); color:#04150f;}
    .studio-card{padding:10px !important; border-radius:14px !important;}
    .studio-head{display:none !important;}
    .studio-card > div, .studio-card > button{margin-bottom:9px !important;}
    .studio-card > div > label, .studio-card > div > div > label{font-size:11px !important; margin-bottom:3px !important; letter-spacing:.2px;}
    .studio-card > div > label > span, .tier-hint, .target-hint, #studioTargetOdds{display:none !important;}
    .studio-card > div > div:first-child{margin-bottom:3px !important;}
    .odds-quick-row{margin-top:0 !important;}
    .odds-quick-chip{padding:5px 10px !important;}
    .st-custom-btn{margin-left:8px; padding:2px 8px; border-radius:999px; border:1px solid var(--border); background:var(--surface); color:var(--ink-dim); font-size:11px; font-weight:700; cursor:pointer;}
    .st-custom{display:none;} .st-custom.open{display:block; margin-top:6px;}
    .tier-chips{gap:5px !important;}
    .tier-chip{padding:5px 2px !important; border-radius:10px !important;}
    .tier-chip .t-title{font-size:11.5px !important;} .tier-chip .t-sub{font-size:9px !important;}
    .market-chips-grid{display:flex !important; flex-wrap:wrap; gap:5px !important; margin-top:0 !important;}
    .market-chips-grid > label:last-child{grid-column:auto;}
    .market-chip-box{padding:4px 8px !important; border-radius:999px !important; font-size:11px !important; gap:4px !important; flex:0 0 auto;}
    .market-chip-box input[type="checkbox"]{width:13px !important; height:13px !important;}
    .studio-card select{padding:5px 8px !important;}
    #btnStudioSafe7{padding:7px !important; font-size:13px !important;}
    #btnStudioSafe7 > span:last-child{font-size:10.5px !important;}
    .studio-cta{display:grid !important; grid-template-columns:auto 1fr !important; gap:6px !important;}
    .studio-cta button{padding:10px 12px !important; font-size:14px !important;}
    #btnAnalyzeAiStudio span:last-child{display:none;}
    /* step 2 */
    .live-slip-box{padding:10px !important; border-radius:14px !important;}
    .slip-head{margin-bottom:8px !important;}
    .slip-head h3{font-size:15px !important;}
    .slip-summary-banner{grid-template-columns:repeat(4, minmax(0,1fr)) !important; gap:4px !important; padding:8px 6px !important;}
    .slip-stat-item .ss-val{font-size:15px !important;} .slip-stat-item .ss-lbl{font-size:8.5px !important;}
    .slip-stat-item .stake-input{width:100%; min-width:0;}
    #studioSlipLegsList{min-height:0 !important; margin-bottom:8px !important;}
    #btnSaveStudioSlip{padding:10px !important; font-size:14px !important;}
  }

/* Match dossier: H2H, team form and league table as compact rows with crests (iko, 2026-10-20). */
.ds-crest{width:16px; height:16px; object-fit:contain; flex:none; display:inline-block;}
.ds-crest-ph{display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:var(--surface-3); color:var(--ink-faint); font:700 9px/1 system-ui,sans-serif;}
.ds-mlist{display:flex; flex-direction:column; gap:3px;}
.ds-mrow{display:grid; grid-template-columns:54px minmax(0,1fr) 38px minmax(0,1fr) 34px; align-items:center; gap:6px; padding:5px 8px; background:var(--surface-3); border:1px solid var(--border); border-radius:6px; font-size:12px; line-height:1.2;}
.ds-date{color:var(--ink-faint); font-size:11px; font-variant-numeric:tabular-nums;}
.ds-team{display:flex; align-items:center; gap:5px; min-width:0; color:var(--ink); font-weight:600;}
.ds-home{justify-content:flex-end; text-align:right;}
.ds-tn{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.ds-score{text-align:center; color:var(--accent); font-variant-numeric:tabular-nums; white-space:nowrap;}
.ds-tag{justify-self:end; font-size:10px; font-weight:800; padding:2px 4px; border-radius:4px; white-space:nowrap;}
.ds-tag.w{background:rgba(16,185,129,.2); color:var(--win);} .ds-tag.l{background:rgba(239,68,68,.2); color:var(--loss);} .ds-tag.d{background:rgba(245,158,11,.2); color:var(--draw);}
.ds-tag-sq{width:18px; text-align:center; padding:2px 0;}
.ds-form-box{background:var(--surface-2); padding:8px; border-radius:8px; border:1px solid var(--border);}
.ds-form-h{display:flex; align-items:center; gap:6px; font-size:12px; font-weight:700; margin-bottom:6px;}
.ds-form-box .ds-mrow{grid-template-columns:50px minmax(0,1fr) 34px minmax(0,1fr) 18px; padding:4px 6px; font-size:11.5px;}
.lt-tbl{width:100%; border-collapse:collapse; font-size:12px; margin-top:8px; table-layout:auto;}
.lt-tbl th{color:var(--ink-faint); font-weight:700; font-size:11px; padding:5px 3px; text-align:center; border-bottom:1px solid var(--border);}
.lt-tbl td{padding:5px 3px; text-align:center; border-bottom:1px solid var(--border); font-variant-numeric:tabular-nums; white-space:nowrap;}
.lt-tbl .lt-rank{width:22px; color:var(--ink-faint);}
.lt-tbl .lt-team{text-align:left; width:100%; max-width:0;}
.lt-tbl .lt-pts{color:var(--brand); font-weight:800;}
.lt-tbl tr.is-match td{background:rgba(56,189,248,.12); font-weight:800;}
.lt-tbl tr.is-match td:first-child{box-shadow:inset 3px 0 0 var(--brand);}
@media (max-width:720px){
  .ds-mrow{grid-template-columns:50px minmax(0,1fr) 34px minmax(0,1fr) 34px; gap:5px; padding:5px 6px;}
  .lt-tbl{font-size:12px;} .lt-tbl th, .lt-tbl td{padding:5px 3px;} .lt-tbl th:not(.lt-team), .lt-tbl td:not(.lt-team){min-width:16px;}
  .lt-tbl .lt-ay{display:none;}
}

  /* ============ Canlı Maçlar: alt sekme şeridi, ayrıntıdaki olay/istatistik/pazar tabloları ve Canlı Model sekmesi (lvc-) ============ */
  #panel-canli .lv-subtabs{flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch;}
  #panel-canli .lv-subtabs::-webkit-scrollbar{display:none;}
  #panel-canli .lv-subtabs button{flex:none; min-height:40px;}
  .lvc-muted{font-size:11.5px; color:var(--ink-dim); line-height:1.45; margin:6px 0 0;}
  .lvc-why{margin:0; padding-left:18px; font-size:12.5px; line-height:1.5; color:var(--ink-dim);} .lvc-why li.chg{color:var(--ink); font-weight:600;} .lvc-why li.qn{color:var(--draw);}
  .lvc-evs{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px;}
  .lvc-ev{display:grid; grid-template-columns:42px 22px minmax(0,1fr); align-items:center; gap:6px; padding:5px 0; font-size:12.5px; border-bottom:1px dashed var(--border);}
  .lvc-ev:last-child{border-bottom:0;} .lvc-ev.goal .lvc-et{font-weight:700; color:var(--ink);}
  .lvc-em{color:var(--ink-dim); font-variant-numeric:tabular-nums;} .lvc-ei{text-align:center;}
  .lvc-et{color:var(--ink-dim); min-width:0; overflow-wrap:anywhere;} .lvc-et small{display:block; font-size:10.5px; color:var(--ink-faint);}
  .lvc-ev.a .lvc-et{text-align:right;} .lvc-ev.a{grid-template-columns:42px minmax(0,1fr) 22px;} .lvc-ev.a .lvc-ei{order:3;} .lvc-ev.a .lvc-et{order:2;}
  .lvc-yc,.lvc-rc{display:inline-block; width:10px; height:14px; border-radius:2px; background:#facc15; vertical-align:middle;} .lvc-rc{background:#ef4444;}
  .lvc-stats{display:flex; flex-direction:column; gap:8px;}
  .lvx-stg{margin:14px 0 8px; font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-dim);}
  .lvx-sec h4 + .lvx-stg{margin-top:4px;}
  .lvc-st{display:grid; grid-template-columns:44px minmax(0,1fr) 44px; align-items:center; font-size:12.5px; row-gap:3px;}
  .lvc-st b{font-variant-numeric:tabular-nums;} .lvc-st b:last-of-type{text-align:right;} .lvc-st span{text-align:center; color:var(--ink-dim);}
  .lvc-stbar{grid-column:1/-1; height:4px; border-radius:3px; background:var(--accent); overflow:hidden;} .lvc-stbar i{display:block; height:100%; background:var(--brand);}
  .lvc-mt{width:100%; border-collapse:collapse; font-size:12px; font-variant-numeric:tabular-nums;}
  .lvc-mt th{font-weight:700; color:var(--ink-dim); text-align:right; padding:5px 4px; border-bottom:1px solid var(--border); font-size:11px;} .lvc-mt th small{display:block; font-weight:500; color:var(--ink-faint);}
  .lvc-mt td{text-align:right; padding:6px 4px; border-bottom:1px solid var(--border);} .lvc-mt th:first-child,.lvc-mt td:first-child{text-align:left;}
  .lvc-mt td.pos{color:var(--win);} .lvc-mt td.neg{color:var(--loss);}
  .lvc-rec{display:flex; flex-direction:column; gap:3px; margin-top:10px; padding:10px 12px; border-radius:12px; font-size:12.5px;}
  .lvc-rec.no{background:var(--surface-2); border:1px solid var(--border); color:var(--ink-dim);} .lvc-rec.no b{color:var(--ink); letter-spacing:.5px;}
  .lvc-rec.pick{background:rgba(16,185,129,.1); border:1px solid var(--brand); color:var(--ink);}
  /* Canlı Model sekmesi */
  .lvc-card-box{background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:12px; margin-bottom:12px; overflow-x:auto;}
  .lvc-card-box h4,.lvc-h4{font-size:15px; margin-bottom:8px;} .lvc-card-box h5{font-size:13px; margin:12px 0 6px;}
  .lvc-kv{display:flex; flex-wrap:wrap; gap:6px 14px; font-size:12px; color:var(--ink-dim);} .lvc-kv b{color:var(--ink);}
  .lvc-vgrid{display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:10px; margin-bottom:12px;}
  .lvc-vc{background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:12px; font-size:12.5px; min-width:0;}
  .lvc-vc p{margin:6px 0 0; color:var(--ink-dim);} .lvc-vc details{margin-top:6px; font-size:12px;}
  .lvc-vh{display:flex; align-items:center; gap:8px; justify-content:space-between;} .lvc-vh b{overflow-wrap:anywhere;}
  .lvc-badge{font-size:11px; font-weight:800; padding:2px 8px; border-radius:999px; white-space:nowrap;}
  .lvc-badge.ok{background:rgba(16,185,129,.15); color:var(--win);} .lvc-badge.mute{background:var(--surface-3); color:var(--ink-dim);} .lvc-badge.warn{background:rgba(245,158,11,.14); color:var(--draw);}
  /* Canlı Maçlar (lvx-): skorbord kartları, maç çizgisi, tam ekran ayrıntı. Renkler temadan (--brand, --accent, --loss). */
  #lvTabMatches{--lvx-card:color-mix(in srgb, var(--surface) 82%, var(--bg)); --lvx-soft:color-mix(in srgb, var(--ink) 6%, transparent); --lvx-line:color-mix(in srgb, var(--ink) 9%, transparent);}
  .lvx-head{margin:0 -4px 4px; padding:14px 14px 12px; border-radius:18px; background:radial-gradient(120% 140% at 0% 0%, color-mix(in srgb, var(--brand) 22%, transparent), transparent 60%), var(--lvx-card); border:1px solid var(--lvx-line);}
  .lvx-top{display:flex; align-items:center; gap:10px;}
  .lvx-top h3{font-size:30px; font-weight:800; line-height:1; margin:0;}
  .lvx-pulse{flex:none; width:10px; height:10px; border-radius:50%; background:#ff3b3b; animation:lvxPulse 1.6s infinite;}
  .lvx-pulse.off{background:var(--ink-faint); animation:none;}
  @keyframes lvxPulse{0%{box-shadow:0 0 0 0 rgba(255,59,59,.55);}70%{box-shadow:0 0 0 8px rgba(255,59,59,0);}100%{box-shadow:0 0 0 0 rgba(255,59,59,0);}}
  .lvx-fresh{margin-left:auto; text-align:right; font-size:12px; line-height:1.35; color:var(--ink-dim); min-width:0;}
  .lvx-fresh b{color:var(--ink); font-weight:700;}
  .lvx-fresh.warn span{color:var(--draw);} .lvx-fresh.bad span{color:var(--loss);}
  .lvx-ibtn{flex:none; width:38px; height:38px; border-radius:11px; border:1px solid var(--lvx-line); background:var(--lvx-soft); color:var(--ink-dim); font-size:17px; display:grid; place-items:center; cursor:pointer;}
  .lvx-ibtn.on{color:var(--brand); border-color:var(--brand);}
  .lvx-kpis{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:12px;}
  .lvx-kpis div{background:var(--lvx-soft); border:1px solid var(--lvx-line); border-radius:12px; padding:8px 10px; min-width:0;}
  .lvx-kpis b{display:block; font:700 22px/1 'Barlow Condensed',sans-serif; font-variant-numeric:tabular-nums;}
  .lvx-kpis .red b{color:var(--loss);}
  .lvx-kpis span{display:block; font-size:11px; color:var(--ink-dim); margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .lvx-filters{position:sticky; top:0; z-index:4; margin:0 -4px 6px; background:color-mix(in srgb, var(--bg) 92%, transparent); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);}
  .lvx-seg{display:flex; align-items:center; gap:6px; border-bottom:1px solid var(--lvx-line);}
  .lvx-tabs{display:flex; flex:1; min-width:0; overflow-x:auto; scrollbar-width:none;}
  .lvx-tabs::-webkit-scrollbar{display:none;}
  .lvx-tabs button{flex:none; min-height:44px; padding:0 10px; border:0; border-bottom:2px solid transparent; background:none; color:var(--ink-dim); font:600 14px 'Barlow',sans-serif; cursor:pointer; white-space:nowrap;}
  .lvx-tabs button small{font-size:11px; color:var(--ink-faint); margin-left:4px;}
  .lvx-tabs button.on{color:var(--ink); border-bottom-color:var(--brand);}
  .lvx-lgsel{display:flex; align-items:center; gap:6px; padding:8px 4px 0; font-size:12.5px; color:var(--ink-dim);}
  .lvx-lgsel b{color:var(--ink); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .lvx-lgsel button{margin-left:auto; flex:none; border:0; background:none; color:var(--brand); font:600 12.5px 'Barlow',sans-serif; cursor:pointer; min-height:32px;}
  .lvx-lgs{display:flex; flex-wrap:wrap; gap:6px; padding:10px 2px 4px;}
  .lvx-lgs button{display:inline-flex; align-items:center; gap:6px; min-height:36px; padding:0 12px; border-radius:10px; border:1px solid var(--lvx-line); background:var(--lvx-soft); color:var(--ink); font:600 13px 'Barlow',sans-serif; cursor:pointer; max-width:100%;}
  .lvx-lgs button.on{border-color:var(--brand); color:var(--brand);}
  .lvx-lgs button small{color:var(--ink-faint);} .lvx-lgs img{width:16px; height:12px; object-fit:cover; border-radius:2px;}
  .lvx-note{font-size:12px; padding:8px 10px; border-radius:10px; margin:6px 0; border:1px solid rgba(245,158,11,.45); background:rgba(245,158,11,.08); color:var(--ink);}
  .lvx-lh{display:flex; align-items:center; gap:8px; width:100%; min-height:44px; padding:10px 4px 6px; border:0; background:none; color:var(--ink-dim); font:600 13px 'Barlow',sans-serif; text-align:left; cursor:pointer;}
  .lvx-lh b{color:var(--ink);}
  .lvx-flag{width:18px; height:13px; object-fit:cover; border-radius:2px; flex:none;}
  .lvx-llogo{width:20px; height:20px; object-fit:contain; flex:none; display:inline-flex; align-items:center; justify-content:center; font-size:13px;}
  .lvx-ln{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .lvx-lc{flex:none; font-size:12px; color:var(--ink-faint);} .lvx-lc i{display:inline-block; font-style:normal; transition:transform .15s;}
  .lvx-league.closed .lvx-lc i{transform:rotate(-90deg);}
  .lvx-m{position:relative; margin:0 0 10px; padding:12px 12px 10px; border-radius:18px; background:linear-gradient(180deg, var(--lvx-card), color-mix(in srgb, var(--lvx-card) 70%, var(--bg))); border:1px solid var(--lvx-line); cursor:pointer; overflow:hidden; transition:border-color .15s;}
  .lvx-m:hover{border-color:var(--border-highlight);}
  .lvx-m:focus-visible{outline:2px solid var(--brand); outline-offset:2px;}
  .lvx-m.goal{border-color:color-mix(in srgb, var(--brand) 60%, transparent); box-shadow:0 10px 30px -14px var(--brand);}
  .lvx-m.goal::before{content:'GOL'; position:absolute; top:0; left:50%; transform:translateX(-50%); padding:2px 10px; border-radius:0 0 8px 8px; background:var(--brand); color:var(--bg); font:800 11px 'Barlow Condensed',sans-serif; letter-spacing:1.5px;}
  .lvx-sk{cursor:default;} .lvx-sk .sk{display:block;}
  .lvx-row,.lvx-board{display:grid; grid-template-columns:minmax(0,1fr) 104px minmax(0,1fr); align-items:start; gap:4px;}
  .lvx-tm{display:flex; flex-direction:column; align-items:center; gap:6px; text-align:center; min-width:0;}
  .lvx-crw{position:relative; display:inline-flex;}
  .lvx-cr{width:38px; height:38px; object-fit:contain; flex:none;}
  .lvx-cr.lg{width:56px; height:56px;}
  .lvx-cr-none{display:inline-block; border-radius:50%; background:var(--surface-3);}
  .lvx-rc{position:absolute; top:-2px; right:-7px; min-width:10px; height:14px; padding:0 2px; border-radius:2px; background:var(--loss); color:#fff; font:800 9px/14px 'Barlow',sans-serif; text-align:center; box-shadow:0 0 0 2px var(--lvx-card);}
  .lvx-tn{font-size:13.5px; font-weight:600; line-height:1.2; overflow-wrap:anywhere; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; max-width:100%;}
  .lvx-mid{display:flex; flex-direction:column; align-items:center; gap:6px; padding-top:2px; min-width:0;}
  .lvx-sc{font:800 40px/.9 'Barlow Condensed',sans-serif; letter-spacing:1px; font-variant-numeric:tabular-nums; white-space:nowrap;}
  .lvx-sc.lg{font-size:52px;}
  .lvx-sc i{font-style:normal; font-weight:600; color:var(--ink-faint); margin:0 4px;}
  .lvx-clock{display:inline-flex; align-items:center; gap:6px; font:700 13px 'Barlow Condensed',sans-serif; letter-spacing:.4px; color:var(--ink-dim); white-space:nowrap;}
  .lvx-clock svg circle{fill:none; stroke-width:3;} .lvx-clock .tr{stroke:var(--lvx-line);} .lvx-clock .pg{stroke:currentColor; stroke-linecap:round;}
  .lvx-clock.live{color:var(--brand);} .lvx-clock.ht{color:var(--accent);}
  .lvx-fav{position:absolute; top:4px; right:4px; z-index:1; width:40px; height:40px; border:0; background:none; color:var(--ink-faint); font-size:17px; cursor:pointer;}
  .lvx-fav.on{color:#fbbf24;}
  .lvx-line{position:relative; height:26px; margin:10px 4px 2px;}
  .lvx-line i{position:absolute; display:block; font-style:normal;}
  .lvx-line .tr{left:0; right:0; top:12px; height:3px; border-radius:2px; background:var(--lvx-line);}
  .lvx-line .el{left:0; top:12px; height:3px; border-radius:2px; background:linear-gradient(90deg, color-mix(in srgb, var(--brand) 25%, transparent), var(--brand));}
  .lvx-line .half{top:9px; width:1px; height:9px; background:color-mix(in srgb, var(--ink) 25%, transparent);}
  .lvx-line .now{top:8px; width:11px; height:11px; margin-left:-5px; border-radius:50%; background:var(--brand); box-shadow:0 0 0 4px color-mix(in srgb, var(--brand) 20%, transparent);}
  .lvx-line .now.ht{background:var(--accent); box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 20%, transparent);}
  .lvx-line .ev{width:8px; height:8px; margin-left:-4px; border-radius:50%; background:var(--ink);}
  .lvx-line .ev.h{top:0;} .lvx-line .ev.a{top:18px;}
  .lvx-line .ev.og{background:none; box-shadow:inset 0 0 0 2px var(--ink);}
  .lvx-line .ev.r{width:6px; margin-left:-3px; border-radius:1px; background:var(--loss);}
  .lvx-pr{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; margin-top:6px;}
  .lvx-pc{display:flex; align-items:baseline; justify-content:space-between; gap:4px; padding:6px 8px; border-radius:10px; background:var(--lvx-soft); min-width:0;}
  .lvx-pc small{font-size:11px; color:var(--ink-dim);}
  .lvx-pc b{font:700 17px 'Barlow Condensed',sans-serif; font-variant-numeric:tabular-nums;}
  .lvx-pc em{font-style:normal; font-size:10px; margin-left:2px;}
  .lvx-pc.fav{background:color-mix(in srgb, var(--brand) 16%, transparent); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--brand) 45%, transparent);}
  .lvx-pc.fav b{color:var(--brand);}
  #lvTabMatches .up,#lvcSheet .up{color:var(--win);} #lvTabMatches .dn,#lvcSheet .dn{color:var(--loss);}
  .lvx-np{margin-top:8px; padding:8px 10px; border-radius:10px; border:1px dashed var(--lvx-line); background:var(--lvx-soft); font-size:12px; color:var(--ink-dim);}
  .lvx-np.big{display:flex; flex-direction:column; gap:4px; margin:0; padding:12px; font-size:12.5px;} .lvx-np.big b{color:var(--ink); font-size:14px;}
  .lvx-ft{display:flex; align-items:center; flex-wrap:wrap; gap:4px 10px; margin-top:8px; font-size:11.5px; color:var(--ink-faint);}
  .lvx-ft b{color:var(--ink);}
  .lvx-fr{margin-left:auto; display:inline-flex; align-items:center; gap:5px;}
  .lvx-fr i{width:6px; height:6px; border-radius:50%; background:var(--win);}
  .lvx-fr.warn i{background:var(--draw);} .lvx-fr.bad i{background:var(--loss);}
  .lvx-empty{display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; padding:34px 16px; margin-top:6px; border-radius:18px; border:1px dashed var(--lvx-line, var(--border)); color:var(--ink-dim); font-size:13px;}
  .lvx-empty b{color:var(--ink); font-size:16px;}
  .lvx-eico{font-size:28px; opacity:.8;}
  .lvx-sub{font-size:11.5px; color:var(--ink-faint);}
  .lvx-btn{min-height:42px; padding:0 18px; border-radius:12px; border:0; background:var(--brand); color:var(--bg); font:700 14px 'Barlow',sans-serif; cursor:pointer;}
  .lvx-foot{font-size:11px; color:var(--ink-faint); margin:10px 2px 0;}
  .lvx-muted{font-size:11.5px; color:var(--ink-dim); line-height:1.45; margin:6px 0 0;}
  /* Ayrıntı: telefonda tam ekran, geniş ekranda ortada */
  body.lvc-lock{overflow:hidden;}
  .lvc-sheet{position:fixed; inset:0; z-index:1200; display:flex; justify-content:center;}
  .lvc-sheet[hidden]{display:none;}
  .lvc-sheet-bg{position:absolute; inset:0; background:rgba(0,0,0,.6);}
  .lvc-sheet-card{--lvx-card:color-mix(in srgb, var(--surface) 82%, var(--bg)); --lvx-soft:color-mix(in srgb, var(--ink) 6%, transparent); --lvx-line:color-mix(in srgb, var(--ink) 9%, transparent); position:relative; width:100%; max-width:640px; height:100%; overflow-y:auto; overscroll-behavior:contain; background:var(--bg); padding-bottom:calc(16px + env(safe-area-inset-bottom)); animation:lvxIn .18s ease-out;}
  @keyframes lvxIn{from{transform:translateY(16px); opacity:.6;}to{transform:none; opacity:1;}}
  @media(min-width:760px){.lvc-sheet{align-items:center;} .lvc-sheet-card{height:auto; max-height:90vh; border-radius:20px; border:1px solid var(--border);}}
  @media(prefers-reduced-motion:reduce){.lvc-sheet-card{animation:none;} .lvx-pulse{animation:none;}}
  .lvx-hero{padding:calc(10px + env(safe-area-inset-top)) 16px 16px; background:radial-gradient(90% 120% at 15% 0%, color-mix(in srgb, var(--brand) 20%, transparent), transparent 55%), radial-gradient(90% 120% at 85% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 55%), var(--lvx-card);}
  .lvx-hbar{display:flex; align-items:center; gap:10px; font-size:13px; color:var(--ink-dim); min-width:0;}
  .lvx-back,.lvx-hfav{flex:none; width:40px; height:40px; border-radius:12px; border:0; background:var(--lvx-soft); color:var(--ink); font-size:22px; line-height:1; cursor:pointer;}
  .lvx-hfav{margin-left:auto; background:none; font-size:20px; color:var(--ink-faint);} .lvx-hfav.on{color:#fbbf24;}
  .lvx-hl{display:inline-flex; align-items:center; gap:6px; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .lvx-hl img{width:18px; height:13px; object-fit:cover; border-radius:2px;}
  .lvx-board{grid-template-columns:minmax(0,1fr) 120px minmax(0,1fr); align-items:center; margin-top:14px;}
  .lvx-board .lvx-tn{font-size:14.5px;}
  .lvx-board .lvx-mid small{font-size:12px; color:var(--ink-faint);}
  .lvx-minpill{display:inline-flex; align-items:center; gap:6px; padding:3px 10px; border-radius:99px; background:var(--lvx-soft); color:var(--ink-dim); font:700 14px 'Barlow Condensed',sans-serif; letter-spacing:.5px; white-space:nowrap;}
  .lvx-minpill.live{background:color-mix(in srgb, var(--brand) 15%, transparent); color:var(--brand);}
  .lvx-minpill.live::before{content:''; width:7px; height:7px; border-radius:50%; background:currentColor;}
  .lvx-minpill.ht{background:color-mix(in srgb, var(--accent) 15%, transparent); color:var(--accent);}
  .lvx-scorers{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px; font-size:12px; color:var(--ink-dim); line-height:1.4;}
  .lvx-scorers span:last-child{text-align:right;}
  .lvx-dtabs{position:sticky; top:0; z-index:2; display:flex; background:color-mix(in srgb, var(--bg) 94%, transparent); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border-bottom:1px solid var(--lvx-line);}
  .lvx-dtabs button{flex:1; min-height:46px; border:0; border-bottom:2px solid transparent; background:none; color:var(--ink-dim); font:600 14px 'Barlow',sans-serif; cursor:pointer;}
  .lvx-dtabs button small{font-size:11px; color:var(--ink-faint);}
  .lvx-dtabs button.on{color:var(--ink); border-bottom-color:var(--brand);}
  .lvx-sec{padding:14px 16px 4px;}
  .lvx-sec h4{font:700 14px 'Barlow Condensed',sans-serif; letter-spacing:.7px; text-transform:uppercase; color:var(--ink-dim); margin:0 0 10px;}
  .lvx-big3{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px;}
  .lvx-big3 > div{padding:10px; border-radius:14px; background:var(--lvx-card); border:1px solid var(--lvx-line); min-width:0;}
  .lvx-big3 > div.fav{border-color:color-mix(in srgb, var(--brand) 50%, transparent);}
  .lvx-big3 span{display:flex; align-items:center; gap:6px; font-size:12px; color:var(--ink-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .lvx-big3 span i{flex:none; width:8px; height:8px; border-radius:2px;}
  .lvx-big3 .h i{background:var(--brand);} .lvx-big3 .d i{background:var(--ink-faint);} .lvx-big3 .a i{background:var(--accent);}
  .lvx-big3 b{display:block; font:800 30px/1.1 'Barlow Condensed',sans-serif; font-variant-numeric:tabular-nums; margin-top:2px;}
  .lvx-big3 small{display:block; font-size:12px; white-space:nowrap;}
  .lvx-chart{margin:10px 0 0; padding:10px 8px 6px; border-radius:14px; background:var(--lvx-card); border:1px solid var(--lvx-line);}
  .lvx-chart svg{display:block; width:100%; height:auto;}
  .lvx-chart .g{stroke:var(--lvx-line);}
  .lvx-chart path.h{fill:var(--brand); opacity:.85;} .lvx-chart path.d{fill:var(--ink-faint); opacity:.7;} .lvx-chart path.a{fill:var(--accent); opacity:.85;}
  .lvx-chart .rest{fill:var(--lvx-soft);}
  .lvx-chart .half{stroke:color-mix(in srgb, var(--ink) 30%, transparent); stroke-dasharray:2 3;}
  .lvx-chart line.gl{stroke:var(--ink); stroke-width:1;} .lvx-chart circle.gl{fill:var(--ink);}
  .lvx-chart .rc{fill:var(--loss);}
  .lvx-chart text{fill:var(--ink-faint); font:10px 'Barlow',sans-serif;}
  .lvx-chart figcaption{display:flex; flex-wrap:wrap; gap:6px 12px; padding:6px 4px 2px; font-size:11px; color:var(--ink-dim);}
  .lvx-chart figcaption span::before{content:''; display:inline-block; width:8px; height:8px; border-radius:2px; margin-right:4px; vertical-align:-1px;}
  .lvx-chart figcaption .h::before{background:var(--brand);} .lvx-chart figcaption .d::before{background:var(--ink-faint);} .lvx-chart figcaption .a::before{background:var(--accent);}
  .lvx-chart figcaption .k{margin-left:auto;} .lvx-chart figcaption .k::before{display:none;}
  .lvx-mk{display:flex; flex-wrap:wrap; gap:6px; margin-top:10px;}
  .lvx-mk span{font-size:12px; color:var(--ink-dim); background:var(--lvx-soft); border-radius:9px; padding:6px 9px;} .lvx-mk b{color:var(--ink);}
  .lvx-why{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px;}
  .lvx-why li{padding:10px 12px; border-radius:12px; background:var(--lvx-card); border-left:3px solid var(--lvx-line); font-size:13px; line-height:1.4; color:var(--ink-dim);}
  .lvx-why li.chg{color:var(--ink); border-left-color:var(--brand);} .lvx-why li.qn{border-left-color:var(--draw);}
  .lvx-na{color:var(--ink-faint); font-size:11px;}
  .lvx-rec{padding:12px 14px; border-radius:14px; background:repeating-linear-gradient(135deg, var(--lvx-soft) 0 8px, transparent 8px 16px), var(--lvx-card); border:1px solid var(--lvx-line);}
  .lvx-rec b{font:800 18px 'Barlow Condensed',sans-serif; letter-spacing:1px;}
  .lvx-rec p{margin:4px 0 0; font-size:12.5px; line-height:1.4; color:var(--ink-dim);}
  .lvx-rec.pick{background:color-mix(in srgb, var(--brand) 10%, transparent); border-color:var(--brand);}
  .lvx-meta{display:flex; flex-wrap:wrap; gap:6px; padding:14px 16px 0;}
  .lvx-meta span{font-size:11.5px; padding:4px 9px; border-radius:99px; background:var(--lvx-soft); color:var(--ink-dim);}
  .lvx-meta .ok{color:var(--win);} .lvx-meta .warn{color:var(--draw);} .lvx-meta .bad{color:var(--loss);}
  #lvcSheet .lvc-evs,#lvcSheet .lvc-stats{margin-top:2px;}
  #lvcSheet .lvx-foot{padding:0 16px;}
  @media(max-width:380px){
    .lvx-row{grid-template-columns:minmax(0,1fr) 92px minmax(0,1fr);} .lvx-sc{font-size:36px;}
    .lvx-board{grid-template-columns:minmax(0,1fr) 104px minmax(0,1fr);} .lvx-sc.lg{font-size:46px;}
    .lvx-pc{padding:6px;} .lvx-tabs button{padding:0 8px;}
  }

  /* ============ Canlı sekmesi bakım ekranı (#maintScreen, services/maintenance.ts) ============ */
  #panel-canli.mt-on > :not(#maintScreen){display:none !important;}
  #maintScreen{position:relative; min-height:calc(100vh - 220px); min-height:calc(100dvh - 220px); border-radius:22px; overflow:hidden; display:flex; align-items:center; justify-content:center; padding:32px 16px 48px; color:#eef6f1; font-family:'Barlow',sans-serif; background:radial-gradient(120% 80% at 50% 0%, #0f3b26 0%, #07140d 55%, #040a07 100%);}
  #maintScreen[hidden]{display:none;}
  .mt-sky{position:absolute; inset:0; pointer-events:none;}
  .mt-sky i{position:absolute; bottom:-10px; width:4px; height:4px; border-radius:50%; background:#34d399; opacity:0; animation:mtRise 9s linear infinite;}
  .mt-sky i:nth-child(1){left:6%; animation-delay:0s;} .mt-sky i:nth-child(2){left:15%; animation-delay:2.5s; width:3px; height:3px;}
  .mt-sky i:nth-child(3){left:24%; animation-delay:5s;} .mt-sky i:nth-child(4){left:33%; animation-delay:1.2s; background:#fbbf24;}
  .mt-sky i:nth-child(5){left:44%; animation-delay:6.4s; width:3px; height:3px;} .mt-sky i:nth-child(6){left:53%; animation-delay:3.3s;}
  .mt-sky i:nth-child(7){left:62%; animation-delay:7.6s; background:#fbbf24;} .mt-sky i:nth-child(8){left:71%; animation-delay:.6s; width:5px; height:5px;}
  .mt-sky i:nth-child(9){left:79%; animation-delay:4.2s;} .mt-sky i:nth-child(10){left:87%; animation-delay:8.1s; width:3px; height:3px;}
  .mt-sky i:nth-child(11){left:93%; animation-delay:2s; background:#fbbf24;} .mt-sky i:nth-child(12){left:48%; animation-delay:9s;}
  @keyframes mtRise{0%{transform:translateY(0); opacity:0;}10%{opacity:.8;}100%{transform:translateY(-105vh) translateX(20px); opacity:0;}}
  .mt-pitch{position:absolute; left:-20%; right:-20%; bottom:-6%; height:46%; perspective:420px; pointer-events:none; opacity:.55;}
  .mt-lines{position:absolute; inset:0; transform:rotateX(62deg); transform-origin:50% 100%; background-image:linear-gradient(rgba(52,211,153,.28) 2px, transparent 2px), linear-gradient(90deg, rgba(52,211,153,.18) 2px, transparent 2px); background-size:100% 54px, 80px 100%; animation:mtRun 2.4s linear infinite; mask-image:linear-gradient(to top, #000 30%, transparent); -webkit-mask-image:linear-gradient(to top, #000 30%, transparent);}
  @keyframes mtRun{to{background-position:0 54px, 0 0;}}
  .mt-wrap{position:relative; width:100%; max-width:440px; text-align:center; display:flex; flex-direction:column; align-items:center;}
  .mt-brand{font:800 15px 'Barlow Condensed',sans-serif; letter-spacing:5px; color:#6ee7b7; opacity:.9;}
  .mt-stage{position:relative; width:220px; height:200px; margin:18px 0 8px;}
  .mt-gear{position:absolute; fill:none;}
  .mt-gear .t{stroke:rgba(52,211,153,.35); stroke-width:12; stroke-dasharray:9 7;}
  .mt-gear .r{stroke:rgba(52,211,153,.25); stroke-width:4;}
  .mt-gear .h{fill:rgba(52,211,153,.25);}
  .mt-gear.g1{width:120px; height:120px; left:4px; top:6px; animation:mtSpin 9s linear infinite;}
  .mt-gear.g2{width:84px; height:84px; right:12px; top:0; animation:mtSpin 6.3s linear infinite reverse;}
  .mt-gear.g2 .t{stroke:rgba(251,191,36,.35);} .mt-gear.g2 .r{stroke:rgba(251,191,36,.25);} .mt-gear.g2 .h{fill:rgba(251,191,36,.3);}
  @keyframes mtSpin{to{transform:rotate(360deg);}}
  .mt-ballwrap{position:absolute; left:50%; top:30px; width:70px; height:70px; margin-left:-35px; animation:mtBounce 1.1s cubic-bezier(.5,0,.5,1) infinite alternate;}
  .mt-ball{width:100%; height:100%; animation:mtRoll 2.2s linear infinite; filter:drop-shadow(0 6px 14px rgba(0,0,0,.45));}
  .mt-ball .b{fill:#f8fafc;} .mt-ball .p{fill:#0b1a12;} .mt-ball .s{stroke:#0b1a12; stroke-width:3; fill:none;}
  @keyframes mtBounce{0%{transform:translateY(0);}100%{transform:translateY(92px);}}
  @keyframes mtRoll{to{transform:rotate(360deg);}}
  .mt-shadow{position:absolute; left:50%; bottom:6px; width:70px; height:12px; margin-left:-35px; border-radius:50%; background:rgba(0,0,0,.55); filter:blur(3px); animation:mtShadow 1.1s cubic-bezier(.5,0,.5,1) infinite alternate;}
  @keyframes mtShadow{0%{transform:scale(.45); opacity:.35;}100%{transform:scale(1); opacity:.8;}}
  .mt-title{margin:6px 0 0; font:800 46px/1 'Barlow Condensed',sans-serif; letter-spacing:1px; background:linear-gradient(90deg, #eef6f1 0%, #6ee7b7 25%, #fbbf24 50%, #6ee7b7 75%, #eef6f1 100%); background-size:200% 100%; -webkit-background-clip:text; background-clip:text; color:transparent; animation:mtShine 4s linear infinite;}
  @keyframes mtShine{to{background-position:-200% 0;}}
  .mt-sub{margin:12px 0 0; font-size:15px; line-height:1.5; color:#b6cbbd; max-width:340px;}
  .mt-bar{position:relative; width:220px; height:6px; margin:22px 0 0; border-radius:99px; background:rgba(255,255,255,.08); overflow:hidden;}
  .mt-bar i{position:absolute; top:0; bottom:0; width:40%; border-radius:99px; background:linear-gradient(90deg, transparent, #34d399, #fbbf24); animation:mtLoad 1.8s ease-in-out infinite;}
  @keyframes mtLoad{0%{left:-40%;}100%{left:100%;}}
  .mt-work{margin:12px 0 0; font-size:13px; color:#7f9a88; letter-spacing:.4px;}
  .mt-dots i{font-style:normal; animation:mtDot 1.4s infinite;} .mt-dots i:nth-child(2){animation-delay:.2s;} .mt-dots i:nth-child(3){animation-delay:.4s;}
  @keyframes mtDot{0%,60%,100%{opacity:.2;}30%{opacity:1;}}
  .mt-msg{min-height:18px; margin:10px 0 0; font-size:13px; color:#fbbf24;}
  @media(max-width:380px){.mt-title{font-size:40px;} .mt-stage{transform:scale(.88); margin:8px 0 0;}}
  @media(prefers-reduced-motion:reduce){#maintScreen *{animation:none !important;} .mt-sky{display:none;}}
  #maintAdminBar{display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; padding:8px 24px; font-size:12.5px; background:rgba(245,158,11,.12); border-bottom:1px solid rgba(245,158,11,.35); color:var(--ink);}
  #maintAdminBar .btn,.mt-adminrow .btn{font-size:12px; padding:6px 12px;}
  .mt-adminrow{display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; padding:10px 12px; margin-bottom:14px; border-radius:12px; background:var(--surface-2); border:1px solid var(--border); font-size:13px;}

  /* Canlı > Sinyaller & Geçmiş: Canlı Maçlar'daki kart diliyle aynı, mobilde kısa (2026-10-23). */
  #lvTabSignals{--lvx-card:color-mix(in srgb, var(--surface) 82%, var(--bg)); --lvx-soft:color-mix(in srgb, var(--ink) 6%, transparent); --lvx-line:color-mix(in srgb, var(--ink) 9%, transparent);}
  .lvs-head{padding:12px 14px; border-radius:16px; background:radial-gradient(120% 140% at 0% 0%, color-mix(in srgb, var(--brand) 18%, transparent), transparent 60%), var(--lvx-card); border:1px solid var(--lvx-line); margin-bottom:12px;}
  .lvs-status{display:flex; align-items:center; gap:10px; min-width:0;}
  .lvs-txt{display:flex; flex-direction:column; min-width:0; flex:1; font-size:14px; line-height:1.3;}
  .lvs-txt b{font-weight:800;}
  .lvs-txt small{font-size:12px; color:var(--ink-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .lvs-tbtn{flex:none; min-height:36px; padding:0 12px; border-radius:11px; border:1px solid color-mix(in srgb, var(--loss) 55%, transparent); background:color-mix(in srgb, var(--loss) 10%, transparent); color:var(--loss); font-size:13px; font-weight:700; cursor:pointer;}
  .lvs-tbtn.on{border-color:color-mix(in srgb, var(--brand) 55%, transparent); background:color-mix(in srgb, var(--brand) 12%, transparent); color:var(--brand);}
  .lvs-info{margin-top:10px; border-top:1px solid var(--lvx-line); padding-top:8px;}
  .lvs-info summary{cursor:pointer; font-size:12.5px; color:var(--ink-dim); list-style:none; display:flex; align-items:center; gap:6px; min-height:28px;}
  .lvs-info summary::-webkit-details-marker{display:none;}
  .lvs-info summary::before{content:'ⓘ'; font-size:14px;}
  .lvs-info summary::after{content:'▾'; margin-left:auto; transition:transform .2s;}
  .lvs-info[open] summary::after{transform:rotate(180deg);}
  .lvs-info p{margin:6px 0 2px; font-size:12.5px; line-height:1.5; color:var(--ink-dim);}
  .lvs-sec{padding:12px 12px 6px; border-radius:16px; background:var(--lvx-card); border:1px solid var(--lvx-line); margin-bottom:12px;}
  .lvs-sec h4{margin:0 0 6px; font-size:12px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-dim); display:flex; align-items:center; gap:8px;}
  .lvs-sec h4 span:not(:empty){font-size:11px; padding:1px 8px; border-radius:999px; background:var(--lvx-soft); color:var(--ink); letter-spacing:0;}
  #lvTabSignals .lv-sig-scroll{max-height:calc(100dvh - 300px); min-height:240px;}
  #lvWatch .lv-row{grid-template-columns:minmax(0,1fr) auto !important;} #lvWatch .lv-row > span:empty{display:none;}
  /* Beyin on the light theme: the hero tiles and the gold accents need more contrast on a pale surface. */
  [data-theme="light"] .br-tile{background:rgba(255,255,255,.7); box-shadow:inset 0 0 0 1px rgba(15,23,42,.08);}
  [data-theme="light"] .bc-ticket.day .bc-k, [data-theme="light"] .bc-ticket.day .bc-f b{color:#b7791f;}
  [data-theme="light"] .bc-ticket.sec .bc-k, [data-theme="light"] .bc-ticket.sec .bc-f b{color:#0369a1;}
  [data-theme="light"] .bc-ticket, [data-theme="light"] .br-hero{box-shadow:0 6px 18px rgba(15,23,42,.08);}
  [data-theme="light"] .lab-row.champ b, [data-theme="light"] .lab-h b, [data-theme="light"] .bcs-chip.on, [data-theme="light"] .bc-seg button.on{color:#b7791f;}

  /* Maç detayı > Haberler: a compact news list; one column on every width, the source chip row scrolls on a phone. */
  .nw{display:flex; flex-direction:column; gap:10px; font-size:13px;}
  .nw-head{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap;}
  .nw-meta{font-size:11.5px; color:var(--ink-faint); min-width:0;}
  .nw-meta b{color:var(--ink-dim);}
  .nw-btn{font:inherit; font-size:12px; font-weight:800; padding:7px 12px; border-radius:8px; border:1px solid var(--brand); background:var(--brand-tint); color:var(--brand); cursor:pointer; white-space:nowrap; min-height:34px;}
  .nw-btn:disabled{opacity:.55; cursor:default;}
  .nw-run{font-size:12px; color:var(--ink-dim); padding:10px 12px; border:1px dashed var(--border); border-radius:10px;}
  .nw-err{font-size:12px; color:var(--loss); padding:8px 10px; border:1px solid color-mix(in srgb, var(--loss) 35%, transparent); border-radius:8px;}
  .nw-empty{font-size:12px; color:var(--ink-faint); line-height:1.5; margin:0;}
  .nw-sum{font-size:12.5px; line-height:1.5; color:var(--ink); padding:10px 12px; border-left:3px solid var(--brand); background:var(--brand-tint); border-radius:0 8px 8px 0;}
  .nw-chips{display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; margin:0 -2px; padding:0 2px;}
  .nw-chips::-webkit-scrollbar{display:none;}
  .nw-chip{flex:none; font:inherit; font-size:11.5px; font-weight:700; padding:5px 10px; border-radius:999px; border:1px solid var(--border); background:transparent; color:var(--ink-dim); cursor:pointer;}
  .nw-chip i{font-style:normal; opacity:.65; margin-left:2px;}
  .nw-chip.on{border-color:var(--brand); color:var(--brand); background:var(--brand-tint);}
  .nw-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px;}
  .nw-item{display:block; padding:9px 11px; border:1px solid var(--border); border-radius:10px; background:var(--surface); color:inherit; text-decoration:none;}
  .nw-item:hover{border-color:var(--brand);}
  .nw-top{display:flex; align-items:center; gap:6px; font-size:10.5px; margin-bottom:4px; min-width:0;}
  .nw-type{flex:none; font-weight:800; padding:1px 6px; border-radius:4px; background:var(--brand-tint); color:var(--brand); text-transform:uppercase; letter-spacing:.02em;}
  .nw-type.t-resmi{background:color-mix(in srgb, var(--win) 16%, transparent); color:var(--win);}
  .nw-type.t-forum{background:color-mix(in srgb, var(--accent) 18%, transparent); color:var(--accent);}
  .nw-type.t-sosyal{background:color-mix(in srgb, var(--draw) 18%, transparent); color:var(--draw);}
  .nw-topic{flex:none; color:var(--ink-dim); font-weight:700;}
  .nw-site{margin-left:auto; color:var(--ink-faint); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0;}
  .nw-title{display:block; font-size:13px; line-height:1.35; color:var(--ink);}
  .nw-text{margin:3px 0 0; font-size:12px; line-height:1.45; color:var(--ink-dim); display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;}
  .nw-foot{font-size:10.5px; color:var(--ink-faint);}

/* TAHMİN 3.0 (admin only) */
.t3-card { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; margin: 8px 0; font-size: 13px; }
.t3-h { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 4px; }
.t3-dim { color: var(--ink-dim); font-size: 12px; }
.t3-scroll { overflow-x: auto; margin-top: 6px; }
.t3-tbl { border-collapse: collapse; width: 100%; font-size: 12px; white-space: nowrap; }
.t3-tbl th, .t3-tbl td { padding: 4px 6px; border-bottom: 1px solid var(--border); text-align: right; }
.t3-tbl th:first-child, .t3-tbl td:first-child { text-align: left; }
.t3-tbl tr.t3-me td { font-weight: 700; color: var(--accent); }
.t3-ps { display: flex; flex-wrap: wrap; gap: 4px; }
.t3-p { display: inline-flex; flex-direction: column; align-items: center; min-width: 42px; padding: 3px 4px; border-radius: 6px; background: rgba(148,163,184,0.08); font-weight: 700; font-size: 12px; }
.t3-p.on { background: rgba(16,185,129,0.18); outline: 1px solid var(--win); }
.t3-p small { font-weight: 500; color: var(--ink-dim); font-size: 10px; }
.t3-p i { font-style: normal; font-weight: 500; color: var(--ink-dim); font-size: 10px; }
.t3-det { display: flex; flex-direction: column; gap: 5px; padding: 8px 0 2px; font-size: 12.5px; color: var(--ink-dim); }
.t3-det b { color: var(--ink, inherit); }
.t3-more > summary { cursor: pointer; font-size: 12px; color: var(--accent); }
.t3-more > div { margin-top: 3px; }
.t3-sum { display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; margin: 6px 0; }
.t3-stat { display: flex; flex-direction: column; align-items: center; padding: 6px 4px; border-radius: 8px; background: rgba(148,163,184,0.08); font-size: 11.5px; color: var(--ink-dim); text-align: center; }
.t3-stat b { font-size: 20px; color: var(--ink, inherit); }
.t3-stat.ok b { color: var(--win); }
.t3-stat.no b { color: var(--loss); }
.t3-stat.weak b { color: #eab308; }
.t3-stat { font-size: 10.5px; }
.t3-badge.weak { background: rgba(148,163,184,0.25); color: var(--ink-dim); font-size: 9.5px; padding: 1px 6px; }
.t3-mkv { display: flex; gap: 8px; font-size: 12px; color: var(--ink-dim); flex: none; }
.t3-mkv b { color: var(--ink, inherit); }
.t3-mkv i { font-style: normal; min-width: 64px; }
.t3-pasrow .t3-mkv { flex: 1 1 100%; padding-left: 46px; }
.t3-news { display: flex; flex-direction: column; gap: 4px; flex: 1 1 100%; }
.t3-news a { color: inherit; text-decoration: none; }
.t3-news a i { font-style: normal; color: var(--ink-dim); font-size: 10.5px; margin-left: 4px; }
.t3-note { font-size: 12px; color: var(--ink-dim); padding: 5px 8px; margin-top: 4px; border-radius: 8px; background: rgba(148,163,184,0.06); }
.t3-chips { display: flex; flex-wrap: wrap; gap: 4px; margin: 4px 0 6px; }
.t3-chip { font-size: 11.5px; padding: 2px 8px; border-radius: 999px; background: rgba(148,163,184,0.1); border: 1px solid var(--border); }
.t3-sec { margin-top: 6px; font-size: 12px; font-weight: 700; color: var(--ink, inherit); }
.t3-scs { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 4px; }
.t3-sc { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 5px; padding: 3px 6px; border-radius: 6px; background: rgba(148,163,184,0.08); font-size: 11.5px; }
.t3-bar, .t3-q { display: inline-block; height: 5px; border-radius: 3px; background: rgba(148,163,184,0.2); overflow: hidden; vertical-align: middle; }
.t3-bar { width: 100%; }
.t3-q { width: 48px; margin-right: 6px; }
.t3-bar i, .t3-q i { display: block; height: 100%; background: var(--accent); }
.t3-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 6px; }
.t3-tile { display: flex; gap: 8px; align-items: flex-start; padding: 7px 8px; border-radius: 8px; background: rgba(148,163,184,0.08); border: 1px solid var(--border); }
.t3-ti { font-size: 18px; line-height: 1.2; }
.t3-tile small { display: block; font-size: 10.5px; color: var(--ink-dim); }
.t3-tile b { display: block; font-size: 14px; color: var(--ink, inherit); }
.t3-tile em { display: block; font-style: normal; font-size: 10.5px; color: var(--ink-dim); }
.t3-warn { padding: 6px 8px; border-radius: 8px; background: rgba(239,68,68,0.1); color: var(--loss); }
.t3-kv { display: grid; grid-template-columns: auto 1fr; gap: 3px 10px; margin-top: 6px; }
.t3-iv { display: grid; grid-template-columns: 16px 1fr 70px; align-items: center; gap: 6px; font-size: 11.5px; }
.t3-ivb { position: relative; height: 8px; border-radius: 4px; background: rgba(148,163,184,0.15); }
.t3-ivb i { position: absolute; top: 0; bottom: 0; border-radius: 4px; background: rgba(56,189,248,0.45); }
.t3-ivb u { position: absolute; top: -2px; width: 2px; height: 12px; background: var(--ink, #fff); }
.t3-votes { border-collapse: collapse; width: 100%; font-size: 11.5px; }
.t3-votes th, .t3-votes td { padding: 3px 5px; border-bottom: 1px solid var(--border); text-align: right; }
.t3-votes th:first-child, .t3-votes td:first-child { text-align: left; }
.t3-votes td.hi { color: var(--accent); font-weight: 700; }
.t3-srcs { display: flex; flex-wrap: wrap; gap: 4px; }
.t3-src { font-size: 11px; padding: 3px 8px; border-radius: 8px; background: rgba(148,163,184,0.08); border: 1px solid var(--border); }
.t3-pick { background: var(--surface); border: 1px solid var(--border); border-left: 3px solid var(--win); border-radius: 10px; padding: 10px 12px; margin: 8px 0; font-size: 13px; }
.t3-pick > summary, .t3-row > summary, .t3-grp > summary { cursor: pointer; list-style: none; }
.t3-pick > summary::-webkit-details-marker, .t3-row > summary::-webkit-details-marker, .t3-grp > summary::-webkit-details-marker { display: none; }
.t3-lg { display: flex; align-items: center; gap: 6px; color: var(--ink-dim); font-size: 12px; }
.t3-lgi { width: 16px; height: 16px; object-fit: contain; }
.t3-teams { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-weight: 700; font-size: 15px; margin: 4px 0 8px; }
.t3-teams.sm { font-size: 13px; margin: 0; flex: 1 1 auto; min-width: 0; }
.t3-tm { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.t3-cr { width: 20px; height: 20px; object-fit: contain; flex: none; }
.t3-teams.sm .t3-cr { width: 16px; height: 16px; }
.t3-vs { color: var(--ink-dim); font-weight: 400; }
.t3-call { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.t3-badge { background: var(--win); color: #04130d; font-weight: 800; font-size: 11px; letter-spacing: .04em; padding: 3px 8px; border-radius: 999px; }
.t3-mk { font-size: 18px; font-weight: 800; }
.t3-od { font-size: 15px; font-weight: 800; padding: 2px 8px; border-radius: 6px; background: rgba(148,163,184,0.12); }
.t3-why { font-size: 12px; color: var(--ink-dim); }
.t3-open { margin-left: auto; font-size: 12px; color: var(--accent); }
.t3-pick[open] .t3-open { display: none; }
.t3-grp > summary { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.t3-grp > summary::after { content: '▾'; margin-left: auto; color: var(--ink-dim); }
.t3-grp[open] > summary::after { content: '▴'; }
.t3-row { border-top: 1px solid var(--border); padding: 7px 0; }
.t3-row > summary { display: flex; align-items: center; gap: 8px; }
.t3-t { color: var(--ink-dim); font-size: 12px; flex: none; width: 38px; }
.t3-lean { flex: none; font-size: 12px; color: var(--ink-dim); white-space: nowrap; }
.t3-pasrow { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; border-top: 1px solid var(--border); padding: 6px 0; }
.t3-pasrow .t3-dim { flex: 1 1 100%; padding-left: 46px; font-size: 11.5px; }
.t3-coupon { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 6px 0; font-size: 12px; }
.t3-coupon input { margin: 0 0 0 4px; }
.t3-card .sc-chip, .t3-chip { white-space: normal; max-width: 100%; display: inline-block; }
.t3-call .t3-badge.weak { font-size: 11px; padding: 3px 8px; }
.t3-stat.strong b { color: #3b82f6; }
.t3-pick.strong { border-left-color: #3b82f6; }
.t3-pick.mid { border-left-color: var(--ink-dim); }
.t3-badge.strong { background: #3b82f6; color: #fff; }
.t3-badge.mid { background: rgba(148,163,184,0.25); color: var(--ink); }
.t3-pp { font-size: 18px; font-weight: 800; color: var(--ink); }
.t3-bk .t3-why { margin-top: 4px; }
.t3-bar { height: 8px; border-radius: 999px; background: rgba(148,163,184,0.18); overflow: hidden; margin: 8px 0 6px; }
.t3-bar > i { display: block; height: 100%; background: var(--win); border-radius: 999px; transition: width .6s ease; }
.t3-bar.busy > i { animation: t3busy 1.4s ease-in-out infinite; }
@keyframes t3busy { 0% { margin-left: -35%; } 100% { margin-left: 100%; } }
.t3-recrow { display: flex; gap: 10px; justify-content: space-between; flex-wrap: wrap; padding: 5px 0; border-bottom: 1px solid var(--border); font-size: 13px; }
.t3-recrow > span:first-child { color: var(--ink-dim); min-width: 110px; }
/* Tahmin 3.0 tabs and compact calls */
.t3-tabs { position: sticky; top: 0; z-index: 5; display: flex; gap: 4px; padding: 4px; margin: 0 0 10px; border-radius: 14px; background: color-mix(in srgb, var(--surface) 92%, transparent); border: 1px solid var(--border); backdrop-filter: blur(10px); overflow-x: auto; scrollbar-width: none; }
.t3-tabs::-webkit-scrollbar { display: none; }
.t3-tabs button { flex: 1 0 auto; border: 0; background: transparent; color: var(--ink-dim); font: inherit; font-size: 13px; font-weight: 600; padding: 8px 10px; border-radius: 10px; cursor: pointer; white-space: nowrap; }
.t3-tabs button.on { background: var(--surface-3, rgba(148,163,184,0.18)); color: var(--ink); box-shadow: 0 1px 0 rgba(255,255,255,0.04) inset; }
.t3-daybar { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; flex-wrap: wrap; }
.t3-daybar button { border: 1px solid var(--border); background: var(--surface); color: var(--ink-dim); font: inherit; font-size: 12.5px; font-weight: 600; padding: 6px 12px; border-radius: 999px; cursor: pointer; }
.t3-daybar button.on { border-color: var(--win); color: var(--ink); background: color-mix(in srgb, var(--win) 14%, var(--surface)); }
.t3-daybar input[type=date] { width: auto; padding: 5px 8px; font-size: 12.5px; border-radius: 999px; }
.t3-pills { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-bottom: 8px; }
.t3-pill { cursor: pointer; font: inherit; font-size: 11.5px; }
.t3-pill i { font-style: normal; opacity: .8; }
.t3-pill.on { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); color: var(--ink); }
.t3-ml { margin-top: 2px; }
.t3-rowdet { padding: 6px 10px 10px; border-top: 1px solid rgba(255,255,255,.07); background: rgba(255,255,255,.02); font-size: 12.5px; }
.t3-pill { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 8px 4px; border-radius: 12px; background: var(--surface); border: 1px solid var(--border); color: var(--ink-dim); font-size: 11.5px; text-decoration: none; }
.t3-pill b { font-size: 20px; color: var(--ink); line-height: 1.1; }
.t3-pill.ok b { color: var(--win); } .t3-pill.strong b { color: #3b82f6; }
.t3-sec { display: flex; justify-content: space-between; align-items: baseline; margin: 14px 2px 6px; font-weight: 700; font-size: 13px; letter-spacing: .02em; scroll-margin-top: 60px; }
.t3-more { margin-top: 12px; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 10px 12px; font-size: 13px; }
.t3-more > summary { cursor: pointer; font-weight: 700; color: var(--ink); }
.t3-foot { text-align: center; color: var(--ink-dim); font-size: 11.5px; margin: 14px 0 4px; }
.t3-coupon { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; margin: 8px 0; }
.t3-coupon label { display: flex; flex-direction: column; gap: 3px; font-size: 11.5px; color: var(--ink-dim); }
.t3-coupon input { width: 90px; }
/* Banko kupon builder: form, coupon cards with crests, saved list */
.t3-ds { display: flex; align-items: stretch; gap: 8px; margin: 10px 0; }
.t3-ds-days { flex: 1; min-width: 0; display: flex; overflow-x: auto; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; scrollbar-width: none; scroll-snap-type: x proximity; }
.t3-ds-days::-webkit-scrollbar { display: none; }
.t3-ds-day { position: relative; flex: 1 0 66px; display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 8px 6px 9px; background: none; border: none; color: var(--ink-dim); cursor: pointer; scroll-snap-align: center; font: inherit; }
.t3-ds-day .wd { font-size: 13px; font-weight: 500; }
.t3-ds-day .dm { font-size: 13px; font-weight: 500; }
.t3-ds-day.on .wd, .t3-ds-day.on .dm { color: var(--ink); font-weight: 800; }
.t3-ds-day.on .dm { font-size: 15px; }
.t3-ds-day.on::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: 0; height: 4px; border-radius: 3px 3px 0 0; background: var(--brand); }
.t3-ds-tick { position: absolute; top: 2px; right: 2px; font-style: normal; font-size: 9px; font-weight: 800; width: 13px; height: 13px; border-radius: 50%; display: grid; place-items: center; background: var(--brand); color: #fff; }
.t3-ds-cal { position: relative; flex: none; width: 48px; border-radius: 12px; background: var(--brand); display: grid; place-items: center; font-size: 20px; cursor: pointer; }
.t3-ds-cal input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%; }
.t3-stored { color: var(--ink-faint); font-size: 11.5px; text-align: right; margin: -4px 4px 6px; }
.t3k-form .t3-ds { margin: 6px 0 12px; }
.t3k-form .t3-ds-days { background: var(--surface-2); }
.t3k-lbl { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: 12px; font-weight: 600; color: var(--ink-dim); }
.t3k-lbl em { font-style: normal; font-weight: 500; color: var(--ink-faint); font-size: 11.5px; text-align: right; }
.t3k-form { background: linear-gradient(160deg, var(--surface-2), var(--surface)); border: 1px solid var(--border); border-radius: 16px; padding: 14px; margin: 10px 0; }
.t3k-fh { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 12px; }
.t3k-fh b { display: block; font-size: 15px; color: var(--ink); }
.t3k-fh small { display: block; color: var(--ink-dim); font-size: 12px; line-height: 1.4; margin-top: 2px; }
.t3k-fi { flex: none; width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; font-size: 18px; background: var(--accent-tint); }
.t3k-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.t3k-field { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.t3k-field > span { font-size: 12px; color: var(--ink-dim); font-weight: 600; }
.t3k-field input { width: 100%; min-width: 0; box-sizing: border-box; height: 44px; margin: 0; font-size: 17px; font-weight: 700; text-align: center; border-radius: 12px; }
.t3k-step { display: grid; grid-template-columns: 40px 1fr 40px; gap: 4px; }
.t3k-step button { height: 44px; border-radius: 12px; border: 1px solid var(--border); background: var(--surface-3); color: var(--ink); font-size: 20px; font-weight: 700; cursor: pointer; }
.t3k-step input { -moz-appearance: textfield; } .t3k-step input::-webkit-inner-spin-button, .t3k-step input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.t3k-chips { display: flex; gap: 6px; margin: 8px 0 12px; flex-wrap: wrap; }
.t3k-chip { flex: 1 1 0; min-width: 52px; height: 34px; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); color: var(--ink-dim); font-weight: 700; font-size: 13px; cursor: pointer; }
.t3k-chip.on { border-color: var(--accent); color: var(--accent); background: var(--accent-tint); }
.t3k-go { width: 100%; height: 48px; margin-top: 14px; border: 0; border-radius: 14px; background: linear-gradient(90deg, #38bdf8, #2563eb); color: #fff; font-size: 16px; font-weight: 800; cursor: pointer; box-shadow: 0 6px 18px rgba(37, 99, 235, .3); }
.t3k-go:disabled { opacity: .6; cursor: progress; }
.t3k-empty { background: var(--surface); border: 1px dashed var(--border); border-radius: 14px; padding: 18px 14px; text-align: center; color: var(--ink-dim); font-size: 13px; margin: 8px 0; }
.t3k-note { color: var(--ink-faint); font-size: 11.5px; text-align: center; margin: 6px 4px 4px; line-height: 1.45; }
.t3k-card { background: var(--surface); border: 1px solid var(--border); border-radius: 16px; margin: 10px 0; overflow: hidden; box-shadow: var(--card-shadow); }
.t3k-card.st-ok { border-color: var(--win); } .t3k-card.st-bad { border-color: var(--loss); }
.t3k-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 12px 14px; background: linear-gradient(120deg, var(--accent-tint), transparent 70%); border-bottom: 1px solid var(--border); }
.t3k-title { display: flex; align-items: center; gap: 10px; min-width: 0; }
.t3k-title b { display: block; font-size: 15px; color: var(--ink); }
.t3k-title small { display: block; font-size: 11.5px; color: var(--ink-dim); }
.t3k-badge { flex: none; width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; font-weight: 800; font-size: 15px; color: #fff; background: linear-gradient(135deg, #38bdf8, #2563eb); }
.t3k-odds { text-align: right; flex: none; }
.t3k-odds small { display: block; font-size: 10.5px; color: var(--ink-dim); text-transform: uppercase; letter-spacing: .04em; }
.t3k-odds b { font-size: 22px; color: var(--accent); line-height: 1.1; }
.t3k-prob { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 10px; padding: 10px 14px 0; font-size: 12.5px; color: var(--ink-dim); }
.t3k-prob b { color: var(--win); }
.t3k-bar { flex: 1 1 100%; height: 6px; border-radius: 6px; background: var(--surface-3); overflow: hidden; }
.t3k-bar i { display: block; height: 100%; border-radius: 6px; background: linear-gradient(90deg, #f59e0b, var(--win)); }
.t3k-st { font-weight: 700; } .t3k-st.ok { color: var(--win); } .t3k-st.bad { color: var(--loss); } .t3k-st.wait { color: var(--draw); }
.t3k-legs { padding: 6px 10px 10px; }
.t3k-leg { border-radius: 12px; background: var(--surface-2); padding: 8px 10px; margin-top: 6px; border-left: 3px solid var(--accent); }
.t3k-leg.ok { border-left-color: var(--win); } .t3k-leg.bad { border-left-color: var(--loss); } .t3k-leg.void { border-left-color: var(--ink-faint); }
.t3k-lg { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--ink-dim); min-width: 0; }
.t3k-lg span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.t3k-lg em { font-style: normal; flex: none; }
.t3k-lgi { width: 16px; height: 16px; object-fit: contain; flex: none; }
.t3k-res { font-size: 13px; } .t3k-leg.ok .t3k-res { color: var(--win); } .t3k-leg.bad .t3k-res { color: var(--loss); }
.t3k-match { display: flex; align-items: center; gap: 10px; margin-top: 6px; }
.t3k-teams { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.t3k-tm { display: flex; align-items: center; gap: 8px; min-width: 0; font-size: 13.5px; font-weight: 600; color: var(--ink); }
.t3k-tm > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.t3k-crest { position: relative; flex: none; width: 22px; height: 22px; border-radius: 50%; background: var(--surface-3); display: grid; place-items: center; overflow: hidden; }
.t3k-crest i { font-style: normal; font-size: 11px; font-weight: 800; color: var(--ink-dim); }
.t3k-crest img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: var(--surface-2); }
.t3k-pick { flex: none; display: flex; flex-direction: column; align-items: center; gap: 1px; min-width: 66px; padding: 6px 8px; border-radius: 10px; background: var(--accent-tint); border: 1px solid var(--border-highlight); }
.t3k-pick b { font-size: 14px; color: var(--accent); }
.t3k-pick span { font-size: 12px; font-weight: 700; color: var(--ink); }
.t3k-pick small { font-size: 10.5px; color: var(--win); font-weight: 700; }
.t3k-foot { padding: 0 14px 14px; }
.t3k-foot > .cp-share.wide { margin-top: 0; }
.t3k-save { width: 100%; height: 42px; border-radius: 12px; border: 1px solid var(--accent); background: transparent; color: var(--accent); font-weight: 800; font-size: 14px; cursor: pointer; }
.t3k-save:hover:not(:disabled) { background: var(--accent-tint); }
.t3k-save.done { border-color: var(--win); color: var(--win); background: rgba(34, 197, 94, .08); cursor: default; }
@media (min-width: 720px) {
  .t3k-form { display: grid; grid-template-columns: 1fr 1fr; column-gap: 14px; align-items: end; }
  .t3k-fh, .t3k-lbl, .t3k-form .t3-ds { grid-column: 1 / -1; }
  .t3k-chips { margin: 8px 0 0; align-self: end; }
  .t3k-fields { grid-column: 1 / -1; margin-top: 12px; }
  .t3k-go { grid-column: 1 / -1; }
  #t3CouponOut, #t3SavedOut { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); column-gap: 12px; align-items: start; }
  #t3CouponOut > .t3k-empty, #t3CouponOut > .t3k-note, #t3SavedOut > .t3k-empty { grid-column: 1 / -1; }
}
.t3-about h4 { margin: 12px 0 4px; font-size: 14px; } .t3-about h4:first-child { margin-top: 2px; }
.t3-about p, .t3-about li { font-size: 13px; line-height: 1.55; color: var(--ink); margin: 4px 0; }
.t3-about ul { margin: 4px 0; padding-left: 18px; }

  /* ---- PIN ile giriş (auth/pin.ts): cam kart, altı hücre, doğrulanınca yeşil ---- */
  .pin-screen{position:fixed; inset:0; z-index:1200; display:flex; align-items:center; justify-content:center; padding:16px; overflow-y:auto; color:#f3f1ea; font-family:Inter,"Segoe UI",Arial,sans-serif;
    background:radial-gradient(120% 60% at 10% 15%,rgba(214,160,70,.32),transparent 55%),radial-gradient(90% 50% at 95% 85%,rgba(190,130,50,.24),transparent 60%),linear-gradient(155deg,#07090c 0%,#14110c 45%,#050608 100%);}
  .pin-screen:before,.pin-screen:after{content:""; position:absolute; pointer-events:none; border-radius:50%; filter:blur(2px);}
  .pin-screen:before{width:140vmax; height:40vmax; left:-30vmax; top:18%; border-top:2px solid rgba(240,190,100,.35); transform:rotate(-14deg);}
  .pin-screen:after{width:120vmax; height:36vmax; right:-40vmax; bottom:8%; border-bottom:3px solid rgba(220,160,80,.25); transform:rotate(-10deg);}
  .pin-card{--pin-acc:#e9b949; --pin-acc-2:#c98a2c; position:relative; z-index:1; width:min(420px,100%); padding:34px 26px 24px; text-align:center;
    background:linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.03)); border:1px solid rgba(255,255,255,.14);
    -webkit-backdrop-filter:blur(18px) saturate(140%); backdrop-filter:blur(18px) saturate(140%);
    clip-path:polygon(44px 0,100% 0,100% calc(100% - 44px),calc(100% - 44px) 100%,0 100%,0 44px); border-radius:18px;
    box-shadow:0 30px 80px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.12); animation:pinIn .45s cubic-bezier(.2,.8,.2,1);}
  .pin-card.done{--pin-acc:#4ade80; --pin-acc-2:#16a34a; background:linear-gradient(160deg,rgba(74,222,128,.14),rgba(255,255,255,.03));}
  .pin-icon{width:54px; height:54px; margin:0 auto 14px; display:grid; place-items:center; border-radius:14px; border:1px solid color-mix(in srgb,var(--pin-acc) 55%,transparent); background:color-mix(in srgb,var(--pin-acc) 12%,transparent); color:var(--pin-acc); transition:all .3s;}
  .pin-icon svg{width:26px; height:26px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;}
  .pin-title{margin:0; font-size:26px; font-weight:800; letter-spacing:-.3px;}
  .pin-title span{color:var(--pin-acc); transition:color .3s;}
  .pin-who{display:flex; align-items:center; justify-content:center; gap:8px; margin:12px 0 2px; font-size:15px;}
  .pin-who b{max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .pin-ava{width:30px; height:30px; font-size:14px;}
  .pin-sub{margin:4px 0 22px; color:rgba(243,241,234,.65); font-size:14px; line-height:1.45;}
  .pin-pad{position:relative; container-type:inline-size; width:100%; max-width:340px; height:64px; margin:0 auto 6px; cursor:text; transition:height .5s cubic-bezier(.2,.8,.2,1);}
  .pin-orbit{--step:min(56px,16.4cqw); --cw:calc(var(--step) - 10px); --ch:calc(var(--step) - 2px); position:absolute; inset:0;}
  .pin-cell{position:absolute; left:50%; top:50%; width:var(--cw); height:var(--ch); margin:calc(var(--ch) / -2) 0 0 calc(var(--cw) / -2); border-radius:12px; border:1px solid rgba(255,255,255,.16); background:rgba(0,0,0,.38); box-shadow:inset 0 1px 0 rgba(255,255,255,.07), 0 6px 16px rgba(0,0,0,.35); display:grid; place-items:center;
    transform:translateX(calc((var(--i) - 2.5) * var(--step))); transition:transform .6s cubic-bezier(.2,.8,.2,1) calc(var(--i) * 45ms), opacity .35s, border-color .2s, box-shadow .2s;}
  .pin-cell:before{content:""; position:absolute; top:-1px; right:-1px; width:55%; height:55%; border-top:2px solid #e0812e; border-right:2px solid #e0812e; border-top-right-radius:12px; opacity:0; transition:opacity .2s;}
  .pin-cell:after{content:""; position:absolute; width:12px; height:12px; border-radius:50%; background:var(--pin-acc,#e9b949); transform:scale(0); transition:transform .18s cubic-bezier(.3,1.6,.5,1);}
  .pin-d{font-size:22px; font-weight:800; color:#fff; transform:scale(.4); opacity:0; transition:transform .18s cubic-bezier(.3,1.6,.5,1), opacity .15s;}
  .pin-cell.on{border-color:color-mix(in srgb,var(--pin-acc,#e9b949) 60%,transparent); box-shadow:0 0 0 1px color-mix(in srgb,var(--pin-acc,#e9b949) 22%,transparent), 0 6px 18px rgba(0,0,0,.4);}
  .pin-cell.on:before{opacity:1;}
  .pin-cell.on:after{transform:scale(1);}
  .pin-cell.on.show .pin-d, .pin-pad.reveal .pin-cell.on .pin-d{transform:none; opacity:1;}
  .pin-cell.on.show:after, .pin-pad.reveal .pin-cell.on:after{transform:scale(0);}
  .pin-cell.cur{border-color:var(--pin-acc,#e9b949); box-shadow:0 0 0 3px color-mix(in srgb,var(--pin-acc,#e9b949) 18%,transparent);}
  .pin-input{position:absolute; inset:0; width:100%; height:100%; opacity:0; border:0; background:none; color:transparent; caret-color:transparent; font-size:16px; z-index:2;}
  .pin-ring{position:absolute; left:50%; top:50%; width:160px; height:160px; margin:-80px 0 0 -80px; border-radius:50%; border:1.5px dashed color-mix(in srgb,var(--pin-acc,#e9b949) 45%,transparent); opacity:0; transform:scale(.6); transition:opacity .4s, transform .5s;}
  /* checking: the cells leave the row, tilt and circle the ring */
  .pin-pad.busy{height:224px;}
  .pin-pad.busy .pin-ring{opacity:1; transform:none;}
  .pin-pad.busy .pin-orbit{animation:pinTurn 6s linear infinite;}
  .pin-pad.busy .pin-cell{transform:rotate(calc(var(--i) * 60deg)) translateY(-80px) rotate(calc(var(--i) * -60deg - 18deg));}
  .pin-pad.bad{animation:pinShake .45s;}
  .pin-pad.bad .pin-cell{border-color:#ef4444;}
  .pin-pad.bad .pin-cell:before{border-color:#ef4444;}
  /* verified: everything folds into the centre, then the green check appears */
  .pin-pad.ok .pin-cell{transform:scale(.3); opacity:0; border-color:#4ade80;}
  .pin-pad.ok .pin-ring{opacity:0; transform:scale(.3);}
  .pin-eye{display:block; margin:0 auto 2px; background:none; border:0; padding:4px 8px; color:rgba(243,241,234,.55); font:inherit; font-size:12.5px; cursor:pointer;}
  .pin-eye:hover{color:var(--pin-acc,#e9b949);}
  .pin-forgot{margin:0 0 16px; font-size:13.5px; color:rgba(243,241,234,.6);}
  .pin-forgot .pin-link{padding:0; font-weight:700;}
  .pin-check{width:64px; height:64px; margin:0 auto 8px; display:grid; place-items:center; border-radius:16px; border:2px solid #4ade80; background:rgba(0,0,0,.45); box-shadow:0 0 28px rgba(74,222,128,.35); animation:pinPop .45s cubic-bezier(.3,1.6,.5,1);}
  .pin-check svg{width:30px; height:30px; fill:none; stroke:#fff; stroke-width:3; stroke-linecap:round; stroke-linejoin:round;}
  .pin-code{margin:10px auto 0; max-width:280px;}
  .pin-code input{width:100%; padding:11px 12px; border-radius:10px; border:1px solid rgba(255,255,255,.18); background:rgba(0,0,0,.35); color:inherit; font-size:16px; text-align:center; letter-spacing:2px;}
  .pin-msg{min-height:20px; margin:10px 0 14px; font-size:13.5px; color:#fca5a5;}
  .pin-go{display:flex; align-items:center; justify-content:center; gap:10px; width:min(300px,100%); height:48px; margin:0 auto; border:0; border-radius:10px; font:inherit; font-size:15.5px; font-weight:700; cursor:pointer; color:#1d1606;
    background:linear-gradient(100deg,var(--pin-acc),var(--pin-acc-2)); box-shadow:0 8px 24px color-mix(in srgb,var(--pin-acc) 30%,transparent); transition:filter .2s, background .3s;}
  .pin-go:hover{filter:brightness(1.08);} .pin-go:disabled{cursor:default;}
  .pin-card.done .pin-go{color:#052e14;}
  .pin-go svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}
  .pin-spin{width:16px; height:16px; border-radius:50%; border:2px solid rgba(29,22,6,.3); border-top-color:#1d1606; animation:pinSpin .7s linear infinite;}
  .pin-card [hidden]{display:none !important;}
  .pin-links{display:flex; justify-content:center; gap:18px; margin-top:16px; flex-wrap:wrap;}
  .pin-link{background:none; border:0; padding:6px 2px; color:var(--pin-acc); font:inherit; font-size:13.5px; cursor:pointer;}
  .pin-link:hover{text-decoration:underline;}
  .pin-pad-sm{margin:10px auto 4px;}
  .pin-pad-sm .pin-d{color:var(--ink,#fff);}
  .pin-pad-sm + .pin-eye{color:var(--ink-dim);}
  .pin-pad-sm .pin-cell{background:var(--surface-2, rgba(0,0,0,.25)); border-color:var(--border, rgba(255,255,255,.16));}
  @keyframes pinIn{from{opacity:0; transform:translateY(14px) scale(.98);} to{opacity:1; transform:none;}}
  @keyframes pinShake{20%,60%{transform:translateX(-7px);} 40%,80%{transform:translateX(7px);}}
  @keyframes pinTurn{to{transform:rotate(360deg);}}
  @keyframes pinPop{from{transform:scale(.5); opacity:0;} to{transform:none; opacity:1;}}
  @keyframes pinSpin{to{transform:rotate(360deg);}}
  @media(max-width:380px){.pin-card{padding:30px 18px 20px;}}
  @media(prefers-reduced-motion:reduce){.pin-card,.pin-pad.busy .pin-orbit,.pin-pad.bad,.pin-check{animation:none;} .pin-cell,.pin-pad{transition:none;}}

/* Coupon share picture (app.js cpShareBtn / cpOpenShare): the Paylaş button on coupon cards and the preview sheet. */
.t3k-acts { display: flex; gap: 8px; }
.t3k-acts .t3k-save { flex: 1 1 auto; width: auto; }
.cp-share { height: 42px; padding: 0 16px; border-radius: 12px; border: 1px solid #38b6ff; background: rgba(56, 182, 255, .08); color: #38b6ff; font-weight: 800; font-size: 14px; cursor: pointer; white-space: nowrap; flex: 0 0 auto; }
.cp-share:hover:not(:disabled) { background: rgba(56, 182, 255, .18); }
.cp-share:disabled { opacity: .7; cursor: progress; }
.cp-share.wide { width: 100%; margin-top: 10px; }
.bc-share { margin-top: 2px; }
.cp-sheet { position: fixed; inset: 0; z-index: 10050; background: rgba(2, 6, 16, .72); display: flex; align-items: center; justify-content: center; padding: 16px; }
.cp-sheet-box { width: min(440px, 100%); max-height: calc(100dvh - 32px); display: flex; flex-direction: column; gap: 12px; background: var(--surface); color: var(--ink); border: 1px solid var(--surface-3); border-radius: 18px; padding: 14px; box-shadow: 0 20px 60px rgba(0, 0, 0, .5); }
.cp-sheet-h { display: flex; align-items: center; justify-content: space-between; font-size: 16px; }
.cp-sheet-h button { width: 36px; height: 36px; border-radius: 10px; border: 0; background: var(--surface-2); color: var(--ink); font-size: 16px; cursor: pointer; }
.cp-sheet-img { flex: 1 1 auto; min-height: 0; overflow: auto; border-radius: 12px; background: #070b19; }
.cp-sheet-img img { display: block; width: 100%; height: auto; }
.cp-sheet-acts { display: flex; gap: 8px; }
.cp-sheet-acts button { flex: 1; height: 46px; border-radius: 12px; font-weight: 800; font-size: 15px; cursor: pointer; }
.cp-go { border: 0; background: #38b6ff; color: #061321; }
.cp-alt { border: 1px solid var(--surface-3); background: var(--surface-2); color: var(--ink); }
.cp-sheet small { color: var(--ink-dim); font-size: 12px; text-align: center; }
@media (max-width: 420px) {
  .cp-sheet { align-items: flex-end; padding: 0; }
  .cp-sheet-box { border-radius: 18px 18px 0 0; max-height: 92dvh; padding-bottom: calc(14px + env(safe-area-inset-bottom)); }
}
  /* Tahmin Yarışı (app.js loadRace): the week's pool, the ranking with the model's line, the member's record */
  #panel-yaris{--rc-model:#38bdf8;}
  .rc-wrap{max-width:720px; margin:0 auto; padding-bottom:90px;}
  .rc-seg{display:flex; background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:3px; margin-bottom:12px;}
  .rc-seg button{flex:1; padding:9px 0; border:none; border-radius:9px; background:none; color:var(--ink-dim); font:600 13.5px 'Barlow',system-ui,sans-serif; cursor:pointer;}
  .rc-seg button.on{background:var(--brand); color:#04130b;}
  .rc-wk{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; text-align:center;}
  .rc-wk b{display:block; font:700 17px 'Barlow Condensed',sans-serif; color:var(--ink);}
  .rc-wk span{font-size:12px; color:var(--ink-dim);}
  .rc-wk button{width:34px; height:34px; flex:none; border-radius:10px; background:var(--surface); border:1px solid var(--border); color:var(--ink-dim); font-size:18px; cursor:pointer;}
  .rc-wk button:disabled{opacity:.35; cursor:default;}
  .rc-hero{background:linear-gradient(135deg, color-mix(in srgb, var(--brand) 16%, var(--surface)), color-mix(in srgb, var(--rc-model, #38bdf8) 12%, var(--surface))); border:1px solid color-mix(in srgb, var(--brand) 35%, var(--border)); border-radius:16px; padding:14px; margin-bottom:12px; color:var(--ink);}
  .rc-eyebrow{font:700 12.5px 'Barlow',sans-serif; color:var(--ink-dim); text-transform:uppercase; letter-spacing:.6px;}
  .rc-vs{display:flex; align-items:center; gap:10px; margin-top:8px;}
  .rc-vs > i{font:700 14px 'Barlow Condensed',sans-serif; color:var(--ink-faint); font-style:normal;}
  .rc-side{flex:1; text-align:center; min-width:0;}
  .rc-side b{display:block; font:800 34px/1.05 'Barlow Condensed',sans-serif;}
  .rc-side span{font-size:12px; color:var(--ink-dim);}
  .rc-me b, b.rc-me{color:var(--brand);}
  .rc-md b, b.rc-md{color:var(--rc-model, #38bdf8);}
  .rc-bar{height:6px; border-radius:4px; background:var(--rc-model, #38bdf8); overflow:hidden; margin-top:10px;}
  .rc-bar i{display:block; height:100%; background:var(--brand);}
  .rc-sub{display:flex; justify-content:space-between; flex-wrap:wrap; gap:4px 10px; margin-top:8px; font-size:12.5px; color:var(--ink-dim);}
  .rc-sub b{color:var(--ink);}
  .rc-day{font:700 12px 'Barlow',sans-serif; color:var(--ink-dim); text-transform:uppercase; letter-spacing:.5px; margin:14px 2px 6px;}
  .rc-m{background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:11px 12px; margin-bottom:8px;}
  .rc-mh{display:flex; justify-content:space-between; align-items:center; gap:8px; font-size:11.5px; color:var(--ink-faint); margin-bottom:6px;}
  .rc-mh > span:first-child{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .rc-teams{display:flex; align-items:center; gap:7px; font-size:15px; color:var(--ink); min-width:0;}
  .rc-teams b{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .rc-teams i{color:var(--ink-faint); font-style:normal; font-size:12px;}
  .rc-teams em{font:800 18px 'Barlow Condensed',sans-serif; font-style:normal; padding:0 4px; flex:none;}
  .rc-teams .lc-crest{flex:none;}
  .rc-picks{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:6px; margin-top:9px;}
  .rc-picks.rc-ou{grid-template-columns:repeat(2, minmax(0,1fr)); margin-top:6px;}
  .rc-p{border:1px solid var(--border); background:var(--surface-2); border-radius:10px; padding:6px 0; text-align:center; color:var(--ink); cursor:pointer; min-height:44px; -webkit-tap-highlight-color:transparent;}
  .rc-p b{display:block; font:700 15px 'Barlow Condensed',sans-serif;}
  .rc-p span{font-size:11.5px; color:var(--ink-dim);}
  .rc-p.on{background:color-mix(in srgb, var(--brand) 20%, var(--surface)); border-color:var(--brand); box-shadow:inset 0 0 0 1px var(--brand);}
  .rc-p.on b{color:var(--brand);}
  .rc-p:disabled{cursor:default; opacity:.55;}
  .rc-p.on:disabled{opacity:1;}
  .rc-p.on.no{border-color:var(--loss); box-shadow:inset 0 0 0 1px var(--loss); background:color-mix(in srgb, var(--loss) 14%, var(--surface));}
  .rc-p.on.no b{color:var(--loss);}
  .rc-foot{display:flex; flex-wrap:wrap; gap:6px; margin-top:8px;}
  .rc-chip{font-size:11.5px; padding:2px 8px; border-radius:9px; background:var(--surface-3); color:var(--ink-dim); font-weight:600; white-space:nowrap;}
  .rc-chip.rc-ok{background:color-mix(in srgb, var(--brand) 22%, var(--surface)); color:var(--brand);}
  .rc-chip.rc-no{background:color-mix(in srgb, var(--loss) 20%, var(--surface)); color:var(--loss);}
  .rc-chip.rc-lock{background:color-mix(in srgb, var(--accent) 20%, var(--surface)); color:var(--accent);}
  .rc-chip.rc-mdc{background:color-mix(in srgb, var(--rc-model, #38bdf8) 16%, var(--surface)); color:var(--rc-model, #38bdf8);}
  .rc-note{font-size:12.5px; color:var(--ink-dim); background:var(--surface-2); border:1px dashed var(--border); border-radius:12px; padding:10px 12px; margin-top:10px;}
  .rc-box{background:var(--surface); border:1px solid var(--border); border-radius:14px; overflow:hidden;}
  .rc-row{display:flex; align-items:center; gap:10px; padding:10px 12px; border-bottom:1px solid var(--border); color:var(--ink);}
  .rc-row:last-child{border-bottom:none;}
  .rc-row.me{background:linear-gradient(90deg, color-mix(in srgb, var(--brand) 20%, transparent), transparent);}
  .rc-row.me .rc-pt b{color:var(--brand);}
  .rc-row.model{background:linear-gradient(90deg, color-mix(in srgb, var(--rc-model, #38bdf8) 18%, transparent), transparent);}
  .rc-row.model .rc-pt b{color:var(--rc-model, #38bdf8);}
  .rc-rk{width:24px; flex:none; text-align:center; font:800 17px 'Barlow Condensed',sans-serif; color:var(--ink-dim);}
  .rc-av{--ava:#64748b; width:34px; height:34px; flex:none; border-radius:50%; border:2px solid var(--ava); background:color-mix(in srgb, var(--ava) 22%, var(--surface)); display:flex; align-items:center; justify-content:center; font:800 15px/1 'Barlow',sans-serif;}
  .rc-nm{flex:1; min-width:0;}
  .rc-nm b{display:block; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .rc-nm span{font-size:11.5px; color:var(--ink-dim);}
  .rc-pt{text-align:right; flex:none;}
  .rc-pt b{display:block; font:800 20px/1 'Barlow Condensed',sans-serif;}
  .rc-pt span{font-size:11px; color:var(--ink-dim);}
  .rc-line{display:flex; align-items:center; gap:6px; font-size:11.5px; color:var(--ink-faint); padding:5px 12px; background:var(--surface-2);}
  .rc-line::before, .rc-line::after{content:""; flex:1; height:1px; background:color-mix(in srgb, var(--rc-model, #38bdf8) 40%, transparent);}
  .rc-res{display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:8px; font-size:12.5px; color:var(--ink);}
  .rc-res > div{background:var(--surface-2); border-radius:9px; padding:6px 8px; min-width:0;}
  .rc-res small{display:block; color:var(--ink-faint); font-size:10px; text-transform:uppercase; letter-spacing:.4px;}
  .rc-save{position:fixed; left:50%; transform:translateX(-50%); bottom:24px; width:min(420px, calc(100% - 32px)); z-index:975;}
  .rc-save[hidden]{display:none;}
  .rc-save button{width:100%; padding:13px; border:none; border-radius:12px; background:var(--brand); color:#04130b; font:700 15px 'Barlow',sans-serif; box-shadow:0 6px 20px rgba(0,0,0,.45); cursor:pointer;}
  @media (max-width:720px){
    .rc-save{bottom:calc(84px + env(safe-area-inset-bottom));}
    .rc-wrap{padding-bottom:150px;}
  }
  /* Kupon Yarışı: the week's leader, prices on the board, the member's entries, and the join button on saved coupons */
  .rc-lead{display:flex; align-items:center; gap:12px; margin-top:8px;}
  .rc-lead .rc-av{width:46px; height:46px; font-size:22px;}
  .rc-lead .rc-odds{font-size:34px;}
  .rc-odds{color:var(--accent) !important;}
  .rc-none{color:var(--ink-faint);}
  .rc-row.rc-mine{background:var(--surface); border:1px solid var(--border); border-radius:12px; margin-bottom:6px;}
  .sc-race-join{margin-left:auto; background:var(--brand); color:#04130b; border:none; border-radius:9px; padding:7px 12px; font:800 13px 'Barlow',sans-serif; cursor:pointer; white-space:nowrap;}
  .sc-race-join:disabled{opacity:.6; cursor:default;}
  .sc-race-in{margin-left:auto; background:color-mix(in srgb, var(--brand) 18%, var(--surface)); color:var(--brand); border:1px solid var(--brand); border-radius:9px; padding:6px 10px; font:700 12px 'Barlow',sans-serif; white-space:nowrap;}
  .sc-compact .sc-actions:has(.sc-race-join, .sc-race-in){flex-wrap:wrap; row-gap:6px;}
  .sc-compact .sc-actions .sc-legs-btn{white-space:nowrap;}

/* Yönetim > Kullanıcılar: son aktiflik and the screens a member opened (admActivityCell). */
.adm-act{font-size:11.5px; font-weight:700; white-space:nowrap;} .adm-act.now{color:var(--brand);} .adm-act.today{color:var(--ink-dim);} .adm-act.old,.adm-act.none{color:var(--ink-faint); font-weight:500;}
.adm-screens{margin-top:3px; font-size:11px; color:var(--ink-dim); max-width:240px;}
.adm-screens summary{cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} .adm-screens summary small{color:var(--ink-faint);}
.adm-screens ol{margin:6px 0 2px; padding:0; list-style:none; display:flex; flex-direction:column; gap:3px;}
.adm-screens li{display:flex; justify-content:space-between; gap:10px;} .adm-screens li span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .adm-screens time{color:var(--ink-faint); white-space:nowrap;}

/* ===== Hazır Kuponlar (3.141.0): compact premium coupon with neon league cards; admin learning panel ===== */
#panel-hazir { --hk-gold: #facc15; --hk-win: #22c55e; --hk-loss: #ef4444; --hk-void: #94a3b8; --hk-cyan: #00dfff; }
#panel-hazir .hk-module { padding: 12px 12px 10px; }
#panel-hazir .hk-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
#panel-hazir .hk-head .k-title { font-size: 12px; letter-spacing: .04em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
#panel-hazir .hk-head .tp-date { margin: 0; flex: none; gap: 6px; }
#panel-hazir .hk-tabs { gap: 6px; padding: 0 0 8px; scrollbar-width: none; }
#panel-hazir .hk-tabs::-webkit-scrollbar { display: none; }
#panel-hazir .hk-tab { flex: none; min-width: 0; flex-direction: row; align-items: center; gap: 6px; padding: 7px 11px; border-radius: 999px; font-size: 13px; font-weight: 700; color: var(--ink-dim); white-space: nowrap; }
#panel-hazir .hk-tab.on { color: var(--ink); background: linear-gradient(135deg, rgba(0,223,255,.16), rgba(16,185,129,.12)); border-color: rgba(0,223,255,.55); box-shadow: 0 0 14px rgba(0,223,255,.18); }
#panel-hazir .hk-tab-ic { font-size: 14px; }
#panel-hazir .hk-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--hk-gold); }
#panel-hazir .hk-dot.hk-w { background: var(--hk-win); } #panel-hazir .hk-dot.hk-l { background: var(--hk-loss); }
#panel-hazir .hk-dot.hk-v { background: var(--hk-void); } #panel-hazir .hk-dot.hk-n { background: transparent; border: 1px solid var(--ink-faint); }
#panel-hazir .hk-body, #panel-hazir .hk-learn { text-align: left; }
#panel-hazir .hk-body { display: flex; flex-direction: column; gap: 8px; }

/* Status pills and rails */
#panel-hazir .hk-pill { flex: none; font-size: 10.5px; font-weight: 800; letter-spacing: .05em; padding: 3px 9px; border-radius: 999px; }
#panel-hazir .hk-pill.hk-p { color: var(--hk-gold); background: rgba(250,204,21,.14); }
#panel-hazir .hk-pill.hk-w { color: #4ade80; background: rgba(34,197,94,.16); }
#panel-hazir .hk-pill.hk-l { color: #f87171; background: rgba(239,68,68,.16); }
#panel-hazir .hk-pill.hk-v { color: #cbd5e1; background: rgba(148,163,184,.16); }
#panel-hazir .hk-hero, #panel-hazir .hk-leg { --hk-rail: var(--hk-gold); position: relative; isolation: isolate; overflow: hidden; border-radius: 16px; border: 1px solid rgba(56,189,248,.22); color: #e2e8f0;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 160' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' x2='1'%3E%3Cstop offset='0' stop-color='%2300DFFF' stop-opacity='0'/%3E%3Cstop offset='.55' stop-color='%2300DFFF' stop-opacity='.55'/%3E%3Cstop offset='1' stop-color='%23008CFF' stop-opacity='.15'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M120 160C200 120 260 150 400 92' fill='none' stroke='%2300DFFF' stroke-opacity='.10' stroke-width='9'/%3E%3Cpath d='M120 160C200 120 260 150 400 92' fill='none' stroke='url(%23g)' stroke-width='1.6'/%3E%3Cpath d='M150 160C230 132 300 150 400 116' fill='none' stroke='url(%23g)' stroke-width='1' opacity='.7'/%3E%3Cpath d='M200 160C270 142 330 154 400 136' fill='none' stroke='url(%23g)' stroke-width='.8' opacity='.5'/%3E%3C/svg%3E") right bottom / 100% 70% no-repeat,
    radial-gradient(55% 90% at 88% 45%, rgba(0,223,255,.13), transparent 70%),
    linear-gradient(100deg, #071426 0%, #0b1c34 45%, #102744 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 6px 18px rgba(2,6,23,.25); }
#panel-hazir .hk-hero::after, #panel-hazir .hk-leg::after { content: ''; position: absolute; top: 0; right: 0; bottom: 0; width: 62%; z-index: -1; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='50' viewBox='0 0 56 100'%3E%3Cpath d='M28 66L0 50V16L28 0l28 16v34L28 66v34M28 0v-34' fill='none' stroke='%2300D2FF' stroke-opacity='.3' stroke-width='1.4'/%3E%3C/svg%3E") 0 0 / 28px 50px repeat;
  -webkit-mask-image: radial-gradient(70% 85% at 85% 60%, #000 25%, transparent 75%); mask-image: radial-gradient(70% 85% at 85% 60%, #000 25%, transparent 75%); }
#panel-hazir .hk-hero::before, #panel-hazir .hk-leg::before { content: ''; position: absolute; left: 7px; top: 11px; bottom: 11px; width: 4px; border-radius: 4px; background: var(--hk-rail); box-shadow: 0 0 10px var(--hk-rail); }
#panel-hazir .hk-r-w { --hk-rail: var(--hk-win); } #panel-hazir .hk-r-l { --hk-rail: var(--hk-loss); } #panel-hazir .hk-r-v { --hk-rail: var(--hk-void); }
#panel-hazir .hk-r-l.hk-leg { border-color: rgba(239,68,68,.28); } #panel-hazir .hk-r-w.hk-leg { border-color: rgba(34,197,94,.28); }

/* Coupon summary */
#panel-hazir .hk-hero { padding: 11px 14px 10px 22px; }
#panel-hazir .hk-hero-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
#panel-hazir .hk-hero-nm { font-size: 16px; font-weight: 800; color: #fff; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#panel-hazir .hk-hero-mid { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; margin-top: 2px; }
#panel-hazir .hk-hero-tg { font-size: 12px; color: #94a3b8; line-height: 1.35; min-width: 0; }
#panel-hazir .hk-hero-odds { text-align: right; flex: none; line-height: 1; }
#panel-hazir .hk-hero-odds small { display: block; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: #94a3b8; margin-bottom: 2px; }
#panel-hazir .hk-hero-odds b { font-family: 'Barlow Condensed', sans-serif; font-size: 34px; font-weight: 800; color: #fbbf24; font-variant-numeric: tabular-nums; text-shadow: 0 0 18px rgba(251,191,36,.25); }
#panel-hazir .hk-hero-stats { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 8px; padding-top: 7px; border-top: 1px solid rgba(0,210,255,.12); font-size: 11.5px; color: #94a3b8; }
#panel-hazir .hk-hero-stats b { color: #e2e8f0; font-variant-numeric: tabular-nums; }

/* Legs */
#panel-hazir .hk-legs { display: flex; flex-direction: column; gap: 7px; }
#panel-hazir .hk-leg { padding: 9px 12px 8px 22px; }
#panel-hazir .hk-leg > * { position: relative; z-index: 1; }
#panel-hazir .hk-leg > .hk-art { position: absolute; z-index: 0; right: 14px; top: 50%; transform: translateY(-38%); width: 54px; height: 44px; display: grid; place-items: center; pointer-events: none; }
#panel-hazir .hk-art-img { max-width: 100%; max-height: 100%; object-fit: contain; opacity: .9; filter: drop-shadow(0 0 6px rgba(0,223,255,.55)) drop-shadow(0 0 16px rgba(0,140,255,.35)); }
#panel-hazir .hk-leg-top { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: #94a3b8; }
#panel-hazir .hk-lg { display: inline-flex; align-items: center; gap: 5px; min-width: 0; flex: 1; overflow: hidden; }
#panel-hazir .hk-lg span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#panel-hazir .hk-lg-ic { width: 14px; height: 14px; object-fit: contain; flex: none; }
#panel-hazir .hk-tm { flex: none; font-variant-numeric: tabular-nums; }
#panel-hazir .hk-leg-mid { display: flex; align-items: center; gap: 8px; margin: 5px 0 4px; padding-right: 62px; }
#panel-hazir .hk-mt { font-size: 14.5px; font-weight: 800; color: #fff; line-height: 1.2; overflow-wrap: anywhere; }
#panel-hazir .hk-mt i { font-style: normal; color: #64748b; font-weight: 600; }
#panel-hazir .hk-leg-bot { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; padding-right: 62px; }
#panel-hazir .hk-pick { font-size: 12px; font-weight: 800; color: #5eead4; background: rgba(45,212,191,.14); border-radius: 7px; padding: 2px 8px; }
#panel-hazir .hk-at { font-size: 13px; font-weight: 800; color: #fbbf24; font-variant-numeric: tabular-nums; }
#panel-hazir .hk-fam { font-size: 10px; font-weight: 700; color: #a5b4fc; background: rgba(99,102,241,.16); border-radius: 999px; padding: 2px 7px; }
#panel-hazir .hk-score { margin-left: auto; font-family: 'Barlow Condensed', sans-serif; font-size: 16px; font-weight: 800; color: #fff; background: rgba(2,6,23,.55); border: 1px solid rgba(148,163,184,.2); border-radius: 7px; padding: 0 8px; font-variant-numeric: tabular-nums; }
#panel-hazir .hk-btn { margin-top: 2px; border-radius: 12px; }
#panel-hazir .hk-rules { font-size: 11.5px; color: var(--ink-dim); }
#panel-hazir .hk-rules summary { cursor: pointer; font-weight: 700; padding: 2px 0; }
#panel-hazir .hk-rules div { margin-top: 6px; line-height: 1.5; border-left: 3px solid #f59e0b; padding: 6px 10px; background: var(--surface-2); border-radius: 6px; }
#panel-hazir .hk-none { display: flex; flex-direction: column; gap: 4px; padding: 18px 14px; text-align: center; border: 1px dashed var(--border); border-radius: 14px; color: var(--ink-dim); font-size: 13px; }
#panel-hazir .hk-none b { color: var(--ink); font-size: 15px; } #panel-hazir .hk-none small { color: var(--ink-faint); }
@media (min-width: 900px) { #panel-hazir .hk-legs { display: grid; grid-template-columns: 1fr 1fr; } }
@media (max-width: 400px) {
  #panel-hazir .hk-leg > .hk-art { width: 44px; height: 36px; right: 10px; }
  #panel-hazir .hk-leg-mid, #panel-hazir .hk-leg-bot { padding-right: 50px; }
  #panel-hazir .hk-mt { font-size: 13.5px; }
}

/* Admin: performance and learning */
#panel-hazir .hk-learn { padding: 12px; margin-top: 12px; }
#panel-hazir .hk-lh { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
#panel-hazir .hk-lh b { display: block; font-size: 15px; color: var(--ink); } #panel-hazir .hk-lh small { font-size: 11px; color: var(--ink-faint); }
#panel-hazir .hk-ref { width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--border); background: var(--surface-3); color: var(--ink); cursor: pointer; font-size: 15px; flex: none; }
#panel-hazir .hk-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
@media (min-width: 760px) { #panel-hazir .hk-kpis { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
#panel-hazir .hk-kpi { padding: 8px 10px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--border); min-width: 0; }
#panel-hazir .hk-kpi small { display: block; font-size: 10.5px; color: var(--ink-faint); text-transform: uppercase; letter-spacing: .04em; }
#panel-hazir .hk-kpi b { display: block; font-family: 'Barlow Condensed', sans-serif; font-size: 22px; font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; line-height: 1.15; }
#panel-hazir .hk-kpi span { font-size: 11px; color: var(--ink-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
#panel-hazir .hk-up { color: var(--win, #22c55e) !important; } #panel-hazir .hk-down { color: var(--loss, #ef4444) !important; }
#panel-hazir .hk-h { margin: 14px 0 6px; font-size: 13px; color: var(--ink); }
#panel-hazir .hk-lessons { display: flex; flex-direction: column; gap: 6px; }
#panel-hazir .hk-lesson { padding: 8px 10px 8px 12px; border-radius: 10px; background: var(--surface-2); border-left: 3px solid var(--ink-faint); font-size: 12.5px; line-height: 1.45; }
#panel-hazir .hk-lesson.hk-good { border-left-color: var(--win, #22c55e); } #panel-hazir .hk-lesson.hk-bad { border-left-color: var(--loss, #ef4444); } #panel-hazir .hk-lesson.hk-info { border-left-color: #38bdf8; }
#panel-hazir .hk-lesson b { display: block; color: var(--ink); font-size: 12.5px; } #panel-hazir .hk-lesson span { color: var(--ink-dim); display: block; }
#panel-hazir .hk-lesson em { display: block; margin-top: 3px; font-style: normal; font-size: 11.5px; color: #38bdf8; }
#panel-hazir .hk-tw { overflow-x: auto; border: 1px solid var(--border); border-radius: 10px; }
#panel-hazir .hk-t { width: 100%; border-collapse: collapse; font-size: 12px; white-space: nowrap; }
#panel-hazir .hk-t th { text-align: left; font-size: 10.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-faint); padding: 6px 8px; background: var(--surface-2); }
#panel-hazir .hk-t td { padding: 6px 8px; border-top: 1px solid var(--border); color: var(--ink); font-variant-numeric: tabular-nums; }
#panel-hazir .hk-t td small { color: var(--ink-faint); }
#panel-hazir .hk-form { letter-spacing: 1px; }
#panel-hazir .hk-f { display: inline-grid; place-items: center; width: 15px; height: 15px; border-radius: 4px; font-size: 9px; font-style: normal; font-weight: 900; color: #fff; margin-right: 2px; }
#panel-hazir .hk-f-w { background: #16a34a; } #panel-hazir .hk-f-l { background: #b91c1c; } #panel-hazir .hk-f-v { background: #64748b; }
#panel-hazir .hk-bars { display: flex; flex-direction: column; gap: 5px; }
#panel-hazir .hk-bar { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(60px, 1fr) auto; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 10px; background: var(--surface-2); font-size: 12.5px; }
#panel-hazir .hk-bar.hk-own { box-shadow: inset 3px 0 0 #00dfff; }
#panel-hazir .hk-bn { min-width: 0; color: var(--ink); font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#panel-hazir .hk-bn small { display: block; font-weight: 500; font-size: 10.5px; color: var(--ink-faint); }
#panel-hazir .hk-bt { position: relative; height: 8px; border-radius: 4px; background: var(--surface-3); }
#panel-hazir .hk-bt::before { content: ''; position: absolute; left: 50%; top: -2px; bottom: -2px; width: 1px; background: var(--ink-faint); }
#panel-hazir .hk-bt i { position: absolute; top: 0; bottom: 0; border-radius: 4px; }
#panel-hazir .hk-bt i.pos { left: 50%; background: var(--win, #22c55e); } #panel-hazir .hk-bt i.neg { right: 50%; background: var(--loss, #ef4444); }
#panel-hazir .hk-bar b { font-variant-numeric: tabular-nums; min-width: 58px; text-align: right; }
#panel-hazir .hk-more { margin-top: 10px; font-size: 12.5px; }
#panel-hazir .hk-more summary { cursor: pointer; font-weight: 800; color: var(--ink); padding: 4px 0; }
#panel-hazir .hk-sub { margin: 6px 0; font-size: 11.5px; color: var(--ink-dim); line-height: 1.45; }
#panel-hazir .hk-chips { display: flex; flex-wrap: wrap; gap: 5px; margin: 6px 0; }
#panel-hazir .hk-chips span { font-size: 11.5px; font-weight: 700; padding: 3px 8px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--border); }
#panel-hazir .hk-learn[hidden] { display: none !important; }
/* Hazır Kuponlar public scorecard (3.142.0) */
#panel-hazir .hk-pub { text-align: left; }
#panel-hazir .hk-kpis.hk-kpis4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 760px) { #panel-hazir .hk-kpis.hk-kpis4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
#panel-hazir .hk-crows { display: flex; flex-direction: column; gap: 5px; margin-top: 10px; }
#panel-hazir .hk-crow { display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto; align-items: center; gap: 4px 10px; padding: 7px 10px; border-radius: 10px; background: var(--surface-2); font-size: 12.5px; font-variant-numeric: tabular-nums; }
#panel-hazir .hk-cn { min-width: 0; font-weight: 700; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#panel-hazir .hk-cn small { display: block; font-weight: 500; font-size: 10.5px; color: var(--ink-faint); }
#panel-hazir .hk-cw { color: var(--ink-dim); } #panel-hazir .hk-ch { color: var(--ink); font-weight: 700; }
#panel-hazir .hk-cr { min-width: 52px; text-align: right; }
#panel-hazir .hk-cf { grid-column: 1 / -1; }
@media (min-width: 760px) { #panel-hazir .hk-crow { grid-template-columns: minmax(0, 1fr) auto auto auto auto; } #panel-hazir .hk-cf { grid-column: auto; } }

/* Kısayollar (home): a bento of three tinted tiles, the coupons tile spanning both rows */
.home-shortcuts{margin:12px 0;}
.hs-head{display:flex; align-items:center; gap:7px; margin:0 2px 8px; font:800 12px 'Barlow',sans-serif; letter-spacing:1.4px; text-transform:uppercase; color:var(--ink-dim);}
.hs-bolt svg{width:15px; height:15px; display:block; fill:#fbbf24; filter:drop-shadow(0 0 6px rgba(251,191,36,.55));}
.hs-grid{display:grid; grid-template-columns:1.1fr 1fr; grid-auto-rows:minmax(64px, auto); gap:8px;}
.hs-btn{--c1:#38b6ff; --c2:#4f6bff; position:relative; display:flex; align-items:center; gap:10px; min-width:0; padding:11px 12px; border-radius:16px; overflow:hidden; text-align:left; cursor:pointer; color:var(--ink);
  background:radial-gradient(120% 140% at 0% 0%, color-mix(in srgb, var(--c1) 26%, transparent), transparent 60%), linear-gradient(160deg, #141d33, #0d1424);
  border:1px solid color-mix(in srgb, var(--c1) 32%, transparent); box-shadow:inset 0 1px 0 rgba(255,255,255,.07), 0 10px 24px -14px color-mix(in srgb, var(--c1) 70%, transparent);
  transition:transform .15s, border-color .15s; -webkit-tap-highlight-color:transparent;}
.hs-btn:active{transform:scale(.98);}
.hs-btn:hover{border-color:color-mix(in srgb, var(--c1) 60%, transparent);}
.hs-btn:focus-visible{outline:2px solid var(--c1); outline-offset:2px;}
.hs-ticket{--c1:#f5a524; --c2:#e0581f;} .hs-vault{--c1:#2fd4a7; --c2:#0ea371;} .hs-whale{--c1:#38b6ff; --c2:#5b5bff;}
.hs-big{grid-row:span 2; flex-direction:column; align-items:flex-start; justify-content:space-between; padding:14px;}
.hs-ic{display:grid; place-items:center; flex:none; width:38px; height:38px; border-radius:12px; color:#fff; background:linear-gradient(140deg, var(--c1), var(--c2));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 6px 14px -4px color-mix(in srgb, var(--c1) 70%, transparent);}
.hs-big .hs-ic{width:48px; height:48px; border-radius:15px;}
.hs-ic svg{width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;}
.hs-big .hs-ic svg{width:27px; height:27px;}
.hs-tx{display:flex; flex-direction:column; gap:2px; min-width:0;}
.hs-tx b{font:800 14.5px 'Barlow',sans-serif; line-height:1.1; color:#fff;}
.hs-big .hs-tx b{font-size:17px;}
.hs-tx small{font:600 11px 'Barlow',sans-serif; color:var(--ink-dim); line-height:1.25; overflow:hidden; text-overflow:ellipsis;}
.hs-btn:not(.hs-big) .hs-tx small{white-space:nowrap;}
.hs-go{position:absolute; right:10px; top:50%; transform:translateY(-50%); font:700 18px 'Barlow',sans-serif; color:color-mix(in srgb, var(--c1) 80%, #fff);}
.hs-big .hs-go{top:14px; transform:none;}
.hs-btn:not(.hs-big) .hs-tx{padding-right:10px;}

/* Günün En Güvenilir Tercihleri: scoreboard rows (teams stacked with crests, the pick and price, a probability ring) */
#kpiTopPicksList{gap:0; justify-content:flex-start;}
#kpiTopPicksList .tp-row{display:grid; grid-template-columns:22px minmax(0,1fr) auto 46px; align-items:center; gap:10px; padding:11px 4px; border-bottom:1px solid rgba(255,255,255,.06); position:relative;}
#kpiTopPicksList .tp-row:last-of-type{border-bottom:none;}
#kpiTopPicksList .tp-top{margin:2px -6px 4px; padding:12px 10px; border:1px solid rgba(245,185,66,.28); border-radius:14px; background:linear-gradient(120deg, rgba(245,185,66,.10), rgba(245,185,66,0) 55%), rgba(255,255,255,.02);}
#kpiTopPicksList .tp-rank{display:grid; place-items:center; width:22px; height:22px; border-radius:7px; font:800 11.5px 'Barlow',sans-serif; color:var(--ink-faint); background:rgba(255,255,255,.05);}
#kpiTopPicksList .tp-r1{background:linear-gradient(140deg, #ffe08a, #d99a1e); color:#3a2600; box-shadow:0 0 12px rgba(245,185,66,.35);}
#kpiTopPicksList .tp-r2{background:linear-gradient(140deg, #f1f5f9, #94a3b8); color:#1e293b;}
#kpiTopPicksList .tp-r3{background:linear-gradient(140deg, #f3c69b, #b26a32); color:#2b1406;}
#kpiTopPicksList .tp-r-w{background:rgba(34,197,94,.18); color:#4ade80;}
#kpiTopPicksList .tp-r-l{background:rgba(239,68,68,.16); color:#f87171;}
#kpiTopPicksList .tp-teams{display:flex; flex-direction:column; gap:4px; min-width:0;}
#kpiTopPicksList .tp-team{display:flex; align-items:center; gap:7px; min-width:0;}
#kpiTopPicksList .tp-team .lc-crest{width:20px; height:20px; font-size:8px;}
#kpiTopPicksList .tp-team .lc-crest img{width:16px; height:16px;}
#kpiTopPicksList .tp-team b{font:700 13.5px 'Barlow',sans-serif; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
#kpiTopPicksList .tp-meta{font:600 10.5px 'Barlow',sans-serif; color:var(--ink-faint); padding-left:27px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
#kpiTopPicksList .tp-bet{display:flex; flex-direction:column; align-items:center; gap:3px; min-width:52px;}
#kpiTopPicksList .tp-pk{font:800 11px 'Barlow',sans-serif; letter-spacing:.3px; color:#bae6fd; padding:2px 8px; border-radius:6px; background:rgba(56,182,255,.14); border:1px solid rgba(56,182,255,.3); white-space:nowrap;}
#kpiTopPicksList .tp-od{font:800 19px 'Barlow Condensed',sans-serif; color:#fbbf24; line-height:1;}
#kpiTopPicksList .tp-od-fair{color:var(--ink-dim);}
#kpiTopPicksList .tp-ring{--p:0; --rc:#2fd4a7; position:relative; display:flex; align-items:baseline; justify-content:center; padding-top:13px; box-sizing:border-box; width:46px; height:46px; border-radius:50%;
  background:conic-gradient(var(--rc) calc(var(--p) * 1%), rgba(255,255,255,.09) 0); box-shadow:0 0 14px -4px var(--rc);}
#kpiTopPicksList .tp-ring::before{content:''; position:absolute; inset:4px; border-radius:50%; background:#0f1729;}
#kpiTopPicksList .tp-ring b, #kpiTopPicksList .tp-ring small{position:relative;}
#kpiTopPicksList .tp-ring b{font:800 15px 'Barlow Condensed',sans-serif; color:#fff; line-height:1;}
#kpiTopPicksList .tp-ring small{font:700 9px 'Barlow',sans-serif; color:var(--ink-faint); margin-left:1px;}
#kpiTopPicksList .tp-won .tp-ring{--rc:#22c55e;}
#kpiTopPicksList .tp-lost .tp-ring{--rc:#ef4444;}
#kpiTopPicksList .tp-lost .tp-teams, #kpiTopPicksList .tp-lost .tp-bet{opacity:.6;}
#kpiTopPicksList .tp-won .tp-team b{color:#dcfce7;}
.tp-tier .tp-brain-btn{flex:0 0 auto;}
.tp-tier .tp-brain-btn.on{background:rgba(168,85,247,.16); border-color:#a855f7; color:#d8b4fe;}

/* Tercih Beyni (admin) */
.pb{display:flex; flex-direction:column; gap:10px; font-size:12px; color:var(--ink);}
.pb-up{color:#4ade80;} .pb-down{color:#f87171;} .pb-dim{color:var(--ink-faint);}
.pb-kpis{display:grid; grid-template-columns:repeat(auto-fit, minmax(92px, 1fr)); gap:6px;}
.pb-kpi{display:flex; flex-direction:column; gap:2px; padding:8px; border-radius:10px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.07); color:var(--ink);}
.pb-kpi span{font-size:10.5px; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.4px;}
.pb-kpi b{font:800 20px 'Barlow Condensed',sans-serif;}
.pb-kpi.pb-up b{color:#4ade80;} .pb-kpi.pb-down b{color:#f87171;}
.pb-kpi em{font-style:normal; font-size:10.5px; color:var(--ink-dim);}
.pb-spark{display:flex; align-items:flex-end; gap:2px; height:44px; padding:4px; border-radius:8px; background:rgba(255,255,255,.03);}
.pb-spark i{flex:1; border-radius:2px 2px 0 0; background:currentColor; opacity:.75;}
.pb-h{display:flex; align-items:center; justify-content:space-between; font:800 13px 'Barlow',sans-serif; margin-top:4px;}
.pb-h small{font-weight:600; color:var(--ink-faint);}
.pb-ref{background:none; border:1px solid var(--border); color:var(--ink-dim); border-radius:6px; padding:1px 7px; cursor:pointer;}
.pb-note{color:var(--ink-dim); line-height:1.45;}
.pb-lessons{margin:0; padding-left:16px; display:flex; flex-direction:column; gap:4px; line-height:1.4;}
.pb-picks{display:flex; flex-direction:column; gap:5px;}
.pb-pick{display:flex; align-items:center; gap:8px; padding:7px 9px; border-radius:10px; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.06);}
.pb-pm{flex:1; min-width:0;} .pb-pm b, .pb-pm span{display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.pb-pm span{font-size:10.5px; color:var(--ink-faint);}
.pb-pp{display:flex; flex-direction:column; align-items:flex-end; font-size:10.5px; color:var(--ink-dim); flex-shrink:0;}
.pb-pp b{color:var(--ink);}
.pb-v{display:flex; flex-direction:column; align-items:center; min-width:48px; font-weight:800; flex-shrink:0;}
.pb-v small{font-weight:600; font-size:10px; color:var(--ink-faint);}
.pb-tw{overflow-x:auto;}
.pb-t{width:100%; border-collapse:collapse; font-size:11px;}
.pb-t th, .pb-t td{padding:4px 5px; text-align:right; border-bottom:1px solid rgba(255,255,255,.05); white-space:nowrap;}
.pb-t th:first-child, .pb-t td:first-child{text-align:left;}
.pb-t thead th{color:var(--ink-faint); font-weight:700;}
.pb-cal{display:flex; flex-direction:column; gap:5px;}
.pb-cal > div{display:grid; grid-template-columns:62px 1fr 38px 30px; align-items:center; gap:6px;}
.pb-cal > div > i{position:relative; height:8px; border-radius:4px; background:rgba(255,255,255,.06);}
.pb-cal > div > i > i{position:absolute; left:0; top:0; bottom:0; border-radius:4px;}
.pb-cal .pb-exp{background:rgba(255,255,255,.18);} .pb-cal .pb-act{background:currentColor; height:4px; top:2px !important; bottom:auto !important;}
.pb-cal em, .pb-lg em{font-style:normal; color:var(--ink-faint); font-size:10.5px;}
.pb-lg{display:grid; grid-template-columns:1fr 1fr; gap:8px;}
.pb-lg ul{margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:4px;}
.pb-lg li{display:grid; grid-template-columns:1fr auto; gap:0 6px; padding:5px 7px; border-radius:8px; background:rgba(255,255,255,.03);}
.pb-lg li span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.pb-lg li em{grid-column:1 / -1;}
@media (max-width:720px){ .pb-lg{grid-template-columns:1fr;} }
/* Tercihler card controls: a segmented tier switch and pill market tabs */
#kpiCardTopPicks .tp-tier{gap:3px; padding:3px; border-radius:12px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.06);}
#kpiCardTopPicks .tp-tier button{border:none; background:transparent; border-radius:9px; padding:7px 8px; color:var(--ink-dim); font-size:12.5px;}
#kpiCardTopPicks .tp-tier button.on{color:#fff; background:linear-gradient(140deg, #14b8a6, #0ea5e9); box-shadow:0 4px 14px -6px rgba(14,165,233,.8);}
#kpiCardTopPicks .tp-tier .tp-brain-btn.on{background:linear-gradient(140deg, #a855f7, #6366f1); color:#fff; box-shadow:0 4px 14px -6px rgba(168,85,247,.8);}
#kpiTopPicksTabs{gap:6px; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; margin:4px 0 6px;}
#kpiTopPicksTabs::-webkit-scrollbar{display:none;}
#kpiTopPicksTabs .kpi-tab{flex:none; padding:6px 12px; border-radius:999px; font-size:12px; border-color:rgba(255,255,255,.08); background:rgba(255,255,255,.03);}
#kpiTopPicksTabs .kpi-tab.active{color:#bae6fd; border-color:rgba(56,182,255,.5); background:rgba(56,182,255,.14);}

/* İstatistikler sekmesi (app.js stLoad): ranked leagues and teams, and each league's table. */
#panel-istatistik .ist-wrap{max-width:980px; margin:0 auto;}
.ist-head{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:10px;}
.ist-head .ist-subtabs{margin-bottom:0;}
.ist-sel{display:inline-flex; align-items:center; gap:8px; font-size:12px; color:var(--ink-dim); font-weight:700;}
.ist-sel select{background:var(--surface-2); color:var(--ink); border:1px solid var(--border); border-radius:10px; padding:8px 10px; font-size:13px; font-weight:600; font-family:inherit; max-width:230px;}
.ist-metrics{display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; margin:0 0 12px; padding-bottom:2px;}
.ist-metrics::-webkit-scrollbar{display:none;}
.ist-metrics[hidden]{display:none;}
.ist-metrics .kpi-tab{flex:none; padding:7px 12px; border-radius:999px; font-size:12.5px; white-space:nowrap;}
.ist-cap{font-size:12px; color:var(--ink-faint); margin:0 2px 8px;}
.ist-cap b{color:var(--ink-dim); font-weight:700;}
.ist-list{display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--border); border-radius:14px; overflow:hidden;}
.ist-row{display:grid; grid-template-columns:30px minmax(0, 1fr) minmax(92px, 34%); align-items:center; gap:10px; padding:10px 12px; background:none; border:0; border-bottom:1px solid var(--border); color:inherit; font:inherit; text-align:left; cursor:pointer; width:100%; -webkit-tap-highlight-color:transparent;}
.ist-row:last-child{border-bottom:0;}
.ist-row:hover{background:var(--surface-2);}
.ist-rk{width:26px; height:26px; border-radius:8px; display:inline-flex; align-items:center; justify-content:center; font-size:12px; font-weight:800; color:var(--ink-dim); background:var(--surface-2); font-variant-numeric:tabular-nums;}
.ist-rk.top{color:var(--bg); background:var(--brand);}
.ist-nm{display:flex; align-items:center; justify-content:flex-start; gap:9px; min-width:0;}
.ist-tx{min-width:0; flex:1; display:flex; flex-direction:column; align-items:flex-start; text-align:left;}
.ist-tx b, .ist-tx small{align-self:stretch; margin:0; text-align:left;}
.ist-nm b{font-size:13.5px; font-weight:700; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.ist-nm small{font-size:11.5px; color:var(--ink-faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.ist-nm .pg-crest{width:24px; height:24px;}
.ist-lg{width:26px; height:26px; object-fit:contain; flex:none; display:inline-block; border-radius:6px; background:#fff; padding:2px;}
.ist-lg.big{width:40px; height:40px; border-radius:10px; padding:4px;}
.ist-val{display:flex; flex-direction:column; align-items:flex-end; gap:5px;}
.ist-val b{font-size:16px; font-weight:800; color:var(--ink); font-variant-numeric:tabular-nums;}
.ist-bar{width:100%; height:5px; border-radius:3px; background:var(--surface-3); overflow:hidden;}
.ist-bar i{display:block; height:100%; border-radius:3px; background:linear-gradient(90deg, var(--brand-dark), var(--brand)); margin-left:auto;}
.ist-lhead{display:flex; align-items:center; gap:12px; margin-bottom:12px;}
.ist-lhead > div{min-width:0; flex:1; display:flex; flex-direction:column;}
.ist-lhead b{font-size:17px; font-weight:800; color:var(--ink);}
.ist-lhead small{font-size:12px; color:var(--ink-faint);}
.ist-open{flex:none;}
.ist-scroll{overflow-x:auto; background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:4px 8px;}
.ist-table td.tm{max-width:170px;}
.ist-form{display:inline-flex; gap:2px;}
.ist-form i{width:16px; height:16px; border-radius:4px; font-style:normal; font-size:10px; font-weight:800; line-height:16px; text-align:center; color:#fff;}
.ist-form i.w{background:var(--win);} .ist-form i.d{background:var(--ink-faint);} .ist-form i.l{background:var(--loss);}
#panel-istatistik .pg-h{font-size:13px; font-weight:800; color:var(--ink); margin:16px 2px 8px;}
@media (max-width:640px){
  .ist-head{flex-direction:column; align-items:stretch;}
  .ist-head .ist-subtabs{flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none;}
  .ist-head .ist-subtabs button{flex:1 0 auto;}
  .ist-sel select{flex:1; max-width:none;}
  .ist-row{grid-template-columns:26px minmax(0, 1fr) 84px; gap:8px; padding:9px 10px;}
  .ist-table .ist-fcol{display:none;}
  .ist-table td.tm{max-width:120px;}
}