/* Round 67 · 光影兩款（Claude）。載入順序在 light66.css、light66-claude.css 之後，覆寫兩者對 a／b 的所有光影規則。
   只作用於 #light66-layer[data-variant="a"|"b"] 與其 .light66-video／::before／::after；不碰任何內容、版面或文字。
   合成：整層 hard-light 疊在紙面（含 m1）上；層內 0.5 灰＝不變，>0.5 提亮，<0.5 壓暗。
     ::before  固定日光（灰 ≈0.72–0.75），只在遮罩內。
     video     同一遮罩，multiply 疊在日光上：白＝受光，灰＝葉影。動態只來自實拍影片。
     ::after   （僅 b）z-index:-1 的室內散射光，不加遮罩。
   遮罩畫在影片座標（540×960，與 light66-leaves.mp4 相同），並與 object-fit 使用同一組 cover／position，
   所以遮罩邊界與影片內原有的斜向日光邊（y≈165+0.305x）、右側淡直櫺（x≈476）在任何視窗比例都對齊；入射角固定。
   沒有 transform、animation、scroll 或 section 邏輯。 */

#light66-layer[data-variant="a"],
#light66-layer[data-variant="b"]{
  --l67-pos:50% 30%;                         /* 橫式：顯示影片中上段，斜向日光邊落在視窗上緣 */
  mix-blend-mode:hard-light;
}
@media (orientation:portrait){
  #light66-layer[data-variant="a"],
  #light66-layer[data-variant="b"]{--l67-pos:50% 40%}
}

/* ---------- a：落地窗，無橫櫺，兩支不等距直櫺，邊緣自然不規則 ---------- */
#light66-layer[data-variant="a"]{
  --l67-sun:rgb(190 188 185);
  --l67-leaf:.624;                           /* 66 的 .52 × 1.2 */
  --l67-mask:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='540' height='960' viewBox='0 0 540 960'><defs><filter id='c' x='-20%' y='-20%' width='140%' height='140%'><feGaussianBlur stdDeviation='3'/></filter><filter id='h' x='-30%' y='-30%' width='160%' height='160%'><feGaussianBlur stdDeviation='14'/></filter><mask id='m' maskUnits='userSpaceOnUse' x='-120' y='-120' width='780' height='1200'><path fill='white' d='M66 186 L110 193 L160 215 L205 224 L250 246 L300 253 L350 275 L400 285 L450 304 L500 316 L560 340 L660 368 L660 1080 L90 1080 L84 900 L72 760 L80 610 L68 470 L76 330 Z'/><path fill='black' d='M206 140 h8 v940 h-8 Z M472 140 h8 v940 h-8 Z'/></mask><g id='w'><rect x='-120' y='-120' width='780' height='1200' fill='white' mask='url(%23m)'/></g></defs><use xlink:href='%23w' filter='url(%23h)' opacity='.5'/><use xlink:href='%23w' filter='url(%23c)'/></svg>");
}

/* ---------- b：室內漫射日光，寬斜光帶、半影很柔，無窗格與橫條 ---------- */
#light66-layer[data-variant="b"]{
  --l67-sun:rgb(184 182 178);
  --l67-leaf:.6;
  --l67-ambient:.32;
  --l67-ambient2:.22;
  --l67-mask:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='540' height='960' viewBox='0 0 540 960'><defs><linearGradient id='g' x1='0' y1='0' x2='.35' y2='1'><stop offset='0' stop-color='white'/><stop offset='1' stop-color='white' stop-opacity='.5'/></linearGradient><filter id='c' x='-30%' y='-30%' width='160%' height='160%'><feGaussianBlur stdDeviation='9'/></filter><filter id='h' x='-40%' y='-40%' width='180%' height='180%'><feGaussianBlur stdDeviation='26'/></filter><g id='w' fill='url(%23g)'><path d='M30 174 L260 244 L488 1060 L278 1060 Z'/><path opacity='.62' d='M300 257 L400 287 L616 1060 L525 1060 Z'/><path opacity='.32' d='M-80 141 L20 171 L269 1060 L177 1060 Z'/></g></defs><use xlink:href='%23w' filter='url(%23h)' opacity='.55'/><use xlink:href='%23w' filter='url(%23c)'/></svg>");
}

