/**
 * Gemma Analyzer — UI v2 (Premium)
 * Rebuilt from scratch: dark glass surfaces, clear hierarchy, motion polish.
 * Keeps class names expected by gemma_analyzer_ui.js to avoid JS changes.
 */

/* ----------------------------------------------------------------------------
   Layout Shell
---------------------------------------------------------------------------- */
.gemma-shell {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  padding-bottom: 3rem;
}

.gemma-hero-stats .stat-card,
.gemma-shell .glass-card,
.gemma-quick-actions .glass-card {
  background: var(--surface-panel, rgba(15,22,40,.85));
  border: 1px solid var(--border-glass, rgba(148,163,184,.35));
  border-radius: var(--radius-base, .9rem);
  box-shadow: var(--shadow-panel, 0 18px 48px rgba(3,7,18,.55));
  color: var(--text-high, #f4f7ff);
}

.gemma-hero-stats .stat-value {
  font-family: var(--font-numeric, var(--font-mono));
  font-size: 1.65rem;
}

.gemma-theme .analyzer-section[data-stack="filters"] {
  display: none !important;
}

.gemma-transcript-stack{margin-top:2rem;display:flex;flex-direction:column;gap:2rem;}
.gemma-transcript-card{
  position:relative;
  padding:1.75rem;
  border-radius:1.45rem;
  background:var(--surface-panel-strong,rgba(9,14,32,.92));
  border:1px solid rgba(118,139,255,.35);
  box-shadow:0 35px 70px rgba(1,5,14,.6);
  overflow:hidden;
}
.gemma-transcript-card::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 20% 0%,rgba(118,139,255,.18),transparent 65%);
  opacity:.8;
}
.gemma-transcript-card > *{position:relative;z-index:1;}
.gemma-transcript-card h3{font-size:1.2rem;font-weight:600;margin-bottom:1rem;letter-spacing:.03em;display:flex;align-items:center;gap:.5rem;}
/* ----------------------------------------------------------------------------
   Analyzer Grid
---------------------------------------------------------------------------- */
.gemma-analyzer-root { display: flex; flex-direction: column; gap: 1.5rem; }

.analyzer-card {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
}
@media (max-width: 1200px) { .analyzer-card { grid-template-columns: 1fr; } }

.analyzer-db-panel,
.analyzer-archive{
  background:transparent;
  padding:0;
}
.analyzer-db-panel .analyzer-db-header{
  background:rgba(255,255,255,.02);
  border:1px solid rgba(148,163,184,.18);
  border-radius:1.1rem;
  padding:0.85rem 1.1rem;
  margin-bottom:0.75rem;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);
}
.analyzer-db-header h3{margin:0;font-size:1.05rem;font-weight:600;letter-spacing:.02em;}
.analyzer-db-controls{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;}
.analyzer-db-controls .chip,
.analyzer-db-controls button,
.analyzer-db-controls select{
  border-radius:.85rem;
  border:1px solid rgba(148,163,184,.25);
  background:rgba(15,22,40,.65);
  color:var(--text-high);
  min-height:38px;
}
.analyzer-db-controls .chip{padding:.35rem .9rem;}
.analyzer-db-controls .chip:hover{background:rgba(108,99,241,.25);box-shadow:0 8px 24px rgba(5,8,23,.45);}
.checkbox-pill{background:rgba(9,13,27,.8);border-color:rgba(148,163,184,.2);}
.checkbox-pill input{background:rgba(5,8,15,.45);}
.checkbox-pill span{color:var(--text-secondary);}

.analyzer-section {
  background: var(--surface-panel, rgba(15,22,40,.85));
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-base, .9rem);
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.analyzer-section h3 { margin: 0; font-size: 1rem; font-weight: 600; }

.analyzer-date-presets { display:flex; flex-wrap:wrap; gap:.5rem; }
.analyzer-date-presets .chip[data-active="true"], .analyzer-date-presets .chip:hover { background: var(--primary); color: #fff; }

.analyzer-date-inputs,
.analyzer-grid-two { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap:1rem; }

.analyzer-emotions { display:flex; flex-direction:column; gap:.5rem; }
.analyzer-emotion-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap:.5rem; }

.analyzer-prompt {
  background: rgba(5,8,25,.55);
  border: 1px solid var(--border-glass);
  color: var(--text-high);
  font-family: var(--font-mono);
  min-height: 220px;
  border-radius: .6rem;
}
.analyzer-prompt-actions { display:flex; justify-content:flex-end; }

