diff --git a/index.html b/index.html
index 45fb567..2c9ccfc 100644
--- a/index.html
+++ b/index.html
@@ -12,11 +12,11 @@
         <section class="voice-stage" role="group" aria-label="Voice activity monitors">
             <article class="voice-circle ai" data-role="ai" aria-label="Unity is idle">
                 <div class="pulse-ring"></div>
-                <div class="voice-label">Unity</div>
+                <span class="sr-only">Unity</span>
             </article>
             <article class="voice-circle user" data-role="user" aria-label="Microphone is muted">
                 <div class="pulse-ring"></div>
-                <div class="voice-label">You</div>
+                <span class="sr-only">You</span>
             </article>
         </section>
     </main>
diff --git a/style.css b/style.css
index 01d3e69..2104e1d 100644
--- a/style.css
+++ b/style.css
@@ -1,8 +1,6 @@
 :root {
     color-scheme: dark;
     --bg-color: #0b0b0f;
-    --accent-ai: #7c5cff;
-    --accent-user: #43d9bd;
     --border-color: rgba(255, 255, 255, 0.18);
     --text-color: #f5f5f5;
     --muted-text: rgba(245, 245, 245, 0.82);
@@ -20,6 +18,7 @@ body {
     background-color: var(--bg-color);
     display: flex;
     flex-direction: column;
+    align-items: center;
 }
 
 #background {
@@ -41,27 +40,26 @@ body {
 }
 
 .layout {
+    width: 100%;
     flex: 1;
     display: flex;
     align-items: center;
     justify-content: center;
-    padding: clamp(40px, 8vh, 120px) clamp(20px, 8vw, 120px);
+    padding: clamp(32px, 10vh, 120px) clamp(20px, 8vw, 120px);
 }
 
 .voice-stage {
-    position: relative;
-    width: min(960px, 100%);
-    display: grid;
-    grid-template-columns: repeat(6, 1fr);
+    display: flex;
+    justify-content: center;
     align-items: center;
-    gap: clamp(16px, 6vw, 96px);
+    gap: clamp(24px, 14vw, 140px);
+    width: min(960px, 100%);
 }
 
 .voice-circle {
     position: relative;
-    grid-column: span 2;
-    width: clamp(140px, 28vw, 240px);
-    aspect-ratio: 1/1;
+    width: clamp(140px, 35vw, 220px);
+    aspect-ratio: 1 / 1;
     border-radius: 50%;
     border: 1.5px solid var(--border-color);
     display: flex;
@@ -73,22 +71,6 @@ body {
     transition: border-color 0.4s ease, box-shadow 0.4s ease, transform 0.4s ease;
 }
 
-.voice-circle.ai {
-    grid-column: 2 / span 2;
-}
-
-.voice-circle.user {
-    grid-column: 4 / span 2;
-}
-
-.voice-circle .voice-label {
-    position: relative;
-    font-size: clamp(1rem, 2.2vw, 1.35rem);
-    letter-spacing: 0.08em;
-    text-transform: uppercase;
-    z-index: 2;
-}
-
 .pulse-ring {
     position: absolute;
     inset: 12%;
@@ -166,6 +148,18 @@ body {
     color: var(--text-color);
 }
 
+.sr-only {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    padding: 0;
+    margin: -1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border: 0;
+}
+
 @keyframes pulse {
     0% {
         transform: scale(1);
@@ -180,16 +174,8 @@ body {
 
 @media (max-width: 720px) {
     .voice-stage {
-        grid-template-columns: repeat(4, 1fr);
-        gap: clamp(18px, 10vw, 64px);
-    }
-
-    .voice-circle.ai {
-        grid-column: 1 / span 2;
-    }
-
-    .voice-circle.user {
-        grid-column: 3 / span 2;
+        flex-direction: column;
+        gap: clamp(32px, 14vh, 80px);
     }
 }
 
@@ -198,19 +184,6 @@ body {
         padding-top: clamp(48px, 12vh, 80px);
         padding-bottom: clamp(48px, 18vh, 120px);
     }
-
-    .voice-stage {
-        grid-template-columns: repeat(2, 1fr);
-    }
-
-    .voice-circle {
-        grid-column: span 2;
-        justify-self: center;
-    }
-
-    .voice-circle.ai {
-        margin-bottom: clamp(24px, 8vh, 40px);
-    }
 }
 
 @media (prefers-reduced-motion: reduce) {