/* ================================================================
   Maç izle motoru — tek CSS, 8 tema varyantı (data-* seçicileri).
   Renk/font/radius değerleri :root'a PHP tarafından basılır (theme.php).
   ================================================================ */
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none !important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--f-body);
  font-size:15.5px;line-height:1.62;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
h1,h2,h3,h4{font-family:var(--f-display);line-height:1.16;margin:0 0 .5em;letter-spacing:-.02em}
h1{font-size:clamp(1.55rem,4.2vw,2.6rem)}
h2{font-size:clamp(1.2rem,2.6vw,1.7rem)}
h3{font-size:1.06rem}
p{margin:0 0 1em}
.wrap{width:100%;max-width:1280px;margin:0 auto;padding:0 16px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;background:var(--acc);color:#000;padding:8px 14px;border-radius:var(--r-sm);z-index:99}

/* ---------- arka plan desenleri ---------- */
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:var(--bg)}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.85}
[data-pattern="mesh"] body::after,body[data-x] ::after{}
html[data-pattern="mesh"] body::after{background:
  radial-gradient(60% 50% at 12% 0%,color-mix(in srgb,var(--acc) 26%,transparent),transparent 70%),
  radial-gradient(50% 45% at 88% 8%,color-mix(in srgb,var(--acc2) 20%,transparent),transparent 70%),
  linear-gradient(180deg,var(--bg2),var(--bg) 55%)}
html[data-pattern="aurora"] body::after{background:
  conic-gradient(from 210deg at 25% 10%,color-mix(in srgb,var(--acc) 30%,transparent),transparent 45%),
  radial-gradient(70% 60% at 80% 0%,color-mix(in srgb,var(--acc2) 22%,transparent),transparent 65%),
  linear-gradient(170deg,var(--bg2),var(--bg))}
html[data-pattern="grid"] body::after{background:
  linear-gradient(180deg,var(--bg2),var(--bg) 60%),
  linear-gradient(90deg,color-mix(in srgb,var(--line) 55%,transparent) 1px,transparent 1px) 0 0/56px 56px,
  linear-gradient(0deg,color-mix(in srgb,var(--line) 55%,transparent) 1px,transparent 1px) 0 0/56px 56px;
  opacity:.55}
html[data-pattern="stripes"] body::after{background:
  linear-gradient(180deg,var(--bg2),var(--bg) 65%),
  repeating-linear-gradient(115deg,color-mix(in srgb,var(--acc) 8%,transparent) 0 2px,transparent 2px 26px);opacity:.7}
html[data-pattern="noise"] body::after{background:
  radial-gradient(70% 55% at 50% -10%,color-mix(in srgb,var(--acc) 24%,transparent),transparent 65%),
  linear-gradient(180deg,var(--bg2),var(--bg) 60%)}

/* ---------- üst yardımcı bar ---------- */
.util{border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(10px)}
.util-in{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:38px;font-size:12.5px}
.util-links{display:flex;align-items:center;gap:10px;color:var(--muted);flex-wrap:wrap}
.util-links a:hover{color:var(--acc)}
.util .sep{width:1px;height:12px;background:var(--line)}
.util-right{display:flex;align-items:center;gap:12px;color:var(--muted)}
.util-live{display:inline-flex;align-items:center;gap:6px;color:var(--text);font-weight:600}
.util-live b{color:var(--live)}
.dot{width:7px;height:7px;border-radius:50%;background:var(--live);display:inline-block;
  box-shadow:0 0 0 0 color-mix(in srgb,var(--live) 60%,transparent);animation:pulse 1.8s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 8px transparent}100%{box-shadow:0 0 0 0 transparent}}
.tgl{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-pill);color:var(--muted);
  cursor:pointer;padding:3px 8px;display:inline-flex;gap:4px;line-height:1}
.tgl:hover{color:var(--acc);border-color:var(--acc)}
.util-clock{font-variant-numeric:tabular-nums}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 88%,transparent);
  backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.hdr-in{display:flex;align-items:center;gap:14px;min-height:64px}
.brand{display:flex;align-items:center;gap:10px;flex-shrink:0}
.brand-mark{color:var(--acc);display:grid;place-items:center;width:40px;height:40px;border-radius:var(--r-md);
  background:linear-gradient(140deg,color-mix(in srgb,var(--acc) 22%,transparent),transparent);border:1px solid var(--line)}
