*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f6f7fb;color:#202536;font-family:"DM Sans",sans-serif;font-size:14px}.app{display:flex;min-height:100vh}.sidebar{width:255px;background:#fff;border-right:1px solid #e8eaf0;position:fixed;top:0;bottom:0;left:0;padding:25px 16px;display:flex;flex-direction:column;z-index:20}.brand{display:flex;gap:10px;align-items:center;padding:0 11px;color:#202536;font-family:"Space Grotesk",sans-serif;font-size:1.2rem;font-weight:700;letter-spacing:-.03em}.brand small{display:block;font:600 .47rem "DM Sans";letter-spacing:.15em;color:#8990a0;margin-top:2px}.logo{width:35px;height:35px;border-radius:10px;background:#536ff2;color:#fff;display:grid;place-items:center;font-weight:800}.sidebar nav{margin-top:40px}.nav-label{font-size:.63rem;font-weight:800;color:#a0a5b2;letter-spacing:.14em;padding:0 13px;margin:0 0 10px}.nav-label:not(:first-child){margin-top:28px}.sidebar nav a{height:44px;display:flex;align-items:center;gap:12px;padding:0 13px;margin:3px 0;border-radius:9px;color:#687080;font-weight:600}.sidebar nav a:hover{background:#f4f5fc;color:#536ff2}.sidebar nav a.active{background:#eef0ff;color:#4e68e6}.sidebar nav i{font-style:normal;width:18px;text-align:center;font-size:16px}.count{margin-left:auto;background:#f1effd;color:#8067c8;border-radius:12px;padding:2px 7px;font-size:.65rem}.sidebar-card{margin-top:auto;background:#f2f4ff;border:1px solid #e1e4ff;border-radius:13px;padding:17px}.sidebar-card .spark{color:#536ff2}.sidebar-card strong{display:block;margin-top:8px;font-size:.88rem}.sidebar-card p{font-size:.72rem;line-height:1.5;color:#737b8d;margin:5px 0 12px}.sidebar-card a{font-size:.72rem;font-weight:800;color:#536ff2}.profile{border-top:1px solid #edf0f3;margin-top:18px;padding:17px 6px 0;display:flex;gap:10px;align-items:center}.avatar,.top-avatar,.person{display:grid;place-items:center;border-radius:50%;background:#dfe4ff;color:#536ff2;font-weight:800}.avatar{width:34px;height:34px;font-size:.68rem}.profile strong,.profile small{display:block}.profile strong{font-size:.76rem}.profile small{font-size:.65rem;color:#8a909d}.profile>span{margin-left:auto;color:#9ca2af}.main{margin-left:255px;width:calc(100% - 255px);min-width:0}.topbar{height:70px;background:#fff;border-bottom:1px solid #e8eaf0;display:flex;align-items:center;justify-content:space-between;padding:0 35px}.crumb{font-size:.76rem;color:#858b99}.crumb span{padding:0 8px;color:#c2c6ce}.top-actions{display:flex;align-items:center;gap:10px}.icon-btn{border:0;background:transparent;width:34px;height:34px;border-radius:8px;color:#737b8c;font-size:17px;position:relative}.icon-btn:hover{background:#f5f6f9}.notification em{position:absolute;width:6px;height:6px;background:#ed6b74;border:2px solid #fff;border-radius:50%;top:7px;right:7px}.top-avatar{width:34px;height:34px;font-size:.65rem;margin-left:6px}.mobile-menu{display:none;border:0;background:none;font-size:20px}.content{padding:32px 35px 55px;max-width:1600px;margin:auto}.welcome{display:flex;justify-content:space-between;align-items:end;margin-bottom:27px}.eyebrow{font-size:.62rem;font-weight:800;letter-spacing:.12em;color:#9a9fab;margin:0 0 7px}.welcome h1{font:700 1.65rem "Space Grotesk";letter-spacing:-.04em;margin:0}.welcome h1 span{color:#f3b65b}.welcome>div>p:last-child{color:#8a909d;margin:5px 0 0;font-size:.8rem}.actions{display:flex;gap:9px}.btn{border:0;border-radius:8px;padding:10px 15px;font:600 .75rem "DM Sans";cursor:pointer}.btn.primary{background:#536ff2;color:#fff;box-shadow:0 4px 10px rgba(83,111,242,.18)}.btn.secondary{background:#fff;border:1px solid #e2e5eb;color:#5d6472}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:15px}.metric,.panel{background:#fff;border:1px solid #e7e9ee;border-radius:11px}.metric{padding:18px}.metric-top{display:flex;justify-content:space-between;align-items:center;color:#777e8c;font-size:.7rem}.metric-top b{font-size:.64rem;color:#2ca477;background:#e8f7f0;padding:4px 7px;border-radius:10px}.metric-top b.neutral{color:#536ff2;background:#eef0ff}.metric>strong{display:block;font:700 1.55rem "Space Grotesk";margin:10px 0 7px}.metric small{font-size:.64rem;color:#9ba0aa}.mini-chart{height:30px;display:flex;align-items:end;gap:3px;margin-bottom:5px}.mini-chart span{width:11px;border-radius:3px 3px 0 0;background:#536ff2;opacity:.25}.mini-chart span:nth-last-child(-n+3){opacity:.55}.mini-chart.violet span{background:#8a69df}.mini-chart.green span{background:#2eb18a}.mini-chart.orange span{background:#f0a64e}.grid-main{display:grid;grid-template-columns:1.8fr 1fr;gap:15px;margin-bottom:15px}.grid-bottom{display:grid;grid-template-columns:1.8fr 1fr;gap:15px}.panel{padding:19px}.panel-head{display:flex;justify-content:space-between;align-items:start;margin-bottom:18px}.panel-head h2{font:700 .92rem "Space Grotesk";margin:0}.panel-head p{font-size:.66rem;color:#9a9faa;margin:4px 0 0}.panel-head select{border:1px solid #e4e6eb;border-radius:7px;padding:7px 9px;color:#717786;background:#fff;font:600 .65rem "DM Sans"}.dots{border:0;background:none;color:#a1a6b0;letter-spacing:2px}.chart-wrap{height:280px;display:flex}.y-labels{width:45px;display:flex;flex-direction:column;justify-content:space-between;padding:4px 8px 35px 0;color:#a1a6b1;font-size:.61rem;text-align:right}.chart{position:relative;flex:1}.grid-lines{position:absolute;inset:5px 0 34px;display:flex;flex-direction:column;justify-content:space-between}.grid-lines i{border-top:1px dashed #edf0f4}.chart svg{position:absolute;left:0;right:0;top:4px;width:100%;height:215px}.x-labels{position:absolute;bottom:3px;left:0;right:0;display:flex;justify-content:space-between;color:#9da2ad;font-size:.61rem}.channels{display:flex;flex-direction:column}.donut{width:165px;height:165px;border-radius:50%;background:conic-gradient(#536ff2 0 42%,#8c70dd 42% 70%,#55b69b 70% 88%,#f1b05d 88% 100%);margin:6px auto 20px;display:grid;place-items:center}.donut:before{content:"";position:absolute;width:108px;height:108px;border-radius:50%;background:#fff}.donut>div{position:relative;text-align:center}.donut strong,.donut small{display:block}.donut strong{font:700 1.1rem "Space Grotesk"}.donut small{font-size:.62rem;color:#9298a4}.legend{display:grid;grid-template-columns:1fr 1fr;gap:12px 22px}.legend span{font-size:.68rem;color:#737b8a}.legend i{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px}.legend b{float:right;color:#3d4554}.c1{background:#536ff2}.c2{background:#8c70dd}.c3{background:#55b69b}.c4{background:#f1b05d}.view{font-size:.67rem;font-weight:700;color:#536ff2}.table-scroll{overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:600px}th{font-size:.6rem;color:#9ba0ab;text-align:left;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:9px 8px;border-bottom:1px solid #edf0f3}td{font-size:.68rem;color:#717887;padding:12px 8px;border-bottom:1px solid #f0f1f4}tbody tr:last-child td{border:0}.customer{display:flex;align-items:center;gap:9px}.person{width:30px;height:30px;font-size:.58rem;flex:none}.p1{background:#e6eaff;color:#596de0}.p2{background:#e8f6f1;color:#35a07e}.p3{background:#fff0df;color:#c67c28}.p4{background:#f2eafa;color:#8b63c6}.customer strong,.customer small{display:block}.customer strong{color:#3e4654;font-size:.68rem}.customer small{font-size:.58rem;color:#a0a5ae;margin-top:2px}.status{padding:4px 8px;border-radius:10px;font-size:.57rem;font-weight:700}.paid{background:#e9f7f1;color:#2c9a73}.pending{background:#fff4df;color:#bc7a25}.failed{background:#ffebed;color:#ce5e68}.feed>div{display:flex;gap:10px;padding:11px 0;border-bottom:1px solid #f0f1f4}.feed>div:last-child{border:0}.feed-icon{width:29px;height:29px;border-radius:8px;display:grid;place-items:center;flex:none;font-size:.72rem;font-weight:800}.blue-bg{background:#e9edff;color:#536ff2}.purple-bg{background:#f0eaff;color:#8664ce}.orange-bg{background:#fff0dd;color:#c9822b}.green-bg{background:#e6f6f0;color:#2e9a76}.feed p{margin:0;font-size:.66rem;color:#747b89;line-height:1.35}.feed p strong{color:#414957}.feed p b{color:#536ff2}.feed small{display:block;color:#a3a8b1;font-size:.58rem;margin-top:3px}@media(max-width:1100px){.metrics{grid-template-columns:1fr 1fr}.grid-main,.grid-bottom{grid-template-columns:1fr}.sidebar{width:225px}.main{margin-left:225px;width:calc(100% - 225px)}}@media(max-width:760px){.sidebar{transform:translateX(-100%);transition:.25s}.sidebar.open{transform:translateX(0)}.main{margin-left:0;width:100%}.mobile-menu{display:block}.topbar{padding:0 18px}.crumb{display:none}.content{padding:25px 17px}.welcome{align-items:start;gap:20px;flex-direction:column}.actions{width:100%}.actions .btn{flex:1}.metrics{grid-template-columns:1fr 1fr}.metric{padding:14px}.metric>strong{font-size:1.3rem}.top-actions .icon-btn:nth-child(-n+2){display:none}}@media(max-width:480px){.metrics{grid-template-columns:1fr}.panel{padding:14px}.welcome h1{font-size:1.4rem}.chart-wrap{height:250px}}