:root{
    --bg: #F4F8FD;
    --panel: #FFFFFF;
    --panel-2: #EAF2FC;
    --line: #D9E6F7;
    --text: #16233B;
    --muted: #667490;
    --signal: #1863DC;
    --signal-dim: #E7F0FE;
    --amber: #E38A00;
    --danger: #D93A54;
}

*{ box-sizing: border-box; }

body{
    background: var(--bg);
    color: var(--text);
    font-family: 'Tajawal', sans-serif;
    margin: 0;
    direction: rtl;
    line-height: 1.7;
}

.mono{ font-family: 'IBM Plex Mono', monospace; direction: ltr; unicode-bidi: embed; }

a{ color: inherit; text-decoration: none; }

.container{ max-width: 1080px; margin: 0 auto; padding: 0 24px; }

.topbar{
    display:flex; align-items:center; justify-content:space-between;
    padding: 18px 0; border-bottom: 1px solid var(--line);
}
.brand{ display:flex; align-items:center; gap:12px; font-weight:900; font-size:1.15rem; }
.brand img{ width:38px; height:38px; border-radius:10px; object-fit:cover; border:1px solid var(--line); }
.nav a{ color: var(--muted); margin-inline-start: 24px; font-weight:500; }
.nav a:hover{ color: var(--signal); }