/* ----------------------------------------------------------------------------
   Summary / Actions
---------------------------------------------------------------------------- */
.analyzer-summary { display:flex; }
.analyzer-summary-card {
  width:100%; background: var(--surface-panel-strong, rgba(20,28,52,.92));
  border:1px solid var(--border-glass); border-radius: var(--radius-base,.9rem);
  padding:1.5rem; display:flex; flex-direction:column; gap:1.5rem;
  box-shadow: var(--shadow-panel);
}
.analyzer-summary-header { display:flex; justify-content:space-between; gap:1rem; align-items:center; }
.analyzer-summary-tools { display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; justify-content:flex-end; }
.analyzer-count { text-align:right; }
.analyzer-count-value { display:block; font-size:2.75rem; font-weight:800; line-height:1; font-family: var(--font-numeric); }
.analyzer-count-value.pulse { animation: pulse .5s ease; }
.analyzer-actions { display:flex; gap:1rem; flex-wrap:wrap; }

.analyzer-progress { display:flex; flex-direction:column; gap:.75rem; }
.analyzer-progress-bar { height:8px; border-radius:999px; background: rgba(127,107,255,.25); overflow:hidden; }
.analyzer-progress-fill { width:0%; height:100%; background: var(--gradient-primary); transition: width .3s ease; }

/* ----------------------------------------------------------------------------
   Results / Logs
---------------------------------------------------------------------------- */
.analyzer-results { display:flex; flex-direction:column; gap:1.25rem; }
.analyzer-results-stream { display:flex; flex-direction:column; gap:1rem; max-height:420px; overflow-y:auto; padding-right:.5rem; }

