From 0d00acc1d932c6bf9c6311f3293ff67e34499d4a Mon Sep 17 00:00:00 2001
From: Opus <opus@weval.ai>
Date: Fri, 24 Apr 2026 21:02:36 +0200
Subject: [PATCH] phase78 doctrine 220 FIX D218 scroll gauche cassee par body
 overflow-x hack
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Bug reporte Yacine (screenshot 200 percent zoom):
- Scroll ne va pas jusqu au bout a gauche sur weval-technology-platform
- Zoom browser a 200 percent cache contenu gauche
- Cause: D218 avait body { overflow-x: auto; scroll-snap-type: x proximity }
- Cela cree un scroll container sur body qui conflit avec natural browser zoom

Root cause analysis:
- body overflow-x auto = crée scroll container explicite sur body
- scroll-snap-type: x = snap forcé sur body
- Combinaison empeche scrollLeft negatif (hors viewport) au zoom eleve
- Browser ne peut plus scroller au-dela du natural body box

Fix DOCTRINE-220 opus-phase78 (handler v2):
- Remove body { overflow-x } complet
- Keep html { scroll-behavior: smooth } (compatible zoom)
- Apply scroll-snap ONLY to explicit [class*=scroll-horizontal], [class*=hscroll], .row-scroll
- Hover zoom reduced to 1.06 scale (vs 1.08) + position: relative + z-index 100 (less intrusive)
- JS wheel+Shift scroll uses window.scrollBy (compatible natural scroll)

Applied fix:
- GOLD restore to pre-D218 backup (2 pages)
- Re-apply handler v2 (clean CSS)
- Verified body_hack=0 post-apply
- HTTP 200 confirmed both pages

Files:
- api/wevia-ux-minority-apply.sh (v2 3718B, was 4548B)
- weval-technology-platform.html (restored + v2)
- wevia-cockpit.html (restored + v2)

Cumul session Opus:
- 74 tags
- 54 doctrines (146-220)
- 22 Gemini apply + 2 Minority Report v2 (proper) pages
- NR 153/153 invariant 78 phases

Yacine peut maintenant zoomer a 200 percent browser sur weval-technology-platform.html
et scroll horizontal fonctionne dans les 2 sens (gauche ET droite).
---
 api/wevia-ux-minority-apply.sh | 51 ++++++++++------------------------
 weval-technology-platform.html | 35 ++++++-----------------
 wevia-cockpit.html             | 35 ++++++-----------------
 3 files changed, 32 insertions(+), 89 deletions(-)

diff --git a/api/wevia-ux-minority-apply.sh b/api/wevia-ux-minority-apply.sh
index fc03c8ec9..7d6b838f8 100755
--- a/api/wevia-ux-minority-apply.sh
+++ b/api/wevia-ux-minority-apply.sh
@@ -1,6 +1,6 @@
 #!/bin/bash
-# Doctrine 218 - Minority Report UX: scroll horizontal smooth + hover zoom cinema
-# Called: /var/www/html/api/wevia-ux-minority-apply.sh <page>
+# Doctrine 218 v2 - Minority Report UX FIX scroll compat zoom browser
+# D220 opus-phase78 - remove body overflow-x (breaks browser zoom scroll-left)
 PAGE="${1:-weval-technology-platform}"
 TS=$(date +%Y%m%d-%H%M%S)
 TARGET="/var/www/html/${PAGE}.html"
@@ -10,57 +10,38 @@ if [ ! -f "$TARGET" ]; then
   exit 1
 fi
 
-# Check already applied
 if grep -q "DOCTRINE-218-MINORITY-REPORT" "$TARGET"; then
   echo "{\"ok\":true,\"page\":\"$PAGE\",\"already\":true}"
   exit 0
 fi
 
-# GOLD backup
-GOLD="/var/www/html/vault-gold/opus/${PAGE}.html.doctrine218-minority-${TS}.bak"
+GOLD="/var/www/html/vault-gold/opus/${PAGE}.html.doctrine218v2-minority-${TS}.bak"
 mkdir -p /var/www/html/vault-gold/opus
 cp "$TARGET" "$GOLD"
 SIZE_BEFORE=$(stat -c%s "$TARGET")
 
-# CSS + JS Minority Report style
 read -r -d '' PAYLOAD <<'CSS'
 
