*{box-sizing:border-box}html,body{height:100%}[hidden]{display:none!important}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:#e9e9e9;color:#1b1f23}
.topbar{background:#7bb51a;color:#fff}
.topbar__inner{max-width:none;width:100%;margin:0;padding:10px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center;gap:8px;font-weight:900;letter-spacing:.4px}
.brand__logo{background:transparent;padding:0;border-radius:0;color:#fff;font-size:18px}
.layout{max-width:none;width:100%;margin:0;padding:14px 12px;display:grid;grid-template-columns:280px 1fr 320px;gap:12px;align-items:start}
@media (max-width:1180px){.layout{grid-template-columns:260px 1fr}.betslip{display:none}}
@media (max-width:860px){.layout{grid-template-columns:1fr}.sidebar{display:none}.betslip{display:block}}
.page-home .layout{grid-template-columns:280px 1fr}
.page-home .betslip{display:none!important}
.sidebar{background:#fff;border:1px solid #e3e7ea;border-radius:12px;padding:12px;position:sticky;top:16px}
.sidebar__brand{display:flex;align-items:center;justify-content:center;padding:8px 6px 14px;border-bottom:1px solid #eef2f4;margin-bottom:12px}
.sidebar__logo{max-width:100%;height:44px;object-fit:contain}
.sidebar__section{margin-bottom:12px}
.menu{background:transparent;border:none;border-radius:0;overflow:visible;display:flex;flex-direction:column;gap:10px}
.menu__item{display:flex;align-items:center;gap:12px;padding:14px 14px;text-decoration:none;color:#0f172a;font-weight:900;background:#efefef;border-radius:10px;border:1px solid #e3e7ea}
.menu__item::before{content:"";width:32px;height:32px;border-radius:10px;background:#fff;border:1px solid #e3e7ea;display:flex;align-items:center;justify-content:center;font-size:16px;color:#0f172a;flex:0 0 auto}
.menu__item--home::before{content:"⌂"}
.menu__item--ball::before{content:"⚽"}
.menu__item[aria-disabled="true"]{opacity:.75;cursor:not-allowed}
.menu__item--active{background:#7bb51a;color:#fff;border-color:#7bb51a}
.menu__item--active::before{background:#0b3f12;border-color:#0b3f12;color:#fff}
.sidebar__btn{display:block;text-align:center;text-decoration:none;font-weight:900;border-radius:10px;padding:14px 14px;border:1px solid #e3e7ea}
.sidebar__btn--login{background:#7bb51a;border-color:#7bb51a;color:#fff}
.sidebar__btn--login:hover{filter:brightness(1.02)}
.panel{background:#fff;border:1px solid #e3e7ea;border-radius:12px;overflow:hidden}
.panel__title{padding:12px 14px;font-weight:900;border-bottom:1px solid #eef2f4;background:#7bb51a;color:#fff}
.panel__body{padding:12px 14px}
.content{background:#fff;border:1px solid #e3e7ea;border-radius:10px;overflow:hidden}
.content__header{padding:14px 14px;border-bottom:1px solid #eef2f4;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.content__title{font-weight:900;color:#0b3f12}
.search{display:flex;gap:10px;align-items:center}
.search__input{width:min(520px,70vw);padding:10px 12px;border-radius:10px;border:1px solid #d7dde1;outline:none}
.search__input:focus{border-color:#7bb51a;box-shadow:0 0 0 3px rgba(123,181,26,.18)}
.groups{padding:12px}
.group{border:1px solid #e3e7ea;border-radius:10px;overflow:hidden;margin-bottom:12px}
.group__header{display:flex;align-items:center;justify-content:space-between;background:#7bb51a;color:#fff;padding:10px 12px;font-weight:900;cursor:pointer}
.group__meta{display:flex;align-items:center;gap:10px}
.badge{background:rgba(255,255,255,.2);padding:4px 8px;border-radius:999px;font-weight:800}
.group__body{display:block}
.game{display:grid;grid-template-columns:80px 1fr 260px;gap:10px;padding:10px 12px;border-top:1px solid #eef2f4;align-items:center}
@media (max-width:860px){.game{grid-template-columns:72px 1fr}.game__odds{grid-column:1/-1}}
.game__time{font-weight:800;color:#0f172a}
.teams{display:flex;flex-direction:column;gap:6px}
.team{display:flex;align-items:center;gap:8px}
.team__logo{width:18px;height:18px;border-radius:50%;background:#eef2f4;object-fit:cover}
.team__name{font-weight:700;color:#0f172a}
.game__odds{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.odd{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 10px;border-radius:10px;border:1px solid #e3e7ea;background:#0f172a;color:#fff;font-weight:900;cursor:pointer;user-select:none}
.odd:hover{filter:brightness(1.06)}
.odd--sel{outline:3px solid rgba(123,181,26,.4);border-color:#7bb51a}
.odd__label{opacity:.85;font-weight:800}
.odd__value{font-variant-numeric:tabular-nums}
.betslip{background:#fff;border:1px solid #e3e7ea;border-radius:10px;overflow:hidden;position:sticky;top:16px}
.betslip__title{padding:12px 14px;font-weight:900;background:#7bb51a;color:#fff}
.betslip__body{padding:12px 14px}
.slip{display:flex;flex-direction:column;gap:10px;min-height:60px}
.slip__item{border:1px solid #e3e7ea;border-radius:10px;padding:10px}
.slip__top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.slip__match{font-weight:900}
.slip__pick{margin-top:6px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.slip__remove{border:none;background:#eef2f4;border-radius:10px;padding:8px 10px;cursor:pointer;font-weight:900}
.slip__summary{margin-top:12px;border-top:1px solid #eef2f4;padding-top:12px;display:flex;flex-direction:column;gap:10px}
.row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.input{width:140px;padding:10px 12px;border-radius:10px;border:1px solid #d7dde1;outline:none}
.input:focus{border-color:#7bb51a;box-shadow:0 0 0 3px rgba(123,181,26,.18)}
.btn{border:none;border-radius:10px;padding:10px 12px;font-weight:900;cursor:pointer}
.btn--primary{background:#0b3f12;color:#fff}
.btn--ghost{background:#eef2f4;color:#0f172a}
.btn--block{width:100%}
.btn:disabled{opacity:.5;cursor:not-allowed}
.notice{margin:12px;border-radius:10px;padding:12px;background:#fff3cd;border:1px solid #ffe69c;color:#664d03}
.notice--small{margin-top:12px;padding:10px}
.muted{color:#5b6673;font-weight:700}
.strong{font-weight:900}
.blue{color:#0b60d1}
.modal{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:50}
.modal__backdrop{position:absolute;inset:0;background:rgba(15,23,42,.55)}
.modal__card{position:relative;width:min(420px,92vw);background:#fff;border-radius:12px;border:1px solid #e3e7ea;overflow:hidden}
.modal__header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-bottom:1px solid #eef2f4}
.modal__title{font-weight:900;color:#0b3f12}
.modal__body{padding:14px}
.iconbtn{border:none;background:#eef2f4;border-radius:10px;width:36px;height:36px;font-size:20px;font-weight:900;cursor:pointer}
.tabs{display:flex;gap:10px;margin-bottom:12px}
.tab{flex:1;border:none;border-radius:10px;padding:10px 12px;font-weight:900;cursor:pointer;background:#eef2f4;color:#0f172a}
.tab--active{background:#0b3f12;color:#fff}
.form{display:flex;flex-direction:column;gap:8px}
.label{font-weight:900;color:#0f172a}
.banner-area{padding:12px 12px 0}
.banner{border-radius:10px;overflow:hidden;border:1px solid #e3e7ea;background:#eef2f4}
.banner a{display:block;text-decoration:none}
.banner__img{width:100%;height:160px;object-fit:cover;display:block}
@media (max-width:860px){.banner__img{height:130px}}
.content__section{padding:12px}
.section__title{font-weight:900;color:#0b3f12;margin:0 0 10px}
.days{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media (max-width:860px){.days{grid-template-columns:1fr}}
.day{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border-radius:10px;border:1px solid #e3e7ea;background:#eef2f4;text-decoration:none;color:#0f172a;font-weight:900}
.day:hover{filter:brightness(1.02)}
.countries{padding:0 12px 12px}
.country{border:1px solid #e3e7ea;border-radius:10px;overflow:hidden;margin-bottom:12px}
.country__header{display:flex;align-items:center;gap:10px;background:#7bb51a;color:#fff;padding:10px 12px;font-weight:900}
.country__logo{width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,.25);object-fit:cover}
.leagues{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;padding:12px;background:#fff}
@media (max-width:860px){.leagues{grid-template-columns:1fr}}
.league{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px;border-radius:10px;border:1px solid #e3e7ea;background:#eef2f4;text-decoration:none;color:#0f172a;font-weight:900}
.league:hover{filter:brightness(1.02)}
