diff --git a/api/wevia-chat.php b/api/wevia-chat.php
index 09dde8aac..63f3cb865 100644
--- a/api/wevia-chat.php
+++ b/api/wevia-chat.php
@@ -79,7 +79,7 @@ if ($is_capability) {
 // === Route 2: Orchestrator intent detection (business data) ===
 // V51 PUBLIC SCOPE: route towards bridged public orchestrator (whitelist intents only)
 // DOCTRINE-211 opus-phase73 - detect admin triggers, route to INTERNAL orchestrator
-$__admin_triggers = ['apply ux gemini', 'gemini ux apply', 'applique ux gemini', 'refais ux apply', 'fix ux apply', 'ux premium apply', 'gemini ameliore ux', 'audit ux gemini', 'gemini audit ux', 'review ux gemini', 'gemini review ux', 'minority report', 'zoom cinema', 'zoom hover bloc', 'scroll horizontal premium', 'defilement minority']; // DOCTRINE-219 opus-phase77 add minority triggers
+$__admin_triggers = ['apply ux gemini', 'gemini ux apply', 'applique ux gemini', 'refais ux apply', 'fix ux apply', 'ux premium apply', 'gemini ameliore ux', 'audit ux gemini', 'gemini audit ux', 'review ux gemini', 'gemini review ux', 'minority report', 'zoom cinema', 'zoom hover bloc', 'scroll horizontal premium', 'defilement minority', 'carrousel 3d', 'caroussel 3d', 'carousel 3d', 'caroussel rotation', 'carrousel rotation', 'rotationnel', 'compact header']; // DOCTRINE-219 opus-phase77 add minority triggers
 $__use_internal = false;
 $__msg_lc = mb_strtolower($msg);
 foreach ($__admin_triggers as $__t) { if (strpos($__msg_lc, $__t) !== false) { $__use_internal = true; break; } }
diff --git a/api/wevia-ux-carousel-apply.sh b/api/wevia-ux-carousel-apply.sh
new file mode 100755
index 000000000..478a54c4a
--- /dev/null
+++ b/api/wevia-ux-carousel-apply.sh
@@ -0,0 +1,193 @@
+#!/bin/bash
+# Doctrine 221 opus-phase79 - 3D Carousel Rotation + compact header
+PAGE="${1:-weval-technology-platform}"
+TS=$(date +%Y%m%d-%H%M%S)
+TARGET="/var/www/html/${PAGE}.html"
+
+if [ ! -f "$TARGET" ]; then
+  echo "{\"ok\":false,\"err\":\"not found: $TARGET\"}"
+  exit 1
+fi
+
+if grep -q "DOCTRINE-221-CAROUSEL-ROTATION" "$TARGET"; then
+  echo "{\"ok\":true,\"page\":\"$PAGE\",\"already\":true}"
+  exit 0
+fi
+
+GOLD="/var/www/html/vault-gold/opus/${PAGE}.html.doctrine221-carousel-${TS}.bak"
+mkdir -p /var/www/html/vault-gold/opus
+cp "$TARGET" "$GOLD"
+SIZE_BEFORE=$(stat -c%s "$TARGET")
+
+read -r -d '' PAYLOAD <<'CSS'
+
+<!-- DOCTRINE-221-CAROUSEL-ROTATION opus-phase79 -->
+<style id="doctrine221-carousel">
+  /* Compact header - reduce massive topbar */
+  header, .header, [class*="topbar"], [class*="main-header"], .hero {
+    max-height: 72px !important;
+    padding: 8px 16px !important;
+    overflow: hidden;
+  }
+  header h1, .header h1, [class*="topbar"] h1, .hero h1 {
+    font-size: 1.2rem !important;
+    margin: 0 !important;
+  }
+
+  /* 3D Carousel container - activated by JS */
+  .d221-carousel-active {
+    perspective: 1600px;
+    perspective-origin: center center;
+    overflow-x: auto;
+    scroll-snap-type: x mandatory;
+    scroll-behavior: smooth;
+    padding: 40px 20px;
+    -webkit-overflow-scrolling: touch;
+    scrollbar-width: thin;
+  }
+  .d221-carousel-active > * {
+    scroll-snap-align: center;
+    transition: transform 0.6s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.6s, filter 0.6s !important;
+    transform-origin: center center;
+    will-change: transform, opacity;
+    min-width: 320px;
+    flex-shrink: 0;
+  }
+  /* Side cards dimmed + rotated */
+  .d221-carousel-active > :not(.d221-focus) {
+    opacity: 0.55;
+    filter: brightness(0.7) saturate(0.8);
+  }
+  .d221-carousel-active > .d221-prev { transform: rotateY(28deg) translateZ(-80px) scale(0.9) !important; }
+  .d221-carousel-active > .d221-next { transform: rotateY(-28deg) translateZ(-80px) scale(0.9) !important; }
+  .d221-carousel-active > .d221-focus {
+    transform: rotateY(0deg) translateZ(40px) scale(1.08) !important;
+    opacity: 1 !important;
+    filter: brightness(1.1) saturate(1.15) drop-shadow(0 30px 60px rgba(124, 58, 237, 0.5)) !important;
+    z-index: 10;
+  }
+
+  /* Toggle button floating */
+  .d221-toggle {
+    position: fixed;
+    bottom: 20px;
+    right: 20px;
+    z-index: 9999;
+    background: linear-gradient(135deg, #7c3aed, #ec4899);
+    color: white;
+    border: none;
+    padding: 12px 20px;
+    border-radius: 24px;
+    font-weight: 600;
+    font-size: 13px;
+    cursor: pointer;
+    box-shadow: 0 8px 24px rgba(124, 58, 237, 0.4);
+    transition: transform 0.3s;
+  }
+  .d221-toggle:hover { transform: scale(1.05); }
+
+  /* Carousel scrollbar gradient */
+  .d221-carousel-active::-webkit-scrollbar { height: 10px; }
+  .d221-carousel-active::-webkit-scrollbar-track { background: rgba(124, 58, 237, 0.1); border-radius: 5px; }
+  .d221-carousel-active::-webkit-scrollbar-thumb {
+    background: linear-gradient(90deg, #7c3aed, #ec4899);
+    border-radius: 5px;
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .d221-carousel-active > * { transition: none !important; transform: none !important; }
+  }
+</style>
+<script id="doctrine221-carousel-js">
+(function(){
+  // Wait for DOM
+  function init() {
+    // Find main grid container - try multiple selectors
+    var candidates = document.querySelectorAll('main > div, .dashboard-grid, .cards-wrapper, .hub-grid, .main-grid, [class*="grid"]:not(nav *)');
+    var target = null;
+    var maxChildren = 0;
+    candidates.forEach(function(c){
+      var kids = c.children.length;
+      if (kids >= 5 && kids > maxChildren) { target = c; maxChildren = kids; }
+    });
+
+    function toggleCarousel() {
+      if (!target) {
+        alert('Grid container not found');
+        return;
+      }
+      if (target.classList.contains('d221-carousel-active')) {
+        target.classList.remove('d221-carousel-active');
+        target.style.display = '';
+        btn.textContent = '🎬 Carrousel 3D';
+      } else {
+        target.classList.add('d221-carousel-active');
+        target.style.display = 'flex';
+        target.style.gap = '24px';
+        updateFocus();
+        btn.textContent = '⊞ Grid Mode';
+      }
+    }
+
+    function updateFocus() {
+      if (!target || !target.classList.contains('d221-carousel-active')) return;
+      var kids = Array.from(target.children);
+      var containerRect = target.getBoundingClientRect();
+      var centerX = containerRect.left + containerRect.width / 2;
+      kids.forEach(function(k){
+        k.classList.remove('d221-focus', 'd221-prev', 'd221-next');
+        var rect = k.getBoundingClientRect();
+        var kCenter = rect.left + rect.width / 2;
+        var distance = Math.abs(kCenter - centerX);
+        k.dataset.dist = distance;
+      });
+      var sorted = kids.slice().sort(function(a,b){ return a.dataset.dist - b.dataset.dist; });
+      if (sorted[0]) sorted[0].classList.add('d221-focus');
+      var focusIdx = kids.indexOf(sorted[0]);
+      if (kids[focusIdx-1]) kids[focusIdx-1].classList.add('d221-prev');
+      if (kids[focusIdx+1]) kids[focusIdx+1].classList.add('d221-next');
+    }
+
+    // Create toggle button
+    var btn = document.createElement('button');
+    btn.className = 'd221-toggle';
+    btn.textContent = '🎬 Carrousel 3D';
+    btn.onclick = toggleCarousel;
+    document.body.appendChild(btn);
+
+    // Listen scroll for focus update
+    if (target) {
+      target.addEventListener('scroll', updateFocus, { passive: true });
+      window.addEventListener('resize', updateFocus);
+    }
+
+    console.log('[DOCTRINE-221] Carrousel 3D ready. Target:', target ? target.tagName + '.' + (target.className || '') : 'NOT FOUND', '| children:', maxChildren);
+  }
+  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', init);
+  else init();
+})();
+</script>
+<!-- END-DOCTRINE-221 -->
+
+CSS
+
+TMP=$(mktemp)
+awk -v payload="$PAYLOAD" '/<\/head>/ && !done { print payload; done=1 } { print }' "$TARGET" > "$TMP"
+
+sudo chattr -i "$TARGET" 2>/dev/null || true
+cp "$TMP" "$TARGET"
+sudo chattr +i "$TARGET" 2>/dev/null || true
+rm -f "$TMP"
+
+SIZE_AFTER=$(stat -c%s "$TARGET")
+MARKER_OK=$(grep -c "DOCTRINE-221-CAROUSEL-ROTATION" "$TARGET")
+
+if [ "$MARKER_OK" -ge "1" ] && [ "$SIZE_AFTER" -gt "$SIZE_BEFORE" ]; then
+  echo "{\"ok\":true,\"page\":\"$PAGE\",\"applied\":true,\"size_before\":$SIZE_BEFORE,\"size_after\":$SIZE_AFTER,\"delta\":$((SIZE_AFTER-SIZE_BEFORE)),\"backup\":\"$GOLD\"}"
+else
+  sudo chattr -i "$TARGET" 2>/dev/null || true
+  cp "$GOLD" "$TARGET"
+  sudo chattr +i "$TARGET" 2>/dev/null || true
+  echo "{\"ok\":false,\"err\":\"verify fail\"}"
+  exit 1
+fi
diff --git a/api/wevia-ux-minority-apply.sh b/api/wevia-ux-minority-apply.sh
index 7d6b838f8..48f79f4ab 100755
--- a/api/wevia-ux-minority-apply.sh
+++ b/api/wevia-ux-minority-apply.sh
@@ -1,77 +1,98 @@
 #!/bin/bash
-# Doctrine 218 v2 - Minority Report UX FIX scroll compat zoom browser
-# D220 opus-phase78 - remove body overflow-x (breaks browser zoom scroll-left)
+# D218 v3 D221 opus-phase79 - OVERRIDE native body overflow:hidden
 PAGE="${1:-weval-technology-platform}"
 TS=$(date +%Y%m%d-%H%M%S)
 TARGET="/var/www/html/${PAGE}.html"
 
 if [ ! -f "$TARGET" ]; then
-  echo "{\"ok\":false,\"err\":\"page not found: $TARGET\"}"
-  exit 1
+  echo "{\"ok\":false,\"err\":\"page not found\"}"; exit 1
 fi
 
-if grep -q "DOCTRINE-218-MINORITY-REPORT" "$TARGET"; then
-  echo "{\"ok\":true,\"page\":\"$PAGE\",\"already\":true}"
-  exit 0
+# Check if D218 already in (from v1 or v2)
+if grep -q "DOCTRINE-218-MINORITY-REPORT" "$TARGET" && ! grep -q "v3 D221" "$TARGET"; then
+  # Already has v1/v2, need to upgrade to v3
+  GOLD=$(ls -t /var/www/html/vault-gold/opus/${PAGE}.html.doctrine218* 2>/dev/null | tail -1)
+  if [ -n "$GOLD" ]; then
+    sudo chattr -i "$TARGET" 2>/dev/null || true
+    sudo cp "$GOLD" "$TARGET"
+    sudo chattr +i "$TARGET" 2>/dev/null || true
+  fi
 fi
 
-GOLD="/var/www/html/vault-gold/opus/${PAGE}.html.doctrine218v2-minority-${TS}.bak"
+if grep -q "v3 D221" "$TARGET"; then
+  echo "{\"ok\":true,\"already_v3\":true}"; exit 0
+fi
+
+GOLD="/var/www/html/vault-gold/opus/${PAGE}.html.doctrine218v3-${TS}.bak"
 mkdir -p /var/www/html/vault-gold/opus
 cp "$TARGET" "$GOLD"
 SIZE_BEFORE=$(stat -c%s "$TARGET")
 
 read -r -d '' PAYLOAD <<'CSS'
 
-<!-- DOCTRINE-218-MINORITY-REPORT v2 D220 -->
-<style id="doctrine218-minority-report">
-  /* Smooth scroll NATURE (no body hack) */
-  html { scroll-behavior: smooth; }
+<!-- DOCTRINE-218-MINORITY-REPORT v3 D221 -->
+<style id="doctrine218-v3">
+  /* D221 OVERRIDE native body overflow:hidden to restore horizontal scroll */
+  html { scroll-behavior: smooth; overflow-x: auto !important; }
+  body { overflow-x: auto !important; overflow-y: auto !important; min-width: 100%; }
 
-  /* Universal hover zoom - Minority Report cinema style */
-  .minority-zoom, [class*="card"], [class*="panel"], [class*="bloc"], [class*="kpi"], .stat-card, .metric-card, .hub-card {
-    transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), box-shadow 0.4s, filter 0.4s !important;
+  /* Minority Report hover zoom (non-intrusive, no position absolute change) */
+  [class*="card"], [class*="panel"], [class*="bloc"], [class*="kpi"],
+  .stat-card, .metric-card, .hub-card, .vm-card, .wtp-tile, .wtp-home-module {
+    transition: transform 0.35s cubic-bezier(0.23, 1, 0.32, 1), box-shadow 0.35s, filter 0.35s !important;
     transform-origin: center center;
     will-change: transform;
   }
-  .minority-zoom:hover, [class*="card"]:hover, [class*="panel"]:hover, [class*="bloc"]:hover, [class*="kpi"]:hover, .stat-card:hover, .metric-card:hover, .hub-card:hover {
-    transform: scale(1.06) translateZ(0) !important;
-    box-shadow: 0 20px 60px rgba(124, 58, 237, 0.5), 0 0 80px rgba(236, 72, 153, 0.3), 0 0 0 2px rgba(147, 197, 253, 0.4) !important;
-    filter: brightness(1.15) saturate(1.2) !important;
-    z-index: 100 !important;
+  [class*="card"]:hover, [class*="panel"]:hover, [class*="bloc"]:hover, [class*="kpi"]:hover,
+  .stat-card:hover, .metric-card:hover, .hub-card:hover, .vm-card:hover, .wtp-tile:hover, .wtp-home-module:hover {
+    transform: scale(1.05) translateZ(0) !important;
+    box-shadow: 0 16px 48px rgba(124, 58, 237, 0.45), 0 0 60px rgba(236, 72, 153, 0.25) !important;
+    filter: brightness(1.12) saturate(1.15) !important;
+    z-index: 50 !important;
     position: relative;
   }
 
-  /* Apply scroll ONLY to explicit scroll containers (not body) */
+  /* Premium scrollbar - visible ALWAYS */
+  html::-webkit-scrollbar, body::-webkit-scrollbar { height: 12px; width: 12px; }
+  html::-webkit-scrollbar-track, body::-webkit-scrollbar-track { background: rgba(255,255,255,0.04); }
+  html::-webkit-scrollbar-thumb, body::-webkit-scrollbar-thumb {
+    background: linear-gradient(90deg, #7c3aed, #ec4899);
+    border-radius: 6px;
+    border: 2px solid transparent;
+    background-clip: content-box;
+  }
+  html::-webkit-scrollbar-thumb:hover, body::-webkit-scrollbar-thumb:hover {
+    background: linear-gradient(90deg, #8b5cf6, #f472b6);
+    background-clip: content-box;
+  }
+
+  /* Targeted scroll-snap for explicit containers */
   [class*="scroll-horizontal"], [class*="hscroll"], .row-scroll {
     scroll-snap-type: x mandatory;
-    overflow-x: auto;
+    overflow-x: auto !important;
     scroll-behavior: smooth;
-    scrollbar-width: thin;
-  }
-  [class*="scroll-horizontal"]::-webkit-scrollbar,
-  [class*="hscroll"]::-webkit-scrollbar,
-  .row-scroll::-webkit-scrollbar { height: 8px; }
-  [class*="scroll-horizontal"]::-webkit-scrollbar-thumb,
-  [class*="hscroll"]::-webkit-scrollbar-thumb,
-  .row-scroll::-webkit-scrollbar-thumb {
-    background: linear-gradient(90deg, #7c3aed, #ec4899);
-    border-radius: 4px;
   }
 
   @media (prefers-reduced-motion: reduce) {
-    .minority-zoom, [class*="card"], [class*="panel"] { transition: none !important; transform: none !important; }
+    [class*="card"], [class*="panel"] { transition: none !important; transform: none !important; }
   }
 </style>
-<script id="doctrine218-minority-js">
+<script id="doctrine218-v3-js">
 (function(){
-  // Minority Report gesture: Shift + wheel = horizontal scroll (on body naturally)
+  // Shift+wheel horizontal scroll (Minority Report gesture)
   document.addEventListener('wheel', function(e){
     if (e.shiftKey) {
       e.preventDefault();
       window.scrollBy({ left: e.deltaY * 2, behavior: 'smooth' });
     }
   }, { passive: false });
-  console.log('[DOCTRINE-218 v2] Minority Report UX active');
+  // Also: force body overflow visible on DOMContentLoaded in case inline CSS came later
+  window.addEventListener('DOMContentLoaded', function(){
+    document.body.style.setProperty('overflow-x', 'auto', 'important');
+    document.body.style.setProperty('overflow-y', 'auto', 'important');
+    document.documentElement.style.setProperty('overflow-x', 'auto', 'important');
+    console.log('[DOCTRINE-218 v3 D221] Minority Report UX active - horizontal scroll restored');
+  });
 })();
 </script>
 <!-- END-DOCTRINE-218 -->
@@ -87,14 +108,13 @@ sudo chattr +i "$TARGET" 2>/dev/null || true
 rm -f "$TMP"
 
 SIZE_AFTER=$(stat -c%s "$TARGET")
-MARKER_OK=$(grep -c "DOCTRINE-218-MINORITY-REPORT" "$TARGET")
+MARKER_OK=$(grep -c "v3 D221" "$TARGET")
 
 if [ "$MARKER_OK" = "1" ] && [ "$SIZE_AFTER" -gt "$SIZE_BEFORE" ]; then
-  echo "{\"ok\":true,\"page\":\"$PAGE\",\"applied\":true,\"v\":\"2\",\"size_before\":$SIZE_BEFORE,\"size_after\":$SIZE_AFTER,\"delta\":$((SIZE_AFTER-SIZE_BEFORE)),\"backup\":\"$GOLD\"}"
+  echo "{\"ok\":true,\"page\":\"$PAGE\",\"v\":\"3\",\"size_before\":$SIZE_BEFORE,\"size_after\":$SIZE_AFTER,\"delta\":$((SIZE_AFTER-SIZE_BEFORE))}"
 else
   sudo chattr -i "$TARGET" 2>/dev/null || true
   cp "$GOLD" "$TARGET"
   sudo chattr +i "$TARGET" 2>/dev/null || true
-  echo "{\"ok\":false,\"err\":\"verify fail\"}"
-  exit 1
+  echo "{\"ok\":false,\"err\":\"verify fail\"}"; exit 1
 fi
diff --git a/api/wired-pending/intent-opus4-wevia_ux_carousel_rotation.php b/api/wired-pending/intent-opus4-wevia_ux_carousel_rotation.php
new file mode 100644
index 000000000..289535ee9
--- /dev/null
+++ b/api/wired-pending/intent-opus4-wevia_ux_carousel_rotation.php
@@ -0,0 +1,27 @@
+<?php
+// OPUS5 PROMOTED 2026-04-24 doctrine 221 - wevia_ux_carousel_rotation
+return array (
+  'name' => 'wevia_ux_carousel_rotation',
+  'domain' => 'ux_premium',
+  'priority' => 'P1',
+  'triggers' => 
+  array (
+    0 => 'carrousel 3d',
+    1 => 'caroussel 3d',
+    2 => 'carousel 3d',
+    3 => 'caroussel rotation',
+    4 => 'carrousel rotation',
+    5 => 'rotation carousel',
+    6 => 'fait caroussel',
+    7 => 'fait carousel',
+    8 => 'rotationnel',
+    9 => 'compact header',
+    10 => 'header compact',
+  ),
+  'cmd' => 'PAGE=$(echo "${MSG}" | grep -oE "[a-z][a-z0-9-]{3,}" | grep -vE "^(carrousel|caroussel|carousel|rotation|rotationnel|3d|compact|header|fait|la|le|de|du|des|page|pour|et|avec)$" | head -1); PAGE="${PAGE:-weval-technology-platform}"; /var/www/html/api/wevia-ux-carousel-apply.sh "$PAGE" 2>&1',
+  'status' => 'EXECUTED',
+  'created_at' => '2026-04-24T21:22:00+00:00',
+  'source' => 'opus-phase79-doctrine221',
+  'description' => 'WEVIA carrousel 3D rotation coverflow sur blocs + header compact',
+  'executed_at' => '2026-04-24T21:22:00+00:00',
+);
diff --git a/weval-technology-platform.html b/weval-technology-platform.html
index a9c1ade62..81cbdc394 100644
--- a/weval-technology-platform.html
+++ b/weval-technology-platform.html
@@ -413,59 +413,199 @@ body::before {
 <!-- DOCTRINE-201-GEMINI-APPLY-20260424-195152 -->
 <style>/* Base styles and variables */:root {    --wtp-bg: #1A1B2C; /* Dark blue-purple background */    --wtp-card: #2A2B3D; /* Slightly lighter card background */    --wtp-primary: #6A5ACD; /* Slate blue/purple for primary actions */    --wtp-accent: #8A2BE2; /* Blue violet for highlights and gradients */    --wtp-text-light: #E0E0E0; /* Light text */    --wtp-text-muted: #A0A0A0; /* Muted text */    --wtp-border-radius: 12px;    --wtp-transition-speed: 0.3s ease;}body {    font-family: 'Inter', sans-serif; /* Assuming Inter is available or a fallback */    background-color: var(--wtp-bg);    color: var(--wtp-text-light);    margin: 0;    padding: 0;    line-height: 1.6;    display: flex;    justify-content: center;    align-items: center;    min-height: 100vh;    box-sizing: border-box;}/* Premium Hero Section */.wtp-hero-premium {    position: relative;    width: 100%;    min-height: 100vh;    display: flex;    justify-content: center;    align-items: center;    background: linear-gradient(135deg, var(--wtp-bg) 0%, #10111A 100%); /* Subtle background gradient */    overflow: hidden; /* Ensure backdrop doesn't spill */}/* Backdrop filter for hero section */.wtp-hero-premium::before {    content: '';    position: absolute;    top: 0;    left: 0;    width: 100%;    height: 100%;    background: rgba(0, 0, 0, 0.2); /* Dark overlay for depth */    backdrop-filter: blur(5px); /* Subtle blur effect */    z-index: 0;}.wtp-hero-premium > * {    z-index: 1; /* Ensure content is above the backdrop */}.wtp-hero-premium .login-card { /* Ensure the login card is centered within the hero */    margin: auto;}/* KPI Card */.wtp-kpi-card {    background-color: var(--wtp-card);    border-radius: var(--wtp-border-radius);    padding: 25px;    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);    max-width: 300px;    text-align: center;    position: relative;    overflow: hidden;    border: 1px solid rgba(255, 255, 255, 0.05);    margin: 20px auto; /* Example margin for standalone card */}/* KPI Card Header */.wtp-kpi-card h3 {    margin-top: 0;    color: var(--wtp-text-light);    font-size: 1.4em;}/* KPI Card Paragraph */.wtp-kpi-card p {    color: var(--wtp-text-muted);    font-size: 0.9em;}/* Sparkline SVG simulation */.wtp-kpi-card .sparkline {    width: 100%;    height: 60px;    margin-top: 15px;    background: linear-gradient(to right,        var(--wtp-primary) 0%,        var(--wtp-accent) 20%,        var(--wtp-primary) 40%,        var(--wtp-accent) 60%,        var(--wtp-primary) 80%,        var(--wtp-accent) 100%    );    background-size: 200% 100%; /* For animation */    background-position: 0% 0%;    border-radius: 5px;    opacity: 0.7;    position: relative;    overflow: hidden;}.wtp-kpi-card .sparkline::before {    content: '';    position: absolute;    top: 0;    left: 0;    width: 100%;    height: 100%;    background: repeating-linear-gradient(        45deg,        rgba(255,255,255,0.05),        rgba(255,255,255,0.05) 1px,        transparent 1px,        transparent 5px    );    opacity: 0.3;}/* Status LED */@keyframes pulse {    0% { transform: scale(0.8); opacity: 0.7; }    50% { transform: scale(1); opacity: 1; }    100% { transform: scale(0.8); opacity: 0.7; }}/* Status LED Base */.wtp-status-led {    display: inline-block;    width: 12px;    height: 12px;    border-radius: 50%;    background-color: #28a745; /* Green for live/active */    box-shadow: 0 0 0 0 rgba(40, 167, 69, 0.7);    animation: pulse 1.5s infinite ease-in-out;    margin-right: 8px;    vertical-align: middle;}/* Status LED Offline variant */.wtp-status-led.offline {    background-color: #dc3545; /* Red for offline */    box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.7);}/* Action Button */.wtp-action-btn {    display: inline-block;    padding: 14px 28px;    border-radius: var(--wtp-border-radius);    font-size: 1.1em;    font-weight: 600;    text-decoration: none;    color: var(--wtp-text-light);    background: linear-gradient(90deg, var(--wtp-primary) 0%, var(--wtp-accent) 100%);    background-size: 200% 100%; /* For gradient shift */    background-position: 0% 0%;    border: none;    cursor: pointer;    transition: background-position var(--wtp-transition-speed), transform var(--wtp-transition-speed), box-shadow var(--wtp-transition-speed);    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);    margin-top: 20px;}/* Action Button Hover */.wtp-action-btn:hover {    background-position: 100% 0%; /* Shift gradient */    transform: translateY(-3px);    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.35);}/* Action Button Active */.wtp-action-btn:active {    transform: translateY(0);    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);}/* Specific styles for the login card based on the image */.login-card {    background-color: var(--wtp-card);    border-radius: var(--wtp-border-radius);    padding: 40px;    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);    text-align: center;    max-width: 400px;    width: 90%;    position: relative; /* For z-index to work with hero backdrop */    z-index: 1;    border: 1px solid rgba(255, 255, 255, 0.08);}/* Login Card Logo Placeholder */.login-card .logo-placeholder {    width: 60px;    height: 60px;    border-radius: 50%;    border: 2px solid var(--wtp-primary);    margin: 0 auto 25px;    display: flex;    justify-content: center;    align-items: center;    font-size: 1.8em;    color: var(--wtp-primary);    opacity: 0.8;}/* Login Card Title */.login-card h1 {    font-size: 1.8em;    margin-bottom: 10px;    color: var(--wtp-text-light);    font-weight: 700;}/* Login Card Title Span */.login-card h1 span {    font-weight: 400;    color: var(--wtp-text-muted);}/* Login Card Paragraph */.login-card p {    font-size: 0.95em;    color: var(--wtp-text-muted);    margin-bottom: 30px;}/* Login Card Action Button */.login-card .wtp-action-btn {    width: 100%;    margin-bottom: 20px;    padding: 16px;    font-size: 1.2em;}/* Login Card Separator */.login-card .separator {    display: flex;    align-items: center;    text-align: center;    color: var(--wtp-text-muted);    margin: 25px 0;    font-size: 0.85em;}.login-card .separator::before,.login-card .separator::after {    content: '';    flex: 1;    border-bottom: 1px solid rgba(255, 255, 255, 0.1);}.login-card .separator:not(:empty)::before {    margin-right: .5em;}.login-card .separator:not(:empty)::after {    margin-left: .5em;}/* Login Card Links */.login-card .manual-login-link,.login-card .footer-link {    color: var(--wtp-primary);    text-decoration: none;    font-size: 0.9em;    transition: color var(--wtp-transition-speed);}.login-card .manual-login-link:hover,.login-card .footer-link:hover {    color: var(--wtp-accent);    text-decoration: underline;}/* Login Card Security Info */.login-card .security-info {    font-size: 0.8em;    color: var(--wtp-text-muted);    margin-top: 20px;}/* Login Card Copyright */.login-card .copyright {    font-size: 0.75em;    color: var(--wtp-text-muted);    margin-top: 25px;}/* Mobile Media Query */@media (max-width: 768px) {    .login-card {        padding: 30px 20px;        width: 95%;    }    .wtp-action-btn {        padding: 12px 20px;        font-size: 1em;    }    .wtp-hero-premium {        align-items: flex-start; /* Adjust alignment for smaller screens */        padding-top: 50px;    }    /* Anti-overlap for a hypothetical bot-widget */    .bot-widget {        position: fixed;        bottom: 100px; /* Pushes it up to prevent overlap with typical mobile navigation/footer */        left: 20px;        right: 20px;        z-index: 1000;        /* Add other styling for bot-widget */        background-color: var(--wtp-card);        border-radius: var(--wtp-border-radius);        padding: 15px;        box-shadow: 0 -5px 15px rgba(0,0,0,0.2);        text-align: center;    }}/* Font import (optional, but good for consistency) */@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700&display=swap');</style>
 <!-- END-DOCTRINE-201 -->
-<!-- DOCTRINE-218-MINORITY-REPORT v2 D220 -->
-<style id="doctrine218-minority-report">
-  /* Smooth scroll NATURE (no body hack) */
-  html { scroll-behavior: smooth; }
 
-  /* Universal hover zoom - Minority Report cinema style */
-  .minority-zoom, [class*="card"], [class*="panel"], [class*="bloc"], [class*="kpi"], .stat-card, .metric-card, .hub-card {
-    transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), box-shadow 0.4s, filter 0.4s !important;
+<!-- DOCTRINE-218-MINORITY-REPORT v3 D221 -->
+<style id="doctrine218-v3">
+  html { scroll-behavior: smooth; overflow-x: auto !important; }
+  body { overflow-x: auto !important; overflow-y: auto !important; min-width: 100%; }
+
+  [class*="card"], [class*="panel"], [class*="bloc"], [class*="kpi"],
+  .stat-card, .metric-card, .hub-card, .vm-card, .wtp-tile, .wtp-home-module {
+    transition: transform 0.35s cubic-bezier(0.23, 1, 0.32, 1), box-shadow 0.35s, filter 0.35s !important;
     transform-origin: center center;
     will-change: transform;
   }
-  .minority-zoom:hover, [class*="card"]:hover, [class*="panel"]:hover, [class*="bloc"]:hover, [class*="kpi"]:hover, .stat-card:hover, .metric-card:hover, .hub-card:hover {
-    transform: scale(1.06) translateZ(0) !important;
-    box-shadow: 0 20px 60px rgba(124, 58, 237, 0.5), 0 0 80px rgba(236, 72, 153, 0.3), 0 0 0 2px rgba(147, 197, 253, 0.4) !important;
-    filter: brightness(1.15) saturate(1.2) !important;
-    z-index: 100 !important;
+  [class*="card"]:hover, [class*="panel"]:hover, [class*="bloc"]:hover, [class*="kpi"]:hover,
+  .stat-card:hover, .metric-card:hover, .hub-card:hover, .vm-card:hover, .wtp-tile:hover, .wtp-home-module:hover {
+    transform: scale(1.05) translateZ(0) !important;
+    box-shadow: 0 16px 48px rgba(124, 58, 237, 0.45), 0 0 60px rgba(236, 72, 153, 0.25) !important;
+    filter: brightness(1.12) saturate(1.15) !important;
+    z-index: 50 !important;
     position: relative;
   }
 
-  /* Apply scroll ONLY to explicit scroll containers (not body) */
-  [class*="scroll-horizontal"], [class*="hscroll"], .row-scroll {
-    scroll-snap-type: x mandatory;
-    overflow-x: auto;
-    scroll-behavior: smooth;
-    scrollbar-width: thin;
-  }
-  [class*="scroll-horizontal"]::-webkit-scrollbar,
-  [class*="hscroll"]::-webkit-scrollbar,
-  .row-scroll::-webkit-scrollbar { height: 8px; }
-  [class*="scroll-horizontal"]::-webkit-scrollbar-thumb,
-  [class*="hscroll"]::-webkit-scrollbar-thumb,
-  .row-scroll::-webkit-scrollbar-thumb {
+  html::-webkit-scrollbar, body::-webkit-scrollbar { height: 12px; width: 12px; }
+  html::-webkit-scrollbar-track, body::-webkit-scrollbar-track { background: rgba(255,255,255,0.04); }
+  html::-webkit-scrollbar-thumb, body::-webkit-scrollbar-thumb {
     background: linear-gradient(90deg, #7c3aed, #ec4899);
-    border-radius: 4px;
+    border-radius: 6px;
   }
 
   @media (prefers-reduced-motion: reduce) {
-    .minority-zoom, [class*="card"], [class*="panel"] { transition: none !important; transform: none !important; }
+    [class*="card"], [class*="panel"] { transition: none !important; transform: none !important; }
   }
 </style>
-<script id="doctrine218-minority-js">
+<script id="doctrine218-v3-js">
 (function(){
-  // Minority Report gesture: Shift + wheel = horizontal scroll (on body naturally)
   document.addEventListener('wheel', function(e){
-    if (e.shiftKey) {
-      e.preventDefault();
-      window.scrollBy({ left: e.deltaY * 2, behavior: 'smooth' });
-    }
+    if (e.shiftKey) { e.preventDefault(); window.scrollBy({ left: e.deltaY * 2, behavior: 'smooth' }); }
   }, { passive: false });
-  console.log('[DOCTRINE-218 v2] Minority Report UX active');
+  window.addEventListener('DOMContentLoaded', function(){
+    document.body.style.setProperty('overflow-x', 'auto', 'important');
+    document.body.style.setProperty('overflow-y', 'auto', 'important');
+    document.documentElement.style.setProperty('overflow-x', 'auto', 'important');
+    console.log('[D218 v3 D221] Minority Report + scroll restored');
+  });
 })();
 </script>
 <!-- END-DOCTRINE-218 -->
+<!-- DOCTRINE-221-CAROUSEL-ROTATION opus-phase79 -->
+<style id="doctrine221-carousel">
+  /* Compact header - reduce massive topbar */
+  header, .header, [class*="topbar"], [class*="main-header"], .hero {
+    max-height: 72px !important;
+    padding: 8px 16px !important;
+    overflow: hidden;
+  }
+  header h1, .header h1, [class*="topbar"] h1, .hero h1 {
+    font-size: 1.2rem !important;
+    margin: 0 !important;
+  }
+
+  /* 3D Carousel container - activated by JS */
+  .d221-carousel-active {
+    perspective: 1600px;
+    perspective-origin: center center;
+    overflow-x: auto;
+    scroll-snap-type: x mandatory;
+    scroll-behavior: smooth;
+    padding: 40px 20px;
+    -webkit-overflow-scrolling: touch;
+    scrollbar-width: thin;
+  }
+  .d221-carousel-active > * {
+    scroll-snap-align: center;
+    transition: transform 0.6s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.6s, filter 0.6s !important;
+    transform-origin: center center;
+    will-change: transform, opacity;
+    min-width: 320px;
+    flex-shrink: 0;
+  }
+  /* Side cards dimmed + rotated */
+  .d221-carousel-active > :not(.d221-focus) {
+    opacity: 0.55;
+    filter: brightness(0.7) saturate(0.8);
+  }
+  .d221-carousel-active > .d221-prev { transform: rotateY(28deg) translateZ(-80px) scale(0.9) !important; }
+  .d221-carousel-active > .d221-next { transform: rotateY(-28deg) translateZ(-80px) scale(0.9) !important; }
+  .d221-carousel-active > .d221-focus {
+    transform: rotateY(0deg) translateZ(40px) scale(1.08) !important;
+    opacity: 1 !important;
+    filter: brightness(1.1) saturate(1.15) drop-shadow(0 30px 60px rgba(124, 58, 237, 0.5)) !important;
+    z-index: 10;
+  }
+
+  /* Toggle button floating */
+  .d221-toggle {
+    position: fixed;
+    bottom: 20px;
+    right: 20px;
+    z-index: 9999;
+    background: linear-gradient(135deg, #7c3aed, #ec4899);
+    color: white;
+    border: none;
+    padding: 12px 20px;
+    border-radius: 24px;
+    font-weight: 600;
+    font-size: 13px;
+    cursor: pointer;
+    box-shadow: 0 8px 24px rgba(124, 58, 237, 0.4);
+    transition: transform 0.3s;
+  }
+  .d221-toggle:hover { transform: scale(1.05); }
+
+  /* Carousel scrollbar gradient */
+  .d221-carousel-active::-webkit-scrollbar { height: 10px; }
+  .d221-carousel-active::-webkit-scrollbar-track { background: rgba(124, 58, 237, 0.1); border-radius: 5px; }
+  .d221-carousel-active::-webkit-scrollbar-thumb {
+    background: linear-gradient(90deg, #7c3aed, #ec4899);
+    border-radius: 5px;
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .d221-carousel-active > * { transition: none !important; transform: none !important; }
+  }
+</style>
+<script id="doctrine221-carousel-js">
+(function(){
+  // Wait for DOM
+  function init() {
+    // Find main grid container - try multiple selectors
+    var candidates = document.querySelectorAll('main > div, .dashboard-grid, .cards-wrapper, .hub-grid, .main-grid, [class*="grid"]:not(nav *)');
+    var target = null;
+    var maxChildren = 0;
+    candidates.forEach(function(c){
+      var kids = c.children.length;
+      if (kids >= 5 && kids > maxChildren) { target = c; maxChildren = kids; }
+    });
+
+    function toggleCarousel() {
+      if (!target) {
+        alert('Grid container not found');
+        return;
+      }
+      if (target.classList.contains('d221-carousel-active')) {
+        target.classList.remove('d221-carousel-active');
+        target.style.display = '';
+        btn.textContent = '🎬 Carrousel 3D';
+      } else {
+        target.classList.add('d221-carousel-active');
+        target.style.display = 'flex';
+        target.style.gap = '24px';
+        updateFocus();
+        btn.textContent = '⊞ Grid Mode';
+      }
+    }
+
+    function updateFocus() {
+      if (!target || !target.classList.contains('d221-carousel-active')) return;
+      var kids = Array.from(target.children);
+      var containerRect = target.getBoundingClientRect();
+      var centerX = containerRect.left + containerRect.width / 2;
+      kids.forEach(function(k){
+        k.classList.remove('d221-focus', 'd221-prev', 'd221-next');
+        var rect = k.getBoundingClientRect();
+        var kCenter = rect.left + rect.width / 2;
+        var distance = Math.abs(kCenter - centerX);
+        k.dataset.dist = distance;
+      });
+      var sorted = kids.slice().sort(function(a,b){ return a.dataset.dist - b.dataset.dist; });
+      if (sorted[0]) sorted[0].classList.add('d221-focus');
+      var focusIdx = kids.indexOf(sorted[0]);
+      if (kids[focusIdx-1]) kids[focusIdx-1].classList.add('d221-prev');
+      if (kids[focusIdx+1]) kids[focusIdx+1].classList.add('d221-next');
+    }
+
+    // Create toggle button
+    var btn = document.createElement('button');
+    btn.className = 'd221-toggle';
+    btn.textContent = '🎬 Carrousel 3D';
+    btn.onclick = toggleCarousel;
+    document.body.appendChild(btn);
+
+    // Listen scroll for focus update
+    if (target) {
+      target.addEventListener('scroll', updateFocus, { passive: true });
+      window.addEventListener('resize', updateFocus);
+    }
+
+    console.log('[DOCTRINE-221] Carrousel 3D ready. Target:', target ? target.tagName + '.' + (target.className || '') : 'NOT FOUND', '| children:', maxChildren);
+  }
+  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', init);
+  else init();
+})();
+</script>
+<!-- END-DOCTRINE-221 -->
 </head>
 <body>
 <div class="wevia-portal-banner">
diff --git a/wevia-cockpit.html b/wevia-cockpit.html
index cdb99b019..912705399 100644
--- a/wevia-cockpit.html
+++ b/wevia-cockpit.html
@@ -163,56 +163,49 @@ html{scroll-behavior:smooth}
 .wevia-portal-banner + *{margin-top:0!important}
 </style>
 <link rel="stylesheet" href="/css/wevia-portal-consistency.css?v=w321">
-<!-- DOCTRINE-218-MINORITY-REPORT v2 D220 -->
-<style id="doctrine218-minority-report">
-  /* Smooth scroll NATURE (no body hack) */
-  html { scroll-behavior: smooth; }
 
-  /* Universal hover zoom - Minority Report cinema style */
-  .minority-zoom, [class*="card"], [class*="panel"], [class*="bloc"], [class*="kpi"], .stat-card, .metric-card, .hub-card {
-    transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), box-shadow 0.4s, filter 0.4s !important;
+<!-- DOCTRINE-218-MINORITY-REPORT v3 D221 -->
+<style id="doctrine218-v3">
+  html { scroll-behavior: smooth; overflow-x: auto !important; }
+  body { overflow-x: auto !important; overflow-y: auto !important; min-width: 100%; }
+
+  [class*="card"], [class*="panel"], [class*="bloc"], [class*="kpi"],
+  .stat-card, .metric-card, .hub-card, .vm-card, .wtp-tile, .wtp-home-module {
+    transition: transform 0.35s cubic-bezier(0.23, 1, 0.32, 1), box-shadow 0.35s, filter 0.35s !important;
     transform-origin: center center;
     will-change: transform;
   }
-  .minority-zoom:hover, [class*="card"]:hover, [class*="panel"]:hover, [class*="bloc"]:hover, [class*="kpi"]:hover, .stat-card:hover, .metric-card:hover, .hub-card:hover {
-    transform: scale(1.06) translateZ(0) !important;
-    box-shadow: 0 20px 60px rgba(124, 58, 237, 0.5), 0 0 80px rgba(236, 72, 153, 0.3), 0 0 0 2px rgba(147, 197, 253, 0.4) !important;
-    filter: brightness(1.15) saturate(1.2) !important;
-    z-index: 100 !important;
+  [class*="card"]:hover, [class*="panel"]:hover, [class*="bloc"]:hover, [class*="kpi"]:hover,
+  .stat-card:hover, .metric-card:hover, .hub-card:hover, .vm-card:hover, .wtp-tile:hover, .wtp-home-module:hover {
+    transform: scale(1.05) translateZ(0) !important;
+    box-shadow: 0 16px 48px rgba(124, 58, 237, 0.45), 0 0 60px rgba(236, 72, 153, 0.25) !important;
+    filter: brightness(1.12) saturate(1.15) !important;
+    z-index: 50 !important;
     position: relative;
   }
 
-  /* Apply scroll ONLY to explicit scroll containers (not body) */
-  [class*="scroll-horizontal"], [class*="hscroll"], .row-scroll {
-    scroll-snap-type: x mandatory;
-    overflow-x: auto;
-    scroll-behavior: smooth;
-    scrollbar-width: thin;
-  }
-  [class*="scroll-horizontal"]::-webkit-scrollbar,
-  [class*="hscroll"]::-webkit-scrollbar,
-  .row-scroll::-webkit-scrollbar { height: 8px; }
-  [class*="scroll-horizontal"]::-webkit-scrollbar-thumb,
-  [class*="hscroll"]::-webkit-scrollbar-thumb,
-  .row-scroll::-webkit-scrollbar-thumb {
+  html::-webkit-scrollbar, body::-webkit-scrollbar { height: 12px; width: 12px; }
+  html::-webkit-scrollbar-track, body::-webkit-scrollbar-track { background: rgba(255,255,255,0.04); }
+  html::-webkit-scrollbar-thumb, body::-webkit-scrollbar-thumb {
     background: linear-gradient(90deg, #7c3aed, #ec4899);
-    border-radius: 4px;
+    border-radius: 6px;
   }
 
   @media (prefers-reduced-motion: reduce) {
-    .minority-zoom, [class*="card"], [class*="panel"] { transition: none !important; transform: none !important; }
+    [class*="card"], [class*="panel"] { transition: none !important; transform: none !important; }
   }
 </style>
-<script id="doctrine218-minority-js">
+<script id="doctrine218-v3-js">
 (function(){
-  // Minority Report gesture: Shift + wheel = horizontal scroll (on body naturally)
   document.addEventListener('wheel', function(e){
-    if (e.shiftKey) {
-      e.preventDefault();
-      window.scrollBy({ left: e.deltaY * 2, behavior: 'smooth' });
-    }
+    if (e.shiftKey) { e.preventDefault(); window.scrollBy({ left: e.deltaY * 2, behavior: 'smooth' }); }
   }, { passive: false });
-  console.log('[DOCTRINE-218 v2] Minority Report UX active');
+  window.addEventListener('DOMContentLoaded', function(){
+    document.body.style.setProperty('overflow-x', 'auto', 'important');
+    document.body.style.setProperty('overflow-y', 'auto', 'important');
+    document.documentElement.style.setProperty('overflow-x', 'auto', 'important');
+    console.log('[D218 v3 D221] Minority Report + scroll restored');
+  });
 })();
 </script>
 <!-- END-DOCTRINE-218 -->