feat: update css.py

src/css.py

@@ -1,6 +1,6 @@
-# Custom CSS for fullscreen image with overlay
+# Custom CSS for fullscreen image with overlay and styled form components
 custom_css = """
-/* ---------- FULLSCREEN BACKGROUND И НАРРАТИВ ---------- */
+/* -------- FULLSCREEN BACKGROUND & NARRATIVE -------- */
 .image-container {
     position: fixed !important;
     top: 0 !important;
@@ -20,7 +20,9 @@ custom_css = """
     bottom: 0 !important;
     left: 0 !important;
     right: 0 !important;
-    background: linear-gradient(transparent, rgba(0,0,0,0.8)) !important;
+    background: linear-gradient(
+        transparent, rgba(0,0,0,0.8)
+    ) !important;
     padding: 40px 20px 20px !important;
     z-index: 10 !important;
     color: white !important;
@@ -47,36 +49,32 @@ custom_css = """
     font-size: 15px !important;
     resize: none !important;
 }
-img { pointer-events: none; }
+img {
+    pointer-events: none;
+}
 
-/* ---------- БЛОК ВЫБОРА ---------- */
-/* Общая прозрачная подложка */
+/* -------- CHOICE SECTION -------- */
 .choice-area {
     background: rgba(0,0,0,0.7) !important;
     border-radius: 10px !important;
     padding: 10px !important;
 }
 
-/* Убираем второе затемнение у самих кнопок — делаем прозрачными */
 .choice-buttons {
-    background: transparent !important;   /* было rgba(0,0,0,0.7) */
+    background: transparent !important;
     border-radius: 10px !important;
-    padding: 10px !important;             /* оставляем внутренний отступ */
+    padding: 10px !important;
 }
-/* radio-контейнеры также прозрачные */
 .choice-buttons > div,
 .choice-buttons fieldset {
     background: transparent !important;
     border: none !important;
 }
-/* подписи radio */
 .choice-buttons label,
 .choice-buttons label span {
     color: white !important;
     font-size: 14px !important;
 }
-
-/* Сами radio-кнопки */
 .choice-buttons input[type="radio"] {
     background: transparent !important;
     border: 2px solid white !important;
@@ -84,17 +82,19 @@ img { pointer-events: none; }
 .choice-buttons input[type="radio"]:checked {
     background: white !important;
 }
-.choice-buttons .form-radio { background: transparent !important; }
-
-/* Дополнительное “наведение” прозрачности на всё внутри */
-.choice-buttons * { background-color: transparent !important; }
+.choice-buttons .form-radio {
+    background: transparent !important;
+}
+.choice-buttons * {
+    background-color: transparent !important;
+}
 .choice-buttons input {
     background-color: transparent !important;
     border: 1px solid rgba(255,255,255,0.5) !important;
     color: white !important;
 }
 
-/* --- легенда/лейбл (What do you choose?) остаётся жирной и БЕЗ фона --- */
+/* Bold legend/label, no background */
 .choice-area .form-label,
 .choice-area legend {
     background: transparent !important;
@@ -102,10 +102,9 @@ img { pointer-events: none; }
     border: none !important;
 }
 
-/* ---------- ПОЛЕ СОБСТВЕННОГО ВАРИАНТА ---------- */
-/* убираем второе затемнение */
+/* -------- CUSTOM INPUT FIELD -------- */
 .choice-input textarea {
-    background: transparent !important;   /* было rgba(0,0,0,0.7) */
+    background: transparent !important;
     border: none !important;
     color: white !important;
     border-radius: 10px !important;
@@ -119,11 +118,15 @@ img { pointer-events: none; }
     margin-top: 10px !important;
 }
 
-/* ---------- ДРУГИЕ МЕЛОЧИ ---------- */
-.gradio-header, .gradio-footer { display: none !important; }
+/* -------- UI MISCELLANEOUS -------- */
+.gradio-header,
+.gradio-footer {
+    display: none !important;
+}
 .image-container .icon-button-wrapper,
-.image-container .icon-buttons { display: none !important; }
-
+.image-container .icon-buttons {
+    display: none !important;
+}
 #back-btn {
     position: fixed !important;
     top: 10px !important;