/* ===== FLOW CANVAS ===== */
.flow-canvas{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);min-height:400px;position:relative;overflow:hidden;background-image:radial-gradient(circle,var(--border) 1px,transparent 1px);background-size:20px 20px}
.flow-canvas::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(99,102,241,.04),transparent 50%,rgba(168,85,247,.04));pointer-events:none;z-index:0}
.flow-node{position:absolute;background:var(--glass-bg);border:2px solid var(--glass-border);border-radius:var(--radius-sm);padding:12px 16px;min-width:160px;box-shadow:var(--glass-shadow);cursor:pointer;transition:border-color .15s,box-shadow .15s;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:1}
.flow-node:hover{border-color:var(--accent)}
.flow-node-title{font-weight:600;font-size:13px;margin-bottom:4px}
.flow-node-type{font-size:11px;color:var(--text3)}
.flow-line{position:absolute;pointer-events:none}

/* ===== ENHANCED FLOW BUILDER ===== */
.flow-node.selected{border-color:var(--accent)!important;box-shadow:0 0 0 3px rgba(99,102,241,.2)}
.flow-node-priority{position:absolute;top:-8px;right:-8px;font-size:10px;font-weight:700;padding:2px 8px;border-radius:12px;border:2px solid var(--card);white-space:nowrap;z-index:2}
.priority-immediate{background:#dbeafe;color:#1d4ed8}
.priority-scheduled{background:var(--amber-bg);color:var(--amber)}
.priority-resource{background:#f0fdf4;color:#16a34a}
[data-theme="dark"] .priority-immediate{background:#172554;color:#60a5fa}
[data-theme="dark"] .priority-scheduled{background:#451a03;color:#fbbf24}
[data-theme="dark"] .priority-resource{background:#052e16;color:#4ade80}
.flow-node-gear{position:absolute;top:8px;right:8px;width:22px;height:22px;border-radius:50%;border:1px solid var(--border);background:var(--card);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:12px;color:var(--text3);opacity:0;transition:opacity .15s;z-index:2}
.flow-node:hover .flow-node-gear{opacity:1}
.flow-node-gear:hover{border-color:var(--accent);color:var(--accent)}
.flow-node-model{display:inline-block;padding:1px 6px;border-radius:8px;font-size:10px;font-weight:600;background:var(--accent-bg);color:var(--accent);margin-top:4px}
.flow-node-parallel{position:absolute;border:2px dashed var(--border);border-radius:var(--radius-sm);padding:12px;min-width:240px;background:var(--card);box-shadow:var(--shadow);cursor:pointer;transition:border-color .15s}
.flow-node-parallel:hover{border-color:var(--accent)}
.flow-node-parallel.selected{border-color:var(--accent)!important;box-shadow:0 0 0 3px rgba(99,102,241,.2)}
.flow-node-parallel-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.flow-node-parallel-header .flow-node-title{margin-bottom:0}
.parallel-count{display:inline-flex;align-items:center;padding:2px 8px;border-radius:12px;font-size:10px;font-weight:700;background:var(--accent-bg);color:var(--accent)}
.parallel-sub-node{background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:6px 10px;margin-bottom:4px}
.parallel-sub-node:last-child{margin-bottom:0}
.parallel-sub-node-title{font-size:11px;font-weight:600;color:var(--text)}
.parallel-sub-node-meta{font-size:10px;color:var(--text3)}

/* ===== SIGNALS DETAIL PANEL ===== */
.signals-detail-section{border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px;margin-bottom:12px}
.signals-detail-section-title{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--text3);font-weight:700;margin-bottom:8px}
.signals-detail-empty{text-align:center;padding:40px 16px;color:var(--text3)}
.signals-detail-empty svg{margin-bottom:8px}
.advanced-toggle{display:flex;align-items:center;justify-content:space-between;padding:6px 0;cursor:pointer;font-size:12px;color:var(--text2);font-weight:600;border:none;background:none;width:100%;margin-top:8px}
.advanced-toggle:hover{color:var(--accent)}
.advanced-toggle .adv-chev{font-size:10px;transition:transform .2s}
.advanced-body{display:none;margin-top:8px}
.advanced-body.open{display:block}
.schema-editor{width:100%;padding:8px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);color:var(--text);font-family:monospace;font-size:11px;resize:vertical;min-height:100px}
.schema-editor:focus{outline:none;border-color:var(--accent)}
.schema-preview{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px;font-family:monospace;font-size:11px;color:var(--text2);max-height:200px;overflow-y:auto;white-space:pre}
.schema-badge{display:inline-flex;align-items:center;font-size:10px;padding:1px 6px;border-radius:8px;background:#dbeafe;color:#1d4ed8;font-weight:600;margin-top:2px}
[data-theme="dark"] .schema-badge{background:#1e3a5f;color:#60a5fa}

/* ===== TEMPLATE SELECTOR BAR ===== */
.template-selector-bar{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:12px}
.template-selector-bar label{font-size:12px;font-weight:600;white-space:nowrap;color:var(--text2)}
.template-selector-bar select{padding:6px 10px;font-size:13px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--card);color:var(--text)}
.template-adapter-count{font-size:11px;color:var(--text3);margin-left:auto}
[data-theme="dark"] .template-selector-bar{background:var(--card);border-color:var(--border)}

/* ===== ADAPTER SEQUENCE LAYOUT ===== */
.adapter-sequence{display:flex;flex-direction:column;gap:0;padding:24px 40px}
.adapter-sequence-node{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--glass-bg);border:2px solid var(--glass-border);border-radius:var(--radius-sm);cursor:pointer;transition:border-color .15s,box-shadow .15s;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);position:relative}
.adapter-sequence-node:hover{border-color:var(--accent)}
.adapter-sequence-node.selected{border-color:var(--accent)!important;box-shadow:0 0 0 3px rgba(99,102,241,.2)}
.adapter-sequence-node .adapter-seq-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}
.adapter-seq-icon.stt{background:#dbeafe;color:#1d4ed8}
.adapter-seq-icon.llm{background:var(--accent-bg);color:var(--accent)}
.adapter-seq-icon.signal{background:rgba(34,197,94,.12);color:var(--green)}
.adapter-sequence-node .adapter-seq-info{flex:1;min-width:0}
.adapter-sequence-node .adapter-seq-name{font-size:13px;font-weight:600}
.adapter-sequence-node .adapter-seq-meta{font-size:11px;color:var(--text3)}
.adapter-sequence-node .adapter-seq-badges{display:flex;gap:4px;margin-top:4px}
.adapter-sequence-connector{display:flex;align-items:center;justify-content:center;padding:4px 0;padding-left:55px}
.adapter-sequence-connector svg{display:block}
.adapter-signals-group{border:2px dashed var(--border);border-radius:var(--radius-sm);padding:10px;margin:0}
.adapter-signals-group .signals-group-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;padding:0 6px}
.adapter-signals-group .signals-group-header span{font-size:12px;font-weight:600;color:var(--text2)}
.adapter-signals-group .signals-group-items{display:flex;flex-direction:column;gap:6px}
.adapter-signals-group .adapter-sequence-node{padding:8px 12px}
.adapter-add-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:10px;border:2px dashed var(--border);border-radius:var(--radius-sm);color:var(--text3);font-size:12px;font-weight:600;cursor:pointer;transition:border-color .15s,color .15s}
.adapter-add-btn:hover{border-color:var(--accent);color:var(--accent)}
.adapter-reads-from{font-size:10px;color:var(--text3);display:flex;align-items:center;gap:4px;margin-top:2px}
.adapter-reads-from svg{flex-shrink:0}
[data-theme="dark"] .adapter-seq-icon.stt{background:#172554;color:#60a5fa}
[data-theme="dark"] .adapter-seq-icon.signal{background:rgba(34,197,94,.15)}

/* ===== VERSION HISTORY ===== */
.version-item{display:flex;align-items:flex-start;gap:12px;padding:12px;border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:8px;transition:border-color .15s}
.version-item:hover{border-color:var(--accent)}
.version-item .version-meta{flex:1}
.version-item .version-label{font-weight:600;font-size:13px}
.version-item .version-date{font-size:11px;color:var(--text3);margin-top:2px}
.version-item .version-actions{display:flex;gap:6px;align-items:center}

/* ===== ACCURACY ALERT ===== */
.accuracy-alert{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:var(--radius-sm);background:var(--amber-bg);border:1px solid var(--amber);font-size:13px;margin-top:8px}
.accuracy-alert .accuracy-value{font-weight:700;color:var(--amber)}

/* ===== AUTH PAGES ===== */
body[data-page^="page-"]{height:auto;min-height:100vh;min-height:100dvh;overflow-y:auto}
body[data-page^="page-"]>div:first-child{width:100%}
.auth-wrapper{display:flex;align-items:center;justify-content:center;min-height:100vh;background:var(--bg);padding:24px}
.auth-card{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius);box-shadow:var(--glass-shadow-lg);padding:40px;width:100%;max-width:440px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.auth-card h1{font-size:28px;font-weight:700;margin-bottom:8px;text-align:center}
.auth-card .auth-subtitle{text-align:center;color:var(--text2);margin-bottom:24px;font-size:14px}
.auth-card .form-group{margin-bottom:16px}
.auth-card .form-group label{display:block;font-size:13px;font-weight:600;margin-bottom:6px;color:var(--text)}
.auth-card .form-group input[type="text"],.auth-card .form-group input[type="email"],.auth-card .form-group input[type="password"]{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);color:var(--text);font-size:14px;font-family:var(--font)}
.auth-card .form-group input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(99,102,241,.1)}
.auth-card .form-group .input-error{border-color:var(--red)!important}
.auth-card .form-group .error-text{color:var(--red);font-size:12px;margin-top:4px}
.auth-card .form-row{display:flex;gap:12px}
.auth-card .form-row .form-group{flex:1}
.auth-card .form-actions{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;font-size:13px}
.auth-card .btn-auth{width:100%;padding:12px;font-size:15px;font-weight:700;border-radius:var(--radius-sm)}
.auth-card .divider{text-align:center;color:var(--text3);font-size:13px;margin:20px 0;position:relative}
.auth-card .divider::before,.auth-card .divider::after{content:'';position:absolute;top:50%;width:calc(50% - 60px);height:1px;background:var(--border)}
.auth-card .divider::before{left:0}
.auth-card .divider::after{right:0}
.social-btns{display:flex;gap:10px;margin-bottom:20px}
.social-btns .btn-social{flex:1;padding:10px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--card);color:var(--text);font-size:13px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .15s}
.social-btns .btn-social:hover{border-color:var(--accent);color:var(--accent)}
.auth-card .auth-link{text-align:center;font-size:13px;color:var(--text2)}
.auth-card .auth-link a{color:var(--accent);font-weight:600}
.password-strength{height:4px;border-radius:2px;background:var(--border);margin-top:6px;overflow:hidden}
.password-strength .strength-fill{height:100%;border-radius:2px;transition:width .3s,background .3s}

