:root{--install-ribbon-height:0px;--safe-top:env(safe-area-inset-top,0px);--app-top-inset:max(var(--safe-top),var(--install-ribbon-height))}
.install-ribbon{position:fixed;inset:0 0 auto;z-index:80;padding:env(safe-area-inset-top,0px) max(10px,env(safe-area-inset-right,0px)) 0 max(10px,env(safe-area-inset-left,0px));color:#f4edf8;background:#21182e;border-bottom:1px solid #b78af538;box-shadow:0 3px 16px #07080e35}
.install-ribbon[hidden]{display:none!important}
.install-ribbon-inner{display:flex;align-items:center;gap:10px;min-height:62px;max-width:1120px;margin:auto;padding:8px 0}
.install-ribbon-icon{flex:none;border-radius:10px}
.install-ribbon-copy{flex:1;min-width:0;line-height:1.45}
.install-ribbon-copy strong{display:block;font-size:13px;font-weight:650;word-break:keep-all}
.install-ribbon-copy>span{display:flex;align-items:center;gap:4px;color:#c7b5d9;font-size:11px;margin-top:2px}
.install-ribbon-copy img{object-fit:contain}
.install-ribbon-copy b{color:#f3d5ff;font-weight:650}
.install-ribbon-action{flex:none;min-height:38px;max-width:142px;padding:8px 13px;border-radius:9px;background:#8a54eb;color:white;font-size:12px;font-weight:650;line-height:1.4;word-break:keep-all}
.install-ribbon-action:disabled{opacity:.65;cursor:wait}
.install-ribbon-help{flex:none;background:transparent;color:#d0b9e4;font-size:10px;padding:6px 2px;text-decoration:underline;max-width:48px;line-height:1.5}
.install-ribbon-close{display:grid;place-items:center;flex:none;width:36px;height:40px;padding:8px;background:transparent;color:#b8a8c7}
.install-ribbon-close svg{width:18px;height:18px}
.install-ribbon button:focus-visible{outline:2px solid #dcc1ff;outline-offset:3px}
#lobby,#character-home,body.has-install-ribbon #lobby,body.has-install-ribbon #character-home{padding-top:var(--app-top-inset)}
body.has-install-ribbon .name-entry{padding-top:calc(var(--install-ribbon-height) + 24px)}
body.has-install-ribbon .call-overlay,.call-view .call-overlay{padding-top:calc(var(--app-top-inset) + 16px)}
/* Move controls only; retain the full video viewport, including while typing. */
.call-view .call-overlay{padding-bottom:calc(max(15px,var(--safe-bottom)) + var(--keyboard-inset,0px) + 15px)}
/* The ribbon's measured height already includes the iPhone safe area. Keep
   header and side actions on the same origin instead of overlapping them. */
.call-view .feature-request{top:calc(var(--app-top-inset) + 76px)}
.call-view .call-overlay{padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.ai-disclosure{position:fixed;z-index:45;right:max(8px,env(safe-area-inset-right,0px));bottom:max(4px,env(safe-area-inset-bottom,0px));color:#99979f;font-size:10px;font-weight:400;line-height:1.3;letter-spacing:0;pointer-events:none;user-select:none;text-shadow:0 1px 3px #0009}
@media(max-width:360px){.install-ribbon-inner{gap:7px}.install-ribbon-icon{width:30px;height:30px}.install-ribbon-copy strong{font-size:12px}.install-ribbon-action{font-size:11px;padding-inline:9px;max-width:110px}.install-ribbon-close{width:30px}}
:root{--main-nav-height:calc(62px + env(safe-area-inset-bottom,0px))}
.main-nav{position:fixed;inset:auto 0 0;z-index:50;display:flex;justify-content:center;gap:clamp(36px,12vw,160px);height:var(--main-nav-height);padding:5px 12px calc(5px + env(safe-area-inset-bottom,0px));background:#100d19f5;border-top:1px solid #ffffff15;backdrop-filter:blur(18px)}
.main-nav button{min-width:80px;padding:4px 20px;background:transparent;color:#8f829f;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11px;font-weight:600}.main-nav button[aria-current=page]{color:#d4b3ff}.main-nav svg{width:21px;height:21px}.nav-chat-icon{position:relative;display:flex}.nav-chat-icon>b{position:absolute;left:14px;top:-6px;min-width:16px;padding:1px 4px;border-radius:10px;background:#a65ef2;color:white;font-size:9px;line-height:13px}
body.has-main-nav #lobby,body.has-main-nav #character-home{padding-bottom:calc(var(--main-nav-height) + 20px)}
body.has-main-nav:not(:has(#call:not([hidden]))) .ai-disclosure{bottom:calc(var(--main-nav-height) + 4px)}
body:has(#call:not([hidden])) .main-nav,body:has(#name-entry:not([hidden])) .main-nav{display:none}
.messenger-page{position:fixed;top:var(--messenger-top,0px);left:0;right:0;height:calc(var(--messenger-height,100dvh) - var(--main-nav-height));max-width:760px;margin:0 auto;padding-top:var(--app-top-inset);display:flex;flex-direction:column;background:#100d19;color:#f6eefb;overflow:hidden}
body.messenger-keyboard-open .messenger-page{height:var(--messenger-height,100dvh);padding-top:max(0px,calc(var(--safe-top) - var(--messenger-top,0px)))}
body.messenger-keyboard-open .main-nav{display:none}
body.messenger-keyboard-open .install-ribbon{visibility:hidden;pointer-events:none}
body.messenger-keyboard-open:not(:has(#call:not([hidden]))) .ai-disclosure{bottom:calc(var(--messenger-bottom-inset,0px) + 2px)}
body.messenger-open{background:#100d19;overflow:hidden}.chat-page-header{display:flex;align-items:center;gap:12px;min-height:86px;padding:18px 22px;border-bottom:1px solid #ffffff14;flex-shrink:0}.chat-page-header h1{font-size:23px;font-weight:650;letter-spacing:-.6px}.chat-page-header p{font-size:12px;color:#ac9bb8;margin-top:6px}.chat-settings{margin-left:auto;flex:none;min-height:40px;background:#23192e;color:#c8b1d9;padding:8px 11px;border:1px solid #68526f;border-radius:9px;font-size:11px}.chat-page-body{flex:1;overflow:auto;padding:8px 18px}.chat-thread{width:100%;display:flex;align-items:center;gap:13px;padding:18px 4px;border-bottom:1px solid #ffffff0e;background:transparent;text-align:left;color:inherit}.chat-thread>img{width:56px;height:56px;border-radius:50%;object-fit:cover;object-position:center 25%;background:#251d32}.chat-thread-copy{flex:1;min-width:0}.chat-thread-copy>strong{display:block;font-size:15px}.chat-thread-copy>span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;color:#a598b0;margin-top:6px}.chat-thread-meta{display:flex;align-items:flex-end;flex-direction:column;gap:8px;font-size:10px;color:#857b91}.chat-thread-meta b{border-radius:12px;background:#9a57e4;color:white;padding:3px 6px;min-width:20px;text-align:center;font-size:10px}.chat-empty{text-align:center;padding:70px 14px 30px;color:#aa9bb7}.chat-empty>span{display:flex;justify-content:center;color:#b088d9;margin-bottom:18px}.chat-empty svg{width:38px;height:38px}.chat-empty h2{font-size:18px;color:#e5d5ee;margin-bottom:13px}.chat-empty p{font-size:13px;line-height:1.9;margin-bottom:24px}
.chat-room-header{min-height:77px;padding:12px 16px;gap:10px}.chat-room-header h1{font-size:17px}.chat-room-header p{font-size:10px;margin-top:3px}.chat-icon-button{width:32px;min-height:44px;padding:0;background:none;color:#d3c3df;font:32px/1 sans-serif;flex:none}.chat-room-avatar{width:40px;height:40px;object-fit:cover;object-position:center 25%;border-radius:50%;background:#251d32}.chat-video-button{margin-left:auto;display:flex;align-items:center;gap:6px;min-height:40px;padding:9px 11px;border:1px solid #79618c;border-radius:10px;background:#342041;color:#e8cff9;font-size:11px;flex-shrink:0}.chat-video-button svg{width:17px;height:17px}
.chat-messages{flex:1;min-height:0;overflow:auto;padding:18px 18px 12px;overscroll-behavior:contain;scrollbar-width:thin}.chat-messages [data-chat-messages]{display:flex;flex-direction:column;gap:15px}.free-chat-bubble{max-width:85%;align-self:flex-start;background:#261d32;border:1px solid #ffffff08;border-radius:16px 16px 16px 4px;padding:11px 13px}.free-chat-bubble.mine{align-self:flex-end;background:#7444ae;border-radius:16px 16px 4px 16px}.free-chat-bubble p{font-size:14px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere}.free-chat-bubble time{display:block;text-align:right;margin-top:5px;font-size:9px;color:#c6b4d5;opacity:.75}.chat-load-older{display:block;margin:0 auto 18px;background:#241b30;border-radius:20px;padding:8px 14px;color:#b7a4c9;font-size:11px}.chat-typing{font-size:12px;color:#ae93c5;padding:15px 2px 4px}.chat-typing span{letter-spacing:3px}.chat-compose-area{padding:0 16px 14px;flex-shrink:0}.chat-error{color:#e6a4b8;font-size:12px;line-height:1.6;margin:8px 0;overflow-wrap:anywhere}.chat-error:empty{display:none}.chat-compose{display:flex;align-items:flex-end;gap:9px;background:#22192e;border:1px solid #70518a;border-radius:23px;padding:7px 8px 7px 16px}.chat-compose textarea{display:block;flex:1;min-width:0;resize:none;border:0;background:transparent;color:#fff;outline:none;font-size:16px;line-height:1.5;max-height:120px;padding:6px 0}.chat-compose textarea::placeholder{font-size:13px;color:#aa95bc}.chat-compose>button{flex:none;display:grid;place-items:center;border-radius:50%;width:36px;height:36px;background:#9453df;color:white}.chat-compose>button svg{width:19px;height:19px}
#call-to-chat{font-size:11px;min-height:38px;gap:5px}#call-to-chat svg{width:16px;height:16px}
.chat-message-meta{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin-top:5px}.chat-message-meta time{margin-top:0}.chat-send-status{color:#dfcceb;font-size:10px}.chat-retry{background:transparent;padding:2px 0;color:#ffd0dc;font-size:11px;text-decoration:underline;min-height:24px}.free-chat-bubble.send-failed{border-color:#f3a0bc77}.chat-retry:focus-visible{outline:2px solid #e8c0ff;outline-offset:3px}
.chat-reply-failure{display:flex;align-items:center;gap:8px;color:#dcb5c7;font-size:11px;line-height:1.6;padding:8px 3px}.chat-reply-failure>span{flex:1}.chat-reply-failure>button{flex:none;padding:7px 9px;border:1px solid #86637e;border-radius:8px;color:#efd3e5;background:#342236;font-size:11px}
/* A room uses the full visible area; Home and the inbox keep their navigation. */
body.messenger-room-open .main-nav{display:none}
body.messenger-room-open .messenger-page{height:var(--messenger-height,100dvh);background:#100d19;color:#f6eefb}
body.messenger-room-open{background:#100d19}
body.messenger-room-open:not(.messenger-keyboard-open) .ai-disclosure{bottom:3px;color:#ac9bb8;text-shadow:none}
.messenger-room-open .chat-room-header{background:#100d19;border-color:#ffffff14;min-height:68px;padding-block:10px}
.messenger-room-open .chat-room-header p{color:#ac9bb8}.messenger-room-open .chat-icon-button{color:#d3c3df}
.messenger-room-open .chat-video-button{background:#342041;border-color:#79618c;color:#e8cff9}
.messenger-room-open .chat-messages{padding:16px 14px 12px}
.messenger-room-open [data-chat-messages]{gap:13px}
.free-chat-row{display:flex;align-items:flex-start;gap:8px;width:100%}
.free-chat-row.mine{justify-content:flex-end}
.chat-sender-avatar{flex:none;width:34px;height:34px;border-radius:12px;object-fit:cover;object-position:center 25%;background:#251d32}
.chat-sender-copy{flex:1;min-width:0;max-width:calc(100% - 42px)}
.chat-sender-name{display:block;font-size:12px;font-weight:500;color:#e5d5ee;margin:0 0 5px 2px}
.chat-bubble-line{display:flex;align-items:flex-end;gap:5px;min-width:0}
.free-chat-row.mine .chat-bubble-line{flex-direction:row-reverse;width:calc(100% - 42px);max-width:calc(100% - 42px)}
.messenger-room-open .free-chat-bubble{max-width:calc(100% - 53px);flex:0 1 auto;min-width:0;align-self:auto;background:#261d32;border:0;border-radius:2px 13px 13px 13px;padding:9px 11px;box-shadow:0 1px 1px #00000014}
.messenger-room-open .free-chat-bubble.mine{background:#7444ae;border-radius:13px 2px 13px 13px}
.messenger-room-open .free-chat-bubble p{font-size:14px;line-height:1.55;color:#f6eefb}
.messenger-room-open .chat-message-meta{flex:none;display:flex;flex-direction:column;align-items:flex-start;gap:3px;margin:0 0 1px;max-width:64px;color:#c6b4d5}
.messenger-room-open .mine .chat-message-meta{align-items:flex-end}
.messenger-room-open .chat-message-meta time{font-size:9px;line-height:1.3;white-space:nowrap;color:#c6b4d5;opacity:1}
.messenger-room-open .chat-send-status{color:#dfcceb}.messenger-room-open .chat-retry{color:#ffd0dc;font-size:10px;min-height:20px;max-width:64px}
.messenger-room-open .free-chat-bubble.send-failed{outline:1px solid #f3a0bc77}
.messenger-room-open .chat-typing{color:#c6b4d5;padding:12px 0 4px 42px;font-size:11px}
.chat-typing-dots{display:inline-flex;align-items:center;gap:4px;min-height:31px;padding:0 12px;border-radius:2px 13px 13px 13px;background:#261d32}
.chat-typing-dots i{width:5px;height:5px;border-radius:50%;background:currentColor;animation:chat-dot-pulse 1.2s ease-in-out infinite}
.chat-typing-dots i:nth-child(2){animation-delay:.16s}.chat-typing-dots i:nth-child(3){animation-delay:.32s}
@keyframes chat-dot-pulse{0%,60%,100%{opacity:.4;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.chat-typing-dots i{animation:none;opacity:.8}}
.messenger-room-open .chat-unread{font-size:10px;line-height:1;color:#d6adff;font-weight:600}
.free-chat-row.continuation{margin-top:-7px}.free-chat-row.continuation .chat-sender-avatar{visibility:hidden}.free-chat-row.continuation .chat-sender-name{display:none}
.messenger-room-open .chat-load-older{background:#241b30;color:#b7a4c9;font-size:10px;padding:6px 12px;margin-bottom:14px}
.messenger-room-open .chat-compose-area{background:#100d19;padding:10px 12px max(14px,env(safe-area-inset-bottom,0px));border-top:1px solid #ffffff14}
.messenger-room-open .chat-compose{background:#22192e;border-color:#70518a;border-radius:20px;padding-left:13px}
.messenger-room-open .chat-compose textarea{color:#fff}.messenger-room-open .chat-compose textarea::placeholder{color:#aa95bc}
.messenger-room-open .chat-error,.messenger-room-open .chat-reply-failure{color:#e6a4b8}
.messenger-room-open .chat-reply-failure>button{color:#efd3e5;background:#342236;border-color:#86637e}
@media(max-width:360px){.chat-page-header{padding-inline:14px;gap:8px}.chat-page-header h1{font-size:21px}.chat-room-header{padding-inline:8px;gap:6px}.chat-room-header h1{font-size:16px}.chat-room-avatar{width:34px;height:34px}.chat-video-button{padding-inline:8px}.chat-page-header p{font-size:10px}.chat-settings{padding-inline:8px;font-size:10px}.chat-thread>img{width:48px;height:48px}.chat-messages{padding-inline:12px}.chat-compose-area{padding-inline:10px}.call-toolbar:has(#call-to-chat:not([hidden])){gap:6px}.call-toolbar:has(#call-to-chat:not([hidden])) .glass-button{padding-inline:9px;font-size:10px}}
