/* 4D result cards: asiabetreview /4d-results/ pages and the homepage strip (patch.js homeFourD).
   Layout follows the familiar Malaysian results-board format: brand-colour header with the operator
   logo, 1st/2nd/3rd as labelled rows, then Special and Consolation grids. */
.fd-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:18px 0 8px}
.fd-cards .fd-head,#abr-home4d .fd-head{flex-wrap:nowrap}
.fd-cards .fd-head > div,#abr-home4d .fd-head > div{min-width:0}
.fd-cards .fd-logo img{max-width:92px}
.fd-cards .fd-head h2,html #root .rich-content .fd-cards .fd-head h2{font-size:17px!important}
.fd-cards .fd-meta{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fd-cards .fd-r b{font-size:28px}
.fd-cards .fd-grid span{font-size:16px}
@media (max-width:960px){.fd-cards{grid-template-columns:repeat(2,1fr)}}
.fd-card{background:#fff;border:1px solid #d9d9de;border-radius:10px;overflow:hidden;margin:18px 0;box-shadow:0 1px 3px rgba(0,0,0,.06);font-family:inherit}
.fd-cards .fd-card,.fd-row .fd-card{margin:0}
.fd-head{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:66px;padding:9px 10px 9px 16px;background:var(--b);color:var(--bf)}
.fd-head .fd-name,.fd-head h2,.fd-head h3,html #root .rich-content .fd-head h2{margin:0!important;padding:0!important;font-size:19px!important;line-height:1.2!important;font-weight:800!important;letter-spacing:.01em;text-transform:uppercase;color:var(--bf)!important;border:0!important}
.fd-head a,html #root .rich-content .fd-head a{color:var(--bf)!important;text-decoration:none!important}
.fd-head .fd-meta{display:block;margin-top:3px;font-size:13px;font-weight:600;color:var(--bf);opacity:.85}
.fd-logo{flex:0 0 auto;display:flex;align-items:center;justify-content:center;height:48px;min-width:48px;padding:4px 8px;background:#fff;border-radius:8px}
.fd-logo.dark{background:#111}
.fd-logo img{display:block;max-height:40px;max-width:118px;width:auto;height:auto;margin:0!important;border-radius:0!important}
.fd-tp{border-bottom:1px solid #e5e5ea}
.fd-r{display:grid;grid-template-columns:38% 1fr;border-top:1px solid #e5e5ea}
.fd-r:first-child{border-top:0}
.fd-r span{display:flex;align-items:center;padding:0 14px;background:var(--bd,#1d1d1f);color:#fff;font-size:15px;font-weight:700}
.fd-r span small{font-size:12px;font-weight:600;opacity:.8;margin-left:4px}
.fd-r b{display:block;padding:5px 16px;font-size:32px;line-height:1.25;font-weight:800;letter-spacing:.06em;color:#1d1d1f;font-variant-numeric:tabular-nums}
.fd-band{background:#3a3a3c;color:#fff;text-align:center;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:5px 0}
.fd-grid{display:grid;grid-template-columns:repeat(5,1fr)}
.fd-grid span{text-align:center;padding:8px 0;font-size:18px;font-weight:700;color:#1d1d1f;font-variant-numeric:tabular-nums;letter-spacing:.03em;border-right:1px solid #e5e5ea;border-bottom:1px solid #e5e5ea}
.fd-grid span:nth-child(5n){border-right:0}
.fd-grid span:nth-last-child(-n+5){border-bottom:0}
.fd-foot{display:block;padding:9px 14px;border-top:1px solid #e5e5ea;font-size:13px;font-weight:600;color:#0071e3!important;text-decoration:none!important;text-align:right}
.fd-foot:hover{background:#f5f5f7}
.fd-jump{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 4px}
.fd-jump a,html #root .rich-content .fd-jump a{display:inline-flex;align-items:center;gap:6px;padding:5px 12px 5px 5px;border-radius:8px;font-size:13px;font-weight:700;text-decoration:none!important;background:var(--b);color:var(--bf)!important}
.fd-jump img{width:24px;height:24px;object-fit:contain;background:#fff;border-radius:5px;padding:2px;margin:0!important}
.fd-jump .dark img{background:#111}
.fd-meta{font-size:13px;color:#6e6e73}
@media (max-width:640px){
  .fd-cards{grid-template-columns:1fr}
  .fd-r b{font-size:28px}
  .fd-grid span{font-size:16px;padding:7px 0}
  .fd-head .fd-name,.fd-head h2,html #root .rich-content .fd-head h2{font-size:17px!important}
}

/* homepage strip */
#abr-home4d{margin:-32px 0 44px}
#abr-home4d .h4-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:14px}
#abr-home4d .h4-t{font-size:22px;font-weight:700;color:#1d1d1f;letter-spacing:-.01em}
#abr-home4d .h4-t small{display:block;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#4f46e5;margin-bottom:4px}
#abr-home4d .h4-all{font-size:14px;font-weight:600;color:#0071e3;text-decoration:none;white-space:nowrap}
#abr-home4d .fd-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
#abr-home4d .fd-r b{font-size:28px}
#abr-home4d .fd-grid span{font-size:16px}
@media (max-width:1000px){
  #abr-home4d .fd-row{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:12px;padding-bottom:4px}
  #abr-home4d .fd-row::-webkit-scrollbar{display:none}
  #abr-home4d .fd-card{flex:0 0 min(88%,360px);scroll-snap-align:start}
}
@media (max-width:640px){#abr-home4d{margin-top:-16px}#abr-home4d .h4-t{font-size:19px}}
#abr-home4d .fd-head{flex-wrap:nowrap}
#abr-home4d .fd-head > div{min-width:0}
#abr-home4d .fd-logo img{max-width:92px}
#abr-home4d .fd-meta{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* the page's global img rules win otherwise, letting wide logos (Perdana) crush the title */
.fd-logo img,html #root .rich-content .fd-logo img{max-width:118px!important;max-height:40px!important;width:auto!important;height:auto!important}
.fd-cards .fd-logo img,html #root .rich-content .fd-cards .fd-logo img,#abr-home4d .fd-logo img{max-width:96px!important}
.fd-head > div{min-width:0;flex:1 1 auto}
.fd-logo{max-width:112px;overflow:hidden}
.fd-cards .fd-head{min-height:84px}