/* ===== MFA ===== */
.mfa-code-inputs{display:flex;gap:8px;justify-content:center;margin:24px 0}
.mfa-code-inputs input{width:48px;height:56px;text-align:center;font-size:24px;font-weight:700;border:2px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);color:var(--text);font-family:var(--font);transition:border-color .15s}
.mfa-code-inputs input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(99,102,241,.1)}
.mfa-method-tabs{display:flex;gap:8px;justify-content:center;margin-bottom:24px}
.mfa-method-tab{padding:8px 16px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--card);color:var(--text2);font-size:12px;font-weight:600;cursor:pointer;transition:all .15s;display:flex;align-items:center;gap:6px}
.mfa-method-tab:hover{border-color:var(--accent);color:var(--accent)}
.mfa-method-tab.active{border-color:var(--accent);background:var(--accent-bg);color:var(--accent)}
.mfa-info{text-align:center;color:var(--text3);font-size:13px;margin-bottom:20px;line-height:1.5}
.mfa-links{display:flex;justify-content:center;gap:16px;margin-top:16px;font-size:13px}
.mfa-links a{color:var(--accent);font-weight:600}

/* ===== ONBOARDING ===== */
.onboarding-wrapper{display:flex;align-items:center;justify-content:center;min-height:100vh;background:var(--bg);padding:24px}
.onboarding-card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow-lg);padding:40px;width:100%;max-width:720px}
.onboarding-card h1{font-size:24px;font-weight:700;margin-bottom:8px}
.step-indicator{display:flex;align-items:center;justify-content:center;gap:0;margin-bottom:32px}
.step-circle{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;border:2px solid var(--border);color:var(--text3);background:var(--card);flex-shrink:0;transition:all .2s;cursor:pointer}
.step-circle.active{border-color:var(--accent);color:#fff;background:var(--accent)}
.step-circle.completed{border-color:var(--green);color:#fff;background:var(--green)}
.step-line{flex:1;height:2px;background:var(--border);max-width:60px}
.step-line.completed{background:var(--green)}
.onboarding-step{display:none}
.onboarding-step.active{display:block}
.onboarding-nav{display:flex;justify-content:space-between;margin-top:24px;padding-top:16px;border-top:1px solid var(--border)}
.drop-zone{border:2px dashed var(--border);border-radius:var(--radius);padding:40px;text-align:center;color:var(--text3);cursor:pointer;transition:all .2s;min-height:160px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.drop-zone:hover,.drop-zone.drag-over{border-color:var(--accent);background:var(--accent-bg)}
.drop-zone .drop-icon{font-size:32px;margin-bottom:8px}
.template-selector{display:grid;grid-template-columns:1fr 1fr;gap:16px;min-height:300px}
.template-list{border:1px solid var(--border);border-radius:var(--radius-sm);overflow-y:auto;max-height:300px}
.template-item{padding:10px 14px;border-bottom:1px solid var(--border);cursor:pointer;font-size:13px;display:flex;align-items:center;gap:8px}
.template-item:hover{background:var(--accent-bg)}
.template-item.selected{background:var(--accent-bg);color:var(--accent);font-weight:600}
.template-detail{border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px;overflow-y:auto;max-height:300px}

/* ===== ONBOARDING TYPE CARDS ===== */
.ob-type-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:600px;margin:24px auto}
.ob-type-card{border:2px solid var(--border);border-radius:var(--radius);padding:24px 16px;text-align:center;cursor:pointer;transition:all .2s}
.ob-type-card:hover{border-color:var(--accent);background:var(--accent-bg)}
.ob-type-card.selected{border-color:var(--accent);background:var(--accent-bg);box-shadow:0 0 0 3px rgba(99,102,241,.15)}
.ob-type-card .ob-type-icon{font-size:36px;margin-bottom:8px}
.ob-type-card .ob-type-name{font-weight:600;font-size:15px;margin-bottom:4px}
.ob-type-card .ob-type-desc{font-size:12px;color:var(--text2)}
.ob-skip-link{font-size:13px;color:var(--text3);cursor:pointer;text-decoration:underline;transition:color .15s}
.ob-skip-link:hover{color:var(--accent)}

/* ===== AUTH CONFIG TABS ===== */
.auth-config-tabs{display:flex;gap:0;border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden;margin-bottom:20px}
.auth-config-tab{flex:1;padding:10px;text-align:center;font-size:13px;font-weight:600;cursor:pointer;background:var(--card);color:var(--text2);border-right:1px solid var(--border);transition:all .15s}
.auth-config-tab:last-child{border-right:none}
.auth-config-tab.active{background:var(--accent);color:#fff}
.auth-tab-content{display:none}
.auth-tab-content.active{display:block}

/* ===== CALL DETAIL ===== */
.detail-header{display:flex;align-items:center;gap:16px;margin-bottom:20px}
.detail-header .back-btn{width:36px;height:36px;border-radius:50%;border:1px solid var(--border);background:var(--card);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text2);transition:all .15s;flex-shrink:0}
.detail-header .back-btn:hover{border-color:var(--accent);color:var(--accent)}
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:20px}
.info-item{padding:12px;background:var(--bg);border-radius:var(--radius-sm)}
.info-item .info-label{font-size:11px;color:var(--text3);text-transform:uppercase;margin-bottom:4px}
.info-item .info-value{font-size:14px;font-weight:600}
.adapter-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.adapter-card{border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px;background:var(--card)}
.adapter-card .adapter-name{font-weight:600;font-size:13px;margin-bottom:4px}
.adapter-card .adapter-status{font-size:11px;margin-bottom:8px}
.confidence-bar{height:6px;background:var(--border);border-radius:3px;margin-top:8px}
.confidence-fill{height:100%;border-radius:3px}
.chat-bubbles{max-height:400px;overflow-y:auto;padding:12px}
.chat-bubble{max-width:75%;padding:10px 14px;border-radius:12px;margin-bottom:8px;font-size:13px;line-height:1.5}
.chat-bubble.bot{background:var(--accent-bg);color:var(--text);border-bottom-left-radius:4px;margin-right:auto}
.chat-bubble.user{background:var(--bg);color:var(--text);border-bottom-right-radius:4px;margin-left:auto}
.chat-bubble .bubble-time{font-size:10px;color:var(--text3);margin-top:4px}
.extraction-panel{padding:12px;background:var(--bg);border-radius:var(--radius-sm)}
.extraction-item{padding:8px 0;border-bottom:1px solid var(--border);font-size:13px}
.extraction-item:last-child{border:none}
.extraction-label{font-size:11px;color:var(--text3);text-transform:uppercase}
.goal-checklist{margin-top:12px}
.goal-item{display:flex;align-items:center;gap:8px;padding:6px 0;font-size:13px}
.goal-item .goal-check{width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;flex-shrink:0}
.goal-item .goal-check.done{background:var(--green);color:#fff}
.goal-item .goal-check.pending{background:var(--border);color:var(--text3)}

/* ===== CALL DETAIL — LIFECYCLE TIMELINE ===== */
.lifecycle-timeline{display:flex;align-items:flex-start;gap:0;margin-bottom:24px;padding:16px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-sm);overflow-x:auto}
.lifecycle-step{display:flex;flex-direction:column;align-items:center;min-width:100px;position:relative}
.lifecycle-step .step-dot{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;border:2px solid var(--border);background:var(--bg);color:var(--text3);flex-shrink:0;position:relative;z-index:1}
.lifecycle-step.completed .step-dot{background:var(--green);border-color:var(--green);color:#fff}
.lifecycle-step.active .step-dot{background:var(--accent);border-color:var(--accent);color:#fff}
.lifecycle-step .step-label{font-size:12px;font-weight:600;margin-top:8px;white-space:nowrap}
.lifecycle-step .step-time{font-size:10px;color:var(--text3);margin-top:2px}
.lifecycle-connector{flex:1;height:2px;background:var(--border);margin-top:14px;min-width:32px}
.lifecycle-connector.completed{background:var(--green)}

/* ===== CALL DETAIL — SUMMARY & CLASSIFICATION ===== */
.summary-section,.classification-section,.signals-section{margin-bottom:24px}
.summary-section h4,.classification-section h4,.signals-section h4{font-size:13px;font-weight:600;text-transform:uppercase;color:var(--text3);margin-bottom:12px;letter-spacing:.5px}
.summary-card{border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px;background:var(--card)}
.summary-card .summary-title{font-size:13px;font-weight:600;margin-bottom:8px}
.summary-card p{font-size:13px;line-height:1.6;color:var(--text2);margin:0}
.structured-field{padding:8px 0;border-bottom:1px solid var(--border);font-size:13px}
.structured-field:last-child{border:none}
.structured-field .field-name{font-size:11px;text-transform:uppercase;color:var(--text3);margin-bottom:2px}
.structured-field .field-val{font-weight:500}
.topic-badge{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:var(--radius-sm);background:var(--accent-bg);font-size:15px;font-weight:600;color:var(--accent)}
.topic-badge .topic-classifier{font-size:11px;font-weight:400;color:var(--text3)}
.sentiment-badge{display:inline-flex;align-items:center;gap:6px;padding:10px 16px;border-radius:var(--radius-sm);font-size:15px;font-weight:600}
.sentiment-badge.positive{background:rgba(34,197,94,.12);color:var(--green)}
.sentiment-badge.negative{background:rgba(239,68,68,.12);color:var(--red)}
.sentiment-badge.neutral{background:var(--bg);color:var(--text3)}
.sentiment-badge.mixed{background:rgba(245,158,11,.12);color:var(--amber)}

/* ===== CALL DETAIL — SIGNAL CARDS ===== */
.signals-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.signal-card{padding:12px;border-radius:var(--radius-sm);border:1px solid var(--border);border-left:3px solid var(--border);background:var(--card);font-size:13px}
.signal-card .signal-name{font-weight:600;margin-bottom:4px}
.signal-card .signal-result{display:flex;align-items:center;gap:6px;margin-bottom:4px}
.signal-card .signal-desc{font-size:11px;color:var(--text3);line-height:1.4}
.signal-card.signal-pass{border-left-color:var(--green)}
.signal-card.signal-pass .signal-icon{color:var(--green)}
.signal-card.signal-fail{border-left-color:var(--red)}
.signal-card.signal-fail .signal-icon{color:var(--red)}
.signal-card.signal-unknown{border-left-color:var(--text3)}
.signal-card.signal-unknown .signal-icon{color:var(--text3)}

/* ===== USER SETTINGS ===== */
.settings-layout{display:grid;grid-template-columns:200px 1fr;gap:24px}
.settings-menu{border:1px solid var(--border);border-radius:var(--radius);background:var(--card);overflow:hidden;height:fit-content}
.settings-menu-item{padding:12px 16px;font-size:13px;cursor:pointer;border-bottom:1px solid var(--border);transition:all .15s}
.settings-menu-item:last-child{border:none}
.settings-menu-item:hover{background:var(--accent-bg)}
.settings-menu-item.active{background:var(--accent-bg);color:var(--accent);font-weight:600;border-left:3px solid var(--accent)}
.settings-panel{display:none}
.settings-panel.active{display:block}
.avatar-upload{width:80px;height:80px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:700;cursor:pointer;margin-bottom:12px;position:relative}
.avatar-upload:hover::after{content:'Edit';position:absolute;inset:0;border-radius:50%;background:rgba(0,0,0,.5);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px}
.danger-zone{border:1px solid var(--red);border-radius:var(--radius);padding:16px;margin-top:24px}
.danger-zone h3{color:var(--red);font-size:14px;margin-bottom:8px}

/* ===== LANDING PAGE ===== */
.landing-page{min-height:100vh;background:var(--bg)}
.landing-nav{display:flex;justify-content:space-between;align-items:center;padding:16px 40px;background:var(--card);border-bottom:1px solid var(--border)}
.landing-nav .logo-text{font-size:18px;font-weight:700;color:var(--accent)}
.landing-nav .nav-links{display:flex;gap:16px;align-items:center}
.hero-section{text-align:center;padding:80px 40px;max-width:800px;margin:0 auto}
.hero-section h1{font-size:42px;font-weight:800;line-height:1.2;margin-bottom:16px}
.hero-section .hero-subtitle{font-size:18px;color:var(--text2);margin-bottom:32px;line-height:1.6}
.hero-btns{display:flex;gap:12px;justify-content:center}
.features-section{padding:60px 40px;max-width:1000px;margin:0 auto}
.features-section h2{text-align:center;font-size:28px;margin-bottom:40px}
.cta-section{text-align:center;padding:60px 40px;background:var(--accent-bg)}
.cta-section h2{font-size:28px;margin-bottom:12px}
.cta-section p{color:var(--text2);margin-bottom:24px}

/* ===== SEARCH RESULTS ===== */
.search-results-layout{display:grid;grid-template-columns:200px 1fr;gap:24px}
.search-categories{display:flex;flex-direction:column;gap:2px}
.search-category-item{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;border-radius:var(--radius-sm);cursor:pointer;font-size:13px;color:var(--text2);transition:all .15s}
.search-category-item:hover{background:var(--accent-bg);color:var(--text)}
.search-category-item.active{background:var(--accent-bg);color:var(--accent);font-weight:600}
.search-category-item .cat-count{font-size:11px;color:var(--text3);background:var(--bg);padding:2px 8px;border-radius:10px}
.search-result-card{padding:16px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--card);cursor:pointer;transition:all .15s;margin-bottom:8px}
.search-result-card:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.search-result-card .result-title{font-weight:600;font-size:14px;margin-bottom:4px}
.search-result-card .result-context{font-size:13px;color:var(--text2);line-height:1.5}
.search-result-card .result-meta{font-size:11px;color:var(--text3);margin-top:6px;display:flex;gap:12px}
.search-result-card mark{background:var(--amber-bg);color:var(--text);border-radius:2px;padding:0 2px}

/* ===== DARK MODE — PAGE-SPECIFIC OVERRIDES ===== */
[data-theme="dark"] .search-result-card{background:var(--card);border-color:var(--border)}
[data-theme="dark"] .search-result-card mark{background:rgba(245,158,11,.2)}
[data-theme="dark"] .search-category-item .cat-count{background:var(--card)}
[data-theme="dark"] .ob-type-card{border-color:var(--border);background:var(--card)}
[data-theme="dark"] .ob-type-card:hover,[data-theme="dark"] .ob-type-card.selected{border-color:var(--accent);background:rgba(99,102,241,.1)}
[data-theme="dark"] .lifecycle-timeline{background:var(--card);border-color:var(--border)}
[data-theme="dark"] .lifecycle-step .step-dot{background:var(--bg);border-color:var(--border)}
[data-theme="dark"] .summary-card{background:var(--card);border-color:var(--border)}
[data-theme="dark"] .signal-card{background:var(--card);border-color:var(--border)}
[data-theme="dark"] .sentiment-badge.positive{background:rgba(34,197,94,.15)}
[data-theme="dark"] .sentiment-badge.negative{background:rgba(239,68,68,.15)}
[data-theme="dark"] .sentiment-badge.mixed{background:rgba(245,158,11,.15)}
[data-theme="dark"] .sentiment-badge.neutral{background:var(--card)}
[data-theme="dark"] .topic-badge{background:rgba(99,102,241,.15)}

/* ============================================================
   PASSWORD RESET PAGES
   ============================================================ */
.auth-success-msg{text-align:center;padding:24px}
.auth-success-msg .icon-circle{width:64px;height:64px;border-radius:50%;background:rgba(34,197,94,.12);color:var(--green);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;font-size:28px}
.auth-success-msg h3{margin-bottom:8px}
.auth-success-msg p{color:var(--text2);font-size:13px}

/* ============================================================
   MFA SETUP (User Settings Security Tab)
   ============================================================ */
.mfa-setup-card{border:1px solid var(--border);border-radius:var(--radius);padding:24px;max-width:480px}
.mfa-qr-placeholder{width:200px;height:200px;border:2px dashed var(--border);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;margin:16px auto;background:var(--bg);color:var(--text3);font-size:13px}
.mfa-backup-codes{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;font-family:monospace;font-size:13px;background:var(--bg);padding:16px;border-radius:var(--radius-sm)}
.mfa-backup-codes code{padding:4px 8px;background:var(--card);border-radius:4px;text-align:center}
.mfa-status-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:20px;font-size:11px;font-weight:600}
.mfa-status-badge.enabled{background:rgba(34,197,94,.12);color:var(--green)}
.mfa-status-badge.disabled{background:var(--bg);color:var(--text3)}

/* ============================================================
   PROJECT CREATION WIZARD (Multi-step Modal)
   ============================================================ */
.wizard-progress{display:flex;align-items:center;justify-content:center;gap:4px;padding:16px 24px;border-bottom:1px solid var(--border)}
.wizard-step-indicator{display:flex;align-items:center;gap:4px}
.wizard-step-dot{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;border:2px solid var(--border);color:var(--text3);background:var(--card);transition:all .2s}
.wizard-step-dot.active{border-color:var(--accent);background:var(--accent);color:#fff}
.wizard-step-dot.completed{border-color:var(--green);background:var(--green);color:#fff}
.wizard-step-label{font-size:11px;color:var(--text3);display:none}
@media(min-width:768px){.wizard-step-label{display:block}}
.wizard-step-connector{width:32px;height:2px;background:var(--border)}
.wizard-step-connector.completed{background:var(--green)}
.wizard-body{padding:24px;min-height:320px}
.wizard-step-panel{display:none}
.wizard-step-panel.active{display:block}
.wizard-footer{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;border-top:1px solid var(--border)}
.template-card{border:2px solid var(--border);border-radius:var(--radius-sm);padding:16px;cursor:pointer;transition:all .15s}
.template-card:hover{border-color:var(--accent);background:var(--accent-bg)}
.template-card.selected{border-color:var(--accent);background:var(--accent-bg);box-shadow:0 0 0 3px rgba(99,102,241,.15)}
.template-card .template-card-title{font-weight:600;font-size:14px;margin-bottom:4px}
.template-card .template-card-meta{font-size:11px;color:var(--text3)}

/* ============================================================
   AUDIO UPLOAD (Drag-Drop Zone)
   ============================================================ */
.upload-zone{border:2px dashed var(--border);border-radius:var(--radius);padding:32px;text-align:center;cursor:pointer;transition:all .2s;background:var(--card)}
.upload-zone:hover,.upload-zone.drag-over{border-color:var(--accent);background:var(--accent-bg)}
.upload-zone .upload-icon{font-size:40px;color:var(--text3);margin-bottom:12px}
.upload-zone .upload-text{font-size:13px;color:var(--text2)}
.upload-zone .upload-text strong{color:var(--accent)}
.upload-zone .upload-hint{font-size:11px;color:var(--text3);margin-top:8px}
.upload-file-list{margin-top:16px}
.upload-file-item{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:var(--bg);border-radius:var(--radius-sm);margin-bottom:8px;font-size:13px}
.upload-file-item .file-info{display:flex;align-items:center;gap:8px}
.upload-file-item .file-size{color:var(--text3);font-size:11px}
.upload-file-item .file-remove{color:var(--text3);cursor:pointer;background:none;border:none;font-size:16px}
.upload-file-item .file-remove:hover{color:var(--red)}

/* ============================================================
   AUDIO PLAYER (Call Detail Transcript Tab)
   ============================================================ */
.audio-player-bar{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--bg);border-radius:var(--radius-sm);margin-bottom:16px}
.audio-player-bar .play-btn{width:36px;height:36px;border-radius:50%;background:var(--accent);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}
.audio-player-bar .play-btn:hover{opacity:.9}
.audio-player-bar .audio-progress{flex:1;display:flex;flex-direction:column;gap:4px}
.audio-player-bar .audio-track{width:100%;height:4px;background:var(--border);border-radius:2px;position:relative;cursor:pointer}
.audio-player-bar .audio-track-fill{position:absolute;top:0;left:0;height:100%;width:35%;background:var(--accent);border-radius:2px}
.audio-player-bar .audio-times{display:flex;justify-content:space-between;font-size:11px;color:var(--text3)}
.audio-player-bar .audio-speed{font-size:11px;padding:4px 8px;border:1px solid var(--border);border-radius:4px;background:var(--card);cursor:pointer;color:var(--text2)}
.audio-player-bar .audio-volume{display:flex;align-items:center;gap:4px;color:var(--text3);font-size:16px}

/* ============================================================
   DARK MODE — NEW COMPONENT OVERRIDES
   ============================================================ */
[data-theme="dark"] .upload-zone:hover,[data-theme="dark"] .upload-zone.drag-over{background:rgba(99,102,241,.1)}
[data-theme="dark"] .mfa-qr-placeholder{background:var(--card)}
[data-theme="dark"] .template-card{background:var(--card);border-color:var(--border)}
[data-theme="dark"] .template-card:hover,[data-theme="dark"] .template-card.selected{border-color:var(--accent);background:rgba(99,102,241,.1)}
[data-theme="dark"] .audio-player-bar{background:var(--card)}
[data-theme="dark"] .mfa-backup-codes{background:var(--card)}
[data-theme="dark"] .mfa-backup-codes code{background:var(--bg)}

/* ============================================================
   TRAINING SAMPLES — Recording Interface
   ============================================================ */
.sentence-display{padding:32px 24px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);font-family:Georgia,'Times New Roman',serif;font-size:22px;line-height:1.7;color:var(--text);text-align:center;min-height:120px;display:flex;align-items:center;justify-content:center;margin-bottom:16px}
[data-theme="dark"] .sentence-display{background:var(--card);border-color:var(--border)}
.sentence-display .term-warning{background:var(--amber-bg);color:var(--amber);padding:1px 6px;border-radius:4px;font-size:18px;font-weight:600;border:1px solid rgba(245,158,11,.3)}
[data-theme="dark"] .sentence-display .term-warning{background:rgba(245,158,11,.15);border-color:rgba(245,158,11,.2)}

.record-btn{width:64px;height:64px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:24px;transition:all .2s;color:#fff}
.record-btn.idle{background:var(--green)}
.record-btn.idle:hover{background:#059669;box-shadow:0 0 0 4px rgba(16,185,129,.2)}
.record-btn.recording{background:var(--red);animation:record-pulse 1.5s infinite}
.record-btn.recording:hover{background:#dc2626}
.record-btn.preview{background:var(--amber)}
.record-btn.preview:hover{background:#d97706}
@keyframes record-pulse{0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,.4)}50%{box-shadow:0 0 0 12px rgba(239,68,68,0)}}

.waveform-container{width:100%;height:64px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}
[data-theme="dark"] .waveform-container{background:var(--card);border-color:var(--border)}
.waveform-bars{display:flex;align-items:center;gap:2px;height:100%;padding:8px 12px}
.waveform-bars .bar{width:3px;border-radius:2px;background:var(--accent);transition:height .1s}
.waveform-bars.recording .bar{animation:wave-bounce .6s ease-in-out infinite alternate;animation-delay:calc(var(--i) * 0.05s)}
@keyframes wave-bounce{0%{height:20%}100%{height:80%}}

.recording-controls{display:flex;align-items:center;gap:12px;justify-content:center;margin:16px 0}
.session-progress{font-size:13px;color:var(--text2);display:flex;align-items:center;gap:8px}
.session-progress strong{color:var(--accent)}

.session-stats{display:flex;flex-direction:column;gap:12px}
.stat-item{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--border)}
.stat-item:last-child{border:none}
.stat-item .stat-label{font-size:12px;color:var(--text3);text-transform:uppercase;letter-spacing:.5px}
.stat-item .stat-value{font-size:18px;font-weight:700}

/* ============================================================
   TRAINING SAMPLES — Sample Review
   ============================================================ */
.filter-bar{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:16px;flex-wrap:wrap}
[data-theme="dark"] .filter-bar{background:var(--card);border-color:var(--border)}
.filter-bar select{padding:6px 10px;font-size:12px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--card);color:var(--text)}
.duration-summary{display:flex;gap:16px;font-size:13px;color:var(--text2);margin-bottom:16px;flex-wrap:wrap}
.duration-summary span{display:flex;align-items:center;gap:4px}
.duration-summary strong{color:var(--text);font-weight:600}

/* ============================================================
   WER DIFF — Word Error Rate Comparison
   ============================================================ */
.wer-diff{font-size:14px;line-height:1.8;padding:12px;background:var(--bg);border-radius:var(--radius-sm);border:1px solid var(--border)}
[data-theme="dark"] .wer-diff{background:var(--card)}
.wer-match{color:var(--green)}
.wer-mismatch{background:var(--red-bg);color:var(--red);padding:1px 4px;border-radius:3px;text-decoration:line-through}
.wer-insertion{background:var(--green-bg);color:var(--green);padding:1px 4px;border-radius:3px}

/* ============================================================
   DATASET BUILDER
   ============================================================ */
.split-bar{display:flex;height:24px;border-radius:var(--radius-sm);overflow:hidden;margin-bottom:8px}
.split-bar .split-segment{display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;color:#fff;transition:width .3s}
.split-bar .split-train{background:var(--accent)}
.split-bar .split-val{background:var(--amber)}
.split-bar .split-test{background:var(--green)}

.domain-bar{margin-bottom:8px}
.domain-bar-row{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.domain-bar-label{font-size:12px;color:var(--text2);min-width:80px}
.domain-bar-track{flex:1;height:20px;background:var(--bg);border-radius:4px;overflow:hidden}
[data-theme="dark"] .domain-bar-track{background:rgba(255,255,255,.05)}
.domain-bar-fill{height:100%;border-radius:4px;display:flex;align-items:center;padding-left:8px;font-size:11px;font-weight:600;color:#fff}
.domain-bar-pct{font-size:12px;color:var(--text3);min-width:36px;text-align:right}

/* ============================================================
   FINE-TUNE — Training Curve & Progress
   ============================================================ */
.training-curve{width:100%;height:280px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);position:relative;overflow:hidden;margin-bottom:16px}
[data-theme="dark"] .training-curve{background:var(--card);border-color:var(--border)}

.progress-epoch{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.progress-epoch .epoch-bar{flex:1;height:10px;background:var(--border);border-radius:5px;overflow:hidden}
.progress-epoch .epoch-fill{height:100%;background:var(--accent);border-radius:5px;transition:width .3s}
.progress-epoch .epoch-text{font-size:13px;font-weight:600;white-space:nowrap}

.log-output{background:#0f172a;color:#a5b4fc;font-family:'Menlo','Consolas',monospace;font-size:12px;padding:12px;border-radius:var(--radius-sm);max-height:180px;overflow-y:auto;line-height:1.6}
.log-output .log-time{color:#64748b}
.log-output .log-info{color:#38bdf8}
.log-output .log-warn{color:#fbbf24}
.log-output .log-ok{color:#4ade80}

/* ============================================================
   TRANSCRIBER EVAL — Comparison Table
   ============================================================ */
tr.eval-improved td{background:rgba(16,185,129,.06)}
tr.eval-regressed td{background:rgba(239,68,68,.06)}
[data-theme="dark"] tr.eval-improved td{background:rgba(16,185,129,.08)}
[data-theme="dark"] tr.eval-regressed td{background:rgba(239,68,68,.08)}

/* ============================================================
   TRANSCRIBER MODELS — Card Grid
   ============================================================ */
.model-card{position:relative;transition:all .2s}
.model-card:hover{border-color:var(--accent);box-shadow:var(--shadow-lg)}
.model-card.active-model{border-left:4px solid var(--green)}
.model-card .model-name{font-size:16px;font-weight:700;margin-bottom:4px}
.model-card .model-meta{font-size:12px;color:var(--text3);margin-bottom:12px}
.model-card .model-stat{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid var(--border);font-size:13px}
.model-card .model-stat:last-child{border:none}
.model-card .model-actions{display:flex;gap:6px;margin-top:12px}

/* ============================================================
   SUPER-ADMIN DASHBOARD
   ============================================================ */
.admin-layout{display:flex;height:100vh;overflow:hidden}
.admin-sidebar{width:220px;background:var(--sidebar-glass);color:var(--sidebar-text);display:flex;flex-direction:column;flex-shrink:0;transition:width .2s;overflow:hidden;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.admin-sidebar.collapsed{width:var(--sidebar-collapsed)}
.admin-sidebar .sidebar-header{padding:16px;display:flex;align-items:center;gap:12px;border-bottom:1px solid rgba(255,255,255,.08);min-height:60px}
.admin-sidebar .sidebar-header .logo{width:36px;height:36px;border-radius:var(--radius-sm);flex-shrink:0;object-fit:contain}
.admin-sidebar .sidebar-header .ws-info{overflow:hidden;white-space:nowrap}
.admin-sidebar .sidebar-header .ws-name{color:#f1f5f9;font-weight:600;font-size:13px}
.admin-sidebar .sidebar-header .ws-label{font-size:11px;color:var(--sidebar-text)}
.admin-sidebar.collapsed .ws-info{display:none}
.admin-nav{flex:1;padding:12px 8px;display:flex;flex-direction:column;gap:2px}
.admin-nav-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--radius-sm);cursor:pointer;transition:all .15s;color:var(--sidebar-text);font-size:13px;font-weight:500;white-space:nowrap;border:none;background:none;width:100%;text-align:left}
.admin-nav-item:hover{background:var(--sidebar-hover);color:#e2e8f0}
.admin-nav-item.active{background:rgba(99,102,241,.15);color:#a5b4fc}
.admin-nav-item .nav-icon{width:20px;text-align:center;flex-shrink:0;font-size:15px}
.admin-sidebar.collapsed .admin-nav-item span:not(.nav-icon){display:none}
.admin-sidebar.collapsed .admin-nav-item{justify-content:center;padding:10px 8px}
.admin-sidebar-footer{margin-top:auto;padding:12px;border-top:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;gap:4px}
.admin-sidebar-footer a,.admin-sidebar-footer button{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:var(--radius-sm);cursor:pointer;color:var(--sidebar-text);font-size:13px;width:100%;border:none;background:none;text-decoration:none;transition:all .15s}
.admin-sidebar-footer a:hover,.admin-sidebar-footer button:hover{background:var(--sidebar-hover);color:#e2e8f0}
.admin-sidebar.collapsed .admin-sidebar-footer span{display:none}
.admin-sidebar.collapsed .admin-sidebar-footer a,.admin-sidebar.collapsed .admin-sidebar-footer button{justify-content:center}
.admin-content{flex:1;overflow-y:auto;padding:32px;background:var(--bg)}
.admin-section{display:none}
.admin-section.active{display:block}

.service-status-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--border)}
.service-status-row:last-child{border:none}
.service-status-row .service-name{flex:1;font-size:13px;font-weight:600}
.service-status-row .service-metric{font-size:12px;color:var(--text2);min-width:80px;text-align:right}

.revenue-bar{margin-bottom:12px}
.revenue-bar-label{display:flex;justify-content:space-between;align-items:center;font-size:13px;margin-bottom:6px}
.revenue-bar-label .revenue-plan{font-weight:600}
.revenue-bar-label .revenue-amount{color:var(--text2)}
.revenue-bar-track{height:24px;background:var(--bg);border-radius:var(--radius-sm);overflow:hidden}
[data-theme="dark"] .revenue-bar-track{background:rgba(255,255,255,.05)}
.revenue-bar-fill{height:100%;border-radius:var(--radius-sm);display:flex;align-items:center;padding-left:8px;font-size:11px;font-weight:600;color:#fff;transition:width .3s}

.feature-flag-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--border)}
.feature-flag-row:last-child{border:none}
.feature-flag-row .flag-info{flex:1}
.feature-flag-row .flag-name{font-size:13px;font-weight:600}
.feature-flag-row .flag-desc{font-size:12px;color:var(--text3)}

[data-theme="dark"] .service-status-row{border-color:var(--border)}
[data-theme="dark"] .feature-flag-row{border-color:var(--border)}

/* ============================================================
   RAG DOCUMENTS — Knowledge Base Config & Playground
   ============================================================ */
.rag-kb-card{position:relative}
.rag-kb-card .rag-config-toggle{position:absolute;top:16px;right:16px;width:28px;height:28px;border-radius:50%;border:1px solid var(--border);background:var(--card);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;color:var(--text3);transition:all .15s;z-index:1}
.rag-kb-card .rag-config-toggle:hover{border-color:var(--accent);color:var(--accent)}
.rag-config-panel{display:none;margin-top:12px;padding:12px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm)}
.rag-config-panel.open{display:block}
.rag-collection-info{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.rag-collection-info div{font-size:12px}
.rag-collection-info div span{display:block;font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.3px}
.rag-collection-info div strong{font-size:13px}

/* RAG Playground — Chunks */
.rag-chunk-card{padding:12px;border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:8px;background:var(--card);transition:border-color .15s}
.rag-chunk-card:hover{border-color:var(--accent)}
.rag-chunk-card:last-child{margin-bottom:0}
.rag-chunk-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.rag-chunk-score{font-size:18px;font-weight:700;color:var(--accent)}
.rag-chunk-source{font-size:11px;color:var(--text3)}
.rag-chunk-text{font-size:12px;color:var(--text2);line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.rag-chunk-badges{display:flex;gap:4px;margin-top:6px}

/* RAG Match Type Badges */
.rag-match-badge{display:inline-flex;align-items:center;padding:1px 6px;border-radius:8px;font-size:10px;font-weight:600}
.rag-match-dense{background:#dbeafe;color:#1d4ed8}
.rag-match-sparse{background:#fae8ff;color:#a21caf}
.rag-match-hype{background:#fef3c7;color:#92400e}
[data-theme="dark"] .rag-match-dense{background:#172554;color:#60a5fa}
[data-theme="dark"] .rag-match-sparse{background:#3b0764;color:#d946ef}
[data-theme="dark"] .rag-match-hype{background:#451a03;color:#fbbf24}

/* RAG Cache Badge */
.rag-cache-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600}
.rag-cache-hit{background:var(--green-bg);color:var(--green)}
.rag-cache-miss{background:var(--bg);color:var(--text3);border:1px solid var(--border)}
[data-theme="dark"] .rag-cache-miss{background:var(--card)}

/* RAG Approval Pipeline */
.rag-approval-pipeline{display:flex;align-items:flex-start;gap:0;padding:12px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);margin-top:12px;overflow-x:auto}
.rag-approval-step{display:flex;flex-direction:column;align-items:center;min-width:90px}
.rag-approval-step .step-dot{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;border:2px solid var(--border);background:var(--card);color:var(--text3);flex-shrink:0}
.rag-approval-step.completed .step-dot{background:var(--green);border-color:var(--green);color:#fff}
.rag-approval-step.active .step-dot{background:var(--accent);border-color:var(--accent);color:#fff}
.rag-approval-step .step-label{font-size:11px;font-weight:600;margin-top:6px;white-space:nowrap;text-align:center}
.rag-approval-connector{flex:1;height:2px;background:var(--border);margin-top:14px;min-width:24px}
.rag-approval-connector.completed{background:var(--green)}

/* RAG Error States */
.rag-error-state{padding:12px;border-radius:var(--radius-sm);font-size:13px;line-height:1.5;margin-bottom:8px}
.rag-error-state:last-child{margin-bottom:0}
.rag-error-knowledge{background:var(--amber-bg);border:1px solid var(--amber);color:var(--text)}
.rag-error-clarify{background:var(--blue-bg);border:1px solid var(--blue);color:var(--text)}
.rag-error-state .error-code{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}
.rag-error-knowledge .error-code{color:var(--amber)}
.rag-error-clarify .error-code{color:var(--blue)}

/* RAG Audio Status */
.rag-audio-status{display:flex;align-items:center;gap:6px;font-size:13px}
.rag-audio-status .audio-stat{font-weight:600;color:var(--accent)}

/* RAG Dark Mode Overrides */
[data-theme="dark"] .rag-config-panel{background:var(--card);border-color:var(--border)}
[data-theme="dark"] .rag-chunk-card{background:var(--card);border-color:var(--border)}
[data-theme="dark"] .rag-approval-pipeline{background:var(--card);border-color:var(--border)}
[data-theme="dark"] .rag-approval-step .step-dot{background:var(--bg);border-color:var(--border)}
[data-theme="dark"] .rag-error-knowledge{background:rgba(245,158,11,.1);border-color:rgba(245,158,11,.3)}
[data-theme="dark"] .rag-error-clarify{background:rgba(59,130,246,.1);border-color:rgba(59,130,246,.3)}
[data-theme="dark"] .rag-audio-status{background:var(--card);border-color:var(--border)}

/* RAG Chunk Preview Modal */
.chunk-preview-list{max-height:400px;overflow-y:auto}
.chunk-preview-item{padding:12px;border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:8px;background:var(--bg)}
.chunk-preview-item:last-child{margin-bottom:0}
.chunk-preview-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.chunk-preview-pos{font-size:11px;font-weight:600;color:var(--text3)}
.chunk-preview-text{font-size:12px;line-height:1.6;color:var(--text2)}
.chunk-preview-meta{display:flex;gap:12px;margin-top:8px;font-size:11px;color:var(--text3)}
[data-theme="dark"] .chunk-preview-item{background:var(--card);border-color:var(--border)}

/* ============================================================
   VOICEBOT FLOW — Node Palette & Step Config
   ============================================================ */
.vb-node-palette{display:flex;align-items:center;gap:8px;padding:10px 16px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:12px;flex-wrap:wrap}
.vb-palette-btn{padding:5px 10px;border:2px solid var(--border);border-radius:var(--radius-sm);background:var(--card);color:var(--text);font-size:11px;font-weight:600;cursor:pointer;transition:all .15s;white-space:nowrap;display:inline-flex;align-items:center;gap:4px}
.vb-palette-btn:hover{border-color:var(--accent);background:var(--accent-bg);color:var(--accent)}

.vb-step-config{border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px;margin-bottom:12px;background:var(--bg)}
.vb-step-config .config-title{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--text3);font-weight:700;margin-bottom:10px}

.vb-condition-row{display:flex;align-items:center;gap:8px;padding:7px 10px;border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:6px;background:var(--card);font-size:12px}
.vb-condition-row .cond-label{font-weight:600;min-width:90px;color:var(--text)}
.vb-condition-row .cond-arrow{color:var(--text3);font-size:14px;flex-shrink:0}
.vb-condition-row .cond-target{color:var(--accent);font-weight:500}

.vb-slot-row{display:flex;align-items:center;gap:8px;padding:7px 10px;border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:6px;background:var(--card);font-size:12px}
.vb-slot-row .slot-name{font-weight:600;flex:1}
.vb-slot-row .slot-type{color:var(--text3);font-size:11px}
.vb-slot-row .slot-required{color:var(--green);font-size:11px;font-weight:600}

.vb-topic-chain{padding:10px 12px;background:var(--bg);border-radius:var(--radius-sm);margin-top:6px}
.vb-chain-step{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:12px}
.vb-chain-step .chain-num{width:20px;height:20px;border-radius:50%;background:var(--accent-bg);color:var(--accent);font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.vb-chain-step .chain-arrow{color:var(--text3);font-size:10px;margin-left:auto;flex-shrink:0}

.vb-step-badge{display:inline-flex;align-items:center;gap:3px;padding:2px 7px;border-radius:10px;font-size:10px;font-weight:600;white-space:nowrap}
.vb-step-badge.badge-audio{background:var(--green-bg);color:var(--green)}
.vb-step-badge.badge-decision{background:var(--amber-bg);color:var(--amber)}
.vb-step-badge.badge-extract{background:#f3e8ff;color:#7c3aed}
.vb-step-badge.badge-api{background:var(--blue-bg);color:var(--blue)}
.vb-step-badge.badge-adapter{background:var(--accent-bg);color:var(--accent)}
.vb-step-badge.badge-system{background:var(--bg);color:var(--text3);border:1px solid var(--border)}

/* VoiceBot Flow — Dark Mode Overrides */
[data-theme="dark"] .vb-node-palette{background:var(--card);border-color:var(--border)}
[data-theme="dark"] .vb-palette-btn{background:var(--card);border-color:var(--border);color:var(--text)}
[data-theme="dark"] .vb-palette-btn:hover{border-color:var(--accent);background:rgba(99,102,241,.1)}
[data-theme="dark"] .vb-step-config{background:var(--card);border-color:var(--border)}
[data-theme="dark"] .vb-condition-row{background:var(--bg);border-color:var(--border)}
[data-theme="dark"] .vb-slot-row{background:var(--bg);border-color:var(--border)}
[data-theme="dark"] .vb-topic-chain{background:var(--card)}
[data-theme="dark"] .vb-step-badge.badge-extract{background:#2e1065;color:#c084fc}
[data-theme="dark"] .vb-step-badge.badge-system{background:var(--card);border-color:var(--border)}

/* ============================================================
   FINE-TUNE — LoRA Config & Post-Training Pipeline
   ============================================================ */
.lora-config{padding:12px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);margin-top:12px}

.pipeline-stages{display:flex;flex-direction:column;gap:0}
.pipeline-stage{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--radius-sm)}
.pipeline-stage:hover{background:var(--bg)}
.pipeline-dot{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;border:2px solid var(--border);background:var(--card);color:var(--text3);flex-shrink:0}
.pipeline-stage.completed .pipeline-dot{background:var(--green);border-color:var(--green);color:#fff}
.pipeline-stage.active .pipeline-dot{background:var(--accent);border-color:var(--accent);color:#fff}
.pipeline-info{flex:1;min-width:0}
.pipeline-name{font-size:13px;font-weight:600}
.pipeline-meta{font-size:11px;color:var(--text3);margin-top:2px}
.pipeline-connector{width:2px;height:16px;background:var(--border);margin-left:25px}
.pipeline-connector.completed{background:var(--green)}

/* Fine-tune Dark Mode */
[data-theme="dark"] .lora-config{background:var(--card);border-color:var(--border)}
[data-theme="dark"] .pipeline-stage:hover{background:var(--card)}
[data-theme="dark"] .pipeline-dot{background:var(--bg);border-color:var(--border)}

/* ============================================================
   TRANSCRIBER MODELS — WER Benchmarking
   ============================================================ */
.benchmark-bars{display:flex;flex-direction:column;gap:8px}
.benchmark-bar-row{display:flex;align-items:center;gap:10px}
.benchmark-bar-label{font-size:12px;font-weight:600;min-width:60px;text-align:right;color:var(--text2)}
.benchmark-bar-track{flex:1;height:28px;background:var(--bg);border-radius:var(--radius-sm);overflow:hidden}
.benchmark-bar-fill{height:100%;border-radius:var(--radius-sm);display:flex;align-items:center;padding-left:10px;font-size:11px;font-weight:600;color:#fff;transition:width .3s}
[data-theme="dark"] .benchmark-bar-track{background:rgba(255,255,255,.05)}

/* ============================================================
   DATA MASKING — PII Badges & Pipeline
   ============================================================ */
.pii-badge{display:inline-flex;align-items:center;padding:1px 6px;border-radius:8px;font-size:11px;font-weight:700;font-family:monospace;white-space:nowrap;vertical-align:middle}
.pii-badge-name{background:#dbeafe;color:#1d4ed8}
.pii-badge-phone{background:var(--green-bg);color:var(--green)}
.pii-badge-email{background:#f3e8ff;color:#7c3aed}
.pii-badge-address{background:var(--amber-bg);color:var(--amber)}
.pii-badge-id{background:var(--red-bg);color:var(--red)}
.pii-badge-dob{background:var(--bg);color:var(--text3);border:1px solid var(--border)}

[data-theme="dark"] .pii-badge-name{background:#172554;color:#60a5fa}
[data-theme="dark"] .pii-badge-email{background:#2e1065;color:#c084fc}
[data-theme="dark"] .pii-badge-dob{background:var(--card);border-color:var(--border)}

/* Masking Pipeline — horizontal step visualization */
.masking-pipeline{display:flex;align-items:flex-start;gap:0;padding:12px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);overflow-x:auto}
.masking-pipeline-step{display:flex;flex-direction:column;align-items:center;min-width:90px}
.masking-step-dot{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;border:2px solid var(--border);background:var(--card);color:var(--text3);flex-shrink:0}
.masking-pipeline-step.completed .masking-step-dot{background:var(--green);border-color:var(--green);color:#fff}
.masking-pipeline-step.active .masking-step-dot{background:var(--accent);border-color:var(--accent);color:#fff}
.masking-step-label{font-size:11px;font-weight:600;margin-top:6px;white-space:nowrap;text-align:center}
.masking-step-time{font-size:10px;color:var(--text3);margin-top:2px}
.masking-pipeline-connector{flex:1;height:2px;background:var(--border);margin-top:14px;min-width:24px}
.masking-pipeline-connector.completed{background:var(--green)}

/* Mask Output Container */
.mask-output{color:var(--text2)}

/* Masking Dark Mode */
[data-theme="dark"] .masking-pipeline{background:var(--card);border-color:var(--border)}
[data-theme="dark"] .masking-step-dot{background:var(--bg);border-color:var(--border)}

/* ============================================================
   DATASET QUALITY
   ============================================================ */
.quality-gap-alert{padding:10px 12px;background:var(--amber-bg);border:1px solid var(--amber);border-radius:var(--radius-sm);font-size:12px;margin-top:12px}
[data-theme="dark"] .quality-gap-alert{background:rgba(245,158,11,.1);border-color:rgba(245,158,11,.3)}

/* ============================================================
   EXECUTION DETAIL
   ============================================================ */
.exec-result-match{color:var(--green);font-weight:700}
.exec-result-miss{color:var(--red);font-weight:700}

/* ============================================================
   REPORTING — Charts & KPI
   ============================================================ */
.kpi-card{text-align:center;padding:20px}
.kpi-value{font-size:28px;font-weight:700;color:var(--text)}
.kpi-change{font-size:12px;font-weight:600;margin-top:4px}
.kpi-change.up{color:var(--green)}
.kpi-change.down{color:var(--red)}
.kpi-change.neutral{color:var(--text3)}
.sla-status-on-track{background:var(--green-bg);color:var(--green)}
.sla-status-at-risk{background:var(--amber-bg);color:var(--amber)}
.sla-status-violated{background:var(--red-bg);color:var(--red)}
.alert-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.usage-bar{height:8px;background:var(--bg);border-radius:4px;overflow:hidden}
.usage-bar-fill{height:100%;border-radius:4px;transition:width .3s}
/* dark mode */
[data-theme="dark"] .kpi-card{background:var(--card)}
[data-theme="dark"] .usage-bar{background:rgba(255,255,255,.05)}

/* ============================================================
   QUESTIONNAIRE PAGE
   ============================================================ */
.q-template-card{transition:all .2s}
.q-template-card:hover{border-color:var(--accent);box-shadow:var(--shadow-lg);transform:translateY(-2px)}
.q-question-preview{padding:12px;border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:8px;background:var(--bg)}
.q-question-preview:last-child{margin-bottom:0}
.q-question-label{font-size:13px;font-weight:600;margin-bottom:6px}
.q-question-options{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--text2);padding-left:16px}
.q-question-options .q-option{display:flex;align-items:center;gap:6px}
.q-question-options .q-option::before{content:'';width:14px;height:14px;border:2px solid var(--border);border-radius:50%;flex-shrink:0}
.q-section-header{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text3);margin:16px 0 8px;padding-bottom:4px;border-bottom:1px solid var(--border)}
.q-section-header:first-child{margin-top:0}
[data-theme="dark"] .q-question-preview{background:var(--card);border-color:var(--border)}
[data-theme="dark"] .q-template-card:hover{border-color:var(--accent)}

/* ============================================================
   ONBOARDING — Business Intake Step
   ============================================================ */
.ob-team-size-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.ob-team-card{border:2px solid var(--border);border-radius:var(--radius-sm);padding:12px 8px;text-align:center;cursor:pointer;transition:all .2s}
.ob-team-card:hover{border-color:var(--accent);background:var(--accent-bg)}
.ob-team-card.selected{border-color:var(--accent);background:var(--accent-bg);box-shadow:0 0 0 3px rgba(99,102,241,.15)}
.ob-team-num{font-size:18px;font-weight:700;margin-bottom:2px}
.ob-team-label{font-size:11px;color:var(--text3)}
.ob-checkbox-group{display:flex;flex-wrap:wrap;gap:8px}
.ob-checkbox{display:flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:13px;cursor:pointer;transition:all .15s}
.ob-checkbox:hover{border-color:var(--accent);background:var(--accent-bg)}
.ob-checkbox input[type="checkbox"]{margin:0}
[data-theme="dark"] .ob-team-card{border-color:var(--border);background:var(--card)}
[data-theme="dark"] .ob-team-card:hover,[data-theme="dark"] .ob-team-card.selected{border-color:var(--accent);background:rgba(99,102,241,.1)}
[data-theme="dark"] .ob-checkbox{border-color:var(--border)}
[data-theme="dark"] .ob-checkbox:hover{border-color:var(--accent);background:rgba(99,102,241,.08)}

/* ============================================================
   LANDING PAGE — App Gateway
   ============================================================ */
.hero-badge{display:inline-block;padding:6px 16px;border-radius:20px;background:var(--accent-bg);color:var(--accent);font-size:12px;font-weight:600;letter-spacing:.5px;margin-bottom:20px}
.hero-link{font-size:14px;color:var(--accent);margin-top:24px;display:inline-block}
.hero-link:hover{text-decoration:underline}
.capabilities-section{padding:0 40px 60px;max-width:960px;margin:0 auto}
.capabilities-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.capability-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:24px;text-align:center}
.capability-card .cap-icon{width:48px;height:48px;border-radius:var(--radius-sm);background:var(--accent-bg);display:flex;align-items:center;justify-content:center;font-size:24px;margin:0 auto 12px}
.capability-card h3{font-size:15px;font-weight:600;margin-bottom:6px}
.capability-card p{font-size:13px;color:var(--text2);line-height:1.5}
.landing-footer-simple{padding:24px 40px;text-align:center;font-size:12px;color:var(--text3);border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;max-width:960px;margin:0 auto}
.landing-footer-simple a{color:var(--accent);text-decoration:none}
.landing-footer-simple a:hover{text-decoration:underline}
[data-theme="dark"] .capability-card{background:var(--card);border-color:var(--border)}
[data-theme="dark"] .hero-badge{background:rgba(99,102,241,.15)}

/* ===== ADMIN DASHBOARD — MOBILE ===== */
@media(max-width:768px){
  .admin-layout{height:auto;min-height:100vh;min-height:100dvh;flex-direction:column;overflow:visible}
  .admin-sidebar{width:100%;position:relative;height:auto;max-height:none}
  .admin-content{padding:16px;overflow:visible}
  .admin-nav{flex-direction:row;flex-wrap:wrap;gap:4px}
  .admin-nav-item{flex:1;min-width:calc(50% - 4px);text-align:center;justify-content:center}
}

/* ===== MOBILE — PAGE-SPECIFIC ===== */
@media(max-width:768px){
  .page .flex.justify-between.items-center{flex-direction:column;align-items:flex-start;gap:12px}
  .page .flex.gap-12{flex-wrap:wrap}
  .page .search-box{max-width:100%}
  .settings-layout{grid-template-columns:1fr}
  .settings-menu{display:flex;overflow-x:auto;-webkit-overflow-scrolling:touch;gap:0}
  .settings-menu-item{white-space:nowrap;padding:10px 14px}
  [style*="grid-template-columns: 1fr 320px"]{display:flex!important;flex-direction:column!important}
  [style*="grid-template-columns:1fr 320px"]{display:flex!important;flex-direction:column!important}
  .sticky-panel{position:static;width:100%}
  .hero-section{padding:40px 16px}
  .hero-section h1{font-size:28px}
  .capabilities-grid{grid-template-columns:1fr 1fr}
  .hero-btns{flex-direction:column;width:100%;max-width:280px}
  .lifecycle-timeline,.masking-pipeline,.rag-approval-pipeline{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .pagination{flex-wrap:wrap;gap:8px}
  .pagination-pills{flex-wrap:wrap}
  .search-results-layout{grid-template-columns:1fr;gap:16px}
  .search-filter-sidebar{display:flex;overflow-x:auto;-webkit-overflow-scrolling:touch;gap:0}
}

@media(max-width:480px){
  .capabilities-grid{grid-template-columns:1fr}
  .hero-section h1{font-size:24px}
  .ob-type-grid{grid-template-columns:1fr}
}
