.demo-section { background: white; }
            .agent-picker { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 18px; }
            .agent-picker-label { color: var(--muted); font-size: 23px; font-weight: 700; }
            .tabs { display: flex; flex-wrap: wrap; gap: 10px; }
            .tab {
                min-height: 44px;
                border: 1px solid var(--line);
                border-radius: 8px;
                background: var(--soft);
                padding: 10px 14px;
                color: #425363;
                font-weight: 850;
                cursor: pointer;
                display: inline-flex;
                align-items: center;
                text-decoration: none;
            }

            .tab[aria-selected="true"] {
                border-color: rgba(19, 123, 117, 0.36);
                background: var(--mint);
                color: var(--teal-dark);
            }

            .demo-tool {
                display: grid;
                grid-template-columns: minmax(0, 0.92fr) minmax(360px, 1.08fr);
                overflow: hidden;
                border: 1px solid var(--line);
                border-radius: 8px;
                background: var(--panel);
                box-shadow: 0 18px 40px rgba(28, 44, 56, 0.08);
            }

            .call-panel, .data-panel { padding: 24px; }
            .call-panel { border-right: 1px solid var(--line); background: #f7faf9; }
            .panel-title { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 18px; }
            .panel-title h3 { margin-bottom: 0; font-size: 22px; }
            .live-pill {
                border-radius: 999px;
                background: #e8f7ee;
                color: #25623e;
                padding: 6px 10px;
                font-size: 12px;
                font-weight: 900;
            }

            .mic-control {
                display: grid;
                min-height: 170px;
                place-items: center;
                border: 1px dashed #b8c7c3;
                border-radius: 8px;
                background: white;
                text-align: center;
            }

            .mic-button {
                width: 76px;
                height: 76px;
                border: 0;
                border-radius: 50%;
                background: var(--teal);
                color: white;
                font-size: 28px;
                font-weight: 900;
                cursor: pointer;
                box-shadow: 0 12px 22px rgba(19, 123, 117, 0.24);
            }

            .mic-control p { max-width: 260px; margin: 14px auto 0; color: var(--muted); font-size: 14px; }
            .transcript { display: grid; gap: 10px; margin-top: 18px; }
            .bubble { max-width: 94%; border-radius: 8px; padding: 12px 14px; font-size: 14px; }
            .bubble.agent { border: 1px solid var(--line); background: white; }
            .bubble.customer { justify-self: end; background: #e9f1f8; }
            .data-panel { background: white; }
            .table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 8px; }
            table { width: 100%; min-width: 540px; border-collapse: collapse; font-size: 14px; }
            th, td { border-bottom: 1px solid var(--line); padding: 12px 14px; text-align: left; vertical-align: top; }
            th { background: #f4f7f8; color: #465766; font-size: 12px; font-weight: 900; text-transform: uppercase; }
            tr:last-child td { border-bottom: 0; }
            .highlight-row td { background: #fff8e9; }

            .badge {
                display: inline-flex;
                border-radius: 999px;
                padding: 4px 8px;
                background: #eef2f5;
                color: #425363;
                font-size: 12px;
                font-weight: 850;
                white-space: nowrap;
            }

            .badge.blue { background: #e5f2ff; color: #1c5f99; }
            .badge.green { background: #e5f5eb; color: #24633d; }
            .badge.amber { background: #fff2d7; color: #7a4e08; }
            .data-note { margin: 14px 0 0; color: var(--muted); font-size: 14px; }
            .draft-editor.empty > * { visibility: hidden; }
             database-highlight { from { background: #bbefd5; } }
            #draft-body .highlighted-row > td { background: #e8f8ef; animation: database-highlight 1.2s ease-out; }
            #draft-body .highlighted-cell { background: #bbefd5; animation: database-highlight 1.2s ease-out; }
            .voice-stage { display: grid; height: 330px; place-items: center; gap: 16px; padding: 28px; border: 1px dashed #b8c7c3; border-radius: 8px; background: white; text-align: center; }
            .voice-orb { width: 132px; height: 132px; border-radius: 50%; background: #5c8eb8; box-shadow: 0 0 0 14px rgba(92, 142, 184, 0.14); transition: background 180ms ease, box-shadow 180ms ease; }
            .voice-demo[data-call-active="true"] .voice-orb { animation: breathe 2.8s ease-in-out infinite; }
            .voice-demo[data-call-state="ready"] .voice-orb { background: #5c8eb8; box-shadow: 0 0 0 14px rgba(92, 142, 184, 0.14); }
            .voice-demo[data-call-state="listening"] .voice-orb { background: #f4b400; box-shadow: 0 0 0 20px rgba(244, 180, 0, 0.2); }
            .voice-demo[data-call-state="agent"] .voice-orb { background: #287fc3; box-shadow: 0 0 0 20px rgba(40, 127, 195, 0.2); animation: speak 720ms ease-in-out infinite alternate; }
            .voice-demo[data-call-state="user"] .voice-orb { background: #00a854; box-shadow: 0 0 0 20px rgba(0, 168, 84, 0.2); animation: speak 720ms ease-in-out infinite alternate; }
            @keyframes breathe { 50% { transform: scale(1.04); } }
            @keyframes speak { to { transform: scale(1.14); } }
            .call-controls { display: flex; align-items: center; justify-content: center; gap: 12px; }
            .call-button { display: grid; place-items: center; border-radius: 50%; cursor: pointer; width: 68px; height: 68px; border: 0; background: #1a9b4a; color: white; box-shadow: 0 12px 22px rgba(26, 155, 74, 0.24); }
            .voice-demo[data-call-active="true"] .call-button { background: #ce3d43; box-shadow: 0 12px 22px rgba(206, 61, 67, 0.24); }
            .voice-demo[data-call-active="true"] .live-pill { background: #ce3d43; color: white; }
            .voice-demo[data-call-state="ready"] .live-pill { background: #e8f7ee; color: #25623e; }
            .voice-demo[data-call-state="connecting"] .live-pill { background: #ce3d43; color: white; }
            .voice-demo[data-call-state="listening"] .live-pill { background: #fff0bd; color: #765100; }
            .voice-demo[data-call-state="agent"] .live-pill { background: #287fc3; color: white; }
            .voice-demo[data-call-state="user"] .live-pill { background: #00a854; color: white; }
            .icon-hangup { display: none; }
            .voice-demo[data-call-active="true"] .icon-call { display: none; }
            .voice-demo[data-call-active="true"] .icon-hangup { display: block; }
            .tab[aria-disabled="true"] { cursor: not-allowed; opacity: 0.55; }
            .control-icon { width: 1.45em; height: 1.45em; fill: currentColor; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; }
            .call-button .control-icon { width: 1.65em; height: 1.65em; }
            .call-prompt, .call-error { max-width: 460px; margin: 0; color: var(--muted); font-size: 14px; }
            .call-prompt { min-height: 42px; }
            .call-error { color: #a7262c; }
            .draft-action { border: 0; background: none; color: var(--teal-dark); padding: 0; font: inherit; font-weight: 750; cursor: pointer; }
            .draft-action.delete { color: #a7262c; }
            .draft-row-actions { text-align: right; white-space: nowrap; }
            .icon-rail { width: 24px; padding: 6px; text-align: center; }
            .icon-rail .draft-action.icon { display: grid; margin: 0 auto 6px; }
            .icon-rail .draft-action.icon:last-child { margin-bottom: 0; }
            .draft-action.icon { display: inline-grid; place-items: center; width: 24px; height: 24px; opacity: 0; pointer-events: none; transition: opacity 120ms ease; }
            .draft-action.icon svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
            #draft-body tr:hover .draft-action.icon, #draft-body tr:focus-within .draft-action.icon { opacity: 1; pointer-events: auto; }
            @media (hover: none) { .draft-action.icon { opacity: 1; pointer-events: auto; } }
            .draft-actions { display: flex; gap: 12px; margin-top: 14px; }
            .draft-editor th { box-sizing: border-box; }
            #draft-head th:first-child { width: 92px; white-space: nowrap; }
            .draft-editor input, .draft-editor select, .draft-editor textarea { box-sizing: border-box; width: 100%; min-width: 0; border: 1px solid var(--line); border-radius: 4px; padding: 5px; font: inherit; }
            .draft-editor textarea { resize: vertical; }
            table.week-calendar { min-width: 500px; font-size: 11px; }
            .week-calendar th, .week-calendar td { height: 27px; padding: 3px 4px; text-align: center; vertical-align: middle; }
            .week-calendar th:first-child, table.week-calendar #draft-head th:first-child { width: 42px; white-space: nowrap; }
            .week-calendar .week-slot { overflow: hidden; color: transparent; text-overflow: ellipsis; white-space: nowrap; }
            .week-calendar .weekend { background: #f1f3f5; }
            .week-calendar .week-slot.busy { background: #fff0cf; color: #7a4e08; cursor: pointer; font-weight: 800; }
            .week-calendar .week-slot.draft-booking { background: #fff0cf; color: #7a4e08; }
            .week-calendar .week-slot.available-slot { background: #d8f2df; color: #1c6b3a; font-weight: 800; }
            .week-calendar .week-slot.selected-busy { background: #fbe3e4; color: #a7262c; outline: 2px solid #ce3d43; outline-offset: -2px; }
            .week-calendar .week-slot.busy:focus-visible { outline: 2px solid #ce3d43; outline-offset: -2px; }
            .sales-editor { display: grid; gap: 16px; }
            .sales-editor[hidden], .database-editor[hidden] { display: none; }
            .sales-selects { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 12px; }
            .sales-field { display: grid; gap: 6px; }
            .sales-field label, .sales-summary-label { margin: 0; color: #465766; font-size: 12px; font-weight: 900; text-transform: uppercase; }
            .sales-field select, .sales-prompt-summary { min-width: 0; border: 1px solid var(--line); border-radius: 8px; background: white; padding: 10px; }
            .sales-field select { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
            #sales-model-select { padding-right: 36px; }
            .sales-prompt-summary { margin: 0; color: #465766; line-height: 1.5; }
            @media (max-width: 680px) { .sales-selects { grid-template-columns: 1fr; } }