@import "https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;700&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@700&display=swap";*{box-sizing:border-box;margin:0;padding:0}:root{--bg-primary:#121212;--bg-card:#1e1e1e;--bg-input:#2a2a2a;--color-accent:gold;--color-accent-cyan:#24f6e8;--color-text-primary:#fff;--color-text-secondary:#aaa;--color-border:#333}body{background-color:var(--bg-primary);color:var(--color-text-primary);-webkit-font-smoothing:antialiased;font-family:Inter,sans-serif;font-size:13px}h1,h2,h3,h4,.font-title{letter-spacing:-.02em;font-family:Inter Tight,sans-serif;font-weight:700}.app-container{min-height:100vh;display:flex}.sidebar{background-color:var(--bg-card);border-right:1px solid var(--color-border);z-index:50;flex-direction:column;align-items:center;gap:20px;width:72px;height:100vh;padding-top:24px;display:flex;position:fixed}.sidebar-logo{justify-content:center;align-items:center;margin-bottom:16px;display:flex}.nav-icon{width:48px;height:48px;color:var(--color-text-secondary);border-radius:12px;justify-content:center;align-items:center;text-decoration:none;transition:all .2s;display:flex}.nav-icon:hover{color:var(--color-text-primary);background-color:#2a2a2a}.nav-icon.active{color:var(--color-accent);background-color:#ffd7001a}.main-content{flex-direction:column;flex:1;width:calc(100% - 72px);max-width:1600px;margin:0 auto 0 72px;padding:32px;display:flex}.filters-bar{flex-wrap:wrap;align-items:center;gap:16px;padding-bottom:32px;display:flex}.custom-select-wrapper{min-width:160px;position:relative}.custom-select-button{width:100%;color:var(--color-text-primary);cursor:pointer;background:0 0;border:none;justify-content:space-between;align-items:center;gap:8px;height:40px;padding:0 12px;font-family:Inter,sans-serif;font-size:13px;font-weight:500;display:flex}.custom-select-arrow{color:var(--color-text-secondary);transition:transform .2s}.custom-select-arrow.open{transform:rotate(180deg)}.custom-select-dropdown{z-index:100;background:#333;border:1px solid #444;border-radius:8px;width:220px;position:absolute;top:calc(100% + 4px);left:0;overflow:hidden;box-shadow:0 4px 12px #00000080}.custom-select-dropdown.light{color:#333;background:#f4f4f4;border-color:#e0e0e0}.custom-select-search{color:var(--color-text-secondary);border-bottom:1px solid #444;align-items:center;gap:8px;padding:12px;display:flex}.custom-select-dropdown.light .custom-select-search{border-bottom-color:#e0e0e0}.custom-select-search input{color:inherit;background:0 0;border:none;outline:none;width:100%;font-family:Inter,sans-serif}.custom-select-dropdown.light .custom-select-search input{color:#333}.custom-select-list{max-height:200px;padding:8px 0;overflow-y:auto}.custom-select-item{cursor:pointer;align-items:center;gap:8px;padding:8px 12px;font-size:13px;transition:background .1s;display:flex}.custom-select-item:hover{background:#444}.custom-select-dropdown.light .custom-select-item{color:#333}.custom-select-dropdown.light .custom-select-item:hover{background:#eaeaea}.custom-select-empty{text-align:center;color:var(--color-text-secondary);padding:12px;font-size:12px}.filter-group{background:var(--bg-input);border:1px solid #0000;border-radius:8px;align-items:center;height:40px;padding-left:16px;transition:all .2s;display:flex}.filter-group:hover{border-color:#444}.filter-icon{color:var(--color-text-secondary)}.kpi-grid{grid-template-columns:repeat(4,1fr);gap:24px;padding-bottom:32px;display:grid}.kpi-card{background:var(--bg-card);clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%);flex-direction:column;min-height:120px;padding:20px;transition:transform .2s;display:flex;position:relative}.kpi-card:hover{transform:translateY(-4px)}.kpi-card:before{content:"";background:var(--color-accent);height:2px;position:absolute;top:0;left:0;right:19px}.kpi-card:after{content:"";background:var(--color-accent);width:2px;position:absolute;top:0;bottom:0;left:0}.kpi-title{color:var(--color-text-primary);margin-bottom:24px;font-family:Inter Tight,sans-serif;font-size:15px;font-weight:700}.kpi-content{align-items:center;gap:16px;display:flex}.kpi-icon-box{border:2px solid var(--color-accent);width:44px;height:44px;color:var(--color-accent);background:0 0;border-radius:8px;justify-content:center;align-items:center;display:flex}.kpi-value-container{flex-direction:column;display:flex}.kpi-value-label{color:var(--color-text-secondary);margin-bottom:2px;font-size:11px}.kpi-value{color:var(--color-text-primary);font-family:Inter,sans-serif;font-size:26px;font-weight:700;line-height:1}.secondary-metrics-grid{grid-template-columns:repeat(4,1fr);gap:16px;padding-bottom:32px;display:grid}.metric-chip-card{background:var(--bg-card);border-radius:8px;flex-direction:column;padding:12px 16px;display:flex}.metric-chip-label{color:var(--color-text-secondary);text-transform:uppercase;margin-bottom:4px;font-size:11px;font-weight:600}.metric-chip-value{color:var(--color-text-primary);font-family:JetBrains Mono,monospace;font-size:18px;font-weight:700}.metric-chip-btn{color:var(--color-accent);cursor:pointer;background:0 0;border:none;align-items:center;gap:4px;margin-top:8px;font-size:10px;display:flex}.middle-section{grid-template-columns:1fr 1fr;gap:24px;padding-bottom:32px;display:grid}.funnel-container{background:var(--bg-card);border-radius:12px;flex-direction:column;padding:24px;display:flex;position:relative}.funnel-header{justify-content:space-between;align-items:center;margin-bottom:32px;display:flex}.funnel-title-group{align-items:center;gap:12px;display:flex}.funnel-icon-box{background:var(--color-accent);color:#000;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.funnel-title{font-family:Inter Tight,sans-serif;font-size:18px;font-weight:700}.funnel-select{appearance:none;border:1px solid var(--color-border);color:var(--color-text-primary);cursor:pointer;background:#2a2a2a url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23AAAAAA%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E) right 12px top 50%/10px no-repeat;border-radius:6px;padding:8px 32px 8px 12px;font-family:Inter,sans-serif;font-size:13px;font-weight:500;transition:all .2s}.funnel-select:hover{background:#333;border-color:#555}.funnel-stages{flex-direction:column;align-items:center;gap:8px;padding:0 40px;display:flex}.funnel-stage-wrapper{justify-content:center;align-items:center;width:100%;margin-bottom:8px;padding-right:250px;display:flex;position:relative}.funnel-trapezoid{background:var(--color-accent);color:#000;clip-path:polygon(0 0,100% 0,95% 100%,5% 100%);flex-direction:column;justify-content:center;align-items:center;width:100%;padding:12px 0;transition:width .3s;display:flex}.funnel-trapezoid-label{opacity:.8;font-size:11px;font-weight:500}.funnel-trapezoid-value{font-family:Inter Tight,sans-serif;font-size:20px;font-weight:700}.funnel-lines-right{align-items:center;width:230px;display:flex;position:absolute;right:0}.funnel-metric-box{flex-direction:column;align-items:flex-start;margin-left:auto;display:flex}.funnel-conv-tab{background:var(--bg-card-alt);border:1px solid #333;border-left:3px solid var(--color-accent);color:#fff;border-radius:4px 16px 16px 4px;padding:4px 12px;font-family:Inter,sans-serif;font-size:13px;font-weight:600;position:absolute;top:-24px;left:0}.funnel-conv-tab:before{content:"";background:#666;width:40px;height:1px;position:absolute;top:50%;left:-40px}.funnel-cpm-label{color:var(--color-text-secondary);text-transform:uppercase;font-size:10px;font-weight:600}.funnel-cpm-value{color:var(--color-text-primary);font-size:14px;font-weight:700}.table-card{background:var(--bg-card);border-radius:12px;padding:16px;overflow:hidden}table{border-collapse:collapse;width:100%}th{text-align:left;color:var(--color-text-secondary);border-bottom:1px solid var(--color-border);padding:16px;font-size:12px;font-weight:600}td{border-bottom:1px solid var(--color-border);padding:16px;font-size:14px;font-weight:500}.creative-thumb{object-fit:cover;border-radius:8px;width:40px;height:40px}.demographics-container{background:var(--bg-card);border:1px solid var(--color-border);border-radius:16px;flex-direction:column;padding:24px;display:flex}.demo-content{flex:1;justify-content:space-between;align-items:center;display:flex}.demo-chart-wrapper{width:260px;height:260px;position:relative}.demo-center-icon{pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.demo-legend{flex-direction:column;gap:12px;margin-right:24px;display:flex}.demo-legend-item{align-items:center;gap:8px;display:flex}.demo-dot{border-radius:50%;width:12px;height:12px}.demo-label{color:var(--color-text-primary);font-family:Inter,sans-serif;font-size:14px;font-weight:500}.demo-tooltip{color:#000;background:#fff;border-radius:8px;padding:12px;box-shadow:0 4px 12px #0003}.demo-tooltip-title{font-family:Inter Tight,sans-serif;font-size:14px;font-weight:700}.demo-tooltip-value{margin-top:4px;font-family:Inter,sans-serif;font-size:13px}.video-stages{justify-content:space-between;gap:8px;margin-top:24px;display:flex}.vv-badge{background:0 0;flex-direction:column;flex:1;align-items:center;display:flex}.vv-chevron{background:var(--color-accent);color:#000;text-align:center;clip-path:polygon(0% 0%,85% 0%,100% 50%,85% 100%,0% 100%,15% 50%);width:100%;margin-bottom:16px;padding:10px 0;font-family:Inter Tight,sans-serif;font-size:14px;font-weight:800}.vv-badge:first-child .vv-chevron{clip-path:polygon(0% 0%,85% 0%,100% 50%,85% 100%,0% 100%)}.vv-value{color:var(--color-text-secondary);font-family:Inter,sans-serif;font-size:16px;font-weight:700}