diff --git a/index.html b/index.html
index d855c7d..81e19a6 100644
--- a/index.html
+++ b/index.html
@@ -23,7 +23,7 @@ <h2>
           You
           <br>
           <hr>
-          Score: <span class="you">0</span>
+          Scores: <span class="you">0</span>
         </h2>
         <h2>
           Computer
diff --git a/style.css b/style.css
index ff56940..1290987 100644
--- a/style.css
+++ b/style.css
@@ -1,206 +1,272 @@
-@keyframes shakePlayer {
-  0% { transform: scaleX(-1) translateY(0) }
-  25% { transform:scaleX(-1) translateY(10px) }
-  50% { transform:scaleX(-1) translateY(-10px) }
-  75% { transform:scaleX(-1) translateY(10px) }
-  100% { transform:scaleX(-1) translateY(0) }
- }
-
- @keyframes shakeComputer {
-  0% { transform: translateY(0) }
-  25% { transform: translateY(10px) }
-  50% { transform: translateY(-10px) }
-  75% { transform: translateY(10px) }
-  100% { transform: translateY(0) }
- }
-
-html,
-body {
+/* Global Styles */
+html, body {
   padding: 0;
   margin: 0;
   width: 100%;
-  overflow-x: hidden;
-  background: #0f0f0f;
+  height: 100%;
+  overflow: hidden;
+  background: radial-gradient(circle at center, #141e30, #243b55);
   color: #fff;
   font-family: "Open Sans", sans-serif;
+  display: flex;
+  justify-content: center;
+  align-items: center;
 }
 
 section {
-  min-height: 100vh;
-  margin: 0 auto;
-  width: 80vw;
-}
-
-
-/*--- Reset Button -----*/
-.reset{
-  background: #0f0f0f;
-  border: 1px solid #fff;
-  color: #fff;
-  padding: 10px 20px;
-  font-size: 1.2rem;
-  font-weight: 600;
-  border-radius: 5px;
-  cursor: pointer;
-  transition: all 0.3s ease;
+  height: 90vh;
+  width: 90vw;
+  background: rgba(255, 255, 255, 0.1);
+  border-radius: 20px;
+  padding: 1rem;
+  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
+  display: flex;
+  flex-direction: column;
+  justify-content: space-around;
+  align-items: center;
+  backdrop-filter: blur(10px);
+  border: 2px solid rgba(255, 255, 255, 0.2);
+  overflow: hidden;
 }
 
-.reset:hover{
-  background: #fff;
-  color: #0f0f0f;
+/* Background Animation */
+body::before {
+  content: '';
+  position: absolute;
+  top: -50%;
+  left: -50%;
+  width: 200%;
+  height: 200%;
+  background: conic-gradient(from 0deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0));
+  animation: rotateBackground 10s infinite linear;
+  z-index: -1;
 }
 
-.reset-div{
-  text-align: center;
+@keyframes rotateBackground {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
 }
-/*--------------------*/
 
+/* Intro */
 .intro h1 {
   text-align: center;
   font-size: 2rem;
-  font-weight: 500;
+  font-weight: 700;
+  margin-bottom: 1rem;
+  color: #00d4ff;
+  text-shadow: 0 10px 20px rgba(0, 0, 0, 0.6);
+  text-transform: uppercase;
+  letter-spacing: 4px;
+  animation: glow 1.5s infinite alternate;
 }
 
+@keyframes glow {
+  0% {
+    text-shadow: 0 10px 20px rgba(0, 0, 0, 0.6), 0 0 10px #00d4ff, 0 0 20px #00d4ff;
+  }
+  100% {
+    text-shadow: 0 10px 20px rgba(0, 0, 0, 0.6), 0 0 20px #00d4ff, 0 0 40px #00d4ff;
+  }
+}
+
+/* Scoreboard */
 .score {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  padding-top: 1rem;
-  max-width: 55vw;
-  margin: 0 auto;
+  padding: 0.5rem;
+  width: 100%;
+  max-width: 70%;
   text-align: center;
+  background: rgba(0, 0, 0, 0.5);
+  border-radius: 15px;
+  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6);
+  color: #ffeb3b;
+  font-family: 'Courier New', Courier, monospace;
 }
 
-.score h2{
-  font-weight: 400;
-}
-
-.score hr{
-  margin-top: 25px;
-  margin-bottom: 25px;
-}
-
-.winner{
-  font-weight: 400;
+.score h2 {
+  font-weight: 600;
+  font-size: 1rem;
 }
 
-.shakePlayer{
-  animation:shakePlayer 0.25s infinite;
-}
-.shakeComputer{
-  animation:shakeComputer 0.25s infinite;
+.score hr {
+  margin: 0.25rem 0;
+  border: 0;
+  border-top: 1px solid rgba(255, 255, 255, 0.2);
 }
 
-@media screen and (max-width:725px) {
-  
-}
+/* Match Area */
 .match {
   display: flex;
   flex-direction: column;
   align-items: center;
-  justify-content: space-between;
-  margin-top: -2rem;
+  justify-content: center;
+  margin-top: 0;
 }
 
 .match h2 {
-  font-size: 2rem;
+  font-size: 1.5rem;
   text-align: center;
+  color: #4caf50;
+  margin-bottom: 1rem;
+  text-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
+  animation: pulse 1.5s infinite;
+}
+
+@keyframes pulse {
+  0% {
+    transform: scale(1);
+  }
+  50% {
+    transform: scale(1.05);
+  }
+  100% {
+    transform: scale(1);
+  }
 }
 
 .match .hands {
   display: flex;
-  flex-direction: row;
-  width: 100%;
   justify-content: space-around;
   align-items: center;
+  width: 100%;
+  margin-bottom: 1rem;
 }
 
-/* .player-hand,
-.computer-hand{
+.match .hands img {
+  width: 120px;
+  transition: transform 0.5s ease, filter 0.5s ease;
+  filter: drop-shadow(0 5px 15px rgba(0, 0, 0, 0.7));
+}
+
+.match .hands img:hover {
+  transform: rotateY(360deg);
+  filter: drop-shadow(0 10px 30px rgba(0, 0, 0, 0.9));
+}
 
-} */
-.match .hands .player-hand {
-  transform: scaleX(-1);
+.winner {
+  font-weight: 600;
+  font-size: 1.5rem;
+  color: #ff4081;
+  text-shadow: 0 10px 30px rgba(0, 0, 0, 0.7);
 }
 
+/* Options */
 .options {
-  min-height: 130px;
   display: flex;
-  align-items: flex-start;
-  gap: 1.5rem;
-  margin: 0 auto;
+  align-items: center;
+  gap: 1rem;
   justify-content: center;
+  margin-top: 1rem;
 }
 
 .options button {
-  display: inline-block;
-  outline: none;
-  cursor: pointer;
+  background: rgba(255, 255, 255, 0.2);
   border: none;
-  color: #fff;
-  background-color: transparent;
+  cursor: pointer;
+  padding: 0.5rem;
+  border-radius: 50%;
+  transition: transform 0.5s ease, box-shadow 0.5s ease;
+  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.6);
+}
+
+.options button:hover {
+  transform: translateY(-5px) scale(1.1);
+  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.8);
+}
+
+.options button img {
+  height: 50px;
+  transition: transform 0.5s ease;
 }
 
-.options button label{
-  font-size: 18px;
-  margin-top: 0px;
+.options button label {
+  font-size: 1rem;
+  margin-top: 0.25rem;
   opacity: 0;
-  display: none;
+  transition: opacity 0.3s ease;
+  color: #fff;
+  text-shadow: 0 3px 10px rgba(0, 0, 0, 0.5);
 }
 
-.options button:hover > label{
-  margin-top: 25px;
-  display: inline-block;
+.options button:hover label {
   opacity: 1;
 }
 
-.options button img{
-  height: 50px;
+.options button:hover img {
+  transform: scale(1.2) rotate(15deg);
 }
 
-.options .paper img{
-  width: 50px;
-  height: auto;
+/* Reset Button */
+.reset {
+  background: linear-gradient(135deg, #ff4081, #ff80ab);
+  border: none;
+  color: #fff;
+  padding: 10px 30px;
+  font-size: 1.2rem;
+  font-weight: 700;
+  border-radius: 30px;
+  cursor: pointer;
+  transition: transform 0.5s ease, box-shadow 0.5s ease;
+  margin-top: 1rem;
+  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6);
 }
 
-.options .rock img{
-  margin-top: 10px;
+.reset:hover {
+  transform: translateY(-5px) scale(1.1);
+  box-shadow: 0 15px 50px rgba(0, 0, 0, 0.8);
 }
 
-.options .scissor img{
-  margin-top: 10px;
+.reset-div {
+  text-align: center;
+  margin-top: 1rem;
 }
 
+/* Responsive Adjustments */
 @media screen and (max-width: 810px) {
-  .score{
-    max-width: 60vw;
+  .score {
+    max-width: 80%;
+    padding: 0.5rem;
   }
-  .player-hand, .computer-hand {
-    width: 215px;
+  
+  .match .hands img {
+    width: 100px;
   }
-  h2.result{
+  
+  h2.result {
     font-size: 1.3rem;
   }
-  h2.winner{
-    font-size: 1.5rem;
+  
+  h2.winner {
+    font-size: 1.3rem;
   }
 }
 
 @media screen and (max-width: 550px) {
-  .score{
-    max-width: 70vw;
+  .score {
+    max-width: 90%;
+    padding: 0.5rem;
   }
-  .hands{
-    gap: 1rem;
+  
+  .hands {
+    gap: 0.5rem;
+  }
+  
+  .player-hand,
+  .computer-hand {
+    width: 90px;
+  }
+  
+  h2.result {
+    font-size: 1rem;
+  }
+  
+  h2.winner {
+    font-size: 1.2rem;
   }
-.player-hand,
-.computer-hand{
-  width: 170px;
-}
-h2.result{
-  font-size: 1.2rem;
-}
-h2.winner{
-  font-size: 1.5rem;
-}
 }