.brand-txt b{font-family:var(--f-display);font-size:1.18rem;letter-spacing:-.03em;display:block;line-height:1.1}
.brand-txt i{font-style:normal;font-size:10.5px;color:var(--muted);letter-spacing:.14em;text-transform:uppercase}
.nav{display:flex;align-items:center;gap:4px;margin-left:8px;flex:1}
.nav>a,.nav-drop-t{position:relative;padding:9px 13px;border-radius:var(--r-pill);color:var(--muted);
  font-weight:600;font-size:14px;white-space:nowrap;transition:.16s}
.nav>a:hover,.nav-drop:hover .nav-drop-t{color:var(--text);background:var(--surface)}
.nav>a.on{color:var(--acc)}
html[data-nav="pill"] .nav>a.on{background:color-mix(in srgb,var(--acc) 16%,transparent)}
html[data-nav="underline"] .nav>a,html[data-nav="underline"] .nav-drop-t{border-radius:0;padding:9px 12px}
html[data-nav="underline"] .nav>a::after{content:"";position:absolute;left:12px;right:12px;bottom:2px;height:2px;
  background:var(--acc);transform:scaleX(0);transition:.18s}
html[data-nav="underline"] .nav>a:hover::after,html[data-nav="underline"] .nav>a.on::after{transform:scaleX(1)}
html[data-nav="underline"] .nav>a:hover{background:none}
html[data-nav="mega"] .nav>a{letter-spacing:.06em;font-size:12.5px;font-weight:700}
html[data-nav="sidebar"] .hdr-in{flex-wrap:wrap}
html[data-nav="sidebar"] .nav{order:3;width:100%;border-top:1px solid var(--line);padding:6px 0;margin:0;overflow-x:auto}
.badge-live{font-style:normal;background:var(--live);color:#fff;font-size:10px;font-weight:800;
  padding:1px 5px;border-radius:var(--r-pill);margin-left:5px;vertical-align:top}
.nav-drop{position:relative}
.chev{font-style:normal;font-size:10px;opacity:.7}
.drop{position:absolute;top:calc(100% + 10px);left:-10px;min-width:280px;background:var(--bg2);
  border:1px solid var(--line);border-radius:var(--r-md);box-shadow:0 24px 60px -18px rgba(0,0,0,.75);
  padding:8px;display:none;grid-template-columns:1fr;gap:2px;z-index:60;max-height:70vh;overflow:auto}
.drop::before{content:"";position:absolute;top:-6px;left:22px;width:11px;height:11px;background:var(--bg2);
  border-left:1px solid var(--line);border-top:1px solid var(--line);transform:rotate(45deg)}
html[data-nav="mega"] .drop{grid-template-columns:1fr 1fr;min-width:440px}
.nav-drop:hover .drop,.nav-drop:focus-within .drop{display:grid}
.drop a{display:flex;justify-content:space-between;gap:10px;padding:8px 10px;border-radius:var(--r-sm);
  font-size:13.5px;color:var(--muted)}
.drop a:hover{background:var(--surface2);color:var(--text)}
.drop a span{color:var(--acc);font-weight:700;font-size:12px}
.search{display:flex;align-items:center;gap:0;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-pill);padding:3px 3px 3px 12px;min-width:210px}
.search input{background:none;border:0;color:var(--text);outline:none;width:100%;font-size:13.5px;padding:6px 0}
.search input::placeholder{color:var(--muted)}
.search button{background:var(--acc);color:#04121a;border:0;border-radius:var(--r-pill);width:32px;height:32px;
  display:grid;place-items:center;cursor:pointer;flex-shrink:0}
.burger{display:none;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);
  width:40px;height:38px;flex-direction:column;gap:4px;align-items:center;justify-content:center;cursor:pointer;margin-left:auto}
.burger span{width:18px;height:2px;background:var(--text);border-radius:2px}

/* ---------- canlı şerit ---------- */
.ticker{display:flex;align-items:stretch;gap:0;border-bottom:1px solid var(--line);
  background:color-mix(in srgb,var(--surface) 70%,transparent);overflow:hidden;position:relative}
.ticker::after{content:"";position:absolute;right:0;top:0;bottom:0;width:70px;pointer-events:none;
  background:linear-gradient(90deg,transparent,var(--bg));z-index:2}
