body { background-color: #F9F6F0; color: #2F3E46; scroll-behavior: smooth; }
.fade-in { animation: fadeIn 0.6s ease-out forwards; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

/* PDF 輸出狀態下的強制樣式調校 */
body.generating-pdf .no-print { display: none !important; }

/* html2canvas 對 flex/grid 的「自動分配寬度」計算不可靠，PDF 截圖時容易把文字擠壓成一字一行。
   改用最單純、不需要引擎自己計算寬度的做法：直接釘死像素寬度，讓 flex 排版失去計算的必要。
   數值是實際量測這兩處在 750px 擷取寬度下的正確欄寬。 */
body.generating-pdf .pdf-icon-row {
    flex: none !important;
    width: 417px !important;
}
body.generating-pdf .pdf-label-col {
    flex: none !important;
    width: 365px !important;
}
body.generating-pdf .pdf-avatar-row {
    flex: none !important;
    width: 346px !important;
    text-align: left !important;
}
body.generating-pdf .pdf-text-col {
    flex: none !important;
    width: 210px !important;
    text-align: left !important;
}

/* PDF 分頁時，避免卡片內容被硬生生從中間切斷 */
#page-3-capture .pdf-avoid-break {
    break-inside: avoid;
    page-break-inside: avoid;
}

/* Tinder 卡片拖曳防干擾樣式 */
#active-swipe-card {
    touch-action: pan-y;
    user-select: none;
    -webkit-user-drag: none;
}

/* 3D Card Flip CSS */
.flip-container {
    perspective: 1000px;
}
.flip-card {
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.flip-card.flipped {
    transform: rotateY(180deg);
}
.flip-card-front, .flip-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    border-radius: 16px;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 20px rgba(47, 62, 70, 0.08);
    border: 1px solid rgba(234, 226, 214, 0.5);
}
.flip-card-front {
    background-color: #FAF6F0; /* warm brand oat */
    color: #2F3E46;
}
.flip-card-back {
    background-color: #C25E3B; /* warm terracotta/coral orange */
    color: #FFFFFF;
    transform: rotateY(180deg);
}

/* Micro-change card selections */
.action-card {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
}
.action-card.selected {
    background-color: rgba(87, 104, 87, 0.08);
    border-color: #576857;
    box-shadow: 0 0 15px rgba(87, 104, 87, 0.15);
}

/* IG Story Offscreen Style */
#ig-story-capture {
    width: 1080px;
    height: 1920px;
    background: linear-gradient(135deg, #F9F6F0 0%, #EAE2D6 100%);
    color: #2F3E46;
    padding: 80px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    font-family: 'Noto Sans TC', sans-serif;
    position: absolute;
    left: -9999px;
    top: -9999px;
    box-sizing: border-box;
}

/* 📄 PDF 下載列印排版優化 */
body.generating-pdf .pdf-page-break {
    display: block !important;
    page-break-before: always !important;
    break-before: page !important;
    height: 0;
    margin: 0;
    padding: 0;
    border: none;
}

body.generating-pdf .pdf-avoid-break {
    page-break-inside: avoid !important;
    break-inside: avoid !important;
}