Fix: texto blanco sobre verde institucional en elementos rellenos

El verde UABC (#00723F) es demasiado oscuro para texto carbón (~2:1,
falla AA). Corrige BrandMark, nav activo (sidebar/dock), chip de
FiltroCategorias y botón de Google en login a texto/ícono blanco
(~6.2:1). Actualiza DESIGN.md/PRODUCT.md y design.json acorde.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

src/components/alumno/FiltroCategorias.tsx

@@ -46,7 +46,7 @@ export default function FiltroCategorias({ categorias }: Props) {
 
   const chipStyle = (v: string): React.CSSProperties =>
     v === active
-      ? { background: 'var(--color-primary)', color: 'var(--color-ink)', minHeight: '40px', paddingBlock: '0.375rem' }
+      ? { background: 'var(--color-primary)', color: 'white', minHeight: '40px', paddingBlock: '0.375rem' }
       : { minHeight: '40px', paddingBlock: '0.375rem' };
 
   return (

src/layouts/AppLayout.astro

@@ -64,7 +64,7 @@ const activeCheck = (item: NavItem) => {
     <aside id="app-sidebar" class="hidden md:flex md:fixed md:top-0 md:left-0 md:w-64 md:h-screen bg-white text-[color:var(--color-ink)] md:flex-col md:z-40 sidebar-panel transition-transform duration-200 ease-out" style="border-right: 2px solid var(--color-ink);">
       <a href="/" class="p-6 flex items-center gap-3 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--color-ink)]" aria-label="LabPréstamos — Inicio" style="border-bottom: 2px solid var(--color-ink);">
         <div class="w-9 h-9 rounded-[2px] bg-[color:var(--color-primary)] grid place-items-center p-2" style="border: 2px solid var(--color-ink);" aria-hidden="true">
-          <BrandMark class="w-full h-full" />
+          <BrandMark class="w-full h-full text-white" />
         </div>
         <div>
           <div class="font-semibold leading-tight uppercase tracking-wide text-sm">LabPréstamos</div>
@@ -77,7 +77,7 @@ const activeCheck = (item: NavItem) => {
             href={item.href}
             class:list={[
               'flex items-center gap-3 px-3 py-2.5 rounded-[2px] text-sm font-medium uppercase tracking-wide whitespace-nowrap transition-colors',
-              activeCheck(item) ? 'bg-[color:var(--color-primary)]' : 'hover:bg-[color:var(--color-chalk)]'
+              activeCheck(item) ? 'bg-[color:var(--color-primary)] text-white' : 'hover:bg-[color:var(--color-chalk)]'
             ]}
             style={activeCheck(item) ? 'border: 2px solid var(--color-ink);' : 'border: 2px solid transparent;'}
             aria-current={activeCheck(item) ? 'page' : undefined}
@@ -154,7 +154,7 @@ const activeCheck = (item: NavItem) => {
             <span
               class:list={[
                 'grid place-items-center rounded-[2px] w-11 h-11 transition-[background-color,transform] duration-100 motion-safe:active:scale-95',
-                active ? 'bg-[color:var(--color-primary)]' : ''
+                active ? 'bg-[color:var(--color-primary)] text-white' : ''
               ]}
               style={active ? 'border: 2px solid var(--color-ink);' : ''}
             >

src/pages/404.astro

@@ -8,7 +8,7 @@ Astro.response.status = 404;
   <main id="main" class="min-h-screen grid place-items-center p-4">
     <div class="w-full max-w-md text-center">
       <div class="inline-grid place-items-center w-16 h-16 rounded-[2px] bg-[color:var(--color-primary)] mb-4 p-4" style="border: 2px solid var(--color-ink); box-shadow: var(--shadow-hard);">
-        <BrandMark class="w-full h-full" />
+        <BrandMark class="w-full h-full text-white" />
       </div>
       <h1 class="text-2xl font-semibold uppercase tracking-wide">Página no encontrada</h1>
       <p class="text-sm mt-2" style="color: var(--color-pencil);">La dirección no existe o cambió de lugar.</p>

src/pages/login.astro

@@ -17,7 +17,7 @@ const googleAuthUrl = '/api/auth/signin';
     <div class="w-full max-w-md">
       <div class="text-center mb-8">
         <div class="inline-grid place-items-center w-16 h-16 rounded-[2px] bg-[color:var(--color-primary)] p-4 mb-4 motion-safe:animate-[fadein_.4s_ease-out]" style="border: 2px solid var(--color-ink); box-shadow: var(--shadow-hard);">
-          <BrandMark class="w-full h-full" />
+          <BrandMark class="w-full h-full text-white" />
         </div>
         <h1 class="text-2xl md:text-3xl font-semibold uppercase tracking-wide">Sistema de Préstamos</h1>
         <p class="text-sm mt-2" style="color: var(--color-pencil);">Laboratorio de Sistemas Computacionales · UABC</p>
@@ -29,7 +29,7 @@ const googleAuthUrl = '/api/auth/signin';
 
         <a href={googleAuthUrl} class="btn btn-primary w-full">
           <svg width="18" height="18" viewBox="0 0 48 48" aria-hidden="true" focusable="false">
-            <path fill="var(--color-ink)" d="M44.5 20H24v8.5h11.7C34.4 33.4 29.7 36 24 36c-6.6 0-12-5.4-12-12s5.4-12 12-12c2.9 0 5.5 1 7.6 2.7l6.2-6.2C33.8 5.1 29.2 3 24 3 12.4 3 3 12.4 3 24s9.4 21 21 21c11 0 20-8 20-21 0-1.4-.1-2.7-.5-4z"/>
+            <path fill="white" d="M44.5 20H24v8.5h11.7C34.4 33.4 29.7 36 24 36c-6.6 0-12-5.4-12-12s5.4-12 12-12c2.9 0 5.5 1 7.6 2.7l6.2-6.2C33.8 5.1 29.2 3 24 3 12.4 3 3 12.4 3 24s9.4 21 21 21c11 0 20-8 20-21 0-1.4-.1-2.7-.5-4z"/>
           </svg>
           Continuar con Google
         </a>

src/styles/global.css

@@ -2,7 +2,7 @@
 @import "@fontsource-variable/jetbrains-mono";
 
 @theme {
-  /* MotherDuck-derived palette, remapped to LabPréstamos' semantics */
+  /* MotherDuck-derived system (shadow/radius/type mechanics); identity colors are UABC's own */
   --color-cream: #f4efea;
   --color-frost: #ffffff;
   --color-chalk: #f8f8f7;
@@ -12,10 +12,11 @@
   --color-pencil: #a1a1a1;
   --color-graphite: #818181;
 
-  --color-primary: #6fc2ff;
-  --color-primary-hover: #56b4f7;
-  --color-secondary: #ff9538;
-  --color-secondary-hover: #ef8526;
+  /* UABC institutional green/gold — dark enough that primary needs white text, not charcoal */
+  --color-primary: #00723F;
+  --color-primary-hover: #005f34;
+  --color-secondary: #DD971A;
+  --color-secondary-hover: #c78614;
   --color-danger: #f38e84;
   --color-danger-hover: #ec7469;
   /* AA-contrast text variant of Coral Sketch — the fill color reads ~2:1 on white, too light for body text */
@@ -57,7 +58,7 @@
   }
   ::selection {
     background: var(--color-primary);
-    color: var(--color-ink);
+    color: white;
   }
   /* Tabular data keeps real square corners even where a nested control forgets to ask */
   table {
@@ -88,10 +89,10 @@
   }
   .btn-primary {
     background: var(--color-primary);
-    color: var(--color-ink);
+    color: white;
   }
   .btn-secondary {
-    background: var(--color-frost);
+    background: var(--color-secondary);
     color: var(--color-ink);
   }
   .btn-ghost {