Fix Telegram application theme contrast

app/moderator-apply/apply.tsx

@@ -187,7 +187,7 @@ export function ModeratorApplyApp() {
   const style = useMemo(
     () =>
       ({
-        "--tg-bg": theme.bg_color ?? (theme.secondary_bg_color ? "#0e1621" : "#ffffff"),
+        "--tg-bg": theme.bg_color ?? "#ffffff",
         "--tg-secondary-bg": theme.secondary_bg_color ?? "#f4f4f5",
         "--tg-text": theme.text_color ?? "#000000",
         "--tg-hint": theme.hint_color ?? "#707579",
@@ -206,7 +206,8 @@ export function ModeratorApplyApp() {
   }, [status]);
 
   return (
-    <div className="tg-apply-card" style={style}>
+    <main className="tg-apply" style={style}>
+    <div className="tg-apply-card">
       {status === "loading" && <p className="tg-apply-hint">Loading…</p>}
       {status === "outside" && (
         <div className="tg-apply-body">
@@ -273,5 +274,6 @@ export function ModeratorApplyApp() {
         </div>
       )}
     </div>
+    </main>
   );
 }

app/moderator-apply/moderator-apply.css

@@ -69,8 +69,10 @@
   border-color: var(--tg-link, #3390ec);
 }
 
-.tg-apply-input::placeholder {
+.tg-apply-input::placeholder,
+html[data-theme="light"] .tg-apply-input::placeholder {
   color: var(--tg-hint, #707579);
+  opacity: 1;
 }
 
 .tg-apply-error {

app/moderator-apply/page.tsx

@@ -15,9 +15,5 @@ export const viewport: Viewport = {
 };
 
 export default function ModeratorApplyPage() {
-  return (
-    <main className="tg-apply">
-      <ModeratorApplyApp />
-    </main>
-  );
+  return <ModeratorApplyApp />;
 }