.btn{
    display:inline-block; padding: 11px 22px; border-radius:10px;
    font-weight:700; border: 1px solid transparent; cursor:pointer; font-size:.95rem;
}
.btn-primary{ background: var(--signal); color:#fff; }
.btn-primary:hover{ opacity:.9; }
.btn-primary:disabled{ opacity:.5; cursor:not-allowed; }
.btn-ghost{ background: transparent; border-color: var(--line); color: var(--text); }
.btn-ghost:hover{ border-color: var(--signal); color: var(--signal); }
.btn-danger{ background: transparent; border-color: var(--danger); color: var(--danger); }
.btn-copy{ background: var(--signal-dim); color: var(--signal); border-color: var(--signal-dim); font-size:.85rem; padding: 8px 14px; }

.hero{ padding: 72px 0 48px; display:grid; grid-template-columns: 1.1fr .9fr; gap: 48px; align-items:center; }
.hero h1{ font-size: 2.5rem; font-weight:900; margin:0 0 16px; line-height:1.35; }
.hero h1 span{ color: var(--signal); }
.hero p{ color: var(--muted); font-size:1.05rem; max-width: 46ch; }
.hero-cta{ display:flex; gap:12px; margin-top: 28px; }

.pulse-card{
    background: var(--panel); border:1px solid var(--line); border-radius:16px;
    padding: 22px; position:relative; overflow:hidden; box-shadow: 0 8px 24px rgba(24,99,220,.06);
}
.pulse-dot{
    width:10px; height:10px; border-radius:50%; background: var(--signal);
    display:inline-block; box-shadow: 0 0 0 0 rgba(24,99,220,.6);
    animation: pulse 1.8s infinite;
}
@keyframes pulse{
    0%{ box-shadow: 0 0 0 0 rgba(24,99,220,.5); }
    70%{ box-shadow: 0 0 0 12px rgba(24,99,220,0); }
    100%{ box-shadow: 0 0 0 0 rgba(24,99,220,0); }
}
@media (prefers-reduced-motion: reduce){ .pulse-dot{ animation:none; } }

.code-block{
    background: #0E1A2E; border-radius:12px; padding:18px; margin-top:14px;
    font-size: .85rem; color:#BFE0FF; overflow-x:auto;
}
.code-block .k{ color:#7C93B8; }
.code-block .s{ color:#7FD3A3; }

.pricing-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap:16px; margin: 20px 0 40px; }
.price-card{
    background: var(--panel); border:1px solid var(--line); border-radius:14px; padding:20px; text-align:center;
}
.price-card .amount{ font-size:1.6rem; font-weight:900; color: var(--signal); margin: 8px 0; }

.channel-list{ display:grid; gap:10px; margin: 16px 0 36px; }
.channel-row{
    display:flex; justify-content:space-between; align-items:center;
    background: var(--panel); border:1px solid var(--line); border-radius:10px; padding:14px 18px;
}
.channel-row .price{ font-weight:800; color: var(--amber); }

.auth-wrap{ max-width: 420px; margin: 60px auto; }
.card{ background: var(--panel); border:1px solid var(--line); border-radius:16px; padding:28px; box-shadow: 0 4px 16px rgba(22,35,59,.04); }
.field{ margin-bottom:16px; }
.field label{ display:block; margin-bottom:6px; color: var(--muted); font-size:.9rem; }
.field input, .field select, .field textarea{
    width:100%; padding:12px 14px; border-radius:10px; border:1px solid var(--line);
    background: #fff; color: var(--text); font-family:inherit; font-size:.95rem;
}
.field input:focus, .field select:focus, .field textarea:focus{ outline:2px solid var(--signal); border-color:var(--signal); }
.alert{ padding:12px 16px; border-radius:10px; margin-bottom:16px; font-size:.9rem; }
.alert-error{ background: rgba(217,58,84,.08); color: var(--danger); border:1px solid rgba(217,58,84,.25); }
.alert-ok{ background: var(--signal-dim); color: var(--signal); border:1px solid rgba(24,99,220,.25); }

.dash-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:16px; margin: 24px 0; }
.stat{ background: var(--panel); border:1px solid var(--line); border-radius:14px; padding:20px; }
.stat .label{ color:var(--muted); font-size:.85rem; }
.stat .value{ font-size:1.7rem; font-weight:900; margin-top:6px; }

table{ width:100%; border-collapse: collapse; background: var(--panel); border-radius:12px; overflow:hidden; }
th, td{ padding:12px 14px; text-align:right; border-bottom:1px solid var(--line); font-size:.9rem; }
th{ color: var(--muted); font-weight:600; background: var(--panel-2); }

.badge{ padding:3px 10px; border-radius:999px; font-size:.78rem; font-weight:700; }
.badge-sent{ background: var(--signal-dim); color: var(--signal); }
.badge-pending{ background: rgba(227,138,0,.12); color: var(--amber); }
.badge-failed{ background: rgba(217,58,84,.12); color: var(--danger); }

.key-reveal{
    background:#0E1A2E; border:1px dashed var(--signal); border-radius:10px; padding:16px;
    font-family:'IBM Plex Mono',monospace; direction:ltr; text-align:left; word-break:break-all; color:#8FD3FF;
}

.pay-methods{ display:grid; grid-template-columns: repeat(2, 1fr); gap:16px; margin: 16px 0; }
.pay-method{
    position:relative; border:2px solid var(--line); border-radius:14px; padding:18px;
    text-align:center; cursor:pointer; background:#fff; transition: border-color .15s, box-shadow .15s;
}
.pay-method img{ max-width:100%; height:56px; object-fit:contain; margin-bottom:10px; }
.pay-method input{ position:absolute; top:12px; left:12px; width:18px; height:18px; accent-color: var(--signal); }
.pay-method span{ font-weight:700; color: var(--muted); }
.pay-method.selected{ border-color: var(--signal); box-shadow: 0 0 0 3px var(--signal-dim); }
.pay-method.selected span{ color: var(--signal); }

.pay-target{
    background: var(--signal-dim); border:1px solid rgba(24,99,220,.25); border-radius:12px;
    padding:18px; margin-top:6px;
}
.pay-target .num{ font-family:'IBM Plex Mono',monospace; direction:ltr; text-align:left; font-size:1.15rem; font-weight:700; color: var(--signal); }
.pay-target .warn{ color: var(--danger); font-weight:800; margin-top:10px; }
.copy-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:6px; }

