.cd-home{--lime:#7BB30B;--lime-d:#659408;--ink:#000;--dark:#171514;--bg:#F3F4F6;--line:#E5E7EB;--mute:#6B7280;max-width:1400px;margin:0 auto;padding:28px 24px 48px;font-family:Lato,sans-serif;color:var(--dark)}
.cd-home a{text-decoration:none;color:inherit}
.cd-home h2,.cd-home h3,.cd-react b,.cd-pill,.cd-btn,.cd-tabs button{font-family:Oswald,sans-serif}
.cd-home ul,.cd-home ol{list-style:none;margin:0;padding:0}

/* hero: the one loud thing on the page */
.cd-hero{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:16px;height:540px}
.cd-card{position:relative;display:block;overflow:hidden;border-radius:14px;background:var(--ink)}
.cd-card.big{grid-row:span 2}
.cd-bg{position:absolute;inset:0;background:#2b3a12 center/cover no-repeat;transition:transform .5s}
.cd-card:hover .cd-bg{transform:scale(1.04)}
.cd-ov{position:absolute;inset:auto 0 0 0;padding:70px 24px 22px;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.88))}
.cd-ov h2{margin:10px 0 8px;font-size:21px;line-height:1.2;font-weight:700;color:#fff}
.cd-card.big .cd-ov h2{font-size:38px;line-height:1.1}
.cd-ov small{font-size:13px;opacity:.85}

.cd-pill{display:inline-block;background:var(--lime);color:#000!important;padding:3px 10px;border-radius:4px;font-size:12px;font-weight:700;letter-spacing:.5px;text-transform:uppercase}
.cd-cm{font-size:13px;color:var(--mute);white-space:nowrap}
.cd-ov .cd-cm{color:#fff}

.cd-main{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:32px;margin-top:32px}
.cd-hot{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;background:var(--ink);color:#fff!important;border-left:6px solid var(--lime);border-radius:10px;padding:16px 22px;margin-bottom:28px}
.cd-hot b{color:var(--lime);font-size:15px;letter-spacing:.5px;text-transform:uppercase}
.cd-hot span{flex:1 1 280px;font:700 20px/1.25 Oswald,sans-serif}
.cd-hot em{font-style:normal;color:var(--lime)}

.cd-hd{display:flex;justify-content:space-between;align-items:baseline;border-bottom:3px solid var(--line);margin-bottom:6px}
.cd-hd h3,.cd-w h3,.cd-box h3{font-size:22px;margin:0 0 10px;text-transform:uppercase;letter-spacing:.5px}
.cd-hd a{color:var(--lime-d);font-weight:700}
.cd-list{background:#fff;border-radius:12px;padding:4px 22px}
.cd-list li{display:flex;align-items:center;gap:14px;padding:13px 0;border-bottom:1px solid var(--line)}
.cd-list li:last-child{border:0}
.cd-list time{width:46px;flex:none;color:var(--mute);font-size:14px}
.cd-list a:not(.cd-pill){flex:1;font:600 18px/1.3 Oswald,sans-serif}
.cd-list a:not(.cd-pill):hover,.cd-box li a:hover,.cd-c a:hover{color:var(--lime-d)}

.cd-boxes{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-top:32px}
.cd-box{background:#fff;border-radius:12px;padding:20px;border-top:4px solid var(--lime)}
.cd-thumb{position:relative;display:block;aspect-ratio:16/9;border-radius:8px;overflow:hidden;margin-bottom:10px}
.cd-box li,.cd-pane li{display:flex;gap:10px;align-items:baseline;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line)}
.cd-box li:last-child,.cd-pane li:last-child{border:0}
.cd-box li a,.cd-pane li a{font-weight:700;line-height:1.3}

.cd-w{background:#fff;border-radius:12px;padding:20px;margin-bottom:20px}
.cd-w p{margin:0 0 12px;line-height:1.5}
.cd-dark{background:var(--ink);color:#fff}
.cd-dark h3{color:var(--lime)}
.cd-btn{display:inline-block;background:var(--lime);color:#000!important;padding:10px 20px;border-radius:6px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;border:2px solid var(--lime);transition:background .2s}
.cd-btn:hover{background:var(--lime-d);border-color:var(--lime-d)}
.cd-btn.o{background:transparent;color:var(--lime)!important}
.cd-btn.full{display:block;text-align:center;margin-top:12px}
.cd-tabs{display:flex;gap:18px;border-bottom:1px solid var(--line);margin-bottom:6px}
.cd-tabs button{background:none;border:0;padding:0 0 10px;font-size:16px;text-transform:uppercase;color:var(--mute);cursor:pointer;border-bottom:3px solid transparent}
.cd-tabs button.on{color:var(--dark);border-color:var(--lime)}
.cd-pane{display:none}.cd-pane.on{display:block}
.cd-pane li i{flex:none;width:26px;height:26px;border-radius:6px;background:var(--lime-d);color:#fff;font:700 14px/26px Oswald,sans-serif;text-align:center;font-style:normal}
.cd-pane li a{flex:1}
.cd-c{padding:10px 0 10px 12px;border-left:3px solid var(--lime);margin-bottom:10px;font-size:14px}
.cd-c p{margin:4px 0 0;color:var(--mute)}.cd-c a{font-weight:700}
.cd-mute{color:var(--mute)}

.cd-ad{margin:22px 0;text-align:center;min-height:90px}
.cd-ad.ph{display:flex;align-items:center;justify-content:center;border:2px dashed #cbd5e1;color:var(--mute);font-size:13px;border-radius:8px}

/* reactions and login-to-comment (articles + comments, site wide) */
.cd-rx{margin:32px 0;padding:18px 20px;background:#fff;border-radius:12px;border-left:5px solid var(--lime)}
.cd-rx h4{margin:0 0 10px;font:700 18px Oswald,sans-serif}
.cd-react{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.cd-react button{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border:1px solid #d1d5db;border-radius:999px;background:#fff;font:600 14px Lato,sans-serif;cursor:pointer;transition:background .15s,border-color .15s}
.cd-react button:hover{border-color:var(--lime)}
.cd-react button.on{background:var(--lime);border-color:var(--lime);color:#000}
.cd-react b{font-size:14px}
.cd-join{background:#000;color:#fff;border-radius:12px;padding:24px;text-align:center}
.cd-join h3{color:var(--lime);margin:0 0 6px;font-family:Oswald,sans-serif;text-transform:uppercase}
.cd-join p{margin:0 0 14px}

@media(max-width:900px){
	.cd-hero{height:auto;grid-template-columns:1fr;grid-template-rows:none}
	.cd-card{min-height:230px}.cd-card.big{grid-row:auto;min-height:340px}
	.cd-card.big .cd-ov h2{font-size:27px}
	.cd-main{grid-template-columns:1fr}
	.cd-list li{flex-wrap:wrap;gap:6px 10px}.cd-list time{width:auto}
	.cd-list a:not(.cd-pill){flex:1 1 100%;order:3}
}
@media(prefers-reduced-motion:reduce){.cd-bg{transition:none}}
.cd-home a:focus-visible,.cd-react button:focus-visible,.cd-tabs button:focus-visible{outline:3px solid var(--lime);outline-offset:2px}

/* header account button */
.cd-acct-btn{display:inline-block;background:#7BB30B;color:#000!important;padding:9px 18px;border-radius:6px;font:700 15px Oswald,sans-serif;text-transform:uppercase;letter-spacing:.5px;text-decoration:none;white-space:nowrap;transition:background .2s}
.cd-acct-btn:hover{background:#659408}
.cd-acct{position:relative;display:inline-block}
.cd-av{width:44px;height:44px;padding:0;border:2px solid #7BB30B;border-radius:50%;background:none;cursor:pointer;overflow:hidden;line-height:0}
.cd-av img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.cd-menu{position:absolute;right:0;top:calc(100% + 10px);min-width:230px;background:#fff;color:#171514;border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.25);padding:8px;z-index:999}
.cd-menu[hidden]{display:none}
.cd-who{display:flex;flex-direction:column;padding:10px 12px;margin-bottom:6px;border-bottom:1px solid #E5E7EB}
.cd-who small{color:#6B7280}
.cd-menu a{display:block;padding:10px 12px;border-radius:6px;color:#171514!important;font-weight:700;text-decoration:none}
.cd-menu a:hover{background:#F3F4F6;color:#659408!important}
.cd-av:focus-visible{outline:3px solid #7BB30B;outline-offset:2px}

/* ===== v1.1 layout fixes + motion ===== */
.cd-boxes{grid-template-columns:repeat(3,1fr)}
@media(max-width:1100px){.cd-boxes{grid-template-columns:repeat(2,1fr)}.cd-boxes>.cd-box:last-child:nth-child(odd){grid-column:span 2}}
@media(max-width:700px){.cd-boxes{grid-template-columns:1fr}.cd-boxes>.cd-box:last-child:nth-child(odd){grid-column:auto}}
@media(min-width:1101px){
.cd-boxes>.cd-box:last-child:nth-child(3n+2),.cd-boxes>.cd-box:last-child:nth-child(3n+1):not(:first-child){display:grid;grid-template-columns:1fr 1fr;column-gap:22px;align-items:start}
.cd-boxes>.cd-box:last-child:nth-child(3n+2){grid-column:span 2}
.cd-boxes>.cd-box:last-child:nth-child(3n+1):not(:first-child){grid-column:span 3}
.cd-boxes>.cd-box:last-child:nth-child(3n+2) h3,.cd-boxes>.cd-box:last-child:nth-child(3n+1):not(:first-child) h3{grid-column:1/-1}
.cd-boxes>.cd-box:last-child:nth-child(3n+2) .cd-thumb,.cd-boxes>.cd-box:last-child:nth-child(3n+1):not(:first-child) .cd-thumb{margin:0}}

/* header account button: no underline, shine on hover */
a.cd-acct-btn{position:relative;overflow:hidden;text-decoration:none!important;border-radius:999px;padding:10px 22px;font-size:14px;letter-spacing:.8px;animation:cdring 2.8s infinite;transition:transform .2s,box-shadow .2s,background .2s}
a.cd-acct-btn::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);transform:skewX(-20deg);transition:left .6s}
a.cd-acct-btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(123,179,11,.45)}
a.cd-acct-btn:hover::after{left:130%}
@keyframes cdring{0%{box-shadow:0 0 0 0 rgba(123,179,11,.55)}70%{box-shadow:0 0 0 10px rgba(123,179,11,0)}100%{box-shadow:0 0 0 0 rgba(123,179,11,0)}}

/* primary navigation: gliding lime line with a ball, hover lift, soon badges */
.header-navigation .menu{position:relative}
.header-navigation .menu>li>a{font-family:Oswald,sans-serif!important;text-transform:uppercase;letter-spacing:.8px;font-weight:600;transition:color .2s,transform .2s}
.header-navigation .menu>li>a:hover,.header-navigation .menu>li.current-menu-item>a{color:#7BB30B!important}
.header-navigation .menu>li>a:hover{transform:translateY(-2px)}
.cd-line{position:absolute;bottom:-8px;left:0;height:4px;width:0;border-radius:4px;background:#7BB30B;box-shadow:0 0 14px rgba(123,179,11,.8);opacity:0;pointer-events:none;transition:left .4s cubic-bezier(.7,0,.2,1),width .4s cubic-bezier(.7,0,.2,1),opacity .2s}
.cd-line.on{opacity:1}
.cd-line::after{content:"";position:absolute;right:-3px;top:-3px;width:10px;height:10px;border-radius:50%;background:#7BB30B;box-shadow:0 0 10px #7BB30B}
.header-navigation .menu a[href*="live-scores"]::after,.header-navigation .menu a[href*="forum"]::after{content:"SOON";margin-left:6px;padding:1px 6px;border-radius:3px;background:#7BB30B;color:#000;font:700 9px Oswald,sans-serif;letter-spacing:.6px;vertical-align:middle}

/* page motion */
.cd-box,.cd-card,.cd-hot,.cd-w{transition:transform .25s,box-shadow .25s}
.cd-box:hover,.cd-w:hover{transform:translateY(-4px);box-shadow:0 14px 28px rgba(0,0,0,.1)}
.cd-card:hover{transform:translateY(-3px);box-shadow:0 16px 30px rgba(0,0,0,.28)}
.cd-ov h2{display:inline;background:linear-gradient(#7BB30B,#7BB30B) 0 100%/0 3px no-repeat;transition:background-size .45s;padding-bottom:3px}
.cd-card:hover .cd-ov h2{background-size:100% 3px}
.cd-list li{transition:padding .25s,background .25s,box-shadow .25s}
.cd-list li:hover{padding-left:12px;background:#F6FAEE;box-shadow:inset 3px 0 0 #7BB30B}
.cd-pill{transition:background .2s,transform .2s}.cd-pill:hover{background:#659408;color:#fff!important;transform:translateY(-1px)}
.cd-hot b{display:inline-block;animation:cdpulse 1.8s ease-in-out infinite}
@keyframes cdpulse{50%{transform:scale(1.12);opacity:.8}}
.cd-react button{transition:transform .15s,background .15s,border-color .15s}
.cd-react button:hover{transform:translateY(-2px)}.cd-react button:active{transform:scale(.94)}
.cd-react button.on span{display:inline-block;animation:cdpop .4s}
@keyframes cdpop{50%{transform:scale(1.7) rotate(-10deg)}}
.cd-rv{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease;transition-delay:var(--d,0s)}
.cd-rv.cd-in{opacity:1;transform:none}
@media(max-width:1024px){.cd-line{display:none}}
@media(prefers-reduced-motion:reduce){.cd-rv{opacity:1;transform:none;transition:none}.cd-line,.cd-hot b,a.cd-acct-btn,.cd-react button.on span{animation:none;transition:none}}

/* ===== category pages + ad labels ===== */
.cd-cathead{background:#000;color:#fff;border-radius:14px;padding:32px 36px;margin:0 0 28px;border-bottom:5px solid #7BB30B}
.cd-cathead h1{margin:0 0 6px;font:700 44px/1.05 Oswald,sans-serif;text-transform:uppercase;color:#fff}
.cd-cathead p{margin:0 0 10px;max-width:620px;color:#d1d5db}
.cd-cathead>span{color:#7BB30B;font-weight:700}
.cd-cathead nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.cd-cathead nav a{padding:5px 14px;border:1px solid #374151;border-radius:999px;color:#fff!important;text-decoration:none!important;font:600 13px Oswald,sans-serif;text-transform:uppercase;letter-spacing:.5px;transition:background .2s,border-color .2s,transform .2s}
.cd-cathead nav a:hover{transform:translateY(-2px)}
.cd-cathead nav a:hover,.cd-cathead nav a.on{background:#7BB30B;border-color:#7BB30B;color:#000!important}
.cd-ad small{display:block;margin-bottom:4px;font-size:11px;letter-spacing:.5px;text-transform:uppercase;color:#9CA3AF}
.cd-ad.s-category_feed{grid-column:1/-1}
@media(max-width:700px){.cd-cathead{padding:24px 20px}.cd-cathead h1{font-size:32px}}

/* ===== v1.2 category header: full width + motion ===== */
.cd-cathead,.cd-ad.s-category_top,.cd-ad.s-category_bottom,.cd-ad.s-category_feed{grid-column:1/-1}
.cd-cathead{position:relative;overflow:hidden;background:radial-gradient(120% 140% at 100% 0,#1f2d08 0,#000 55%)}
.cd-cathead>*{position:relative;z-index:1}
.cd-cathead::after{content:attr(data-name);position:absolute;right:28px;bottom:-26px;font:700 150px/1 Oswald,sans-serif;text-transform:uppercase;color:transparent;-webkit-text-stroke:2px rgba(123,179,11,.28);pointer-events:none;animation:cdslide .9s cubic-bezier(.2,.7,.2,1) both}
.cd-cathead::before{content:"";position:absolute;left:0;bottom:0;height:5px;width:140px;background:linear-gradient(90deg,transparent,#fff,#7BB30B);animation:cdrun 3.4s linear infinite}
.cd-cathead h1{animation:cdup .6s both}
.cd-cathead>span{display:inline-block;animation:cdup .6s .12s both}
.cd-cathead nav a{animation:cdup .5s calc(.2s + var(--i,0) * .06s) both}
@keyframes cdup{from{opacity:0;transform:translateY(16px)}}
@keyframes cdslide{from{opacity:0;transform:translateX(60px)}}
@keyframes cdrun{from{left:-140px}to{left:100%}}
@media(max-width:700px){.cd-cathead::after{font-size:80px}}
@media(prefers-reduced-motion:reduce){.cd-cathead *,.cd-cathead::before,.cd-cathead::after{animation:none!important}}

/* reaction buttons: force readable text (the theme turns button text white) */
.cd-react button,.cd-react button b,.cd-react button span{color:#171514!important}
.cd-react button{background:#fff;text-transform:none;letter-spacing:0}
.cd-react button:hover{background:#F3F4F6}
.cd-react button.on,.cd-react button.on b{color:#000!important}
.cd-react button.on{background:#7BB30B}

/* reaction buttons stay still under the pointer so every click lands */
.cd-react button:hover{transform:none}
.cd-react button:active{transform:scale(.97)}
