/* ProResume AI — Premium Resume Templates */

.resume-preview {
  background: #fff;
  color: #1e293b;
  min-height: auto;
  font-size: 10pt;
  line-height: 1.55;
  font-family: 'Inter', system-ui, sans-serif;
  width: 100%;
  overflow: visible;
}

/* Contact info — prevent browser auto-link styling in templates */
#resume-preview .tm-contact,
#resume-preview .tm-contact-item,
#resume-preview .tm-contact span,
#resume-preview .tm-contact div,
#resume-preview .tm-sidebar .tm-contact-item,
#resume-preview .tm-themed-contact,
.page-preview .tm-contact,
.page-preview .tm-contact-item,
.page-preview .tm-contact span,
.page-preview .tm-contact div,
.page-preview .tm-themed-contact,
.resume-document .tm-contact,
.resume-document .tm-contact-item,
.resume-document .tm-contact span,
.resume-document .tm-contact div,
.resume-document .tm-themed-contact,
.resume-export-clone .tm-contact,
.resume-export-clone .tm-contact-item {
  color: inherit;
  text-decoration: none;
  -webkit-text-fill-color: inherit;
}

#resume-preview a[href^="tel:"],
#resume-preview a[href^="mailto:"],
.page-preview a[href^="tel:"],
.page-preview a[href^="mailto:"],
.resume-document a[href^="tel:"],
.resume-document a[href^="mailto:"],
.resume-export-clone a[href^="tel:"],
.resume-export-clone a[href^="mailto:"] {
  color: inherit !important;
  text-decoration: none !important;
  pointer-events: none;
}

