body {
    background-color: #fffafb;
    color: #e5b3b3;
    font-family: 'Georgia', serif;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px;
}

.booth-container {
    background: white;
    padding: 25px;
    border-radius: 30px;
    border: 1px solid #fce4e4;
    box-shadow: 0 10px 25px rgba(229, 179, 179, 0.2);
    text-align: center;
    max-width: 450px;
}

.viewport {
    position: relative;
    border: 10px solid #fce4e4;
    border-radius: 15px;
    overflow: hidden;
    background: white;
    line-height: 0;
}

video {
    width: 100%;
    transform: scaleX(-1);
}

.bw-filter {
    filter: grayscale(100%) contrast(1.2);
}

#countdown {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    font-size: 70px;
    color: white;
    text-shadow: 0 0 10px #e5b3b3;
    z-index: 10;
}

#status-bubble {
    padding: 10px;
    font-style: italic;
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

.controls {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    margin-top: 10px;
}

.icon-btn {
    background: #fce4e4;
    border: 2px solid #f9dbe0;
    border-radius: 50%;
    width: 65px;
    height: 65px;
    padding: 15px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.icon-btn img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

.icon-btn:hover {
    background: #f4c2c9;
    transform: scale(1.1);
}

.save-btn {
    background: white;
}

.toggle-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}

.toggle-label {
    font-size: 0.6rem;
    font-style: italic;
    text-transform: uppercase;
}

.switch {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 20px;
}

.switch input { opacity: 0; width: 0; height: 0; }

.slider {
  position: absolute;
  cursor: pointer;
  top: 0; left: 0; right: 0; bottom: 0;
  background-color: #fce4e4;
  transition: .4s;
  border-radius: 20px;
}

.slider:before {
  position: absolute;
  content: "";
  height: 14px; width: 14px;
  left: 3px; bottom: 3px;
  background-color: white;
  transition: .4s;
  border-radius: 50%;
}

input:checked + .slider { background-color: #e5b3b3; }
input:checked + .slider:before { transform: translateX(20px); }

#flash {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: white; opacity: 0; pointer-events: none;
    z-index: 20;
}

.flash-active { animation: flash-anim 0.4s; }
@keyframes flash-anim { 0% { opacity: 1; } 100% { opacity: 0; } }

#photo {
    margin-top: 30px;
    width: 150px;
    border: 12px solid white;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}