.phone-mock{
    max-width: 320px; margin: 0 auto; background:#0B141A; border-radius: 34px; padding: 14px;
    box-shadow: 0 12px 30px rgba(22,35,59,.18);
}
.phone-screen{ background:#E5DDD5; border-radius:22px; overflow:hidden; min-height:420px; display:flex; flex-direction:column; }
.wa-header{ background:#075E54; color:#fff; padding:14px 16px; display:flex; align-items:center; gap:10px; font-weight:700; }
.wa-header .dot{ width:34px; height:34px; border-radius:50%; background:#128C7E; display:flex; align-items:center; justify-content:center; font-size:.9rem; }
.wa-body{ flex:1; padding:16px; display:flex; flex-direction:column; justify-content:flex-end; }
.wa-bubble{
    background:#fff; border-radius:10px; padding:10px 14px; max-width:85%;
    box-shadow: 0 1px 1px rgba(0,0,0,.1); font-size:.9rem; color:#111; align-self:flex-start;
}
.wa-bubble b{ color:#075E54; }
.wa-time{ font-size:.72rem; color:#999; margin-top:4px; text-align:left; direction:ltr; }

footer{ text-align:center; color: var(--muted); padding: 40px 0; font-size:.85rem; }

@media (max-width: 800px){
    .hero{ grid-template-columns: 1fr; }
    .pricing-grid, .dash-grid, .pay-methods{ grid-template-columns: 1fr; }
    .nav a{ margin-inline-start: 14px; font-size:.85rem; }
}

body.rtl{ direction: rtl; }
body.ltr{ direction: ltr; }

.sidebar{
    position: fixed; top:0; bottom:0; width: 248px;
    background: #0F2246; color:#DCE7F8; display:flex; flex-direction:column;
    padding: 20px 14px; z-index: 50;
}
body.rtl .sidebar{ right:0; }
body.ltr .sidebar{ left:0; }

.sb-brand{ display:flex; align-items:center; gap:11px; padding: 4px 8px 20px; }
.sb-brand img{ width:40px; height:40px; border-radius:11px; object-fit:cover; }
.sb-brand-name{ font-weight:900; font-size:1rem; color:#fff; line-height:1.3; }
.sb-brand-sub{ font-size:.72rem; color:#7E9AC8; }

.sb-nav{ display:flex; flex-direction:column; gap:4px; flex:1; }
.sb-link{
    display:flex; align-items:center; gap:11px; padding: 11px 13px; border-radius:10px;
    color:#A9BFE0; font-weight:600; font-size:.92rem; transition: background .15s, color .15s;
}
.sb-link:hover{ background: rgba(255,255,255,.07); color:#fff; }
.sb-link.active{ background: var(--signal); color:#fff; }
.sb-link .ico{ width:19px; height:19px; flex-shrink:0; }
.sb-badge{
    margin-inline-start:auto; background: var(--danger); color:#fff; font-style:normal;
    font-size:.7rem; font-weight:800; padding:1px 7px; border-radius:999px;
}

.sb-foot{ border-top:1px solid rgba(255,255,255,.1); padding-top:10px; display:flex; flex-direction:column; gap:4px; }
.sb-user{ display:flex; align-items:center; gap:10px; padding:12px 13px 4px; }
.sb-avatar{
    width:34px; height:34px; border-radius:50%; background: var(--signal);
    display:flex; align-items:center; justify-content:center; font-weight:900; color:#fff; flex-shrink:0;
}
.sb-user-name{ font-size:.85rem; font-weight:700; color:#fff; }
.sb-user-bal{ font-size:.75rem; color:#7FD3A3; }

.main{ min-height:100vh; }
body.rtl .main{ margin-right: 248px; }
body.ltr .main{ margin-left: 248px; }
.main-inner{ max-width: 1000px; margin:0 auto; padding: 36px 30px 0; }

.sb-toggle{
    display:none; position:fixed; top:14px; z-index:60; background: var(--signal); color:#fff;
    border:none; width:42px; height:42px; border-radius:11px; font-size:1.1rem; cursor:pointer;
}
body.rtl .sb-toggle{ right:14px; }
body.ltr .sb-toggle{ left:14px; }
.sb-overlay{ display:none; }

@media (max-width: 900px){
    .sidebar{ transform: translateX(100%); transition: transform .25s; }
    body.ltr .sidebar{ transform: translateX(-100%); }
    body.sb-open .sidebar{ transform: none; }
    body.rtl .main, body.ltr .main{ margin:0; }
    .main-inner{ padding: 70px 18px 0; }
    .sb-toggle{ display:block; }
    body.sb-open .sb-overlay{ display:block; position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:40; }
}

.public-nav{
    display:flex; align-items:center; justify-content:space-between;
    padding:18px 0; border-bottom:1px solid var(--line);
}
.lang-pill{
    border:1px solid var(--line); border-radius:999px; padding:5px 14px;
    font-weight:800; font-size:.8rem; color:var(--signal); margin-inline-start:20px;
}
.lang-pill:hover{ background: var(--signal-dim); }

.notif{
    display:flex; gap:14px; background:#fff; border:1px solid var(--line); border-radius:12px;
    padding:16px 18px; margin-bottom:10px; position:relative;
}
.notif.unread{ border-inline-start:4px solid var(--signal); background: #FBFDFF; }
.notif-dot{ width:38px; height:38px; border-radius:11px; display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:1.05rem; }
.notif-info{ background: var(--signal-dim); }
.notif-success{ background:#E4F7ED; }
.notif-warning{ background:#FDF1DE; }
.notif-error{ background:#FCE8EC; }
.notif-title{ font-weight:800; }
.notif-body{ color:var(--muted); font-size:.9rem; }
.notif-time{ color:var(--muted); font-size:.76rem; margin-top:4px; }
.notif .new-tag{ position:absolute; top:14px; inset-inline-end:16px; background:var(--signal); color:#fff; font-size:.68rem; font-weight:800; padding:1px 8px; border-radius:999px; }

.support-hero{
    display:flex; align-items:center; gap:22px; background:linear-gradient(135deg,#EAF2FC,#F6FAFF);
    border:1px solid var(--line); border-radius:16px; padding:24px; margin-bottom:24px;
}
.support-hero svg{ width:104px; height:104px; flex-shrink:0; }
.ticket-row{
    display:flex; align-items:center; justify-content:space-between; gap:12px;
    background:#fff; border:1px solid var(--line); border-radius:12px; padding:14px 18px; margin-bottom:10px;
}
.ticket-row:hover{ border-color: var(--signal); }
.chat{ display:flex; flex-direction:column; gap:12px; margin: 18px 0; }
.chat-msg{ max-width:76%; padding:12px 16px; border-radius:14px; font-size:.92rem; }
.chat-user{ align-self:flex-start; background:#fff; border:1px solid var(--line); }
.chat-admin{ align-self:flex-end; background: var(--signal); color:#fff; }
.chat-meta{ font-size:.72rem; opacity:.7; margin-top:5px; }

.row-between{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.section-head{ display:flex; align-items:center; justify-content:space-between; margin: 30px 0 12px; }
.section-head h3{ margin:0; }
.section-head a{ color: var(--signal); font-weight:700; font-size:.88rem; }
.search-bar{ display:flex; gap:10px; margin-bottom:16px; }
.search-bar input{ flex:1; padding:11px 14px; border:1px solid var(--line); border-radius:10px; font-family:inherit; }
.pill{ background: var(--panel-2); border-radius:999px; padding:3px 12px; font-size:.8rem; font-weight:700; color: var(--signal); }

.btn-google{
    display:flex; align-items:center; justify-content:center; gap:10px;
    width:100%; padding:12px 18px; border:1px solid var(--line); border-radius:10px;
    background:#fff; color:var(--text) !important; font-weight:700; font-size:.95rem;
    transition:border-color .15s, box-shadow .15s;
}
.btn-google:hover{ border-color:var(--signal); box-shadow:0 2px 10px rgba(24,99,220,.12); }
.auth-divider{ display:flex; align-items:center; gap:12px; margin:18px 0; color:var(--muted); font-size:.84rem; }
.auth-divider::before, .auth-divider::after{ content:''; flex:1; height:1px; background:var(--line); }

.linked-account{
    display:flex; align-items:center; gap:12px; background:var(--signal-dim);
    border:1px solid rgba(24,99,220,.25); border-radius:12px; padding:14px; margin-bottom:18px;
}
.linked-dot{
    width:30px; height:30px; border-radius:50%; background:var(--signal); color:#fff;
    display:flex; align-items:center; justify-content:center; font-weight:900; flex-shrink:0;
}

.captcha-row{ display:flex; align-items:center; gap:10px; margin-bottom:8px; flex-wrap:wrap; }
.captcha-img{ border:1px solid var(--line); border-radius:10px; display:block; }

.price-card .btn{ margin-top:14px; width:100%; text-align:center; }

.nav a.btn, .public-nav a.btn{ color:#fff; }
.nav a.btn-ghost, .public-nav a.btn-ghost{ color: var(--text); }
.nav a.btn-ghost:hover, .public-nav a.btn-ghost:hover{ color: var(--signal); }
a.btn-primary, button.btn-primary{ color:#fff; }
a.btn-primary:hover{ color:#fff; opacity:.9; }

.feature-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin:18px 0 46px; }
.feature{ background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:20px; }
.feature .fico{ width:40px; height:40px; border-radius:11px; background:var(--signal-dim);
    display:flex; align-items:center; justify-content:center; font-size:1.15rem; margin-bottom:10px; }
.feature h4{ margin:0 0 5px; font-size:.98rem; }
.feature p{ margin:0; color:var(--muted); font-size:.85rem; line-height:1.6; }

.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:18px 0 46px; }
.step{ background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:22px; position:relative; }
.step-num{ width:32px; height:32px; border-radius:50%; background:var(--signal); color:#fff;
    display:flex; align-items:center; justify-content:center; font-weight:900; font-size:.9rem; margin-bottom:12px; }
.step h4{ margin:0 0 6px; font-size:1rem; }
.step p{ margin:0; color:var(--muted); font-size:.87rem; }

.price-card{ position:relative; display:flex; flex-direction:column; }
.price-card.featured{ border:2px solid var(--signal); box-shadow:0 10px 30px rgba(24,99,220,.14); }
.pkg-tag{ position:absolute; top:-13px; inset-inline-start:50%; transform:translateX(50%);
    background:var(--signal); color:#fff; font-size:.74rem; font-weight:800;
    padding:4px 14px; border-radius:999px; white-space:nowrap; }
body.ltr .pkg-tag{ transform:translateX(-50%); }
.pkg-meta{ border-top:1px solid var(--line); margin-top:14px; padding-top:12px;
    color:var(--muted); font-size:.83rem; text-align:start; }
.pkg-meta li{ margin-bottom:5px; }
.pkg-meta ul{ margin:0; padding-inline-start:18px; }

.pay-showcase{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin:18px 0 12px; }
.pay-box{ background:var(--panel); border:1px solid var(--line); border-radius:14px;
    padding:22px; display:flex; align-items:center; gap:18px; }
.pay-box img{ width:96px; height:60px; object-fit:contain; flex-shrink:0; }
.pay-box h4{ margin:0 0 4px; font-size:1rem; }
.pay-box p{ margin:0; color:var(--muted); font-size:.85rem; }

.faq details{ background:var(--panel); border:1px solid var(--line); border-radius:12px;
    padding:14px 18px; margin-bottom:10px; }
.faq summary{ cursor:pointer; font-weight:700; list-style:none; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:'+'; float:inline-end; color:var(--signal); font-weight:900; }
.faq details[open] summary::after{ content:'-'; }
.faq p{ color:var(--muted); font-size:.9rem; margin:10px 0 0; }

.cta-band{ background:linear-gradient(135deg,#0F2246,#1863DC); border-radius:18px;
    padding:38px; text-align:center; color:#fff; margin:46px 0 20px; }
.cta-band h2{ color:#fff; margin:0 0 8px; }
.cta-band p{ color:#C3D9F7; margin:0 0 20px; }
.cta-band .btn-primary{ background:#fff; color:var(--signal) !important; }

@media (max-width:900px){
    .feature-grid{ grid-template-columns:repeat(2,1fr); }
    .steps, .pay-showcase{ grid-template-columns:1fr; }
}

.site-footer{ border-top:1px solid var(--line); margin-top:56px; padding-top:36px; }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1.2fr; gap:34px; padding-bottom:28px; }
.footer-col h4{ margin:0 0 14px; font-size:.95rem; }
.footer-col > a{ display:block; color:var(--muted); font-size:.88rem; margin-bottom:9px; }
.footer-col > a:hover{ color:var(--signal); }
.footer-brand{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.footer-brand img{ width:36px; height:36px; border-radius:10px; object-fit:cover; border:1px solid var(--line); }
.footer-about{ color:var(--muted); font-size:.86rem; margin:0; line-height:1.7; max-width:34ch; }

.contact-line{ display:flex !important; align-items:center; gap:10px; }
.ci{ width:28px; height:28px; border-radius:8px; display:flex; align-items:center;
     justify-content:center; color:#fff; flex-shrink:0; }
.ci-wa{ background:#25D366; }
.ci-mail{ background:#EA4335; }
.ci-ig{ background:linear-gradient(45deg,#F58529,#DD2A7B,#8134AF); }
.ci-fb{ background:#1877F2; }

.footer-bottom{ border-top:1px solid var(--line); padding:18px 0 30px;
    text-align:center; color:var(--muted); font-size:.84rem; }

.contact-quick{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
    gap:12px; margin-bottom:24px; }
.contact-quick a{ display:flex; align-items:center; gap:11px; background:var(--panel);
    border:1px solid var(--line); border-radius:12px; padding:14px 16px; }
.contact-quick a:hover{ border-color:var(--signal); }
.contact-quick .label{ font-size:.76rem; color:var(--muted); display:block; }
.contact-quick .val{ font-weight:700; font-size:.88rem; }

@media (max-width:800px){
    .footer-grid{ grid-template-columns:1fr; gap:26px; }
}

.pkg-note{ color:var(--muted); font-size:.79rem; margin-bottom:8px; }
.pkg-row{ display:flex; justify-content:space-between; align-items:center;
    font-size:.85rem; padding:5px 0; border-bottom:1px dashed var(--line); }
.pkg-row:last-of-type{ border-bottom:none; }
.pkg-row span{ color:var(--muted); }
.pkg-row strong{ color:var(--text); }
.pkg-row.pkg-rate{ margin-top:6px; border-top:1px solid var(--line);
    border-bottom:none; padding-top:9px; }
.pkg-row.pkg-rate strong{ color:var(--signal); }

.quota-bar{ display:flex; align-items:center; gap:30px; flex-wrap:wrap;
    background:var(--panel); border:1px solid var(--line); border-radius:12px;
    padding:16px 20px; margin-bottom:20px; }
.quota-label{ display:block; color:var(--muted); font-size:.78rem; }
.quota-val{ font-weight:900; font-size:1.15rem; }
.quota-val.full{ color:var(--danger); }
.quota-bar .btn{ margin-inline-start:auto; }

.verify-icon{
    width:62px; height:62px; border-radius:50%; background:#25D366; color:#fff;
    display:flex; align-items:center; justify-content:center; margin:0 auto 16px;
}
.otp-input{
    width:100%; padding:16px; text-align:center; font-size:1.9rem; font-weight:800;
    letter-spacing:.5em; text-indent:.5em; border:2px solid var(--line); border-radius:12px;
    font-family:'IBM Plex Mono',monospace; direction:ltr; background:#fff; color:var(--text);
}
.otp-input:focus{ outline:none; border-color:var(--signal); box-shadow:0 0 0 3px var(--signal-dim); }

.soon-tag{
    display:inline-block; background:var(--panel-2); color:var(--muted);
    border:1px dashed var(--line); border-radius:999px;
    padding:2px 10px; font-size:.72rem; font-weight:800;
    margin-inline-start:8px; vertical-align:middle; white-space:nowrap;
}
.channel-row.row-soon{ opacity:.62; }
.channel-row.row-soon .price{ color:var(--muted); }

.sender-options{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:18px; }
.sender-card{ background:var(--panel); border:2px solid var(--line); border-radius:16px;
    padding:22px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:4px; }
.sender-card.selected{ border-color:var(--signal); box-shadow:0 8px 24px rgba(24,99,220,.12); }
.sender-ico{ font-size:1.9rem; }
.sender-card h4{ margin:6px 0 2px; font-size:1.05rem; }
.sender-card p{ color:var(--muted); font-size:.86rem; margin:0 0 8px; line-height:1.6; }
.sender-price{ font-weight:900; color:var(--signal); font-size:1.05rem; margin-bottom:12px; }
.save-tag{ background:#E4F7ED; color:#128C4A; border-radius:999px; padding:2px 9px;
    font-size:.72rem; font-weight:800; margin-inline-start:6px; }
.wa-qr{ width:260px; height:260px; border:8px solid #fff; border-radius:14px;
    box-shadow:0 4px 18px rgba(22,35,59,.14); }
.qr-placeholder{ padding:40px 20px; color:var(--muted); background:var(--panel-2);
    border:1px dashed var(--line); border-radius:12px; font-size:.9rem; }
.link-steps{ margin-top:18px; background:var(--panel-2); border-radius:12px; padding:18px; }
.link-steps h4{ margin:0 0 10px; font-size:.95rem; }
.link-steps ol{ margin:0; padding-inline-start:20px; color:var(--muted); font-size:.9rem; line-height:1.9; }
@media (max-width:760px){ .sender-options{ grid-template-columns:1fr; } .wa-qr{ width:230px; height:230px; } }

.sb-foot-row{ display:flex; align-items:center; gap:4px; padding:4px 2px; }
.sb-mini{ display:flex; align-items:center; justify-content:center; gap:7px;
    flex:1; padding:9px 6px; border-radius:9px; color:#A9BFE0;
    font-weight:600; font-size:.82rem; white-space:nowrap; overflow:hidden; }
.sb-mini:hover{ background:rgba(255,255,255,.07); color:#fff; }
.sb-mini .ico{ width:16px; height:16px; flex-shrink:0; }
.sb-sep{ width:1px; height:20px; background:rgba(255,255,255,.16); flex-shrink:0; }

.sidebar{ overflow-y:auto; }
.sb-nav{ gap:3px; }
.sb-link{ padding:9px 13px; }
.sb-user{ padding:10px 13px 2px; }

@media (max-height:760px){
    .sb-brand{ padding-bottom:14px; }
    .sb-link{ padding:7px 13px; font-size:.88rem; }
    .sb-nav{ gap:2px; }
    .sb-mini{ padding:7px 6px; font-size:.78rem; }
}
@media (max-height:640px){
    .sb-brand-sub{ display:none; }
    .sb-link{ padding:6px 12px; font-size:.85rem; }
    .sb-user{ padding-top:6px; }
    .sb-user-bal{ font-size:.72rem; }
}

svg.ico{ width:19px; height:19px; flex-shrink:0; display:block; }
.sb-mini svg.ico{ width:16px; height:16px; }
.sb-link svg.ico{ width:19px; height:19px; }

.sidebar{ overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch; }
.sb-nav{ min-height:0; }
.sb-foot{ flex-shrink:0; }
.sb-brand{ flex-shrink:0; }

@media (max-width:900px){
    .sidebar{
        width:min(84vw, 300px);
        padding-bottom:calc(20px + env(safe-area-inset-bottom));
        box-shadow:0 0 40px rgba(0,0,0,.35);
    }
    .sb-toggle{
        top:calc(10px + env(safe-area-inset-top));
        width:44px; height:44px;
    }
    body.sb-open{ overflow:hidden; }
    .main-inner{ padding:68px 16px 0; }
    .sb-link{ padding:12px 14px; font-size:.95rem; }
    .sb-mini{ padding:11px 6px; font-size:.85rem; }
    .dash-grid, .pricing-grid, .pay-methods, .sender-options{ grid-template-columns:1fr; }
    table{ display:block; overflow-x:auto; white-space:nowrap; }
    .quota-bar{ gap:18px; }
    .quota-bar .btn{ margin-inline-start:0; width:100%; }
    h2{ font-size:1.35rem; }
    .card{ padding:20px; }
}

@media (max-width:480px){
    .main-inner{ padding:64px 12px 0; }
    .card{ padding:16px; }
    .wa-qr{ width:min(78vw,240px); height:auto; }
    .otp-input{ font-size:1.5rem; letter-spacing:.35em; }
    .contact-quick{ grid-template-columns:1fr; }
    .stat .value{ font-size:1.45rem; }
}

.worker-card{ border:1px solid var(--line); border-radius:14px; padding:18px 20px;
    margin:18px 0 26px; background:var(--panel); }
.worker-card.ok{ border-inline-start:4px solid #12A150; }
.worker-card.down{ border-inline-start:4px solid var(--danger); background:#FEF6F7; }
.worker-head{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.worker-head strong{ font-size:1rem; }
.worker-age{ margin-inline-start:auto; color:var(--muted); font-size:.8rem; }
.worker-dot{ width:11px; height:11px; border-radius:50%; background:var(--danger); flex-shrink:0; }
.worker-dot.live{ background:#12A150; box-shadow:0 0 0 0 rgba(18,161,80,.55); animation:wpulse 2s infinite; }
@keyframes wpulse{
    0%{ box-shadow:0 0 0 0 rgba(18,161,80,.5); }
    70%{ box-shadow:0 0 0 10px rgba(18,161,80,0); }
    100%{ box-shadow:0 0 0 0 rgba(18,161,80,0); }
}
@media (prefers-reduced-motion: reduce){ .worker-dot.live{ animation:none; } }
.worker-warn{ margin-top:12px; color:var(--danger); font-weight:600; font-size:.9rem; }
.worker-stats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
    gap:14px; margin-top:16px; padding-top:14px; border-top:1px solid var(--line); }
.worker-stats .wl{ display:block; color:var(--muted); font-size:.76rem; }
.worker-stats .wv{ font-weight:800; font-size:.95rem; }
.worker-stats .wv.good{ color:#12A150; }
.worker-stats .wv.bad{ color:var(--danger); }

.pay-online-card{ border:2px solid var(--signal); box-shadow:0 8px 26px rgba(24,99,220,.12); }
.pay-online-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.instant-tag{ background:var(--signal-dim); color:var(--signal); border-radius:999px;
    padding:5px 14px; font-weight:800; font-size:.82rem; white-space:nowrap; }
.manual-divider{ display:flex; align-items:center; gap:14px; margin:26px 0; color:var(--muted); font-size:.86rem; }
.manual-divider::before, .manual-divider::after{ content:''; flex:1; height:1px; background:var(--line); }

.pay-result{ text-align:center; max-width:520px; margin:20px auto; padding:34px 26px; }
.pay-result h3{ margin:0 0 8px; }
.pay-result p{ color:var(--text); margin:0 0 14px; }
.pay-ico{ width:66px; height:66px; border-radius:50%; margin:0 auto 16px;
    display:flex; align-items:center; justify-content:center; font-size:1.9rem; font-weight:900; color:#fff; }
.pay-ico.good{ background:#12A150; }
.pay-ico.bad{ background:var(--danger); }
.pay-ico.pending{ background:var(--amber); }
.pay-ico.neutral{ background:var(--muted); }

.accepted-brands{ margin-top:18px; padding-top:16px; border-top:1px solid var(--line); }
.brands-label{ display:block; text-align:center; color:var(--muted); font-size:.78rem; margin-bottom:12px; }
.brand-row{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; align-items:center; }
.brand-chip{ display:inline-flex; align-items:center; justify-content:center;
    background:#fff; border:1px solid var(--line); border-radius:10px;
    height:42px; min-width:64px; padding:6px 12px; }
.brand-chip img{ max-height:26px; max-width:80px; object-fit:contain; display:block; }
.brand-chip em{ display:none; font-style:normal; font-size:.76rem; font-weight:700; color:var(--muted); white-space:nowrap; }
.brand-chip.brand-text em{ display:inline; }
@media (max-width:480px){
    .brand-chip{ height:38px; min-width:56px; padding:5px 9px; }
    .brand-chip img{ max-height:22px; max-width:64px; }
}

.accepted-brands {
    margin-top: 15px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.brands-label {
    font-size: 0.85rem;
    color: var(--muted);
}

.brand-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.brand-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 8px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid var(--border, #eee);
    border-radius: 6px;
    height: 32px;
}

.brand-chip img {
    height: 20px;
    width: auto;
    max-width: 45px;
    object-fit: contain;
    display: block;
}

.brand-chip em {
    display: none;
}

.brand-chip.brand-text em {
    display: inline;
    font-size: 0.75rem;
    font-style: normal;
    color: var(--muted);
}

.container p a:not(.btn):not(.brand):not(.lang-pill),
.container ul li a:not(.btn),
.faq a:not(.btn),
.alert a:not(.btn) {
    color: var(--signal);
    text-decoration: underline;
    text-underline-offset: 3px;
    font-weight: 600;
}
.container p a:not(.btn):hover,
.container ul li a:not(.btn):hover,
.faq a:not(.btn):hover,
.alert a:not(.btn):hover { opacity: .8; }
