/* [project]/cosplayer/node_modules/.pnpm/react-html5-camera-photo@1.5.11_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-html5-camera-photo/build/css/index.css [app-client] (css) */
#container-circles {
  position: absolute;
  bottom: 90px;
  left: 50%;
}

#outer-circle {
  z-index: 1;
  background-color: #fff6;
  width: 75px;
  height: 75px;
  left: -37px;
}

#inner-circle, #outer-circle {
  border-radius: 50%;
  position: absolute;
}

#inner-circle {
  z-index: 2;
  background: #fff;
  width: 44px;
  height: 44px;
  margin: -22px 0 0 -22px;
  top: 38px;
  left: 50%;
}

#inner-circle.is-clicked {
  width: 38px;
  height: 38px;
  margin: -19px 0 0 -19px;
}

#white-flash.normal {
  opacity: 1;
  -o-transition: opacity .9s ease-out;
  width: 100%;
  height: 100%;
  transition: opacity .9s ease-out;
  position: absolute;
}

#white-flash.do-transition {
  opacity: 0;
  background: #fff;
}

#display-error {
  color: #000;
  background-color: #fff;
}

.react-html5-camera-photo {
  text-align: center;
  position: relative;
}

.react-html5-camera-photo > img, .react-html5-camera-photo > video {
  width: 768px;
}

.react-html5-camera-photo > .display-error {
  width: 768px;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .react-html5-camera-photo > .display-error, .react-html5-camera-photo > img, .react-html5-camera-photo > video {
    width: 100%;
  }
}

.react-html5-camera-photo-fullscreen > img, .react-html5-camera-photo-fullscreen > video {
  width: 100vw;
  height: 100vh;
}

.react-html5-camera-photo-fullscreen > video {
  -o-object-fit: fill;
  object-fit: fill;
}

.react-html5-camera-photo-fullscreen > .display-error {
  width: 100vw;
  height: 100vh;
}

/*# sourceMappingURL=02h0_react-html5-camera-photo_build_css_index_0zf398s.css.map*/