/* paysage-plein-20260921-r1.css — 21/09/2026 · révision 1 (lane Opus-paysage-plein)
   LE PLEIN ÉCRAN COUCHÉ N'A PLUS DE BANDES, ET LA BARRE SAFARI NE CRIE PLUS EN BLANC.

   Capture de Stéphane (21/09, 21h14, fiche webcam « Amsterdam — le Damrak et la Beursplein » de
   l'Explorer, iPhone) + consigne : « quand on suit le conseil de tourner le téléphone à
   l'horizontale le plein écran est pas parfait il y a une barre blanche en haut et deux bandes
   noires ». Trois défauts, MESURÉS sur ce qui est SERVI (index du 21/09 19h10, feuille
   feuilles-explorer-20260917-templates-r11.min.css), pas sur une lecture de la capture :

   ① LES DEUX BANDES. `.stream-player.screen-fill .stream-stage>:is(video,iframe,img)` porte
      `object-fit:contain`. Une image 16:9 dans un iPhone couché (~874×352 pt sous la barre
      Safari, soit ~2,48:1) occupe 352×1,78 = ~626 pt de large sur 874 : il reste **~248 pt,
      soit ~28 % de la largeur**, peints en `#0c1d34` — le fond de `.stream-stage`, un bleu nuit
      que l'écran rend comme du noir. Ce n'est PAS la safe area du système, et c'est ce qui
      décide du remède : une bande DANS la page se remplit, une bande hors page non.
      ⚠️ `contain` n'est pas un défaut : c'est lui qui garantit qu'on voit la scène entière.
      Le remède ne le retire donc pas — il REMPLIT ce qu'il laisse (arbitrage de Stéphane au QCM
      du 21/09 : « décor flouté », contre « remplir en rognant » qui aurait coupé ~14 % en haut
      ET ~14 % en bas, c'est-à-dire les façades du Damrak et le premier plan).

   ② LA BARRE BLANCHE. C'est la barre d'adresse de Safari, et elle ne peut pas disparaître :
      le plein écran d'une fiche est un `position:fixed` CSS (`.screen-fill`), pas le plein écran
      natif — iPhone n'expose aucune API de plein écran pour une IMAGE (`webkitEnterFullscreen`
      n'existe que sur `<video>`, et la webcam d'Amsterdam est un flux d'images). Elle est
      blanche parce qu'AUCUN `<meta name="theme-color">` n'existe dans l'index servi : Safari
      retombe alors sur le fond du document, blanc en thème jour. Le JS du lot la teinte en noir
      le temps du plein écran et la retire en sortant. Elle ne s'efface pas : elle cesse de se
      voir. Promettre l'inverse serait mentir sur ce qu'un iPhone permet.

   ③ TROUVÉ EN CHEMIN, pas demandé (rôle de conseil, doctrine du 04/08). La feuille servie écrit
      déjà `padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px))` sur les commandes en
      plein écran — une garde juste, et MORTE : sans `viewport-fit=cover` dans le meta viewport,
      `env(safe-area-inset-*)` vaut **0**. Encore une garde écrite qui ne tourne pas. Le JS pose
      `viewport-fit=cover` pendant le plein écran SEULEMENT (arbitrage « sur la fiche seule ») ;
      cette feuille en tire les marges latérales qui manquaient.

   CE QUE CETTE FEUILLE NE FAIT PAS, et c'est délibéré :
   - elle ne touche à RIEN hors plein écran (ordre du 10/08 : commandes visibles sans survol) ;
   - elle ne peint le décor QUE si le JS a trouvé une source d'image et posé la classe
     `pe-decor` + la variable `--pe-decor`. Sans le JS, sans image, ou sur un `<iframe>` dont on
     ne peut pas lire le contenu (YouTube), il ne se passe rien : on retombe exactement sur
     l'état d'aujourd'hui. Une feuille qui ne peut agir que quand son script s'est présenté ne
     peut pas casser une page où il a échoué ;
   - elle ne change pas le fond des commandes : hors périmètre de la capture, et il est peut-être
     voulu. Ce qu'on n'a pas mesuré ne se corrige pas au passage.

   LES DEUX VARIANTES WEBKIT SONT DES RÈGLES À PART. `:-webkit-full-screen` est inconnu des
   navigateurs modernes et `:fullscreen` l'est d'anciens WebKit : groupés, un sélecteur inconnu
   invaliderait TOUTE la liste (leçon déjà payée sur plein-ecran-calme-r1). D'où la duplication,
   qui est une garde et non un oubli.

   Feuille chargée EN DERNIER par explorer/index.html.
   Coupe-circuit sans toucher au serveur : `data-paysage-plein-off="1"` sur <html> (le JS se
   retire, la classe `pe-decor` n'est jamais posée, cette feuille redevient inerte).
   Retour arrière : restaurer explorer/index.html.avant-paysage-plein-r1-<stamp>. */

/* ① LE DÉCOR — les 28 % que `contain` laisse vides portent l'image elle-même, floutée et
   assombrie. Même URL que le média : le navigateur la sert depuis son cache, pas du réseau.
   `scale(1.18)` cache les bords délavés que tout flou produit sur ses propres limites. */
#detail .stream-player:is(:fullscreen,.screen-fill) .stream-stage.pe-decor::before{
 content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
 background-image:var(--pe-decor);background-size:cover;background-position:center;background-repeat:no-repeat;
 filter:blur(34px) saturate(1.25) brightness(.55);transform:scale(1.18)
}
#detail .stream-player:-webkit-full-screen .stream-stage.pe-decor::before{
 content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
 background-image:var(--pe-decor);background-size:cover;background-position:center;background-repeat:no-repeat;
 filter:blur(34px) saturate(1.25) brightness(.55);transform:scale(1.18)
}

/* Le média passe AU-DESSUS du décor. Sans cette paire, le ::before recouvrirait l'image :
   le décor deviendrait le sujet, et la webcam un fond flou. */
#detail .stream-player:is(:fullscreen,.screen-fill) .stream-stage.pe-decor>:is(img,video,iframe){position:relative;z-index:1}
#detail .stream-player:-webkit-full-screen .stream-stage.pe-decor>:is(img,video,iframe){position:relative;z-index:1}

/* ② SAFE AREAS — le décor va jusqu'aux bords PHYSIQUES (sinon `viewport-fit=cover` révélerait
   le `var(--surface)` du lecteur, blanc en thème jour, exactement la barre qu'on retire) ;
   seules les COMMANDES s'écartent de l'encoche et de la barre d'accueil.
   Spécificité (1,3,0) contre (0,3,0) pour la feuille principale : gagne quel que soit l'ordre. */
#detail .stream-player:is(:fullscreen,.screen-fill) .stream-controls{
 padding-left:calc(12px + env(safe-area-inset-left,0px));
 padding-right:calc(12px + env(safe-area-inset-right,0px))
}
#detail .stream-player:-webkit-full-screen .stream-controls{
 padding-left:calc(12px + env(safe-area-inset-left,0px));
 padding-right:calc(12px + env(safe-area-inset-right,0px))
}