/* Ask Mendoza — o chat virou um telefone (missão 1e).
   Aparelho genérico desenhado do zero; 5 apps/temas; sem logos de marca. */

/* ---------- O aparelho ---------- */
.sheet{position:fixed;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;padding:24px;
  background:rgba(8,5,8,.62);-webkit-backdrop-filter:blur(10px) saturate(1.05);backdrop-filter:blur(10px) saturate(1.05);
  animation:veil .3s ease-out}
.sheet[hidden]{display:none}
@keyframes veil{from{opacity:0}to{opacity:1}}

.phone{position:relative;height:min(780px,calc(100vh - 48px));height:min(780px,calc(100dvh - 48px));aspect-ratio:390/780;max-width:100%;
  --ph-bg:#fff;--ph-ink:#0b0b0f;--ph-muted:#6b6b70;--ph-head:#f7f7f9;--ph-line:#e6e6ea;
  --ph-sent:#0b84ff;--ph-sent-ink:#fff;--ph-recv:#e9e9eb;--ph-recv-ink:#0b0b0f;
  --ph-chip:#fff;--ph-chip-line:#dcdce1;--ph-chip-hover:#f2f2f5;--ph-field:#f2f2f5;--ph-field-line:#e2e2e7;
  --ph-accent:#0b84ff;--ph-send-ink:#fff;--ph-hover:#f0f0f2;--ph-focus:rgba(11,132,255,.18);
  --ph-scroll:#c7c7cc;--ph-stat:#f7f7f9;
  --ph-font:system-ui,"Segoe UI",Roboto,sans-serif;
  animation:phone-in .55s cubic-bezier(.16,1,.3,1) both}
@keyframes phone-in{from{opacity:0;transform:translateY(26px) scale(.975)}to{opacity:1;transform:none}}

.phone-body{position:relative;height:100%;border-radius:52px;background:#0b0b0d;padding:11px;
  box-shadow:0 44px 90px -22px rgba(0,0,0,.85),0 0 0 1px rgba(255,255,255,.14),inset 0 0 0 2px rgba(0,0,0,.65)}
