/* Parla chat identity. CSS-only appearance; original IDs, handlers and message semantics retained. */
body:has(:is(#roomBar,#tourBar,#screenTour):not(.hidden)){--text:#14151d;--muted:#606577;--line:#dfe3ef;--panel-solid:#fffdfa;--bg:#fffdfa;background:#fffdfa!important;color:#14151d!important}
body:has(:is(#roomBar,#tourBar,#screenTour):not(.hidden)) .app-shell{font-family:ParlaHomeInter,Inter,Arial,sans-serif!important;padding-bottom:14px!important}
body:has(:is(#roomBar,#tourBar,#screenTour):not(.hidden)) .topbar{margin-bottom:0!important;min-height:66px;border-color:#e4e7f1;background:#fffdfa!important}
body:has(:is(#roomBar,#tourBar,#screenTour):not(.hidden)) .brand-name{font:700 20px/1 ParlaHomeInter,Inter,sans-serif!important;letter-spacing:-.6px;color:#11121b!important}
body:has(:is(#roomBar,#tourBar,#screenTour):not(.hidden)) :is(.ui-lang-select,.v2-top-login,.topbar-action){min-height:44px!important;font-size:13px!important;border-color:#dfe3ed!important;background:#fffdfa!important;color:#4f5364!important}
body:has(:is(#roomBar,#tourBar):not(.hidden)) :is(.roombar,.tourbar){min-height:46px!important;padding:5px 2px!important;margin:0!important;border:0!important;background:transparent!important;gap:8px!important}
body:has(#roomBar:not(.hidden)) #roomBar .rb-main{gap:8px!important;flex-wrap:wrap}
body:has(#roomBar:not(.hidden)) #roomBar .rb-code,body:has(#roomBar:not(.hidden)) #roomBar .rb-code b{font:600 12px/1.5 ParlaHomeInter,Inter,sans-serif!important;letter-spacing:0!important;color:#283147!important}
body:has(#roomBar:not(.hidden)) #roomBar .rb-code b{color:#009baf!important}
body:has(#roomBar:not(.hidden)) #roomBar .rb-status{font-size:11px!important;color:#5d6377!important;max-width:100%}
body:has(:is(#roomBar,#tourBar):not(.hidden)) :is(#roomLeave,#tourEnd){min-height:44px!important;font-size:12px!important;color:#4652e7!important;text-underline-offset:4px}
body:has(:is(#roomBar,#tourBar):not(.hidden)) .workspace{gap:0!important}
body:has(:is(#roomBar,#tourBar):not(.hidden)) .conversation-card{border:0!important;border-radius:0!important;box-shadow:none!important;background:#fffdfa!important;min-height:0!important;overflow:visible!important}
body:has(:is(#roomBar,#tourBar):not(.hidden)) .conversation-head{padding:18px 6px!important;border-bottom:0!important;background:#fffdfa!important}
body:has(:is(#roomBar,#tourBar):not(.hidden)) .conversation-head h2{font:750 27px/1.15 ParlaHomeInter,Inter,sans-serif!important;letter-spacing:-1px!important;color:#11121b!important}
body:has(#roomBar:not(.hidden)) .room-v2-state:not(.hidden){display:grid!important;grid-template-columns:38px minmax(0,1fr)!important;gap:4px 12px!important;margin:0 4px 16px!important;padding:14px!important;border:1px solid #d7e2fc!important;border-radius:18px!important;background:#f2f7ff!important}
body:has(#roomBar:not(.hidden)) .room-v2-orb{width:34px!important;height:34px!important;grid-row:1/3;background:#e9ecff!important}
body:has(#roomBar:not(.hidden)) .room-v2-state-copy{gap:3px!important}
body:has(#roomBar:not(.hidden)) .room-v2-eyebrow{font:700 9px/1.5 ParlaHomeInter,Inter,sans-serif!important;letter-spacing:1.1px;color:#5b54ee!important}
body:has(#roomBar:not(.hidden)) .room-v2-state-copy strong{font:650 16px/1.3 ParlaHomeInter,Inter,sans-serif!important;color:#171927!important}
body:has(#roomBar:not(.hidden)) .room-v2-state-copy small{font:400 12px/1.4 ParlaHomeInter,Inter,sans-serif!important;color:#5e6478!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
body:has(#roomBar:not(.hidden)) .room-v2-state-side{grid-column:2!important;align-items:flex-start!important;flex-direction:column!important;gap:4px!important}
body:has(#roomBar:not(.hidden)) .room-v2-meta{font:400 12px/1.4 ParlaHomeInter,Inter,sans-serif!important;color:#5e6478!important;white-space:normal!important}
body:has(#roomBar:not(.hidden)) .room-v2-action:not(.hidden){min-height:44px!important;font-size:13px!important;color:#4652e7!important}
body:has(#roomBar:not(.hidden)) .room-v2-action.hidden{display:none!important}
body:has(#roomBar:not(.hidden)) .room-v2-state[data-state="error"]{background:#fff2f0!important;border-color:#df9d95!important}
body:has(#roomBar:not(.hidden)) .room-v2-state[data-state="reconnecting"]{background:#fff9ec!important;border-color:#e4c582!important}
body:has(#roomBar:not(.hidden)) #stream,body:has(#tourBar:not(.hidden)) #tourGuideFeed,#screenTour .tour-caption-stream{display:flex!important;flex-direction:column!important;gap:14px!important;flex:1;min-height:100px!important;max-height:52dvh!important;height:auto!important;padding:0 4px 14px!important;overflow-y:auto!important;overscroll-behavior:contain;background:#fffdfa!important;scrollbar-width:thin;scrollbar-color:#d4d9e9 #fffdfa}
body:has(#roomBar:not(.hidden)) #stream .empty{min-height:160px!important;color:#61687b!important;font-size:14px!important}
body:has(#roomBar:not(.hidden)) #stream .empty .sm{font-size:14px!important;color:#61687b!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat,body:has(#tourBar:not(.hidden)) #tourGuideFeed .tour-guide-translation-log,#screenTour .tour-caption{display:block!important;flex:none!important;width:fit-content!important;max-width:90%!important;min-width:0!important;margin:0 auto 0 0!important;padding:13px 14px 5px!important;border:1px solid #dce2ef!important;border-radius:19px 19px 19px 5px!important;background:#fff!important;color:#131725!important;text-align:left!important;box-shadow:none!important;overflow-wrap:anywhere!important;animation:none!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat.b,body:has(#tourBar:not(.hidden)) #tourGuideFeed .mine,#screenTour .tour-caption.mine{margin:0 0 0 auto!important;background:#4859f5!important;color:#fff!important;border-color:#4859f5!important;border-radius:19px 19px 5px 19px!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat .room-message-speaker,body:has(#tourBar:not(.hidden)) #tourGuideFeed .tour-caption-sender,#screenTour .tour-caption-sender{display:block!important;margin:0 0 9px!important;font:650 13px/1.4 ParlaHomeInter,Inter,sans-serif!important;color:#5850df!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat .tgt,body:has(#tourBar:not(.hidden)) #tourGuideFeed .tour-caption-text,#screenTour .tour-caption-text{display:block!important;margin:0!important;min-height:0!important;font:450 16px/1.5 ParlaHomeInter,Inter,sans-serif!important;letter-spacing:-.25px!important;color:#141724!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat.b :is(.room-message-speaker,.tgt),body:has(#tourBar:not(.hidden)) #tourGuideFeed .mine :is(.tour-caption-sender,.tour-caption-text),#screenTour .tour-caption.mine :is(.tour-caption-sender,.tour-caption-text){color:#fff!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat .src{display:block!important;flex:none!important;min-height:0!important;margin:7px 0 0!important;font:400 12px/1.4 ParlaHomeInter,Inter,sans-serif!important;color:#626a80!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat summary,.tour-original summary{display:flex!important;align-items:center;min-height:44px!important;gap:7px!important;font:400 12px/1.4 ParlaHomeInter,Inter,sans-serif!important;color:#626a80!important;cursor:pointer}
body:has(#roomBar:not(.hidden)) #stream .room-chat summary::before{content:"";width:12px;height:12px;flex-shrink:0;background:currentColor;-webkit-mask:url('../assets/brand/caret-down.svg') center/contain no-repeat;mask:url('../assets/brand/caret-down.svg') center/contain no-repeat}
body:has(#roomBar:not(.hidden)) #stream .room-chat details[open] summary::before{transform:rotate(180deg)}
body:has(#roomBar:not(.hidden)) #stream .room-chat .src>div,.tour-original>div{padding:0 0 8px!important;white-space:pre-wrap;font-size:13px!important;line-height:1.5!important;color:inherit!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat.b :is(.src,summary,.room-message-time){color:#f4f5ff!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat .room-message-time,body:has(#tourBar:not(.hidden)) .tour-caption-time,#screenTour .tour-caption-time{margin:0!important;min-height:14px!important;text-align:right!important;font:400 10px/1.4 ParlaHomeInter,Inter,sans-serif!important;color:#626a80!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat .tools{display:flex!important;justify-content:space-between!important;align-items:center!important;flex-wrap:wrap!important;gap:0!important;margin-top:7px!important;padding-top:2px!important;border-top:1px solid #e4e7f1!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat.b .tools{border-color:#7280f8!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat button[data-action],body:has(#tourBar:not(.hidden)) :is(.tour-caption-listen,.tour-caption-reply),#screenTour :is(.tour-caption-listen,.tour-caption-reply){min-height:44px!important;border:0!important;border-radius:8px!important;background:transparent!important;box-shadow:none!important;color:#4c4ee8!important;font:500 12px/1.3 ParlaHomeInter,Inter,sans-serif!important;cursor:pointer}
body:has(#roomBar:not(.hidden)) #stream .room-chat .tools button[data-action]{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;padding:8px 5px!important;flex:1 0 auto}
body:has(#roomBar:not(.hidden)) #stream .room-chat.b button[data-action]{color:#fff!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat button[data-action]:hover{background:#edf0ff!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat.b button[data-action]:hover{background:#3c4de6!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat .msg-reply-preview{border-left:3px solid #37c5cd!important;padding:9px 10px!important;background:#edf2ff!important;color:#3f4d7c!important;text-align:left!important;font-size:12px!important;display:block!important;width:100%!important;margin-bottom:10px!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat.b .msg-reply-preview{background:#3e4cce!important;color:#fff!important}
body:has(#roomBar:not(.hidden)) #roomControls:not(.hidden){padding:10px 4px 0!important;border-top:0!important;gap:6px!important;background:#fffdfa!important}
body:has(#roomBar:not(.hidden)) #roomControls .room-active-language{width:min(360px,100%)!important;margin:0 auto!important}
body:has(#roomBar:not(.hidden)) #roomControls .room-active-language .input-label{font:400 11px/1.4 ParlaHomeInter,Inter,sans-serif!important;color:#61687b!important;margin-bottom:5px!important}
body:has(#roomBar:not(.hidden)) #roomActiveLang{height:48px!important;min-height:48px!important;font:600 16px/1.4 ParlaHomeInter,Inter,sans-serif!important;color:#171b2c!important;background-color:#fff!important;border:1px solid #dce2ef!important;border-radius:15px!important}
body:has(#roomBar:not(.hidden)) .room-dock{padding:7px 2px 0!important;min-height:83px!important;grid-template-columns:1fr 76px 1fr!important;gap:8px!important}
body:has(#roomBar:not(.hidden)) .room-dock-side{min-height:70px!important;gap:6px!important;background:transparent!important;border-radius:14px!important;color:#535b74!important}
body:has(#roomBar:not(.hidden)) .room-dock-side small{font:400 12px/1.3 ParlaHomeInter,Inter,sans-serif!important}
body:has(#roomBar:not(.hidden)) .room-dock-icon{font-size:0!important;width:44px;height:44px;display:grid;place-items:center;border:1px solid #e0e5f0;border-radius:50%;background:#fff}
body:has(#roomBar:not(.hidden)) .room-dock-icon::before{content:"";width:23px;height:23px;background:#59617c;-webkit-mask:center/contain no-repeat;mask:center/contain no-repeat}
body:has(#roomBar:not(.hidden)) #roomTextToggle .room-dock-icon::before{-webkit-mask-image:url('../assets/brand/chat-keyboard.svg');mask-image:url('../assets/brand/chat-keyboard.svg')}
body:has(#roomBar:not(.hidden)) #roomSoundToggle .room-dock-icon::before{-webkit-mask-image:url('../assets/brand/chat-speaker.svg');mask-image:url('../assets/brand/chat-speaker.svg')}
body:has(#roomBar:not(.hidden)) #roomSoundToggle[aria-pressed="false"] .room-dock-icon::before{-webkit-mask-image:url('../assets/brand/chat-muted.svg');mask-image:url('../assets/brand/chat-muted.svg')}
body:has(#roomBar:not(.hidden)) #roomMic{width:76px!important;height:76px!important;min-height:76px!important;background:transparent!important;border:0!important;box-shadow:none!important}
body:has(#roomBar:not(.hidden)) #roomMic .mic-orb,body:has(#tourBar:not(.hidden)) #tourMic .mic-orb,#screenTour .tour-listener-mic .mic-orb{width:68px!important;height:68px!important;background:linear-gradient(125deg,#6651ff,#3188f2 55%,#13becb)!important;box-shadow:0 5px 15px #4081d125!important;border:0!important}
body:has(#roomBar:not(.hidden)) #roomMic .room-mic-glyph{width:34px!important;height:38px!important;border:0!important;border-radius:0!important;background:#fff!important;-webkit-mask:url('../assets/brand/chat-microphone.svg') center/contain no-repeat!important;mask:url('../assets/brand/chat-microphone.svg') center/contain no-repeat!important;position:static!important}
body:has(#roomBar:not(.hidden)) #roomMic .room-mic-glyph::before,body:has(#roomBar:not(.hidden)) #roomMic .room-mic-glyph::after{content:none!important}
body:has(#roomBar:not(.hidden)) #roomMic .mic-orb::before{content:none!important}
body:has(#roomBar:not(.hidden)) #roomMic.live .mic-orb,body:has(#roomBar:not(.hidden)) #roomMic.is-listening .mic-orb{box-shadow:0 0 0 5px #d4eff5,0 5px 15px #4081d125!important}
body:has(#roomBar:not(.hidden)) #composer{padding:8px 4px 14px!important;background:#fffdfa!important}
body:has(#roomBar:not(.hidden)) #textInput{font:400 16px/1.4 ParlaHomeInter,Inter,sans-serif!important;border-color:#cbd5ea!important;background:#fff!important;color:#151928!important;min-width:0!important}
body:has(#roomBar:not(.hidden)) #roomSend{background:#4859f5!important;color:#fff!important}
body:has(:is(#roomBar,#tourBar):not(.hidden)) button:focus-visible,#screenTour button:focus-visible{outline:3px solid #008a99!important;outline-offset:3px!important}
body:has(:is(#roomBar,#tourBar):not(.hidden)) button:disabled,#screenTour button:disabled{opacity:.5!important;cursor:not-allowed!important}
#screenTour .tour-listener-shell{font-family:ParlaHomeInter,Inter,sans-serif!important}
#screenTour .tour-listener-head h1{font:750 26px/1.2 ParlaHomeInter,Inter,sans-serif!important;color:#131725!important}
#screenTour :is(.tour-session-code,.compact-select,.tour-mute,.rb-leave){font-family:ParlaHomeInter,Inter,sans-serif!important;color:#3e4e9c!important}
#screenTour .tour-caption.mine :is(.tour-caption-time,.tour-caption-listen,.tour-original summary,.tour-caption-source){color:#f4f5ff!important}
#screenTour .tour-interactive-box{background:#fffdfa!important}
@media(max-width:650px){body:has(:is(#roomBar,#tourBar,#screenTour):not(.hidden)) .app-shell{width:calc(100% - 28px)!important}body:has(#roomBar:not(.hidden)) #roomBar{padding:3px 0!important;min-height:48px!important}body:has(#roomBar:not(.hidden)) #roomBar .rb-main{gap:0 7px!important}body:has(#roomBar:not(.hidden)) #roomBar .rb-code,body:has(#roomBar:not(.hidden)) #roomBar .rb-code b{font-size:10px!important}body:has(#roomBar:not(.hidden)) #roomBar .rb-status{font-size:10px!important}body:has(#roomBar:not(.hidden)) #roomLeave{padding:6px!important;font-size:11px!important}body:has(:is(#roomBar,#tourBar):not(.hidden)) .conversation-head{padding:18px 3px!important}body:has(:is(#roomBar,#tourBar):not(.hidden)) .conversation-head h2{font-size:26px!important}body:has(#roomBar:not(.hidden)) #stream,body:has(#tourBar:not(.hidden)) #tourGuideFeed,#screenTour .tour-caption-stream{max-height:45dvh!important}body:has(#roomBar:not(.hidden)) #stream .room-chat{max-width:96%!important;padding:12px 13px 4px!important}body:has(#roomBar:not(.hidden)) #stream .room-chat .tools button[data-action]{font-size:12px!important;padding:8px 4px!important}body:has(#roomBar:not(.hidden)) #roomControls .room-active-language .input-label{text-align:left!important;margin-left:12px!important}body:has(#roomBar:not(.hidden)) .room-v2-state:not(.hidden){padding:12px!important;margin:0 3px 15px!important}body:has(#roomBar:not(.hidden)) .room-v2-state-copy small{font-size:11px!important}.tour-original summary{font-size:12px!important}}
@media(max-width:350px){body:has(:is(#roomBar,#tourBar,#screenTour):not(.hidden)) .app-shell{width:calc(100% - 20px)!important}body:has(#roomBar:not(.hidden)) #roomBar .rb-status{flex-basis:100%}.room-message-speaker{font-size:12px!important}body:has(#roomBar:not(.hidden)) #stream .room-chat .tools button[data-action]{font-size:11px!important;gap:4px!important}body:has(#roomBar:not(.hidden)) #stream .room-chat .tools button::before{width:14px;height:14px}body:has(:is(#roomBar,#tourBar):not(.hidden)) .conversation-head h2{font-size:24px!important}}
@media(prefers-reduced-motion:reduce){body:has(:is(#roomBar,#tourBar,#screenTour):not(.hidden)) *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Match the selected compact rhythm without changing message order or handlers. */
body:has(:is(#roomBar,#tourBar):not(.hidden)) .conversation-card{gap:0!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat{position:relative!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat .room-message-time{float:right;margin-top:-28px!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat details[open]+.room-message-time{float:none;margin-top:0!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat .tools{clear:both}
body:has(#roomBar:not(.hidden)) #roomControls .room-active-language{position:relative!important}
body:has(#roomBar:not(.hidden)) #roomControls .room-active-language .input-label{position:absolute;top:6px;left:14px;z-index:1;pointer-events:none;margin:0!important}
body:has(#roomBar:not(.hidden)) #roomActiveLang{height:54px!important;min-height:54px!important;padding-top:17px!important;padding-bottom:4px!important;padding-right:30px!important;text-align:left!important;background-color:#fff!important}
@media(max-width:650px){body:has(:is(#roomBar,#tourBar):not(.hidden)) .conversation-head{padding:12px 3px!important}body:has(#roomBar:not(.hidden)) .room-v2-state:not(.hidden){padding:10px 12px!important}}

/* Retain original action labels/glyphs so no message markup is rewritten. */
body:has(#roomBar:not(.hidden)) #stream .room-chat .tools button::before{content:none!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat.a{margin:0 auto 0 0!important}
@media(max-width:650px){body:has(#roomBar:not(.hidden)) #stream{gap:10px!important;padding-bottom:8px!important;max-height:calc(45dvh + 10px)!important}body:has(#roomBar:not(.hidden)) .conversation-head{padding:10px 3px!important}body:has(#roomBar:not(.hidden)) .room-v2-state:not(.hidden){padding:9px 12px!important;margin-bottom:11px!important}body:has(#roomBar:not(.hidden)) #roomBar .rb-code,body:has(#roomBar:not(.hidden)) #roomBar .rb-code b{font-size:11px!important}body:has(#roomBar:not(.hidden)) #roomBar .rb-status{font-size:11px!important}}
@media(max-width:650px) and (max-height:780px){body:has(#roomBar:not(.hidden)) #stream{max-height:calc(100dvh - 480px)!important}}
body:has(#tourBar:not(.hidden)) #tourGuideFeed .mine :is(.tour-caption-time,.tour-caption-listen,.tour-original summary,.tour-caption-source){color:#f4f5ff!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat .tools button[data-action]{color:#4c4ee8!important;font:500 12px/1.3 ParlaHomeInter,Inter,sans-serif!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat.b .tools button[data-action]{color:#fff!important}
@media(max-width:650px){body:has(#roomBar:not(.hidden)) #stream .room-chat.a{max-width:90%!important}body:has(#roomBar:not(.hidden)) #stream .room-chat.b{min-width:min(82%,310px)!important}body:has(#roomBar:not(.hidden)) #stream .room-chat .tgt{font-size:17px!important}body:has(:is(#roomBar,#tourBar):not(.hidden)) .conversation-head h2{font-size:28px!important}body:has(#roomBar:not(.hidden)) #stream{max-height:calc(45dvh + 16px)!important}}
@media(max-width:350px){body:has(#roomBar:not(.hidden)) #stream .room-chat.a{max-width:96%!important}body:has(#roomBar:not(.hidden)) #stream .room-chat .tgt{font-size:16px!important}body:has(#roomBar:not(.hidden)) #stream .room-chat .tools button[data-action]{font-size:11px!important}body:has(:is(#roomBar,#tourBar):not(.hidden)) .conversation-head h2{font-size:24px!important}}
@media(max-width:650px) and (max-height:780px){body:has(#roomBar:not(.hidden)) #stream{max-height:calc(100dvh - 480px)!important}}
body:has(#roomBar:not(.hidden)) #roomControls .room-active-language:has(.language-select-with-flag) .input-label{left:52px!important}
body:has(#roomBar:not(.hidden)) #stream .room-chat :is(.tgt,.src>div){unicode-bidi:plaintext}
/* Stateful hidden classes retain priority over cosmetic layout. */
body:has(:is(#roomBar,#tourBar,#screenTour):not(.hidden)) :is(#stream,#tourGuideFeed,#roomControls,.room-v2-state).hidden,#screenTour .tour-caption-stream.hidden{display:none!important}
body:has(#tourBar:not(.hidden)) #tourMic .mic-icon,#screenTour #tourListenerMic .mic-icon{display:block!important;width:30px!important;height:34px!important;font-size:0!important;background:#fff!important;-webkit-mask:url('../assets/brand/chat-microphone.svg') center/contain no-repeat!important;mask:url('../assets/brand/chat-microphone.svg') center/contain no-repeat!important}
