/* ANI BROWSER v2.4 */
:root {
  --bg:#0c0c0e; --card:rgba(255,255,255,.04); --cardh:rgba(255,255,255,.07);
  --bdr:rgba(255,255,255,.07); --bdrh:rgba(255,255,255,.16);
  --a:#FF5A1F; --as:rgba(255,90,31,.14);
  --iv:#F2EDE4; --ivd:rgba(242,237,228,.5); --ivg:rgba(242,237,228,.1);
  --gr:#2ECC71; --fd:'Syne',sans-serif; --fb:'DM Sans',sans-serif;
  --r:10px; --rl:18px;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html,body{width:100%;height:100%;height:100dvh;overflow:hidden;background:var(--bg);color:var(--iv);font-family:var(--fb);font-size:14px;}

/* ── VIEWS ── */
.view{display:none;width:100%;height:100%;height:100dvh;position:fixed;inset:0;background:var(--bg);z-index:1;overflow:hidden;}
.view.active{display:flex;flex-direction:column;z-index:10;}
#view-home.active{display:flex;flex-direction:column;overflow:hidden;}

/* ── BG ── */
.bg-mesh{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;}
.mesh-orb{position:absolute;border-radius:50%;filter:blur(100px);opacity:.12;animation:drift 20s ease-in-out infinite;}
.orb-1{width:550px;height:550px;background:radial-gradient(circle,#FF5A1F,transparent 70%);top:-180px;left:-80px;}
.orb-2{width:450px;height:450px;background:radial-gradient(circle,#2ECC71,transparent 70%);bottom:-120px;right:-80px;animation-delay:-7s;}
.orb-3{width:350px;height:350px;background:radial-gradient(circle,#F5C518,transparent 70%);top:55%;left:50%;transform:translate(-50%,-50%);animation-delay:-14s;opacity:.07;}
@keyframes drift{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(25px,-15px) scale(1.04)}66%{transform:translate(-15px,25px) scale(.96)}}
.grain{position:fixed;inset:-50%;width:200%;height:200%;z-index:1;opacity:.02;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain .5s steps(1) infinite;}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-2px,2px)}40%{transform:translate(2px,-1px)}60%{transform:translate(-1px,-2px)}80%{transform:translate(1px,2px)}}

/* ── TOPBAR ── */
.topbar{position:relative;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:10px 14px;padding-top:max(10px,env(safe-area-inset-top));border-bottom:1px solid var(--bdr);backdrop-filter:blur(24px);background:rgba(12,12,14,.55);gap:8px;}
.topbar-left,.topbar-right{display:flex;align-items:center;gap:8px;min-width:0;}
.topbar-right{justify-content:flex-end;}
.topbar-center{display:flex;flex-direction:column;align-items:center;gap:3px;}
.logo{display:flex;align-items:center;gap:10px;}
.logo-img{width:32px;height:32px;border-radius:7px;}
.logo-text-wrap{display:flex;flex-direction:column;}
.logo-name{font-family:var(--fd);font-weight:800;font-size:18px;letter-spacing:.12em;line-height:1;}
.logo-motto{font-size:10px;color:var(--ivd);letter-spacing:.06em;}
.clock{font-family:var(--fd);font-size:30px;font-weight:700;color:var(--iv);letter-spacing:.04em;line-height:1;margin-left:160px;}
.date-text{font-size:11px;color:var(--ivd);letter-spacing:.1em;text-transform:uppercase;margin-left:160px;}
.info-pill{display:flex;align-items:center;gap:5px;background:var(--card);border:1px solid var(--bdr);border-radius:20px;padding:5px 11px;font-size:12px;color:var(--ivd);transition:border-color .2s;}
.info-pill:hover{border-color:var(--bdrh);color:var(--iv);}
.icon-btn{position:relative;display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:var(--card);border:1px solid var(--bdr);border-radius:var(--r);color:var(--ivd);cursor:pointer;transition:all .18s;}
.icon-btn:hover{background:var(--cardh);border-color:var(--a);color:var(--a);}
.pts-badge{position:absolute;top:-6px;right:-6px;background:var(--a);color:white;font-size:9px;font-weight:700;padding:2px 5px;border-radius:10px;min-width:18px;text-align:center;line-height:14px;}

/* ── MAIN ── */
.main-content{position:relative;z-index:10;flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:40px 40px 80px;}
.quote-wrap{text-align:center;max-width:540px;animation:up .8s cubic-bezier(.16,1,.3,1) both;}
@keyframes up{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
.daily-quote{font-family:var(--fd);font-size:14px;font-weight:600;color:var(--iv);line-height:1.6;font-style:italic;opacity:.85;}
.quote-author{display:block;font-size:11px;color:var(--ivd);margin-top:5px;letter-spacing:.08em;}

/* ── SEARCH ── */
.search-wrapper{width:580px;max-width:100%;animation:up .8s cubic-bezier(.16,1,.3,1) .08s both;}
.engine-tabs{display:flex;gap:4px;margin-bottom:8px;justify-content:center;}
.engine-tab{display:flex;align-items:center;gap:6px;padding:5px 14px;border:1px solid var(--bdr);border-radius:20px;background:var(--card);color:var(--ivd);font-size:12px;font-family:var(--fb);cursor:pointer;transition:all .15s;font-weight:500;}
.engine-tab:hover{color:var(--iv);border-color:var(--bdrh);}
.engine-tab.active{border-color:var(--a);background:var(--as);color:var(--iv);}
.search-form{display:flex;align-items:center;background:rgba(255,255,255,.055);border:1.5px solid var(--bdr);border-radius:var(--rl);overflow:hidden;transition:all .2s;}
.search-form:focus-within{border-color:var(--a);background:rgba(255,255,255,.08);box-shadow:0 0 0 3px var(--as),0 8px 28px rgba(0,0,0,.35);}
.search-input{flex:1;background:none;border:none;outline:none;padding:13px 18px;font-family:var(--fb);font-size:15px;color:var(--iv);}
.search-input::placeholder{color:var(--ivg);}
.search-btn{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--a);border:none;color:white;cursor:pointer;border-radius:0 var(--rl) var(--rl) 0;transition:background .15s;}
.search-btn:hover{background:#e04d15;}

/* ── QUICK LINKS ── */
.quick-links-row{display:flex;align-items:center;gap:8px;animation:up .8s cubic-bezier(.16,1,.3,1) .16s both;}
.quick-links-grid{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;}
.ql-item{position:relative;display:flex;flex-direction:column;align-items:center;gap:5px;padding:10px 14px;background:var(--card);border:1px solid var(--bdr);border-radius:var(--r);cursor:pointer;transition:all .18s;min-width:66px;}
.ql-item:hover{background:var(--cardh);border-color:var(--bdrh);transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.28);}
.ql-fav{width:26px;height:26px;border-radius:5px;overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:15px;background:var(--ivg);}
.ql-fav img{width:100%;height:100%;object-fit:cover;}
.ql-name{font-size:10px;color:var(--ivd);text-align:center;max-width:64px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ql-ext{position:absolute;top:4px;right:20px;font-size:8px;color:var(--ivg);}
.ql-rm{position:absolute;top:-5px;right:-5px;width:16px;height:16px;background:#e74c3c;border:none;border-radius:50%;color:white;font-size:9px;cursor:pointer;display:none;align-items:center;justify-content:center;line-height:1;}
.ql-item:hover .ql-rm{display:flex;}
.add-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:var(--card);border:1.5px dashed var(--bdr);border-radius:var(--r);color:var(--ivd);cursor:pointer;transition:all .18s;}
.add-btn:hover{border-color:var(--a);color:var(--a);background:var(--as);}

/* ── ADS ── */
.ads-row{display:flex;flex-direction:column;gap:10px;width:100%;max-width:800px;animation:up .8s cubic-bezier(.16,1,.3,1) .24s both;}
.ad-box{width:100%;border:1px solid var(--bdr);border-radius:var(--r);background:var(--card);overflow:visible;}
.ad-ani{border-color:rgba(255,90,31,.18);}
.ad-label{font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--ivg);padding:8px 16px 0;font-weight:600;}
.ad-inner{display:flex;align-items:center;gap:10px;padding:6px 12px 10px;}
.ad-txt{display:flex;flex-direction:column;gap:2px;flex:1;}
.ad-txt strong{font-size:12px;color:var(--iv);font-family:var(--fd);font-weight:700;}
.ad-txt span{font-size:10px;color:var(--ivd);}
.ad-cta{padding:5px 12px;background:var(--a);color:white;border:none;border-radius:6px;font-size:11px;font-weight:600;cursor:pointer;flex-shrink:0;transition:background .15s;font-family:var(--fb);}
.ad-cta:hover{background:#e04d15;}
.adsterra-wrap { padding: 4px 8px 8px; }
.adsterra-link { text-decoration: none; display: block; }
.adsterra-inner {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px;
  background: rgba(255,255,255,.04);
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.06);
  transition: all .18s;
  cursor: pointer;
}
.adsterra-inner:hover {
  background: rgba(255,90,31,.08);
  border-color: rgba(255,90,31,.2);
}
.adsterra-txt { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.adsterra-txt strong { font-size: 12px; color: var(--iv); font-family: var(--fd); font-weight: 700; }
.adsterra-txt span { font-size: 10px; color: var(--ivd); }
.adsterra-arrow { font-size: 12px; color: var(--a); flex-shrink: 0; font-weight: 600; white-space: nowrap; }

/* ── BOTTOMBAR ── */
.bottombar{position:relative;z-index:10;display:flex;align-items:center;gap:10px;padding:10px 16px;border-top:1px solid rgba(255,255,255,.12);background:rgba(20,20,24,.85);backdrop-filter:blur(20px);height:44px;font-size:12px;color:rgba(242,237,228,.55);}
.fb-brand{font-weight:600;letter-spacing:.05em;color:rgba(242,237,228,.75);}
.fb-sep{opacity:.3;}
.fb-pts{display:flex;align-items:center;gap:4px;color:rgba(242,237,228,.75);font-weight:600;}
.fb-ai{display:flex;align-items:center;gap:5px;margin-left:auto;color:rgba(242,237,228,.75);}
.ai-dot{width:7px;height:7px;border-radius:50%;background:#FFD93D;transition:all .3s;display:inline-block;}

/* ── BROWSER TOPBAR ── */
.browser-topbar{display:flex;align-items:center;gap:7px;padding:7px 12px;padding-top:max(10px,env(safe-area-inset-top));background:#111115;border-bottom:1px solid var(--bdr);min-height:50px;flex-shrink:0;}
.blogo{display:flex;align-items:center;gap:6px;font-family:var(--fd);font-weight:800;font-size:13px;letter-spacing:.06em;cursor:pointer;padding:4px 9px;border-radius:7px;transition:background .15s;flex-shrink:0;}
.blogo:hover{background:var(--card);}
.account-title{flex:1;font-family:var(--fd);font-weight:700;font-size:15px;letter-spacing:.05em;text-align:center;}
.nav-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:none;color:var(--ivd);cursor:pointer;border-radius:7px;transition:all .15s;flex-shrink:0;}
.nav-btn:hover{background:var(--card);color:var(--iv);}
.hbtn:hover{color:var(--a);}
.bsearch-form{flex:1;display:flex;align-items:center;background:rgba(255,255,255,.05);border:1px solid var(--bdr);border-radius:7px;overflow:hidden;transition:border-color .15s;}
.bsearch-form:focus-within{border-color:var(--a);}
.bsearch-input{flex:1;background:none;border:none;outline:none;padding:8px 11px;color:var(--iv);font-family:var(--fb);font-size:13px;}
.bsearch-input::placeholder{color:var(--ivg);}
.bsearch-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--a);border:none;color:white;cursor:pointer;}
.bsearch-btn:hover{background:#e04d15;}

/* ── AD STRIP ── */
.ad-strip{display:flex;align-items:center;background:rgba(255,90,31,.07);border-bottom:1px solid rgba(255,90,31,.18);padding:5px 14px;gap:10px;flex-shrink:0;min-height:34px;}
.ad-strip-inner{flex:1;display:flex;align-items:center;gap:10px;font-size:12px;color:var(--ivd);overflow:hidden;}
.ads-txt{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ads-txt strong{color:var(--iv);}
.ads-cta{background:var(--a);border:none;color:white;padding:3px 11px;border-radius:5px;font-size:11px;font-weight:600;cursor:pointer;flex-shrink:0;font-family:var(--fb);}
.ads-cta:hover{background:#e04d15;}
.ad-strip-close{background:none;border:none;color:var(--ivg);cursor:pointer;font-size:11px;padding:2px 5px;}

/* ── RESULTS ── */
.search-results-view{flex:1;overflow-y:auto;padding:20px 28px;background:var(--bg);display:flex;flex-direction:column;}
#result-container{display:flex;flex-direction:column;gap:14px;}

.ani-loading{display:flex;flex-direction:column;align-items:center;gap:10px;padding:30px;background:var(--card);border:1px solid var(--bdr);border-radius:var(--rl);}
.ani-dots{display:flex;gap:6px;}
.ani-dots span{width:8px;height:8px;background:var(--a);border-radius:50%;animation:dot 1.2s ease infinite;}
.ani-dots span:nth-child(2){animation-delay:.2s;}
.ani-dots span:nth-child(3){animation-delay:.4s;}
@keyframes dot{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.4);opacity:.4}}
.ani-load-txt{font-size:13px;color:var(--ivd);}
.ani-load-txt em{font-style:normal;color:var(--a);}

.ani-block{background:linear-gradient(135deg,rgba(255,90,31,.09),rgba(255,90,31,.02));border:1px solid rgba(255,90,31,.22);border-radius:var(--rl);padding:18px 20px;display:flex;flex-direction:column;gap:10px;}
.ani-block-hdr{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ivd);font-weight:600;}
.ai-badge{margin-left:auto;font-size:10px;background:rgba(46,204,113,.12);color:var(--gr);padding:2px 8px;border-radius:10px;border:1px solid rgba(46,204,113,.2);}
.ani-resume{font-size:14px;line-height:1.7;color:var(--iv);}

.osc{display:flex;align-items:center;gap:12px;background:rgba(46,204,113,.07);border:1px solid rgba(46,204,113,.2);border-radius:var(--rl);padding:14px 16px;}
.osc-icon{font-size:22px;flex-shrink:0;}
.osc-body{flex:1;}
.osc-lbl{font-size:10px;color:var(--gr);font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:3px;}
.osc-link{font-size:15px;font-weight:700;color:var(--gr);cursor:pointer;font-family:var(--fd);}
.osc-link:hover{text-decoration:underline;}
.osc-btn{padding:7px 14px;background:rgba(46,204,113,.15);border:1px solid rgba(46,204,113,.3);border-radius:8px;color:var(--gr);font-size:12px;font-weight:600;cursor:pointer;font-family:var(--fb);transition:all .15s;flex-shrink:0;}
.osc-btn:hover{background:rgba(46,204,113,.25);}

.sug-block,.links-block{display:flex;flex-direction:column;gap:8px;}
.sug-lbl{font-size:11px;color:var(--ivd);font-weight:600;letter-spacing:.04em;}
.sug-chips{display:flex;flex-wrap:wrap;gap:7px;}
.sug-chip{padding:7px 14px;background:rgba(255,255,255,.06);border:1px solid var(--bdr);border-radius:20px;color:var(--iv);font-size:12px;cursor:pointer;transition:all .15s;font-family:var(--fb);font-weight:500;}
.sug-chip:hover{background:var(--as);border-color:var(--a);}

.litem{display:flex;align-items:center;gap:10px;padding:10px 8px;border-radius:8px;transition:background .15s;border:1px solid transparent;}
.litem:hover{background:var(--card);border-color:var(--bdr);}
.litem-body{flex:1;min-width:0;cursor:pointer;}
.litem-title{font-size:13px;font-weight:600;color:var(--iv);font-family:var(--fd);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.litem-title:hover{color:var(--a);}
.litem-desc{font-size:11px;color:var(--ivd);}
.litem-open{flex-shrink:0;width:26px;height:26px;background:none;border:1px solid var(--bdr);border-radius:6px;color:var(--ivg);cursor:pointer;font-size:13px;display:flex;align-items:center;justify-content:center;transition:all .15s;}
.litem-open:hover{border-color:var(--a);color:var(--a);}

.g-row{display:flex;gap:8px;flex-wrap:wrap;}
.btn-g,.btn-bing{display:flex;align-items:center;gap:7px;padding:9px 16px;border:1px solid var(--bdr);border-radius:8px;background:var(--card);color:var(--ivd);font-size:12px;cursor:pointer;transition:all .15s;font-family:var(--fb);font-weight:500;}
.btn-g:hover{border-color:#4285F4;color:var(--iv);}
.btn-bing:hover{border-color:#0078D4;color:var(--iv);}

/* ── ACCOUNT ── */
.account-body{flex:1;overflow-y:auto;padding:22px 26px;display:flex;flex-direction:column;gap:14px;max-width:760px;margin:0 auto;width:100%;}
.points-hero{display:flex;align-items:center;gap:24px;background:linear-gradient(135deg,rgba(255,90,31,.1),rgba(255,90,31,.03));border:1px solid rgba(255,90,31,.2);border-radius:var(--rl);padding:22px 24px;}
.points-ring{position:relative;width:110px;height:110px;flex-shrink:0;}
.ring-svg{width:110px;height:110px;transform:rotate(-90deg);}
.ring-bg{fill:none;stroke:rgba(255,255,255,.07);stroke-width:8;}
.ring-fill{fill:none;stroke:var(--a);stroke-width:8;stroke-linecap:round;transition:stroke-dashoffset 1s cubic-bezier(.4,0,.2,1),stroke .3s;}
.ring-inner{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;}
.ring-icon{width:20px;height:20px;object-fit:contain;}
.ring-pts{font-family:var(--fd);font-size:22px;font-weight:800;color:var(--iv);line-height:1;}
.ring-lbl{font-size:10px;color:var(--ivd);letter-spacing:.06em;}
.ph-text{flex:1;}
.ph-title{font-family:var(--fd);font-size:18px;font-weight:800;color:var(--iv);margin-bottom:5px;}
.ph-sub{font-size:12px;color:var(--ivd);line-height:1.5;margin-bottom:10px;}
.level-badge{display:inline-flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--bdr);border-radius:20px;padding:6px 14px;font-size:13px;font-weight:600;}
.lbadge-img{width:18px;height:18px;object-fit:contain;}

.metrics-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.metric-card{background:var(--card);border:1px solid var(--bdr);border-radius:var(--r);padding:14px;display:flex;flex-direction:column;gap:6px;transition:border-color .2s;}
.metric-card:hover{border-color:var(--bdrh);}
.m-icon{width:24px;height:24px;object-fit:contain;}
.m-val{font-family:var(--fd);font-size:20px;font-weight:800;color:var(--iv);}
.m-lbl{font-size:11px;color:var(--ivd);}

.s-card{background:var(--card);border:1px solid var(--bdr);border-radius:var(--rl);padding:16px 18px;}
.s-title{font-family:var(--fd);font-size:14px;font-weight:700;letter-spacing:.04em;margin-bottom:12px;color:var(--iv);}
.earn-list{display:flex;flex-direction:column;gap:2px;}
.earn-row{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:8px;transition:background .15s;}
.earn-row:hover{background:var(--cardh);}
.earn-row.soon{opacity:.55;}
.earn-icon{width:22px;height:22px;object-fit:contain;flex-shrink:0;}
.earn-txt{flex:1;display:flex;flex-direction:column;gap:2px;}
.earn-txt strong{font-size:13px;color:var(--iv);font-weight:600;}
.earn-txt span{font-size:11px;color:var(--ivd);}
.earn-pts{font-family:var(--fd);font-size:13px;font-weight:700;color:var(--a);white-space:nowrap;flex-shrink:0;}
.soon-tag{font-size:10px;background:var(--as);color:var(--a);padding:3px 9px;border-radius:10px;font-weight:600;font-family:var(--fb);}

.chart-bars{display:flex;align-items:flex-end;gap:8px;height:90px;padding-top:20px;}
.chart-col{display:flex;flex-direction:column;align-items:center;gap:4px;flex:1;}
.chart-val{font-size:9px;color:var(--ivd);min-height:12px;}
.chart-bwrap{flex:1;display:flex;align-items:flex-end;width:100%;}
.chart-bar{width:100%;border-radius:4px 4px 0 0;transition:height .5s cubic-bezier(.4,0,.2,1);min-height:3px;}
.chart-lbl{font-size:10px;color:var(--ivd);text-align:center;}

.levels-list{display:flex;flex-direction:column;gap:6px;}
.lv-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:8px;background:rgba(255,255,255,.02);}
.lv-item.current{background:rgba(255,90,31,.08);border:1px solid rgba(255,90,31,.2);}
.lv-item.locked{opacity:.45;}
.lv-img{width:26px;height:26px;object-fit:contain;flex-shrink:0;}
.lv-txt{flex:1;}
.lv-txt strong{display:block;font-size:13px;color:var(--iv);font-weight:600;}
.lv-txt span{font-size:11px;color:var(--ivd);}
.cur-tag{font-size:10px;background:var(--a);color:white;padding:3px 9px;border-radius:10px;font-weight:600;}
.done-tag{font-size:14px;color:var(--gr);font-weight:700;}
.lock-img{width:16px;height:16px;object-fit:contain;opacity:.6;}

/* ── MODAL ── */
.modal-overlay{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.55);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;}
.modal{background:#18181c;border:1px solid var(--bdrh);border-radius:var(--rl);padding:26px 30px;width:360px;box-shadow:0 24px 60px rgba(0,0,0,.6);animation:minIn .2s cubic-bezier(.16,1,.3,1);}
@keyframes minIn{from{opacity:0;transform:scale(.95) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}
.modal-title{font-family:var(--fd);font-size:17px;font-weight:700;margin-bottom:18px;}
.modal-field{display:flex;flex-direction:column;gap:5px;margin-bottom:12px;}
.modal-field label{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ivd);font-weight:600;}
.modal-input{background:var(--card);border:1px solid var(--bdr);border-radius:7px;padding:9px 13px;color:var(--iv);font-family:var(--fb);font-size:13px;outline:none;transition:border-color .15s;width:100%;}
.modal-input:focus{border-color:var(--a);}
.modal-input::placeholder{color:var(--ivg);}
.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:18px;}
.btn-cancel,.btn-save{padding:8px 18px;border-radius:7px;border:none;font-family:var(--fb);font-size:12px;font-weight:600;cursor:pointer;transition:all .15s;}
.btn-cancel{background:var(--card);color:var(--ivd);border:1px solid var(--bdr);}
.btn-cancel:hover{color:var(--iv);}
.btn-save{background:var(--a);color:white;}
.btn-save:hover{background:#e04d15;}

/* ══════════════════════════════════
   WIDGET FLOTTANT v2.4
   ══════════════════════════════════ */
.fw{position:fixed;bottom:80px;right:20px;z-index:9999;display:flex;flex-direction:column;align-items:flex-end;gap:8px;}

.fw-btn{width:44px;height:44px;background:#111115;border:1.5px solid rgba(255,90,31,.55);border-radius:12px;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 20px rgba(255,90,31,.28);transition:all .2s;}
.fw-btn:hover{transform:scale(1.08);border-color:var(--a);box-shadow:0 6px 24px rgba(255,90,31,.42);}

.fw-panel{width:290px;background:#18181c;border:1px solid rgba(255,255,255,.1);border-radius:16px;box-shadow:0 16px 40px rgba(0,0,0,.6);display:none;flex-direction:column;overflow:hidden;margin-bottom:6px;}
.fw-panel.open{display:flex;animation:fwIn .2s cubic-bezier(.16,1,.3,1);}
@keyframes fwIn{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}

/* Tabs — icônes uniquement */
.fw-tabs{display:flex;background:rgba(255,255,255,.04);border-bottom:1px solid rgba(255,255,255,.07);}
.fw-tab{flex:1;display:flex;align-items:center;justify-content:center;padding:11px 4px;background:none;border:none;cursor:pointer;border-bottom:2px solid transparent;transition:all .18s cubic-bezier(.4,0,.2,1);opacity:.4;}
.fw-tab:hover{opacity:.8;}
.fw-tab.active{opacity:1;border-bottom-color:var(--a);}
.fw-tab:active{transform:scale(.9);}
.fw-tab img{width:18px;height:18px;object-fit:contain;}

/* Panes */
.fw-pane{display:none;flex-direction:column;padding:14px;gap:8px;}
.fw-pane.active{display:flex;}
.fw-pane-title{font-size:10px;font-weight:700;color:var(--ivd);letter-spacing:.06em;text-transform:uppercase;}

/* Inputs dans le widget */
.fw-input{flex:1;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:8px 10px;color:var(--iv);font-size:13px;outline:none;font-family:var(--fb);width:100%;}
.fw-input:focus{border-color:var(--a);}
.fw-input::placeholder{color:var(--ivg);}
.fw-row{display:flex;gap:6px;}
.fw-go{width:34px;height:34px;background:var(--a);border:none;border-radius:8px;color:white;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s;}
.fw-go:hover{background:#e04d15;}

/* Results */
.fw-result{font-size:12px;color:rgba(242,237,228,.85);line-height:1.55;max-height:110px;overflow-y:auto;padding:4px 0;}
.fw-links{display:flex;gap:5px;flex-wrap:wrap;margin-top:4px;}
.fw-chip{font-size:10px;padding:3px 8px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:10px;color:var(--ivd);cursor:pointer;transition:all .15s;font-family:var(--fb);}
.fw-chip:hover{background:var(--as);border-color:var(--a);color:var(--iv);}

/* Lang row */
.fw-lang-row{display:flex;align-items:center;gap:6px;}
.fw-arrow{color:var(--ivd);font-size:14px;flex-shrink:0;}
.fw-select{flex:1;background:#252528;border:1px solid rgba(255,255,255,.18);border-radius:7px;padding:7px 8px;color:#F2EDE4;font-family:var(--fb);font-size:12px;outline:none;cursor:pointer;}
.fw-select option{background:#252528;color:#F2EDE4;}
.fw-action-btn{padding:9px;background:var(--a);border:none;border-radius:8px;color:white;font-size:12px;font-weight:600;cursor:pointer;font-family:var(--fb);transition:background .15s;}
.fw-action-btn:hover{background:#e04d15;}

/* Calculatrice */
#fw-calc-disp{font-family:var(--fd);font-size:26px;font-weight:700;color:var(--iv);text-align:right;padding:6px 4px;min-height:40px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
#fw-calc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;}
.cc{padding:11px 6px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;font-family:var(--fb);transition:all .1s;}
.cc:active{transform:scale(.92);}
.cc.num{background:rgba(255,255,255,.08);color:var(--iv);}
.cc.num:hover{background:rgba(255,255,255,.14);}
.cc.func{background:rgba(255,255,255,.14);color:var(--iv);}
.cc.op{background:rgba(255,90,31,.18);color:var(--a);}
.cc.op:hover{background:rgba(255,90,31,.28);}
.cc.eq{background:var(--a);color:white;}
.cc.eq:hover{background:#e04d15;}
.cc.wide{grid-column:span 2;}
.kb-hint{font-size:10px;color:rgba(242,237,228,.35);text-align:center;margin-top:6px;letter-spacing:.03em;padding:2px 0;}

/* Convertisseur */
.fw-note{font-size:10px;color:var(--ivg);text-align:center;}

/* Notes */
.fw-notes-area{background:rgba(255,255,255,.04);border:1px solid var(--bdr);border-radius:8px;padding:10px;color:var(--iv);font-family:var(--fb);font-size:12px;resize:none;outline:none;min-height:130px;line-height:1.6;}
.fw-notes-area:focus{border-color:var(--a);}
.fw-notes-area::placeholder{color:var(--ivg);}
.fw-notes-footer{display:flex;align-items:center;justify-content:space-between;margin-top:6px;}
.fw-clear-btn{font-size:10px;background:none;border:none;color:var(--ivg);cursor:pointer;font-family:var(--fb);}
.fw-clear-btn:hover{color:#e74c3c;}

/* AD dans widget */
.fw-ad{display:flex;align-items:center;gap:10px;background:rgba(255,90,31,.07);border-top:1px solid rgba(255,90,31,.15);padding:8px 12px;font-size:11px;color:rgba(242,237,228,.55);}
#fw-ad-text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;}
#fw-ad-link{color:var(--a);text-decoration:none;font-weight:600;font-size:11px;flex-shrink:0;white-space:nowrap;transition:opacity .15s;}
#fw-ad-link:hover{opacity:.8;text-decoration:underline;}

/* ── TOAST ── */
.toast{position:fixed;bottom:70px;left:50%;transform:translateX(-50%) translateY(16px);background:#1c1c22;border:1px solid var(--bdrh);color:var(--iv);padding:9px 18px;border-radius:9px;font-size:12px;z-index:9999;opacity:0;pointer-events:none;transition:all .25s;white-space:nowrap;box-shadow:0 8px 24px rgba(0,0,0,.4);}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* Actualité dans le résumé ANI */
.ani-actu {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  background: rgba(255,255,255,.04);
  border-left: 2px solid var(--a);
  border-radius: 0 6px 6px 0;
  padding: 10px 12px;
  margin-top: 8px;
}
.actu-dot { font-size: 14px; flex-shrink: 0; margin-top: 1px; }
.actu-txt { font-size: 12px; color: var(--ivd); line-height: 1.6; white-space: normal; word-break: break-word; overflow-wrap: break-word; }

/* ════════════════════════════════════
   ANI PWA — OVERRIDES (single source)
   ════════════════════════════════════ */

/* CSP compliance — replace inline styles */
.modal-overlay        { display: none; }
.fw-btn-img           { border-radius: 6px; }
.fw-input-translate   { margin-bottom: 8px; }
.fw-cresult           { font-size: 18px; font-weight: 700; color: var(--a); text-align: center; padding: 8px 0; }
.chart-bar            { height: var(--h, 2%); width: 100%; border-radius: 4px 4px 0 0; background: rgba(255,90,31,.3); min-height: 3px; }
.chart-bar.chart-bar-today { background: var(--a); }

/* No clock in PWA */
.clock, .date-text, .topbar-center { display: none !important; }

/* No quick-link arrows */
.ql-ext { display: none; }

/* ── VIEW STACK ── */
/* All views are fixed full-screen layers */
html, body { overflow: hidden; height: 100%; height: 100dvh; }

.view {
  display: none;
  position: fixed;
  inset: 0;
  background: var(--bg);
  flex-direction: column;
  overflow: hidden;
  /* iOS safe area handled per element */
}
.view.active { display: flex; }

/* Home view = topbar (fixed height) + content (scrollable) + bottombar (fixed height) */
#view-home.active      { flex-direction: column; }
#view-home .topbar     { flex: 0 0 auto; }
#view-home .main-content {
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  /* reset desktop values */
  height: auto !important;
  justify-content: flex-start;
  padding: 24px 32px 120px;
  gap: 22px;
}
#view-home .bottombar  { flex: 0 0 auto; }

/* Search view */
#view-search.active             { flex-direction: column; }
#view-search .browser-topbar    { flex: 0 0 auto; }
#view-search .ad-strip          { flex: 0 0 auto; }
#view-search .search-results-view {
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

/* Account view */
#view-account.active            { flex-direction: column; }
#view-account .browser-topbar   { flex: 0 0 auto; }
#view-account .account-body     {
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  padding: 20px 24px 100px;
}

/* Bottombar always at bottom of its flex container */
.bottombar {
  flex: 0 0 auto;
  padding-bottom: max(9px, env(safe-area-inset-bottom));
  height: auto;
  min-height: 40px;
}

/* Widget above iOS home indicator */
.fw {
  bottom: max(80px, calc(70px + env(safe-area-inset-bottom)));
}

/* ── TOPBAR: pills always visible ──
   Remove min-width so left+right share space properly */
.topbar {
  padding: 10px 16px;
  gap: 8px;
}
.topbar-left  { min-width: 0; gap: 8px; }
.topbar-right { min-width: 0; gap: 8px; flex-shrink: 0; }
.info-pill    { flex-shrink: 0; }

/* ── MOBILE ── */
@media (max-width: 640px) {
  .topbar { padding: 8px 12px; gap: 6px; }
  .topbar-left { gap: 6px; }
  .topbar-right { gap: 5px; }
  .logo-motto { display: none; }
  .logo-name  { font-size: 15px; }
  .logo-img   { width: 26px; height: 26px; border-radius: 6px; }
  .info-pill  { padding: 4px 8px; font-size: 10px; gap: 3px; }
  .icon-btn   { width: 32px; height: 32px; }

  /* On very small screens hide location text, keep icon */
  @media (max-width: 380px) {
    #location-name { display: none; }
  }

  #view-home .main-content {
    padding: 24px 16px 120px;
    gap: 20px;
  }

  .search-wrapper { width: 100%; max-width: 100%; }
  .search-input   { font-size: 16px; }
  .engine-tab     { padding: 5px 10px; font-size: 11px; }

  .quick-links-grid { gap: 6px; flex-wrap: wrap; justify-content: flex-start; }
  .ql-item  { min-width: 62px; max-width: 78px; padding: 8px 6px; }
  .ql-name  { font-size: 9px; }

  .ads-row  { flex-direction: column; gap: 8px; }
  .ad-box   { width: 100%; }

  .account-body { padding: 14px 14px 100px; }
  .metrics-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .points-hero  { flex-direction: column; align-items: center; text-align: center; gap: 14px; padding: 16px; }
  .ph-sub { display: none; }
  .s-card { padding: 12px 14px; }

  .fw-panel { width: 265px; }
}

/* Touch targets */
@media (pointer: coarse) {
  .search-btn   { width: 52px; height: 52px; }
  .search-input { padding: 14px 16px; }
  .engine-tab   { min-height: 38px; }
  .cc           { padding: 13px 6px; }
  .fw-tab       { padding: 12px 4px; }
  .nav-btn      { width: 36px; height: 36px; }
}

/* ── Fin styles ── */
/* ── Bannière promo rotative ── */
.promo-banner-wrap{display:flex;align-items:flex-start;padding:12px 16px 18px;width:100%;min-height:60px;border-radius:8px;cursor:pointer;transition:background .2s;box-sizing:border-box;}
.promo-banner-wrap:active{background:rgba(255,255,255,.04);}
.promo-icon{display:none;}
.promo-content{display:flex;flex-direction:column;gap:10px;flex:1;min-width:0;}
.promo-msg{font-size:12px;color:var(--iv);line-height:1.5;white-space:normal;}
.promo-cta{background:var(--a);color:#fff;border:none;border-radius:6px;padding:8px 16px;font-size:11.5px;font-weight:600;cursor:pointer;align-self:flex-start;transition:opacity .15s;white-space:nowrap;}
.promo-cta:active{opacity:.8;}

/* ── PWA standalone safe-area ── */
@media all and (display-mode:standalone){
  .topbar{padding-top:max(18px,env(safe-area-inset-top));background:rgba(12,12,14,.99);}
  .browser-topbar{padding-top:max(18px,env(safe-area-inset-top));min-height:calc(50px + max(0px,env(safe-area-inset-top)));}
  .bottombar{padding-bottom:max(20px,env(safe-area-inset-bottom));}
}

/* ══ LAUNCHER ══════════════════════════════════ */
#view-launcher { z-index: 9999; }
.launcher-bg {
  width: 100%; height: 100%;
  background: #FF5A1F;
  display: flex; align-items: center; justify-content: center;
}
.launcher-content {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 12px; padding: 40px 32px;
  text-align: center;
}
.launcher-logo {
  width: 96px; height: 96px; border-radius: 22px;
  box-shadow: 0 8px 32px rgba(0,0,0,.25);
  animation: launcher-pop .5s cubic-bezier(.34,1.56,.64,1) both;
}
@keyframes launcher-pop {
  from { transform: scale(.6); opacity: 0; }
  to   { transform: scale(1);  opacity: 1; }
}
.launcher-name {
  font-family: var(--fd, sans-serif);
  font-size: 28px; font-weight: 800;
  color: #fff; letter-spacing: -.5px;
  animation: launcher-up .4s ease .2s both;
}
.launcher-tagline {
  font-size: 13px; color: rgba(255,255,255,.8);
  animation: launcher-up .4s ease .3s both;
}
@keyframes launcher-up {
  from { transform: translateY(10px); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}
.launcher-ad {
  min-height: 0; width: 100%; max-width: 320px;
  animation: launcher-up .4s ease .35s both;
}
/* Zone pub : texte promo ANI injecté dynamiquement */
.launcher-ad-inner {
  background: rgba(255,255,255,.15); border-radius: 12px;
  padding: 12px 16px; color: #fff; font-size: 13px; line-height: 1.5;
  backdrop-filter: blur(8px);
}
.launcher-ad-cta {
  display: inline-block; margin-top: 8px;
  background: #fff; color: #FF5A1F;
  font-size: 12px; font-weight: 700; border-radius: 20px;
  padding: 5px 14px; cursor: pointer; border: none;
  transition: opacity .15s;
}
.launcher-ad-cta:active { opacity: .8; }
.launcher-loader {
  animation: launcher-up .4s ease .4s both;
  width: 180px;
}
.launcher-bar {
  height: 3px; background: rgba(255,255,255,.3);
  border-radius: 99px; overflow: hidden;
}
.launcher-progress {
  height: 100%; background: #fff; border-radius: 99px;
  width: 0%; transition: width .05s linear;
}

/* ══ INTERSTITIELLE ═══════════════════════════ */
#view-interstitial { z-index: 9998; }
.inter-bg {
  width: 100%; height: 100%;
  background: #0C0C0E;
  display: flex; flex-direction: column;
}

/* Header */
.inter-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px;
  padding-top: max(14px, env(safe-area-inset-top));
  background: #111115;
  border-bottom: 1px solid rgba(255,255,255,.07);
  flex-shrink: 0;
}
.inter-brand {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 700; color: var(--iv, #e8e8f0);
}
.inter-brand img { border-radius: 6px; }
.inter-skip-wrap { display: flex; align-items: center; gap: 8px; }
.inter-skip-label { font-size: 11px; color: var(--ivd, #888); }
.inter-skip-btn {
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12);
  color: var(--iv, #e8e8f0); border-radius: 20px;
  padding: 5px 12px; font-size: 11px; font-weight: 600; cursor: pointer;
  transition: all .2s; white-space: nowrap;
}
.inter-skip-btn:disabled { opacity: .35; cursor: not-allowed; }
.inter-skip-btn:not(:disabled) {
  background: rgba(255,90,31,.15);
  border-color: rgba(255,90,31,.4);
  color: #FF5A1F;
}

/* Zone pub */
.inter-ad-zone {
  flex: 1 1 0; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
  position: relative;
  background: #0C0C0E;
}
/* Image pub — s'adapte à l'espace disponible sur tous les écrans */
.inter-pub-img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 10px;
}
/* Desktop : limiter la taille max */
@media (min-width: 641px) {
  .inter-pub-img {
    max-width: min(100%, 700px);
    max-height: min(100%, 480px);
  }
}
/* Mobile : occuper tout l'espace vertical disponible */
@media (max-width: 640px) {
  .inter-pub-img {
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    object-fit: contain;
  }
}
.inter-fallback {
  display: flex; flex-direction: column; align-items: center;
  gap: 16px; text-align: center; padding: 32px;
}
.inter-fallback-icon { font-size: 52px; line-height: 1; }
.inter-fallback-msg {
  font-size: 15px; color: var(--iv, #e8e8f0);
  line-height: 1.6; max-width: 280px;
}

/* Footer */
.inter-footer {
  flex-shrink: 0;
  padding: 16px;
  padding-bottom: max(20px, env(safe-area-inset-bottom));
  background: #111115;
  border-top: 1px solid rgba(255,255,255,.07);
  display: flex; flex-direction: column; gap: 10px;
}
.inter-pts-msg {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; color: var(--ivd, #888);
}
.inter-pts-icon { font-size: 18px; }
.inter-progress-bar {
  height: 4px; background: rgba(255,255,255,.1);
  border-radius: 99px; overflow: hidden;
}
.inter-progress-fill {
  height: 100%; width: 0%;
  background: #FF5A1F; border-radius: 99px;
  transition: width .1s linear;
}
.inter-goto-btn {
  width: 100%; padding: 14px;
  background: rgba(255,90,31,.12);
  border: 1px solid rgba(255,90,31,.25);
  border-radius: 12px; color: #FF5A1F;
  font-size: 14px; font-weight: 600; cursor: pointer;
  transition: all .2s;
}
.inter-goto-btn.ready {
  background: #FF5A1F; color: #fff;
  border-color: #FF5A1F;
  box-shadow: 0 4px 20px rgba(255,90,31,.35);
}

/* ══ AUTH VIEW ════════════════════════════════ */
.auth-body {
  flex: 1 1 0; overflow-y: auto; -webkit-overflow-scrolling: touch;
  padding: 20px 20px 40px; display: flex; flex-direction: column; gap: 16px;
}
.auth-tabs {
  display: flex; gap: 0; border-radius: 10px; overflow: hidden;
  border: 1px solid var(--bdr); flex-shrink: 0;
}
.auth-tab {
  flex: 1; padding: 11px; background: transparent;
  border: none; color: var(--ivd); font-size: 13px; font-weight: 600;
  cursor: pointer; transition: all .2s;
}
.auth-tab.active { background: var(--a); color: #fff; }

.auth-msg {
  padding: 12px 14px; border-radius: 10px; font-size: 13px; line-height: 1.4;
}
.auth-msg.error { background: rgba(231,76,60,.15); color: #e74c3c; border: 1px solid rgba(231,76,60,.3); }
.auth-msg.success { background: rgba(46,204,113,.15); color: #2ecc71; border: 1px solid rgba(46,204,113,.3); }

.auth-panel { display: flex; flex-direction: column; gap: 14px; }
.auth-field { display: flex; flex-direction: column; gap: 6px; }
.auth-field label { font-size: 12px; font-weight: 600; color: var(--ivd); }
.auth-field input {
  background: var(--card); border: 1px solid var(--bdr); border-radius: 10px;
  padding: 12px 14px; color: var(--iv); font-size: 14px; outline: none;
  transition: border-color .2s; -webkit-appearance: none;
}
.auth-field input:focus { border-color: var(--a); }
.auth-field input::placeholder { color: var(--ivg); }

.auth-btn-primary {
  background: var(--a); color: #fff; border: none; border-radius: 12px;
  padding: 14px; font-size: 15px; font-weight: 700; cursor: pointer;
  transition: opacity .2s; margin-top: 4px;
}
.auth-btn-primary:active { opacity: .85; }
.auth-btn-primary:disabled { opacity: .5; cursor: not-allowed; }

.auth-separator {
  display: flex; align-items: center; gap: 12px; color: var(--ivg); font-size: 12px;
}
.auth-separator::before, .auth-separator::after {
  content: ''; flex: 1; height: 1px; background: var(--bdr);
}

.auth-btn-google {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  background: var(--card); border: 1px solid var(--bdr); border-radius: 12px;
  padding: 12px; color: var(--iv); font-size: 14px; font-weight: 600;
  cursor: pointer; transition: border-color .2s;
}
.auth-btn-google:active { border-color: var(--a); }

.auth-btn-link {
  background: none; border: none; color: var(--a);
  font-size: 13px; cursor: pointer; padding: 4px 0; text-align: center;
}
.auth-hint { font-size: 13px; color: var(--ivd); line-height: 1.5; margin: 0; }

/* ── Sync banner ── */
.sync-banner {
  display: flex; align-items: center; gap: 12px;
  background: rgba(255,90,31,.08); border: 1px solid rgba(255,90,31,.2);
  border-radius: 12px; padding: 14px; margin-bottom: 4px;
}
.sync-banner-txt { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.sync-banner-txt strong { font-size: 13px; color: var(--iv); }
.sync-banner-txt span { font-size: 11.5px; color: var(--ivd); line-height: 1.4; }
.sync-banner-btn {
  background: var(--a); color: #fff; border: none; border-radius: 8px;
  padding: 8px 12px; font-size: 12px; font-weight: 700; cursor: pointer;
  white-space: nowrap; flex-shrink: 0;
}

/* ── Profil connecté ── */
.user-profile-card {
  display: flex; align-items: center; gap: 12px;
  background: var(--card); border: 1px solid var(--bdr);
  border-radius: 12px; padding: 14px; margin-bottom: 4px;
}
.upc-avatar {
  width: 42px; height: 42px; border-radius: 50%;
  background: var(--a); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; font-weight: 700; flex-shrink: 0;
}
.upc-info { flex: 1; min-width: 0; }
.upc-name { font-size: 14px; font-weight: 700; color: var(--iv); }
.upc-email { font-size: 11.5px; color: var(--ivd); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.upc-logout {
  background: rgba(255,255,255,.06); border: 1px solid var(--bdr);
  color: var(--ivd); border-radius: 8px; padding: 6px 10px;
  font-size: 11px; cursor: pointer; white-space: nowrap; flex-shrink: 0;
}

/* ══ CASHBACK VIEW ════════════════════════════ */
.cashback-body {
  flex: 1 1 0; overflow-y: auto; -webkit-overflow-scrolling: touch;
  padding: 20px; display: flex; flex-direction: column; gap: 20px;
}

/* Caméra scanner */
.cb-camera-wrap {
  position: relative; width: 100%; aspect-ratio: 1/1;
  background: #000; border-radius: 16px; overflow: hidden;
  display: none;
}
.cb-camera-wrap.active { display: block; }
.cb-video { width: 100%; height: 100%; object-fit: cover; display: block; }
.cb-canvas { display: none; }

/* Cadre de scan animé */
.cb-scan-frame {
  position: absolute; inset: 20%; pointer-events: none;
}
.cb-scan-corner {
  position: absolute; width: 24px; height: 24px;
  border-color: #FF5A1F; border-style: solid;
}
.cb-scan-corner.tl { top: 0; left: 0; border-width: 3px 0 0 3px; border-radius: 4px 0 0 0; }
.cb-scan-corner.tr { top: 0; right: 0; border-width: 3px 3px 0 0; border-radius: 0 4px 0 0; }
.cb-scan-corner.bl { bottom: 0; left: 0; border-width: 0 0 3px 3px; border-radius: 0 0 0 4px; }
.cb-scan-corner.br { bottom: 0; right: 0; border-width: 0 3px 3px 0; border-radius: 0 0 4px 0; }

.cb-scan-line {
  position: absolute; left: 0; right: 0; top: 0;
  height: 2px; background: #FF5A1F;
  box-shadow: 0 0 8px #FF5A1F;
  animation: cb-scan 2s ease-in-out infinite;
}
@keyframes cb-scan {
  0%, 100% { top: 0; }
  50%       { top: calc(100% - 2px); }
}
.cb-scan-hint {
  position: absolute; bottom: 12px; left: 0; right: 0;
  text-align: center; font-size: 12px; color: rgba(255,255,255,.7);
}
.cb-stop-btn {
  background: rgba(255,255,255,.08); border: 1px solid var(--bdr);
  color: var(--ivd); border-radius: 12px; padding: 12px;
  font-size: 14px; cursor: pointer; width: 100%;
}

/* Saisie manuelle */
.cb-panel { display: flex; flex-direction: column; gap: 14px; }
.cb-manual-icon { font-size: 48px; text-align: center; }
.cb-manual-hint { font-size: 13px; color: var(--ivd); text-align: center; line-height: 1.5; margin: 0; }

/* Historique */
.cb-history { display: flex; flex-direction: column; gap: 10px; }
.cb-history-title { font-size: 11px; font-weight: 700; color: var(--ivd); letter-spacing: .1em; text-transform: uppercase; }
.cb-history-list { display: flex; flex-direction: column; gap: 8px; }
.cb-empty { font-size: 13px; color: var(--ivg); text-align: center; padding: 16px 0; }
.cb-history-item {
  display: flex; align-items: center; justify-content: space-between;
  background: var(--card); border: 1px solid var(--bdr); border-radius: 10px; padding: 12px 14px;
}
.cb-history-left { display: flex; flex-direction: column; gap: 2px; }
.cb-history-partner { font-size: 13px; font-weight: 700; color: var(--iv); }
.cb-history-desc { font-size: 11px; color: var(--ivd); }
.cb-history-pts { font-size: 16px; font-weight: 800; color: #FF5A1F; }

/* ── Bouton cashback topbar ── */
#open-cashback {
  background: transparent !important;
  border: none !important;
  padding: 4px !important;
  width: 34px; height: 34px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
#open-cashback img {
  width: 22px; height: 22px;
  filter: brightness(0) invert(1);
  opacity: .8;
  transition: opacity .2s;
}
#open-cashback:active img { opacity: 1; }

/* ── Bouton cashback flottant — au-dessus du widget ── */
.cb-fab {
  position: fixed;
  bottom: 140px; /* widget à 80px + 44px + 16px gap */
  right: 20px;
  z-index: 9999;
  width: 44px; height: 44px;
  background: #111115;
  border: 1.5px solid rgba(255,90,31,.55);
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  box-shadow: 0 4px 20px rgba(255,90,31,.28);
  transition: all .2s;
  padding: 0;
}
.cb-fab:hover  { transform: scale(1.08); border-color: var(--a); box-shadow: 0 6px 24px rgba(255,90,31,.42); }
.cb-fab:active { transform: scale(.95); }
.cb-fab-img {
  width: 24px; height: 24px;
  display: block;
  object-fit: contain;
}

/* Bouton lien dans pub texte interstitielle */
.inter-ad-link-btn {
  background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.3);
  color: #fff; border-radius: 20px; padding: 8px 20px;
  font-size: 13px; font-weight: 600; cursor: pointer; margin-top: 8px;
}

* { touch-action: manipulation; }
input, textarea, select { touch-action: auto; } /* garder scroll normal dans les champs */

/* ── Fix bouton recherche visible dans topbar ── */
#view-search .browser-topbar {
  flex-wrap: nowrap;
  overflow: visible;
}
#view-search .bsearch-form {
  flex: 1 1 0;
  min-width: 0;
}
#view-search .bsearch-btn {
  flex-shrink: 0;
  width: 34px; height: 34px;
}
#view-search .nav-btn,
#view-search .hbtn {
  flex-shrink: 0;
}
#view-search .blogo {
  flex-shrink: 1;
  min-width: 0;
  overflow: hidden;
}

/* ── Espacement boutons flottants — plus de juxtaposition ── */
.cb-fab {
  bottom: 148px !important; /* 80px fw + 44px fw-btn + 24px gap */
}

/* ── Icône cb-fab visible sur fond sombre ── */
#open-cashback { background: transparent !important; border: none !important; }

/* ── FIX bouton recherche coupé ── */
#view-search .bsearch-form {
  overflow: visible !important;
  border-radius: 7px;
}
#view-search .bsearch-btn {
  flex-shrink: 0 !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 0 7px 7px 0 !important;
  margin-right: 0;
}
#view-search .bsearch-input {
  min-width: 0;
}
/* Réduire logo pour gagner de la place */
#view-search .blogo {
  font-size: 13px;
  max-width: 52px;
  overflow: hidden;
  white-space: nowrap;
}

/* ── FIX icône check niveau — pas de filtre, déjà noire sur transparent ── */

/* Icône check : noire → orange ANI #FF5A1F */



/* ── Icône validation niveau ── */
.done-tag-img {
  width: 22px; height: 22px;
  object-fit: contain;
  flex-shrink: 0;
  mix-blend-mode: screen;
}

/* ══ FOOTER LÉGAL ═══════════════════════ */
.bottombar { flex-direction: column; height: auto; padding: 8px 16px; gap: 4px; }
.bottombar-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; width: 100%; }
.bottombar-legal { display: flex; align-items: center; gap: 6px; }
.legal-link { font-size: 10px; color: rgba(242,237,228,.35); text-decoration: none; transition: color .2s; }
.legal-link:hover, .legal-link:active { color: rgba(242,237,228,.7); }
.legal-sep { font-size: 10px; color: rgba(242,237,228,.2); }

/* ══ MODALS LÉGAUX ══════════════════════ */
.legal-modal { position: fixed; inset: 0; z-index: 99999; background: rgba(0,0,0,.75);
  backdrop-filter: blur(4px); display: flex; align-items: flex-end; justify-content: center; }
.legal-modal-inner { width: 100%; max-width: 600px; max-height: 80vh; background: #111115;
  border-radius: 20px 20px 0 0; border: 1px solid var(--bdr); display: flex; flex-direction: column; }
.legal-modal-header { display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px; border-bottom: 1px solid var(--bdr); flex-shrink: 0; }
.legal-modal-title { font-size: 16px; font-weight: 700; color: var(--iv); }
.legal-modal-close { background: rgba(255,255,255,.08); border: none; color: var(--ivd);
  width: 28px; height: 28px; border-radius: 50%; cursor: pointer; font-size: 13px; }
.legal-modal-body { overflow-y: auto; padding: 20px; flex: 1; -webkit-overflow-scrolling: touch; }
.legal-modal-body h3 { font-size: 13px; font-weight: 700; color: var(--iv); margin: 16px 0 6px; }
.legal-modal-body h3:first-child { margin-top: 0; }
.legal-modal-body p { font-size: 13px; color: var(--ivd); line-height: 1.6; margin-bottom: 8px; }

/* ══ VUE PARRAINAGE ═════════════════════ */
.referral-body { flex: 1 1 0; overflow-y: auto; -webkit-overflow-scrolling: touch;
  padding: 24px 20px 40px; display: flex; flex-direction: column; gap: 16px; }
.referral-hero { text-align: center; padding: 8px 0 16px; }
.referral-icon { font-size: 52px; margin-bottom: 12px; }
.referral-title { font-size: 26px; font-weight: 800; color: var(--iv); line-height: 1.3; margin-bottom: 10px; }
.referral-sub { font-size: 15px; color: var(--ivd); line-height: 1.6; }
.referral-sub strong { color: #FF5A1F; }
.referral-code-card { background: var(--card); border: 1.5px solid rgba(255,90,31,.3);
  border-radius: 16px; padding: 20px; text-align: center; display: flex; flex-direction: column; gap: 8px; }
.referral-code-label { font-size: 11px; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: var(--ivd); }
.referral-code { font-size: 32px; font-weight: 800; color: #FF5A1F; letter-spacing: .2em; font-family: monospace; }
.referral-code-url { font-size: 11px; color: var(--ivg); word-break: break-all; }
.referral-stats { display: flex; gap: 12px; }
.referral-stat { flex: 1; background: var(--card); border: 1px solid var(--bdr);
  border-radius: 12px; padding: 16px; text-align: center; }
.referral-stat-val { font-size: 28px; font-weight: 800; color: var(--iv); }
.referral-stat-label { font-size: 11px; color: var(--ivd); margin-top: 4px; }
.referral-login-msg { text-align: center; padding: 16px; }
.referral-login-msg p { font-size: 14px; color: var(--ivd); margin-bottom: 16px; }
.referral-topbar-btn { background: rgba(255,90,31,.12); border: 1px solid rgba(255,90,31,.3);
  color: #FF5A1F; border-radius: 20px; padding: 5px 12px; font-size: 12px; font-weight: 600;
  cursor: pointer; white-space: nowrap; flex-shrink: 0; }

/* ── Icône points dans interstitielle ── */
.inter-pts-icon-img {
  width: 18px; height: 18px; object-fit: contain; flex-shrink: 0; vertical-align: middle;
}

/* ── Liens légaux dans vue compte ── */
.account-legal {
  display: flex; align-items: center; justify-content: center;
  gap: 8px; padding: 16px 0 8px; flex-wrap: wrap;
  border-top: 1px solid var(--bdr); margin-top: 8px;
}

/* ── Referral title sans emoji ── */
.referral-icon { display: none; }

/* ── Fallback logo quick links — initiale ── */
.ql-favicon-txt {
  width: 36px; height: 36px; border-radius: 10px;
  background: var(--a); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; font-weight: 800;
}