/* ============================================
   CSS BLOCK 03: APP LAYOUT
   ============================================ */
.app{display:flex;flex-direction:column;height:100vh;overflow:hidden}
.app.h{display:none}

/* ============================================
   CSS BLOCK 04: DESKTOP HEADER
   ============================================ */
.hdr{background:var(--sf);border-bottom:1px solid var(--bd);padding:8px 16px;display:flex;align-items:center;gap:12px;flex-shrink:0}
.logo{font-size:17px;font-weight:700;color:#fff;white-space:nowrap}
.logo b{color:var(--ac)}
.tabs{display:flex;background:var(--cd);border-radius:8px;padding:2px;gap:2px}
.tb{padding:6px 14px;border-radius:6px;font-size:12px;font-weight:500;cursor:pointer;color:var(--t2);border:none;background:none;transition:all .2s}
.tb.a{background:rgba(108,92,231,.6);color:#fff;box-shadow:0 1px 6px rgba(108,92,231,.3),inset 0 1px 0 rgba(255,255,255,.1)}
.hdr-r{margin-left:auto;display:flex;align-items:center;gap:8px}
.ubdg{font-size:11px;color:var(--a2);background:var(--cd);padding:4px 10px;border-radius:6px}
.btn{padding:6px 12px;border-radius:6px;font-size:12px;font-weight:500;cursor:pointer;border:none;transition:all .2s}
.btn-a{background:rgba(108,92,231,.65);color:#fff;box-shadow:0 2px 8px rgba(108,92,231,.3),inset 0 1px 0 rgba(255,255,255,.1);border:1px solid rgba(108,92,231,.3)}
.btn-a:hover{background:rgba(108,92,231,.8);box-shadow:0 4px 14px rgba(108,92,231,.4),inset 0 1px 0 rgba(255,255,255,.15);transform:translateY(-1px)}
.btn-g{background:rgba(34,35,46,.5);color:var(--t2);border:1px solid rgba(255,255,255,.08);box-shadow:0 1px 4px rgba(0,0,0,.12),inset 0 1px 0 rgba(255,255,255,.04)}
.btn-g:hover{background:rgba(34,35,46,.7);color:var(--tx);box-shadow:0 2px 8px rgba(0,0,0,.2)}

/* ============================================
   CSS BLOCK 05: MOBILE HEADER
   ============================================ */
.mob-hdr{display:none;background:var(--sf);border-bottom:1px solid var(--bd);padding:8px 10px;align-items:center;gap:8px;flex-shrink:0}
.burger{width:32px;height:32px;border:none;background:var(--cd);border-radius:8px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;flex-shrink:0}
.burger span{display:block;width:16px;height:2px;background:var(--tx);border-radius:2px;transition:all .3s}
.burger.open span:nth-child(1){transform:rotate(45deg) translate(3.5px,3.5px)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:rotate(-45deg) translate(3.5px,-3.5px)}
.mob-logo{font-size:15px;font-weight:700;color:#fff;white-space:nowrap}
.mob-logo b{color:var(--ac)}
.mob-tabs{display:flex;background:var(--cd);border-radius:8px;padding:2px;gap:2px;margin-left:auto}
.mob-tb{padding:6px 12px;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;color:var(--t2);border:none;background:none;transition:all .2s}
.mob-tb.a{background:rgba(108,92,231,.6);color:#fff;box-shadow:0 1px 6px rgba(108,92,231,.3),inset 0 1px 0 rgba(255,255,255,.1)}
.mob-fab{position:fixed;bottom:20px;right:20px;width:52px;height:52px;border-radius:50%;background:rgba(108,92,231,.6);color:#fff;border:1px solid rgba(108,92,231,.3);font-size:24px;cursor:pointer;box-shadow:0 4px 20px rgba(108,92,231,.4),inset 0 1px 0 rgba(255,255,255,.15);z-index:100;display:none;align-items:center;justify-content:center;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}

/* ============================================
   CSS BLOCK 06: MOBILE STATS WIDGETS
   ============================================ */
.mob-stats{display:none;background:var(--sf);border-bottom:1px solid var(--bd);padding:8px 10px;gap:6px;flex-shrink:0;overflow-x:auto;-webkit-overflow-scrolling:touch}
.mob-stats::-webkit-scrollbar{height:0}
.mstat{flex:1;min-width:72px;padding:8px 6px;border-radius:10px;text-align:center;position:relative;overflow:hidden}
.mstat::before{content:"";position:absolute;inset:0;border-radius:10px;opacity:.12}
.mstat.s1::before{background:linear-gradient(135deg,#6c5ce7,#a29bfe)}
.mstat.s2::before{background:linear-gradient(135deg,#00b894,#55efc4)}
.mstat.s3::before{background:linear-gradient(135deg,#e17055,#fab1a0)}
.mstat.s4::before{background:linear-gradient(135deg,#fdcb6e,#ffeaa7)}
.mstat-n{font-size:18px;font-weight:800;position:relative;line-height:1.2}
.mstat.s1 .mstat-n{color:var(--a2)}
.mstat.s2 .mstat-n{color:var(--gn)}
.mstat.s3 .mstat-n{color:var(--rd)}
.mstat.s4 .mstat-n{color:var(--yl)}
.mstat-l{font-size:9px;color:var(--t2);text-transform:uppercase;letter-spacing:.3px;position:relative;margin-top:2px}

/* ============================================
   CSS BLOCK 07: MOBILE FILTER ROW + SEARCH
   ============================================ */
.mob-frow{display:none;background:var(--sf);border-bottom:1px solid var(--bd);padding:6px 10px;gap:6px;align-items:center;flex-shrink:0}
.mob-sel{flex:1;display:flex;align-items:center;justify-content:space-between;padding:8px 10px;background:var(--cd);border:1px solid var(--bd);border-radius:8px;font-size:12px;font-weight:500;color:var(--tx);cursor:pointer;min-width:0}
.mob-sel:active{background:var(--bd)}
.mob-sel-inner{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.ms-label{font-size:9px;color:var(--t2);text-transform:uppercase;letter-spacing:.3px}
.ms-val{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ms-arrow{color:var(--t2);font-size:10px;flex-shrink:0;margin-left:4px}
.mob-srch-btn{width:36px;height:36px;border:none;background:var(--cd);border:1px solid var(--bd);border-radius:8px;color:var(--tx);font-size:14px;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.mob-srch-row{display:none;background:var(--sf);border-bottom:1px solid var(--bd);padding:6px 10px;flex-shrink:0}
.mob-srch-row.a{display:flex}
.mob-srch-row input{flex:1;padding:8px 12px;background:var(--cd);border:1px solid var(--bd);border-radius:8px;color:var(--tx);font-size:13px;outline:none}
.mob-srch-row input:focus{border-color:var(--ac)}

/* ============================================
   CSS BLOCK 08: BOTTOM SHEET — FUNNEL/STAGE PICKER (mobile)
   ============================================ */
.bs-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:800}
.bs-overlay.a{display:block}
.bs-sheet{position:fixed;bottom:0;left:0;right:0;background:var(--sf);border-radius:20px 20px 0 0;z-index:801;transform:translateY(100%);transition:transform .3s ease;max-height:70vh;display:flex;flex-direction:column}
.bs-sheet.a{transform:translateY(0)}
.bs-handle{width:40px;height:4px;background:var(--bd);border-radius:4px;margin:12px auto 8px}
.bs-title{font-size:16px;font-weight:700;text-align:center;padding:4px 16px 14px;color:#fff}
.bs-list{overflow-y:auto;padding:0 12px 20px;flex:1}
.bs-item{display:flex;align-items:center;padding:14px 16px;border-radius:12px;cursor:pointer;transition:all .15s;gap:12px;margin-bottom:2px}
.bs-item:hover{background:var(--cd)}
.bs-item.a{background:rgba(108,92,231,.15)}
.bs-num{width:24px;height:24px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0}
.bs-info{flex:1;min-width:0}
.bs-name{font-size:14px;font-weight:600;color:var(--tx)}
.bs-meta{font-size:12px;color:var(--t2);margin-top:2px}
.bs-check{color:var(--ac);font-size:16px;flex-shrink:0;display:none}
.bs-item.a .bs-check{display:block}
.bs-item-all{border-bottom:1px solid var(--bd);margin-bottom:8px;padding-bottom:16px}
.bs-num.bs-num--funnel{min-width:32px;min-height:32px;border-radius:10px;box-sizing:border-box;padding:0 6px;font-size:14px;font-weight:700;line-height:1.1;-webkit-font-smoothing:antialiased}
.bs-name.bs-name--funnel{font-size:14px;font-weight:700;line-height:1.25}
.bs-stage-strip-scroll{overflow-x:auto;padding:4px 0 10px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.bs-stage-strip.funnel-arrow-strip{display:flex;flex-direction:row;gap:0;align-items:stretch;min-width:min-content;padding:2px 0}
.funnel-arrow-seg.funnel-arrow-seg--btn{flex:1 1 0;min-width:68px;max-width:240px;min-height:50px;cursor:pointer;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,0 100%,12px 50%);margin-left:-6px;box-sizing:border-box;padding:8px 8px 8px 18px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;transition:transform .2s ease,filter .2s ease;filter:drop-shadow(0 3px 6px rgba(15,23,42,.1)) drop-shadow(0 1px 2px rgba(15,23,42,.06));position:relative;z-index:0;-webkit-font-smoothing:antialiased}
.funnel-arrow-seg.funnel-arrow-seg--btn:first-child{margin-left:0;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,0 100%);padding-left:12px}
.funnel-arrow-seg.funnel-arrow-seg--btn.step-inactive{filter:drop-shadow(0 2px 5px rgba(15,23,42,.07)) drop-shadow(0 1px 2px rgba(15,23,42,.04)) saturate(0.9) brightness(0.97)}
.funnel-arrow-seg.funnel-arrow-seg--btn.step-active{z-index:1;filter:drop-shadow(0 6px 16px rgba(15,23,42,.14)) drop-shadow(0 2px 5px rgba(15,23,42,.08)) saturate(1.03)}
.funnel-arrow-seg.funnel-arrow-seg--btn.step-active:hover{transform:scale(1.06);z-index:2;filter:drop-shadow(0 8px 22px rgba(15,23,42,.17)) drop-shadow(0 3px 8px rgba(15,23,42,.1)) drop-shadow(0 0 0 2px var(--lc-stage,rgba(100,116,139,.55)))}
.funnel-arrow-seg.funnel-arrow-seg--btn.step-inactive:hover{transform:scale(1.05);z-index:2;filter:drop-shadow(0 6px 14px rgba(15,23,42,.12)) drop-shadow(0 2px 5px rgba(15,23,42,.07)) saturate(1) brightness(1.02) drop-shadow(0 0 0 2px rgba(148,163,184,.45))}
.funnel-arrow-seg.funnel-arrow-seg--btn.step-active:active{transform:scale(1.02);filter:drop-shadow(0 4px 12px rgba(15,23,42,.14)) drop-shadow(0 0 0 2px var(--lc-stage,rgba(100,116,139,.45)))}
.funnel-arrow-seg.funnel-arrow-seg--btn.step-inactive:active{transform:scale(1.02);filter:drop-shadow(0 3px 10px rgba(15,23,42,.11)) drop-shadow(0 0 0 2px rgba(148,163,184,.4))}
.funnel-arrow-seg.step-inactive .funnel-arrow-seg-txt{color:#64748b}
.funnel-arrow-seg.step-active .funnel-arrow-seg-txt{color:inherit}
.funnel-arrow-seg-txt{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;word-break:break-word;line-height:1.2;font-size:14px;font-weight:700}
.funnel-arrow-seg-meta{font-size:11px;font-weight:600;opacity:.88;margin-top:4px;line-height:1.2}
.funnel-arrow-seg-check{position:absolute;top:6px;right:8px;font-size:12px;font-weight:800;text-shadow:0 1px 0 rgba(255,255,255,.4)}

/* ============================================
   CSS BLOCK 09: SIDEBAR (mobile menu)
   ============================================ */
.sidebar{position:fixed;top:0;left:-300px;width:300px;height:100vh;background:var(--sf);border-right:1px solid var(--bd);z-index:900;transition:left .3s;padding:20px;overflow-y:auto;display:flex;flex-direction:column;gap:16px}
.sidebar.open{left:0}
.sidebar-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:899;display:none}
.sidebar-overlay.open{display:block}
.sb-section{display:flex;flex-direction:column;gap:6px}
.sb-label{font-size:11px;color:var(--t2);text-transform:uppercase;letter-spacing:.5px;font-weight:600;margin-bottom:2px}
.sb-close{align-self:flex-end;background:none;border:none;color:var(--t2);font-size:24px;cursor:pointer;padding:4px 8px}
.fsel{background:var(--cd);border:1px solid var(--bd);color:var(--tx);padding:7px 12px;border-radius:8px;font-size:13px;outline:none;width:100%}

/* ============================================
   CSS BLOCK 10: DESKTOP FILTER BAR
   ============================================ */
.fbar{background:var(--sf);border-bottom:1px solid var(--bd);padding:6px 16px;display:flex;align-items:center;gap:10px;flex-shrink:0;flex-wrap:wrap}
.ftabs{display:flex;background:var(--cd);border-radius:6px;padding:2px;gap:2px}
.ft{padding:5px 12px;border-radius:5px;font-size:11px;font-weight:500;cursor:pointer;color:var(--t2);border:none;background:none;transition:all .2s}
.ft.a{background:rgba(108,92,231,.6);color:#fff;box-shadow:0 1px 6px rgba(108,92,231,.3),inset 0 1px 0 rgba(255,255,255,.1)}
.finp{background:var(--cd);border:1px solid var(--bd);color:var(--tx);padding:5px 10px;border-radius:6px;font-size:12px;outline:none;width:140px}
.finp:focus{border-color:var(--ac)}
.srch-scope{font-size:10px;color:var(--t2);cursor:pointer;padding:3px 8px;border:1px solid var(--bd);border-radius:4px;background:var(--cd)}
.srch-scope:hover{color:var(--ac);border-color:var(--ac)}
.srch-scope.a{color:var(--ac);border-color:var(--ac);background:rgba(108,92,231,.1)}
.stg{display:flex;gap:14px;margin-left:auto}
.sti{text-align:center}
.stn{font-size:16px;font-weight:700;color:var(--a2)}
.stl{font-size:9px;color:var(--t2);text-transform:uppercase}