/* S8SPORT v4.41.1 · Homepage Prediction Launcher + Reliable Responsive Popup */
:root{--s8pred-home-green:#08b96d;--s8pred-home-green2:#19cf8b;--s8pred-home-navy:#073668;--s8pred-home-blue:#0e64b8;--s8pred-home-ink:#10243d}
html.s8pred-modal-open,html.s8pred-modal-open body{overflow:hidden!important}
.s8pred-home-entry-card{min-width:0;border-radius:18px;overflow:hidden;border:1px solid #d7e7ff;background:#fff;box-shadow:0 12px 28px rgba(15,63,105,.08)}
.s8pred-home-entry-button{position:relative;width:100%;height:100%;min-height:218px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;text-align:left;border:0;padding:16px 17px;background:linear-gradient(155deg,#073a79 0%,#0c67b8 50%,#08a876 100%);color:#fff;overflow:hidden}
.s8pred-home-entry-button:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 25% 18%,rgba(255,255,255,.18),transparent 34%),linear-gradient(115deg,transparent 53%,rgba(255,255,255,.09) 53% 60%,transparent 60%);pointer-events:none}
.s8pred-home-entry-button:hover{color:#fff;filter:saturate(1.04);transform:translateY(-1px)}
.s8pred-home-entry-art{position:absolute;left:16px;top:15px;width:130px;height:88px;filter:drop-shadow(0 12px 20px rgba(1,31,68,.25))}.s8pred-home-entry-art svg{width:100%;height:100%}
.s8pred-home-entry-copy{position:relative;z-index:2;display:grid;gap:2px}.s8pred-home-entry-copy b{font-size:20px;line-height:1.14;letter-spacing:-.3px}.s8pred-home-entry-copy small{font-size:11px;color:#d8f5ec;font-weight:650}
.s8pred-home-entry-arrow{position:absolute;right:16px;bottom:18px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#1168c2;font-size:21px;font-weight:900;box-shadow:0 9px 20px rgba(0,42,91,.18)}
.s8pred-home-entry-button>em{position:absolute;right:13px;top:13px;padding:5px 8px;border-radius:999px;background:#ff594f;color:#fff;font-size:8px;font-style:normal;font-weight:950;letter-spacing:.5px;box-shadow:0 6px 14px rgba(255,70,70,.28)}

.s8pred-mobile-fab{position:fixed;right:24px;bottom:104px;z-index:2147483000;height:54px;min-width:176px;display:flex;align-items:center;justify-content:flex-start;gap:10px;padding:7px 15px 7px 8px;border:1px solid rgba(255,255,255,.9);border-radius:999px;background:linear-gradient(135deg,#075a9d 0%,#08aa72 58%,#10c77d 100%);color:#fff;box-shadow:0 16px 34px rgba(4,75,83,.28),0 0 0 4px rgba(255,255,255,.9);font:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:transform .18s ease,filter .18s ease,box-shadow .18s ease}.s8pred-mobile-fab:hover{transform:translateY(-2px);filter:brightness(1.04);box-shadow:0 19px 38px rgba(4,75,83,.34),0 0 0 4px rgba(255,255,255,.94)}.s8pred-mobile-fab:focus-visible{outline:3px solid rgba(13,191,123,.35);outline-offset:4px}.s8pred-mobile-fab .s8pred-fab-icon{width:38px;height:38px;flex:0 0 38px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.17);font-size:20px;line-height:1}.s8pred-mobile-fab b{min-width:0;color:#fff;font-size:12px;font-weight:900;line-height:1.1;white-space:nowrap}.s8pred-mobile-fab em{position:absolute;right:-3px;top:-7px;min-width:22px;height:22px;padding:0 6px;display:grid;place-items:center;border:2px solid #fff;border-radius:999px;background:#ff4f5d;color:#fff;font-size:9px;font-style:normal;font-weight:950;box-shadow:0 5px 12px rgba(180,33,54,.28)}
.s8pred-home-modal{position:fixed;inset:0;z-index:2147483600;display:grid;place-items:center;padding:22px;visibility:hidden;opacity:0;transition:opacity .18s ease,visibility .18s ease}
.s8pred-home-modal.is-open{visibility:visible;opacity:1}
.s8pred-home-backdrop{position:absolute;inset:0;border:0;background:rgba(3,20,37,.68);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
.s8pred-home-dialog{position:relative;z-index:2;width:min(590px,calc(100vw - 36px));max-height:min(820px,calc(100dvh - 36px));display:flex;flex-direction:column;border-radius:24px;overflow:hidden;background:#fff;box-shadow:0 30px 90px rgba(3,25,52,.38);transform:translateY(12px) scale(.985);transition:transform .22s ease;border:1px solid rgba(255,255,255,.5)}
.s8pred-home-modal.is-open .s8pred-home-dialog{transform:translateY(0) scale(1)}
.s8pred-home-dialog-head{position:relative;display:grid;grid-template-columns:66px minmax(0,1fr) 38px;align-items:center;gap:12px;padding:17px 17px 16px;background:linear-gradient(135deg,#07543f 0%,#087858 44%,#09a56c 100%);color:#fff}
.s8pred-home-dialog-head:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 48%,rgba(255,255,255,.08) 48% 56%,transparent 56%);pointer-events:none}.s8pred-home-dialog-head>*{position:relative;z-index:2}
.s8pred-home-dialog-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:16px;background:rgba(255,255,255,.15);font-size:27px;border:1px solid rgba(255,255,255,.16)}
.s8pred-home-dialog-head span{display:block;margin-bottom:1px;color:#74ffd0;font-size:8px;font-weight:950;letter-spacing:1.25px}.s8pred-home-dialog-head h2{margin:0;color:#fff;font-size:22px;line-height:1.12;letter-spacing:-.3px}.s8pred-home-dialog-head p{margin:3px 0 0;color:#d7f6eb;font-size:9.5px;font-weight:600}
.s8pred-home-close{width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.12);color:#fff;font-size:22px;line-height:1;display:grid;place-items:center}.s8pred-home-close:hover{background:rgba(255,255,255,.16)}
.s8pred-home-dialog-scroll{min-height:0;overflow:auto;padding:15px 16px 17px;background:linear-gradient(180deg,#f7fbf9 0,#fff 34%)}
.s8pred-home-alert{margin-bottom:11px;padding:10px 12px;border-radius:11px;font-size:11px;font-weight:800}.s8pred-home-alert.is-success{color:#087543;background:#e6f9ef;border:1px solid #b9eccf}.s8pred-home-alert.is-error{color:#b13232;background:#fff0f0;border:1px solid #ffd1d1}
.s8pred-home-match-picker{display:grid;grid-template-columns:26px minmax(0,1fr);align-items:center;gap:5px 8px;margin-bottom:11px}.s8pred-home-match-picker>span{grid-row:1/3;width:23px;height:23px;border-radius:50%;display:grid;place-items:center;background:#e4f8ef;color:#07975c;font-size:10px;font-weight:950}.s8pred-home-match-picker>b{font-size:10px;color:#29445f;line-height:1}.s8pred-home-match-picker select{grid-column:2;width:100%;height:42px;border:1px solid #d9e7e1;border-radius:11px;padding:0 35px 0 11px;background:#fff;color:#142d45;font-size:11px;font-weight:750;outline:0}.s8pred-home-match-picker select:focus{border-color:#11b978;box-shadow:0 0 0 3px rgba(17,185,120,.1)}
.s8pred-home-popup-body{position:relative;transition:opacity .15s}.s8pred-home-popup-body.is-loading{opacity:.42;pointer-events:none}.s8pred-home-popup-body.is-loading:after{content:"";position:absolute;left:50%;top:36%;width:30px;height:30px;margin:-15px;border-radius:50%;border:3px solid #dfece6;border-top-color:#0ab56f;animation:s8predSpin .7s linear infinite}@keyframes s8predSpin{to{transform:rotate(360deg)}}
.s8pred-home-popup-fixture{overflow:hidden;margin-bottom:11px;border:1px solid #d8e8e1;border-radius:15px;background:linear-gradient(135deg,#f8fcfa,#f0f8f5)}
.s8pred-home-popup-kick{display:flex;justify-content:center;align-items:center;gap:9px;padding:7px 10px;background:linear-gradient(90deg,#075b96,#0b82bf);color:#fff}.s8pred-home-popup-kick b{font-size:11px}.s8pred-home-popup-kick span{font-size:8px;color:#d6efff;font-weight:650}
.s8pred-home-popup-teams{display:grid;grid-template-columns:1fr 48px 1fr;align-items:center;gap:5px;padding:11px 12px}.s8pred-home-popup-team{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0}.s8pred-home-popup-team img{width:42px;height:42px;object-fit:contain;flex:0 0 auto}.s8pred-home-popup-team i{font-style:normal;font-size:30px}.s8pred-home-popup-team strong{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;color:#122c45}.s8pred-home-popup-vs{text-align:center;color:#1687c5;font-weight:950;font-size:16px}
.s8pred-home-popup-empty{min-height:180px;display:grid;place-items:center;align-content:center;gap:6px;text-align:center;padding:24px;border:1px dashed #cedfd7;border-radius:15px;color:#5e746a}.s8pred-home-popup-empty b{font-size:14px;color:#1d3d30}.s8pred-home-popup-empty span{font-size:10px;max-width:340px}
/* Compact the existing prediction form when it lives inside the modal. */
.s8pred-home-dialog .s8pred-quick-form{margin:0;padding:12px;border:1px solid #e1ece7;border-radius:15px;background:#fff;box-shadow:none}.s8pred-home-dialog .s8pred-quick-field{margin-bottom:9px}.s8pred-home-dialog .s8pred-quick-field>span,.s8pred-home-dialog .s8pred-box-label{font-size:9px;color:#38536d}.s8pred-home-dialog .s8pred-quick-field select,.s8pred-home-dialog .s8pred-quick-field>input,.s8pred-home-dialog .s8pred-text-input{min-height:42px;padding:9px 11px;border-radius:10px}.s8pred-home-dialog .s8pred-prediction-box{padding:10px;margin-bottom:9px;border-radius:11px}.s8pred-home-dialog .s8pred-simple-score input{height:48px;font-size:23px}.s8pred-home-dialog .s8pred-quick-grid{gap:9px}.s8pred-home-dialog .s8pred-same-count{height:43px}.s8pred-home-dialog .s8pred-same-count b{font-size:22px}.s8pred-home-dialog .s8pred-simple-submit{min-height:46px;border-radius:11px;background:linear-gradient(100deg,#08ae66,#10c77a);font-size:12px;box-shadow:0 10px 22px rgba(7,171,99,.18)}.s8pred-home-dialog .s8pred-guest-note,.s8pred-home-dialog .s8pred-lock-note{margin-top:5px;font-size:8px}

@media(max-width:767px){
  .s8pred-home-entry-card{display:none}
  .s8pred-mobile-fab{right:12px;bottom:calc(174px + env(safe-area-inset-bottom));height:47px;min-width:126px;max-width:148px;gap:7px;padding:5px 11px 5px 6px;border:0;box-shadow:0 12px 26px rgba(2,92,70,.3),0 0 0 3px rgba(255,255,255,.94)}.s8pred-mobile-fab .s8pred-fab-icon{width:35px;height:35px;flex-basis:35px;font-size:18px}.s8pred-mobile-fab b{font-size:10px;white-space:nowrap}.s8pred-mobile-fab em{right:-2px;top:-6px;min-width:20px;height:20px;font-size:8px}
  .s8pred-home-modal{display:flex;align-items:flex-end;padding:0}.s8pred-home-dialog{width:100%;max-height:88dvh;border-radius:22px 22px 0 0;transform:translateY(100%);border:0}.s8pred-home-modal.is-open .s8pred-home-dialog{transform:translateY(0)}
  .s8pred-home-dialog-head{grid-template-columns:44px minmax(0,1fr) 34px;padding:12px 14px}.s8pred-home-dialog-icon{width:42px;height:42px;border-radius:12px;font-size:20px}.s8pred-home-dialog-head span{font-size:7px}.s8pred-home-dialog-head h2{font-size:17px}.s8pred-home-dialog-head p{font-size:8px}.s8pred-home-close{width:32px;height:32px;font-size:20px}
  .s8pred-home-dialog-scroll{padding:11px 12px max(16px,env(safe-area-inset-bottom))}.s8pred-home-match-picker{margin-bottom:9px}.s8pred-home-match-picker select{height:43px;font-size:10px}
  .s8pred-home-popup-kick{padding:6px 8px;gap:6px}.s8pred-home-popup-kick b{font-size:10px}.s8pred-home-popup-kick span{font-size:7px}.s8pred-home-popup-teams{grid-template-columns:1fr 34px 1fr;padding:9px 8px}.s8pred-home-popup-team{flex-direction:column;gap:3px;text-align:center}.s8pred-home-popup-team img{width:35px;height:35px}.s8pred-home-popup-team strong{max-width:120px;font-size:10px}.s8pred-home-popup-vs{font-size:13px}
  .s8pred-home-dialog .s8pred-quick-form{padding:10px}.s8pred-home-dialog .s8pred-prediction-box{padding:9px}.s8pred-home-dialog .s8pred-simple-score{grid-template-columns:1fr 18px 1fr;gap:5px}.s8pred-home-dialog .s8pred-simple-score input{height:46px;font-size:22px}.s8pred-home-dialog .s8pred-quick-grid{grid-template-columns:1fr 1fr!important;gap:7px}.s8pred-home-dialog .s8pred-quick-grid .s8pred-quick-field>span{min-height:22px;font-size:7.5px}.s8pred-home-dialog .s8pred-same-count{height:42px}.s8pred-home-dialog .s8pred-same-count b{font-size:19px}.s8pred-home-dialog .s8pred-same-count small{font-size:8px}.s8pred-home-dialog .s8pred-quick-field>input{font-size:11px}.s8pred-home-dialog .s8pred-simple-submit{min-height:48px;font-size:12px}.s8pred-home-dialog .s8pred-guest-note{display:none}
}
@media(max-width:390px){.s8pred-mobile-fab{right:9px;bottom:calc(166px + env(safe-area-inset-bottom));height:44px;min-width:118px;padding-right:9px}.s8pred-mobile-fab .s8pred-fab-icon{width:32px;height:32px;flex-basis:32px;font-size:16px}.s8pred-mobile-fab b{font-size:9px}.s8pred-home-dialog .s8pred-quick-grid{grid-template-columns:1fr!important}.s8pred-home-dialog .s8pred-quick-grid .s8pred-quick-field>span{min-height:0}}
@media(prefers-reduced-motion:reduce){.s8pred-home-modal,.s8pred-home-dialog,.s8pred-home-entry-button{transition:none!important}}
/* Inline launcher beside "Tin mới cập nhật" */
.s8pred-latest-title-cluster{display:flex;align-items:center;gap:10px;min-width:0}.s8pred-section-launcher{position:relative;width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border:0;border-radius:13px;background:linear-gradient(145deg,#0c68bd,#08b56d);color:#fff;box-shadow:0 9px 21px rgba(4,118,95,.22);overflow:hidden}.s8pred-section-launcher span{font-size:22px;line-height:1}.s8pred-section-launcher i{position:absolute;right:3px;top:2px;font-size:10px;font-style:normal}.s8pred-section-launcher:hover{transform:translateY(-1px);filter:brightness(1.04)}
@media(max-width:767px){.s8pred-section-launcher{display:none}}

/* v4.41 collision safety: prediction launcher always sits above the existing LIVE CTA without covering it. */
@media(min-width:768px){body.home .s8pred-mobile-fab{right:26px;bottom:104px}}
@media(max-width:767px){body.home .s8pred-mobile-fab{pointer-events:auto!important;visibility:visible!important;opacity:1!important}}
