body { background: #050508; color: #e2e8f0; margin: 0; font-family: 'Inter', sans-serif; }
      .article-header {
        padding: 120px 24px 60px;
        text-align: center;
        background: linear-gradient(to bottom, #0f0f1a, #050508);
      }
      .article-header .back-link {
        color: var(--accent, #6366f1);
        text-decoration: none;
        font-weight: 800;
        display: inline-block;
        margin-bottom: 24px;
      }
      .article-header h1 {
        font-family: 'Manrope', var(--font-display, sans-serif);
        font-size: 44px;
        font-weight: 800;
        letter-spacing: -2px;
        line-height: 1.15;
        max-width: 760px;
        margin: 0 auto 16px;
      }
      .article-meta { color: #94a3b8; font-size: 15px; }
      .article-body {
        max-width: 760px;
        margin: 0 auto;
        padding: 60px 24px 80px;
        line-height: 1.8;
        font-size: 17px;
      }
      .article-body h2 {
        font-family: 'Manrope', sans-serif;
        font-size: 28px;
        font-weight: 700;
        margin: 48px 0 16px;
        letter-spacing: -0.5px;
      }
      .article-body h3 { font-size: 22px; font-weight: 600; margin: 36px 0 12px; }
      .article-body p { margin: 0 0 20px; color: #cbd5e1; }
      .article-body a { color: var(--accent, #6366f1); text-decoration: underline; }
      .article-body ul, .article-body ol { margin: 0 0 20px; padding-left: 24px; color: #cbd5e1; }
      .article-body li { margin-bottom: 8px; }
      .article-body blockquote {
        border-left: 3px solid var(--accent, #6366f1);
        margin: 24px 0;
        padding: 16px 24px;
        background: rgba(255,255,255,0.03);
        border-radius: 0 12px 12px 0;
        color: #94a3b8;
        font-style: italic;
      }
      .article-body img { width: 100%; border-radius: 16px; margin: 32px 0; }
      .article-body table { width: 100%; border-collapse: collapse; margin: 24px 0; }
      .article-body th, .article-body td { padding: 12px 16px; border: 1px solid rgba(255,255,255,0.1); text-align: left; }
      .article-body th { background: rgba(255,255,255,0.05); font-weight: 600; }
      .article-body code { background: rgba(255,255,255,0.08); padding: 2px 8px; border-radius: 6px; font-size: 15px; }
      .phrase-card {
        background: rgba(255,255,255,0.04);
        border: 1px solid rgba(255,255,255,0.1);
        border-radius: 16px;
        padding: 20px 24px;
        margin: 16px 0;
      }
      .phrase-card .viet { font-size: 20px; font-weight: 700; color: #e2e8f0; }
      .phrase-card .pronunciation { color: #94a3b8; font-style: italic; margin: 4px 0; }
      .phrase-card .english { color: #64748b; font-size: 14px; }
      .article-cta {
        background: linear-gradient(135deg, rgba(99,102,241,0.15), rgba(168,85,247,0.1));
        border: 1px solid rgba(99,102,241,0.3);
        border-radius: 20px;
        padding: 40px;
        text-align: center;
        margin: 48px 0;
      }
      .article-cta h3 { margin: 0 0 12px; font-size: 24px; }
      .article-cta p { color: #94a3b8; margin: 0 0 24px; }
      .article-cta a.cta-btn {
        display: inline-block;
        background: var(--accent, #6366f1);
        color: #fff;
        padding: 14px 32px;
        border-radius: 12px;
        text-decoration: none;
        font-weight: 700;
        font-size: 16px;
      }

      [data-theme="light"] body { background: #f8fafc; color: #0f172a; }
      [data-theme="light"] .article-header { background: #fff; border-bottom: 1px solid #e2e8f0; }
      [data-theme="light"] .article-header h1 { color: #0f172a; }
      [data-theme="light"] .article-body p,
      [data-theme="light"] .article-body li { color: #334155; }
      [data-theme="light"] .article-body blockquote { background: #f1f5f9; color: #475569; }
      [data-theme="light"] .article-body th { background: #f1f5f9; }
      [data-theme="light"] .article-body th, [data-theme="light"] .article-body td { border-color: #e2e8f0; }
      [data-theme="light"] .phrase-card { background: #f8fafc; border-color: #e2e8f0; }
      [data-theme="light"] .phrase-card .viet { color: #0f172a; }
      [data-theme="light"] .article-cta { background: linear-gradient(135deg, rgba(99,102,241,0.08), rgba(168,85,247,0.05)); border-color: rgba(99,102,241,0.2); }