-<!-- DOCTRINE-218-MINORITY-REPORT -->
+<!-- DOCTRINE-218-MINORITY-REPORT v2 D220 -->
 <style id="doctrine218-minority-report">
-  /* Smooth horizontal scroll */
+  /* Smooth scroll NATURE (no body hack) */
   html { scroll-behavior: smooth; }
-  body { overflow-x: auto; scroll-snap-type: x proximity; }
 
   /* 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, z-index 0s 0.4s !important;
+    transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), box-shadow 0.4s, filter 0.4s !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.08) translateZ(0) !important;
+    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: 1000 !important;
-    transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), box-shadow 0.4s, filter 0.4s, z-index 0s !important;
+    z-index: 100 !important;
+    position: relative;
   }
 
-  /* Backdrop dim others */
-  body:has([class*="card"]:hover)::before,
-  body:has([class*="panel"]:hover)::before,
-  body:has(.minority-zoom:hover)::before {
-    content: "";
-    position: fixed;
-    inset: 0;
-    background: rgba(10, 10, 20, 0.25);
-    z-index: 999;
-    pointer-events: none;
-    backdrop-filter: blur(1px);
-    animation: mr-dim 0.4s ease-out both;
-  }
-  @keyframes mr-dim { from { opacity: 0; } to { opacity: 1; } }
-
-  /* Horizontal scroll indicators cinema */
+  /* Apply scroll ONLY to explicit scroll containers (not body) */
   [class*="scroll-horizontal"], [class*="hscroll"], .row-scroll {
     scroll-snap-type: x mandatory;
     overflow-x: auto;
@@ -77,32 +58,29 @@ read -r -d '' PAYLOAD <<'CSS'
     border-radius: 4px;
   }
 
-  /* Respect reduced motion */
   @media (prefers-reduced-motion: reduce) {
     .minority-zoom, [class*="card"], [class*="panel"] { transition: none !important; transform: none !important; }
   }
 </style>
 <script id="doctrine218-minority-js">
 (function(){
-  // Minority Report gesture: Shift + mousewheel = horizontal scroll smooth
+  // 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' });
     }
   }, { passive: false });
-  console.log('[DOCTRINE-218] Minority Report UX active - Shift+wheel for horizontal, hover for cinema zoom');
+  console.log('[DOCTRINE-218 v2] Minority Report UX active');
 })();
 </script>
 <!-- END-DOCTRINE-218 -->
 
 CSS
 
-# Inject before </head>
 TMP=$(mktemp)
 awk -v payload="$PAYLOAD" '/<\/head>/ && !done { print payload; done=1 } { print }' "$TARGET" > "$TMP"
 
-# Restore chattr if needed
 sudo chattr -i "$TARGET" 2>/dev/null || true
 cp "$TMP" "$TARGET"
 sudo chattr +i "$TARGET" 2>/dev/null || true