.ticker-mask::before{content:"";position:absolute;left:0;top:0;bottom:0;width:40px;pointer-events:none;
  background:linear-gradient(270deg,transparent,color-mix(in srgb,var(--surface) 88%,var(--bg)));z-index:2}
.ticker-lbl{display:flex;align-items:center;gap:7px;padding:8px 14px;background:var(--live);color:#fff;
  font-weight:800;font-size:11.5px;letter-spacing:.1em;flex-shrink:0}
.ticker-lbl .dot{background:#fff}
.ticker-mask{flex:1;overflow:hidden;position:relative;min-width:0}
.ticker-track{display:flex;gap:0;align-items:center;padding:8px 0;white-space:nowrap;
  animation:slide 70s linear infinite;will-change:transform}
.ticker:hover .ticker-track{animation-play-state:paused}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tick{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);
  flex:0 0 auto;padding:0 18px;border-right:1px solid color-mix(in srgb,var(--line) 70%,transparent);
  white-space:nowrap;max-width:340px;overflow:hidden}
.tick b{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tick b{color:var(--text);font-weight:600}
.tick em{font-style:normal;font-variant-numeric:tabular-nums;color:var(--acc);font-weight:800;
  background:var(--surface2);padding:1px 7px;border-radius:var(--r-sm)}
.tick-lg{font-size:11px;opacity:.7;letter-spacing:.04em}
.tick-min{color:var(--live);font-size:11.5px;font-weight:700}

/* ---------- hero ---------- */
.hero{padding:36px 0 30px;position:relative}
.hero-in{display:grid;grid-template-columns:1.15fr .85fr;gap:34px;align-items:center}
html[data-hero="center"] .hero-in{grid-template-columns:1fr;text-align:center;max-width:900px}
html[data-hero="center"] .hero-cta,html[data-hero="center"] .hero-search{justify-content:center}
html[data-hero="center"] .hero-card{margin:8px auto 0;max-width:560px}
html[data-hero="ticker"] .hero{padding:26px 0 22px}
html[data-hero="ticker"] .hero-in{grid-template-columns:1fr 1fr;gap:26px}
html[data-hero="scoreboard"] .hero-card{background:linear-gradient(160deg,var(--surface2),var(--surface));transform:none}
.pill{display:inline-flex;align-items:center;gap:7px;background:color-mix(in srgb,var(--acc) 14%,transparent);
  border:1px solid color-mix(in srgb,var(--acc) 35%,transparent);color:var(--acc);font-size:12px;font-weight:700;
  padding:5px 12px;border-radius:var(--r-pill);margin-bottom:14px;letter-spacing:.02em}
.hero h1{margin-bottom:12px}
.grad{background:linear-gradient(100deg,var(--acc),var(--acc2));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-txt>p{color:var(--muted);max-width:60ch;margin-bottom:18px}
.hero-cta{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 20px;border-radius:var(--r-pill);
  font-weight:700;font-size:14px;border:1px solid transparent;cursor:pointer;transition:.18s}
.btn.primary{background:linear-gradient(120deg,var(--acc),var(--acc2));color:#05121b;box-shadow:var(--shadow)}
.btn.primary:hover{filter:brightness(1.07);transform:translateY(-1px)}
.btn.ghost{background:var(--surface);border-color:var(--line);color:var(--text)}
.btn.ghost:hover{border-color:var(--acc);color:var(--acc)}
.btn.wide{width:100%;margin-top:12px}
.hero-search{display:flex;gap:8px;max-width:520px}
.hero-search.wide{max-width:100%;margin-bottom:18px}
.hero-search input{flex:1;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-pill);
  padding:12px 18px;color:var(--text);outline:none;font-size:14px}
.hero-search input:focus{border-color:var(--acc)}
.hero-search button{background:var(--surface2);border:1px solid var(--line);border-radius:var(--r-pill);
  color:var(--text);padding:0 22px;cursor:pointer;font-weight:700}
.hero-search button:hover{background:var(--acc);color:#04121a;border-color:var(--acc)}
.hero-card{background:linear-gradient(155deg,var(--surface),var(--bg2));border:1px solid var(--line);
  border-radius:var(--r-lg);padding:18px;box-shadow:var(--shadow)}
.hc-top{display:flex;justify-content:space-between;align-items:center;font-size:11.5px;
  letter-spacing:.06em;color:var(--muted);margin-bottom:14px}
.hc-live{display:inline-flex;align-items:center;gap:6px;color:var(--live);font-weight:800}
.hc-mid{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;margin-bottom:14px}
.hc-team{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;font-size:13.5px}
.hc-team b{font-weight:700;line-height:1.25}
.hc-sc{font-family:var(--f-display);font-size:1.9rem;font-variant-numeric:tabular-nums;color:var(--acc);
  padding:6px 14px;border-radius:var(--r-md);background:color-mix(in srgb,var(--acc) 10%,transparent)}

/* ---------- takım logosu / monogram ---------- */
.tlogo{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;
  background:var(--surface2);overflow:hidden;border:1px solid var(--line)}
.tlogo img{width:26px;height:26px;object-fit:contain}
.tlogo.mono{font-family:var(--f-display);font-size:12px;font-weight:800;letter-spacing:-.02em;color:#fff;
  background:hsl(var(--h) 55% 34%);border-color:hsl(var(--h) 55% 44%)}
.tlogo.big{width:52px;height:52px}
.tlogo.big img{width:44px;height:44px}
.tlogo.big.mono{font-size:18px}

/* ---------- layout ---------- */
.layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:26px;padding:24px 16px 46px;align-items:start}
@media (min-width:1400px){.wrap{max-width:1400px}.layout{grid-template-columns:minmax(0,1fr) 340px}}
.main-col{min-width:0}
.sec-t{margin:26px 0 12px;display:flex;align-items:center;gap:9px;font-size:1.14rem}
.sec-t:first-child{margin-top:0}
.pg-t{margin:6px 0 16px}
.empty{color:var(--muted);background:var(--surface);border:1px dashed var(--line);
  border-radius:var(--r-md);padding:18px;text-align:center}

/* ---------- bülten ---------- */
.bulletin{display:flex;flex-direction:column;gap:14px}
.bl-group{background:color-mix(in srgb,var(--surface) 75%,transparent);border:1px solid var(--line);
  border-radius:var(--r-md);overflow:hidden}
.bl-head{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--surface2);
  border-bottom:1px solid var(--line);font-size:12.5px}
.bl-head b{font-family:var(--f-display);letter-spacing:-.01em;font-size:13.5px}
.bl-head span{color:color-mix(in srgb,var(--text) 62%,var(--muted))}
.bl-head i{margin-left:auto;font-style:normal;color:var(--acc);font-weight:700;font-size:11.5px}
.bl-row{display:grid;grid-template-columns:88px minmax(0,1fr) 168px 78px;align-items:center;gap:10px;
  padding:9px 14px;border-bottom:1px solid color-mix(in srgb,var(--line) 60%,transparent);transition:.14s}
.bl-row:last-child{border-bottom:0}
.bl-row:hover{background:var(--surface2)}
.bl-row.is-live{background:linear-gradient(90deg,color-mix(in srgb,var(--live) 12%,transparent),transparent 40%)}
.bl-time{display:flex;flex-direction:column;gap:2px;font-size:12px}
.sc{font-variant-numeric:tabular-nums;font-weight:800;font-family:var(--f-display);font-size:15px}
.sc.live{color:var(--live)}
.sc.soon{color:var(--text)}
.sc.done{color:var(--muted)}
.min{font-size:11px;color:color-mix(in srgb,var(--text) 60%,var(--muted));letter-spacing:.03em}
.bl-row.is-live .min{color:var(--live)}
.bl-teams{display:flex;flex-direction:column;gap:5px;min-width:0}
.tm{display:flex;align-items:center;gap:9px;min-width:0}
.tm b{font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.odds{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
.odds span{display:flex;align-items:center;justify-content:center;gap:5px;background:var(--surface2);
  border:1px solid var(--line);border-radius:var(--r-sm);padding:6px 4px;font-size:12.5px;font-weight:700;
  font-variant-numeric:tabular-nums;transition:.14s}
.bl-row:hover .odds span{border-color:color-mix(in srgb,var(--acc) 45%,transparent);color:var(--acc)}
.odds span i{font-style:normal;color:var(--muted);font-size:10.5px;font-weight:600}
.odds.empty{grid-template-columns:1fr;max-width:96px;margin-left:auto}
.odds.empty span:not(:first-child){display:none}
.odds.empty span{opacity:.4;font-size:10.5px;padding:4px;border-style:dashed;letter-spacing:.08em}
.bl-cta{display:flex;justify-content:flex-end}
.bl-cta span{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:800;
  color:var(--acc);letter-spacing:.04em;border:1px solid color-mix(in srgb,var(--acc) 40%,transparent);
  background:color-mix(in srgb,var(--acc) 10%,transparent);border-radius:var(--r-pill);padding:5px 11px;
  transition:.15s;white-space:nowrap}
.bl-row:hover .bl-cta span{background:var(--acc);color:#04121a;border-color:var(--acc)}
.bl-cta i{font-style:normal}
/* list varyantları */
html[data-list="rows"] .bl-group{background:none;border:0;border-radius:0}
html[data-list="rows"] .bl-head{background:none;border-bottom:2px solid var(--acc);padding:8px 2px}
html[data-list="rows"] .bl-row{background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-sm);margin-bottom:6px}
html[data-list="compact"] .bl-row{padding:6px 12px;grid-template-columns:74px minmax(0,1fr) 150px 62px}
html[data-list="compact"] .bl-teams{flex-direction:row;gap:12px;align-items:center}
html[data-list="compact"] .tm b{font-size:13px}
html[data-list="stadium"] .bl-row{grid-template-columns:96px minmax(0,1fr) 168px 78px;
  border-left:3px solid transparent}
html[data-list="stadium"] .bl-row:hover{border-left-color:var(--acc)}
html[data-list="stadium"] .bl-head{background:linear-gradient(90deg,var(--acc),transparent 65%);color:#fff}

/* ---------- maç sayfası ---------- */
.bc{margin:0 0 14px}
.bc ol{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0;font-size:12.5px;color:var(--muted)}
.bc li+li::before{content:"›";margin-right:6px;opacity:.6}
.bc a:hover{color:var(--acc)}
.match{background:color-mix(in srgb,var(--surface) 72%,transparent);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:20px;margin-bottom:22px}
.mh-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--muted);
  letter-spacing:.05em;margin-bottom:10px}
.mh-live{display:inline-flex;align-items:center;gap:6px;color:var(--live);font-weight:800}
.mh-board{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:center;
  background:linear-gradient(150deg,var(--surface2),var(--bg2));border:1px solid var(--line);
  border-radius:var(--r-md);padding:18px;margin:14px 0}
.mb-team{display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center}
.mb-team b{font-size:15px}
.mb-sc{text-align:center}
.mb-num{display:block;font-family:var(--f-display);font-size:clamp(1.7rem,6vw,2.6rem);color:var(--acc);
  font-variant-numeric:tabular-nums;line-height:1}
.mb-sub{font-size:11.5px;color:var(--muted);letter-spacing:.06em}
.player{margin:16px 0;border-radius:var(--r-md);overflow:hidden;border:1px solid var(--line);background:#000}
.player iframe{width:100%;aspect-ratio:16/9;border:0;display:block}
.player-ph{aspect-ratio:16/9;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;text-align:center;padding:20px;background:
  radial-gradient(60% 60% at 50% 30%,color-mix(in srgb,var(--acc) 18%,transparent),transparent 70%),var(--bg2)}
.pp-ico{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;font-size:24px;
  background:linear-gradient(120deg,var(--acc),var(--acc2));color:#04121a;box-shadow:var(--shadow)}
.player-ph b{font-family:var(--f-display);font-size:1.05rem}
.player-ph p{color:var(--muted);max-width:46ch;margin:0;font-size:13.5px}
.pp-row{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:4px}
.pp-chip{font-size:11.5px;color:var(--muted);border:1px solid var(--line);border-radius:var(--r-pill);
  padding:4px 10px;background:var(--surface)}
.mstats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:16px 0}
.ms{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:10px 12px}
.ms i{display:block;font-style:normal;font-size:10.5px;color:var(--muted);letter-spacing:.06em}
.ms b{font-size:14px}
.prose{max-width:74ch}
.prose h2{margin:24px 0 10px;font-size:1.22rem}
.prose h3{margin:18px 0 8px}
.prose p{color:color-mix(in srgb,var(--text) 88%,var(--muted))}
.prose ul{padding-left:20px;color:color-mix(in srgb,var(--text) 88%,var(--muted))}
.prose li{margin-bottom:6px}
.faq{margin-top:26px}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:12px 14px;margin-bottom:8px}
.faq summary{cursor:pointer;font-weight:700;font-size:14px}
.faq summary::marker{color:var(--acc)}
.faq p{margin:8px 0 0;color:var(--muted);font-size:14px}
.art-meta{font-size:12.5px;color:var(--muted);margin-bottom:14px}
.art-cta{margin-bottom:18px}

/* ---------- yazı kartları / lig grid ---------- */
.art-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.art{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:14px;transition:.16s}
.art:hover{border-color:var(--acc);transform:translateY(-2px)}
.art h3{font-size:.98rem;margin-bottom:6px}
.art p{color:var(--muted);font-size:13px;margin-bottom:8px}
.art span{font-size:11.5px;color:var(--acc);font-weight:700}
.lg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.lg{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;transition:.16s}
.lg:hover{border-color:var(--acc);color:var(--acc)}
.lg b{display:block;font-size:14px}
.lg span{font-size:11.5px;color:var(--muted)}
.tl{display:grid;grid-template-columns:74px 1fr;gap:12px;margin-bottom:10px}
.tl-h{font-family:var(--f-display);font-size:1.05rem;color:var(--acc);padding-top:8px;
  border-right:2px solid var(--line);font-variant-numeric:tabular-nums}
.tl-b{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden}

/* ---------- sidebar ---------- */
.side{display:flex;flex-direction:column;gap:14px;position:sticky;top:78px;
  max-height:calc(100vh - 96px);overflow:auto;scrollbar-width:thin}
.card{background:color-mix(in srgb,var(--surface) 78%,transparent);border:1px solid var(--line);
  border-radius:var(--r-md);padding:14px}
.card h3{font-size:.95rem;margin-bottom:10px;display:flex;align-items:center;gap:7px}
.card h3::before{content:"";width:3px;height:14px;background:var(--acc);border-radius:2px}
.side-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.side-list a{display:flex;justify-content:space-between;gap:8px;padding:7px 8px;border-radius:var(--r-sm);
  font-size:13px;color:var(--muted)}
.side-list a:hover{background:var(--surface2);color:var(--text)}
.side-list i{font-style:normal;color:var(--acc);font-size:11.5px;font-weight:700}
.side-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.side-chips a{display:inline-flex;gap:5px;align-items:center;font-size:12px;padding:5px 10px;
  background:var(--surface2);border:1px solid var(--line);border-radius:var(--r-pill);color:var(--muted)}
.side-chips a:hover{border-color:var(--acc);color:var(--acc)}
.side-chips b{color:var(--acc)}
.muted-s{color:var(--muted);font-size:13px;margin:0 0 10px}
.cta-card{background:linear-gradient(150deg,color-mix(in srgb,var(--acc) 14%,transparent),var(--surface))}
.seo-block{margin-top:30px;padding-top:20px;border-top:1px solid var(--line);color:var(--muted);font-size:14px}
.seo-block h2{color:var(--text)}

/* ---------- footer ---------- */
.ftr{border-top:1px solid var(--line);background:color-mix(in srgb,var(--bg2) 70%,transparent);margin-top:20px}
.ftr-in{display:grid;grid-template-columns:1.6fr repeat(4,1fr);gap:26px;padding:34px 16px 26px}
.ftr-col h4{font-size:.9rem;margin-bottom:12px;letter-spacing:.06em;color:var(--acc);font-weight:800}
.ftr-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px}
.ftr-col a{font-size:13px;color:var(--muted)}
.ftr-col a:hover{color:var(--acc)}
.ftr-brand p{color:var(--muted);font-size:13px;max-width:42ch}
.ftr-brand .tiny{font-size:11.5px;opacity:.75}
.ftr-bar{border-top:1px solid var(--line);padding:12px 0;font-size:11.5px;color:var(--muted);text-align:center}

/* ---------- cookie + fab ---------- */
.cookie{position:fixed;left:0;right:0;bottom:0;z-index:70;display:flex;justify-content:center;
  padding:0 12px 12px}
.ck-in{display:flex;align-items:center;gap:12px;background:var(--bg2);border:1px solid var(--line);
  border-radius:var(--r-pill);padding:8px 10px 8px 16px;box-shadow:0 16px 40px -16px rgba(0,0,0,.7);
  max-width:560px;font-size:12.5px}
.ck-in p{margin:0;font-size:12.5px;color:var(--muted);line-height:1.45}
.ck-in a{color:var(--acc);text-decoration:underline}
.ck-in button{background:var(--acc);color:#04121a;border:0;border-radius:var(--r-pill);
  padding:8px 18px;font-weight:800;cursor:pointer}
.fab{position:fixed;right:16px;bottom:16px;z-index:55;width:52px;height:52px;border-radius:50%;
  background:linear-gradient(130deg,var(--acc),var(--acc2));color:#04121a;border:0;font-size:20px;
  cursor:pointer;box-shadow:var(--shadow)}
.fab-menu{position:fixed;right:16px;bottom:78px;z-index:55;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r-md);padding:8px;display:flex;flex-direction:column;
  gap:2px;box-shadow:var(--shadow);min-width:180px}
