/* 1ix Meet UI v3 — final layout layer
   Based on the persisted UI/UX Pro Max Enterprise Gateway system. */

:root {
    --ui-bg: #f4f7f8;
    --ui-surface: #ffffff;
    --ui-surface-soft: #f8fafb;
    --ui-text: #17232a;
    --ui-muted: #60717b;
    --ui-line: #dce5e9;
    --ui-primary: #147a70;
    --ui-primary-hover: #0f625a;
    --ui-primary-soft: #e8f5f2;
    --ui-danger: #d93642;
    --ui-radius-sm: 10px;
    --ui-radius-md: 16px;
    --ui-radius-lg: 24px;
    --ui-shadow-sm: 0 1px 2px rgba(18, 38, 46, .04);
    --ui-shadow-md: 0 12px 32px rgba(18, 38, 46, .08);
    --ui-shadow-lg: 0 24px 64px rgba(18, 38, 46, .11);
    --ui-fast: 180ms ease;
    --ui-focus: 0 0 0 3px rgba(20, 122, 112, .22);
    --ui-elevation-stage: 0 18px 48px rgba(12, 31, 38, .12);
}

/* ---------- Start page ---------- */

.start-body {
    min-height: 100dvh;
    overflow-x: hidden;
    color: var(--ui-text);
    background: var(--ui-bg) !important;
}

.start-body::before {
    opacity: .45;
    background-size: 56px 56px;
}

.start-body .visit-start-shell {
    width: min(100%, 1440px);
    min-height: 100dvh;
    margin-inline: auto;
    padding: clamp(32px, 4vw, 64px);
    display: grid;
    align-content: center;
    gap: 32px;
}

/* Compact, task-first landing and a fully RTL multi-step details flow. */
.start-body .visit-start-hero { align-items: start; }
.start-body .start-copy { padding-block: 12px; }
.start-body .start-copy h1 { max-width: 620px; font-size: clamp(34px, 4vw, 56px); }
.start-body .start-visual { max-height: 310px; overflow: hidden; }
.start-body .start-visual img { height: 310px; object-fit: cover; }
.start-body .start-dock { margin-top: 20px; }
.start-body .form-step,
.start-body .type-specific-fields,
.start-body .specific-grid,
.start-body .review-card { direction: rtl; text-align: right; }
.start-body .specific-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.start-body .type-specific-fields { margin-top: 12px; padding-top: 14px; border-top: 1px solid var(--ui-line); }
.start-body .review-card { display: flex; gap: 14px; align-items: flex-start; padding: 18px; margin: 22px 0; border: 1px solid var(--ui-line); border-radius: 14px; background: var(--ui-soft); }
.start-body .review-card > .material-icons { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; border-radius: 12px; color: var(--ui-primary); background: #fff; }
.start-body .review-card small,.start-body .review-card strong,.start-body .review-card p { display: block; }
.start-body .review-card strong { margin: 4px 0; font-size: 18px; }
.start-body .review-card p { margin: 0; color: var(--ui-muted-text); line-height: 1.8; }

.start-body .visit-start-hero {
    width: 100%;
    max-width: none;
    margin: 0;
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(560px, 1.1fr);
    gap: clamp(40px, 5vw, 72px);
    align-items: center;
}

.start-body .start-copy {
    min-width: 0;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    display: block !important;
    overflow: visible !important;
    color: var(--ui-text) !important;
    background: transparent !important;
    box-shadow: none !important;
}

.start-body .start-copy::before,
.start-body .start-copy::after {
    display: none !important;
}

.start-body .start-copy .brand-logo {
    position: static !important;
    inset: auto !important;
    width: 116px !important;
    height: 64px !important;
    margin: 0 0 28px !important;
    display: block;
    object-fit: contain;
    object-position: right center;
    filter: none !important;
}

.start-body .start-copy .eyebrow {
    width: fit-content;
    margin: 0 0 16px;
    color: var(--ui-primary-hover) !important;
    background: var(--ui-primary-soft) !important;
}

.start-body .start-copy h1 {
    max-width: 620px;
    margin: 0;
    color: var(--ui-text) !important;
    font-size: clamp(2.8rem, 4.2vw, 4.8rem);
    font-weight: 900;
    line-height: 1.18;
    letter-spacing: -.04em;
    text-shadow: none !important;
}

.start-body .start-copy .lead-text {
    max-width: 600px;
    margin: 20px 0 0;
    color: #465860 !important;
    font-size: 16px;
    line-height: 2;
    text-shadow: none !important;
}

.start-body .trust-row {
    margin-top: 22px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.start-body .trust-row span {
    min-height: 42px;
    padding: 7px 9px 7px 12px !important;
    border: 1px solid var(--ui-line) !important;
    border-radius: var(--ui-radius-sm);
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #3e5058 !important;
    background: var(--ui-surface) !important;
    backdrop-filter: none;
}

.start-body .trust-row span b {
    font-size: 12px;
}

.start-body .trust-row i {
    width: 28px;
    height: 28px;
    border: 0;
    color: var(--ui-primary);
    background: var(--ui-primary-soft);
}

.start-body .start-visual {
    margin: 24px 0 0;
    border: 1px solid var(--ui-line);
    border-radius: var(--ui-radius-md);
    overflow: hidden;
    background: #e9eeeb;
    box-shadow: var(--ui-shadow-md);
}

.start-body .start-visual img {
    width: 100%;
    height: clamp(210px, 19vw, 280px);
    display: block;
    object-fit: cover;
    object-position: center 46%;
}

.start-body .start-visual figcaption {
    position: static;
    padding: 14px 16px;
    border: 0;
    border-radius: 0;
    color: var(--ui-text);
    background: var(--ui-surface);
    backdrop-filter: none;
}

.start-body .start-visual figcaption b {
    font-size: 13px;
}

.start-body .start-visual figcaption span {
    margin-top: 3px;
    color: var(--ui-muted);
    font-size: 11px;
}

.start-body .start-panel {
    width: 100%;
    min-height: 0;
    margin: 0;
    padding: clamp(26px, 3vw, 38px);
    border: 1px solid var(--ui-line);
    border-radius: var(--ui-radius-lg);
    background: var(--ui-surface);
    box-shadow: var(--ui-shadow-lg);
    backdrop-filter: none;
}

.start-body .start-panel > .panel-heading {
    min-height: 56px;
    margin: 0 0 28px;
    padding: 0 0 20px;
    border-bottom: 1px solid #edf1f2;
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
}

.start-body .start-panel .panel-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
}

.start-body .start-panel .panel-heading h2 {
    margin: 0;
    font-size: 20px;
    line-height: 1.5;
}

.start-body .start-panel .panel-heading p {
    margin-top: 2px;
    color: var(--ui-muted);
    font-size: 12px;
}

.start-body .step-counter {
    min-width: 54px;
    display: flex;
    align-items: baseline;
    justify-content: flex-end;
    gap: 3px;
}

.start-body .meeting-kind-field > span {
    margin-bottom: 12px;
    color: #34454c;
    font-size: 14px;
}

.start-body .meeting-type-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
}

.start-body .meeting-type-card > span {
    min-height: 106px;
    padding: 16px 7px 12px;
    border: 1px solid var(--ui-line);
    border-radius: 13px;
    color: #506169;
    background: var(--ui-surface-soft);
    transition: border-color var(--ui-fast), background var(--ui-fast), box-shadow var(--ui-fast);
}

.start-body .meeting-type-card b {
    font-size: 13px;
}

.start-body .meeting-type-card small {
    max-width: none;
    color: #6f7f87;
    font-size: 10px;
}

.start-body .meeting-type-card input:checked + span {
    border-color: var(--ui-primary);
    color: var(--ui-primary-hover);
    background: var(--ui-primary-soft);
    box-shadow: 0 0 0 2px rgba(20, 122, 112, .1);
}

.start-body .type-preview {
    min-height: 0;
    margin-top: 16px;
    padding: 16px;
    border: 1px solid var(--ui-line);
    border-radius: 14px;
    grid-template-columns: 40px minmax(0, 1fr);
    background: #fbfcfc;
}

.start-body .type-preview strong {
    font-size: 14px;
}

.start-body .type-preview p {
    font-size: 12px;
}

.start-body .type-feature-list span {
    min-height: 28px;
    padding: 4px 8px;
    color: #3f5651;
    background: #edf3f1;
    font-size: 11px;
}

.start-body .step-next {
    width: 100%;
    min-height: 52px;
    margin-top: 18px;
    border-radius: 12px;
    background: var(--ui-primary);
    box-shadow: 0 10px 24px rgba(20, 122, 112, .18);
}

.start-body .step-next:hover {
    background: var(--ui-primary-hover);
}

.start-body .start-dock {
    width: 100%;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    background: transparent;
    direction: rtl;
    text-align: right;
}

.start-body .feature-heading {
    grid-column: 1 / -1;
    padding: 0 4px 8px;
    width: 100%;
    direction: rtl;
    text-align: right;
}

.start-body .feature-heading span {
    color: var(--ui-primary);
    font-size: 11px;
    font-weight: 800;
}

.start-body .feature-heading h2 {
    margin: 4px 0 0;
    color: var(--ui-text);
    font-size: 20px;
}

.start-body .dock-item {
    position: relative;
    min-width: 0;
    min-height: 106px;
    padding: 18px;
    border: 1px solid var(--ui-line) !important;
    border-radius: var(--ui-radius-md);
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    background: var(--ui-surface);
    box-shadow: var(--ui-shadow-sm);
}

.start-body .dock-item:hover {
    border-color: #b9d1cc !important;
    box-shadow: var(--ui-shadow-md);
    transform: none;
}

.start-body .dock-item > .material-icons {
    width: 40px;
    height: 40px;
    border-radius: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ui-primary);
    background: var(--ui-primary-soft);
    font-size: 20px;
}

.start-body .dock-item strong {
    display: block;
    color: var(--ui-text);
    font-size: 13px;
}

.start-body .dock-item small {
    display: block;
    margin-top: 4px;
    color: var(--ui-muted);
    font-size: 11px;
    line-height: 1.7;
}

.start-body .feature-number {
    position: absolute;
    top: 9px;
    left: 11px;
    color: #9eaaaf;
    font-size: 9px;
}

/* ---------- Meeting workspace ---------- */

.consult-body {
    color: var(--ui-text);
    background: #eaf0f2;
}

.consult-shell {
    grid-template-rows: 64px minmax(0, 1fr);
    background: #eaf0f2;
}

.consult-header {
    padding: 8px 16px;
    border-bottom: 1px solid var(--ui-line);
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(16px);
}

.brand-cluster {
    gap: 10px;
}

.brand-mark {
    width: 84px !important;
    height: 44px !important;
    object-fit: contain;
}

.brand-cluster h1 {
    font-size: 15px;
}

.brand-cluster .meeting-mode-badge {
    margin-top: 3px;
    padding: 3px 7px;
    font-size: 9px;
}

.session-strip {
    gap: 6px;
}

.status-pill,
.session-code,
.session-clock {
    min-height: 34px;
    padding: 6px 9px;
    border-radius: 9px;
    font-size: 11px;
}

.header-actions {
    gap: 6px;
}

.header-actions .icon-button {
    width: 42px;
    height: 42px;
    min-height: 42px;
    border-radius: 10px;
}

.consult-layout {
    grid-template-columns: 390px minmax(0, 1fr) !important;
    gap: 12px;
    padding: 12px;
    min-height: 0;
    height: 100%;
}

.consult-shell.role-patient .consult-layout,
.consult-shell.role-patient.chat-collapsed .consult-layout {
    grid-template-columns: minmax(0, 1fr) !important;
}

.consult-shell.role-patient[data-meeting-type='education'] .clinical-sidebar { display: flex !important; }
.consult-shell.role-patient[data-meeting-type='education'] .consult-layout,
.consult-shell.role-patient[data-meeting-type='education'].chat-collapsed .consult-layout { grid-template-columns: 390px minmax(0, 1fr) !important; }

.clinical-sidebar,
.communication-panel,
.video-section {
    border: 1px solid var(--ui-line);
    border-radius: 18px;
    background: var(--ui-surface);
    box-shadow: 0 1px 2px rgba(16,36,44,.04), 0 10px 30px rgba(16,36,44,.045);
}

.clinical-sidebar {
    padding: 12px;
    gap: 9px;
    overflow: hidden;
    height: 100%;
    min-height: 0;
}

