/* Profinance Monitor Work V53.92 — fidelidade visual + motion + mobile */
:root{
  color-scheme:dark;
  --mw-bg:#020615;
  --mw-panel:rgba(5,16,38,.76);
  --mw-panel-strong:rgba(4,13,31,.92);
  --mw-line:rgba(89,126,213,.24);
  --mw-glow-purple:#7f32ff;
  --mw-glow-blue:#11a8ff;
  --mw-glow-green:#16e67f;
  --mw-glow-yellow:#ffb20d;
  --mw-glow-red:#ff334f;
}
html,body{background:#020615!important;color:#fff!important}
html[data-theme="light"],html[data-theme="system"]{color-scheme:dark!important}
[data-theme-toggle],.theme-icon-standard,.pf-theme-header-toggle,#pf-fixed-theme-toggle{display:none!important}
body{min-height:100dvh;background:
  radial-gradient(circle at 12% -10%,rgba(93,35,255,.22),transparent 28%),
  radial-gradient(circle at 91% 4%,rgba(0,136,255,.15),transparent 26%),
  radial-gradient(circle at 55% 72%,rgba(18,43,110,.08),transparent 34%),
  linear-gradient(180deg,#020615 0%,#020818 50%,#020512 100%)!important}
body:before{opacity:.7;animation:gridDrift 28s linear infinite}
body:after{content:"";position:fixed;inset:-35vh -20vw;z-index:0;pointer-events:none;background:
  radial-gradient(circle at 28% 35%,rgba(120,54,255,.09),transparent 18%),
  radial-gradient(circle at 68% 58%,rgba(0,170,255,.07),transparent 22%),
  radial-gradient(circle at 83% 24%,rgba(0,255,166,.035),transparent 16%);filter:blur(22px);animation:ambientFloat 19s ease-in-out infinite alternate}
@keyframes gridDrift{to{background-position:56px 56px}}
@keyframes ambientFloat{0%{transform:translate3d(-1.5%,0,0) scale(1)}100%{transform:translate3d(2%,1.5%,0) scale(1.05)}}

/* Cabeçalho mais fiel ao preview: limpo, premium, sem tema */
.mw-top{height:72px;background:linear-gradient(180deg,rgba(2,6,20,.96),rgba(2,7,22,.86))!important;border-bottom:1px solid rgba(76,105,170,.16)!important;box-shadow:0 12px 38px rgba(0,0,0,.12)}
.mw-topin{width:min(1720px,100%);padding:0 24px;gap:18px}
.mw-logo{width:202px;filter:drop-shadow(0 6px 18px rgba(73,77,255,.14))}
.mw-name{font-size:22px;letter-spacing:-.03em}
.mw-open-note{background:rgba(94,40,255,.12);border-color:rgba(125,61,255,.25);color:#b393ff;box-shadow:inset 0 0 22px rgba(98,46,255,.035)}
.mw-btn{height:40px;border-radius:10px;background:rgba(4,11,28,.68);border-color:rgba(101,128,188,.22);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease}
.mw-btn:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(0,0,0,.22),0 0 18px rgba(87,61,255,.07)}
.mw-btn.primary{background:linear-gradient(100deg,#5d21e7,#7225fa 56%,#7e28ef);box-shadow:0 10px 30px rgba(107,39,244,.25),inset 0 1px rgba(255,255,255,.08)}

.mw-main{width:min(1720px,100%);padding:13px 18px 30px}

/* Topo: proporções mais próximas do layout aprovado */
.top-rail{grid-template-columns:310px repeat(6,minmax(138px,1fr));gap:10px;margin-bottom:12px}
.clock-zone,.kpi{box-shadow:inset 0 1px rgba(255,255,255,.03),0 12px 34px rgba(0,0,0,.15)}
.clock-zone{min-height:136px;border-radius:18px;background:linear-gradient(120deg,rgba(7,19,48,.8),rgba(12,8,38,.78));overflow:hidden}
.clock-zone:before{content:"";position:absolute;width:2px;height:70%;left:0;top:15%;background:linear-gradient(transparent,#7136ff,transparent);box-shadow:0 0 14px #7136ff;opacity:.75}
.clock-zone:after{animation:ringBreath 3.2s ease-in-out infinite,ringOrbit 13s linear infinite;transform-origin:center}
@keyframes ringOrbit{0%{filter:hue-rotate(0deg)}100%{filter:hue-rotate(24deg)}}
.clock-time{font-size:50px;text-shadow:0 0 24px rgba(127,50,255,.08)}
.kpi{border-radius:15px;background:linear-gradient(155deg,rgba(5,17,41,.96),rgba(3,10,26,.89));isolation:isolate}
.kpi:before{content:"";position:absolute;inset:-1px;border-radius:inherit;background:linear-gradient(120deg,color-mix(in srgb,var(--kcolor) 16%,transparent),transparent 35%,transparent 72%,color-mix(in srgb,var(--kcolor) 7%,transparent));z-index:-1;opacity:.65}
.kpi:after{content:"";position:absolute;left:-45%;top:-100%;width:42%;height:260%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.09),transparent);transform:rotate(18deg);animation:kpiShimmer 8s ease-in-out infinite;opacity:.35;pointer-events:none}
@keyframes kpiShimmer{0%,58%{left:-45%;opacity:0}67%{opacity:.45}82%,100%{left:120%;opacity:0}}
.kpi:nth-of-type(2):after{animation-delay:1.2s}.kpi:nth-of-type(3):after{animation-delay:2.2s}.kpi:nth-of-type(4):after{animation-delay:3.1s}.kpi:nth-of-type(5):after{animation-delay:4.1s}.kpi:nth-of-type(6):after{animation-delay:5.1s}
.kpi strong{font-size:31px}
.spark path{stroke-dasharray:90;stroke-dashoffset:90;animation:sparkDraw 2.8s ease forwards,sparkGlow 3.7s ease-in-out infinite 2.8s}
@keyframes sparkDraw{to{stroke-dashoffset:0}}@keyframes sparkGlow{50%{opacity:.45;filter:drop-shadow(0 0 8px var(--kcolor))}}

/* Mapa: protagonista visual, mais vivo */
.map-section{height:330px;border-radius:17px;border-color:rgba(63,109,210,.28);background:#03102a;box-shadow:0 24px 65px rgba(0,0,0,.27),inset 0 0 35px rgba(61,56,255,.035)}
.map-section:before{content:"";position:absolute;z-index:404;pointer-events:none;left:-20%;top:-70%;width:18%;height:240%;transform:rotate(18deg);background:linear-gradient(90deg,transparent,rgba(83,153,255,.08),rgba(133,72,255,.10),transparent);filter:blur(7px);animation:mapSweep 10s ease-in-out infinite}
@keyframes mapSweep{0%,25%{left:-24%;opacity:0}35%{opacity:.8}65%{left:108%;opacity:.45}72%,100%{left:108%;opacity:0}}
.map-section:after{box-shadow:inset 0 0 105px rgba(0,0,0,.42),inset 0 0 36px rgba(66,56,255,.16)}
.leaflet-tile-pane{filter:saturate(1.75) contrast(1.24) brightness(.64) hue-rotate(7deg)!important}
.map-copy{top:17px;left:20px;width:225px}.map-copy h2{font-size:15px}.map-copy p{color:#8fa2c6}
.map-legend,.map-online{background:linear-gradient(180deg,rgba(3,11,29,.92),rgba(3,12,32,.82));border-color:rgba(91,121,190,.26);box-shadow:0 18px 40px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.025)}
.map-online{width:160px}.map-online strong{font-size:30px}
.mw-map-pin .core{animation:pinCore 1.7s ease-in-out infinite}@keyframes pinCore{50%{transform:scale(1.2);filter:brightness(1.35)}}
.mw-map-label{background:linear-gradient(160deg,rgba(4,14,36,.97),rgba(3,11,29,.94));backdrop-filter:blur(14px);border-color:color-mix(in srgb,var(--pin) 35%,rgba(92,121,186,.35));box-shadow:0 15px 36px rgba(0,0,0,.42),0 0 19px color-mix(in srgb,var(--pin) 10%,transparent)}

/* Operadores mais próximos dos cards do preview */
.operators{border-radius:17px;background:linear-gradient(180deg,rgba(3,12,29,.72),rgba(2,8,20,.74));border-color:rgba(58,100,182,.18);box-shadow:0 18px 48px rgba(0,0,0,.18);padding-top:11px}
.operators-head h2{font-size:15px}
.op-card{flex-basis:275px;min-height:254px;border-radius:13px;background:linear-gradient(162deg,rgba(6,20,43,.95),rgba(2,11,27,.95));box-shadow:inset 0 1px rgba(255,255,255,.025),0 12px 35px rgba(0,0,0,.14);animation:cardRise .46s cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--delay,0ms)}
@keyframes cardRise{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
.op-card:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(125deg,color-mix(in srgb,var(--statusColor) 7%,transparent),transparent 31%,transparent 72%,color-mix(in srgb,var(--statusColor) 4%,transparent));opacity:.8}
.op-card:hover{transform:translateY(-4px) scale(1.012)}
.op-card.active{animation-name:cardRise,activeBreath;animation-duration:.46s,4.8s;animation-delay:var(--delay,0ms),calc(var(--delay,0ms) + .7s);animation-iteration-count:1,infinite}
@keyframes activeBreath{50%{box-shadow:inset 0 1px rgba(255,255,255,.025),0 10px 32px color-mix(in srgb,var(--statusColor) 9%,transparent)}}
.op-card.critical{animation:cardRise .46s cubic-bezier(.2,.7,.2,1) both,var(--criticalAnim,criticalCard) 1.25s ease-in-out infinite;animation-delay:var(--delay,0ms),.7s}
.avatar-ring{width:57px;height:57px;flex-basis:57px;animation:avatarHalo 5s linear infinite}@keyframes avatarHalo{50%{filter:drop-shadow(0 0 9px color-mix(in srgb,var(--statusColor) 22%,transparent))}}
.status-pill{box-shadow:0 0 13px color-mix(in srgb,var(--statusColor) 8%,transparent)}
.detail-btn{height:36px;border-radius:9px;background:linear-gradient(180deg,rgba(15,34,67,.9),rgba(8,21,45,.9));transition:.2s ease}
.detail-btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(0,0,0,.2),0 0 14px color-mix(in srgb,var(--statusColor) 8%,transparent)}
.operator-spark path{stroke-dasharray:90;stroke-dashoffset:90;animation:sparkDraw 2.3s ease forwards}

/* Drawer com movimento e profundidade */
.drawer-backdrop{background:rgba(0,4,14,.76);backdrop-filter:blur(11px)}
.drawer{background:linear-gradient(155deg,#06142c,#041126 62%,#031024);box-shadow:-26px 0 100px rgba(0,0,0,.48),0 0 70px rgba(73,55,255,.08)}
.drawer-backdrop.open .drawer{animation:drawerIn .34s cubic-bezier(.18,.75,.23,1)}
@keyframes drawerIn{from{opacity:.72;transform:translateX(50px) scale(.988)}to{opacity:1;transform:translateX(0) scale(1)}}
.drawer-avatar{animation:detailHalo 4s ease-in-out infinite}@keyframes detailHalo{50%{box-shadow:0 0 32px color-mix(in srgb,var(--detailColor) 28%,transparent)}}
.gauge-ring{animation:gaugeGlow 3.5s ease-in-out infinite}@keyframes gaugeGlow{50%{filter:drop-shadow(0 0 14px rgba(16,225,117,.32))}}

/* Modo TV mais fiel ao preview aprovado */
.tv-mode body{overflow:hidden}
.tv-mode .mw-main{width:100%;max-width:1920px;padding:16px 28px 20px}
.tv-mode .tv-head{height:58px;margin-bottom:8px}.tv-mode .tv-head img{width:210px}.tv-mode .tv-title{font-size:24px}.tv-mode .clock-zone{padding-top:28px}.tv-mode .clock-time{font-size:86px;text-shadow:0 0 30px rgba(127,50,255,.14)}
.tv-mode .map-section{height:435px}.tv-mode .op-card{border-width:1px;box-shadow:0 14px 38px rgba(0,0,0,.18)}
.tv-mode .tv-ticker{box-shadow:0 12px 34px rgba(0,0,0,.2),inset 0 1px rgba(255,255,255,.025)}

/* Dock mobile */
.mw-mobile-dock{display:none}

/* TABLET */
@media(max-width:1180px){
  .top-rail{grid-template-columns:290px repeat(3,1fr)}
  .map-section{height:370px}
}

/* MOBILE: desenhado como produto próprio, não apenas "encolhido" */
@media(max-width:720px){
  body{padding-bottom:76px;background:linear-gradient(180deg,#020615,#020918 55%,#020512)!important}
  body:before{background-size:42px 42px;opacity:.45}
  .mw-top{height:62px;position:sticky}
  .mw-topin{padding:0 10px;gap:9px}
  .mw-logo{width:138px;max-height:34px}
  .mw-name,.mw-sep,.mw-open-note,#openNewBtn{display:none!important}
  .mw-top-actions{margin-left:auto;gap:7px}
  #tvBtn{width:46px;padding:0;font-size:0;border-radius:11px;background:linear-gradient(145deg,rgba(69,36,160,.22),rgba(8,18,42,.82))}
  #tvBtn:after{content:"TV";font:800 10px JetBrains Mono;color:#c6adff}
  .mw-main{padding:10px 10px 24px}
  .top-rail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-bottom:9px}
  .clock-zone{grid-column:1/-1;min-height:112px;padding:15px 17px;border-radius:16px}
  .clock-time{font-size:42px}.clock-date{font-size:11px}.clock-week{font-size:11px}
  .clock-zone:after{width:145px;height:145px;right:-72px;top:-18px}
  .kpi{min-height:96px;padding:10px 11px;border-radius:13px}
  .kpi-head{gap:7px;font-size:9px}.kpi-icon{width:30px;height:30px;border-radius:9px;font-size:15px}
  .kpi strong{font-size:25px;margin:8px 0 0 38px}.kpi small{font-size:7.5px;margin:8px 0 0 38px}.spark{width:43px;height:17px;right:7px;bottom:19px}
  .map-section{height:360px;border-radius:16px;margin-bottom:9px}
  .map-copy{left:13px;top:13px;width:170px;padding:9px 10px;border-radius:11px;background:rgba(3,12,31,.72);backdrop-filter:blur(8px);pointer-events:none}.map-copy h2{font-size:12px}.map-copy p{display:none}.live-badge{font-size:7px;margin-left:3px}.live-dot{width:6px;height:6px}
  .map-legend{left:12px;bottom:11px;width:129px;padding:9px 10px;border-radius:11px;font-size:8px}.map-legend b{margin-bottom:5px}.legend-row{margin:4px 0;gap:6px}
  .map-online{right:11px;bottom:11px;width:112px;padding:10px;border-radius:11px}.map-online strong{font-size:24px}.map-online span{font-size:7px}.map-online:after{margin-top:8px}
  .leaflet-control-zoom{transform:scale(.82);transform-origin:top left}.leaflet-control-attribution{font-size:6px!important;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mw-map-label{min-width:105px;font-size:7px;padding:6px 8px;transform:translate(13px,-14px)}.mw-map-label b{font-size:8px}
  .operators{border-radius:16px;padding:10px 8px 8px;margin-bottom:4px}
  .operators-head{padding:0 4px 9px;gap:7px}.operators-head h2{font-size:13px}.operators-note{display:none}
  .operator-scroller{gap:8px;scroll-snap-type:x mandatory;padding-bottom:4px;-webkit-overflow-scrolling:touch}
  .op-card{flex:0 0 84vw;max-width:330px;min-height:245px;scroll-snap-align:center;border-radius:14px;padding:13px}
  .avatar-ring{width:60px;height:60px;flex-basis:60px}.op-copy b{font-size:12px}.op-copy strong{font-size:9px}.op-location{font-size:8px}.status-pill{font-size:7px}
  .op-row{grid-template-columns:82px 1fr;font-size:8px}.op-row b{font-size:9px}
  .op-stat span{font-size:7px}.op-stat b{font-size:10px}
  .detail-btn{height:38px;font-size:9px}
  .base-note{display:none}

  .drawer-backdrop{backdrop-filter:blur(7px)}
  .drawer{position:absolute;left:0;right:0;top:auto;bottom:0;width:100%!important;height:94dvh;border-radius:22px 22px 0 0;border-left:0;border-right:0;border-bottom:0;transform:translateY(50px)}
  .drawer-backdrop.open .drawer{transform:translateY(0);animation:sheetIn .3s cubic-bezier(.18,.75,.23,1)}
  @keyframes sheetIn{from{opacity:.65;transform:translateY(70px)}to{opacity:1;transform:translateY(0)}}
  .drawer-head{padding:14px 12px 10px;gap:10px;align-items:center}.drawer-avatar{width:58px;height:58px}.drawer-who h2{font-size:16px;margin-top:1px}.drawer-who strong{font-size:8px}.drawer-who p{font-size:7.5px}.drawer-location{width:100%;order:5;min-height:58px;padding:9px 10px;margin:2px 0 0}.drawer-actions{margin-left:auto}.drawer-actions #followBtn{display:none}.drawer-close{width:34px;height:34px}
  .drawer-metrics{display:flex;overflow-x:auto;gap:7px;padding:9px 10px;scroll-snap-type:x proximity}.drawer-metric{flex:0 0 132px;scroll-snap-align:start;padding:9px}.drawer-metric span{font-size:7px}.drawer-metric b{font-size:9px}
  .drawer-body{display:block;padding:0 10px 92px;overflow:auto}.timeline-box,.drawer-box{margin-bottom:9px;border-radius:12px}.timeline-box{max-height:none;padding:10px}.drawer-right{display:block}.tools-today{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.tool-today{padding:8px}.tool-today strong{font-size:14px}.drawer-box{padding:10px}.donut-wrap{justify-content:center}.actions-box{overflow-x:auto}.actions-table{min-width:560px;font-size:7px}
  .drawer-foot{position:relative;left:auto;right:auto;bottom:auto;flex:0 0 auto;padding:10px;background:linear-gradient(180deg,rgba(3,12,29,.88),rgba(3,12,29,.98));backdrop-filter:blur(12px)}.drawer-foot .mw-btn{height:42px}

  .mw-mobile-dock{position:fixed;display:grid;grid-template-columns:repeat(4,1fr);left:10px;right:10px;bottom:10px;height:56px;z-index:70;border-radius:16px;border:1px solid rgba(83,111,181,.28);background:rgba(3,11,28,.88);backdrop-filter:blur(18px);box-shadow:0 18px 45px rgba(0,0,0,.4),inset 0 1px rgba(255,255,255,.035);overflow:hidden}
  .mw-mobile-dock button,.mw-mobile-dock a{border:0;background:transparent;color:#a9b8d4;text-decoration:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font:700 8px JetBrains Mono;cursor:pointer}.mw-mobile-dock i{font-style:normal;font-size:16px;color:#8a55ff}.mw-mobile-dock button:active,.mw-mobile-dock a:active{background:rgba(93,53,255,.13);color:#fff}

  /* TV no celular: útil em landscape e não quebra em portrait */
  .tv-mode body{padding-bottom:0;overflow:auto}
  .tv-mode .mw-main{padding:8px 9px 18px}
  .tv-mode .tv-head{display:flex;height:auto;min-height:54px;flex-wrap:wrap;gap:8px;margin:0 0 8px;padding:4px}.tv-mode .tv-head img{width:132px}.tv-mode .tv-title{font-size:13px}.tv-mode .tv-actions{width:100%;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:7px}.tv-mode .tv-actions .mw-btn{height:36px;font-size:8px;padding:0 8px}
  .tv-mode .top-rail{float:none;width:100%;display:grid;grid-template-columns:repeat(2,1fr);padding:0;gap:7px}.tv-mode .clock-zone{grid-column:1/-1;height:130px;padding:16px}.tv-mode .clock-time{font-size:45px}.tv-mode .clock-date{font-size:11px;margin-top:10px}.tv-mode .clock-week{font-size:10px}.tv-mode .kpi{display:block;width:auto;height:94px;margin:0;padding:10px}.tv-mode .kpi.blue{display:block}.tv-mode .kpi strong{font-size:24px;margin:8px 0 0 37px}.tv-mode .kpi small{font-size:7px;margin:7px 0 0 37px}.tv-mode .kpi-head{font-size:8px}.tv-mode .kpi-head .kpi-icon{width:29px;height:29px;font-size:14px}
  .tv-mode .map-section{float:none;width:100%;height:360px;margin:8px 0}.tv-mode .map-copy{display:block}.tv-mode .map-online{display:block}.tv-mode .operators{clear:both}.tv-mode .op-card{flex-basis:84vw;min-height:180px}.tv-mode .op-top{padding:4px}.tv-mode .avatar-ring{width:64px;height:64px;flex-basis:64px}.tv-mode .op-copy b{font-size:12px}.tv-mode .op-copy strong{font-size:9px}.tv-mode .op-location{font-size:8px}.tv-mode .tv-ticker{height:44px}.tv-mode .mw-mobile-dock{display:none}
}

@media(max-width:390px){
  .kpi strong{font-size:23px;margin-left:35px}.kpi small{margin-left:35px}.kpi-head{font-size:8px}
  .map-section{height:335px}.op-card{flex-basis:88vw}
}

@media(orientation:landscape) and (max-height:620px) and (max-width:1000px){
  .mw-top{height:54px}.mw-logo{width:126px}.top-rail{grid-template-columns:170px repeat(3,1fr)}.clock-zone{grid-column:auto;min-height:95px}.clock-time{font-size:33px}.kpi{min-height:95px}.map-section{height:300px}.op-card{flex-basis:300px}.mw-mobile-dock{height:48px}
}

@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}
}

/* Partículas ambientais do painel */
.mw-particle-field{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;opacity:.7}
.mw-particle{position:absolute;width:2px;height:2px;border-radius:50%;background:#4ea9ff;box-shadow:0 0 8px currentColor;opacity:.2;animation:particleDrift var(--dur,16s) ease-in-out infinite alternate;animation-delay:var(--delay,0s)}
.mw-particle:nth-child(3n){color:#8a48ff;background:#8a48ff}.mw-particle:nth-child(5n){color:#19e57d;background:#19e57d}
@keyframes particleDrift{0%{transform:translate3d(0,0,0) scale(.8);opacity:.08}45%{opacity:.4}100%{transform:translate3d(var(--dx,30px),var(--dy,-40px),0) scale(1.35);opacity:.12}}
.mw-live-flash{position:fixed;right:20px;top:86px;z-index:65;padding:7px 10px;border-radius:999px;background:rgba(8,25,51,.82);border:1px solid rgba(22,230,127,.2);color:#8ff7be;font:700 8px JetBrains Mono;letter-spacing:.07em;text-transform:uppercase;backdrop-filter:blur(12px);opacity:0;transform:translateY(-6px);transition:.25s;pointer-events:none}.mw-live-flash.show{opacity:1;transform:translateY(0)}
@media(max-width:720px){.mw-live-flash{right:12px;top:69px;font-size:7px}.mw-particle-field{opacity:.42}}