.fab-menu a{padding:8px 12px;border-radius:var(--r-sm);font-size:13.5px;color:var(--muted)}
.fab-menu a:hover{background:var(--surface2);color:var(--text)}

/* ---------- açık tema ---------- */
html.light{--bg:#f6f8fc;--bg2:#eef2f9;--surface:#ffffff;--surface2:#f1f5fb;--line:#dde5f0;
  --text:#0d1526;--muted:#5d6b85}
html.light body::after{opacity:.35}
html.light .btn.primary{color:#fff}
html.light .search button{color:#fff}
html.light .tlogo.mono{color:#fff}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .layout{grid-template-columns:1fr}
  .side{position:static;flex-direction:row;flex-wrap:wrap}
  .side .card{flex:1 1 260px}
  .ftr-in{grid-template-columns:1fr 1fr 1fr}
}
@media (max-width:860px){
  .burger{display:flex}
  .nav{position:fixed;inset:64px 0 auto 0;flex-direction:column;align-items:stretch;background:var(--bg2);
    border-bottom:1px solid var(--line);padding:10px 16px 16px;display:none;z-index:39;max-height:78vh;overflow:auto}
  .nav.open{display:flex}
  .nav>a,.nav-drop-t{padding:12px 10px;border-radius:var(--r-sm)}
  .drop{position:static;display:grid !important;grid-template-columns:1fr 1fr;box-shadow:none;
    background:var(--surface2);margin:4px 0 8px;min-width:0}
  .search{display:none}
  .hero-in{grid-template-columns:1fr !important;gap:22px}
  .hero{padding:24px 0 18px}
  .mstats{grid-template-columns:1fr 1fr}
  .bl-row{grid-template-columns:66px minmax(0,1fr) 92px;padding:9px 10px;gap:8px}
  .bl-cta{display:none}
  .odds{grid-template-columns:repeat(3,1fr);gap:3px}
  .odds span{padding:5px 2px;font-size:11.5px}
  .odds span i{display:none}
  html[data-list="compact"] .bl-teams{flex-direction:column;gap:5px;align-items:flex-start}
  .ftr-in{grid-template-columns:1fr 1fr;gap:18px}
  .util-links{display:none}
  .mh-board{padding:14px 10px;gap:8px}
  .match{padding:14px}
  .tl{grid-template-columns:56px 1fr}
}
@media (max-width:520px){
  .brand-txt i{display:none}
  .ck-in{flex-direction:column;text-align:center}
  .tm b{font-size:13px}
  .art-grid{grid-template-columns:1fr}
  .ftr-in{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important}
}

/* ---------- oran pazarları (maç sayfası) ---------- */
.mkts{margin:22px 0}
.mkt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.mkt{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:10px 12px}
.mkt i{display:block;font-style:normal;font-size:11px;color:var(--muted);
  letter-spacing:.05em;margin-bottom:7px}
.mkt-row{display:flex;gap:6px;flex-wrap:wrap}
.mkt-row span{flex:1 1 60px;display:flex;align-items:center;justify-content:space-between;gap:6px;
  background:var(--surface2);border:1px solid var(--line);border-radius:var(--r-sm);padding:6px 9px;
  font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums}
.mkt-row span b{color:var(--muted);font-weight:600;font-size:11px}
.mkt-row span:hover{border-color:var(--acc);color:var(--acc)}
.mkt-note{font-size:11.5px;color:var(--muted);margin-top:8px}

/* daha fazla linki */
.more{display:inline-flex;align-items:center;gap:6px;margin:10px 0 4px;padding:9px 18px;
  border:1px solid var(--line);border-radius:var(--r-pill);background:var(--surface);
  font-size:13px;font-weight:700;color:var(--acc);transition:.16s}
.more:hover{border-color:var(--acc);background:color-mix(in srgb,var(--acc) 12%,transparent)}