.dash-host{position:absolute;inset:0;overflow:hidden;border-radius:inherit;background:#06060a}
.dl-root{position:absolute;left:0;top:0;transform-origin:0 0;font-family:'Inter',system-ui,sans-serif;color:#F5F5F7;-webkit-font-smoothing:antialiased;background:#07070B}
.dl-root svg{display:block}
.dl-app{display:flex;width:100%;height:100%}
/* entradas */
.dl-root [style*="--d"]{opacity:0;transform:translateY(10px);transition:opacity .55s cubic-bezier(.22,1,.36,1) var(--d),transform .55s cubic-bezier(.22,1,.36,1) var(--d)}
.dl-root.is-on [style*="--d"]{opacity:1;transform:none}
.dl-banner,.dl-head,.dl-card{opacity:0;transform:translateY(14px) scale(.985);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1)}
.dl-root.is-on .dl-banner{opacity:1;transform:none;transition-delay:.15s}
.dl-root.is-on .dl-head{opacity:1;transform:none;transition-delay:.4s}
.dl-root.is-on .dl-chart{opacity:1;transform:none;transition-delay:1.05s}
.dl-root.is-on .dl-sales{opacity:1;transform:none;transition-delay:1.2s}
/* lateral */
.dl-side{width:212px;flex:0 0 212px;display:flex;flex-direction:column;padding:16px 10px 12px;background:#0A0A10;border-right:1px solid #1B1B26}
.dl-brand{display:flex;align-items:center;gap:10px;padding:2px 6px 16px}
.dl-brand img{width:44px;height:44px;border-radius:12px;border:1px solid #2A2A38;max-width:none}
.dl-brand b{display:block;font:800 20px/1 'Inter',sans-serif;letter-spacing:.02em}
.dl-brand small{display:block;margin-top:4px;font-size:10px;letter-spacing:.32em;color:#A1A1B5}
.dl-side nav{display:flex;flex-direction:column;gap:2px}
.dl-nav{display:flex;align-items:center;gap:10px;height:28px;padding:0 10px;border-radius:9px;font-size:11.5px;color:#D4D4DE;white-space:nowrap}
.dl-nav.is-active{background:linear-gradient(90deg,rgba(168,85,247,.22),rgba(168,85,247,.06));color:#E9D5FF;font-weight:600}
.dl-nav.is-active .dl-nav-ico{color:#C084FC}
.dl-nav-ico{position:relative;width:16px;height:16px;flex:0 0 16px;color:#A1A1B5}
.dl-nav-ico svg{width:16px;height:16px}
.dl-nav-end{margin-left:auto;width:12px;height:12px;color:#8A8AA0}.dl-nav-end svg{width:12px;height:12px}
.dl-soon{margin-left:auto;padding:2px 6px;border:1px solid rgba(168,85,247,.5);border-radius:5px;font-size:7px;font-weight:700;letter-spacing:.04em;color:#D8B4FE}
.dl-side-foot{margin-top:auto;padding-top:10px;border-top:1px solid #1B1B26;display:flex;flex-direction:column;gap:2px}
.dl-bell i{position:absolute;top:-6px;left:-7px;min-width:14px;height:12px;padding:0 3px;border-radius:6px;background:#A855F7;font:700 7px/12px 'Inter';font-style:normal;color:#fff;text-align:center;animation:dl-ping 2.4s ease-in-out infinite}
@keyframes dl-ping{0%,100%{box-shadow:0 0 0 0 rgba(168,85,247,.6)}50%{box-shadow:0 0 0 5px rgba(168,85,247,0)}}
/* principal */
.dl-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:12px;padding:14px 16px 14px}
.dl-banner{position:relative;height:126px;flex:0 0 126px;border-radius:14px;overflow:hidden;border:1px solid #23232F;background:#05050a}
.dl-banner img{width:100%;height:100%;object-fit:cover;max-width:none;transform:scale(1.04);animation:dl-ken 14s ease-in-out infinite alternate}
@keyframes dl-ken{from{transform:scale(1.04) translateX(0);filter:saturate(1) brightness(1)}to{transform:scale(1.12) translateX(-1.5%);filter:saturate(1.25) brightness(1.15)}}
.dl-shine{position:absolute;top:0;bottom:0;width:22%;left:-30%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.14),transparent);animation:dl-shine 5s ease-in-out 1.5s infinite}
@keyframes dl-shine{0%{left:-30%}45%,100%{left:120%}}
.dl-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.dl-hello h3{margin:0;font:700 24px/1.1 'Inter',sans-serif;letter-spacing:-.01em}
.dl-hello p{margin:4px 0 0;font-size:11.5px;color:#A1A1B5}
.dl-actions{display:flex;gap:8px}
.dl-btn{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border:1px solid #23232F;border-radius:15px;background:#0E0E16;font-size:10.5px;font-weight:500;color:#E4E4EE;white-space:nowrap}
.dl-btn svg{width:13px;height:13px;color:#C084FC}
.dl-btn svg:last-child:not(:first-child){width:10px;height:10px;color:#8A8AA0}
.dl-btn-pri{background:linear-gradient(180deg,#A855F7,#8B2CF5);border-color:transparent;color:#fff;font-weight:600;animation:dl-glow 2.8s ease-in-out infinite}
.dl-btn-pri svg{color:#fff}
@keyframes dl-glow{0%,100%{box-shadow:0 0 0 0 rgba(168,85,247,.0)}50%{box-shadow:0 0 18px 0 rgba(168,85,247,.55)}}
.dl-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.dl-kpi{position:relative;height:124px;padding:12px 14px 0;border-radius:12px;border:1px solid color-mix(in srgb,var(--c) 60%,transparent);background:radial-gradient(120% 90% at 100% 100%,color-mix(in srgb,var(--c) 18%,transparent),transparent 60%),#0C0B14;overflow:hidden;box-shadow:inset 0 0 24px -12px var(--c)}
.dl-kpi-top{display:flex;justify-content:space-between;align-items:flex-start;font-size:11.5px;color:#E4E4EE;font-weight:500}
.dl-kpi-ico{width:28px;height:28px;display:grid;place-items:center;border-radius:8px;background:color-mix(in srgb,var(--c) 22%,#14121F);color:#F0E6FF}
.dl-kpi-ico svg{width:15px;height:15px}
.dl-kpi-ico b{font-size:14px}
.dl-kpi-val{margin-top:2px;font:700 26px/1 'Inter',sans-serif;letter-spacing:-.01em;font-variant-numeric:tabular-nums;transition:color .3s,text-shadow .3s}
.dl-kpi.is-bump .dl-kpi-val{animation:dl-bump .7s ease-out}
@keyframes dl-bump{0%{color:#fff;text-shadow:none}30%{color:#F0ABFC;text-shadow:0 0 14px rgba(236,72,153,.6)}100%{color:#F5F5F7;text-shadow:none}}
.dl-kpi-sub{margin-top:8px;font-size:9.5px;color:#A1A1B5;white-space:nowrap}
.dl-kpi-sub em{display:inline-flex;align-items:center;gap:2px;font-style:normal;font-weight:700;font-size:11px;color:#22C55E;margin-right:3px}
.dl-kpi-sub em svg{width:10px;height:10px}
.dl-spark{position:absolute;left:12px;right:12px;bottom:8px;width:calc(100% - 24px);height:40px;overflow:visible}
.dl-spark-line{fill:none;stroke:var(--c);stroke-width:2.2;stroke-dasharray:600;stroke-dashoffset:600;transition:stroke-dashoffset 1.4s cubic-bezier(.22,1,.36,1) calc(var(--d) + .3s)}
.dl-root.is-on .dl-spark-line{stroke-dashoffset:0}
.dl-spark-area{fill:color-mix(in srgb,var(--c) 22%,transparent);opacity:0;transition:opacity 1s ease calc(var(--d) + .9s)}
.dl-root.is-on .dl-spark-area{opacity:1}
.dl-spark-dot{fill:#fff;stroke:var(--c);stroke-width:3;opacity:0;transition:opacity .4s ease calc(var(--d) + 1.4s)}
.dl-root.is-on .dl-spark-dot{opacity:1}
.dl-bottom{flex:1;min-height:0;display:grid;grid-template-columns:2.25fr 1fr;gap:12px}
.dl-card{position:relative;min-height:0;padding:12px 14px;border-radius:12px;border:1px solid #1E1E2A;background:#0B0B12}
.dl-card-head{display:flex;justify-content:space-between;align-items:flex-start}
.dl-card h4{margin:0;font:700 14px/1.2 'Inter',sans-serif}
.dl-card p{margin:3px 0 0;font-size:10px;color:#A1A1B5}
.dl-seg{display:flex;padding:3px;border-radius:9px;background:#14141E;font-size:10px}
.dl-seg span{padding:5px 12px;border-radius:7px;color:#A1A1B5}
.dl-seg .is-on{background:#2A1745;color:#fff}
.dl-legend{display:flex;gap:16px;margin:10px 0 0 46px;font-size:9.5px;color:#D4D4DE}
.dl-legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;vertical-align:-1px}
.dl-main-chart{position:absolute;left:58px;right:44px;top:86px;width:calc(100% - 102px);height:calc(100% - 112px);overflow:visible}
.dl-grid line{stroke:#1C1C28;stroke-width:1}
.dl-line-rev{fill:none;stroke:#A855F7;stroke-width:2.6}
.dl-line-ord{fill:none;stroke:#EC4899;stroke-width:2.4}
.dl-dot-rev{fill:#A855F7}.dl-dot-ord{fill:#EC4899}
.dl-reveal{transition:width 1.8s cubic-bezier(.65,0,.35,1)}
.dl-reveal.is-in{width:640px}
.dl-cursor{stroke:rgba(196,181,253,.5);stroke-dasharray:3 3;opacity:0;transition:opacity .4s 1s}
.dl-cur-rev{fill:#fff;stroke:#A855F7;stroke-width:3;opacity:0;transition:opacity .4s 1s}
.dl-cur-ord{fill:#fff;stroke:#EC4899;stroke-width:3;opacity:0;transition:opacity .4s 1s}
.dl-root.is-on .dl-cursor,.dl-root.is-on .dl-cur-rev,.dl-root.is-on .dl-cur-ord{opacity:1}
.dl-axis-y{position:absolute;top:80px;bottom:30px;display:flex;flex-direction:column;justify-content:space-between;font-size:8.5px}
.dl-axis-l{left:10px;color:#C084FC}.dl-axis-r{right:14px;color:#F472B6;text-align:right}
.dl-axis-x{position:absolute;left:58px;right:44px;bottom:10px;display:flex;justify-content:space-between;font-size:8.5px;color:#A1A1B5}
.dl-tip{position:absolute;top:44px;transform:translateX(-50%);display:flex;flex-direction:column;gap:3px;padding:7px 10px;border:1px solid rgba(168,85,247,.45);border-radius:8px;background:rgba(14,10,24,.92);font-size:9.5px;white-space:nowrap;opacity:0;transition:opacity .4s 1s;margin-left:29px}
.dl-root.is-on .dl-tip{opacity:1}
.dl-tip b{font-weight:500;color:#D4D4DE}
.dl-tip span{display:flex;align-items:center;gap:5px}
.dl-tip i{width:7px;height:7px;border-radius:50%}
.dl-tip em{font-style:normal;font-weight:600}
.dl-link{padding:5px 10px;border:1px solid rgba(168,85,247,.5);border-radius:8px;font-size:9px;color:#D8B4FE;white-space:nowrap}
.dl-list{position:relative;margin-top:12px;display:flex;flex-direction:column;gap:7px;overflow:hidden;max-height:calc(100% - 44px)}
.dl-row{display:flex;align-items:center;gap:10px;height:36px;transition:opacity .45s cubic-bezier(.22,1,.36,1),transform .45s cubic-bezier(.22,1,.36,1),max-height .45s,margin .45s;max-height:36px;overflow:hidden;flex:0 0 auto}
.dl-row.is-new{opacity:0;transform:translateX(18px);max-height:0;margin-bottom:-7px}
.dl-row.is-out{opacity:0;transform:translateY(8px)}
.dl-row img{width:34px;height:34px;border-radius:7px;max-width:none;object-fit:cover}
.dl-row-id{flex:1;min-width:0}
.dl-row-id b{display:block;font-size:11px;font-weight:700}
.dl-row-id small{display:block;margin-top:2px;font-size:9px;color:#A1A1B5}
.dl-row-val{font-size:11px;font-weight:600;font-variant-numeric:tabular-nums}
.dl-pill{width:50px;height:20px;display:grid;place-items:center;border-radius:7px;font-size:9px;font-weight:600;transition:background .35s,color .35s}
.dl-pill.is-wait{background:rgba(234,179,8,.14);color:#FACC15}
.dl-pill.is-paid{background:rgba(34,197,94,.16);color:#4ADE80;animation:dl-paid .6s ease-out}
@keyframes dl-paid{0%{transform:scale(.85)}60%{transform:scale(1.08)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.dl-banner img,.dl-shine,.dl-btn-pri,.dl-bell i{animation:none}}
