/* ---- YouTube Analyzer v3 ---- */

.yt2-wrap { max-width:960px;margin:0 auto;padding:30px 1.5rem 2rem; }

/* =============== HERO BANNER =============== */
.yt2-hero {
    position:relative;border-radius:16px;overflow:hidden;
    padding:36px 36px 32px;margin-bottom:24px;
}
.yt2-hero-bg {
    position:absolute;inset:0;
    background:linear-gradient(135deg, rgba(124,92,252,0.14) 0%, rgba(6,182,212,0.07) 50%, rgba(124,92,252,0.04) 100%);
    border:1px solid rgba(124,92,252,0.15);border-radius:16px;
}
.yt2-hero-bg::before {
    content:'';position:absolute;
    top:-60%;right:-15%;width:380px;height:380px;
    background:radial-gradient(circle, rgba(124,92,252,0.1) 0%, transparent 70%);
    pointer-events:none;
}
.yt2-hero-content { position:relative;z-index:1; }
.yt2-hero-badge {
    display:inline-flex;align-items:center;gap:6px;
    background:rgba(124,92,252,0.12);border:1px solid rgba(124,92,252,0.2);
    border-radius:20px;padding:5px 14px;
    font-size:0.7rem;font-weight:600;color:#a78bfa;
    text-transform:uppercase;letter-spacing:0.5px;
    margin-bottom:14px;
}
.yt2-hero-title {
    font-size:1.5rem;font-weight:700;color:#374151;
    line-height:1.3;margin:0 0 10px;
}
.yt2-hero-accent {
    background:linear-gradient(135deg,#a78bfa,#22d3ee);
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;
}
.yt2-hero-desc {
    font-size:0.85rem;color:#4b5563;line-height:1.6;
    margin:0 0 20px;max-width:560px;
}

/* Input inside hero */
.yt-input-section { display:flex;gap:10px; }
.yt-url-input {
    flex:1;background:rgba(255,255,255,0.7);
    border:1px solid rgba(124,92,252,0.25);border-radius:12px;
    color:#374151;padding:13px 18px;font-size:0.88rem;
    outline:none;transition:border-color 0.2s;
    backdrop-filter:blur(8px);
}
.yt-url-input:focus { border-color:#7c5cfc;box-shadow:0 0 0 3px rgba(124,92,252,0.1); }
.yt-url-input::placeholder { color:#475569; }
.yt-analyze-btn {
    background:linear-gradient(135deg,#7c5cfc,#06b6d4);
    border:none;border-radius:12px;color:#fff;
    padding:13px 28px;font-size:0.88rem;font-weight:600;
    cursor:pointer;white-space:nowrap;
    transition:opacity 0.2s,transform 0.1s;
    display:flex;align-items:center;gap:8px;
    box-shadow:0 4px 16px rgba(124,92,252,0.25);
}
.yt-analyze-btn:hover { opacity:0.92;transform:translateY(-1px); }
.yt-analyze-btn:active { transform:scale(0.97); }
.yt-analyze-btn:disabled { opacity:0.5;cursor:not-allowed;transform:none; }

/* =============== EMPTY STATE: 3 MODE CARDS =============== */
.yt2-empty-modes {
    display:grid;grid-template-columns:repeat(3,1fr);gap:16px;
}
.yt2-empty-card {
    background:#f4f5fb;
    border-radius:14px;padding:24px 22px;
    box-shadow:0 2px 8px rgba(0,0,0,0.25);
    text-align:center;
    transition:all 0.25s;
}
.yt2-empty-card:hover {
    transform:translateY(-3px);
    box-shadow:0 8px 24px rgba(0,0,0,0.3);
}
.yt2-empty-card-icon {
    width:52px;height:52px;border-radius:14px;
    display:flex;align-items:center;justify-content:center;
    margin:0 auto 14px;
}
.yt2-ec-learn { background:linear-gradient(135deg,rgba(124,92,252,0.15),rgba(124,92,252,0.05));color:#a78bfa; }
.yt2-ec-fw { background:linear-gradient(135deg,rgba(6,182,212,0.15),rgba(6,182,212,0.05));color:#22d3ee; }
.yt2-ec-chat { background:linear-gradient(135deg,rgba(34,197,94,0.15),rgba(34,197,94,0.05));color:#4ade80; }
.yt2-empty-card h4 { font-size:0.92rem;font-weight:600;color:#374151;margin:0 0 8px; }
.yt2-empty-card p { font-size:0.78rem;color:#4b5563;line-height:1.5;margin:0 0 12px; }
.yt2-empty-card-cost {
    display:inline-flex;align-items:center;gap:4px;
    font-size:0.68rem;color:#475569;
    background:rgba(148,163,184,0.06);padding:3px 10px;border-radius:6px;
}

@media(max-width:768px){
    .yt2-empty-modes{grid-template-columns:1fr;}
    .yt2-hero{padding:24px 20px 20px;}
    .yt2-hero-title{font-size:1.2rem;}
    .yt-input-section{flex-direction:column;}
    .yt-analyze-btn{justify-content:center;}
}

/* =============== LOADING & ERROR =============== */
.yt2-loading { text-align:center;padding:48px 24px;color:#4b5563; }
.yt2-loading-spinner {
    width:40px;height:40px;
    border:3px solid rgba(124,92,252,0.2);border-top-color:#7c5cfc;
    border-radius:50%;animation:yt2Spin 0.8s linear infinite;
    margin:0 auto 16px;
}
@keyframes yt2Spin { to { transform:rotate(360deg); } }
.yt2-loading-sub { font-size:0.75rem;margin-top:8px;opacity:0.6; }
.yt2-error {
    background:rgba(239,68,68,0.08);border:1px solid rgba(239,68,68,0.2);
    border-radius:10px;padding:12px 16px;color:#f87171;font-size:0.85rem;
}

/* =============== VIDEO CARD =============== */
.yt2-video-card {
    display:flex;gap:16px;
    background:#1a1f2e;
    border-radius:14px;padding:14px;
    margin-bottom:16px;
    box-shadow:0 2px 8px rgba(0,0,0,0.25);
}
.yt2-video-thumb { width:180px;min-width:180px;border-radius:10px;overflow:hidden;flex-shrink:0; }
.yt2-video-thumb img { width:100%;height:auto;display:block;border-radius:10px; }
.yt2-video-info { flex:1;min-width:0; }
.yt2-video-title { font-size:0.95rem;font-weight:600;color:#374151;margin:0 0 4px;line-height:1.3; }
.yt2-video-channel { font-size:0.78rem;color:#a78bfa;margin-bottom:8px; }
.yt2-video-stats { display:flex;flex-wrap:wrap;gap:12px;margin-bottom:8px; }
.yt2-stat { display:flex;align-items:center;gap:4px;font-size:0.75rem;color:#4b5563; }
.yt2-badges { display:flex;gap:6px;flex-wrap:wrap; }
.yt2-badge { font-size:0.68rem;padding:3px 8px;border-radius:6px;display:inline-flex;align-items:center;gap:3px; }
.yt2-badge-ok { background:rgba(34,197,94,0.1);color:#4ade80; }
.yt2-badge-warn { background:rgba(251,146,60,0.1);color:#fb923c; }
.yt2-badge-info { background:rgba(6,182,212,0.1);color:#22d3ee; }

/* =============== TRANSCRIPT FALLBACK =============== */
.yt2-transcript-fallback {
    background:#f4f5fb;border-radius:12px;
    padding:16px 20px;margin-bottom:16px;
    border:1px solid rgba(124,92,252,0.15);
}
.yt2-tf-header { display:flex;align-items:center;gap:8px;margin-bottom:12px;font-size:0.88rem;color:#374151; }
.yt2-tf-steps { display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px; }
.yt2-tf-steps span { font-size:0.72rem;color:#4b5563;background:rgba(148,163,184,0.06);padding:4px 10px;border-radius:6px; }
.yt2-tf-steps strong { color:#a78bfa; }
.yt2-tf-textarea {
    width:100%;background:rgba(255,255,255,0.6);
    border:1px solid rgba(148,163,184,0.15);border-radius:10px;
    color:#374151;padding:10px 14px;font-size:0.82rem;
    outline:none;resize:vertical;min-height:80px;
    box-sizing:border-box;margin-bottom:10px;
}
.yt2-tf-textarea:focus { border-color:#7c5cfc; }
.yt2-tf-btn {
    display:inline-flex;align-items:center;gap:6px;
    background:linear-gradient(135deg,#7c5cfc,#06b6d4);
    border:none;border-radius:8px;color:#fff;
    padding:8px 18px;font-size:0.8rem;font-weight:600;cursor:pointer;
}

/* =============== MODE PILLS =============== */
.yt2-mode-pills {
    display:flex;gap:8px;margin-bottom:20px;
    padding:4px;background:rgba(255,255,255,0.4);
    border-radius:12px;border:1px solid rgba(148,163,184,0.08);
}
.yt2-pill {
    flex:1;display:flex;align-items:center;justify-content:center;gap:8px;
    padding:12px 16px;background:transparent;border:none;
    border-radius:10px;color:#4b5563;font-size:0.82rem;font-weight:500;
    cursor:pointer;transition:all 0.2s;position:relative;
}
.yt2-pill:hover { color:#374151;background:rgba(124,92,252,0.06); }
.yt2-pill-active {
    background:rgba(124,92,252,0.12) !important;
    color:#374151 !important;
    border:1px solid rgba(124,92,252,0.25);
    box-shadow:0 2px 8px rgba(124,92,252,0.1);
}
.yt2-pill-active i { color:#7c5cfc; }
.yt2-pill-cost {
    font-size:0.62rem;color:#475569;
    background:rgba(148,163,184,0.08);padding:2px 6px;border-radius:4px;margin-left:4px;
}
.yt2-pill-active .yt2-pill-cost { background:rgba(124,92,252,0.15);color:#a78bfa; }

/* =============== MODE CONTENT =============== */
.yt2-mode-content { min-height:200px; }
.yt2-mode-empty {
    text-align:center;padding:48px 24px;color:#475569;
    display:flex;flex-direction:column;align-items:center;gap:12px;
}
.yt2-analysis-raw {
    background:rgba(255,255,255,0.4);border:1px solid rgba(124,92,252,0.1);
    border-radius:14px;padding:20px 24px;
    font-size:0.85rem;color:#4b5563;line-height:1.6;
}

/* =============== MODE 1: Learn + Ideas =============== */
.yt2-learn-grid { display:flex;flex-direction:column;gap:16px; }
.yt2-learn-card {
    background:#f4f5fb;border-radius:14px;padding:20px 24px;
    box-shadow:0 2px 8px rgba(0,0,0,0.2);transition:all 0.2s;
}
.yt2-learn-card:hover { box-shadow:0 4px 16px rgba(0,0,0,0.3); }
.yt2-learn-header { display:flex;gap:14px;margin-bottom:16px; }
.yt2-learn-num {
    width:32px;height:32px;min-width:32px;
    background:linear-gradient(135deg,#7c5cfc,#06b6d4);
    border-radius:10px;color:#fff;font-size:0.85rem;font-weight:700;
    display:flex;align-items:center;justify-content:center;
}
.yt2-learn-title { font-size:0.92rem;font-weight:600;color:#374151;margin:0 0 4px;line-height:1.3; }
.yt2-learn-why { font-size:0.78rem;color:#4b5563;margin:0;line-height:1.4; }
.yt2-learn-ideas {
    background:rgba(255,255,255,0.4);border:1px solid rgba(124,92,252,0.08);
    border-radius:10px;padding:14px 16px;
}
.yt2-learn-ideas-label {
    font-size:0.72rem;font-weight:600;color:#a78bfa;
    text-transform:uppercase;letter-spacing:0.5px;
    margin-bottom:10px;display:flex;align-items:center;gap:6px;
}
.yt2-idea-row { display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-bottom:1px solid rgba(148,163,184,0.06); }
.yt2-idea-row:last-child { border-bottom:none; }
.yt2-idea-type {
    font-size:0.65rem;font-weight:600;padding:3px 8px;border-radius:6px;
    white-space:nowrap;text-transform:uppercase;letter-spacing:0.3px;flex-shrink:0;margin-top:2px;
}
.yt2-idea-type-reel { background:rgba(239,68,68,0.12);color:#f87171; }
.yt2-idea-type-carrusel { background:rgba(6,182,212,0.12);color:#22d3ee; }
.yt2-idea-type-story { background:rgba(251,146,60,0.12);color:#fb923c; }
.yt2-idea-type-video { background:rgba(124,92,252,0.12);color:#a78bfa; }
.yt2-idea-type-post { background:rgba(34,197,94,0.12);color:#4ade80; }
.yt2-idea-content { flex:1;min-width:0; }
.yt2-idea-content strong { color:#374151;font-size:0.82rem;display:block;margin-bottom:2px; }
.yt2-idea-dato { color:#4b5563;font-size:0.78rem;line-height:1.4; }

/* =============== MODE 2: Framework =============== */
.yt2-fw-header {
    background:rgba(124,92,252,0.08);border:1px solid rgba(124,92,252,0.15);
    border-radius:12px;padding:16px 20px;margin-bottom:20px;
}
.yt2-fw-name {
    font-size:1.05rem;font-weight:700;
    background:linear-gradient(135deg,#a78bfa,#22d3ee);
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:4px;
}
.yt2-fw-summary { font-size:0.82rem;color:#4b5563;margin:0;line-height:1.4; }
.yt2-fw-timeline { position:relative;padding-left:24px; }
.yt2-fw-timeline::before {
    content:'';position:absolute;left:7px;top:0;bottom:0;width:2px;
    background:linear-gradient(180deg,#7c5cfc 0%,rgba(124,92,252,0.1) 100%);border-radius:1px;
}
.yt2-fw-node { position:relative;margin-bottom:16px;padding-left:20px; }
.yt2-fw-node-marker {
    position:absolute;left:-20px;top:6px;width:16px;height:16px;border-radius:50%;
    border:3px solid #f8f9fc;box-shadow:0 0 0 2px rgba(124,92,252,0.3);
}
.yt2-fw-node-content {
    background:#f4f5fb;border-radius:12px;padding:16px 20px;
    box-shadow:0 2px 8px rgba(0,0,0,0.2);
}
.yt2-fw-node-top { display:flex;align-items:center;gap:8px;margin-bottom:8px; }
.yt2-fw-timestamp { font-size:0.7rem;font-weight:600;color:#475569;font-family:'SF Mono','Fira Code',monospace; }
.yt2-fw-node-tag { font-size:0.65rem;font-weight:600;padding:3px 8px;border-radius:6px;text-transform:uppercase;letter-spacing:0.3px; }
.yt2-fw-node-text { font-size:0.85rem;color:#4b5563;line-height:1.5;margin:0 0 8px;font-style:italic; }
.yt2-fw-node-details { display:flex;flex-direction:column;gap:4px; }
.yt2-fw-detail { font-size:0.78rem;color:#4b5563;line-height:1.4; }
.yt2-fw-detail strong { color:#a78bfa; }
.yt2-fw-template {
    background:#f4f5fb;border:1px solid rgba(124,92,252,0.15);
    border-radius:12px;margin-top:20px;overflow:hidden;
}
.yt2-fw-template-header {
    display:flex;align-items:center;gap:8px;padding:12px 20px;
    background:rgba(124,92,252,0.08);font-size:0.82rem;font-weight:600;color:#a78bfa;
}
.yt2-fw-copy-btn {
    margin-left:auto;background:transparent;border:1px solid rgba(167,139,250,0.2);
    border-radius:6px;color:#a78bfa;padding:4px 12px;font-size:0.72rem;cursor:pointer;transition:all 0.2s;
}
.yt2-fw-copy-btn:hover { background:rgba(124,92,252,0.12); }
.yt2-fw-template-content {
    padding:16px 20px;margin:0;
    font-family:'SF Mono','Fira Code',monospace;
    font-size:0.8rem;color:#4b5563;line-height:1.6;
    white-space:pre-wrap;background:transparent;border:none;
}

/* =============== CHAT =============== */
.yt2-chat-container {
    display:flex;flex-direction:column;
    height:calc(100vh - 340px);
    min-height:350px;
    background:#ffffff;
    border:1px solid rgba(148,163,184,0.08);
    border-radius:16px;
    overflow:hidden;
}

/* Welcome */
.yt2-chat-welcome {
    text-align:center;padding:20px;color:#475569;font-size:0.82rem;line-height:1.5;
}

/* Messages - scrollable middle */
.yt2-chat-messages {
    flex:1;overflow-y:auto;
    display:flex;flex-direction:column;gap:6px;
    padding:16px 20px;
}

/* Suggestions - above input */
.yt2-chat-suggestions {
    display:flex;flex-wrap:wrap;gap:6px;
    padding:0 20px 12px;flex-shrink:0;
}
.yt2-chat-sug {
    background:rgba(124,92,252,0.06);
    border:1px solid rgba(124,92,252,0.12);
    border-radius:10px;color:#a78bfa;
    padding:7px 14px;font-size:0.75rem;cursor:pointer;
    transition:all 0.2s;
}
.yt2-chat-sug:hover { background:rgba(124,92,252,0.14);border-color:#7c5cfc; }

/* Input box - fixed at bottom */
.yt2-chat-input-box {
    flex-shrink:0;
    border-top:1px solid rgba(148,163,184,0.08);
    background:#f4f5fb;
    padding:14px 20px 12px;
    transition:border-color 0.2s,box-shadow 0.2s;
}
.yt2-chat-input-box:focus-within {
    border-color:rgba(124,92,252,0.25);
    box-shadow:0 0 0 3px rgba(124,92,252,0.06);
}
.yt2-chat-input {
    width:100%;background:transparent;border:none;
    color:#374151;padding:0;font-size:0.9rem;
    outline:none;resize:none;
    min-height:52px;max-height:140px;line-height:1.5;
    font-family:inherit;box-sizing:border-box;
}
.yt2-chat-input::placeholder { color:#475569; }
.yt2-chat-input-actions {
    display:flex;align-items:center;justify-content:space-between;
    margin-top:10px;padding-top:10px;
    border-top:1px solid rgba(148,163,184,0.06);
}
.yt2-chat-input-hint {
    font-size:0.68rem;color:#475569;
    display:flex;align-items:center;gap:4px;
}
.yt2-chat-send {
    background:linear-gradient(135deg,#7c5cfc,#06b6d4);
    border:none;border-radius:10px;color:#fff;
    width:38px;height:38px;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    transition:all 0.2s;flex-shrink:0;
}
.yt2-chat-send:hover { opacity:0.85;transform:scale(1.05); }
.yt2-chat-send:disabled { opacity:0.3;cursor:not-allowed;transform:none; }

/* Suggestions - below input as pills */
.yt2-chat-suggestions { display:flex;flex-wrap:wrap;gap:6px; }
.yt2-chat-sug {
    background:rgba(124,92,252,0.06);
    border:1px solid rgba(124,92,252,0.12);
    border-radius:10px;color:#a78bfa;
    padding:8px 16px;font-size:0.78rem;cursor:pointer;
    transition:all 0.2s;
}
.yt2-chat-sug:hover { background:rgba(124,92,252,0.14);border-color:#7c5cfc;transform:translateY(-1px); }


.yt2-chat-msg { display:flex;gap:8px;align-items:flex-start; }
.yt2-chat-msg-user { justify-content:flex-end; }
.yt2-chat-msg-user .yt2-chat-bubble {
    background:linear-gradient(135deg,#7c5cfc,#6d28d9);
    color:#fff;border-radius:14px 14px 4px 14px;max-width:80%;
}
.yt2-chat-msg-assistant .yt2-chat-bubble {
    background:#f4f5fb;color:#4b5563;
    border:1px solid rgba(148,163,184,0.06);
    border-radius:14px 14px 14px 4px;max-width:90%;
}
.yt2-chat-bubble { padding:10px 14px;font-size:0.82rem;line-height:1.4; }
.yt2-chat-bubble strong { color:#a78bfa; }
.yt2-typing span {
    display:inline-block;width:6px;height:6px;border-radius:50%;
    background:#7c5cfc;margin:0 2px;animation:yt2Bounce 1.2s infinite;
}
.yt2-typing span:nth-child(2) { animation-delay:0.2s; }
.yt2-typing span:nth-child(3) { animation-delay:0.4s; }
@keyframes yt2Bounce { 0%,60%,100%{transform:translateY(0);} 30%{transform:translateY(-6px);} }

/* =============== SAVE LEARNING BUTTON =============== */
.yt2-save-learning-btn {
    display:inline-flex;align-items:center;gap:5px;
    background:none;border:1px solid rgba(124,92,252,0.2);
    border-radius:8px;color:#a78bfa;
    padding:4px 12px;font-size:0.7rem;cursor:pointer;
    margin-top:6px;transition:all 0.2s;
}
.yt2-save-learning-btn:hover {
    background:rgba(124,92,252,0.08);border-color:#7c5cfc;
}

/* =============== LEARNINGS BUTTON & PANEL =============== */
.yt2-learnings-btn {
    display:inline-flex;align-items:center;gap:6px;
    background:rgba(124,92,252,0.08);
    border:1px solid rgba(124,92,252,0.2);
    border-radius:20px;color:#a78bfa;
    padding:5px 14px;font-size:0.72rem;font-weight:600;
    cursor:pointer;transition:all 0.2s;
}
.yt2-learnings-btn:hover { background:rgba(124,92,252,0.15);border-color:#7c5cfc; }
.yt2-learnings-badge {
    background:rgba(124,92,252,0.2);color:#a78bfa;
    padding:1px 7px;border-radius:10px;font-size:0.62rem;
    font-weight:700;min-width:14px;text-align:center;
}

.yt2-learnings-panel {
    background:#f4f5fb;border-radius:14px;
    border:1px solid rgba(124,92,252,0.12);
    margin-top:20px;padding:20px;
    max-height:500px;overflow-y:auto;
}
.yt2-learnings-list { display:flex;flex-direction:column;gap:12px; }
.yt2-learning-item {
    background:rgba(255,255,255,0.5);
    border:1px solid rgba(148,163,184,0.06);
    border-radius:10px;padding:14px 16px;
}
.yt2-learning-meta {
    display:flex;align-items:center;gap:8px;margin-bottom:8px;
}
.yt2-learning-video {
    font-size:0.72rem;font-weight:600;color:#a78bfa;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;
}
.yt2-learning-date { font-size:0.65rem;color:#475569; }
.yt2-learning-delete {
    background:none;border:none;color:#475569;cursor:pointer;
    font-size:1rem;padding:0 4px;transition:color 0.2s;
}
.yt2-learning-delete:hover { color:#f87171; }
.yt2-learning-content {
    font-size:0.78rem;color:#4b5563;line-height:1.45;
}
.yt2-learning-content strong { color:#a78bfa; }

/* =============== HISTORY PANEL =============== */
.yt2-history-panel { margin-top:4px; }
.yt2-history-title {
    display:flex;align-items:center;gap:8px;
    font-size:0.82rem;font-weight:600;color:#4b5563;
    margin-bottom:14px;
}
.yt2-history-grid {
    display:grid;grid-template-columns:repeat(3,1fr);gap:12px;
}
@media(max-width:768px){.yt2-history-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px){.yt2-history-grid{grid-template-columns:1fr;}}

.yt2-history-card {
    display:flex;gap:10px;
    background:#f4f5fb;border-radius:10px;
    padding:10px;cursor:pointer;
    box-shadow:0 2px 6px rgba(0,0,0,0.2);
    transition:all 0.2s;
}
.yt2-history-card:hover {
    transform:translateY(-2px);
    box-shadow:0 6px 16px rgba(0,0,0,0.3),0 0 0 1px rgba(124,92,252,0.15);
}
.yt2-history-thumb { width:80px;min-width:80px;border-radius:8px;overflow:hidden;flex-shrink:0; }
.yt2-history-thumb img { width:100%;height:auto;display:block;border-radius:8px; }
.yt2-history-info { flex:1;min-width:0;display:flex;flex-direction:column;gap:2px; }
.yt2-history-card-title {
    font-size:0.75rem;font-weight:600;color:#374151;
    line-height:1.3;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.yt2-history-card-channel { font-size:0.68rem;color:#a78bfa; }
.yt2-history-card-date { font-size:0.62rem;color:#475569;margin-top:auto; }

/* Compact text formatting */
.yt2-h2 { color:#a78bfa;font-size:0.88rem;display:block;margin:8px 0 3px; }
.yt2-h3 { color:#7c5cfc;font-size:0.84rem;display:block;margin:6px 0 2px; }
.yt2-li { display:block;padding-left:6px;margin:1px 0; }

/* Code blocks */
.yt-code-block {
    background: rgba(0,0,0,0.05);border:1px solid rgba(124,92,252,0.15);
    border-radius:8px;padding:12px 14px;
    font-family:'SF Mono','Fira Code',monospace;
    font-size:0.78rem;color:#4b5563;overflow-x:auto;
    margin:8px 0;white-space:pre;line-height:1.5;
}
.yt-inline-code {
    background:rgba(124,92,252,0.12);color:#a78bfa;
    padding:1px 6px;border-radius:4px;
    font-family:'SF Mono','Fira Code',monospace;font-size:0.82em;
}

/* Mobile */
@media (max-width: 768px) {
    .yt2-video-card { flex-direction:column; }
    .yt2-video-thumb { width:100%;min-width:unset; }
    .yt2-mode-pills { flex-direction:column; }
    .yt2-pill { justify-content:flex-start; }
    .yt2-fw-timeline { padding-left:20px; }
}