.clinical-sidebar .clinical-content,
.adaptive-workspace { scrollbar-gutter: stable; }
.workspace-section { border: 1px solid #e1eaed; box-shadow: none; background: #fff; transition: border-color var(--ui-fast), box-shadow var(--ui-fast); }
.workspace-section:focus-within { border-color: rgba(20,122,112,.42); box-shadow: var(--ui-focus); }
.evidence-list { display: grid; gap: 8px; margin-top: 10px; }
.evidence-list label { display: grid !important; grid-template-columns: 24px minmax(0,1fr); align-items: start; gap: 10px; min-height: 46px; padding: 10px 12px; border: 1px solid var(--ui-line); border-radius: 10px; background: #fff; cursor: pointer; line-height: 1.6; }
.evidence-list input[type='checkbox'] { appearance: none; width: 22px; height: 22px; margin: 1px 0 0; border: 2px solid #8ba9a4; border-radius: 6px; background: #fff; }
.evidence-list input[type='checkbox']:checked { border-color: var(--ui-primary); background: var(--ui-primary); box-shadow: inset 0 0 0 4px #fff; }
.workspace-save { position: sticky; bottom: 0; z-index: 4; width: 100%; min-height: 50px; box-shadow: 0 -10px 24px rgba(255,255,255,.92), 0 8px 20px rgba(20,122,112,.18); }
.whiteboard-toolbar { display: grid; grid-template-columns: minmax(130px,1fr) auto auto; align-items: center; gap: 12px; }
.whiteboard-toolbar small { display: block; margin-top: 2px; color: var(--ui-muted-text); }
.whiteboard-tools { display: flex; align-items: center; gap: 6px; }
.whiteboard-tools input[type='color'] { width: 44px; height: 44px; padding: 3px; border: 1px solid var(--ui-line); border-radius: 10px; background: #fff; cursor: pointer; }
.whiteboard-tools select { min-height: 44px; padding: 5px 9px; border: 1px solid var(--ui-line); border-radius: 10px; background: #fff; }
.whiteboard-tools button { display: flex; align-items: center; gap: 4px; min-height: 44px; padding: 5px 10px; border: 1px solid var(--ui-line); border-radius: 10px; background: #fff; color: var(--ui-text); cursor: pointer; }
.whiteboard-tools button.active { border-color: var(--ui-primary); background: var(--ui-soft); color: var(--ui-primary); }
.whiteboard-status { display: inline-flex !important; align-items: center; gap: 5px; width: max-content; margin-top: 5px !important; padding: 3px 7px; border-radius: 99px; background: #eaf7f3; color: #17675f !important; font-size: 10px; font-weight: 700; }
.whiteboard-status i { width: 6px; height: 6px; border-radius: 50%; background: #18a77b; box-shadow: 0 0 0 3px rgba(24,167,123,.13); }
.whiteboard-status.is-offline { background: #fff3e2; color: #8a5410 !important; }
.whiteboard-status.is-offline i { background: #d18a24; box-shadow: 0 0 0 3px rgba(209,138,36,.14); }
.whiteboard-actions { display: flex; gap: 6px; direction: rtl; }
.whiteboard-actions button { position: relative; display: grid; place-items: center; width: 44px; height: 44px; min-height: 44px; padding: 0; border: 1px solid var(--ui-line); border-radius: 10px; background: #fff; color: var(--ui-primary); cursor: pointer; }
.whiteboard-actions button:hover { border-color: #b7cdc9; background: #f2f8f6; }
.whiteboard-actions .whiteboard-clear { color: #c73540; }
.whiteboard-actions .whiteboard-download { color: #176b62; }
.whiteboard-section canvas { display: block; width: 100%; aspect-ratio: 16 / 9; margin: 12px 0 7px; border: 1px solid #c9dcda; border-radius: 14px; background-color: #fff; background-image: radial-gradient(#d7e7e4 1px,transparent 1px); background-size: 20px 20px; touch-action: none; cursor: crosshair; box-shadow: inset 0 1px 3px rgba(10,38,34,.04); }
.whiteboard-section.is-minimized .whiteboard-canvas-wrap { display: none; }
.whiteboard-section.is-closed { display: none; }
.whiteboard-reopen { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 52px; border: 1px solid #b8d9d4; border-radius: 12px; background: linear-gradient(180deg,#f5fbf9,#eaf7f3); color: var(--ui-primary); font-size: 13px; font-weight: 800; cursor: pointer; box-shadow: 0 6px 18px rgba(20,122,112,.08); transition: background var(--ui-fast), border-color var(--ui-fast), box-shadow var(--ui-fast); }
.whiteboard-reopen:hover { border-color: var(--ui-primary); background: #e3f3ef; box-shadow: 0 9px 24px rgba(20,122,112,.13); }
.whiteboard-section.is-expanded { position: fixed; z-index: 70; inset: 12px; display: flex; flex-direction: column; padding: 18px; border-radius: 18px; box-shadow: 0 30px 100px rgba(9,30,27,.35); }
.whiteboard-section.is-expanded .whiteboard-canvas-wrap { display: flex; min-height: 0; flex: 1; flex-direction: column; }
.whiteboard-section.is-expanded canvas { min-height: 0; flex: 1; aspect-ratio: auto; }
body.whiteboard-open { overflow: hidden; }
.consult-shell button:focus-visible,
.consult-shell input:focus-visible,
.consult-shell textarea:focus-visible,
.consult-shell select:focus-visible,
.start-body button:focus-visible,
.start-body input:focus-visible,
.start-body textarea:focus-visible,
.start-body select:focus-visible { outline: 3px solid rgba(20,122,112,.34) !important; outline-offset: 2px; }
.consult-shell button[disabled], .start-body button[disabled] { opacity: .48; cursor: not-allowed; }
.top-box-show { z-index: 100 !important; }
.content-stage[hidden] { display: none !important; }
.content-stage { min-width: 0; min-height: 0; overflow: hidden; border: 1px solid #dce8e7; border-radius: 18px; background: #f8fbfa; box-shadow: var(--ui-elevation-stage); }
.content-stage .whiteboard-section { height: 100%; margin: 0; display: flex; flex-direction: column; border: 0; border-radius: 16px; background: #f8fbfa; }
.content-stage .whiteboard-canvas-wrap { display: flex; min-height: 0; flex: 1; flex-direction: column; }
.content-stage canvas { min-height: 0; flex: 1; aspect-ratio: auto; }
.video-section.stage-active { grid-template-rows: auto minmax(320px, 1fr) 150px; }
.video-section.stage-active .video-wrap { grid-auto-rows: 130px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.video-section.stage-active .video-card { min-height: 130px; }
.video-section.stage-active .empty-call-state { display: none !important; }
.video-section.stage-collapsed { grid-template-rows: auto 150px minmax(230px, 1fr); }
.video-section.stage-collapsed .whiteboard-canvas-wrap { display: none; }

@media (max-width: 720px) {
    .whiteboard-toolbar { grid-template-columns: 1fr auto; }
    .whiteboard-tools { grid-column: 1 / -1; grid-row: 2; flex-wrap: wrap; }
    .video-section.stage-active { grid-template-rows: auto minmax(260px, 1fr) 120px; }
    .video-section.stage-collapsed { grid-template-rows: auto 118px minmax(180px, 1fr); }
}

.patient-card {
    padding: 11px;
    border-radius: 13px;
    gap: 10px;
}

.patient-avatar {
    width: 44px;
    height: 44px;
    border-radius: 11px;
}

.patient-card h2 {
    font-size: 15px;
}

.patient-card p {
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
}

.visit-metrics {
    display: none;
}

.visit-metrics div {
    padding: 9px 10px;
    border-radius: 11px;
}

.visit-metrics small {
    font-size: 10px;
}

.visit-metrics strong {
    margin-top: 3px;
    font-size: 13px;
}

.adaptive-workspace {
    min-height: 0;
    flex: 1 1 auto;
    padding-left: 3px;
    overflow-y: auto;
    overscroll-behavior: contain;
    height: 100%;
}

.workspace-head {
    padding: 10px;
    border-radius: 11px;
}

.workspace-alert {
    padding: 9px;
}

.workspace-section {
    padding: 11px;
    border-radius: 11px;
}

.workspace-section input:not([type="range"]):not([type="checkbox"]),
.workspace-section textarea,
.workspace-section select {
    min-height: 40px;
    font-size: 12px;
}

.consult-shell select,
.start-body select {
    appearance: none;
    -webkit-appearance: none;
    min-height: 44px;
    padding: 9px 12px 9px 38px !important;
    border: 1px solid var(--ui-line) !important;
    border-radius: 10px !important;
    color: var(--ui-text);
    background-color: #fff !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23566b72' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: left 11px center !important;
    background-size: 18px !important;
    cursor: pointer;
    transition: border-color var(--ui-fast), box-shadow var(--ui-fast), background-color var(--ui-fast);
}
.consult-shell select:hover,
.start-body select:hover { border-color: #b7c9ce !important; background-color: #fbfdfd !important; }

.primary-action,
.secondary-action,
.workspace-save,
.step-next,
.step-back { transition: background-color var(--ui-fast), border-color var(--ui-fast), color var(--ui-fast), box-shadow var(--ui-fast), opacity var(--ui-fast) !important; }
.primary-action:active,
.secondary-action:active,
.workspace-save:active,
.step-next:active { opacity: .86; }

.workspace-save {
    min-height: 44px;
    flex: 0 0 auto;
    font-size: 12px;
}

.video-section {
    padding: 10px;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 10px;
    overflow: hidden;
}

.video-toolbar {
    min-height: 52px;
    padding: 4px 6px;
    direction: rtl;
    text-align: right;
    gap: 12px;
}

.video-toolbar > div:first-child { min-width: 0; text-align: right; }
.video-toolbar .eyebrow,
.video-toolbar h2 { text-align: right; }

.video-toolbar .eyebrow {
    font-size: 10px;
}

.video-toolbar h2 {
    margin-top: 2px;
    font-size: 15px;
}

.video-wrap {
    min-height: 0;
    padding: 0;
    border-radius: 16px;
    overflow: auto;
    background: #172334;
}

.video-card {
    min-height: 240px;
    border-radius: 15px;
}

.empty-call-state {
    right: 16px;
    bottom: 16px;
    left: 16px;
    min-width: 0;
    padding: 11px 13px;
    transform: none;
    border-radius: 11px;
    justify-content: center;
}

.communication-panel {
    padding: 12px;
    gap: 10px;
    position: fixed;
    z-index: 45;
    top: 82px;
    bottom: 92px;
    left: 12px;
    width: min(440px, calc(100vw - 24px));
    max-height: none;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateX(-18px);
    transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease;
    box-shadow: 0 24px 70px rgba(15, 37, 34, .20);
}

.communication-panel.is-open {
    display: flex !important;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
}

.drawer-backdrop {
    position: fixed;
    z-index: 44;
    inset: 0;
    background: rgba(15, 37, 34, .28);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 160ms ease, visibility 160ms ease;
}

.drawer-backdrop[hidden] {
    display: none !important;
}

.drawer-backdrop.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.communication-panel > .panel-heading {
    min-height: 48px;
}

.communication-panel .panel-heading h2 {
    font-size: 15px;
}

.communication-panel .panel-heading p {
    font-size: 10px;
}

.meeting-heading-cross {
    width: 40px;
    height: 40px;
    min-height: 40px;
}

.people-chat-wrap {
    min-height: 44px;
    padding: 4px;
    border-radius: 11px;
}

.panel-tab {
    min-height: 36px;
    padding: 6px 4px;
    font-size: 11px;
}

.in-call-chat-wrap,
.panel-content,
.chat-show-wrap,
.chat-thread {
    min-height: 0;
}

.chat-thread {
    overflow-y: auto;
    overscroll-behavior: contain;
}

.chat-intro {
    min-height: min-content;
    align-content: start;
}

.chat-intro .empty-state {
    min-height: 126px;
    padding: 14px;
}

.quick-message-grid {
    grid-template-columns: 1fr;
    gap: 6px;
}

.quick-chat {
    min-height: 38px;
    padding: 7px 10px;
    text-align: right;
    justify-content: flex-start;
    font-size: 11px;
}

.chat-message-sent {
    grid-template-columns: minmax(0, 1fr) 44px;
    gap: 8px;
}

.chat-message-sent-input-field {
    min-width: 0;
    min-height: 44px;
    font-size: 13px;
}

.chat-message-sent .icon-button {
    width: 44px;
    height: 44px;
}

.control-bar {
    position: fixed;
    z-index: 35;
    bottom: 22px;
    left: calc((100% - 390px) / 2);
    width: auto;
    min-height: 0;
    padding: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    overflow: visible;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 20px;
    background: rgba(15, 28, 39, .88);
    backdrop-filter: blur(16px);
    box-shadow: 0 14px 38px rgba(7,18,26,.28);
    opacity: .2;
    transform: translate(-50%, 12px);
    transition: opacity 180ms ease, transform 180ms ease;
}

.consult-shell:has(.video-section:hover) .control-bar,
.control-bar:hover,
.control-bar:focus-within {
    opacity: 1;
    transform: translate(-50%, 0);
}

.control-button {
    width: 58px;
    min-width: 58px;
    min-height: 52px;
    padding: 6px 8px;
    position: relative;
    border-radius: 14px;
    gap: 2px;
    box-shadow: none;
    border-color: rgba(255,255,255,.12);
    background: rgba(255,255,255,.10);
    color: #fff;
}

.control-button:hover,
.control-button:focus-visible { background: rgba(255,255,255,.20); border-color: rgba(255,255,255,.28); }
.control-button.active { background: #e8f7f3; color: #0d665e; }

.control-button .material-icons {
    width: 26px;
    height: 26px;
    font-size: 19px;
}

.control-button small {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.control-button::after,
.whiteboard-actions button::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: calc(100% + 10px);
    left: 50%;
    z-index: 90;
    padding: 6px 9px;
    border-radius: 8px;
    background: #111d25;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.4;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate(-50%, 4px);
    transition: opacity 140ms ease, transform 140ms ease, visibility 140ms ease;
}
.control-button:hover::after,
.control-button:focus-visible::after,
.whiteboard-actions button:hover::after,
.whiteboard-actions button:focus-visible::after { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.whiteboard-actions button::after { top: calc(100% + 7px); bottom: auto; }

.control-button.danger {
    background: var(--ui-danger);
    border-color: var(--ui-danger);
    margin-inline-start: 4px;
    box-shadow: 0 7px 18px rgba(217,54,66,.24);
}
.control-button.danger:hover,
.control-button.danger:focus-visible { background: #c92c38; border-color: #c92c38; }

@media (max-width: 1280px) {
    .start-body .visit-start-hero {
        max-width: 760px;
        margin-inline: auto;
        grid-template-columns: 1fr;
    }

    .start-body .start-dock {
        max-width: 760px;
        margin-inline: auto;
        grid-template-columns: repeat(3, 1fr);
    }

    .start-body .feature-heading {
        grid-column: 1 / -1;
    }

    .consult-layout {
        grid-template-columns: 288px minmax(0, 1fr) !important;
    }

    .consult-shell.chat-collapsed .consult-layout {
        grid-template-columns: 288px minmax(0, 1fr) !important;
    }

    .control-bar { left: calc((100% - 288px) / 2); }
}

@media (max-width: 960px) {
    .consult-shell {
        grid-template-rows: 58px minmax(0, 1fr);
    }

    .consult-header {
        padding: 7px 10px;
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .session-strip {
        display: none;
    }

    .brand-mark {
        width: 70px !important;
        height: 38px !important;
    }

    .consult-layout,
    .consult-shell.chat-collapsed .consult-layout {
        grid-template-columns: minmax(0, 1fr) !important;
        padding: 8px;
    }

    .video-section {
        grid-column: 1;
        grid-row: 1;
    }

    .clinical-sidebar,
    .communication-panel {
        position: fixed;
        z-index: 30;
        top: 66px;
        bottom: 76px;
        width: min(380px, calc(100vw - 20px));
        max-width: none;
        box-shadow: var(--ui-shadow-lg);
    }

    .clinical-sidebar {
        right: 10px;
        left: auto;
    }

    .communication-panel {
        left: 10px;
        right: auto;
    }

    .control-bar {
        left: 50%;
        bottom: 12px;
        max-width: calc(100vw - 20px);
        justify-content: flex-start;
        overflow-x: auto;
        opacity: 1;
        transform: translate(-50%, 0);
    }

    .control-button {
        min-width: 68px;
        width: 72px;
        min-height: 50px;
    }

    .control-button small { position: static; width: auto; height: auto; overflow: visible; clip: auto; white-space: normal; font-size: 9px; }
    .control-button::after { display: none; }
}

@media (max-width: 640px) {
    .start-body .specific-grid { grid-template-columns: 1fr; }
    .communication-panel { inset-inline: 0 !important; left: 0 !important; right: 0 !important; width: 100vw !important; border-radius: 16px 16px 0 0 !important; }
    .start-body .visit-start-shell {
        padding: 18px 14px 30px;
        gap: 24px;
    }

    .start-body .start-copy .brand-logo {
        width: 94px !important;
        height: 52px !important;
        margin-bottom: 20px !important;
    }

    .start-body .start-copy h1 {
        font-size: clamp(2.15rem, 10.5vw, 3.1rem);
    }

    .start-body .start-copy .lead-text {
        font-size: 15px;
    }

    .start-body .trust-row {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .start-body .trust-row span {
        padding: 7px 4px !important;
        flex-direction: column;
        text-align: center;
    }

    .start-body .trust-row span b {
        font-size: 9px;
    }

    .start-body .start-visual img {
        height: 190px;
    }

    .start-body .start-panel {
        padding: 18px;
        border-radius: 18px;
    }

    .start-body .start-panel > .panel-heading {
        margin-bottom: 20px;
        padding-bottom: 16px;
        grid-template-columns: 40px minmax(0, 1fr) auto;
    }

    .start-body .meeting-type-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .start-body .meeting-type-card:last-child {
        grid-column: 1 / -1;
    }

    .start-body .meeting-type-card > span {
        min-height: 92px;
    }

    .start-body .start-dock {
        grid-template-columns: 1fr;
    }

    .start-body .feature-heading {
        grid-column: 1;
    }

    .start-body .dock-item {
        min-height: 88px;
    }

    .brand-cluster h1,
    .brand-cluster .eyebrow,
    .brand-cluster .meeting-mode-badge {
        display: none;
    }

    .header-actions > .copy_info {
        display: none;
    }

    .video-toolbar {
        min-height: 46px;
    }

    .video-toolbar h2 {
        max-width: 190px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 13px;
    }
}

@media (max-height: 720px) and (min-width: 961px) {
    .consult-shell {
        grid-template-rows: 58px minmax(0, 1fr);
    }

    .consult-layout {
        padding: 8px;
        gap: 8px;
    }

    .patient-card {
        padding: 8px;
    }

    .patient-avatar {
        width: 38px;
        height: 38px;
    }

    .visit-metrics div {
        padding: 7px 8px;
    }

    .workspace-head,
    .workspace-section {
        padding: 9px;
    }

    .communication-panel {
        padding: 9px;
    }

    .chat-intro .empty-state {
        min-height: 100px;
    }

    .control-button {
        min-height: 48px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .start-body .dock-item,
    .start-body .meeting-type-card > span,
    .control-button,
    .quick-chat,
    .communication-panel,
    .drawer-backdrop {
        transition: none !important;
    }
}

/* Requested cleanup: centered kicker and directional, color-coded preview cards. */
.start-body.landing-only .eyebrow {
    align-self: center;
    min-height: 0;
    margin: 26px auto 4px;
    padding: 0;
    color: #087f73 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0;
    font-size: 12px;
    letter-spacing: 0;
    text-align: center;
}

.start-body.landing-only .landing-actions { margin-top: 20px; }
.start-body.landing-only .start-visual { --mode-accent: #087f73; --mode-soft: #e4f3ef; --mode-ink: #174b45; }
.start-body.landing-only .start-visual[data-mode="education"] { --mode-accent: #4f46c8; --mode-soft: #eeecff; --mode-ink: #332b85; }
.start-body.landing-only .start-visual[data-mode="team"] { --mode-accent: #b66a16; --mode-soft: #fff0dc; --mode-ink: #70400c; }

.start-body.landing-only .visual-tool-card {
    border-color: color-mix(in srgb, var(--mode-accent) 18%, white);
    box-shadow: 0 16px 34px color-mix(in srgb, var(--mode-accent) 16%, transparent);
}
.start-body.landing-only .visual-tool-card > .material-icons {
    color: var(--mode-accent);
    background: var(--mode-soft);
}
.start-body.landing-only .visual-tool-card b { color: var(--mode-ink); }
.start-body.landing-only .start-visual figcaption b { color: #fff; }
.start-body.landing-only .start-visual figcaption span { color: rgba(255, 255, 255, .8); }
.start-body.landing-only .visual-modes button[aria-selected="true"] { color: var(--mode-ink); }

.start-body.landing-only .start-visual[data-direction="next"].is-switching .visual-tool-card,
.start-body.landing-only .start-visual[data-direction="next"].is-switching figcaption {
    opacity: 0;
    transform: perspective(900px) translate3d(-72px, 0, -30px) rotateY(-16deg);
}
.start-body.landing-only .start-visual[data-direction="previous"].is-switching .visual-tool-card,
.start-body.landing-only .start-visual[data-direction="previous"].is-switching figcaption {
    opacity: 0;
    transform: perspective(900px) translate3d(72px, 0, -30px) rotateY(16deg);
}
.start-body.landing-only .start-visual[data-direction="next"].is-entering .visual-tool-card,
.start-body.landing-only .start-visual[data-direction="next"].is-entering figcaption {
    opacity: 0;
    transform: perspective(900px) translate3d(72px, 0, -30px) rotateY(16deg);
}
.start-body.landing-only .start-visual[data-direction="previous"].is-entering .visual-tool-card,
.start-body.landing-only .start-visual[data-direction="previous"].is-entering figcaption {
    opacity: 0;
    transform: perspective(900px) translate3d(-72px, 0, -30px) rotateY(-16deg);
}

@media (max-width: 600px) {
    .start-body.landing-only .eyebrow { margin-top: 20px; }
}

@media (prefers-reduced-motion: reduce) {
    .start-body.landing-only .start-visual.is-switching .visual-tool-card,
    .start-body.landing-only .start-visual.is-entering .visual-tool-card,
    .start-body.landing-only .start-visual.is-switching figcaption,
    .start-body.landing-only .start-visual.is-entering figcaption { opacity: 1; transform: none !important; }
}

/* Refined actions, visible proof strip and GPU-only 3D card switching. */
.landing-header a,
.landing-actions a,
.landing-header a:hover,
.landing-actions a:hover,
.landing-header a:focus,
.landing-actions a:focus {
    text-decoration: none !important;
}

.start-body.landing-only .start-copy h1 { order: 1; }
.start-body.landing-only .lead-text { order: 2; }
.start-body.landing-only .eyebrow {
    order: 3;
    min-height: 36px;
    margin: 18px 0 0;
    padding: 0 13px;
    display: inline-flex;
    align-items: center;
    color: #42615c !important;
    background: #f0f6f4 !important;
    border: 1px solid #dce9e6 !important;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
}

.header-create-button,
.start-body.landing-only .landing-primary {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    color: #fff !important;
    background: linear-gradient(135deg, #087f73 0%, #075f58 100%);
    border: 1px solid #075f58;
    box-shadow: 0 8px 20px rgba(7, 95, 88, .18);
}

.header-create-button::before,
.start-body.landing-only .landing-primary::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(110deg, transparent 20%, rgba(255, 255, 255, .2) 48%, transparent 72%);
    transform: translateX(120%);
    transition: transform .45s ease;
}

.header-create-button:hover,
.start-body.landing-only .landing-primary:hover {
    color: #fff !important;
    background: linear-gradient(135deg, #096f66 0%, #054f49 100%);
    border-color: #054f49;
    box-shadow: 0 12px 26px rgba(7, 95, 88, .25);
}
.header-create-button:hover::before,
.start-body.landing-only .landing-primary:hover::before { transform: translateX(-120%); }

.header-join-button,
.start-body.landing-only .landing-secondary {
    color: #1f4842 !important;
    background: #fff;
    border: 1px solid #cbdeda;
    box-shadow: 0 4px 12px rgba(27, 67, 61, .05);
}
.header-join-button:hover,
.start-body.landing-only .landing-secondary:hover {
    color: #075f58 !important;
    background: #eaf5f2;
    border-color: #8fc2ba;
    box-shadow: 0 9px 20px rgba(27, 67, 61, .11);
}

.start-body.landing-only .trust-row {
    width: min(100%, 720px);
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 26px;
    padding: 10px;
    background: #f6f9f8;
    border: 1px solid #e0e9e7;
    border-radius: 18px;
}

.start-body.landing-only .trust-row span {
    min-height: 62px;
    display: grid;
    grid-template-columns: 34px 1fr;
    grid-template-rows: auto auto;
    column-gap: 9px;
    align-content: center;
    padding: 8px 10px;
    text-align: right;
    background: #fff;
    border: 1px solid #e4ecea;
    border-radius: 12px;
}
.start-body.landing-only .trust-row span i {
    position: relative;
    grid-row: 1 / span 2;
    width: 34px;
    height: 34px;
    display: block;
    align-self: center;
    background: #e4f3ef;
    border-radius: 10px;
}
.start-body.landing-only .trust-row span i::after {
    content: "";
    position: absolute;
    width: 10px;
    height: 6px;
    inset: 12px 11px auto auto;
    border-inline-start: 2px solid #087f73;
    border-bottom: 2px solid #087f73;
    transform: rotate(-45deg);
}
.start-body.landing-only .trust-row span b {
    color: #203e39;
    font-size: 11px;
    font-weight: 900;
}
.start-body.landing-only .trust-row span small {
    display: block;
    margin-top: 2px;
    color: #71817e;
    font-size: 8px;
    line-height: 1.4;
}

.start-body.landing-only .start-visual {
    perspective: 1200px;
    transform-style: preserve-3d;
}
.start-body.landing-only .visual-tool-card,
.start-body.landing-only .start-visual figcaption {
    backface-visibility: hidden;
    will-change: transform, opacity;
    transition: transform .3s cubic-bezier(.22, .8, .3, 1), opacity .22s ease, box-shadow .3s ease;
}
.start-body.landing-only .visual-tool-card--top { transform: perspective(800px) rotateY(-5deg) translateZ(22px); }
.start-body.landing-only .visual-tool-card--bottom { transform: perspective(800px) rotateY(5deg) translateZ(28px); }
.start-body.landing-only .start-visual:hover .visual-tool-card--top { transform: perspective(800px) rotateY(-2deg) translate3d(6px, -6px, 36px); }
.start-body.landing-only .start-visual:hover .visual-tool-card--bottom { transform: perspective(800px) rotateY(2deg) translate3d(-6px, 6px, 42px); }

.start-body.landing-only .start-visual.is-switching .visual-tool-card--top {
    opacity: 0;
    transform: perspective(800px) rotateY(-28deg) translate3d(-34px, 8px, -20px);
}
.start-body.landing-only .start-visual.is-switching .visual-tool-card--bottom {
    opacity: 0;
    transform: perspective(800px) rotateY(28deg) translate3d(34px, 8px, -20px);
}
.start-body.landing-only .start-visual.is-switching figcaption {
    opacity: 0;
    transform: translate3d(0, 12px, 0);
}

@media (max-width: 600px) {
    .start-body.landing-only .eyebrow { margin-top: 14px; }
    .start-body.landing-only .trust-row { gap: 6px; padding: 6px; border-radius: 14px; }
    .start-body.landing-only .trust-row span {
        min-height: 70px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
        padding: 7px 4px;
        text-align: center;
    }
    .start-body.landing-only .trust-row span i { width: 28px; height: 28px; }
    .start-body.landing-only .trust-row span i::after { inset: 9px 8px auto auto; }
    .start-body.landing-only .trust-row span small { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .header-create-button::before,
    .start-body.landing-only .landing-primary::before { display: none; }
    .start-body.landing-only .visual-tool-card,
    .start-body.landing-only .start-visual figcaption { transition: opacity .01ms linear; transform: none !important; }
}

/* Final landing composition: navigation → concise value proposition → large product visual. */
.landing-header {
    width: min(calc(100% - 32px), 1180px);
    min-height: 76px;
    margin: 16px auto 0;
    padding: 10px 12px 10px 18px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 24px;
    direction: rtl;
    background: rgba(255, 255, 255, .9);
    border: 1px solid #dce9e6;
    border-radius: 20px;
    box-shadow: 0 12px 36px rgba(28, 69, 63, .07);
    backdrop-filter: blur(16px);
}

.landing-brand {
    width: fit-content;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #173a36;
    text-decoration: none;
}

.landing-brand img { width: 78px; height: 44px; object-fit: contain; }
.landing-brand span, .landing-brand b, .landing-brand small { display: block; }
.landing-brand b { font-size: 13px; direction: ltr; text-align: right; }
.landing-brand small { margin-top: 2px; color: #71827f; font-size: 9px; }

.landing-header nav { display: flex; align-items: center; gap: 28px; }
.landing-header nav a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    color: #526964;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: color .2s ease;
}
.landing-header nav a:hover { color: #087f73; }

.header-create-button {
    min-width: 142px;
    min-height: 48px;
    justify-self: end;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 18px;
    color: #fff;
    background: #087f73;
    border-radius: 13px;
    box-shadow: 0 10px 22px rgba(8, 127, 115, .2);
    font-size: 13px;
    font-weight: 900;
    text-decoration: none;
    transition: background-color .2s ease, box-shadow .2s ease;
}
.header-create-button:hover { color: #fff; background: #066b62; box-shadow: 0 13px 27px rgba(8, 127, 115, .27); }
.header-create-button .material-icons { font-size: 20px; }
.header-create-button:focus-visible,
.landing-header nav a:focus-visible,
.landing-brand:focus-visible { outline: 3px solid rgba(8, 127, 115, .3); outline-offset: 3px; }

.start-body.landing-only .visit-start-shell {
    padding-top: clamp(36px, 5vw, 68px);
}

.start-body.landing-only .start-copy {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 0 !important;
    overflow: visible;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none;
    grid-template-columns: 1fr auto;
}

.start-body.landing-only .start-copy::after { display: none !important; }
.start-body.landing-only .eyebrow { order: 1; align-self: auto; margin-bottom: 18px; }
.start-body.landing-only .start-copy h1 {
    order: 2;
    max-width: 850px;
    text-align: center;
    font-size: clamp(3rem, 6vw, 5.5rem);
}
.start-body.landing-only .start-copy h1 em { display: inline; }
.start-body.landing-only .lead-text {
    order: 3;
    max-width: 720px;
    margin-top: 22px;
    text-align: center;
    font-size: clamp(1rem, 1.45vw, 1.16rem);
}
.start-body.landing-only .landing-actions { order: 4; margin-top: 28px; justify-content: center; }
.start-body.landing-only .landing-helper { order: 5; }
.start-body.landing-only .trust-row { order: 6; align-self: auto; justify-content: center; margin-top: 20px; }

.start-body.landing-only .start-visual {
    order: 7;
    width: 100%;
    min-height: 0;
    aspect-ratio: 16 / 8.35;
    margin-top: clamp(36px, 5vw, 64px);
    transform: none;
    border-width: 9px;
    border-radius: 30px;
}
.start-body.landing-only .start-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 48%;
}

.start-body.landing-only .visual-tool-card--top { inset: 96px auto auto 24px; }
.start-body.landing-only .visual-tool-card--bottom { inset: auto 24px 100px auto; }

.landing-use-cases {
    padding: clamp(28px, 4vw, 48px);
    background: #102f2b;
    border-radius: 28px;
}
.landing-use-cases .use-case-intro > span { color: #69d3c3; }
.landing-use-cases .use-case-intro h2 { color: #fff; }
.landing-use-cases .use-case-intro p { color: #b8cbc7; }
.landing-use-cases .use-case-list article { background: rgba(255, 255, 255, .96); border-color: rgba(255, 255, 255, .12); }

@media (max-width: 760px) {
    .landing-header {
        min-height: 66px;
        grid-template-columns: 1fr auto;
        margin-top: 10px;
        padding: 8px 10px;
        border-radius: 16px;
    }
    .landing-header nav { display: none; }
    .landing-brand span { display: none; }
    .landing-brand img { width: 70px; height: 40px; }
    .header-create-button { min-width: 124px; min-height: 46px; }
    .start-body.landing-only .visit-start-shell { padding-top: 34px; }
    .start-body.landing-only .start-copy h1 { font-size: clamp(2.35rem, 12vw, 3.45rem); }
    .start-body.landing-only .start-copy h1 em { display: block; }
    .start-body.landing-only .lead-text { line-height: 1.85; }
    .start-body.landing-only .start-visual { aspect-ratio: 4 / 3; margin-top: 34px; border-width: 5px; }
    .landing-use-cases { padding: 26px 20px; border-radius: 22px; }
}

/* Hero-only refinement. Everything from the product image downward stays untouched. */
.landing-header {
    min-height: 68px;
    margin-top: 0;
    padding-block: 10px;
    border-bottom-color: #dfe7e5;
}

.landing-brand img {
    width: 88px;
    height: 44px;
}

.header-create-button {
    min-width: 126px;
    min-height: 44px;
    padding-inline: 17px;
    border-radius: 11px;
    font-size: 12px;
}

.start-body.landing-only .visit-start-shell {
    padding-top: clamp(44px, 6vw, 76px);
}

.start-body.landing-only .eyebrow {
    margin: 0 0 20px;
    padding: 0;
    color: #087f73 !important;
    background: transparent !important;
    border: 0 !important;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0;
}

.start-body.landing-only .start-copy h1 {
    max-width: 770px;
    color: #132724 !important;
    font-size: clamp(2.75rem, 5vw, 4.65rem);
    line-height: 1.24;
    letter-spacing: -.035em;
}

.start-body.landing-only .start-copy h1 em {
    color: #087f73;
}

.start-body.landing-only .lead-text {
    max-width: 620px;
    margin-top: 20px;
    color: #596b67 !important;
    font-size: clamp(.98rem, 1.3vw, 1.08rem);
    line-height: 1.9;
}

.start-body.landing-only .landing-actions {
    gap: 18px;
    margin-top: 30px;
}

.start-body.landing-only .landing-primary {
    min-width: 156px;
    min-height: 50px;
    padding-inline: 22px;
    border-radius: 12px;
}

.start-body.landing-only .landing-primary .material-icons { font-size: 19px; }

.start-body.landing-only .landing-secondary {
    min-height: 50px;
    padding-inline: 4px;
    color: #415551;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: inset 0 -1px 0 transparent;
}

.start-body.landing-only .landing-secondary:hover {
    color: #087f73;
    background: transparent;
    border-color: transparent;
    box-shadow: inset 0 -1px 0 #087f73;
}

.start-body.landing-only .trust-row {
    gap: 0;
    margin-top: 24px;
    color: #6c7c79;
}

.start-body.landing-only .trust-row span {
    min-height: 32px;
    gap: 5px;
    padding: 0 14px;
    background: transparent;
    border: 0;
    border-inline-start: 1px solid #dbe4e2;
    border-radius: 0;
}

.start-body.landing-only .trust-row span:first-child { border-inline-start: 0; }
.start-body.landing-only .trust-row span i {
    width: auto;
    height: auto;
    color: #087f73;
    background: transparent;
    font-size: 16px;
}
.start-body.landing-only .trust-row span b { color: #61726e; font-size: 11px; font-weight: 700; }

@media (max-width: 600px) {
    .landing-header { width: calc(100% - 28px); min-height: 62px; }
    .landing-brand img { width: 76px; height: 40px; }
    .header-create-button { min-width: 116px; }
    .start-body.landing-only .visit-start-shell { padding-top: 38px; }
    .start-body.landing-only .eyebrow { margin-bottom: 15px; }
    .start-body.landing-only .start-copy h1 { font-size: clamp(2.25rem, 11vw, 3.15rem); line-height: 1.3; }
    .start-body.landing-only .lead-text { margin-top: 16px; font-size: .96rem; }
    .start-body.landing-only .landing-actions { width: 100%; display: grid; gap: 8px; margin-top: 24px; }
    .start-body.landing-only .landing-primary,
    .start-body.landing-only .landing-secondary { width: 100%; }
    .start-body.landing-only .trust-row { justify-content: center; margin-top: 18px; }
    .start-body.landing-only .trust-row span { padding-inline: 8px; }
    .start-body.landing-only .trust-row span b { font-size: 9px; }
}

/* Full-width, image-first landing. */
.start-body.landing-only { background: #fff; }

.landing-header {
    width: 100%;
    max-width: none;
    min-height: 72px;
    padding: 10px clamp(20px, 4vw, 64px);
    margin: 0;
    background: #fff;
    border-bottom: 1px solid #e3e9e7;
}

.start-body.landing-only .visit-start-shell {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 20px clamp(16px, 3vw, 48px) 56px;
    gap: 56px;
}

.start-body.landing-only .visit-start-hero,
.start-body.landing-only .start-copy {
    width: 100%;
    max-width: none;
}

.start-body.landing-only .start-visual {
    order: 1;
    width: 100%;
    aspect-ratio: 16 / 7.2;
    margin: 0;
    border-radius: 20px;
}

.start-body.landing-only .eyebrow {
    order: 2;
    margin-top: clamp(52px, 7vw, 88px);
}

.start-body.landing-only .start-copy h1 {
    order: 3;
    max-width: 760px;
}

.start-body.landing-only .lead-text {
    order: 4;
    max-width: 660px;
}

.start-body.landing-only .landing-actions { order: 5; }
.start-body.landing-only .trust-row { order: 6; margin-bottom: 8px; }

.start-body.landing-only .start-dock {
    width: 100%;
    max-width: none;
}

@media (max-width: 760px) {
    .landing-header { width: 100%; padding-inline: 16px; }
    .start-body.landing-only .visit-start-shell { padding: 12px 12px 40px; gap: 40px; }
    .start-body.landing-only .start-visual { aspect-ratio: 4 / 3; border-radius: 16px; }
    .start-body.landing-only .eyebrow { margin-top: 42px; }
}

@media (max-width: 420px) {
    .landing-header { width: 100%; }
    .start-body.landing-only .start-visual { aspect-ratio: 1 / 1; }
}

/* Balanced landing: complete header, copy first, interactive product preview, cards last. */
.landing-header {
    grid-template-columns: 1fr auto 1fr;
    gap: 24px;
    padding-inline: clamp(20px, 4vw, 64px);
}

.landing-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
}

.landing-nav a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    color: #50635f;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition: color .2s ease;
}
.landing-nav a:hover { color: #087f73; }

.header-actions {
    justify-self: end;
    display: flex;
    align-items: center;
    gap: 8px;
}

.header-join-button,
.header-create-button {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease;
}

.header-join-button {
    padding-inline: 16px;
    color: #29433f;
    background: #f3f7f6;
    border: 1px solid #dce7e4;
}
.header-join-button:hover {
    color: #174c45;
    background: #e7f2ef;
    border-color: #bcd6d1;
    box-shadow: 0 5px 14px rgba(31, 72, 66, .08);
}
.header-create-button:hover {
    background: #076f66;
    box-shadow: 0 7px 18px rgba(8, 127, 115, .2);
}
.header-join-button:active,
.header-create-button:active { box-shadow: inset 0 2px 4px rgba(16, 53, 48, .15); }
.header-join-button:focus-visible { outline: 3px solid rgba(8, 127, 115, .28); outline-offset: 2px; }

.start-body.landing-only .visit-start-shell { padding-top: clamp(48px, 6vw, 78px); }
.start-body.landing-only .eyebrow { order: 1; margin-top: 0; }
.start-body.landing-only .start-copy h1 { order: 2; }
.start-body.landing-only .lead-text { order: 3; }
.start-body.landing-only .landing-actions { order: 4; }
.start-body.landing-only .trust-row { order: 5; }
.start-body.landing-only .start-visual {
    order: 6;
    margin-top: clamp(42px, 5vw, 68px);
    overflow: hidden;
    background: #dfe9e6;
    box-shadow: 0 18px 46px rgba(22, 54, 50, .13);
}

.start-body.landing-only .landing-primary,
.start-body.landing-only .landing-secondary {
    border-radius: 12px;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease;
}
.start-body.landing-only .landing-primary:hover {
    color: #fff;
    background: #076f66;
    box-shadow: 0 9px 22px rgba(8, 127, 115, .2);
}
.start-body.landing-only .landing-secondary {
    min-width: 142px;
    padding-inline: 18px;
    color: #29433f;
    background: #f3f7f6;
    border: 1px solid #d8e5e2;
    box-shadow: none;
}
.start-body.landing-only .landing-secondary:hover {
    color: #174c45;
    background: #e7f2ef;
    border-color: #b7d2cd;
    box-shadow: 0 7px 18px rgba(31, 72, 66, .08);
}
.start-body.landing-only .landing-primary:active,
.start-body.landing-only .landing-secondary:active { box-shadow: inset 0 2px 5px rgba(16, 53, 48, .16); }

.start-body.landing-only .start-visual img {
    transition: transform .45s cubic-bezier(.2, .7, .2, 1), filter .3s ease;
}
.start-body.landing-only .start-visual:hover img {
    transform: scale(1.025);
    filter: saturate(1) contrast(1.04);
}
.start-body.landing-only .visual-tool-card {
    transition: transform .28s ease, box-shadow .28s ease, opacity .28s ease;
}
.start-body.landing-only .start-visual:hover .visual-tool-card--top { transform: translate(6px, -5px); }
.start-body.landing-only .start-visual:hover .visual-tool-card--bottom { transform: translate(-6px, 5px); }

.visual-modes {
    position: absolute;
    z-index: 6;
    inset: 18px 50% auto auto;
    transform: translateX(50%);
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 5px;
    background: rgba(18, 39, 36, .74);
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 14px;
    backdrop-filter: blur(12px);
}

.visual-modes button {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0 13px;
    color: rgba(255, 255, 255, .78);
    background: transparent;
    border: 1px solid transparent;
    border-radius: 10px;
    font-family: inherit;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.visual-modes button .material-icons { font-size: 17px; }
.visual-modes button:hover { color: #fff; background: rgba(255, 255, 255, .12); }
.visual-modes button[aria-selected="true"] {
    color: #12443e;
    background: #fff;
    border-color: rgba(255, 255, 255, .9);
}
.visual-modes button:focus-visible { outline: 3px solid rgba(255, 255, 255, .7); outline-offset: 2px; }

.start-body.landing-only .start-visual[data-mode="education"] { box-shadow: 0 18px 46px rgba(70, 83, 122, .16); }
.start-body.landing-only .start-visual[data-mode="team"] { box-shadow: 0 18px 46px rgba(105, 73, 36, .15); }

@media (max-width: 860px) {
    .landing-header { grid-template-columns: 1fr auto; }
    .landing-nav { display: none; }
}

@media (max-width: 600px) {
    .landing-header { padding-inline: 14px; }
    .header-join-button { display: none; }
    .start-body.landing-only .visit-start-shell { padding-top: 34px; }
    .start-body.landing-only .start-visual { margin-top: 34px; overflow: hidden; }
    .visual-modes { inset: 12px 12px auto auto; transform: none; max-width: calc(100% - 24px); }
    .visual-modes button { min-width: 40px; padding-inline: 10px; font-size: 0; }
    .visual-modes button .material-icons { font-size: 19px; }
}

@media (prefers-reduced-motion: reduce) {
    .start-body.landing-only .start-visual img,
    .start-body.landing-only .visual-tool-card { transition: none; transform: none !important; }
}

@media (max-width: 420px) {
    .landing-header { width: calc(100% - 20px); }
    .header-create-button { min-width: 116px; padding-inline: 12px; }
    .start-body.landing-only .trust-row { width: 100%; justify-content: space-between; gap: 5px; }
    .start-body.landing-only .trust-row span { padding-inline: 8px; }
    .start-body.landing-only .start-visual { aspect-ratio: 1 / 1; }
    .visual-live-pill { inset: 12px 12px auto auto; }
}

/* Minimal reset — keep the product visual, remove decorative UI noise. */
.start-body.landing-only {
    background: #f7f9f8;
}

.landing-header {
    width: min(calc(100% - 32px), 1180px);
    min-height: 72px;
    margin-top: 8px;
    padding: 8px 0;
    background: transparent;
    border: 0;
    border-bottom: 1px solid #e1e9e7;
    border-radius: 0;
    box-shadow: none;
    backdrop-filter: none;
}

.landing-header nav { gap: 24px; }
.landing-header nav a { color: #60716e; font-weight: 600; }
.landing-brand img { width: 84px; }
.landing-brand small { display: none; }

.header-create-button {
    min-width: 132px;
    box-shadow: none;
}
.header-create-button:hover { box-shadow: none; }

.start-body.landing-only .visit-start-shell {
    gap: 64px;
    padding-top: 56px;
}

.start-body.landing-only .eyebrow {
    margin-bottom: 16px;
    padding: 7px 12px;
    color: #136e64 !important;
    background: #eaf4f2 !important;
}

.start-body.landing-only .start-copy h1 {
    max-width: 790px;
    color: #162b28 !important;
    font-size: clamp(2.8rem, 5.5vw, 4.9rem);
    letter-spacing: -.035em;
}

.start-body.landing-only .lead-text {
    max-width: 650px;
    margin-top: 18px;
    color: #52635f !important;
    line-height: 1.85;
}

.start-body.landing-only .landing-actions { margin-top: 24px; }
.start-body.landing-only .landing-primary { box-shadow: none; background: #087f73; }
.start-body.landing-only .landing-primary:hover { box-shadow: none; background: #066b62; }
.start-body.landing-only .landing-secondary { background: transparent; }
.start-body.landing-only .landing-helper { margin-top: 10px; }
.start-body.landing-only .trust-row { margin-top: 18px; }

.start-body.landing-only .start-visual {
    margin-top: 44px;
    border: 1px solid #d8e3e0;
    border-radius: 22px;
    box-shadow: 0 18px 44px rgba(25, 56, 52, .1);
}

.start-body.landing-only .start-visual::after {
    background: linear-gradient(180deg, transparent 58%, rgba(9, 28, 26, .42));
}

.landing-use-cases {
    padding: 0;
    background: transparent;
    border-radius: 0;
}
.landing-use-cases .use-case-intro > span { color: #087f73; }
.landing-use-cases .use-case-intro h2 { color: #17312e; }
.landing-use-cases .use-case-intro p { color: #657874; }
.landing-use-cases .use-case-list { gap: 10px; }
.landing-use-cases .use-case-list article {
    min-height: 104px;
    padding: 15px;
    background: #fff;
    border: 1px solid #e0e8e6;
    border-radius: 14px;
    box-shadow: none;
}

.start-body.landing-only .start-dock .dock-item {
    box-shadow: none;
}

@media (max-width: 760px) {
    .landing-header { width: calc(100% - 28px); min-height: 64px; margin-top: 4px; }
    .start-body.landing-only .visit-start-shell { padding-top: 32px; gap: 44px; }
    .start-body.landing-only .start-copy h1 { font-size: clamp(2.25rem, 11vw, 3.25rem); }
    .start-body.landing-only .start-visual { margin-top: 32px; border-radius: 18px; }
    .landing-use-cases { padding: 0; }
}
/* Landing and meeting setup are intentionally separate experiences. */
.landing-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin-top: 28px;
}

.landing-primary,
.landing-secondary,
.wizard-home-link {
    min-height: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border-radius: 14px;
    padding: 0 22px;
    font-weight: 800;
    text-decoration: none;
    transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.landing-primary {
    color: #fff;
    background: #087f73;
    box-shadow: 0 12px 28px rgba(8, 127, 115, .2);
}

.landing-primary:hover { background: #066b62; }

.landing-secondary {
    color: #16423e;
    background: rgba(255, 255, 255, .82);
    border: 1px solid #d5e4e1;
}

.landing-secondary:hover { background: #fff; border-color: #9fc9c3; }

.landing-primary:focus-visible,
.landing-secondary:focus-visible,
.wizard-home-link:focus-visible {
    outline: 3px solid rgba(8, 127, 115, .28);
    outline-offset: 3px;
}

.landing-helper {
    margin: 12px 2px 0;
    color: #637873;
    font-size: .83rem;
}

.start-body.landing-only .start-panel { display: none !important; }

.start-body.landing-only .visit-start-hero {
    grid-template-columns: minmax(0, 1fr);
    max-width: 1160px;
    margin-inline: auto;
}

.start-body.landing-only .start-copy {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(340px, 1.1fr);
    grid-template-areas:
        "eyebrow visual"
        "title visual"
        "lead visual"
        "actions visual"
        "helper visual"
        "trust visual";
    column-gap: clamp(36px, 6vw, 88px);
    align-items: center;
    padding: clamp(30px, 5vw, 66px);
}

.start-body.landing-only .brand-logo { grid-area: eyebrow; align-self: start; margin-bottom: 72px !important; }
.start-body.landing-only .eyebrow { grid-area: eyebrow; align-self: end; }
.start-body.landing-only .lead-text { grid-area: lead; }
.start-body.landing-only .trust-row { grid-area: trust; align-self: start; }

.start-body.landing-only .hero-eyebrow { grid-area: eyebrow; align-self: end; }
.start-body.landing-only .start-copy h1 { grid-area: title; max-width: 660px; }
.start-body.landing-only .start-lead { grid-area: lead; max-width: 650px; }
.start-body.landing-only .landing-actions { grid-area: actions; }
.start-body.landing-only .landing-helper { grid-area: helper; }
.start-body.landing-only .start-trust-row { grid-area: trust; align-self: start; }
.start-body.landing-only .start-visual { grid-area: visual; margin: 0; min-height: 440px; }
.start-body.landing-only .start-visual img { height: 100%; object-fit: cover; }

.start-body.wizard-body .start-copy,
.start-body.wizard-body .start-dock { display: none !important; }

.start-body.wizard-body .visit-start-shell {
    min-height: 100dvh;
    display: grid;
    align-content: center;
    max-width: 940px;
    margin-inline: auto;
    padding-block: 76px 32px;
}

.start-body.wizard-body .visit-start-hero {
    display: block;
    width: 100%;
}

.start-body.wizard-body .start-panel {
    width: min(100%, 820px);
    margin-inline: auto;
}

.wizard-home-link {
    position: fixed;
    z-index: 20;
    inset-block-start: 20px;
    inset-inline-start: 24px;
    min-height: 44px;
    padding-inline: 16px;
    color: #31534f;
    background: rgba(255, 255, 255, .9);
    border: 1px solid #d8e5e2;
    box-shadow: 0 8px 24px rgba(24, 52, 48, .08);
    backdrop-filter: blur(12px);
}

@media (max-width: 840px) {
    .start-body.landing-only .start-copy {
        display: block;
        padding: 28px 22px;
    }

    .start-body.landing-only .brand-logo { margin-bottom: 20px !important; }

    .start-body.landing-only .start-visual {
        min-height: 260px;
        margin-top: 28px;
    }

    .start-body.wizard-body .visit-start-shell { padding: 82px 16px 24px; }
    .wizard-home-link { inset-block-start: 14px; inset-inline-start: 16px; }
}

@media (max-width: 520px) {
    .landing-actions { display: grid; }
    .landing-primary, .landing-secondary { width: 100%; }
    .start-body.landing-only .start-visual { min-height: 220px; }
}

/* Premium landing layer */
.start-body.landing-only {
    --landing-ink: #102c29;
    --landing-accent: #087f73;
    background:
        radial-gradient(circle at 85% 8%, rgba(72, 187, 168, .15), transparent 27rem),
        radial-gradient(circle at 8% 38%, rgba(245, 190, 91, .11), transparent 22rem),
        #f7faf9;
}

.start-body.landing-only .visit-start-shell {
    max-width: 1240px;
    padding: clamp(20px, 3vw, 40px);
    gap: clamp(24px, 4vw, 48px);
}

.start-body.landing-only .start-copy {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(200, 221, 216, .92) !important;
    border-radius: 32px !important;
    background: rgba(255, 255, 255, .8) !important;
    box-shadow: 0 28px 70px rgba(31, 72, 66, .09) !important;
    backdrop-filter: blur(18px);
}

.start-body.landing-only .start-copy::after {
    content: "";
    display: block !important;
    position: absolute;
    inset: auto -80px -110px auto;
    width: 260px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: rgba(8, 127, 115, .06);
    pointer-events: none;
}

.start-body.landing-only .start-copy h1 {
    color: var(--landing-ink) !important;
    font-size: clamp(2.7rem, 5vw, 5.15rem);
    line-height: 1.15;
}

.start-body.landing-only .start-copy h1 em {
    display: block;
    color: var(--landing-accent);
    font: inherit;
    font-style: normal;
}

.start-body.landing-only .start-lead,
.start-body.landing-only .lead-text {
    max-width: 590px;
    color: #455e5a !important;
    font-size: clamp(.98rem, 1.35vw, 1.12rem);
    line-height: 1.95;
}

.start-body.landing-only .landing-primary,
.start-body.landing-only .landing-secondary {
    cursor: pointer;
}

.start-body.landing-only .landing-primary {
    min-width: 208px;
    background: linear-gradient(135deg, #0a8b7d, #066c63);
}

.start-body.landing-only .landing-primary:hover {
    box-shadow: 0 16px 34px rgba(8, 127, 115, .27);
}

.start-body.landing-only .landing-helper {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.start-body.landing-only .landing-helper .material-icons { font-size: 17px; }

.start-body.landing-only .start-visual {
    position: relative;
    isolation: isolate;
    border: 8px solid rgba(255, 255, 255, .88);
    border-radius: 28px;
    box-shadow: 0 30px 55px rgba(22, 54, 50, .18);
    transform: rotate(-1deg);
}

.start-body.landing-only .start-visual::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, transparent 46%, rgba(9, 28, 26, .48));
    pointer-events: none;
}

.start-body.landing-only .start-visual img { filter: saturate(.88) contrast(1.03); }

.start-body.landing-only .start-visual figcaption {
    position: absolute;
    z-index: 3;
    inset: auto 18px 16px;
    color: #fff;
    background: transparent;
}

.start-body.landing-only .start-visual figcaption span { color: rgba(255, 255, 255, .78); }

.visual-live-pill {
    position: absolute;
    z-index: 3;
    inset: 18px 18px auto auto;
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 13px;
    color: #174b45;
    background: rgba(255, 255, 255, .88);
    border: 1px solid rgba(255, 255, 255, .9);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
    backdrop-filter: blur(12px);
}

.visual-live-pill i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #0aa37f;
    box-shadow: 0 0 0 4px rgba(10, 163, 127, .14);
}

.visual-tool-card {
    position: absolute;
    z-index: 4;
    width: min(230px, 52%);
    min-height: 64px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 13px;
    color: #173a36;
    background: rgba(255, 255, 255, .92);
    border: 1px solid rgba(255, 255, 255, .92);
    border-radius: 16px;
    box-shadow: 0 14px 32px rgba(17, 46, 42, .16);
    backdrop-filter: blur(14px);
}

.visual-tool-card > .material-icons {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    color: #087f73;
    background: #e8f6f3;
    border-radius: 12px;
}

.visual-tool-card b,
.visual-tool-card small { display: block; }
.visual-tool-card b { font-size: 12px; }
.visual-tool-card small { margin-top: 3px; color: #647773; font-size: 9px; line-height: 1.5; }
.visual-tool-card--top { inset: 82px auto auto -26px; }
.visual-tool-card--bottom { inset: auto -24px 92px auto; }

.landing-use-cases {
    display: grid;
    grid-template-columns: minmax(240px, .72fr) minmax(0, 1.5fr);
    gap: clamp(24px, 4vw, 52px);
    align-items: center;
    direction: rtl;
}

.use-case-intro { text-align: right; }
.use-case-intro > span { color: #087f73; font-size: 12px; font-weight: 900; }
.use-case-intro h2 { margin: 8px 0; color: #17312e; font-size: clamp(1.5rem, 2.5vw, 2.2rem); line-height: 1.5; }
.use-case-intro p { margin: 0; color: #657874; font-size: 13px; line-height: 1.85; }

.use-case-list {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
}

.use-case-list article {
    grid-column: span 2;
    min-height: 112px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 17px;
    text-align: right;
    background: rgba(255, 255, 255, .82);
    border: 1px solid #dce9e6;
    border-radius: 18px;
    box-shadow: 0 9px 24px rgba(35, 67, 62, .05);
}

.use-case-list article:nth-child(4) { grid-column: 2 / span 2; }
.use-case-list article > .material-icons { color: #087f73; font-size: 25px; }
.use-case-list b, .use-case-list small { display: block; }
.use-case-list b { color: #203c38; font-size: 13px; }
.use-case-list small { margin-top: 7px; color: #687b77; font-size: 10px; line-height: 1.65; }

@media (max-width: 960px) {
    .landing-use-cases { grid-template-columns: 1fr; }
    .start-body.landing-only .start-visual { transform: none; }
    .visual-tool-card--top { inset-inline-start: 12px; }
    .visual-tool-card--bottom { inset-inline-end: 12px; }
}

@media (max-width: 680px) {
    .start-body.landing-only .visit-start-shell { padding: 14px; }
    .start-body.landing-only .start-copy { border-radius: 24px !important; }
    .start-body.landing-only .start-copy h1 { font-size: clamp(2.25rem, 12vw, 3.25rem); }
    .start-body.landing-only .start-visual { border-width: 5px; border-radius: 22px; }
    .visual-tool-card { display: none; }
    .use-case-list { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; }
    .use-case-list article { min-width: min(78vw, 270px); scroll-snap-align: start; }
    .use-case-list article:nth-child(4) { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
    .start-body.landing-only .landing-primary,
    .start-body.landing-only .landing-secondary { transition: none; }
}

/* Final placement overrides: keep preview cards fully inside the image. */
.start-body.landing-only .start-visual {
    margin-top: clamp(72px, 7vw, 104px) !important;
}

.start-body.landing-only .visual-tool-card {
    width: min(248px, 46%);
    min-height: 70px;
    display: flex;
    align-items: center;
    overflow: hidden;
}

.start-body.landing-only .visual-tool-card--top {
    inset: 94px auto auto 28px !important;
}

.start-body.landing-only .visual-tool-card--bottom {
    inset: auto 28px 96px auto !important;
}

.start-body.landing-only .visual-tool-card > .material-icons {
    width: 42px;
    height: 42px;
    min-width: 42px;
    display: grid;
    place-items: center;
    flex: 0 0 42px;
    overflow: hidden;
    font-size: 22px;
    line-height: 1;
}

.start-body.landing-only .visual-tool-card > div {
    min-width: 0;
    flex: 1 1 auto;
}

.start-body.landing-only .visual-tool-card b,
.start-body.landing-only .visual-tool-card small {
    overflow-wrap: anywhere;
}

@media (max-width: 680px) {
    .start-body.landing-only .start-visual { margin-top: 52px !important; }
    .start-body.landing-only .visual-tool-card { display: flex; width: min(210px, 58%); min-height: 58px; padding: 8px 10px; }
    .start-body.landing-only .visual-tool-card--top { inset: 70px auto auto 12px !important; }
    .start-body.landing-only .visual-tool-card--bottom { inset: auto 12px 72px auto !important; }
    .start-body.landing-only .visual-tool-card > .material-icons { width: 34px; height: 34px; min-width: 34px; flex-basis: 34px; font-size: 19px; }
    .start-body.landing-only .visual-tool-card small { display: none; }
}

/* Final hero spacing and stable button hover. */
.start-body.landing-only .visit-start-shell {
    padding-top: clamp(72px, 8vw, 112px) !important;
}

.start-body.landing-only .eyebrow {
    order: 1 !important;
    width: min(100%, 430px);
    min-height: 28px;
    margin: 0 auto 24px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #087f73 !important;
    background: transparent !important;
    border: 0 !important;
    text-align: center;
}

.start-body.landing-only .eyebrow::before,
.start-body.landing-only .eyebrow::after {
    content: "";
    width: clamp(28px, 5vw, 64px);
    height: 1px;
    background: linear-gradient(90deg, transparent, #9fcac4);
}

.start-body.landing-only .eyebrow::after {
    background: linear-gradient(90deg, #9fcac4, transparent);
}

.start-body.landing-only .eyebrow span {
    flex: 0 0 auto;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0;
}

.start-body.landing-only .start-copy h1 { order: 2 !important; }
.start-body.landing-only .lead-text { order: 3 !important; }
.start-body.landing-only .landing-actions { order: 4 !important; }
.start-body.landing-only .start-visual { order: 5 !important; }

.header-create-button::before,
.start-body.landing-only .landing-primary::before {
    display: none !important;
}

.header-create-button,
.start-body.landing-only .landing-primary {
    transform: none !important;
    transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease !important;
}

.header-create-button:hover,
.start-body.landing-only .landing-primary:hover {
    transform: none !important;
    background: #066b62 !important;
    border-color: #055c54 !important;
    box-shadow: 0 10px 22px rgba(6, 107, 98, .22) !important;
}

@media (max-width: 680px) {
    .start-body.landing-only .visit-start-shell { padding-top: 48px !important; }
    .start-body.landing-only .eyebrow { margin-bottom: 18px !important; gap: 10px; }
    .start-body.landing-only .eyebrow span { font-size: 11px; }
}

/* Keep the hero box near the header; place breathing room inside it. */
.start-body.landing-only .visit-start-shell {
    padding-top: 18px !important;
}

.start-body.landing-only .eyebrow {
    margin: clamp(44px, 5vw, 68px) auto 24px !important;
}

@media (max-width: 680px) {
    .start-body.landing-only .visit-start-shell { padding-top: 10px !important; }
    .start-body.landing-only .eyebrow { margin: 34px auto 18px !important; }
}

/* Center every mode caption and align the lower tool card above it. */
.start-body.landing-only .start-visual figcaption {
    width: min(70%, 680px);
    inset: auto 50% 18px auto !important;
    padding: 12px 18px;
    text-align: center;
    transform: translateX(50%);
}

.start-body.landing-only .start-visual figcaption b,
.start-body.landing-only .start-visual figcaption span {
    display: block;
    width: 100%;
    text-align: center;
}

.start-body.landing-only .start-visual figcaption b {
    font-size: 15px;
}

.start-body.landing-only .start-visual figcaption span {
    margin-top: 5px;
    font-size: 11px;
}

.start-body.landing-only .visual-tool-card--bottom {
    inset: auto 28px 88px auto !important;
}

.start-body.landing-only .start-visual[data-direction="next"].is-switching figcaption {
    transform: translateX(50%) translate3d(-72px, 0, -30px) rotateY(-16deg);
}
.start-body.landing-only .start-visual[data-direction="previous"].is-switching figcaption {
    transform: translateX(50%) translate3d(72px, 0, -30px) rotateY(16deg);
}
.start-body.landing-only .start-visual[data-direction="next"].is-entering figcaption {
    transform: translateX(50%) translate3d(72px, 0, -30px) rotateY(16deg);
}
.start-body.landing-only .start-visual[data-direction="previous"].is-entering figcaption {
    transform: translateX(50%) translate3d(-72px, 0, -30px) rotateY(-16deg);
}

@media (max-width: 680px) {
    .start-body.landing-only .start-visual figcaption {
        width: calc(100% - 24px);
        bottom: 10px !important;
        padding: 9px 12px;
    }
    .start-body.landing-only .start-visual figcaption b { font-size: 12px; }
    .start-body.landing-only .start-visual figcaption span { font-size: 9px; }
    .start-body.landing-only .visual-tool-card--bottom { inset: auto 12px 70px auto !important; }
}

/* Responsive artwork and precise hero emphasis. */
.start-body.landing-only .start-copy h1 em {
    display: inline !important;
    color: #087f73 !important;
}

.start-body.landing-only .start-visual picture {
    width: 100%;
    height: 100%;
    display: block;
}

.start-body.landing-only .start-visual picture img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

@media (max-width: 680px) {
    .start-body.landing-only .start-visual {
        aspect-ratio: 9 / 14 !important;
        max-height: none !important;
    }
    .start-body.landing-only .start-visual picture img {
        object-position: center center;
    }
}

/* 2026 fullscreen and controls interaction fix */
.landing-header { padding-inline-start: clamp(32px, 5vw, 82px) !important; }
select { min-height: 44px; padding: 0 14px 0 42px !important; border: 1px solid #d8e2e0 !important; border-radius: 10px !important; background-color: #fff !important; color: #172522 !important; font: inherit; box-shadow: 0 1px 2px rgba(16,35,31,.04); transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease; }
select:hover { border-color: #a9bfba !important; background-color: #fbfdfc !important; }
select:focus-visible { outline: none !important; border-color: #0b8073 !important; box-shadow: 0 0 0 3px rgba(11,128,115,.14) !important; }
.control-bar { opacity: 1 !important; transform: translate(-50%, 0) !important; }
.consult-shell.controls-idle .control-bar:not(:hover):not(:focus-within) { opacity: 0 !important; transform: translate(-50%, calc(100% + 30px)) !important; pointer-events: none; }
.video-fullscreen[aria-pressed="true"] { background: rgba(255,255,255,.96); color: #0b665d; }
.video-card:fullscreen { width: 100vw; height: 100vh; border-radius: 0; background: #08131c; }
.video-card:fullscreen video { width: 100%; height: 100%; object-fit: contain; }
.video-card:fullscreen .video-fullscreen { position: fixed; top: 20px; inset-inline-end: 20px; z-index: 3; }
@media (prefers-reduced-motion: reduce) { .control-bar, select { transition: none !important; } }

/* AI meeting draft controls */
.ai-audio-picker { grid-column: 1 / -1; min-height: 58px; padding: 10px 12px; display: flex; align-items: center; gap: 10px; border: 1px dashed #b7cbc7; border-radius: 12px; background: #f8fbfa; color: #173d37; cursor: pointer; }
.ai-audio-picker:hover { border-color: #0b8073; background: #f0f9f7; }
.ai-audio-picker > span:nth-child(2) { display: grid; gap: 2px; min-width: 0; }
.ai-audio-picker small { color: #647a76; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ai-audio-picker input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.ai-consent { grid-column: 1 / -1; display: flex; align-items: flex-start; gap: 9px; padding: 9px 10px; border-radius: 10px; background: #f4f7f6; color: #4d625e; font-size: 11px; line-height: 1.8; cursor: pointer; }
.ai-consent input { width: 18px; height: 18px; margin-top: 1px; accent-color: #0b8073; flex: 0 0 auto; }
.ai-transcript-card { grid-column: 1 / -1; }
.ai-transcript-card p { max-height: 220px; overflow: auto; white-space: pre-wrap; line-height: 1.9; }
#generateAiSummary.is-loading .material-icons { animation: ai-spin 1s linear infinite; }
@keyframes ai-spin { to { transform: rotate(360deg); } }

/* Final accessibility touch targets */
.video-fullscreen { width: 44px !important; height: 44px !important; }
#generateAiSummary:disabled { opacity: .58; cursor: wait; }

/* Live captions and transcript exports */
.video-section,
.video-card:fullscreen { position: relative; }

.live-caption-overlay {
  position: absolute;
  z-index: 24;
  inset-inline: 50% auto;
  bottom: 94px;
  width: min(720px, calc(100% - 32px));
  padding: 10px 12px 12px;
  color: #fff;
  background: rgba(8, 17, 24, .9);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 16px;
  box-shadow: 0 16px 40px rgba(0, 0, 0, .3);
  backdrop-filter: blur(14px);
  transform: translateX(50%) translateY(8px);
  opacity: 0;
  transition: opacity 180ms ease, transform 180ms ease;
}
.live-caption-overlay[hidden] { display: none !important; }
.live-caption-overlay.is-visible { opacity: 1; transform: translateX(50%) translateY(0); }
.live-caption-status { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 5px; color: #b9d8d2; font-size: 11px; font-weight: 700; }
.live-caption-status > span { display: inline-flex; align-items: center; gap: 7px; }
.live-caption-status i { width: 7px; height: 7px; border-radius: 999px; background: #43d5bc; box-shadow: 0 0 0 4px rgba(67, 213, 188, .12); }
.live-caption-overlay.is-processing .live-caption-status i { animation: caption-pulse 1.1s ease-in-out infinite; }
.live-caption-status button { width: 44px; height: 44px; margin: -5px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 10px; color: #dce9e6; background: transparent; cursor: pointer; }
.live-caption-status button:hover,
.live-caption-status button:focus-visible { color: #fff; background: rgba(255,255,255,.12); outline: none; }
.live-caption-overlay p { margin: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 8px; font-size: clamp(14px, 1.35vw, 18px); line-height: 1.85; text-align: right; }
.live-caption-overlay p b { color: #72e2ce; white-space: nowrap; }
.live-caption-overlay p span { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.video-card:fullscreen .live-caption-overlay { position: absolute; bottom: 24px; width: min(760px, calc(100% - 40px)); }

.caption-consent-dialog {
  width: min(520px, calc(100vw - 28px));
  padding: 0;
  border: 1px solid #dbe6e3;
  border-radius: 20px;
  color: #172522;
  background: #fff;
  box-shadow: 0 30px 90px rgba(5, 23, 20, .28);
}
.caption-consent-dialog::backdrop { background: rgba(7, 18, 26, .58); backdrop-filter: blur(4px); }
.caption-consent-dialog form { padding: 24px; display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 16px; }
.caption-consent-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; color: #08796e; background: #e9f7f4; }
.caption-consent-dialog h2 { margin: 5px 0 8px; font-size: 18px; line-height: 1.55; }
.caption-consent-dialog p { margin: 0; color: #526762; font-size: 13px; line-height: 1.9; }
.caption-consent-actions { grid-column: 1 / -1; display: grid; grid-template-columns: .7fr 1.3fr; gap: 10px; margin-top: 6px; }
.caption-consent-actions button { min-height: 46px; }
.caption-consent-dialog:focus { outline: none; }

.ai-export-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ai-export-row button { min-height: 42px; }
.ai-export-row button:disabled { opacity: .46; cursor: not-allowed; box-shadow: none; }

@keyframes caption-pulse {
  50% { opacity: .45; transform: scale(.82); }
}

@media (max-width: 640px) {
  .live-caption-overlay { bottom: 82px; width: calc(100% - 18px); padding: 8px 10px 10px; border-radius: 13px; }
  .live-caption-overlay p { grid-template-columns: 1fr; gap: 1px; font-size: 14px; line-height: 1.7; }
  .live-caption-overlay p b { font-size: 10px; }
  .caption-consent-dialog form { padding: 20px 16px; grid-template-columns: 42px minmax(0, 1fr); gap: 12px; }
  .caption-consent-icon { width: 42px; height: 42px; }
  .caption-consent-actions { grid-template-columns: 1fr; }
  .ai-export-row { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .live-caption-overlay { transition: none; }
  .live-caption-overlay.is-processing .live-caption-status i { animation: none; }
}


/* 2026 product UX audit: meeting workspace consolidation */
.consult-body {
  min-width: 320px;
  color: #172522;
  background: #edf2f1;
}

.consult-shell {
  width: 100%;
  height: 100dvh;
  min-height: 620px;
  overflow: hidden;
}

.consult-header {
  padding-inline: clamp(14px, 2vw, 28px);
  border-bottom: 1px solid #dce5e3;
  background: rgba(255, 255, 255, .96);
}

.brand-cluster {
  padding-inline-start: clamp(6px, 1vw, 14px);
}

.consult-layout,
.consult-shell.chat-collapsed .consult-layout {
  width: 100%;
  max-width: none;
  grid-template-columns: minmax(330px, 370px) minmax(0, 1fr) !important;
  gap: 12px;
  padding: 12px;
}

.clinical-sidebar {
  height: 100%;
  min-height: 0;
  padding: 12px;
  gap: 10px;
  border-radius: 18px;
  overflow: hidden;
}

.clinical-sidebar,
.clinical-sidebar * {
  direction: rtl;
}

.clinical-sidebar h2,
.clinical-sidebar h3,
.clinical-sidebar p,
.clinical-sidebar label,
.workspace-head,
.workspace-section,
.ai-card,
.ai-disclaimer {
  text-align: right;
}

.clinical-sidebar .clinical-content,
.adaptive-workspace {
  min-height: 0;
  flex: 1 1 auto;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #bad0cb transparent;
}

.adaptive-workspace {
  height: 100%;
  padding: 0 0 82px 3px;
}

.workspace-head {
  position: sticky;
  top: 0;
  z-index: 5;
  min-height: 62px;
  margin-bottom: 2px;
  padding: 10px 11px;
  background: rgba(255,255,255,.96);
  border: 1px solid #e0e9e7;
  border-radius: 13px;
  backdrop-filter: blur(12px);
}

.workspace-section {
  margin-top: 9px;
  padding: 12px;
  border-radius: 13px;
  background: #fff;
}

.workspace-section label,
.field-group {
  display: grid;
  gap: 7px;
  color: #29433f;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.65;
}

.workspace-section input:not([type='checkbox']):not([type='range']),
.workspace-section textarea,
.field-group input,
.field-group textarea {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  color: #172522;
  background: #fbfdfc;
  border: 1px solid #d7e3e0;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(16,35,31,.025);
}

.workspace-section textarea,
.field-group textarea {
  min-height: 88px;
  resize: vertical;
  line-height: 1.8;
}

select {
  appearance: none;
  -webkit-appearance: none;
  min-height: 44px;
  padding: 0 13px 0 42px !important;
  color: #172522 !important;
  background-color: #fff !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23576d68' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: left 13px center !important;
  background-size: 17px !important;
  border: 1px solid #d5e1de !important;
  border-radius: 10px !important;
  box-shadow: 0 1px 2px rgba(16,35,31,.04) !important;
}

select:hover {
  border-color: #9dbbb5 !important;
  background-color: #fbfdfc !important;
}

select:focus-visible {
  outline: 0 !important;
  border-color: #0b8073 !important;
  box-shadow: 0 0 0 3px rgba(11,128,115,.14) !important;
}

.evidence-list {
  gap: 8px;
}

.evidence-list label {
  grid-template-columns: 24px minmax(0, 1fr);
  min-height: 48px;
  padding: 10px 11px;
  align-items: start;
  color: #304b46;
  border-radius: 11px;
  transition: border-color 150ms ease, background-color 150ms ease;
}

.evidence-list label:hover {
  border-color: #a8c8c2;
  background: #f8fcfb;
}

.evidence-list label:has(input:checked) {
  color: #0b5f56;
  border-color: #7fbbb2;
  background: #eef8f5;
}

.evidence-list input[type='checkbox'] {
  width: 22px;
  height: 22px;
  border: 2px solid #789791;
  border-radius: 6px;
}

.workspace-save {
  position: sticky;
  z-index: 8;
  bottom: 0;
  width: calc(100% + 3px);
  min-height: 50px;
  margin-top: 12px;
  border-radius: 11px;
  box-shadow: 0 -18px 22px rgba(255,255,255,.94), 0 9px 20px rgba(8,127,115,.16);
}

.workspace-save:focus-visible {
  outline: 3px solid rgba(8,127,115,.28);
  outline-offset: 2px;
}

.clinical-tabs {
  flex: 0 0 auto;
  padding: 4px;
  border-radius: 11px;
}

.clinical-tab {
  min-height: 40px;
}

.ai-panel {
  gap: 10px;
}

.ai-action-row,
.ai-export-row,
.ai-grid {
  grid-template-columns: 1fr;
  gap: 8px;
}

.ai-action-row .primary-action,
.ai-action-row .secondary-action,
.ai-export-row button {
  min-height: 44px;
}

.ai-card {
  padding: 12px;
  border-radius: 12px;
  box-shadow: none;
}

.ai-transcript-card p {
  max-height: 250px;
}

.video-section {
  min-width: 0;
  min-height: 0;
  height: 100%;
  padding: 10px;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 10px;
  border-radius: 18px;
  overflow: hidden;
  background: #f7faf9;
}

.video-toolbar {
  min-height: 50px;
  padding: 0 4px;
}

.video-toolbar > div:first-child,
.video-toolbar .eyebrow,
.video-toolbar h2 {
  direction: rtl;
  text-align: right;
}

.video-wrap {
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
  grid-auto-rows: minmax(220px, 1fr);
  gap: 8px;
  padding: 8px;
  border: 1px solid #263547;
  border-radius: 15px;
  background: #152131;
}

.video-card {
  height: 100%;
  min-height: 220px;
  border-radius: 13px;
}

.content-stage {
  min-height: 0;
  padding: 8px;
  border-color: #cedddb;
  border-radius: 15px;
  background: #eef4f2;
}

.content-stage .whiteboard-section {
  min-height: 0;
  background: #f8fbfa;
}

.video-section.stage-active {
  grid-template-rows: auto minmax(340px, 1fr) minmax(116px, 21vh);
}

.video-section.stage-active .video-wrap {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  grid-auto-rows: minmax(104px, 1fr);
  padding: 6px;
}

.video-section.stage-active .video-card {
  min-height: 104px;
}

.whiteboard-toolbar {
  grid-template-columns: minmax(170px, 1fr) auto auto;
}

.whiteboard-actions button,
.whiteboard-tools button,
.whiteboard-tools input[type='color'] {
  width: 44px;
  min-width: 44px;
  height: 44px;
}

.whiteboard-section.is-expanded {
  inset: 12px;
  z-index: 80;
  padding: 14px;
  background: #f7faf9;
  border: 1px solid #d3e0de;
}

.whiteboard-section.is-expanded canvas {
  background-color: #fff;
}

.communication-panel {
  top: 78px;
  bottom: 86px;
  left: 12px;
  width: min(430px, calc(100vw - 24px));
  height: auto;
  min-height: 0;
  border-radius: 18px;
}

.communication-panel .in-call-chat-wrap,
.communication-panel .panel-content,
.communication-panel .chat-show-wrap,
.communication-panel .chat-thread,
.communication-panel .file-show-wrap,
.communication-panel .in-call-wrap-up {
  min-height: 0;
}

.communication-panel .chat-show-wrap,
.communication-panel .file-show-wrap,
.communication-panel .in-call-wrap-up {
  height: 100%;
}

.communication-panel .chat-thread,
.communication-panel .show-attach-file,
.communication-panel .in-call-wrap-up {
  overflow-y: auto;
  overscroll-behavior: contain;
}

.control-bar {
  bottom: 16px;
  left: calc((100% - 370px) / 2);
  min-height: 66px;
  padding: 7px;
  gap: 6px;
  border-radius: 18px;
  opacity: 1;
  transform: translate(-50%, 0);
}

.control-button {
  width: 62px;
  min-width: 62px;
  min-height: 52px;
  border-radius: 12px;
  transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease, opacity 150ms ease;
}

.control-button:hover,
.control-button:focus-visible {
  transform: none !important;
}

.control-button.active {
  color: #0a655c;
  background: #e6f6f2;
  border-color: #b9ddd6;
}

.control-button.danger {
  background: #d93642;
  border-color: #d93642;
}

.consult-shell button,
.consult-shell a {
  text-decoration: none !important;
}

.consult-shell button:hover,
.consult-shell button:active,
.consult-shell a:hover {
  transform: none;
  text-decoration: none !important;
}

.consult-shell.controls-idle .control-bar:not(:hover):not(:focus-within) {
  opacity: 0 !important;
  transform: translate(-50%, calc(100% + 24px)) !important;
  pointer-events: none;
}

.live-caption-overlay {
  bottom: 96px;
}

@media (min-width: 961px) and (max-width: 1280px) {
  .consult-layout,
  .consult-shell.chat-collapsed .consult-layout {
    grid-template-columns: minmax(300px, 340px) minmax(0, 1fr) !important;
  }

  .control-bar {
    left: calc((100% - 340px) / 2);
  }
}

@media (max-width: 960px) {
  .consult-shell {
    min-height: 560px;
  }

  .consult-layout,
  .consult-shell.chat-collapsed .consult-layout {
    grid-template-columns: minmax(0, 1fr) !important;
    padding: 8px;
  }

  .clinical-sidebar,
  .communication-panel {
    top: 66px;
    bottom: 78px;
    width: min(410px, calc(100vw - 20px));
    height: auto;
  }

  .clinical-sidebar {
    right: 10px;
  }

  .communication-panel {
    left: 10px;
  }

  .control-bar {
    left: 50%;
    bottom: 10px;
    width: auto;
    max-width: calc(100vw - 16px);
    min-height: 62px;
    justify-content: flex-start;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .control-bar::-webkit-scrollbar {
    display: none;
  }

  .control-button {
    min-width: 64px;
    width: 64px;
  }

  .video-section.stage-active {
    grid-template-rows: auto minmax(270px, 1fr) 116px;
  }
}

@media (max-width: 640px) {
  .consult-header {
    padding-inline: 10px;
  }

  .clinical-sidebar,
  .communication-panel {
    inset-inline: 0 !important;
    right: 0 !important;
    left: 0 !important;
    top: 58px;
    bottom: 72px;
    width: 100vw !important;
    border-radius: 16px 16px 0 0 !important;
  }

  .clinical-sidebar {
    padding: 10px;
  }

  .adaptive-workspace {
    padding-bottom: 76px;
  }

  .workspace-row {
    grid-template-columns: 1fr;
  }

  .video-section {
    padding: 7px;
    gap: 7px;
    border-radius: 14px;
  }

  .video-toolbar h2 {
    max-width: 58vw;
  }

  .video-wrap {
    grid-template-columns: 1fr;
    grid-auto-rows: minmax(190px, 1fr);
    padding: 5px;
  }

  .video-card {
    min-height: 190px;
  }

  .video-section.stage-active {
    grid-template-rows: auto minmax(250px, 1fr) 104px;
  }

  .video-section.stage-active .video-wrap {
    grid-auto-flow: column;
    grid-template-columns: none;
    grid-auto-columns: minmax(145px, 64vw);
    overflow-x: auto;
  }

  .whiteboard-toolbar {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .whiteboard-tools,
  .whiteboard-actions {
    grid-column: 1;
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .whiteboard-section.is-expanded {
    inset: 4px;
    padding: 9px;
    border-radius: 14px;
  }

  .control-bar {
    border-radius: 16px;
  }

  .control-button {
    min-width: 58px;
    width: 58px;
  }

  .control-button small {
    font-size: 9px;
  }

  .live-caption-overlay {
    bottom: 82px;
  }
}

@media (hover: none) and (pointer: coarse) {
  .consult-shell.controls-idle .control-bar:not(:hover):not(:focus-within) {
    opacity: 1 !important;
    transform: translate(-50%, 0) !important;
    pointer-events: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .workspace-section,
  .evidence-list label,
  .control-button {
    transition: none !important;
  }
}


/* Mobile call controls: keep the essential actions visible before optional tools. */
@media (max-width: 640px) {
  .control-bar {
    width: calc(100vw - 12px);
    max-width: none;
    min-height: 58px;
    padding: 5px;
    gap: 4px;
    scroll-padding-inline: 5px;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline proximity;
  }

  .control-button {
    width: 48px;
    min-width: 48px;
    min-height: 48px;
    scroll-snap-align: start;
  }

  .control-button small {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  #miceMuteUnmute { order: 1; }
  #videoCamOnOff { order: 2; }
  .end-call-wrap { order: 3; }
  #ScreenShareOnOf { order: 4; }
  #liveCaptionAction { order: 5; }
  .start-record { order: 6; }
  #handRaiseAction { order: 7; }
  #shareLocationAction { order: 8; }
}

/* OneIx account and plan UI */
.account-trigger {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 12px;
  color: #19544d;
  background: #f2f8f6;
  border: 1px solid #cfe1dd;
  border-radius: 11px;
  font: inherit;
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none;
  transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease;
}

.account-trigger:hover {
  color: #075f56;
  background: #e8f5f1;
  border-color: #9cc7c0;
}

.account-trigger .material-icons {
  font-size: 20px;
}

.account-trigger-floating {
  position: fixed;
  z-index: 22;
  inset: 18px 18px auto auto;
  box-shadow: 0 9px 24px rgba(20,50,46,.1);
}

.account-is-pro .account-trigger {
  color: #5b33b5;
  background: #f2edff;
  border-color: #d6c7ff;
}

.account-dialog {
  width: min(780px, calc(100vw - 24px));
  max-height: min(780px, calc(100dvh - 24px));
  padding: 0;
  color: #172522;
  background: #f8faf9;
  border: 1px solid #d7e2df;
  border-radius: 22px;
  box-shadow: 0 30px 100px rgba(7,25,22,.3);
  overflow: auto;
}

.account-dialog::backdrop {
  background: rgba(8,19,26,.6);
  backdrop-filter: blur(4px);
}

.account-dialog-shell {
  padding: 22px;
  direction: rtl;
}

.account-dialog header,
.account-user-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.account-dialog header {
  padding-bottom: 16px;
  border-bottom: 1px solid #e0e8e6;
}

.account-dialog h2 {
  margin: 5px 0 0;
  font-size: 20px;
  line-height: 1.55;
  text-align: right;
}

.account-kicker {
  color: #0b7a6f;
  font-size: 11px;
  font-weight: 900;
}

.account-close {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  color: #3f5752;
  background: #fff;
  border: 1px solid #d9e4e1;
  border-radius: 11px;
  cursor: pointer;
}

.account-feedback {
  min-height: 26px;
  margin: 12px 0 4px;
  color: #176b61;
  font-size: 12px;
  line-height: 1.8;
}

.account-feedback.is-error {
  color: #b52734;
}

.account-auth form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 10px;
  padding: 13px;
  background: #fff;
  border: 1px solid #dde7e4;
  border-radius: 14px;
}

.account-auth label {
  display: grid;
  gap: 6px;
  color: #35504b;
  font-size: 11px;
  font-weight: 800;
}

.account-auth input {
  min-height: 46px;
  padding: 0 12px;
  direction: ltr;
  text-align: left;
  border: 1px solid #d3e0dd;
  border-radius: 10px;
}

.account-user {
  padding: 12px 14px;
  background: #eef8f5;
  border: 1px solid #cfe6e1;
  border-radius: 13px;
}

.account-user small,
.account-user strong {
  display: block;
}

.account-user small {
  color: #617873;
  font-size: 10px;
}

.account-user strong {
  margin-top: 3px;
  direction: ltr;
  text-align: right;
  font-size: 13px;
}

.plan-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 14px;
}

.plan-card {
  position: relative;
  padding: 18px;
  text-align: right;
  background: #fff;
  border: 1px solid #dce6e4;
  border-radius: 16px;
}

.plan-card.is-current::after {
  content: "پلن فعلی";
  position: absolute;
  inset: 12px auto auto 12px;
  padding: 4px 8px;
  color: #0a685e;
  background: #e6f5f1;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 900;
}

.plan-card-pro {
  color: #2f2157;
  background: linear-gradient(145deg, #fbf9ff, #f2edff);
  border-color: #d8cbfb;
}

.plan-name {
  display: inline-flex;
  min-height: 27px;
  align-items: center;
  padding: 0 9px;
  color: #0a6f65;
  background: #e7f5f2;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 900;
}

.plan-card-pro .plan-name {
  color: #6337c2;
  background: #e9e0ff;
}

.plan-card > strong {
  display: block;
  margin-top: 12px;
  font-size: 17px;
}

.plan-card > strong b {
  font-size: 21px;
}

.plan-card > strong small {
  color: #71688a;
  font-size: 10px;
}

.plan-card ul {
  min-height: 112px;
  margin: 14px 0;
  padding: 0 18px 0 0;
  color: #516762;
  font-size: 11px;
  line-height: 2.15;
}

.plan-card-pro ul {
  color: #5e5673;
}

.plan-card .account-upgrade {
  width: 100%;
  min-height: 46px;
}

.account-retention-note {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 12px 0 0;
  padding: 10px 12px;
  color: #5d706c;
  background: #f1f5f4;
  border-radius: 11px;
  font-size: 10px;
  line-height: 1.9;
  text-align: right;
}

.account-retention-note .material-icons {
  color: #0b796e;
  font-size: 19px;
}

@media (max-width: 760px) {
  .landing-header .account-trigger {
    width: 42px;
    padding: 0;
  }

  .landing-header .account-trigger-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
  }

  .account-dialog-shell {
    padding: 16px;
  }

  .plan-grid {
    grid-template-columns: 1fr;
  }

  .account-auth form {
    grid-template-columns: 1fr;
  }
}


/* 2026 IA, RTL and responsive consolidation */
:root {
  --layer-base: 0;
  --layer-sticky: 20;
  --layer-drawer: 40;
  --layer-dialog: 100;
  --content-gutter: clamp(12px, 2.4vw, 32px);
}

html[dir="rtl"],
html[dir="rtl"] body {
  direction: rtl;
}

html[dir="rtl"] :where(
  .start-panel,
  .form-step,
  .field-group,
  .type-preview,
  .selected-type-summary,
  .review-card,
  .start-dock,
  .dock-item,
  .feature-heading,
  .clinical-sidebar,
  .clinical-panel,
  .adaptive-workspace,
  .workspace-section,
  .communication-panel,
  .panel-content,
  .ai-panel,
  .ai-card,
  .account-dialog,
  .meeting-info-card,
  .transcript-show-wrap
) {
  direction: rtl;
  text-align: right;
}

html[dir="rtl"] :where(input, textarea, select) {
  text-align: right;
}

html[dir="rtl"] :where(input[type="email"], input[inputmode="latin"], .session-code, .meeting_url) {
  direction: ltr;
  text-align: left;
}

:where(a, button, input, textarea, select) {
  touch-action: manipulation;
}

:where(a, button):focus-visible {
  outline: 3px solid rgba(8, 127, 115, .28);
  outline-offset: 3px;
}

.account-slot {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}

.account-slot:empty {
  display: none;
}

.account-slot .account-trigger {
  max-width: 100%;
  min-height: 46px;
  box-sizing: border-box;
}

.landing-header .header-actions {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.landing-header .account-trigger,
.landing-header .header-create-button,
.landing-header .header-join-button {
  flex: 0 0 auto;
}

.wizard-toolbar {
  position: sticky;
  z-index: var(--layer-sticky);
  top: max(8px, env(safe-area-inset-top));
  width: min(calc(100% - 24px), 1440px);
  min-height: 68px;
  margin: 10px auto 0;
  padding: 8px 10px 8px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  direction: rtl;
  background: rgba(255, 255, 255, .94);
  border: 1px solid #dbe6e3;
  border-radius: 17px;
  box-shadow: 0 10px 30px rgba(18, 53, 48, .08);
  backdrop-filter: blur(16px);
}

.wizard-brand {
  min-width: 72px;
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  border-radius: 10px;
}

.wizard-brand img {
  width: 78px;
  height: 42px;
  object-fit: contain;
}

.wizard-toolbar-actions {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.wizard-home-link,
.wizard-home-link:link,
.wizard-home-link:visited,
.wizard-home-link:hover,
.wizard-home-link:active,
.wizard-home-link:focus {
  position: static;
  inset: auto;
  z-index: auto;
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 13px;
  color: #234d47;
  background: #fff;
  border: 1px solid #d3e1de;
  border-radius: 11px;
  box-shadow: 0 2px 7px rgba(18, 53, 48, .04);
  font-size: 12px;
  font-weight: 850;
  text-decoration: none !important;
  transform: none !important;
  transition: color 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.wizard-body :where(.meeting-type-card, .role-option) input[type="radio"] {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.wizard-home-link:hover {
  color: #076b62;
  background: #edf8f5;
  border-color: #9fcac3;
  box-shadow: 0 6px 16px rgba(18, 83, 73, .08);
}

.wizard-home-link .material-icons {
  font-size: 19px;
}

.wizard-body .visit-start-shell {
  width: min(100%, 1440px);
  min-height: auto;
  padding: clamp(20px, 3vw, 42px) var(--content-gutter) clamp(40px, 6vw, 80px);
  align-content: start;
}

.wizard-body .visit-start-hero {
  width: 100%;
  grid-template-columns: minmax(300px, .76fr) minmax(540px, 1.24fr);
  align-items: start;
  gap: clamp(18px, 3vw, 42px);
}

.wizard-body .start-copy,
.wizard-body .start-panel {
  min-width: 0;
}

.wizard-body .start-panel {
  width: 100%;
  max-height: none;
  overflow: visible;
}

.wizard-body .form-step {
  min-width: 0;
}

.wizard-body .start-dock {
  width: 100%;
  grid-template-columns: minmax(220px, .82fr) repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: 12px;
}

.wizard-body .feature-heading,
.wizard-body .dock-item {
  min-width: 0;
  text-align: right !important;
}

.wizard-body .feature-heading {
  align-content: center;
}

.wizard-body .dock-item {
  grid-template-columns: auto 42px minmax(0, 1fr);
}

.start-panel .panel-heading > div,
.type-preview > div,
.selected-type-summary > div,
.review-card > div,
.dock-item > div {
  min-width: 0;
  text-align: right;
}

.start-panel :where(p, small, strong, span),
.start-dock :where(h2, p, small, strong, span) {
  overflow-wrap: anywhere;
}

.consult-shell {
  max-width: 100vw;
  overflow: hidden;
}

.consult-layout,
.video-section,
.video-wrap,
.clinical-sidebar,
.communication-panel {
  min-width: 0;
}

.video-toolbar {
  direction: rtl;
}

.video-toolbar > div:first-child {
  min-width: 0;
  text-align: right;
}

.video-toolbar-actions {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 7px;
}

.transcript-panel-button {
  white-space: nowrap;
}

.transcript-count {
  min-width: 20px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  padding-inline: 5px;
  color: #0a665d;
  background: #e4f4f0;
  border-radius: 999px;
  font-size: 9px;
  font-variant-numeric: tabular-nums;
}

.people-chat-wrap {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 4px;
  direction: rtl;
}

.panel-tab {
  min-width: 0;
  min-height: 48px;
  padding-inline: 5px !important;
  gap: 4px;
  overflow: hidden;
  text-align: center;
  white-space: nowrap;
}

.panel-tab > .material-icons {
  flex: 0 0 auto;
}

.transcript-show-wrap {
  min-height: 0;
  height: 100%;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  gap: 10px;
  padding: 12px;
  overflow: hidden;
}

.transcript-panel-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #e0e8e6;
}

.transcript-panel-header > div {
  min-width: 0;
}

.transcript-panel-header strong,
.transcript-panel-header small {
  display: block;
}

.transcript-panel-header strong {
  color: #172d29;
  font-size: 14px;
}

.transcript-panel-header small {
  margin-top: 4px;
  color: #607570;
  font-size: 10px;
  line-height: 1.75;
}

.transcript-live-indicator {
  min-height: 29px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  padding: 0 9px;
  color: #536b66;
  background: #f1f5f4;
  border: 1px solid #dce6e3;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 850;
}

.transcript-live-indicator i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #81928e;
}

.transcript-live-indicator.is-live {
  color: #08685f;
  background: #e8f7f3;
  border-color: #bde1da;
}

.transcript-live-indicator.is-live i {
  background: #0b9d83;
  box-shadow: 0 0 0 4px rgba(11, 157, 131, .12);
}

.transcript-live-indicator.is-error {
  color: #a82331;
  background: #fff0f2;
  border-color: #f0c2c7;
}

.transcript-live-indicator.is-error i {
  background: #d43a47;
}

.transcript-panel-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
}

.transcript-panel-actions #generateMinutesFromTranscript {
  grid-column: 1 / -1;
}

.transcript-panel-actions button {
  min-width: 0;
  min-height: 44px;
}

.transcript-empty-state {
  min-height: 190px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 6px;
  padding: 20px;
  color: #5f746f;
  text-align: center;
  background: #f7faf9;
  border: 1px dashed #cddbd8;
  border-radius: 14px;
}

.transcript-empty-state[hidden] {
  display: none !important;
}

.transcript-empty-state .material-icons {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  color: #0b756b;
  background: #e6f5f1;
  border-radius: 13px;
}

.transcript-empty-state strong {
  color: #243d38;
  font-size: 13px;
}

.transcript-empty-state p {
  max-width: 290px;
  margin: 0;
  font-size: 10px;
  line-height: 1.8;
}

.meeting-transcript-list {
  min-height: 0;
  margin: 0;
  padding: 0 0 10px;
  display: grid;
  align-content: start;
  gap: 8px;
  overflow-y: auto;
  overscroll-behavior: contain;
  list-style: none;
  scrollbar-gutter: stable;
}

.meeting-transcript-list:empty {
  display: none;
}

.meeting-transcript-list li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px 10px;
  padding: 11px 12px;
  background: #fff;
  border: 1px solid #dfe8e6;
  border-radius: 12px;
}

.meeting-transcript-list li b {
  color: #08766b;
  font-size: 10px;
  white-space: nowrap;
}

.meeting-transcript-list li p {
  margin: 0;
  color: #263b37;
  font-size: 12px;
  line-height: 1.9;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.meeting-transcript-list li time {
  grid-column: 1 / -1;
  color: #7a8c88;
  font-size: 9px;
  font-variant-numeric: tabular-nums;
}

.transcript-privacy-note {
  margin: 0;
  display: flex;
  align-items: flex-start;
  gap: 6px;
  color: #647873;
  font-size: 9px;
  line-height: 1.65;
}

.transcript-privacy-note .material-icons {
  margin-top: 1px;
  color: #0b756b;
  font-size: 16px;
}

.live-caption-status {
  align-items: center;
}

.live-caption-status > span b {
  font: inherit;
}

.live-caption-actions {
  display: flex;
  align-items: center;
  gap: 4px;
}

.live-caption-status .live-caption-actions button {
  margin: 0;
}

.live-caption-overlay.is-error {
  border-color: rgba(255, 118, 128, .6);
  background: rgba(54, 16, 21, .94);
}

.live-caption-overlay.is-empty {
  border-color: rgba(255, 203, 111, .55);
}

.ai-grid,
.ai-card,
.ai-card :where(p, li, small),
.clinical-panel :where(label, p, small, strong),
.adaptive-workspace :where(label, p, small, strong) {
  text-align: right;
}

@media (max-width: 1100px) {
  .wizard-body .visit-start-hero {
    grid-template-columns: minmax(0, 1fr);
  }

  .wizard-body .start-panel {
    order: 1;
  }

  .wizard-body .start-copy {
    order: 2;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, .75fr);
    align-items: center;
    gap: 18px 28px;
    padding: 22px;
  }

  .wizard-body .start-copy .brand-logo,
  .wizard-body .start-copy .eyebrow,
  .wizard-body .start-copy h1,
  .wizard-body .start-copy .lead-text,
  .wizard-body .start-copy .trust-row {
    grid-column: 1;
  }

  .wizard-body .start-copy .start-visual {
    grid-column: 2;
    grid-row: 1 / span 5;
  }

  .wizard-body .start-dock {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .wizard-body .feature-heading {
    grid-column: 1 / -1;
  }
}

@media (max-width: 900px) {
  .landing-header {
    grid-template-columns: minmax(64px, 1fr) auto !important;
    padding-inline: 10px !important;
    gap: 10px;
  }

  .landing-header nav {
    display: none !important;
  }

  .consult-layout,
  .consult-shell.chat-collapsed .consult-layout {
    grid-template-columns: minmax(0, 1fr) !important;
    padding-bottom: calc(78px + env(safe-area-inset-bottom));
  }

  .clinical-sidebar,
  .communication-panel {
    z-index: var(--layer-drawer);
  }
}

@media (max-width: 720px) {
  .wizard-toolbar {
    width: calc(100% - 16px);
    min-height: 62px;
    margin-top: 8px;
    padding: 6px 7px 6px 10px;
    border-radius: 14px;
  }

  .wizard-brand {
    min-width: 60px;
  }

  .wizard-brand img {
    width: 64px;
    height: 38px;
  }

  .wizard-home-link {
    min-height: 44px;
    padding-inline: 10px;
  }

  .wizard-body .visit-start-shell {
    padding-inline: 8px;
  }

  .wizard-body .start-copy {
    display: none;
  }

  .wizard-body .start-panel {
    border-radius: 18px;
  }

  .wizard-body .meeting-type-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .wizard-body .start-dock {
    grid-template-columns: minmax(0, 1fr);
  }

  .wizard-body .feature-heading {
    grid-column: auto;
    padding-block: 8px;
  }

  .wizard-body .dock-item {
    min-height: 78px;
  }

  .landing-header {
    width: calc(100% - 16px);
  }

  .landing-header .header-join-button {
    display: none;
  }

  .landing-header .header-actions {
    gap: 6px;
  }

  .landing-header .header-create-button {
    min-width: 112px;
    min-height: 44px;
    padding-inline: 12px;
  }

  .landing-header .account-trigger {
    min-height: 44px;
    padding-inline: 9px;
  }

  .start-body.landing-only .start-copy h1 {
    max-width: 100%;
    overflow-wrap: normal;
  }

  .people-chat-wrap {
    gap: 3px;
  }

  .panel-tab {
    min-height: 46px;
    flex-direction: column;
    font-size: 9px !important;
    line-height: 1.2;
  }

  .panel-tab > .material-icons {
    font-size: 18px;
  }

  .transcript-show-wrap {
    padding: 10px;
  }

  .live-caption-overlay {
    bottom: calc(72px + env(safe-area-inset-bottom));
  }
}

@media (max-width: 430px) {
  .wizard-home-link > span:last-child {
    max-width: 118px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .wizard-toolbar .account-trigger-label {
    display: none;
  }

  .wizard-toolbar .account-trigger {
    width: 44px;
    min-width: 44px;
    padding: 0;
  }

  .landing-header .landing-brand img {
    width: 62px;
  }

  .landing-header .header-create-button {
    min-width: 104px;
    padding-inline: 9px;
    font-size: 11px;
  }

  .landing-header .account-trigger-label {
    display: none;
  }

  .landing-header .account-trigger {
    width: 44px;
    min-width: 44px;
    padding: 0;
  }

  .video-toolbar {
    align-items: flex-start;
  }

  .video-toolbar-actions {
    gap: 4px;
  }

  .video-toolbar-actions .secondary-action {
    min-width: 44px;
    padding-inline: 9px;
  }

  .transcript-panel-button {
    font-size: 0;
  }

  .transcript-panel-button .material-icons,
  .transcript-panel-button .transcript-count {
    font-size: 18px;
  }

  .transcript-panel-button .transcript-count {
    font-size: 8px;
  }
}

@media (max-width: 430px) {
  .video-toolbar {
    inline-size: 100%;
    max-inline-size: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    box-sizing: border-box;
  }

  .video-toolbar > div:first-child,
  .video-toolbar h2 {
    min-inline-size: 0;
    max-inline-size: 100%;
  }

  .video-toolbar-actions {
    flex: 0 0 auto;
  }

  .video-toolbar-actions .secondary-action {
    inline-size: 44px;
    min-inline-size: 44px;
    max-inline-size: 44px;
    block-size: 44px;
    padding: 0;
    font-size: 0;
  }

  .video-toolbar-actions .secondary-action .material-icons {
    font-size: 19px;
  }

  .video-toolbar-actions .transcript-count {
    position: absolute;
    inset-block-start: -4px;
    inset-inline-start: -4px;
    min-inline-size: 18px;
    block-size: 18px;
    font-size: 8px;
    box-shadow: 0 0 0 2px #fff;
  }

  .transcript-panel-button {
    position: relative;
  }

  .video-wrap,
  .video-wrap > *,
  .video-wrap .userbox,
  .video-wrap .video-card,
  .video-wrap .empty-call-state {
    inline-size: 100% !important;
    max-inline-size: 100% !important;
    min-inline-size: 0 !important;
    box-sizing: border-box;
  }

  .video-wrap {
    overflow: hidden auto;
  }
}

@media (max-width: 370px) {
  .wizard-home-link > span:last-child {
    display: none;
  }

  .wizard-home-link {
    width: 44px;
    padding: 0;
  }

  .landing-header .header-create-button {
    min-width: 96px;
  }
}

@media (orientation: landscape) and (max-height: 600px) {
  .wizard-toolbar {
    position: relative;
    top: auto;
  }

  .clinical-sidebar,
  .communication-panel {
    top: 54px !important;
    bottom: 66px !important;
  }

  .control-bar {
    bottom: max(4px, env(safe-area-inset-bottom)) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .wizard-home-link,
  .account-trigger,
  .meeting-transcript-list li {
    transition: none !important;
  }
}



/* 2026 in-call workspace: docked controls, aligned drawers and RTL captions */
.consult-shell {
  height: 100dvh;
  min-height: 0 !important;
  grid-template-rows: 64px minmax(0, 1fr);
  overflow: hidden;
}

.consult-layout,
.consult-shell.chat-collapsed .consult-layout {
  height: 100%;
  min-height: 0;
  align-items: stretch;
}

.clinical-sidebar {
  align-self: stretch;
  margin: 0;
}

.video-section {
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.video-section.stage-active {
  grid-template-rows: auto minmax(250px, 1fr) minmax(104px, 18vh) auto;
}

.video-section.stage-collapsed {
  grid-template-rows: auto 120px minmax(0, 1fr) auto;
}

.video-section > .control-bar {
  position: static !important;
  inset: auto !important;
  z-index: 18;
  width: min(100%, 560px);
  max-width: 100%;
  min-height: 64px;
  margin: 0 auto;
  padding: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  justify-self: center;
  gap: 6px;
  overflow: visible;
  box-sizing: border-box;
  direction: rtl;
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: none !important;
  border: 1px solid #d7e3e0;
  border-radius: 16px;
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 8px 24px rgba(18, 48, 43, .09);
  backdrop-filter: blur(14px);
}

.consult-shell.controls-idle .video-section > .control-bar:not(:hover):not(:focus-within) {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: none !important;
}

.video-section > .control-bar .control-button {
  width: 58px;
  min-width: 58px;
  min-height: 50px;
}

.video-section > .control-bar .end-call-wrap {
  margin-inline-start: 8px;
}

.communication-panel {
  top: 76px;
  bottom: 12px;
  height: auto;
}

.live-caption-overlay {
  right: auto;
  left: 50%;
  bottom: 84px;
  width: min(760px, calc(100% - 32px));
  max-width: calc(100% - 32px);
  direction: rtl;
  text-align: right;
  transform: translateX(-50%);
}

.live-caption-status {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  direction: rtl;
  text-align: right;
}

.live-caption-status > span {
  min-width: 0;
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 6px;
  direction: rtl;
  text-align: right;
}

.live-caption-actions {
  margin-inline-start: auto;
  flex: 0 0 auto;
}

.live-caption-overlay p {
  width: 100%;
  direction: rtl;
  text-align: right !important;
}

.live-caption-overlay p > b,
.live-caption-overlay p > span {
  direction: rtl;
  text-align: right !important;
}

.caption-consent-dialog {
  direction: rtl;
  text-align: right;
}

.caption-consent-dialog form {
  width: min(520px, calc(100vw - 28px));
  max-height: calc(100dvh - 32px);
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  grid-template-areas:
    "icon copy"
    "actions actions";
  align-items: start;
  gap: 14px;
  overflow-y: auto;
  direction: rtl;
  text-align: right;
}

.caption-consent-icon {
  grid-area: icon;
  align-self: start;
  justify-self: start;
}

.caption-consent-dialog form > div:nth-child(2) {
  grid-area: copy;
  min-width: 0;
  direction: rtl;
  text-align: right;
}

.caption-consent-dialog :where(.eyebrow, h2, p) {
  width: 100%;
  margin-inline: 0;
  direction: rtl;
  text-align: right !important;
}

.caption-consent-actions {
  grid-area: actions;
  width: 100%;
  display: flex;
  justify-content: flex-start;
  gap: 8px;
  direction: rtl;
}

@media (max-width: 960px) {
  .consult-shell {
    min-height: 0 !important;
    grid-template-rows: 58px minmax(0, 1fr);
  }

  .consult-layout,
  .consult-shell.chat-collapsed .consult-layout {
    height: 100%;
    padding: 8px !important;
  }

  .clinical-sidebar,
  .communication-panel {
    top: 58px;
    bottom: 0;
    height: auto;
  }

  .video-section > .control-bar {
    width: min(100%, 590px);
  }
}

@media (max-width: 640px) {
  .video-section {
    grid-template-rows: auto minmax(0, 1fr) auto;
  }

  .video-section.stage-active {
    grid-template-rows: auto minmax(210px, 1fr) 92px auto;
  }

  .video-section.stage-collapsed {
    grid-template-rows: auto 92px minmax(0, 1fr) auto;
  }

  .video-section > .control-bar {
    width: 100%;
    min-height: 56px;
    padding: 4px;
    justify-content: flex-start;
    gap: 4px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-padding-inline: 4px;
    scrollbar-width: none;
    border-radius: 13px;
  }

  .video-section > .control-bar::-webkit-scrollbar {
    display: none;
  }

  .video-section > .control-bar .control-button {
    width: 44px;
    min-width: 44px;
    min-height: 48px;
  }

  .video-section > .control-bar .end-call-wrap {
    margin-inline-start: 4px;
  }

  .live-caption-overlay {
    bottom: 70px;
    width: calc(100% - 24px);
    max-width: calc(100% - 24px);
  }

  .caption-consent-dialog form {
    width: min(100%, calc(100vw - 20px));
    max-height: calc(100dvh - 20px);
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 10px;
    padding: 18px 14px;
  }

  .caption-consent-icon {
    width: 44px;
    height: 44px;
  }

  .caption-consent-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .caption-consent-actions button {
    width: 100%;
    min-height: 46px;
  }
}

@media (orientation: landscape) and (max-height: 600px) {
  .consult-shell {
    height: 100dvh;
    min-height: 0 !important;
    grid-template-rows: 54px minmax(0, 1fr);
  }

  .consult-layout,
  .consult-shell.chat-collapsed .consult-layout {
    padding: 6px !important;
  }

  .clinical-sidebar,
  .communication-panel {
    top: 54px !important;
    bottom: 0 !important;
  }

  .video-section {
    padding: 6px;
    gap: 5px;
  }

  .video-toolbar {
    min-height: 44px;
  }

  .video-section > .control-bar {
    min-height: 50px;
    padding-block: 3px;
  }

  .video-section > .control-bar .control-button {
    min-height: 44px;
  }

  .live-caption-overlay {
    bottom: 61px;
  }
}


.live-caption-overlay {
  inset-inline: 16px !important;
  right: 16px !important;
  left: 16px !important;
  width: auto;
  max-width: 760px;
  margin-inline: auto;
  transform: none !important;
}

@media (max-width: 640px) {
  .live-caption-overlay {
    inset-inline: 12px !important;
    right: 12px !important;
    left: 12px !important;
    width: auto;
    max-width: none;
  }
}


@media (max-width: 640px) {
  #miceMuteUnmute { order: 1; }
  #videoCamOnOff { order: 2; }
  #ScreenShareOnOf { order: 3; }
  #handRaiseAction { order: 4; }
  .start-record { order: 5; }
  #liveCaptionAction { order: 6; }
  #shareLocationAction { order: 7; }
  .end-call-wrap { order: 8; }
}

@media (orientation: landscape) and (max-height: 600px) {
  .consult-header {
    min-height: 54px;
    height: 54px;
    padding-block: 4px;
  }
}


.video-section > .control-bar {
  border-color: #2d4047;
  background: rgba(20, 31, 38, .98);
  box-shadow: 0 10px 28px rgba(6, 17, 23, .22);
}

.video-section > .control-bar .control-button {
  color: #f4faf8;
  background: #29383e;
  border-color: #3a4c52;
  opacity: 1;
}

.video-section > .control-bar .control-button .material-icons {
  color: inherit;
  background: transparent;
}

.video-section > .control-bar .control-button:hover,
.video-section > .control-bar .control-button:focus-visible {
  color: #fff;
  background: #394c52;
  border-color: #577078;
}

.video-section > .control-bar .control-button.active {
  color: #d9fff7;
  background: #0b766b;
  border-color: #26a794;
}

.video-section > .control-bar .control-button:disabled {
  color: #a9b8b5;
  background: #253238;
  border-color: #314148;
  opacity: .72;
}

.video-section > .control-bar .control-button.danger {
  color: #fff;
  background: #d43843;
  border-color: #e75560;
}

.video-section > .control-bar .control-button.danger:hover,
.video-section > .control-bar .control-button.danger:focus-visible {
  background: #bd2531;
  border-color: #ee6872;
}