
  :root{
    --bg:#0D1117; --panel:#131A21; --panel2:#1A222B; --line:#3B4855; --line2:#242E38;
    --lime:#35C07A; --lime-mid:#4FD693; --lime-deep:#2AA868; --lime-soft:#14301F;
    --text:#E8EDF2; --muted:#AEBBC7; --dim:#8B9AA8;
    --loss:#FF8A92; --loss-soft:#2E181B; --win:#4FD693;
    --plate:#05080B; --plate-ink:#E8EDF2; --plate-dim:#8B9AA8; --on-lime:#06120C;
    --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
    --sans:"Golos Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    --fs-base:17px;
    --fs-row:16px;
    --fs-side:15px;
    --fs-small:14px;
    --fs-micro:12.5px;
  }
  *{box-sizing:border-box}
  body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);
       font-size:var(--fs-base);line-height:1.55;-webkit-font-smoothing:antialiased}
  a{color:inherit;text-decoration:none}

  /* ---------- шапка ---------- */
  .top{border-bottom:1px solid var(--line);background:var(--panel);position:sticky;top:0;z-index:30}
  .top-in{max-width:1520px;margin:0 auto;padding:0 22px;display:flex;align-items:center;gap:24px;flex-wrap:wrap}
  .logo{display:flex;align-items:center;gap:12px;padding:9px 0;flex:none}
  .logo .mark{width:46px;height:46px;flex:none;display:block}
  .logo .txt{display:flex;flex-direction:column;gap:4px}
  /* подпись служебная: вчетверо мельче слова и в моноширинном, чтобы
     не спорила с названием. На узком экране прячется — там она нечитаема. */
  .logo .tag{font:500 9.5px/1 var(--mono);letter-spacing:.04em;text-transform:uppercase;
             color:var(--dim);white-space:nowrap}
  @media(max-width:900px){ .logo .tag{display:none} }
  .ball{width:22px;height:22px;border-radius:50%;background:var(--lime);position:relative;flex:none}
  .ball::after{content:"";position:absolute;inset:6px auto auto 6px;width:9px;height:9px;
               border-radius:50%;background:var(--panel)}
  .logo b{font-size:27px;letter-spacing:-.027em;line-height:1}
  .logo b i{font-style:normal;color:var(--lime-mid)}
  .top nav{display:flex;gap:2px;flex-wrap:wrap}
  .top nav a{padding:16px 12px;font-size:14.5px;font-weight:600;letter-spacing:.05em;
             text-transform:uppercase;color:var(--muted);border-bottom:2px solid transparent}
  .top nav a:hover{color:var(--text)}
  .top nav a.on{color:var(--lime-deep);border-bottom-color:var(--lime)}
  .top .spacer{flex:1}
  .live{display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:var(--fs-micro);color:var(--muted)}
  .pulse{width:7px;height:7px;border-radius:50%;background:var(--lime)}

  /* ---------- каркас: боковое меню + контент ---------- */
  .wrap{max-width:1520px;margin:0 auto;padding:20px 22px 70px;
        display:grid;grid-template-columns:232px minmax(0,1fr);gap:22px;align-items:start}
  @media(max-width:1000px){ .wrap{grid-template-columns:1fr} .side{position:static!important} }

  .side{position:sticky;top:70px;display:flex;flex-direction:column;gap:14px;
        max-height:calc(100vh - 86px);overflow-y:auto;overscroll-behavior:contain;
        scrollbar-width:thin}
  .sbox{border:1px solid var(--line);background:var(--panel)}
  .sbox h3{margin:0;padding:11px 13px;font-family:var(--mono);font-size:11.5px;letter-spacing:.13em;
           text-transform:uppercase;color:var(--dim);font-weight:600;border-bottom:1px solid var(--line2)}
  .find{display:flex;align-items:center;gap:8px;padding:9px 13px;border-bottom:1px solid var(--line2)}
  .find input{border:0;outline:0;font:inherit;font-size:var(--fs-side);width:100%;background:transparent;color:var(--text)}
  .find input::placeholder{color:var(--dim)}
  .mag{width:13px;height:13px;border:1.5px solid var(--dim);border-radius:50%;position:relative;flex:none}
  .mag::after{content:"";position:absolute;right:-4px;bottom:-3px;width:5px;height:1.5px;
              background:var(--dim);transform:rotate(45deg)}

  /* Гербы: лиги — скруглённый квадрат, команды — круг. Формой различаются
     сущности, цветом — конкретный клуб. Цвета приглушены намеренно, чтобы
     салатовый оставался единственным сигнальным на странице. */
  .badge{flex:none;display:grid;place-items:center;font-family:var(--mono);
         font-weight:700;color:#fff;letter-spacing:-.03em}
  .badge.team{width:26px;height:26px}
  .badge.lg{width:24px;height:24px;border-radius:6px;font-size:10.5px}
  .badge svg{display:block}
  /* Слот под настоящий логотип. Разметка уже готова его принять: достаточно
     проставить data-logo="<url>" — картинка встанет поверх рисованного герба,
     а если не загрузится, останется щит. Источник логотипов нужен
     лицензированный (см. комментарий в конце файла). */
  .badge.lg.flag{background:none;padding:0;overflow:hidden;border:1px solid var(--line)}
  .badge.lg.flag img{object-fit:cover}
  .badge img{width:100%;height:100%;object-fit:contain;display:block}
  .badge.has-logo svg{display:none}

  /* ---------- переключатели ---------- */
  .controls{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
  .seg{display:flex;border:1px solid var(--line);border-radius:3px;overflow:hidden;background:var(--panel)}
  .seg button{appearance:none;font:inherit;font-size:14.5px;font-weight:600;cursor:pointer;
       padding:6px 12px;background:transparent;color:var(--muted);border:0;
       border-right:1px solid var(--line)}
  .seg button:last-child{border-right:0}
  .seg button.on{background:var(--lime-soft);color:var(--lime-deep);
       box-shadow:inset 0 -2px 0 var(--lime)}
  .seg button:focus-visible{outline:2px solid var(--lime-mid);outline-offset:-2px}
  .seg-lab{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;
           color:var(--dim);margin-right:-4px}
  .sw{display:inline-flex;align-items:center;gap:8px;font-size:14.5px;color:var(--muted);cursor:pointer}
  .sw input{position:absolute;opacity:0;pointer-events:none}
  .sw .track{width:34px;height:18px;border-radius:9px;background:var(--line);position:relative;
             transition:background .15s;flex:none}
  .sw .track::after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;
             border-radius:50%;background:var(--panel);box-shadow:0 1px 2px rgba(0,0,0,.15);
             transition:transform .15s}
  .sw input:checked + .track{background:var(--lime)}
  .sw input:checked + .track::after{transform:translateX(16px)}
  .sw input:focus-visible + .track{outline:2px solid var(--lime-mid);outline-offset:2px}

  .lgroup{padding:8px 0}
  .lgroup em{font-style:normal;display:block;padding:7px 13px;font-family:var(--mono);font-size:12px;
             letter-spacing:.13em;text-transform:uppercase;color:var(--dim)}
  .lrow{display:flex;align-items:center;gap:10px;padding:8px 13px;font-size:var(--fs-side)}
  .lrow:hover{background:var(--panel2)}
  .lrow.on{background:var(--lime-soft)}
  .lrow.on .nm{color:var(--lime-deep);font-weight:600}
    .lrow .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .lrow .n{font-family:var(--mono);font-size:13px;color:var(--dim);font-variant-numeric:tabular-nums}
  .allbtn{display:block;padding:11px 13px;border-top:1px solid var(--line2);font-size:var(--fs-side);
          color:var(--lime-deep);font-weight:600}
  .allbtn:hover{background:var(--panel2)}

  /* ---------- лента матчей ---------- */
  .hero{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:14px}
  h1{margin:0;font-size:clamp(26px,3vw,36px);letter-spacing:-.025em;line-height:1.1;font-weight:800;text-wrap:balance}
  .hero p{margin:7px 0 0;color:var(--muted);font-size:var(--fs-row);max-width:54ch}
  .daytabs{display:flex;gap:4px}
  .daytabs button{appearance:none;font:inherit;font-size:14.5px;font-weight:600;cursor:pointer;
       padding:7px 13px;background:var(--panel);color:var(--muted);border:1px solid var(--line);border-radius:2px}
  .daytabs button.on{background:var(--lime-soft);color:var(--lime-deep);border-color:var(--lime-mid);
       box-shadow:inset 0 -2px 0 var(--lime)}
  .daytabs button:focus-visible{outline:2px solid var(--lime-mid);outline-offset:2px}

  .board{border:1px solid var(--line);background:var(--panel)}
  .lg-row{display:flex;align-items:center;gap:9px;padding:11px 14px;background:var(--panel2);
          border-bottom:1px solid var(--line);border-top:1px solid var(--line);font-size:13.5px;font-family:var(--mono);
          letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
  .lg-row b{color:var(--lime-deep);font-weight:600}
  .lg-row .cnt{margin-left:auto;color:var(--dim)}

  .m{display:grid;grid-template-columns:52px minmax(0,1fr) 178px 164px 96px;gap:18px;align-items:center;
     padding:13px 15px;border-bottom:1px solid var(--line2)}
  .m:last-child{border-bottom:0}
  .m:hover{background:var(--panel2)}
  .tm{font-family:var(--mono);font-size:14.5px;color:var(--muted);font-variant-numeric:tabular-nums}
  .teams{display:flex;flex-direction:column;gap:5px;min-width:0}
  .tt{display:flex;align-items:center;gap:8px;min-width:0}
  .tt .nm{font-size:var(--fs-row);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .tt .form{display:flex;gap:2px;margin-left:auto;flex:none}
  .form i{width:6px;height:6px;border-radius:1px;display:block}
  .f-w{background:var(--lime)} .f-d{background:#AFC0A6} .f-l{background:var(--loss)}

  /* распределение вероятностей: три сегмента, каждый подписан числом */
  .dist{display:flex;flex-direction:column;gap:4px}
  .dbar{display:flex;height:7px;gap:2px}
  .dbar i{display:block;border-radius:1px}
  .d1{background:var(--lime)} .dx{background:#AFC0A6} .d2{background:#6E8067}
  .dnum{display:flex;justify-content:space-between;font-family:var(--mono);font-size:13px;
        color:var(--muted);font-variant-numeric:tabular-nums}
  .dnum b{color:var(--lime-deep);font-weight:600}

  .pick{display:flex;flex-direction:column;gap:2px}
  .pick .lab{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--dim)}
  .pick .v{display:flex;align-items:baseline;gap:6px}
  .pick .v b{font-family:var(--mono);font-size:18.5px;color:var(--lime-deep);font-variant-numeric:tabular-nums}
  .pick .v span{font-family:var(--mono);font-size:13.5px;color:var(--muted)}
  .res{font-family:var(--mono);font-size:15.5px;text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
  .res.pos{color:var(--win)} .res.neg{color:var(--loss)}
  @media(max-width:820px){
    .m{grid-template-columns:44px minmax(0,1fr);row-gap:10px}
    .dist,.pick,.res{grid-column:1/-1} .res{text-align:left}
  }

  /* ---------- секции ---------- */
  .sec{margin-top:26px}
  .sec h2{margin:0 0 12px;font-size:14px;font-family:var(--mono);letter-spacing:.12em;
          text-transform:uppercase;color:var(--muted);font-weight:600}
  .sec h2 b{color:var(--lime-deep);font-weight:600}

  /* ---------- вчерашний день ---------- */
  .yday{border:1px solid var(--line);border-radius:6px;background:var(--panel);padding:18px 20px 16px}
  .ynums{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px;
         padding-bottom:16px;margin-bottom:16px;border-bottom:1px solid var(--line2)}
  .ynums div{display:flex;flex-direction:column;gap:4px}
  .ynums b{font-family:var(--mono);font-size:27px;color:var(--lime-deep);letter-spacing:-.015em}
  .ynums span{font-size:13.5px;color:var(--dim)}
  .ygrid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
  @media(max-width:820px){ .ygrid{grid-template-columns:1fr} }
  .yday .cap{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
             margin-bottom:9px;flex-wrap:wrap}
  .yday .cap.two{margin-top:16px}
  .yday .cap em{font-style:normal;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
                text-transform:uppercase;color:var(--dim)}
  .yday .cap span{font-size:12.5px;color:var(--muted);font-family:var(--mono)}
  .yhist,.ybar{width:100%;height:auto;display:block}
  .yhist .ax{font-family:var(--mono);font-size:9.5px;fill:var(--dim)}
  .ybar{border-radius:3px;overflow:hidden}
  .ykey{display:flex;gap:16px;flex-wrap:wrap;margin-top:9px;font-size:13.5px;color:var(--muted)}
  .ykey.wrap{margin-top:0}
  .ykey b{color:var(--text);font-family:var(--mono)}
  .ykey i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:6px}
  .ykey .k1{background:var(--lime-mid)} .ykey .k2{background:var(--line)}
  .ykey .k3{background:var(--lime)}
  .ynote{margin:16px 0 0;font-size:var(--fs-small);color:var(--dim);line-height:1.55;max-width:82ch}

  /* ---------- журнал: как сыграли прогнозы ---------- */
  .journal{border:1px solid var(--line);border-radius:6px;background:var(--panel);padding:16px 20px 16px}
  .jhead{display:flex;justify-content:space-between;align-items:center;gap:14px;
         flex-wrap:wrap;margin-bottom:14px}
  .journal .cap em{font-style:normal;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
                   text-transform:uppercase;color:var(--dim)}
  .journal .cap span{font-size:12.5px;color:var(--muted);margin-left:10px}
  .jtabs{display:flex;gap:0;border:1px solid var(--line);border-radius:5px;overflow:hidden}
  .jtab{border:0;background:var(--panel);font:600 14px var(--sans);color:var(--muted);
        padding:7px 15px;cursor:pointer;border-right:1px solid var(--line)}
  .jtab:last-child{border-right:0}
  .jtab.on{background:var(--lime-soft);color:var(--lime-deep)}
  .jpane{display:none} .jpane.on{display:block}
  .jtiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:14px;
          padding-bottom:15px;margin-bottom:15px;border-bottom:1px solid var(--line2)}
  .jt{display:flex;flex-direction:column;gap:4px}
  .jt b{font-family:var(--mono);font-size:24px;color:var(--lime-deep);letter-spacing:-.015em}
  .jt b.neg{color:var(--loss)} .jt b.pos{color:var(--win)}
  .jt span{font-size:13px;color:var(--dim)}
  .jgrid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
  @media(max-width:820px){ .jgrid{grid-template-columns:1fr} }
  .jtab-t{width:100%;border-collapse:collapse;font-size:var(--fs-small)}
  .jtab-t th{font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;
             color:var(--dim);text-align:left;padding:0 0 7px;font-weight:500}
  .jtab-t td{padding:7px 0;border-top:1px solid var(--line2)}
  .jtab-t .num{text-align:right;font-family:var(--mono)}
  .jtab-t td.neg{color:var(--loss)} .jtab-t td.pos{color:var(--win)}
  .jb{display:grid;grid-template-columns:88px minmax(0,1fr) 38px 34px;gap:10px;
      align-items:center;padding:6px 0;font-size:var(--fs-small)}
  .jbl{color:var(--muted);font-family:var(--mono);font-size:12.5px}
  .jbar{height:9px;border-radius:3px;background:var(--panel2);overflow:hidden}
  .jbar i{display:block;height:100%;background:var(--lime);border-radius:3px}
  .jbv{font-family:var(--mono);text-align:right}
  .jbn{font-family:var(--mono);text-align:right;color:var(--dim);font-size:12px}
  .jnote{margin:15px 0 0;font-size:var(--fs-small);color:var(--dim);line-height:1.55;max-width:86ch}
  .jnote b{color:var(--muted)}

  /* {calib:beg} */
  /* ---------- калибровка ---------- */
  .calib{border:1px solid var(--line);border-radius:6px;background:var(--panel);padding:16px 20px 14px}
  /* текст и график рядом: объяснение читают один раз, а картинку разглядывают */
  .cintro{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:26px;align-items:start;
          margin-bottom:14px}
  @media(max-width:900px){ .cintro{grid-template-columns:1fr} }
  .cplot{margin:0}
  .cplot svg{width:100%;height:auto;display:block}
  .cdiag{stroke:var(--line);stroke-width:1.4;stroke-dasharray:5 5}
  .cgrid{stroke:var(--line2);stroke-width:1}
  .cline{fill:none;stroke:var(--lime);stroke-width:2;stroke-linejoin:round}
  .cpt{fill:var(--lime-mid);stroke:var(--panel);stroke-width:1.5;cursor:pointer}
  .cpt:hover,.cpt:focus{fill:var(--lime-deep);outline:none}
  .cpt.pin{stroke:var(--lime-deep);stroke-width:2}
  .cax{font-family:var(--mono);font-size:10.5px;fill:var(--dim)}
  .cax.lab{font-size:11px;fill:var(--muted)}
  .cplot figcaption{margin-top:8px;font-size:12.5px;color:var(--dim);line-height:1.5}
  .cplot figcaption.live{color:var(--lime-deep)}
  .chow{max-width:70ch}
  .chow p{margin:0 0 12px;color:var(--muted);font-size:var(--fs-row);line-height:1.6}
  .chow p b{color:var(--text)}
  .chow ol{margin:0 0 10px;padding-left:0;list-style:none;counter-reset:s;
           display:flex;flex-direction:column;gap:5px}
  .chow ol li{counter-increment:s;position:relative;padding-left:30px;
              color:var(--muted);font-size:var(--fs-row);line-height:1.55}
  .chow ol li::before{content:counter(s);position:absolute;left:0;top:1px;width:20px;height:20px;
                      border-radius:50%;background:var(--lime-soft);color:var(--lime-deep);
                      font:600 12px/20px var(--mono);text-align:center}
  .chow ol li b{color:var(--text)}
  .chint{font-size:var(--fs-small)!important;color:var(--dim)!important}

  .crows{display:flex;flex-direction:column;gap:0;margin:2px 0 10px}
  /* по умолчанию видны четыре средние группы — там 87 % наблюдений */
  .crows:not(.open) .crow:nth-child(n+5){display:none}
  .cmore{border:1px solid var(--line);background:var(--panel);border-radius:5px;
         font:600 13.5px var(--sans);color:var(--lime-deep);padding:7px 14px;cursor:pointer;
         margin-bottom:14px}
  .cmore:hover{background:var(--lime-soft);border-color:var(--lime)}
  .crows.open + .cmore{color:var(--muted)}
  .crow{display:grid;grid-template-columns:112px minmax(0,1fr) 104px 78px;gap:18px;
        align-items:center;padding:7px 0;border-top:1px solid var(--line2)}
  @media(max-width:900px){ .crow{grid-template-columns:1fr;gap:8px} }
  .clab{font-size:12px;color:var(--dim);display:flex;align-items:baseline;gap:6px}
  .clab b{font-family:var(--mono);font-size:16px;color:var(--text)}
  .cbars{display:flex;flex-direction:column;gap:3px;max-width:480px}
  .cb{display:grid;grid-template-columns:56px minmax(0,1fr) 52px;gap:9px;align-items:center}
  .cb span{font-size:11.5px;font-family:var(--mono);color:var(--dim);letter-spacing:.04em}
  .cb i{display:block;height:9px;border-radius:2px;background:var(--line);min-width:3px}
  .cb.act i{background:var(--lime-mid)}
  .cb b{font-family:var(--mono);font-size:13.5px;text-align:right;color:var(--muted)}
  .cb.act b{color:var(--text)}
  .cd{font-family:var(--mono);font-size:14px;display:flex;flex-direction:column;gap:1px}
  .cd em{font-style:normal;font-family:var(--sans);font-size:11px;color:var(--dim);
         letter-spacing:0;line-height:1.25}
  .cd.up{color:var(--win)} .cd.down{color:var(--loss)} .cd.eq{color:var(--dim)}
  .cn{font-family:var(--mono);font-size:12.5px;color:var(--muted);text-align:right;
      display:flex;flex-direction:column;gap:1px}
  .cn span{font-family:var(--sans);font-size:11.5px;color:var(--dim)}

  .cnum{display:flex;gap:26px;flex-wrap:wrap;margin-top:16px;padding-top:14px;
        border-top:1px solid var(--line2)}
  .cnum div{display:flex;flex-direction:column;gap:3px}
  .cnum b{font-family:var(--mono);font-size:22px;color:var(--lime-deep);letter-spacing:-.01em}
  .cnum span{font-size:13.5px;color:var(--dim);max-width:34ch}
  .cnote{margin:16px 0 0;font-size:var(--fs-small);color:var(--dim);line-height:1.6;max-width:88ch}
  .cnote b{color:var(--muted)}
  /* {calib:end} */

  /* {journal:beg} */
  /* ---------- журнал: как сыграли прогнозы ---------- */
  .journal{border:1px solid var(--line);border-radius:6px;background:var(--panel);padding:16px 20px 16px}
  .jhead{display:flex;justify-content:space-between;align-items:center;gap:14px;
         flex-wrap:wrap;margin-bottom:14px}
  .journal .cap em{font-style:normal;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
                   text-transform:uppercase;color:var(--dim)}
  .journal .cap span{font-size:12.5px;color:var(--muted);margin-left:10px}
  .jtabs{display:flex;gap:0;border:1px solid var(--line);border-radius:5px;overflow:hidden}
  .jtab{border:0;background:var(--panel);font:600 14px var(--sans);color:var(--muted);
        padding:7px 15px;cursor:pointer;border-right:1px solid var(--line)}
  .jtab:last-child{border-right:0}
  .jtab.on{background:var(--lime-soft);color:var(--lime-deep)}
  .jpane{display:none} .jpane.on{display:block}
  .jtiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:14px;
          padding-bottom:15px;margin-bottom:15px;border-bottom:1px solid var(--line2)}
  .jt{display:flex;flex-direction:column;gap:4px}
  .jt b{font-family:var(--mono);font-size:24px;color:var(--lime-deep);letter-spacing:-.015em}
  .jt b.neg{color:var(--loss)} .jt b.pos{color:var(--win)}
  .jt span{font-size:13px;color:var(--dim)}
  .jgrid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
  @media(max-width:820px){ .jgrid{grid-template-columns:1fr} }
  .jtab-t{width:100%;border-collapse:collapse;font-size:var(--fs-small)}
  .jtab-t th{font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;
             color:var(--dim);text-align:left;padding:0 0 7px;font-weight:500}
  .jtab-t td{padding:7px 0;border-top:1px solid var(--line2)}
  .jtab-t .num{text-align:right;font-family:var(--mono)}
  .jtab-t td.neg{color:var(--loss)} .jtab-t td.pos{color:var(--win)}
  .jtab-t td.dim{color:var(--dim);font-size:12.5px}
  .jb{display:grid;grid-template-columns:88px minmax(0,1fr) 38px 34px;gap:10px;
      align-items:center;padding:6px 0;font-size:var(--fs-small)}
  .jbl{color:var(--muted);font-family:var(--mono);font-size:12.5px}
  .jbar{height:9px;border-radius:3px;background:var(--panel2);overflow:hidden}
  .jbar i{display:block;height:100%;background:var(--lime);border-radius:3px}
  .jbv{font-family:var(--mono);text-align:right}
  .jbn{font-family:var(--mono);text-align:right;color:var(--dim);font-size:12px}
  .jtab-t th.sortable{cursor:pointer;user-select:none}
  .jtab-t th.sortable:hover{color:var(--muted)}
  .jtab-t th.sortable.on{color:var(--lime-deep)}
  .jtab-t th.sortable.on::after{content:" ↑"}
  .jtab-t th.sortable.on.desc::after{content:" ↓"}
  .jtab-t tr.jr:hover td{background:var(--panel2)}
  .jb{cursor:pointer;border-radius:4px}
  .jb:hover,.jb:focus{background:var(--panel2);outline:none}
  .jb.pin{background:var(--lime-soft)}
  .journal .cap span.live{color:var(--lime-deep)}
  .jhint{margin:8px 0 0;font-size:12.5px;color:var(--dim)}
  .jnote{margin:15px 0 0;font-size:var(--fs-small);color:var(--muted);line-height:1.6;max-width:86ch}
  .jnote b{color:var(--muted)}
  /* {journal:end} */

  /* {yday:beg} */
  /* ---------- вчерашний день ---------- */
  .yday{border:1px solid var(--line);border-radius:6px;background:var(--panel);padding:18px 20px 16px}
  .ynums{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px;
         padding-bottom:16px;margin-bottom:16px;border-bottom:1px solid var(--line2)}
  .ynums div{display:flex;flex-direction:column;gap:4px}
  .ynums b{font-family:var(--mono);font-size:27px;color:var(--lime-deep);letter-spacing:-.015em}
  .ynums span{font-size:13.5px;color:var(--dim)}
  .ygrid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
  @media(max-width:820px){ .ygrid{grid-template-columns:1fr} }
  .yday .cap{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
             margin-bottom:9px;flex-wrap:wrap}
  .yday .cap.two{margin-top:16px}
  .yday .cap em{font-style:normal;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
                text-transform:uppercase;color:var(--dim)}
  .yday .cap span{font-size:12.5px;color:var(--muted);font-family:var(--mono)}
  .yhist,.ybar{width:100%;height:auto;display:block}
  .yhist .ax{font-family:var(--mono);font-size:10.5px;fill:var(--dim)}
  .ybar{border-radius:3px;overflow:hidden}
  /* столбик и сегмент — интерактивные: наведение подсвечивает, клик закрепляет */
  .yhist .hb,.ybar .ob{cursor:pointer;transition:opacity .12s}
  .yhist .hb:hover,.ybar .ob:hover,.yhist .hb:focus,.ybar .ob:focus{opacity:.75;outline:none}
  .yhist .hb.pin,.ybar .ob.pin{stroke:var(--lime-deep);stroke-width:1.5}
  /* прозрачная кнопка во всю высоту: её саму не обводим и не подсвечиваем,
     иначе над столбиком висел пустой прямоугольник */
  .yhist .hb.hit{stroke:none}
  .yhist .hb.hit:hover,.yhist .hb.hit:focus{opacity:1}
  .yhist .hb.hit.pin{fill:rgba(121,204,68,.12);stroke:none}
  .yday .cap span.live{color:var(--lime-deep)}
  .ymore{display:inline-block;margin-left:6px;color:var(--lime-deep);font-weight:600}
  .ykey{display:flex;gap:16px;flex-wrap:wrap;margin-top:9px;font-size:13.5px;color:var(--muted)}
  .ykey.wrap{margin-top:0}
  .ykey b{color:var(--text);font-family:var(--mono)}
  .ykey i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:6px}
  .ykey .k1{background:var(--lime-mid)} .ykey .k2{background:var(--line)}
  .ykey .k3{background:var(--lime)}
  .ynote{margin:16px 0 0;font-size:var(--fs-small);color:var(--muted);line-height:1.6;max-width:82ch}
  /* {yday:end} */

  /* {home:beg} */
  /* ---------- идут сейчас ---------- */
  /* прокрутка должна жить на ряду карточек, а не на всей полосе:
     иначе ряд переполняется и лезет поверх ссылки «все live» */
  .livebar{display:flex;align-items:center;gap:14px;border:1px solid var(--line);
           border-radius:6px;background:var(--panel);padding:9px 14px;margin-bottom:12px;
           overflow:hidden}
  .lvhead{display:flex;align-items:center;gap:7px;font:600 11.5px var(--mono);
          letter-spacing:.1em;text-transform:uppercase;color:var(--loss);flex:none}
  .lvhead i{width:7px;height:7px;border-radius:50%;background:var(--loss);flex:none;
            animation:pulse 1.8s infinite}
  @keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}}
  @media(prefers-reduced-motion:reduce){ .lvhead i{animation:none} }
  .lvrow{display:flex;gap:8px;flex:1;min-width:0;overflow-x:auto;
         scrollbar-width:thin;padding-bottom:2px;scroll-snap-type:x proximity}
  .lvrow::-webkit-scrollbar{height:6px}
  .lvrow::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
  .lv{scroll-snap-align:start}
  .lv{display:grid;grid-template-columns:34px minmax(0,1fr);grid-template-rows:auto auto auto;
      gap:0 8px;padding:5px 10px;border:1px solid var(--line2);border-radius:5px;flex:none;
      min-width:170px}
  .lv:hover{border-color:var(--lime);background:var(--lime-soft)}
  .lvmin{grid-row:1/3;align-self:center;font:600 13px var(--mono);color:var(--loss)}
  .lvt{font-size:14px;color:var(--text);display:flex;justify-content:space-between;gap:8px}
  .lvt b{font-family:var(--mono)}
  .lvlg{grid-column:2;font-size:11px;color:var(--dim);margin-top:2px}
  .lvall{flex:none;font-size:13.5px;color:var(--lime-deep);font-weight:600;
         padding-left:12px;border-left:1px solid var(--line2);align-self:stretch;
         display:flex;align-items:center;white-space:nowrap}

  /* ---------- календарь ---------- */
  .calbar{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:10px}
  .cday{position:relative;border:1px solid var(--line);border-radius:8px;
        background:var(--panel);padding:13px 14px 12px;display:flex;flex-direction:column;
        gap:7px;transition:border-color .12s,transform .12s}
  .cday:hover{border-color:var(--lime);transform:translateY(-2px)}
  .cday.on{background:linear-gradient(180deg,var(--lime-soft),var(--panel) 70%);
           border-color:var(--lime)}
  .cdhead{display:flex;align-items:baseline;gap:7px}
  .cdhead b{font:700 26px/1 var(--mono);color:var(--text);letter-spacing:-.02em}
  .cdw{font:600 12.5px var(--mono);color:var(--dim);text-transform:uppercase}
  .cdhead em{margin-left:auto;font-style:normal;font:600 10.5px var(--mono);
             letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
  .cday.on .cdhead em{color:var(--lime-deep)}
  /* полоса загруженности: длина = доля от самого матчевого дня недели */
  .cbar{display:block;height:5px;border-radius:3px;background:var(--panel2);overflow:hidden}
  .cbar i{display:block;height:100%;border-radius:3px;background:var(--lime)}
  .cday.on .cbar i{background:var(--lime-mid)}
  .cdl{font-size:13px;color:var(--dim)}
  .cdl b{font-family:var(--mono);font-weight:700;color:var(--text)}
  .cdt{font-size:13px;color:var(--muted);margin-top:auto;padding-top:8px;
       border-top:1px solid var(--line2);display:flex;justify-content:space-between;gap:8px}
  .cdt i{font-style:normal;font-family:var(--mono);font-size:12px;color:var(--dim);flex:none}
  .cdt.dim{color:var(--dim)}

  /* ---------- турнирная таблица ---------- */
  .ltable{border:1px solid var(--line);border-radius:6px;background:var(--panel);overflow:hidden}
  .lthead{display:flex;justify-content:space-between;align-items:center;gap:12px;
          padding:11px 15px;border-bottom:1px solid var(--line2);flex-wrap:wrap}
  .ltname{font:600 15px var(--sans)}
  .ltn{font:500 12.5px var(--mono);color:var(--dim)}
  .ltsw{display:flex;gap:0;overflow-x:auto;border-bottom:1px solid var(--line2)}
  .ltsw button{border:0;background:var(--panel);font:600 13.5px var(--sans);color:var(--muted);
               padding:10px 13px;cursor:pointer;white-space:nowrap;
               border-bottom:2px solid transparent}
  .ltsw button:hover{color:var(--text)}
  .ltsw button.on{color:var(--lime-deep);border-bottom-color:var(--lime)}
  .ltpane{display:none} .ltpane.on{display:block}
  .ltt{width:100%;border-collapse:collapse;font-size:var(--fs-row)}
  .ltt th{font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--dim);
          text-align:left;padding:8px 10px;font-weight:500}
  .ltt td{padding:8px 10px;border-top:1px solid var(--line2)}
  .ltt .num{text-align:right;font-family:var(--mono);width:42px}
  .ltt .pos{width:34px;color:var(--dim);font-family:var(--mono)}
  .ltt .pts{font-weight:700;color:var(--text)}
  .ltt .gd{color:var(--muted)}
  .ltt tr.eu td:first-child{box-shadow:inset 3px 0 0 var(--lime-mid)}
  .ltt tr.ec td:first-child{box-shadow:inset 3px 0 0 var(--lime)}
  .ltall{display:block;padding:11px 15px;border-top:1px solid var(--line2);
         font-size:13.5px;color:var(--lime-deep);font-weight:600}

  /* ---------- результаты дня ---------- */
  .results{border:1px solid var(--line);border-radius:6px;background:var(--panel);overflow:hidden}
  .rrow{display:grid;grid-template-columns:130px minmax(0,1fr) 62px minmax(0,1fr) 54px 26px;
        gap:14px;align-items:center;padding:9px 15px;border-top:1px solid var(--line2);
        font-size:var(--fs-row)}
  .rrow:first-child{border-top:0}
  .rrow:hover{background:var(--panel2)}
  .rlg{font-size:12px;color:var(--dim);font-family:var(--mono)}
  .rt{color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .rt.ra{text-align:left}
  .rsc{font-family:var(--mono);text-align:center;color:var(--text)}
  .rsc b{font-weight:700}
  .rp{font-family:var(--mono);font-size:13.5px;color:var(--muted);text-align:right}
  .rp.dim{color:var(--line)}
  .rv{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;
      font-size:12px;font-weight:700}
  .rv.hit{background:var(--lime-soft);color:var(--win)}
  .rv.miss{background:var(--loss-soft);color:var(--loss)}
  .rv.none{background:var(--panel2);color:var(--dim)}
  @media(max-width:820px){
    .rrow{grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr) 26px}
    .rlg,.rp{display:none}
  }
  /* ---------- значки в блоках ---------- */
  /* Плашка под гербом: пока картинка грузится, на её месте иначе белая дыра,
     а почти белые гербы (у «Аякса» щит белый) не видны и после загрузки.
     Светлым — тёмная подложка, список считает logo_contrast.py --teams. */
  .tb{width:20px;height:20px;object-fit:contain;flex:none;margin-right:8px;
      border-radius:4px;background:var(--panel2)}
  .tb.lt{background:var(--panel2);padding:1px;box-sizing:border-box}
  .tb.ph{display:inline-grid;place-items:center;border-radius:4px;background:var(--panel2);
         color:var(--dim);font:700 9.5px var(--mono);border:1px solid rgba(0,0,0,.06)}
  .fl{width:16px;height:12px;object-fit:cover;border-radius:2px;margin-right:7px;
      border:1px solid var(--line2);flex:none}
  .ltt .tname{display:flex;align-items:center}
  .rt{display:flex;align-items:center;min-width:0}
  .lvt{align-items:center}
  .lvt .tb{width:16px;height:16px;margin-right:6px}
  .ltsw button{display:flex;align-items:center}
  .bpane{display:none} .bpane.on{display:block}
  .board .mempty{color:var(--dim);font-size:var(--fs-row);padding:22px 16px}
  /* {home:end} */

  /* ---------- футер ---------- */
  footer{margin-top:34px;border-top:1px solid var(--line);padding-top:26px}
  .fmain{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,2fr);gap:34px}
  @media(max-width:900px){ .fmain{grid-template-columns:1fr;gap:24px} }
  .fbrand .logo{padding:0;margin-bottom:12px}
  .fbrand p{margin:0;color:var(--muted);font-size:var(--fs-small);line-height:1.6;max-width:52ch}
  .fnav{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:22px}
  .fnav div{display:flex;flex-direction:column;gap:7px}
  .fnav em{font-style:normal;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
           text-transform:uppercase;color:var(--dim);margin-bottom:2px}
  .fnav a{font-size:var(--fs-small);color:var(--muted)}
  .fnav a:hover{color:var(--lime-deep)}
  .fbot{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;
        margin-top:26px;padding-top:16px;border-top:1px solid var(--line2);
        font-size:13.5px;color:var(--dim)}
  .fwarn{max-width:60ch}

  /* ---------- «ещё матчи» ---------- */
  .more{display:flex;justify-content:space-between;align-items:center;gap:14px;
        margin-top:14px;padding:14px 18px;border:1px solid var(--line);border-radius:6px;
        background:var(--panel);font-size:var(--fs-row);color:var(--muted)}
  .more:hover{border-color:var(--lime);background:var(--lime-soft)}
  .more b{color:var(--text);font-family:var(--mono)}
  .more .arr{color:var(--lime-deep);font-weight:600;white-space:nowrap}

  /* ---------- поиск ---------- */
  .find{position:relative}
  .sres{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:40;
        background:var(--panel);border:1px solid var(--line);border-radius:6px;
        box-shadow:0 8px 24px rgba(20,40,20,.14);max-height:320px;overflow-y:auto;display:none}
  .sres.on{display:block}
  .sres a{display:flex;flex-direction:column;gap:2px;padding:9px 12px;
          border-bottom:1px solid var(--line2)}
  .sres a:last-child{border-bottom:0}
  .sres a:hover,.sres a.cur{background:var(--lime-soft)}
  .sres b{font-weight:600;font-size:14.5px;color:var(--text)}
  .sres span{font-size:12px;color:var(--dim);font-family:var(--mono)}
  .sres .none{padding:12px;color:var(--dim);font-size:14px}

  /* плашка под эмблемой турнира: тонкие тёмные логотипы иначе теряются на белом,
     а светлые (Лига Европы, Лига конференций) — вовсе не видны */
  .side .badge.lg{background:rgba(0,0,0,.05);border:1px solid rgba(0,0,0,.07);padding:2px}
  .side .badge.lg.flag{background:none;padding:0}
  .side .badge.lg.dark{background:#0f1720;border-color:#0f1720;padding:3px}
/* {links:beg} */
  p a, li a, figcaption a, dd a,
  .lead a, .slead a, .prose a, .stext a, .seo a, .ftext a,
  .bcrumb a, .bsec a, .note a, .anot a, .acard a, .astep a, .arule a,
  td.tx a, .capt a, .hint a{
    color:var(--lime-deep);font-weight:500}
  /* колонки ссылок в подвале — тот же текст, только списком */
  .fnav a{color:var(--lime-deep)}
  .fnav a:hover{color:var(--lime-mid);text-decoration:underline}
  p a:hover, li a:hover, figcaption a:hover, dd a:hover,
  .lead a:hover, .slead a:hover, .prose a:hover, .stext a:hover, .seo a:hover,
  .ftext a:hover, .bcrumb a:hover, .bsec a:hover, .note a:hover, .anot a:hover,
  .acard a:hover, .astep a:hover, .arule a:hover, td.tx a:hover, .capt a:hover,
  .hint a:hover{color:var(--lime-mid);text-decoration:underline}
/* {links:end} */

  

  

  

  

  

  

  

  

  /* ---------- новости ---------- */
  .nlead{margin:0 0 20px;color:var(--muted);font-size:16px;line-height:1.65;max-width:78ch}
  .nday{margin:26px 0 10px;font:600 12px var(--mono);letter-spacing:.1em;
        text-transform:uppercase;color:var(--muted)}
  .nday:first-of-type{margin-top:4px}
  .ngrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
  .ncard{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:9px;
         background:var(--panel);overflow:hidden}
  .ncard:hover{border-color:var(--lime)}
  .ncover{display:block;height:104px;position:relative;background:var(--lime-soft);
          border-bottom:1px solid var(--line2)}
  .ncover svg{width:100%;height:100%;display:block}
  .ncard .nbody{padding:12px 14px;display:flex;flex-direction:column;gap:7px;flex:1}
  .ncard h3{margin:0;font-size:16px;line-height:1.35;letter-spacing:-.01em}
  .ncard h3 a{color:var(--text)}
  .ncard h3 a:hover{color:var(--lime-deep)}
  .nmeta{display:flex;flex-wrap:wrap;gap:6px 12px;font:12px var(--mono);color:var(--dim);
         margin-top:auto}
  .nmeta b{color:var(--lime-deep);font-weight:600}
  .ntag{border:1px solid var(--line);border-radius:20px;padding:2px 9px;font-size:12px;
        color:var(--muted)}
  .nhero{border:1px solid var(--line);border-radius:9px;background:var(--panel);
         padding:18px 20px;margin-bottom:18px}
  .nhero h1{margin:0 0 8px;font-size:26px;line-height:1.25}
  .nhero .nmeta{margin:0}
  .nsrc{display:inline-block;margin-top:14px;padding:9px 16px;border-radius:7px;
        background:var(--lime-deep);color:#fff;font-weight:600;font-size:15px}
  .nsrc:hover{background:var(--text)}
  .nctx{border:1px solid var(--lime);border-radius:9px;padding:16px 18px;
        background:linear-gradient(180deg,var(--lime-soft),var(--panel) 70%);margin-bottom:18px}
  .nctx h2{margin:0 0 8px;font-size:17px}
  .nctx p{margin:0 0 8px;color:var(--muted);font-size:15px;line-height:1.6}
  .nctx p:last-child{margin-bottom:0}
  .nnum{display:flex;flex-wrap:wrap;gap:16px 26px;margin:12px 0 0}
  .nnum div{display:flex;flex-direction:column}
  .nnum b{font-family:var(--mono);font-size:19px;color:var(--lime-deep)}
  .nnum span{font-size:12.5px;color:var(--dim)}
  .nmore{margin-top:24px}
  .nmore h2{margin:0 0 10px;font-size:18px}
  /* блок новостей на главной */
  .nhome{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:10px}
  .nhome a{border:1px solid var(--line);border-radius:8px;background:var(--panel);
           padding:12px 14px;display:flex;flex-direction:column;gap:6px}
  .nhome a:hover{border-color:var(--lime)}
  .nhome b{font-size:15px;line-height:1.35;font-weight:600}
  .nhome span{font:12px var(--mono);color:var(--dim);margin-top:auto}


  

  

  

  

  

  

  

  

  

  

  
  

  
  

  
  
  

  

  
  
  

  
  

  
  

  
  

  
  
  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  
  

  

  

  

  

  
  
  
  

  

  
  
  

  
  

  

  

  
  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  
  

  

  

  

  
  

  
  

  

  

  
  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  
  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  /* {palette:beg} */
  /* Вторая палитра для переключателя в шапке: посетитель выбирает
     её сам, выбор запоминается в браузере. */
  :root[data-theme="lime"]{
    --bg:#F7FAF4; --panel:#FFFFFF; --panel2:#EBF3E1; --line:#C9D8BB; --line2:#DFE9D4;
    --lime:#79CC44; --lime-mid:#4E9B24; --lime-deep:#35701A; --lime-soft:#E4F5D5;
    --text:#0E1811; --muted:#465443; --dim:#6E7F69;
    --loss:#B3452C; --loss-soft:#FAE8E3; --win:#35701A;
    --plate:#12181C; --plate-ink:#F3F5EF; --plate-dim:#AAB3A4; --on-lime:#FFFFFF;}

  /* «Терминал»: тёмная база. Всё, что раньше было светлым по умолчанию,
     здесь названо явно — иначе на тёмном фоне остаются белые заплатки. */
  :root:not([data-theme="lime"]) .top{background:var(--plate);border-bottom:1px solid var(--line)}
  :root:not([data-theme="lime"]) .top .logo b{color:var(--text)}
  :root:not([data-theme="lime"]) .top .logo b i{color:var(--lime)}
  :root:not([data-theme="lime"]) .top nav a{color:var(--dim)}
  :root:not([data-theme="lime"]) .top nav a:hover{color:var(--text)}
  :root:not([data-theme="lime"]) .top nav a.on{background:var(--lime-soft);color:var(--lime)}
  :root:not([data-theme="lime"]) .ball{background:var(--lime)}
  :root:not([data-theme="lime"]) .ball::after{background:var(--plate)}


  /* значок клуба без герба — плашка с инициалами, на тёмном она была белой */
  :root:not([data-theme="lime"]) .tb.ph, :root:not([data-theme="lime"]) .badge.ph, :root:not([data-theme="lime"]) .tb:not([src]){background:var(--panel2);color:var(--dim)}

  /* светлым гербам подкладка больше не нужна: фон и так тёмный */
  :root:not([data-theme="lime"]) .tb.lt, :root:not([data-theme="lime"]) .badge.lt{background:transparent}


  /* ставка модели: подсветка вместо белой заливки, число — акцентом */
  :root:not([data-theme="lime"]) .pick{background:var(--lime-soft);border:1px solid rgba(53,192,122,.35)}
  :root:not([data-theme="lime"]) .pick .lab{color:var(--dim)}
  :root:not([data-theme="lime"]) .pick b{color:var(--lime)}
  :root:not([data-theme="lime"]) .bs.won, :root:not([data-theme="lime"]) .rv.hit{background:var(--lime-soft);color:var(--lime)}
  :root:not([data-theme="lime"]) .bs.lost, :root:not([data-theme="lime"]) .rv.miss{background:var(--loss-soft);color:var(--loss)}
  :root:not([data-theme="lime"]) main > h2, :root:not([data-theme="lime"]) main > section > h2{color:var(--text)}
  :root:not([data-theme="lime"]) main > h2 svg, :root:not([data-theme="lime"]) main > section > h2 svg{color:var(--lime)}
  :root:not([data-theme="lime"]) footer{background:var(--plate);color:var(--dim);border-top:1px solid var(--line)}
  :root:not([data-theme="lime"]) footer a, :root:not([data-theme="lime"]) footer .fnav a{color:var(--text)}
  :root:not([data-theme="lime"]) footer a:hover{color:var(--lime)}


  /* фотографии на тёмном светят ярче текста — приглушаем до его уровня */
  :root:not([data-theme="lime"]) .phero img, :root:not([data-theme="lime"]) .bphoto img{filter:brightness(.86) saturate(.92)}

  /* тёмные подложки под светлые гербы на тёмном фоне не нужны */
  :root:not([data-theme="lime"]) .ic.dark, :root:not([data-theme="lime"]) .badge.lg.dark{background:var(--panel2);border-color:var(--line)}


  /* Шапка держится в одну строку. Раньше строка была с переносом, и на
     ноутбуках 1280–1366 добавленная кнопка темы переставала помещаться —
     меню сваливалось под логотип. Теперь вместо переноса элементы ужимаются
     по очереди: сначала подпись под логотипом, потом отметка времени,
     потом надпись на кнопке, а меню при нехватке места прокручивается вбок.
     Ниже 900 пикселей работает мобильная раскладка, там меню отдельной
     строкой — так и было задумано. */
  @media(min-width:901px){
    .top-in{flex-wrap:nowrap}
    /* overflow-y:hidden обязателен: с одним overflow-x браузер резервирует
       место под горизонтальную полосу и шапка становится выше на 15 пикселей */
    /* Высота меню задана явно. Как только меню становится прокручиваемым,
       браузер тянет ссылки на всю высоту контейнера, и шапка вырастала с 65
       до 80 пикселей ровно в тот момент, когда места и так не хватало. */
    .top nav{min-width:0;height:54px;align-items:center;flex-wrap:nowrap;
             overflow-x:auto;overflow-y:hidden;scrollbar-width:none;
             -ms-overflow-style:none}
    .top nav::-webkit-scrollbar{display:none}
    .top .live{flex:none;white-space:nowrap}
  }
  @media(min-width:901px) and (max-width:1280px){
    .top-in{gap:16px}
    .logo .tag{display:none}
  }
  @media(min-width:901px) and (max-width:1150px){
    .top .live{display:none}
    .thsw{padding:0;width:34px;justify-content:center;gap:0}
    .thsw-t{display:none}
  }

  .phero{margin:0 0 18px;border:1px solid var(--line);border-radius:3px;overflow:hidden;
         background:var(--panel2)}
  .phero img{display:block;width:100%;height:clamp(140px,22vw,260px);object-fit:cover}
  .phero figcaption{font:400 11.5px/1.5 var(--mono);color:var(--dim);
                    padding:7px 12px;background:var(--panel);border-top:1px solid var(--line2)}
  .phero figcaption a{color:var(--lime-mid)}

  /* Полоса живых вероятностей на странице идущего матча: её рисует live.js
     по данным трекера, в разметке страницы её нет. */
  .lvprob{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;
          margin:0 0 14px;padding:10px 14px;border:1px solid var(--line);
          border-radius:4px;background:var(--panel2)}
  .lvprob .lvp-t{font:600 10.5px var(--mono);letter-spacing:.14em;
                 text-transform:uppercase;color:var(--lime)}
  .lvprob .lvp-i{display:flex;align-items:baseline;gap:6px}
  .lvprob .lvp-i em{font-style:normal;font-size:12px;color:var(--dim)}
  .lvprob .lvp-i b{font:600 15px var(--mono);font-variant-numeric:tabular-nums}
  .lvprob .lvp-n{font-size:12px;color:var(--dim);margin-left:auto}
  @media(max-width:600px){ .lvprob .lvp-n{margin-left:0;flex:1 1 100%} }

  /* Переключатель оформления. Первый вариант был кружком без подписи, и его
     просто не замечали: теперь это кнопка с иконкой и словом, которое
     говорит, что получится по нажатию. */
  .thsw{display:inline-flex;align-items:center;gap:7px;flex:none;
        height:34px;padding:0 13px 0 11px;margin-left:12px;
        border:1px solid var(--lime-deep);border-radius:999px;
        background:var(--lime-soft);color:var(--lime-deep);
        font:600 13px var(--sans);cursor:pointer;white-space:nowrap;
        transition:filter .15s ease}
  .thsw:hover{filter:brightness(1.08)}
  .thsw:active{transform:translateY(1px)}
  .thsw:focus-visible{outline:2px solid var(--lime);outline-offset:2px}
  .thsw-i{font-size:15px;line-height:1}
  /* На телефоне кнопка остаётся с подписью: меню там уезжает отдельной
     строкой, место в верхней строке есть, а безымянный кружок посетители
     просто не замечали. Схлопывается только на совсем узких экранах. */
  @media(max-width:1000px){ .thsw{height:32px;margin-left:8px;padding:0 11px 0 9px} }
  /* Порог 340: у распространённых телефонов ширина 360–430, и на них
     подпись обязана остаться — именно её отсутствие делало кнопку незаметной. */
  @media(max-width:340px){ .thsw{padding:0;width:32px;justify-content:center;gap:0}
        .thsw-t{display:none} }

  /* {palette:end} */

  
/* {mob:beg} */
  /* ---------- мобильная вёрстка ---------- */
  /* iOS раздувает шрифт в альбомной ориентации, если этого не запретить */
  html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
  /* Safari <14.1 не знает inset — оставляем ему привычные top/left */
  .ball::after{top:6px;left:6px}
  /* на десктопе обёртка меню не должна влиять на сетку */
  .sdrop{display:contents}
  .sdsum,.sdcheck{display:none}

  @media(max-width:1000px){
    /* 1fr не даёт колонке стать уже своего содержимого: одна широкая полоса
       (лента живых матчей) растягивала страницу до трёх экранов вбок.
       minmax(0,1fr) разрешает сжатие, а сама полоса прокручивается внутри */
    .wrap{padding:14px 12px 48px;gap:14px;grid-template-columns:minmax(0,1fr)}
    .wrap > *,main,.sdrop{min-width:0}
    .lvrow,.mtabs,.bfilter,.daytabs,.jfilter,.seg{overflow-x:auto;scrollbar-width:none}
    .lvrow::-webkit-scrollbar,.mtabs::-webkit-scrollbar,.bfilter::-webkit-scrollbar,
    .daytabs::-webkit-scrollbar,.seg::-webkit-scrollbar{display:none}
    .controls{flex-wrap:wrap;gap:8px}
    img,svg{max-width:100%}
    /* iOS Safari увеличивает страницу при фокусе на поле меньше 16 px —
       после этого сайт остаётся «зумленным», и это выглядит как поломка */
    input,select,textarea,.find input{font-size:16px}
    /* вырез и скруглённые углы: в альбомной ориентации контент уезжал под них */
    .top-in,.wrap{padding-left:max(12px,env(safe-area-inset-left));
                  padding-right:max(12px,env(safe-area-inset-right))}
    /* меню — сворачиваемый ряд над контентом, а не полотно на два экрана */
    .sdrop{display:block;order:-1;border:1px solid var(--line);border-radius:8px;
           background:var(--panel);overflow:hidden}
    .sdsum{display:flex;align-items:center;justify-content:space-between;
           padding:13px 15px;font-size:15.5px;font-weight:600;cursor:pointer}
    .sdsum::after{content:"▾";font-family:var(--mono);color:var(--lime-deep);
                  transition:transform .15s}
    .sdrop .side{display:none}
    .sdcheck:checked ~ .sdsum{border-bottom:1px solid var(--line)}
    .sdcheck:checked ~ .sdsum::after{transform:rotate(180deg)}
    .sdcheck:checked ~ .side{display:flex;max-height:min(66vh,520px);
                             overflow-y:auto;padding:10px;gap:10px}
    .sdrop .sbox{border-radius:6px}

    /* верхнее меню: прокрутка вбок вместо переноса на две строки */
    .top-in{gap:10px;padding:0 12px;flex-wrap:nowrap}
    .top nav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
    .top nav::-webkit-scrollbar{display:none}
    /* пальцем в ссылку высотой 22 px не попасть: Apple советует 44,
       Android — 48. Делаем основные цели крупнее, не трогая текст */
    .top nav a{padding:14px 10px;font-size:13px;white-space:nowrap;
               min-height:44px;display:flex;align-items:center}
    .sdrop .lrow{min-height:42px}
    .controls .seg button,.bfilter button,.daytabs button,.jfilter button{
      min-height:40px;padding:10px 13px}
    .sdsum{min-height:48px}
    .logo .mark{width:38px;height:38px}
    .logo b{font-size:23px}
    .live{display:none}

    h1{font-size:27px;line-height:1.15}
    .hero{flex-direction:column;align-items:flex-start;gap:12px}
    .hero .daytabs{width:100%}
    .sec,.lgbox,.icard,.jday,.chcard,.astep,.istep{border-radius:8px}

    /* широкие таблицы прокручиваются внутри своей рамки, а не рвут страницу */
    .lgbox,.mbox,.ptab,.ptab2,.chtab,.itab,.stab,.btab,.ltt{max-width:100%}
    .lgbox,.mbox,.ptabwrap,.chtab,.ltable{overflow-x:auto}
    table{font-size:14px}

    /* двухколоночные блоки — в одну колонку */
    /* minmax(0,…) — иначе колонка не сжимается ниже содержимого карточки
       и сетка вылезает за край экрана */
    .lgcols,.tgrid,.pgrid,.jtabs,.icards,.acmp,.atrust,.asteps,.chwrap,.lgwrap,
    .anums,.inums,.jnums,.chnums{grid-template-columns:minmax(0,1fr)}
    .lgcard,.chcard,.icard,.jtab,.astep,.istep,.lgbox{min-width:0}
    .ptab2,.ptab table,.chtab table,.itab{width:100%}
    .fnav{grid-template-columns:repeat(2,minmax(0,1fr))}
  }

  @media(max-width:700px){
    /* в списках игроков на узком экране прячем колонку «матчей»: без неё
       таблица укладывается в ширину телефона и не тянет страницу вбок */
    .ptab2 .pg,.ptab2 th:nth-child(5),.ptab .pg,.ptab th:last-child{display:none}
    .ptab2 td,.ptab2 th{padding-left:9px;padding-right:9px}
    /* специфичность как у правила карточки лиги, иначе nowrap оттуда
       не даёт длинным названиям клубов переноситься */
    .ptab2 .pteam,.ptab2 .pname,
    .lgcard .ptab2 .pteam,.lgcard .ptab2 .pname{white-space:normal}
  }

  /* самые узкие экраны — iPhone SE (320) и Galaxy S8 (360) */
  @media(max-width:400px){
    .itab{table-layout:fixed}
    .itab td,.itab th,.ptab2 td,.ptab2 th{padding:7px 7px;font-size:13px}
    .ptab2 .pos{width:24px}
    /* на 320 px таблица бомбардиров всё равно шире экрана — пусть
       прокручивается внутри себя, а не тянет страницу */
    .ptab2{display:block;overflow-x:auto}
    .tgb-tx b{font-size:16px}
  }

  @media(max-width:560px){
    .wrap{padding:12px 10px 40px}
    h1{font-size:24px}
    .ilead,.chlead,.hero p{font-size:15px}
    .anums b,.inums b,.jnums b,.chnums b{font-size:21px}
    .btab .bname{min-width:0}
    .mtabs{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
    .mtabs::-webkit-scrollbar{display:none}
    .mtabs button{white-space:nowrap}
    .msc{gap:10px}
    .mteam b{font-size:17px}
    .mnum{font-size:30px}
    .fnav{grid-template-columns:1fr}
    /* таблица «вес прогноза» на «как считаем»:три колонки с длинными
       подписями не влезали в 360 px */
    .itab td,.itab th{padding:8px 10px;white-space:normal;font-size:13.5px}
    /* строка кубковой сетки: на 360 px команды сжимались до одной буквы
       («А. — Ч.»), поэтому дату переносим на отдельную строку */
    /* строки матчей в сетке кубка и в списке лиги: команды сжимались
       до одной-двух букв, поэтому дату переносим на отдельную строку */
    .crow,.mrow{grid-template-columns:minmax(0,1fr) 46px minmax(0,1fr) 18px;row-gap:3px}
    .crow .tm,.mrow .tm{grid-column:1/-1;font-size:12px}
  }

  /* ---------- правки по проверке на живом iPhone ---------- */
  @media(max-width:1000px){
    /* 1. верхнее меню: тени по краям показывают, что список листается */
    .top nav{background:
      linear-gradient(90deg,var(--panel) 30%,rgba(255,255,255,0)) left/28px 100% no-repeat local,
      linear-gradient(90deg,rgba(255,255,255,0),var(--panel) 70%) right/28px 100% no-repeat local,
      radial-gradient(farthest-side at 0 50%,rgba(14,24,17,.13),rgba(14,24,17,0)) left/12px 100% no-repeat scroll,
      radial-gradient(farthest-side at 100% 50%,rgba(14,24,17,.13),rgba(14,24,17,0)) right/12px 100% no-repeat scroll}

    /* 2. «идут сейчас»: карточка была уже читаемого минимума */
    /* «идут сейчас»: подпись и ссылка съедали 250 из 390 px, и на карточку
       матча оставалось 130 — раскладываем полосу в два ряда */
    .livebar{gap:8px 10px;padding:9px 10px;flex-wrap:wrap}
    .lvhead{font-size:11px;order:1}
    .lvall{order:2;margin-left:auto}
    .lvrow{order:3;flex:1 1 100%}
    .lvrow .lv{min-width:250px}

    /* 3. строка матча: ставка и коэффициент оставались в строке, а не
       уезжали на два ряда вниз */
    .m{grid-template-columns:46px minmax(0,1fr) auto;gap:7px 10px;padding:11px 12px}
    .m .tm{grid-column:1;grid-row:1}
    .m .teams{grid-column:2;grid-row:1}
    .m .res{grid-column:3;grid-row:1;justify-self:end;text-align:right}
    .m .dist{grid-column:1/3;grid-row:2}
    .m .pick{grid-column:3;grid-row:2;justify-self:end;text-align:right}
    .m .pick .lab{font-size:10px}

    /* 4. подпись под графиками дня и ссылка «все результаты» */
    .ynote{margin-top:12px;font-size:14px}
    .ymore{display:block;margin:8px 0 0}
    .cap span{display:block;margin-top:3px}

    /* 5. таблицы журнала: заголовки переносились в две строки */
    .jgrid{grid-template-columns:minmax(0,1fr);gap:20px}
    .jgrid > div{overflow-x:auto}
    .jtab-t{font-size:13.5px;min-width:0}
    .jtab-t th{white-space:nowrap;font-size:10px;padding-bottom:6px}
    .jtiles{grid-template-columns:repeat(2,minmax(0,1fr))}

    /* 6. строки калибровки: три колонки складывались в кашу */
    .crow{grid-template-columns:minmax(0,1fr) auto;gap:6px 10px;padding:10px 0}
    .crow .clab{grid-column:1;grid-row:1;display:flex;gap:8px;align-items:baseline}
    .crow .cd{grid-column:2;grid-row:1;text-align:right}
    .crow .cbars{grid-column:1/-1;grid-row:2;max-width:none}
    .crow .cd em{display:block;font-size:11.5px}
  }

  /* ---------- второй заход по замечаниям с iPhone ---------- */
  @media(max-width:1000px){
    /* Широкие таблицы не сжимаем до каши, а прокручиваем: при сжатии
       колонки наезжали друг на друга — «все рынки» в матче, точность по
       рынкам, журнал, чемпионы. */
    .btab,.jtab-t,.itab,.stab,.ptab2,.ltt,.chtab table,.mkt,.jtab table,.tgrid table{
      display:block;overflow-x:auto;white-space:nowrap;max-width:100%}
    .btab td,.btab th,.jtab-t td,.jtab-t th,.itab td,.itab th,
    .stab td,.stab th,.chtab td,.chtab th{white-space:nowrap}

    /* Знаки вопроса на телефоне только мешают: всплывающая подсказка
       перекрывает пол-экрана, а объяснения есть в тексте раздела.
       Вместе с ними убираем и подсказку «нажмите на знак вопроса». */
    .qm{display:none}
    .bhint{display:none}

    /* Табло матча: у длинных названий время и счёт наезжали на клуб */
    .msc{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:8px}
    .mteam b{font-size:16px;line-height:1.2;white-space:normal;overflow-wrap:anywhere}
    .mteam .tb{width:32px;height:32px}
    .mnum{font-size:26px}
    .mtop{flex-wrap:wrap;gap:4px 10px;font-size:12px}

    /* Схемы: при ширине 360 подписи в них становились по три пикселя.
       Даём им честный минимум и прокрутку вбок. */
    /* оставшиеся картинки-графики (калибровка) листаются вбок, схемы
       собраны блоками и в этом не нуждаются */
    .ifig,.afig{overflow-x:auto}
    .ifig.flow,.afig.flow{overflow:visible}
    .ifig.sq > svg,.afig.sq > svg{min-width:0}
    /* champions: имя чемпиона переносим, а не режем */
    .stab .win{white-space:normal}
    .jtab table{min-width:420px}
    .jtab th,.jtab td,.jtab-t th,.jtab-t td{padding-left:10px;padding-right:10px}
    .jtab-t{min-width:430px}

    /* Строка матча в списках лиг и разделов обрезалась справа */
    .lgbox .m,.mlist .m{grid-template-columns:44px minmax(0,1fr) auto}
    .lgbox .m .teams,.mlist .m .teams{min-width:0}
  }

  /* ---------- третий заход: правки после проверки на iPhone ---------- */
  /* Воздух между блоками — и на десктопе тоже: текст, графики и таблицы
     стояли вплотную и читались как одна каша. */
  .sec{margin-top:30px}
  .slead{margin-bottom:16px}
  .yday,.journal,.calib{margin-top:6px}

  @media(max-width:1000px){
    /* 1. Меню — отдельной строкой под логотипом, а не в одну линию с ним */
    .top-in{flex-wrap:wrap;padding-bottom:0}
    .top nav{order:3;flex:1 1 100%;border-top:1px solid var(--line2);margin-top:2px}
    .logo{flex:1 1 auto}

    /* 2. Матчи на первый экран: сначала фильтры и лента, объяснения и
       «идут сейчас» — ниже */
    main{display:flex;flex-direction:column}
    main > .hero{order:0}
    main > .controls{order:1}
    main > .board{order:2}
    main > .more{order:3}
    main > .livebar{order:4}
    main > .tgb{order:5}
    main > .slead{order:6}
    main > *{order:7}
    .hero > div > p{display:none}
    .hero{margin-bottom:10px}

    /* 3. Строка матча: ставка и коэффициент — в первой строке рядом с парой,
       полосы вероятностей — второй строкой во всю ширину */
    .m{grid-template-columns:44px minmax(0,1fr) auto;gap:6px 10px}
    .m .tm{grid-column:1;grid-row:1}
    .m .teams{grid-column:2;grid-row:1}
    .m .pick{grid-column:3;grid-row:1;justify-self:end;text-align:right}
    .m .dist{grid-column:1/3;grid-row:2}
    .m .res{grid-column:3;grid-row:2;justify-self:end;align-self:center}

    /* 4. Прокручиваемым блокам — тени по краям, чтобы было видно, что
       они листаются вбок */
    .btab,.jtab-t,.itab,.stab,.ptab2,.ltt,.chtab table,.jtab table,.mkt,.lvrow,.mtabs{
      background:
        linear-gradient(90deg,var(--panel) 30%,rgba(255,255,255,0)) left/24px 100% no-repeat local,
        linear-gradient(90deg,rgba(255,255,255,0),var(--panel) 70%) right/24px 100% no-repeat local,
        radial-gradient(farthest-side at 0 50%,rgba(14,24,17,.16),rgba(14,24,17,0)) left/10px 100% no-repeat scroll,
        radial-gradient(farthest-side at 100% 50%,rgba(14,24,17,.16),rgba(14,24,17,0)) right/10px 100% no-repeat scroll}

    /* 5. Таблица лиги: колонки побед-ничьих-поражений на телефоне не нужны —
       без них очки видно сразу, без прокрутки */
    .ltt th:nth-child(4),.ltt td:nth-child(4),
    .ltt th:nth-child(5),.ltt td:nth-child(5),
    .ltt th:nth-child(6),.ltt td:nth-child(6){display:none}
    .ltt{display:table;white-space:normal;min-width:0}
    .ltt th,.ltt td{padding-left:6px;padding-right:6px}
  }

  @media(max-width:560px){
    .sec{margin-top:24px}
    .hero{margin-bottom:8px}
  }

  /* ---------- четвёртый заход ---------- */
  /* Панель управления лентой: день, рынок и фильтр стояли тремя
     несвязанными рядами. Собираем их в одну карточку — и на десктопе тоже. */
  .controls{border:1px solid var(--line);border-radius:9px;background:var(--panel);
            padding:10px 14px}

  @media(max-width:1000px){
    .hero .daytabs{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
    .hero .daytabs button{width:100%}
    .controls{margin-top:8px;gap:8px 10px}
    .controls .seg{flex:1 1 auto}
    .controls .seg-lab{width:100%;margin-bottom:-2px}
    .controls .sw{width:100%}

    /* Журнал: строка «ждут результата» и дневные строки не влезали
       в 390 px — раскладываем в две строки */
    .jday .jrow2,.jday.soon .jrow2{
      grid-template-columns:auto minmax(0,1fr) auto auto;gap:3px 8px;padding:9px 12px}
    .jrow2 .jtm{grid-column:1;grid-row:1}
    .jrow2 .jpair{grid-column:2/5;grid-row:1;white-space:normal}
    .jrow2 .jpick{grid-column:1/3;grid-row:2}
    .jrow2 .jn{grid-row:2}
    .jrow2 .jres{grid-row:2;justify-self:end}
    .jrow2 .jst,.jrow2 .jgo{display:none}

    /* Названия клубов в списках матчей переносим, а не режем многоточием */
    .mrow .nm,.crow .nm,.mrow .tt,.crow .tt,
    .m .nm,.board .nm{white-space:normal;overflow:visible;text-overflow:clip}
    .mrow,.crow{align-items:start}
    .mrow .tm,.crow .tm{align-self:center}
  }
/* {mob:end} */

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  

  /* {tgb:beg} */
  .tgb{display:flex;align-items:center;gap:18px;margin:0 0 18px;padding:14px 20px;
       border:1px solid var(--lime);border-radius:10px;color:var(--text);
       background:linear-gradient(100deg,var(--lime-soft),var(--panel) 72%)}
  .tgb:hover{border-color:var(--lime-deep);background:var(--lime-soft)}
  .tgb-ic{flex:none;display:flex;align-items:center;justify-content:center;
          width:42px;height:42px;border-radius:50%;background:var(--lime-deep);color:var(--on-lime)}
  .tgb-ic svg{width:23px;height:23px}
  .tgb-tx{flex:1;min-width:0}
  .tgb-tx b{display:block;font-size:17px;letter-spacing:-.01em}
  .tgb-tx em{font-style:normal;display:block;margin-top:2px;font-size:14.5px;color:var(--muted)}
  .tgb-go{flex:none;padding:9px 16px;border-radius:7px;background:var(--lime-deep);
          color:var(--on-lime);font-weight:600;font-size:14.5px;white-space:nowrap}
  .tgb:hover .tgb-go{background:var(--text)}
  @media(max-width:700px){
    .tgb{flex-wrap:wrap;gap:12px;padding:13px 15px}
    .tgb-tx em{display:none}
    .tgb-go{width:100%;text-align:center}
  }
  /* {tgb:end} */

/* {hseo:beg} */
  /* подписи и знаки блоков — scripts/home_seo.py */
  .smark{width:19px;height:19px;flex:none;color:var(--lime-mid);vertical-align:-3px;
         margin-right:9px}
  .sec h2,.board-h2{display:flex;align-items:center}
  /* SEO-подписи набираем на пункт мельче основного текста: это пояснение
     к блоку, а не сам контент, и в 16px оно спорило с матчами за внимание */
  .slead{margin:-2px 0 13px;max-width:96ch;color:var(--muted);font-size:15px;
         line-height:1.6}
  /* нижний текст главной: тот же кегль, что у SEO-подписей — он поясняющий */
  .sec.prose{max-width:78ch}
  .sec.prose h2{margin:20px 0 8px}
  .sec.prose p{margin:0 0 12px;color:var(--muted);font-size:15px;line-height:1.65}
  .sec.prose a{color:var(--lime-deep);font-weight:500}
  .sec.prose a:hover{text-decoration:underline}
  .hdiag{margin:4px 0 18px;padding:0;overflow-x:auto}
  .hdiag svg{width:100%;min-width:620px;max-width:760px;height:auto;display:block}
  .hd-box rect{fill:var(--panel);stroke:var(--line)}
  .hd-arrow path{stroke:var(--line);stroke-width:1.4;fill:none}
  .hd-num text{font:700 17px var(--mono);fill:var(--text);text-anchor:middle}
  .hd-lab text{font:11.5px var(--mono);fill:var(--dim);text-anchor:middle}
  @media(max-width:820px){ .hdiag{display:none} }
/* {hseo:end} */

  /* ---------- страница команды ---------- */
  .thero{display:flex;align-items:center;gap:16px;margin-bottom:16px}
  .thero .tb{width:56px;height:56px;margin:0}
  .thero h1{margin:0}
  .thero p{margin:4px 0 0;color:var(--muted);font-size:var(--fs-row)}
  .tstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:14px;
          border:1px solid var(--line);border-radius:6px;background:var(--panel);
          padding:15px 18px;margin-bottom:14px}
  .tstats div{display:flex;flex-direction:column;gap:2px}
  .tstats em{font-style:normal;font:500 11px var(--mono);letter-spacing:.1em;
             text-transform:uppercase;color:var(--dim)}
  .tstats b{font-family:var(--mono);font-size:21px}
  .tstats b.up{color:var(--win)} .tstats b.down{color:var(--loss)}
  /* форма: последние матчи плиткой — цвет несёт результат, подпись счёт */
  .tform{border:1px solid var(--line);border-radius:6px;background:var(--panel);
         margin-bottom:14px;overflow:hidden}
  .tform .fhead{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;
                padding:12px 15px;border-bottom:1px solid var(--line2);
                font:600 13px var(--mono);letter-spacing:.12em;text-transform:uppercase;
                color:var(--muted)}
  .tform .fsum{letter-spacing:0;text-transform:none;font-weight:400;color:var(--dim)}
  .fstrip{display:flex;flex-wrap:wrap;gap:9px;padding:14px 15px}
  .fch{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:58px;
       padding:9px 7px;border-radius:7px;border:1px solid var(--line2);
       background:var(--panel2)}
  .fch .tb{width:20px;height:20px;margin:0;flex:none;object-fit:contain}
  .fch b{font-size:16px;font-weight:700;line-height:1}
  .fch em{font-style:normal;font-family:var(--mono);font-size:13px;color:var(--dim)}
  .fch.w{background:var(--lime-soft);border-color:var(--lime)} .fch.w b{color:var(--win)}
  .fch.l{background:var(--loss-soft);border-color:var(--loss)} .fch.l b{color:var(--loss)}
  .fch.d b{color:var(--muted)}
  a.fch:hover{border-color:var(--lime-mid)}
  /* бомбардиры и карточки клуба */
  .pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px;
         margin-bottom:14px}
  .ptab{border:1px solid var(--line);border-radius:6px;background:var(--panel);overflow:hidden}
  .ptab h3{margin:0;padding:11px 14px;border-bottom:1px solid var(--line2);
           font:600 12.5px var(--mono);letter-spacing:.1em;text-transform:uppercase;
           color:var(--muted)}
  .ptab table{width:100%;border-collapse:collapse;font-size:14.5px}
  .ptab th{font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;
           color:var(--dim);text-align:left;padding:8px 10px;border-bottom:1px solid var(--line2)}
  .ptab td{padding:7px 10px;border-bottom:1px solid var(--line2)}
  .ptab tr:last-child td{border-bottom:0}
  .ptab .num{text-align:right;font-family:var(--mono)}
  .ptab .pos{width:28px;color:var(--dim);font-family:var(--mono)}
  .ptab .pname{font-weight:500}
  .ptab .pg{color:var(--dim)}
  .ptab .red{color:var(--loss)}
  .prose{max-width:74ch;margin-top:22px}
  .prose h2{margin:20px 0 8px;font-size:13px;font-family:var(--mono);
            letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600}
  .prose h2:first-child{margin-top:0}
  .prose p{margin:0 0 12px;color:var(--muted);font-size:15px;line-height:1.65}
  .prose a{color:var(--lime-deep);font-weight:500}
  .prose a:hover{text-decoration:underline}
  .secttl{margin:0 0 10px;font:600 13px var(--mono);letter-spacing:.12em;
          text-transform:uppercase;color:var(--muted)}
  /* таблица лиги на странице клуба: своя строка подсвечена, чтобы место
     в турнире читалось с первого взгляда */
  .ltable{border:1px solid var(--line);border-radius:6px;background:var(--panel);
          overflow:hidden;margin-bottom:14px}
  .lthead{display:flex;justify-content:space-between;align-items:center;gap:12px;
          padding:11px 15px;border-bottom:1px solid var(--line2);flex-wrap:wrap}
  .ltname{font:600 16px var(--sans)}
  .ltn{font:500 13px var(--mono);color:var(--dim)}
  .ltt{width:100%;border-collapse:collapse;font-size:var(--fs-row)}
  .ltt th{font:500 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;
          color:var(--dim);text-align:left;padding:9px 10px;border-bottom:1px solid var(--line2)}
  .ltt td{padding:8px 10px;border-bottom:1px solid var(--line2)}
  .ltt tr:last-child td{border-bottom:0}
  .ltt .num{text-align:right;font-family:var(--mono)}
  .ltt .pos{width:34px;color:var(--dim);font-family:var(--mono)}
  .ltt .tname{display:flex;align-items:center;gap:9px;min-width:0}
  .ltt .tname .tb{width:20px;height:20px;margin:0;flex:none}
  .ltt .pts{font-weight:700}
  .ltt tr.eu td:first-child{box-shadow:inset 3px 0 0 var(--lime)}
  .ltt tr.ec td:first-child{box-shadow:inset 3px 0 0 var(--lime-soft)}
  .ltt tr.rel td:first-child{box-shadow:inset 3px 0 0 var(--loss)}
  .ltt tr.me td{background:var(--lime-soft);font-weight:600}
  .ltt tr.me .pos{color:var(--lime-deep)}
  /* имя клуба в таблице — ссылка на его страницу */
  .tlink{color:inherit;text-decoration:none;display:inline-flex;align-items:center;
         gap:9px;min-width:0}
  .tlink:hover{color:var(--lime-deep)}
  .ltall{display:block;padding:11px 15px;font-size:13.5px;font-weight:600;
         color:var(--lime-deep);border-top:1px solid var(--line2)}
  .ltall:hover{background:var(--lime-soft)}
  /* строка матча и рамка блока: живут в других генераторах, здесь нужны свои */
  .lgbox{border:1px solid var(--line);border-radius:6px;background:var(--panel);overflow:hidden}
  .lgbox h2{margin:0;padding:12px 15px;border-bottom:1px solid var(--line2);
            font:600 13px var(--mono);letter-spacing:.12em;text-transform:uppercase;
            color:var(--muted)}
  .mrow{display:grid;grid-template-columns:60px minmax(0,1fr) 58px minmax(0,1fr) 22px;
        gap:12px;align-items:center;padding:9px 15px;border-top:1px solid var(--line2);
        font-size:var(--fs-row)}
  .mrow:hover{background:var(--panel2)}
  .mrow .tm{font-family:var(--mono);font-size:12.5px;color:var(--dim)}
  .mrow .tt{display:flex;align-items:center;min-width:0}
  .mrow .tt.ra{flex-direction:row-reverse;text-align:right}
  .mrow .tt.ra .tb{margin:0 0 0 8px}
  .mrow .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mrow .sc{font-family:var(--mono);text-align:center;font-weight:700}
  .mrow .sc.soon{font-weight:400;color:var(--dim)}
  .mrow .go{color:var(--dim);text-align:center}
  .squad{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));
         gap:8px;margin-bottom:8px}
  .sqp{display:flex;align-items:baseline;gap:9px;padding:9px 12px;
       border:1px solid var(--line);border-radius:4px;background:var(--panel)}
  .sqn{font:600 12px var(--mono);color:var(--dim);min-width:20px}
  .sqname{flex:1;min-width:0;font-size:var(--fs-row);overflow:hidden;
          text-overflow:ellipsis;white-space:nowrap}
  .sqname em{font-style:normal;font-size:11px;color:var(--dim)}
  .sqg{font:400 11.5px var(--mono);color:var(--dim);white-space:nowrap}
  .sqnote{font-size:13px;color:var(--muted);margin:0 0 18px}
  .mrow.link:hover .go{color:var(--lime-deep)}
  .mrow .tb{width:20px;height:20px;margin-right:8px;flex:none}

  /* ---------- страница игрока ---------- */
  .phero{display:flex;align-items:flex-start;gap:14px;margin-bottom:16px}
  .phero .pnum{font:700 26px var(--mono);color:var(--dim);min-width:44px;
               text-align:center;padding-top:2px}
  .phero h1{margin:0}
  .phero p{margin:5px 0 0;color:var(--muted);font-size:var(--fs-row)}
  .phero .tb{width:18px;height:18px;margin:0 5px -3px 0}
  .plead{font-size:var(--fs-row);color:var(--muted);margin:2px 0 16px;max-width:70ch}
  .pnote{font-size:12.5px;color:var(--dim);margin:-6px 0 18px;max-width:70ch}
  .pmatches{border:1px solid var(--line);border-radius:6px;background:var(--panel);
            overflow:hidden;margin-bottom:16px}
  .pmatches h2{margin:0;padding:11px 15px;border-bottom:1px solid var(--line2);
               font:600 12.5px var(--mono);letter-spacing:.1em;text-transform:uppercase;
               color:var(--muted)}
  .pmatches table{width:100%;border-collapse:collapse;font-size:14.5px}
  .pmatches th{font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;
               color:var(--dim);text-align:left;padding:8px 10px;
               border-bottom:1px solid var(--line2);white-space:nowrap}
  .pmatches td{padding:7px 10px;border-bottom:1px solid var(--line2);vertical-align:middle}
  .pmatches tr:last-child td{border-bottom:0}
  .pmatches .num{text-align:right;font-family:var(--mono);white-space:nowrap}
  .pmatches .dt{font-family:var(--mono);color:var(--dim);white-space:nowrap}
  .pmatches .opp{min-width:120px}
  .pmatches .opp .tb{width:18px;height:18px;margin:0 6px -3px 0}
  .pmatches .role{font-family:var(--mono);font-size:12.5px;color:var(--dim);white-space:nowrap}
  .pmatches .mk{white-space:nowrap;font-family:var(--mono);font-size:13px}
  .pmatches .mk b{color:var(--win)}
  .pmatches .mk .yc{color:#d6a419} .pmatches .mk .rc{color:var(--loss)}
  .pmatches .rt{font-family:var(--mono)}
  .pclub{display:inline-flex;align-items:center;gap:7px;margin-bottom:16px;
         border:1px solid var(--line);border-radius:6px;background:var(--panel);
         padding:9px 13px;font-size:var(--fs-row)}
  .pclub .tb{width:22px;height:22px;margin:0}

  /* ---------- хлебные крошки ---------- */
  .bcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin:0 0 13px;
          font-family:var(--mono,ui-monospace,monospace);font-size:12.5px;
          letter-spacing:.04em;color:var(--dim,#8b908b)}
  .bcrumb a{color:var(--lime-deep,#35701A);text-decoration:none}
  .bcrumb a:hover{color:var(--lime-mid,#4E9B24);text-decoration:underline}
  .bcrumb i{font-style:normal;opacity:.55}
  .bcrumb b{font-weight:600;color:var(--text,#1c1f1c);max-width:min(62vw,560px);
            overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
