:root {
  --bg: #0b0f17;
  --bg-card: #121826;
  --bg-card-hover: #161f30;
  --border: #22293a;
  --text: #e7ecf5;
  --text-dim: #8a93a6;
  --accent: #7c5cff;
  --accent-2: #22d3ee;
  --ok: #22c55e;
  --warn: #eab308;
  --danger: #ef4444;
  --radius: 14px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: radial-gradient(1200px 600px at 80% -10%, #171f33 0%, var(--bg) 55%);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Inter, Arial, sans-serif;
  min-height: 100vh;
}

a { color: inherit; text-decoration: none; }

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 24px;
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  background: rgba(11, 15, 23, 0.85);
  backdrop-filter: blur(10px);
  z-index: 10;
}

.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 700;
  letter-spacing: 0.3px;
}

.brand .dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--ok);
  box-shadow: 0 0 12px var(--ok);
}

.brand small {
  display: block;
  color: var(--text-dim);
  font-weight: 400;
  font-size: 12px;
}

nav {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}

nav a {
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 14px;
  color: var(--text-dim);
  transition: 0.15s;
}

nav a:hover { color: var(--text); background: var(--bg-card); }
nav a.active { color: var(--text); background: var(--bg-card-hover); border: 1px solid var(--border); }

main {
  max-width: 1180px;
  margin: 0 auto;
  padding: 28px 20px 60px;
}

h1 { font-size: 22px; margin: 0 0 4px; }
h2 { font-size: 16px; margin: 0 0 14px; color: var(--text); }
.subtitle { color: var(--text-dim); margin: 0 0 26px; font-size: 14px; }

.grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
  margin-bottom: 24px;
}

.card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 18px;
}

.card .label {
  color: var(--text-dim);
  font-size: 12.5px;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  margin-bottom: 8px;
}

.card .value {
  font-size: 26px;
  font-weight: 700;
}

.card .value.small { font-size: 18px; }

.pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 13px;
}

.pill.online { background: rgba(34,197,94,0.15); color: var(--ok); }
.pill.instavel { background: rgba(234,179,8,0.15); color: var(--warn); }
.pill.reconectando { background: rgba(234,179,8,0.15); color: var(--warn); }
.pill.conectando { background: rgba(124,92,255,0.15); color: var(--accent); }
.pill.offline { background: rgba(239,68,68,0.15); color: var(--danger); }

.panel {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 20px;
  margin-bottom: 20px;
}

table { width: 100%; border-collapse: collapse; font-size: 14px; }
th, td { text-align: left; padding: 9px 10px; border-bottom: 1px solid var(--border); }
th { color: var(--text-dim); font-weight: 600; font-size: 12.5px; text-transform: uppercase; letter-spacing: 0.4px; }
tr:last-child td { border-bottom: none; }

.tag {
  display: inline-block;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 12px;
  background: var(--bg-card-hover);
  border: 1px solid var(--border);
  color: var(--text-dim);
}

.tag.ok { color: var(--ok); border-color: rgba(34,197,94,0.3); }
.tag.degradado { color: var(--warn); border-color: rgba(234,179,8,0.3); }

.footer {
  text-align: center;
  color: var(--text-dim);
  font-size: 12.5px;
  padding: 30px 0 10px;
}

.empty {
  color: var(--text-dim);
  font-size: 14px;
  padding: 20px 0;
  text-align: center;
}

.aviso {
  background: rgba(234,179,8,0.1);
  border: 1px solid rgba(234,179,8,0.3);
  color: var(--warn);
  padding: 12px 16px;
  border-radius: var(--radius);
  font-size: 13.5px;
  margin-bottom: 20px;
  display: none;
}

canvas { max-width: 100%; }


/* ===== Visual refresh / microinterações ===== */
html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(500px 260px at 8% 18%, rgba(124,92,255,.10), transparent 70%),
    radial-gradient(440px 260px at 92% 70%, rgba(34,211,238,.07), transparent 70%);
  z-index: -1;
}

.topbar {
  box-shadow: 0 10px 35px rgba(0,0,0,.12);
}
.brand { transition: transform .2s ease; }
.brand:hover { transform: translateY(-1px); }
.brand .dot { animation: statusPulse 2.2s ease-in-out infinite; }
nav a { border: 1px solid transparent; }
nav a.active { box-shadow: 0 6px 18px rgba(0,0,0,.12); }

h1 { letter-spacing: -.35px; }
.subtitle { max-width: 760px; }

.grid .card {
  position: relative;
  overflow: hidden;
  transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.grid .card::after {
  content: "";
  position: absolute;
  width: 90px;
  height: 90px;
  right: -35px;
  top: -45px;
  border-radius: 50%;
  background: rgba(124,92,255,.08);
  transition: transform .3s ease;
}
.grid .card:hover {
  transform: translateY(-4px);
  border-color: rgba(124,92,255,.45);
  background: var(--bg-card-hover);
  box-shadow: 0 14px 30px rgba(0,0,0,.16);
}
.grid .card:hover::after { transform: scale(1.5); }
.card .value { letter-spacing: -.7px; }

.panel {
  box-shadow: 0 12px 35px rgba(0,0,0,.10);
  transition: border-color .2s ease, transform .2s ease;
}
.panel:hover { border-color: rgba(124,92,255,.28); }
tbody tr { transition: background .15s ease; }
tbody tr:hover { background: rgba(124,92,255,.045); }

.pill { box-shadow: inset 0 0 0 1px rgba(255,255,255,.03); }
.aviso { animation: avisoIn .25s ease; }

/* Assistente flutuante */
.assistant-widget {
  position: fixed;
  right: 22px;
  bottom: 18px;
  width: min(310px, calc(100vw - 32px));
  z-index: 50;
  pointer-events: none;
  transition: opacity .25s ease, transform .25s ease;
}
.assistant-widget.is-hidden { opacity: 0; transform: translateY(18px) scale(.96); pointer-events: none; }
.assistant-bubble {
  position: relative;
  width: max-content;
  max-width: 245px;
  margin: 0 22px 4px auto;
  padding: 13px 38px 13px 15px;
  border: 1px solid rgba(124,92,255,.35);
  border-radius: 18px 18px 6px 18px;
  background: rgba(18,24,38,.92);
  backdrop-filter: blur(14px);
  box-shadow: 0 16px 38px rgba(0,0,0,.26), 0 0 30px rgba(124,92,255,.08);
  color: var(--text);
  pointer-events: auto;
  animation: bubbleFloat 4s ease-in-out infinite;
}
.assistant-bubble::after {
  content: "";
  position: absolute;
  right: 25px;
  bottom: -8px;
  width: 16px;
  height: 16px;
  background: rgba(18,24,38,.92);
  border-right: 1px solid rgba(124,92,255,.35);
  border-bottom: 1px solid rgba(124,92,255,.35);
  transform: rotate(45deg);
}
.assistant-bubble strong { display:block; font-size: 14px; margin-bottom: 3px; }
.assistant-bubble span { display:block; color: var(--text-dim); font-size: 12.5px; line-height: 1.35; }
.assistant-bubble.is-pop { animation: bubblePop .28s ease; }
.assistant-close {
  position:absolute; top:5px; right:7px; width:22px; height:22px;
  border:0; border-radius:50%; background:transparent; color:var(--text-dim);
  cursor:pointer; font-size:18px; line-height:20px;
}
.assistant-close:hover { color:var(--text); background:rgba(255,255,255,.06); }
.assistant-character {
  position: relative;
  display: block;
  width: 190px;
  height: 205px;
  margin-left: auto;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: grab;
  pointer-events: auto;
  touch-action: none;
  transform-origin: 60% 92%;
  animation: characterFloat 3.8s ease-in-out infinite;
  filter: drop-shadow(0 18px 20px rgba(0,0,0,.25));
}
.assistant-character img {
  position: relative;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: bottom center;
  display: block;
  user-select: none;
  transition: transform .2s ease;
}
.assistant-character:hover img { transform: scale(1.035) rotate(-1deg); }
.assistant-character.is-dragging { cursor: grabbing; animation: none; }
.assistant-character.is-dragging img { transform: scale(1.015); }
.assistant-character.is-waving { animation: characterWave .85s ease; }
.assistant-glow {
  position:absolute; width:135px; height:65px; left:28px; bottom:4px;
  border-radius:50%; background:rgba(124,92,255,.18); filter:blur(22px); pointer-events:none;
}
.assistant-wave-lines {
  position:absolute; left:3px; top:57px; width:42px; height:44px; opacity:.7;
  border-top:3px solid rgba(34,211,238,.7); border-radius:50%; transform:rotate(-18deg);
  pointer-events:none;
}
.assistant-wave-lines::after {
  content:""; position:absolute; left:7px; top:10px; width:26px; height:28px;
  border-top:2px solid rgba(124,92,255,.75); border-radius:50%;
}
.assistant-show {
  position: absolute; right: 4px; bottom: 4px;
  width: 42px; height: 42px; border-radius: 50%; border:1px solid var(--border);
  background: var(--bg-card); color:var(--text); cursor:pointer;
  box-shadow:0 10px 25px rgba(0,0,0,.2); pointer-events:auto;
  display:none;
}
.assistant-widget.is-hidden .assistant-show { display:block; }

@keyframes statusPulse { 0%,100%{box-shadow:0 0 8px currentColor;opacity:.9} 50%{box-shadow:0 0 18px currentColor;opacity:1} }
@keyframes avisoIn { from{opacity:0;transform:translateY(-5px)} to{opacity:1;transform:none} }
@keyframes characterFloat { 0%,100%{transform:translateY(0) rotate(0deg)} 50%{transform:translateY(-7px) rotate(1deg)} }
@keyframes characterWave { 0%{transform:rotate(0) translateY(0)} 25%{transform:rotate(-3deg) translateY(-5px)} 50%{transform:rotate(3deg) translateY(-7px)} 75%{transform:rotate(-2deg) translateY(-4px)} 100%{transform:rotate(0) translateY(0)} }
@keyframes bubbleFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-3px)} }
@keyframes bubblePop { 0%{transform:scale(.94);opacity:.5} 100%{transform:scale(1);opacity:1} }

@media (max-width: 760px) {
  .topbar { align-items:flex-start; gap:14px; flex-direction:column; padding:14px 16px; }
  nav { width:100%; overflow-x:auto; flex-wrap:nowrap; padding-bottom:2px; scrollbar-width:none; }
  nav::-webkit-scrollbar { display:none; }
  nav a { white-space:nowrap; }
  main { padding:22px 14px 100px; }
  .assistant-widget { right:10px; bottom:8px; transform:scale(.82); transform-origin:bottom right; }
  .assistant-widget[style*='left'] { transform-origin: top left; }
  .assistant-bubble { margin-right:8px; }
}

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

