Archivage de fichiers de l'exo Memory

exercices/memory-pictogrammes/assets/css/memory-game.css

@@ -4,146 +4,18 @@
    ============================================ */
 
 :root {
-    /* NextGN Base Colors */
-    --teal: #0F6E56;
-    --teal-mid: #1D9E75;
-    --teal-light: #E1F5EE;
-    --teal-dark: #085041;
-    --amber: #BA7517;
-    --amber-light: #FAEEDA;
-    --amber-dark: #633806;
-    --coral: #993C1D;
-    --coral-mid: #D85A30;
-    --coral-light: #FAECE7;
-    --purple: #534AB7;
-    --purple-light: #EEEDFE;
-    --purple-dark: #3C3489;
-    --blue: #185FA5;
-    --blue-light: #E6F1FB;
-    --bg: #F7F6F2;
-    --white: #FFFFFF;
-    --text: #1a1a18;
-    --text-muted: #6b6a65;
-    --border: rgba(0,0,0,0.1);
-    
     /* Gamification Colors */
     --success: #4CAF50;
     --warning: #FF9800;
     --info: #2196F3;
     --accent: #FFD700;
-    
+
     /* Shadows */
     --shadow-sm: 0 4px 8px rgba(15, 110, 86, 0.1);
     --shadow-md: 0 8px 16px rgba(15, 110, 86, 0.15);
     --shadow-lg: 0 16px 32px rgba(15, 110, 86, 0.25);
 }
 
-* {
-    margin: 0;
-    padding: 0;
-    box-sizing: border-box;
-}
-
-html, body {
-    height: 100%;
-}
-
-body {
-    font-family: 'DM Sans', sans-serif;
-    background: var(--bg);
-    color: var(--text);
-    line-height: 1.6;
-    overflow-x: hidden;
-}
-
-/* ============================================
-   HEADER & NAVIGATION
-   ============================================ */
-.nav-header {
-    position: fixed;
-    top: 0;
-    left: 0;
-    right: 0;
-    height: 70px;
-    background: rgba(255, 255, 255, 0.95);
-    border-bottom: 1px solid var(--border);
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    padding: 0 40px;
-    z-index: 1000;
-    backdrop-filter: blur(10px);
-}
-
-.header-logo {
-    font-family: 'Syne', sans-serif;
-    font-size: 20px;
-    font-weight: 700;
-    letter-spacing: -0.5px;
-    background: linear-gradient(135deg, var(--teal-mid), var(--coral-mid));
-    -webkit-background-clip: text;
-    -webkit-text-fill-color: transparent;
-    background-clip: text;
-    text-decoration: none;
-}
-
-.header-nav {
-    display: flex;
-    gap: 0;
-}
-
-.header-nav a {
-    font-family: 'Syne', sans-serif;
-    font-size: 12px;
-    font-weight: 600;
-    letter-spacing: 0.08em;
-    text-transform: uppercase;
-    color: var(--text-muted);
-    text-decoration: none;
-    margin-left: 40px;
-    transition: color 0.3s ease;
-    position: relative;
-}
-
-.header-nav a:hover {
-    color: var(--teal-mid);
-}
-
-.header-nav a::after {
-    content: '';
-    position: absolute;
-    bottom: -4px;
-    left: 0;
-    width: 0;
-    height: 2px;
-    background: var(--teal-mid);
-    transition: width 0.3s ease;
-}
-
-.header-nav a:hover::after {
-    width: 100%;
-}
-
-/* ============================================
-   PROGRESS BAR
-   ============================================ */
-.progress {
-    position: fixed;
-    top: 70px;
-    left: 0;
-    right: 0;
-    height: 4px;
-    background: var(--teal-light);
-    z-index: 999;
-}
-
-.progress-fill {
-    height: 100%;
-    background: linear-gradient(90deg, var(--teal-mid), var(--teal-dark));
-    width: 0%;
-    transition: width 0.2s ease;
-}
-
 /* ============================================
    MAIN LAYOUT
    ============================================ */
@@ -442,18 +314,8 @@ footer {
    RESPONSIVE DESIGN
    ============================================ */
 @media (max-width: 768px) {
-    .nav-header {
-        padding: 0 20px;
-    }
-    
-    .header-nav a {
-        margin-left: 20px;
-        font-size: 11px;
-    }
-    
     main {
         padding: 20px;
-        margin-top: 70px;
     }
     
     .intro-section h1 {
@@ -482,23 +344,8 @@ footer {
 }
 
 @media (max-width: 480px) {
-    .nav-header {
-        height: 60px;
-        padding: 0 16px;
-    }
-    
-    .header-logo {
-        font-size: 16px;
-    }
-    
-    .header-nav a {
-        margin-left: 12px;
-        font-size: 10px;
-    }
-    
     main {
         padding: 16px;
-        margin-top: 60px;
     }
     
     .intro-section h1 {