/* ===========================================================================
   MR7 — Base de Conhecimento · V3 Enterprise Holográfico
   Camada 100% visual/sonora. NÃO altera telemetria, estados, dados ou governança.
   Fundo espacial preto-roxo, profundidade holográfica, núcleo dominante,
   cards de vidro escuro com borda neon, tipografia premium.
   =========================================================================== */
:root{
  --bg:#040309; --panel-glass:rgba(15,12,24,.55); --panel-glass2:rgba(11,9,18,.62);
  --line:rgba(122,92,190,.20); --line2:rgba(140,105,215,.34); --txt:#eef0f7; --muted:#9c96ab; --dim:#6f6982;
  --violet:#9a4dff; --magenta:#ff4bd8; --blue:#4d92ff; --cyan:#28d3ff;
  --green:#25e29a; --yellow:#f0cf47; --orange:#ff9a3d; --red:#ff5b70;
  --ok:#25e29a; --warn:#f0cf47; --off:#6f6982; --err:#ff5b70; --audit:#4d92ff;
  --radius:16px; --font:"Inter","Segoe UI",system-ui,Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;color:var(--txt);font-family:var(--font);overflow-x:hidden;font-size:14px;letter-spacing:.01em;
  background:
   radial-gradient(1100px 620px at 22% 8%,rgba(120,45,200,.14),transparent 60%),
   radial-gradient(1000px 560px at 82% 14%,rgba(40,110,220,.10),transparent 60%),
   radial-gradient(1200px 800px at 50% 108%,rgba(150,50,190,.10),transparent 60%),
   linear-gradient(180deg,#050309,#07040d 55%,#020104)}
/* poeira estelar + grade holográfica */
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.5;
  background-image:radial-gradient(1.4px 1.4px at 20% 30%,rgba(200,180,255,.5),transparent),radial-gradient(1.2px 1.2px at 70% 60%,rgba(160,200,255,.45),transparent),radial-gradient(1px 1px at 40% 80%,rgba(255,180,240,.4),transparent),radial-gradient(1.3px 1.3px at 85% 25%,rgba(180,180,255,.4),transparent);
  background-size:520px 520px,420px 420px,600px 600px,500px 500px}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.08;
  background-image:linear-gradient(rgba(130,95,200,.6) 1px,transparent 1px),linear-gradient(90deg,rgba(130,95,200,.6) 1px,transparent 1px);
  background-size:60px 60px;transform:perspective(600px) rotateX(60deg);transform-origin:bottom;mask-image:linear-gradient(to top,#000,transparent 45%)}
button{font:inherit}
h1,h2,h3{margin:0;font-weight:600}

.app{position:relative;z-index:2;min-height:100%;padding:18px;max-width:1780px;margin:0 auto}

/* ---- Topbar ---- */
.topbar{display:flex;gap:14px;align-items:center;justify-content:space-between;
  border:1px solid var(--line2);background:linear-gradient(180deg,rgba(18,14,28,.6),rgba(9,7,16,.5));
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-radius:var(--radius);padding:14px 20px;
  box-shadow:0 1px 0 rgba(255,255,255,.03) inset,0 10px 40px rgba(80,30,150,.10)}
.brand{display:flex;align-items:center;gap:15px}
.brand-mark{width:44px;height:44px;border-radius:12px;position:relative;
  background:conic-gradient(from 210deg,#6f20c8,#b137ff,#4d92ff,#28d3ff,#6f20c8);
  box-shadow:0 0 26px rgba(150,70,255,.45),0 0 4px rgba(150,70,255,.6);animation:markspin 12s linear infinite}
@keyframes markspin{to{filter:hue-rotate(40deg)}}
.brand-mark::after{content:"7";position:absolute;inset:3px;border-radius:9px;background:#0a0713;display:grid;place-items:center;color:#e2d0ff;font-weight:800;font-size:19px}
.brand h1{font-size:clamp(16px,1.4vw,21px);letter-spacing:.1em;font-weight:700}
.brand small{display:block;color:var(--muted);margin-top:3px;font-size:11.5px;letter-spacing:.08em}
.controls{display:flex;gap:9px;flex-wrap:wrap;justify-content:flex-end}
.btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line2);background:rgba(20,15,32,.6);color:#e9e6f2;
  border-radius:11px;padding:10px 14px;cursor:pointer;transition:.18s;font-size:11.5px;font-weight:600;letter-spacing:.04em;
  backdrop-filter:blur(8px)}
.btn:hover{border-color:#9a4dff;box-shadow:0 0 0 1px rgba(154,77,255,.3),0 8px 22px rgba(154,77,255,.18);transform:translateY(-1px)}
.btn.primary{background:linear-gradient(135deg,#7020cd,#a637ff);border-color:#b552ff;box-shadow:0 6px 22px rgba(160,60,255,.28)}
.btn.on{border-color:#25e29a;color:#bff4df;box-shadow:0 0 0 1px rgba(37,226,154,.3)}
.btn.on svg{color:#25e29a}
.btn.loading{border-color:#f0cf47;color:#f6e79a;animation:pulseSoft 1s infinite}
.btn:disabled{opacity:.55;cursor:not-allowed;border-color:var(--line)}
.btn svg{width:15px;height:15px}
@keyframes pulseSoft{50%{opacity:.6}}

/* ---- Layout ---- */
.layout{display:grid;grid-template-columns:352px minmax(460px,1fr) 392px;gap:18px;margin-top:18px;align-items:start}
.panel{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;position:relative;
  background:linear-gradient(180deg,var(--panel-glass),var(--panel-glass2));
  backdrop-filter:blur(13px);-webkit-backdrop-filter:blur(13px);
  box-shadow:0 1px 0 rgba(255,255,255,.03) inset,0 14px 44px rgba(10,5,25,.5)}
.panel-h{padding:13px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}
.panel-h h2{font-size:11.5px;letter-spacing:.2em;color:#d3bff2;font-weight:700}
.panel-h span{font-size:10px;color:var(--muted);letter-spacing:.09em;display:inline-flex;align-items:center;gap:6px}
.panel-b{padding:14px}
.sdot{width:8px;height:8px;border-radius:50%;display:inline-block;box-shadow:0 0 9px currentColor}

/* ---- Card base (vidro escuro + borda neon) ---- */
.agent,.system,.input-card,.step,.mini,.kv,.tvbox,.hero{
  background:linear-gradient(180deg,rgba(19,15,30,.5),rgba(10,8,18,.55));
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}

/* ---- Agentes ---- */
.agent{position:relative;display:grid;grid-template-columns:56px 1fr auto;gap:13px;align-items:center;padding:12px;
  border:1px solid var(--line2);border-radius:13px;margin-bottom:11px;cursor:pointer;transition:.2s;overflow:hidden}
.agent::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--c);opacity:.55;box-shadow:0 0 12px var(--c)}
.agent:hover{transform:translateX(3px);border-color:var(--c);box-shadow:0 0 0 1px color-mix(in srgb,var(--c) 40%,transparent),0 10px 30px color-mix(in srgb,var(--c) 18%,transparent)}
.agent:hover .avatar{box-shadow:0 0 20px var(--c)}
.avatar{width:52px;height:52px;border-radius:13px;border:1px solid color-mix(in srgb,var(--c) 60%,#2a2340);overflow:hidden;background:#0c0918;display:grid;place-items:center;transition:.2s}
.avatar img{width:100%;height:100%;object-fit:cover;object-position:center 22%}
.agent h3{font-size:13.5px;color:#f4eefe;letter-spacing:.03em;font-weight:700}
.agent .role{color:var(--c);font-size:10px;letter-spacing:.12em;margin:3px 0;font-weight:700}
.agent p{margin:0;color:var(--muted);font-size:11px;line-height:1.4}
.agent .badge{justify-self:end;font-size:9px;letter-spacing:.08em;padding:4px 9px;border-radius:999px;border:1px solid var(--line2);color:var(--muted);white-space:nowrap;background:rgba(13,10,22,.6);font-weight:600}

/* ---- Fontes ---- */
.inputs{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.input-card{border:1px solid var(--line2);border-radius:13px;padding:13px;cursor:pointer;transition:.18s}
.input-card:hover{border-color:var(--c);transform:translateY(-2px);box-shadow:0 10px 26px color-mix(in srgb,var(--c) 18%,transparent)}
.input-card:hover .ico{filter:drop-shadow(0 0 8px var(--c))}
.input-card .ico{color:var(--c);margin-bottom:8px;transition:.18s}
.input-card b{display:block;font-size:12px;letter-spacing:.06em;font-weight:700}
.input-card small{display:block;color:var(--muted);font-size:10.5px;margin-top:3px}
.input-card .src{display:block;margin-top:7px;font-size:9px;color:var(--dim);letter-spacing:.05em}
.ico svg{width:22px;height:22px}

/* ---- Núcleo central ---- */
.core-wrap{display:grid;gap:18px}
.hero{position:relative;min-height:432px;display:grid;place-items:center;overflow:hidden;border:1px solid var(--line)}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 46%,rgba(120,50,200,.20),transparent 55%)}
.orbit{position:absolute;left:50%;top:47%;transform:translate(-50%,-50%);border-radius:50%}
.o1{width:250px;height:250px;border:1px solid rgba(154,77,255,.30);box-shadow:0 0 30px rgba(154,77,255,.10) inset;animation:spin 24s linear infinite}
.o2{width:352px;height:352px;border:1px solid rgba(77,146,255,.22);animation:spin 40s linear infinite reverse}
.o3{width:470px;height:470px;border:1px dashed rgba(40,211,255,.16);animation:spin 66s linear infinite}
.orbit i{position:absolute;top:-5px;left:50%;width:9px;height:9px;border-radius:50%;background:#c79bff;box-shadow:0 0 16px #b98bff,0 0 30px #9a4dff}
.o2 i{background:#8fc0ff;box-shadow:0 0 16px #8fc0ff}
.o3 i{background:#7fe9ff;box-shadow:0 0 16px #7fe9ff}
@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.core{position:relative;width:248px;height:248px;border-radius:50%;display:grid;place-items:center;text-align:center;z-index:2;
  background:radial-gradient(circle at 50% 42%,rgba(60,35,105,.95),rgba(14,9,26,.96) 70%);
  border:1px solid rgba(170,120,255,.4);
  box-shadow:0 0 70px rgba(154,77,255,.28),0 0 130px rgba(120,50,200,.14),inset 0 0 55px rgba(154,77,255,.18);
  animation:pulse 3.6s ease-in-out infinite;transition:box-shadow .4s}
.core.core-flash{box-shadow:0 0 100px rgba(180,110,255,.5),0 0 180px rgba(150,70,255,.24),inset 0 0 70px rgba(180,110,255,.3)}
@keyframes pulse{50%{box-shadow:0 0 92px rgba(154,77,255,.4),0 0 150px rgba(120,50,200,.2),inset 0 0 66px rgba(154,77,255,.26)}}
.core .logo{font-size:52px;font-weight:800;letter-spacing:.05em;line-height:1;background:linear-gradient(180deg,#f1e4ff,#a061ff);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 14px rgba(154,77,255,.5))}
.core .sub{font-size:10px;letter-spacing:.46em;color:#d4bff0;margin-top:4px}
.core .tiny{font-size:8.5px;letter-spacing:.16em;color:var(--muted);margin-top:11px;line-height:1.6}
.core .live{margin-top:11px;font-size:8.5px;letter-spacing:.12em;color:var(--ok);display:inline-flex;align-items:center;gap:5px}
.energy{position:absolute;width:2px;height:130px;background:linear-gradient(180deg,transparent,var(--c,#9a4dff),transparent);opacity:0;transition:opacity .5s;filter:blur(.5px)}
.energy.on{opacity:.4;animation:flow 2.6s ease-in-out infinite}
@keyframes flow{50%{opacity:.75}}

/* ---- Fluxo ---- */
.flowbar{display:grid;grid-template-columns:repeat(7,1fr);gap:9px}
.step{border:1px solid var(--line2);border-radius:11px;padding:11px 8px;text-align:center;cursor:pointer;transition:.18s}
.step:hover{border-color:#9a4dff;transform:translateY(-2px);box-shadow:0 8px 20px rgba(154,77,255,.2)}
.step b{display:block;font-size:10px;letter-spacing:.05em;font-weight:700}
.step span{display:block;color:var(--muted);font-size:8.5px;margin-top:3px}
.step .n{display:block;color:var(--violet);font-size:9px;font-weight:800;margin-bottom:5px;text-shadow:0 0 10px rgba(154,77,255,.6)}

/* ---- TV OFFLINE ---- */
.tvbox{padding:0;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.tvhead{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line)}
.tvball{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:var(--off);border:1px solid var(--line2);background:rgba(12,9,22,.6)}
.tvhead b{font-size:13px;letter-spacing:.09em;font-weight:700}
.tvhead .off-tag{margin-left:auto;font-size:9.5px;letter-spacing:.09em;color:var(--err);border:1px solid color-mix(in srgb,var(--err) 45%,transparent);padding:5px 10px;border-radius:999px;background:rgba(255,91,112,.09);font-weight:700}
.mini-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:11px;padding:15px}
.mini{border:1px solid var(--line2);border-radius:11px;padding:12px 8px;text-align:center}
.mini small{display:block;color:var(--dim);font-size:8.5px;letter-spacing:.09em}
.mini b{display:block;font-size:18px;margin-top:6px;color:#c9c2d6;font-weight:800}
.mini.void b{color:var(--off)}

/* ---- Sistemas ---- */
.system{position:relative;display:grid;grid-template-columns:42px 1fr auto;gap:13px;align-items:center;padding:12px;
  border:1px solid var(--line2);border-radius:13px;margin-bottom:10px;cursor:pointer;transition:.2s;overflow:hidden}
.system::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--c);opacity:.5;box-shadow:0 0 12px var(--c)}
.system:hover{transform:translateX(3px);border-color:var(--c);box-shadow:0 0 0 1px color-mix(in srgb,var(--c) 34%,transparent),0 10px 28px color-mix(in srgb,var(--c) 16%,transparent)}
.system:hover .ico{filter:drop-shadow(0 0 10px var(--c))}
.system .ico{color:var(--c);display:grid;place-items:center;transition:.2s}
.system h3{font-size:13px;letter-spacing:.04em;font-weight:700}
.system p{margin:3px 0 0;color:var(--muted);font-size:10.5px}
.status{justify-self:end;font-size:9px;letter-spacing:.06em;padding:5px 10px;border-radius:999px;white-space:nowrap;font-weight:700;
  border:1px solid var(--sc);color:var(--sc);background:color-mix(in srgb,var(--sc) 12%,transparent);box-shadow:0 0 12px color-mix(in srgb,var(--sc) 20%,transparent)}
.st-online{--sc:var(--ok)} .st-local{--sc:var(--cyan)} .st-partial{--sc:var(--warn)}
.st-offline{--sc:var(--err)} .st-nc{--sc:var(--off)} .st-audit{--sc:var(--audit)} .st-dev{--sc:var(--orange)}

/* ---- Footer ---- */
.footer{margin-top:18px;display:grid;grid-template-columns:repeat(6,1fr);gap:14px;
  border:1px solid var(--line);border-radius:var(--radius);padding:15px 18px;
  background:linear-gradient(180deg,var(--panel-glass),var(--panel-glass2));backdrop-filter:blur(13px)}
.task{display:flex;align-items:flex-start;gap:11px;flex-wrap:wrap}
.task .tico{color:#b48cff;display:grid;place-items:center;width:22px}
.task b{display:block;font-size:9px;letter-spacing:.11em;color:var(--muted)}
.task small{display:block;font-size:14px;font-weight:800;margin-top:2px;color:#eae4f6}
.task small.waiting{color:var(--warn);font-size:10.5px;font-weight:700}
.task small.off{color:var(--cyan);font-size:11px;font-weight:700}
.task .meter{height:4px;border-radius:3px;background:rgba(30,22,40,.8);overflow:hidden;margin-top:6px;width:100%}
.task .meter i{display:block;height:100%;background:linear-gradient(90deg,#7d3cff,#c05cff);width:0;transition:width .5s;box-shadow:0 0 8px rgba(160,70,255,.6)}

/* ---- Tooltip ---- */
#tip{position:fixed;z-index:9999;max-width:300px;pointer-events:none;opacity:0;transform:translateY(5px);transition:.13s;
  background:linear-gradient(180deg,rgba(18,14,28,.96),rgba(10,8,18,.96));border:1px solid var(--line2);border-radius:11px;padding:10px 13px;
  box-shadow:0 14px 36px rgba(0,0,0,.6),0 0 0 1px rgba(154,77,255,.12);font-size:11px;line-height:1.55;backdrop-filter:blur(10px)}
#tip.show{opacity:1;transform:none}
#tip b{color:#e0ccff;letter-spacing:.04em}
#tip .row{color:var(--muted);margin-top:3px}
#tip .src{margin-top:6px;color:var(--dim);font-size:9.5px}

/* ---- Modal lateral (fundo desfocado visível) ---- */
.modal{position:fixed;inset:0;z-index:9000;display:none;align-items:stretch;justify-content:flex-end;
  background:rgba(4,3,9,.45);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.modal.open{display:flex;animation:fade .2s ease}
@keyframes fade{from{opacity:0}}
.dialog{width:min(470px,94vw);height:100%;overflow:auto;padding:22px;
  background:linear-gradient(180deg,rgba(16,12,26,.92),rgba(8,6,15,.94));border-left:1px solid var(--line2);
  box-shadow:-24px 0 70px rgba(0,0,0,.6);animation:slideIn .24s cubic-bezier(.2,.7,.2,1)}
@keyframes slideIn{from{transform:translateX(40px);opacity:.4}}
.dialog h2{font-size:18px;letter-spacing:.03em;font-weight:700}
.dialog .role{color:#c39bff;font-size:10.5px;letter-spacing:.12em;margin:5px 0 15px;font-weight:700}
.dialog .st{display:inline-block;font-size:10px;padding:5px 11px;border-radius:999px;border:1px solid var(--sc,#6f6982);color:var(--sc,#9c96ab);background:color-mix(in srgb,var(--sc,#6f6982) 12%,transparent);margin-bottom:15px;font-weight:700;box-shadow:0 0 14px color-mix(in srgb,var(--sc,#6f6982) 22%,transparent)}
.kv{border:1px solid var(--line2);border-radius:11px;padding:12px 13px;margin-bottom:10px}
.kv b{display:block;font-size:9px;letter-spacing:.11em;color:var(--dim);margin-bottom:5px}
.kv span{font-size:12px;color:#eae4f6;word-break:break-word}
.kv code{font-family:ui-monospace,Consolas,monospace;font-size:11px;color:#cbb9f2;word-break:break-all}
.kv ul{margin:5px 0 0;padding-left:16px;color:#ded7ec;font-size:11.5px;line-height:1.65}
.voicebar{display:flex;gap:8px;margin-top:13px}
.voicebar input{flex:1;background:rgba(10,7,19,.7);border:1px solid var(--line2);border-radius:11px;padding:11px 13px;color:#fff;font-size:12.5px}
.voicebar .mic{border:1px solid var(--line2);background:rgba(18,12,30,.7);border-radius:11px;padding:0 13px;cursor:pointer;color:#cbb6ff}
.voicebar .mic.listening{border-color:var(--red);color:var(--red);animation:pulseSoft 1s infinite}

.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);z-index:9500;opacity:0;transition:.22s;
  background:linear-gradient(180deg,rgba(18,14,28,.96),rgba(10,8,18,.96));border:1px solid var(--line2);border-radius:13px;padding:13px 20px;font-size:12.5px;box-shadow:0 16px 40px rgba(0,0,0,.6);max-width:88vw;backdrop-filter:blur(10px)}
.toast.show{opacity:1;transform:translate(-50%,0)}
.disclaimer{margin-top:14px;font-size:10px;color:var(--dim);text-align:center;letter-spacing:.04em}

/* ===================== V4: logo oficial, respiração, microfone ===================== */
/* Logo MR7 oficial no núcleo (mix-blend remove o fundo escuro do PNG) */
.core .corelogo{display:block;width:158px;max-width:62%;margin:0 auto;mix-blend-mode:screen;
  filter:drop-shadow(0 0 14px rgba(154,77,255,.55)) drop-shadow(0 2px 6px rgba(0,0,0,.5));
  animation:logoBreath 4s ease-in-out infinite}
@keyframes logoBreath{50%{filter:drop-shadow(0 0 22px rgba(180,110,255,.8)) drop-shadow(0 2px 6px rgba(0,0,0,.5))}}
.core{cursor:pointer}
.core.core-tap{box-shadow:0 0 86px rgba(180,110,255,.42),0 0 150px rgba(150,70,255,.2),inset 0 0 62px rgba(180,110,255,.26)}

/* Respiração individual dos cards (brilho + borda pulsando muito leve) */
@keyframes cardBreath{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--c) 0%,transparent)}50%{box-shadow:0 0 16px -4px color-mix(in srgb,var(--c) 22%,transparent)}}
.agent,.system{animation:cardBreath 5.5s ease-in-out infinite}
.agent::before,.system::before{animation:edgeBreath 4.5s ease-in-out infinite}
@keyframes edgeBreath{50%{opacity:.85;box-shadow:0 0 18px var(--c)}}
.input-card{animation:cardBreath 6.5s ease-in-out infinite}
/* fluxo de energia sutil no contorno (varia o brilho da borda) */
.agent:hover,.system:hover,.input-card:hover{animation-play-state:paused}

/* Microfone — estados */
.micstate{display:flex;align-items:center;gap:9px;margin-top:14px;font-size:10.5px;letter-spacing:.09em;color:#cdb6ff}
.micstate .micdot{width:8px;height:8px;border-radius:50%;background:var(--off);box-shadow:0 0 8px var(--off)}
.micstate .micwave{display:inline-flex;align-items:flex-end;gap:2px;height:14px;margin-left:auto;opacity:0;transition:.2s}
.micstate .micwave i{width:2.5px;height:4px;background:#c05cff;border-radius:2px;animation:wave .9s ease-in-out infinite}
.micstate .micwave i:nth-child(2){animation-delay:.12s}.micstate .micwave i:nth-child(3){animation-delay:.24s}.micstate .micwave i:nth-child(4){animation-delay:.36s}.micstate .micwave i:nth-child(5){animation-delay:.48s}
@keyframes wave{50%{height:14px;background:#e0a6ff}}
.mic.listening{border-color:var(--red)!important;color:var(--red)!important;box-shadow:0 0 0 1px rgba(255,91,112,.35),0 0 16px rgba(255,91,112,.25)}

/* ===================== V5: luz contínua nas bordas, câmera, compartilhar ===================== */
/* Luz circulando continuamente pela borda de cada card (cor do chakra) */
.agent,.system,.input-card{position:relative}
.agent::after,.system::after,.input-card::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;z-index:1;opacity:.34;
  background:conic-gradient(transparent 0 72%, color-mix(in srgb,var(--c) 85%,transparent) 86%, transparent);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
  animation:borderTravel 7s linear infinite}
.system::after{animation-duration:8.5s}.input-card::after{animation-duration:9.5s}
.agent:hover::after,.system:hover::after,.input-card:hover::after{opacity:.7;animation-duration:3.4s}
@keyframes borderTravel{to{transform:rotate(360deg)}}
.agent>*,.system>*,.input-card>*{position:relative;z-index:2}

/* selects e botões do topo iguais */
#clientSel.btn{padding-right:26px;appearance:none;-webkit-appearance:none}
.p7sel{width:100%;box-sizing:border-box;background:rgba(10,7,19,.7);border:1px solid var(--line2);border-radius:10px;padding:9px 11px;color:#fff;font-size:12.5px;margin-top:5px}
.p7txt{width:100%;box-sizing:border-box;min-height:150px;background:rgba(10,7,19,.7);border:1px solid var(--line2);border-radius:10px;padding:11px;color:#e7e2f2;font:12px ui-monospace,Consolas,monospace;line-height:1.5;resize:vertical;margin-top:5px}

/* Câmera */
.camstate{display:inline-block;font-size:10px;letter-spacing:.09em;padding:5px 11px;border-radius:999px;border:1px solid var(--line2);color:var(--muted);margin-bottom:12px;font-weight:700}
.camstate.cs-active,.camstate.cs-recording{color:#25e29a;border-color:#25e29a;background:rgba(37,226,154,.1)}
.camstate.cs-recording{color:#ff5b70;border-color:#ff5b70;background:rgba(255,91,112,.1);animation:pulseSoft 1s infinite}
.camstate.cs-permission{color:#f0cf47;border-color:#f0cf47}
.camstate.cs-error,.camstate.cs-unavailable{color:#ff5b70;border-color:#ff5b70}
.camwrap{width:100%;aspect-ratio:16/10;background:#06040c;border:1px solid var(--line2);border-radius:12px;overflow:hidden;margin-bottom:12px;display:grid;place-items:center}
.camwrap video{width:100%;height:100%;object-fit:cover}

/* Integrações futuras */
#futureSrc .panel-h{border-top:1px solid var(--line)}
.futurechip{border:1px solid var(--line2);background:rgba(14,11,22,.6);color:#cbb6ec;border-radius:999px;padding:7px 12px;font-size:11px;cursor:pointer;letter-spacing:.03em;transition:.16s;position:relative}
.futurechip::before{content:"◌ ";color:var(--off)}
.futurechip:hover{border-color:#8a3cff;color:#fff;box-shadow:0 0 14px rgba(138,60,255,.2)}

/* ===================== V6: barra de ações, discos em faixa, áudio ===================== */
#v6bar{max-width:1780px;margin:10px auto 0;padding:0 18px;display:flex;gap:8px;flex-wrap:wrap}
.v6chip{border:1px solid var(--line2);background:rgba(14,11,22,.6);color:#cbb6ec;border-radius:10px;padding:7px 13px;font-size:11.5px;cursor:pointer;letter-spacing:.03em;transition:.16s;backdrop-filter:blur(8px)}
.v6chip:hover{border-color:#9a4dff;color:#fff;box-shadow:0 0 14px rgba(154,77,255,.22);transform:translateY(-1px)}

/* Discos — faixa horizontal rolável */
.diskrow{display:flex;gap:11px;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin}
.diskrow::-webkit-scrollbar{height:7px}.diskrow::-webkit-scrollbar-thumb{background:#2c2340;border-radius:4px}
.diskcard{flex:0 0 150px;border:1px solid var(--line2);border-radius:12px;padding:12px;cursor:pointer;transition:.16s;background:linear-gradient(180deg,rgba(19,15,30,.5),rgba(10,8,18,.55))}
.diskcard:hover{border-color:#8a3cff;transform:translateY(-2px);box-shadow:0 8px 20px rgba(138,60,255,.16)}
.diskcard .dl{display:flex;align-items:baseline;justify-content:space-between;gap:6px}
.diskcard .dl b{font-size:16px;letter-spacing:.04em}.diskcard .dl small{font-size:9px;color:var(--muted);max-width:78px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.diskcard .dmeter{height:6px;border-radius:4px;background:#1a1526;overflow:hidden;margin:9px 0 6px}.diskcard .dmeter i{display:block;height:100%;border-radius:4px}
.diskcard .dpct{font-size:15px;font-weight:800}.diskcard .dfree{font-size:9.5px;color:var(--muted);margin-top:2px}

/* Ambientes / range */
.btn.env{font-size:11px;padding:7px 12px}
input[type=range]{accent-color:#9a4dff}

/* ===================== Telemetria estilo Gerenciador ===================== */
.tgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.tcard{border:1px solid var(--line2);border-radius:12px;padding:13px;background:linear-gradient(180deg,rgba(19,15,30,.5),rgba(10,8,18,.55));position:relative;overflow:hidden}
.tcard::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;opacity:.3;background:conic-gradient(transparent 0 74%,rgba(154,77,255,.7));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;animation:borderTravel 8s linear infinite}
.tch{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.tch b{font-size:11px;letter-spacing:.14em;color:#cbb6ec;font-weight:700}
.tch span{font-size:20px;font-weight:800}
.tspark{margin:8px 0 6px}
.tcanvas{display:block;width:100%;height:46px;margin:8px 0 6px;border-radius:6px;background:rgba(6,4,12,.4)}
.tsub{font-size:10px;color:var(--muted);line-height:1.4;word-break:break-word}
.dgtitle{margin:16px 0 9px;font-size:11px;letter-spacing:.14em;color:#cbb6ec;font-weight:700}
.dgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:11px}
.dgcard{border:1px solid var(--line2);border-radius:12px;padding:12px;cursor:pointer;transition:.16s;background:linear-gradient(180deg,rgba(19,15,30,.5),rgba(10,8,18,.55))}
.dgcard:hover{border-color:#8a3cff;transform:translateY(-2px);box-shadow:0 8px 20px rgba(138,60,255,.16)}
.dgh{display:flex;align-items:baseline;justify-content:space-between}.dgh b{font-size:16px;letter-spacing:.04em}.dgh span{font-size:15px;font-weight:800}
.dgcard small{display:block;font-size:9px;color:var(--muted);margin:2px 0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dgmeter{height:6px;border-radius:4px;background:#1a1526;overflow:hidden}.dgmeter i{display:block;height:100%;border-radius:4px}
.dgsub{font-size:9.5px;color:var(--muted);margin-top:6px}

/* Setimus lateral (não-modal, não bloqueia o dashboard) */
#setimus{position:fixed;top:0;right:0;bottom:0;width:min(42vw,560px);z-index:8500;transform:translateX(105%);transition:transform .3s cubic-bezier(.2,.7,.2,1);
  background:linear-gradient(180deg,rgba(14,11,24,.62),rgba(8,6,15,.66));backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-left:1px solid rgba(154,77,255,.4);box-shadow:-24px 0 70px rgba(0,0,0,.5);display:flex;flex-direction:column;padding:18px}
#setimus.open{transform:none}
#setimus.collapsed{transform:translateX(calc(100% - 44px))}
#setimus h2{font-size:16px;letter-spacing:.04em}
#setimus .sx{position:absolute;top:14px;left:12px;background:transparent;border:0;color:#9a9ac0;font-size:18px;cursor:pointer}
.setlog{flex:1;overflow-y:auto;margin:12px 0;display:flex;flex-direction:column;gap:8px}
.setmsg{padding:9px 12px;border-radius:10px;font-size:12.5px;line-height:1.45}
.setmsg.user{background:#7B2FF7;color:#fff;align-self:flex-end;max-width:85%}
.setmsg.sys{background:rgba(22,18,42,.7);color:#d4d5ee}
@media(max-width:900px){#setimus{width:100vw}}
@media(max-width:640px){.tgrid{grid-template-columns:1fr 1fr}.dgrid{grid-template-columns:1fr 1fr}}

/* Modo desempenho: reduz animações */
body.perf-eco .agent::after,body.perf-eco .system::after,body.perf-eco .input-card::after,body.perf-eco .tcard::after{animation:none;opacity:.18}
body.perf-eco #mr7-conn{display:none}
body.perf-eco .orbit{animation-duration:120s}
body.perf-hidden #mr7-conn{display:none}
body.perf-bal .agent::after,body.perf-bal .system::after,body.perf-bal .input-card::after{animation-duration:16s}
body.perf-bal .orbit{animation-duration:80s}





/* ---- Responsivo ---- */
@media(min-width:1700px){.layout{grid-template-columns:380px minmax(520px,1fr) 420px}.hero{min-height:500px}.core{width:280px;height:280px}.o3{width:520px;height:520px}.o2{width:390px;height:390px}.o1{width:270px;height:270px}}
@media(max-width:1200px){.layout{grid-template-columns:1fr}.hero{min-height:340px}.footer{grid-template-columns:repeat(3,1fr)}#mr7-conn{display:none}}
@media(max-width:640px){.inputs{grid-template-columns:1fr}.flowbar{grid-template-columns:repeat(2,1fr)}.mini-metrics{grid-template-columns:1fr 1fr}.footer{grid-template-columns:1fr 1fr}.dialog{width:100vw}.controls .btn span{display:none}.app{padding:12px}}