:root{
  --bg:#070a0d;--panel:#0f1419;--panel2:#131a20;--line:#26303a;--text:#f6f7f8;--muted:#97a3ad;
  --gold:#ffb000;--gold2:#ffd65a;--green:#25d366;--danger:#ff5d5d;--ok:#38d46a;--shadow:0 22px 70px rgba(0,0,0,.35);
  --radius:18px;--max:1180px
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;line-height:1.55}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.wrap{width:min(var(--max),calc(100% - 34px));margin:auto}.muted{color:var(--muted)}
.topbar{position:sticky;top:0;z-index:30;background:rgba(6,9,12,.9);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.07)}.nav{height:76px;display:flex;align-items:center;justify-content:space-between;gap:22px}.brand{display:flex;align-items:center;gap:12px;font-weight:900;letter-spacing:.4px}.brand-mark{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--gold2),var(--gold));color:#111;font-size:21px;box-shadow:0 10px 30px rgba(255,176,0,.18)}.brand small{display:block;color:var(--muted);font-weight:650;font-size:10px;letter-spacing:1.4px}.navlinks{display:flex;align-items:center;gap:22px;font-size:14px;color:#dbe1e5}.navlinks a:hover,.navlinks a.active{color:var(--gold)}.navlinks a.active{position:relative}.navlinks a.active:after{content:"";position:absolute;left:0;right:0;bottom:-10px;height:2px;border-radius:999px;background:var(--gold)}.nav-cta{padding:10px 15px;border-radius:12px;border:1px solid rgba(255,176,0,.35);color:var(--gold);font-weight:800}
.hero{min-height:610px;position:relative;overflow:hidden;border-bottom:1px solid rgba(255,255,255,.08);background:radial-gradient(circle at 68% 35%,rgba(255,176,0,.09),transparent 33%),linear-gradient(180deg,#080c10,#070a0d)}.hero:after{content:"";position:absolute;inset:auto 0 0;height:180px;background:linear-gradient(transparent,var(--bg));pointer-events:none}.hero-grid{display:grid;grid-template-columns:1.03fr .97fr;gap:20px;min-height:610px;align-items:center;position:relative;z-index:2}.hero-copy{padding:62px 0 80px}.eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(255,176,0,.12);border:1px solid rgba(255,176,0,.35);color:var(--gold2);font-weight:850;font-size:12px;letter-spacing:1.4px;border-radius:999px;padding:9px 13px}.hero h1{font-size:clamp(48px,6.6vw,92px);line-height:.94;letter-spacing:-3px;margin:20px 0 20px;max-width:720px}.hero h1 span{color:var(--gold)}.hero-lead{font-size:20px;color:#c7d0d7;max-width:630px}.trust-row{display:flex;flex-wrap:wrap;gap:14px;margin:28px 0}.trust{display:flex;gap:10px;align-items:center;padding:11px 13px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.025);border-radius:12px;color:#dce2e7;font-size:13px}.trust b{color:var(--gold)}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:13px;padding:14px 18px;font-weight:900;cursor:pointer;transition:.18s transform,.18s opacity}.btn:hover{transform:translateY(-1px)}.btn-primary{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#121212;box-shadow:0 14px 34px rgba(255,176,0,.18)}.btn-dark{background:#161c21;border:1px solid #2a333b;color:#fff}.btn-green{background:linear-gradient(135deg,#35df71,#16ae4b);color:#07120a}.hero-visual{height:560px;position:relative;align-self:end;display:flex;align-items:flex-end;justify-content:center}.hero-visual img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;border-radius:34px 34px 0 0;filter:saturate(.9) contrast(1.05)}.hero-visual:before{content:"";position:absolute;inset:0;z-index:1;border-radius:34px 34px 0 0;background:linear-gradient(90deg,var(--bg) 0%,rgba(7,10,13,.18) 35%,rgba(7,10,13,.03) 65%),linear-gradient(0deg,var(--bg) 0%,transparent 42%)}
.section{padding:76px 0}.section-title{text-align:center;max-width:760px;margin:0 auto 36px}.section-title h2{font-size:clamp(32px,4vw,50px);margin:0 0 12px;letter-spacing:-1.4px}.section-title p{margin:0;color:var(--muted);font-size:17px}.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.plan{position:relative;background:linear-gradient(180deg,#11171c,#0d1216);border:1px solid #242e36;border-radius:20px;padding:26px;box-shadow:var(--shadow)}.plan.best{border-color:rgba(255,176,0,.8);box-shadow:0 22px 80px rgba(255,176,0,.1)}.best-badge{position:absolute;top:-14px;right:24px;background:var(--gold);color:#111;padding:6px 10px;border-radius:999px;font-size:11px;font-weight:950;letter-spacing:.7px}.plan .icon{font-size:26px}.plan h3{font-size:22px;margin:14px 0 2px}.plan .days{color:var(--muted);font-size:13px}.price{margin:16px 0 10px;font-size:52px;line-height:1;font-weight:950;letter-spacing:-2px}.price small{font-size:14px;color:var(--gold);letter-spacing:0;margin-right:5px}.features{list-style:none;padding:8px 0 10px;margin:0}.features li{padding:10px 0;border-bottom:1px solid rgba(255,255,255,.06);font-size:14px}.features li:before{content:"";color:var(--ok);font-weight:900;margin-right:8px}.plan .btn{width:100%;margin-top:14px}
.how{background:#0b1014;border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06)}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.step{background:#11171c;border:1px solid #232c34;border-radius:16px;padding:20px}.step-no{width:34px;height:34px;border-radius:50%;background:var(--gold);color:#111;display:grid;place-items:center;font-weight:950;margin-bottom:13px}.step h4{margin:0 0 7px}.step p{margin:0;color:var(--muted);font-size:14px}.responsible{margin-top:26px;padding:15px 18px;border:1px solid rgba(255,176,0,.25);background:rgba(255,176,0,.06);border-radius:14px;color:#c9d0d5;font-size:13px}.responsible strong{color:var(--gold2)}
.contact-strip{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}.contact-card{background:#10161a;border:1px solid #222c33;border-radius:15px;padding:18px;text-align:center}.contact-card span{display:block;color:var(--muted);font-size:12px;margin-top:4px}footer{padding:34px 0;border-top:1px solid rgba(255,255,255,.07);color:var(--muted);font-size:13px}.foot{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}
.page-shell{min-height:100vh;background:radial-gradient(circle at 50% 10%,rgba(255,176,0,.1),transparent 34%),#070a0d;padding:54px 0}.checkout-card,.success-card{width:min(700px,calc(100% - 32px));margin:auto;background:#10151a;border:1px solid #29323a;border-radius:22px;padding:30px;box-shadow:var(--shadow)}.checkout-card h1,.success-card h1{margin:0 0 4px}.selected-plan{display:flex;justify-content:space-between;gap:16px;align-items:center;margin:24px 0;padding:18px;border-radius:15px;background:rgba(255,176,0,.09);border:1px solid rgba(255,176,0,.38)}.selected-plan strong{font-size:18px}.selected-plan .amount{font-size:27px;color:var(--gold);font-weight:950}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field label{display:block;color:#aeb8c0;font-size:12px;font-weight:800;letter-spacing:.7px;margin-bottom:7px}.field input,.field select,.field textarea{width:100%;background:#151b20;border:1px solid #303941;color:#fff;border-radius:11px;padding:13px 14px;outline:none}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--gold)}.full{grid-column:1/-1}.telegram-connect{padding:18px;background:#0c1510;border:1px solid rgba(37,211,102,.3);border-radius:14px}.telegram-state{font-size:13px;color:#a9b5bd;margin-top:10px}.notice{padding:12px 14px;border-radius:11px;background:#151b20;color:#aeb7bf;font-size:13px}.error{background:rgba(255,93,93,.08);border:1px solid rgba(255,93,93,.3);color:#ffb3b3;padding:12px 14px;border-radius:12px;margin:14px 0}.success-icon{width:72px;height:72px;margin:0 auto 18px;border-radius:50%;display:grid;place-items:center;background:rgba(56,212,106,.14);border:1px solid rgba(56,212,106,.45);color:var(--ok);font-size:35px}.summary{margin:22px 0;background:#151b20;border:1px solid #2a333b;border-radius:14px;padding:16px}.summary-row{display:flex;justify-content:space-between;gap:20px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.06)}.summary-row:last-child{border:0}.summary-row span:first-child{color:var(--muted)}
.admin-body{background:#080c10}.admin-layout{display:grid;grid-template-columns:240px 1fr;min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;background:#0b1014;border-right:1px solid #202830;padding:22px 14px}.sidebar .brand{padding:2px 8px 22px}.side-nav{display:grid;gap:7px}.side-nav a{padding:11px 12px;border-radius:10px;color:#aeb8c0;font-size:14px}.side-nav a:hover,.side-nav a.active{background:#151d23;color:#fff}.side-nav a.active{box-shadow:inset 3px 0 var(--gold)}.admin-main{padding:26px}.admin-top{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:22px}.admin-top h1{margin:0;font-size:28px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.metric{background:#11181e;border:1px solid #222c34;border-radius:15px;padding:18px}.metric small{color:var(--muted);display:block}.metric strong{display:block;font-size:29px;margin-top:5px}.panel{margin-top:18px;background:#0f151a;border:1px solid #222c34;border-radius:16px;padding:18px;overflow:hidden}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}.panel h2{font-size:18px;margin:0}.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse;min-width:760px}.table th,.table td{padding:12px 10px;text-align:left;border-bottom:1px solid rgba(255,255,255,.06);font-size:13px}.table th{color:#8f9ba5;font-size:11px;text-transform:uppercase;letter-spacing:.5px}.badge{display:inline-flex;padding:5px 8px;border-radius:999px;font-size:11px;font-weight:800}.badge.active,.badge.paid,.badge.sent,.badge.renewed{background:rgba(56,212,106,.12);color:#6eed93}.badge.expired,.badge.failed,.badge.removed,.badge.needs_attention{background:rgba(255,93,93,.12);color:#ff8c8c}.badge.pending{background:rgba(255,176,0,.13);color:#ffd064}.filters{display:flex;gap:10px;flex-wrap:wrap}.filters input,.filters select{background:#151c22;border:1px solid #2b353d;color:#fff;border-radius:10px;padding:10px 12px}.small-btn{border:1px solid #303b44;background:#151c22;color:#fff;border-radius:9px;padding:8px 10px;cursor:pointer}.small-btn.gold{border-color:rgba(255,176,0,.45);color:var(--gold)}.small-btn.danger{border-color:rgba(255,93,93,.35);color:#ff9090}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.login-card{width:min(440px,calc(100% - 32px));margin:10vh auto;background:#0f151a;border:1px solid #29323a;border-radius:20px;padding:26px}.login-card .field{margin:14px 0}
@media(max-width:980px){.navlinks{display:none}.hero-grid{grid-template-columns:1fr}.hero-copy{padding-bottom:20px}.hero-visual{height:470px}.plans{grid-template-columns:1fr}.steps{grid-template-columns:1fr 1fr}.cards{grid-template-columns:1fr 1fr}.admin-layout{grid-template-columns:1fr}.sidebar{position:relative;height:auto;border-right:0;border-bottom:1px solid #202830}.side-nav{grid-template-columns:repeat(4,minmax(0,1fr))}.side-nav a{text-align:center}.contact-strip{grid-template-columns:1fr}}
@media(max-width:640px){.wrap{width:min(100% - 22px,var(--max))}.nav{height:66px}.brand-mark{width:36px;height:36px}.hero{min-height:auto}.hero-grid{min-height:auto}.hero-copy{padding-top:40px}.hero h1{font-size:49px;letter-spacing:-2px}.hero-lead{font-size:17px}.hero-visual{height:390px}.section{padding:54px 0}.steps{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.full{grid-column:auto}.checkout-card,.success-card{padding:20px}.cards{grid-template-columns:1fr}.side-nav{grid-template-columns:1fr 1fr}.admin-main{padding:16px}.settings-grid{grid-template-columns:1fr}.selected-plan{align-items:flex-start}.hero-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.hero-actions .btn{width:100%;min-width:0;min-height:58px;padding:13px 8px;font-size:14px;line-height:1.2;text-align:center}}
@media(max-width:380px){.hero-actions{gap:8px}.hero-actions .btn{min-height:56px;padding:12px 6px;font-size:13px}.hero-actions .ui-icon{width:16px;height:16px}}

html{scroll-behavior:smooth}.section{scroll-margin-top:76px}.section-action.active-section{box-shadow:0 14px 34px rgba(255,176,0,.18)}

/* v1.6 - Keep long payment references inside the success card on small screens */
.summary-row > *{min-width:0}
.summary-row strong{text-align:right;overflow-wrap:anywhere;word-break:break-word}
@media(max-width:640px){
  .summary-row{align-items:flex-start;gap:12px}
  .summary-row span:first-child{flex:0 0 auto}
  .summary-row strong{max-width:72%;font-size:14px;line-height:1.45}
}
@media(max-width:380px){
  .summary-row strong{max-width:68%;font-size:13px}
}

/* v1.8 - Active subscription renewal / upgrade confirmation */
.active-subscription-notice{
  padding:16px;
  border:1px solid rgba(255,176,0,.38);
  background:rgba(255,176,0,.075);
  border-radius:14px;
}
.active-subscription-notice[hidden]{display:none!important}
.active-subscription-kicker{
  color:var(--gold2);
  font-size:11px;
  font-weight:900;
  letter-spacing:1px;
  margin-bottom:6px;
}
.active-subscription-notice strong{display:block;font-size:16px;line-height:1.4}
.active-subscription-notice p{margin:7px 0 13px;color:#c0c9d0;font-size:13px;line-height:1.55}
.active-subscription-change{padding:10px 13px;font-size:13px}
@media(max-width:640px){
  .active-subscription-change{width:100%}
}


/* v1.9 - Prefill saved contact details for verified returning Telegram users */
.saved-profile-notice{
  padding:10px 12px;
  border:1px solid rgba(56,212,106,.28);
  background:rgba(56,212,106,.07);
  color:#a9e9bc;
  border-radius:11px;
  font-size:12px;
  line-height:1.5;
}
.saved-profile-notice[hidden]{display:none!important}


/* v1.10 - Fully responsive payment reference on every screen size */
.success-card{overflow:hidden}
.summary-reference .payment-reference{
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:break-all;
  white-space:normal;
}
@media(max-width:640px){
  .summary-reference{
    display:block;
  }
  .summary-reference > span{
    display:block;
    margin-bottom:6px;
  }
  .summary-reference .payment-reference{
    display:block;
    width:100%;
    max-width:100%;
    text-align:left;
    font-size:13px;
    line-height:1.45;
    letter-spacing:-.1px;
  }
}
@media(max-width:380px){
  .summary-reference .payment-reference{
    font-size:12px;
  }
}

/* v1.11 - Admin login, responsive navigation, transaction history and live activity notifications */
.admin-login-body{
  min-height:100vh;
  position:relative;
  overflow-x:hidden;
  background:#05080a;
}
.admin-login-body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  background-image:url('../images/hero-football.webp');
  background-size:cover;
  background-position:center 35%;
  filter:saturate(.9) contrast(1.06);
  transform:scale(1.015);
}
.admin-login-body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  background:
    radial-gradient(circle at 72% 30%,rgba(255,176,0,.16),transparent 34%),
    linear-gradient(90deg,rgba(4,7,9,.96) 0%,rgba(4,7,9,.84) 42%,rgba(4,7,9,.68) 100%);
}
.admin-login-shell{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:28px 16px}
.admin-login-card{
  width:min(460px,100%);
  margin:0;
  background:rgba(12,17,21,.88);
  border:1px solid rgba(255,255,255,.13);
  box-shadow:0 28px 90px rgba(0,0,0,.5);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.admin-login-brand{margin-bottom:24px}
.admin-login-heading{margin:0 0 22px}
.admin-login-heading h1{margin:14px 0 0;font-size:34px;letter-spacing:-1px}
.admin-login-submit{margin-top:8px}
.password-field-wrap{position:relative}
.password-field-wrap input{padding-right:52px}
.password-toggle{
  position:absolute;right:7px;top:50%;transform:translateY(-50%);
  width:38px;height:38px;border:0;border-radius:9px;
  display:grid;place-items:center;background:transparent;color:#dbe2e7;cursor:pointer;
}
.password-toggle:hover,.password-toggle:focus-visible{background:rgba(255,255,255,.07);outline:none}
.password-eye{font-size:17px;line-height:1}

.sidebar-mobile-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.sidebar-mobile-head .brand{min-width:0}
.side-nav a{display:flex;align-items:center;gap:10px}
.side-icon{width:20px;flex:0 0 20px;text-align:center;font-size:14px;opacity:.9}
.sidebar-close,.admin-menu-toggle{
  border:1px solid #29343d;background:#11181e;color:#fff;cursor:pointer;
  border-radius:11px;
}
.sidebar-close{display:none;width:38px;height:38px;font-size:25px;line-height:1;place-items:center}
.admin-menu-toggle{display:none;width:44px;height:44px;flex:0 0 44px;padding:11px;align-content:center;justify-items:stretch;gap:4px}
.admin-menu-toggle span{height:2px;border-radius:999px;background:#f4f6f7;display:block}
.sidebar-overlay{display:none;border:0;padding:0;background:rgba(0,0,0,.58)}
.admin-heading-wrap{display:flex;align-items:center;gap:13px;min-width:0}
.admin-heading{min-width:0}
.admin-heading h1{overflow-wrap:anywhere}
.admin-top-actions{display:flex;align-items:center;gap:10px;flex:0 0 auto}

.notification-center{position:relative}
.notification-bell{
  width:44px;height:44px;border:1px solid #2a353e;background:#11181e;color:#fff;border-radius:12px;
  display:grid;place-items:center;cursor:pointer;position:relative;font-size:18px;
}
.notification-bell:hover,.notification-bell[aria-expanded="true"]{border-color:rgba(255,176,0,.55);background:#161d22}
.notification-badge{
  position:absolute;right:-5px;top:-6px;min-width:21px;height:21px;padding:0 5px;border-radius:999px;
  display:grid;place-items:center;background:#ff4f59;color:#fff;border:2px solid #080c10;font-size:10px;font-weight:900;
}
.notification-dropdown{
  position:absolute;right:0;top:54px;width:min(390px,calc(100vw - 34px));max-height:min(620px,72vh);
  background:#0f151a;border:1px solid #29343d;border-radius:16px;box-shadow:0 24px 80px rgba(0,0,0,.5);z-index:90;overflow:hidden;
}
.notification-dropdown[hidden]{display:none!important}
.notification-dropdown-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 15px 12px;border-bottom:1px solid rgba(255,255,255,.07)}
.notification-dropdown-head strong{display:block;font-size:14px}
.notification-dropdown-head small{display:block;color:var(--muted);font-size:11px;margin-top:2px}
.notification-sound-toggle{border:1px solid #303b44;background:#151c22;color:#dce3e7;border-radius:9px;padding:7px 9px;font-size:11px;cursor:pointer;white-space:nowrap}
.notification-list{max-height:440px;overflow:auto;overscroll-behavior:contain}
.notification-item{display:grid;grid-template-columns:38px 1fr;gap:10px;padding:13px 14px;border-bottom:1px solid rgba(255,255,255,.055)}
.notification-item:last-child{border-bottom:0}
.notification-item.success{background:linear-gradient(90deg,rgba(56,212,106,.045),transparent 56%)}
.notification-item.danger{background:linear-gradient(90deg,rgba(255,93,93,.05),transparent 56%)}
.notification-item-icon{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:#161d23;font-size:16px}
.notification-item-copy{min-width:0}
.notification-item-copy strong{display:block;font-size:12px;color:#f3f5f6;margin-bottom:2px}
.notification-item-copy p{margin:0;color:#b3bdc5;font-size:11px;line-height:1.45;overflow-wrap:anywhere}
.notification-item-copy small{display:block;color:#6f7d88;font-size:10px;margin-top:5px}
.notification-empty{padding:24px 16px;text-align:center;color:var(--muted);font-size:12px}
.notification-view-all{display:block;text-align:center;padding:12px 14px;border-top:1px solid rgba(255,255,255,.07);color:var(--gold);font-size:12px;font-weight:850;background:#0c1216}

.admin-panel-subtitle{margin:3px 0 0;font-size:12px}
.sales-panel{overflow:visible}
.sales-cards{grid-template-columns:repeat(4,minmax(0,1fr))}
.embedded-sales-cards{margin-top:2px}
.sales-metric{display:block;transition:border-color .18s,transform .18s,background .18s}
.sales-metric:hover{transform:translateY(-1px);border-color:rgba(255,176,0,.4)}
.sales-metric.selected{border-color:rgba(255,176,0,.75);background:linear-gradient(180deg,rgba(255,176,0,.075),#11181e)}
.sales-metric strong{font-size:25px}
.sales-metric span{display:block;color:#7f8d97;font-size:11px;margin-top:7px}
.transaction-ref{max-width:260px;overflow-wrap:anywhere;word-break:break-word}

.activity-live-pill{display:inline-flex;align-items:center;gap:6px;color:#72e799;font-size:11px;font-weight:800;background:rgba(56,212,106,.08);border:1px solid rgba(56,212,106,.2);padding:7px 10px;border-radius:999px;white-space:nowrap}
.activity-timeline{display:grid}
.activity-row{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;padding:14px 2px;border-bottom:1px solid rgba(255,255,255,.06)}
.activity-row:last-child{border-bottom:0}
.activity-icon{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:#151d23;border:1px solid #222d35}
.activity-row.success .activity-icon{background:rgba(56,212,106,.08);border-color:rgba(56,212,106,.18)}
.activity-row.danger .activity-icon{background:rgba(255,93,93,.08);border-color:rgba(255,93,93,.18)}
.activity-copy{min-width:0}
.activity-copy strong{font-size:13px}
.activity-copy p{margin:2px 0 0;color:#aeb9c1;font-size:12px;overflow-wrap:anywhere}
.activity-copy small{display:block;color:#6f7c86;font-size:10px;margin-top:5px}
.activity-timeline.compact .activity-row{padding:10px 2px;grid-template-columns:38px minmax(0,1fr)}
.activity-timeline.compact .activity-icon{width:34px;height:34px;border-radius:10px;font-size:14px}

@media(max-width:1180px){
  .sales-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:980px){
  .admin-layout{display:block;min-height:100vh}
  .admin-main{padding:18px;min-width:0}
  .sidebar{
    position:fixed;left:0;top:0;bottom:0;height:100dvh;width:min(310px,88vw);max-width:calc(100vw - 44px);
    z-index:100;border-right:1px solid #253039;border-bottom:0;padding:17px 13px 22px;overflow-y:auto;
    transform:translateX(-104%);transition:transform .22s ease;box-shadow:18px 0 70px rgba(0,0,0,.45);
  }
  .sidebar.is-open{transform:translateX(0)}
  .sidebar .brand{padding:2px 5px 20px}
  .sidebar-close{display:grid}
  .side-nav{grid-template-columns:1fr;gap:6px}
  .side-nav a{text-align:left;padding:12px 11px}
  .admin-menu-toggle{display:grid}
  .sidebar-overlay{position:fixed;inset:0;z-index:95}
  .admin-nav-open .sidebar-overlay{display:block}
  .admin-nav-open{overflow:hidden}
  .admin-top{position:sticky;top:0;z-index:50;margin:-18px -18px 20px;padding:13px 18px;background:rgba(8,12,16,.94);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.07)}
  .admin-top h1{font-size:25px}
  .admin-top .muted{font-size:11px}
}

@media(max-width:640px){
  .admin-main{padding:12px}
  .admin-top{margin:-12px -12px 16px;padding:10px 12px}
  .admin-heading-wrap{gap:9px}
  .admin-menu-toggle,.notification-bell{width:42px;height:42px;flex-basis:42px}
  .admin-top h1{font-size:21px;line-height:1.1}
  .admin-heading .muted{max-width:48vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .notification-dropdown{position:fixed;top:68px;right:10px;left:10px;width:auto;max-height:calc(100dvh - 84px)}
  .notification-list{max-height:calc(100dvh - 190px)}
  .sales-cards{grid-template-columns:1fr}
  .sales-metric strong{font-size:24px}
  .panel-head{align-items:flex-start;flex-wrap:wrap}
  .activity-live-pill{white-space:normal}
  .admin-login-shell{padding:18px 12px}
  .admin-login-card{padding:22px 18px}
  .admin-login-heading h1{font-size:30px}
  .admin-login-body::after{background:linear-gradient(180deg,rgba(4,7,9,.84),rgba(4,7,9,.94))}
}

@media(max-width:380px){
  .admin-top{gap:8px}
  .admin-heading .muted{display:none}
  .admin-top h1{font-size:19px}
  .admin-menu-toggle,.notification-bell{width:40px;height:40px;flex-basis:40px}
  .sidebar{width:min(292px,90vw);max-width:calc(100vw - 32px)}
}


/* v1.12 - Admin login eye visibility + mobile background + Telegram privacy */
.admin-login-body{
  min-height:100vh;
  min-height:100dvh;
  background-color:#05080a;
  background-image:
    radial-gradient(circle at 72% 28%,rgba(255,176,0,.13),transparent 34%),
    linear-gradient(90deg,rgba(4,7,9,.93) 0%,rgba(4,7,9,.78) 48%,rgba(4,7,9,.58) 100%),
    url('../images/hero-football.webp');
  background-size:cover,cover,cover;
  background-position:center,center,center 35%;
  background-repeat:no-repeat,no-repeat,no-repeat;
  background-attachment:scroll,scroll,scroll;
}
.admin-login-body::before,.admin-login-body::after{display:none!important}
.password-toggle{
  right:8px;
  width:40px;
  height:40px;
  border:1px solid rgba(255,176,0,.55);
  background:rgba(255,176,0,.16);
  color:#f0a500;
  z-index:3;
  padding:8px;
}
.password-toggle:hover,.password-toggle:focus-visible{
  background:rgba(255,176,0,.26);
  border-color:rgba(255,176,0,.88);
  outline:none;
}
.password-eye-icon{width:22px;height:22px;display:block;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.password-eye-icon[hidden]{display:none!important}

@media(max-width:640px){
  .admin-login-body{
    background-image:
      radial-gradient(circle at 72% 24%,rgba(255,176,0,.12),transparent 38%),
      linear-gradient(180deg,rgba(4,7,9,.58) 0%,rgba(4,7,9,.72) 46%,rgba(4,7,9,.88) 100%),
      url('../images/hero-football.webp');
    background-position:center,center,58% center;
    background-size:cover,cover,cover;
  }
  .admin-login-shell{align-items:center;padding:22px 12px}
  .admin-login-card{background:rgba(12,17,21,.84);backdrop-filter:blur(13px);-webkit-backdrop-filter:blur(13px)}
  .password-toggle{width:42px;height:42px;right:6px}
}

@media(max-width:380px){
  .admin-login-body{background-position:center,center,60% center}
  .admin-login-card{padding:20px 15px}
  .password-field-wrap input{padding-right:55px}
}

/* v1.13 - Admin-managed branding + real SVG interface icons */
.ui-icon{width:1.15em;height:1.15em;display:inline-block;vertical-align:-.18em;flex:0 0 auto;color:currentColor}
.brand-svg{width:23px;height:23px;display:block;color:#111}
.brand-mark.brand-mark-image{overflow:hidden;padding:0;background:#fff}
.brand-mark.brand-mark-image img{width:100%;height:100%;object-fit:cover;display:block}
.brand-logo-block{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:3px;min-width:0}
.brand-logo{display:block;max-width:190px;max-height:48px;width:auto;height:auto;object-fit:contain;object-position:left center}
.brand-logo-block small{display:block;color:var(--muted);font-weight:700;font-size:9px;letter-spacing:1.35px;line-height:1.2}
.sidebar .brand-logo{max-width:176px;max-height:44px}
.admin-login-brand .brand-logo{max-width:230px;max-height:58px}

.eyebrow .ui-icon{width:15px;height:15px}
.trust .ui-icon{width:17px;height:17px;color:var(--gold)}
.plan .icon{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:rgba(255,176,0,.11);border:1px solid rgba(255,176,0,.22);color:var(--gold)}
.plan .icon .ui-icon{width:22px;height:22px}
.features li{display:flex;align-items:flex-start;gap:8px}
.features li:before{content:"";width:15px;height:15px;flex:0 0 15px;margin:2px 0 0;background-repeat:no-repeat;background-position:center;background-size:15px 15px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2338d46a' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m20 6-11 11-5-5'/%3E%3C/svg%3E")}
.contact-card{display:flex;flex-direction:column;align-items:center}
.contact-card strong{font-size:14px}
.contact-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;margin:0 auto 8px;background:rgba(255,176,0,.08);border:1px solid rgba(255,176,0,.2);color:var(--gold)}
.contact-icon .ui-icon{width:20px;height:20px}
.back-link{display:inline-flex;align-items:center;gap:6px}
.back-link .ui-icon{width:17px;height:17px}
.saved-profile-notice{display:flex;align-items:flex-start;gap:8px}
.saved-profile-notice .ui-icon{width:17px;height:17px;margin-top:2px;flex:0 0 17px}
#telegram-connect-button .ui-icon,.success-card .btn .ui-icon{width:18px;height:18px}
#telegram-connect-button.is-connected{background:rgba(56,212,106,.16);border:1px solid rgba(56,212,106,.42);color:#a7edbb;box-shadow:none}
.success-icon .ui-icon{width:37px;height:37px}

.side-icon{display:grid;place-items:center}
.side-icon .ui-icon{width:18px;height:18px}
.sidebar-close{font-size:0}
.sidebar-close .ui-icon{width:20px;height:20px}
.notification-bell{font-size:0}
.notification-bell>.ui-icon{width:20px;height:20px}
.notification-sound-toggle{display:inline-flex;align-items:center;gap:6px}
.notification-sound-toggle .ui-icon{width:15px;height:15px}
.notification-item-icon .ui-icon{width:18px;height:18px}
.activity-icon .ui-icon{width:19px;height:19px}
.activity-live-pill .ui-icon{width:14px;height:14px}

.branding-settings-form{align-items:start}
.branding-upload-card{background:#11181e;border:1px solid #26313a;border-radius:15px;padding:16px;display:grid;grid-template-columns:180px minmax(0,1fr);gap:18px;align-items:center}
.branding-preview{min-height:118px;border-radius:13px;border:1px dashed #34414b;background:#0b1014;display:grid;place-items:center;padding:14px;overflow:hidden}
.branding-logo-preview img{max-width:100%;max-height:86px;object-fit:contain}
.branding-icon-preview img{width:86px;height:86px;object-fit:cover;border-radius:20px}
.branding-fallback{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#86949f;font-size:11px;text-align:center}
.branding-fallback .ui-icon{width:34px;height:34px;color:var(--gold)}
.branding-fallback.compact .ui-icon{width:42px;height:42px}
.file-picker{position:relative;display:flex!important;align-items:center;justify-content:center;gap:8px;width:100%;min-height:46px;padding:11px 14px;border:1px solid rgba(255,176,0,.38);background:rgba(255,176,0,.07);border-radius:11px;color:var(--gold2)!important;cursor:pointer;text-transform:none!important;letter-spacing:0!important;font-size:13px!important}
.file-picker:hover{background:rgba(255,176,0,.12);border-color:rgba(255,176,0,.65)}
.file-picker .ui-icon{width:18px;height:18px}
.file-picker input{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;padding:0!important;border:0!important}
.upload-help{margin:8px 0 0;color:#7f8d97;font-size:11px;line-height:1.5}
.remove-branding{display:flex!important;align-items:center;gap:7px;margin-top:10px!important;color:#c2cbd1!important;font-size:12px!important;letter-spacing:0!important;text-transform:none!important;font-weight:650!important}
.remove-branding input{width:auto!important;margin:0}

@media(max-width:760px){
  .brand-logo{max-width:160px;max-height:42px}
  .branding-upload-card{grid-template-columns:1fr}
  .branding-preview{min-height:104px}
}
@media(max-width:420px){
  .brand-logo{max-width:145px;max-height:38px}
  .sidebar .brand-logo{max-width:155px}
  .admin-login-brand .brand-logo{max-width:190px;max-height:50px}
}

/* v1.17 administrator management */
.admin-create-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:920px}
.admin-create-actions{grid-column:1/-1;display:flex;justify-content:flex-start;margin-top:2px}
.admin-success-notice{border:1px solid rgba(56,212,106,.28);background:rgba(56,212,106,.08);color:#94efad;margin-bottom:14px}
.admin-current-badge{margin-left:8px;vertical-align:middle}
.admin-user-actions{display:flex;align-items:flex-start;gap:8px;flex-wrap:wrap}
.admin-user-actions form{margin:0}
.admin-user-actions .small-btn{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.admin-user-actions .ui-icon{width:15px;height:15px}
.admin-password-details{position:relative}
.admin-password-details>summary{list-style:none;user-select:none}
.admin-password-details>summary::-webkit-details-marker{display:none}
.admin-password-form{position:absolute;z-index:30;right:0;top:calc(100% + 8px);width:min(320px,80vw);padding:12px;background:#11181e;border:1px solid #2a353e;border-radius:12px;box-shadow:0 20px 55px rgba(0,0,0,.45);display:grid;gap:9px}
.admin-password-form input{width:100%;background:#151c22;border:1px solid #303b44;color:#fff;border-radius:9px;padding:10px 11px;outline:none}
.admin-password-form input:focus{border-color:var(--gold)}
.admin-users-table td{vertical-align:top}
@media(max-width:700px){
  .admin-create-form{grid-template-columns:1fr}
  .admin-create-actions{grid-column:auto}
  .admin-create-actions .btn{width:100%}
  .admin-password-form{position:fixed;left:12px;right:12px;top:auto;bottom:16px;width:auto;z-index:130}
}


/* v1.19 - Keep the admin header visible on desktop while page content scrolls */
@media(min-width:981px){
  .admin-top{
    position:sticky;
    top:0;
    z-index:60;
    margin:-26px -26px 22px;
    padding:20px 26px 16px;
    background:rgba(8,12,16,.94);
    -webkit-backdrop-filter:blur(14px);
    backdrop-filter:blur(14px);
    border-bottom:1px solid rgba(255,255,255,.07);
    box-shadow:0 10px 28px rgba(0,0,0,.14);
  }
}

/* v1.21 - Buy Data + installable web app */
.nav-install-button{
  display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border-radius:11px;
  border:1px solid rgba(255,176,0,.34);background:rgba(255,176,0,.06);color:var(--gold2);
  font-weight:800;cursor:pointer;font-size:13px;
}
.nav-install-button:hover{background:rgba(255,176,0,.11);border-color:rgba(255,176,0,.55)}
.nav-install-button .ui-icon{width:16px;height:16px}
.hero-actions .ui-icon{width:18px;height:18px}
.install-help-modal[hidden]{display:none!important}
.install-help-modal{position:fixed;inset:0;z-index:500;display:grid;place-items:center;padding:18px}
.install-help-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(5px)}
.install-help-card{
  position:relative;z-index:1;width:min(420px,100%);padding:26px;border-radius:20px;
  background:#10161b;border:1px solid #2a353d;box-shadow:0 28px 100px rgba(0,0,0,.62);text-align:center
}
.install-help-icon{width:58px;height:58px;margin:0 auto 13px;border-radius:16px;display:grid;place-items:center;
  background:rgba(255,176,0,.1);border:1px solid rgba(255,176,0,.28);color:var(--gold)}
.install-help-icon .ui-icon{width:27px;height:27px}
.install-help-card h2{margin:0 0 8px;font-size:24px}
.install-help-card p{margin:0 0 20px;color:#aeb8c0;line-height:1.6}
.install-help-close{position:absolute;right:10px;top:10px;width:38px;height:38px;border-radius:10px;border:1px solid #2b343c;background:#151c22;color:#fff;display:grid;place-items:center;cursor:pointer}
.install-help-close .ui-icon{width:17px;height:17px}
.install-modal-open{overflow:hidden}
@media(max-width:640px){
  .install-help-card{padding:24px 18px 20px}
  .install-help-card .btn{width:100%}
}

/* v1.23 security-status helper text */
.security-status-list .summary-row > span {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}
.security-help {
  display: block;
  color: var(--muted, #8fa0b3);
  font-size: .78rem;
  line-height: 1.45;
  font-weight: 500;
  max-width: 760px;
}
@media (max-width: 640px) {
  .security-status-list .summary-row {
    align-items: flex-start;
    gap: 10px;
  }
  .security-status-list .summary-row > strong {
    white-space: nowrap;
  }
}

/* v1.25 - Google SEO, public content hub and search-friendly landing pages */
.seo-intro{background:linear-gradient(180deg,#080c10,#0a0f13)}
.seo-copy-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.seo-copy-card{background:#10161b;border:1px solid #253039;border-radius:18px;padding:22px}
.seo-copy-card h3{margin:0 0 9px;font-size:19px}
.seo-copy-card p{margin:0 0 16px;color:#aab5bd;font-size:14px;line-height:1.7}
.text-link{display:inline-flex;align-items:center;gap:7px;color:var(--gold2);font-weight:850;font-size:13px}
.text-link .ui-icon{width:16px;height:16px}
.faq-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:980px;margin:auto}
.faq-grid details{background:#10161b;border:1px solid #26313a;border-radius:14px;padding:16px 18px}
.faq-grid summary{cursor:pointer;font-weight:850;color:#f4f6f7}
.faq-grid p{color:#aab5bd;font-size:14px;line-height:1.65;margin:11px 0 0}

.content-hero{padding:68px 0 48px;background:radial-gradient(circle at 70% 20%,rgba(255,176,0,.1),transparent 34%),linear-gradient(180deg,#080c10,#070a0d);border-bottom:1px solid rgba(255,255,255,.07)}
.content-hero-inner{max-width:920px}
.content-hero h1{font-size:clamp(40px,6vw,72px);line-height:1;letter-spacing:-2.5px;margin:18px 0 16px;max-width:900px}
.content-hero p{font-size:19px;color:#bec8cf;max-width:780px;margin:0}
.breadcrumb{display:flex;align-items:center;gap:8px;color:#73818c;font-size:12px;margin-bottom:16px;flex-wrap:wrap}
.breadcrumb a{color:#aab5bd}
.content-section{padding:58px 0 82px}
.content-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:28px;align-items:start}
.article-copy{min-width:0;background:#0e1419;border:1px solid #222d35;border-radius:20px;padding:30px;box-shadow:var(--shadow)}
.article-copy h2{font-size:28px;letter-spacing:-.6px;margin:34px 0 10px}
.article-copy h2:first-child{margin-top:0}
.article-copy h3{font-size:19px;margin:22px 0 7px}
.article-copy p,.article-copy li{color:#b8c2c9;font-size:15px;line-height:1.78}
.article-copy a{color:var(--gold2);text-decoration:underline;text-underline-offset:3px}
.article-copy .btn{text-decoration:none;color:#121212}
.article-steps{padding-left:22px}
.article-steps li{margin-bottom:12px}
.content-aside{position:sticky;top:96px}
.content-card{background:#10171c;border:1px solid #26313a;border-radius:17px;padding:20px;display:grid;gap:3px}
.content-card h3{margin:0 0 9px;font-size:17px}
.content-card a{display:block;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.06);font-size:13px;color:#c5cdd3}
.content-card a:last-child{border-bottom:0}
.content-card a:hover{color:var(--gold2)}
.responsible-callout,.article-note{padding:15px 17px;border:1px solid rgba(255,176,0,.28);background:rgba(255,176,0,.07);border-radius:14px;color:#d6dde2!important}
.formula-box{padding:18px;border-radius:14px;background:rgba(56,212,106,.07);border:1px solid rgba(56,212,106,.25);font-weight:900;color:#8be5a7;margin:14px 0 18px}
.article-cta{margin-top:32px;padding:22px;border-radius:17px;border:1px solid rgba(255,176,0,.3);background:linear-gradient(135deg,rgba(255,176,0,.08),rgba(255,176,0,.025))}
.article-cta h3{margin-top:0}
.article-cta p{margin-bottom:15px}
.guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.content-wide{grid-column:1/-1}
.guide-card{background:#10161b;border:1px solid #253039;border-radius:18px;padding:24px}
.guide-card h2{font-size:22px;margin:12px 0 8px;letter-spacing:-.4px}
.guide-card p{color:#aeb9c1;font-size:14px;line-height:1.7;min-height:72px}
.guide-card .btn{margin-top:8px}
.guide-icon{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:rgba(255,176,0,.1);color:var(--gold2);border:1px solid rgba(255,176,0,.25)}
.guide-icon .ui-icon{width:22px;height:22px}

.seo-settings-heading{margin-top:6px;padding-top:18px;border-top:1px solid rgba(255,255,255,.07)}
.seo-search-preview{background:#fff;color:#202124;border-radius:14px;padding:18px;border:1px solid #d7dce0;max-width:760px}
.seo-search-preview small{display:block;color:#5f6368;margin-bottom:5px}
.seo-search-preview strong{display:block;color:#1a0dab;font-size:20px;line-height:1.3;font-weight:500}
.seo-search-preview span{display:block;color:#188038;font-size:13px;margin:4px 0}
.seo-search-preview p{margin:0;color:#4d5156;font-size:13px;line-height:1.5}

@media(max-width:980px){
  .seo-copy-grid{grid-template-columns:1fr}
  .content-layout{grid-template-columns:1fr}
  .content-aside{position:static}
  .guide-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .faq-grid{grid-template-columns:1fr}
  .content-hero{padding:48px 0 34px}
  .content-hero h1{font-size:40px;letter-spacing:-1.5px}
  .content-hero p{font-size:16px}
  .content-section{padding:34px 0 58px}
  .article-copy{padding:20px}
  .article-copy h2{font-size:24px}
  .guide-grid{grid-template-columns:1fr}
  .guide-card p{min-height:0}
  .foot span:last-child{line-height:1.9}
}


/* v1.26 - Telegram channel post composer */
.channel-post-form{display:grid;gap:16px;margin-top:8px}.channel-post-form .field textarea{min-height:168px;resize:vertical}.channel-post-counter{text-align:right;color:var(--muted);font-size:12px;margin-top:6px}.channel-button-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.channel-button-option{display:flex;align-items:flex-start;gap:10px;background:#151c22;border:1px solid #2b353d;border-radius:12px;padding:13px;cursor:pointer}.channel-button-option input{margin-top:3px;accent-color:var(--gold)}.channel-button-option span{display:grid;gap:2px}.channel-button-option strong{font-size:13px}.channel-button-option small{color:var(--muted);font-size:11px}.channel-post-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}@media(max-width:760px){.channel-button-options{grid-template-columns:1fr}.channel-post-actions .btn{width:100%}}

/* v1.27 Telegram channel post media upload */
.upload-drop{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px dashed #355069;background:#121920;border-radius:14px;cursor:pointer;transition:border-color .18s ease,background .18s ease,transform .18s ease}.upload-drop:hover{border-color:#d6a62a;background:#151d25;transform:translateY(-1px)}.upload-drop-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:rgba(214,166,42,.14);color:var(--gold);flex:0 0 46px}.upload-drop-icon .ui-icon{width:22px;height:22px}.upload-drop-text{display:grid;gap:4px}.upload-drop-text strong{font-size:14px}.upload-drop-text small{color:var(--muted);font-size:12px;line-height:1.45}.visually-hidden-file{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.channel-upload-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:8px;font-size:12px}.button-label-with-icon{display:flex;align-items:center;gap:8px}.button-label-icon{display:inline-grid;place-items:center;width:18px;height:18px;color:var(--gold)}.button-label-icon .ui-icon{width:16px;height:16px}@media(max-width:760px){.channel-upload-meta{align-items:flex-start}.upload-drop{align-items:flex-start}.upload-drop-icon{margin-top:2px}}

/* v1.28 Telegram preview, scheduling and templates */
.telegram-composer-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:22px;align-items:start}.telegram-composer-main{display:grid;gap:16px;min-width:0}.telegram-preview-card{position:sticky;top:96px;background:linear-gradient(180deg,#101922,#0d141a);border:1px solid #2a3945;border-radius:18px;padding:16px;box-shadow:0 18px 50px rgba(0,0,0,.22)}.telegram-preview-head{display:flex;align-items:center;gap:10px;padding-bottom:13px;border-bottom:1px solid rgba(255,255,255,.07)}.telegram-preview-head>div:last-child{display:grid;gap:2px}.telegram-preview-head small{font-size:11px;color:var(--muted)}.telegram-preview-badge{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#229ED9;color:#fff}.telegram-preview-badge .ui-icon{width:18px;height:18px}.telegram-preview-media{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:14px}.telegram-preview-media img{width:100%;aspect-ratio:1.35/1;object-fit:cover;border-radius:10px;background:#0b0f13}.telegram-preview-media img:only-child{grid-column:1/-1;aspect-ratio:16/10}.telegram-preview-message{margin-top:14px;background:#18232d;border-radius:14px;padding:13px 14px;color:#f3f7fa;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.55}.telegram-preview-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:8px}.telegram-preview-button{display:flex;align-items:center;justify-content:center;text-align:center;min-height:40px;padding:9px 10px;border-radius:10px;background:#1f3544;border:1px solid #335269;color:#dcefff;font-size:12px;font-weight:850}.telegram-preview-buttons .telegram-preview-button:nth-child(3){grid-column:1/-1}.telegram-preview-note{margin-top:10px;color:#70808b;font-size:10px;line-height:1.45}.telegram-image-preview{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:10px}.telegram-image-thumb{position:relative;border-radius:11px;overflow:hidden;border:1px solid #2b3842;background:#0b1014}.telegram-image-thumb img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover}.telegram-schedule-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.telegram-schedule-row .field{min-width:0}.telegram-post-action-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.telegram-post-action-grid .btn{width:100%}.telegram-post-action-grid .ui-icon{width:17px;height:17px}.telegram-template-list,.telegram-scheduled-list{display:grid;gap:10px}.telegram-template-row,.telegram-scheduled-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 15px;background:#11181e;border:1px solid #26323b;border-radius:13px}.telegram-template-row>div,.telegram-scheduled-main{display:grid;gap:4px;min-width:0}.telegram-template-row small,.telegram-scheduled-main small{color:var(--muted);font-size:11px;overflow-wrap:anywhere}.telegram-scheduled-main p{margin:0;color:#c2cbd2;font-size:13px;line-height:1.5}.telegram-scheduled-title{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.status-pill{display:inline-flex;align-items:center;justify-content:center;min-height:24px;padding:3px 8px;border-radius:999px;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.4px;background:#202b33;color:#c6d0d7}.status-pending{background:rgba(255,176,0,.12);color:#ffd46f;border:1px solid rgba(255,176,0,.25)}.status-sending{background:rgba(34,158,217,.12);color:#6fc8f1;border:1px solid rgba(34,158,217,.25)}.status-sent{background:rgba(56,212,106,.12);color:#79e49a;border:1px solid rgba(56,212,106,.25)}.status-failed{background:rgba(255,92,92,.12);color:#ff9898;border:1px solid rgba(255,92,92,.25)}.status-canceled{background:rgba(255,255,255,.06);color:#a8b3bb;border:1px solid rgba(255,255,255,.1)}.scheduled-error{color:#ff9898!important}.btn-danger{background:#37191d;border:1px solid #6a2e35;color:#ffb2b9}.btn-small{padding:9px 12px;border-radius:10px;font-size:12px}.empty-state{padding:22px;border:1px dashed #31404a;border-radius:13px;color:var(--muted);text-align:center;background:#0f151a}.channel-post-form select{width:100%;background:#0e1419;border:1px solid #2b353d;color:#fff;border-radius:12px;padding:13px 14px}.channel-post-form input[type=datetime-local]{color-scheme:dark}
@media(max-width:1050px){.telegram-composer-grid{grid-template-columns:1fr}.telegram-preview-card{position:static}.telegram-image-preview{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:760px){.telegram-schedule-row,.telegram-post-action-grid{grid-template-columns:1fr}.telegram-image-preview{grid-template-columns:repeat(3,minmax(0,1fr))}.telegram-template-row,.telegram-scheduled-row{align-items:flex-start;flex-direction:column}.telegram-template-row form,.telegram-scheduled-row form{width:100%}.telegram-template-row .btn,.telegram-scheduled-row .btn{width:100%}.telegram-preview-card{padding:14px}}

/* v1.29 Telegram native Start Bot profile preview */
.telegram-bot-profile-preview{max-width:640px;margin:16px 0;padding:18px 20px;border:1px solid #2b353d;border-radius:16px;background:#151c22}.telegram-profile-preview-title{font-size:17px;font-weight:800;margin-bottom:14px}.telegram-profile-preview-copy{font-size:14px;line-height:1.55;color:#eef2f5}.telegram-profile-description-check{margin-top:14px;padding:14px 16px;border-radius:12px;background:#11171c;border:1px solid #28323a;color:#dfe6eb;line-height:1.55;white-space:normal}@media(max-width:760px){.telegram-bot-profile-preview{max-width:none}.telegram-bot-profile-preview+.channel-post-actions form,.telegram-bot-profile-preview~.channel-post-actions form{width:100%}.telegram-bot-profile-preview~.channel-post-actions .btn{width:100%}}

/* v1.30 granular admin page permissions + frontend short videos */
.admin-permissions-form{display:grid;gap:12px;min-width:min(620px,80vw);padding-top:10px}.admin-permission-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.admin-permission-option{display:grid;grid-template-columns:auto 28px 1fr;align-items:start;gap:9px;padding:11px 12px;border:1px solid #2a353d;border-radius:12px;background:#12191f;cursor:pointer}.admin-permission-option input{margin-top:3px;accent-color:var(--gold)}.admin-permission-icon{display:grid;place-items:center;color:var(--gold)}.admin-permission-icon .ui-icon{width:17px;height:17px}.admin-permission-option span:last-child{display:grid;gap:2px}.admin-permission-option strong{font-size:12px}.admin-permission-option small{font-size:10px;color:var(--muted);line-height:1.35}.admin-permissions-form>input[type=password]{width:100%;background:#0e1419;border:1px solid #2b353d;color:#fff;border-radius:10px;padding:11px 12px}
.video-upload-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.video-upload-form .full{grid-column:1/-1}.admin-video-preview{display:block;width:min(520px,100%);max-height:420px;margin-top:12px;border-radius:14px;background:#070a0d;border:1px solid #26323a}.admin-video-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.admin-video-card{overflow:hidden;border:1px solid #27333c;border-radius:16px;background:#10171d}.admin-video-card>video{display:block;width:100%;aspect-ratio:16/9;background:#050709;object-fit:contain}.admin-video-card-body{display:grid;gap:12px;padding:14px}.admin-video-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.admin-video-settings-form{display:grid;grid-template-columns:minmax(0,1fr) 110px;gap:10px;align-items:end}.admin-video-settings-form .video-enabled-toggle{grid-column:1/-1;display:flex;align-items:center;gap:8px;color:#cbd4da;font-size:12px}.admin-video-settings-form .small-btn{justify-self:start}.frontend-videos-section{background:linear-gradient(180deg,rgba(255,176,0,.025),rgba(255,255,255,0))}.frontend-video-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.frontend-video-card{overflow:hidden;border-radius:18px;background:#0c1115;border:1px solid #253039;box-shadow:0 15px 45px rgba(0,0,0,.18)}.frontend-video-card video{display:block;width:100%;aspect-ratio:9/16;max-height:720px;background:#050709;object-fit:contain}.frontend-video-caption{padding:13px 15px;border-top:1px solid rgba(255,255,255,.07);font-size:13px}.frontend-video-caption strong{display:block;overflow-wrap:anywhere}
@media(max-width:900px){.admin-video-list{grid-template-columns:1fr}.admin-permission-grid{grid-template-columns:1fr}.admin-permissions-form{min-width:min(520px,82vw)}}
@media(max-width:760px){.video-upload-form{grid-template-columns:1fr}.video-upload-form .full{grid-column:auto}.admin-video-settings-form{grid-template-columns:1fr}.frontend-video-grid{grid-template-columns:1fr;gap:16px}.frontend-video-card video{max-height:none}.admin-permissions-form{min-width:0;width:100%}.admin-permissions-details[open]{width:min(100%,92vw)}}

/* v1.31 - Admin sidebar always scrolls when navigation is taller than viewport */
.sidebar{
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:#34414b #0b1014;
}
.sidebar::-webkit-scrollbar{width:8px}
.sidebar::-webkit-scrollbar-track{background:#0b1014}
.sidebar::-webkit-scrollbar-thumb{background:#34414b;border-radius:999px;border:2px solid #0b1014}
.sidebar::-webkit-scrollbar-thumb:hover{background:#4a5a66}
.side-nav{padding-bottom:28px}

/* v1.33 - Agent-style searchable/collapsible admin sidebar */
.admin-layout{
  grid-template-columns:260px minmax(0,1fr);
  transition:grid-template-columns .2s ease;
}
.sidebar{
  display:flex;
  flex-direction:column;
  height:100vh;
  height:100dvh;
  padding:16px 14px 0;
  overflow:hidden!important;
}
.sidebar-fixed{flex:0 0 auto;min-width:0;background:#0b1014;position:relative;z-index:2}
.sidebar-head{display:flex;align-items:center;gap:9px;min-width:0;padding:0 1px 12px}
.sidebar-head .sidebar-brand{flex:1;min-width:0;padding:0!important;overflow:hidden}
.sidebar-collapse,.sidebar-close{
  width:38px;height:38px;flex:0 0 38px;border:1px solid #303b45;border-radius:11px;
  display:grid;place-items:center;background:#151c23;color:#aeb9c1;cursor:pointer;
  transition:background .18s ease,color .18s ease,border-color .18s ease,transform .2s ease;
}
.sidebar-collapse:hover,.sidebar-close:hover{background:#1c252d;color:#fff;border-color:#46535e}
.sidebar-collapse .ui-icon,.sidebar-close .ui-icon{width:19px;height:19px}
.sidebar-close{display:none}
.sidebar-search{
  display:flex;align-items:center;gap:9px;height:44px;padding:0 12px;margin:0 0 10px;
  border:1px solid #2b3741;border-radius:11px;background:#131b22;color:#7d8b96;
  transition:border-color .18s ease,background .18s ease,width .2s ease,padding .2s ease;
}
.sidebar-search:focus-within{border-color:#4a5b68;background:#162029}
.sidebar-search-icon{display:grid;place-items:center;flex:0 0 18px}
.sidebar-search-icon .ui-icon{width:17px;height:17px}
.sidebar-search input{
  min-width:0;width:100%;border:0!important;outline:0!important;background:transparent!important;color:#eef2f4!important;
  padding:0!important;border-radius:0!important;font-size:12px!important;box-shadow:none!important;
}
.sidebar-search input::placeholder{color:#73818c}
.side-nav{
  flex:1 1 auto;min-height:0;display:grid;align-content:start;gap:7px;padding:2px 0 28px;
  overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#34414b #0b1014;
}
.side-nav::-webkit-scrollbar{width:8px}.side-nav::-webkit-scrollbar-track{background:#0b1014}.side-nav::-webkit-scrollbar-thumb{background:#34414b;border-radius:999px;border:2px solid #0b1014}.side-nav::-webkit-scrollbar-thumb:hover{background:#4a5a66}
.side-nav a{display:flex;align-items:center;gap:11px;min-height:44px;white-space:nowrap;overflow:hidden}
.side-nav .side-icon{display:grid;place-items:center;width:22px;flex:0 0 22px}
.side-nav .side-icon .ui-icon{width:19px;height:19px}
.side-nav .side-label{overflow:hidden;text-overflow:ellipsis;transition:opacity .15s ease}
.sidebar-no-results{padding:18px 10px;color:#7f8c96;text-align:center;font-size:12px}

.admin-body.sidebar-collapsed .admin-layout{grid-template-columns:88px minmax(0,1fr)}
.admin-body.sidebar-collapsed .sidebar{padding-left:9px;padding-right:9px}
.admin-body.sidebar-collapsed .sidebar-head{gap:5px;padding-left:1px;padding-right:1px}
.admin-body.sidebar-collapsed .sidebar-brand{width:38px;flex:0 0 38px;justify-content:center}
.admin-body.sidebar-collapsed .sidebar-brand .brand-logo-block{width:38px;align-items:center}
.admin-body.sidebar-collapsed .sidebar-brand .brand-logo{width:38px!important;height:38px!important;max-width:38px!important;max-height:38px!important;object-fit:contain;object-position:center}
.admin-body.sidebar-collapsed .sidebar-brand .brand-logo-block small{display:none}
.admin-body.sidebar-collapsed .sidebar-brand .brand-mark{width:38px;height:38px;border-radius:11px;flex:0 0 38px}
.admin-body.sidebar-collapsed .sidebar-brand>span:last-child:not(.brand-logo-block):not(.brand-mark){display:none}
.admin-body.sidebar-collapsed .sidebar-collapse{width:30px;height:30px;flex-basis:30px;border-radius:9px}
.admin-body.sidebar-collapsed .sidebar-collapse .ui-icon{transform:rotate(180deg)}
.admin-body.sidebar-collapsed .sidebar-search{width:44px;padding:0;justify-content:center;margin-left:auto;margin-right:auto;cursor:pointer}
.admin-body.sidebar-collapsed .sidebar-search input{width:0;opacity:0;pointer-events:none;position:absolute}
.admin-body.sidebar-collapsed .side-nav a{justify-content:center;padding-left:10px;padding-right:10px;gap:0}
.admin-body.sidebar-collapsed .side-nav .side-label{width:0;opacity:0;pointer-events:none}
.admin-body.sidebar-collapsed .sidebar-no-results{display:none!important}

@media(max-width:980px){
  .admin-body.sidebar-collapsed .admin-layout,.admin-layout{display:block;min-height:100vh}
  .sidebar,.admin-body.sidebar-collapsed .sidebar{
    position:fixed;left:0;top:0;bottom:0;width:min(310px,88vw);max-width:calc(100vw - 44px);
    height:100dvh;padding:16px 13px 0;overflow:hidden!important;
  }
  .sidebar-head,.admin-body.sidebar-collapsed .sidebar-head{gap:8px;padding:0 1px 12px}
  .sidebar-head .sidebar-brand,.admin-body.sidebar-collapsed .sidebar-brand{flex:1 1 auto;width:auto;justify-content:flex-start}
  .admin-body.sidebar-collapsed .sidebar-brand .brand-logo-block{width:auto;align-items:flex-start}
  .admin-body.sidebar-collapsed .sidebar-brand .brand-logo{width:auto!important;height:auto!important;max-width:155px!important;max-height:44px!important;object-position:left center}
  .admin-body.sidebar-collapsed .sidebar-brand .brand-logo-block small{display:block}
  .admin-body.sidebar-collapsed .sidebar-brand>span:last-child:not(.brand-logo-block):not(.brand-mark){display:inline}
  .sidebar-collapse{display:none!important}
  .sidebar-close{display:grid}
  .sidebar-search,.admin-body.sidebar-collapsed .sidebar-search{width:auto;padding:0 12px;justify-content:flex-start;margin-left:0;margin-right:0;cursor:text}
  .sidebar-search input,.admin-body.sidebar-collapsed .sidebar-search input{width:100%;opacity:1;pointer-events:auto;position:static}
  .side-nav a,.admin-body.sidebar-collapsed .side-nav a{justify-content:flex-start;padding:12px 11px;gap:11px}
  .admin-body.sidebar-collapsed .side-nav .side-label{width:auto;opacity:1;pointer-events:auto}
  .admin-body.sidebar-collapsed .sidebar-no-results{display:block}
}

/* v1.34 compact YouTube-style frontend video cards */
.frontend-videos-section{padding-top:54px;padding-bottom:60px}.frontend-videos-section .section-title{margin-bottom:24px}.frontend-video-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 18px;align-items:start}.frontend-video-card{border-radius:14px;background:transparent;border:0;box-shadow:none;overflow:visible}.frontend-video-card video{display:block;width:100%;aspect-ratio:16/9;height:auto;max-height:none;background:#000;object-fit:contain;border:1px solid #253039;border-radius:14px}.frontend-video-caption{padding:10px 2px 0;border-top:0;font-size:14px;line-height:1.35}.frontend-video-caption strong{font-weight:800}.frontend-video-card:hover video{border-color:#364550}
@media(max-width:1000px){.frontend-video-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.frontend-videos-section{padding-top:42px;padding-bottom:48px}.frontend-video-grid{grid-template-columns:1fr;gap:20px}.frontend-video-card video{border-radius:12px}.frontend-video-caption{padding-top:9px}}

/* v1.35 frontend video thumbnails */
.admin-thumbnail-preview{display:block;width:min(420px,100%);aspect-ratio:16/9;object-fit:cover;margin-top:12px;border-radius:14px;background:#070a0d;border:1px solid #26323a}.thumbnail-upload-drop{border-style:dashed}.admin-video-settings-form .full{grid-column:1/-1}.video-thumbnail-edit-field input[type=file]{width:100%;padding:10px;border:1px solid #2b353d;border-radius:10px;background:#121920;color:#d8e0e5}.video-thumbnail-edit-field small{display:block;margin-top:6px}