:root{--bg: #f3f7f5;--panel: #ffffff;--panel-soft: #f7faf8;--text: #18241f;--muted: #6f7c76;--line: #e3ebe7;--green: #16a269;--green-dark: #0b7f51;--green-soft: #e6f6ee;--orange: #ff8a3d;--red: #e95063;--shadow: 0 12px 32px rgba(22, 55, 39, .07)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif}button,select,input{font:inherit}button{cursor:pointer}button:disabled,select:disabled{cursor:not-allowed;opacity:.72}.app{min-height:100vh}.topbar{position:sticky;top:0;z-index:20;background:#ffffffeb;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}.topbar-inner,.main{width:min(1440px,calc(100% - 40px));margin:0 auto}.topbar-inner{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:12px}.brand-logo{width:40px;height:44px;flex:0 0 auto;object-fit:contain}.brand-title{font-size:19px;font-weight:750;letter-spacing:0}.brand-sub{color:var(--muted);font-size:12px;margin-top:3px}.header-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.select{min-height:38px;padding:0 34px 0 12px;color:var(--text);background:#fff;border:1px solid var(--line);border-radius:10px;outline:none}.version-filter{position:relative;flex:0 0 auto}.version-trigger{min-width:132px;min-height:38px;display:inline-flex;align-items:center;justify-content:space-between;gap:12px;padding:0 11px 0 12px;color:var(--text);background:#fff;border:1px solid var(--line);border-radius:10px}.version-trigger:focus-visible,.version-above-btn:focus-visible,.version-cancel-btn:focus-visible,.version-apply-btn:focus-visible{outline:2px solid var(--green);outline-offset:2px}.version-trigger-arrow{color:var(--muted);font-size:12px}.version-popover{position:absolute;top:calc(100% + 8px);right:0;z-index:40;width:292px;overflow:hidden;background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:0 18px 44px #12302229}.version-list{max-height:min(360px,calc(100vh - 180px));overflow-y:auto;padding:7px}.version-option{min-height:40px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 6px 4px 9px;border-radius:7px}.version-option:hover{background:var(--panel-soft)}.version-option-all{margin-bottom:5px;border-bottom:1px solid var(--line);border-radius:7px 7px 0 0}.version-option label,label.version-option{flex:1;display:flex;align-items:center;gap:9px;cursor:pointer;font-size:13px;font-variant-numeric:tabular-nums}.version-option input{width:16px;height:16px;margin:0;accent-color:var(--green)}.version-above-btn{width:29px;height:29px;flex:0 0 29px;padding:0;color:var(--green-dark);background:var(--green-soft);border:0;border-radius:7px;font-size:16px;line-height:1}.version-above-btn:hover{background:#d8f1e5}.version-popover-footer{display:flex;justify-content:flex-end;gap:8px;padding:10px 12px;background:var(--panel-soft);border-top:1px solid var(--line)}.version-cancel-btn,.version-apply-btn{min-height:32px;padding:0 13px;border-radius:7px;font-size:13px;font-weight:650}.version-cancel-btn{color:var(--muted);background:#fff;border:1px solid var(--line)}.version-apply-btn{color:#fff;background:var(--green);border:1px solid var(--green)}.range-group{display:flex;padding:3px;border:1px solid var(--line);border-radius:11px;background:var(--panel-soft)}.range-btn,.tab-btn{border:0;background:transparent;color:var(--muted);border-radius:8px;padding:8px 12px}.range-btn.active,.tab-btn.active{background:var(--panel);color:var(--text);box-shadow:0 2px 8px #142d2014;font-weight:650}.date-filter{display:none;align-items:center;gap:7px;padding:4px 5px 4px 10px;background:var(--panel-soft);border:1px solid var(--line);border-radius:11px}.date-filter.active{display:flex}.date-input{width:132px;min-height:32px;color:var(--text);background:transparent;border:0;outline:none}.date-separator{color:var(--muted);font-size:12px}.date-apply{min-height:32px;padding:0 12px;color:#fff;background:var(--green);border:0;border-radius:8px;font-weight:650}.main{padding:28px 0 56px}.hero{display:flex;justify-content:space-between;gap:24px;align-items:flex-end;margin-bottom:20px}h1{margin:0;font-size:28px;letter-spacing:0}.hero p{margin:8px 0 0;color:var(--muted)}.demo-badge{flex:0 0 auto;color:#8c5b19;background:#fff5da;border:1px solid #f5dfaa;border-radius:999px;padding:8px 12px;font-size:13px;font-weight:650}.demo-badge.live{color:var(--green-dark);background:var(--green-soft);border-color:#bfe8d3}.tabs{display:flex;gap:4px;padding:4px;width:fit-content;background:#e9efec;border-radius:12px;margin-bottom:20px}.view{display:none}.view.active{display:block}.kpi-grid{display:grid;grid-template-columns:repeat(7,minmax(150px,1fr));gap:14px;margin-bottom:20px}.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}.kpi{padding:18px;min-height:124px}.kpi-label{color:var(--muted);font-size:13px}.kpi-value{font-size:29px;font-weight:780;margin-top:12px;letter-spacing:0}.kpi-note{color:var(--muted);font-size:12px;margin-top:7px}.kpi-note strong{color:var(--green-dark);font-weight:700}.layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(320px,.8fr);gap:18px;align-items:start}.panel-head{padding:19px 20px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line)}.panel-title{font-weight:750}.panel-desc{color:var(--muted);font-size:12px;margin-top:4px}.panel-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}.funnel-segment{display:inline-flex;align-items:center;padding:3px;background:#edf2ef;border:1px solid var(--line);border-radius:7px}.funnel-segment-btn{min-height:28px;padding:5px 10px;border:0;border-radius:5px;background:transparent;color:var(--muted);font:inherit;font-size:12px;line-height:1.25;cursor:pointer;transition:color .18s ease,background-color .18s ease,box-shadow .18s ease;white-space:nowrap}.funnel-segment-btn:hover:not(:disabled){color:var(--text)}.funnel-segment-btn.active{color:var(--green-dark);background:#fff;box-shadow:0 1px 3px #1037261f;font-weight:650}.funnel-segment-btn:focus-visible{outline:2px solid var(--green);outline-offset:2px}.funnel-segment-btn:disabled{cursor:not-allowed;opacity:.5}.panel-direction-select{min-width:132px;max-width:190px}.pill{color:var(--green-dark);background:var(--green-soft);padding:6px 10px;border-radius:999px;font-size:12px;font-weight:650;white-space:nowrap}.funnel{padding:20px;display:grid;gap:12px}.funnel-header{display:grid;grid-template-columns:128px minmax(100px,1fr) 80px 80px 80px 82px;gap:12px;align-items:center;color:var(--muted);font-size:11px;line-height:1.35}.funnel-header div:nth-child(n+3){text-align:right}.funnel-header .funnel-legend-label{display:flex;align-items:center;justify-content:flex-end;gap:3px;white-space:nowrap}.legend-dot{width:7px;height:7px;flex:0 0 7px;border-radius:50%}.legend-dot-first{background:var(--green)}.funnel-row{display:grid;grid-template-columns:128px minmax(100px,1fr) 80px 80px 80px 82px;gap:12px;align-items:center}.funnel-name{font-size:13px;color:var(--muted);line-height:1.35;overflow-wrap:anywhere}.bar-track{position:relative;height:20px;background:#edf2ef;border-radius:6px;overflow:hidden}.bar-fill{position:absolute;inset:0 auto 0 0;height:100%;min-width:3px;border-radius:inherit;transition:width .35s ease}.bar-fill{background:linear-gradient(90deg,#28c982,#0f9c63)}.funnel-row:last-child .bar-fill{background:linear-gradient(90deg,#ff9a4f,#f05b69)}.funnel-count{font-weight:720;text-align:right;font-variant-numeric:tabular-nums}.funnel-rate{text-align:right;color:var(--muted);font-size:12px}.journey-card{padding-bottom:12px}.journey{padding:18px 20px;display:grid;gap:0}.journey-step{display:grid;grid-template-columns:26px 1fr auto;gap:10px;min-height:57px;position:relative}.journey-step:not(:last-child):after{content:"";position:absolute;left:10px;top:22px;bottom:0;width:2px;background:var(--line)}.dot{width:22px;height:22px;border-radius:50%;background:var(--green-soft);border:6px solid var(--green);z-index:1}.journey-step:last-child .dot{border-color:var(--orange);background:#fff1e6}.journey-name{font-size:13px;font-weight:650;padding-top:2px}.journey-meta{font-size:11px;color:var(--muted);margin-top:4px}.journey-value{font-size:13px;font-weight:720}.note{margin:0 20px 8px;padding:12px 14px;color:#635138;background:#fff7e9;border:1px solid #f5e4c5;border-radius:12px;font-size:12px;line-height:1.55}.table-card{overflow:hidden}.full-step-card{margin-top:18px}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:1080px}th,td{padding:13px 14px;border-bottom:1px solid var(--line);text-align:right;font-size:13px;white-space:nowrap;font-variant-numeric:tabular-nums}th{color:var(--muted);font-weight:650;background:var(--panel-soft)}th:first-child,td:first-child{text-align:left;position:sticky;left:0;background:inherit;z-index:1}tbody tr{background:var(--panel)}tbody tr:hover,tbody tr:hover td:first-child{background:#f5fbf8}tbody tr.selectable{cursor:pointer}tfoot .total-row td{color:var(--text);background:#edf8f2;border-top:2px solid #cce7d8;border-bottom:0;font-weight:700}tfoot .total-row td:first-child{background:#edf8f2}.rate-cell{min-width:128px}.rate-line{height:5px;background:#edf2ef;border-radius:999px;margin-top:6px;overflow:hidden}.rate-line i{display:block;height:100%;background:var(--green);border-radius:inherit}.good{color:var(--green-dark);font-weight:700}.warn{color:#b46a18;font-weight:700}.status-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:-6px 0 18px;min-height:30px}.status-copy{color:var(--muted);font-size:12px}.refresh-btn,.retry-btn{min-height:32px;padding:0 12px;color:var(--green-dark);background:var(--green-soft);border:0;border-radius:8px;font-weight:650}.error-panel{display:none;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px;padding:14px 16px;color:#842f3d;background:#fff0f2;border:1px solid #f2cbd1;border-radius:12px;font-size:13px}.error-panel.active{display:flex}.empty-panel{padding:56px 20px;text-align:center!important;color:var(--muted)}.loading .kpi-value,.loading .funnel-count,.loading .funnel-rate,.loading .journey-meta,.loading .journey-value{color:transparent!important;border-radius:6px;background:linear-gradient(90deg,#edf2ef 25%,#f7faf8,#edf2ef 75%);background-size:200% 100%;animation:shimmer 1.2s linear infinite}.loading button,.loading select{pointer-events:none}@keyframes shimmer{to{background-position:-200% 0}}@media(max-width:1100px){.kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.layout{grid-template-columns:1fr}}@media(max-width:720px){.topbar-inner,.main{width:min(100% - 24px,1440px)}.topbar-inner{align-items:flex-start;flex-direction:column;padding:14px 0}.header-actions{width:100%}.version-filter{flex:1;min-width:150px}.version-trigger{width:100%}.version-popover{width:min(320px,calc(100vw - 24px))}.panel-head{align-items:flex-start;flex-wrap:wrap}.panel-actions{width:100%;justify-content:space-between}.funnel-segment{max-width:100%}.funnel-segment-btn{white-space:normal}.panel-direction-select{flex:0 1 auto;min-width:116px;max-width:100%}.select{flex:1;min-width:150px}.date-filter{width:100%;flex-wrap:wrap}.date-input{flex:1;min-width:120px}.hero,.status-row{align-items:flex-start;flex-direction:column}.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.funnel-header{grid-template-columns:92px minmax(30px,1fr) 54px 54px 54px;gap:5px}.funnel-header div:last-child{display:none}.funnel-row{grid-template-columns:92px minmax(30px,1fr) 54px 54px 54px;gap:5px}.funnel-count{display:none}}