/* Shared conversation styles. Application behavior stays in the existing
   controllers. Viewport variables are supplied by the UI viewport helper. */

   .room-workspace-v2,
   .guest-workspace-v2 {
       --workspace-viewport-height: 100vh;
       --chat-focus-topbar-height: 58px;
       background: #f3f5f6;
       color: #18262d;
   }
   
   @supports (height: 100dvh) {
       .room-workspace-v2,
       .guest-workspace-v2 {
           --workspace-viewport-height: 100dvh;
       }
   }
   
   .room-workspace-v2 {
       height: var(--chat-viewport-height, var(--workspace-viewport-height));
       overflow: hidden;
   }
   
   .room-workspace-v2 .room-topbar {
       background: rgba(255, 255, 255, .96);
       border-bottom: 1px solid #e2e7e9;
   }
   
   .room-workspace-v2 .room-page {
       display: grid;
       grid-template-columns: minmax(0, 1fr);
       grid-template-rows: minmax(0, 1fr) auto;
       align-items: stretch;
       gap: 12px;
       width: 100%;
       max-width: 1440px;
       min-height: 0;
       height: var(--chat-viewport-height, var(--workspace-viewport-height));
       margin: 0 auto;
       padding: calc(58px + env(safe-area-inset-top) + 12px)
           max(20px, env(safe-area-inset-right))
           max(12px, env(safe-area-inset-bottom))
           max(20px, env(safe-area-inset-left));
       overflow: hidden;
   }
   
   .room-workspace-v2 .workspace-stage {
       grid-column: 1;
       grid-row: 1;
       display: flex;
       flex-direction: column;
       min-width: 0;
       min-height: 0;
       height: 100%;
       overflow-y: auto;
       overscroll-behavior: contain;
   }
   
   .room-workspace-v2 .room-controls-disclosure {
       grid-column: 1;
       grid-row: 2;
       min-width: 0;
       min-height: 0;
       height: auto;
       position: relative;
       overflow: visible;
   }
   
   .room-workspace-v2 #room-loading-card,
   .room-workspace-v2 #room-error-card {
       grid-column: 1 / -1;
       grid-row: 1;
       z-index: 2;
       align-self: start;
       margin: 0;
   }
   
   .guest-workspace-v2 .guest-page {
       width: 100%;
       max-width: 980px;
       padding: 22px 20px 36px;
   }
   
   .guest-workspace-v2 .guest-page-heading {
       margin-bottom: 14px;
   }
   
   .room-workspace-v2 .room-chat-card,
   .guest-workspace-v2 .guest-chat-card {
       margin: 0;
       overflow: hidden;
       background: #fff;
       border: 1px solid #dce3e6;
       border-radius: 18px;
       box-shadow: 0 12px 36px rgba(28, 43, 52, .045);
   }
   
   .room-workspace-v2 #chat-container:not([hidden]),
   .guest-workspace-v2 #chat-container:not([hidden]) {
       display: flex;
       flex-direction: column;
       min-width: 0;
   }
   
   .room-workspace-v2 #chat-container:not([hidden]) {
       flex: 1 1 auto;
       min-height: 0;
       height: 100%;
   }
   
   .room-workspace-v2 #chat-container[hidden],
   .guest-workspace-v2 #chat-container[hidden],
   .room-workspace-v2 .workspace-status-banner[hidden],
   .guest-workspace-v2 .workspace-status-banner[hidden],
   .room-workspace-v2 .room-controls-disclosure[hidden] {
       display: none !important;
   }
   
   .room-workspace-v2 #room-control-card[hidden],
   .room-workspace-v2 .room-tool[hidden] {
       display: none !important;
   }
   
   .workspace-chat-toolbar {
       display: flex;
       align-items: center;
       gap: 12px;
       min-width: 0;
       min-height: 70px;
       padding: 12px 16px;
       background: #fff;
       border-bottom: 1px solid #e5e9eb;
   }
   
   .workspace-chat-identity {
       display: flex;
       flex: 1 1 auto;
       flex-direction: column;
       gap: 4px;
       min-width: 0;
   }
   
   .workspace-chat-identity strong {
       overflow: hidden;
       font-size: 15px;
       font-weight: 710;
       text-overflow: ellipsis;
       white-space: nowrap;
   }
   
   .workspace-chat-identity .chat-security {
       color: #52636b;
       font-size: 11px;
   }
   
   .workspace-chat-expiry {
       display: flex;
       flex: 0 0 auto;
       flex-direction: column;
       align-items: flex-end;
       gap: 2px;
       font-size: 11px;
       color: #637078;
   }
   
   .workspace-chat-expiry strong {
       font-size: 12px;
       font-variant-numeric: tabular-nums;
       color: #253741;
   }
   
   .room-workspace-v2 #room-chat-focus-bar,
   .guest-workspace-v2 #guest-chat-focus-bar {
       display: grid;
       flex: 0 0 38px;
       place-items: center;
       width: 38px;
       min-width: 38px;
       height: 38px;
       min-height: 38px;
       padding: 0;
       background: #f4f7f8;
       border: 1px solid #dce4e7;
       border-radius: 11px;
       color: #3d5360;
       cursor: pointer;
   }
   
   .room-workspace-v2 #room-chat-focus-bar:hover,
   .guest-workspace-v2 #guest-chat-focus-bar:hover {
       background: #e9f0f2;
   }
   
   .workspace-focus-icon {
       width: 18px;
       height: 18px;
       fill: none;
       stroke: currentColor;
       stroke-linecap: round;
       stroke-linejoin: round;
       stroke-width: 1.7;
   }
   
   .room-workspace-v2 #chat-container,
   .guest-workspace-v2 #chat-container {
       --chat-wash: #f2f5f7;
       --chat-own: #d4e1e9;
       --chat-peer: #fff;
       --chat-border: #c9d9e2;
       --chat-accent: #516b7c;
   }

   .room-workspace-v2 #chat-container { position: relative; }
   .creator-access-notice {
       position: absolute;
       z-index: 5;
       top: 43%;
       left: 50%;
       transform: translate(-50%, -50%);
       display: block;
       width: min(440px, calc(100% - 28px));
       max-height: calc(100% - 104px);
       overflow-y: auto;
       overscroll-behavior: contain;
       box-sizing: border-box;
       padding: 24px;
       border: 1px solid var(--chat-border, #c9d9e2);
       border-top: 4px solid var(--chat-accent, #516b7c);
       border-radius: 20px;
       background: linear-gradient(155deg, var(--chat-wash, #f2f5f7), var(--chat-peer, #fff) 60%);
       color: #28414e;
       box-shadow: 0 18px 60px rgb(30 50 65 / 24%), 0 0 0 5px rgb(255 255 255 / 55%);
       font-size: 14px;
       line-height: 1.5;
       overflow-wrap: anywhere;
   }
   .creator-access-notice[hidden] { display: none !important; }
   .creator-access-eyebrow {
       color: var(--chat-accent, #516b7c);
       font-size: 11px;
       font-weight: 800;
       letter-spacing: .12em;
       margin-bottom: 9px;
   }
   .creator-access-notice h3 {
       margin: 0 0 12px;
       color: #183543;
       font-size: clamp(19px, 2.5vw, 23px);
       line-height: 1.2;
       letter-spacing: -.03em;
   }
   .creator-access-method {
       display: inline-block;
       padding: 5px 10px;
       border-radius: 8px;
       border: 1px solid var(--chat-border, #c9d9e2);
       background: var(--chat-peer, #fff);
       font-size: 12px;
       font-weight: 650;
   }
   .creator-access-notice p { margin: 14px 0 20px; color: #4b626e; }
   .creator-access-actions { display: flex; gap: 10px; }
   .creator-access-notice button {
       flex: 1 1 0;
       min-height: 44px;
       min-width: 0;
       padding: 10px 14px;
       border: 1px solid var(--chat-border, #c9d9e2);
       border-radius: 11px;
       background: var(--chat-peer, #fff);
       color: inherit;
       font-size: 14px;
       font-weight: 700;
       cursor: pointer;
   }
   .creator-access-notice .creator-access-approve {
       background: #244c60;
       border-color: #244c60;
       color: #fff;
       box-shadow: 0 4px 12px rgb(36 76 96 / 20%);
   }
   .creator-access-notice button:hover:not(:disabled) { filter: brightness(.96); }
   .creator-access-notice button:focus-visible { outline: 3px solid #4684a3; outline-offset: 3px; }
   .creator-access-notice button:disabled { opacity: .5; cursor: wait; }
   .creator-access-feedback { font-size: 12px; margin-top: 10px; color: #7a3c2c; }
   .creator-access-feedback:empty { display: none; }
   @media (max-width: 480px), (max-height: 540px) {
       .creator-access-notice { padding: 16px; border-radius: 16px; }
       .creator-access-notice h3 { font-size: 19px; }
       .creator-access-notice p { margin: 10px 0 14px; font-size: 13px; }
   }
   
   .room-workspace-v2 #chat-container .chat-messages,
   .guest-workspace-v2 #chat-container .chat-messages {
       flex: 1 1 auto;
       min-height: 0;
       height: clamp(340px, 59dvh, 650px);
       padding: 18px 16px;
       background: linear-gradient(155deg, var(--chat-wash), #fff 130%);
   }
   
   .room-workspace-v2 #chat-container .chat-messages {
       height: auto;
       max-height: none;
   }
   
   .room-workspace-v2 #chat-container .chat-message-row.own .chat-message-bubble,
   .guest-workspace-v2 #chat-container .chat-message-row.own .chat-message-bubble {
       background: var(--chat-own);
       border: 1px solid var(--chat-border);
       color: #172831;
   }
   
   .room-workspace-v2 #chat-container .chat-message-row.peer .chat-message-bubble,
   .guest-workspace-v2 #chat-container .chat-message-row.peer .chat-message-bubble {
       background: var(--chat-peer);
       border-color: var(--chat-border);
       color: #172831;
   }
   
   .room-workspace-v2 #chat-container .chat-composer,
   .guest-workspace-v2 #chat-container .chat-composer {
       flex: 0 0 auto;
       position: relative;
       background: #fff;
   }
   
   .workspace-status-banner {
       display: flex;
       align-items: flex-start;
       gap: 12px;
       margin: 0 0 12px;
       padding: 14px 16px;
       background: #f3f7f8;
       border: 1px solid #dbe5e8;
       border-radius: 14px;
       color: #28414e;
   }
   
   .workspace-status-banner[data-status="pending"] {
       background: #faf7ef;
       border-color: #ebe0c9;
       color: #574527;
   }
   
   .workspace-status-banner[data-status="error"] {
       background: #fbf2f1;
       border-color: #efd8d5;
       color: #744741;
   }
   
   .workspace-status-banner strong {
       display: block;
       margin-bottom: 3px;
       font-size: 13px;
   }
   
   .workspace-status-banner p {
       margin: 0;
       font-size: 12px;
       line-height: 1.5;
   }
   
   .workspace-approval-actions {
       display: flex;
       flex-wrap: wrap;
       gap: 8px;
       margin-top: 10px;
   }
   
   .room-workspace-v2 .workspace-approval-actions .room-action-button {
       width: auto;
       min-width: 130px;
       margin: 0;
   }
   
   .room-controls-disclosure {
       overflow: hidden;
       background: #fff;
       border: 1px solid #dce3e6;
       border-radius: 16px;
       box-shadow: 0 12px 36px rgba(28, 43, 52, .035);
   }
   
   .room-controls-disclosure > summary {
       display: flex;
       align-items: center;
       justify-content: space-between;
       gap: 10px;
       padding: 14px 17px;
       cursor: pointer;
       font-size: 13px;
       font-weight: 700;
       list-style: none;
   }
   
   .room-controls-disclosure > summary::-webkit-details-marker {
       display: none;
   }
   
   .room-controls-disclosure > summary::after {
       content: "+";
       font-size: 18px;
       font-weight: 400;
       line-height: 1;
   }
   
   .room-controls-disclosure[open] > summary::after {
       content: "−";
   }
   
   .room-workspace-v2 .room-options-card {
       position: relative;
       display: grid;
       grid-template-columns: minmax(132px, 180px) minmax(0, 1fr);
       align-items: center;
       min-width: 0;
       min-height: 0;
       height: auto;
       margin: 0;
       padding: 0;
       overflow: visible;
       border: 0;
       border-radius: inherit;
       box-shadow: none;
   }
   
   .room-workspace-v2 .room-options-card .room-options-section,
   .room-workspace-v2 .room-options-card .invite-panel.room-options-section,
   .room-workspace-v2 .room-options-card .active-panel.room-options-section {
       padding: 15px 17px;
   }
   
   .room-workspace-v2 .room-options-card .room-control-heading {
       flex-wrap: wrap;
       gap: 8px;
       min-width: 0;
       padding: 12px 14px;
       border-right: 1px solid #e8ecee;
       border-bottom: 0;
   }
   
   .room-workspace-v2 .room-options-eyebrow {
       display: none;
   }
   
   .room-workspace-v2 .room-control-title .room-status {
       margin-top: 4px;
       font-size: 11px;
   }
   
   .room-workspace-v2 .room-countdown-box {
       min-width: 0;
       padding: 5px 8px;
   }
   
   .room-workspace-v2 .room-control-title h1 {
       overflow: hidden;
       margin: 0;
       font-size: 14px;
       line-height: 1.3;
       letter-spacing: -.01em;
       text-overflow: ellipsis;
       white-space: nowrap;
   }
   
   .room-workspace-v2 .room-options-card .room-options-section h2 {
       font-size: 13px;
   }
   
   .room-workspace-v2 .room-tool-list {
       display: grid;
       grid-auto-flow: column;
       grid-auto-columns: minmax(0, 1fr);
       align-items: stretch;
       gap: 6px;
       min-width: 0;
       min-height: 0;
       padding: 6px;
   }
   
   .room-workspace-v2 .room-tool-list > .room-tool {
       min-width: 0;
       margin: 0;
       padding: 0;
       border: 0;
       border-radius: 11px;
       background: transparent;
   }
   
   .room-workspace-v2 .room-tool > summary {
       display: flex;
       flex-direction: column;
       align-items: center;
       justify-content: center;
       gap: 5px;
       min-width: 0;
       min-height: 66px;
       height: 100%;
       padding: 8px 4px;
       color: #304753;
       border: 1px solid transparent;
       border-radius: 11px;
       cursor: pointer;
       font-size: 11px;
       font-weight: 680;
       line-height: 1.25;
       text-align: center;
       list-style: none;
   }
   
   .room-workspace-v2 .room-tool > summary > span {
       min-width: 0;
       max-width: 100%;
       overflow-wrap: anywhere;
   }
   
   .room-workspace-v2 .room-tool > summary::-webkit-details-marker {
       display: none;
   }
   
   .room-workspace-v2 .room-tool > summary::after {
       display: none;
   }
   
   .room-workspace-v2 .room-tool > summary:hover,
   .room-workspace-v2 .room-tool[open] > summary {
       background: #f2f6f7;
       border-color: #e1e9ec;
   }
   
   .room-workspace-v2 .room-tool > summary svg {
       flex: 0 0 19px;
       width: 19px;
       height: 19px;
       fill: none;
       stroke: currentColor;
       stroke-width: 1.7;
       stroke-linecap: round;
       stroke-linejoin: round;
   }
   
   .room-workspace-v2 .room-tool-danger > summary {
       color: #87534c;
   }
   
   .room-workspace-v2 .room-tool-danger > summary:hover,
   .room-workspace-v2 .room-tool-danger[open] > summary {
       background: #fbf4f2;
       border-color: #f1dfda;
   }
   
   .room-workspace-v2 .room-tool:not([open]) > .room-tool-panel {
       display: none;
   }
   
   .room-workspace-v2 .room-tool-panel {
       position: fixed;
       z-index: 90;
       top: calc(var(--chat-viewport-top, 0px) + 58px + env(safe-area-inset-top) + 12px);
       right: max(12px, env(safe-area-inset-right), calc((100vw - 1440px) / 2 + 20px));
       bottom: auto;
       left: auto;
       width: min(420px, calc(100vw - 24px));
       height: auto;
       max-height: calc(var(--chat-viewport-height, var(--workspace-viewport-height))
           - 58px - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px);
       overflow-x: hidden;
       overflow-y: auto;
       overscroll-behavior: contain;
       background: #fff;
       border: 1px solid #dce3e6;
       border-radius: 16px;
       box-shadow: 0 18px 46px rgba(28, 43, 52, .12);
   }
   
   .room-workspace-v2 .room-tool-close {
       position: sticky;
       z-index: 1;
       top: 0;
       display: block;
       width: 100%;
       min-height: 44px;
       padding: 10px 17px;
       background: #fff;
       border: 0;
       border-bottom: 1px solid #e8ecee;
       color: #435d6a;
       cursor: pointer;
       font: inherit;
       font-size: 12px;
       font-weight: 690;
       text-align: left;
   }
   
   .room-workspace-v2 .room-tool-close:hover {
       background: #f3f7f8;
   }
   
   .room-workspace-v2 .room-tool-panel .room-options-section {
       border: 0;
   }
   
   .workspace-theme-menu {
       margin-top: 12px;
       padding: 12px 14px;
       background: #fff;
       border: 1px solid #e0e6e9;
       border-radius: 14px;
   }
   
   .workspace-theme-menu > summary {
       cursor: pointer;
       font-size: 13px;
       font-weight: 680;
   }
   
   .workspace-theme-menu p {
       margin: 10px 0;
       color: #5c6a72;
       font-size: 12px;
       line-height: 1.45;
   }
   
   .workspace-theme-grid {
       display: grid;
       grid-template-columns: repeat(5, minmax(0, 1fr));
       gap: 8px;
       margin-top: 10px;
   }
   
   .workspace-theme-choice {
       display: grid;
       place-items: center;
       width: 100%;
       min-height: 42px;
       padding: 4px;
       background: #fff;
       border: 1px solid #dfe6e8;
       border-radius: 10px;
       cursor: pointer;
   }
   
   .workspace-theme-choice::before {
       content: "";
       width: 24px;
       height: 24px;
       background: var(--swatch-color, #e5edf1);
       border: 1px solid rgba(38, 60, 71, .12);
       border-radius: 50%;
   }
   
   .workspace-theme-choice[aria-pressed="true"] {
       border-color: #435f70;
       box-shadow: 0 0 0 1px #435f70 inset;
   }
   
   .room-workspace-v2 #chat-container[data-chat-theme="lavender"],
   .guest-workspace-v2 #chat-container[data-chat-theme="lavender"] {
       --chat-wash: #f5f2fa;
       --chat-own: #e1d6ef;
       --chat-border: #d8cbe7;
       --chat-accent: #6b5d81;
   }
   
   .room-workspace-v2 #chat-container[data-chat-theme="sage"],
   .guest-workspace-v2 #chat-container[data-chat-theme="sage"] {
       --chat-wash: #f1f6f0;
       --chat-own: #d6e6d3;
       --chat-border: #c8dec6;
       --chat-accent: #5d765f;
   }
   
   .room-workspace-v2 #chat-container[data-chat-theme="sand"],
   .guest-workspace-v2 #chat-container[data-chat-theme="sand"] {
       --chat-wash: #f9f6ef;
       --chat-own: #ecdfc9;
       --chat-border: #e4d3b5;
       --chat-accent: #796d55;
   }
   
   .room-workspace-v2 #chat-container[data-chat-theme="rose"],
   .guest-workspace-v2 #chat-container[data-chat-theme="rose"] {
       --chat-wash: #faf3f5;
       --chat-own: #efd5df;
       --chat-border: #e6c7d3;
       --chat-accent: #8a6372;
   }
   
   .room-workspace-v2 #chat-container[data-chat-theme="sky"],
   .guest-workspace-v2 #chat-container[data-chat-theme="sky"] {
       --chat-wash: #f0f7fa;
       --chat-own: #d2e8f1;
       --chat-border: #c5dfe9;
       --chat-accent: #527b8e;
   }
   
   .room-workspace-v2 #chat-container[data-chat-theme="mint"],
   .guest-workspace-v2 #chat-container[data-chat-theme="mint"] {
       --chat-wash: #f0f8f6;
       --chat-own: #d1eadd;
       --chat-border: #c3dfd2;
       --chat-accent: #537b6d;
   }
   
   .room-workspace-v2 #chat-container[data-chat-theme="lilac"],
   .guest-workspace-v2 #chat-container[data-chat-theme="lilac"] {
       --chat-wash: #f7f4f9;
       --chat-own: #e8dcf0;
       --chat-border: #ddcfea;
       --chat-accent: #796583;
   }
   
   .room-workspace-v2 #chat-container[data-chat-theme="peach"],
   .guest-workspace-v2 #chat-container[data-chat-theme="peach"] {
       --chat-wash: #fcf5f1;
       --chat-own: #f2ddd0;
       --chat-border: #e9cdbd;
       --chat-accent: #8a705d;
   }
   
   .room-workspace-v2 #chat-container[data-chat-theme="graphite"],
   .guest-workspace-v2 #chat-container[data-chat-theme="graphite"] {
       --chat-wash: #f3f4f4;
       --chat-own: #d9e2e3;
       --chat-border: #cbd6d8;
       --chat-accent: #56656a;
   }
   
   .room-workspace-v2 :is(button, summary, textarea, input):focus-visible,
   .guest-workspace-v2 :is(button, summary, textarea, input):focus-visible {
       outline: 2px solid #456c80;
       outline-offset: 2px;
   }
   
   /* Keep focused chat inside the visible viewport, including the keyboard. */
   .room-workspace-v2.room-chat-focused .room-page,
   .guest-workspace-v2.guest-chat-focused .guest-page {
       display: block;
       max-width: none;
       height: var(--chat-viewport-height, var(--workspace-viewport-height));
       padding: 0;
   }
   
   .room-workspace-v2.room-chat-focused .room-topbar {
       top: var(--chat-viewport-top, 0px);
       right: auto;
       left: var(--chat-viewport-left, 0px);
       width: var(--chat-viewport-width, 100%);
       height: calc(var(--chat-focus-topbar-height) + env(safe-area-inset-top));
       min-height: 0;
   }
   
   .room-workspace-v2.room-chat-focused #chat-container,
   .guest-workspace-v2.guest-chat-focused #chat-container {
       position: fixed;
       top: var(--chat-viewport-top, 0px);
       right: auto;
       bottom: auto;
       left: var(--chat-viewport-left, 0px);
       display: flex;
       flex-direction: column;
       width: var(--chat-viewport-width, 100%);
       min-width: 0;
       min-height: 0;
       height: var(--chat-viewport-height, var(--workspace-viewport-height));
       max-height: none;
       margin: 0;
       overflow: hidden;
       border: 0;
       border-radius: 0;
       box-shadow: none;
   }
   
   .room-workspace-v2.room-chat-focused #chat-container {
       top: calc(var(--chat-viewport-top, 0px)
           + var(--chat-focus-topbar-height) + env(safe-area-inset-top));
       height: calc(var(--chat-viewport-height, var(--workspace-viewport-height))
           - var(--chat-focus-topbar-height) - env(safe-area-inset-top));
   }
   
   .guest-workspace-v2.guest-chat-focused #chat-container {
       padding-top: env(safe-area-inset-top);
   }
   
   .room-workspace-v2.room-chat-focused #chat-container .chat-messages,
   .guest-workspace-v2.guest-chat-focused #chat-container .chat-messages {
       flex: 1 1 0%;
       min-height: 0;
       height: auto;
       max-height: none;
       overflow-y: auto;
       overscroll-behavior: contain;
   }
   
   .room-workspace-v2.room-chat-focused #chat-container .chat-composer,
   .guest-workspace-v2.guest-chat-focused #chat-container .chat-composer {
       flex: 0 0 auto;
       min-width: 0;
       padding: 8px max(10px, env(safe-area-inset-right))
           max(8px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));
   }
   
   .room-workspace-v2.room-chat-focused #chat-container .chat-input,
   .guest-workspace-v2.guest-chat-focused #chat-container .chat-input {
       min-width: 0;
       min-height: 44px;
       max-height: max(44px, min(120px,
           calc(var(--chat-viewport-height, var(--workspace-viewport-height)) * .25)));
       font-size: 16px;
   }
   
   .room-workspace-v2.room-chat-focused #chat-container .chat-send-button,
   .guest-workspace-v2.guest-chat-focused #chat-container .chat-send-button {
       min-height: 44px;
   }
   
   @media (min-width: 1100px) {
       .room-workspace-v2 .room-tool > summary {
           flex-direction: row;
           gap: 8px;
           min-height: 58px;
           padding: 10px 8px;
           font-size: 12px;
       }
   }
   
   @media (max-width: 760px) {
       .room-workspace-v2 .room-page {
           gap: 9px;
       }
   
       .room-workspace-v2 .room-options-card {
           grid-template-columns: minmax(0, 1fr);
       }
   
       .room-workspace-v2 .room-options-card .room-control-heading {
           padding: 7px 12px;
           border-right: 0;
           border-bottom: 1px solid #e8ecee;
       }
   
       .room-workspace-v2 .room-control-title {
           display: flex;
           align-items: center;
           justify-content: space-between;
           gap: 10px;
           width: 100%;
       }
   
       .room-workspace-v2 .room-control-title h1 {
           flex: 1 1 auto;
           min-width: 0;
           font-size: 13px;
       }
   
       .room-workspace-v2 .room-control-title .room-status {
           flex: 0 0 auto;
           margin: 0;
       }
   
       .room-workspace-v2 .room-tool-list {
           gap: 3px;
           padding: 4px;
       }
   
       .room-workspace-v2 .room-tool > summary {
           gap: 4px;
           min-height: 60px;
           padding: 6px 2px;
           font-size: 10px;
       }
   
       .room-workspace-v2 .room-tool-panel {
           right: max(9px, env(safe-area-inset-right));
           left: max(9px, env(safe-area-inset-left));
           width: auto;
       }
   }
   
   @media (max-width: 600px) {
       .guest-workspace-v2 .guest-page {
           gap: 12px;
           padding: 12px max(9px, env(safe-area-inset-right)) 24px
               max(9px, env(safe-area-inset-left));
       }
   
       .room-workspace-v2 .room-page {
           padding: calc(58px + env(safe-area-inset-top) + 11px)
               max(9px, env(safe-area-inset-right))
               max(9px, env(safe-area-inset-bottom))
               max(9px, env(safe-area-inset-left));
       }
   
       .room-workspace-v2 .room-countdown-box .room-countdown-label:last-child {
           display: none;
       }
   
       .workspace-chat-toolbar {
           gap: 8px;
           min-height: 64px;
           padding: 10px 11px;
       }
   
       .workspace-chat-expiry {
           max-width: 82px;
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap;
       }
   
       .guest-workspace-v2 #chat-container .chat-messages {
           height: max(310px, 52dvh);
           padding: 12px 10px;
       }
   
       .room-workspace-v2 #chat-container .chat-messages {
           min-height: 0;
           height: auto;
           padding: 12px 10px;
       }
   
       .room-workspace-v2 .room-options-card .room-options-section,
       .room-workspace-v2 .room-options-card .invite-panel.room-options-section,
       .room-workspace-v2 .room-options-card .active-panel.room-options-section {
           padding: 14px;
       }
   
       .workspace-theme-grid {
           grid-template-columns: repeat(5, minmax(0, 1fr));
       }
   }
   
   /* Short landscape screens and keyboard-reduced viewports. */
   .room-workspace-v2[data-chat-viewport-compact="true"],
   .guest-workspace-v2[data-chat-viewport-compact="true"] {
       --chat-focus-topbar-height: 42px;
   }
   
   .room-workspace-v2.room-chat-focused[data-chat-viewport-compact="true"] .workspace-chat-toolbar,
   .guest-workspace-v2.guest-chat-focused[data-chat-viewport-compact="true"] .workspace-chat-toolbar {
       min-height: 44px;
       padding: 5px 10px;
   }
   
   .room-workspace-v2.room-chat-focused[data-chat-viewport-compact="true"] .workspace-chat-identity,
   .guest-workspace-v2.guest-chat-focused[data-chat-viewport-compact="true"] .workspace-chat-identity {
       gap: 2px;
   }
   
   .room-workspace-v2.room-chat-focused[data-chat-viewport-compact="true"] .workspace-chat-identity strong,
   .guest-workspace-v2.guest-chat-focused[data-chat-viewport-compact="true"] .workspace-chat-identity strong {
       font-size: 13px;
   }
   
   .room-workspace-v2.room-chat-focused[data-chat-viewport-compact="true"] .workspace-chat-expiry,
   .guest-workspace-v2.guest-chat-focused[data-chat-viewport-compact="true"] .workspace-chat-expiry {
       gap: 1px;
       font-size: 9px;
       line-height: 1.15;
   }
   
   .room-workspace-v2.room-chat-focused[data-chat-viewport-compact="true"] .workspace-chat-expiry strong,
   .guest-workspace-v2.guest-chat-focused[data-chat-viewport-compact="true"] .workspace-chat-expiry strong {
       font-size: 10px;
   }
   
   @media (max-height: 500px) {
       .room-workspace-v2,
       .guest-workspace-v2 {
           --chat-focus-topbar-height: 42px;
       }
   
       .room-workspace-v2.room-chat-focused .workspace-chat-toolbar,
       .guest-workspace-v2.guest-chat-focused .workspace-chat-toolbar {
           min-height: 44px;
           padding: 5px 10px;
       }
   }