*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#08080b;color:#fff}
a{text-decoration:none;color:inherit}
.nav{position:sticky;top:0;z-index:99;background:rgba(0,0,0,.92);border-bottom:1px solid rgba(255,255,255,.08)}
.nav-inner{max-width:1180px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:15px 20px}
.logo{font-size:22px;font-weight:900}.logo span{color:#ff2438}
.menu a{font-size:14px;font-weight:800;margin-left:16px;color:#eee}.menu a:hover{color:#ff2438}
.hero{min-height:680px;background:radial-gradient(circle at 20% 20%,rgba(255,0,45,.35),transparent 32%),linear-gradient(135deg,#08080b,#180409 60%,#e50914 150%);display:flex;align-items:center;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:44px 44px;opacity:.35}
.hero-wrap{position:relative;z-index:2;max-width:1180px;margin:auto;padding:70px 20px;display:grid;grid-template-columns:1.2fr .8fr;gap:35px;align-items:center}
.badge{display:inline-block;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:9px 15px;font-weight:900;font-size:13px;margin-bottom:18px}
h1{font-size:58px;line-height:1.04;margin:0 0 18px;letter-spacing:-2px}
.lead{font-size:21px;line-height:1.55;color:#f1f1f1}
.btn{display:inline-block;background:linear-gradient(135deg,#ff1735,#d50016);color:#fff;border:0;border-radius:999px;padding:15px 27px;font-weight:900;cursor:pointer;box-shadow:0 14px 30px rgba(229,9,20,.35);margin:6px 5px 6px 0}
.btn.white{background:#fff;color:#111;box-shadow:none}.btn.green{background:linear-gradient(135deg,#17ad4e,#0d8c3b)}
.container{max-width:1180px;margin:auto;padding:35px 20px}
.title{text-align:center;font-size:38px;margin:45px 0 25px}.subtitle{text-align:center;color:#ccc;max-width:760px;margin:-10px auto 25px;line-height:1.6}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:22px}
.card{background:linear-gradient(180deg,rgba(255,255,255,.105),rgba(255,255,255,.045));border:1px solid rgba(255,255,255,.12);border-radius:24px;padding:27px;box-shadow:0 24px 55px rgba(0,0,0,.28);margin-bottom:22px}
.card p,.muted{color:#d5d5d5;line-height:1.65}.price{font-size:42px;font-weight:950;color:#ff2438;margin:10px 0}
.notice{background:#fff6c7;color:#111;padding:12px 16px;border-radius:14px;margin:12px 0}
.note-box{background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.16);padding:20px;border-radius:22px;margin-top:18px}
input,textarea,select{width:100%;padding:14px;border:1px solid #ccc;border-radius:12px;margin:8px 0 15px;font-size:15px}textarea{min-height:100px}
.form-box{max-width:560px;margin:55px auto;background:#fff;color:#111;border-radius:24px;padding:34px;box-shadow:0 24px 60px rgba(0,0,0,.3)}
table{width:100%;border-collapse:collapse;background:#fff;color:#111;border-radius:18px;overflow:hidden}th,td{padding:13px;border-bottom:1px solid #eee;text-align:left}
.copy-row{display:flex;gap:10px}.copy-row input{margin:0}
.marketplace-row,.social-row{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:16px}
.market-btn,.social-btn{display:inline-flex;align-items:center;justify-content:center;border-radius:14px;padding:14px 18px;font-weight:900;color:#fff;min-width:145px}
.market-btn.shopee{background:linear-gradient(135deg,#ff5a1f,#ee4d2d)}.market-btn.tiktok{background:linear-gradient(135deg,#111,#333)}.market-btn.lazada{background:linear-gradient(135deg,#243bff,#ff2e87)}
.social-btn.facebook{background:#1877f2}.social-btn.instagram{background:linear-gradient(135deg,#f58529,#dd2a7b,#8134af)}.social-btn.tiktok{background:#111}.social-btn.telegram{background:#229ed9}.social-btn.youtube{background:#ff0000}.social-btn.website{background:#374151}
.front-offer{margin-top:-45px;position:relative;z-index:3}.product-image{height:160px;border-radius:22px;background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.18),transparent 30%),linear-gradient(135deg,#ff2438,#111);display:flex;align-items:center;justify-content:center;font-size:48px;margin-bottom:18px}
.toggle-box{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#f5f5f5;color:#111;padding:12px 14px;border-radius:12px;margin:8px 0 15px}.toggle-box input{width:auto;margin:0}
.status-on{display:inline-block;background:#16a34a;color:#fff;border-radius:999px;padding:5px 10px;font-size:12px;font-weight:900}.status-off{display:inline-block;background:#666;color:#fff;border-radius:999px;padding:5px 10px;font-size:12px;font-weight:900}
.agent-box{display:grid;grid-template-columns:110px 1fr;gap:20px;align-items:center;text-align:left}
.avatar{width:110px;height:110px;border-radius:50%;background:linear-gradient(135deg,#ff2438,#111);display:flex;align-items:center;justify-content:center;font-size:38px;font-weight:900;overflow:hidden;border:3px solid rgba(255,255,255,.25)}
.avatar img{width:100%;height:100%;object-fit:cover}.profile-preview{width:120px;height:120px;border-radius:50%;object-fit:cover;border:4px solid #ff2438;margin:10px 0}
.hero-agent{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);border-radius:18px;padding:12px;margin:18px 0;max-width:460px}.hero-agent .avatar{width:70px;height:70px;font-size:28px}.hero-agent p{margin:0;color:#fff;font-size:14px}
.phone-card{background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.18);border-radius:30px;padding:25px}.phone-screen{background:#111;border:8px solid #222;border-radius:34px;padding:25px;min-height:400px}.sim{height:115px;border-radius:18px;background:linear-gradient(135deg,#f3c24d,#fff2ae);color:#111;padding:18px;font-weight:900;margin-bottom:18px}
.footer{background:#020203;border-top:1px solid rgba(255,255,255,.08);padding:35px 20px;color:#aaa;text-align:center}

.order-popup{position:fixed;left:20px;bottom:22px;background:#fff;color:#111;max-width:330px;padding:14px 16px;border-radius:18px;box-shadow:0 15px 40px rgba(0,0,0,.25);z-index:9999;display:none;align-items:center;gap:12px;animation:popupSlide .4s ease;border:1px solid rgba(0,0,0,.08)}
.order-popup-icon{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#ff1735,#d50016);color:white;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}
.order-popup-content strong{display:block;font-size:14px;margin-bottom:3px}.order-popup-content span{font-size:13px;color:#555;line-height:1.35}.order-popup-close{position:absolute;top:7px;right:10px;background:none;border:0;font-size:18px;cursor:pointer;color:#777}
@keyframes popupSlide{from{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}
@media(max-width:850px){.hero-wrap{grid-template-columns:1fr}.phone-card{display:none}h1{font-size:40px}.nav-inner{display:block}.logo{margin-bottom:10px}.menu a{margin-left:9px;font-size:12px}.copy-row{display:block}.copy-row .btn{width:100%;margin-top:10px}.agent-box{grid-template-columns:1fr;text-align:center}.avatar{margin:auto}.order-popup{left:12px;right:12px;bottom:15px;max-width:none}}


/* CONVERSION MAX ADDON */
.live-counter{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:rgba(255,255,255,.14);
    border:1px solid rgba(255,255,255,.22);
    color:#fff;
    padding:10px 15px;
    border-radius:999px;
    font-weight:900;
    margin:8px 0 18px;
}
.live-dot{
    width:10px;
    height:10px;
    border-radius:50%;
    background:#22c55e;
    box-shadow:0 0 0 0 rgba(34,197,94,.8);
    animation:pulseDot 1.5s infinite;
}
@keyframes pulseDot{
    0%{box-shadow:0 0 0 0 rgba(34,197,94,.8)}
    70%{box-shadow:0 0 0 10px rgba(34,197,94,0)}
    100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}
}
.floating-whatsapp{
    position:fixed;
    right:20px;
    bottom:22px;
    z-index:9998;
    background:linear-gradient(135deg,#17ad4e,#0d8c3b);
    color:#fff;
    border-radius:999px;
    padding:15px 22px;
    font-weight:950;
    box-shadow:0 14px 34px rgba(0,0,0,.32);
    display:flex;
    align-items:center;
    gap:8px;
}
.floating-whatsapp:hover{transform:translateY(-2px)}
.sales-popup{
    position:fixed;
    left:20px;
    bottom:22px;
    background:#fff;
    color:#111;
    max-width:355px;
    padding:14px 16px;
    border-radius:18px;
    box-shadow:0 15px 40px rgba(0,0,0,.28);
    z-index:9999;
    display:none;
    align-items:center;
    gap:12px;
    animation:popupSlide .4s ease;
    border:1px solid rgba(0,0,0,.08);
}
.sales-popup-img{
    width:50px;
    height:50px;
    border-radius:50%;
    background:linear-gradient(135deg,#ff1735,#d50016);
    color:white;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
    flex-shrink:0;
}
.sales-popup-content strong{
    display:block;
    font-size:14px;
    margin-bottom:3px;
}
.sales-popup-content span{
    display:block;
    font-size:13px;
    color:#555;
    line-height:1.35;
}
.sales-popup-time{
    font-size:12px!important;
    color:#16a34a!important;
    font-weight:800;
    margin-top:4px;
}
.sales-popup-close{
    position:absolute;
    top:7px;
    right:10px;
    background:none;
    border:0;
    font-size:18px;
    cursor:pointer;
    color:#777;
}
.cta-highlight{
    animation:ctaGlow 1.1s ease-in-out 3;
}
@keyframes ctaGlow{
    0%,100%{box-shadow:0 0 0 rgba(22,163,74,0)}
    50%{box-shadow:0 0 0 8px rgba(22,163,74,.25)}
}
@media(max-width:600px){
    .floating-whatsapp{
        right:12px;
        bottom:14px;
        padding:13px 17px;
        font-size:14px;
    }
    .sales-popup{
        left:12px;
        right:12px;
        bottom:78px;
        max-width:none;
    }
}


/* SHOW PASSWORD ADDON */
.password-wrap{
    position:relative;
}
.password-wrap input{
    padding-right:105px;
}
.show-password-btn{
    position:absolute;
    right:10px;
    top:50%;
    transform:translateY(-50%);
    border:0;
    background:#111;
    color:#fff;
    padding:8px 11px;
    border-radius:9px;
    font-size:12px;
    font-weight:800;
    cursor:pointer;
}
.show-password-btn:hover{
    background:#e50914;
}


/* POLISHED LOGIN / REGISTER UI */
.auth-page{
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:35px 18px;
    background:
        radial-gradient(circle at 15% 15%, rgba(255,36,56,.35), transparent 30%),
        radial-gradient(circle at 85% 20%, rgba(255,255,255,.10), transparent 25%),
        linear-gradient(135deg,#07070a,#180409 60%,#0b0b0e);
    position:relative;
    overflow:hidden;
}
.auth-page:before{
    content:"";
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
    background-size:42px 42px;
    opacity:.38;
}
.auth-wrap{
    position:relative;
    z-index:2;
    width:100%;
    max-width:1080px;
    display:grid;
    grid-template-columns:1fr 1.05fr;
    gap:24px;
    align-items:stretch;
}
.auth-brand{
    border-radius:30px;
    padding:38px;
    background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,.045));
    border:1px solid rgba(255,255,255,.14);
    box-shadow:0 28px 70px rgba(0,0,0,.36);
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    min-height:520px;
}
.auth-brand .logo-large{
    font-size:30px;
    font-weight:950;
    letter-spacing:-1px;
}
.auth-brand .logo-large span{color:#ff2438}
.auth-brand h1{
    font-size:44px;
    letter-spacing:-1.8px;
    margin:35px 0 12px;
}
.auth-brand p{
    color:#e8e8e8;
    line-height:1.65;
    font-size:16px;
}
.auth-points{
    display:grid;
    gap:12px;
    margin-top:25px;
}
.auth-point{
    display:flex;
    gap:10px;
    align-items:center;
    color:#fff;
    font-weight:800;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.10);
    padding:12px 14px;
    border-radius:16px;
}
.auth-card{
    background:#fff;
    color:#111;
    border-radius:30px;
    padding:36px;
    box-shadow:0 28px 70px rgba(0,0,0,.36);
}
.auth-card h2{
    margin:0 0 8px;
    font-size:30px;
    letter-spacing:-1px;
}
.auth-card .auth-subtitle{
    margin:0 0 24px;
    color:#666;
    line-height:1.55;
}
.auth-card label{
    display:block;
    font-weight:900;
    margin:8px 0 3px;
    color:#222;
}
.auth-card input,
.auth-card textarea,
.auth-card select{
    background:#f7f7f8;
    border:1px solid #e3e3e8;
    margin:7px 0 16px;
    transition:.2s ease;
}
.auth-card input:focus,
.auth-card textarea:focus,
.auth-card select:focus{
    outline:none;
    border-color:#ff2438;
    box-shadow:0 0 0 4px rgba(255,36,56,.10);
    background:#fff;
}
.auth-card .btn{
    width:100%;
    text-align:center;
    justify-content:center;
    margin-top:8px;
}
.auth-links{
    text-align:center;
    margin-top:18px;
    color:#666;
}
.auth-links a{
    color:#e50914;
    font-weight:900;
}
.auth-mini{
    font-size:13px;
    color:#777;
    line-height:1.45;
    margin-top:12px;
}
.password-wrap{
    position:relative;
}
.password-wrap input{
    padding-right:96px!important;
}
.show-password-btn{
    position:absolute;
    right:9px;
    top:50%;
    transform:translateY(-50%);
    border:0;
    background:#111;
    color:#fff;
    padding:8px 11px;
    border-radius:10px;
    font-size:12px;
    font-weight:900;
    cursor:pointer;
}
.show-password-btn:hover{background:#e50914}
.auth-back{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:#fff;
    background:rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.14);
    border-radius:999px;
    padding:10px 14px;
    font-weight:900;
    width:max-content;
}
.auth-back:hover{background:rgba(255,255,255,.18)}
@media(max-width:900px){
    .auth-wrap{grid-template-columns:1fr}
    .auth-brand{min-height:auto}
    .auth-brand h1{font-size:34px}
}
@media(max-width:560px){
    .auth-page{padding:18px 12px}
    .auth-card,.auth-brand{padding:24px;border-radius:24px}
    .auth-brand h1{font-size:30px}
}


/* PASSWORD INLINE ICON + STRENGTH */
.password-inline{
    display:flex;
    align-items:center;
    gap:8px;
    margin:7px 0 10px;
}
.password-inline input{
    flex:1;
    margin:0!important;
}
.password-eye-btn{
    width:48px;
    min-width:48px;
    height:48px;
    border:0;
    border-radius:12px;
    background:#111;
    color:#fff;
    font-size:18px;
    font-weight:900;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
}
.password-eye-btn:hover{
    background:#e50914;
}
.password-strength{
    margin:-2px 0 15px;
}
.strength-bar{
    height:8px;
    background:#e5e7eb;
    border-radius:999px;
    overflow:hidden;
}
.strength-fill{
    height:100%;
    width:0%;
    background:#ef4444;
    border-radius:999px;
    transition:.25s ease;
}
.strength-text{
    display:block;
    margin-top:6px;
    font-size:12px;
    font-weight:800;
    color:#777;
}
.strength-weak .strength-fill{width:33%;background:#ef4444}
.strength-medium .strength-fill{width:66%;background:#f59e0b}
.strength-strong .strength-fill{width:100%;background:#16a34a}
.strength-weak .strength-text{color:#ef4444}
.strength-medium .strength-text{color:#b45309}
.strength-strong .strength-text{color:#16a34a}


/* FULL CONVERSION UI - NO AUTO SCROLL */
.live-counter{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:rgba(255,255,255,.14);
    border:1px solid rgba(255,255,255,.22);
    color:#fff;
    padding:10px 15px;
    border-radius:999px;
    font-weight:900;
    margin:8px 0 16px;
}
.live-dot{
    width:10px;
    height:10px;
    border-radius:50%;
    background:#22c55e;
    box-shadow:0 0 0 0 rgba(34,197,94,.8);
    animation:pulseDot 1.5s infinite;
}
@keyframes pulseDot{
    0%{box-shadow:0 0 0 0 rgba(34,197,94,.8)}
    70%{box-shadow:0 0 0 10px rgba(34,197,94,0)}
    100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}
}
.floating-whatsapp{
    position:fixed;
    right:20px;
    bottom:22px;
    z-index:9998;
    background:linear-gradient(135deg,#17ad4e,#0d8c3b);
    color:#fff;
    border-radius:999px;
    padding:15px 22px;
    font-weight:950;
    box-shadow:0 14px 34px rgba(0,0,0,.32);
    display:flex;
    align-items:center;
    gap:8px;
    transition:.2s ease;
}
.floating-whatsapp:hover{transform:translateY(-2px)}
.sales-popup{
    position:fixed;
    left:20px;
    bottom:22px;
    background:#fff;
    color:#111;
    max-width:355px;
    padding:14px 16px;
    border-radius:18px;
    box-shadow:0 15px 40px rgba(0,0,0,.28);
    z-index:9999;
    display:none;
    align-items:center;
    gap:12px;
    animation:popupSlide .4s ease;
    border:1px solid rgba(0,0,0,.08);
}
.sales-popup-img{
    width:50px;
    height:50px;
    border-radius:50%;
    background:linear-gradient(135deg,#ff1735,#d50016);
    color:white;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
    flex-shrink:0;
}
.sales-popup-content strong{
    display:block;
    font-size:14px;
    margin-bottom:3px;
}
.sales-popup-content span{
    display:block;
    font-size:13px;
    color:#555;
    line-height:1.35;
}
.sales-popup-time{
    font-size:12px!important;
    color:#16a34a!important;
    font-weight:800;
    margin-top:4px;
}
.sales-popup-close{
    position:absolute;
    top:7px;
    right:10px;
    background:none;
    border:0;
    font-size:18px;
    cursor:pointer;
    color:#777;
}
.cta-highlight{
    animation:ctaGlow 1.2s ease-in-out infinite;
}
@keyframes ctaGlow{
    0%{box-shadow:0 0 0 0 rgba(22,163,74,0)}
    50%{box-shadow:0 0 0 12px rgba(22,163,74,.25)}
    100%{box-shadow:0 0 0 0 rgba(22,163,74,0)}
}
@keyframes popupSlide{
    from{transform:translateY(20px);opacity:0}
    to{transform:translateY(0);opacity:1}
}
@media(max-width:600px){
    .floating-whatsapp{
        right:12px;
        bottom:14px;
        padding:13px 17px;
        font-size:14px;
    }
    .sales-popup{
        left:12px;
        right:12px;
        bottom:78px;
        max-width:none;
    }
}


/* TUNETALK STYLE LOGIN - CLEAN PROFESSIONAL */
body.auth-body{
    margin:0;
    min-height:100vh;
    font-family:Arial,Helvetica,sans-serif;
    background:
        radial-gradient(circle at 20% 10%, rgba(255,36,56,.22), transparent 28%),
        radial-gradient(circle at 80% 90%, rgba(255,255,255,.08), transparent 28%),
        linear-gradient(135deg,#050507 0%,#160307 52%,#07070a 100%);
    color:#111;
}
.auth-shell{
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
}
.auth-panel{
    width:100%;
    max-width:460px;
    background:#fff;
    border-radius:28px;
    box-shadow:0 25px 80px rgba(0,0,0,.35);
    padding:34px;
    position:relative;
    overflow:hidden;
}
.auth-panel:before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    right:0;
    height:7px;
    background:linear-gradient(90deg,#e50914,#ff4b5d,#e50914);
}
.auth-logo-box{
    text-align:center;
    margin-bottom:22px;
}
.auth-logo-mark{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:86px;
    height:86px;
    border-radius:24px;
    background:linear-gradient(135deg,#e50914,#9f0010);
    color:#fff;
    font-size:34px;
    font-weight:950;
    box-shadow:0 16px 35px rgba(229,9,20,.30);
    margin-bottom:13px;
}
.auth-logo-text{
    font-size:24px;
    font-weight:950;
    letter-spacing:-.8px;
    color:#111;
}
.auth-logo-text span{color:#e50914}
.auth-title{
    text-align:center;
    margin:0;
    font-size:28px;
    color:#111;
    letter-spacing:-.8px;
}
.auth-subtitle{
    text-align:center;
    margin:9px 0 24px;
    color:#667085;
    line-height:1.55;
    font-size:14px;
}
.auth-tabs{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    background:#f3f4f6;
    border-radius:16px;
    padding:6px;
    margin-bottom:20px;
}
.auth-tab{
    text-align:center;
    border-radius:12px;
    padding:10px 8px;
    font-weight:900;
    color:#667085;
}
.auth-tab.active{
    background:#111;
    color:#fff;
}
.auth-form label{
    display:block;
    font-size:13px;
    font-weight:950;
    color:#111;
    margin:12px 0 6px;
}
.auth-input{
    width:100%;
    background:#f8fafc;
    border:1px solid #e5e7eb;
    border-radius:14px;
    padding:14px;
    font-size:15px;
    outline:none;
    transition:.2s ease;
}
.auth-input:focus{
    border-color:#e50914;
    box-shadow:0 0 0 4px rgba(229,9,20,.10);
    background:#fff;
}
.password-inline{
    display:flex;
    gap:8px;
    align-items:center;
}
.password-inline .auth-input{
    flex:1;
}
.password-eye-btn{
    width:50px;
    height:50px;
    border:0;
    border-radius:14px;
    background:#111;
    color:#fff;
    font-size:18px;
    cursor:pointer;
}
.password-eye-btn:hover{
    background:#e50914;
}
.auth-submit{
    width:100%;
    margin-top:18px;
    border:0;
    border-radius:999px;
    padding:15px 18px;
    background:linear-gradient(135deg,#e50914,#b80012);
    color:#fff;
    font-size:15px;
    font-weight:950;
    cursor:pointer;
    box-shadow:0 14px 28px rgba(229,9,20,.28);
}
.auth-submit:hover{
    transform:translateY(-1px);
}
.auth-links-row{
    display:flex;
    justify-content:space-between;
    gap:10px;
    margin:15px 0 0;
    font-size:13px;
}
.auth-links-row a,
.auth-bottom a{
    color:#e50914;
    font-weight:900;
}
.auth-bottom{
    margin-top:22px;
    text-align:center;
    color:#667085;
    font-size:14px;
}
.auth-alert{
    background:#fff6c7;
    color:#111;
    border-radius:14px;
    padding:12px 14px;
    margin-bottom:14px;
    font-size:14px;
    font-weight:800;
}
.auth-footer{
    text-align:center;
    color:rgba(255,255,255,.70);
    font-size:12px;
    margin-top:18px;
}
.password-strength{
    margin:8px 0 10px;
}
.strength-bar{
    height:8px;
    background:#e5e7eb;
    border-radius:999px;
    overflow:hidden;
}
.strength-fill{
    height:100%;
    width:0%;
    background:#ef4444;
    border-radius:999px;
    transition:.25s ease;
}
.strength-text{
    display:block;
    margin-top:6px;
    font-size:12px;
    font-weight:800;
    color:#777;
}
.strength-weak .strength-fill{width:33%;background:#ef4444}
.strength-medium .strength-fill{width:66%;background:#f59e0b}
.strength-strong .strength-fill{width:100%;background:#16a34a}
.strength-weak .strength-text{color:#ef4444}
.strength-medium .strength-text{color:#b45309}
.strength-strong .strength-text{color:#16a34a}
@media(max-width:560px){
    .auth-shell{
        padding:16px;
        align-items:flex-start;
    }
    .auth-panel{
        padding:28px 20px;
        border-radius:22px;
        margin-top:14px;
    }
    .auth-title{
        font-size:24px;
    }
    .auth-logo-mark{
        width:72px;
        height:72px;
        font-size:28px;
    }
    .auth-links-row{
        display:grid;
        text-align:center;
    }
}


/* FORGOT USERNAME UI */
.auth-result-box{
    background:#ecfdf5;
    border:1px solid #bbf7d0;
    color:#14532d;
    border-radius:16px;
    padding:14px;
    margin:14px 0;
    font-size:14px;
    line-height:1.55;
}
.auth-result-box b{
    font-size:18px;
}
.auth-result-box.error{
    background:#fff1f2;
    border-color:#fecdd3;
    color:#991b1b;
}
.auth-small-note{
    font-size:12px;
    color:#667085;
    line-height:1.45;
    margin-top:8px;
}


/* TUNETALK-INSPIRED LANDING UI - ORIGINAL CUSTOM */
:root{
    --tt-red:#e50914;
    --tt-red2:#ff3048;
    --tt-dark:#08080b;
    --tt-dark2:#15151a;
    --tt-green:#16a34a;
}
body{
    background:#07070a;
}
.tt-nav{
    position:sticky;
    top:0;
    z-index:1000;
    background:rgba(6,6,10,.94);
    backdrop-filter:blur(14px);
    border-bottom:1px solid rgba(255,255,255,.08);
}
.tt-nav-inner{
    max-width:1180px;
    margin:auto;
    padding:14px 20px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
}
.tt-logo{
    display:flex;
    align-items:center;
    gap:10px;
    font-weight:950;
    color:#fff;
    white-space:nowrap;
}
.tt-logo-mark{
    width:42px;
    height:42px;
    border-radius:14px;
    background:linear-gradient(135deg,var(--tt-red),#9c0010);
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:950;
    box-shadow:0 12px 25px rgba(229,9,20,.32);
}
.tt-logo span{
    color:var(--tt-red2);
}
.tt-menu{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    justify-content:flex-end;
}
.tt-menu a{
    color:#fff;
    font-size:13px;
    font-weight:900;
    padding:10px 13px;
    border-radius:999px;
    background:rgba(255,255,255,.07);
    border:1px solid rgba(255,255,255,.08);
}
.tt-menu a:hover{
    background:#fff;
    color:#111;
}
.tt-menu .tt-login{
    background:linear-gradient(135deg,var(--tt-red),var(--tt-red2));
    border:0;
}
.tt-hero{
    min-height:760px;
    position:relative;
    overflow:hidden;
    display:flex;
    align-items:center;
    background:
        radial-gradient(circle at 12% 15%, rgba(229,9,20,.48), transparent 28%),
        radial-gradient(circle at 86% 18%, rgba(255,255,255,.10), transparent 25%),
        linear-gradient(135deg,#050507 0%,#180409 48%,#050507 100%);
}
.tt-hero:before{
    content:"";
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
    background-size:44px 44px;
    opacity:.32;
}
.tt-hero-wrap{
    position:relative;
    z-index:2;
    max-width:1180px;
    margin:auto;
    padding:70px 20px;
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:34px;
    align-items:center;
}
.tt-pill{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.18);
    border-radius:999px;
    padding:10px 15px;
    color:#fff;
    font-weight:900;
    margin-bottom:14px;
}
.tt-hero h1{
    font-size:64px;
    line-height:1.0;
    letter-spacing:-2.6px;
    margin:0 0 18px;
    color:#fff;
}
.tt-hero h1 span{
    color:var(--tt-red2);
}
.tt-hero p{
    color:#f1f1f1;
    font-size:20px;
    line-height:1.6;
    max-width:720px;
}
.tt-hero-actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin:22px 0;
}
.tt-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border-radius:999px;
    padding:15px 24px;
    font-weight:950;
    color:#fff;
    background:linear-gradient(135deg,var(--tt-red),var(--tt-red2));
    box-shadow:0 18px 35px rgba(229,9,20,.32);
    border:0;
}
.tt-btn.green{
    background:linear-gradient(135deg,#18b957,#0d8c3b);
    box-shadow:0 18px 35px rgba(22,163,74,.25);
}
.tt-btn.white{
    background:#fff;
    color:#111;
    box-shadow:none;
}
.tt-trust-row{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:18px;
}
.tt-trust{
    color:#fff;
    background:rgba(255,255,255,.09);
    border:1px solid rgba(255,255,255,.12);
    padding:10px 13px;
    border-radius:14px;
    font-size:13px;
    font-weight:900;
}
.tt-phone-card{
    background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.06));
    border:1px solid rgba(255,255,255,.16);
    border-radius:34px;
    padding:22px;
    box-shadow:0 35px 80px rgba(0,0,0,.35);
}
.tt-phone-screen{
    background:#101014;
    border-radius:30px;
    padding:25px;
    min-height:465px;
    border:8px solid #22232a;
}
.tt-sim-card{
    height:165px;
    border-radius:24px;
    background:
        radial-gradient(circle at 75% 20%, rgba(255,255,255,.55), transparent 28%),
        linear-gradient(135deg,#e50914,#ffaf36);
    color:#fff;
    padding:22px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    margin-bottom:18px;
    position:relative;
    overflow:hidden;
}
.tt-sim-card:after{
    content:"5G";
    position:absolute;
    right:20px;
    bottom:12px;
    font-size:54px;
    font-weight:950;
    opacity:.22;
}
.tt-sim-card b{
    font-size:26px;
}
.tt-sim-card span{
    font-weight:900;
}
.tt-mini-features{
    display:grid;
    gap:10px;
}
.tt-mini-feature{
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.10);
    border-radius:16px;
    padding:12px 14px;
    color:#fff;
    display:flex;
    justify-content:space-between;
    gap:12px;
}
.tt-section{
    max-width:1180px;
    margin:auto;
    padding:60px 20px;
}
.tt-section-kicker{
    text-align:center;
    color:#ff7584;
    font-weight:950;
    letter-spacing:.6px;
}
.tt-section-title{
    text-align:center;
    font-size:42px;
    line-height:1.12;
    margin:10px 0 12px;
    color:#fff;
    letter-spacing:-1.4px;
}
.tt-section-subtitle{
    text-align:center;
    max-width:780px;
    margin:0 auto 32px;
    color:#cfd2da;
    line-height:1.7;
}
.tt-benefit-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px;
}
.tt-benefit-card{
    background:linear-gradient(180deg,rgba(255,255,255,.11),rgba(255,255,255,.045));
    border:1px solid rgba(255,255,255,.10);
    border-radius:26px;
    padding:24px;
    color:#fff;
    min-height:190px;
}
.tt-benefit-icon{
    width:52px;
    height:52px;
    border-radius:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:linear-gradient(135deg,var(--tt-red),var(--tt-red2));
    margin-bottom:15px;
    font-size:24px;
}
.tt-benefit-card h3{
    margin:0 0 10px;
    font-size:20px;
}
.tt-benefit-card p{
    color:#d6d6d6;
    line-height:1.6;
}
.tt-plans-wrap{
    background:linear-gradient(180deg,#0b0b10,#111118);
    border-top:1px solid rgba(255,255,255,.08);
    border-bottom:1px solid rgba(255,255,255,.08);
}
.tt-plan-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
}
.tt-plan-card{
    background:#fff;
    color:#111;
    border-radius:30px;
    padding:26px;
    position:relative;
    box-shadow:0 25px 55px rgba(0,0,0,.28);
    overflow:hidden;
}
.tt-plan-card.popular{
    transform:translateY(-12px);
    border:3px solid var(--tt-red);
}
.tt-plan-badge{
    position:absolute;
    right:-38px;
    top:22px;
    background:var(--tt-red);
    color:#fff;
    padding:8px 44px;
    transform:rotate(35deg);
    font-weight:950;
    font-size:12px;
}
.tt-plan-data{
    font-size:46px;
    font-weight:950;
    color:var(--tt-red);
    margin:10px 0 0;
}
.tt-plan-price{
    font-size:38px;
    font-weight:950;
    margin:4px 0 15px;
}
.tt-plan-price small{
    font-size:15px;
    color:#667085;
}
.tt-plan-list{
    display:grid;
    gap:10px;
    margin:18px 0 22px;
}
.tt-plan-list span{
    display:block;
    color:#333;
    line-height:1.45;
}
.tt-cta-band{
    max-width:1180px;
    margin:60px auto;
    padding:0 20px;
}
.tt-cta-inner{
    background:
        radial-gradient(circle at 20% 20%, rgba(255,255,255,.20), transparent 24%),
        linear-gradient(135deg,#e50914,#111);
    border:1px solid rgba(255,255,255,.12);
    border-radius:34px;
    padding:38px;
    color:#fff;
    text-align:center;
    box-shadow:0 30px 70px rgba(0,0,0,.35);
}
.tt-cta-inner h2{
    font-size:42px;
    margin:0 0 10px;
    letter-spacing:-1.3px;
}
.tt-cta-inner p{
    color:#f3f3f3;
    max-width:720px;
    margin:0 auto 20px;
    line-height:1.7;
}
.tt-agent-box{
    display:grid;
    grid-template-columns:90px 1fr;
    gap:18px;
    align-items:center;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.10);
    border-radius:24px;
    padding:18px;
    margin-top:22px;
    max-width:560px;
}
.tt-agent-box .avatar{
    width:90px;
    height:90px;
}
.tt-lead-card{
    max-width:720px;
    margin:auto;
    background:#fff;
    color:#111;
    border-radius:30px;
    padding:30px;
    box-shadow:0 25px 55px rgba(0,0,0,.26);
}
.tt-lead-card input,.tt-lead-card textarea{
    background:#f8fafc;
    border:1px solid #e5e7eb;
}
.tt-footer{
    background:#030305;
    border-top:1px solid rgba(255,255,255,.08);
    padding:35px 20px;
    text-align:center;
    color:#aaa;
}
@media(max-width:950px){
    .tt-hero-wrap{
        grid-template-columns:1fr;
    }
    .tt-phone-card{
        max-width:480px;
    }
    .tt-benefit-grid,.tt-plan-grid{
        grid-template-columns:1fr;
    }
    .tt-plan-card.popular{
        transform:none;
    }
    .tt-nav-inner{
        display:block;
    }
    .tt-menu{
        margin-top:12px;
        display:flex;
        flex-wrap:nowrap;
        overflow-x:auto;
        justify-content:flex-start;
        padding-bottom:4px;
    }
    .tt-menu a{
        flex:0 0 auto;
        white-space:nowrap;
    }
}
@media(max-width:600px){
    .tt-hero{
        min-height:auto;
    }
    .tt-hero-wrap{
        padding:50px 16px;
    }
    .tt-hero h1{
        font-size:40px;
    }
    .tt-hero p{
        font-size:17px;
    }
    .tt-section{
        padding:42px 14px;
    }
    .tt-section-title{
        font-size:31px;
    }
    .tt-phone-card{
        display:none;
    }
    .tt-cta-inner{
        padding:26px 18px;
        border-radius:24px;
    }
    .tt-cta-inner h2{
        font-size:30px;
    }
    .tt-agent-box{
        grid-template-columns:1fr;
        text-align:center;
    }
    .tt-agent-box .avatar{
        margin:auto;
    }
}


/* SYNC ALL SYSTEM THEME WITH LANDING */
.auth-body,
.dashboard-page{
    background:
        radial-gradient(circle at 12% 12%, rgba(229,9,20,.32), transparent 28%),
        radial-gradient(circle at 88% 88%, rgba(255,255,255,.08), transparent 25%),
        linear-gradient(135deg,#050507 0%,#180409 50%,#050507 100%)!important;
}
.auth-panel{
    background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(255,255,255,.94))!important;
    border:1px solid rgba(255,255,255,.22)!important;
}
.auth-logo-mark,
.sidebar-logo-mark{
    background:linear-gradient(135deg,#e50914,#9c0010)!important;
}
.auth-submit,
.sync-btn-red{
    background:linear-gradient(135deg,#e50914,#ff3048)!important;
    color:#fff!important;
}
.dashboard-layout{
    background:transparent!important;
}
.sidebar{
    background:rgba(6,6,10,.92)!important;
    backdrop-filter:blur(14px);
    border-right:1px solid rgba(255,255,255,.08);
}
.sidebar-logo{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:20px!important;
}
.sidebar-logo-mark{
    width:42px;
    height:42px;
    border-radius:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-weight:950;
    box-shadow:0 12px 25px rgba(229,9,20,.32);
}
.sidebar-logo span{
    color:#ff3048!important;
}
.sidebar-user{
    background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.055))!important;
    border:1px solid rgba(255,255,255,.12)!important;
}
.sidebar-menu a.active,
.sidebar-menu a:hover{
    background:linear-gradient(135deg,#e50914,#ff3048)!important;
    color:#fff!important;
}
.dashboard-main{
    color:#fff!important;
}
.dashboard-top h1{
    color:#fff!important;
}
.dashboard-top p{
    color:#d7d7d7!important;
}
.stat-card,
.dashboard-card{
    background:rgba(255,255,255,.96)!important;
    border:1px solid rgba(255,255,255,.20)!important;
    box-shadow:0 25px 65px rgba(0,0,0,.22)!important;
}
.stat-icon{
    background:#fff1f2!important;
    color:#e50914!important;
}
.dashboard-card h3,
.stat-number{
    color:#111!important;
}
.mobile-sidebar-toggle{
    background:linear-gradient(135deg,#e50914,#ff3048)!important;
}
.dashboard-table th{
    background:#fff1f2!important;
    color:#7f1d1d!important;
}
.dashboard-table td{
    color:#111!important;
}
.admin-badge{
    background:linear-gradient(135deg,#e50914,#ff3048)!important;
}
.theme-top-card{
    background:linear-gradient(135deg,rgba(229,9,20,.24),rgba(255,255,255,.08));
    border:1px solid rgba(255,255,255,.14);
    border-radius:26px;
    padding:20px;
    margin-bottom:20px;
    color:#fff;
}
.theme-top-card h2{
    margin:0 0 6px;
    font-size:24px;
}
.theme-top-card p{
    margin:0;
    color:#e8e8e8;
}
@media(max-width:900px){
    .sidebar{
        box-shadow:20px 0 60px rgba(0,0,0,.38);
    }
}


/* ADMIN DASHBOARD AUDIT FIX - ISOLATED DESIGN */
.adminx-body{
    margin:0;
    min-height:100vh;
    background:
        radial-gradient(circle at 12% 10%, rgba(229,9,20,.30), transparent 28%),
        radial-gradient(circle at 85% 85%, rgba(255,255,255,.08), transparent 26%),
        linear-gradient(135deg,#050507 0%,#170307 48%,#060609 100%);
    color:#fff;
    font-family:Arial,Helvetica,sans-serif;
}
.adminx-layout{
    display:grid;
    grid-template-columns:280px 1fr;
    min-height:100vh;
}
.adminx-sidebar{
    background:rgba(5,5,8,.86);
    border-right:1px solid rgba(255,255,255,.09);
    backdrop-filter:blur(14px);
    padding:22px 16px;
    position:sticky;
    top:0;
    height:100vh;
    overflow:auto;
}
.adminx-logo{
    display:flex;
    align-items:center;
    gap:10px;
    color:#fff;
    font-weight:950;
    font-size:19px;
    margin-bottom:22px;
}
.adminx-logo-mark{
    width:44px;
    height:44px;
    border-radius:15px;
    background:linear-gradient(135deg,#e50914,#9c0010);
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    box-shadow:0 12px 25px rgba(229,9,20,.32);
}
.adminx-logo span{
    color:#ff3048;
}
.adminx-user{
    background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.055));
    border:1px solid rgba(255,255,255,.12);
    border-radius:22px;
    padding:16px;
    margin-bottom:18px;
}
.adminx-avatar{
    width:64px;
    height:64px;
    border-radius:20px;
    background:linear-gradient(135deg,#e50914,#ff3048);
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:950;
    font-size:24px;
    color:#fff;
    margin-bottom:12px;
}
.adminx-user b{
    display:block;
    color:#fff;
    margin-bottom:3px;
}
.adminx-user span{
    color:#cbd5e1;
    font-size:13px;
}
.adminx-menu{
    display:grid;
    gap:8px;
}
.adminx-menu a{
    display:flex;
    align-items:center;
    gap:10px;
    color:#f8fafc;
    padding:12px 14px;
    border-radius:15px;
    font-weight:900;
    text-decoration:none;
}
.adminx-menu a:hover,
.adminx-menu a.active{
    background:linear-gradient(135deg,#e50914,#ff3048);
}
.adminx-main{
    padding:28px;
    min-width:0;
}
.adminx-mobile-btn{
    display:none;
    background:linear-gradient(135deg,#e50914,#ff3048);
    border:0;
    color:#fff;
    border-radius:12px;
    padding:10px 14px;
    font-weight:950;
    margin-bottom:14px;
}
.adminx-hero{
    background:
        radial-gradient(circle at 18% 22%, rgba(255,255,255,.16), transparent 26%),
        linear-gradient(135deg,rgba(229,9,20,.30),rgba(255,255,255,.07));
    border:1px solid rgba(255,255,255,.14);
    border-radius:30px;
    padding:26px;
    margin-bottom:22px;
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:20px;
}
.adminx-hero h1{
    color:#fff;
    margin:0 0 7px;
    font-size:34px;
    letter-spacing:-1.2px;
}
.adminx-hero p{
    color:#e5e7eb;
    margin:0;
    line-height:1.55;
}
.adminx-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    justify-content:flex-end;
}
.adminx-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border:0;
    border-radius:999px;
    padding:12px 18px;
    font-weight:950;
    text-decoration:none;
    cursor:pointer;
    white-space:nowrap;
    background:linear-gradient(135deg,#e50914,#ff3048);
    color:#fff;
    box-shadow:0 13px 28px rgba(229,9,20,.24);
}
.adminx-btn.green{
    background:linear-gradient(135deg,#18b957,#0d8c3b);
    box-shadow:0 13px 28px rgba(22,163,74,.22);
}
.adminx-btn.white{
    background:#fff;
    color:#111;
    box-shadow:none;
}
.adminx-stats{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:16px;
    margin-bottom:22px;
}
.adminx-stat{
    background:#fff;
    border:1px solid rgba(255,255,255,.20);
    border-radius:24px;
    padding:20px;
    box-shadow:0 25px 60px rgba(0,0,0,.20);
    color:#111;
}
.adminx-stat-icon{
    width:44px;
    height:44px;
    border-radius:15px;
    background:#fff1f2;
    color:#e50914;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:22px;
    margin-bottom:12px;
}
.adminx-stat label{
    display:block;
    color:#667085;
    font-size:13px;
    font-weight:900;
    margin-bottom:8px;
}
.adminx-stat strong{
    display:block;
    color:#111;
    font-size:32px;
    letter-spacing:-1px;
}
.adminx-grid-two{
    display:grid;
    grid-template-columns:1fr;
    gap:20px;
}
.adminx-card{
    background:#fff;
    color:#111;
    border:1px solid rgba(255,255,255,.20);
    border-radius:26px;
    box-shadow:0 25px 60px rgba(0,0,0,.20);
    overflow:hidden;
}
.adminx-card-head{
    padding:20px 22px;
    border-bottom:1px solid #eef0f4;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
}
.adminx-card-head h2{
    margin:0;
    color:#111;
    font-size:21px;
}
.adminx-card-head p{
    margin:4px 0 0;
    color:#667085;
    font-size:13px;
}
.adminx-table-wrap{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
}
.adminx-table{
    width:100%;
    min-width:980px;
    border-collapse:collapse;
    background:#fff;
}
.adminx-table th{
    background:#fff1f2;
    color:#7f1d1d;
    text-align:left;
    padding:13px 14px;
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.4px;
}
.adminx-table td{
    padding:14px;
    border-bottom:1px solid #eef0f4;
    color:#111;
    vertical-align:middle;
    font-size:14px;
}
.adminx-table tr:hover td{
    background:#fafafa;
}
.adminx-photo{
    width:46px;
    height:46px;
    border-radius:15px;
    object-fit:cover;
    background:#111;
}
.adminx-user-mini{
    display:flex;
    align-items:center;
    gap:10px;
}
.adminx-user-mini b{
    color:#111;
    display:block;
}
.adminx-user-mini span{
    color:#667085;
    font-size:12px;
}
.adminx-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    padding:6px 10px;
    font-size:12px;
    font-weight:950;
    background:#ecfdf5;
    color:#166534;
}
.adminx-pill.off{
    background:#f3f4f6;
    color:#4b5563;
}
.adminx-phone-link{
    color:#0f766e!important;
    font-weight:950;
}
@media(max-width:1150px){
    .adminx-stats{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:900px){
    .adminx-layout{
        grid-template-columns:1fr;
    }
    .adminx-sidebar{
        position:fixed;
        left:-300px;
        top:0;
        bottom:0;
        width:280px;
        height:100vh;
        z-index:99999;
        transition:.25s ease;
        box-shadow:22px 0 60px rgba(0,0,0,.40);
    }
    .adminx-sidebar.open{
        left:0;
    }
    .adminx-main{
        padding:16px;
    }
    .adminx-mobile-btn{
        display:inline-flex;
    }
    .adminx-hero{
        display:block;
        padding:22px;
    }
    .adminx-actions{
        justify-content:flex-start;
        margin-top:16px;
    }
}
@media(max-width:600px){
    .adminx-main{
        padding:13px;
    }
    .adminx-hero{
        border-radius:22px;
    }
    .adminx-hero h1{
        font-size:28px;
    }
    .adminx-stats{
        grid-template-columns:1fr;
    }
    .adminx-card{
        border-radius:20px;
    }
    .adminx-card-head{
        display:block;
        padding:18px;
    }
    .adminx-card-head .adminx-btn{
        margin-top:12px;
        width:100%;
    }
}


/* FINAL AUDIT REPAIR OVERRIDES */
img{max-width:100%}
input,textarea,select,button{font-family:inherit}
a{text-decoration:none}
.adminx-table-wrap,.dashboard-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.adminx-table,.dashboard-table{border-collapse:collapse}
@media(max-width:600px){
    .floating-whatsapp{right:12px;bottom:14px}
    .sales-popup{left:12px;right:12px;max-width:none}
}


/* MEMBER DASHBOARD AUDIT FIX - ISOLATED DESIGN */
.memberx-body{
    margin:0;
    min-height:100vh;
    background:
        radial-gradient(circle at 12% 10%, rgba(229,9,20,.30), transparent 28%),
        radial-gradient(circle at 85% 85%, rgba(255,255,255,.08), transparent 26%),
        linear-gradient(135deg,#050507 0%,#170307 48%,#060609 100%);
    color:#fff;
    font-family:Arial,Helvetica,sans-serif;
}
.memberx-layout{
    display:grid;
    grid-template-columns:280px 1fr;
    min-height:100vh;
}
.memberx-sidebar{
    background:rgba(5,5,8,.86);
    border-right:1px solid rgba(255,255,255,.09);
    backdrop-filter:blur(14px);
    padding:22px 16px;
    position:sticky;
    top:0;
    height:100vh;
    overflow:auto;
}
.memberx-logo{
    display:flex;
    align-items:center;
    gap:10px;
    color:#fff;
    font-weight:950;
    font-size:19px;
    margin-bottom:22px;
}
.memberx-logo-mark{
    width:44px;
    height:44px;
    border-radius:15px;
    background:linear-gradient(135deg,#e50914,#9c0010);
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    box-shadow:0 12px 25px rgba(229,9,20,.32);
}
.memberx-logo span{color:#ff3048}
.memberx-user{
    background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.055));
    border:1px solid rgba(255,255,255,.12);
    border-radius:22px;
    padding:16px;
    margin-bottom:18px;
}
.memberx-avatar{
    width:70px;
    height:70px;
    border-radius:22px;
    background:linear-gradient(135deg,#e50914,#ff3048);
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:950;
    font-size:26px;
    color:#fff;
    margin-bottom:12px;
    overflow:hidden;
}
.memberx-avatar img{
    width:100%;
    height:100%;
    object-fit:cover;
}
.memberx-user b{display:block;color:#fff;margin-bottom:3px}
.memberx-user span{color:#cbd5e1;font-size:13px}
.memberx-menu{display:grid;gap:8px}
.memberx-menu a{
    display:flex;
    align-items:center;
    gap:10px;
    color:#f8fafc;
    padding:12px 14px;
    border-radius:15px;
    font-weight:900;
    text-decoration:none;
}
.memberx-menu a:hover,.memberx-menu a.active{
    background:linear-gradient(135deg,#e50914,#ff3048);
}
.memberx-main{
    padding:28px;
    min-width:0;
}
.memberx-mobile-btn{
    display:none;
    background:linear-gradient(135deg,#e50914,#ff3048);
    border:0;
    color:#fff;
    border-radius:12px;
    padding:10px 14px;
    font-weight:950;
    margin-bottom:14px;
}
.memberx-hero{
    background:
        radial-gradient(circle at 18% 22%, rgba(255,255,255,.16), transparent 26%),
        linear-gradient(135deg,rgba(229,9,20,.30),rgba(255,255,255,.07));
    border:1px solid rgba(255,255,255,.14);
    border-radius:30px;
    padding:26px;
    margin-bottom:22px;
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:20px;
}
.memberx-hero h1{
    color:#fff;
    margin:0 0 7px;
    font-size:34px;
    letter-spacing:-1.2px;
}
.memberx-hero p{
    color:#e5e7eb;
    margin:0;
    line-height:1.55;
}
.memberx-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    justify-content:flex-end;
}
.memberx-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border:0;
    border-radius:999px;
    padding:12px 18px;
    font-weight:950;
    text-decoration:none;
    cursor:pointer;
    white-space:nowrap;
    background:linear-gradient(135deg,#e50914,#ff3048);
    color:#fff;
    box-shadow:0 13px 28px rgba(229,9,20,.24);
}
.memberx-btn.green{
    background:linear-gradient(135deg,#18b957,#0d8c3b);
    box-shadow:0 13px 28px rgba(22,163,74,.22);
}
.memberx-btn.white{
    background:#fff;
    color:#111;
    box-shadow:none;
}
.memberx-stats{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:16px;
    margin-bottom:22px;
}
.memberx-stat{
    background:#fff;
    border:1px solid rgba(255,255,255,.20);
    border-radius:24px;
    padding:20px;
    box-shadow:0 25px 60px rgba(0,0,0,.20);
    color:#111;
}
.memberx-stat-icon{
    width:44px;
    height:44px;
    border-radius:15px;
    background:#fff1f2;
    color:#e50914;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:22px;
    margin-bottom:12px;
}
.memberx-stat label{
    display:block;
    color:#667085;
    font-size:13px;
    font-weight:900;
    margin-bottom:8px;
}
.memberx-stat strong{
    display:block;
    color:#111;
    font-size:32px;
    letter-spacing:-1px;
}
.memberx-card{
    background:#fff;
    color:#111;
    border:1px solid rgba(255,255,255,.20);
    border-radius:26px;
    box-shadow:0 25px 60px rgba(0,0,0,.20);
    overflow:hidden;
    margin-bottom:20px;
}
.memberx-card-head{
    padding:20px 22px;
    border-bottom:1px solid #eef0f4;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
}
.memberx-card-head h2{
    margin:0;
    color:#111;
    font-size:21px;
}
.memberx-card-head p{
    margin:4px 0 0;
    color:#667085;
    font-size:13px;
}
.memberx-card-body{
    padding:22px;
}
.memberx-copy{
    display:grid;
    grid-template-columns:1fr auto;
    gap:10px;
}
.memberx-copy input{
    width:100%;
    margin:0;
    background:#f8fafc;
    border:1px solid #e5e7eb;
    color:#111;
}
.memberx-table-wrap{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
}
.memberx-table{
    width:100%;
    min-width:780px;
    border-collapse:collapse;
    background:#fff;
}
.memberx-table th{
    background:#fff1f2;
    color:#7f1d1d;
    text-align:left;
    padding:13px 14px;
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.4px;
}
.memberx-table td{
    padding:14px;
    border-bottom:1px solid #eef0f4;
    color:#111;
    vertical-align:middle;
    font-size:14px;
}
.memberx-table tr:hover td{background:#fafafa}
.memberx-phone-link{
    color:#0f766e!important;
    font-weight:950;
}
.memberx-pills{
    display:flex;
    gap:9px;
    flex-wrap:wrap;
}
.memberx-pill{
    display:inline-flex;
    align-items:center;
    border-radius:999px;
    padding:7px 11px;
    font-size:12px;
    font-weight:950;
    background:#ecfdf5;
    color:#166534;
}
.memberx-pill.off{
    background:#f3f4f6;
    color:#4b5563;
}
@media(max-width:1150px){
    .memberx-stats{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:900px){
    .memberx-layout{grid-template-columns:1fr}
    .memberx-sidebar{
        position:fixed;
        left:-300px;
        top:0;
        bottom:0;
        width:280px;
        height:100vh;
        z-index:99999;
        transition:.25s ease;
        box-shadow:22px 0 60px rgba(0,0,0,.40);
    }
    .memberx-sidebar.open{left:0}
    .memberx-main{padding:16px}
    .memberx-mobile-btn{display:inline-flex}
    .memberx-hero{display:block;padding:22px}
    .memberx-actions{justify-content:flex-start;margin-top:16px}
}
@media(max-width:600px){
    .memberx-main{padding:13px}
    .memberx-hero{border-radius:22px}
    .memberx-hero h1{font-size:28px}
    .memberx-stats{grid-template-columns:1fr}
    .memberx-card{border-radius:20px}
    .memberx-card-head{display:block;padding:18px}
    .memberx-card-head .memberx-btn{margin-top:12px;width:100%}
    .memberx-copy{grid-template-columns:1fr}
}


/* POPUP INLINE WITH WHATSAPP */
.conversion-inline-wrap{
    position:fixed;
    right:20px;
    bottom:22px;
    z-index:9999;
    display:flex;
    align-items:flex-end;
    gap:12px;
}
.conversion-inline-wrap .floating-whatsapp{
    position:static!important;
    right:auto!important;
    bottom:auto!important;
}
.conversion-inline-wrap .sales-popup{
    position:static!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    max-width:340px;
    margin:0;
}
@media(max-width:700px){
    .conversion-inline-wrap{
        left:12px;
        right:12px;
        bottom:14px;
        display:grid;
        gap:10px;
    }
    .conversion-inline-wrap .sales-popup{
        max-width:none;
        width:100%;
        order:1;
    }
    .conversion-inline-wrap .floating-whatsapp{
        width:100%;
        justify-content:center;
        order:2;
    }
}


/* AGENT PHONE DISPLAY */
.agent-phone-line{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    margin-top:8px;
}
.agent-phone-badge{
    display:inline-flex;
    align-items:center;
    gap:7px;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.16);
    color:#fff;
    padding:9px 12px;
    border-radius:999px;
    font-weight:950;
}
.agent-phone-badge:hover{
    background:#fff;
    color:#111;
}
.agent-phone-contact{
    display:inline-flex;
    align-items:center;
    gap:7px;
    background:#fff1f2;
    color:#991b1b;
    padding:9px 12px;
    border-radius:999px;
    font-weight:950;
    margin:5px 6px 5px 0;
}


/* FINAL SYSTEM CLEAN OVERRIDES */
img{max-width:100%}
input,textarea,select,button{font-family:inherit}
a{text-decoration:none}
.adminx-table-wrap,.memberx-table-wrap,.dashboard-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.adminx-table,.memberx-table,.dashboard-table{border-collapse:collapse}
.adminx-body,.memberx-body{overflow-x:hidden}
@media(max-width:700px){
    .conversion-inline-wrap{left:12px;right:12px}
}


/* SPEED OPTIMIZATION OVERRIDES */
*{box-sizing:border-box}
html{scroll-behavior:auto!important}
.card,.tt-plan-card,.tt-benefit-card,.adminx-card,.memberx-card,.stat-card,.adminx-stat,.memberx-stat{
    will-change:auto!important;
}
@media(max-width:768px){
    .card,.tt-plan-card,.tt-benefit-card,.adminx-card,.memberx-card,.stat-card,.adminx-stat,.memberx-stat,
    .auth-panel,.tt-phone-card,.sales-popup,.floating-whatsapp{
        box-shadow:0 8px 24px rgba(0,0,0,.18)!important;
    }
    .tt-hero:before{
        opacity:.12!important;
        background-size:70px 70px!important;
    }
    .cta-highlight{
        animation:none!important;
    }
}
@media(prefers-reduced-motion:reduce){
    *,*::before,*::after{
        animation-duration:.01ms!important;
        animation-iteration-count:1!important;
        transition-duration:.01ms!important;
        scroll-behavior:auto!important;
    }
}
.sales-popup,.floating-whatsapp,.conversion-inline-wrap{
    contain:layout style;
}
