/* Four light colours on pearl: teal, lavender, coral and gold. Thin type, slim cards, warm titles. */
:root{--eng-pearl:#faf9fc;--eng-teal:#3f9e91;--eng-teal-bg:#eaf6f3;--eng-violet:#8466bd;--eng-violet-bg:#f1ecfa;--eng-coral:#e0705f;--eng-coral-bg:#fdeeeb;--eng-gold:#c99232;--eng-gold-bg:#fbf3e2;--eng-ink:#3f3548;--eng-soft:#7a7183;--eng-line:#ebe6ef}

/* Titles stand out: a warm coral-to-lavender heading with a thin four-colour rule. */
.section-head h2,#adminView h2,#adminView h3{background:linear-gradient(90deg,#d9a353,#b87e45 45%,#7a5cc0);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:700;letter-spacing:-.01em}
.section-head h2::after{content:"";display:block;width:64px;height:3px;margin-top:6px;border-radius:3px;background:linear-gradient(90deg,var(--eng-coral) 0 25%,var(--eng-gold) 0 50%,var(--eng-teal) 0 75%,var(--eng-violet) 0)}
.section-head p{font-weight:400}

/* ---- Inbox and chat ---- */
#chatView{background:var(--eng-pearl)}
#chatView .section-head{padding-top:16px}
#chatView .section-head h2{font-size:clamp(22px,2.6vw,28px)}
#chatView .chat-wrap{gap:12px;padding:12px 14px 20px}
#chatView .ibx,#chatView .chat-card{border-radius:16px;box-shadow:0 4px 18px #47314a0a;border-color:var(--eng-line)}
#chatView .ibx{padding:10px;gap:8px}
/* Filters stay on one line and scroll sideways instead of taking two rows. */
#chatView .ibx-filters{flex-wrap:nowrap;overflow-x:auto;gap:5px;scrollbar-width:none;padding-bottom:2px}
#chatView .ibx-filters::-webkit-scrollbar{display:none}
#chatView .ibx-filter{flex:0 0 auto;font-weight:500;font-size:12.5px;min-height:30px;padding:3px 10px;border-radius:99px;background:#fff;border:1px solid var(--eng-line);color:var(--eng-soft)}
#chatView .ibx-filter b{font-weight:600;margin-left:2px}
#chatView .ibx-filter[data-filter=all][aria-pressed=true]{background:var(--eng-violet-bg);color:var(--eng-violet);border-color:#d6c8ef}
#chatView .ibx-filter[data-filter=unread][aria-pressed=true]{background:var(--eng-coral-bg);color:#c4513f;border-color:#f3c6bd}
#chatView .ibx-filter[data-filter=profiles][aria-pressed=true]{background:var(--eng-teal-bg);color:#2f7f74;border-color:#b9e0d9}
#chatView .ibx-filter[data-filter=read][aria-pressed=true],#chatView .ibx-filter[data-filter=trash][aria-pressed=true]{background:#f3f1f5;color:var(--eng-ink);border-color:#ddd7e2}
#chatView .ibx-filter[data-filter=transactions][aria-pressed=true]{background:var(--eng-gold-bg);color:#9a6b17;border-color:#ecd8a8}
#chatView .ibx-filter[aria-pressed=true]{box-shadow:none}
#chatView .ibx-tools input{min-height:34px;font-size:13px;border-radius:10px}
#chatView .ibx-tools button{min-height:34px;font-size:12.5px;font-weight:500;border-radius:10px}

/* Profile picker: which profile you are reading and replying as. */
.ibx-people{display:flex;gap:6px;align-items:center;overflow-x:auto;scrollbar-width:none;padding:2px 0 4px}
.ibx-people::-webkit-scrollbar{display:none}
.ibx-people[hidden]{display:none}
.ibx-people-title{flex:0 0 auto;font-size:11px;font-weight:600;color:var(--eng-teal);text-transform:uppercase;letter-spacing:.06em;margin-right:2px}
.ibx-person{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;padding:3px 9px 3px 3px;border-radius:99px;border:1px solid var(--eng-line);background:#fff;color:var(--eng-ink);font-size:12.5px;font-weight:500;cursor:pointer}
.ibx-person img,.ibx-person-dot{width:24px;height:24px;border-radius:50%;object-fit:cover;flex:0 0 24px}
.ibx-person-dot{display:grid;place-items:center;background:var(--eng-violet-bg);color:var(--eng-violet);font-size:11px;font-weight:600}
.ibx-person small{color:var(--eng-soft);font-size:11px}
.ibx-person-unread{min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:var(--eng-coral);color:#fff;font-size:10.5px;font-weight:600;display:grid;place-items:center}
.ibx-person[aria-pressed=true]{background:var(--eng-teal-bg);border-color:#a9d9d0;color:#276d62}
.ibx-person:focus-visible{outline:2px solid var(--eng-teal);outline-offset:2px}

#chatView .thread{min-height:58px;padding:7px 9px;gap:9px;border-radius:12px;border-color:var(--eng-line);box-shadow:none;transform:none}
#chatView .thread:hover{transform:none;background:#f7f5fa}
#chatView .thread.unread{background:#fff7f5;border-color:#f3cfc7;box-shadow:inset 3px 0 var(--eng-coral)}
#chatView .thread.active{background:var(--eng-violet-bg);border-color:#cdbdea;box-shadow:inset 3px 0 var(--eng-violet)}
#chatView .thread-text strong,#chatView .thread.unread .thread-text strong{font-size:13.5px;font-weight:600;color:var(--eng-ink)}
#chatView .thread-text small{font-weight:400;color:var(--eng-soft);font-size:12px}
#chatView .thread-profile{font-weight:500;font-size:11px;color:var(--eng-teal)}
#chatView .thread img,#chatView .thread-heart{width:36px;height:36px;flex-basis:36px;box-shadow:none;border:0}
#chatView .thread-meta em{font-weight:500;color:#c4513f;background:var(--eng-coral-bg)}
/* A light header: the conversation, not the frame, carries the colour. */
#chatView .chat-head{min-height:58px;padding:9px 14px;background:linear-gradient(100deg,#f6f1fc,#eef8f6);color:var(--eng-ink);border-bottom:1px solid var(--eng-line)}
#chatView .chat-head strong{font-weight:600;font-size:15px;color:#5d4588}
#chatView .chat-head small{color:var(--eng-teal);font-weight:400}
#chatView .chat-head .avatar,#chatView .chat-monogram{width:38px;height:38px;flex-basis:38px;border-radius:50%;border:1px solid #fff;background:var(--eng-violet-bg);color:var(--eng-violet)}
#chatView .messages{background:var(--eng-pearl);padding:14px;gap:8px}
#chatView .bubble{font-size:13.5px;font-weight:400;border-radius:14px;padding:7px 11px;box-shadow:none;max-width:min(80%,480px);line-height:1.4}
#chatView .bubble.assistant{background:#fff;border:1px solid #dcefeb;color:#2e4f4b;border-bottom-left-radius:4px}
#chatView .bubble.user{background:var(--eng-violet-bg);color:#3c2f5a;border:1px solid #ddd2f1;border-bottom-right-radius:4px}
#chatView .bubble.system{background:var(--eng-gold-bg);color:#7a5a24;border:1px solid #f1e0b5;font-weight:400}
#chatView .bubble-sender,#chatView .bubble.user .bubble-sender{color:var(--eng-violet);font-weight:600;font-size:11px}
#chatView .bubble.assistant .bubble-sender{color:var(--eng-teal)}
#chatView .bubble-time,#chatView .bubble.user .bubble-time{color:#9a91a2;font-size:10px}
#chatView .chat-form{padding:8px 10px;box-shadow:none;border-top:1px solid var(--eng-line)}
#chatView .chat-card .chat-form input{min-height:38px;background:#fff;border-radius:99px;font-size:13.5px;padding:7px 14px;border-color:var(--eng-line)}
#chatView .chat-card .chat-form button{background:var(--eng-teal);min-width:62px;font-weight:500;border-radius:99px}
#chatView .ibx-note[data-kind="profile_comment"]{--notice-bg:var(--eng-teal-bg);--notice-border:#b9e0d9;--notice-ink:#276d62;--notice-accent:var(--eng-teal)}
#chatView .ibx-note[data-kind="profile_view"]{--notice-bg:var(--eng-gold-bg);--notice-border:#ecd8a8;--notice-ink:#855b2c;--notice-accent:var(--eng-gold)}
#chatView .ibx-note[data-kind="profile_connect"]{--notice-bg:var(--eng-violet-bg);--notice-border:#d6c7ee;--notice-ink:#624885;--notice-accent:var(--eng-violet)}
#chatView .ibx-note[data-kind^="profile_"] .thread-text strong{color:var(--notice-ink);font-weight:600}
@media(max-width:780px){#chatView .chat-wrap{padding:8px 8px 16px}#chatView .chat-card{min-height:480px}#chatView .messages{min-height:300px}}

/* New-activity pulse on the header inbox count. */
.eng-pulse{animation:eng-pulse 1.2s ease-out 2}
@keyframes eng-pulse{0%{box-shadow:0 0 0 0 #e0705fb0}100%{box-shadow:0 0 0 10px #e0705f00}}

/* ---- Counters: eye for views, handshake for connects ---- */
.eng-tile-counts,.eng-profile-stats{display:flex;gap:5px;align-items:center}
.eng-tile-counts{position:absolute;z-index:4;right:7px;top:9px}
.eng-stat{display:inline-flex;gap:3px;align-items:center;padding:3px 7px;border-radius:99px;background:#1b141fa8;color:#fff;font-size:11px;font-weight:500;white-space:nowrap;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.eng-stat .eng-n{font-weight:600}
.eng-icon{font-size:11px;line-height:1}
.eng-word{font-weight:400;opacity:.85}
/* Full-screen feed: a slim column on the side, below Back. */
.eng-side-stats{position:absolute;z-index:6;right:10px;top:62px;display:flex;flex-direction:column;align-items:flex-end;gap:5px}
.eng-side-stats .eng-stat{font-size:11.5px;padding:4px 9px}
/* Profile page: three tinted pills under the name. */
.eng-profile-stats{justify-content:center;flex-wrap:wrap;margin:8px auto 2px}
.eng-profile-stats .eng-stat{background:#f3f1f5;color:var(--eng-ink);font-size:12px;padding:4px 10px;backdrop-filter:none}
.eng-profile-stats .eng-stat.teal{background:var(--eng-teal-bg);color:#2f7f74}
.eng-profile-stats .eng-stat.violet{background:var(--eng-violet-bg);color:#6a4fa0}
.eng-profile-stats .eng-stat.coral{background:var(--eng-coral-bg);color:#c4513f}
.pc-pic{position:relative}
.eng-media-views{position:absolute;bottom:6px;left:6px;display:inline-flex;gap:3px;align-items:center;padding:2px 7px;border-radius:99px;background:#1b141fb8;color:#fff;font-size:11px;font-weight:500;z-index:2}
.eng-media-views b{font-weight:600}
.pc-pic-video .eng-media-views{inset:auto auto 6px 6px;display:inline-flex;place-content:initial;text-shadow:none;font-weight:500}
.pc-pic-video .eng-media-views span{position:static;display:inline;text-shadow:none;font-weight:400}

/* ---- Comments ---- */
.fi-actions .eng-feed-comment{display:flex;flex-direction:column;gap:1px;align-items:center;justify-content:center;font-size:16px;line-height:1}
.fi-actions .eng-feed-comment b{font-size:10.5px;font-weight:600}
/* Floating comments: pop out beside the comment button, drift to the middle-left, fade. */
.eng-float{position:absolute;inset:0;z-index:7;pointer-events:none;overflow:hidden}
.eng-bubble{position:absolute;left:0;top:0;max-width:min(66%,300px);display:flex;gap:5px;align-items:baseline;padding:5px 10px;border-radius:14px 14px 14px 4px;background:#fffffff0;color:#2d2633;font-size:12.5px;line-height:1.3;font-weight:400;box-shadow:0 3px 14px #0000002a;opacity:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.eng-bubble strong{font-weight:600;flex:0 0 auto}
.eng-bubble span{overflow:hidden;text-overflow:ellipsis}
.eng-bubble.guest strong{color:#111}
.eng-bubble.go{animation:eng-rise 5.2s cubic-bezier(.22,.7,.3,1) forwards}
@keyframes eng-rise{0%{opacity:0;transform:translate(var(--x0),var(--y0)) scale(.6)}10%{opacity:1;transform:translate(var(--x0),calc(var(--y0) - 8px)) scale(1)}72%{opacity:.96;transform:translate(var(--x1),var(--y1)) scale(1)}100%{opacity:0;transform:translate(var(--x1),calc(var(--y1) - 22px)) scale(.96)}}

/* Name colours: guests (Raha N) are black; signed-in members get one of four system colours. */
.eng-comment.member.color-0 strong,.eng-bubble.member.color-0 strong{color:#2f8a7d}
.eng-comment.member.color-1 strong,.eng-bubble.member.color-1 strong{color:#7656b3}
.eng-comment.member.color-2 strong,.eng-bubble.member.color-2 strong{color:#d0604f}
.eng-comment.member.color-3 strong,.eng-bubble.member.color-3 strong{color:#ad7a1d}
.eng-comment-avatar.color-0{background:#bfe5dd}.eng-comment-avatar.color-1{background:#d9cdf1}.eng-comment-avatar.color-2{background:#f6c9c1}.eng-comment-avatar.color-3{background:#f1dfb3}
.eng-comment.guest .eng-comment-avatar{background:#141414;color:#fff}
.eng-comment.guest strong{color:#111}

.eng-comment-preview{padding:10px 12px!important}
.eng-preview-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px}
.eng-preview-head h4{margin:0!important;font-size:14px;font-weight:600;color:var(--eng-violet)!important;display:flex;align-items:center;gap:6px}
.eng-pill{display:inline-grid;place-items:center;min-width:20px;padding:1px 6px;border-radius:99px;background:var(--eng-coral-bg);color:#c4513f;font-size:11px;font-weight:600}
.eng-open-comments{padding:4px 10px;border:1px solid #cfe9e3;border-radius:99px;background:var(--eng-teal-bg);color:#2f7f74;font-weight:500;font-size:12px;cursor:pointer}
.eng-preview-list:empty{display:none}
.eng-write{width:100%;margin-top:6px;padding:7px 12px;border:1px solid var(--eng-line);border-radius:99px;background:var(--eng-pearl);color:var(--eng-soft);font-size:12.5px;text-align:left;cursor:text}

.eng-comments-open{overflow:hidden}
.eng-overlay{position:fixed;z-index:250;inset:0;background:#2118265e;display:flex;justify-content:flex-end;align-items:stretch}
.eng-panel{display:flex;flex-direction:column;width:min(400px,100%);background:#fff;box-shadow:-10px 0 40px #160d2226;animation:eng-slide .22s ease-out}
@keyframes eng-slide{from{transform:translateX(30px);opacity:.4}}
.eng-panel-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;border-bottom:1px solid var(--eng-line);background:linear-gradient(100deg,#f6f1fc,#eef8f6)}
.eng-panel-bar strong{font-weight:600;color:#5d4588;font-size:14.5px;display:flex;align-items:center;gap:5px}
.eng-close{border:0;background:#fff;color:var(--eng-violet);border-radius:50%;width:32px;height:32px;font-size:20px;line-height:1;cursor:pointer}
.eng-comment-list{flex:1;overflow:auto;min-height:0;padding:6px 12px;overscroll-behavior:contain}
.eng-comment{display:flex;gap:8px;padding:7px 2px;border-bottom:1px solid #f2eef4;color:var(--eng-ink)}
.eng-comment:last-child{border-bottom:0}
.eng-comment.compact{padding:5px 0}
.eng-comment-avatar{width:26px;height:26px;border-radius:50%;flex:0 0 26px;display:grid;place-items:center;font-size:10.5px;font-weight:600;color:#3f3548}
.eng-comment.compact .eng-comment-avatar{width:22px;height:22px;flex-basis:22px;font-size:9.5px}
.eng-comment-text{min-width:0;flex:1}
.eng-comment-head{display:flex;align-items:baseline;gap:6px}
.eng-comment-text strong{font-size:12px;font-weight:600}
.eng-comment-text small{font-size:10px;color:#a29aa9}
.eng-comment-text p{font-size:13px;line-height:1.35;margin:1px 0 0;overflow-wrap:anywhere;font-weight:400}
.eng-comment.compact p{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.eng-no-comments{font-size:13px;color:var(--eng-soft);text-align:center;padding:24px}
.eng-more{border:0;background:var(--eng-violet-bg);color:#6a4fa0;padding:8px;font-size:12px;cursor:pointer}
.eng-comment-form{display:flex;gap:6px;padding:8px 10px;border-top:1px solid var(--eng-line);background:#fff}
.eng-comment-form input{flex:1;min-width:0;border:1px solid var(--eng-line);border-radius:99px;padding:7px 13px;font-size:13px;background:var(--eng-pearl)}
.eng-comment-form button{border:0;background:var(--eng-teal);color:#fff;border-radius:99px;padding:6px 14px;font-weight:500;cursor:pointer}

/* ---- Super User dashboard ---- */
.eng-admin-activity{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin-bottom:12px;padding:10px;border:1px solid var(--eng-line);border-radius:14px;background:#fff}
.eng-live-head{grid-column:1/-1;display:flex;align-items:center;gap:7px;font-size:13px}
.eng-live-head strong{font-weight:600;color:var(--eng-ink)}
.eng-live-head small{color:var(--eng-soft);font-size:11px}
.eng-live-dot{width:8px;height:8px;border-radius:50%;background:#2fbf71;box-shadow:0 0 0 0 #2fbf7180;animation:eng-live 1.8s infinite}
@keyframes eng-live{to{box-shadow:0 0 0 7px #2fbf7100}}
.eng-activity{display:flex;flex-direction:column;gap:2px;padding:9px 10px;border-radius:11px;border:1px solid transparent;font:inherit;text-align:left}
.eng-activity-top{display:flex;align-items:center;gap:6px}
.eng-activity strong{font-size:21px;font-weight:600;line-height:1.1}
.eng-activity-label{font-size:11.5px;color:var(--eng-soft)}
.eng-activity.teal{background:var(--eng-teal-bg)}.eng-activity.teal strong{color:#2f8a7d}
.eng-activity.violet{background:var(--eng-violet-bg)}.eng-activity.violet strong{color:#7656b3}
.eng-activity.coral{background:var(--eng-coral-bg)}.eng-activity.coral strong{color:#d0604f}
.eng-activity.gold{background:var(--eng-gold-bg)}.eng-activity.gold strong{color:#ad7a1d}
.eng-activity:is(button){border-color:#f3c6bd;cursor:pointer}
.eng-activity:is(button):focus-visible{outline:2px solid var(--eng-coral);outline-offset:2px}

/* Compact admin form: smaller fields and labels; pictures and video share one upload area. */
#adminView .profile-form{padding:12px;max-width:1120px!important}
#adminView .profile-form label{margin:6px 0 3px;font-size:11.5px;font-weight:500;color:#6a4fa0}
#adminView .field{min-height:34px;padding:5px 9px;font-size:13px;border-radius:9px}
#adminView #adminBio{min-height:50px}
#adminView .row{gap:8px}
#adminView #adminMediaFiles{padding:10px;border:1px dashed #b9a5dc;background:var(--eng-pearl);border-radius:12px}
.admin-file{display:inline-block;padding:4px 8px;background:var(--eng-violet-bg);border-radius:8px;color:#6a4fa0;font-size:11px}

@media(max-width:780px){.eng-tile-counts{top:6px;right:5px;gap:3px}.eng-stat{padding:2px 6px;font-size:10px}.eng-side-stats{top:58px;right:8px}.eng-side-stats .eng-stat{font-size:10.5px;padding:3px 8px}.eng-panel{width:100%}.eng-admin-activity{grid-template-columns:repeat(2,1fr)}}
@media(prefers-reduced-motion:reduce){.eng-bubble.go{animation:none;opacity:1;transform:translate(var(--x1),var(--y1))}.eng-live-dot,.eng-pulse{animation:none}}

/* ---- Glossy inbox (2026-10-22): cyan outgoing, candy-pink incoming, bold tabs, read receipts ---- */
#chatView .section-head h2{font-weight:800}
#chatView .ibx-filter{font-weight:800;border-width:1.5px}
#chatView .ibx-filter[data-filter=all]{background:#fff4cf;border-color:#f5d36b;color:#7a5600}
#chatView .ibx-filter[data-filter=unread]{background:#ece6ff;border-color:#b9a6f5;color:#4c2fb0}
#chatView .ibx-filter[data-filter=profiles]{background:#dcfbea;border-color:#86e3b1;color:#11744a}
#chatView .ibx-filter[data-filter=read]{background:#ffe9d9;border-color:#f8b98c;color:#9a4510}
#chatView .ibx-filter[data-filter=transactions]{background:#dff4ff;border-color:#8ed3f7;color:#0b5f93}
#chatView .ibx-filter[data-filter=trash]{background:#f2f1f5;border-color:#d6d3de;color:#4a4458}
#chatView .ibx-filter[aria-pressed=true],#chatView .ibx-filter[data-filter][aria-pressed=true]{background:linear-gradient(180deg,#ffbf5f,#e37b13 60%,#c86a0d);border-color:#b4600b;color:#fff;box-shadow:inset 0 1px 0 #ffffff80,0 3px 8px #e37b1340}
#chatView .chat-head{background:#fff;border-bottom:1px solid #eef0f6}
#chatView .chat-head strong{font-weight:800;color:#1c1a4a}
#chatView .chat-head small{font-weight:600;color:#6b6f80}
#chatView .chat-head .avatar,#chatView .chat-monogram{border:2px solid #f9d9a8;box-shadow:0 0 0 2px #fff,0 2px 8px #ecaa4833}
#chatView .messages{background:#fff}
#chatView .bubble.user,#chatView .bubble.assistant{position:relative;border-radius:20px;font-weight:500}
#chatView .bubble.user::before,#chatView .bubble.assistant::before{content:"";position:absolute;left:12px;right:12px;top:2px;height:9px;border-radius:9px;background:linear-gradient(#ffffffa6,#ffffff00);pointer-events:none}
#chatView .bubble.user{background:linear-gradient(180deg,#6fd6ff 0%,#22a7f5 45%,#0a82e3 100%);color:#fff;border:2px solid #0b74cf;border-bottom-right-radius:20px;box-shadow:inset 0 -3px 6px #004f9a33,0 4px 10px #0a82e340;text-shadow:0 1px 1px #0057a855}
#chatView .bubble.assistant{background:linear-gradient(180deg,#fef1dd 0%,#ffdba6 55%,#fbce8b 100%);color:#3b220f;border:2px solid #f0b967;border-bottom-left-radius:20px;box-shadow:inset 0 -3px 6px #c0732626,0 4px 10px #f0b96733}
#chatView .bubble.user .bubble-sender{color:#e8f7ff}
#chatView .bubble.assistant .bubble-sender{color:#a35b13}
#chatView .bubble.user .bubble-time{color:#e2f4ff}
#chatView .bubble.assistant .bubble-time{color:#8f5c2a}
#chatView .bubble-seen{align-self:flex-end;margin:-4px 6px 0 0;font-size:10.5px;font-weight:600;color:#9aa1ad;opacity:.85}
#chatView .bubble-seen.is-seen{color:#1688de}
#chatView .chat-form{position:relative;align-items:center}
#chatView .chat-card .chat-form input{background:#f4f7fc;border-color:#e3e8f2}
#chatView .chat-card .chat-form button[type=submit]{background:linear-gradient(180deg,#6fd6ff,#1a9cf0 55%,#0a7ddc);border:2px solid #0b74cf;color:#fff;font-weight:800;box-shadow:inset 0 1px 0 #ffffff99,0 3px 8px #0a82e340}
#chatView .chat-card .chat-form .chat-emoji-btn{order:-1;flex:0 0 38px;width:38px;height:38px;min-width:0;padding:0;border-radius:50%;border:1.5px solid #9bd8fb;background:#eef9ff;font-size:19px;line-height:1;cursor:pointer}
#chatView .chat-card .chat-form .chat-emoji-btn:disabled{opacity:.45;cursor:default}
#chatView .chat-card .chat-form .chat-emoji-pop{position:absolute;left:10px;bottom:calc(100% + 6px);z-index:5;display:grid;grid-template-columns:repeat(9,32px);gap:2px;padding:8px;background:#fff;border:1px solid #e3e8f2;border-radius:16px;box-shadow:0 10px 28px #1c1a4a24}
#chatView .chat-card .chat-form .chat-emoji-pop[hidden]{display:none}
#chatView .chat-card .chat-form .chat-emoji-pop button{width:32px;height:32px;min-width:0;padding:0;border:0;border-radius:8px;background:transparent;font-size:19px;line-height:1;cursor:pointer;box-shadow:none}
#chatView .chat-card .chat-form .chat-emoji-pop button:hover,#chatView .chat-card .chat-form .chat-emoji-pop button:focus-visible{background:#fdf6eb}
@media(max-width:420px){#chatView .chat-card .chat-form .chat-emoji-pop{grid-template-columns:repeat(7,32px)}}

/* Matching compact blue and pink bubbles: sender/time share a row. */
#chatView .bubble{font-size:16.875px}
#chatView .bubble:is(.user,.assistant){display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:9px;row-gap:1px;padding:1px 10px;border-radius:12px;line-height:1.2}
#chatView .bubble:is(.user,.assistant)>.bubble-sender{grid-column:1;grid-row:1;min-width:0;overflow-wrap:anywhere;font-size:11px;line-height:1.1}
#chatView .bubble:is(.user,.assistant)>.bubble-time{grid-column:2;grid-row:1;align-self:center;font-size:10px;line-height:1.1;white-space:nowrap}
#chatView .bubble:is(.user,.assistant)>span{grid-column:1/-1;grid-row:2;min-width:0}
#chatView .bubble:is(.user,.assistant)::before{left:8px;right:8px;top:1px;height:4px}
#chatView .chat-card .chat-form input{font-size:16.875px}

/* Stable colour cues distinguish conversations without replacing names or read markers. */
#chatView .thread[data-chat-tone]{background:var(--chat-tone-bg);border-color:var(--chat-tone);box-shadow:inset 4px 0 var(--chat-tone)}
#chatView .thread[data-chat-tone] .thread-text strong,#chatView .thread[data-chat-tone] .thread-profile{color:var(--chat-tone)}
#chatView .thread[data-chat-tone] .thread-heart{color:var(--chat-tone);background:var(--chat-tone-bg);border:2px solid var(--chat-tone)}
#chatView .thread[data-chat-tone] img{border:2px solid var(--chat-tone)}
#chatView .thread[data-chat-tone].unread .thread-text strong{font-weight:900}
#chatView .thread[data-chat-tone].unread{box-shadow:inset 6px 0 var(--chat-tone)}
#chatView .thread[data-chat-tone].active{outline:2px solid var(--chat-tone);outline-offset:-2px}
#chatView .thread[data-chat-tone] .thread-unread{background:var(--chat-tone)}
#chatView .ibx-person[data-chat-tone]{border-color:var(--chat-tone);background:var(--chat-tone-bg);color:var(--chat-tone)}
#chatView .ibx-person[data-chat-tone] .ibx-person-dot{background:var(--chat-tone);color:#fff}
#chatView .ibx-person[data-chat-tone][aria-pressed=true]{box-shadow:inset 0 0 0 1px var(--chat-tone);font-weight:800}
#chatView .chat-card[data-chat-tone] .chat-head{background:var(--chat-tone-bg);border-bottom:2px solid var(--chat-tone)}
#chatView .chat-card[data-chat-tone] .chat-head strong{color:var(--chat-tone)}
#chatView .chat-card[data-chat-tone] .chat-head .avatar,#chatView .chat-card[data-chat-tone] .chat-monogram{border-color:var(--chat-tone);color:var(--chat-tone);box-shadow:none}

/* One conversation header on phones; the full inbox is one tap away. */
#chatView .chat-list-back{display:none;flex:0 0 36px;width:36px;height:38px;min-width:0;border:1px solid currentColor;border-radius:10px;background:#fff;color:var(--chat-tone,#67409b);font-family:inherit;font-size:30px;font-weight:700;line-height:1;cursor:pointer}
@media(max-width:780px){
  #chatView.conversation-open .section-head,#chatView.conversation-open .ibx{display:none}
  #chatView.conversation-open .chat-wrap{padding-top:8px}
  #chatView.conversation-open .chat-list-back{display:block}
  #chatView.conversation-open .chat-card{height:calc(100dvh - 160px - env(safe-area-inset-bottom,0px));min-height:300px}
  #chatView.conversation-open .messages{min-height:0;max-height:none;overflow-y:auto}
  #chatView.conversation-open .chat-head,#chatView.conversation-open .chat-form,#chatView.conversation-open .chat-image-preview{flex-shrink:0}
}
#chatView .chat-card .chat-form .chat-image-btn{order:-1;flex:0 0 34px;width:34px;height:38px;min-width:0;padding:0;border:1px solid #9bd8fb;border-radius:10px;background:#eef9ff;font-size:19px;cursor:pointer}
#chatView .chat-image-preview[hidden]{display:none}
#chatView .chat-image-preview{display:flex;gap:8px;align-items:center;padding:7px 10px;background:#f4f7fc;border-top:1px solid #e3e8f2;font-size:12px}
#chatView .chat-image-preview img{width:44px;height:44px;object-fit:contain;border-radius:7px}
#chatView .chat-image-preview span{flex:1;min-width:0}
#chatView .chat-image-preview button{width:34px;height:34px;flex:0 0 34px;border:1px solid #b91c1c;color:#b91c1c;border-radius:50%;background:#fff;font-size:23px;cursor:pointer}
#chatView .bubble .chat-image-link{display:block;max-width:100%;min-width:0}
#chatView .bubble .chat-image{display:block;width:auto;max-width:100%;max-height:220px;border-radius:8px;object-fit:contain}
#chatView .bubble:is(.user,.assistant).has-image{padding:6px 8px}
#chatView .bubble:is(.user,.assistant)>.chat-image-link{grid-column:1/-1;grid-row:2}
#chatView .bubble:is(.user,.assistant).has-image>span{grid-row:3}
/* Firm warnings stay red in every section, including the numbered-image refusal. */
.toast.notice-tone-warning,.toast.notice-tone-error{--notice-bg:#fff1f2;--notice-border:#fca5a5;--notice-ink:#991b1b;--notice-accent:#dc2626}
#chatView .bubble.chat-warning,.pf-note.warn,.pf-media-note.warn,.alert-box,[role=alert]:not(.toast){color:#b91c1c;border-color:#fca5a5;background:#fff1f2;font-weight:800}
#chatView .bubble.chat-warning{max-width:100%;align-self:stretch;font-size:14px}
.firm-warning,[role=alert]:not(.toast){color:#b91c1c!important}
.firm-warning::before{content:'⚠ ';font-weight:900;color:#dc2626}



/* Shared compact, centered notification treatment: keep actions visible without obscuring the page. */
.eng-message-alert[hidden]{display:none}
.eng-message-alert{position:fixed;top:calc(10px + env(safe-area-inset-top));left:50%;transform:translateX(-50%);z-index:65;width:min(calc(100% - 44px),560px);display:flex;align-items:center;gap:11px;padding:10px 12px;border:1px solid #f2e0c6;border-radius:22px;background:#fff;color:#15223c;box-shadow:0 8px 28px #5b34172e;animation:eng-alert-enter .25s ease-out}
.eng-alert-bell{position:relative;display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;border-radius:50%;background:linear-gradient(145deg,#ffa825,#bc6207);color:#fff;font-size:21px}
.eng-alert-count{position:absolute;top:-5px;right:-5px;min-width:20px;height:20px;padding:1px 4px;border:2px solid #fff;border-radius:99px;background:#fa8612;color:#fff;text-align:center;font-size:11px;font-weight:900;line-height:16px}
.eng-alert-copy{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.eng-message-alert strong{font-size:13px;line-height:1.25;font-weight:850;color:#15223c}
.eng-alert-copy small{font-size:11px;line-height:1.3;color:#66738a}
.eng-message-alert button{flex:0 0 auto;min-height:36px;border:0;border-radius:99px;padding:7px 12px;font-size:12px;font-weight:850;color:#fff;background:linear-gradient(115deg,#ff8408,#b85c00)}
.eng-message-alert [data-dismiss]{min-width:30px;padding:4px 5px;background:transparent;color:#718098;font-size:24px;line-height:1}
.eng-message-alert button:focus-visible{outline:3px solid #3b82f6;outline-offset:2px}
@keyframes eng-alert-enter{from{opacity:0;transform:translate(-50%,-8px)}to{opacity:1;transform:translate(-50%,0)}}
@media(max-width:420px){.eng-message-alert{width:calc(100% - 36px);gap:7px;padding:9px 8px;border-radius:17px}.eng-alert-bell{flex-basis:35px;width:35px;height:35px;font-size:18px}.eng-message-alert strong{font-size:12px}.eng-alert-copy small{font-size:10px}.eng-message-alert button{font-size:11px;padding:7px 9px}.eng-message-alert [data-dismiss]{font-size:21px;min-width:24px}}
@media(prefers-reduced-motion:reduce){.eng-message-alert{animation:none}}
/* Keep existing status and error messages semantically distinct, but use the same light, compact visual language. */
.toast[class*="notice-tone-"]{border-radius:15px;box-shadow:0 8px 22px #25304a20}
.status-notice{border-radius:13px}


/* Compact Search: keep the filters together and profiles above the fold. */
#searchView .brand-showcase{flex-direction:row;justify-content:flex-start;gap:10px;padding:5px 12px;min-height:0;height:auto}
#searchView .hero-logo-stage{width:112px;aspect-ratio:1169/562}
#searchView .hero-logo{object-fit:contain}
#searchView .banner-shade{align-items:flex-start;text-align:left;gap:2px;min-width:0}
#searchView .banner-kicker{font-size:10px;letter-spacing:.7px;line-height:1.3}
#searchView .banner-caption{font-size:12px;line-height:1.3}
#searchView .hero{margin:8px 10px 0;padding:9px 10px 7px;border:1px solid #ece0cd;border-radius:12px;background:linear-gradient(115deg,#fffaf3,#f2efff);overflow:hidden}
#searchView .hero:before{height:3px}
#searchView .hero h1{font-size:clamp(17px,3.6vw,22px);line-height:1.25;margin:0 0 8px;letter-spacing:-.3px}
#searchView .search-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 78px;gap:6px;margin:0}
#searchView #searchText{grid-column:1/3;grid-row:1;background:#fff;border-color:#dfcdb3}
#searchView #searchBtn{grid-column:3;grid-row:1;padding:6px 8px;font-size:14px;line-height:1.2}
#searchView #ageFilter{grid-column:1;grid-row:2;background:#f1edff;border-color:#d2c2f0;color:#56327c}
#searchView #locationFilter{grid-column:2/4;grid-row:2;background:#eaf9f5;border-color:#b5dfd5;color:#205f57}
#searchView .search-panel .field{width:100%;min-width:0;height:44px;min-height:44px;border-radius:9px;padding:7px 9px;font-size:16px}
#searchView .search-info{margin-top:6px;font-size:11px;line-height:1.4;color:#77576a}
#searchView .search-info summary{cursor:pointer;min-height:28px;display:flex;align-items:center;gap:4px;font-weight:750;list-style:none;width:fit-content}
#searchView .search-info summary:before{content:'ⓘ +';color:#9d6227}
#searchView .search-info[open] summary:before{content:'ⓘ −'}
#searchView .search-info p{margin:3px 0;font-size:12px;line-height:1.4}
#searchView>.section-head{padding:10px 12px 5px;align-items:center;flex-wrap:nowrap;gap:6px}
#searchView>.section-head h2{font-size:18px;margin:0}
#searchView>.section-head h2:after{margin-top:4px}
#searchView #profileCount{flex:0 0 auto;font-size:12px;white-space:nowrap}
#searchView #profileGrid{padding-top:5px}
@media(min-width:760px){
 #searchView .search-panel{grid-template-columns:minmax(220px,2fr) minmax(120px,1fr) minmax(170px,1fr) 90px}
 #searchView #searchText{grid-column:1;grid-row:1}
 #searchView #ageFilter{grid-column:2;grid-row:1}
 #searchView #locationFilter{grid-column:3;grid-row:1}
 #searchView #searchBtn{grid-column:4;grid-row:1}
}

