/* CuaderNOTE · Chat · pantalla de acceso (paso 1). Fondo oscuro verdoso y verde de acento; todo va dentro de .ian-chat. */
html.ic-open { overflow: hidden; }

.ian-chat {
  --ic-surface: rgba(12, 40, 30, .88);
  --ic-field: #08211a;
  --ic-line: #1f5240;
  --ic-text: #e6fbf0;
  --ic-muted: #8fb8a4;
  --ic-accent: var(--cuadernote-neon, #00ff66);
  --ic-accent-ink: #031a0e;
  position: fixed; inset: 0; z-index: 10000;
  display: flex; flex-direction: column;
  color: var(--ic-text);
  font: 400 15px/1.45 Manrope, Roboto, system-ui, sans-serif;
  background: radial-gradient(120% 70% at 50% -10%, #145040 0%, #08241c 46%, #111a40 100%);
}
.ian-chat *, .ian-chat *::before, .ian-chat *::after { box-sizing: border-box; }

.ian-chat .ic-head { flex: none; display: flex; align-items: center; gap: 10px; min-height: 56px; padding: calc(8px + env(safe-area-inset-top)) 12px 8px; border-bottom: 1px solid rgba(255, 255, 255, .06); }
.ian-chat .ic-head strong { font-size: 17px; font-weight: 700; letter-spacing: .01em; }
.ian-chat .ic-badges { margin-left: auto; display: flex; align-items: center; gap: 6px; }
.ian-chat .ic-test { padding: 3px 9px; border-radius: 999px; background: rgba(255, 196, 61, .16); color: #ffd27a; font-size: 11px; font-weight: 700; }
.ian-chat .ic-test.ic-admin { background: rgba(114, 167, 255, .18); color: #b4d0ff; }
.ian-chat .ic-test[hidden] { display: none; }
.ian-chat .ic-out[hidden] { display: none; }
.ian-chat .ic-msg-link { display: inline-block; margin-top: 6px; color: var(--ic-accent); font-weight: 800; text-decoration: underline; }
.ian-chat .ic-linkbtn { text-decoration: none; text-align: center; }
.ian-chat .ic-icon { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 14px; background: rgba(255, 255, 255, .06); color: var(--ic-text); cursor: pointer; }
.ian-chat .ic-icon:hover { background: rgba(255, 255, 255, .12); }

.ian-chat .ic-body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 18px 16px calc(28px + env(safe-area-inset-bottom)); }
.ian-chat .ic-wrap { width: 100%; max-width: 440px; margin: 0 auto; display: grid; gap: 16px; }

.ian-chat .ic-steps { display: flex; justify-content: space-between; gap: 6px; margin: 0; padding: 0 4px; list-style: none; }
.ian-chat .ic-steps li { flex: 1; display: grid; justify-items: center; gap: 5px; position: relative; color: var(--ic-muted); font-size: 12px; font-weight: 600; }
.ian-chat .ic-steps li + li::before { content: ""; position: absolute; top: 13px; right: 50%; width: 100%; height: 2px; background: var(--ic-line); z-index: 0; }
.ian-chat .ic-steps li.done + li::before, .ian-chat .ic-steps li.now::before { background: var(--ic-accent); }
.ian-chat .ic-steps i { position: relative; z-index: 1; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; border: 2px solid var(--ic-line); background: #0a2a20; font-style: normal; font-size: 12px; font-weight: 800; }
.ian-chat .ic-steps li.now { color: var(--ic-text); }
.ian-chat .ic-steps li.now i { border-color: var(--ic-accent); color: var(--ic-accent); }
.ian-chat .ic-steps li.done i { border-color: var(--ic-accent); background: var(--ic-accent); color: var(--ic-accent-ink); }

.ian-chat .ic-card { display: grid; gap: 14px; padding: 22px 18px; border: 1px solid var(--ic-line); border-radius: 26px; background: var(--ic-surface); box-shadow: 0 18px 50px rgba(0, 0, 0, .35); }
.ian-chat .ic-card.ic-center { justify-items: center; text-align: center; }
.ian-chat .ic-news-card, .ian-chat .ic-pending-card { position: relative; overflow: hidden; }
.ian-chat .ic-news-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--ic-accent); }
.ian-chat .ic-news-card .ic-section-title { width: 100%; }
.ian-chat .ic-pending-card { border-style: dashed; }
.ian-chat .ic-card h2 { margin: 0; font-size: 22px; line-height: 1.2; font-weight: 800; outline: none; }
.ian-chat .ic-sub { margin: 0; color: var(--ic-muted); }
.ian-chat .ic-sub b { color: var(--ic-text); word-break: break-all; }
.ian-chat .ic-hint { margin: 0; color: var(--ic-muted); font-size: 13px; }
.ian-chat .ic-center .ic-sub, .ian-chat .ic-center .ic-hint { max-width: 34ch; }

.ian-chat .ic-badge { display: grid; place-items: center; width: 68px; height: 68px; border-radius: 22px; background: rgba(0, 255, 102, .1); color: var(--ic-accent); border: 1px solid rgba(0, 255, 102, .3); }
.ian-chat .ic-badge.ok { background: var(--ic-accent); color: var(--ic-accent-ink); border-color: transparent; }

.ian-chat .ic-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; border-radius: 16px; background: var(--ic-field); }
.ian-chat .ic-tabs button { min-height: 40px; border: 0; border-radius: 12px; background: transparent; color: var(--ic-muted); font: 700 14px Manrope, Roboto, system-ui, sans-serif; cursor: pointer; }
.ian-chat .ic-tabs button[aria-selected="true"] { background: var(--ic-accent); color: var(--ic-accent-ink); }

.ian-chat .ic-form { display: grid; gap: 12px; width: 100%; text-align: left; }
.ian-chat .ic-field { display: grid; gap: 6px; }
.ian-chat .ic-field > span:first-child { color: var(--ic-muted); font-size: 13px; font-weight: 600; }
.ian-chat input, .ian-chat select { width: 100%; min-height: 48px; padding: 0 14px; border: 1px solid var(--ic-line); border-radius: 14px; background: var(--ic-field); color: var(--ic-text); font: 400 16px Manrope, Roboto, system-ui, sans-serif; outline: none; }
.ian-chat input::placeholder { color: #5f8574; }
.ian-chat input:focus, .ian-chat select:focus { border-color: var(--ic-accent); box-shadow: 0 0 0 3px rgba(0, 255, 102, .18); }
.ian-chat select option { background: #0a251c; color: var(--ic-text); }
.ian-chat .ic-pass { position: relative; display: block; }
.ian-chat .ic-pass input { padding-right: 52px; }
.ian-chat .ic-eye { position: absolute; top: 4px; right: 4px; display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 12px; background: transparent; color: var(--ic-muted); cursor: pointer; }
.ian-chat .ic-eye:hover { color: var(--ic-text); }
.ian-chat .ic-phone { display: grid; grid-template-columns: minmax(0, 11.5em) minmax(0, 1fr); gap: 8px; }
.ian-chat .ic-code { text-align: center; font-size: 26px; font-weight: 800; letter-spacing: .4em; padding-left: calc(14px + .4em); }
.ian-chat .ic-forgot { justify-self: start; }

.ian-chat .ic-primary, .ian-chat .ic-secondary, .ian-chat .ic-google { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 50px; padding: 0 18px; border-radius: 16px; font: 800 15px Manrope, Roboto, system-ui, sans-serif; cursor: pointer; }
.ian-chat .ic-primary { border: 0; background: var(--ic-accent); color: var(--ic-accent-ink); }
.ian-chat .ic-primary:hover:not(:disabled) { filter: brightness(1.08); }
.ian-chat .ic-secondary { border: 1px solid var(--ic-line); background: transparent; color: var(--ic-text); }
.ian-chat .ic-secondary:hover:not(:disabled) { border-color: var(--ic-accent); }
.ian-chat .ic-google { border: 0; background: #fff; color: #17224f; }
.ian-chat button:disabled { opacity: .55; cursor: default; }
.ian-chat button:focus-visible, .ian-chat [tabindex]:focus-visible { outline: 2px solid var(--ic-accent); outline-offset: 2px; }
.ian-chat .ic-link { padding: 6px 4px; border: 0; background: transparent; color: var(--ic-accent); font: 700 14px Manrope, Roboto, system-ui, sans-serif; cursor: pointer; }
.ian-chat .ic-link:hover { text-decoration: underline; }
.ian-chat .ic-or { display: flex; align-items: center; gap: 12px; color: var(--ic-muted); font-size: 13px; }
.ian-chat .ic-or::before, .ian-chat .ic-or::after { content: ""; flex: 1; height: 1px; background: var(--ic-line); }

.ian-chat .ic-msg { margin: 0; width: 100%; padding: 10px 12px; border-radius: 12px; font-size: 14px; text-align: left; }
.ian-chat .ic-msg[hidden] { display: none; }
.ian-chat .ic-msg[data-kind="error"] { background: rgba(255, 99, 71, .14); color: #ffc2b8; border: 1px solid rgba(255, 99, 71, .35); }
.ian-chat .ic-msg[data-kind="info"] { background: rgba(0, 255, 102, .09); color: #b6f7d2; border: 1px solid rgba(0, 255, 102, .3); }

.ian-chat .ic-spinner { width: 34px; height: 34px; border-radius: 50%; border: 3px solid var(--ic-line); border-top-color: var(--ic-accent); animation: ic-spin .8s linear infinite; }
@keyframes ic-spin { to { transform: rotate(360deg); } }

.ian-chat .ic-checks { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; width: 100%; text-align: left; }
.ian-chat .ic-checks li { display: grid; grid-template-columns: 78px minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 12px 14px; border-radius: 14px; background: var(--ic-field); }
.ian-chat .ic-checks b { color: var(--ic-muted); font-size: 13px; }
.ian-chat .ic-checks span { overflow-wrap: anywhere; }
.ian-chat .ic-checks i { color: var(--ic-accent); font-style: normal; font-weight: 800; }
.ian-chat .ic-next { width: 100%; display: grid; gap: 6px; justify-items: start; padding: 14px; border-radius: 16px; border: 1px dashed var(--ic-line); text-align: left; }
.ian-chat .ic-next p { margin: 0; color: var(--ic-muted); font-size: 14px; }
.ian-chat .ic-soon { padding: 2px 9px; border-radius: 999px; background: rgba(255, 196, 61, .16); color: #ffd27a; font-size: 11px; font-weight: 800; }

/* ---- Pantalla de acceso: dos formas de entrar ---- */
.ian-chat .ic-opt { margin: 2px 0 -4px; color: var(--ic-muted); font-size: 13px; font-weight: 600; }
.ian-chat .ic-opt b { color: var(--ic-accent); font-weight: 800; }
.ian-chat .ic-hint[hidden] { display: none; }

/* ---- Paso 2: @alias ---- */
.ian-chat .ic-card h3 { margin: 0; font-size: 18px; font-weight: 800; }
.ian-chat .ic-eyebrow { margin: 0; color: var(--ic-muted); font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.ian-chat .ic-handle { font-size: 28px; overflow-wrap: anywhere; color: var(--ic-accent); }
.ian-chat .ic-at { font-size: 34px; font-weight: 800; line-height: 1; }
.ian-chat .ic-alias { display: flex; align-items: center; min-height: 48px; border: 1px solid var(--ic-line); border-radius: 14px; background: var(--ic-field); overflow: hidden; }
.ian-chat .ic-alias:focus-within { border-color: var(--ic-accent); box-shadow: 0 0 0 3px rgba(0, 255, 102, .18); }
.ian-chat .ic-alias b { padding: 0 2px 0 14px; color: var(--ic-accent); font-size: 18px; font-weight: 800; }
.ian-chat .ic-alias input { flex: 1; min-width: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; padding-left: 4px; }
.ian-chat .ic-alias input:focus { border: 0; box-shadow: none; }
.ian-chat .ic-dice { display: grid; place-items: center; width: 44px; height: 44px; margin-right: 2px; padding: 0; border: 0; border-radius: 12px; background: transparent; color: var(--ic-accent); cursor: pointer; }
.ian-chat .ic-dice:hover { background: rgba(0, 255, 102, .12); }
.ian-chat .ic-confirm { display: grid; gap: 10px; width: 100%; padding: 14px; border-radius: 16px; border: 1px solid var(--ic-line); background: rgba(0, 0, 0, .18); text-align: left; }
.ian-chat .ic-confirm p { margin: 0; }
.ian-chat .ic-result:empty { display: none; }
.ian-chat .ic-result { display: grid; gap: 8px; }
.ian-chat .ic-found { display: grid; gap: 10px; padding: 14px; border-radius: 16px; background: var(--ic-field); border: 1px solid rgba(0, 255, 102, .35); }
.ian-chat .ic-found div { display: grid; gap: 2px; }
.ian-chat .ic-found b { font-size: 18px; overflow-wrap: anywhere; }
.ian-chat .ic-found span { color: var(--ic-accent); font-size: 13px; font-weight: 700; }

/* ---- Paso 3: barra inferior flotante, solicitudes y chats ---- */
.ian-chat .ic-wrap.ic-home { padding-bottom: 96px; }
.ian-chat .ic-tabbar { position: fixed; left: 50%; bottom: calc(14px + env(safe-area-inset-bottom)); transform: translateX(-50%); z-index: 2;
  width: min(440px, calc(100% - 32px)); display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; padding: 6px;
  border-radius: 24px; border: 1px solid var(--ic-line); background: rgba(8, 30, 22, .94); box-shadow: 0 14px 36px rgba(0, 0, 0, .5); backdrop-filter: blur(10px); }
.ian-chat .ic-tabbar button { position: relative; display: grid; justify-items: center; gap: 3px; padding: 8px 4px; border: 0; border-radius: 18px; background: transparent; color: var(--ic-muted); font: 700 12px Manrope, Roboto, system-ui, sans-serif; cursor: pointer; }
.ian-chat .ic-tabbar button[aria-current="page"] { background: rgba(0, 255, 102, .14); color: var(--ic-accent); }
.ian-chat .ic-count { position: absolute; top: 3px; left: calc(50% + 6px); min-width: 18px; height: 18px; padding: 0 5px; display: grid; place-items: center; border-radius: 999px; background: var(--ic-accent); color: var(--ic-accent-ink); font-style: normal; font-size: 11px; font-weight: 800; }
.ian-chat .ic-segment { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; padding: 4px; border-radius: 16px; background: var(--ic-field); }
@media (min-width: 480px) { .ian-chat .ic-segment { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.ian-chat .ic-segment button { min-width: 0; min-height: 36px; padding: 0 8px; border: 0; border-radius: 12px; background: transparent; color: var(--ic-muted); font: 700 13px Manrope, Roboto, system-ui, sans-serif; white-space: nowrap; cursor: pointer; }
.ian-chat .ic-segment button[aria-selected="true"] { background: var(--ic-accent); color: var(--ic-accent-ink); }
.ian-chat .ic-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ian-chat .ic-row { display: flex; align-items: center; gap: 12px; width: 100%; padding: 10px 12px; border: 1px solid transparent; border-radius: 16px; background: var(--ic-field); color: var(--ic-text); font: inherit; text-align: left; }
.ian-chat button.ic-row { cursor: pointer; }
.ian-chat button.ic-row:hover { border-color: var(--ic-line); }
.ian-chat .ic-row-text { flex: 1; min-width: 0; display: grid; gap: 1px; }
.ian-chat .ic-row-text b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ian-chat .ic-row-text small { color: var(--ic-muted); font-size: 13px; overflow-wrap: anywhere; }
.ian-chat .ic-row-go { color: var(--ic-muted); font-size: 22px; }
.ian-chat .ic-avatar { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: linear-gradient(135deg, #1f7a55, #0e3d2c); color: #dfffee; font-weight: 800; font-size: 17px; }
.ian-chat .ic-avatar.big { width: 72px; height: 72px; font-size: 28px; }
.ian-chat .ic-request { display: grid; gap: 10px; padding: 14px; border: 1px solid var(--ic-line); border-radius: 18px; background: var(--ic-field); }
.ian-chat .ic-request-head { display: flex; align-items: center; gap: 12px; }
.ian-chat .ic-meta { margin: 0; color: var(--ic-muted); font-size: 13px; }
.ian-chat .ic-verified { color: var(--ic-accent); font-weight: 800; }
.ian-chat .ic-warn { margin: 0; padding: 10px 12px; border: 1px solid rgba(255, 196, 61, .45); border-radius: 12px; background: rgba(255, 196, 61, .14); color: #ffd98a; font-size: 13px; }
.ian-chat .ic-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ian-chat .ic-mini { display: flex; justify-content: flex-end; gap: 8px; }
.ian-chat .ic-link.ic-danger { color: #ff9c8a; }
.ian-chat textarea { width: 100%; min-height: 84px; padding: 10px 14px; border: 1px solid var(--ic-line); border-radius: 14px; background: var(--ic-field); color: var(--ic-text); font: 400 15px Manrope, Roboto, system-ui, sans-serif; resize: vertical; outline: none; }
.ian-chat textarea:focus { border-color: var(--ic-accent); box-shadow: 0 0 0 3px rgba(0, 255, 102, .18); }

/* ---- Sesión: último bloque separado de los ajustes del Chat ---- */
.ian-chat .ic-session-end { display: grid; gap: 10px; margin-top: 22px; padding: 18px; border-color: rgba(255, 156, 138, .35); }
.ian-chat .ic-session-end h3 { margin: -4px 0 0; }
.ian-chat .ic-session-end .ic-danger { justify-self: start; min-height: 42px; padding: 0 4px; font-weight: 800; }

/* ---- Bienvenida (primera vez): avisos, sonido y vibración ---- */
.ian-welcome { position: fixed; inset: 0; z-index: 30000; display: grid; place-items: center; padding: 16px; background: rgba(2, 10, 7, .72); backdrop-filter: blur(4px); }
.ian-welcome-card { width: min(400px, 100%); display: grid; gap: 12px; justify-items: center; padding: 22px 18px; border: 1px solid rgba(0, 255, 102, .4); border-radius: 26px; background: #0b2a20; color: #e6fbf0; font: 400 14px/1.45 Manrope, Roboto, system-ui, sans-serif; text-align: center; box-shadow: 0 20px 60px rgba(0, 0, 0, .6); }
.ian-welcome-card img { width: 72px; height: 72px; border-radius: 18px; }
.ian-welcome-card h2 { margin: 0; font-size: 21px; font-weight: 800; }
.ian-welcome-card p { margin: 0; color: #b9d8c8; }
.ian-welcome-card label { width: 100%; display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 14px; background: #08211a; text-align: left; cursor: pointer; }
.ian-welcome-card label input { width: 22px; height: 22px; flex: none; accent-color: var(--cuadernote-neon, #00ff66); }
.ian-welcome-card label span { display: grid; }
.ian-welcome-card label small { color: #8fb8a4; font-size: 12px; }
.ian-welcome-yes { width: 100%; min-height: 50px; border: 1px solid #fff; border-radius: 16px; background: #f5f5f5; color: #131d46; font: 800 15px Manrope, Roboto, system-ui, sans-serif; cursor: pointer; }
.ian-welcome-yes:focus-visible, .ian-welcome-no:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.ian-welcome-no { border: 0; background: transparent; color: #d7d7d7; font: 700 14px Manrope, Roboto, system-ui, sans-serif; cursor: pointer; padding: 6px; }
.ian-welcome-note { color: #8fb8a4; font-size: 12px; }

/* ---- Burbuja flotante de avisos (fuera de la pantalla del Chat, sobre la app) ---- */
.ic-bubble { position: fixed; right: 14px; bottom: calc(92px + env(safe-area-inset-bottom)); z-index: 9000;
  display: flex; align-items: center; gap: 8px; max-width: min(320px, calc(100vw - 28px)); padding: 10px 12px 10px 12px;
  border: 1px solid rgba(0, 255, 102, .45); border-radius: 999px; background: rgba(6, 28, 20, .96); color: #e6fbf0;
  font: 700 13px Manrope, Roboto, system-ui, sans-serif; box-shadow: 0 12px 30px rgba(0, 0, 0, .45); cursor: pointer;
  animation: ic-bubble-in .35s ease-out; }
.ic-bubble svg { flex: none; color: var(--cuadernote-neon, #00ff66); }
.ic-bubble span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ic-bubble b { flex: none; min-width: 20px; height: 20px; padding: 0 6px; display: grid; place-items: center; border-radius: 999px; background: var(--cuadernote-neon, #00ff66); color: #031a0e; font-size: 12px; }
@keyframes ic-bubble-in { from { transform: translateY(12px); opacity: 0; } to { transform: none; opacity: 1; } }

@media (prefers-reduced-motion: reduce) { .ian-chat .ic-spinner { animation-duration: 2s; } .ic-bubble { animation: none; } }

/* ---- Chat principal: lista, conversación, perfil y ajustes en la nube ---- */
.ian-chat .ic-back-app { width: auto; padding: 0 10px; gap: 5px; }
.ian-chat .ic-back-app span { font-size: 11px; font-weight: 800; }
.ian-chat .ic-section-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ian-chat .ic-section-title h2, .ian-chat .ic-section-title p { margin: 0; }
.ian-chat .ic-chat-search { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 0 12px; border: 1px solid var(--ic-line); border-radius: 16px; background: var(--ic-field); color: var(--ic-muted); }
.ian-chat .ic-chat-search input { min-width: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
.ian-chat .ic-chat-search input:focus { border: 0; box-shadow: none; }
.ian-chat .ic-chat-filters { display: flex; gap: 7px; overflow-x: auto; scrollbar-width: none; }
.ian-chat .ic-chat-filters::-webkit-scrollbar { display: none; }
.ian-chat .ic-chat-filters button { flex: none; min-height: 34px; padding: 0 14px; border: 1px solid var(--ic-line); border-radius: 999px; background: transparent; color: var(--ic-muted); font: 800 12px Manrope, Roboto, system-ui, sans-serif; }
.ian-chat .ic-chat-filters button[aria-selected="true"] { border-color: rgba(0, 255, 102, .5); background: rgba(0, 255, 102, .12); color: var(--ic-accent); }
.ian-chat .ic-chat-row { min-width: 0; padding: 11px 10px; background: rgba(5, 28, 20, .74); }
.ian-chat .ic-chat-row .ic-row-text b { display: flex; align-items: center; min-width: 0; }
.ian-chat .ic-chat-row .ic-row-text b svg { flex: none; width: 13px; height: 13px; margin-right: 3px; color: var(--ic-accent); }
.ian-chat .ic-chat-row .ic-row-text small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ian-chat .ic-row-side { flex: none; align-self: stretch; display: grid; align-content: center; justify-items: end; gap: 6px; color: var(--ic-muted); font-size: 10px; }
.ian-chat .ic-row-side i { width: 9px; height: 9px; border-radius: 50%; background: var(--ic-accent); box-shadow: 0 0 10px rgba(0, 255, 102, .45); }
.ian-chat .ic-chat-empty { display: grid; justify-items: center; gap: 5px; padding: 22px 14px; border: 1px dashed var(--ic-line); border-radius: 18px; text-align: center; }
.ian-chat .ic-chat-empty b { font-size: 16px; }
.ian-chat .ic-chat-empty span { max-width: 34ch; color: var(--ic-muted); font-size: 13px; }

.ian-chat .ic-avatar { overflow: hidden; }
.ian-chat .ic-avatar.has-photo { background: #08211a; }
.ian-chat .ic-avatar img { width: 100%; height: 100%; object-fit: cover; }
.ian-chat .ic-thread { min-width: 0; min-height: calc(100dvh - 190px); display: flex; flex-direction: column; border: 1px solid var(--ic-line); border-radius: 24px; overflow: hidden; background: rgba(5, 25, 18, .88); box-shadow: 0 18px 50px rgba(0, 0, 0, .3); }
.ian-chat .ic-thread-head { flex: none; display: flex; align-items: center; gap: 8px; min-width: 0; padding: 8px; border-bottom: 1px solid rgba(255, 255, 255, .06); background: rgba(12, 45, 33, .9); }
.ian-chat .ic-thread-head .ic-icon { width: 36px; height: 36px; border-radius: 12px; }
.ian-chat .ic-thread-head .ic-icon.active { background: rgba(0, 255, 102, .16); color: var(--ic-accent); }
.ian-chat .ic-thread-person { flex: 1; min-width: 0; display: grid; gap: 1px; padding: 3px 0; border: 0; background: transparent; color: var(--ic-text); text-align: left; }
.ian-chat .ic-thread-person b, .ian-chat .ic-thread-person small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ian-chat .ic-thread-person small { color: var(--ic-muted); }
.ian-chat .ic-contact-card { display: flex; align-items: center; gap: 8px; padding: 7px 12px; border-bottom: 1px solid rgba(255, 255, 255, .05); background: rgba(0, 255, 102, .06); font-size: 12px; }
.ian-chat .ic-contact-card b { color: var(--ic-accent); }
.ian-chat .ic-contact-card span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ic-muted); }
.ian-chat .ic-thread > .ic-msg { width: auto; margin: 8px 10px 0; }
.ian-chat .ic-thread-messages { flex: 1; min-height: 260px; max-height: calc(100dvh - 330px); overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 7px; padding: 14px 10px; background: radial-gradient(circle at 20% 10%, rgba(0, 255, 102, .055), transparent 28%), linear-gradient(rgba(3, 17, 12, .94), rgba(4, 22, 15, .94)); }
.ian-chat .ic-thread-loading { margin: auto; display: grid; justify-items: center; gap: 8px; color: var(--ic-muted); }
.ian-chat .ic-older { align-self: center; }
.ian-chat .ic-message { position: relative; max-width: min(84%, 340px); display: grid; gap: 4px; padding: 8px 10px 6px; border: 1px solid rgba(255, 255, 255, .06); border-radius: 16px 16px 16px 5px; background: #11382b; box-shadow: 0 4px 10px rgba(0, 0, 0, .16); overflow-wrap: anywhere; }
.ian-chat .ic-message.mine { align-self: flex-end; border-color: rgba(0, 255, 102, .18); border-radius: 16px 16px 5px 16px; background: #135338; }
.ian-chat .ic-message.theirs { align-self: flex-start; }
.ian-chat .ic-message p { margin: 0; white-space: normal; }
.ian-chat .ic-quote { display: grid; gap: 1px; padding: 5px 7px; border-left: 3px solid var(--ic-accent); border-radius: 7px; background: rgba(0, 0, 0, .18); font-size: 11px; }
.ian-chat .ic-quote b { color: var(--ic-accent); }
.ian-chat .ic-quote span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ic-muted); }
.ian-chat .ic-message-meta { display: flex; justify-content: flex-end; align-items: center; gap: 4px; min-height: 14px; color: rgba(226, 250, 237, .62); font-size: 9px; }
.ian-chat .ic-delivery { display: inline-flex; color: #a7c3b5; }
.ian-chat .ic-delivery.read { color: var(--ic-accent); }
.ian-chat .ic-reactions { display: flex; flex-wrap: wrap; gap: 3px; }
.ian-chat .ic-reactions button { min-height: 24px; padding: 1px 7px; border: 1px solid rgba(255, 255, 255, .1); border-radius: 999px; background: rgba(0, 0, 0, .2); color: var(--ic-text); }
.ian-chat .ic-message-actions { display: flex; gap: 3px; max-height: 0; overflow: hidden; opacity: 0; transition: .15s ease; }
.ian-chat .ic-message:hover .ic-message-actions, .ian-chat .ic-message:focus-within .ic-message-actions { max-height: 30px; opacity: 1; }
.ian-chat .ic-message-actions button { display: inline-flex; align-items: center; gap: 3px; min-height: 25px; padding: 2px 5px; border: 0; border-radius: 8px; background: rgba(0, 0, 0, .18); color: var(--ic-muted); font-size: 10px; }
.ian-chat .ic-message-actions svg { width: 14px; height: 14px; }
.ian-chat .ic-message-confirm { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; padding-top: 5px; border-top: 1px solid rgba(255, 255, 255, .1); font-size: 11px; }
.ian-chat .ic-message-confirm button { min-height: 27px; padding: 2px 7px; border: 1px solid var(--ic-line); border-radius: 8px; background: transparent; color: var(--ic-text); }
.ian-chat .ic-message-confirm button:first-of-type { color: #ffb3a5; }
.ian-chat .ic-composer { flex: none; display: grid; gap: 6px; padding: 8px; border-top: 1px solid rgba(255, 255, 255, .06); background: rgba(8, 31, 23, .98); }
.ian-chat .ic-compose-row { display: grid; grid-template-columns: 40px minmax(0, 1fr) 44px; align-items: end; gap: 7px; }
.ian-chat .ic-emoji-btn { display: grid; place-items: center; width: 40px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--ic-muted); cursor: pointer; }
.ian-chat .ic-emoji-btn:hover { color: var(--ic-accent); }
.ian-chat .ic-compose-row textarea { min-height: 44px; max-height: 130px; resize: vertical; border-radius: 18px; }
.ian-chat .ic-send { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: var(--ic-accent); color: var(--ic-accent-ink); }
.ian-chat .ic-compose-context { display: flex; align-items: center; gap: 7px; min-width: 0; padding: 6px 8px; border-radius: 10px; background: rgba(0, 255, 102, .08); }
.ian-chat .ic-compose-context > span { flex: 1; min-width: 0; display: grid; grid-template-columns: auto auto minmax(0, 1fr); align-items: center; gap: 5px; }
.ian-chat .ic-compose-context small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ic-muted); }
.ian-chat .ic-compose-context button { display: grid; place-items: center; width: 28px; height: 28px; border: 0; border-radius: 8px; background: transparent; color: var(--ic-muted); }

.ian-chat .ic-profile-card { overflow: hidden; }
.ian-chat .ic-profile-photo-wrap { position: relative; }
.ian-chat .ic-profile-photo-wrap > span:last-child { position: absolute; right: -5px; bottom: -4px; display: grid; place-items: center; width: 27px; height: 27px; border-radius: 50%; background: var(--ic-accent); color: var(--ic-accent-ink); }
.ian-chat .ic-profile-photo-wrap > span:last-child svg { width: 15px; }
.ian-chat .ic-profile-card h2, .ian-chat .ic-profile-card .ic-handle { margin: 0; }
.ian-chat .ic-profile-card .ic-handle { font-size: 16px; }
.ian-chat .ic-profile-status { margin: 0; color: var(--ic-muted); }
.ian-chat .ic-status-expiry { margin-top: -9px; color: var(--ic-accent); font-size: 11px; font-weight: 700; }
.ian-chat .ic-photo-actions { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ian-chat .ic-photo-actions label { min-width: 0; }
.ian-chat .ic-photo-actions input[hidden] { display: none; }
.ian-chat .ic-toggle-form > label { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 8px 0; border-bottom: 1px solid rgba(255, 255, 255, .06); }
.ian-chat .ic-toggle-form > label > span { flex: 1; min-width: 0; display: grid; }
.ian-chat .ic-toggle-form small { color: var(--ic-muted); }
.ian-chat .ic-toggle-form input[type="checkbox"] { flex: none; width: 23px; min-height: 23px; accent-color: var(--ic-accent); }
/* ---- Tablet y computador ----
   Tablet de pie (600–899 px): una columna más ancha. Desde 900 px: chats a la izquierda y conversación a la derecha,
   como WhatsApp Web o Telegram Desktop. */
@media (min-width: 600px) {
  .ian-chat .ic-wrap { max-width: 640px; }
}
.ian-chat.ic-wide .ic-wrap { max-width: 1240px; }
.ian-chat.ic-wide .ic-wrap.ic-home { padding-bottom: 88px; }
.ian-chat .ic-split { display: grid; grid-template-columns: minmax(300px, 380px) minmax(0, 1fr); gap: 16px; align-items: start; }
.ian-chat .ic-split-list { display: grid; gap: 16px; min-width: 0; max-height: calc(100dvh - 180px); overflow-y: auto; overscroll-behavior: contain; padding-right: 2px; }
.ian-chat .ic-split-chat { min-width: 0; position: sticky; top: 0; }
.ian-chat .ic-split .ic-thread { height: calc(100dvh - 180px); min-height: 0; }
.ian-chat .ic-split .ic-thread-messages { max-height: none; min-height: 0; }
.ian-chat .ic-split-empty { min-height: calc(100dvh - 180px); align-content: center; }
.ian-chat .ic-chat-row.is-open { border-color: var(--ic-accent); background: rgba(0, 255, 102, .08); }
/* En computador, las demás pestañas (Solicitudes, Perfil) quedan centradas y más anchas. */
.ian-chat.ic-wide .ic-wrap.ic-home > section.ic-card { width: 100%; max-width: 760px; justify-self: center; }

/* «En el chat» (punto verde/rojo) y «escribiendo…» */
.ian-chat .ic-presence { display: inline-flex; align-items: center; gap: 6px; }
.ian-chat .ic-dot { flex: none; width: 9px; height: 9px; border-radius: 50%; }
.ian-chat .ic-dot.on { background: #22e06b; box-shadow: 0 0 0 3px rgba(34, 224, 107, .22); }
.ian-chat .ic-dot.off { background: #ff5a4d; box-shadow: 0 0 0 3px rgba(255, 90, 77, .18); }
.ian-chat .ic-dot.wait { background: #ff9f1a; box-shadow: 0 0 0 3px rgba(255, 159, 26, .22); }
.ian-chat .ic-typing { color: var(--ic-accent); font-style: italic; animation: ic-typing 1.2s ease-in-out infinite; }
@keyframes ic-typing { 50% { opacity: .45; } }

/* Encabezado del Chat: Solicitudes y menú ☰ arriba (ya no hay barra abajo) */
.ian-chat .ic-head-actions { display: flex; align-items: center; gap: 6px; margin-left: 6px; }
.ian-chat .ic-head-actions[hidden] { display: none; }
.ian-chat .ic-head-btn { position: relative; }
.ian-chat .ic-head-btn .ic-count { top: -4px; left: auto; right: -4px; }
.ian-chat .ic-count[hidden] { display: none; }
.ian-chat .ic-wrap.ic-home { padding-bottom: 28px; }
.ian-chat .ic-tabbar { display: none; }
/* Menús desplegables (☰ y ⋮) */
.ian-chat .ic-pop-wrap { position: relative; display: inline-flex; }
.ian-chat .ic-pop { position: absolute; right: 0; top: calc(100% + 6px); z-index: 30; min-width: 220px; display: grid; gap: 2px; padding: 6px; border: 1px solid var(--ic-line); border-radius: 16px; background: #0b2a20; box-shadow: 0 16px 40px rgba(0, 0, 0, .55); }
.ian-chat .ic-pop[hidden] { display: none; }
.ian-chat .ic-pop button { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 44px; padding: 0 12px; border: 0; border-radius: 12px; background: transparent; color: var(--ic-text); font: 600 14px Manrope, Roboto, system-ui, sans-serif; text-align: left; cursor: pointer; }
.ian-chat .ic-pop button:hover, .ian-chat .ic-pop button[aria-current] { background: rgba(0, 255, 102, .1); color: var(--ic-accent); }
.ian-chat .ic-pop button[hidden] { display: none; }
.ian-chat .ic-pop .ic-menu-danger { margin-top: 4px; border-top: 1px solid rgba(255, 255, 255, .08); border-radius: 0 0 12px 12px; color: #ff9c8a; }

/* Mensajes de voz · caja de escribir como WhatsApp: 😊 · texto · 🎤 (vacía) o ➤ (con texto) */
.ian-chat .ic-compose-row { grid-template-columns: 40px minmax(0, 1fr) 44px; }
.ian-chat .ic-compose-row:not(.has-text) .ic-send { display: none; }
.ian-chat .ic-compose-row.has-text .ic-mic { display: none; }
.ian-chat .ic-mic { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--ic-line); border-radius: 50%; background: var(--ic-field); color: var(--ic-text); cursor: pointer; }
.ian-chat .ic-mic:hover { border-color: var(--ic-accent); color: var(--ic-accent); }
.ian-chat .ic-compose-row[hidden] { display: none; }
.ian-chat .ic-recording { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 4px 4px 4px 14px; border: 1px solid rgba(255, 90, 77, .45); border-radius: 24px; background: rgba(255, 90, 77, .08); }
.ian-chat .ic-recording span { flex: 1; min-width: 0; color: var(--ic-muted); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ian-chat .ic-rec-dot { width: 10px; height: 10px; border-radius: 50%; background: #ff5a4d; animation: ic-typing 1s ease-in-out infinite; }
.ian-chat .ic-voice { display: flex; align-items: center; gap: 6px; min-width: min(260px, 62vw); }
.ian-chat .ic-voice audio { flex: 1; min-width: 0; height: 36px; }
.ian-chat .ic-voice small { color: var(--ic-muted); font-size: 12px; }
@media (prefers-reduced-motion: reduce) { .ian-chat .ic-typing, .ian-chat .ic-rec-dot { animation: none; } }

/* Solicitudes: enviadas que se pueden tocar y la pista de «cuentas distintas» */
.ian-chat .ic-sent-row { border: 0; background: transparent; padding: 0; cursor: pointer; }
.ian-chat .ic-tip { margin: 0; padding: 10px 12px; border-radius: 12px; border: 1px dashed rgba(255, 196, 61, .5); background: rgba(255, 196, 61, .08); color: #ffe2a6; font-size: 13px; }

/* Filas de ajuste (texto a la izquierda, botón debajo en celular) */
.ian-chat .ic-setrow { display: grid; gap: 10px; }
.ian-chat .ic-setrow > span { display: grid; gap: 3px; }
.ian-chat .ic-setrow small { color: var(--ic-muted); font-size: 13px; }

/* Back Office (solo el dueño) */
.ian-chat .ic-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.ian-chat .ic-stats span { display: grid; justify-items: center; gap: 2px; padding: 10px 4px; border-radius: 14px; background: var(--ic-field); color: var(--ic-muted); font-size: 12px; }
.ian-chat .ic-stats b { color: var(--ic-text); font-size: 22px; }
.ian-chat .ic-person { flex-wrap: wrap; }
.ian-chat .ic-person-acts { display: flex; gap: 4px; margin-left: auto; }
.ian-chat .ic-banned { color: #ff9c8a; font-size: 12px; }
.ian-chat .ic-quote-text { margin: 0; color: var(--ic-text); font-style: italic; overflow-wrap: anywhere; }

/* Tarjeta «Activa los avisos» (burbuja de CuaderNOTE fuera de la app) */
.ian-chat .ic-notify { display: flex; align-items: center; gap: 10px; padding: 12px; border: 1px solid rgba(0, 255, 102, .35); border-radius: 16px; background: rgba(0, 255, 102, .07); }
.ian-chat .ic-notify > span { font-size: 22px; }
.ian-chat .ic-notify > div { flex: 1; min-width: 0; display: grid; gap: 2px; }
.ian-chat .ic-notify small { color: var(--ic-muted); font-size: 12.5px; }
.ian-chat .ic-notify .ic-primary { width: auto; min-height: 40px; padding: 0 14px; }
.ian-chat .ic-notify-hint { padding: 8px 4px; }

/* Pantalla de inicio de sesión de toda la app: sin botón para saltarla, con el logo de CuaderNOTE. */
.ian-access-gated .app-shell { visibility: hidden; pointer-events: none; }
.ian-chat.ic-gate .ic-head { display: none; }
.ian-chat.ic-gate .ic-body { display: grid; place-items: center; padding: max(24px, env(safe-area-inset-top)) 16px max(24px, env(safe-area-inset-bottom)); }
.ian-chat.ic-gate .ic-card { width: min(100%, 420px); }
.ian-chat.ic-gate .ic-steps { display: none; }
.ian-chat.ic-gate .ic-back-app { display: none; }
.ian-chat .ic-gate-logo { width: 84px; height: 84px; object-fit: contain; border-radius: 22px; }
.ian-chat .ic-check { display: flex; align-items: flex-start; gap: 12px; padding: 4px 0; cursor: pointer; }
.ian-chat .ic-check input[type="checkbox"] { flex: none; width: 23px; min-height: 23px; margin-top: 2px; accent-color: var(--ic-accent); }
.ian-chat .ic-check span { display: grid; gap: 2px; }
.ian-chat .ic-check small { color: var(--ic-muted); font-size: 13px; }
.ian-chat .ic-security-note { grid-template-columns: auto minmax(0, 1fr); align-items: start; }
.ian-chat .ic-security-note > span { color: var(--ic-accent); }
.ian-chat .ic-security-note p { margin: 3px 0 0; color: var(--ic-muted); font-size: 13px; }

@media (hover: none) {
  .ian-chat .ic-message-actions { max-height: 30px; opacity: 1; }
  .ian-chat .ic-message-actions span { display: none; }
}
@media (max-width: 380px) {
  .ian-chat .ic-body { padding-right: 10px; padding-left: 10px; }
  .ian-chat .ic-card { padding-right: 14px; padding-left: 14px; }
  .ian-chat .ic-back-app span { display: none; }
  .ian-chat .ic-message { max-width: 88%; }
  .ian-chat .ic-thread-head { gap: 5px; }
  .ian-chat .ic-thread-head .ic-avatar { width: 36px; height: 36px; }
}

/* ---- Conversación a pantalla completa (2026-10-09, pedido de Edilberto) ----
   Como WhatsApp y Telegram: en celular y tablet de pie, la conversación ocupa toda la pantalla, sin tarjeta, sin
   márgenes ni espacio abajo. El encabezado del Chat se oculta (la conversación trae su propia flecha ‹) y la caja de
   escribir queda pegada abajo. En computador, las dos columnas llegan hasta el borde de abajo. */
.ian-chat.ic-in-thread:not(.ic-wide) > .ic-head { display: none; }
.ian-chat.ic-in-thread:not(.ic-wide) > .ic-body { display: flex; flex-direction: column; padding: 0; overflow: hidden; }
.ian-chat.ic-in-thread:not(.ic-wide) .ic-wrap { flex: 1; display: flex; flex-direction: column; width: 100%; max-width: none; min-height: 0; margin: 0; padding: 0; gap: 0; }
.ian-chat.ic-in-thread:not(.ic-wide) .ic-thread { flex: 1; min-height: 0; border: 0; border-radius: 0; box-shadow: none; }
.ian-chat.ic-in-thread:not(.ic-wide) .ic-thread-head { min-height: 60px; padding: calc(8px + env(safe-area-inset-top)) 8px 8px 6px; }
.ian-chat.ic-in-thread .ic-thread-messages { flex: 1; min-height: 0; max-height: none; padding: 14px 12px 10px; }
.ian-chat.ic-in-thread:not(.ic-wide) .ic-composer { padding: 8px 8px calc(8px + env(safe-area-inset-bottom)); }
.ian-chat.ic-in-thread .ic-message { max-width: min(80%, 520px); }
.ian-chat.ic-wide.ic-chats-tab > .ic-body { display: flex; flex-direction: column; padding-bottom: 0; overflow: hidden; }
.ian-chat.ic-wide.ic-chats-tab .ic-wrap.ic-home { flex: 1; min-height: 0; display: flex; flex-direction: column; padding-bottom: 0; }
.ian-chat.ic-wide.ic-chats-tab .ic-split { flex: 1; min-height: 0; align-items: stretch; }
.ian-chat.ic-wide.ic-chats-tab .ic-split-list { max-height: none; min-height: 0; padding-bottom: 16px; align-content: start; }
.ian-chat.ic-wide.ic-chats-tab .ic-split-chat { position: static; min-height: 0; display: flex; flex-direction: column; }
.ian-chat.ic-wide.ic-chats-tab .ic-split .ic-thread { flex: 1; height: auto; min-height: 0; border-bottom: 0; border-radius: 20px 20px 0 0; }
.ian-chat.ic-wide.ic-chats-tab .ic-split-empty { flex: 1; min-height: 0; border-bottom: 0; border-radius: 20px 20px 0 0; }
.ian-chat.ic-wide.ic-chats-tab .ic-split .ic-composer { padding-bottom: calc(8px + env(safe-area-inset-bottom)); }

/* ---- Fondo de las conversaciones: estilo propio de CuaderNOTE (2026-10-09; solo en este aparato) ----
   Oscuro: verde noche con cuadrícula suave y dibujos de CuaderNOTE (cuaderno con argollas, burbuja de chat, lápiz,
   campanita, bombillo de ideas, estrella, chulito, nota adhesiva, clip) en verde neón tenue.
   Claro: hoja de cuaderno (renglones y margen) con los mismos dibujos en verde.
   Imagen: la foto de la persona con velo ajustable («Opacar»); letras y globos se adaptan solos (data-ic-ink y --ic-tint).
   Los dibujos se desplazan más despacio que los mensajes al pasarlos (--ic-par, src/chat.js → onThreadScroll). */
:root { --ic-doodle-dark: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'280'%20height%3D'280'%20viewBox%3D'0%200%20280%20280'%3E%3Cg%20fill%3D'none'%20stroke%3D'%2300ff66'%20stroke-opacity%3D'.12'%20stroke-width%3D'2.2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Crect%20x%3D'30'%20y%3D'22'%20width%3D'38'%20height%3D'48'%20rx%3D'6'%2F%3E%3Ccircle%20cx%3D'30'%20cy%3D'32'%20r%3D'3.5'%2F%3E%3Ccircle%20cx%3D'30'%20cy%3D'42'%20r%3D'3.5'%2F%3E%3Ccircle%20cx%3D'30'%20cy%3D'52'%20r%3D'3.5'%2F%3E%3Ccircle%20cx%3D'30'%20cy%3D'62'%20r%3D'3.5'%2F%3E%3Cpath%20d%3D'M41%2035h19M41%2044h19M41%2053h12'%2F%3E%3Cpath%20d%3D'M166%2026h46a10%2010%200%200%201%2010%2010v20a10%2010%200%200%201-10%2010h-30l-12%2010v-10h-4a10%2010%200%200%201-10-10V36a10%2010%200%200%201%2010-10z'%2F%3E%3Cpath%20d%3D'M92%20170l44-44%2012%2012-44%2044-16%204z'%2F%3E%3Cpath%20d%3D'M128%20134l12%2012'%2F%3E%3Cpath%20d%3D'M212%20162h32l-4-6v-12a12%2012%200%200%200-24%200v12z'%2F%3E%3Cpath%20d%3D'M223%20168h10'%2F%3E%3Cpath%20d%3D'M40%20104a14%2014%200%200%201%208%2025.5V136H32v-6.5A14%2014%200%200%201%2040%20104z'%2F%3E%3Cpath%20d%3D'M34%20142h12'%2F%3E%3Cpath%20d%3D'M52%20192l4%2011%2011%204-11%204-4%2011-4-11-11-4%2011-4z'%2F%3E%3Ccircle%20cx%3D'160'%20cy%3D'214'%20r%3D'14'%2F%3E%3Cpath%20d%3D'M153%20214l5%205%209-9'%2F%3E%3Cpath%20d%3D'M222%20200h28v20l-8%208h-20z'%2F%3E%3Cpath%20d%3D'M250%20220h-8v8'%2F%3E%3Cpath%20d%3D'M252%20100V68a8%208%200%200%200-16%200v30a5%205%200%200%200%2010%200V72'%2F%3E%3Cpath%20d%3D'M118%2052v12M112%2058h12M262%20250v10M257%20255h10M96%20236v8M92%20240h8'%2F%3E%3C%2Fg%3E%3Cg%20fill%3D'%2300ff66'%20fill-opacity%3D'.12'%3E%3Ccircle%20cx%3D'178'%20cy%3D'46'%20r%3D'3'%2F%3E%3Ccircle%20cx%3D'189'%20cy%3D'46'%20r%3D'3'%2F%3E%3Ccircle%20cx%3D'200'%20cy%3D'46'%20r%3D'3'%2F%3E%3Ccircle%20cx%3D'132'%20cy%3D'250'%20r%3D'2.5'%2F%3E%3Ccircle%20cx%3D'20'%20cy%3D'160'%20r%3D'2'%2F%3E%3Ccircle%20cx%3D'200'%20cy%3D'92'%20r%3D'2'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); --ic-doodle-light: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'280'%20height%3D'280'%20viewBox%3D'0%200%20280%20280'%3E%3Cg%20fill%3D'none'%20stroke%3D'%230a9a4f'%20stroke-opacity%3D'.16'%20stroke-width%3D'2.2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Crect%20x%3D'30'%20y%3D'22'%20width%3D'38'%20height%3D'48'%20rx%3D'6'%2F%3E%3Ccircle%20cx%3D'30'%20cy%3D'32'%20r%3D'3.5'%2F%3E%3Ccircle%20cx%3D'30'%20cy%3D'42'%20r%3D'3.5'%2F%3E%3Ccircle%20cx%3D'30'%20cy%3D'52'%20r%3D'3.5'%2F%3E%3Ccircle%20cx%3D'30'%20cy%3D'62'%20r%3D'3.5'%2F%3E%3Cpath%20d%3D'M41%2035h19M41%2044h19M41%2053h12'%2F%3E%3Cpath%20d%3D'M166%2026h46a10%2010%200%200%201%2010%2010v20a10%2010%200%200%201-10%2010h-30l-12%2010v-10h-4a10%2010%200%200%201-10-10V36a10%2010%200%200%201%2010-10z'%2F%3E%3Cpath%20d%3D'M92%20170l44-44%2012%2012-44%2044-16%204z'%2F%3E%3Cpath%20d%3D'M128%20134l12%2012'%2F%3E%3Cpath%20d%3D'M212%20162h32l-4-6v-12a12%2012%200%200%200-24%200v12z'%2F%3E%3Cpath%20d%3D'M223%20168h10'%2F%3E%3Cpath%20d%3D'M40%20104a14%2014%200%200%201%208%2025.5V136H32v-6.5A14%2014%200%200%201%2040%20104z'%2F%3E%3Cpath%20d%3D'M34%20142h12'%2F%3E%3Cpath%20d%3D'M52%20192l4%2011%2011%204-11%204-4%2011-4-11-11-4%2011-4z'%2F%3E%3Ccircle%20cx%3D'160'%20cy%3D'214'%20r%3D'14'%2F%3E%3Cpath%20d%3D'M153%20214l5%205%209-9'%2F%3E%3Cpath%20d%3D'M222%20200h28v20l-8%208h-20z'%2F%3E%3Cpath%20d%3D'M250%20220h-8v8'%2F%3E%3Cpath%20d%3D'M252%20100V68a8%208%200%200%200-16%200v30a5%205%200%200%200%2010%200V72'%2F%3E%3Cpath%20d%3D'M118%2052v12M112%2058h12M262%20250v10M257%20255h10M96%20236v8M92%20240h8'%2F%3E%3C%2Fg%3E%3Cg%20fill%3D'%230a9a4f'%20fill-opacity%3D'.16'%3E%3Ccircle%20cx%3D'178'%20cy%3D'46'%20r%3D'3'%2F%3E%3Ccircle%20cx%3D'189'%20cy%3D'46'%20r%3D'3'%2F%3E%3Ccircle%20cx%3D'200'%20cy%3D'46'%20r%3D'3'%2F%3E%3Ccircle%20cx%3D'132'%20cy%3D'250'%20r%3D'2.5'%2F%3E%3Ccircle%20cx%3D'20'%20cy%3D'160'%20r%3D'2'%2F%3E%3Ccircle%20cx%3D'200'%20cy%3D'92'%20r%3D'2'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); }

/* Selector de fondo: tres opciones separadas y, con Imagen, el control para opacarla */
.ian-chat .ic-wall-picker { flex: none; display: grid; gap: 10px; padding: 10px 12px 12px; border-bottom: 1px solid rgba(255, 255, 255, .06); background: rgba(10, 38, 28, .98); }
.ian-chat .ic-wall-picker-head { display: flex; align-items: center; gap: 8px; }
.ian-chat .ic-wall-picker-head b { font-size: 14px; }
.ian-chat .ic-wall-picker-head small { flex: 1; color: var(--ic-muted); font-size: 12px; }
.ian-chat .ic-wall-picker-head .ic-icon { width: 34px; height: 34px; border-radius: 12px; }
.ian-chat .ic-wall-choices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; max-width: 420px; }
.ian-chat .ic-wall-choice { display: grid; justify-items: center; gap: 6px; padding: 8px 6px; border: 1px solid var(--ic-line); border-radius: 16px; background: transparent; color: var(--ic-text); font: 700 12.5px Manrope, Roboto, system-ui, sans-serif; text-align: center; cursor: pointer; }
.ian-chat .ic-wall-choice i { position: relative; overflow: hidden; display: grid; place-items: center; width: 100%; max-width: 86px; aspect-ratio: 3 / 4; border: 1px solid rgba(255, 255, 255, .12); border-radius: 12px; background-color: #0a2219; background-position: center; background-size: cover; color: var(--ic-muted); }
.ian-chat .ic-wall-choice.is-dark i { background-color: #04140e; background-image: var(--ic-doodle-dark), radial-gradient(circle at 20% 10%, rgba(0, 255, 102, .16), transparent 55%); background-size: 140px 140px, 100% 100%; background-position: center, 0 0; background-repeat: repeat, no-repeat; }
.ian-chat .ic-wall-choice.is-light i { border-color: rgba(0, 0, 0, .08); background-color: #f7faf5; background-image: var(--ic-doodle-light), linear-gradient(transparent 15px, rgba(0, 150, 75, .14) 15px 16px); background-size: 140px 140px, 100% 16px; background-position: center, 0 0; background-repeat: repeat, repeat; }
.ian-chat .ic-wall-choice.is-dark i::before, .ian-chat .ic-wall-choice.is-light i::before,
.ian-chat .ic-wall-choice.is-dark i::after, .ian-chat .ic-wall-choice.is-light i::after { content: ""; position: absolute; width: 56%; height: 13%; border-radius: 6px; }
.ian-chat .ic-wall-choice.is-dark i::before, .ian-chat .ic-wall-choice.is-light i::before { left: 9%; top: 26%; }
.ian-chat .ic-wall-choice.is-dark i::after, .ian-chat .ic-wall-choice.is-light i::after { right: 9%; top: 52%; }
.ian-chat .ic-wall-choice.is-dark i::before { background: #11382b; }
.ian-chat .ic-wall-choice.is-dark i::after { background: #135338; box-shadow: 0 0 0 1px rgba(0, 255, 102, .35); }
.ian-chat .ic-wall-choice.is-light i::before { background: #ffffff; box-shadow: 0 0 0 1px #dde9e1; }
.ian-chat .ic-wall-choice.is-light i::after { background: #dafbe6; box-shadow: 0 0 0 1px rgba(0, 200, 90, .4); }
.ian-chat .ic-wall-choice[aria-pressed="true"], .ian-chat .ic-wall-choice[data-on] { border-color: var(--ic-accent); background: rgba(0, 255, 102, .1); color: var(--ic-accent); }
.ian-chat .ic-wall-choice input[hidden] { display: none; }
.ian-chat .ic-wall-adjust { display: grid; gap: 8px; max-width: 420px; padding: 10px 12px; border: 1px solid var(--ic-line); border-radius: 16px; background: rgba(0, 0, 0, .18); }
.ian-chat .ic-wall-adjust-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 13px; }
.ian-chat .ic-wall-adjust-top span { color: var(--ic-accent); font-weight: 800; }
.ian-chat .ic-wall-adjust input[type="range"] { width: 100%; min-height: 28px; padding: 0; border: 0; background: transparent; box-shadow: none; accent-color: var(--ic-accent); }
.ian-chat .ic-wall-steps { display: flex; flex-wrap: wrap; gap: 6px; }
.ian-chat .ic-wall-steps button { min-height: 32px; padding: 0 12px; border: 1px solid var(--ic-line); border-radius: 999px; background: transparent; color: inherit; font: 700 12px Manrope, Roboto, system-ui, sans-serif; cursor: pointer; }
.ian-chat .ic-wall-steps button[aria-pressed="true"] { border-color: var(--ic-accent); background: rgba(0, 255, 102, .12); color: var(--ic-accent); }
.ian-chat .ic-wall-adjust small, .ian-chat .ic-wall-note { color: var(--ic-muted); font-size: 12px; }

/* Oscuro CuaderNOTE */
.ian-chat[data-ic-theme="dark"] .ic-thread-messages {
  background-color: #04140e;
  background-image: var(--ic-doodle-dark),
    linear-gradient(rgba(0, 255, 102, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 255, 102, .035) 1px, transparent 1px),
    radial-gradient(circle at 15% 6%, rgba(0, 255, 102, .09), transparent 34%),
    radial-gradient(circle at 88% 92%, rgba(0, 255, 102, .06), transparent 40%),
    linear-gradient(#04140e, #072019);
  background-size: 280px 280px, 28px 28px, 28px 28px, 100% 100%, 100% 100%, 100% 100%;
  background-position: center var(--ic-par, 0px), 0 var(--ic-par, 0px), 0 var(--ic-par, 0px), 0 0, 0 0, 0 0;
  background-repeat: repeat, repeat, repeat, no-repeat, no-repeat, no-repeat;
}

/* Claro CuaderNOTE: hoja de cuaderno */
.ian-chat[data-ic-theme="light"] .ic-thread { border-color: #d5e6db; background: #ffffff; }
.ian-chat[data-ic-theme="light"] .ic-thread-head { border-bottom-color: #dbeee2; background: #ffffff; }
.ian-chat[data-ic-theme="light"] .ic-thread-head .ic-icon { background: #eef6f1; color: #1b4a36; }
.ian-chat[data-ic-theme="light"] .ic-thread-head .ic-icon:hover { background: #e0efe6; }
.ian-chat[data-ic-theme="light"] .ic-thread-person { color: #10231a; }
.ian-chat[data-ic-theme="light"] .ic-thread-person small { color: #557566; }
.ian-chat[data-ic-theme="light"] .ic-thread-messages {
  background-color: #f7faf5;
  background-image: var(--ic-doodle-light),
    linear-gradient(90deg, transparent 22px, rgba(255, 107, 107, .3) 22px, rgba(255, 107, 107, .3) 23.5px, transparent 23.5px),
    linear-gradient(transparent 31px, rgba(0, 150, 75, .09) 31px 32px);
  background-size: 280px 280px, 100% 100%, 100% 32px;
  background-position: center var(--ic-par, 0px), 0 0, 0 var(--ic-par, 0px);
  background-repeat: repeat, no-repeat, repeat;
}
.ian-chat[data-ic-theme="light"] .ic-message { border-color: #dde9e1; background: #ffffff; color: #10231a; box-shadow: 0 1px 2px rgba(10, 70, 40, .08); }
.ian-chat[data-ic-theme="light"] .ic-message.mine { border-color: rgba(0, 200, 90, .4); background: #dafbe6; color: #0b2a1b; }
.ian-chat[data-ic-theme="light"] .ic-message-meta { color: rgba(16, 35, 26, .55); }
.ian-chat[data-ic-theme="light"] .ic-delivery { color: #8aa597; }
.ian-chat[data-ic-theme="light"] .ic-delivery.read { color: #00b552; }
.ian-chat[data-ic-theme="light"] .ic-quote { background: rgba(0, 150, 75, .07); }
.ian-chat[data-ic-theme="light"] .ic-quote b { color: #00843a; }
.ian-chat[data-ic-theme="light"] .ic-quote span { color: #4c6b5d; }
.ian-chat[data-ic-theme="light"] .ic-reactions button { border-color: #dbe7df; background: #ffffff; color: #10231a; }
.ian-chat[data-ic-theme="light"] .ic-message-actions button { background: rgba(0, 120, 60, .07); color: #3f6253; }
.ian-chat[data-ic-theme="light"] .ic-message-confirm { border-top-color: rgba(0, 0, 0, .1); }
.ian-chat[data-ic-theme="light"] .ic-message-confirm button { border-color: #cfe3d6; color: #10231a; }
.ian-chat[data-ic-theme="light"] .ic-voice small, .ian-chat[data-ic-theme="light"] .ic-thread-loading { color: #557566; }
.ian-chat[data-ic-theme="light"] .ic-thread-messages .ic-chat-empty { border-color: #cfe3d6; background: rgba(255, 255, 255, .88); color: #10231a; }
.ian-chat[data-ic-theme="light"] .ic-thread-messages .ic-chat-empty span { color: #557566; }
.ian-chat[data-ic-theme="light"] .ic-older { color: #00843a; }
.ian-chat[data-ic-theme="light"] .ic-contact-card { border-bottom-color: #dbeee2; background: #e9f8ef; }
.ian-chat[data-ic-theme="light"] .ic-contact-card b { color: #00843a; }
.ian-chat[data-ic-theme="light"] .ic-contact-card span { color: #4c6b5d; }
.ian-chat[data-ic-theme="light"] .ic-composer { border-top-color: #dbeee2; background: #ffffff; }
.ian-chat[data-ic-theme="light"] .ic-compose-row textarea { border-color: #cfe3d6; background: #f2f8f4; color: #10231a; }
.ian-chat[data-ic-theme="light"] .ic-compose-row textarea::placeholder { color: #7f998c; }
.ian-chat[data-ic-theme="light"] .ic-emoji-btn { color: #557566; }
.ian-chat[data-ic-theme="light"] .ic-mic { border-color: #cfe3d6; background: #ffffff; color: #1b4a36; }
.ian-chat[data-ic-theme="light"] .ic-compose-context { background: #e3f7ea; }
.ian-chat[data-ic-theme="light"] .ic-compose-context small, .ian-chat[data-ic-theme="light"] .ic-compose-context button { color: #4c6b5d; }
.ian-chat[data-ic-theme="light"] .ic-recording span { color: #557566; }
.ian-chat[data-ic-theme="light"] .ic-wall-picker { border-bottom-color: #dbeee2; background: #ffffff; color: #10231a; }
.ian-chat[data-ic-theme="light"] .ic-wall-picker-head small, .ian-chat[data-ic-theme="light"] .ic-wall-picker .ic-wall-note { color: #557566; }
.ian-chat[data-ic-theme="light"] .ic-wall-picker .ic-icon { background: #eef6f1; color: #1b4a36; }
.ian-chat[data-ic-theme="light"] .ic-wall-picker .ic-wall-choice { border-color: #cfe3d6; color: #10231a; }
.ian-chat[data-ic-theme="light"] .ic-wall-picker .ic-wall-choice[aria-pressed="true"] { border-color: #00b552; background: #e3f7ea; color: #00843a; }

/* Imagen propia: la foto con su velo; marco (encabezado y caja de escribir) teñido con el color de la foto */
.ian-chat[data-ic-theme="image"] .ic-thread { background: #0b1233; }
.ian-chat[data-ic-theme="image"] .ic-thread-messages { background: linear-gradient(var(--ic-veil), var(--ic-veil)), var(--ic-wall) center / cover no-repeat; }
.ian-chat[data-ic-theme="image"] .ic-quote { border-left-color: var(--ic-tint); }
/* Foto oscura (o opacada hacia oscuro): globos oscuros y letras claras */
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-thread-head,
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-composer,
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-wall-picker { border-color: color-mix(in srgb, var(--ic-tint) 30%, transparent); background: color-mix(in srgb, var(--ic-tint) 20%, #131c45); color: #f3fff8; }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-thread-person { color: #f3fff8; }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-thread-person small, .ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-wall-picker-head small { color: rgba(243, 255, 248, .72); }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-thread-head .ic-icon, .ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-wall-picker .ic-icon { background: rgba(255, 255, 255, .1); color: #f3fff8; }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-message { border-color: rgba(255, 255, 255, .08); background: rgba(5, 16, 12, .84); color: #f3fff8; }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-message.mine { border-color: color-mix(in srgb, var(--ic-tint) 55%, transparent); background: color-mix(in srgb, var(--ic-tint) 40%, #121b43); color: #ffffff; }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-message-meta { color: rgba(243, 255, 248, .7); }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-delivery { color: rgba(243, 255, 248, .6); }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-delivery.read { color: color-mix(in srgb, var(--ic-tint) 60%, #ffffff); }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-quote { background: rgba(0, 0, 0, .25); }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-quote b { color: color-mix(in srgb, var(--ic-tint) 60%, #ffffff); }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-quote span { color: rgba(243, 255, 248, .75); }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-message-actions button { background: rgba(255, 255, 255, .1); color: rgba(243, 255, 248, .85); }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-reactions button { border-color: rgba(255, 255, 255, .12); background: rgba(0, 0, 0, .3); color: #ffffff; }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-compose-row textarea { border-color: rgba(255, 255, 255, .16); background: rgba(0, 0, 0, .28); color: #f3fff8; }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-compose-row textarea::placeholder { color: rgba(243, 255, 248, .55); }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-emoji-btn { color: rgba(243, 255, 248, .8); }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-mic { border-color: rgba(255, 255, 255, .16); background: rgba(0, 0, 0, .25); color: #f3fff8; }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-thread-messages .ic-chat-empty { border-color: rgba(255, 255, 255, .15); background: rgba(5, 16, 12, .8); color: #f3fff8; }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-thread-messages .ic-chat-empty span { color: rgba(243, 255, 248, .75); }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-wall-picker .ic-wall-choice { border-color: rgba(255, 255, 255, .18); color: #f3fff8; }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-wall-picker .ic-wall-choice[data-on] { border-color: var(--ic-tint); background: rgba(255, 255, 255, .08); color: color-mix(in srgb, var(--ic-tint) 60%, #ffffff); }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-wall-picker .ic-wall-adjust { border-color: rgba(255, 255, 255, .14); background: rgba(0, 0, 0, .22); }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-wall-picker .ic-wall-adjust small { color: rgba(243, 255, 248, .72); }
/* Foto clara (o opacada hacia claro): globos claros y letras oscuras */
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-thread-head,
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-composer,
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-wall-picker { border-color: color-mix(in srgb, var(--ic-tint) 25%, #d9e3dd); background: color-mix(in srgb, var(--ic-tint) 12%, #ffffff); color: #10201a; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-thread-person { color: #10201a; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-thread-person small, .ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-wall-picker-head small { color: #4a6357; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-thread-head .ic-icon, .ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-wall-picker .ic-icon { background: rgba(0, 0, 0, .06); color: #10201a; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-message { border-color: rgba(0, 0, 0, .06); background: rgba(255, 255, 255, .9); color: #10201a; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-message.mine { border-color: color-mix(in srgb, var(--ic-tint) 45%, transparent); background: color-mix(in srgb, var(--ic-tint) 26%, #ffffff); color: #15204b; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-message-meta { color: rgba(16, 32, 26, .6); }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-delivery { color: rgba(16, 32, 26, .5); }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-delivery.read { color: color-mix(in srgb, var(--ic-tint) 70%, #0b1233); }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-quote { background: rgba(0, 0, 0, .05); }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-quote b { color: color-mix(in srgb, var(--ic-tint) 70%, #0b1233); }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-quote span { color: #4a6357; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-message-actions button { background: rgba(0, 0, 0, .06); color: #3d5449; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-reactions button { border-color: rgba(0, 0, 0, .1); background: #ffffff; color: #10201a; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-compose-row textarea { border-color: rgba(0, 0, 0, .12); background: #ffffff; color: #10201a; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-compose-row textarea::placeholder { color: #7a8f85; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-emoji-btn { color: #4a6357; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-mic { border-color: rgba(0, 0, 0, .12); background: #ffffff; color: #10201a; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-thread-messages .ic-chat-empty { border-color: rgba(0, 0, 0, .1); background: rgba(255, 255, 255, .88); color: #10201a; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-thread-messages .ic-chat-empty span { color: #4a6357; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-wall-picker .ic-wall-choice { border-color: rgba(0, 0, 0, .14); color: #10201a; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-wall-picker .ic-wall-choice[data-on] { border-color: color-mix(in srgb, var(--ic-tint) 70%, #0b1233); background: rgba(255, 255, 255, .6); color: color-mix(in srgb, var(--ic-tint) 70%, #0b1233); }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-wall-picker .ic-wall-adjust { border-color: rgba(0, 0, 0, .1); background: rgba(255, 255, 255, .6); }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-wall-picker .ic-wall-adjust small { color: #4a6357; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-wall-picker .ic-wall-adjust-top span,
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-wall-picker .ic-wall-steps button[aria-pressed="true"] { border-color: color-mix(in srgb, var(--ic-tint) 70%, #0b1233); color: color-mix(in srgb, var(--ic-tint) 70%, #0b1233); }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-wall-picker .ic-wall-steps button { border-color: rgba(0, 0, 0, .14); }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-wall-picker .ic-wall-adjust input[type="range"] { accent-color: color-mix(in srgb, var(--ic-tint) 70%, #0b1233); }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-wall-picker .ic-wall-adjust-top span,
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-wall-picker .ic-wall-steps button[aria-pressed="true"] { border-color: var(--ic-tint); background: rgba(255, 255, 255, .08); color: color-mix(in srgb, var(--ic-tint) 60%, #ffffff); }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-wall-picker .ic-wall-steps button { border-color: rgba(255, 255, 255, .18); }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-wall-picker .ic-wall-adjust input[type="range"] { accent-color: var(--ic-tint); }
@media (prefers-reduced-motion: reduce) { .ian-chat .ic-thread-messages { --ic-par: 0px !important; } }

/* ---- 📌 y 🔕 junto al nombre, ficha «Información del contacto» y acceso a Configuración (2026-10-09) ---- */
.ian-chat .ic-thread-person b { display: flex; align-items: center; gap: 5px; min-width: 0; }
.ian-chat .ic-thread-person b > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ian-chat .ic-flag { flex: none; display: inline-grid; place-items: center; margin-left: 4px; color: var(--ic-accent); font-style: normal; }
.ian-chat .ic-flag svg { width: 14px; height: 14px; }
.ian-chat .ic-contact-sheet { flex: none; display: grid; gap: 8px; padding: 12px; border-bottom: 1px solid rgba(255, 255, 255, .06); background: rgba(10, 38, 28, .98); color: var(--ic-text); }
.ian-chat .ic-contact-sheet-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ian-chat .ic-contact-sheet-head .ic-icon { width: 34px; height: 34px; border-radius: 12px; }
.ian-chat .ic-contact-sheet-who { display: flex; align-items: center; gap: 10px; }
.ian-chat .ic-contact-sheet-who > span { display: grid; gap: 1px; min-width: 0; }
.ian-chat .ic-contact-sheet-who small { color: var(--ic-muted); }
.ian-chat .ic-contact-sheet-row { display: flex; align-items: center; gap: 10px; padding-top: 8px; border-top: 1px solid rgba(255, 255, 255, .06); }
.ian-chat .ic-contact-sheet-row > span { flex: 1; min-width: 0; display: grid; gap: 2px; }
.ian-chat .ic-contact-sheet-row b { display: inline-flex; align-items: center; gap: 6px; }
.ian-chat .ic-contact-sheet-row b svg { width: 15px; height: 15px; color: var(--ic-accent); }
.ian-chat .ic-contact-sheet-row small { color: var(--ic-muted); font-size: 12.5px; }
.ian-chat .ic-contact-sheet-row .ic-secondary { flex: none; width: auto; min-height: 38px; padding: 0 14px; }
.ian-chat .ic-go-settings { grid-template-columns: auto minmax(0, 1fr); align-items: center; }
.ian-chat .ic-go-settings > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 14px; background: rgba(0, 255, 102, .1); color: var(--ic-accent); }
.ian-chat .ic-go-settings p { margin: 3px 0 0; color: var(--ic-muted); font-size: 13px; }
.ian-chat .ic-go-settings > button { grid-column: 1 / -1; }
/* La ficha del contacto y las marcas 📌/🔕 se adaptan al fondo elegido (Claro o Imagen) */
.ian-chat[data-ic-theme="light"] .ic-contact-sheet { border-bottom-color: #dbeee2; background: #ffffff; color: #10231a; }
.ian-chat[data-ic-theme="light"] .ic-contact-sheet-who small, .ian-chat[data-ic-theme="light"] .ic-contact-sheet-row small:not(.ic-status-expiry) { color: #557566; }
.ian-chat[data-ic-theme="light"] .ic-contact-sheet-row { border-top-color: #e6efe9; }
.ian-chat[data-ic-theme="light"] .ic-contact-sheet .ic-icon { background: #eef6f1; color: #1b4a36; }
.ian-chat[data-ic-theme="light"] .ic-contact-sheet .ic-secondary { border-color: #cfe3d6; color: #10231a; }
.ian-chat[data-ic-theme="light"] .ic-flag, .ian-chat[data-ic-theme="light"] .ic-contact-sheet-row b svg { color: #00a650; }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-contact-sheet { border-bottom-color: color-mix(in srgb, var(--ic-tint) 30%, transparent); background: color-mix(in srgb, var(--ic-tint) 20%, #131c45); }
.ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-flag, .ian-chat[data-ic-theme="image"][data-ic-ink="light"] .ic-contact-sheet-row b svg { color: color-mix(in srgb, var(--ic-tint) 60%, #ffffff); }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-contact-sheet { border-bottom-color: color-mix(in srgb, var(--ic-tint) 25%, #d9e3dd); background: color-mix(in srgb, var(--ic-tint) 12%, #ffffff); color: #10201a; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-contact-sheet-who small, .ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-contact-sheet-row small:not(.ic-status-expiry) { color: #4a6357; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-contact-sheet .ic-icon { background: rgba(0, 0, 0, .06); color: #10201a; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-contact-sheet .ic-secondary { border-color: rgba(0, 0, 0, .14); color: #10201a; }
.ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-flag, .ian-chat[data-ic-theme="image"][data-ic-ink="dark"] .ic-contact-sheet-row b svg { color: color-mix(in srgb, var(--ic-tint) 70%, #0b1233); }


/* ---- Menú de un mensaje (2026-10-10, pedido de Edilberto) ----
   Los botones ya no van debajo de cada mensaje: dejar presionado (celular), clic derecho o ⌄ (computador) abre una
   tarjeta con estilo CuaderNOTE: argollas de cuaderno arriba, reacciones rápidas y Responder, Copiar, Editar y Borrar.
   El mensaje elegido se resalta y los demás se atenúan. */
.ian-chat .ic-message { -webkit-touch-callout: none; transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease; }
@media (hover: none) { .ian-chat .ic-message { -webkit-user-select: none; user-select: none; } }
.ian-chat .ic-msg-more { position: absolute; top: 4px; right: 4px; display: grid; place-items: center; width: 26px; height: 26px; padding: 0; border: 0; border-radius: 9px; background: rgba(0, 0, 0, .28); color: inherit; opacity: 0; cursor: pointer; transition: opacity .15s ease; }
.ian-chat .ic-message:hover .ic-msg-more, .ian-chat .ic-msg-more:focus-visible { opacity: 1; }
@media (hover: none) { .ian-chat .ic-msg-more { display: none; } }
.ian-chat .has-picked .ic-message:not(.is-picked) { opacity: .4; }
.ian-chat .ic-message.is-picked { z-index: 1; transform: scale(1.02); box-shadow: 0 0 0 2px var(--ic-accent), 0 12px 28px rgba(0, 0, 0, .35); }
.ian-chat .ic-msg-catcher { position: absolute; inset: 0; z-index: 40; background: rgba(0, 0, 0, .18); }
.ian-chat .ic-msg-menu { position: absolute; z-index: 41; display: grid; gap: 2px; padding: 16px 8px 8px; border: 1px solid rgba(0, 255, 102, .35); border-radius: 20px; background: rgba(8, 28, 21, .97); color: var(--ic-text); box-shadow: 0 20px 48px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .06); animation: ic-menu-in .16s ease-out; }
@keyframes ic-menu-in { from { opacity: 0; transform: translateY(6px) scale(.97); } to { opacity: 1; transform: none; } }
.ian-chat .ic-msg-menu-rings { position: absolute; top: -8px; left: 22px; right: 22px; display: flex; justify-content: space-between; pointer-events: none; }
.ian-chat .ic-msg-menu-rings i { width: 6px; height: 17px; border-radius: 4px; background: linear-gradient(90deg, #0a8f45, #8dffbd 45%, #00b84b); box-shadow: 0 1px 2px rgba(0, 0, 0, .5); }
.ian-chat .ic-msg-react { display: flex; align-items: center; justify-content: space-between; gap: 2px; margin: 0 0 6px; padding: 5px; border: 1px solid rgba(255, 255, 255, .08); border-radius: 999px; background: rgba(0, 0, 0, .25); }
.ian-chat .ic-msg-react button { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: transparent; font-size: 21px; line-height: 1; cursor: pointer; transition: transform .12s ease, background .12s ease; }
.ian-chat .ic-msg-react button:hover { transform: scale(1.18); background: rgba(255, 255, 255, .08); }
.ian-chat .ic-msg-react button[aria-pressed="true"] { background: rgba(0, 255, 102, .16); box-shadow: inset 0 0 0 2px var(--ic-accent); }
.ian-chat .ic-msg-react .ic-msg-react-more { color: var(--ic-accent); font-size: 20px; font-weight: 800; }
.ian-chat .ic-msg-menu > button { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 44px; padding: 0 12px; border: 0; border-radius: 12px; background: transparent; color: inherit; font: 600 14px Manrope, Roboto, system-ui, sans-serif; text-align: left; cursor: pointer; }
.ian-chat .ic-msg-menu > button svg { flex: none; color: var(--ic-accent); }
.ian-chat .ic-msg-menu > button:hover, .ian-chat .ic-msg-menu > button:focus-visible { background: rgba(0, 255, 102, .1); outline: none; }
.ian-chat .ic-msg-menu > button.is-danger, .ian-chat .ic-msg-menu > button.is-danger svg { color: #ff8a7a; }
.ian-chat .ic-msg-menu-info { margin: 4px 12px 2px; padding-top: 8px; border-top: 1px solid rgba(255, 255, 255, .08); color: var(--ic-muted); font-size: 11.5px; }
/* Fondo Claro: tarjeta blanca de cuaderno */
.ian-chat[data-ic-theme="light"] .ic-msg-catcher { background: rgba(10, 40, 25, .12); }
.ian-chat[data-ic-theme="light"] .ic-msg-menu { border-color: #bfe8cf; background: #ffffff; color: #10231a; box-shadow: 0 18px 40px rgba(10, 60, 30, .18); }
.ian-chat[data-ic-theme="light"] .ic-msg-menu-rings i { background: linear-gradient(90deg, #7d9c8c, #e9f3ee 45%, #9db6a9); }
.ian-chat[data-ic-theme="light"] .ic-msg-react { border-color: #e1ece5; background: #f2f8f4; }
.ian-chat[data-ic-theme="light"] .ic-msg-react button:hover { background: #e3f4e8; }
.ian-chat[data-ic-theme="light"] .ic-msg-menu > button svg, .ian-chat[data-ic-theme="light"] .ic-msg-react .ic-msg-react-more { color: #00a650; }
.ian-chat[data-ic-theme="light"] .ic-msg-menu > button:hover, .ian-chat[data-ic-theme="light"] .ic-msg-menu > button:focus-visible { background: #e9f8ef; }
.ian-chat[data-ic-theme="light"] .ic-msg-menu > button.is-danger, .ian-chat[data-ic-theme="light"] .ic-msg-menu > button.is-danger svg { color: #d4402c; }
.ian-chat[data-ic-theme="light"] .ic-msg-menu-info { border-top-color: #e6efe9; color: #557566; }
.ian-chat[data-ic-theme="light"] .ic-message.is-picked { box-shadow: 0 0 0 2px #00b552, 0 10px 24px rgba(10, 60, 30, .18); }
.ian-chat[data-ic-theme="light"] .ic-msg-more { background: rgba(0, 0, 0, .08); }
/* Imagen propia: el borde y las argollas toman el color de la foto */
.ian-chat[data-ic-theme="image"] .ic-msg-menu { border-color: color-mix(in srgb, var(--ic-tint) 50%, transparent); }
.ian-chat[data-ic-theme="image"] .ic-msg-menu-rings i { background: linear-gradient(90deg, color-mix(in srgb, var(--ic-tint) 70%, #0b1233), color-mix(in srgb, var(--ic-tint) 35%, #ffffff) 45%, var(--ic-tint)); }
.ian-chat[data-ic-theme="image"] .ic-message.is-picked { box-shadow: 0 0 0 2px var(--ic-tint), 0 12px 28px rgba(0, 0, 0, .35); }
@media (prefers-reduced-motion: reduce) { .ian-chat .ic-msg-menu { animation: none; } .ian-chat .ic-message.is-picked { transform: none; } }


/* ---- Avisos del Back Office (2026-10-10): solo el dueño, en su aparato ----
   Burbuja naranja arriba (para distinguirla de los avisos de mensajes) con «1 persona nueva · 1 reporte nuevo»;
   número naranja en el menú ☰ y junto a «Back Office»; marca «Nuevo» en las listas del panel. */
.ic-owner-bubble { position: fixed; top: calc(70px + env(safe-area-inset-top)); left: 50%; z-index: 10002; transform: translateX(-50%); display: flex; align-items: center; gap: 4px; width: max-content; max-width: min(380px, calc(100vw - 24px)); padding: 4px 4px 4px 6px; border: 1px solid rgba(255, 180, 77, .55); border-radius: 999px; background: rgba(28, 20, 6, .96); color: #ffe7c2; box-shadow: 0 12px 30px rgba(0, 0, 0, .5); font: 600 13px Manrope, Roboto, system-ui, sans-serif; animation: ic-owner-in .35s ease-out; }
@keyframes ic-owner-in { from { opacity: 0; transform: translate(-50%, -10px); } to { opacity: 1; transform: translate(-50%, 0); } }
.ic-owner-bubble-open { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 4px 10px 4px 2px; border: 0; border-radius: 999px; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.ic-owner-bubble-open > span:first-child { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: rgba(255, 180, 77, .18); font-size: 18px; }
.ic-owner-bubble-open > span:last-child { display: grid; min-width: 0; }
.ic-owner-bubble-open b { color: #ffb44d; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
.ic-owner-bubble-open small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13.5px; }
.ic-owner-bubble-close { flex: none; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .08); color: #ffe7c2; cursor: pointer; }
.ian-chat .ic-head-btn .ic-count[data-ic-owner-count] { background: #ff9f1a; color: #1a1205; }
.ian-chat .ic-menu-count { margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px; display: grid; place-items: center; border-radius: 999px; background: #ff9f1a; color: #1a1205; font: 800 11px Manrope, Roboto, system-ui, sans-serif; font-style: normal; }
.ian-chat .ic-menu-count[hidden] { display: none; }
.ian-chat .ic-new-chip { display: inline-flex; margin-left: 6px; padding: 0 7px; border-radius: 999px; background: rgba(255, 159, 26, .18); color: #ffb44d; font: 800 10px/1.7 Manrope, Roboto, system-ui, sans-serif; vertical-align: middle; }
@media (prefers-reduced-motion: reduce) { .ic-owner-bubble { animation: none; } }


/* ---- Modo invitado (2026-10-10): entrar sin cuenta, solo para pruebas y si el dueño lo permite ---- */
.ian-chat .ic-guest { gap: 10px; }
.ian-chat .ic-guest svg { flex: none; }
.ian-chat .ic-guest-card { grid-template-columns: auto minmax(0, 1fr); align-items: center; border-color: rgba(255, 196, 61, .45); background: rgba(40, 30, 6, .55); }
.ian-chat .ic-guest-card > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 14px; background: rgba(255, 196, 61, .14); font-size: 20px; }
.ian-chat .ic-guest-card p { margin: 3px 0 0; color: var(--ic-muted); font-size: 13px; }
.ian-chat .ic-guest-card > button { grid-column: 1 / -1; }