/* 08-бет · «Алаңдағы бестемше» ойыны — құрастырушы: B2. Тек .scene-p08 ішіндегі селекторлар. */
.scene-p08{color:var(--ink)}
.scene-p08 .p08-cssbg{position:absolute;inset:0;overflow:hidden;background:var(--cream)}
.scene-p08 .p08-cssbg img{width:100%;height:100%;object-fit:cover;filter:brightness(.92)}

/* ---- мәтін бағаны ---- */
.scene-p08 .p08-col{position:absolute;left:120px;top:0;width:780px;height:1080px;z-index:4}
.scene-p08 .p08-eyebrow{position:absolute;left:4px;top:226px;display:flex;align-items:center;gap:18px;white-space:nowrap}
.scene-p08 .p08-num{font:700 22px/1 var(--sans);letter-spacing:.06em;color:var(--ink)}
.scene-p08 .p08-eline{display:block;width:56px;height:2px;background:var(--terra-d);transform-origin:0 50%}
.scene-p08 .p08-etxt{font:italic 500 30px/1.1 var(--serif);color:var(--teal-txt);letter-spacing:-.003em}
.scene-p08 .p08-title{position:absolute;left:0;top:286px;margin:0;font:620 104px/.98 var(--serif);letter-spacing:-.02em;color:var(--ink);white-space:nowrap}
.scene-p08 .p08-def{position:absolute;left:4px;top:630px;width:740px;margin:0;font:500 36px/1.36 var(--sans);color:var(--ink)}
.scene-p08 .p08-def em{font-style:normal;font-weight:700;color:var(--terra-txt);background-image:linear-gradient(var(--terra),var(--terra));
  background-repeat:no-repeat;background-position:0 94%;background-size:0% 3px;padding-bottom:1px}

/* нақты ойынның шағын фотосы (киіз жиекті карточка) */
.scene-p08 .p08-photo{position:absolute;left:6px;top:640px;width:268px;height:295px;border-radius:6px;
  box-shadow:14px 20px 26px rgba(70,40,18,.32);transform:rotate(-2.2deg)}
.scene-p08 .p08-pimg{position:absolute;inset:0;border-radius:6px;overflow:hidden}
.scene-p08 .p08-pimg img{width:100%;height:100%;object-fit:cover;display:block;will-change:transform}
.scene-p08 .p08-pline{position:absolute;inset:8px;border-radius:3px;border:1.5px solid rgba(246,239,227,.85)}

/* ---- алаң (CSS 3D) ---- */
.scene-p08 .p08-bwrap{position:absolute;width:820px;height:560px;z-index:2;transform-origin:50% 50%}
.scene-p08 .p08-gshadow{position:absolute;left:-60px;top:110px;width:940px;height:470px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(70,38,16,.42),rgba(70,38,16,0));transform:translateY(40px)}
.scene-p08 .p08-persp{position:absolute;inset:0;perspective:1400px;perspective-origin:50% 50%}
.scene-p08 .p08-board{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(40deg)}
.scene-p08 .p08-thick{position:absolute;inset:0;border-radius:30px;background:#7a3a1d;transform:translateZ(-18px)}
.scene-p08 .p08-mat{position:absolute;inset:0;border-radius:30px;overflow:hidden;background-color:#f4ead8;background-size:1024px auto;
  box-shadow:inset 0 0 0 11px #B5532E,inset 0 0 0 13px rgba(80,30,10,.35),inset 0 0 40px rgba(120,70,30,.18)}
.scene-p08 .p08-band{position:absolute;inset:20px;border-radius:20px;border:2px dashed rgba(181,83,46,.85)}
.scene-p08 .p08-mid{position:absolute;left:60px;right:60px;top:279px;height:0;border-top:2px dashed rgba(154,67,34,.55)}
.scene-p08 .p08-morn{position:absolute;top:250px;width:60px;height:30px;fill:none;stroke:var(--terra);stroke-width:4.2;stroke-linecap:round;stroke-linejoin:round}
.scene-p08 .p08-morn-l{left:20px;transform:rotate(90deg)}
.scene-p08 .p08-morn-r{right:20px;transform:rotate(-90deg)}
.scene-p08 .p08-kazan{position:absolute;width:640px;height:92px;border-radius:46px;background-color:#8a4f2e;background-blend-mode:multiply;background-size:700px auto;
  box-shadow:inset 0 8px 16px rgba(30,12,4,.55),inset 0 -3px 6px rgba(255,220,180,.12)}
.scene-p08 .p08-kst{position:absolute;inset:8px;border-radius:38px;border:2px dashed rgba(231,197,126,.8)}
.scene-p08 .p08-pit{position:absolute;width:104px;height:104px;border-radius:30px;background-size:512px 512px;
  box-shadow:inset 0 9px 16px rgba(4,16,20,.6),inset 0 -3px 5px rgba(220,240,240,.12),0 1px 0 rgba(255,250,240,.6)}
.scene-p08 .p08-pst{position:absolute;inset:7px;border-radius:24px;border:2px dashed rgba(231,197,126,.85)}
.scene-p08 .p08-sheen{position:absolute;left:0;top:-40px;width:420px;height:640px;pointer-events:none;
  background:linear-gradient(100deg,rgba(255,244,222,0) 0%,rgba(255,244,222,.16) 45%,rgba(255,244,222,.22) 52%,rgba(255,244,222,0) 100%);will-change:transform}
.scene-p08 .p08-ripple{position:absolute;width:140px;height:140px;border-radius:50%;border:2.5px solid rgba(255,238,205,.9);transform:translateZ(1px);opacity:0;visibility:hidden}
.scene-p08 .p08-stone{position:absolute;width:44px;height:44px;transform-style:preserve-3d}
.scene-p08 .p08-sshadow{position:absolute;left:2px;top:6px;width:44px;height:44px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(8,20,24,.62),rgba(8,20,24,0));transform:translateZ(1px)}
.scene-p08 .p08-simg{position:absolute;inset:0;width:44px;height:44px;display:block;transform:translateZ(2px)}

/* ---- дағдылар ---- */
.scene-p08 .p08-leads{position:absolute;left:0;top:0;width:1920px;height:1080px;z-index:3;overflow:visible;pointer-events:none}
.scene-p08 .p08-lead{fill:none;stroke:var(--terra);stroke-width:2.6;stroke-dasharray:2 9;stroke-linecap:round}
.scene-p08 .p08-mk{fill:none;stroke:#fff;stroke-width:12;stroke-linecap:round}
.scene-p08 .p08-ldot{fill:var(--cream-2);stroke:var(--terra);stroke-width:3}
.scene-p08 .p08-chips{position:absolute;inset:0;z-index:5;pointer-events:none}
.scene-p08 .p08-chip{position:absolute;display:flex;align-items:center;gap:14px;padding:12px 24px 13px 20px;border-radius:40px;white-space:nowrap;
  background:#F6EFE3;box-shadow:0 0 0 1.5px rgba(181,83,46,.55),8px 12px 20px rgba(70,40,18,.18);font:600 28px/1.2 var(--sans);color:var(--ink)}
.scene-p08 .p08-cdot{flex:none;width:12px;height:12px;background:var(--terra);transform:rotate(45deg)}