From 7b54755c7e27da44b1c9290e8b8c221b7351e04c Mon Sep 17 00:00:00 2001
From: Zul <Zulfaqardhiyaulhaq4@gmail.com>
Date: Fri, 9 Oct 2026 00:56:40 +0800
Subject: [PATCH] Make profile portrait perfectly circular with five-band trans
 flag border

---
 client/src/style.css | 34 +++++++++++++++++++++++-----------
 1 file changed, 23 insertions(+), 11 deletions(-)

diff --git a/client/src/style.css b/client/src/style.css
index d701b3a..b5181f5 100644
--- a/client/src/style.css
+++ b/client/src/style.css
@@ -1614,19 +1614,18 @@ footer{
 
   border:10px solid transparent;
 
+  /* Five equal repeating bands, matching the trans pride flag:
+     pastel cyan → pastel pink → white → pastel pink → pastel cyan.
+     The clipped image and frame remain perfectly circular. */
   background:
     linear-gradient(#12101a,#12101a) padding-box,
-    conic-gradient(
-      from -25deg,
-      #5BCEFA 0deg 60deg,
-      #FFFFFF 60deg 84deg,
-      #F5A9B8 84deg 144deg,
-      #FFFFFF 144deg 168deg,
-      #5BCEFA 168deg 228deg,
-      #FFFFFF 228deg 252deg,
-      #F5A9B8 252deg 312deg,
-      #FFFFFF 312deg 336deg,
-      #5BCEFA 336deg 360deg
+    linear-gradient(
+      180deg,
+      #5BCEFA 0% 20%,
+      #F5A9B8 20% 40%,
+      #FFFFFF 40% 60%,
+      #F5A9B8 60% 80%,
+      #5BCEFA 80% 100%
     ) border-box;
 
   box-shadow:
@@ -6363,3 +6362,16 @@ samp{
     padding-right:18px!important;
   }
 }
+
+
+/* Keep the entire profile frame circular at all viewport sizes. */
+.hero-photo-frame,
+.hero-photo-cutout,
+.hero-photo,
+.hero-photo-scan{
+  aspect-ratio:1 / 1;
+  border-radius:50%;
+}
+.hero-photo-frame{
+  max-width:100%;
+}