#mateoPanel>[hidden]{display:none!important}
#mateoPanel .mateo-private-switch{flex:none;display:flex;align-items:center;flex-wrap:wrap;gap:5px;padding:10px;background:#2646c4;color:#fff}
#mateoPanel .mateo-chat-title{flex:1;min-width:60px;font-size:16px;font-weight:700;order:0}
#mateoPanel .mateo-chat-tools{display:flex;gap:4px;order:1}
#mateoPanel .mateo-private-switch>details{order:2}
#mateoPanel .mateo-private-switch>button{order:3}
#mateoPanel .mateo-private-switch>p{order:4}
#mateoPanel .mateo-appearance{order:5;flex-basis:calc(100% + 20px);margin:5px -10px -10px;display:flex;flex-wrap:wrap;gap:8px;padding:12px 10px;max-height:50dvh;overflow:auto;overscroll-behavior:contain;background:#0b1220;color:#e5e7eb}
#mateoPanel .mateo-appearance[hidden]{display:none}
#mateoPanel .mateo-appearance *{box-sizing:border-box}
#mateoPanel .mateo-appearance input[type=range]{margin-inline:0}
#mateoPanel .mateo-appearance>strong{flex-basis:100%;font-size:14px}
#mateoPanel .mateo-private-switch>p{flex-basis:100%;margin:0;font-size:13px}
#mateoPanel .mateo-private-switch>p:empty{display:none}
#mateoPanel .mateo-private-switch button,#mateoPanel .mateo-private-switch summary{background:rgba(0,0,0,.22);color:#fff;border:0;border-radius:8px;padding:8px 9px;min-height:36px;font:inherit;cursor:pointer;list-style:none}
#mateoPanel .mateo-private-switch summary::-webkit-details-marker{display:none}
#mateoPanel .mateo-private-switch details{position:relative}
#mateoPanel .mateo-private-switch details:not([open])>button{display:none}
#mateoPanel .mateo-private-switch details[open]>button{position:absolute;right:0;top:34px;white-space:nowrap;background:#1f2937;z-index:2}
#mateoPanel .mateo-private-switch details[open]>button+button{top:72px}
#mateoPanel .mateo-private-host{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden;position:relative}
#mateoPanel .mateo-cobalt-chat{flex:1;display:flex;flex-direction:column;width:100%;min-height:0;background:#0b1220;color:#e5e7eb}
#mateoPanel .mateo-conversation{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:10px;display:flex;flex-direction:column;gap:12px}
#mateoPanel .mateo-conversation:not(:empty)::before,#mateoPanel .mateo-conversation:not(:empty)::after{content:'';flex:none;height:92vh}
#mateoPanel .mateo-conversation:empty::before{content:'No messages with Mateo yet.';margin:auto;align-self:center;color:#9aa7b5;font-size:1em}
#mateoPanel .mateo-conversation article{display:flex;flex-direction:column;gap:6px}
#mateoPanel .mateo-conversation .ccB{display:flex;flex-direction:column;max-width:88%;padding:8px 12px;border-radius:14px;font-size:1em;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
#mateoPanel .mateo-conversation .ccMine{align-self:flex-end;background:#006bb6;color:#fff}
#mateoPanel .mateo-conversation .ccOther{align-self:flex-start;background:#ed174c;color:#fff}
#mateoPanel .mateo-conversation small{display:block;font-size:.7em;opacity:.8;margin-bottom:2px}
#mateoPanel .mateo-cobalt-chat form{display:flex;flex:none;gap:6px;padding:8px;border-top:1px solid #2a3b55;align-items:center;margin:0}
#mateoPanel .mateo-cobalt-chat textarea{box-sizing:border-box;flex:1;resize:none;min-width:0;height:44px;max-height:120px;background:#1f2937;border:1px solid #2a3b55;border-radius:10px;color:#e5e7eb;padding:10px;font:inherit;font-size:max(16px,1em);outline:none}
#mateoPanel .mateo-cobalt-chat form>button{flex:none;background:#ed174c;color:#fff;border:none;border-radius:9px;padding:11px 15px;font-weight:600;cursor:pointer}
#mateoPanel .mateo-cobalt-chat form>button:disabled{opacity:.6;cursor:wait}
#mateoPanel .mateo-cobalt-chat form{padding-bottom:max(8px,env(safe-area-inset-bottom))}
#mateoPanel .mateo-cobalt-chat textarea{order:1}
#mateoPanel .mateo-cobalt-chat .dsSend{order:2}
#mateoPanel .mateo-shortcuts{order:0;position:relative;flex:none}
#mateoPanel .mateo-shortcuts summary{list-style:none;cursor:pointer;border:1px solid #ed174c;border-radius:9px;padding:8px 12px;color:#ed174c;font-size:22px;line-height:26px}
#mateoPanel .mateo-shortcuts summary::-webkit-details-marker{display:none}
#mateoPanel .mateo-shortcuts>div{position:absolute;bottom:55px;left:0;display:flex;flex-direction:column;gap:4px;padding:8px;background:#1f2937;border:1px solid #2a3b55;border-radius:10px;min-width:170px;z-index:3}
#mateoPanel .mateo-shortcuts:not([open])>div{display:none}
#mateoPanel .mateo-shortcuts button{border:0;background:transparent;color:#fff;text-align:left;padding:10px;font:inherit;cursor:pointer}
#mateoPanel .mateo-recovery{flex:none;padding:6px 12px;font-size:13px;color:#9aa7b5}
#mateoPanel .mateo-recovery[hidden],#mateoPanel .mateo-cobalt-chat [hidden]{display:none!important}
#mateoPanel .mateo-recovery p{margin:0 0 5px}
#mateoPanel .mateo-recovery button,#mateoPanel .mateo-message-details button{background:#1f2937;border:1px solid #2a3b55;color:#e5e7eb;border-radius:7px;padding:6px 10px;cursor:pointer}
#mateoPanel .mateo-message-details{font-size:12px;color:#9aa7b5}
#mateoPanel .mateo-voice{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:12px}
#mateoPanel .mateo-voice button{background:#064e3b;color:#fff;border:0;border-radius:18px;padding:6px 12px;font:inherit;cursor:pointer}
#mateoPanel .mateo-voice audio{width:100%;max-width:320px}
#mateoPanel .mateo-attachment{flex:none;display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 12px;font-size:13px}
#mateoPanel .mateo-attachment span{flex:1;overflow-wrap:anywhere;min-width:80px}
#mateoPanel .mateo-attachment button{background:#1f2937;color:#fff;border:1px solid #2a3b55;border-radius:8px;padding:8px;font:inherit}
#mateoPanel .mateo-message-details pre{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit}
#mateoPanel .mateo-conversation .mateo-hub-actions{padding:0!important;background:none!important;max-height:none!important;overflow:visible!important;flex:none!important}
#mateoPanel .mateo-conversation .mateo-hub-action{display:flex;flex-direction:column;gap:6px}
#mateoPanel .mateo-conversation .mateo-hub-action p{max-width:88%;padding:8px 12px;border-radius:14px;margin:0;white-space:pre-wrap;overflow-wrap:anywhere;background:#ed174c;color:#fff;align-self:flex-start}
#mateoPanel .mateo-conversation .mateo-hub-action p:first-child{align-self:flex-end;background:#006bb6;color:#fff}
/* Cobalt Chat parity: bar, bubbles, media, tray, pill (2026-09-23) */
#mateoPanel .mateo-private-switch>button,#mateoPanel .mateo-private-switch>details>summary,#mateoPanel .mateo-chat-tools>button{box-sizing:border-box;height:32px;min-height:32px;min-width:34px;padding:0 8px;display:inline-flex;align-items:center;justify-content:center;line-height:1;font-size:15px}
#mateoPanel .mateo-chat-tools>button:first-child{font-size:13px;font-weight:700}
#mateoPanel .mateo-chat-tools>button:nth-child(2){font-weight:700}
#mateoPanel .mateo-private-switch>button{font-size:19px}
#mateoPanel .mateo-chat-state{order:0;flex:none;font-size:10.5px;font-weight:500;opacity:.9}
#mateoPanel .mateo-chat-state:empty{display:none}
#mateoPanel .mateo-private-switch .mateo-voice-mode.on{background:rgba(127,215,172,.35)}
#mateoPanel .mateo-private-switch .mateo-voice-mode[hidden]{display:none}
#mateoPanel .mateo-read-note{flex:none;font-size:10.5px;line-height:1.4;padding:5px 12px;background:#0b1220;border-bottom:1px solid #2a3b55;color:#7fd7ac}
#mateoPanel .mateo-read-note.bad{color:#fca5a5}
#mateoPanel .mateo-read-note[hidden]{display:none}
#mateoPanel .mateo-read-note button{margin-left:8px;background:#1f2937;border:1px solid #2a3b55;color:#7fd7ac;border-radius:999px;padding:2px 10px;font-size:10.5px;cursor:pointer}
#mateoPanel .mateo-strip{flex:none;display:flex;align-items:center;gap:6px;padding:7px 10px;background:#0b1220;border-bottom:1px solid #2a3b55;font-size:10.5px;color:#9aa7b5}
#mateoPanel .mateo-strip>span:first-child{flex:1;min-width:0}
#mateoPanel .mateo-model{flex:0 1 auto;min-width:0;opacity:.85;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#mateoPanel .mateo-new-pill{position:absolute;left:50%;bottom:90px;transform:translateX(-50%);z-index:5;background:#0e7490;color:#fff;border:none;border-radius:999px;padding:7px 14px;font-size:12px;font-weight:600;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.45)}
#mateoPanel .mateo-new-pill[hidden]{display:none}
#mateoPanel .mateo-conversation .ccB>small:first-child{order:-2}
#mateoPanel .mateo-conversation .ccB>.mateo-media{order:-1;margin:4px 0}
#mateoPanel .mateo-conversation .ccB>.mateo-read{align-self:flex-start;margin-top:6px;background:#0b3b30;border:1px solid #1f6b4e;color:#7ff0c8;border-radius:20px;padding:4px 11px;font-size:12.5px;font-weight:700;cursor:pointer;white-space:nowrap}
#mateoPanel .mateo-photo{display:block;max-width:100%;max-height:46vh;border-radius:10px;cursor:zoom-in}
#mateoPanel .mateo-clip{display:block;max-width:100%;max-height:46vh;border-radius:10px;background:#000}
#mateoPanel .mateo-media-caption{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin-top:3px;font-size:.7em;opacity:.85;white-space:normal}
#mateoPanel .mateo-media-caption button,#mateoPanel .mateo-media-caption a{background:none;border:0;padding:0;color:#7fd7ac;font:inherit;text-decoration:none;cursor:pointer}
#mateoPanel .mateo-file{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:10px;background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.1);white-space:normal}
#mateoPanel .mateo-file>span{font-size:20px;line-height:1}
#mateoPanel .mateo-file>div{flex:1;min-width:0;display:flex;flex-direction:column}
#mateoPanel .mateo-file b{font-size:.8em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#mateoPanel .mateo-file i{font-style:normal;font-size:.68em;opacity:.75}
#mateoPanel .mateo-file a{color:#7fd7ac;text-decoration:none;font-size:16px}
#mateoPanel .mateo-cleared{align-self:stretch;text-align:center;padding:20px;color:#8b98ab;font-size:.85em;line-height:1.5}
#mateoPanel .mateo-cleared p{margin:0}
#mateoPanel .mateo-cleared button{margin-top:9px;background:#1f2937;border:1px solid #7fd7ac;color:#7fd7ac;border-radius:8px;padding:7px 14px;font-size:11.5px;cursor:pointer}
#mateoPanel .mateo-recovery>button+button{margin-left:6px}
#mateoPanel .mateo-attachment .mateo-file-ok{color:#7fd7ac}
#mateoPanel .mateo-attachment .mateo-file-bad{color:#fca5a5}
#mateoPanel .mateo-attachment.has-tray>.mateo-remove{display:none}
#mateoPanel .mateo-tray{order:-1;position:relative;flex:none;text-align:center}
#mateoPanel .mateo-tray[hidden]{display:none}
#mateoPanel .mateo-tray img,#mateoPanel .mateo-tray .mateo-chip{display:block;width:56px;height:56px;object-fit:cover;border-radius:8px;border:1px solid #2a3b55}
#mateoPanel .mateo-tray .mateo-chip{width:74px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:10px;background:#122019;color:#7fd7ac;border-color:#2f5e49}
#mateoPanel .mateo-tray .mateo-chip b{font-size:17px;line-height:1}
#mateoPanel .mateo-tray .mateo-tray-x{position:absolute;top:-7px;right:-7px;width:26px;height:26px;padding:0;border-radius:50%;border:none;background:#ef4444;color:#fff;font-size:14px;line-height:1;cursor:pointer}
#mateoPanel .mateo-tray small{display:block;margin-top:2px;font-size:9px;color:#9aa7b5}
#mateoPanel .mateo-upbar{order:3;flex-basis:100%;height:5px;position:relative;overflow:hidden;border-radius:3px;background:#1f2937}
#mateoPanel .mateo-upbar[hidden]{display:none}
#mateoPanel .mateo-upbar::after{content:'';position:absolute;top:0;bottom:0;left:-35%;width:35%;border-radius:3px;background:#22c55e;animation:mateo-upbar 1.1s ease-in-out infinite}
@keyframes mateo-upbar{to{left:100%}}
.mateo-lightbox{position:fixed;inset:0;z-index:100050;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:12px;background:rgba(0,0,0,.93)}
.mateo-lightbox img,.mateo-lightbox video{max-width:100%;max-height:80vh;border-radius:10px;background:#000}
.mateo-lightbox>div{display:flex;gap:8px}
.mateo-lightbox a,.mateo-lightbox button{border:0;border-radius:8px;padding:9px 15px;font:13px -apple-system,system-ui,sans-serif;text-decoration:none;cursor:pointer;background:#1f2f3a;color:#7fd7ac}
.mateo-lightbox button{background:#1f2937;color:#e5e7eb}
#matBtn .mateo-unread{position:absolute;top:-4px;right:-4px;width:12px;height:12px;border-radius:50%;background:#fbbf24;box-shadow:0 0 0 2px #0b1220}
#matBtn .mateo-unread[hidden]{display:none}

/* Owner model preference: a separate compact row above the composer. */
#mateoPanel .mateo-cobalt-chat form{flex-wrap:wrap}
#mateoPanel .mateo-cobalt-chat .mateo-model-choice{order:-3;flex:0 1 auto;max-width:54%;min-width:0;background:#172338;color:#e5edf9;border:1px solid #435773;border-radius:7px;padding:5px 8px;font:inherit;font-size:12px}
#mateoPanel .mateo-cobalt-chat .mateo-model-note{order:-2;flex:1 1 40%;min-width:0;color:#aebbd0;font-size:11px;text-align:right}
#mateoPanel .mateo-cobalt-chat form::before{content:"";order:-1;flex-basis:100%;height:0}
#mateoPanel .mateo-cobalt-chat .mateo-model-tag{display:block;color:#aebbd0;font-size:11px;margin-top:5px}