/* ══════════════════════════════════════════════
   Bottom Tab Bar + Talk Panel + Queue Strip

   ALL tokens live in reasonspring.css.
   ZERO hardcoded colors or layout numbers here.
   ══════════════════════════════════════════════ */

/* ── Bottom Tab Bar ── */

.bottom-tabs {
    flex-shrink: 0;
    height: var(--tab-bar-h);
    background: var(--surface-tabs);
    border-top: 1px solid var(--glass-border);
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding-bottom: env(safe-area-inset-bottom, 0);
    position: relative;
    z-index: var(--z-tabs);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

.bottom-tab {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 6px 12px;
    text-decoration: none;
    color: var(--text-muted);
    font-size: 10px;
    font-weight: var(--font-weight-medium);
    transition: color var(--transition-fast);
    -webkit-tap-highlight-color: transparent;
    cursor: pointer;
    border: none;
    background: none;
    font-family: inherit;
}

.bottom-tab:active { transform: scale(0.92); }
.bottom-tab--active { color: var(--text-primary); }
.bottom-tab svg { width: 22px; height: 22px; stroke-width: 1.8; }
.bottom-tab--active svg { stroke: var(--text-primary); fill: none; }
.bottom-tab__label { line-height: 1; }

/* Notification dot — pulsing indicator for new content */

.bottom-tab--notify::after {
    content: '';
    position: absolute;
    top: 4px;
    right: 4px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--color-warning);
    box-shadow: 0 0 6px rgba(249, 115, 22, 0.6);
    animation: tab-notify-pulse 1.5s ease-in-out infinite;
}

@keyframes tab-notify-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50%      { opacity: 0.5; transform: scale(0.7); }
}

/* Talk button — elevated center */

.bottom-tab--talk {
    position: relative;
    margin-top: calc(-1 * var(--talk-overshoot));
    z-index: 1; /* float above sibling tabs so overshoot isn't clipped */
}

.bottom-tab--talk .talk-circle {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--gradient-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 16px rgba(26, 90, 148, 0.45), 0 0 24px rgba(26, 90, 148, 0.2);
    transition: box-shadow var(--transition-base), transform var(--transition-fast);
}

.bottom-tab--talk:active .talk-circle { transform: scale(0.93); }
.bottom-tab--talk .talk-circle svg { width: 24px; height: 24px; stroke: var(--text-primary); fill: none; }

.bottom-tab--talk.connecting .talk-circle { animation: talk-spin 1s linear infinite; }
@keyframes talk-spin { to { transform: rotate(360deg); } }

.bottom-tab--talk.connected .talk-circle {
    background: linear-gradient(135deg, var(--color-success), var(--color-success));
    box-shadow: 0 0 0 0 rgba(45, 106, 79, 0.6);
    animation: talk-pulse 2s ease-in-out infinite;
}

.bottom-tab--talk.connected .bottom-tab__label { color: var(--color-success); }

.bottom-tab--talk.generating .talk-circle {
    background: var(--gradient-generating);
    background-size: 200% 100%;
    animation: talk-gen-gradient 2s ease-in-out infinite, talk-gen-pulse 1.5s ease-in-out infinite;
    box-shadow: 0 4px 16px rgba(26, 90, 148, 0.4);
}

.bottom-tab--talk.generating .bottom-tab__label { color: var(--color-primary); }

@keyframes talk-gen-gradient {
    0%, 100% { background-position: 0% 50%; }
    50%      { background-position: 100% 50%; }
}

@keyframes talk-gen-pulse {
    0%, 100% { box-shadow: 0 4px 16px rgba(26, 90, 148, 0.4); }
    50%      { box-shadow: 0 4px 16px rgba(26, 90, 148, 0.4),
                           0 0 24px rgba(26, 90, 148, 0.3),
                           0 0 48px rgba(26, 90, 148, 0.15); }
}