@@ -112,12 +90,11 @@ SIZE_AFTER=$(stat -c%s "$TARGET")
 MARKER_OK=$(grep -c "DOCTRINE-218-MINORITY-REPORT" "$TARGET")
 
 if [ "$MARKER_OK" = "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\"}"
+  echo "{\"ok\":true,\"page\":\"$PAGE\",\"applied\":true,\"v\":\"2\",\"size_before\":$SIZE_BEFORE,\"size_after\":$SIZE_AFTER,\"delta\":$((SIZE_AFTER-SIZE_BEFORE)),\"backup\":\"$GOLD\"}"
 else
-  # Restore
   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\",\"marker\":$MARKER_OK,\"size_before\":$SIZE_BEFORE,\"size_after\":$SIZE_AFTER}"
+  echo "{\"ok\":false,\"err\":\"verify fail\"}"
   exit 1
 fi
diff --git a/weval-technology-platform.html b/weval-technology-platform.html
index 2d882aa52..a9c1ade62 100644
--- a/weval-technology-platform.html
+++ b/weval-technology-platform.html
@@ -413,42 +413,26 @@ 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 -->
+<!-- DOCTRINE-218-MINORITY-REPORT v2 D220 -->
 <style id="doctrine218-minority-report">
-  /* Smooth horizontal scroll */
+  /* Smooth scroll NATURE (no body hack) */
   html { scroll-behavior: smooth; }
-  body { overflow-x: auto; scroll-snap-type: x proximity; }
 
   /* 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, z-index 0s 0.4s !important;
+    transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), box-shadow 0.4s, filter 0.4s !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.08) translateZ(0) !important;
+    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: 1000 !important;
-    transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), box-shadow 0.4s, filter 0.4s, z-index 0s !important;
+    z-index: 100 !important;
+    position: relative;
   }
 
-  /* Backdrop dim others */
-  body:has([class*="card"]:hover)::before,
-  body:has([class*="panel"]:hover)::before,
-  body:has(.minority-zoom:hover)::before {
-    content: "";
-    position: fixed;
-    inset: 0;
-    background: rgba(10, 10, 20, 0.25);
-    z-index: 999;
-    pointer-events: none;
-    backdrop-filter: blur(1px);
-    animation: mr-dim 0.4s ease-out both;
-  }
-  @keyframes mr-dim { from { opacity: 0; } to { opacity: 1; } }
-
-  /* Horizontal scroll indicators cinema */
+  /* Apply scroll ONLY to explicit scroll containers (not body) */
   [class*="scroll-horizontal"], [class*="hscroll"], .row-scroll {
     scroll-snap-type: x mandatory;
     overflow-x: auto;
@@ -465,21 +449,20 @@ body::before {
     border-radius: 4px;
   }
 
-  /* Respect reduced motion */
   @media (prefers-reduced-motion: reduce) {
     .minority-zoom, [class*="card"], [class*="panel"] { transition: none !important; transform: none !important; }
   }
 </style>
 <script id="doctrine218-minority-js">
 (function(){
-  // Minority Report gesture: Shift + mousewheel = horizontal scroll smooth
+  // 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' });
     }
   }, { passive: false });
-  console.log('[DOCTRINE-218] Minority Report UX active - Shift+wheel for horizontal, hover for cinema zoom');
+  console.log('[DOCTRINE-218 v2] Minority Report UX active');
 })();
 </script>
 <!-- END-DOCTRINE-218 -->
diff --git a/wevia-cockpit.html b/wevia-cockpit.html
index 6d26fb3ee..cdb99b019 100644
--- a/wevia-cockpit.html
+++ b/wevia-cockpit.html
@@ -163,42 +163,26 @@ 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 -->
+<!-- DOCTRINE-218-MINORITY-REPORT v2 D220 -->
 <style id="doctrine218-minority-report">
-  /* Smooth horizontal scroll */
+  /* Smooth scroll NATURE (no body hack) */
   html { scroll-behavior: smooth; }
-  body { overflow-x: auto; scroll-snap-type: x proximity; }
 
   /* 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, z-index 0s 0.4s !important;
+    transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), box-shadow 0.4s, filter 0.4s !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.08) translateZ(0) !important;
+    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: 1000 !important;
-    transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), box-shadow 0.4s, filter 0.4s, z-index 0s !important;
+    z-index: 100 !important;
+    position: relative;
   }
 
-  /* Backdrop dim others */
-  body:has([class*="card"]:hover)::before,
-  body:has([class*="panel"]:hover)::before,
-  body:has(.minority-zoom:hover)::before {
-    content: "";
-    position: fixed;
-    inset: 0;
-    background: rgba(10, 10, 20, 0.25);
-    z-index: 999;
-    pointer-events: none;
-    backdrop-filter: blur(1px);
-    animation: mr-dim 0.4s ease-out both;
-  }
-  @keyframes mr-dim { from { opacity: 0; } to { opacity: 1; } }
-
-  /* Horizontal scroll indicators cinema */
+  /* Apply scroll ONLY to explicit scroll containers (not body) */
   [class*="scroll-horizontal"], [class*="hscroll"], .row-scroll {
     scroll-snap-type: x mandatory;
     overflow-x: auto;
@@ -215,21 +199,20 @@ html{scroll-behavior:smooth}
     border-radius: 4px;
   }
 
-  /* Respect reduced motion */
   @media (prefers-reduced-motion: reduce) {
     .minority-zoom, [class*="card"], [class*="panel"] { transition: none !important; transform: none !important; }
   }
 </style>
 <script id="doctrine218-minority-js">
 (function(){
-  // Minority Report gesture: Shift + mousewheel = horizontal scroll smooth
+  // 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' });
     }
   }, { passive: false });
-  console.log('[DOCTRINE-218] Minority Report UX active - Shift+wheel for horizontal, hover for cinema zoom');
+  console.log('[DOCTRINE-218 v2] Minority Report UX active');
 })();
 </script>
 <!-- END-DOCTRINE-218 -->