/* Preview-only visual scaling (mobile) */
.cvai-preview{ position:relative; z-index:1; }
.cvai-preview .cv-preview-container{ will-change: transform; transform-origin: top center; transition: transform .2s ease; }

@media (max-width: 820px){
  .cvai-preview .cv-preview-container{ transform: scale(.86); }
}
@media (max-width: 560px){
  .cvai-preview .cv-preview-container{ transform: scale(.80); }
}
@media (max-width: 420px){
  .cvai-preview .cv-preview-container{ transform: scale(.75); }
}

/* Keep header nice on phones only inside preview area */
@media (max-width: 560px){
  .cvai-preview .cv-shell .cv-head{ display:grid; grid-template-columns: 1fr 100px; align-items:start; gap:12px; }
  .cvai-preview .cv-shell .cv-head .photo{ justify-self:end; width:100px; height:100px; }
}

/* v1.2.10 preview frame/canvas — print remains original */
.cvai-preview{ overflow: visible; }
.cv-preview-frame{ display:flex; justify-content:center; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.cv-preview-canvas{ width: 794px; max-width: 100%; transform-origin: top center; }
/* default scale desktop (no scale) */
@media (min-width: 821px){
  .cv-preview-canvas{ transform: none; }
}
/* tablet */
@media (max-width: 820px){
  .cv-preview-canvas{ transform: scale(.90); }
}
/* mobile */
@media (max-width: 560px){
  .cv-preview-canvas{ transform: scale(.82); }
}
@media (max-width: 420px){
  .cv-preview-canvas{ transform: scale(.76); }
}

/* v1.2.10b fit fixes */
.cvai-preview{ overflow: visible; }
.cv-preview-frame{ width:100%; overflow: visible; }
.cv-preview-canvas{ transform-origin: top center; display: inline-block; }

/* v1.2.10c — enforce visible overflow & centering */
.cvai-wrapper, .cvai-preview, .cv-preview-frame { overflow: visible !important; }
.cvai-preview { text-align: center; padding: 8px 0 18px; }
.cv-preview-frame { width: 100%; display: flex; justify-content: center; align-items: flex-start; }
.cv-preview-canvas { transform-origin: top center; display: inline-block; }

/* v1.2.10d — center container only, keep CV content alignment natural */
.cvai-preview { text-align: initial; }
.cv-preview-frame { width:100%; display:flex; justify-content:center; align-items:flex-start; overflow:visible !important; }
.cv-preview-canvas { transform-origin: top center; display:inline-block; text-align: initial; }
/* ensure inner cv content not forced to center */
.cv-preview-canvas .cv-shell { text-align: initial; }