@keyframes talk-pulse {
    0%   { box-shadow: 0 4px 16px rgba(45, 106, 79, 0.4); }
    50%  { box-shadow: 0 4px 16px rgba(45, 106, 79, 0.4),
                       0 0 20px rgba(45, 106, 79, 0.3),
                       0 0 40px rgba(45, 106, 79, 0.15); }
    100% { box-shadow: 0 4px 16px rgba(45, 106, 79, 0.4); }
}

/* ══════════════════════════════════════════════
   Talk Panel — slide-up chat overlay
   ══════════════════════════════════════════════ */

.tp {
    position: absolute;
    top: var(--nav-h);  /* clear fixed top-nav — never tuck under toolbar */
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(180deg, var(--bg-secondary) 0%, var(--bg-secondary) 40%, var(--bg-secondary) 100%);
    z-index: var(--z-talk);
    display: flex;
    flex-direction: column;
    overflow: hidden; /* block scroll pass-through to main */
    transform: translateY(100%);
    opacity: 0;
    pointer-events: none;
    transition: transform var(--transition-base), opacity var(--transition-base);
}

/* Subtle grid overlay for mission-control feel */
.tp::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        repeating-linear-gradient(0deg, transparent, transparent 39px, rgba(102, 126, 234, 0.03) 39px, rgba(102, 126, 234, 0.03) 40px),
        repeating-linear-gradient(90deg, transparent, transparent 39px, rgba(102, 126, 234, 0.03) 39px, rgba(102, 126, 234, 0.03) 40px);
    pointer-events: none;
}

.tp--active { transform: translateY(0); opacity: 1; pointer-events: auto; }

.tp-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px 8px;
    flex-shrink: 0;
}

.tp-title {
    font-family: var(--font-talk);
    font-size: 13px;
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.tp-header-actions { display: flex; align-items: center; gap: 4px; }

/* Noise reduction slider */
.tp-header__nr {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
    margin-right: 8px;
    color: var(--text-muted);
}

.tp-header__nr input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    width: 64px;
    height: 3px;
    background: var(--glass-bg-hover);
    border-radius: 2px;
    outline: none;
}

.tp-header__nr input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--text-secondary);
    cursor: pointer;
    transition: background 0.15s;
}

.tp-header__nr input[type="range"]::-webkit-slider-thumb:hover {
    background: var(--text-primary);
}

.tp-copy {
    background: none;
    border: none;
    color: var(--text-muted);
    cursor: pointer;
    padding: 4px 6px;
    line-height: 1;
    transition: color var(--transition-fast);
}

.tp-copy:active { transform: scale(0.9); }

.tp-close {
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 20px;
    cursor: pointer;
    padding: 4px 8px;
    line-height: 1;
}

/* ── Monitor — task manager + SSE diagnostics (scrollable) ── */

.tp-monitor {
    flex-shrink: 0;
    max-height: 45vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding: 0 12px 8px;
    border-bottom: 1px solid var(--border-subtle);
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-family: var(--font-talk);
    font-size: 10px;
}

.tp-monitor__sect {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 4px 0;
}

.tp-monitor__sect + .tp-monitor__sect {
    border-top: 1px solid var(--border-subtle);
}

/* Hide section when all children after label are empty / hidden */
.tp-monitor__sect:not(:has(> :not(.tp-monitor__lbl):not(:empty))) { display: none; }

.tp-monitor__lbl {
    font-size: 9px;
    font-weight: var(--font-weight-bold);
    font-family: var(--font-body);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--text-dim);
    line-height: 1;
}

.tp-diag {
    display: flex;
    gap: 4px;
    align-items: center;
    flex-wrap: wrap;
    font-size: 9px;
    font-family: var(--font-mono);
    color: var(--text-secondary);
    line-height: 1.6;
    word-break: break-all;
}

.tp-diag:empty { display: none; }
.tp-diag span { white-space: nowrap; }

.tp-queue-badges { display: flex; gap: 4px; align-items: center; flex-wrap: wrap; }
.tp-queue-badges:empty { display: none; }

/* ── Queue recs inside monitor ── */

.tp-queue-recs { display: flex; flex-direction: column; gap: 2px; }
.tp-queue-recs:empty { display: none; }

