diff --git a/src/client/FlagInput.ts b/src/client/FlagInput.ts
index 698e7260b..9bf17fce6 100644
--- a/src/client/FlagInput.ts
+++ b/src/client/FlagInput.ts
@@ -84,8 +84,7 @@ export class FlagInput extends LitElement {
     return html`
       <button
         id="flag-input"
-        class="flag-btn m-0 border-0 w-full h-full flex cursor-pointer justify-center items-center focus:outline-none focus:ring-0 transition-all duration-200 hover:scale-105 bg-slate-900/80 hover:bg-slate-800/80 active:bg-slate-800/90 rounded-lg overflow-hidden"
-        style="padding: 0 !important;"
+        class="flag-btn p-0! m-0 border-0 w-full h-full flex cursor-pointer justify-center items-center focus:outline-none focus:ring-0 transition-all duration-200 hover:scale-105 bg-slate-900/80 hover:bg-slate-800/80 active:bg-slate-800/90 rounded-lg overflow-hidden"
         title=${buttonTitle}
         @click=${this.onInputClick}
       >
diff --git a/src/client/styles.css b/src/client/styles.css
index 699ed94e5..9873cd4f0 100644
--- a/src/client/styles.css
+++ b/src/client/styles.css
@@ -1,5 +1,6 @@
 @import "tailwindcss";
 
+@custom-variant dark (&:where(.dark, .dark *));
 @custom-variant hover (&:hover);
 
 @theme {