 body {
   background: #0d1117;
   display: flex;
   align-items: center;
   justify-content: center;
   height: 100vh;
 }

 .phone-cover {
   width: 400px;
   height: 760px;
   border: 3px solid #e76c07;
   border-radius: 10%;
   background: black;
   box-shadow: 0 0 25px rgba(223, 94, 20, 0.3);
   position: relative;
 }

 h1 {

   position: absolute;
   color: white;
   top: 60%;
   left: 30%;

 }

 /* camera dot */
 .camera {
   width: 25px;
   height: 25px;
   border-radius: 50%;
   background: #222;
   border: 2px solid rgb(255, 255, 255);
   position: absolute;
   top: 12px;
   left: 50%;
 }


 /* bottom home line */
 .home-line {
   position: absolute;
   bottom: 12px;
   left: 50%;
   transform: translateX(-50%);
   width: 60px;
   height: 5px;
   border-radius: 5px;
   background: rgba(255, 255, 255, 0.15);
 }


 .side-btn.volume-up {
   position: absolute;
   width: 4px;
   height: 40px;
   background: white;
   border-radius: 2px;
   top: 110px;
   right: -6px;
 }


 .side-btn.volume-down {
   position: absolute;
   width: 4px;
   height: 40px;
   background: white;
   border-radius: 2px;
   top: 170px;
   right: -6px;
 }



 .side-btn.power {
   position: absolute;
   width: 4px;
   height: 40px;
   background: white;
   border-radius: 2px;
   top: 280px;
   right: -6px;
  }
  img {
   width: 160px;
   /* image ka size */
   height: 160px;
   border-radius: 50%;
   /* ye circle banata hai 💫 */
   overflow: hidden;
   /* extra image corners hide karta hai */
   border: 3px solid #4e160e;
   /* optional border glow */
   position: absolute;
   /* screen ke andar exact jagah pe */
   top: 190px;
   /* upar se distance */
   left: 50%;
   /* horizontally center */
   transform: translateX(-50%);
   /* perfect center alignment */
   box-shadow: 0 0 20px #00ffcc33;
   /* soft glow effect */
   object-fit: cover;
 }

 .progress-bar {
  position: absolute;
   width: 70%;
   height: 10px;
   top: 75%;
   left: 17%;
   background: #030303;
   border-radius: 10px;
   overflow: hidden;

 }

 .progress-fill {
   width: 0%;
   height: 100%;
   background: #00ffcc;
   transition: width 0.05s linear;
 }