.tp-queue-recs .tp-q-rec {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 2px 0;
    font-size: 10px;
    font-family: var(--font-talk);
    color: var(--text-secondary);
}

.tp-queue-recs .tp-q-rec-status {
    display: inline-block;
    padding: 1px 5px;
    border-radius: 3px;
    font-size: 8px;
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--text-primary);
    min-width: 36px;
    text-align: center;
}

.tp-queue-recs .tp-q-rec--gen { animation: tp-pulse 1.5s ease-in-out infinite; }
@keyframes tp-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.6; } }

.tp-queue-recs .tp-q-rec-title {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Conversation ── */

.tp-msgs {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding: 0 16px 12px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.tp-msg {
    padding: 2px 0;
    font-family: var(--font-body);
    font-size: 14px;
    line-height: 1.6;
    animation: tp-msg-in 0.18s ease both;
    word-wrap: break-word;
}

@keyframes tp-msg-in {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}

.tp-msg--system {
    color: var(--text-muted);
    font-size: 12px;
    font-style: italic;
}

.tp-msg--error {
    color: var(--color-error-light);
    font-size: 13px;
    border-left: 2px solid var(--color-error);
    padding-left: 10px;
}

.tp-msg--user {
    color: var(--text-primary);
    border-left: 2px solid var(--color-user);
    padding-left: 10px;
}

.tp-msg--ai {
    color: var(--text-primary);
    font-weight: var(--font-weight-medium);
}

.tp-msg--pending { opacity: 0.6; }

.tp-msg--progress {
    font-size: 13px;
    color: var(--text-muted);
    border-left: 2px solid var(--color-info);
    padding-left: 10px;
    font-variant-numeric: tabular-nums;
}

/* ── Source links (search results) ── */

.tp-sources {
    padding: 4px 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.tp-source-link {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 5px 10px;
    font-size: 13px;
    line-height: 1.4;
    text-decoration: none;
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    transition: background 0.15s, color 0.15s;
}

.tp-source-link:hover {
    background: var(--glass-bg-hover);
    color: var(--text-primary);
}

.tp-source-link__domain {
    flex-shrink: 0;
    font-size: 11px;
    font-weight: var(--font-weight-semibold);
    color: var(--color-info);
    min-width: 80px;
}

.tp-source-link__title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Active threads tracker ── */

.tp-threads {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.tp-threads:empty { display: none; }

.tp-thread {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: var(--font-talk);
    font-size: 11px;
    line-height: 1.4;
    animation: tp-q-pulse 1.5s ease-in-out infinite;
}

.tp-thread__icon {
    flex-shrink: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--color-warning);
    animation: tp-live-pulse 2s ease-in-out infinite;
}

.tp-thread__stage {
    flex-shrink: 0;
    padding: 1px 5px;
    border-radius: 3px;
    font-size: 9px;
    font-weight: var(--font-weight-bold);
    font-family: var(--font-mono);
    text-transform: uppercase;
    background: var(--color-warning);
    color: #000;
}

.tp-thread__msg {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--text-secondary);
}

.tp-thread__pct {
    flex-shrink: 0;
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
    color: var(--color-warning);
    font-size: 10px;
    font-weight: var(--font-weight-semibold);
}

.tp-thread--done .tp-thread__stage { background: var(--color-success); }
.tp-thread--done .tp-thread__pct   { color: var(--color-success); }
.tp-thread--error .tp-thread__stage { background: var(--color-error); }

/* ── Collapsible progress group ── */

.tp-progress-group {
    align-self: stretch;
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-md);
    padding: 0;
    animation: tp-msg-in 0.18s ease both;
    overflow: hidden;
}

.tp-progress-summary {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    font-size: 12px;
    font-weight: var(--font-weight-semibold);
    font-family: var(--font-mono);
    color: var(--text-secondary);
    cursor: pointer;
    user-select: none;
    list-style: none;
}
.tp-progress-summary::-webkit-details-marker { display: none; }

.tp-progress-triangle {
    display: inline-block;
    font-size: 12px;
    line-height: 1;
    transition: transform var(--transition-fast);
    flex-shrink: 0;
}
.tp-progress-group[open] .tp-progress-triangle { transform: rotate(90deg); }

.tp-progress-log {
    padding: 0 12px 8px;
    display: flex;
    flex-direction: column;
    gap: 1px;
    max-height: 280px;
    overflow-y: auto;
    overscroll-behavior: contain;
}
.tp-progress-line {
    font-size: 11px;
    font-family: var(--font-mono);
    color: var(--text-muted);
    line-height: 1.5;
}
.tp-progress-line--stage {
    color: var(--text-secondary);
    font-weight: var(--font-weight-semibold);
    margin-top: 4px;
    padding-left: 8px;
    border-left: 2px solid var(--color-info);
}
.tp-progress-line--done {
    color: var(--color-success);
    font-weight: var(--font-weight-semibold);
}
.tp-progress-line--error {
    color: var(--color-error);
    font-weight: var(--font-weight-semibold);
}
/* Stage color-coding */
.tp-progress-line--research { border-left-color: var(--teal); }
.tp-progress-line--research.tp-progress-line--stage { color: var(--teal); }
.tp-progress-line--script { border-left-color: var(--magenta); }
.tp-progress-line--script.tp-progress-line--stage { color: var(--magenta); }
.tp-progress-line--tts { border-left-color: var(--color-warning); }
.tp-progress-line--tts.tp-progress-line--stage { color: var(--color-warning); }
.tp-progress-line--mixing { border-left-color: var(--color-success); }
.tp-progress-line--mixing.tp-progress-line--stage { color: var(--color-success); }
.tp-progress-line--video { border-left-color: var(--pink); }
.tp-progress-line--video.tp-progress-line--stage { color: var(--pink); }
.tp-progress-line--images { border-left-color: var(--color-warning); }
.tp-progress-line--images.tp-progress-line--stage { color: var(--color-warning); }
.tp-progress-img {
    width: 100%;
    max-width: 200px;
    border-radius: var(--radius-sm);
    margin: 4px 0;
}
.tp-progress-img--loading {
    min-height: 120px;
    background: var(--glass-bg);
    border: 1px solid var(--border-subtle);
}

/* ── Generating indicator ── */

.tp-gen-indicator {
    align-self: stretch;
    position: relative;
    background: rgba(102, 126, 234, 0.08);
    border: 1px solid rgba(102, 126, 234, 0.25);
    border-radius: var(--radius-md);
    padding: 14px 16px;
    animation: tp-msg-in 0.3s ease both;
    display: flex;
    flex-direction: column;
    gap: 8px;
    box-shadow: 0 0 12px rgba(102, 126, 234, 0.1), inset 0 1px 0 rgba(102, 126, 234, 0.1);
    animation: tp-msg-in 0.3s ease both, tp-gen-glow 3s ease-in-out infinite;
}

@keyframes tp-gen-glow {
    0%, 100% { box-shadow: 0 0 12px rgba(102, 126, 234, 0.1), inset 0 1px 0 rgba(102, 126, 234, 0.1); }
    50%      { box-shadow: 0 0 20px rgba(102, 126, 234, 0.25), 0 0 40px rgba(102, 126, 234, 0.08), inset 0 1px 0 rgba(102, 126, 234, 0.15); }
}

.tp-gen-indicator__pulse {
    width: 8px; height: 8px; border-radius: 50%;
    background: var(--color-info);
    display: inline-block;
    animation: tp-gen-pulse 1.2s ease-in-out infinite;
    position: absolute; margin-top: 2px;
}

.tp-gen-indicator__text {
    font-size: 13px;
    font-weight: var(--font-weight-semibold);
    color: var(--text-primary);
    padding-left: 18px;
}

.tp-gen-indicator__bar {
    width: 100%; height: 6px;
    background: var(--glass-bg);
    border-radius: 3px; overflow: hidden;
}

.tp-gen-indicator__fill {
    height: 100%; width: 0%;
    background: var(--gradient-generating);
    background-size: 200% 100%;
    animation: tp-gen-bar-shift 2s ease-in-out infinite;
    border-radius: 3px;
    transition: width 0.4s ease;
    box-shadow: 0 0 8px rgba(26, 90, 148, 0.3);
}

@keyframes tp-gen-bar-shift {
    0%, 100% { background-position: 0% 50%; }
    50%      { background-position: 100% 50%; }
}

.tp-gen-indicator__stage {
    font-size: 11px;
    font-family: var(--font-mono);
    color: rgba(102, 126, 234, 0.8);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.tp-gen-indicator--error .tp-gen-indicator__fill  { background: var(--color-error); }
.tp-gen-indicator--error .tp-gen-indicator__pulse { background: var(--color-error); animation: none; }
.tp-gen-indicator--error .tp-gen-indicator__stage { color: var(--color-error); }

@keyframes tp-gen-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50%      { opacity: 0.4; transform: scale(0.8); }
}

/* ── Inline player ── */

.tp-player {
    align-self: stretch;
    background: rgba(45, 106, 79, 0.08);
    border: 1px solid rgba(45, 106, 79, 0.25);
    border-radius: var(--radius-md);
    padding: 10px 12px;
    animation: tp-msg-in 0.3s ease both;
}

.tp-player__label {
    font-size: 11px;
    font-weight: var(--font-weight-semibold);
    color: var(--color-success);
    margin-bottom: 6px;
    font-family: var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.tp-player__audio { width: 100%; height: 36px; border-radius: 8px; }

/* ── Queue badge / rec shared styles ── */

@keyframes tp-live-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }

.tp-q-badge {
    display: inline-block;
    padding: 2px 6px; border-radius: 4px;
    font-size: 9px; font-weight: var(--font-weight-semibold);
    font-family: var(--font-mono);
    color: #000; text-transform: uppercase; letter-spacing: 0.03em;
}

@keyframes tp-q-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }

/* ══════════════════════════════════════════════
   Queue Status Strip
   ══════════════════════════════════════════════ */

.queue-strip {
    flex-shrink: 0;
    display: none;
    flex-direction: column; gap: 4px;
    padding: 6px 12px;
    background: var(--surface-strip);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-top: 1px solid var(--border-subtle);
    font-family: var(--font-mono); font-size: 10px;
}

.queue-strip--visible { display: flex; }
.queue-strip__badges { display: flex; flex-wrap: wrap; gap: 4px; }

.queue-strip__badge {
    display: inline-block;
    padding: 1px 6px; border-radius: 4px;
    font-size: 9px; font-weight: var(--font-weight-bold);
    color: #000; text-transform: uppercase; letter-spacing: 0.03em;
}

.queue-strip__active { display: flex; flex-direction: column; gap: 2px; }

.queue-strip__rec {
    display: flex; align-items: center; gap: 6px;
    color: var(--text-secondary); font-size: 10px;
}

.queue-strip__rec--gen { animation: qs-pulse 1.5s ease-in-out infinite; }
@keyframes qs-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }

.queue-strip__rec-status {
    display: inline-block;
    padding: 1px 4px; border-radius: 3px;
    font-size: 8px; font-weight: var(--font-weight-bold);
    color: #000; text-transform: uppercase; flex-shrink: 0;
}

