/* Mambito · conversación centrada, gestos asociados a interacción real. */
.editorial-shell:has(.mambito-chat) .content{padding:0 28px 0;max-width:1400px}
.editorial-shell:has(.mambito-chat) .pagehead{display:none}
.mambito-chat{max-width:1000px;margin:auto;display:flex;flex-direction:column;min-height:calc(100dvh - 64px);color:#202c26}
.chat-toolbar{display:flex;justify-content:space-between;align-items:center;gap:18px;min-height:68px;border-bottom:1px solid #edf1ee}
.chat-toolbar>span{display:flex;align-items:center;gap:12px;font-size:15px}.chat-toolbar strong{font-weight:600}
.chat-quiet{border:0;background:transparent;color:#456252;font-size:12px;min-height:40px;padding:8px;cursor:pointer;line-height:1.5}.chat-quiet:hover{background:#eff6f1;border-radius:8px;color:#155d3e}
.mambito-stage{display:flex;align-items:center;justify-content:center;flex-direction:column;min-height:220px;padding:22px 0 4px;flex:none}
.mambito-actor{position:relative;display:flex;align-items:center;justify-content:center;width:230px;height:165px;perspective:700px}
.mambito-actor .botface{--bot-size:136px;transform:rotate(-5deg);transition:transform .35s cubic-bezier(.16,1,.3,1)}
.mascot-shadow{position:absolute;width:145px;height:15px;bottom:0;background:#4b8b6240;border-radius:50%;filter:blur(10px);z-index:-1}
.mascot-caption{font-size:10px;color:#526d5c;min-height:20px;text-align:center;margin-top:10px;line-height:1.5}
.editorial-shell .chat-intro h1{font-family:Inter,Arial,sans-serif;font-size:clamp(24px,3vw,36px);font-weight:600;letter-spacing:-.03em;line-height:1.2;text-align:center;margin:6px 0 12px}
.chat-intro>p{font-size:14px;line-height:1.6;color:#627067;text-align:center;margin:0}
.chat-starters{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:23px 0}
.chat-starters button{border:1px solid #e0e8e2;border-radius:24px;background:#fff;padding:10px 16px;min-height:44px;display:flex;align-items:center;gap:14px;color:#344c3e;font-size:12px;cursor:pointer}
.chat-starters button:hover{border-color:#78b392;background:#f0f7f2}.chat-starters button span{color:#18764e}
.conversation-scroll{flex:1;max-height:42dvh;min-height:100px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c5d8ca #fff;padding:20px max(8px,3%);display:flex;flex-direction:column;gap:18px;outline-offset:2px}
.chat-first-message{font-size:12px;color:#647368;text-align:center;max-width:52ch;line-height:1.8;margin:18px auto}
.conversation-message{max-width:78%;padding:16px 20px;background:#f5f7f5;border-radius:16px 16px 16px 5px;align-self:flex-start;min-width:130px}
.conversation-message.mine{align-self:flex-end;background:#eaf6ee;border-radius:16px 16px 5px 16px}
.message-author{font-size:10px;color:#41634e;display:block;font-weight:600;margin-bottom:7px}
.conversation-message p{font-size:14px;line-height:1.75;white-space:pre-wrap;overflow-wrap:anywhere;max-width:68ch;margin:0}
.conversation-message time{display:block;text-align:right;font-size:10px;color:#617366;margin-top:8px}
.chat-compose-area{position:sticky;bottom:0;background:#fff;padding:18px 0 12px;margin-top:auto;z-index:2}
.editorial-shell .mambito-chat #message-form{max-width:850px;width:100%;margin:auto;border:1px solid #dce8e0;border-radius:19px;padding:14px 17px 10px;background:#fff;box-shadow:0 12px 30px -20px #225c3d59}
.editorial-shell .mambito-chat #chat-message{display:block;border:0;outline:none;box-shadow:none;padding:8px 4px;width:100%;min-height:62px;max-height:200px;resize:vertical;background:#fff;font-size:14px;line-height:1.7}
.editorial-shell .mambito-chat #chat-message:focus-visible{outline:0}
.mambito-composer:focus-within{border-color:#5b9f75!important;box-shadow:0 0 0 2px #d9eedf,0 12px 30px -20px #225c3d59!important}
.composer-actions{display:flex;align-items:center;justify-content:space-between;gap:16px}
.chat-send{border:0;border-radius:50%;width:44px;height:44px;background:#18764e;color:#fff;display:grid;place-items:center;cursor:pointer;flex:none}.chat-send:hover{background:#105e3c}.chat-send svg{width:22px;height:22px}.chat-send:disabled{opacity:.45;cursor:default}
.chat-footnote{font-size:10px;text-align:center;color:#5f6c64;line-height:1.6;max-width:80ch;margin:14px auto 0;padding:0 15px}
.editorial-shell .mambito-chat #chat-reference label{font-size:11px;margin-top:15px}.reference-field{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.reference-field input{flex:1;min-width:140px}#reference-status,#chat-send-status{font-size:12px;color:#8a3b20;line-height:1.7}#chat-send-status:empty,#reference-status:empty{display:none}#chat-send-status{margin:12px 0 0}
.has-conversation .mambito-stage{min-height:115px;padding-top:10px}.has-conversation .mambito-actor{height:85px;width:140px}.has-conversation .mambito-actor .botface{--bot-size:73px}.has-conversation .mascot-shadow{width:90px;height:9px;filter:blur(7px)}.has-conversation .mascot-caption{margin-top:5px}.editorial-shell .has-conversation .chat-intro h1{font-size:24px}.has-conversation .chat-intro>p{font-size:12px}.has-conversation .chat-starters{margin:16px 0 6px}.has-conversation .chat-starters button{font-size:11px;padding:8px 12px;min-height:38px}
.mascot-notebook{position:absolute;width:108px;bottom:0;left:50%;transform:translate(-50%,22px) scale(.8);opacity:0;pointer-events:none;transition:opacity .25s,transform .35s cubic-bezier(.16,1,.3,1);z-index:1}
.notebook-lid{height:62px;border-radius:5px;background:linear-gradient(140deg,#f6faf7,#aabeb0);border:1px solid #90a597;transform:perspective(200px) rotateX(-8deg);display:grid;place-items:center;color:#4f775e;font:600 15px Inter,Arial,sans-serif;box-shadow:0 7px 10px -7px #25462f88}.notebook-base{height:5px;width:118px;position:relative;left:-5px;border-radius:0 0 8px 8px;background:#b1c4b7}
.mambito-stage[data-state="attentive"] .botface{transform:translateY(2px) rotate(4deg) rotateX(-8deg)}
.mambito-stage[data-state="attentive"] .bot-eyes{transform:translateY(.035em)}
.mambito-stage[data-state="reference"] .mascot-notebook,.mambito-stage[data-state="saving"] .mascot-notebook{opacity:1;transform:translate(-50%,0) scale(1)}
.mambito-stage[data-state="reference"] .botface,.mambito-stage[data-state="saving"] .botface{transform:translateY(-7px) rotate(3deg)}
.mambito-stage[data-state="reference"] .bot-eyes,.mambito-stage[data-state="saving"] .bot-eyes{transform:translateY(.04em)}
.has-conversation .mascot-notebook{width:68px;bottom:-3px}.has-conversation .notebook-lid{height:40px;font-size:10px}.has-conversation .notebook-base{width:76px;left:-4px;height:4px}
@media(prefers-reduced-motion:no-preference){.mambito-stage.greeting .mambito-actor{animation:mambito-hello .9s cubic-bezier(.16,1,.3,1) both}.mambito-stage[data-state="saving"] .notebook-lid span{animation:mambito-working 1.2s ease-in-out infinite}@keyframes mambito-hello{0%{transform:translateY(5px) rotate(-5deg)}40%{transform:translateY(-12px) rotate(6deg)}70%{transform:translateY(1px) rotate(-3deg)}100%{transform:translateY(0) rotate(0)}}@keyframes mambito-working{50%{opacity:.35}}}
@media(max-width:800px){.editorial-shell:has(.mambito-chat) .content{padding:0 18px}.mambito-chat{min-height:calc(100dvh - 230px)}.chat-toolbar{min-height:58px}.chat-toolbar .chat-quiet{font-size:10px}.conversation-scroll{max-height:46dvh}.mambito-stage{min-height:185px}.mambito-actor{height:140px}.mambito-actor .botface{--bot-size:115px}}
@media(max-width:520px){.editorial-shell:has(.mambito-chat) .content{padding:0 12px}.chat-toolbar{gap:8px}.chat-toolbar>span{font-size:13px}.chat-toolbar .chat-quiet{max-width:145px;line-height:1.4;text-align:right}.mambito-stage{min-height:170px;padding-top:16px}.mambito-actor{height:125px}.mambito-actor .botface{--bot-size:105px}.chat-starters{gap:6px;margin:18px 0 10px}.chat-starters button{font-size:11px;padding:9px 11px;gap:8px}.conversation-message{max-width:91%;padding:13px 15px}.conversation-message p{font-size:13px}.conversation-scroll{padding:14px 0}.chat-compose-area{padding:12px 0}.chat-footnote{font-size:10px}.editorial-shell .mambito-chat #message-form{padding:12px;border-radius:15px}.editorial-shell .chat-intro h1{font-size:25px}.chat-intro>p{font-size:12px}.has-conversation .chat-intro,.has-conversation .chat-starters{display:none}.has-conversation .mambito-stage{min-height:105px}.chat-send{width:42px;height:42px}}
@media(prefers-reduced-motion:reduce){.mambito-actor,.mambito-actor .botface,.mascot-notebook,.notebook-lid span{animation:none!important;transition:none!important;transform:none!important}.mascot-notebook{left:calc(50% - 54px)}.has-conversation .mascot-notebook{left:calc(50% - 34px)}}
