removed color

demo/css.css

@@ -9,29 +9,18 @@ html,body{margin:0;padding:0}
 body{
   font-family:"Inter",system-ui,sans-serif;
   -webkit-font-smoothing:antialiased;
-  background:var(--color-bg-app);
-  color:var(--color-fg-default);
 }
 :where(img,video){max-width:100%;display:block}
 
 /* 2️⃣  Theme tokens – cobalt primary with automatic dark switch */
 :root{
-  /* Gradio 5 design-system variables – override only what we need */
-  --color-primary: #0047AB;              /* cobalt */
-  --color-primary-hover: #003a8f;
-  --color-accent: var(--color-primary);  /* slider / accent */
   --radius-base: 12px;
   --shadow-xs: 0 1px 2px rgb(0 0 0 / .04);
   --shadow-sm: 0 2px 4px rgb(0 0 0 / .08);
   --shadow-md: 0 4px 8px rgb(0 0 0 / .12);
 }
 
-@media (prefers-color-scheme:dark){
-  :root{
-    --color-primary: #86b5ff;                /* light cobalt */
-    --color-primary-hover:#9ac5ff;
-  }
-}
+
 
 /* 3️⃣  Helpers */
 .flow>*+*{margin-top:1rem}
@@ -45,22 +34,9 @@ h2{font-size:clamp(1.6rem,1.5vw+1.2rem,2rem);line-height:1.15}
 h3{font-size:clamp(1.3rem,1vw+1rem,1.6rem);line-height:1.2}
 p{font-size:clamp(1rem,.6vw+.9rem,1.125rem);line-height:1.6}
 
-/* 5️⃣  Hero banner */
-.main-header{
-  padding:3rem 1.25rem;
-  text-align:center;
-  border-radius:var(--radius-base);
-  background:linear-gradient(135deg,var(--color-primary),var(--color-primary-hover));
-  color:#fff;
-  box-shadow:var(--shadow-md);
-}
-@media(prefers-color-scheme:dark){
-  .main-header{background:linear-gradient(135deg,#003a8f,#002866)}
-}
 
 /* 6️⃣  Cards / surfaces */
 .card,.gr-group{
-  background:rgba(255,255,255,.6);
   backdrop-filter:blur(12px) saturate(125%);
   border:1px solid rgba(0,0,0,.04);
   border-radius:var(--radius-base);
@@ -69,7 +45,6 @@ p{font-size:clamp(1rem,.6vw+.9rem,1.125rem);line-height:1.6}
 }
 @media(prefers-color-scheme:dark){
   .card,.gr-group{
-    background:rgba(0,0,0,.35);
     border:1px solid rgba(255,255,255,.05);
   }
 }
@@ -80,7 +55,6 @@ p{font-size:clamp(1rem,.6vw+.9rem,1.125rem);line-height:1.6}
   overflow:auto;
   font-family:Consolas,monospace;
   font-size:.9rem;
-  background:var(--color-bg-secondary);
   border-radius:var(--radius-base);
   padding:.75rem;
   box-shadow:var(--shadow-xs);
@@ -90,20 +64,14 @@ p{font-size:clamp(1rem,.6vw+.9rem,1.125rem);line-height:1.6}
 .gradio-container .gr-tab-nav button{
   font-weight:500;padding:.6rem 1.2rem;transition:all .15s ease;
 }
-.gradio-container .gr-tab-nav button[aria-selected="true"]{
-  color:var(--color-primary);box-shadow:inset 0 -2px 0 0 var(--color-primary);
-}
 
 /* 9️⃣  Buttons & sliders */
 .gradio-container [data-testid="component-button"]{
   border-radius:var(--radius-base);font-weight:600;
-  background:var(--color-primary);color:var(--color-fg-on-primary);transition:.15s;
-}
-.gradio-container [data-testid="component-button"]:hover{
-  background:var(--color-primary-hover);
 }
+
 .gradio-container input[type="range"]::-webkit-slider-thumb{
-  width:14px;height:14px;border-radius:50%;background:var(--color-primary);border:none;
+  width:14px;height:14px;border-radius:50%;
 }
 
 /* 🔟  Video preview */
@@ -111,9 +79,6 @@ p{font-size:clamp(1rem,.6vw+.9rem,1.125rem);line-height:1.6}
 
 /* 1️⃣1️⃣  Footer badge */
 .author-info{
-  background:linear-gradient(135deg,var(--color-primary),var(--color-primary-hover));
-  color:#fff;border-radius:var(--radius-base);padding:1rem;font-size:.85rem;
   text-align:center;box-shadow:var(--shadow-sm);
 }
-.author-info a{color:#ffe;width:max-content;text-decoration:none}
 .author-info a:hover{text-decoration:underline}