.queue-strip__rec-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ══════════════════════════════════════════════
   Task Status Bar — system-wide background task monitor
   ══════════════════════════════════════════════ */

.task-bar {
    flex-shrink: 0;
    display: none;
    flex-direction: column;
    gap: 4px;
    padding: 8px 16px;
    background: var(--surface-strip, rgba(18, 18, 24, 0.95));
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-top: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
    font-family: var(--font-body, 'DM Sans', sans-serif);
    font-size: 12px;
}

.task-bar--visible { display: flex; }

.task-bar__item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 0;
    color: var(--text-secondary, rgba(255, 255, 255, 0.7));
}

.task-bar__item--running { color: var(--accent-primary, #818cf8); }
.task-bar__item--done { color: var(--color-success, #22c55e); opacity: 0.7; }
.task-bar__item--error { color: var(--color-error, #ef4444); }

.task-bar__spinner {
    width: 12px;
    height: 12px;
    border: 2px solid currentColor;
    border-top-color: transparent;
    border-radius: 50%;
    animation: task-spin 0.8s linear infinite;
    flex-shrink: 0;
}
@keyframes task-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.task-bar__label {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
}

.task-bar__time {
    flex-shrink: 0;
    font-family: var(--font-mono, 'JetBrains Mono', monospace);
    font-size: 10px;
    color: var(--text-muted, rgba(255, 255, 255, 0.45));
}

/* ══════════════════════════════════════════════
   Layout adjustments
   ══════════════════════════════════════════════ */

/* No padding-bottom needed — flex layout auto-sizes main */

/* ── Slide-up URL input ── */

.tp-url-input {
    flex-shrink: 0; padding: 0 12px 12px;
    transform: translateY(100%); max-height: 0; opacity: 0; overflow: hidden;
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1),
                max-height 0.25s cubic-bezier(0.4, 0, 0.2, 1),
                opacity 0.2s ease;
}

.tp-url-input--visible { transform: translateY(0); max-height: 60px; opacity: 1; }

.tp-url-input__bar {
    display: flex; align-items: center; gap: 8px;
    background: var(--glass-bg);
    border: 1px solid rgba(102, 126, 234, 0.3);
    border-radius: var(--radius-md);
    padding: 6px 8px 6px 14px;
}

.tp-url-input__field {
    flex: 1; background: none; border: none; outline: none;
    color: var(--text-primary); font-size: var(--text-sm); font-family: inherit; min-width: 0;
}

.tp-url-input__field::placeholder { color: var(--text-dim); }

.tp-url-input__send {
    flex-shrink: 0; width: 36px; height: 36px; border-radius: 50%; border: none;
    background: var(--gradient-primary); color: var(--text-primary);
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; transition: transform var(--transition-fast);
}

.tp-url-input__send:active { transform: scale(0.9); }

/* ── Event lozenge rows ── */

.tp-evt {
    display: flex; align-items: center; gap: 6px;
    padding: 2px 0; font-size: 11px; line-height: 1.4;
    font-family: var(--font-talk);
    animation: tp-msg-in 0.18s ease both;
}

.tp-evt__badge {
    display: inline-block;
    padding: 1px 5px; border-radius: 3px;
    font-size: 8px; font-weight: var(--font-weight-bold);
    text-transform: uppercase; letter-spacing: 0.03em;
    flex-shrink: 0; min-width: 40px; text-align: center;
}

.tp-evt__badge--intent   { background: var(--badge-intent-bg);   color: var(--badge-intent-fg); }
.tp-evt__badge--submit   { background: var(--badge-submit-bg);   color: var(--badge-submit-fg); }
.tp-evt__badge--complete { background: var(--badge-complete-bg); color: var(--badge-complete-fg); }
.tp-evt__badge--error    { background: var(--badge-error-bg);    color: var(--badge-error-fg); }
.tp-evt__badge--system   { background: var(--bg-tertiary);       color: var(--text-secondary); }
.tp-evt__badge--research { background: var(--teal);              color: var(--text-primary); opacity: 0.85; }
.tp-evt__badge--script   { background: var(--magenta);           color: var(--text-primary); opacity: 0.85; }
.tp-evt__badge--tts      { background: var(--color-warning);     color: #000; opacity: 0.85; }
.tp-evt__badge--mixing   { background: var(--color-warning);     color: #000; opacity: 0.85; }
.tp-evt__badge--images   { background: var(--color-warning);     color: #000; opacity: 0.85; }
.tp-evt__badge--video    { background: var(--pink);              color: var(--text-primary); opacity: 0.85; }

.tp-evt__msg {
    flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    color: var(--text-secondary);
}

.tp-evt__time {
    flex-shrink: 0; font-size: 9px;
    color: var(--text-dim); font-variant-numeric: tabular-nums;
}

/* ── Tab content area ── */

.tab-content { height: auto; } /* main scrolls, not tab-content */