:root{--fl:#FF6B2B;--em:#C0392B;--ch:#1A0A00;--hn:#FFD166;--cr:#FFF5F0;--ap:#F5C4B3;--tx:#1A0A00;--mu:#7A5045;--gr:#2E7D32;--pu:#6200EA;--bl:#1565C0;--r:12px}
*{box-sizing:border-box;margin:0;padding:0}
html,body{font-family:'Inter',sans-serif;background:#EDE3DC;color:var(--tx)}
.login-page{position:fixed;inset:0;background:var(--ch);display:flex;align-items:center;justify-content:center;padding:24px;z-index:2000}
.login-page.hidden{display:none}
.lbox{width:100%;max-width:420px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:40px 36px}
.l-logo{font-size:28px;font-weight:900;color:white;letter-spacing:-1px;margin-bottom:5px}.l-logo span{color:var(--fl)}
.l-sub{font-size:13px;color:rgba(255,255,255,.35);margin-bottom:30px}
.l-label{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.4);display:block;margin-bottom:5px}
.l-inp{width:100%;padding:12px 14px;background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.1);border-radius:10px;color:white;font-size:14px;font-family:'Inter',sans-serif;margin-bottom:14px;transition:border-color .2s}
.l-inp:focus{outline:none;border-color:var(--fl)}
.l-inp::placeholder{color:rgba(255,255,255,.25)}
.l-btn{width:100%;padding:13px;background:var(--fl);border:none;border-radius:10px;color:white;font-size:14px;font-weight:700;font-family:'Inter',sans-serif;cursor:pointer}
.l-btn:hover{opacity:.85}
.l-hint{font-size:12px;color:rgba(255,255,255,.2);text-align:center;margin-top:12px}
.l-err{font-size:12px;color:#ef9999;text-align:center;min-height:18px;margin-bottom:8px}
.topbar{height:62px;background:var(--ch);display:flex;align-items:center;justify-content:space-between;padding:0 20px;position:sticky;top:0;z-index:300;border-bottom:.5px solid rgba(255,107,43,.15)}
.tbl{display:flex;align-items:center;gap:14px}
.tbl-logo{font-size:20px;color:white;font-weight:900;letter-spacing:-.5px}.tbl-logo span{color:var(--fl)}
.tbl-resto{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.07);border:.5px solid rgba(255,255,255,.1);padding:5px 12px;border-radius:8px;cursor:pointer;transition:background .15s}
.tbl-resto:hover{background:rgba(255,255,255,.12)}
.tbl-resto-logo{width:24px;height:24px;border-radius:6px;object-fit:cover;display:none}
.tbl-resto-logo.show{display:block}
.tbl-resto i{font-size:13px;color:rgba(255,255,255,.5)}
.tbl-resto span{font-size:13px;color:rgba(255,255,255,.75);font-weight:600}
.tbl-resto small{font-size:11px;color:rgba(255,255,255,.35);margin-left:2px}
.tbr{display:flex;align-items:center;gap:10px}
.plan-tag{background:rgba(255,183,77,.12);border:.5px solid rgba(255,183,77,.3);color:var(--hn);font-size:11px;font-weight:700;padding:4px 12px;border-radius:16px}
.abo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media(max-width:780px){.abo-grid{grid-template-columns:1fr}.sms-grid{grid-template-columns:1fr!important}}
.abo-card{background:white;border:1.5px solid #ece2da;border-radius:14px;padding:18px;position:relative;display:flex;flex-direction:column}
.abo-current-card{border-color:var(--fl);box-shadow:0 4px 18px rgba(255,107,43,.12)}
.abo-badge-pop{position:absolute;top:-9px;left:50%;transform:translateX(-50%);background:var(--fl);color:white;font-size:10px;font-weight:700;padding:3px 12px;border-radius:10px}
.abo-name{font-size:17px;font-weight:900;color:var(--ch)}
.abo-price{margin:6px 0 14px;color:var(--mu);font-size:13px}
.abo-num{font-size:30px;font-weight:900;color:var(--ch);letter-spacing:-1px}
.abo-feats{display:flex;flex-direction:column;gap:8px;margin-bottom:16px;flex:1}
.abo-feat{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--tx)}
.abo-feat i{font-size:14px;color:var(--gr);flex-shrink:0}
.abo-feat.off{color:#b9a89e}.abo-feat.off i{color:#d8cabf}
.abo-feat i.ti-message{color:var(--fl)}
.abo-btn{width:100%;justify-content:center}
.sms-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.sms-pack{background:white;border:1.5px solid #ece2da;border-radius:12px;padding:14px;text-align:center;position:relative}
.sms-pack-best{border-color:var(--fl)}
.sms-pack-tag{position:absolute;top:-8px;left:50%;transform:translateX(-50%);background:var(--fl);color:white;font-size:9px;font-weight:700;padding:2px 9px;border-radius:8px;white-space:nowrap}
.sms-pack-n{font-size:16px;font-weight:900;color:var(--ch)}
.sms-pack-p{font-size:22px;font-weight:900;color:var(--em);letter-spacing:-.5px;margin:3px 0}
.sms-pack-u{font-size:10px;color:var(--mu)}
.live{display:inline-flex;align-items:center;gap:5px;background:#fee2e2;color:#991b1b;font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px}
.live-dot{width:6px;height:6px;background:#ef4444;border-radius:50%;animation:pulse 1.5s infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.4)}}
.tb-av{position:relative;width:32px;height:32px;background:linear-gradient(135deg,var(--fl),var(--em));border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;color:white;cursor:pointer;border:none;font-family:'Inter',sans-serif;overflow:hidden}.tb-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%;display:none}.tb-av img.show{display:block}
.tb-av img{width:100%;height:100%;object-fit:cover;display:none}
.tb-av img.show{display:block}
.tb-logout{width:32px;height:32px;background:rgba(255,255,255,.06);border:.5px solid rgba(255,255,255,.1);border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.tb-logout:hover{background:rgba(192,57,43,.2)}
.tb-logout i{font-size:15px;color:rgba(255,255,255,.5)}
.tabs-bar{background:white;border-bottom:2px solid var(--ap);display:flex;gap:8px;overflow-x:auto;position:sticky;top:62px;z-index:200;padding:12px 16px;scroll-behavior:smooth}
.tabs-bar::-webkit-scrollbar{height:0}
.tn{padding:13px 17px;font-size:13.5px;font-weight:700;color:var(--tx);cursor:pointer;border:1px solid var(--ap);background:#fff;border-radius:12px;font-family:'Inter',sans-serif;display:flex;align-items:center;gap:7px;white-space:nowrap;transition:all .18s;flex:0 0 auto}
.tn:hover{background:#FDF0E9;border-color:rgba(255,107,43,.3)}
.tn.on{color:#fff;background:var(--fl);box-shadow:0 3px 10px rgba(255,107,43,.32)}
.tn.on .tnb{background:rgba(255,255,255,.25)!important;color:#fff!important}
.tn i{font-size:15px}
.tnb{font-size:10px;font-weight:700;padding:1px 6px;border-radius:8px;margin-left:2px;color:white}
.tnb-r{background:var(--em)}.tnb-g{background:var(--gr)}.tnb-p{background:var(--pu)}
.wrap{max-width:1060px;margin:0 auto;padding:24px 20px}
.page{display:none}.page.on{display:block}
.ph{margin-bottom:18px;display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:10px}
.ph-t{font-size:22px;font-weight:900;color:var(--ch);letter-spacing:-.5px}
.ph-s{font-size:12px;color:var(--mu);margin-top:3px}
.prow{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap;align-items:center}
.prow label{font-size:12px;font-weight:600;color:var(--mu)}
.pp{padding:8px 15px;border-radius:16px;font-size:12.5px;font-weight:700;cursor:pointer;border:1px solid var(--ap);background:white;color:var(--tx);transition:all .15s;font-family:'Inter',sans-serif}
.pp.on{background:var(--fl);color:#fff;border-color:var(--fl);box-shadow:0 2px 8px rgba(255,107,43,.28)}
.kg{display:grid;gap:12px;margin-bottom:14px}
.k5{grid-template-columns:repeat(5,1fr)}.k4{grid-template-columns:repeat(4,1fr)}.k3{grid-template-columns:repeat(3,1fr)}.k2{grid-template-columns:1fr 1fr}
.kpi{background:white;border-radius:var(--r);padding:15px 16px;border:.5px solid var(--ap);position:relative;overflow:hidden}
.kpi:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(26,10,0,.08)}
.kpi::before{content:'';position:absolute;top:0;left:0;width:3px;height:100%}
.kfl::before{background:var(--fl)}.kem::before{background:#FFB74D}.kgr::before{background:var(--gr)}.kgd::before{background:var(--hn)}.kpu::before{background:var(--pu)}.kbl::before{background:var(--bl)}
.kn{font-size:24px;font-weight:900;color:var(--em);line-height:1}
.kl{font-size:11px;color:var(--mu);margin-top:4px}
.kd{font-size:11px;font-weight:600;margin-top:4px}
.up{color:var(--gr)}.dn{color:var(--em)}.neu{color:var(--mu)}
.kico{position:absolute;right:12px;top:12px;font-size:20px;opacity:.1}
.card{background:white;border-radius:var(--r);border:.5px solid var(--ap);margin-bottom:14px}
.ch{padding:12px 16px;border-bottom:.5px solid var(--ap);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}
.ch h3{font-size:14px;font-weight:700;display:flex;align-items:center;gap:6px;color:var(--ch)}
.ch h3 i{color:var(--fl);font-size:15px}
.cb{padding:16px}
.bchart{height:90px;display:flex;align-items:flex-end;gap:4px}
.bc{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px}
.bc .b{width:100%;border-radius:3px 3px 0 0;cursor:pointer;position:relative;transition:height .4s ease}
.bc .b:hover::after{content:attr(data-t);position:absolute;bottom:calc(100%+4px);left:50%;transform:translateX(-50%);background:var(--ch);color:white;font-size:10px;padding:2px 7px;border-radius:4px;white-space:nowrap;z-index:5}
.bc span{font-size:9px;color:var(--mu)}
.hour-row{display:flex;align-items:flex-end;gap:3px;height:60px}
.hb{flex:1;border-radius:2px 2px 0 0;min-height:2px;transition:height .4s;cursor:pointer;position:relative}
.hb:hover::after{content:attr(data-t);position:absolute;bottom:calc(100%+4px);left:50%;transform:translateX(-50%);background:var(--ch);color:white;font-size:10px;padding:2px 6px;border-radius:4px;white-space:nowrap;z-index:5}
.hlabel{display:flex;gap:3px;margin-top:4px}
.hlabel span{flex:1;font-size:8px;color:var(--mu);text-align:center}
table{width:100%;border-collapse:collapse}
th{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--mu);padding:9px 14px;text-align:left;border-bottom:.5px solid var(--ap);background:#fdf8f5}
td{font-size:12px;padding:9px 14px;border-bottom:.5px solid #faf0eb;vertical-align:middle}
tr:last-child td{border-bottom:none}
tr:hover td{background:#fff8f5}
.chip{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:600;padding:3px 9px;border-radius:8px}
.cg{background:rgba(46,125,50,.1);color:var(--gr)}.co{background:rgba(255,107,43,.1);color:var(--em)}.cgr{background:#f0e8e2;color:var(--mu)}.cp{background:rgba(98,0,234,.08);color:var(--pu)}.cb2{background:rgba(21,101,192,.1);color:var(--bl)}
.trow{display:flex;align-items:center;justify-content:space-between;padding:11px 0;border-bottom:.5px solid var(--ap);gap:12px}
.trow:last-child{border-bottom:none}
.tname{font-size:13px;font-weight:600}.tdesc{font-size:11px;color:var(--mu);margin-top:2px}
.tog{width:40px;height:22px;background:var(--ap);border-radius:11px;cursor:pointer;position:relative;transition:background .2s;flex-shrink:0}
.tog.on{background:var(--fl)}
.tog::after{content:'';width:16px;height:16px;background:white;border-radius:50%;position:absolute;top:3px;left:3px;transition:left .2s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.tog.on::after{left:21px}
.step{display:flex;align-items:center;gap:6px}
.step button{width:28px;height:28px;border-radius:6px;border:.5px solid var(--ap);background:white;cursor:pointer;font-size:16px;color:var(--em);display:flex;align-items:center;justify-content:center;transition:all .15s;font-family:'Inter',sans-serif}
.step button:hover{background:var(--fl);color:white;border-color:var(--fl)}
.step span{font-size:17px;font-weight:900;min-width:32px;text-align:center}
.prog{height:6px;background:var(--ap);border-radius:3px;overflow:hidden}
.pf{height:100%;background:linear-gradient(90deg,var(--fl),var(--hn));border-radius:3px;transition:width .6s ease}
.btn{padding:9px 18px;border-radius:8px;font-size:13px;font-weight:700;border:none;cursor:pointer;font-family:'Inter',sans-serif;transition:all .15s;display:inline-flex;align-items:center;gap:6px}
.btn i{font-size:14px}
.bfl{background:var(--fl);color:white}.bfl:hover{background:var(--em)}
.bou{background:white;border:.5px solid var(--ap);color:var(--tx)}.bou:hover{background:var(--cr)}
.bgr{background:var(--gr);color:white}.bgr:hover{background:#1b5e20}
.bsm{padding:6px 13px;font-size:12px}.bxs{padding:4px 10px;font-size:11px}
.inp{width:100%;padding:8px 12px;border:.5px solid var(--ap);border-radius:8px;font-size:13px;font-family:'Inter',sans-serif;color:var(--tx);background:white;transition:border-color .15s}
.inp:focus{outline:none;border-color:var(--fl)}
.lab{font-size:11px;font-weight:600;color:var(--mu);display:block;margin-bottom:4px}
.ai{background:rgba(98,0,234,.05);border:.5px solid rgba(98,0,234,.2);border-radius:10px;padding:12px 14px;display:flex;gap:10px;margin-bottom:14px}
.ai i{color:var(--pu);font-size:19px;flex-shrink:0}
.ai p{font-size:12px;color:#3D0099;line-height:1.6}
.ai a{color:var(--pu);font-weight:700;cursor:pointer}
.av{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:white;flex-shrink:0}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.sep{height:.5px;background:var(--ap);margin:12px 0}
.feed-item{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-bottom:.5px solid #faf0eb}
.feed-item:last-child{border-bottom:none}
.fdi{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.fdi.earn{background:rgba(46,125,50,.1)}.fdi.earn i{color:var(--gr)}
.fdi.spend{background:rgba(255,107,43,.1)}.fdi.spend i{color:var(--em)}
.fdi.star{background:rgba(255,209,102,.2)}.fdi.star i{color:#92400e}
.fdi.tiktok{background:rgba(0,0,0,.07)}.fdi.aff{background:rgba(98,0,234,.08)}.fdi.aff i{color:var(--pu)}
.fdi.auto{background:rgba(46,125,50,.15)}.fdi.auto i{color:var(--gr)}
.fd-txt{flex:1}.fd-name{font-size:13px;font-weight:600}.fd-detail{font-size:11px;color:var(--mu);margin-top:1px}
.fd-time{font-size:11px;color:var(--mu);white-space:nowrap;margin-left:auto;flex-shrink:0}
.fd-pts{font-size:13px;font-weight:700;margin-left:8px;flex-shrink:0}
.fd-pts.earn{color:var(--gr)}.fd-pts.spend{color:var(--em)}
.auto-badge{display:inline-flex;align-items:center;gap:3px;font-size:10px;font-weight:700;background:rgba(46,125,50,.1);color:var(--gr);padding:1px 6px;border-radius:8px;margin-left:5px}
.fday{padding:7px 12px;border-radius:8px;border:1.5px solid var(--ap);background:white;cursor:pointer;font-size:12px;font-weight:600;transition:all .15s;font-family:'Inter',sans-serif}
.fday.on{background:var(--fl);border-color:var(--fl);color:white}
.roi-box{background:var(--ch);border-radius:var(--r);padding:20px;margin-bottom:14px}
.roi-box h3{font-size:15px;font-weight:800;color:var(--hn);margin-bottom:14px;display:flex;align-items:center;gap:6px}
.rf-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}
.rf-item{background:rgba(255,255,255,.06);border:.5px solid rgba(255,255,255,.12);border-radius:9px;padding:14px;text-align:center}
.rf-n{font-size:22px;font-weight:900;color:var(--hn)}
.rf-l{font-size:11px;color:rgba(255,255,255,.4);margin-top:3px}
.roi-lines{display:flex;flex-direction:column;gap:5px}
.rl{display:flex;justify-content:space-between;font-size:12px;color:rgba(255,255,255,.45);padding:5px 0;border-bottom:.5px solid rgba(255,255,255,.07)}
.rl:last-child{border-bottom:none}
.rl strong{color:white}
.rl.hl strong{color:var(--hn);font-size:14px}
.cad-row{display:grid;grid-template-columns:50px 1fr 160px 36px;gap:8px;align-items:center;background:var(--cr);border:.5px solid var(--ap);border-radius:9px;padding:10px 12px;margin-bottom:7px}
.cad-emoji{font-size:20px;text-align:center;border:.5px solid var(--ap);border-radius:6px;padding:3px;background:white;width:44px}
.cad-del{width:28px;height:28px;border-radius:6px;border:.5px solid var(--ap);background:white;cursor:pointer;color:var(--ap);font-size:13px;display:flex;align-items:center;justify-content:center;transition:all .15s}
.cad-del:hover{background:var(--em);color:white;border-color:var(--em)}
.rt th{background:var(--ch);color:var(--hn);font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:9px 14px;text-align:left}
.rt td{padding:11px 14px;border-bottom:.5px solid var(--ap);font-size:13px;vertical-align:middle}
.rt tr:last-child td{border-bottom:none}
.pts-big{font-size:22px;font-weight:900;color:var(--em)}
.act-row{display:flex;align-items:center;justify-content:space-between;background:var(--cr);border:.5px solid var(--ap);border-radius:9px;padding:11px 14px;margin-bottom:7px;flex-wrap:wrap;gap:8px}
.act-left{display:flex;align-items:center;gap:10px}
.act-left i{font-size:18px;color:var(--fl)}
.act-right{display:flex;align-items:center;gap:10px}
.pts-badge{font-size:18px;font-weight:900;color:var(--em);background:white;border:.5px solid var(--ap);padding:4px 14px;border-radius:8px;min-width:55px;text-align:center}
.auto-panel h3{font-size:16px;font-weight:800;color:var(--gr);margin-bottom:6px;display:flex;align-items:center;gap:7px}
.score-ring{text-align:center;padding:10px}
.ring-val{font-size:38px;font-weight:900;color:var(--em)}
.scenario{background:linear-gradient(135deg,rgba(255,107,43,.07),rgba(255,183,77,.07));border:1px solid rgba(255,107,43,.2);border-radius:var(--r);padding:16px;margin-bottom:14px}
.scenario h4{font-size:14px;font-weight:700;color:var(--ch);margin-bottom:10px;display:flex;align-items:center;gap:6px}
.sc-step{display:flex;align-items:flex-start;gap:8px;margin-bottom:7px}
.sc-num{width:22px;height:22px;background:var(--fl);color:white;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0;margin-top:2px}
.sc-text{font-size:12px;line-height:1.5;color:var(--tx)}
.sc-text strong{color:var(--em)}
.once{display:inline-flex;align-items:center;gap:3px;background:rgba(192,57,43,.1);color:var(--em);font-size:10px;font-weight:700;padding:2px 8px;border-radius:8px;margin-left:5px}
.once-banner{background:rgba(192,57,43,.06);border:.5px solid rgba(192,57,43,.2);border-radius:10px;padding:12px 14px;display:flex;gap:10px;margin-bottom:14px}
.once-banner i{color:var(--em);font-size:18px;flex-shrink:0;margin-top:1px}
.once-banner p{font-size:12px;line-height:1.6;color:var(--tx)}
.toast{position:fixed;top:16px;left:50%;transform:translateX(-50%) translateY(-120px);background:var(--ch);color:white;font-size:13px;font-weight:600;padding:12px 22px;border-radius:12px;transition:transform .35s cubic-bezier(.2,.9,.3,1.2);z-index:99999;box-shadow:0 8px 32px rgba(0,0,0,.28);white-space:normal;text-align:center;line-height:1.4;max-width:86%;width:max-content}
.toast.show{transform:translateX(-50%) translateY(0)}
.qr-sim-box{background:var(--ch);border-radius:var(--r);padding:16px}
.qr-sim-row{display:flex;justify-content:space-between;font-size:12px;color:rgba(255,255,255,.6);padding:4px 0}
/* PROFIL */
.prof-cfg{background:var(--ch);border-radius:var(--r);padding:20px;margin-bottom:14px}
.prof-cfg h3{font-size:15px;font-weight:800;color:var(--hn);margin-bottom:14px;display:flex;align-items:center;gap:6px}
.logo-upload{width:80px;height:80px;border-radius:var(--r);background:rgba(255,255,255,.08);border:2px dashed rgba(255,255,255,.2);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;position:relative;overflow:hidden;flex-shrink:0}
.logo-upload:hover{background:rgba(255,255,255,.12);border-color:var(--fl)}
.logo-upload img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;display:none}
.logo-upload img.show{display:block}
.logo-upload i{font-size:22px;color:rgba(255,255,255,.4)}
.logo-upload span{font-size:10px;color:rgba(255,255,255,.3);margin-top:3px}
.cfg-inp{width:100%;padding:10px 12px;background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.1);border-radius:8px;color:white;font-size:13px;font-family:'Inter',sans-serif;transition:border-color .2s;margin-bottom:10px}
.cfg-inp:focus{outline:none;border-color:var(--fl)}
.cfg-inp::placeholder{color:rgba(255,255,255,.25)}
.cfg-lab{font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:rgba(255,255,255,.4);display:block;margin-bottom:4px}
/* APP CLIENT PREVIEW */
.client-preview{background:#1A0A00;border-radius:12px;padding:16px;max-width:340px;margin:0 auto}
.cp-header{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.cp-logo{width:46px;height:46px;border-radius:10px;background:linear-gradient(135deg,var(--fl),var(--em));display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:900;color:white;overflow:hidden;flex-shrink:0}
.cp-logo img{width:100%;height:100%;object-fit:cover;display:none}
.cp-logo img.show{display:block}
.cp-nom{font-size:16px;font-weight:800;color:white}
.cp-ville{font-size:12px;color:rgba(255,255,255,.45)}
.cp-desc{font-size:11px;color:rgba(255,255,255,.55);line-height:1.5;margin-bottom:10px}
.cp-info{display:flex;flex-direction:column;gap:5px;margin-bottom:10px}
.cp-info-row{display:flex;align-items:center;gap:6px;font-size:11px;color:rgba(255,255,255,.45)}
.cp-info-row i{color:var(--fl);font-size:12px}
.cp-stats{display:flex;gap:6px;margin-top:10px;padding-top:10px;border-top:.5px solid rgba(255,255,255,.08)}
.cp-stat{flex:1;background:rgba(255,255,255,.06);border-radius:8px;padding:8px;text-align:center}
.cp-stat-n{font-size:18px;font-weight:900;color:var(--hn)}
.cp-stat-l{font-size:10px;color:rgba(255,255,255,.35)}
/* APP CLIENT (onglet séparé) */
.client-app{display:none;max-width:390px;margin:0 auto}
.client-app.on{display:block}
.phone-shell{background:white;border-radius:24px;overflow:hidden;box-shadow:0 20px 60px rgba(26,10,0,.2);border:1.5px solid var(--ap)}
.phone-status{height:40px;background:var(--ch);display:flex;align-items:center;justify-content:space-between;padding:0 18px}
.phone-time{font-size:13px;font-weight:700;color:white}
.phone-hd{background:var(--ch);padding:12px 16px 14px}
.phone-logo-row{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.phone-logo-img{width:36px;height:36px;border-radius:9px;object-fit:cover;display:none}
.phone-logo-img.show{display:block}
.phone-logo-init{width:36px;height:36px;border-radius:9px;background:linear-gradient(135deg,var(--fl),var(--em));display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:900;color:white}
.phone-resto-nm{font-size:15px;font-weight:800;color:white}
.phone-resto-vl{font-size:11px;color:rgba(255,255,255,.45);margin-top:1px}
.pts-card{background:rgba(255,107,43,.1);border:.5px solid rgba(255,107,43,.25);border-radius:12px;padding:13px 14px}
.pts-big-n{font-size:36px;font-weight:900;color:var(--hn);letter-spacing:-1.5px;line-height:1}
.pts-lbl{font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-top:2px}
.phone-content{background:#EDE3DC;padding:12px 14px}
.phone-info-card{background:white;border-radius:10px;padding:12px;margin-bottom:8px}
.phone-info-title{font-size:12px;font-weight:700;color:var(--ch);margin-bottom:8px;display:flex;align-items:center;gap:5px}
.phone-info-title i{color:var(--fl);font-size:13px}
.phone-info-row{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--mu);padding:4px 0}
.phone-info-row i{color:var(--fl);font-size:12px;flex-shrink:0}
.phone-bnav{background:white;border-top:.5px solid var(--ap);display:flex;height:54px}
.pbn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:none;background:transparent;cursor:pointer;font-family:'Inter',sans-serif}
.pbn i{font-size:18px;color:var(--mu)}
.pbn span{font-size:8px;font-weight:600;color:var(--mu)}
.pbn.on i,.pbn.on span{color:var(--fl)}
@media(max-width:700px){.tabs-bar{padding:11px 12px}.tn{padding:12px 15px;font-size:12.5px}.wrap{padding:14px 12px}.kg.k5,.kg.k4{grid-template-columns:repeat(2,1fr)}.g2,.g3{grid-template-columns:1fr}.rf-grid{grid-template-columns:1fr 1fr}.cad-row{grid-template-columns:44px 1fr}.topbar{padding:0 14px}}
/* ── Topbar responsive : plus de compression sur mobile ── */
@media(max-width:640px){
  .topbar{height:auto;padding:8px 12px;flex-wrap:wrap;gap:8px}
  .tbl{gap:9px;flex:1;min-width:0}
  .tbl-resto{padding:4px 9px;min-width:0}
  .tbl-resto span{max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
  .tbl-resto small{display:none}
  .tbl .live{display:none}
  .tbr{gap:8px}
  .plan-tag{font-size:10.5px;padding:4px 8px;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .tbl-logo{font-size:17px}
}
@media(max-width:380px){
  .plan-tag{display:none}
}

/* ── Barres fixes (topbar + onglets) sur toute la hauteur de défilement ── */
.topbar{position:fixed;top:0;left:0;right:0}
.tabs-bar{position:fixed;top:62px;left:0;right:0}
body{--topbar-h:62px;--tabs-h:66px}
/* Décaler le contenu sous les barres fixes */
#app-wrap{padding-top:calc(var(--topbar-h) + var(--tabs-h) + 8px)}

/* Interrupteurs on/off (fidélisation auto) */
.switch{position:relative;display:inline-block;width:48px;height:27px;flex-shrink:0}
.switch input{opacity:0;width:0;height:0}
.slider-sw{position:absolute;cursor:pointer;inset:0;background:#D4C4B4;border-radius:27px;transition:.25s}
.slider-sw:before{content:"";position:absolute;height:21px;width:21px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:.25s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.switch input:checked+.slider-sw{background:#FF6B2B}
.switch input:checked+.slider-sw:before{transform:translateX(21px)}

/* Champs sur fond clair (pages Fidélisation auto & Rapport ROI) */
#page-fidelisation .cfg-inp,
#page-rapport .cfg-inp{
  background:#FAF6F1;
  border:1.5px solid var(--ap);
  color:var(--tx);
}
#page-fidelisation .cfg-inp::placeholder,
#page-rapport .cfg-inp::placeholder{color:rgba(0,0,0,.3)}
#page-fidelisation .cfg-inp:focus,
#page-rapport .cfg-inp:focus{border-color:var(--fl)}
#page-fidelisation .cfg-lab,
#page-rapport .cfg-lab{color:var(--mu)}
/* Select : forcer texte sombre et flèche visible */
#page-fidelisation select.cfg-inp,
#page-rapport select.cfg-inp{
  -webkit-appearance:none;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;padding-right:34px;
}