/* ─── MODERN (sidebar) ─── */
.tm-modern {
  display: grid;
  grid-template-columns: 220px 1fr;
  min-height: auto;
}
.tm-modern > * { min-width: 0; }
.tm-modern .tm-sidebar {
  background: linear-gradient(180deg, #0f766e 0%, #115e59 100%);
  color: #fff;
  padding: 28px 20px;
}
.tm-modern .tm-sidebar .tm-name {
  font-size: 17pt;
  font-weight: 700;
  line-height: 1.2;
  margin: 0 0 6px;
  letter-spacing: -0.02em;
}
.tm-modern .tm-sidebar .tm-title {
  font-size: 9pt;
  color: #99f6e4;
  margin: 0 0 20px;
  font-weight: 500;
}
.tm-modern .tm-sidebar .tm-side-section { margin-bottom: 20px; }
.tm-modern .tm-sidebar .tm-side-label {
  font-size: 7.5pt;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #5eead4;
  margin-bottom: 8px;
  padding-bottom: 4px;
  border-bottom: 1px solid rgba(255,255,255,0.2);
}
.tm-modern .tm-sidebar .tm-contact-item {
  font-size: 8pt;
  color: #ccfbf1;
  margin-bottom: 6px;
  display: flex;
  align-items: flex-start;
  gap: 6px;
  word-break: break-word;
}
.tm-modern .tm-sidebar .tm-contact-item i { width: 12px; flex-shrink: 0; margin-top: 2px; opacity: 0.7; }
.tm-modern .tm-sidebar .tm-skill-pill {
  display: inline-block;
  background: rgba(255,255,255,0.15);
  padding: 3px 8px;
  border-radius: 4px;
  font-size: 7.5pt;
  margin: 2px 3px 2px 0;
}
.tm-modern .tm-main { padding: 28px 30px; }
.tm-modern .tm-section { margin-bottom: 22px; }
.tm-modern .tm-section-title {
  font-size: 9pt;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #0f766e;
  margin-bottom: 10px;
  padding-bottom: 5px;
  border-bottom: 2px solid #0f766e;
}
.tm-modern .tm-summary { color: #475569; font-size: 9.5pt; line-height: 1.65; }
.tm-modern .tm-entry { margin-bottom: 16px; }
.tm-modern .tm-entry-top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 4px;
}
.tm-modern .tm-entry-role { font-weight: 700; font-size: 10.5pt; color: #0f172a; }
.tm-modern .tm-entry-company { color: #0f766e; font-weight: 600; font-size: 9.5pt; }
.tm-modern .tm-entry-dates { font-size: 8pt; color: #94a3b8; white-space: normal; }
.tm-modern .tm-bullets { margin: 6px 0 0; padding-left: 16px; color: #475569; font-size: 9pt; }
.tm-modern .tm-bullets li { margin-bottom: 3px; }

/* ─── CLASSIC ─── */
.tm-classic { padding: 36px 40px; font-family: 'Merriweather', Georgia, serif; }
.tm-classic .tm-header { text-align: center; margin-bottom: 24px; padding-bottom: 18px; border-bottom: 2px solid #1e293b; }
.tm-classic .tm-name { font-size: 24pt; font-weight: 700; margin: 0 0 4px; letter-spacing: 0.02em; }
.tm-classic .tm-title { font-size: 11pt; color: #64748b; margin: 0 0 10px; font-style: italic; font-family: 'Inter', sans-serif; }
.tm-classic .tm-contact { font-size: 8.5pt; color: #64748b; font-family: 'Inter', sans-serif; }
.tm-classic .tm-contact span + span::before { content: ' | '; }
.tm-classic .tm-section { margin-bottom: 20px; }
.tm-classic .tm-section-title {
  font-size: 10pt;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  margin-bottom: 10px;
  font-family: 'Inter', sans-serif;
}
.tm-classic .tm-entry { margin-bottom: 14px; }
.tm-classic .tm-entry-role { font-weight: 700; font-size: 10.5pt; }
.tm-classic .tm-entry-meta { font-size: 9pt; color: #64748b; font-family: 'Inter', sans-serif; margin-bottom: 4px; }
.tm-classic .tm-bullets { margin: 4px 0 0; padding-left: 18px; font-size: 9.5pt; color: #334155; font-family: 'Inter', sans-serif; }
.tm-classic .tm-bullets li { margin-bottom: 3px; }
.tm-classic .tm-summary { font-size: 9.5pt; color: #334155; line-height: 1.65; }
.tm-classic .tm-entry-top { margin-bottom: 2px; }
.tm-classic .tm-entry-company { font-size: 9pt; color: #64748b; font-family: 'Inter', sans-serif; }
.tm-classic .tm-entry-dates { font-size: 8.5pt; color: #94a3b8; font-family: 'Inter', sans-serif; }

/* ─── MINIMAL ─── */
.tm-minimal { padding: 40px 44px; }
.tm-minimal .tm-name { font-size: 28pt; font-weight: 300; letter-spacing: -0.03em; margin: 0 0 2px; color: #0f172a; }
.tm-minimal .tm-title { font-size: 10pt; color: #94a3b8; margin: 0 0 16px; font-weight: 400; letter-spacing: 0.05em; text-transform: uppercase; }
.tm-minimal .tm-contact { font-size: 8pt; color: #64748b; margin-bottom: 32px; letter-spacing: 0.03em; }
.tm-minimal .tm-section-title {
  font-size: 7.5pt;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: #94a3b8;
  margin-bottom: 12px;
}
.tm-minimal .tm-summary { font-size: 10pt; color: #475569; line-height: 1.7; }
.tm-minimal .tm-entry { margin-bottom: 18px; }
.tm-minimal .tm-entry-role { font-weight: 600; font-size: 10pt; color: #0f172a; }
.tm-minimal .tm-entry-meta { font-size: 8.5pt; color: #94a3b8; margin: 2px 0 6px; }
.tm-minimal .tm-bullets { margin: 0; padding-left: 0; list-style: none; font-size: 9pt; color: #64748b; }
.tm-minimal .tm-bullets li { margin-bottom: 4px; padding-left: 12px; border-left: 2px solid #e2e8f0; }
.tm-minimal .tm-skills { display: flex; flex-wrap: wrap; gap: 6px; }
.tm-minimal .tm-skill-pill { font-size: 8pt; color: #64748b; padding: 2px 0; }
.tm-minimal .tm-skill-pill + .tm-skill-pill::before { content: '·'; margin-right: 6px; color: #e2e8f0; }

/* ─── EXECUTIVE ─── */
.tm-executive { min-height: auto; }
.tm-executive .tm-exec-header {
  background: #0f172a;
  color: #fff;
  padding: 32px 40px 28px;
}
.tm-executive .tm-name { font-size: 26pt; font-weight: 700; margin: 0 0 4px; letter-spacing: -0.02em; }
.tm-executive .tm-title { font-size: 11pt; color: #94a3b8; margin: 0 0 14px; font-weight: 400; }
.tm-executive .tm-contact { display: flex; flex-wrap: wrap; gap: 16px; font-size: 8.5pt; color: #cbd5e1; }
.tm-executive .tm-contact-item { display: flex; align-items: center; gap: 5px; }
.tm-executive .tm-exec-body { padding: 28px 40px; display: grid; grid-template-columns: 1fr 200px; gap: 30px; }
.tm-executive .tm-section { margin-bottom: 20px; }
.tm-executive .tm-section-title {
  font-size: 8.5pt;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #0f172a;
  margin-bottom: 10px;
  padding-bottom: 4px;
  border-bottom: 1px solid #e2e8f0;
}
.tm-executive .tm-entry { margin-bottom: 14px; }
.tm-executive .tm-entry-top { display: flex; justify-content: space-between; margin-bottom: 3px; }
.tm-executive .tm-entry-role { font-weight: 700; font-size: 10pt; }
.tm-executive .tm-entry-dates { font-size: 8pt; color: #94a3b8; }
.tm-executive .tm-entry-company { font-size: 9pt; color: #475569; margin-bottom: 4px; }
.tm-executive .tm-bullets { margin: 0; padding-left: 16px; font-size: 9pt; color: #475569; }
.tm-executive .tm-bullets li { margin-bottom: 3px; }
.tm-executive .tm-side-skills .tm-skill-pill {
  display: block;
  font-size: 8.5pt;
  color: #475569;
  padding: 4px 0;
  border-bottom: 1px solid #f1f5f9;
}

/* ─── STANFORD (academic-professional) ─── */
.tm-stanford { padding: 32px 38px; }
.tm-stanford .tm-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 20px; padding-bottom: 16px; border-bottom: 3px solid #991b1b; }
.tm-stanford .tm-name { font-size: 22pt; font-weight: 700; color: #1e293b; margin: 0 0 2px; }
.tm-stanford .tm-title { font-size: 10pt; color: #64748b; margin: 0; }
.tm-stanford .tm-contact { text-align: right; font-size: 8pt; color: #64748b; line-height: 1.7; }
.tm-stanford .tm-body { display: grid; grid-template-columns: 1fr 180px; gap: 24px; }
.tm-stanford .tm-section { margin-bottom: 18px; }
.tm-stanford .tm-section-title {
  font-size: 9pt;
  font-weight: 700;
  color: #991b1b;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 8px;
}
.tm-stanford .tm-entry { margin-bottom: 12px; }
.tm-stanford .tm-entry-role { font-weight: 700; font-size: 10pt; }
.tm-stanford .tm-entry-meta { font-size: 8.5pt; color: #64748b; }
.tm-stanford .tm-bullets { margin: 4px 0 0; padding-left: 16px; font-size: 9pt; color: #475569; }
.tm-stanford .tm-side-section { margin-bottom: 16px; }
.tm-stanford .tm-side-title { font-size: 8pt; font-weight: 700; text-transform: uppercase; color: #991b1b; margin-bottom: 6px; }
.tm-stanford .tm-skill-item { font-size: 8.5pt; color: #475569; margin-bottom: 3px; }
.tm-stanford .tm-summary { font-size: 9.5pt; color: #475569; line-height: 1.65; }
.tm-executive .tm-summary { font-size: 9.5pt; color: #475569; line-height: 1.65; }

/* ─── CREATIVE ─── */
.tm-creative { padding: 0; min-height: auto; }
.tm-creative .tm-creative-header {
  padding: 30px 36px 24px;
  border-left: 6px solid #7c3aed;
  background: linear-gradient(135deg, #faf5ff 0%, #fff 60%);
}
.tm-creative .tm-name { font-size: 24pt; font-weight: 800; color: #1e1b4b; margin: 0 0 2px; letter-spacing: -0.03em; }
.tm-creative .tm-title { font-size: 11pt; color: #7c3aed; font-weight: 600; margin: 0 0 12px; }
.tm-creative .tm-contact { font-size: 8.5pt; color: #64748b; }
.tm-creative .tm-creative-body { padding: 24px 36px 36px; }
.tm-creative .tm-section { margin-bottom: 20px; }
.tm-creative .tm-section-title {
  font-size: 9pt;
  font-weight: 700;
  color: #7c3aed;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.tm-creative .tm-section-title::after { content: ''; flex: 1; height: 1px; background: #e9d5ff; }
.tm-creative .tm-summary { font-size: 9.5pt; color: #475569; line-height: 1.65; }
.tm-creative .tm-entry { margin-bottom: 14px; padding-left: 12px; border-left: 2px solid #ede9fe; }
.tm-creative .tm-entry-role { font-weight: 700; font-size: 10.5pt; color: #1e1b4b; }
.tm-creative .tm-entry-meta { font-size: 8.5pt; color: #7c3aed; margin: 2px 0 5px; }
.tm-creative .tm-bullets { margin: 0; padding-left: 14px; font-size: 9pt; color: #475569; }
.tm-creative .tm-skills { display: flex; flex-wrap: wrap; gap: 6px; }
.tm-creative .tm-skill-pill {
  background: #f3e8ff;
  color: #6d28d9;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 8pt;
  font-weight: 500;
}

/* Template selector thumbnails */
.tpl-thumb {
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 6px;
  position: relative;
}
.tpl-thumb-portrait { aspect-ratio: 8.5/11; }
.tpl-thumb-landscape { aspect-ratio: 11/8.5; }
.tpl-thumb-modern { background: linear-gradient(90deg, #0f766e 35%, #fff 35%); }
.tpl-thumb-classic { background: #fff; border-top: 3px solid #1e293b; }
.tpl-thumb-minimal { background: #fff; display: flex; flex-direction: column; justify-content: flex-start; padding: 4px; gap: 2px; }
.tpl-thumb-minimal::before { content: ''; display: block; width: 60%; height: 3px; background: #e2e8f0; }
.tpl-thumb-executive { background: linear-gradient(180deg, #0f172a 30%, #fff 30%); }
.tpl-thumb-stanford { background: #fff; border-bottom: 2px solid #991b1b; }
.tpl-thumb-creative { background: linear-gradient(135deg, #faf5ff, #fff); border-left: 3px solid #7c3aed; }

/* AI button loading */
.ai-loading { opacity: 0.6; pointer-events: none; }
.ai-loading i { animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* Export clone rules consolidated in export-fidelity.css */

/* ─── UNIQUE SKILLS STYLES PER TEMPLATE ─── */
.tm-skills-wrap { display: flex; flex-wrap: wrap; gap: 6px; align-items: flex-start; }
.tm-skill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1.3;
  box-sizing: border-box;
  font-size: 8pt;
  white-space: normal;
  word-break: break-word;
  overflow-wrap: break-word;
  text-align: center;
  max-width: 100%;
}

.tm-skill-modern-side { background: rgba(255,255,255,0.15); color: #fff; padding: 4px 8px; border-radius: 4px; margin: 2px 3px 2px 0; }
.tm-skills-inline-dots, .tm-skills-compact, .tm-skills-elegant, .tm-skills-academic { font-size: 9pt; color: #475569; line-height: 1.6; margin: 0; }
.tm-skill-minimal { color: #64748b; padding: 2px 0; }
.tm-skill-minimal + .tm-skill-minimal::before { content: '·'; margin: 0 6px; color: #e2e8f0; }
.tm-skill-exec { display: block; width: 100%; background: rgba(255,255,255,0.1); color: #e2e8f0; padding: 5px 10px; border-radius: 4px; margin-bottom: 5px; font-size: 8pt; }
.tm-skill-stanford { font-size: 8.5pt; color: #475569; padding: 3px 0; border-bottom: 1px dotted #e2e8f0; }
.tm-skill-creative { background: #ede9fe; color: #5b21b6; padding: 4px 10px; border-radius: 20px; border: 1px solid #c4b5fd; }
.tm-skill-corp { background: #dbeafe; color: #1e3a5f; padding: 4px 10px; border-radius: 3px; border-left: 3px solid #1e3a5f; }
.tm-skills-elegant { font-style: italic; color: #78716c; }
.tm-skill-tech { background: #f0f9ff; color: #0369a1; padding: 3px 8px; border-radius: 2px; font-family: ui-monospace, monospace; border: 1px solid #bae6fd; }
.tm-skill-harvard { background: #fef2f2; color: #7f1d1d; padding: 4px 10px; border-radius: 2px; border-bottom: 2px solid #7f1d1d; }
.tm-skill-luxury { background: transparent; color: #1c1917; padding: 4px 12px; border: 1px solid #d4d4d4; letter-spacing: 0.08em; text-transform: uppercase; font-size: 7pt; }
.tm-skill-intl { display: block; width: 100%; color: #1e3a8a; padding: 4px 0 4px 12px; border-left: 3px solid #3b82f6; margin-bottom: 4px; }
.tm-skill-bold { background: #000; color: #fff; padding: 5px 12px; font-weight: 700; text-transform: uppercase; font-size: 7.5pt; letter-spacing: 0.05em; }
.tm-skill-refined { background: #fef9e7; color: #92400e; padding: 4px 10px; border: 1px solid #fde68a; border-radius: 2px; }
.tm-skill-horizon { background: #e0f2fe; color: #0369a1; padding: 4px 10px; border-radius: 4px; border-bottom: 2px solid #0ea5e9; }
.tm-skill-metro { font-size: 8.5pt; color: #1e3a5f; padding: 4px 0; border-bottom: 2px solid #f97316; margin-bottom: 4px; }
.tm-skill-metro-pill { background: #fff7ed; color: #c2410c; padding: 4px 8px; border-radius: 4px; }
.tm-skill-slate { display: block; width: 100%; background: rgba(255,255,255,0.1); color: #e2e8f0; padding: 5px 8px; border-radius: 4px; margin-bottom: 4px; font-size: 7.5pt; }
.tm-skill-nova { background: rgba(167,139,250,0.2); color: #c4b5fd; padding: 4px 10px; border-radius: 6px; border: 1px solid rgba(167,139,250,0.35); }
.tm-skill-apex { background: #f0fdfa; color: #0f766e; padding: 5px 14px; border-radius: 20px; border: 1px solid #99f6e4; }
.tm-skills-apex { justify-content: center; }
.tm-skill-canvas { color: #71717a; padding: 2px 0; letter-spacing: 0.06em; text-transform: uppercase; font-size: 7.5pt; }
.tm-skill-canvas + .tm-skill-canvas::before { content: '—'; margin: 0 8px; color: #d4d4d8; }
.tm-skill-pioneer { display: block; width: 100%; color: #0f172a; padding: 5px 0 5px 12px; border-left: 3px solid #dc2626; margin-bottom: 4px; font-weight: 600; }
.tm-skill-fusion { background: linear-gradient(135deg, #ccfbf1, #ffedd5); color: #0d9488; padding: 4px 10px; border-radius: 12px; }
.tm-skill-monarch { background: #f5f3ff; color: #6d28d9; padding: 4px 10px; border-radius: 4px; border: 1px solid #ddd6fe; }
.tm-skill-swiss { background: #000; color: #fff; padding: 6px 10px; font-weight: 800; text-transform: uppercase; font-size: 7pt; letter-spacing: 0.06em; }
.tm-skill-vivid { background: linear-gradient(90deg, #fce7f3, #fdf2f8); color: #9d174d; padding: 4px 10px; border-radius: 14px; border: 1px solid #f9a8d4; }
.tm-skill-forest { background: #dcfce7; color: #166534; padding: 4px 10px; border-radius: 4px; border: 1px solid #86efac; }
.tm-skill-onyx { background: transparent; color: #e5e5e5; padding: 4px 10px; border: 1px solid #525252; border-radius: 2px; }
.tm-skill-radiant { background: rgba(255,255,255,0.2); color: #fff; padding: 4px 10px; border-radius: 20px; border: 1px solid rgba(255,255,255,0.35); }
.tm-skill-streamline { display: block; width: 100%; color: #1e40af; padding: 4px 0 4px 14px; border-left: 3px solid #3b82f6; margin-bottom: 3px; }
.tm-skill-default { background: #f0fdf4; color: #166534; padding: 4px 8px; border-radius: 4px; }

.tm-metro-skills-aside { padding: 0 0 0 16px; border-left: 3px solid #f97316; }
.tm-metro-skills-aside .tm-side-title { color: #f97316; font-size: 8.5pt; font-weight: 800; text-transform: uppercase; margin-bottom: 10px; }

@media print {
  body * { visibility: hidden; }
  #resume-preview, #resume-preview * { visibility: visible; }
  #resume-preview { position: absolute; left: 0; top: 0; width: 100%; }
  #resume-preview.orientation-portrait { min-height: 11in; }
  #resume-preview.orientation-landscape { min-height: 8.5in; }
  #resume-preview.orientation-portrait > [class*="tm-"] { min-height: 11in; }
  #resume-preview.orientation-landscape > [class*="tm-"] { min-height: 8.5in; }
}

/* ─── SHARED entry styles (themed templates) ─── */
.tm-entry { margin-bottom: 14px; }
.tm-entry-top { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 4px; flex-wrap: wrap; }
.tm-entry-top > div:first-child { flex: 1 1 180px; min-width: 0; }
.tm-entry-role { font-weight: 700; font-size: 10.5pt; color: #0f172a; }
.tm-entry-company { color: #475569; font-weight: 600; font-size: 9.5pt; }
.tm-entry-dates { font-size: 8pt; color: #94a3b8; white-space: normal; flex: 0 1 auto; min-width: 0; text-align: right; }
.tm-entry-meta { font-size: 8.5pt; color: #64748b; margin: 2px 0 6px; }
.tm-bullets { margin: 6px 0 0; padding-left: 16px; color: #475569; font-size: 9pt; }
.tm-bullets li { margin-bottom: 3px; }
.tm-contact,
.tm-themed-contact {
  overflow-wrap: break-word;
  word-break: break-word;
  max-width: 100%;
}
.tm-contact-item,
.tm-contact span,
.tm-contact div {
  overflow-wrap: break-word;
  word-break: break-word;
  max-width: 100%;
}

.tm-slate > *,
.tm-executive .tm-exec-body > *,
.tm-stanford .tm-body > *,
.tm-apex .tm-apex-body > *,
.tm-swiss .tm-swiss-grid > *,
.tm-metro .tm-metro-body > *,
.tm-metro .tm-metro-header > * {
  min-width: 0;
}

.tm-summary { font-size: 9.5pt; color: #475569; line-height: 1.65; margin: 0; white-space: normal; word-wrap: break-word; overflow-wrap: anywhere; }
.tm-skills { display: flex; flex-wrap: wrap; gap: 6px; }
.tm-skill-pill { display: inline-block; background: #f0fdf4; color: #166534; padding: 3px 8px; border-radius: 4px; font-size: 8pt; margin: 2px 3px 2px 0; }

/* ─── THEMED TEMPLATES ─── */
.tm-themed { padding: 32px 36px; min-height: auto; }
.tm-themed .tm-themed-header { margin-bottom: 22px; }
.tm-themed .tm-themed-name { font-size: 22pt; font-weight: 700; margin: 0 0 4px; color: #0f172a; }
.tm-themed .tm-themed-title { font-size: 10.5pt; margin: 0 0 10px; color: #475569; }
.tm-themed .tm-themed-contact { font-size: 8.5pt; color: #64748b; }
.tm-themed .tm-section { margin-bottom: 18px; }
.tm-themed .tm-section-title {
  font-size: 8.5pt; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.1em; margin-bottom: 8px; padding-bottom: 4px;
}

.tm-corporate { background: #fff; }
.tm-corporate .tm-corp-bar { background: #1e3a5f; color: #fff; padding: 28px 36px; margin: -32px -36px 24px; }
.tm-corporate .tm-themed-name { color: #fff; font-size: 24pt; }
.tm-corporate .tm-themed-title { color: #93c5fd; }
.tm-corporate .tm-themed-contact { color: #bfdbfe; }
.tm-corporate .tm-section-title { color: #1e3a5f; border-bottom: 2px solid #1e3a5f; }

.tm-elegant { background: #fffef9; }
.tm-elegant .tm-themed-name { font-family: 'Merriweather', serif; color: #292524; }
.tm-elegant .tm-themed-title { color: #78716c; font-style: italic; }
.tm-elegant .tm-section-title { color: #b45309; border-bottom: 1px solid #d97706; }

.tm-tech { background: #fff; }
.tm-tech .tm-tech-bar { background: #0f172a; padding: 6px 36px; margin: -32px -36px 0; display: flex; gap: 8px; }
.tm-tech .tm-tech-dot { width: 10px; height: 10px; border-radius: 50%; }
.tm-tech .tm-tech-header { padding: 24px 0 20px; border-bottom: 1px solid #e2e8f0; margin-bottom: 20px; }
.tm-tech .tm-themed-name { font-family: ui-monospace, monospace; font-size: 20pt; color: #0f172a; }
.tm-tech .tm-themed-title { color: #0ea5e9; font-weight: 600; }
.tm-tech .tm-section-title { color: #0ea5e9; }
.tm-tech .tm-section-title::before { content: '// '; color: #94a3b8; }
.tm-tech .tm-skill-pill { background: #f0f9ff; color: #0369a1; font-family: monospace; }

.tm-harvard { background: #fff; }
.tm-harvard .tm-themed-name { font-family: 'Merriweather', serif; color: #1c1917; }
.tm-harvard .tm-harvard-rule { height: 4px; background: #7f1d1d; margin-bottom: 20px; }
.tm-harvard .tm-section-title { color: #7f1d1d; letter-spacing: 0.15em; }

.tm-luxury { background: #fafaf9; }
.tm-luxury .tm-luxury-header { background: #1c1917; color: #fff; padding: 32px 36px; margin: -32px -36px 28px; text-align: center; }
.tm-luxury .tm-themed-name { color: #fef3c7; font-size: 26pt; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 300; }
.tm-luxury .tm-themed-title { color: #d4d4d4; letter-spacing: 0.2em; text-transform: uppercase; font-size: 9pt; }
.tm-luxury .tm-themed-contact { color: #a3a3a3; }
.tm-luxury .tm-section-title { color: #1c1917; border-bottom: 1px solid #d4d4d4; letter-spacing: 0.2em; }

.tm-international { background: #fff; }
.tm-international .tm-intl-header { border-left: 5px solid #1d4ed8; padding-left: 20px; margin-bottom: 24px; }
.tm-international .tm-themed-name { color: #1e3a8a; }
.tm-international .tm-themed-title { color: #3b82f6; font-weight: 600; }
.tm-international .tm-section-title { color: #1d4ed8; border-bottom: 2px solid #dbeafe; }

.tm-bold { background: #fff; padding: 36px; }
.tm-bold .tm-themed-name { font-size: 32pt; font-weight: 900; color: #000; letter-spacing: -0.04em; line-height: 1; }
.tm-bold .tm-themed-title { font-size: 12pt; font-weight: 700; color: #000; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 16px; }
.tm-bold .tm-section-title { font-size: 11pt; background: #000; color: #fff; display: inline-block; padding: 4px 12px; margin-bottom: 10px; }
.tm-bold .tm-entry { border-left: 4px solid #000; padding-left: 12px; }

.tm-compact { padding: 24px 30px; font-size: 9pt; }
.tm-compact .tm-themed-name { font-size: 16pt; }
.tm-compact .tm-themed-title { font-size: 9pt; margin-bottom: 6px; }
.tm-compact .tm-section { margin-bottom: 12px; }
.tm-compact .tm-bullets { font-size: 8pt; }

.tpl-thumb-corporate { background: linear-gradient(180deg, #1e3a5f 25%, #fff 25%); }
.tpl-thumb-elegant { background: #fffef9; border-bottom: 2px solid #d97706; }
.tpl-thumb-tech { background: #fff; border-top: 8px solid #0f172a; }
.tpl-thumb-harvard { background: #fff; border-top: 4px solid #7f1d1d; }
.tpl-thumb-luxury { background: linear-gradient(180deg, #1c1917 30%, #fafaf9 30%); }
.tpl-thumb-international { background: #fff; border-left: 4px solid #1d4ed8; }
.tpl-thumb-bold::after { content: ''; display: block; width: 70%; height: 6px; background: #000; margin: 4px; }
.tpl-thumb-compact { background: repeating-linear-gradient(0deg, #e2e8f0, #e2e8f0 1px, transparent 1px, transparent 6px); }

/* ─── NEW TEMPLATES (10) ─── */

/* HORIZON — horizontal accent bands */
.tm-horizon { padding: 0; }
.tm-horizon .tm-horizon-top { background: linear-gradient(135deg, #0369a1 0%, #0ea5e9 100%); color: #fff; padding: 32px 40px 28px; }
.tm-horizon .tm-name { font-size: 26pt; font-weight: 800; margin: 0 0 4px; letter-spacing: -0.03em; }
.tm-horizon .tm-title { font-size: 11pt; color: #bae6fd; margin: 0 0 12px; font-weight: 500; }
.tm-horizon .tm-contact { display: flex; flex-wrap: wrap; gap: 14px; font-size: 8.5pt; color: #e0f2fe; }
.tm-horizon .tm-horizon-body { padding: 28px 40px 36px; }
.tm-horizon .tm-section-title { color: #0369a1; border-bottom: 3px solid #0ea5e9; padding-bottom: 6px; font-size: 9pt; font-weight: 700; text-transform: uppercase; letter-spacing: 0.12em; margin-bottom: 10px; }
.tm-horizon .tm-entry { border-left: 3px solid #e0f2fe; padding-left: 14px; margin-bottom: 16px; }

/* SERIF — traditional professional */
.tm-serif { padding: 38px 42px; font-family: 'Merriweather', Georgia, serif; }
.tm-serif .tm-serif-header { border-bottom: 1px solid #1e293b; padding-bottom: 18px; margin-bottom: 22px; }
.tm-serif .tm-name { font-size: 22pt; font-weight: 700; color: #1e293b; margin: 0 0 4px; }
.tm-serif .tm-title { font-size: 11pt; color: #475569; font-style: italic; margin: 0 0 10px; }
.tm-serif .tm-contact { font-size: 8.5pt; color: #64748b; font-family: 'Inter', sans-serif; }
.tm-serif .tm-section-title { font-family: 'Inter', sans-serif; font-size: 9pt; font-weight: 700; text-transform: uppercase; letter-spacing: 0.14em; color: #1e293b; border-bottom: 1px solid #cbd5e1; padding-bottom: 4px; margin-bottom: 10px; }
.tm-serif .tm-bullets { font-family: 'Inter', sans-serif; }

/* METRO — dual-tone urban */
.tm-metro { padding: 0; }
.tm-metro .tm-metro-header { display: grid; grid-template-columns: 1fr 8px auto; background: #1e3a5f; color: #fff; padding: 0; }
.tm-metro .tm-metro-left { padding: 28px 32px; }
.tm-metro .tm-metro-accent { background: #f97316; width: 8px; }
.tm-metro .tm-metro-right { background: #f97316; padding: 28px 24px; min-width: 180px; font-size: 8pt; color: #fff7ed; line-height: 1.8; }
.tm-metro .tm-name { font-size: 22pt; font-weight: 800; margin: 0 0 4px; }
.tm-metro .tm-title { font-size: 10pt; color: #93c5fd; margin: 0; }
.tm-metro .tm-metro-body { padding: 26px 36px 34px; display: grid; grid-template-columns: 1fr 160px; gap: 28px; }
.tm-metro .tm-section-title { color: #1e3a5f; font-size: 8.5pt; font-weight: 800; text-transform: uppercase; letter-spacing: 0.1em; border-bottom: 2px solid #f97316; padding-bottom: 4px; margin-bottom: 10px; }
.tm-metro .tm-side-title { font-size: 8pt; font-weight: 700; text-transform: uppercase; color: #f97316; margin-bottom: 8px; }

/* SLATE — charcoal right sidebar */
.tm-slate { display: grid; grid-template-columns: 1fr 200px; min-height: auto; }
.tm-slate > * { min-width: 0; }
.tm-slate .tm-slate-main { padding: 32px 34px; }
.tm-slate .tm-slate-side { background: #1e293b; color: #fff; padding: 32px 22px; }
.tm-slate .tm-name { font-size: 24pt; font-weight: 700; color: #0f172a; margin: 0 0 4px; letter-spacing: -0.02em; }
.tm-slate .tm-title { font-size: 10pt; color: #64748b; margin: 0 0 20px; text-transform: uppercase; letter-spacing: 0.08em; }
.tm-slate .tm-slate-side .tm-name { color: #fff; font-size: 14pt; margin-bottom: 16px; }
.tm-slate .tm-slate-side .tm-side-label { font-size: 7pt; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: #94a3b8; margin-bottom: 8px; }
.tm-slate .tm-slate-side .tm-contact-item { font-size: 8pt; color: #cbd5e1; margin-bottom: 6px; overflow-wrap: break-word; word-break: break-word; }
.tm-slate .tm-section-title { font-size: 9pt; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: #1e293b; margin-bottom: 10px; padding-bottom: 4px; border-bottom: 2px solid #1e293b; }
.tm-slate .tm-slate-side .tm-skill-pill { display: block; background: rgba(255,255,255,0.1); padding: 4px 8px; border-radius: 4px; font-size: 7.5pt; margin-bottom: 4px; }

/* NOVA — dark tech gradient */
.tm-nova { background: #0f172a; color: #e2e8f0; padding: 0; }
.tm-nova .tm-nova-header { padding: 34px 38px 28px; background: linear-gradient(135deg, #312e81 0%, #4c1d95 50%, #0f172a 100%); }
.tm-nova .tm-name { font-size: 26pt; font-weight: 800; color: #fff; margin: 0 0 4px; background: linear-gradient(90deg, #a78bfa, #38bdf8); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.tm-nova .tm-title { font-size: 11pt; color: #c4b5fd; margin: 0 0 14px; }
.tm-nova .tm-contact { font-size: 8.5pt; color: #94a3b8; }
.tm-nova .tm-nova-body { padding: 28px 38px 36px; }
.tm-nova .tm-section-title { font-size: 9pt; font-weight: 700; color: #a78bfa; text-transform: uppercase; letter-spacing: 0.12em; margin-bottom: 10px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tm-nova .tm-section-title::before { content: ''; width: 12px; height: 2px; background: #38bdf8; }
.tm-nova .tm-summary { color: #cbd5e1; }
.tm-nova .tm-entry-role { color: #f1f5f9; }
.tm-nova .tm-entry-company { color: #a78bfa; }
.tm-nova .tm-bullets { color: #94a3b8; }
.tm-nova .tm-skill-pill { background: rgba(167,139,250,0.2); color: #c4b5fd; border: 1px solid rgba(167,139,250,0.3); }

/* APEX — executive top banner */
.tm-apex { padding: 0; }
.tm-apex .tm-apex-banner { background: linear-gradient(90deg, #0f766e, #115e59); color: #fff; padding: 30px 40px; text-align: center; }
.tm-apex .tm-name { font-size: 28pt; font-weight: 300; letter-spacing: 0.2em; text-transform: uppercase; margin: 0 0 6px; }
.tm-apex .tm-title { font-size: 10pt; letter-spacing: 0.25em; text-transform: uppercase; color: #99f6e4; margin: 0 0 12px; }
.tm-apex .tm-contact { font-size: 8pt; color: #ccfbf1; letter-spacing: 0.05em; }
.tm-apex .tm-apex-body { padding: 28px 40px; display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.tm-apex .tm-apex-full { grid-column: 1 / -1; }
.tm-apex .tm-section-title { font-size: 8.5pt; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: #0f766e; border-bottom: 1px solid #0f766e; padding-bottom: 4px; margin-bottom: 10px; }

/* CANVAS — airy editorial */
.tm-canvas { padding: 48px 52px; background: #fff; }
.tm-canvas .tm-name { font-size: 32pt; font-weight: 300; color: #18181b; margin: 0 0 6px; letter-spacing: -0.04em; line-height: 1.1; }
.tm-canvas .tm-title { font-size: 11pt; color: #71717a; margin: 0 0 24px; font-weight: 400; }
.tm-canvas .tm-contact { font-size: 8pt; color: #a1a1aa; margin-bottom: 40px; letter-spacing: 0.08em; text-transform: uppercase; }
.tm-canvas .tm-section { margin-bottom: 28px; }
.tm-canvas .tm-section-title { font-size: 8pt; font-weight: 600; letter-spacing: 0.25em; text-transform: uppercase; color: #a1a1aa; margin-bottom: 14px; }
.tm-canvas .tm-entry { margin-bottom: 22px; }
.tm-canvas .tm-entry-role { font-size: 11pt; font-weight: 600; }
.tm-canvas .tm-bullets { list-style: none; padding-left: 0; }
.tm-canvas .tm-bullets li { padding-left: 0; margin-bottom: 6px; }

/* PIONEER — bold left stripe */
.tm-pioneer { padding: 32px 36px 32px 44px; border-left: 8px solid #dc2626; position: relative; }
.tm-pioneer .tm-name { font-size: 24pt; font-weight: 900; color: #0f172a; margin: 0 0 2px; letter-spacing: -0.03em; }
.tm-pioneer .tm-title { font-size: 11pt; font-weight: 600; color: #dc2626; margin: 0 0 14px; text-transform: uppercase; letter-spacing: 0.06em; }
.tm-pioneer .tm-contact { font-size: 8.5pt; color: #64748b; margin-bottom: 24px; }
.tm-pioneer .tm-section-title { font-size: 9pt; font-weight: 800; text-transform: uppercase; color: #0f172a; margin-bottom: 10px; padding-left: 12px; border-left: 3px solid #dc2626; }
.tm-pioneer .tm-entry { padding-left: 12px; }

/* ACADEMIC — CV / research style */
.tm-academic { padding: 30px 38px; font-size: 9.5pt; }
.tm-academic .tm-acad-header { display: flex; justify-content: space-between; align-items: flex-end; border-bottom: 2px solid #1e40af; padding-bottom: 14px; margin-bottom: 20px; }
.tm-academic .tm-name { font-size: 20pt; font-weight: 700; color: #1e3a8a; margin: 0 0 2px; font-family: 'Merriweather', serif; }
.tm-academic .tm-title { font-size: 10pt; color: #475569; margin: 0; font-style: italic; }
.tm-academic .tm-contact { text-align: right; font-size: 8pt; color: #64748b; line-height: 1.7; }
.tm-academic .tm-section-title { font-size: 9pt; font-weight: 700; color: #1e40af; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 8px; }
.tm-academic .tm-entry-role { font-size: 10pt; color: #0f172a; }
.tm-academic .tm-entry-meta { font-size: 8.5pt; color: #64748b; font-style: italic; }
.tm-academic .tm-bullets { font-size: 9pt; }

/* REFINED — navy & gold luxury */
.tm-refined { background: #fff; padding: 0; }
.tm-refined .tm-refined-header { background: #1e3a5f; padding: 36px 40px; text-align: center; position: relative; }
.tm-refined .tm-refined-header::after { content: ''; position: absolute; bottom: 0; left: 10%; right: 10%; height: 3px; background: linear-gradient(90deg, transparent, #d4af37, transparent); }
.tm-refined .tm-name { font-size: 26pt; font-weight: 300; color: #fff; letter-spacing: 0.12em; text-transform: uppercase; margin: 0 0 6px; }
.tm-refined .tm-title { font-size: 10pt; color: #d4af37; letter-spacing: 0.2em; text-transform: uppercase; margin: 0 0 12px; }
.tm-refined .tm-contact { font-size: 8pt; color: #93c5fd; }
.tm-refined .tm-refined-body { padding: 30px 40px 36px; }
.tm-refined .tm-section-title { font-size: 8.5pt; font-weight: 600; text-transform: uppercase; letter-spacing: 0.18em; color: #1e3a5f; border-bottom: 1px solid #d4af37; padding-bottom: 5px; margin-bottom: 10px; }
.tm-refined .tm-skill-pill { background: #fef9e7; color: #92400e; border: 1px solid #fde68a; }

/* Thumbnails for new templates */
.tpl-thumb-horizon { background: linear-gradient(180deg, #0ea5e9 28%, #fff 28%); }
.tpl-thumb-serif { background: #fff; border-bottom: 2px solid #1e293b; }
.tpl-thumb-metro { background: linear-gradient(90deg, #1e3a5f 70%, #f97316 70%); }
.tpl-thumb-slate { background: linear-gradient(90deg, #fff 65%, #1e293b 65%); }
.tpl-thumb-nova { background: linear-gradient(135deg, #312e81, #0f172a); }
.tpl-thumb-apex { background: linear-gradient(180deg, #0f766e 22%, #fff 22%); }
.tpl-thumb-canvas { background: #fff; border: 1px solid #e4e4e7; }
.tpl-thumb-pioneer { background: #fff; border-left: 5px solid #dc2626; }
.tpl-thumb-academic { background: #fff; border-bottom: 3px solid #1e40af; }
.tpl-thumb-refined { background: linear-gradient(180deg, #1e3a5f 25%, #fff 25%); }

/* ─── TEMPLATES 25–32 ─── */
.tm-fusion { padding: 0; }
.tm-fusion .tm-fusion-header { background: linear-gradient(135deg, #0d9488 0%, #f97316 100%); color: #fff; padding: 30px 36px 26px; }
.tm-fusion .tm-name { font-size: 24pt; font-weight: 800; margin: 0 0 4px; }
.tm-fusion .tm-title { font-size: 10pt; color: #ccfbf1; margin: 0 0 10px; }
.tm-fusion .tm-contact { font-size: 8.5pt; color: #fff7ed; }
.tm-fusion .tm-fusion-body { padding: 28px 36px 34px; }
.tm-fusion .tm-section-title { color: #0d9488; border-bottom: 2px solid #f97316; font-size: 9pt; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 10px; padding-bottom: 4px; }

.tm-monarch { padding: 0; background: #faf5ff; }
.tm-monarch .tm-monarch-header { background: linear-gradient(180deg, #581c87, #7c3aed); color: #fff; padding: 32px 38px 28px; text-align: center; }
.tm-monarch .tm-name { font-size: 26pt; font-weight: 300; letter-spacing: 0.15em; text-transform: uppercase; margin: 0 0 6px; }
.tm-monarch .tm-title { font-size: 10pt; color: #e9d5ff; letter-spacing: 0.2em; text-transform: uppercase; margin: 0 0 12px; }
.tm-monarch .tm-contact { font-size: 8pt; color: #f3e8ff; }
.tm-monarch .tm-monarch-body { padding: 28px 38px 36px; }
.tm-monarch .tm-section-title { color: #7c3aed; font-size: 8.5pt; font-weight: 700; text-transform: uppercase; letter-spacing: 0.12em; border-bottom: 1px solid #ddd6fe; margin-bottom: 10px; padding-bottom: 4px; }

.tm-swiss { padding: 32px 38px; }
.tm-swiss .tm-swiss-grid { display: grid; grid-template-columns: 1fr 200px; gap: 20px; border-bottom: 4px solid #000; padding-bottom: 16px; margin-bottom: 24px; }
.tm-swiss .tm-swiss-grid > * { min-width: 0; }
.tm-swiss .tm-name { font-size: 28pt; font-weight: 900; letter-spacing: -0.04em; margin: 0; line-height: 1; color: #000; overflow-wrap: break-word; word-break: break-word; }
.tm-swiss .tm-swiss-meta { text-align: right; font-size: 8pt; color: #525252; line-height: 1.6; overflow-wrap: break-word; word-break: break-word; min-width: 0; }
.tm-swiss .tm-title { font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; margin: 0 0 8px; color: #000; }
.tm-swiss .tm-section-title { font-size: 8pt; font-weight: 800; text-transform: uppercase; letter-spacing: 0.2em; color: #000; margin-bottom: 10px; }

.tm-vivid { padding: 34px 38px; border-top: 6px solid #db2777; }
.tm-vivid .tm-name { font-size: 26pt; font-weight: 800; color: #831843; margin: 0 0 4px; letter-spacing: -0.03em; }
.tm-vivid .tm-title { font-size: 11pt; color: #db2777; font-weight: 600; margin: 0 0 14px; }
.tm-vivid .tm-contact { font-size: 8.5pt; color: #9d174d; margin-bottom: 24px; }
.tm-vivid .tm-section-title { color: #db2777; font-size: 9pt; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 10px; }
.tm-vivid .tm-entry { border-left: 3px solid #fbcfe8; padding-left: 12px; }

.tm-forest { padding: 0; }
.tm-forest .tm-forest-header { background: #14532d; color: #fff; padding: 30px 36px 24px; }
.tm-forest .tm-name { font-size: 24pt; font-weight: 700; margin: 0 0 4px; }
.tm-forest .tm-title { font-size: 10pt; color: #86efac; margin: 0 0 10px; }
.tm-forest .tm-contact { font-size: 8.5pt; color: #bbf7d0; }
.tm-forest .tm-forest-body { padding: 28px 36px 34px; }
.tm-forest .tm-section-title { color: #166534; font-size: 9pt; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; border-bottom: 2px solid #86efac; margin-bottom: 10px; padding-bottom: 4px; }

.tm-onyx { padding: 36px 40px; background: #0a0a0a; color: #e5e5e5; }
.tm-onyx .tm-name { font-size: 28pt; font-weight: 700; color: #fff; margin: 0 0 4px; letter-spacing: -0.03em; }
.tm-onyx .tm-title { font-size: 10pt; color: #a3a3a3; text-transform: uppercase; letter-spacing: 0.15em; margin: 0 0 16px; }
.tm-onyx .tm-contact { font-size: 8pt; color: #737373; margin-bottom: 28px; }
.tm-onyx .tm-section-title { color: #fff; font-size: 8pt; font-weight: 600; text-transform: uppercase; letter-spacing: 0.2em; margin-bottom: 12px; }
.tm-onyx .tm-summary, .tm-onyx .tm-bullets, .tm-onyx .tm-entry-meta { color: #a3a3a3; }
.tm-onyx .tm-entry-role { color: #fafafa; }
.tm-onyx .tm-entry-company { color: #d4d4d4; }

.tm-radiant { padding: 0; }
.tm-radiant .tm-radiant-header { background: linear-gradient(135deg, #ea580c, #fbbf24); color: #fff; padding: 32px 38px 28px; }
.tm-radiant .tm-name { font-size: 26pt; font-weight: 800; margin: 0 0 4px; text-shadow: 0 1px 2px rgba(0,0,0,0.1); }
.tm-radiant .tm-title { font-size: 11pt; color: #fffbeb; margin: 0 0 12px; font-weight: 500; }
.tm-radiant .tm-contact { font-size: 8.5pt; color: #fef3c7; }
.tm-radiant .tm-radiant-body { padding: 28px 38px 36px; }
.tm-radiant .tm-section-title { color: #ea580c; font-size: 9pt; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 10px; }

.tm-streamline { padding: 30px 36px; }
.tm-streamline .tm-stream-header { border-bottom: 2px solid #e2e8f0; padding-bottom: 18px; margin-bottom: 22px; }
.tm-streamline .tm-name { font-size: 22pt; font-weight: 700; color: #1e40af; margin: 0 0 4px; }
.tm-streamline .tm-title { font-size: 10pt; color: #3b82f6; margin: 0 0 10px; font-weight: 600; }
.tm-streamline .tm-contact { font-size: 8.5pt; color: #64748b; }
.tm-streamline .tm-section-title { color: #1e40af; font-size: 8.5pt; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 10px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tm-streamline .tm-section-title::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: #3b82f6; flex-shrink: 0; }
.tm-streamline .tm-entry { padding-left: 16px; border-left: 2px solid #dbeafe; margin-bottom: 16px; }

.tpl-thumb-fusion { background: linear-gradient(135deg, #0d9488 40%, #f97316 40%); }
.tpl-thumb-monarch { background: linear-gradient(180deg, #7c3aed 30%, #faf5ff 30%); }
.tpl-thumb-swiss { background: #fff; border-bottom: 4px solid #000; }
.tpl-thumb-vivid { background: #fff; border-top: 5px solid #db2777; }
.tpl-thumb-forest { background: linear-gradient(180deg, #14532d 25%, #fff 25%); }
.tpl-thumb-onyx { background: #0a0a0a; }
.tpl-thumb-radiant { background: linear-gradient(135deg, #ea580c, #fbbf24); }
.tpl-thumb-streamline { background: #fff; border-left: 4px solid #3b82f6; }

.tier-badge { font-size: 7px; font-weight: 800; padding: 2px 4px; border-radius: 3px; position: absolute; top: 4px; right: 4px; }
.tier-starter { background: rgba(59,130,246,0.2); color: #60a5fa; }
.tier-pro { background: rgba(16,185,129,0.2); color: #34d399; }
.tier-business { background: rgba(168,85,247,0.2); color: #c084fc; }

.credits-pill { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; background: rgba(16,185,129,0.1); border: 1px solid rgba(16,185,129,0.3); border-radius: 20px; font-size: 11px; font-weight: 600; color: #34d399; }

#preview-frame { max-height: 80vh; overflow-y: auto; -webkit-overflow-scrolling: touch; }

@media (max-width: 767px) {
  #preview-panel { min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; }
  #preview-frame { max-height: none; overflow: hidden; }
}

@media (max-width: 640px) {
  #resume-preview:not(.page-preview) .tm-modern { grid-template-columns: 1fr; }
  #resume-preview:not(.page-preview) .tm-modern .tm-sidebar { padding: 20px; }
  #resume-preview:not(.page-preview) .tm-executive .tm-exec-body,
  #resume-preview:not(.page-preview) .tm-stanford .tm-body { grid-template-columns: 1fr; }
  #resume-preview:not(.page-preview) .tm-slate { grid-template-columns: 1fr; }
  #resume-preview:not(.page-preview) .tm-slate .tm-slate-side { order: -1; }
  #resume-preview:not(.page-preview) .tm-metro .tm-metro-body { grid-template-columns: 1fr; }
  #resume-preview:not(.page-preview) .tm-apex .tm-apex-body { grid-template-columns: 1fr; }
  #resume-preview:not(.page-preview) .tm-metro .tm-metro-header { grid-template-columns: 1fr; }
  #resume-preview:not(.page-preview) .tm-metro .tm-metro-accent { display: none; }
  #resume-preview:not(.page-preview) .tm-metro .tm-metro-right { min-width: auto; }
  #resume-preview:not(.page-preview) .tm-swiss .tm-swiss-grid { grid-template-columns: 1fr; }
  #resume-preview:not(.page-preview) .tm-swiss .tm-swiss-meta { text-align: left; margin-top: 8px; }
}