/* ---------- 共用：覆寫 light66／light66-claude 的寬度、遮罩、透明度與 blend ---------- */
#light66-layer[data-variant="a"]::before,
#light66-layer[data-variant="b"]::before,
#light66-layer[data-variant="a"] .light66-video,
#light66-layer[data-variant="b"] .light66-video{
  -webkit-mask-image:var(--l67-mask);mask-image:var(--l67-mask);
  -webkit-mask-size:cover;mask-size:cover;
  -webkit-mask-position:var(--l67-pos);mask-position:var(--l67-pos);
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
}
#light66-layer[data-variant="a"]::before,
#light66-layer[data-variant="b"]::before{
  content:"";position:absolute;inset:0;z-index:auto;pointer-events:none;
  background:var(--l67-sun);
}
#light66-layer[data-variant="a"] .light66-video,
#light66-layer[data-variant="b"] .light66-video{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:var(--l67-pos);
  opacity:var(--l67-leaf);
  mix-blend-mode:multiply;
}
#light66-layer[data-variant="a"]::after{content:none}
#light66-layer[data-variant="b"]::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  -webkit-mask-image:none;mask-image:none;
  background:linear-gradient(106deg,rgb(184 182 178 / 0) 4%,rgb(184 182 178 / var(--l67-ambient)) 34%,rgb(184 182 178 / var(--l67-ambient2)) 62%,rgb(184 182 178 / 0) 94%);
}

/* 系統「增加對比」：保留但減弱，以文字對比優先。減少動態效果由 light66.js 停在 poster，本檔不另加動畫。 */
@media (prefers-contrast:more){
  #light66-layer[data-variant="a"]{--l67-sun:rgb(166 165 163);--l67-leaf:.4}
  #light66-layer[data-variant="b"]{--l67-sun:rgb(162 161 159);--l67-leaf:.38;--l67-ambient:.16;--l67-ambient2:.11}
}
@media (prefers-reduced-motion:reduce){
  #light66-layer[data-variant="a"],#light66-layer[data-variant="b"]{transition:none}
}
/* 不支援 hard-light 時灰階會直接蓋在紙上，寧可不顯示。 */
@supports not (mix-blend-mode:hard-light){
  #light66-layer[data-variant="a"],#light66-layer[data-variant="b"]{display:none}
}
/* Codex visual QA: landscape uses the lower recorded leaf field; the upper crop was nearly blank. */
@media(orientation:landscape){#light66-layer[data-variant="a"],#light66-layer[data-variant="b"]{--l67-pos:50% 58%}}
/* Recorded foliage needs enough separation from the bright paper in the wider crop. */
#light66-layer[data-variant="a"] .light66-video,#light66-layer[data-variant="b"] .light66-video{filter:brightness(.9) contrast(1.12)}
#light66-layer[data-variant="b"]{--l67-mask:linear-gradient(118deg,transparent 0%,#0009 12%,#000 28%,#000d 60%,#0005 86%,transparent 100%)}
/* Indoor option uses optical shadow multiplication: retain leaf detail instead of bleaching it
   with hard-light on an already light paper. The broad mask softens the fixed diagonal field. */
#light66-layer[data-variant="b"]{mix-blend-mode:multiply}
#light66-layer[data-variant="b"]::before{background:transparent}
#light66-layer[data-variant="b"]::after{background:linear-gradient(118deg,#72664c08 0%,transparent 24%,transparent 58%,#72664c09 83%,transparent 100%)}
#light66-layer[data-variant="b"] .light66-video{opacity:.27;filter:none}
/* Direct SVG geometry keeps Safari's CSS-mask renderer consistent (no nested mask/use). */
#light66-layer[data-variant="a"]{--l67-mask:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='1600' height='1000'><filter id='s'><feGaussianBlur stdDeviation='12'/></filter><g fill='white' filter='url(%23s)' transform='matrix(1 -.12 .2 1 -120 -200)'><path d='M0 0H440V1500H0Z'/><path d='M463 0H1030V1500H463Z'/><path opacity='.8' d='M1053 0H1600V1500H1053Z'/></g></svg>")}
@media(orientation:portrait){#light66-layer[data-variant="a"]{--l67-mask:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='1000' height='2160'><filter id='s'><feGaussianBlur stdDeviation='10'/></filter><g fill='white' filter='url(%23s)' transform='matrix(1 -.12 .16 1 -140 100)'><path d='M0 0H490V2400H0Z'/><path opacity='.88' d='M520 0H1060V2400H520Z'/></g></svg>")}}
#light66-layer[data-variant="a"]{mix-blend-mode:multiply}
#light66-layer[data-variant="a"]::before{background:#fff}
#light66-layer[data-variant="a"] .light66-video{opacity:.324;filter:none}
