:root{
  --bg:#05133b;
  --bg-deep:#031032;
  --card:#06123c;
  --card-border:rgba(255,255,255,.08);
  --line:rgba(255,255,255,.08);
  --white:#fff;
  --muted:rgba(255,255,255,.58);
  --muted-2:rgba(255,255,255,.42);
  --orange:#ffad16;
  --orange-2:#ff8a00;
  --green:#19ef99;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Arial,sans-serif;background:#d9d9de;color:var(--white)}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
button,input,select,textarea{font:inherit}

.browser-bar{position:sticky;top:0;z-index:30;max-width:430px;margin:0 auto;height:62px;background:#ececef;color:#161616;display:flex;align-items:center;justify-content:space-between;padding:0 16px;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.browser-icon{border:0;background:transparent;font-size:24px;line-height:1;color:#161616;padding:0}
.browser-domain{font-size:20px;font-weight:500;letter-spacing:-.02em}

.site-wrap{max-width:430px;margin:0 auto;min-height:calc(100vh - 62px);background:var(--bg);position:relative;overflow:hidden}
.app-screen{position:relative;padding:22px 18px 34px;background:
  radial-gradient(circle at 0% 18%, rgba(82,113,255,.33), transparent 30%),
  radial-gradient(circle at 100% 8%, rgba(0,173,239,.16), transparent 24%),
  radial-gradient(circle at 50% 78%, rgba(255,137,38,.08), transparent 20%),
  linear-gradient(180deg,#07184d 0%, #04133f 36%, #031033 100%);
}
.app-glow{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,.03),transparent 20%,transparent 85%,rgba(255,255,255,.02))}
.profile-header,.hero-title,.main-card,.section-head,.history-list,.more-link,.offers-list{position:relative;z-index:1}
.profile-header{display:flex;align-items:center;gap:14px}
.avatar-ring{width:76px;height:76px;position:relative;flex:0 0 auto}
.avatar-ring:before{content:"";position:absolute;inset:-9px;border-radius:999px;background:rgba(94,116,255,.16);filter:blur(12px)}
.avatar-ring:after{content:"";position:absolute;inset:0;border-radius:999px;background:linear-gradient(180deg,#29428f,#172a68);border:1px solid rgba(255,255,255,.1)}
.avatar{position:absolute;inset:4px;border-radius:999px;overflow:hidden;background:linear-gradient(180deg,#d7e4f2,#8ea4c8);display:flex;align-items:center;justify-content:center;color:#10214f;font-weight:900;font-size:24px;z-index:2;}
.avatar img{width:100%;height:100%;object-fit:cover}
.brand-line{display:flex;align-items:center;gap:8px}
.brand-name{font-size:23px;font-weight:900;letter-spacing:-.05em;line-height:1}
.verified{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:999px;background:#67a8ff;color:#fff;font-weight:900;font-size:17px}
.brand-subtitle{margin-top:5px;font-size:11px;line-height:1;color:rgba(255,255,255,.68)}
.hero-title{text-align:center;margin:30px 0 30px;font-size:23px;line-height:1.05;font-weight:900;letter-spacing:-.03em}

.main-card,.history-card,.offer-card{background:linear-gradient(180deg, rgba(3, 10, 37, .82), rgba(4, 10, 42, .94));border:1px solid rgb(255 255 255 / 72%);box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 12px 35px rgba(0,0,0,.16)}
.main-card{border-radius:30px;padding:18px 14px}
.main-pill{display:inline-flex;align-items:center;border-radius:999px;border:1px solid #2d8fcb;background:linear-gradient(180deg,#134d8a,#103d75);padding:8px 18px;font-size:11px;font-weight:800;color:#6bd5ff;letter-spacing:.01em;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.competition{margin-top:14px;font-size:12px;letter-spacing:.12em;color:rgba(255,255,255,.55);font-weight:600}
.match-grid{margin-top:16px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.team-col{display:flex;flex-direction:column;align-items:center}
.team-logo-box{width:46px;height:46px;border-radius:18px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.07);display:flex;align-items:center;justify-content:center;padding:8px;font-size:28px;font-weight:900}
.team-logo-box img{max-width:100%;max-height:100%;object-fit:contain}
.team-name{margin-top:10px;font-size:12px;font-weight:600;text-align:center}
.match-center{padding:0 10px;text-align:center}
.match-date{font-size:12px;font-weight:600;letter-spacing:.05em;color:rgba(255,255,255,.52)}
.match-time{margin-top:5px;font-size:33px;line-height:.95;font-weight:900;letter-spacing:-.05em;color:#ff934a}
.match-subline{margin-top:4px;font-size:12px;color:rgba(255,255,255,.5)}
.divider{margin:18px -14px 0;border-top:1px solid rgba(255,255,255,.06)}
.label{padding-top:22px;text-align:center;font-size:11px;font-weight:800;letter-spacing:.14em;color:rgba(255,255,255,.43)}
.prono-title{margin-top:9px;text-align:center;font-size:22px;font-weight:900;letter-spacing:-.03em}
.old-odd{margin-top:8px;text-align:center;font-size:23px;color:rgba(255,255,255,.38);text-decoration:line-through;text-decoration-thickness:2px}
.boost-card{margin-top:18px;border-radius:18px;border:1px solid #9c571f;background:linear-gradient(180deg,rgba(105,60,29,.96),rgba(86,50,25,.96));box-shadow:0 0 26px rgba(255,139,25,.08);padding:18px 16px 16px;text-align:center}
.boost-label{font-size:15px;font-weight:900;letter-spacing:.06em;color:#ffaf22}
.boost-row{margin-top:10px;display:flex;align-items:flex-end;justify-content:center;gap:8px}
.old-inline{font-size:21px;color:#f0d5c6;opacity:.8;text-decoration:line-through;text-decoration-thickness:2px}
.arrow{font-size:31px;line-height:1;color:#f0b178}
.boosted-odd{font-size:38px;line-height:.9;font-weight:900;letter-spacing:-.05em;color:#ffac11}
.boost-button{display:block;margin-top:14px;border-radius:13px;background:linear-gradient(180deg,#ff9a11,#ff8600);padding:14px 10px;font-size:17px;font-weight:900;letter-spacing:.01em;color:#fff;box-shadow:0 6px 20px rgba(255,146,13,.14)}
.boost-button.is-disabled{border:0;width:100%;opacity:.6}
.boost-note{margin-top:10px;font-size:12px;line-height:1.35;color:rgba(255,255,255,.65)}
.meta-grid{margin-top:16px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));text-align:center}
.meta-label{font-size:11px;font-weight:700;letter-spacing:.08em;color:rgba(255,255,255,.4)}
.meta-value{margin-top:4px;font-size:16px;font-weight:900}
.confidence-dots{margin-top:4px;font-size:16px;letter-spacing:.12em;color:#ff9624}
.placeholder-card{text-align:center;padding:34px 18px}
.placeholder-icon{font-size:28px;margin-bottom:10px}
.placeholder-card h2{margin:0 0 8px;font-size:24px}.placeholder-card p{margin:0;color:var(--muted)}

.section-head2{margin:5px 0 0;display:flex;align-items:center;gap:14px}
.section-head2:before,.section-head2:after{content:"";height:1px;flex:1;background:rgba(255,255,255,.09)}
.section-head2 span{font-size:16px;font-weight:900;margin: 20px 0 20px;letter-spacing:.11em;color:rgba(255,255,255,.99);text-align:center}

.section-head{margin:26px 0 0;display:flex;align-items:center;gap:14px}
.section-head:before,.section-head:after{content:"";height:1px;flex:1;background:rgba(255,255,255,.09)}
.section-head span{font-size:14px;font-weight:900;letter-spacing:.11em;color:rgba(255,255,255,.42);text-align:center}
.offers-head{margin-top:28px}.offers-head span{color:rgba(255,255,255,.65)}
.history-list,.offers-list{margin-top:16px;display:flex;flex-direction:column;gap:12px}
.history-card{border-radius:21px;padding:14px;display:grid;grid-template-columns:70px 1fr auto;align-items:center;gap:10px}
.history-date{font-size:11px;color:rgba(255,255,255,.35);text-align:right}
.history-score-main{margin-top:14px;font-size:14px;font-weight:600;color:rgba(255,255,255,.95)}
.history-title{font-size:15px;font-weight:600;line-height:1.25}
.history-odds{margin-top:4px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.old-hist{font-size:11px;color:rgba(255,255,255,.3);text-decoration:line-through}
.new-hist{font-size:14px;font-weight:900;color:#ffba22}
.boost-tag{border:1px solid #b97e22;border-radius:8px;padding:3px 8px;font-size:10px;font-weight:900;color:#ffba22}
.history-status{border-radius:999px;padding:9px 12px;font-size:12px;font-weight:900;white-space:nowrap}
.history-status.won{background:#074843;color:#18ea98}
.history-status.lost{background:#4b1421;color:#ff738a}
.more-link{margin-top:12px;display:flex;align-items:center;justify-content:center;gap:4px;color:rgba(255,255,255,.52);font-size:14px;font-weight:600}
.offer-card{border-radius:22px;padding:14px;display:flex;align-items:center;gap:14px}
.offer-logo{width:58px;height:58px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.07);display:flex;align-items:center;justify-content:center;overflow:hidden;font-weight:900}
.offer-logo img{width:100%;height:100%;object-fit:contain}
.offer-copy{flex:1;min-width:0}
.offer-name{font-size:18px;font-weight:900;letter-spacing:-.03em}
.offer-lines{margin-top:4px;display:flex;flex-wrap:wrap;gap:2px 16px;font-size:11px;color:rgba(255,255,255,.62)}
.offer-arrow{font-size:24px;color:rgba(255,255,255,.28)}

/* Admin */
.admin-body{background:#071120;color:#fff;padding:20px}
.admin-wrapper{max-width:1300px;margin:0 auto}
.admin-top{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:20px}
.admin-top h1{margin:0 0 6px;font-size:32px}
.hint{color:#9aa7c7;margin:0}
.admin-top-links{display:flex;gap:10px;flex-wrap:wrap}
.logout-link{background:#13203d;border:1px solid rgba(255,255,255,.08);padding:10px 14px;border-radius:12px}
.alert{padding:14px 16px;border-radius:14px;margin:14px 0;font-weight:700}.alert.success{background:#0c372d;color:#7ff0bf}.alert.error{background:#451826;color:#ffa4b5}
.admin-grid{display:grid;gap:18px}.admin-grid-3{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}
.admin-panel{background:#0b1630;border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:18px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.admin-panel h2{margin:0 0 14px;font-size:22px}
.admin-form{display:flex;flex-direction:column;gap:12px}.admin-form.dense{gap:10px}
.admin-form label{display:flex;flex-direction:column;gap:6px;font-size:14px;color:#c6d0ef}
.admin-form input,.admin-form select,.admin-form textarea{background:#091224;border:1px solid rgba(255,255,255,.1);color:#fff;border-radius:12px;padding:12px 13px;outline:none}
.admin-form textarea{min-height:110px;resize:vertical}
.admin-form button,.mini-btn{background:linear-gradient(180deg,#ff9a11,#ff8600);color:#fff;border:0;border-radius:12px;padding:12px 14px;font-weight:900;cursor:pointer}
.two-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.check-row{display:flex !important;flex-direction:row !important;align-items:center;gap:10px}

.history-score-main {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.history-logo {
  width: 16px;
  height: 16px;
  object-fit: contain;
}

.score-text {
  font-weight: 600;
}
.hidden-prono {
  display: none;
}
.guide-link {
  margin-top: 12px;
  font-size: 13px;
  color: #6bd5ff;
  text-align: center;
  cursor: pointer;
  font-weight: 600;
}

.guide-link:hover {
  opacity: 0.8;
}

.guide-section {
  margin-top: 40px;
  padding: 20px;
  text-align: center;
}

.guide-section h3 {
  font-size: 16px;
  margin-bottom: 12px;
  color: white;
}


.boost-top {
  text-align: center;
  padding: 20px;
}

.boost-alert {
  color: #ffb400;
  font-weight: bold;
  margin-bottom: 10px;
}

.prono-title-big {
  font-size: 22px;
  font-weight: 700;
  margin: 10px 0;
}

.boost-row-big {
  font-size: 28px;
  font-weight: bold;
  margin: 10px 0;
}

.big-cta {
  display: block;
  font-size: 18px;
  padding: 18px;
  margin-top: 15px;
}

.second-cta {
  margin-top: 15px;
}

.urgency {
  color: #ff4d4d;
  font-size: 14px;
  margin-top: 5px;
}

.sub-cta {
  font-size: 12px;
  opacity: 0.8;
  margin-top: 5px;
}

.proof img {
  width: 100%;
  border-radius: 12px;
}

.proof-text {
  font-size: 13px;
  margin-top: 5px;
  opacity: 0.8;
  text-align: center;
}


.match-header {
  text-align: center;
  margin-bottom: 15px;
}

.match-league {
  font-size: 12px;
  opacity: 0.7;
  margin-bottom: 10px;
}

.match-teams {
  display: grid;
  grid-template-columns: 80px 1fr 80px;
  align-items: start;
  column-gap: 16px;
}

.team-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  width: 90px;
  text-align: center;
}

.team-logo-big {
  max-width: 64px;
  max-height: 64px;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}
.prono-carousel {
  margin-top: 20px;
}

.carousel-track {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
}

.carousel-track::-webkit-scrollbar {
  display: none;
}

.carousel-slide {
  min-width: 100%;
  scroll-snap-align: start;
  padding: 10px;
}

.main-card {
  background: #111;
  border-radius: 20px;
  padding: 20px;
  text-align: center;
}

.match {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}

.prono-title {
  font-size: 20px;
  font-weight: bold;
}

.odds {
  margin: 10px 0;
}

.old {
  text-decoration: line-through;
  color: #888;
  margin-right: 5px;
}

.new {
  font-size: 26px;
  color: #69df45;
  font-weight: bold;
}

.cta {
  display: block;
  background: #69df45;
  padding: 12px;
  border-radius: 10px;
  margin-top: 15px;
  color: #000;
  font-weight: bold;
}

.fake-proof {
  margin-top: 10px;
  font-size: 13px;
  opacity: 0.8;
}

.carousel-dots {
  display: flex;
  justify-content: center;
  margin-top: 10px;
}

.dot {
  width: 6px;
  height: 6px;
  background: #555;
  border-radius: 50%;
  margin: 3px;
}

.dot.active {
  background: #69df45;
}
.match-center {
  flex: 1;
  text-align: center;
}

.match-title {
  font-weight: 600;
  font-size: 16px;
}

.match-date {
    font-size: 12px;
    opacity: 1;
    margin-top: 25px;
    color: white;
}
.alt-cta {
  margin-top: 12px;
  font-size: 13px;
  opacity: 0.8;
  text-align: center;
}

.alt-cta a {
  color: #69df45;
  text-decoration: none;
  font-weight: 600;
}
.alt-cta {
  margin-top: 14px;
  text-align: center;
}

.alt-text {
  font-size: 12px;
  opacity: 0.7;
  margin-bottom: 6px;
}

.alt-button {
  display: inline-block;
  font-size: 13px;
  padding: 8px 14px;
  border-radius: 8px;
  background: rgba(105, 223, 69, 0.1);
  color: #69df45;
  text-decoration: none;
  font-weight: 600;
  border: 1px solid rgba(105, 223, 69, 0.3);
  transition: all 0.2s ease;
}

.alt-button:hover {
  background: rgba(105, 223, 69, 0.2);
}
.guide-telegram {
  margin-top: 10px;
  font-size: 14px;
  text-align: center;
}

.guide-telegram a {
  color: #69df45;
  font-weight: 600;
  text-decoration: none;
}
/* 🔥 Ligne VS */
.vs-line {
  position: relative;
  margin: 15px 0;
}

.vs-line::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 1px;
  background: rgba(255,255,255,0.2);
}

.vs-line span {
  position: relative;
  background: #0b1d3a;
  padding: 5px 10px;
  border-radius: 50px;
  font-size: 12px;
  opacity: 0.8;
}


/* 🔥 CTA GLOW */
.big-cta {
  background: linear-gradient(135deg, #ff8c00, #ffae00);
  box-shadow: 0 0 20px rgba(255, 140, 0, 0.6);
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

/* 🔥 HOVER / TAP */
.big-cta:hover {
  box-shadow: 0 0 30px rgba(255, 140, 0, 0.9);
  transform: scale(1.03);
}

/* 🔥 PULSE ANIMATION */
@keyframes pulseGlow {
  0% {
    box-shadow: 0 0 10px rgba(255, 140, 0, 0.5);
  }
  50% {
    box-shadow: 0 0 25px rgba(255, 140, 0, 1);
  }
  100% {
    box-shadow: 0 0 10px rgba(255, 140, 0, 0.5);
  }
}

.big-cta {
  animation: pulseGlow 1.5s infinite;
}


.big-cta::after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,0.4), transparent);
  transform: skewX(-20deg);
  animation: shine 2.5s infinite;
}

@keyframes shine {
  0% { left: -75%; }
  100% { left: 125%; }
}

.popup-offer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.75);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

.popup-box {
  background: #0a1a3a;
  padding: 25px;
  border-radius: 16px;
  text-align: center;
  max-width: 320px;
  width: 90%;
  box-shadow: 0 0 30px rgba(0,0,0,0.8);
}

.popup-title {
  font-size: 20px;
  font-weight: bold;
  color: #ffb400;
  margin-bottom: 10px;
}

.popup-text {
  font-size: 14px;
  margin-bottom: 20px;
}

.popup-btn {
  display: block;
  background: linear-gradient(135deg, #ff8c00, #ffae00);
  padding: 15px;
  border-radius: 10px;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
}

.popup-close {
  margin-top: 10px;
  font-size: 12px;
  opacity: 0.7;
}

.match-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin: 10px 0 15px;
}

.team {
  text-align: center;
}

.team-logo {
  width: 40px;
  height: 40px;
  object-fit: contain;
  margin-bottom: 5px;
}

.team-name {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  width: 100%;
  margin: 0;
}

.vs {
  font-size: 14px;
  opacity: 0.6;
}
.separator {
  height: 1px;
  background: rgba(255,255,255,0.1);
  margin: 15px 0;
}

.label-prono {
  font-size: 11px;
  letter-spacing: 1px;
  opacity: 0.6;
  margin-bottom: 5px;
}
.guide-video video {
  width: 100%;
  border-radius: 12px;
}
.check-row input{width:auto}
.table-wrap{overflow:auto}
.admin-table{width:100%;border-collapse:collapse;font-size:14px}.admin-table th,.admin-table td{padding:12px 10px;border-bottom:1px solid rgba(255,255,255,.08);text-align:left;vertical-align:top}.admin-table th{color:#9fb0dd;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.status-badge{display:inline-flex;align-items:center;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:800}.status-active{background:#143d5f;color:#7fd4ff}.status-won{background:#0c372d;color:#7ff0bf}.status-lost{background:#451826;color:#ffa4b5}.status-draft{background:#2b3244;color:#d0d5e8}
.actions-cell{display:flex;gap:8px;flex-wrap:wrap}.mini-btn{padding:8px 10px;font-size:12px}.mini-btn.secondary{background:#13203d}.mini-btn.danger{background:#5b1b2b}
@media (max-width: 980px){.admin-grid-3{grid-template-columns:1fr}.admin-top{flex-direction:column}}
@media (max-width: 430px){.browser-bar,.site-wrap{max-width:100%}}