/* Temas opcionais e mascote vetorial. O tema claro original continua disponível. */
.lumi-face {
  display: block;
  width: 52px;
  height: 58px;
  border-radius: 0;
  background: none !important;
  box-shadow: none !important;
  animation: none !important;
  rotate: 0deg !important;
  scale: 1 !important;
}
.lumi-character {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}
.lumi-character-body {
  transform-box: fill-box;
  transform-origin: 50% 70%;
  animation: lumi-vector-idle 6s ease-in-out infinite;
}
.lumi-eye {
  transform-box: fill-box;
  transform-origin: center;
  animation: lumi-vector-blink 6.8s infinite;
}
.lumi-gaze {
  translate: var(--eye-x, 0px) var(--eye-y, 0px);
  transition: translate 0.14s ease-out;
}
.lumi-face.motion-playful .lumi-character-body {
  animation: lumi-vector-curious 7s ease-in-out infinite;
}
.lumi-face.motion-gentle .lumi-character-body {
  animation: lumi-vector-idle 6s ease-in-out infinite;
}
.lumi-face.motion-quiet .lumi-character-body,
.lumi-face.motion-quiet .lumi-eye {
  animation: none;
}
.lumi-launch:hover .lumi-character-body {
  filter: brightness(1.04);
}
.lumi-launch:active .lumi-character-body {
  scale: 0.95;
}
.lumi-launch[aria-expanded="true"] .lumi-face {
  width: 76px;
  height: 85px;
  border-radius: 0;
  transform: none;
}
.lumi-big-face .lumi-face {
  width: 136px;
  height: 152px;
  gap: 0;
  border-radius: 0;
}
.lumi-preview {
  min-height: 185px;
  padding: 15px;
}
.theme-options {
  flex-wrap: wrap;
}
.theme-choice {
  min-width: 115px;
}
.theme-preview.twilight {
  background:
    radial-gradient(circle at 75% 65%, #a045b3, transparent 45%),
    linear-gradient(130deg, #041239, #2a38aa 65%, #10accb);
}
.theme-preview.glass {
  background: linear-gradient(135deg, #d7eaff, #e7d8ff 55%, #def5ef);
  position: relative;
}
.theme-preview.glass:after {
  content: "";
  position: absolute;
  inset: 12px;
  border-radius: 8px;
  background: #ffffff88;
  border: 1px solid #fff;
}
body.entardecer {
  --bg: #080e2a;
  --surface: #131e43;
  --ink: #f4f4ff;
  --muted: #c0caed;
  --line: #657bbb45;
  --soft: #293365;
  --accent: #9cabff;
  --blue: #163c71;
  --blueink: #bce9ff;
  --shadow: 0 12px 40px #0003;
  background:
    radial-gradient(ellipse at 85% 8%, #4d2b8755, transparent 45%),
    radial-gradient(ellipse at 15% 60%, #096c9833, transparent 50%),
    linear-gradient(145deg, #080e2a, #101438 60%, #091b34);
  background-attachment: fixed;
  color: var(--ink);
}
body.entardecer .sidebar,
body.entardecer .card,
body.entardecer .online-chat-main {
  background: linear-gradient(140deg, #152852d9, #171b45e8);
  border: 1px solid #8599ed44;
  box-shadow:
    0 12px 38px #02051b30,
    inset 0 1px 0 #d2ddff0d;
  backdrop-filter: blur(18px);
}
body.entardecer .sidebar {
  background: linear-gradient(175deg, #111b45ed, #091b37ed);
  border-color: #8f83ff66;
}
body.entardecer .nav-item.active {
  background: linear-gradient(115deg, #2248be, #5934a5);
  color: #fff;
  box-shadow: 0 0 18px #4e67ec44;
  border: 1px solid #7e8efc77;
}
body.entardecer .nav-item:hover {
  color: #fff;
  background: #40518a66;
}
body.entardecer .btn.primary,
body.entardecer .home-add {
  background: linear-gradient(115deg, #365ee4, #7650ca);
  color: #fff;
  border-color: #93a2ff66;
  box-shadow: 0 6px 22px #263fb52e;
}
body.entardecer .home-stat:nth-child(1) {
  background: linear-gradient(125deg, #183e91de, #132458);
}
body.entardecer .home-stat:nth-child(2) {
  background: linear-gradient(125deg, #61348dde, #251e50);
}
body.entardecer .home-stat:nth-child(3) {
  background: linear-gradient(125deg, #125a83de, #122c4c);
}
body.entardecer .home-stat strong {
  color: #d6efff;
  text-shadow: 0 0 20px #7abaff33;
}
body.entardecer .home-stat-icon,
body.entardecer .bubble-icon {
  background: #697bcc2e;
  color: #b5ddff;
}
body.entardecer .home-care-art {
  opacity: 0.18;
  filter: saturate(1.2);
  border-radius: 32px;
}
body.entardecer .home-greeting {
  background:
    radial-gradient(ellipse at 80% 0%, #5c38ac66, transparent 65%),
    linear-gradient(120deg, #132550e8, #111c3ee8);
}
body.entardecer .home-date-inner,
body.entardecer .home-event-icon,
body.entardecer .home-done {
  background: #5479bc22;
  color: #c3ddff;
}
body.entardecer .home-text-link {
  color: #b4d8ff;
}
body.entardecer .home-table th {
  background: #0a1739;
  color: #c9d5f4;
}
body.entardecer .home-table td {
  border-color: #7188c62e;
}
body.entardecer input,
body.entardecer textarea,
body.entardecer .select-trigger {
  background: #101b3d;
  color: #f1f4ff;
  border-color: #7286bc60;
}
body.entardecer input::placeholder,
body.entardecer textarea::placeholder {
  color: #a2afd0;
}
body.entardecer .modal,
body.entardecer .unified-options,
body.entardecer .smart-options,
body.entardecer .lumi-widget:has(.lumi-panel:not([hidden])),
body.entardecer .lumi-answer,
body.entardecer .lumi-bar {
  background: #111b3ef5;
  border: 1px solid #8c91d566;
  box-shadow: 0 20px 65px #0005;
  backdrop-filter: blur(20px);
}
body.entardecer .unified-options > button[aria-selected="true"],
body.entardecer .smart-options [aria-selected="true"] {
  background: #4b4684;
  color: #fff;
}
body.entardecer .badge.blue,
body.entardecer .home-status.blue {
  background: #254774;
  color: #d4eaff;
}
body.entardecer .badge.green,
body.entardecer .home-status.green {
  background: #224b4c;
  color: #c9f5e9;
}
body.entardecer .badge.amber {
  background: #55432c;
  color: #ffdfa1;
}
body.entardecer .notice {
  background: #253767;
  color: #dbe6ff;
}
body.entardecer .lumi-shortcuts button,
body.entardecer .reason-suggestions button {
  background: #2a3967;
  color: #edf0ff;
}
body.entardecer .referral-type .type-segments {
  background: #17264d;
}
body.entardecer .referral-type input:checked + span {
  background: #3d4e84;
  color: #fff;
}
body.entardecer .home-task-copy strong,
body.entardecer .home-event-empty strong {
  color: var(--ink);
}
body.entardecer .home-time {
  color: #e4e9ff;
}
body.entardecer .home-task-empty small,
body.entardecer .home-event-empty p {
  color: var(--muted);
}
body.vidro-suave {
  --bg: #e5eaf6;
  --surface: #ffffffd9;
  --line: #ffffffa6;
  --ink: #242a4c;
  --muted: #5b6488;
  background:
    radial-gradient(ellipse at 0% 0%, #bcdbf5, transparent 55%),
    radial-gradient(ellipse at 100% 30%, #d9c6f2, transparent 60%),
    radial-gradient(ellipse at 70% 100%, #c5e8e3, transparent 55%), #e5eaf6;
  background-attachment: fixed;
}
body.vidro-suave .card,
body.vidro-suave .sidebar {
  background: #ffffffaf;
  border: 1px solid #ffffffe0;
  backdrop-filter: blur(20px);
  box-shadow: 0 14px 40px #69769a12;
}
body.vidro-suave .modal {
  background: #f9fafff5;
  backdrop-filter: blur(24px);
}
body.vidro-suave .home-stat:nth-child(1) {
  background: #e5f1ffbd;
}
body.vidro-suave .home-stat:nth-child(2) {
  background: #f0e4ffbd;
}
body.vidro-suave .home-stat:nth-child(3) {
  background: #e0f3f2bd;
}
.card,
.btn,
.home-stat,
.nav-item {
  transition:
    background 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease,
    transform 0.22s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.home-stat:hover {
  transform: translateY(-2px);
  box-shadow: 0 13px 30px #7c85bf21;
}
.btn:hover {
  transform: translateY(-1px);
}
.btn:active {
  transform: scale(0.98);
}
.lumi-smile {
  transition: opacity 0.3s;
}
.lumi-launch:hover .lumi-smile {
  opacity: 1;
  stroke-width: 2.5;
}
@keyframes lumi-vector-blink {
  0%,
  44%,
  48%,
  100% {
    transform: scaleY(1);
  }
  46% {
    transform: scaleY(0.12);
  }
}
@keyframes lumi-vector-idle {
  0%,
  100% {
    transform: rotate(-1deg) scale(1);
  }
  50% {
    transform: rotate(1deg) scale(1.025);
  }
}
@keyframes lumi-vector-curious {
  0%,
  25%,
  100% {
    transform: rotate(0deg) scale(1);
  }
  32% {
    transform: rotate(-6deg) scale(1.035);
  }
  40% {
    transform: rotate(4deg) scale(1.035);
  }
  48% {
    transform: rotate(0deg) scale(1);
  }
  75% {
    transform: rotate(2deg) scale(1.02);
  }
}
@media (max-width: 700px) {
  .lumi-face {
    width: 48px;
    height: 54px;
  }
  .lumi-widget:has(.lumi-panel:not([hidden])) .lumi-face {
    width: 58px;
    height: 65px;
  }
  .lumi-big-face .lumi-face {
    width: 125px;
    height: 140px;
  }
  .theme-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .theme-choice {
    min-width: 0;
  }
  .theme-preview {
    width: 100%;
  }
  body.entardecer .sidebar,
  body.entardecer .modal {
    backdrop-filter: none;
    background: #111b3f;
  }
  body.entardecer .home-care-art {
    opacity: 0.15;
  }
}
body.reduce .lumi-character-body,
body.reduce .lumi-eye,
body.reduce-motion .lumi-character-body,
body.reduce-motion .lumi-eye {
  animation: none !important;
}
body.reduce .btn,
body.reduce .card,
body.reduce .lumi-gaze {
  transition: none !important;
}
body.contrast.entardecer {
  --ink: #fff;
  --muted: #e4eaff;
  --surface: #0b1533;
  --line: #a0b1ef;
}
body.contrast.entardecer .card {
  background: #0b1533;
  backdrop-filter: none;
}
@media (prefers-reduced-motion: reduce) {
  .lumi-character-body,
  .lumi-eye {
    animation: none !important;
  }
  .btn,
  .card,
  .home-stat,
  .lumi-gaze {
    transition: none !important;
    transform: none !important;
  }
}
body.entardecer [data-page="home"] .home-table th {
  background: #0b1738;
  color: #d4dff8;
}
body.entardecer [data-page="home"] .home-care-art {
  opacity: 0.22;
  border-radius: 35px;
}
body.entardecer .nav-item.active .icon {
  color: #dfe8ff;
}
body.entardecer [data-page="home"] .home-task-empty strong {
  color: #f2f4ff;
}

/* Refinamento de contraste e presença da Lumi. */
body.entardecer .card {background: #152143; border-color: #34436a; box-shadow: 0 8px 28px #050b201a;}
body.entardecer [data-page="home"] .home-stat {background: #18284d;}
body.entardecer [data-page="home"] .home-care-art {opacity: .55; mix-blend-mode: luminosity;}
.home-pending-list .home-task {width:100%; text-align:left; padding:18px 4px; border-bottom:1px solid #93a3c326;}
.home-pending-list {margin:8px 0 20px;}
.lumi-widget .lumi-face {width:80px; height:90px; transition:transform .3s ease;}
.lumi-widget .lumi-face:hover {transform:translateY(-5px) rotate(5deg) scale(1.08);}
.lumi-widget.is-open .lumi-face {width:94px; height:105px;}
.lumi-big-face .lumi-face {width:210px; height:235px;}
.topbar {min-height:95px;}
.avatar {overflow:hidden; flex-shrink:0;}
#profile-form > .row {flex-wrap:wrap; gap:12px;}
@media(max-width:700px){.lumi-widget .lumi-face{width:66px;height:74px}.lumi-big-face .lumi-face{width:180px;height:202px}.topbar{min-height:95px}}
@media(prefers-reduced-motion:reduce){.lumi-widget .lumi-face:hover{transform:none}}

/* Home compacta sem ocultar conteúdo em telas pequenas ou com zoom. */
@media(min-width:1100px) and (min-height:700px){
body:has([data-page="home"]) .shell{padding-top:14px;padding-bottom:14px}
body:has([data-page="home"]) .topbar{min-height:80px;margin-bottom:12px}
[data-page="home"] .home-greeting,[data-page="home"] .home-date{min-height:135px;max-height:155px}
[data-page="home"] .home-stat{padding:16px 22px;min-height:92px}
[data-page="home"] .home-section-heading{margin:14px 0}
[data-page="home"] .home-content-grid{gap:16px}
[data-page="home"] .home-agenda{min-height:0;padding:22px}
[data-page="home"] .home-pending-list .home-task{padding:12px 4px}
[data-page="home"] .home-tasks,[data-page="home"] .home-event{padding:20px}
[data-page="home"] .home-empty-state{padding:22px;min-height:150px}
}
.online-chat-layout{gap:22px;grid-template-columns:310px minmax(0,1fr)}
.online-conversations{background:#f5f4fc}
.online-conversations .list-item{border:0;border-radius:18px;margin:8px 0;padding:16px;box-shadow:0 4px 16px #48508008}
.online-conversations .list-item.active{background:#fff;box-shadow:0 8px 22px #6560a51a}
.chat-search{display:flex;align-items:center;gap:8px;padding:10px 14px;background:#fff;border-radius:16px;margin:16px 0}
.chat-search input{border:0!important;background:transparent!important;min-width:0;width:100%}
.online-chat-main .message .text{border-radius:18px;background:#eff1fb;padding:14px 18px}
.online-chat-main .message.mine .text{background:linear-gradient(125deg,#7653dc,#6452cc);color:white}
.online-chat-main .composer{gap:10px;padding:16px;background:transparent}
.chat-file{display:flex;gap:12px;align-items:center;color:inherit;text-align:left;background:transparent;border:0;padding:4px;cursor:pointer}
.chat-file small{display:block;color:inherit;opacity:.8;margin-top:6px}
.chat-attach{cursor:pointer;flex-shrink:0}
body.dark .online-conversations .list-item.active,body.dark .chat-search{background:#202e50}
body.dark .online-chat-main .message:not(.mine) .text{background:#223253}
@media(max-width:800px){.online-chat-layout{grid-template-columns:1fr}.online-chat-main .composer{padding:10px}.online-chat-main .composer input[name="message"]{min-width:0}}

/* Paletas compartilhadas: superfícies legíveis e fundo decorativo discreto. */
body[data-theme="starry"]{background-color:#0c1531;background-image:radial-gradient(circle at 16% 18%,#e3e8ff9c 0 1px,transparent 1.8px),radial-gradient(circle at 76% 48%,#a8c7ff8a 0 1px,transparent 1.8px),radial-gradient(ellipse at 85% 5%,#40317266,transparent 60%);background-size:151px 157px,223px 211px,100% 100%;background-attachment:fixed}
body[data-theme="aurora"]{background:radial-gradient(ellipse at 15% 0,#16665988,transparent 58%),radial-gradient(ellipse at 90% 15%,#70449888,transparent 62%),#0b1c31;background-attachment:fixed}
body[data-theme="ocean"]{background:radial-gradient(ellipse at 90% 0,#167b9277,transparent 60%),linear-gradient(145deg,#0a2036,#11334b);background-attachment:fixed}
body[data-theme="aurora"] .card{background:#142d40eF;border-color:#4d778366}
body[data-theme="ocean"] .card{background:#123247ed;border-color:#5a9caf55}
.theme-preview[data-theme-preview="starry"]{background:radial-gradient(circle at 20% 25%,white 0 1px,transparent 2px),radial-gradient(circle at 65% 40%,white 0 1px,transparent 2px),linear-gradient(135deg,#132145,#514083)}
.theme-preview[data-theme-preview="aurora"]{background:linear-gradient(125deg,#154c59,#468f85,#765b9c)}
.theme-preview[data-theme-preview="ocean"]{background:linear-gradient(130deg,#102f4b,#26829c,#5aaeb5)}
[data-page="home"] .home-care-art img{width:100%;height:100%;object-fit:contain}
[data-page="home"] .home-care-night{display:none}
body.dark [data-page="home"] .home-care-day{display:none}
body.dark [data-page="home"] .home-care-night{display:block}
body.dark [data-page="home"] .home-care-art{opacity:1;mix-blend-mode:normal;border-radius:0;background:transparent}
.btn,.nav-item,.theme-choice,.tab{transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s,background-color .22s}
.btn:active,.nav-item:active,.theme-choice:active,.tab:active{transform:scale(.95)}
.btn:hover,.theme-choice:hover{box-shadow:0 6px 20px #7767c322}
.nav-item.active{animation:lumi-nav-select .35s ease-out}
main>[data-page],.settings-content{animation:lumi-view-enter .32s ease-out both}
@keyframes lumi-nav-select{0%{transform:scale(.85)}65%{transform:scale(1.08)}100%{transform:scale(1)}}
@keyframes lumi-view-enter{from{opacity:.35;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
body.reduce *,body.reduce-motion *{animation:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){.btn,.nav-item,.theme-choice,.tab,main>[data-page],.settings-content{animation:none!important;transition:none!important;transform:none!important}}

[data-page="home"] .home-care-art>svg{width:100%;height:100%}

/* Vidro espelhado: opção clara inspirada em superfícies acetinadas. */
body[data-theme="mirror"]{
 --bg:#dce6ef;--surface:#f5f9fdd9;--ink:#24394e;--muted:#536a7f;--line:#ffffffa6;
 background:radial-gradient(ellipse at 15% 20%,#fff9,transparent 53%),radial-gradient(ellipse at 85% 78%,#98b4c58a,transparent 47%),linear-gradient(145deg,#eaf0f6,#d1dfe9 58%,#c2d3df);
 background-attachment:fixed;
}
body[data-theme="mirror"] .card,body[data-theme="mirror"] .sidebar{
 background:linear-gradient(135deg,#ffffffad,#edf5fc80);
 border:1px solid #ffffffe0;
 backdrop-filter:blur(20px) saturate(1.1);
 box-shadow:inset 0 1px 0 #fff,0 9px 26px #39566c16,0 2px 5px #39566c0a;
}
body[data-theme="mirror"] [data-page="home"] .home-stat{background:linear-gradient(130deg,#f8fcffd9,#dae8f3a6)}
body[data-theme="mirror"] [data-page="home"] .home-date-inner{background:#f6faff80}
body[data-theme="mirror"] .nav-item.active{background:linear-gradient(145deg,#364e6c,#24384f);color:#fff;box-shadow:0 5px 14px #24384f35}
body[data-theme="mirror"] .nav-item.active .icon{color:#fff}
body[data-theme="mirror"] .btn.primary{background:linear-gradient(135deg,#496c91,#345571);color:white;border-color:#65829a}
body[data-theme="mirror"] .modal{background:#f4f8fcf5;backdrop-filter:blur(24px);border:1px solid white}
body[data-theme="mirror"] input,body[data-theme="mirror"] textarea{background:#f9fcffe6;color:#24394e;border-color:#a9bdce}
body[data-theme="mirror"] :focus-visible{outline:3px solid #3d729e;outline-offset:3px}
.theme-preview[data-theme-preview="mirror"]{background:linear-gradient(135deg,#fff,#d8e7f2 45%,#a6bccd);box-shadow:inset 0 0 0 1px #fff,0 5px 14px #3b536b22}
body[data-theme="mirror"].contrast .card,body[data-theme="mirror"].contrast .sidebar{background:#f7fbff;backdrop-filter:none;border-color:#5d7387}
@supports not (backdrop-filter:blur(1px)){body[data-theme="mirror"] .card,body[data-theme="mirror"] .sidebar{background:#edf4fa}}

.chat-preview-frame{display:block;width:100%;height:clamp(460px,calc(100dvh - 270px),720px);border:0;border-radius:22px;background:#f4f3fc}
@media(max-width:700px){.chat-preview-frame{height:calc(100dvh - 290px);min-height:440px}}
/* A prévia herda a tipografia, o tema e os componentes do Lumi. */
.chat-test-notice{justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:16px}
.chat-native-preview{height:clamp(440px,calc(100dvh - 280px),680px)}
.chat-native-preview .test-chat-rooms{overflow:auto;flex:1;min-height:0}
.chat-native-preview .list-item[hidden]{display:none!important}
.chat-native-preview .list-item>div{min-width:0}
.chat-native-preview .list-item small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:195px}
.chat-native-preview .online-conversations,.chat-native-preview .online-chat-main{background:var(--surface);color:var(--ink)}
.chat-native-preview .chat-search,.chat-native-preview .list-item.active{background:var(--soft);color:var(--ink)}
.chat-native-preview .test-chat-title{flex:1;min-width:0;text-align:left;color:inherit;border:0;background:transparent;padding:0}
.chat-native-preview .message .meta{display:flex;gap:14px;font-size:11px;color:var(--muted);margin-bottom:6px}
.chat-native-preview .message .text{font-size:inherit;line-height:1.6}
.test-chat-day{font-size:11px;color:var(--muted);text-align:center;margin:0 auto 20px}
.test-chat-image{display:block;max-width:230px;max-height:170px;border-radius:12px;margin-bottom:10px}
.chat-native-preview button,.chat-native-preview input{font-family:inherit}
body.dark .chat-native-preview .chat-search,body.dark .chat-native-preview .list-item.active{background:#283958;color:var(--ink)}
@media(max-width:700px){.chat-native-preview{height:calc(100dvh - 300px);min-height:440px}.chat-native-preview .chat-header .avatar{display:none}}

.topbar-brand{display:none!important}
body:has([data-page="chat"]) .topbar{min-height:68px;margin-bottom:10px}
body:has([data-page="chat"]) .page-head{margin-bottom:12px}
[data-page="chat"] .online-chat-layout,[data-page="chat"] .chat-native-preview{height:calc(100dvh - 240px);min-height:450px;max-height:none}
.chat-shared-details{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;max-height:280px;flex-shrink:0;background:var(--surface);border-bottom:1px solid var(--line)}
.chat-shared-details h3{font-size:13px;margin-bottom:12px}
.chat-shared-details .row{margin:8px 0}.chat-shared-details .avatar{width:28px;height:28px;font-size:16px}
.chat-shared-details a{display:block;overflow-wrap:anywhere;color:var(--blueink);margin:8px 0}
.chat-shared-details small{display:block;margin-top:12px}
@media(max-width:800px){.chat-shared-details{grid-template-columns:1fr;max-height:210px}[data-page="chat"] .online-chat-layout{height:calc(100dvh - 260px);min-height:420px}}

/* Chat ocupa a área de trabalho; informações ficam em uma lateral recolhível. */
body:has([data-page="chat"]) .shell{height:100dvh;min-height:0;padding:12px;gap:16px;overflow:hidden}
body:has([data-page="chat"]) .sidebar{height:calc(100dvh - 24px);top:12px}
body:has([data-page="chat"]) .workspace{height:100%;min-height:0;display:flex;flex-direction:column;padding:0}
body:has([data-page="chat"]) .topbar{height:80px;min-height:80px;flex-shrink:0;margin:0 0 8px}
body:has([data-page="chat"]) #main{flex:1;min-height:0;display:flex;flex-direction:column;padding:0;overflow:hidden}
body:has([data-page="chat"]) #page{flex:1;min-height:0;height:100%;animation:none}
[data-page="chat"] .chat-site-preview{height:100%;min-height:0}
[data-page="chat"] .online-chat-layout,[data-page="chat"] .chat-native-preview{height:100%;min-height:0;max-height:none;gap:0;grid-template-columns:290px minmax(0,1fr);border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--surface)}
[data-page="chat"] .online-conversations{border:0;border-right:1px solid var(--line);border-radius:0;box-shadow:none;padding:18px 14px}
[data-page="chat"] .online-chat-main{position:relative;height:100%;min-height:0;border:0;border-radius:0;box-shadow:none;background:var(--surface);transition:padding .2s ease}
[data-page="chat"] .online-chat-main .chat-header{min-height:72px;padding:14px 22px}
[data-page="chat"] .online-chat-main .messages{padding:24px 30px;overscroll-behavior:contain;background-image:radial-gradient(var(--line) .8px,transparent .8px);background-size:18px 18px}
[data-page="chat"] .online-chat-main .composer{padding:14px 22px;background:var(--surface)}
[data-page="chat"] .online-chat-main:has(.chat-shared-details){padding-right:290px}
[data-page="chat"] .chat-shared-details{position:absolute;inset:0 0 0 auto;width:290px;height:100%;max-height:none;display:flex;flex-direction:column;gap:0;padding:0 20px 24px;overflow-y:auto;background:var(--surface);border:0;border-left:1px solid var(--line);z-index:3;border-radius:0}
.chat-info-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:72px;border-bottom:1px solid var(--line);flex-shrink:0}
.chat-info-heading h3{margin:0;font-size:14px}
.chat-shared-details>section{padding:22px 0;border-bottom:1px solid var(--line)}
.chat-shared-details .chat-file{max-width:100%;overflow-wrap:anywhere}
.chat-test-badge{display:inline-block;color:var(--muted);font-size:11px}
[data-page="chat"] .online-conversations .foot{gap:8px;padding-top:14px;border-top:1px solid var(--line)}
[data-page="chat"] .online-conversations .foot>small:not(.chat-test-badge){font-size:10px;line-height:1.5}
@media(min-width:701px) and (max-width:1200px){[data-page="chat"] .online-chat-layout{grid-template-columns:235px minmax(0,1fr)}[data-page="chat"] .online-chat-main:has(.chat-shared-details){padding-right:0}[data-page="chat"] .chat-shared-details{box-shadow:-12px 0 30px #17243d20;width:min(320px,100%)}}
@media(max-width:700px){
 body:has([data-page="chat"]) .shell{padding:8px;gap:0}
 body:has([data-page="chat"]) .topbar{height:86px;min-height:86px;margin-bottom:6px}
 [data-page="chat"] .online-chat-layout{display:block;border-radius:16px}
 [data-page="chat"] .online-chat-main:has(.chat-shared-details){padding-right:0}
 [data-page="chat"] .chat-shared-details{width:100%;padding:0 20px 20px}
 [data-page="chat"] .online-chat-main .chat-header{padding:10px;min-height:64px}
 [data-page="chat"] .online-chat-main .messages{padding:16px}
 [data-page="chat"] .online-chat-main .composer{padding:10px}
}
@media(prefers-reduced-motion:reduce){[data-page="chat"] .online-chat-main{transition:none}}
/* Chat sóbrio: iniciais e fotos, linhas leves e rolagem sem setas. */
body:has([data-page="chat"]) .topbar{height:64px;min-height:64px;margin-bottom:4px}
body:has([data-page="chat"]) .shell{padding:8px;gap:12px}
body:has([data-page="chat"]) .sidebar{height:calc(100dvh - 16px);top:8px}
.chat-avatar{width:40px;height:40px;flex:0 0 40px;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;border-radius:13px;background:var(--chat-soft,#e4edf9);color:var(--chat-accent,#416fa7);font:600 13px/1 Inter,system-ui,sans-serif;letter-spacing:.4px}
.chat-avatar img{height:100%;width:100%;object-fit:cover}.chat-avatar.sm{width:34px;height:34px;flex-basis:34px}.chat-avatar.lg{width:68px;height:68px;flex-basis:68px;font-size:23px}
[data-page="chat"] .online-chat-layout{grid-template-columns:280px minmax(0,1fr);border-radius:14px;border-color:var(--line)}
[data-page="chat"] .online-conversations{padding:18px 12px 12px;background:var(--surface)}
[data-page="chat"] .online-conversations .card-title{padding:0 8px;flex-shrink:0;margin-bottom:0}
[data-page="chat"] .online-conversations h2{font-size:18px;font-weight:600;letter-spacing:-.3px}
[data-page="chat"] .chat-search{flex-shrink:0;min-height:40px;height:40px;margin:18px 4px 12px;padding:0 12px;gap:10px;border-radius:10px;background:var(--bg);border:1px solid var(--line)}
[data-page="chat"] .chat-search .icon{width:16px;height:16px;flex-shrink:0;color:var(--muted)}
[data-page="chat"] .chat-search input{padding:0!important;min-height:0;height:36px!important;line-height:36px;font-size:12px;box-shadow:none!important}
[data-page="chat"] .test-chat-rooms,[data-page="chat"] #online-rooms{padding:4px;scrollbar-gutter:stable;scroll-padding-top:6px}
[data-page="chat"] .online-conversations .list-item{display:flex;align-items:center;gap:12px;min-height:72px;padding:12px 10px;margin:2px 0;border-radius:11px;border:0;background:transparent;box-shadow:none!important;color:var(--ink);transform:none}
[data-page="chat"] .online-conversations .list-item.active{background:var(--chat-soft,#e4edf9);color:var(--ink)}
[data-page="chat"] .online-conversations .list-item:hover{background:var(--bg)}
[data-page="chat"] .online-conversations .list-item strong{font-size:13px;font-weight:550;line-height:1.5}
[data-page="chat"] .online-conversations .list-item small{font-size:11px;margin-top:4px;max-width:168px;color:var(--muted);line-height:1.5}
[data-page="chat"] .online-chat-main .chat-header{min-height:64px;padding:12px 24px;gap:12px}
[data-page="chat"] .chat-header h3{font-size:16px;font-weight:600;letter-spacing:-.2px;line-height:1.4}
[data-page="chat"] .chat-header small{display:block;font-size:11px;margin-top:3px}
[data-page="chat"] .online-chat-main .messages{display:flex;flex-direction:column;gap:18px;justify-content:flex-start;background:var(--surface);padding:26px 32px}
[data-page="chat"] [data-chat-paper="dots"] .messages,[data-page="chat"] [data-chat-paper="dots"].online-chat-layout .messages{background-image:radial-gradient(var(--line) .8px,transparent .8px);background-size:18px 18px}
[data-page="chat"] .message{max-width:min(75%,620px);align-self:flex-start;margin:0;flex:none}
[data-page="chat"] .message.mine{align-self:flex-end}
[data-page="chat"] .message .text{font-size:13px!important;font-weight:400!important;line-height:1.65!important;border-radius:3px 14px 14px!important;background:var(--bg);padding:12px 16px!important;color:var(--ink)}
[data-page="chat"] .message.mine .text{background:var(--chat-accent,#416fa7)!important;color:#fff!important;border-radius:14px 3px 14px 14px!important}
[data-page="chat"] .message .meta{font-size:10px!important;gap:10px;margin-bottom:5px}.message .meta b{font-weight:500}
[data-page="chat"] .test-chat-day{margin:0 auto 8px;font-size:10px;opacity:.7}
[data-page="chat"] .composer{min-height:74px;gap:10px;padding:12px 22px!important;border-top:1px solid var(--line)}
[data-page="chat"] .composer input{background:var(--bg)!important;border:1px solid var(--line);border-radius:12px;font-size:13px;padding:12px 16px;min-height:44px}
[data-page="chat"] .composer .btn{height:44px;min-height:44px;padding:10px 13px;border-radius:12px;box-shadow:none}
[data-page="chat"] .composer .primary{background:var(--chat-accent,#416fa7);color:#fff;border:0}
.chat-footer-tools{display:flex;gap:8px}.chat-footer-tools .btn{flex:1}
[data-page="chat"] .online-conversations .foot{flex-shrink:0;gap:8px;margin-top:10px;padding:12px 4px 0}
[data-page="chat"] .online-conversations .foot .btn{min-height:34px;font-size:11px;padding:7px 10px;border-radius:9px;box-shadow:none}
[data-page="chat"] .online-mobile-back{display:none}
[data-page="chat"] *{scrollbar-width:thin;scrollbar-color:#8d9bb14d transparent}
[data-page="chat"] ::-webkit-scrollbar{width:5px;height:5px}
[data-page="chat"] ::-webkit-scrollbar-track{background:transparent}
[data-page="chat"] ::-webkit-scrollbar-thumb{background:#8d9bb14d;border-radius:12px}
[data-page="chat"] ::-webkit-scrollbar-button{display:none;width:0;height:0}
[data-page="chat"] [data-chat-density="compact"] .list-item{min-height:58px;padding-top:8px;padding-bottom:8px}
[data-page="chat"] [data-chat-density="compact"] .messages{gap:10px;padding-top:18px}
[data-page="chat"] [data-chat-density="compact"] .message .text{padding:8px 13px!important}
body.dark [data-page="chat"] .chat-avatar{background:#283c57;color:#c4dbf6}
body.dark [data-page="chat"] .online-conversations .list-item.active{background:#283c57}
@media(max-width:1100px) and (min-width:701px){[data-page="chat"] .online-chat-layout{grid-template-columns:240px minmax(0,1fr)}}
@media(max-width:700px){body:has([data-page="chat"]) .topbar{height:76px;min-height:76px}[data-page="chat"] .online-chat-layout{display:block}[data-page="chat"] .online-mobile-back{display:inline-flex}[data-page="chat"] .online-chat-main .messages{padding:18px 14px}[data-page="chat"] .message{max-width:88%}[data-page="chat"] .online-chat-main .chat-header{padding:10px 12px}[data-page="chat"] .composer{padding:10px!important}.chat-avatar{width:34px;height:34px;flex-basis:34px;border-radius:10px}}

.startup-error{max-width:650px;margin:12vh auto;padding:32px;background:var(--surface);border:1px solid var(--line);border-radius:20px}.startup-error h1{font-size:24px}.startup-error p{margin:18px 0}.startup-error pre{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--bg);padding:14px;border-radius:10px;font-size:12px}

.connection-stage-notice{font-size:12px;padding:12px 16px;border-radius:12px;background:var(--soft);color:var(--ink);margin-bottom:16px;border:1px solid var(--line)}

.real-profile select[name="avatar"],.real-profile .unified-select:has(select[name="avatar"]){display:none!important}
.real-profile select[name="avatar"] + .unified-select{display:none!important}