* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: black;
    font-family: monospace;
}


/* =========================
   CAMERA VIEW
========================= */

#camera {

    position: fixed;

    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transform: scaleX(-1);

    background: black;

}



/* =========================
   START PROMPT
========================= */

#prompt {

    position: fixed;

    left: 50%;
    bottom: 45px;

    transform: translateX(-50%);

    color: white;

    font-size: 22px;

    letter-spacing: 2px;

    white-space: nowrap;

    user-select: none;

}



/* =========================
   COUNTDOWN
========================= */

#countdownScreen {

    position: fixed;

    inset: 0;

    display: flex;

    justify-content: center;

    align-items: center;

    background: black;

    color: white;

    z-index: 10;

}


#countNumber {

    font-size: 220px;

    font-weight: normal;

    line-height: 1;

}



/* =========================
   FLASH
========================= */

#flash {

    position: fixed;

    inset: 0;

    background: white;

    opacity: 0;

    pointer-events: none;

    z-index: 20;

}



/* =========================
   RESULT DISPLAY
========================= */

#resultScreen {

    position: fixed;

    inset: 0;

    background: black;

    display: flex;

    justify-content: center;

    align-items: center;

    z-index: 30;

}


#photoStrip {

    max-height: 88vh;

    max-width: 90vw;

    object-fit: contain;

    user-select: none;

}



/* =========================
   RESULT TIMER
========================= */

#resultTimer {

    position: absolute;

    top: 35px;

    right: 45px;

    color: white;

    font-size: 38px;

    letter-spacing: 2px;

}



/* =========================
   UTILITIES
========================= */

.hidden {

    display: none !important;

}



/* Remove image selection */
img {
    pointer-events: none;
}


#connectPrinter {

    position:fixed;

    top:50%;
    left:50%;

    transform:translate(-50%,-50%);

    padding:20px 40px;

    background:black;

    color:white;

    border:2px solid white;

    font-family:monospace;

    font-size:24px;

    cursor:pointer;

    z-index:200;

}