.viz-injected{margin-bottom:10px}.viz-dashboard{display:grid;grid-template-columns:1.45fr .75fr;gap:10px}.viz-card{border:1px solid #dfe6e8;background:#fff;border-radius:18px;padding:16px;text-align:right;font:inherit;color:#172a30}.viz-card>header{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}.viz-card header span{font-size:12px;color:#718087}.viz-card header h3{font-size:18px;margin:3px 0}.viz-card header em{font-size:12px;color:#287065;font-style:normal}.viz-card svg{width:100%;height:190px;overflow:visible}.viz-card .grid path{stroke:#e8edef;stroke-width:1}.viz-card .area{fill:url(#areaRevenue)}.viz-card .revenue-line,.viz-card .profit-line{fill:none;stroke:#3b82f6;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.viz-card .profit-line{stroke:#25a17d;stroke-width:2.5}.viz-card .r-dot{fill:#fff;stroke:#3b82f6;stroke-width:2}.viz-card .axis text{font-size:10px;fill:#819095}.viz-card>footer{display:flex;gap:16px;align-items:center;font-size:12px;color:#65757a}.viz-card>footer span{display:flex;align-items:center;gap:5px}.viz-card>footer i,.legend i{width:9px;height:9px;border-radius:50%;display:inline-block}.viz-card>footer i.blue,.legend i.blue{background:#3b82f6}.viz-card>footer i.green,.legend i.green{background:#25a17d}.viz-card>footer strong{margin-inline-start:auto;color:#178063}.donut-wrap{display:grid;grid-template-columns:150px 1fr;align-items:center;gap:12px}.donut{width:145px;height:145px;border-radius:50%;background:conic-gradient(#193d42 0 48%,#3e7fe8 48% 77%,#e3a447 77% 89%,#62bca3 89%);display:grid;place-items:center}.donut:before{content:'';width:86px;height:86px;border-radius:50%;background:#fff;grid-area:1/1}.donut>div{grid-area:1/1;z-index:2;text-align:center}.donut b,.donut span{display:block}.donut b{font-size:19px}.donut span{font-size:10px;color:#748287}.donut-wrap ul{list-style:none;padding:0;margin:0}.donut-wrap li{display:grid;grid-template-columns:auto 1fr auto;gap:7px;align-items:center;padding:8px 0;border-bottom:1px solid #edf1f2;font-size:12px}.donut-wrap li i{width:9px;height:9px;border-radius:3px;background:var(--c)}.viz-section{margin-bottom:10px}.paired-bars button,.rank-bars button,.health-bars button{width:100%;display:grid;grid-template-columns:150px 1fr 55px;align-items:center;gap:9px;border:0;background:#fff;padding:10px 0;font:inherit;text-align:right}.paired-bars button>span,.rank-bars button>span,.health-bars button>span{font-size:13px}.paired-bars button>div{display:grid;gap:4px}.paired-bars i,.rank-bars i,.health-bars i{display:block;width:var(--w);height:8px;border-radius:99px;background:#3b82f6}.paired-bars i.profit{background:#25a17d}.paired-bars button>b,.rank-bars strong,.health-bars b{font-size:12px;color:#53656a}.legend{padding-top:10px;border-top:1px solid #edf1f2}.matrix{width:100%;height:290px;position:relative;border:0;border-radius:13px;background:linear-gradient(90deg,transparent 49.7%,#dfe6e8 50%,transparent 50.3%),linear-gradient(0deg,transparent 49.7%,#dfe6e8 50%,transparent 50.3%),linear-gradient(135deg,#f3fbf8,#fbfcfc 50%,#fff6f5);font:inherit}.matrix .axis-y,.matrix .axis-x{position:absolute;font-size:11px;color:#748287}.matrix .axis-y{right:8px;top:8px}.matrix .axis-x{left:8px;bottom:8px}.matrix .bubble{position:absolute;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:#2aa17fcf;color:#fff;font-style:normal;box-shadow:0 7px 20px #1c755b35}.matrix .bubble b{font-size:11px}.matrix .b1{right:67%;top:16%;width:82px;height:82px}.matrix .b2{right:43%;top:29%;background:#4382dfcf}.matrix .b3{right:18%;top:61%;background:#d64c58cf;width:76px;height:76px}.matrix .b4{right:74%;top:64%;background:#dda242cf;width:55px;height:55px}.matrix small{position:absolute;font-size:11px;color:#79888d}.matrix .q1{left:14px;top:12px;color:#238268}.matrix .q2{right:14px;top:52%}.matrix .q3{left:14px;bottom:13px;color:#bb424c}.rank-bars button{grid-template-columns:28px 160px 1fr 38px}.rank-bars button>b{width:25px;height:25px;border-radius:8px;background:#edf2f3;display:grid;place-items:center;font-size:11px}.rank-bars button>div,.health-bars button>div{height:9px;background:#edf1f2;border-radius:99px;overflow:hidden}.rank-bars i{height:100%;background:var(--c)}.mini-donuts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.mini-donuts button{border:0;background:#f7f9f9;border-radius:13px;padding:16px;font:inherit}.mini-donuts button>i{--deg:calc(var(--p)*3.6deg);width:105px;height:105px;margin:auto;border-radius:50%;background:conic-gradient(var(--c) var(--deg),#e7ecee 0);display:grid;place-items:center;font-style:normal}.mini-donuts button>i:before{content:'';width:72px;height:72px;border-radius:50%;background:#fff;grid-area:1/1}.mini-donuts button>i b{grid-area:1/1;z-index:2;font-size:18px}.mini-donuts button>span{display:block;margin-top:9px;font-size:12px}.experiment-chart{display:grid;grid-template-columns:1.4fr .6fr;gap:20px;align-items:center}.experiment-chart .stack{height:220px;display:flex;align-items:flex-end;justify-content:center;gap:18px;border-bottom:1px solid #dfe6e8}.experiment-chart .stack i{height:var(--h);width:74px;border-radius:9px 9px 0 0;background:#25a17d;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:10px;font-style:normal;color:#fff}.experiment-chart .stack i.lost{background:#d24d58}.experiment-chart .stack i.active{background:#e0a03e}.experiment-chart .stack b{font-size:21px}.experiment-chart .stack span{font-size:11px;margin-top:3px}.experiment-chart aside{text-align:center;background:#f3f8f7;border-radius:14px;padding:20px}.experiment-chart aside strong,.experiment-chart aside span,.experiment-chart aside small{display:block}.experiment-chart aside strong{font-size:34px;color:#1c8367}.experiment-chart aside span{font-size:13px;margin:5px 0}.experiment-chart aside small{font-size:11px;color:#718086;line-height:1.6}.flow-chart{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;align-items:center}.flow-chart button{position:relative;border:0;background:#f7f9fa;border-radius:12px;padding:13px;font:inherit;text-align:right}.flow-chart button span,.flow-chart button b{display:block}.flow-chart button span{font-size:12px;color:#6e7d82}.flow-chart button i{display:block;width:var(--w);height:12px;border-radius:99px;background:linear-gradient(90deg,#286f66,#65bba4);margin:12px 0}.flow-chart button b{font-size:14px}.flow-chart button em{position:absolute;left:-12px;top:42%;font-style:normal;color:#8c999d}.health-bars button{grid-template-columns:130px 1fr 48px}.health-bars i{height:100%;background:linear-gradient(90deg,#2d7469,#66c0a7)}
.creative-insight-grid{display:grid;grid-template-columns:1.35fr .8fr;gap:10px}.retention-curve svg{width:100%;height:205px}.retention-area{fill:#4a82df1d}.retention-line{fill:none;stroke:#427bd8;stroke-width:4;stroke-linecap:round}.retention-labels text{font-size:10px;fill:#75858a}.retention-note{background:#fff4dc;border:1px solid #efd79d;border-radius:10px;padding:10px}.retention-note b,.retention-note span{display:block}.retention-note b{font-size:13px;color:#7d5513}.retention-note span{font-size:12px;color:#856b3f;margin-top:4px}.hook-list button{width:100%;display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;border:0;border-bottom:1px solid #edf1f2;background:#fff;padding:11px 0;text-align:right;font:inherit}.hook-list button>i{font-style:normal;background:#edf3f2;color:#276e64;border-radius:7px;padding:6px;font-size:10px}.hook-list span b,.hook-list span small{display:block}.hook-list span b{font-size:12px}.hook-list span small{font-size:11px;color:#758287;margin-top:3px}.hook-list em{font-style:normal;color:#148064;background:#e3f5ee;border-radius:99px;padding:5px 7px;font-size:10px}.hook-list em.low{color:#b53a45;background:#fce7e9}.video-funnel{display:flex;align-items:center;gap:5px;overflow:auto;padding-bottom:5px}.video-funnel button{min-width:110px;flex:1;border:0;background:transparent;font:inherit;text-align:center}.video-funnel span,.video-funnel b,.video-funnel small{display:block}.video-funnel span{font-size:11px;color:#6e7d82}.video-funnel i{display:block;width:var(--w);height:58px;margin:7px auto;background:linear-gradient(180deg,#3d82e6,#80aceb);clip-path:polygon(8% 0,92% 0,100% 100%,0 100%);border-radius:5px}.video-funnel b{font-size:13px}.video-funnel small{font-size:10px;color:#77858a;margin-top:3px}
@media(max-width:900px){.viz-dashboard,.creative-insight-grid{grid-template-columns:1fr}.viz-wide{min-width:0}.product-score-grid+.viz-injected{order:-1}}
@media(max-width:680px){.viz-card{padding:13px}.viz-card svg{height:165px}.donut-wrap{grid-template-columns:120px 1fr}.donut{width:115px;height:115px}.donut:before{width:68px;height:68px}.paired-bars button,.health-bars button{grid-template-columns:105px 1fr 46px}.rank-bars button{grid-template-columns:25px 105px 1fr 30px}.mini-donuts{grid-template-columns:1fr}.mini-donuts button{display:grid;grid-template-columns:auto 1fr;align-items:center}.mini-donuts button>i{width:82px;height:82px}.mini-donuts button>i:before{width:55px;height:55px}.mini-donuts button>span{text-align:right;margin:0}.experiment-chart{grid-template-columns:1fr}.flow-chart{grid-template-columns:1fr 1fr}.flow-chart button em{display:none}.matrix{height:250px}}