/* Unity WebGL player layout shared by the card pages: the canvas follows the
   page width (desktop) or most of the screen height (phones) instead of a
   fixed 960x600, and the loading bar is visible while the build downloads. */
#unity-container {
    position: relative;
    width: 100%;
    max-width: 960px;
    margin: 0 auto;
}

#unity-container.unity-mobile {
    max-width: none;
}

#unity-canvas {
    display: block;
    width: 100%;
    max-width: 960px;
    aspect-ratio: 16 / 10;
    margin: 0 auto;
    background: #1b2433;
}

#unity-container.unity-mobile #unity-canvas {
    max-width: none;
    aspect-ratio: auto;
    height: 72vh;
}

#unity-loading-bar {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: none;
    width: 60%;
    max-width: 320px;
}

#unity-progress-bar-empty {
    width: 100%;
    height: 10px;
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.25);
    overflow: hidden;
}

#unity-progress-bar-full {
    width: 0%;
    height: 100%;
    background: #ffffff;
    transition: width 0.2s ease;
}

/* "Made with 3DBooks.com" badge over free cards (_MadeWith3DBooksBadge). */
.made-with-badge {
    position: absolute;
    right: 12px;
    bottom: 12px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    padding: 6px 12px;
    border-radius: 10px;
    background: rgba(15, 42, 71, 0.72);
    color: #fff;
    font-size: 13px;
    line-height: 1.25;
    text-decoration: none;
    text-align: right;
    backdrop-filter: blur(2px);
}

.made-with-badge:hover {
    background: rgba(15, 42, 71, 0.9);
    color: #fff;
}

.made-with-badge-brand {
    font-weight: 700;
}

.made-with-badge-cta {
    color: #ffd166;
    font-size: 12px;
}

#unity-container.unity-mobile .made-with-badge {
    right: 8px;
    bottom: 8px;
    font-size: 12px;
}