/* PescaRadar · base, layout y controles globales */
:root{
      --bg:#061116;--panel:rgba(6,17,22,.96);--panel2:#0b2027;--line:rgba(255,255,255,.1);
      --text:#f3fbfd;--muted:#94adb6;--green:#43d17f;--yellow:#f5c84b;--red:#ff6b6b;
      --blue:#42c9ff;--purple:#ab94ff;--shadow:0 18px 50px rgba(0,0,0,.4)
    }
    *{box-sizing:border-box}
    html,body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
    body{overflow:hidden}
    #app{height:100dvh;min-height:560px;position:relative;background:#0a171c}
    
    
    button{font:inherit}
    .topbar{position:absolute;z-index:700;left:12px;right:12px;top:max(12px,env(safe-area-inset-top));display:flex;gap:8px;pointer-events:none}
    .brand,.tool{pointer-events:auto}
    .brand{flex:1;min-width:0;background:rgba(6,17,22,.88);backdrop-filter:blur(18px);border:1px solid var(--line);border-radius:18px;padding:10px 12px;box-shadow:var(--shadow)}
    .brandline{display:flex;gap:9px;align-items:center}
    .logo{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(145deg,#104355,#082832);flex:0 0 auto}
    .brand b{font-size:14px;display:block}
    .brand small{font-size:10px;color:var(--muted)}
    .tool{width:46px;height:46px;border-radius:16px;border:1px solid var(--line);background:rgba(6,17,22,.92);color:#fff;box-shadow:var(--shadow);cursor:pointer}
    .tool.active{background:#113947;border-color:#3fa0bd}

    .status{position:absolute;z-index:690;top:80px;left:12px;right:12px;display:flex;gap:7px;overflow-x:auto;scrollbar-width:none}
    .status::-webkit-scrollbar,.filters::-webkit-scrollbar{display:none}
    .pill{flex:0 0 auto;background:rgba(6,17,22,.88);border:1px solid var(--line);border-radius:999px;padding:8px 11px;font-size:10px;backdrop-filter:blur(16px)}
    .pill strong{color:#fff}.pill.hot strong{color:#ffe07b}.pill.good strong{color:#8cf0b6}

    .filters{position:absolute;z-index:680;top:122px;left:12px;right:12px;display:flex;gap:7px;overflow-x:auto;scrollbar-width:none}
    .filter{flex:0 0 auto;border:1px solid var(--line);border-radius:999px;background:rgba(6,17,22,.88);color:#e1f3f7;padding:9px 13px;font-size:11px;font-weight:800;cursor:pointer}
    .filter.active{background:#edfaff;color:#071c24;border-color:#edfaff}

    
    
    

    
    

    
    
    .handle{width:46px;height:5px;border-radius:99px;background:rgba(255,255,255,.2);margin:9px auto 3px}
    .head{display:flex;gap:11px;align-items:center;padding:8px 13px 13px;cursor:pointer}
    .quality{width:62px;height:62px;flex:0 0 auto;border-radius:19px;display:grid;place-items:center;background:#0d232a;border:1px solid var(--line)}
    .quality .num{font-size:20px;font-weight:950;line-height:1}.quality small{font-size:8px;color:var(--muted);display:block;text-align:center;margin-top:3px}
    .heading{min-width:0;flex:1}.heading h2{font-size:15px;margin:0 0 3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.heading p{margin:0;color:var(--muted);font-size:10px}.chev{color:var(--muted)}
    .body{padding:0 13px 16px}
    
    
    
    
    
    
    
    

    
    .close{width:38px;height:38px;border:0;border-radius:12px;background:#13272f;color:#fff;cursor:pointer}
    
    .todayscore{font-size:14px;font-weight:950}
    .candidate{background:#101c22;border:1px dashed #37505a;border-radius:13px;padding:9px;margin-top:7px}.candidate b{font-size:10px;display:block}.candidate small{font-size:9px;color:var(--muted);line-height:1.4;display:block;margin-top:3px}


    .smartfilter{flex:0 0 auto;display:flex;align-items:center;gap:5px;background:rgba(6,17,22,.88);border:1px solid var(--line);border-radius:999px;padding:4px 8px 4px 10px;color:#d8edf2;font-size:10px;font-weight:800}
    .smartfilter select{border:0;outline:0;background:transparent;color:#fff;font:inherit;max-width:120px;cursor:pointer}
    .smartfilter option{background:#0b2027;color:#fff}
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    .match{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px}
    .match span{font-size:8px;padding:4px 6px;border-radius:999px;background:#102a32;color:#bde4ed;border:1px solid #284a55}
    .modelnote{font-size:9px;color:#91aeb7;line-height:1.45}


    
    
    
    
    .windowScore{font-size:22px;font-weight:950;color:#86edaf;white-space:nowrap}
    
    
    
    
    
    
    
    
    


    .topBaits{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
    
    
    
    
    
    
    


    
    
    
    
    
    .panelTech{
      min-height:42px;border:1px solid var(--line);border-radius:12px;
      background:#0b2027;color:#c9dde3;font-size:9px;font-weight:900;
      padding:7px 5px;cursor:pointer
    }
    .panelTech.active{background:#eafaff;color:#071c24;border-color:#eafaff}
    .panelTech small{display:block;font-size:7px;font-weight:700;opacity:.78;margin-top:2px}
    


    
    
    
    
    
    


    
    
    
    
    
    
    
    
    


    
    
    
    
    


    .searchFilter{padding-right:10px}
    .searchFilter input{
      width:150px;border:0;outline:0;background:transparent;color:#fff;
      font:inherit;font-weight:750
    }
    .searchFilter input::placeholder{color:#88a4ad}
    .smartNow{border-color:#32735a;background:rgba(10,45,35,.94);color:#aef3c9}
    .smartNow.loading{opacity:.7;pointer-events:none}
    
    .heroSpot{background:linear-gradient(145deg,#0d2831,#091b21);border:1px solid #2b525f;border-radius:17px;padding:11px}
    .heroSpotTop{display:flex;align-items:flex-start;gap:10px}
    .heroSpotMain{min-width:0;flex:1}
    .heroSpotMain strong{display:block;font-size:15px;line-height:1.2}
    .heroSpotMain small{display:block;color:#9eb8c0;font-size:9px;margin-top:4px}
    .favStar{width:42px;height:42px;border-radius:13px;border:1px solid #35535d;background:#10272e;color:#ffe28a;font-size:20px;cursor:pointer}
    .favStar.on{background:#3a3213;border-color:#716329}
    .heroStats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:9px}
    .heroStat{background:#0a1d23;border:1px solid var(--line);border-radius:12px;padding:8px 6px;min-width:0}
    .heroStat span{display:block;font-size:7px;color:#8da9b2;text-transform:uppercase}
    .heroStat b{display:block;font-size:12px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    .perfNote{font-size:8px;color:#809ba4}
    


    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    


    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    


    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    


    
    
    
    
    
    
    .menuEyebrow{font-size:8px;color:#89a6af;text-transform:uppercase;letter-spacing:.08em}
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    .filters{display:none!important}
    
    
    
    


    /* v16.2 · Interfaz limpia:
       cuenta, capas y contadores viven en el menú; no flotan sobre el mapa. */
    
    .topbar{
      right:auto;
      width:auto;
      max-width:min(560px,calc(100vw - 24px));
    }