@media (prefers-reduced-motion:no-preference){
  .phone-body{animation:phone-float 7s ease-in-out 1.1s infinite}
}
@keyframes phone-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.phone-body::before,.phone-body::after{content:"";position:absolute;width:3px;border-radius:2px;background:#26262b}
.phone-body::before{left:-3px;top:130px;height:34px;box-shadow:0 52px 0 #26262b}
.phone-body::after{right:-3px;top:160px;height:62px}

.phone-screen{position:relative;height:100%;border-radius:42px;overflow:hidden;isolation:isolate;
  display:flex;flex-direction:column;background:var(--ph-bg);color:var(--ph-ink);
  font-family:var(--ph-font);-webkit-font-smoothing:antialiased}
.phone-screen::before{content:"";position:absolute;left:50%;top:14px;transform:translateX(-50%);z-index:45;
  width:7px;height:7px;border-radius:50%;background:#08080a;box-shadow:0 0 0 1px rgba(0,0,0,.4)}

/* barra de status falsa */
.statusbar{flex:none;height:34px;display:flex;align-items:center;justify-content:space-between;
  padding:0 22px;font-size:11.5px;font-weight:600;letter-spacing:.02em;color:var(--ph-ink);
  background:var(--ph-stat);position:relative;z-index:2}
.st-icons{display:flex;align-items:center;gap:5px}
.st-icons svg{display:block;width:15px;height:11px;fill:currentColor}

/* ---------- App do chat ---------- */
.phone-app{flex:1;min-height:0;display:flex;flex-direction:column;background:var(--ph-bg);color:var(--ph-ink);
  font-family:var(--ph-font);font-size:15px}

.phead{flex:none;display:flex;align-items:center;gap:10px;padding:9px 12px 9px 14px;
  background:var(--ph-head);border-bottom:1px solid var(--ph-line);position:relative;z-index:4}
.p-id{flex:1;min-width:0;display:flex;align-items:center;gap:10px}
.cava{width:38px;height:38px;border-radius:50%;object-fit:cover;flex:none;background:#d9d9de}
.cwho{min-width:0;line-height:1.15}
.cwho b{display:block;font-size:16px;font-weight:650;letter-spacing:-.01em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cwho small{display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--ph-muted);margin-top:2px}
.cwho .on{width:6px;height:6px;border-radius:50%;background:#34c759;flex:none}
.p-actions{display:flex;align-items:center;gap:4px;flex:none}
.ibtn{width:32px;height:32px;border-radius:50%;border:0;background:transparent;color:var(--ph-muted);
  display:grid;place-items:center;transition:background .15s,color .15s;padding:0}
.ibtn:hover{background:var(--ph-hover);color:var(--ph-ink)}
.ibtn svg{width:18px;height:18px}
.ibtn-x{font-size:22px;line-height:1;color:var(--ph-muted)}
.ibtn[hidden]{display:none}
.flowerbadge{display:none;width:17px;height:17px;flex:none}
.flowerbadge svg{width:17px;height:17px;display:block}
.retro-extra{display:none}

/* mensagens */
.log{flex:1;min-height:0;overflow-y:auto;padding:12px 14px 6px;display:flex;flex-direction:column;gap:3px;
  background:var(--ph-bg);overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--ph-scroll) transparent}
.log::-webkit-scrollbar{width:5px}
.log::-webkit-scrollbar-thumb{background:var(--ph-scroll);border-radius:4px}
.day{align-self:center;margin:4px 0 10px;font-size:11px;color:var(--ph-muted);letter-spacing:.02em}
.sys{align-self:center;margin:10px 6px 2px;max-width:34ch;text-align:center;font-size:11px;line-height:1.4;
  color:var(--ph-muted)}
.msg{display:flex;flex-direction:column;margin:2px 0;max-width:100%}
.msg.me{align-items:flex-end}
.msg.bot{align-items:flex-start}
.meta{display:none;font-size:10px;color:var(--ph-muted);margin:0 4px 3px;gap:6px}
.meta b{font-weight:600}
.b{position:relative;max-width:78%;padding:9px 13px;border-radius:19px;line-height:1.35;font-size:15px;
  white-space:pre-wrap;overflow-wrap:anywhere;animation:bubble-in .28s cubic-bezier(.2,.8,.2,1) both}
.msg.bot .b{background:var(--ph-recv);color:var(--ph-recv-ink);border-bottom-left-radius:6px}
.msg.me .b{background:var(--ph-sent);color:var(--ph-sent-ink);border-bottom-right-radius:6px;font-weight:450}
.msg.bot .b::after{content:"";position:absolute;left:-3px;bottom:0;width:9px;height:12px;
  background:var(--ph-recv);border-bottom-right-radius:9px;border-bottom-left-radius:2px}
.msg.me .b::after{content:"";position:absolute;right:-3px;bottom:0;width:9px;height:12px;
  background:var(--ph-sent);border-bottom-left-radius:9px;border-bottom-right-radius:2px}
@keyframes bubble-in{from{opacity:0;transform:translateY(7px) scale(.985)}to{opacity:1;transform:none}}
.receipt{font-size:10px;color:var(--ph-muted);margin:3px 5px 0;letter-spacing:.01em}

/* digitando */
.typingrow{display:flex;margin:2px 0;align-items:flex-start}
.typing{display:inline-flex;align-items:center;gap:4px;padding:11px 13px;border-radius:19px;
  border-bottom-left-radius:6px;background:var(--ph-recv);color:var(--ph-recv-ink)}
.typing .dots{display:inline-flex;gap:4px;align-items:center}
.typing .dots i{width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.5;
  animation:blink 1.1s infinite}
.typing .dots i:nth-child(2){animation-delay:.15s}
.typing .dots i:nth-child(3){animation-delay:.3s}
.typing .word{display:none}
@keyframes blink{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:.9;transform:translateY(-2px)}}

/* sugestões */
.chips{flex:none;display:flex;flex-wrap:wrap;gap:6px;padding:4px 12px 10px;background:var(--ph-bg)}
.chips[hidden]{display:none}
.chipslab{flex-basis:100%;margin:0 0 1px;font-size:10.5px;color:var(--ph-muted);letter-spacing:.02em}
.chips button{text-align:left;background:var(--ph-chip);border:1px solid var(--ph-chip-line);border-radius:999px;
  padding:6px 11px;font-size:12.5px;line-height:1.25;color:var(--ph-ink);max-width:100%;
  transition:background .16s,border-color .16s,transform .1s}
.chips button:hover{background:var(--ph-chip-hover)}
.chips button:active{transform:scale(.98)}

/* campo */
.composer{flex:none;display:flex;align-items:center;gap:8px;padding:8px 10px 10px;
  border-top:1px solid var(--ph-line);background:var(--ph-head)}
.composer input{flex:1;min-width:0;background:var(--ph-field);border:1px solid var(--ph-field-line);
  border-radius:999px;padding:9px 14px;color:var(--ph-ink);font-size:14.5px;outline:none;
  transition:border-color .16s,box-shadow .16s}
.composer input::placeholder{color:var(--ph-muted)}
.composer input:focus{border-color:var(--ph-accent);box-shadow:0 0 0 3px var(--ph-focus)}
.send{width:34px;height:34px;border-radius:50%;border:0;background:var(--ph-accent);color:var(--ph-send-ink);
  display:grid;place-items:center;flex:none;padding:0;transition:filter .14s,transform .12s}
.send:hover{filter:brightness(1.06)}
.send:active{transform:scale(.95)}
.send svg{width:17px;height:17px}
.sendtxt{display:none}

.homebar{flex:none;height:18px;display:grid;place-items:center;background:var(--ph-head)}
.homebar i{width:104px;height:4px;border-radius:3px;background:var(--ph-ink);opacity:.22}

.phone :focus-visible{outline:2px solid var(--ph-accent);outline-offset:2px}
.phone .phead :focus-visible{outline-color:#fff}

/* ---------- Apps / temas ---------- */
.appdrawer{position:absolute;inset:0;z-index:30;display:flex;flex-direction:column;padding:18px 16px;
  background:linear-gradient(180deg,rgba(10,12,18,.5),rgba(10,12,18,.86)),url("/assets/avatar-cordillera.webp") center/cover;
  color:#fff;-webkit-backdrop-filter:blur(10px) saturate(1.1);backdrop-filter:blur(10px) saturate(1.1);
  animation:drawer-in .3s cubic-bezier(.2,.8,.2,1)}
.appdrawer[hidden]{display:none}
@keyframes drawer-in{from{opacity:0;transform:scale(1.02)}to{opacity:1;transform:none}}
.drawer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-top:6px}
.drawer-head b{display:block;font-size:17px;letter-spacing:-.01em}
.drawer-head small{display:block;font-size:12px;opacity:.82;margin-top:3px}
.dclose{width:30px;height:30px;border-radius:50%;border:0;background:rgba(255,255,255,.16);color:#fff;
  font-size:20px;line-height:1;display:grid;place-items:center;flex:none}
.dclose:hover{background:rgba(255,255,255,.26)}
.appgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:20px}
.apptile{display:flex;flex-direction:column;align-items:center;gap:6px;background:transparent;border:0;
  color:#fff;padding:8px 4px;border-radius:16px;transition:background .16s}
.apptile:hover{background:rgba(255,255,255,.1)}
.apptile[aria-pressed="true"]{background:rgba(255,255,255,.14);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.appicon{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;
  background:rgba(255,255,255,.14);box-shadow:0 6px 16px -6px rgba(0,0,0,.6)}
.appicon svg{width:26px;height:26px}
.apptile[data-tema="moderno"] .appicon{background:linear-gradient(145deg,#2f9bff,#0b6fe0)}
.apptile[data-tema="m2003"] .appicon{background:linear-gradient(145deg,#3a93ff,#0a246a)}
.apptile[data-tema="m2009"] .appicon{background:linear-gradient(145deg,#d7e7f5,#4a9bd8)}
.apptile[data-tema="f1999"] .appicon{background:linear-gradient(145deg,#5fb96b,#1f5c2d)}
.apptile[data-tema="f2010"] .appicon{background:linear-gradient(145deg,#8fd99b,#2e8b46)}
.tname{font-size:11px;line-height:1.2;text-align:center;max-width:10ch}
.tinuse{display:none;font-size:9px;text-transform:uppercase;letter-spacing:.08em;opacity:.85}
.apptile[aria-pressed="true"] .tinuse{display:block}
.drawer-note{margin:auto 0 0;font-size:11px;opacity:.72;text-align:center;line-height:1.4}

/* ---------- Tema moderno (padrão) ---------- */
/* as variáveis do topo já são o moderno */

/* ---------- Mensageiro 2003 ---------- */
.phone[data-tema="m2003"]{
  --ph-bg:#ece9d8;--ph-ink:#111;--ph-muted:#5a574c;--ph-head:#0a246a;--ph-line:#0a246a;
  --ph-sent:#e8f0fb;--ph-sent-ink:#000;--ph-recv:#fff;--ph-recv-ink:#000;
  --ph-chip:#ece9d8;--ph-chip-line:#7f7f7f;--ph-chip-hover:#fff;--ph-field:#fff;--ph-field-line:#7f9db9;
  --ph-accent:#0a246a;--ph-send-ink:#000;--ph-hover:rgba(255,255,255,.18);--ph-focus:rgba(10,36,106,.18);
  --ph-scroll:#9a968a;--ph-stat:#ece9d8;--ph-font:Tahoma,"MS Sans Serif","Segoe UI",sans-serif}
.phone[data-tema="m2003"] .phead{background:linear-gradient(180deg,#3a93ff 0%,#0a246a 100%);color:#fff;
  padding:5px 6px;gap:6px;border-bottom:1px solid #06205e;min-height:32px}
.phone[data-tema="m2003"] .cava{display:none}
.phone[data-tema="m2003"] .cwho b{font-size:12px;font-weight:700;color:#fff;text-shadow:0 1px 0 rgba(0,0,0,.4)}
.phone[data-tema="m2003"] .cwho small{display:none}
.phone[data-tema="m2003"] .p-actions{gap:2px}
.phone[data-tema="m2003"] .ibtn{width:19px;height:18px;border-radius:2px;background:#ece9d8;color:#000;
  border:1px solid #fff;border-right-color:#555;border-bottom-color:#555}
.phone[data-tema="m2003"] .ibtn svg{width:13px;height:13px}
.phone[data-tema="m2003"] .ibtn-x{font-size:14px;line-height:1;color:#000}
.phone[data-tema="m2003"] .retro-extra{display:block;background:#ece9d8;border-bottom:1px solid #9a968a}
.phone[data-tema="m2003"] .r-menu{display:flex;gap:12px;padding:2px 8px;font-size:11px;color:#000;
  border-bottom:1px solid #aca899}
.phone[data-tema="m2003"] .r-contacts{display:flex;flex-direction:column;padding:4px 8px 5px;background:#f5f3e8}
.phone[data-tema="m2003"] .rc{display:flex;align-items:center;gap:5px;font-size:11px;color:#333;line-height:1.45}
.phone[data-tema="m2003"] .rc b{font-weight:600}
.phone[data-tema="m2003"] .rc span{color:#666;font-size:10px}
.phone[data-tema="m2003"] .rdot{width:7px;height:7px;border-radius:50%;background:#8a8a8a;flex:none}
.phone[data-tema="m2003"] .rc.on .rdot{background:#2ea44f}
.phone[data-tema="m2003"] .log{background:#fff;border:1px solid #7f9db9;margin:5px;padding:6px 8px;gap:0}
.phone[data-tema="m2003"] .meta{display:flex;font-size:10px;color:#666;margin:5px 0 0}
.phone[data-tema="m2003"] .msg.bot .meta b{color:#003399}
.phone[data-tema="m2003"] .msg.me .meta b{color:#7a0000}
.phone[data-tema="m2003"] .msg.me .meta{justify-content:flex-end}
.phone[data-tema="m2003"] .b{max-width:100%;padding:0;border-radius:0;background:transparent!important;
  color:#000!important;font-size:12px;line-height:1.4;font-weight:400}
.phone[data-tema="m2003"] .b::after{display:none}
.phone[data-tema="m2003"] .receipt{font-size:10px}
.phone[data-tema="m2003"] .typingrow .typing{background:transparent;padding:0;border-radius:0}
.phone[data-tema="m2003"] .typing .dots{display:none}
.phone[data-tema="m2003"] .typing .word{display:inline;font-size:11px;font-style:italic;color:#555}
.phone[data-tema="m2003"] .chips{background:#ece9d8;padding:4px 8px 6px}
.phone[data-tema="m2003"] .chips button{background:#ece9d8;border:2px outset #fff;border-radius:0;
  font-size:11px;padding:2px 6px}
.phone[data-tema="m2003"] .composer{background:#ece9d8;border-top:1px solid #aca899;padding:5px 6px}
.phone[data-tema="m2003"] .composer input{border:2px inset #fff;border-radius:0;background:#fff;
  font-size:12px;padding:4px 6px}
.phone[data-tema="m2003"] .send{border-radius:0;border:2px outset #fff;background:#ece9d8;color:#000;
  width:auto;height:auto;padding:2px 8px}
.phone[data-tema="m2003"] .send svg{display:none}
.phone[data-tema="m2003"] .sendtxt{display:inline;font-size:11px}
.phone[data-tema="m2003"] .homebar{display:none}

/* ---------- Mensageiro 2009 ---------- */
.phone[data-tema="m2009"]{
  --ph-bg:#eaf2fa;--ph-ink:#12253a;--ph-muted:#4f6478;--ph-head:#dce9f5;--ph-line:#9db8d2;
  --ph-sent:#cfe6ff;--ph-sent-ink:#0b2a4a;--ph-recv:#fff;--ph-recv-ink:#12253a;
  --ph-chip:#fff;--ph-chip-line:#9db8d2;--ph-chip-hover:#f2f8ff;--ph-field:#fff;--ph-field-line:#8fb0cf;
  --ph-accent:#1f6fb2;--ph-send-ink:#fff;--ph-hover:rgba(31,111,178,.12);--ph-focus:rgba(31,111,178,.2);
  --ph-scroll:#a9c0d8;--ph-stat:#dce9f5;--ph-font:"Segoe UI",Tahoma,system-ui,sans-serif}
.phone[data-tema="m2009"] .phead{background:linear-gradient(180deg,#f8fcff 0%,#d7e7f5 48%,#b9d2e8 100%);
  border-bottom:1px solid #7c9cbd;box-shadow:inset 0 1px 0 #fff}
.phone[data-tema="m2009"] .cwho b{font-size:15px;color:#123a5e}
.phone[data-tema="m2009"] .cwho small{color:#3f5a73}
.phone[data-tema="m2009"] .cava{width:32px;height:32px;border:2px solid #fff;box-shadow:0 0 0 1px #8fb0cf}
.phone[data-tema="m2009"] .ibtn{width:26px;height:26px;border-radius:6px;
  background:linear-gradient(180deg,#fff,#d7e7f5);border:1px solid #8fb0cf;color:#1f5f96}
.phone[data-tema="m2009"] .ibtn svg{width:14px;height:14px}
.phone[data-tema="m2009"] .ibtn-x{font-size:16px}
.phone[data-tema="m2009"] .retro-extra{display:block;background:linear-gradient(180deg,#f7fbff,#dce9f5);
  border-bottom:1px solid #9db8d2}
.phone[data-tema="m2009"] .r-menu{display:flex;gap:12px;padding:2px 8px;font-size:11px;color:#24557f;
  border-bottom:1px solid #b9d2e8}
.phone[data-tema="m2009"] .r-contacts{display:flex;flex-direction:column;padding:4px 8px 5px}
.phone[data-tema="m2009"] .rc{display:flex;align-items:center;gap:5px;font-size:11px;color:#2c4a66;line-height:1.45}
.phone[data-tema="m2009"] .rc b{font-weight:600}
.phone[data-tema="m2009"] .rc span{color:#5f748a;font-size:10px}
.phone[data-tema="m2009"] .rdot{width:7px;height:7px;border-radius:50%;background:#9db8d2;flex:none}
.phone[data-tema="m2009"] .rc.on .rdot{background:#3a9e4f}
.phone[data-tema="m2009"] .log{background:linear-gradient(180deg,#fbfdff,#eef6fd);padding:10px 12px}
.phone[data-tema="m2009"] .meta{display:flex}
.phone[data-tema="m2009"] .msg.me .meta{justify-content:flex-end}
.phone[data-tema="m2009"] .b{border-radius:14px;box-shadow:0 1px 2px rgba(20,50,80,.12)}
.phone[data-tema="m2009"] .msg.bot .b{background:#fff;border:1px solid #c9dcee}
.phone[data-tema="m2009"] .msg.me .b{background:linear-gradient(180deg,#e3f1ff,#c7e2ff);border:1px solid #9ec7ea}
.phone[data-tema="m2009"] .msg.bot .b::after{background:#fff}
.phone[data-tema="m2009"] .msg.me .b::after{background:#c7e2ff}
.phone[data-tema="m2009"] .typing{background:#fff;border:1px solid #c9dcee}
.phone[data-tema="m2009"] .typing .dots{display:none}
.phone[data-tema="m2009"] .typing .word{display:inline;font-size:11px;font-style:italic;color:#4c6b86}
.phone[data-tema="m2009"] .chips button{background:linear-gradient(180deg,#fff,#e6f1fb);border-color:#9db8d2;
  border-radius:10px}
.phone[data-tema="m2009"] .composer{background:linear-gradient(180deg,#eef6fd,#dce9f5);border-top:1px solid #9db8d2}
.phone[data-tema="m2009"] .composer input{border-radius:14px;border-color:#8fb0cf;
  box-shadow:inset 0 1px 2px rgba(20,50,80,.1)}
.phone[data-tema="m2009"] .send{border-radius:14px;background:linear-gradient(180deg,#4a9bd8,#1f6fb2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4)}
.phone[data-tema="m2009"] .homebar{display:none}

/* ---------- Flor 1999 ---------- */
.phone[data-tema="f1999"]{
  --ph-bg:#d4d0c8;--ph-ink:#000;--ph-muted:#555;--ph-head:#000080;--ph-line:#808080;
  --ph-sent:#e8f5e9;--ph-sent-ink:#003300;--ph-recv:#fff;--ph-recv-ink:#000;
  --ph-chip:#d4d0c8;--ph-chip-line:#808080;--ph-chip-hover:#fff;--ph-field:#fff;--ph-field-line:#808080;
  --ph-accent:#2e7d32;--ph-send-ink:#fff;--ph-hover:rgba(0,0,0,.08);--ph-focus:rgba(46,125,50,.2);
  --ph-scroll:#9a968a;--ph-stat:#d4d0c8;--ph-font:Tahoma,"MS Sans Serif",sans-serif}
.phone[data-tema="f1999"] .phead{background:linear-gradient(90deg,#000080,#1084d0);color:#fff;
  padding:4px 6px;border-bottom:1px solid #000;gap:6px;min-height:28px}
.phone[data-tema="f1999"] .cava{display:none}
.phone[data-tema="f1999"] .flowerbadge{display:inline-block;color:#fff}
.phone[data-tema="f1999"] .cwho b{font-size:12px;color:#fff}
.phone[data-tema="f1999"] .cwho small{display:none}
.phone[data-tema="f1999"] .ibtn{width:18px;height:17px;border-radius:0;background:#d4d0c8;color:#000;
  border:1px solid #fff;border-right-color:#404040;border-bottom-color:#404040}
.phone[data-tema="f1999"] .ibtn svg{width:13px;height:13px}
.phone[data-tema="f1999"] .ibtn-x{font-size:13px;line-height:1;color:#000}
.phone[data-tema="f1999"] .retro-extra{display:block;background:#d4d0c8;border-bottom:1px solid #808080}
.phone[data-tema="f1999"] .r-menu{display:flex;gap:12px;padding:2px 6px;font-size:11px;color:#000;
  border-bottom:1px solid #808080}
.phone[data-tema="f1999"] .r-contacts{display:flex;flex-direction:column;margin:3px;padding:3px 5px;
  background:#fff;border:2px inset #d4d0c8}
.phone[data-tema="f1999"] .rc{display:flex;align-items:center;gap:5px;font-size:11px;color:#000;line-height:1.45}
.phone[data-tema="f1999"] .rc b{font-weight:600}
.phone[data-tema="f1999"] .rc span{color:#666;font-size:10px}
.phone[data-tema="f1999"] .rdot{width:7px;height:7px;border-radius:50%;background:#999;flex:none}
.phone[data-tema="f1999"] .rc.on .rdot{background:#2e9e44}
.phone[data-tema="f1999"] .log{background:#fff;border:2px inset #d4d0c8;margin:4px;padding:6px;gap:0}
.phone[data-tema="f1999"] .meta{display:flex;font-size:10.5px;color:#666;margin:5px 0 0}
.phone[data-tema="f1999"] .msg.bot .meta b{color:#008000}
.phone[data-tema="f1999"] .msg.me .meta b{color:#000080}
.phone[data-tema="f1999"] .msg.me .meta{justify-content:flex-end}
.phone[data-tema="f1999"] .b{max-width:100%;padding:0;border-radius:0;background:transparent!important;
  color:#000!important;font-size:12px;line-height:1.4;font-weight:400}
.phone[data-tema="f1999"] .b::after{display:none}
.phone[data-tema="f1999"] .receipt{font-size:10px}
.phone[data-tema="f1999"] .typingrow .typing{background:transparent;padding:0;border-radius:0}
.phone[data-tema="f1999"] .typing .dots{display:none}
.phone[data-tema="f1999"] .typing .word{display:inline;font-size:11px;font-style:italic;color:#555}
.phone[data-tema="f1999"] .chips{background:#d4d0c8;padding:4px 6px 6px}
.phone[data-tema="f1999"] .chips button{background:#d4d0c8;border:2px outset #fff;border-radius:0;
  font-size:11px;padding:2px 6px}
.phone[data-tema="f1999"] .composer{background:#d4d0c8;border-top:1px solid #808080;padding:5px 6px}
.phone[data-tema="f1999"] .composer input{border:2px inset #fff;border-radius:0;background:#fff;
  font-size:12px;padding:4px 6px}
.phone[data-tema="f1999"] .send{border-radius:0;border:2px outset #fff;background:#d4d0c8;color:#000;
  width:auto;height:auto;padding:2px 8px}
.phone[data-tema="f1999"] .send svg{display:none}
.phone[data-tema="f1999"] .sendtxt{display:inline;font-size:11px}
.phone[data-tema="f1999"] .homebar{display:none}

/* ---------- Flor 2010 ---------- */
.phone[data-tema="f2010"]{
  --ph-bg:#f2faf3;--ph-ink:#17301b;--ph-muted:#4f6a53;--ph-head:#dff2e1;--ph-line:#b7d8bb;
  --ph-sent:#c8ecd0;--ph-sent-ink:#0f2e16;--ph-recv:#fff;--ph-recv-ink:#17301b;
  --ph-chip:#fff;--ph-chip-line:#b7d8bb;--ph-chip-hover:#f0fbf2;--ph-field:#fff;--ph-field-line:#a9cfae;
  --ph-accent:#2e8b46;--ph-send-ink:#fff;--ph-hover:rgba(46,139,70,.12);--ph-focus:rgba(46,139,70,.2);
  --ph-scroll:#b7d8bb;--ph-stat:#dff2e1;--ph-font:"Segoe UI",Tahoma,system-ui,sans-serif}
.phone[data-tema="f2010"] .phead{background:linear-gradient(180deg,#f4fbf5,#d3ebd7);border-bottom:1px solid #a9cfae}
.phone[data-tema="f2010"] .flowerbadge{display:inline-block;color:#2e8b46}
.phone[data-tema="f2010"] .cwho b{color:#1f5c2d;font-size:15px}
.phone[data-tema="f2010"] .cwho small{color:#4f6a53}
.phone[data-tema="f2010"] .cava{width:32px;height:32px;border:2px solid #fff;box-shadow:0 0 0 1px #a9cfae}
.phone[data-tema="f2010"] .ibtn{width:27px;height:27px;border-radius:8px;background:#fff;
  border:1px solid #b7d8bb;color:#2e8b46}
.phone[data-tema="f2010"] .ibtn svg{width:14px;height:14px}
.phone[data-tema="f2010"] .ibtn-x{font-size:16px}
.phone[data-tema="f2010"] .retro-extra{display:block;background:linear-gradient(180deg,#f4fbf5,#dff2e1);
  border-bottom:1px solid #b7d8bb}
.phone[data-tema="f2010"] .r-menu{display:flex;gap:12px;padding:2px 8px;font-size:11px;color:#2e6b3b;
  border-bottom:1px solid #cfe7d3}
.phone[data-tema="f2010"] .r-contacts{display:flex;flex-direction:column;padding:4px 8px 5px}
.phone[data-tema="f2010"] .rc{display:flex;align-items:center;gap:5px;font-size:11px;color:#315c3a;line-height:1.45}
.phone[data-tema="f2010"] .rc b{font-weight:600}
.phone[data-tema="f2010"] .rc span{color:#5f7a63;font-size:10px}
.phone[data-tema="f2010"] .rdot{width:7px;height:7px;border-radius:50%;background:#a9cfae;flex:none}
.phone[data-tema="f2010"] .rc.on .rdot{background:#2e9e44}
.phone[data-tema="f2010"] .log{background:#fbfefb;padding:10px 12px}
.phone[data-tema="f2010"] .meta{display:flex}
.phone[data-tema="f2010"] .msg.me .meta{justify-content:flex-end}
.phone[data-tema="f2010"] .b{border-radius:16px}
.phone[data-tema="f2010"] .msg.bot .b{background:#fff;border:1px solid #cfe7d3}
.phone[data-tema="f2010"] .msg.me .b{background:linear-gradient(180deg,#d9f3df,#bfe8c8);border:1px solid #a9d9b2}
.phone[data-tema="f2010"] .msg.bot .b::after{background:#fff}
.phone[data-tema="f2010"] .msg.me .b::after{background:#bfe8c8}
.phone[data-tema="f2010"] .typing{background:#fff;border:1px solid #cfe7d3}
.phone[data-tema="f2010"] .typing .dots{display:none}
.phone[data-tema="f2010"] .typing .word{display:inline;font-size:11px;font-style:italic;color:#5f7a63}
.phone[data-tema="f2010"] .chips button{border-radius:12px;background:#fff;border-color:#b7d8bb}
.phone[data-tema="f2010"] .composer{background:#eaf7ec;border-top:1px solid #b7d8bb}
.phone[data-tema="f2010"] .composer input{border-radius:14px}
.phone[data-tema="f2010"] .send{background:linear-gradient(180deg,#4caf67,#2e8b46)}
.phone[data-tema="f2010"] .homebar{display:none}

/* ---------- Tremor do "chamar atenção" ---------- */
@keyframes shake{0%,100%{transform:translateX(0)}15%{transform:translateX(-6px)}30%{transform:translateX(5px)}
  45%{transform:translateX(-4px)}60%{transform:translateX(3px)}75%{transform:translateX(-2px)}}
.phone.shake .phone-screen{animation:shake .55s cubic-bezier(.36,.07,.19,.97)}

/* ---------- Celular: o telefone é a tela ---------- */
@media (max-width:760px){
  .sheet{padding:0;background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none}
  .phone{height:100vh;height:100dvh;width:100%;max-width:none;aspect-ratio:auto;animation:none}
  .phone-body{height:100%;padding:0;border-radius:0;background:var(--ph-bg);box-shadow:none;animation:none}
  .phone-body::before,.phone-body::after{display:none}
  .phone-screen{border-radius:0}
  .phone-screen::before{display:none}
  .statusbar{display:none}
  .homebar{display:none}
  .phead{padding-top:calc(env(safe-area-inset-top) + 8px)}
  .composer{padding-bottom:calc(8px + env(safe-area-inset-bottom))}
  .composer input{font-size:16px}
  .phone:not(.retro) .ibtn{width:38px;height:38px}
  .phone:not(.retro) .ibtn svg{width:20px;height:20px}
  .send{width:38px;height:38px}
  .appdrawer{padding-top:calc(env(safe-area-inset-top) + 18px);
    padding-bottom:calc(env(safe-area-inset-bottom) + 16px)}
}

@media (prefers-reduced-motion:reduce){
  .sheet,.phone,.phone-body,.appdrawer,.b,.typing .dots i{animation:none!important}
  .phone.shake .phone-screen{animation:none!important}
}