.analyzer-result-card {
  background: var(--surface-panel);
  border:1px solid var(--border-glass);
  border-radius: var(--radius-base,.9rem);
  padding:1rem; display:flex; flex-direction:column; gap:.75rem;
  transition: box-shadow .3s ease, transform .3s ease;
}
.analyzer-result-card.highlight { box-shadow: 0 12px 30px rgba(127,107,255,.35); transform: translateY(-4px); }
.analyzer-result-header { display:flex; justify-content:space-between; gap:1rem; }
.analyzer-result-body pre,
.analyzer-summary-output pre { margin:0; white-space:pre-wrap; background:rgba(17,24,39,.6); color:#f9fafb; padding:.75rem; border-radius:.5rem; font-size:.9rem; }

.analyzer-log { background: var(--surface-panel); border:1px solid var(--border-glass); border-radius: .75rem; max-height:420px; overflow-y:auto; padding:1rem; display:flex; flex-direction:column; gap:.75rem; }
.analyzer-log-item { display:flex; gap:.75rem; font-family: var(--font-mono); font-size:.85rem; color:var(--text-mid); }
.analyzer-log-time { opacity:.75; }

/* ----------------------------------------------------------------------------
   Transcript Browser (cards)
---------------------------------------------------------------------------- */
.analyzer-db-header { display:flex; align-items:center; justify-content:space-between; gap:.5rem; flex-wrap:wrap; margin-bottom:.75rem; }
.analyzer-db-controls { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; }
.analyzer-db-controls input[data-role="db-search"]{ min-width:220px; flex:1 1 220px; }

/* Column toggle pills */
.checkbox-pill{display:inline-flex;align-items:center;gap:.5rem;background:rgba(148,163,184,.12);border:1px solid var(--border-glass);border-radius:999px;padding:.35rem .6rem;cursor:pointer;user-select:none}
.checkbox-pill input{appearance:none;width:14px;height:14px;border:1px solid var(--border-glass);border-radius:3px;background:rgba(5,8,25,.4);display:inline-block;position:relative}
.checkbox-pill input:checked{background:var(--primary);border-color:transparent}
.checkbox-pill input:checked::after{content:'';position:absolute;inset:3px;background:#fff;border-radius:2px}
.checkbox-pill span{font-size:.85rem;color:var(--text-mid)}

.analyzer-db-list{
  max-height:480px;
  overflow:auto;
  border-radius:1.1rem;
  padding:0;
  background:radial-gradient(circle at 50% -20%,rgba(127,107,255,.12),transparent 50%),rgba(7,11,24,.85);
  border:1px solid rgba(118,139,255,.25);
  box-shadow:0 28px 60px rgba(1,4,15,.55);
}
.analyzer-db-list::-webkit-scrollbar{width:10px}
.analyzer-db-list::-webkit-scrollbar-thumb{background:rgba(127,107,255,.45);border-radius:8px}
.analyzer-db-list::-webkit-scrollbar-track{background:rgba(4,7,18,.6)}

.db-header{display:none;}

/* Emotion colors */
.gemma-theme{ --emotion-joy:#17c964; --emotion-surprise:#3b82f6; --emotion-neutral:#94a3b8; --emotion-anger:#ef4444; --emotion-fear:#f59e0b; --emotion-sadness:#6366f1; --emotion-disgust:#eab308; }

.db-row{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:.9rem;
  padding:1rem 1.1rem;
  margin:0.85rem 1rem;
  border-radius:1.1rem;
  border:1px solid rgba(141,155,190,.25);
  background:linear-gradient(135deg,rgba(14,19,41,.9),rgba(6,9,22,.92));
  box-shadow:0 25px 45px rgba(1,3,12,.5);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.db-row:first-of-type{margin-top:1.2rem;}
.db-row:hover{transform:translateY(-3px);box-shadow:0 28px 60px rgba(4,8,25,.55);border-color:rgba(127,107,255,.45);}
.db-row::before{
  content:\"\";position:absolute;top:0;left:18px;right:18px;height:2px;
  background:linear-gradient(90deg,rgba(127,107,255,.6),transparent);
  border-radius:999px;
}
.db-row.emotion-joy::before{background:linear-gradient(90deg,var(--emotion-joy),transparent);}
.db-row.emotion-surprise::before{background:linear-gradient(90deg,var(--emotion-surprise),transparent);}
.db-row.emotion-neutral::before{background:linear-gradient(90deg,var(--emotion-neutral),transparent);}
.db-row.emotion-anger::before{background:linear-gradient(90deg,var(--emotion-anger),transparent);}
.db-row.emotion-fear::before{background:linear-gradient(90deg,var(--emotion-fear),transparent);}
.db-row.emotion-sadness::before{background:linear-gradient(90deg,var(--emotion-sadness),transparent);}
.db-row.emotion-disgust::before{background:linear-gradient(90deg,var(--emotion-disgust),transparent);}
.db-row.db-row-dense{margin:0.5rem 0.7rem;padding:.75rem .85rem;}
.db-row.db-row-dense .db-col.db-text{-webkit-line-clamp:1;font-size:.9rem;}

.db-row-header{display:flex;gap:1rem;align-items:flex-start;}
.db-row-toggle{
  width:34px;height:34px;border-radius:50%;
  border:1px solid rgba(127,107,255,.4);
  background:rgba(127,107,255,.15);
  color:var(--text-high);
  display:inline-flex;align-items:center;justify-content:center;
  transition:transform .2s ease,background .2s ease;
}
.db-row-toggle:hover{transform:rotate(90deg);background:rgba(127,107,255,.25);}
.db-row-cols{
  display:grid;
  gap:.65rem;
  width:100%;
  grid-template-columns:repeat(auto-fit,minmax(150px,auto));
  align-items:center;
}
.db-col{color:var(--text-high);font-size:.9rem;letter-spacing:.01em;}
.db-col.db-text{
  grid-column:1 / -1;
  background:rgba(5,8,20,.75);
  border:1px solid rgba(43,57,99,.6);
  border-radius:.9rem;
  padding:.65rem .85rem;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:.95rem;
}
.db-date{color:var(--text-low,#6b7280);font-family:var(--font-numeric);}
.db-speaker{font-weight:700;}
.db-emotion{min-width:120px;}
.db-time,.db-job,.db-segment{font-family:var(--font-numeric);word-break:break-all;}
.db-text{flex:1;}

.speaker-badge{ background:rgba(127,107,255,.14); border:1px solid rgba(127,107,255,.35); color:var(--text-high); padding:2px 8px; border-radius:999px; font-weight:600; font-size:.85rem; }
.emotion-badge{ display:inline-flex; align-items:center; gap:6px; padding:2px 10px; border-radius:999px; border:1px solid var(--border-glass); font-size:.8rem; letter-spacing:.02em; background: rgba(148,163,184,.08); }
.emotion-badge.emotion-joy{ background: rgba(23,201,100,.12); border-color: rgba(23,201,100,.35); }
.emotion-badge.emotion-surprise{ background: rgba(59,130,246,.12); border-color: rgba(59,130,246,.35); }
.emotion-badge.emotion-neutral{ background: rgba(148,163,184,.10); border-color: rgba(148,163,184,.35); }
.emotion-badge.emotion-anger{ background: rgba(239,68,68,.12); border-color: rgba(239,68,68,.35); }
.emotion-badge.emotion-fear{ background: rgba(245,158,11,.12); border-color: rgba(245,158,11,.35); }
.emotion-badge.emotion-sadness{ background: rgba(99,102,241,.12); border-color: rgba(99,102,241,.35); }
.emotion-badge.emotion-disgust{ background: rgba(234,179,8,.12); border-color: rgba(234,179,8,.35); }

.db-row-detail{
  margin-top:.35rem;
  background:rgba(6,9,21,.85);
  border-radius:1rem;
  padding:1rem;
  display:flex;
  flex-direction:column;
  gap:.85rem;
  border:1px solid rgba(148,163,184,.15);
}
.db-snippet pre{margin:.35rem 0 0;background:rgba(3,5,15,.95);color:var(--text-high);border-radius:.85rem;padding:.85rem;white-space:pre-wrap;border:1px solid rgba(48,65,120,.55);}
.db-context-list p{ margin:4px 0; color:var(--text-mid); font-size:.85rem;}
.db-actions{ display:flex; gap:8px; flex-wrap:wrap; }

.db-meta-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(160px,1fr)); gap:.75rem; }
.db-meta-item{ background: rgba(15,23,42,.35); border:1px solid rgba(148,163,184,.25); border-radius:.95rem; padding:.9rem; box-shadow: inset 0 0 0 1px rgba(255,255,255,.02); }
.meta-label{ font-size:.7rem; letter-spacing:.05em; text-transform:uppercase; color:var(--text-low); display:block; margin-bottom:2px; }
.meta-value{ font-weight:700; color:var(--text-high); }
.meta-mono{ font-family: var(--font-numeric); font-size:.85rem; word-break:break-all; }

.analyzer-db-meta{ margin:1rem 1rem 0; font-size:.78rem; letter-spacing:.05em; color: var(--text-low); text-transform:uppercase; }

/* Inline analyzer */
.inline-analyzer{margin-top:12px;border:1px solid var(--border-glass);border-radius:1rem;padding:1rem;background:linear-gradient(135deg,rgba(18,25,48,.95),rgba(6,10,24,.9));box-shadow:0 18px 44px rgba(2,6,23,.55)}
.inline-analyzer-input{display:flex;gap:.75rem;align-items:center;margin-bottom:.9rem;background:rgba(3,7,18,.55);border:1px solid rgba(148,163,184,.35);border-radius:.9rem;padding:.65rem .85rem}
.inline-analyzer-input input{flex:1;border:none;background:transparent;color:var(--text-high);font-weight:600;letter-spacing:.01em}
.inline-analyzer-input input::placeholder{color:var(--text-low)}
.inline-analyzer-input input:focus{outline:none}
.inline-analyzer-input .btn{background:var(--gradient-primary);border:none;color:#fff;font-weight:600;padding:.55rem 1.25rem;box-shadow:0 10px 30px rgba(99,102,241,.35)}
.inline-analyzer-context{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}
.inline-analyzer .context-col{min-height:120px;max-height:200px;overflow:auto;border:1px dashed rgba(148,163,184,.45);border-radius:.95rem;padding:.85rem;background:rgba(9,13,27,.85);color:var(--text-high);font-size:.9rem}
.inline-analyzer .meta-label{color:var(--text-tertiary);font-size:.75rem;letter-spacing:.08em}
.inline-analyzer .context-col p{margin:.4rem 0}

.emotion-option span{display:flex;align-items:center;gap:.35rem}
.emotion-confidence-pill{font-size:.75rem;color:var(--text-tertiary);background:rgba(148,163,184,.18);padding:.1rem .5rem;border-radius:999px;border:1px solid rgba(148,163,184,.35)}
.emotion-confidence-control{margin-top:.75rem;padding:.75rem;border-radius:1rem;background:rgba(3,7,18,.45);border:1px solid rgba(148,163,184,.25);display:flex;flex-direction:column;gap:.35rem}
.confidence-slider{display:flex;align-items:center;gap:.75rem}
.confidence-slider input[type=range]{flex:1;accent-color:#7f5af0}
.confidence-value{font-weight:700;color:var(--text-high)}
.confidence-help{font-size:.75rem;color:var(--text-tertiary);margin:0}

.artifact-list{max-height:360px;overflow:auto;border:1px solid var(--border-glass);border-radius:1rem;background:rgba(8,12,24,.75);display:flex;flex-direction:column;gap:.4rem;padding:.4rem}
.artifact-row{display:flex;align-items:flex-start;gap:.6rem;padding:.65rem;border-radius:.95rem;background:rgba(15,23,42,.8);border:1px solid transparent;transition:background .2s ease,border .2s ease}
.artifact-row:hover,.artifact-row.artifact-selected{border-color:rgba(120,140,255,.4);background:rgba(27,34,68,.9)}
.artifact-row input{margin-top:.2rem}
.artifact-info{display:flex;flex-direction:column;gap:.2rem;flex:1}
.artifact-row .artifact-title{font-weight:600;color:var(--text-high);display:block}
.artifact-row .artifact-meta{font-size:.75rem;color:var(--text-tertiary)}
.artifact-local-row{border-style:dashed}
.artifact-preview{border:1px solid var(--border-glass);border-radius:1rem;background:rgba(4,7,18,.85);padding:1rem;max-height:360px;overflow:auto;box-shadow:0 20px 55px rgba(2,6,23,.55)}
.artifact-body{white-space:pre-wrap;font-size:.9rem;margin:0;color:var(--text-high);font-family:var(--font-mono)}
.analyzer-archive-grid{display:flex;gap:1.5rem;flex-wrap:wrap;align-items:flex-start;}
.archive-column{flex:1 1 320px;min-width:280px;}
.archive-column--list{flex:0 0 360px;}
.archive-column h3{margin:0 0 .75rem;}
.analyzer-archive .btn,.analyzer-archive .chip{border-radius:.85rem;}

.chat-drawer{
  position:fixed;
  left:50%;
  bottom:24px;
  transform:translate(-50%,24px);
  width:min(960px,calc(100vw - 32px));
  background:rgba(8,12,26,.95);
  border:1px solid rgba(148,163,184,.35);
  border-radius:1.5rem;
  box-shadow:0 40px 80px rgba(0,0,0,.65);
  display:flex;
  flex-direction:column;
  opacity:0;
  pointer-events:none;
  backdrop-filter:blur(14px);
  transition:opacity .25s ease, transform .25s ease;
  z-index:110;
}
.chat-drawer[data-open=\"true\"]{opacity:1;pointer-events:auto;transform:translate(-50%,0);}
.chat-drawer__header,
.chat-drawer__footer{
  padding:1rem 1.25rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid rgba(148,163,184,.2);
}
.chat-drawer__header strong{letter-spacing:.05em;font-size:1rem;}
.chat-drawer__actions{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;}
.chat-drawer__actions select{min-width:150px;}
.chat-drawer__footer{border-top:1px solid rgba(148,163,184,.2);border-bottom:none;gap:.75rem;}
.chat-drawer__body{flex:1;overflow:auto;padding:1rem 1.25rem;}
.chat-drawer__body::-webkit-scrollbar{width:6px}
.chat-drawer__body::-webkit-scrollbar-thumb{background:rgba(148,163,184,.45);border-radius:6px}
.chat-overlay{
  position:fixed;
  inset:0;
  background:rgba(3,6,15,.65);
  backdrop-filter:blur(8px);
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease;
  z-index:100;
}
.chat-overlay[data-open=\"true\"]{opacity:1;pointer-events:auto;}

.log-overlay{
  position:fixed;
  inset:0;
  background:rgba(5,8,18,.7);
  backdrop-filter:blur(8px);
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease;
  z-index:150;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:1.5rem;
}
.log-overlay[data-open=\"true\"]{opacity:1;pointer-events:auto;}
.log-panel{
  width:min(960px,90vw);
  background:rgba(7,10,22,.95);
  border:1px solid rgba(148,163,184,.35);
  border-radius:1.35rem;
  padding:1.5rem;
  box-shadow:0 50px 90px rgba(0,0,0,.65);
}
.log-panel-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;}
.log-panel-header .chip{border-radius:.85rem;}

/* ----------------------------------------------------------------------------
   Chips / Inputs (theme overrides)
---------------------------------------------------------------------------- */
.gemma-theme .chip{ background: rgba(148,163,184,.15); border:1px solid var(--border-glass); color:var(--text-mid); transition: background .25s ease, transform .25s ease; }
.gemma-theme .chip:hover{ background: rgba(148,163,184,.25); transform: translateY(-1px); }
.gemma-theme .btn.btn-primary{ background: var(--gradient-primary); border:none; color:#fff; }
.gemma-theme .btn{ border-color: var(--border-glass); }
.gemma-theme .input{ background: rgba(5,8,25,.55); border:1px solid var(--border-glass); color:var(--text-high); }
.gemma-theme .input::placeholder{ color: var(--text-low); }
.gemma-theme .input:focus{ outline:2px solid rgba(127,107,255,.5); outline-offset:0; }

/* ----------------------------------------------------------------------------
   Animations
---------------------------------------------------------------------------- */
@keyframes pulse{ 0%{transform:scale(1)} 50%{transform:scale(1.1)} 100%{transform:scale(1)} }
.chat-drawer__footer input{flex:1;}
.chat-drawer__footer .btn{border-radius:1rem;padding:.65rem 1.5rem;}