/*
 * Screenshot-only layout helpers.
 * The visible game and card styling stay unchanged; exports use a stable canvas
 * that does not inherit the phone viewport, screen scaling, or scroll position.
 */

.card-export-stage {
    position: fixed;
    top: 0;
    left: 0;
    z-index: -9999;
    pointer-events: none;
}

.card-export-surface {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: max-content;
    max-width: none;
}

.card-export-surface--single {
    padding: 40px;
    background: transparent;
}

.card-export-surface .profit-card {
    flex: 0 0 450px !important;
    width: 450px !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 30px !important;
    border-width: 8px !important;
    transform: none !important;
    transition: none !important;
}

.card-export-surface .profit-card h2 {
    margin-bottom: 20px !important;
    font-size: 20px !important;
}

.card-export-surface .card-details p {
    margin-bottom: 15px !important;
    font-size: 14px !important;
    line-height: 2 !important;
}

.card-export-surface .highlight {
    overflow-wrap: anywhere;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}

.card-export-surface .big-return {
    margin-top: 20px !important;
    font-size: 32px !important;
}

.card-export-surface--legend {
    padding: 0;
    background: #0d1117;
}

.card-export-surface--legend > .export-area {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 30px !important;
    width: max-content !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 40px !important;
    border-width: 8px !important;
    box-sizing: border-box !important;
    transform: none !important;
    transform-origin: top left !important;
}

.card-export-surface--mobile-legend > .export-area {
    flex-direction: column !important;
    align-items: center !important;
    width: 530px !important;
    min-width: 530px !important;
    gap: 24px !important;
    padding: 32px !important;
}