*,*::before,*::after{box-sizing:border-box;margin:0;padding:0} :root{ --bg:#0F1117;--bg2:#181B24;--bg3:#1E2230;--bg4:#252A3A;--bg5:#2C3347; --border:#2A2F42;--border2:#343A52; --text:#F0F2F8;--text2:#9BA3C0;--text3:#6B748F; --green:#1D9E75;--green-bg:rgba(29,158,117,0.12);--green-text:#4ECFA0;--green-border:rgba(29,158,117,0.3); --blue:#2E7FD9;--blue-bg:rgba(46,127,217,0.12);--blue-text:#6BAEF0;--blue-border:rgba(46,127,217,0.3); --purple:#7C6FE0;--purple-bg:rgba(124,111,224,0.12);--purple-text:#A89FF0;--purple-border:rgba(124,111,224,0.3); --amber:#D98C2E;--amber-bg:rgba(217,140,46,0.12);--amber-text:#F0BB6B;--amber-border:rgba(217,140,46,0.3); --red:#D94F4F;--red-bg:rgba(217,79,79,0.1);--red-border:rgba(217,79,79,0.3); --r:10px;--rsm:7px;--rlg:14px; --font:"DM Sans",sans-serif;--mono:"DM Mono",monospace; } body{background:var(--bg);color:var(--text);font-family:var(--font);min-height:100vh;line-height:1.6;font-size:14px} .app{max-width:840px;margin:0 auto;padding:1.25rem 1.25rem 5rem} a{color:inherit} /* HEADER */ .hdr{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 0 1.5rem;border-bottom:1px solid var(--border);margin-bottom:0;flex-wrap:wrap;gap:10px} .logo{display:flex;align-items:center;gap:11px} .logo-icon{width:38px;height:38px;background:var(--green);border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0} .logo-title{font-size:16px;font-weight:600;letter-spacing:-.3px} .logo-sub{font-size:11px;color:var(--text2);margin-top:2px} .hdr-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap} /* NAV TABS */ .nav-tabs{display:flex;background:var(--bg3);border-bottom:1px solid var(--border);margin-bottom:1.5rem} .nav-tab{padding:12px 20px;font-size:13px;font-weight:500;color:var(--text2);background:transparent;border:none;border-bottom:2px solid transparent;cursor:pointer;font-family:var(--font);transition:all 0.15s;white-space:nowrap} .nav-tab:hover{color:var(--text)} .nav-tab.active{color:var(--green-text);border-bottom-color:var(--green)} /* TOGGLE */ .tg-group{display:flex;background:var(--bg3);border-radius:9px;padding:3px;border:1px solid var(--border)} .tg-btn{padding:5px 14px;font-size:12px;font-weight:500;border-radius:7px;border:none;background:transparent;color:var(--text2);cursor:pointer;transition:all .15s;font-family:var(--font)} .tg-btn.on{background:var(--bg4);color:var(--text);box-shadow:0 1px 4px rgba(0,0,0,.3)} /* ICON BTN */ .ibtn{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;font-size:12px;font-weight:500;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--text2);cursor:pointer;font-family:var(--font);transition:background .15s;text-decoration:none} .ibtn:hover{background:var(--bg3)} .ibtn svg{flex-shrink:0} /* SETTINGS */ .settings-wrap{background:var(--bg2);border:1px solid var(--border);border-radius:var(--rlg);padding:1.25rem 1.5rem;margin-bottom:1.25rem;display:none} .settings-wrap.open{display:block} .sg{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;margin-top:10px} .fc{grid-column:1/-1} .fl{font-size:10px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px;display:block} .fi{width:100%;padding:8px 11px;font-size:13px;border-radius:7px;border:1px solid var(--border);background:var(--bg3);color:var(--text);font-family:var(--font);outline:none;transition:border-color .15s} .fi:focus{border-color:var(--green)} .fi-hint{font-size:11px;color:var(--text3);margin-top:3px} /* CARD */ .card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--rlg);overflow:hidden;margin-bottom:1rem} .cs{padding:1rem 1.25rem;border-bottom:1px solid var(--border)} .cs:last-child{border-bottom:none} /* PASTE ZONE */ .pz{padding:1rem 1.25rem;border-bottom:1px solid var(--border);background:var(--bg2);transition:background .2s;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px} .pz.on{background:rgba(29,158,117,.07);border-bottom-color:var(--green-border)} .pz-icon{width:30px;height:30px;border-radius:8px;background:var(--bg4);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .2s} .pz.on .pz-icon{background:var(--green)} .pz-title{font-size:13px;font-weight:500} .pz.on .pz-title{color:var(--green-text)} .pz-sub{font-size:11px;color:var(--text2);margin-top:1px} .pz.on .pz-sub{color:var(--green)} .pz-prev{height:40px;width:58px;object-fit:cover;border-radius:6px;border:1px solid var(--green-border)} /* TEXTAREA */ textarea{width:100%;padding:10px 12px;font-size:13px;border-radius:8px;border:1px solid var(--border);background:var(--bg3);color:var(--text);font-family:var(--mono);line-height:1.65;resize:vertical;outline:none;transition:border-color .15s} textarea:focus{border-color:var(--green)} textarea::placeholder{color:var(--text3)} /* STATUS */ .sbar{padding:.65rem 1.25rem;background:var(--bg3);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px} .sdot{width:7px;height:7px;border-radius:50%;background:var(--green);flex-shrink:0;box-shadow:0 0 6px rgba(29,158,117,.5)} .mbadge{font-size:11px;padding:2px 10px;border-radius:6px;font-weight:500;display:none} .mbadge.on{display:inline-block} .mb-found{background:var(--green-bg);color:var(--green-text)} .mb-none{background:var(--amber-bg);color:var(--amber-text)} /* ACTION BAR */ .abar{padding:.875rem 1.25rem;background:var(--bg3);display:flex;justify-content:flex-end;align-items:center;gap:10px;flex-wrap:wrap} .err-txt{font-size:12px;color:#F08080;flex:1} .btn-pri{display:inline-flex;align-items:center;gap:8px;padding:10px 22px;font-size:13px;font-weight:600;border-radius:9px;border:none;background:var(--green);color:#fff;cursor:pointer;font-family:var(--font);letter-spacing:-.2px;transition:opacity .15s;white-space:nowrap} .btn-pri:disabled{opacity:.4;cursor:not-allowed} .btn-pri:not(:disabled):hover{opacity:.9} .btn-sec{display:inline-flex;align-items:center;gap:7px;padding:9px 16px;font-size:13px;border-radius:8px;border:1px solid var(--border2);background:transparent;color:var(--text2);cursor:pointer;font-family:var(--font);transition:background .15s} .btn-sec:hover{background:var(--bg4)} .btn-og{display:inline-flex;align-items:center;gap:7px;padding:9px 18px;font-size:13px;font-weight:500;border-radius:8px;border:1.5px solid var(--green);background:var(--green-bg);color:var(--green-text);cursor:pointer;font-family:var(--font)} .btn-og:hover{background:rgba(29,158,117,.2)} /* CHIPS */ .chips-row{display:flex;flex-wrap:wrap;gap:7px;padding:.875rem 1.25rem;border-bottom:1px solid var(--border)} .chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:7px;border:1px solid var(--border);background:var(--bg3)} .cl{font-size:10px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:.4px} .cv{font-size:12px;font-weight:500;color:var(--text)} .chip-em{background:var(--blue-bg);border-color:var(--blue-border);cursor:pointer} .chip-em .cl,.chip-em .cv{color:var(--blue-text)} .chip-lang{background:var(--purple-bg);border-color:var(--purple-border)} .chip-lang .cl,.chip-lang .cv{color:var(--purple-text)} /* MATCH PANEL */ .mtiles{padding:.875rem 1.25rem;border-bottom:1px solid var(--border);display:flex;flex-direction:column;gap:6px} .mtile{display:flex;align-items:center;gap:9px;padding:8px 12px;background:var(--green-bg);border-radius:8px;border:1px solid var(--green-border);flex-wrap:wrap} .mn{font-size:12px;font-weight:500;color:var(--green-text);flex:1;min-width:100px} .mm{font-size:11px;color:var(--text2)} .mprice{font-size:12px;font-weight:600;padding:2px 9px;background:rgba(29,158,117,.2);color:var(--green-text);border-radius:5px;flex-shrink:0} .mcat{font-size:10px;padding:2px 8px;background:rgba(29,158,117,.15);color:var(--green);border-radius:5px;font-weight:500;flex-shrink:0} .rel-row{padding:.6rem 1.25rem;display:flex;flex-wrap:wrap;gap:6px} .rel-chip{padding:3px 9px;background:var(--bg3);border-radius:6px;border:1px solid var(--border);font-size:11px;color:var(--text2)} .rel-p{color:var(--text3);margin-left:4px;font-size:10px} /* TABS */ .tab-bar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:1rem} .tab-btn{padding:8px 18px;font-size:13px;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--text2);cursor:pointer;font-family:var(--font);font-weight:400;transition:all .15s} .tab-btn:hover{background:var(--bg3)} .ta0{border-color:var(--green)!important;background:var(--green-bg)!important;color:var(--green-text)!important;font-weight:500!important} .ta1{border-color:var(--blue)!important;background:var(--blue-bg)!important;color:var(--blue-text)!important;font-weight:500!important} .ta2{border-color:var(--purple)!important;background:var(--purple-bg)!important;color:var(--purple-text)!important;font-weight:500!important} .ta3{border-color:var(--amber)!important;background:var(--amber-bg)!important;color:var(--amber-text)!important;font-weight:500!important} /* EMAIL CARD */ .ecard{background:var(--bg2);border:1px solid var(--border);border-radius:var(--rlg);overflow:hidden;display:none} .ecard.active{display:block} .e-to{padding:.75rem 1.25rem;border-bottom:1px solid var(--border);background:var(--bg3);display:flex;align-items:center;gap:10px} .e-to-lbl{font-size:10px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:.5px;flex-shrink:0} .e-to-val{font-size:13px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1} .e-subj{padding:.875rem 1.25rem;background:var(--bg3);border-bottom:1px solid var(--border);display:flex;align-items:flex-start;gap:10px} .e-subj-txt{font-size:14px;font-weight:500;line-height:1.4;flex:1} .e-body{padding:1.25rem 1.5rem} .e-body pre{font-size:13.5px;line-height:1.85;color:var(--text);white-space:pre-wrap;font-family:var(--font)} .copy-bar{padding:.75rem 1.25rem;border-top:1px solid var(--border);display:flex;gap:8px;flex-wrap:wrap;align-items:center} .cbtn{display:inline-flex;align-items:center;gap:7px;padding:9px 18px;font-size:13px;font-weight:500;border-radius:8px;border:1.5px solid;cursor:pointer;font-family:var(--font);background:transparent;transition:all .15s} .cb0{border-color:var(--green);color:var(--green-text)} .cb0:hover{background:var(--green-bg)} .cb1{border-color:var(--blue);color:var(--blue-text)} .cb1:hover{background:var(--blue-bg)} .cb2{border-color:var(--purple);color:var(--purple-text)} .cb2:hover{background:var(--purple-bg)} .cb3{border-color:var(--amber);color:var(--amber-text)} .cb3:hover{background:var(--amber-bg)} .scbtn{padding:5px 11px;font-size:11px;border-radius:6px;border:1px solid var(--border);background:transparent;color:var(--text2);cursor:pointer;font-family:var(--font);transition:all .15s;white-space:nowrap} .scbtn:hover{background:var(--bg4)} .scbtn.ok{background:var(--green-bg);color:var(--green-text);border-color:var(--green-border)} .gmail-lnk{margin-left:auto;display:inline-flex;align-items:center;gap:6px;padding:9px 14px;font-size:12px;border-radius:8px;border:1px solid var(--border2);background:transparent;color:var(--text2);text-decoration:none;font-family:var(--font);transition:background .15s;white-space:nowrap} .gmail-lnk:hover{background:var(--bg4)} /* TRANSLATE */ .tblock{margin:0 1.25rem 1rem;border:1px solid var(--purple-border);border-radius:10px;overflow:hidden} .thdr{padding:9px 14px;background:var(--purple-bg);display:flex;align-items:center;justify-content:space-between} .tlbl{font-size:12px;font-weight:500;color:var(--purple-text);display:flex;align-items:center;gap:6px} .tbtn{padding:5px 12px;font-size:12px;font-weight:500;border-radius:6px;border:1px solid var(--purple-border);background:transparent;color:var(--purple-text);cursor:pointer;font-family:var(--font);transition:background .15s} .tbtn:hover{background:rgba(124,111,224,.15)} .tbody-t{padding:1rem 1.25rem;background:var(--bg2);display:none} .tbody-t.open{display:block} .tbody-t pre{font-size:13.5px;line-height:1.85;color:var(--text);white-space:pre-wrap;font-family:var(--font)} /* BULK */ .btbl{width:100%;border-collapse:collapse;font-size:12px} .btbl th{padding:8px 12px;text-align:left;font-weight:500;color:var(--text2);background:var(--bg3);border-bottom:1px solid var(--border)} .btbl td{padding:8px 12px;border-bottom:1px solid var(--border)} .btbl tr:nth-child(even) td{background:rgba(255,255,255,.015)} .spill{font-size:10px;font-weight:500;padding:3px 9px;border-radius:6px;white-space:nowrap} .sp-p{background:var(--bg4);color:var(--text2)} .sp-r{background:var(--blue-bg);color:var(--blue-text)} .sp-d{background:var(--green-bg);color:var(--green-text)} .sp-e{background:var(--red-bg);color:#F08080} .pbout{height:4px;border-radius:2px;background:var(--bg4);overflow:hidden} .pbin{height:100%;border-radius:2px;background:var(--green);transition:width .4s ease} .prev-card{flex:1;min-width:180px;padding:10px 12px;background:var(--bg3);border-radius:8px;border:1px solid var(--border)} /* BANNER */ .api-banner{background:var(--red-bg);border:1px solid var(--red-border);border-radius:var(--r);padding:12px 16px;margin-bottom:1rem;display:none;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap} .api-banner.show{display:flex} /* HOW TO USE */ .howto{padding:.5rem 0} .h2sec{margin-bottom:2rem} .h2title{font-size:15px;font-weight:600;color:var(--text);margin-bottom:.75rem;display:flex;align-items:center;gap:10px} .h2num{width:26px;height:26px;border-radius:8px;background:var(--green-bg);border:1px solid var(--green-border);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--green-text);flex-shrink:0} .h2body{font-size:13px;color:var(--text2);line-height:1.8;margin-left:36px} .h2body strong{color:var(--text)} .h2body code{font-family:var(--mono);font-size:12px;background:var(--bg3);padding:1px 7px;border-radius:4px;color:var(--amber-text)} .qa-card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r);padding:1rem 1.25rem;margin-bottom:.75rem} .qa-q{font-size:13px;font-weight:500;color:var(--text);margin-bottom:.5rem;display:flex;align-items:flex-start;gap:8px} .qa-q::before{content:"Q";width:20px;height:20px;border-radius:5px;background:var(--blue-bg);color:var(--blue-text);font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px} .qa-a{font-size:13px;color:var(--text2);line-height:1.7;padding-left:28px} .qa-a strong{color:var(--text)} .feat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin-top:.5rem} .feat-card{background:var(--bg3);border:1px solid var(--border);border-radius:var(--r);padding:.875rem 1rem} .feat-icon{font-size:20px;margin-bottom:6px} .feat-title{font-size:12px;font-weight:600;color:var(--text);margin-bottom:3px} .feat-desc{font-size:11px;color:var(--text2);line-height:1.6} .tip-box{background:var(--green-bg);border:1px solid var(--green-border);border-radius:var(--r);padding:.875rem 1rem;margin-top:1rem;font-size:12.5px;color:var(--green-text);line-height:1.7} /* ANIM */ @keyframes spin{to{transform:rotate(360deg)}} .spin{animation:spin .9s linear infinite;display:inline-block} @keyframes fadeUp{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}} .fu{animation:fadeUp .25s ease} /* INBOX LEAD CARDS */ .lead-card{display:flex;align-items:center;gap:12px;padding:.875rem 1.125rem;background:var(--bg2);border:1px solid var(--border);border-radius:var(--r);margin-bottom:8px;cursor:pointer;transition:all .15s} .lead-card:hover{border-color:var(--green);background:var(--bg3);transform:translateX(2px)} .lead-avatar{width:36px;height:36px;border-radius:50%;background:var(--green-bg);color:var(--green-text);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;flex-shrink:0;border:1px solid var(--green-border)} .lead-country{font-size:10px;font-weight:600;padding:2px 8px;background:var(--blue-bg);color:var(--blue-text);border-radius:5px;border:1px solid var(--blue-border)} .lead-action{color:var(--text3);flex-shrink:0;transition:color .15s} .lead-card:hover .lead-action{color:var(--green-text)} /* WHATSAPP CARD */ .wa-card{background:linear-gradient(135deg,rgba(37,211,102,0.08),rgba(37,211,102,0.02));border:1px solid rgba(37,211,102,0.3);border-radius:var(--rlg);overflow:hidden;margin-bottom:1rem} .wa-header{padding:.875rem 1.25rem;background:rgba(37,211,102,0.1);border-bottom:1px solid rgba(37,211,102,0.2);display:flex;align-items:center;gap:8px} .wa-icon{width:24px;height:24px;background:#25D366;border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:white;font-size:13px;font-weight:700} .wa-title{font-size:13px;font-weight:600;color:#4ADE80} .wa-body{padding:1rem 1.25rem} .wa-body pre{font-size:13.5px;line-height:1.75;color:var(--text);white-space:pre-wrap;font-family:var(--font);background:rgba(0,0,0,0.15);padding:.875rem 1rem;border-radius:8px;border:1px solid var(--border)} .wa-actions{padding:.75rem 1.25rem;background:rgba(37,211,102,0.04);border-top:1px solid rgba(37,211,102,0.15);display:flex;gap:10px;flex-wrap:wrap;align-items:center} .wa-copy-btn{display:inline-flex;align-items:center;gap:7px;padding:9px 18px;font-size:13px;font-weight:500;border-radius:8px;border:1.5px solid #25D366;color:#4ADE80;background:transparent;cursor:pointer;font-family:var(--font);transition:background .15s} .wa-copy-btn:hover{background:rgba(37,211,102,0.15)} .wa-copy-btn.ok{background:rgba(37,211,102,0.2)} .wa-send-btn{display:inline-flex;align-items:center;gap:7px;padding:9px 18px;font-size:13px;font-weight:600;border-radius:8px;background:#25D366;color:white;border:none;cursor:pointer;font-family:var(--font);text-decoration:none;transition:opacity .15s} .wa-send-btn:hover{opacity:.9} /* UTIL */ .hidden{display:none!important} .sep{height:1px;background:var(--border);margin:1.5rem 0}

Mediseller Connect

Sign in with your Nexus account to continue.