
:root { color-scheme: light; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: radial-gradient(900px 420px at 50% -180px, color-mix(in srgb, var(--red) 14%, transparent), transparent 70%), var(--paper, #f3ecdf);
  color: var(--ink, #1c1915);
  font-family: "Source Sans 3", "DejaVu Sans", "Noto Sans", sans-serif;
  font-size: 1rem;
  line-height: 1.55;
  scrollbar-color: var(--red) var(--paper, #f3ecdf);
}
::selection { background: #d7c08a; color: var(--ink, #1c1915); }
:focus-visible { outline: 3px solid #14663a; outline-offset: 3px; }
.top, main, footer { width: min(880px, calc(100% - 32px)); margin-inline: auto; }
.top { padding: 28px 0 8px; }
.crumbs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; color: var(--muted); font-weight: 700; }
.crumbs a { color: inherit; }
.hero { display: flex; gap: 16px; align-items: center; }
h1, h2 { font-family: Literata, Palatino, serif; font-weight: 640; letter-spacing: -0.03em; }
h1 { margin: 0 0 8px; font-size: 1.7rem; line-height: 1.05; }
h2 { margin: 0 0 8px; font-size: 1.15rem; line-height: 1.05; letter-spacing: -0.02em; }
.lede { margin: 0; max-width: 68ch; }
main { display: grid; gap: 28px; padding: 28px 0 12px; }
section, footer { background: var(--card, #fff); border-radius: 22px; padding: 16px; box-shadow: 0 12px 28px rgb(28 22 12 / 0.05); }
.buys { display: grid; gap: 10px; }
.buy, .langs a {
  display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 16px;
  border-radius: 999px; background: var(--red); color: #fff; font-weight: 700; text-decoration: none;
}
.buy-quiet { background: var(--card); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line); }
.placeholder, .credit, footer p, .lede { color: var(--muted); }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: start; padding: 10px 8px; border-bottom: 1px solid var(--line); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
.langs { display: flex; flex-wrap: wrap; gap: 8px; }
footer { margin: 0 auto 32px; }
@media (min-width: 720px) { .buys { grid-template-columns: 1.4fr 1fr; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* impeccable-polish 2026-10-13 */
body{font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased}
h1{letter-spacing:-.03em;text-wrap:balance}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* gi-fx 2026-10-13: emblems, team backdrops, reveals, derby (match pill .mb-mid untouched) */
.gi-t{display:flex;align-items:center;gap:8px;position:relative;isolation:isolate;padding:6px 8px;border-radius:12px;color:#0d1620}
.mb-h.gi-t{justify-content:flex-end}.mb-a.gi-t{justify-content:flex-start}
.gi-bg::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:linear-gradient(90deg,rgb(255 255 255/.86),rgb(255 255 255/.86)),linear-gradient(90deg,color-mix(in srgb,var(--club,#888) 55%,transparent),transparent),var(--flag) center/cover no-repeat;opacity:.95}
.mb-a.gi-bg::before{background:linear-gradient(270deg,rgb(255 255 255/.86),rgb(255 255 255/.86)),linear-gradient(270deg,color-mix(in srgb,var(--club,#888) 55%,transparent),transparent),var(--flag) center/cover no-repeat}
.gi-t a{color:#0d1620}
.gi-em{flex:none;display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#fff;box-shadow:0 0 0 1px rgb(0 0 0/.12)}
.gi-em img{width:24px;height:24px;object-fit:contain}
.gi-ini{font:800 .7rem/1 ui-sans-serif,system-ui,sans-serif;color:#fff;background:var(--c,#3a4652);text-shadow:0 1px 1px rgb(0 0 0/.6)}
@media (max-width:600px){.gi-em{width:22px;height:22px}.gi-em img{width:18px;height:18px}.gi-t{gap:5px;padding:4px 5px}}
.gi-rv{opacity:0;transform:translateY(12px);transition:opacity .6s cubic-bezier(.2,.7,.2,1),transform .6s cubic-bezier(.2,.7,.2,1)}
.gi-rv.gi-in{opacity:1;transform:none}
.mb.live .mb-score{animation:gi-pulse 1.6s ease-in-out infinite}
@keyframes gi-pulse{50%{box-shadow:0 0 0 6px rgb(198 22 29/0)}0%,100%{box-shadow:0 0 0 0 rgb(198 22 29/.45)}}
.gi-derby{position:relative;isolation:isolate;border-radius:16px;overflow:hidden;padding-top:18px}
.gi-derby::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,var(--c1) 0 46%,var(--c2) 54% 100%);opacity:.22;transform:translateX(0)}
.gi-derby::after{content:"DERBY";position:absolute;top:2px;left:50%;transform:translateX(-50%);font:800 .62rem/1 ui-sans-serif,system-ui,sans-serif;letter-spacing:.3em;color:#fff;background:#0d1620;padding:3px 8px;border-radius:999px}
html[lang^=el] .gi-derby::after{content:"ΝΤΕΡΜΠΙ"}
.gi-derby.gi-on::before{animation:gi-clash 3.2s cubic-bezier(.6,0,.4,1) infinite alternate}
@keyframes gi-clash{from{transform:translateX(-6%)}to{transform:translateX(6%)}}
.gi-derby.gi-on::after{animation:gi-glow 2.4s ease-in-out infinite}
@keyframes gi-glow{50%{box-shadow:0 0 14px 2px color-mix(in srgb,var(--c1) 70%,transparent)}}
.gi-rm .gi-rv{opacity:1;transform:none;transition:none}
@media (prefers-reduced-motion:reduce){.gi-rv{opacity:1!important;transform:none!important}.gi-derby::before,.gi-derby::after,.mb.live .mb-score{animation:none!important}}

@media print{.gi-hero,.gi-derby::after{display:none}.gi-rv{opacity:1;transform:none}.gi-bg::before,.gi-derby::before{display:none}body{background:#fff}}

/* gi-fx fit */
.gi-t{min-width:0;overflow:hidden;padding:4px 5px;gap:6px}.gi-t>a,.gi-t>span:not(.gi-em){min-width:0;overflow-wrap:anywhere}.gi-em{width:24px;height:24px}.gi-em img{width:20px;height:20px}

/* gi-fx fit2 */
.mb-h.gi-t,.mb-a.gi-t{flex-direction:column;justify-content:center;text-align:center;gap:4px;padding:6px 4px}
.mb-h.gi-t .gi-em{order:-1}
.gi-t>a,.gi-t>span:not(.gi-em){overflow-wrap:normal;word-break:normal;hyphens:auto;font-size:.88rem;line-height:1.2}
.mb-h.gi-bg::before,.mb-a.gi-bg::before{background:linear-gradient(180deg,rgb(255 255 255/.8),rgb(255 255 255/.92)),linear-gradient(180deg,color-mix(in srgb,var(--club,#888) 50%,transparent),transparent),var(--flag) center/cover no-repeat}
.top-row h1{font-size:clamp(1.7rem,1.1rem + 2.6vw,3.1rem);min-width:0}.top-row .lang{flex:none}