/* ===== NOJX visual system v2 — compact, responsive, coordinated ===== */
:root {
  --bg: #080b18;
  --bg-soft: #0d1224;
  --bg-card: rgba(15, 20, 42, .84);
  --bg-card-hover: rgba(24, 30, 58, .92);
  --border: rgba(139, 125, 255, .18);
  --border-strong: rgba(161, 143, 255, .42);
  --text: #f5f3ff;
  --text-dim: #a5a4c1;
  --accent: #9a78ff;
  --accent-2: #d46cff;
  --cyan: #61d9ff;
  --ok: #48e6a1;
  --warn: #ffd166;
  --danger: #ff6b8a;
  --radius: 18px;
}

html { background: var(--bg); }
body {
  background:
    radial-gradient(700px 450px at 85% 0%, rgba(116, 76, 255, .20), transparent 68%),
    radial-gradient(620px 420px at 4% 92%, rgba(65, 192, 255, .09), transparent 72%),
    linear-gradient(145deg, #080b18 0%, #0a0e1e 52%, #090b18 100%);
  color: var(--text);
  line-height: 1.5;
}
body::after {
  content: "";
  position: fixed; inset: 0; pointer-events: none; z-index: -1;
  opacity: .24;
  background-image: radial-gradient(rgba(255,255,255,.35) .6px, transparent .7px);
  background-size: 48px 48px;
}

.topbar {
  padding: 12px clamp(12px, 3vw, 30px);
  min-height: 68px;
  border-bottom: 1px solid rgba(159, 139, 255, .12);
  background: rgba(7, 10, 23, .76);
  box-shadow: 0 12px 38px rgba(0,0,0,.20);
}
.brand { gap: 10px; min-width: 190px; }
.brand::before {
  content: "✦"; display: grid; place-items: center; width: 34px; height: 34px;
  border: 1px solid var(--border-strong); border-radius: 11px;
  color: var(--accent); background: rgba(145,117,255,.10); box-shadow: 0 0 24px rgba(145,117,255,.14);
}
.brand .dot { width: 8px; height: 8px; margin-left: -24px; margin-right: 5px; z-index: 2; }
.brand small { font-size: 11px; margin-top: 1px; }
nav { gap: 3px; overflow-x: auto; scrollbar-width: none; }
nav::-webkit-scrollbar { display:none; }
nav a { padding: 8px 11px; font-size: 13px; white-space: nowrap; }
nav a.active { color: #fff; background: linear-gradient(135deg, rgba(133,105,255,.22), rgba(212,108,255,.10)); border-color: rgba(159,139,255,.28); }

main { width: min(1180px, calc(100% - 28px)); padding: 26px 0 46px; }
h1 { font-size: clamp(26px, 4vw, 42px); line-height: 1.08; }
h2 { font-size: 18px; }
.subtitle { color: var(--text-dim); font-size: 13.5px; }

.hero-panel {
  position: relative; min-height: 360px; overflow: hidden; display: grid; grid-template-columns: 1.15fr .85fr;
  border: 1px solid var(--border); border-radius: 24px; margin-bottom: 24px;
  background: linear-gradient(125deg, rgba(16,20,48,.96), rgba(21,15,48,.72));
  box-shadow: 0 24px 70px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.04);
}
.hero-panel::before { content:""; position:absolute; width:480px; height:480px; border-radius:50%; right:-120px; top:-170px; background:radial-gradient(circle, rgba(174,113,255,.24), transparent 68%); }
.hero-copy { position:relative; z-index:2; padding: clamp(24px, 5vw, 48px); align-self:center; }
.eyebrow { color:#c4b7ff; font-size:10px; font-weight:800; letter-spacing:1.6px; }
.hero-status { display:inline-flex; align-items:center; gap:7px; margin:10px 0 14px; padding:5px 10px; border:1px solid rgba(72,230,161,.22); border-radius:999px; color:#b9f8db; background:rgba(72,230,161,.07); font-size:11px; }
.hero-status-dot { width:7px; height:7px; border-radius:50%; background:var(--ok); box-shadow:0 0 12px var(--ok); animation:statusPulse 2s infinite; }
.hero-panel h1 { max-width: 640px; margin:0 0 12px; }
.hero-panel h1 span { background:linear-gradient(90deg, #b59aff, #f18bff); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero-subtitle { max-width: 570px; color:#b7b5cc; margin:0 0 20px; font-size:14px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:9px; }
.hero-btn { display:inline-flex; gap:9px; align-items:center; padding:9px 13px; border-radius:11px; border:1px solid var(--border-strong); background:rgba(255,255,255,.025); color:#ddd8f4; font-size:12.5px; transition:.2s ease; }
.hero-btn:hover { transform:translateY(-2px); background:rgba(154,120,255,.13); }
.hero-btn.primary { background:linear-gradient(135deg,#7655e9,#a55be6); border-color:transparent; color:white; box-shadow:0 10px 25px rgba(132,81,235,.22); }
.hero-mini-stats { display:flex; gap:0; margin-top:28px; max-width:570px; }
.hero-mini-stats div { min-width:110px; padding-right:18px; margin-right:18px; border-right:1px solid rgba(255,255,255,.08); }
.hero-mini-stats div:last-child { border:0; margin:0; }
.hero-mini-stats strong { display:block; font-size:16px; color:#f5f0ff; }
.hero-mini-stats span { color:#8f8da9; font-size:10px; }
.hero-character-wrap { position:relative; min-height:360px; display:flex; align-items:flex-end; justify-content:center; }
.hero-character { position:relative; z-index:2; width:min(92%, 390px); max-height:370px; object-fit:contain; object-position:bottom; filter:drop-shadow(0 22px 25px rgba(0,0,0,.32)); animation:heroFloat 5s ease-in-out infinite; }
.hero-orbit { position:absolute; border:1px solid rgba(170,140,255,.14); border-radius:50%; }
.orbit-one { width:290px; height:290px; right:10%; bottom:5%; }
.orbit-two { width:360px; height:360px; right:0; bottom:-8%; border-style:dashed; opacity:.6; }
.hero-spark { position:absolute; z-index:3; color:#dba5ff; text-shadow:0 0 16px #9a78ff; animation:sparkFloat 3s ease-in-out infinite; }
.spark-a { top:26%; right:25%; font-size:22px; }
.spark-b { top:17%; right:45%; font-size:25px; animation-delay:1s; }
.hero-note { position:absolute; z-index:4; right:5%; top:16%; max-width:190px; padding:9px 11px; border:1px solid rgba(190,166,255,.28); border-radius:14px 14px 4px 14px; background:rgba(10,12,31,.78); backdrop-filter:blur(12px); color:#c9c5dc; font-size:10.5px; box-shadow:0 10px 28px rgba(0,0,0,.18); }
.section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:15px; margin: 6px 0 4px; }
.section-heading h2 { margin:3px 0 0; }

.grid { gap:12px; grid-template-columns:repeat(3,1fr); margin-bottom:20px; }
.card, .panel { background:linear-gradient(145deg, rgba(17,22,47,.88), rgba(12,16,35,.88)); border-color:var(--border); box-shadow:0 12px 35px rgba(0,0,0,.12); }
.card { padding:15px 16px; border-radius:16px; }
.card .label { font-size:10px; letter-spacing:1px; }
.card .value { font-size:23px; }
.card:hover { transform:translateY(-3px); border-color:var(--border-strong); box-shadow:0 16px 36px rgba(0,0,0,.22); }
.panel { padding:17px; border-radius:17px; }
.panel h2 { margin-bottom:12px; }
th,td { padding:9px 8px; }

/* Assistant */
.assistant-widget { position:fixed; right:18px; bottom:14px; z-index:30; width:min(250px, 34vw); pointer-events:none; }
.assistant-bubble { position:relative; pointer-events:auto; margin-left:auto; width:min(210px,100%); padding:11px 30px 11px 13px; border:1px solid rgba(178,153,255,.32); border-radius:15px 15px 4px 15px; background:rgba(12,14,34,.84); backdrop-filter:blur(14px); box-shadow:0 16px 36px rgba(0,0,0,.28); animation:bubbleIn .45s ease both; }
.assistant-bubble strong { display:block; color:#d8c8ff; font-size:11px; margin-bottom:2px; }
.assistant-bubble span { display:block; color:#a9a6c1; font-size:10.5px; line-height:1.35; }
.assistant-close { position:absolute; top:5px; right:7px; width:20px; height:20px; border:0; border-radius:50%; background:rgba(255,255,255,.06); color:#aaa7bb; cursor:pointer; }
.assistant-character { display:block; position:relative; margin-left:auto; margin-right:-5px; width:180px; height:210px; padding:0; border:0; background:transparent; cursor:pointer; pointer-events:auto; }
.assistant-character img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; object-position:bottom; filter:drop-shadow(0 14px 20px rgba(0,0,0,.35)); animation:assistantFloat 4.2s ease-in-out infinite; }
.assistant-character:hover img { filter:drop-shadow(0 0 20px rgba(174,124,255,.45)); }
.assistant-glow { position:absolute; width:130px; height:60px; right:10px; bottom:2px; border-radius:50%; background:radial-gradient(ellipse, rgba(145,111,255,.24), transparent 70%); filter:blur(7px); }
.assistant-wave-lines { display:none; }
.assistant-character.is-waving img { animation:wave .75s ease-in-out 2; }
.assistant-show { display:none; pointer-events:auto; margin-left:auto; border:1px solid var(--border-strong); border-radius:999px; padding:7px 10px; background:rgba(15,18,42,.9); color:#d6caff; cursor:pointer; }
.assistant-widget.is-hidden .assistant-bubble, .assistant-widget.is-hidden .assistant-character { display:none; }
.assistant-widget.is-hidden .assistant-show { display:block; }

@keyframes heroFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-7px)} }
@keyframes assistantFloat { 0%,100%{transform:translateY(0) rotate(0)} 50%{transform:translateY(-5px) rotate(-1deg)} }
@keyframes wave { 0%,100%{transform:rotate(0) translateY(0)} 25%{transform:rotate(-2deg) translateY(-5px)} 50%{transform:rotate(2deg) translateY(-7px)} 75%{transform:rotate(-1deg) translateY(-3px)} }
@keyframes sparkFloat { 0%,100%{transform:translateY(0) scale(1);opacity:.65} 50%{transform:translateY(-9px) scale(1.12);opacity:1} }
@keyframes bubbleIn { from{opacity:0;transform:translateY(7px) scale(.97)} to{opacity:1;transform:none} }

@media (max-width: 860px) {
  .topbar { align-items:flex-start; gap:9px; flex-direction:column; }
  .brand { width:100%; }
  nav { width:100%; padding-bottom:1px; }
  main { width:min(100% - 20px, 720px); padding-top:18px; }
  .hero-panel { grid-template-columns:1fr; min-height:unset; }
  .hero-copy { padding:25px 22px 10px; }
  .hero-panel h1 { font-size:30px; }
  .hero-character-wrap { min-height:280px; margin-top:-8px; }
  .hero-character { width:min(78%, 320px); max-height:300px; }
  .hero-note { top:9%; right:7%; }
  .grid { grid-template-columns:repeat(2,1fr); }
  .assistant-widget { width:180px; right:8px; bottom:5px; }
  .assistant-character { width:135px; height:160px; }
  .assistant-bubble { width:165px; }
}
@media (max-width: 520px) {
  .brand { font-size:14px; }
  .brand small { font-size:10px; }
  main { width:calc(100% - 14px); }
  .hero-panel { border-radius:18px; }
  .hero-copy { padding:21px 17px 4px; }
  .hero-panel h1 { font-size:25px; }
  .hero-subtitle { font-size:12.5px; }
  .hero-mini-stats { margin-top:20px; }
  .hero-mini-stats div { min-width:0; flex:1; padding-right:8px; margin-right:8px; }
  .hero-character-wrap { min-height:235px; }
  .hero-character { width:70%; max-height:245px; }
  .hero-note { right:3%; top:7%; max-width:150px; font-size:9px; }
  .grid { grid-template-columns:1fr 1fr; gap:8px; }
  .card { padding:12px; }
  .card .value { font-size:19px; }
  .card .label { font-size:8.5px; }
  .panel { padding:12px; overflow-x:auto; }
  table { min-width:480px; }
  .section-heading { align-items:flex-start; flex-direction:column; }
  .assistant-widget { right:5px; bottom:2px; width:145px; }
  .assistant-bubble { width:135px; padding:8px 25px 8px 9px; }
  .assistant-bubble strong { font-size:9px; }
  .assistant-bubble span { font-size:8.5px; }
  .assistant-character { width:105px; height:125px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; }
}


/* ===== Sorasaki finishing touches ===== */
.info-hero {
  position:relative; overflow:hidden; display:grid; grid-template-columns:1.25fr .75fr; min-height:360px;
  border:1px solid var(--border); border-radius:24px; margin-bottom:20px;
  background:linear-gradient(125deg,rgba(16,20,48,.96),rgba(31,17,53,.72));
  box-shadow:0 24px 70px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.04);
}
.info-hero::before { content:""; position:absolute; width:430px; height:430px; right:-100px; top:-150px; border-radius:50%; background:radial-gradient(circle,rgba(170,110,255,.22),transparent 68%); }
.info-copy { position:relative; z-index:2; align-self:center; padding:clamp(24px,5vw,48px); max-width:720px; }
.info-copy h1 { margin:10px 0 14px; }
.info-copy h1 { background:linear-gradient(90deg,#f5f3ff 20%,#c9b6ff 70%,#ee9cff); -webkit-background-clip:text; background-clip:text; color:transparent; }
.info-copy p { color:#b7b5cc; max-width:650px; font-size:14px; margin:0; }
.info-copy strong { color:#e8ddff; }
.info-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
.info-tags span { padding:8px 11px; border:1px solid var(--border); border-radius:999px; background:rgba(255,255,255,.035); color:#cbc5e4; font-size:11px; }
.info-character, .support-character { position:relative; z-index:2; display:flex; align-items:flex-end; justify-content:center; min-height:360px; }
.info-character img { width:min(100%,410px); max-height:380px; object-fit:contain; object-position:bottom; filter:drop-shadow(0 22px 26px rgba(0,0,0,.32)); animation:heroFloat 5s ease-in-out infinite; }
.info-character span { position:absolute; right:7%; top:18%; max-width:190px; padding:10px 12px; border:1px solid rgba(190,166,255,.28); border-radius:14px 14px 4px 14px; background:rgba(10,12,31,.78); color:#c9c5dc; font-size:10.5px; }
.feature-grid, .contact-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:20px; }
.feature-card, .contact-card { border:1px solid var(--border); border-radius:17px; background:linear-gradient(145deg,rgba(17,22,47,.88),rgba(12,16,35,.88)); box-shadow:0 12px 35px rgba(0,0,0,.12); }
.feature-card { padding:18px; }
.feature-card b { color:#ddd5ff; font-size:14px; }
.feature-card p { color:var(--text-dim); font-size:12.5px; line-height:1.55; margin:8px 0 0; }
.contact-grid { grid-template-columns:repeat(2,1fr); }
.contact-card { display:flex; align-items:center; gap:12px; padding:15px; transition:.2s ease; }
.contact-card:hover { transform:translateY(-3px); border-color:var(--border-strong); background:var(--bg-card-hover); }
.contact-card .contact-icon { display:grid; place-items:center; width:42px; height:42px; border-radius:13px; background:rgba(154,120,255,.13); color:#c9b7ff; border:1px solid rgba(154,120,255,.25); font-size:18px; }
.contact-card div { min-width:0; flex:1; }
.contact-card small, .contact-card div span { display:block; color:var(--text-dim); font-size:10.5px; }
.contact-card strong { display:block; color:#f2edff; font-size:13px; margin:2px 0; overflow-wrap:anywhere; }
.contact-card > b { color:#b9a8ff; font-size:18px; }
.support-tip { display:flex; gap:12px; align-items:flex-start; padding:16px 18px; border:1px solid rgba(97,217,255,.15); border-radius:17px; background:rgba(97,217,255,.045); color:#b7b5cc; }
.support-tip > span { font-size:20px; }
.support-tip strong { color:#d8d1f4; font-size:12px; }
.support-tip p { margin:3px 0 0; font-size:12px; }
.support-character img { width:min(100%,380px); max-height:350px; object-fit:contain; filter:drop-shadow(0 20px 25px rgba(0,0,0,.28)); animation:heroFloat 5s ease-in-out infinite; }
@keyframes heroFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }
@media (max-width:760px) {
  .info-hero { grid-template-columns:1fr; min-height:0; }
  .info-copy { padding:25px 20px 10px; }
  .info-character, .support-character { min-height:260px; margin-top:-5px; }
  .info-character img, .support-character img { width:min(92%,300px); max-height:280px; }
  .info-character span { right:8%; top:8%; }
  .feature-grid, .contact-grid { grid-template-columns:1fr; }
  .contact-card { padding:13px; }
}


/* ===== Grupos / Comunidades ===== */
.groups-hero {
  position: relative; overflow: hidden; display: grid; grid-template-columns: 1fr 250px; gap: 24px; align-items: center;
  min-height: 250px; margin-bottom: 18px; padding: clamp(24px, 4vw, 38px);
  border: 1px solid rgba(154,120,255,.24); border-radius: 22px;
  background: radial-gradient(500px 240px at 85% 50%, rgba(151,105,255,.18), transparent 70%), linear-gradient(135deg, rgba(18,24,44,.98), rgba(11,15,32,.94));
  box-shadow: 0 22px 60px rgba(0,0,0,.2);
}
.groups-hero::after { content:""; position:absolute; width:330px; height:330px; right:-120px; top:-150px; border:1px solid rgba(194,156,255,.14); border-radius:50%; box-shadow:0 0 70px rgba(130,91,255,.12); }
.groups-hero h1 { font-size: clamp(28px, 4vw, 42px); max-width: 700px; margin: 9px 0 12px; letter-spacing:-1px; }
.groups-hero h1 span { background:linear-gradient(90deg,#bca4ff,#ee8fff); -webkit-background-clip:text; background-clip:text; color:transparent; }
.groups-hero p { max-width:650px; margin:0; color:#a9a7be; line-height:1.6; font-size:14px; }
.groups-hero-stats { display:flex; gap:0; margin-top:24px; }
.groups-hero-stats div { padding-right:20px; margin-right:20px; border-right:1px solid rgba(255,255,255,.09); }
.groups-hero-stats div:last-child { border:0; margin:0; }
.groups-hero-stats strong { display:block; font-size:18px; color:#f4efff; }
.groups-hero-stats span { display:block; margin-top:3px; color:#817e98; font-size:10px; }
.groups-mascot { position:relative; height:190px; display:grid; place-items:center; z-index:1; }
.groups-mascot div { width:120px; height:120px; display:grid; place-items:center; border-radius:36% 64% 58% 42%; font-size:48px; background:linear-gradient(145deg,rgba(138,96,255,.25),rgba(235,113,255,.1)); border:1px solid rgba(187,151,255,.3); box-shadow:0 0 60px rgba(134,93,255,.2); animation:groupFloat 4s ease-in-out infinite; }
.groups-mascot span { position:absolute; color:#dba5ff; text-shadow:0 0 16px #9a78ff; animation:sparkFloat 3s ease-in-out infinite; }
.groups-mascot span:nth-child(1){top:8%;left:18%}.groups-mascot span:nth-child(2){bottom:17%;right:16%;font-size:24px}.groups-mascot span:nth-child(3){top:27%;right:8%}
.groups-toolbar { display:grid; grid-template-columns:minmax(220px,1fr) auto auto; gap:10px; align-items:center; padding:10px; margin-bottom:18px; }
.group-search-wrap { display:flex; align-items:center; gap:8px; min-width:0; padding:0 12px; border:1px solid var(--border); background:rgba(255,255,255,.025); border-radius:11px; }
.group-search-wrap span { color:#9b88ff; font-size:19px; }.group-search-wrap input { width:100%; min-width:0; border:0; outline:0; background:transparent; color:var(--text); padding:10px 0; font:inherit; font-size:13px; }
.group-search-wrap input::placeholder { color:#6f7182; }
.group-filters { display:flex; gap:5px; }.group-filter,.groups-toolbar select { border:1px solid var(--border); background:rgba(255,255,255,.025); color:var(--text-dim); border-radius:10px; padding:9px 11px; font:inherit; font-size:12px; cursor:pointer; }
.group-filter:hover,.group-filter.active { color:#eee9ff; border-color:rgba(148,111,255,.45); background:rgba(124,92,255,.12); }
.groups-toolbar select { outline:none; }
.groups-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-bottom:18px; }
.group-card { position:relative; overflow:hidden; padding:21px; border:1px solid var(--border); border-radius:18px; background:linear-gradient(145deg,rgba(18,24,38,.96),rgba(15,20,34,.96)); transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease; }
.group-card::before { content:""; position:absolute; width:180px;height:180px;right:-90px;top:-90px;border-radius:50%;background:rgba(124,92,255,.1);filter:blur(3px); }
.group-card:hover { transform:translateY(-4px); border-color:rgba(154,120,255,.42); box-shadow:0 18px 45px rgba(0,0,0,.25); }
.group-card.featured { border-color:rgba(176,130,255,.35); box-shadow:inset 0 1px 0 rgba(255,255,255,.03); }
.group-card-top { position:relative; z-index:1; display:flex; align-items:center; gap:8px; min-height:44px; }.group-icon { width:43px;height:43px;display:grid;place-items:center;border-radius:13px;background:linear-gradient(145deg,rgba(124,92,255,.24),rgba(217,99,255,.1));border:1px solid rgba(167,134,255,.25);font-size:21px; }
.group-category,.group-featured { padding:5px 8px; border-radius:999px; font-size:10px; border:1px solid rgba(255,255,255,.08); color:#a7a3b8; background:rgba(255,255,255,.025); }.group-featured { margin-left:auto; color:#d6b7ff; border-color:rgba(183,135,255,.22); background:rgba(143,93,255,.1); }
.group-card h2 { position:relative; margin:17px 0 7px; font-size:17px; }.group-card p { position:relative; min-height:44px; margin:0; color:#9694a8; font-size:12.5px; line-height:1.55; }
.group-meta { display:flex; justify-content:space-between; gap:10px; margin:17px 0; padding:10px 0; border-top:1px solid rgba(255,255,255,.07); border-bottom:1px solid rgba(255,255,255,.07); color:#858398; font-size:11px; }.group-meta strong { color:#ddd8ec; }.group-meta span:last-child { color:#5be49b; }
.group-card-actions { display:flex; gap:8px; }.group-join,.group-copy { flex:1; display:flex; justify-content:center; align-items:center; gap:7px; border-radius:10px; padding:10px 11px; font:inherit; font-size:11.5px; cursor:pointer; transition:.2s; }.group-join { color:#fff; background:linear-gradient(135deg,#7354df,#9e58d8); border:1px solid transparent; box-shadow:0 8px 20px rgba(122,78,216,.2); }.group-join:hover { filter:brightness(1.08); transform:translateY(-1px); }.group-copy { color:#b7b2c9; background:rgba(255,255,255,.025); border:1px solid var(--border); }.group-copy:hover { color:#eee9ff; border-color:rgba(154,120,255,.35); }
.groups-empty { display:grid; place-items:center; text-align:center; padding:48px 20px; color:#89869b; border:1px dashed var(--border); border-radius:18px; margin-bottom:18px; }.groups-empty div { font-size:30px; color:#9b82ff; margin-bottom:8px; }.groups-empty strong { color:#dcd7eb; font-size:15px; }.groups-empty span { font-size:12px; margin-top:4px; }
.groups-note { display:flex; align-items:flex-start; gap:13px; margin-top:0; }.groups-note-icon { width:38px;height:38px;flex:0 0 38px;display:grid;place-items:center;border-radius:12px;background:rgba(124,92,255,.12);border:1px solid rgba(124,92,255,.2); }.groups-note strong { font-size:13px; }.groups-note p { margin:4px 0 0; color:var(--text-dim); font-size:12px; line-height:1.5; }
@keyframes groupFloat { 0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-9px) rotate(2deg)} }
.sorasaki-group-feature{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) 430px;align-items:center;min-height:310px;margin:0 0 18px;padding:26px 28px;border:1px solid rgba(180,130,255,.28);border-radius:22px;background:radial-gradient(circle at 82% 48%,rgba(166,78,255,.16),transparent 34%),linear-gradient(120deg,rgba(13,18,34,.98),rgba(20,13,37,.98));box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 18px 50px rgba(0,0,0,.16)}
.sorasaki-group-feature::before{content:"";position:absolute;inset:auto -100px -170px auto;width:380px;height:380px;border-radius:50%;border:1px solid rgba(218,139,255,.12);box-shadow:0 0 100px rgba(160,83,255,.16)}
.sorasaki-group-feature-copy{position:relative;z-index:2;max-width:610px}.sorasaki-group-feature h2{margin:8px 0 10px;font-size:clamp(24px,3vw,34px);letter-spacing:-.7px}.sorasaki-group-feature h2 span{background:linear-gradient(90deg,#c9adff,#f08bff);-webkit-background-clip:text;background-clip:text;color:transparent}.sorasaki-group-feature-copy p{max-width:590px;margin:0;color:#a7a5b9;font-size:13px;line-height:1.65}.sorasaki-feature-pills{display:flex;flex-wrap:wrap;gap:7px;margin-top:17px}.sorasaki-feature-pills span{padding:7px 9px;border:1px solid rgba(180,140,255,.16);border-radius:999px;background:rgba(255,255,255,.025);color:#bcb6cd;font-size:10px}.sorasaki-feature-character{position:relative;align-self:stretch;min-height:300px;display:flex;align-items:flex-end;justify-content:center}.sorasaki-feature-character img{position:relative;z-index:2;width:min(100%,430px);max-height:360px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 14px 26px rgba(139,65,255,.24));animation:sorasakiWaveFloat 4.5s ease-in-out infinite}.sorasaki-feature-glow{position:absolute;z-index:1;right:13%;bottom:2%;width:260px;height:210px;border-radius:50%;background:rgba(178,74,255,.15);filter:blur(45px)}.sorasaki-feature-caption{position:absolute;right:5%;top:13%;z-index:3;padding:8px 11px;border:1px solid rgba(211,157,255,.25);border-radius:12px;background:rgba(18,12,35,.82);color:#e3d4ff;font-size:10px;box-shadow:0 8px 25px rgba(0,0,0,.2);backdrop-filter:blur(8px)}
@keyframes sorasakiWaveFloat{0%,100%{transform:translateY(0) rotate(.2deg)}50%{transform:translateY(-7px) rotate(-.7deg)}}

@media(max-width:900px){.sorasaki-group-feature{grid-template-columns:1fr 330px;padding:22px}.sorasaki-feature-character{min-height:270px}.sorasaki-feature-caption{right:0;top:10%}}
@media(max-width:700px){.sorasaki-group-feature{grid-template-columns:1fr;min-height:0;padding:20px 18px}.sorasaki-group-feature-copy{max-width:none}.sorasaki-feature-character{min-height:250px;margin:4px -8px -12px}.sorasaki-feature-character img{width:min(100%,360px);max-height:290px}.sorasaki-feature-caption{right:4%;top:6%}.sorasaki-feature-pills{gap:5px}}
@media(max-width:850px){.groups-hero{grid-template-columns:1fr}.groups-mascot{position:absolute;right:12px;bottom:-20px;opacity:.45;width:180px}.groups-hero>div:first-child{position:relative;z-index:2}.groups-toolbar{grid-template-columns:1fr}.groups-filters{overflow:auto}.groups-toolbar select{width:100%}}
@media(max-width:620px){.groups-hero{min-height:300px;padding:21px 17px;border-radius:18px}.groups-hero h1{font-size:27px}.groups-hero p{font-size:12.5px}.groups-hero-stats div{padding-right:9px;margin-right:9px}.groups-hero-stats strong{font-size:15px}.groups-hero-stats span{font-size:8.5px}.groups-grid{grid-template-columns:1fr;gap:12px}.group-card{padding:17px}.group-card p{min-height:0}.group-card-actions{flex-direction:column}.group-copy,.group-join{width:100%}.groups-note{padding:15px}}

.groups-promo{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:4px 0 22px;padding:18px 20px;border:1px solid rgba(154,120,255,.22);border-radius:16px;background:linear-gradient(90deg,rgba(124,92,255,.09),rgba(34,211,238,.035));}.groups-promo h2{margin:3px 0 4px;font-size:16px}.groups-promo p{margin:0;color:var(--text-dim);font-size:12px}.groups-promo .hero-btn{flex:0 0 auto}@media(max-width:620px){.groups-promo{align-items:flex-start;flex-direction:column}.groups-promo .hero-btn{width:100%;justify-content:center}}

/* ===== Central de navegação Sorasaki ===== */
.menu-trigger {
  width: 44px;
  height: 44px;
  border: 1px solid rgba(124,92,255,.28);
  border-radius: 13px;
  background: rgba(18,24,38,.72);
  color: var(--text);
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  cursor: pointer;
  transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.menu-trigger span { width: 18px; height: 2px; border-radius: 99px; background: currentColor; transition: transform .25s ease, opacity .2s ease; }
.menu-trigger:hover { transform: translateY(-1px); border-color: rgba(124,92,255,.65); background: rgba(124,92,255,.12); box-shadow: 0 8px 25px rgba(124,92,255,.14); }
.menu-trigger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-trigger.is-open span:nth-child(2) { opacity: 0; }
.menu-trigger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.sora-overlay {
  position: fixed;
  inset: 0;
  background: rgba(3,5,12,.58);
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
  opacity: 0;
  visibility: hidden;
  transition: opacity .28s ease, visibility .28s ease;
  z-index: 90;
}
.sora-overlay.is-open { opacity: 1; visibility: visible; }

.sora-drawer {
  position: fixed;
  top: 0;
  right: 0;
  width: min(390px, 92vw);
  height: 100dvh;
  padding: 22px;
  background: linear-gradient(180deg, rgba(13,17,29,.98), rgba(8,11,20,.99));
  border-left: 1px solid rgba(124,92,255,.28);
  box-shadow: -24px 0 70px rgba(0,0,0,.38), -5px 0 35px rgba(124,92,255,.08);
  transform: translateX(105%);
  transition: transform .34s cubic-bezier(.2,.8,.2,1);
  z-index: 100;
  overflow-y: auto;
}
.sora-drawer.is-open { transform: translateX(0); }
.sora-drawer::before {
  content: "";
  position: absolute;
  width: 280px;
  height: 280px;
  right: -150px;
  top: 80px;
  border-radius: 50%;
  background: rgba(124,92,255,.12);
  filter: blur(45px);
  pointer-events: none;
}
.sora-menu-head, .sora-menu-content { position: relative; z-index: 1; }
.sora-menu-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:22px; }
.sora-menu-brand { display:flex; align-items:center; gap:11px; }
.sora-menu-brand .menu-logo { width:40px; height:40px; display:grid; place-items:center; border-radius:12px; background:linear-gradient(135deg, rgba(124,92,255,.28), rgba(34,211,238,.12)); border:1px solid rgba(124,92,255,.3); box-shadow: inset 0 0 18px rgba(124,92,255,.08); }
.sora-menu-brand strong { display:block; font-size:16px; }
.sora-menu-brand small { display:block; color:var(--text-dim); font-size:11px; margin-top:2px; }
.sora-menu-close { width:38px; height:38px; border:1px solid var(--border); background:rgba(18,24,38,.75); color:var(--text-dim); border-radius:11px; cursor:pointer; font-size:22px; transition:.2s; }
.sora-menu-close:hover { color:var(--text); border-color:rgba(124,92,255,.5); transform:rotate(4deg); }
.sora-menu-label { color:#747e93; font-size:10px; font-weight:800; letter-spacing:1.3px; margin:16px 4px 8px; text-transform:uppercase; }
.sora-menu-link { width:100%; display:flex; align-items:center; gap:12px; padding:12px; border:1px solid transparent; border-radius:13px; color:var(--text-dim); background:transparent; transition: transform .18s ease, color .18s ease, background .18s ease, border-color .18s ease; }
.sora-menu-link .menu-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; background:rgba(124,92,255,.09); border:1px solid rgba(124,92,255,.12); font-size:16px; flex:0 0 auto; }
.sora-menu-link strong { display:block; color:inherit; font-size:13.5px; }
.sora-menu-link small { display:block; color:#6f788a; font-size:10.5px; margin-top:2px; }
.sora-menu-link .menu-arrow { margin-left:auto; color:#596275; font-size:17px; transition:transform .18s ease, color .18s ease; }
.sora-menu-link:hover, .sora-menu-link.active { color:var(--text); background:linear-gradient(90deg, rgba(124,92,255,.13), rgba(124,92,255,.035)); border-color:rgba(124,92,255,.2); transform:translateX(-2px); }
.sora-menu-link:hover .menu-arrow, .sora-menu-link.active .menu-arrow { color:var(--accent); transform:translateX(2px); }
.sora-menu-status { margin-top:18px; padding:13px; border:1px solid rgba(34,197,94,.18); border-radius:14px; background:rgba(34,197,94,.055); display:flex; gap:10px; align-items:center; }
.sora-menu-status .live-dot { width:8px; height:8px; border-radius:50%; background:var(--ok); box-shadow:0 0 12px rgba(34,197,94,.8); flex:0 0 auto; }
.sora-menu-status strong { font-size:12px; }
.sora-menu-status span { display:block; color:var(--text-dim); font-size:10.5px; margin-top:2px; }
.sora-menu-footer { color:#687286; font-size:10.5px; text-align:center; padding:18px 0 4px; }

@media (max-width: 640px) {
  .topbar { padding:12px 14px; }
  .brand small { font-size:10px; }
  .menu-trigger { width:42px; height:42px; }
  main { padding-top:20px; }
  .sora-drawer { padding:18px 15px; width:min(360px, 94vw); }
}

@media (prefers-reduced-motion: reduce) {
  .sora-overlay, .sora-drawer, .sora-menu-link, .menu-trigger, .menu-trigger span { transition:none !important; }
}
/* O menu lateral é a navegação principal; a barra superior fica limpa e compacta. */
.topbar nav { display: none; }
.topbar > .menu-trigger { margin-left: auto; }

/* ===== Menu Sorasaki — edição interativa ===== */
.menu-trigger {
  position: relative;
  width: 52px;
  height: 46px;
  padding: 0;
  gap: 4px;
  border: 1px solid rgba(197,132,255,.35);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(124,92,255,.15), rgba(18,24,38,.84));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 7px 24px rgba(96,49,180,.12);
}
.menu-trigger span { width: 19px; height: 2px; }
.menu-trigger b { position:absolute; bottom:4px; font-size:6px; letter-spacing:1.3px; color:#a99bc7; font-weight:800; opacity:.8; }
.menu-trigger:hover { transform: translateY(-2px) scale(1.02); box-shadow: 0 10px 30px rgba(124,92,255,.2); }
.menu-trigger.is-open { background: linear-gradient(145deg, rgba(171,79,255,.22), rgba(18,24,38,.92)); }

.sora-drawer {
  width: min(392px, 94vw);
  padding: 18px;
  background:
    radial-gradient(280px 220px at 78% 12%, rgba(181,76,255,.16), transparent 70%),
    radial-gradient(220px 180px at 15% 42%, rgba(76,125,255,.08), transparent 72%),
    linear-gradient(180deg, rgba(10,12,23,.985), rgba(7,10,18,.995));
  border-left: 1px solid rgba(197,132,255,.34);
}
.sora-drawer::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(115deg, transparent 35%, rgba(210,154,255,.035) 50%, transparent 65%);
  transform:translateX(-100%);
}
.sora-drawer.is-open::after { animation: menuShine .9s ease .12s both; }
@keyframes menuShine { to { transform:translateX(100%); } }

.sora-menu-character {
  --mx:0deg;
  --my:0deg;
  position:relative;
  height:194px;
  margin: -4px -3px 10px;
  border-radius:20px;
  overflow:hidden;
  border:1px solid rgba(190,120,255,.18);
  background:
    radial-gradient(circle at 62% 42%, rgba(190,86,255,.19), transparent 35%),
    linear-gradient(145deg, rgba(124,92,255,.08), rgba(12,13,26,.35));
  isolation:isolate;
  cursor:pointer;
  transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.sora-menu-character:hover { border-color:rgba(207,135,255,.38); box-shadow:0 14px 45px rgba(109,48,179,.16), inset 0 0 35px rgba(124,92,255,.06); }
.sora-menu-character img {
  position:absolute;
  z-index:2;
  left:50%;
  bottom:-12px;
  width:285px;
  height:220px;
  object-fit:contain;
  object-position:center bottom;
  transform:translateX(-50%) perspective(700px) rotateY(var(--mx)) rotateX(var(--my));
  filter:drop-shadow(0 13px 22px rgba(163,76,255,.32));
  transition:transform .18s ease, filter .25s ease;
  user-select:none;
}
.sora-menu-character.is-cheering img { animation:menuCheer .65s ease; }
@keyframes menuCheer { 0%,100%{transform:translateX(-50%) perspective(700px) rotateY(var(--mx)) rotateX(var(--my)) rotate(0)} 25%{transform:translateX(-50%) perspective(700px) rotateY(var(--mx)) rotateX(var(--my)) rotate(-2deg) translateY(-5px)} 55%{transform:translateX(-50%) perspective(700px) rotateY(var(--mx)) rotateX(var(--my)) rotate(2deg) translateY(-8px)} }
.menu-character-glow { position:absolute; z-index:1; left:50%; bottom:-50px; width:250px; height:160px; transform:translateX(-50%); border-radius:50%; background:rgba(177,70,255,.28); filter:blur(42px); }
.menu-spark { position:absolute; z-index:3; color:#e4b8ff; text-shadow:0 0 14px #a84dff; animation:menuSpark 3.5s ease-in-out infinite; }
.spark-1 { left:17%; top:31%; font-size:14px; }
.spark-2 { right:15%; top:18%; font-size:18px; animation-delay:.8s; }
.spark-3 { left:13%; bottom:22%; font-size:17px; animation-delay:1.4s; }
@keyframes menuSpark { 0%,100%{transform:translateY(0) scale(.9);opacity:.5}50%{transform:translateY(-7px) scale(1.12);opacity:1} }
.menu-character-card {
  position:absolute;
  z-index:4;
  left:12px;
  bottom:11px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
  max-width:185px;
  padding:8px 10px;
  border:1px solid rgba(218,161,255,.2);
  border-radius:12px;
  background:rgba(9,10,20,.68);
  backdrop-filter:blur(10px);
  box-shadow:0 7px 25px rgba(0,0,0,.22);
}
.menu-character-card strong { font-size:10.5px; color:#f0e9fb; }
.menu-character-card small { font-size:9px; color:#9e96ad; }
.menu-character-status { display:flex;align-items:center;gap:5px;font-size:7px;text-transform:uppercase;letter-spacing:1px;color:#bca9d8;font-weight:800; }
.menu-character-status i { width:5px;height:5px;border-radius:50%;background:#36e58a;box-shadow:0 0 9px #36e58a; }

.sora-menu-link { position:relative; overflow:hidden; }
.sora-menu-link::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(194,126,255,.10),transparent 60%); transform:translateX(-110%); transition:transform .35s ease; pointer-events:none; }
.sora-menu-link:hover::before, .sora-menu-link.active::before { transform:translateX(0); }
.sora-drawer.is-open .sora-menu-link { animation:menuItemIn .42s cubic-bezier(.2,.8,.2,1) both; animation-delay:calc(90ms + var(--menu-i) * 35ms); }
@keyframes menuItemIn { from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:translateX(0)} }

.sora-menu-quick { display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px; }
.menu-quick-card { display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:center;padding:10px 11px;border:1px solid rgba(124,92,255,.13);border-radius:12px;background:rgba(255,255,255,.018);transition:.2s; }
.menu-quick-card span { grid-row:span 2;font-size:17px; }
.menu-quick-card b { font-size:11px;color:#dcd6e7; }
.menu-quick-card small { font-size:9px;color:#74798a; }
.menu-quick-card:hover { transform:translateY(-2px);border-color:rgba(178,112,255,.32);background:rgba(124,92,255,.08); }

.sora-menu-status { margin-top:10px; }

@media(max-width:640px){
  .menu-trigger{width:48px;height:44px;border-radius:13px}
  .sora-drawer{width:min(365px,94vw);padding:15px}
  .sora-menu-character{height:172px;border-radius:18px}
  .sora-menu-character img{width:250px;height:196px;bottom:-10px}
  .menu-character-card{left:9px;bottom:9px;max-width:172px}
  .sora-menu-link{padding:10px}
  .sora-menu-link .menu-icon{width:31px;height:31px;font-size:14px}
  .sora-menu-link strong{font-size:12.5px}
  .sora-menu-link small{font-size:9.5px}
}

@media(prefers-reduced-motion:reduce){
  .sora-drawer.is-open::after,.sora-drawer.is-open .sora-menu-link,.menu-spark,.sora-menu-character.is-cheering img{animation:none!important}
  .sora-menu-character img,.sora-menu-character,.menu-quick-card{transition:none!important}
}

/* ===== Correção visual do personagem dentro do menu ===== */
.sora-menu-character{height:156px!important;margin:-2px 0 9px!important;border-radius:18px!important;background:radial-gradient(circle at 58% 48%,rgba(190,86,255,.22),transparent 39%),linear-gradient(145deg,rgba(124,92,255,.12),rgba(8,10,20,.62))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 10px 35px rgba(100,35,180,.10)!important}
.sora-menu-character img{display:block!important;visibility:visible!important;opacity:1!important;width:235px!important;height:178px!important;bottom:-9px!important;z-index:2!important;object-fit:contain!important;filter:drop-shadow(0 12px 18px rgba(172,76,255,.42))!important}
.menu-character-glow{z-index:1!important;opacity:.9}
.menu-character-grid{position:absolute;inset:0;z-index:1;opacity:.22;background-image:linear-gradient(rgba(202,142,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(202,142,255,.08) 1px,transparent 1px);background-size:18px 18px;mask-image:linear-gradient(to bottom,transparent,black 35%,transparent)}
.menu-character-badge{position:absolute;z-index:4;right:9px;top:9px;display:flex;align-items:center;gap:5px;padding:5px 8px;border:1px solid rgba(215,158,255,.2);border-radius:999px;background:rgba(8,10,19,.62);backdrop-filter:blur(8px);color:#e8d9f7;font-size:9px;font-weight:800;box-shadow:0 5px 15px rgba(0,0,0,.18)}
.menu-character-badge span{color:#9f91ae;font-weight:600}
.menu-character-card{left:9px!important;bottom:8px!important;max-width:170px!important;padding:7px 9px!important;background:rgba(7,9,17,.76)!important}
.menu-character-card strong{font-size:10px!important}.menu-character-card small{font-size:8.5px!important}
@media(max-width:640px){.sora-drawer{width:min(365px,94vw)!important;padding:14px!important}.sora-menu-head{margin-bottom:9px!important}.sora-menu-character{height:145px!important}.sora-menu-character img{width:218px!important;height:164px!important}.sora-menu-label{margin:10px 4px 6px!important}.sora-menu-link{padding:8px 9px!important}.sora-menu-link .menu-icon{width:29px!important;height:29px!important}.sora-menu-link strong{font-size:12px!important}.sora-menu-link small{font-size:9px!important}.sora-menu-quick{margin-top:8px!important}.sora-menu-status{margin-top:8px!important}.sora-menu-footer{padding-top:10px!important}}

/* ===== Central de Feedback / Avaliações / Bugs ===== */
.feedback-page{max-width:1080px}
.feedback-hero{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:20px;min-height:410px;padding:28px 30px;margin:10px 0 24px;border:1px solid rgba(161,108,255,.18);border-radius:28px;overflow:hidden;background:radial-gradient(circle at 75% 35%,rgba(163,75,255,.15),transparent 32%),linear-gradient(145deg,rgba(20,18,37,.94),rgba(7,10,21,.96));box-shadow:0 20px 60px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.04)}
.feedback-hero:before{content:"";position:absolute;inset:auto -15% -70%;height:230px;background:radial-gradient(ellipse,rgba(142,67,255,.22),transparent 65%);filter:blur(22px);pointer-events:none}
.feedback-copy{align-self:center;position:relative;z-index:2;padding-right:10px}.feedback-copy h1{max-width:640px;margin:10px 0 12px}.feedback-copy h1 span{color:#c486ff;text-shadow:0 0 25px rgba(180,88,255,.28)}.feedback-copy p{max-width:650px;color:#aaa4b7;line-height:1.7;font-size:15px}.feedback-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.feedback-chips span{padding:8px 11px;border-radius:999px;border:1px solid rgba(181,121,255,.18);background:rgba(124,92,255,.08);color:#d9c9eb;font-size:11px;font-weight:800}
.feedback-character-wrap{position:relative;min-height:350px;display:flex;align-items:center;justify-content:center;z-index:1}.feedback-character-glow{position:absolute;width:300px;height:250px;border-radius:50%;background:rgba(154,61,255,.25);filter:blur(65px);animation:feedbackGlow 4s ease-in-out infinite}.feedback-character{position:relative;width:min(100%,430px);height:400px;object-fit:contain;filter:drop-shadow(0 18px 28px rgba(167,76,255,.28));animation:feedbackFloat 5s ease-in-out infinite;transform-origin:center bottom}.feedback-character-caption{position:absolute;right:5px;bottom:8px;display:flex;flex-direction:column;gap:2px;padding:10px 12px;border:1px solid rgba(212,164,255,.2);border-radius:14px;background:rgba(7,9,17,.72);backdrop-filter:blur(10px);box-shadow:0 10px 30px rgba(0,0,0,.25)}.feedback-character-caption b{font-size:11px;color:#eee7f8}.feedback-character-caption span{font-size:9px;color:#a9a1b3}
@keyframes feedbackFloat{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-8px) rotate(1deg)}}@keyframes feedbackGlow{0%,100%{opacity:.7;transform:scale(.96)}50%{opacity:1;transform:scale(1.05)}}
.feedback-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}.feedback-card{border:1px solid rgba(145,103,220,.14);border-radius:20px;padding:22px;background:linear-gradient(145deg,rgba(16,18,31,.92),rgba(9,11,22,.96));box-shadow:0 12px 35px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.025)}.feedback-card h2{margin:6px 0 8px}.muted{color:#918c9b;line-height:1.6}.feedback-card label{display:flex;flex-direction:column;gap:6px;margin-top:14px;color:#b9b2c4;font-size:11px;font-weight:800}.feedback-card input,.feedback-card textarea,.feedback-card select{width:100%;box-sizing:border-box;border:1px solid rgba(143,110,202,.16);border-radius:12px;background:rgba(255,255,255,.025);color:#eee8f4;padding:11px 12px;outline:none;font:inherit;font-weight:500;resize:vertical}.feedback-card input:focus,.feedback-card textarea:focus,.feedback-card select:focus{border-color:rgba(180,112,255,.5);box-shadow:0 0 0 3px rgba(142,70,255,.09)}.optional{color:#696473;font-weight:600}.star-rating{display:flex;gap:4px;margin:18px 0 5px}.star-rating button{border:0;background:transparent;color:#4b4654;font-size:30px;cursor:pointer;padding:2px 4px;transition:transform .2s,color .2s,text-shadow .2s}.star-rating button:hover,.star-rating button.selected{color:#d69cff;text-shadow:0 0 16px rgba(205,112,255,.45);transform:translateY(-2px) scale(1.05)}.rating-text{display:block;color:#a9a0b5;font-size:10px;font-weight:800;min-height:15px}.feedback-submit{margin-top:16px}.form-result{margin-top:10px;min-height:16px;font-size:11px;font-weight:700;color:#9e97a8}.form-result.ok{color:#64e6a4}.form-result.error{color:#ff879e}
.bug-card{margin-bottom:16px}.bug-heading{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.bug-badge{padding:7px 10px;border-radius:999px;background:rgba(255,92,131,.08);border:1px solid rgba(255,92,131,.16);color:#ff9db2;font-size:9px;font-weight:900;white-space:nowrap}.bug-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px 14px}.bug-form-grid .full{grid-column:1/-1}.privacy-note{display:flex;gap:12px;align-items:flex-start;margin:16px 0 10px;padding:15px 17px;border:1px solid rgba(117,225,176,.13);border-radius:16px;background:rgba(41,164,111,.045);color:#aaa5b1}.privacy-note>span{font-size:19px}.privacy-note strong{display:block;color:#d8f3e5;font-size:11px}.privacy-note p{margin:3px 0 0;font-size:10px;line-height:1.55}.feedback-settings-card{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start}.settings-feature-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:14px;background:rgba(124,92,255,.12);border:1px solid rgba(176,112,255,.18);font-size:22px}.settings-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.menu-quick-feedback{border-color:rgba(197,123,255,.25)!important;background:linear-gradient(145deg,rgba(124,92,255,.12),rgba(255,255,255,.018))!important}
@media(max-width:760px){.feedback-hero{grid-template-columns:1fr;min-height:unset;padding:20px 18px}.feedback-copy{padding-right:0}.feedback-character-wrap{min-height:240px;margin-top:-6px}.feedback-character{width:310px;height:260px}.feedback-character-caption{right:4px;bottom:0}.feedback-grid{grid-template-columns:1fr}.bug-form-grid{grid-template-columns:1fr}.bug-form-grid .full{grid-column:auto}.bug-heading{flex-direction:column}.feedback-card{padding:18px}.feedback-copy h1{font-size:clamp(29px,9vw,42px)}.feedback-copy p{font-size:13px}.feedback-settings-card{grid-template-columns:1fr}.settings-feature-icon{width:42px;height:42px}.settings-actions .hero-btn{width:100%;justify-content:center}}
@media(prefers-reduced-motion:reduce){.feedback-character,.feedback-character-glow{animation:none!important}}


/* ===== Login lateral Sorasaki — opcional para navegar, obrigatório para feedback/bugs ===== */
.sora-login-trigger{
  margin-left:auto;display:inline-flex;align-items:center;gap:8px;padding:9px 13px;
  border:1px solid rgba(154,120,255,.35);border-radius:999px;background:rgba(154,120,255,.08);
  color:#e9e2ff;font-weight:800;font-size:12px;cursor:pointer;transition:.2s;
}
.sora-login-trigger:hover{transform:translateY(-1px);border-color:rgba(212,108,255,.65);box-shadow:0 0 22px rgba(154,120,255,.14)}
.login-dot{width:8px;height:8px;border-radius:50%;background:#a978ff;box-shadow:0 0 12px #a978ff}
.sora-login-trigger.logged .login-dot{background:#48e6a1;box-shadow:0 0 12px #48e6a1}
.sora-login-overlay{position:fixed;inset:0;background:rgba(2,4,12,.52);backdrop-filter:blur(9px);opacity:0;pointer-events:none;transition:.28s;z-index:90}
.sora-login-overlay.is-open{opacity:1;pointer-events:auto}
.sora-login-drawer{
  position:fixed;z-index:91;top:0;right:0;width:min(430px,94vw);height:100dvh;
  padding:20px;overflow-y:auto;background:
  radial-gradient(430px 300px at 65% 10%,rgba(143,76,255,.20),transparent 70%),
  linear-gradient(180deg,rgba(11,10,28,.985),rgba(6,8,18,.99));
  border-left:1px solid rgba(190,120,255,.35);box-shadow:-24px 0 80px rgba(0,0,0,.35);
  transform:translateX(105%);transition:transform .42s cubic-bezier(.2,.8,.2,1);
}
.sora-login-drawer.is-open{transform:translateX(0)}
.login-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.login-brand{display:flex;align-items:center;gap:10px}.login-brand>span{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:rgba(124,92,255,.16);border:1px solid rgba(154,120,255,.28);font-size:18px}
.login-brand strong{display:block;font-size:15px}.login-brand small{display:block;color:#8f8aa5;font-size:9px;margin-top:2px}
.login-close{width:35px;height:35px;border:1px solid rgba(154,120,255,.2);border-radius:11px;background:rgba(255,255,255,.03);color:#bcb6cf;font-size:21px;cursor:pointer}
.login-tabs{display:grid;grid-template-columns:1fr 1fr;padding:4px;border:1px solid rgba(154,120,255,.15);border-radius:13px;background:rgba(255,255,255,.025);margin-bottom:14px}
.login-tab{border:0;border-radius:9px;padding:9px;background:transparent;color:#817b94;font-weight:800;cursor:pointer}.login-tab.active{background:linear-gradient(135deg,rgba(124,92,255,.28),rgba(212,108,255,.13));color:#eee8ff}
.auth-panel{animation:authPanelIn .25s ease}.auth-panel.hidden{display:none}
@keyframes authPanelIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.login-intro{padding:13px 14px;margin-bottom:15px;border-radius:14px;border:1px solid rgba(154,120,255,.16);background:rgba(124,92,255,.055)}
.login-intro b{display:block;font-size:13px;margin-bottom:3px}.login-intro span{display:block;color:#938da5;font-size:10.5px;line-height:1.45}
.sora-login-drawer label{display:block;color:#c8c1d8;font-size:11px;font-weight:700;margin:11px 0}.sora-login-drawer input{
  display:block;width:100%;margin-top:6px;padding:12px 13px;border:1px solid rgba(154,120,255,.18);border-radius:12px;background:rgba(4,7,16,.65);color:#f6f2ff;outline:none
}.sora-login-drawer input:focus{border-color:rgba(185,119,255,.65);box-shadow:0 0 0 3px rgba(154,120,255,.08)}
.password-wrap{position:relative}.password-wrap input{padding-right:44px}.password-toggle{position:absolute;right:6px;top:6px;height:34px;width:34px;border:0;border-radius:9px;background:transparent;color:#9d95b0;cursor:pointer}
.auth-primary,.auth-secondary{width:100%;padding:12px;border-radius:12px;font-weight:900;cursor:pointer;transition:.2s}.auth-primary{border:1px solid rgba(212,108,255,.35);background:linear-gradient(135deg,#7c4dff,#c044ef);color:white;box-shadow:0 10px 25px rgba(124,77,255,.2)}.auth-primary:hover{transform:translateY(-1px);filter:brightness(1.08)}.auth-secondary{border:1px solid rgba(154,120,255,.35);background:rgba(124,92,255,.08);color:#dfd3ff}
.auth-row{display:flex;justify-content:space-between;gap:10px;margin-top:12px}.auth-link{border:0;background:none;color:#bf91ff;font-size:10px;cursor:pointer;padding:3px}.auth-link:hover{text-decoration:underline}
.auth-result{min-height:18px;margin-top:10px;font-size:10.5px;line-height:1.4}.auth-result.ok{color:#58e6a5}.auth-result.error{color:#ff829c}
.auth-code-area{margin-top:8px;padding-top:5px;border-top:1px solid rgba(154,120,255,.12)}.auth-code-area.hidden{display:none}
.login-character-tip{position:relative;display:flex;align-items:flex-end;min-height:120px;margin:18px -2px 8px;padding:14px 120px 13px 14px;border-radius:18px;border:1px solid rgba(190,120,255,.25);overflow:hidden;background:radial-gradient(circle at 78% 80%,rgba(183,70,255,.17),transparent 45%),rgba(124,92,255,.055)}
.login-character-tip>div{position:relative;z-index:2}.login-character-tip strong{display:block;color:#e9d7ff;font-size:12px}.login-character-tip span,.login-character-tip small{display:block;color:#9d94af;font-size:9px;line-height:1.35}.login-character-tip small{color:#c18bff;font-weight:800;margin-top:3px}
.login-character-tip img{position:absolute;right:-3px;bottom:-10px;width:132px;height:132px;object-fit:contain;filter:drop-shadow(0 10px 18px rgba(174,75,255,.35));animation:loginGirlFloat 3.4s ease-in-out infinite;pointer-events:none}
@keyframes loginGirlFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-5px) rotate(1deg)}}
.login-privacy{padding:10px 11px;border-radius:12px;background:rgba(72,230,161,.035);border:1px solid rgba(72,230,161,.12);color:#8d9d99;font-size:9px;line-height:1.45}
body.login-open{overflow:hidden}

/* Feedback fica bloqueado visualmente até autenticar */
.auth-locked{position:relative}
.feedback-page .auth-required-note{margin-bottom:15px}
@media(max-width:640px){
  .topbar{position:sticky;flex-direction:row;align-items:center;padding:10px 12px}.topbar nav{display:none}
  .sora-login-trigger{padding:8px 10px}.login-trigger-label{display:none}
  .sora-login-drawer{width:min(390px,96vw);padding:15px}
  .login-character-tip{min-height:105px;padding-right:105px}.login-character-tip img{width:112px;height:112px}
}
@media(prefers-reduced-motion:reduce){.sora-login-drawer,.sora-login-overlay,.login-character-tip img,.auth-panel{transition:none!important;animation:none!important}}

.login-head-actions{display:flex;align-items:center;gap:7px}.auth-logout{border:1px solid rgba(255,107,138,.22);background:rgba(255,107,138,.06);color:#ff9aaf;border-radius:9px;padding:7px 9px;font-size:9px;font-weight:800;cursor:pointer}.auth-logout.hidden{display:none}
.auth-required-note{display:flex;align-items:flex-start;gap:11px;margin-bottom:18px;padding:13px 15px;border:1px solid rgba(154,120,255,.25);border-radius:15px;background:linear-gradient(135deg,rgba(124,92,255,.10),rgba(212,108,255,.04));box-shadow:0 10px 28px rgba(0,0,0,.12)}
.auth-required-note>span{font-size:20px}.auth-required-note strong{display:block;font-size:12px}.auth-required-note p{margin:3px 0 0;color:#938ca5;font-size:10.5px;line-height:1.45}

/* Imagens visuais: permanecem estáticas e não funcionam como links/galeria. */
img {
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
  -webkit-user-drag: none;
  -webkit-touch-callout: none;
}

/* ===== Chat de perguntas frequentes da assistente ===== */
.sora-chat-panel {
  position: relative;
  width: min(360px, calc(100vw - 40px));
  max-height: min(70vh, 560px);
  margin: 0 4px 14px auto;
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(154,120,255,.32);
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(20,16,42,.97), rgba(12,13,30,.98));
  backdrop-filter: blur(16px);
  box-shadow: 0 24px 60px rgba(0,0,0,.45), 0 0 40px rgba(124,92,255,.10);
  overflow: hidden;
  opacity: 0;
  transform: translateY(16px) scale(.96);
  transform-origin: bottom right;
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease;
}
.sora-chat-panel.is-open { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }

.sora-chat-head {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 13px 14px; border-bottom: 1px solid rgba(255,255,255,.07);
  background: linear-gradient(135deg, rgba(124,92,255,.16), rgba(212,108,255,.06));
}
.sora-chat-head-info { display: flex; align-items: center; gap: 10px; min-width: 0; }
.sora-chat-avatar {
  width: 38px; height: 38px; border-radius: 50%; overflow: hidden; flex-shrink: 0;
  border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.04);
  display: block;
}
.sora-chat-avatar img { width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.sora-chat-head-info strong { display: block; font-size: 13px; color: var(--text); }
.sora-chat-head-info small { display: block; font-size: 10.5px; color: var(--text-dim); }
.sora-chat-close {
  width: 26px; height: 26px; border: 0; border-radius: 50%; flex-shrink: 0;
  background: rgba(255,255,255,.06); color: var(--text-dim); font-size: 17px;
  line-height: 24px; cursor: pointer; transition: .15s ease;
}
.sora-chat-close:hover { background: rgba(255,255,255,.12); color: var(--text); }

.sora-chat-body {
  flex: 1; min-height: 220px; overflow-y: auto; padding: 14px;
  display: flex; flex-direction: column; gap: 9px;
  scrollbar-width: thin; scrollbar-color: rgba(154,120,255,.4) transparent;
}
.sora-chat-body::-webkit-scrollbar { width: 6px; }
.sora-chat-body::-webkit-scrollbar-thumb { background: rgba(154,120,255,.35); border-radius: 999px; }

.sora-chat-msg { max-width: 86%; animation: chatMsgIn .22s ease both; }
.sora-chat-msg p { margin: 0 0 6px; font-size: 12.5px; line-height: 1.5; }
.sora-chat-msg p:last-child { margin-bottom: 0; }
.sora-chat-msg.assistant {
  align-self: flex-start;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
  color: var(--text);
  padding: 10px 13px;
  border-radius: 15px 15px 15px 4px;
}
.sora-chat-msg.user {
  align-self: flex-end;
  background: linear-gradient(135deg,#7655e9,#a55be6);
  color: #fff;
  padding: 10px 13px;
  border-radius: 15px 15px 4px 15px;
  box-shadow: 0 8px 20px rgba(132,81,235,.25);
}

.sora-chat-typing { display: flex; gap: 4px; padding: 12px 14px !important; align-items: center; }
.sora-chat-typing span {
  width: 6px; height: 6px; border-radius: 50%; background: rgba(216,200,255,.6);
  animation: chatTyping 1s ease-in-out infinite;
}
.sora-chat-typing span:nth-child(2) { animation-delay: .15s; }
.sora-chat-typing span:nth-child(3) { animation-delay: .3s; }

.sora-chat-chips {
  display: flex; flex-direction: column; gap: 7px; margin-top: 2px;
  animation: chatMsgIn .22s ease both;
}
.sora-chat-chip {
  text-align: left; padding: 9px 12px; border-radius: 12px;
  border: 1px solid rgba(178,153,255,.28); background: rgba(154,120,255,.08);
  color: #d8c8ff; font-size: 12px; cursor: pointer;
  transition: background .15s ease, border-color .15s ease, transform .15s ease;
}
.sora-chat-chip:hover { background: rgba(154,120,255,.18); border-color: rgba(178,153,255,.5); transform: translateX(2px); }

.sora-chat-back {
  align-self: flex-start; margin-top: 2px; padding: 7px 12px; border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12); background: transparent;
  color: var(--text-dim); font-size: 11.5px; cursor: pointer;
  transition: color .15s ease, border-color .15s ease;
  animation: chatMsgIn .22s ease both;
}
.sora-chat-back:hover { color: var(--text); border-color: rgba(255,255,255,.28); }

.assistant-widget.chat-open .assistant-character,
.assistant-widget.chat-open .assistant-bubble { display: none; }

@keyframes chatMsgIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes chatTyping { 0%,60%,100% { opacity: .35; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }

@media (max-width: 520px) {
  .sora-chat-panel { width: calc(100vw - 24px); margin-right: 0; max-height: 66vh; }
}
@media (prefers-reduced-motion: reduce) {
  .sora-chat-panel, .sora-chat-msg, .sora-chat-chips, .sora-chat-back { transition: none !important; animation: none !important; }
}

.groups-actions{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:22px 0}.groups-actions>div{display:grid;gap:5px}.groups-actions strong{font-size:17px}.groups-actions span{color:var(--muted);font-size:13px}.groups-actions .auth-primary{margin:0;white-space:nowrap}.groups-recommended{margin:28px 0}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:0 0 16px}.section-heading h2{margin:5px 0 0}.section-heading>span{color:var(--muted);font-size:13px}.my-groups{margin:26px 0}.my-group-row{display:flex;justify-content:space-between;gap:18px;padding:15px 0;border-top:1px solid rgba(255,255,255,.07)}.my-group-row>div{display:grid;gap:4px}.my-group-row span,.my-group-row small{color:var(--muted);font-size:12px}.my-group-row b{font-size:13px}.group-modal[hidden]{display:none}.group-modal{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:20px}.group-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(5px)}.group-modal-card{position:relative;width:min(560px,100%);max-height:min(90vh,760px);overflow:auto;padding:28px;border:1px solid rgba(255,255,255,.1);border-radius:20px;background:#101014;box-shadow:0 25px 80px rgba(0,0,0,.45);animation:groupModalIn .22s ease}.group-modal-card h2{margin:7px 0}.group-modal-card>p{margin:0 0 20px;color:var(--muted);font-size:13px}.group-modal-close{position:absolute;right:14px;top:12px;border:0;background:transparent;color:#aaa;font-size:26px;cursor:pointer}.group-modal-card form{display:grid;gap:13px}.group-modal-card label{display:grid;gap:7px;font-size:13px;font-weight:600}.group-modal-card input,.group-modal-card textarea,.group-modal-card select{width:100%;box-sizing:border-box;padding:12px 13px;border:1px solid rgba(255,255,255,.1);border-radius:11px;background:#0a0a0d;color:inherit;outline:none}.group-modal-card textarea{min-height:105px;resize:vertical}.group-modal-card input:focus,.group-modal-card textarea:focus,.group-modal-card select:focus{border-color:rgba(210,180,90,.65);box-shadow:0 0 0 3px rgba(210,180,90,.08)}.field-optional{display:inline!important;color:var(--muted);font-weight:400;font-size:11px}.group-form-note{padding:11px 12px;border-radius:10px;background:rgba(255,255,255,.035);color:var(--muted);font-size:12px}.group-modal-open{overflow:hidden}@keyframes groupModalIn{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}
@media(max-width:720px){.groups-actions{align-items:stretch;flex-direction:column}.groups-actions .auth-primary{width:100%}.section-heading{align-items:start;flex-direction:column}.my-group-row{flex-direction:column}.group-modal-card{padding:22px}}


/* ===== Catálogo, pagamentos e administração ===== */
.plans-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.plan-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:20px;display:flex;flex-direction:column;gap:10px;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.plan-card:hover{transform:translateY(-3px);border-color:rgba(124,92,255,.45);box-shadow:0 14px 35px rgba(0,0,0,.18)}
.plan-name{font-size:12px;text-transform:uppercase;letter-spacing:.8px;color:var(--accent);font-weight:700}
.plan-card h3{font-size:30px;margin:0}
.plan-card p{color:var(--text-dim);font-size:13px;line-height:1.55;min-height:42px}
.plan-duration{font-size:12px;color:var(--text-dim);margin-bottom:6px}
.plan-card .auth-primary{width:100%}
.group-card-secondary{display:flex;gap:8px;margin-top:8px}
.group-card-secondary button{flex:1;background:transparent;color:var(--text-dim);border:1px solid var(--border);border-radius:10px;padding:8px;font:inherit;font-size:12px;cursor:pointer;transition:.15s}
.group-card-secondary button:hover{color:var(--text);border-color:rgba(124,92,255,.5);background:var(--bg-card-hover)}
.group-promo{display:inline-flex;padding:3px 7px;border-radius:999px;background:rgba(124,92,255,.13);border:1px solid rgba(124,92,255,.3);color:#b7a8ff;font-size:11px}
.rating-picker{display:flex;gap:7px;margin:8px 0 14px}
.rating-picker button{border:0;background:transparent;color:#4d5567;font-size:31px;cursor:pointer;padding:2px;transition:.15s}
.rating-picker button.selected,.rating-picker button:hover{color:#eab308;transform:translateY(-1px)}
.select-group-list{display:grid;gap:8px;margin-top:14px}
.select-group-option{display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;padding:13px;border:1px solid var(--border);background:var(--bg-card);border-radius:12px;color:var(--text);cursor:pointer}
.select-group-option:hover{border-color:rgba(124,92,255,.5);background:var(--bg-card-hover)}
.select-group-option span{color:var(--text-dim);font-size:12px}
.admin-tabs{display:flex;gap:8px;overflow:auto;position:sticky;top:78px;z-index:8}
.admin-tab{border:1px solid var(--border);background:transparent;color:var(--text-dim);padding:9px 14px;border-radius:999px;white-space:nowrap;cursor:pointer;font:inherit;font-size:13px}
.admin-tab.active,.admin-tab:hover{color:var(--text);background:var(--bg-card-hover);border-color:rgba(124,92,255,.45)}
.admin-view{display:none}.admin-view.active{display:block}
.admin-group-card{overflow:visible}

.admin-help{margin:7px 0 0;color:var(--text-dim);font-size:13px;line-height:1.5;max-width:720px}.admin-new-plan{margin-top:12px;display:grid;gap:14px}.admin-new-plan>div:first-child strong,.admin-new-plan>div:first-child span{display:block}.admin-new-plan>div:first-child span{margin-top:4px;color:var(--text-dim);font-size:12.5px}.admin-plan-form-grid{display:grid;grid-template-columns:1.2fr .7fr .7fr 2fr;gap:10px}.admin-plan-form-grid label,.plan-admin-grid label{display:flex;flex-direction:column;gap:4px;color:var(--text-dim);font-size:12px;font-weight:600}.admin-plan-form-grid .admin-inline-input,.plan-admin-grid .admin-inline-input{margin-top:0}.admin-plan-row{align-items:stretch}.admin-plan-content{flex:1;min-width:0}.admin-plan-heading{display:flex;align-items:center;gap:9px;margin-bottom:8px}.admin-plan-heading strong{font-size:16px}.admin-plan-status{border:1px solid var(--border);border-radius:999px;padding:4px 8px;font-size:11px!important}.admin-plan-status.is-active{color:var(--text)}.admin-plan-status.is-off{color:var(--text-dim)}.admin-price-input{font-weight:700}.admin-plan-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px}.admin-plan-footer .check-row{margin:0}.admin-plan-footer button{white-space:nowrap}
.admin-inline-input{width:100%;background:rgba(0,0,0,.12);border:1px solid var(--border);color:var(--text);border-radius:10px;padding:10px;font:inherit;margin-top:8px}
textarea.admin-inline-input{min-height:90px;resize:vertical}
.admin-edit-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.admin-edit-grid select,.admin-edit-grid input{width:100%;background:rgba(0,0,0,.12);border:1px solid var(--border);color:var(--text);border-radius:10px;padding:10px;font:inherit}
.check-row{display:flex;align-items:center;gap:8px;padding:9px 10px;border:1px solid var(--border);border-radius:10px;font-size:13px;color:var(--text-dim)}
.admin-list{display:grid;gap:10px}
.admin-list-row{display:flex;justify-content:space-between;gap:18px;align-items:center;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:16px}
.admin-list-row>div:first-child{min-width:0}
.admin-list-row strong{display:block;margin-bottom:5px}
.admin-list-row span,.admin-list-row p{color:var(--text-dim);font-size:12.5px}
.admin-list-row p{margin:8px 0 0;line-height:1.5}
.admin-row-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}
.admin-row-actions select{background:var(--bg-card-hover);color:var(--text);border:1px solid var(--border);border-radius:9px;padding:8px}
.admin-section-head{display:flex;align-items:center;justify-content:space-between}
.admin-section-head h2{margin:4px 0 0}
.plan-admin-grid{display:grid;grid-template-columns:1.2fr .6fr .6fr 2fr;gap:8px;flex:1}
.order-status{white-space:nowrap;font-weight:600}
@media(max-width:820px){.plans-grid{grid-template-columns:1fr}.admin-list-row{flex-direction:column;align-items:stretch}.admin-row-actions{justify-content:flex-start;flex-wrap:wrap}.plan-admin-grid,.admin-plan-form-grid{grid-template-columns:1fr 1fr}.admin-plan-footer{align-items:stretch;flex-direction:column}}
@media(max-width:560px){.admin-tabs{top:68px}.admin-edit-grid{grid-template-columns:1fr}.admin-section-head{align-items:flex-start;gap:12px;flex-direction:column}.group-card-secondary{flex-direction:column}.plan-admin-grid,.admin-plan-form-grid{grid-template-columns:1fr}.admin-plan-footer .auth-primary{width:100%}}

/* Verificação de e-mail — SORASAKI SYSTEM */
.code-title{display:flex;align-items:center;gap:10px;padding:11px 12px;margin:0 0 8px;border:1px solid rgba(190,120,255,.16);border-radius:12px;background:linear-gradient(135deg,rgba(124,92,255,.10),rgba(212,108,255,.045))}
.code-title>span{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:rgba(190,120,255,.14);color:#e8caff}
.code-title b{display:block;font-size:11px;color:#eee7ff}.code-title small{display:block;margin-top:2px;color:#8f88a2;font-size:9px}
.auth-code-area .auth-primary{margin-top:3px}.auth-resend{display:block;width:100%;margin-top:6px;text-align:center}
#signupCode,#resetCode{letter-spacing:.34em;text-align:center;font-weight:900;font-size:18px}