/* GBROK · Tek Cam sahnesi: ortadaki kristal cam (çerçeve, yüzeyler, çatlaklar, sayı, doluluk çubuğu, kaide, nabız).
   Masanın geri kalanı ortak: duel.css. */
.cam-wrap{flex:1 1 0;min-height:0;width:100%;container-type:size;display:flex;align-items:center;justify-content:center;position:relative}
.cam-wrap::after{content:"";position:absolute;left:20%;right:20%;bottom:2%;height:18px;pointer-events:none;
  background:radial-gradient(closest-side,rgba(134,230,255,.45),transparent);filter:blur(4px)}
.cam{position:relative;width:min(calc(84cqh * .74),70cqw,290px);aspect-ratio:.74;border-radius:18px;margin-bottom:14px;
  container-type:inline-size;outline-offset:6px;touch-action:none;-webkit-touch-callout:none;
  background:linear-gradient(140deg,var(--gold-hi),var(--gold) 25%,var(--gold-lo) 50%,var(--gold) 72%,var(--gold-hi));
  box-shadow:0 0 0 2px var(--gold-ink),0 10px 0 -2px var(--stone-edge),0 0 46px rgba(134,230,255,.26);
  animation:sceneIntro .9s cubic-bezier(.2,1.3,.4,1) both}
.crystal{position:absolute;inset:6px;border-radius:13px;overflow:hidden;background:var(--crystal);
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.35),inset 0 0 28px rgba(255,255,255,.26),inset 0 -30px 50px rgba(18,60,150,.45);
  transition:opacity .12s,filter .35s}
.crystal .ring{top:46%}
.facets,.cracks{position:absolute;inset:0;width:100%;height:100%}
.facets polygon{fill:#fff}
.facets path{fill:none;stroke:rgba(255,255,255,.22);stroke-width:.35}
/* çatlaklar: inceldikçe sırayla çizilir, güçlenince geri çekilir */
.ck path{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:100;stroke-dashoffset:100;opacity:0;
  transition:stroke-dashoffset .45s ease-out,opacity .35s}
.ck .ck-s{stroke:rgba(10,30,80,.55);stroke-width:1}
.ck .ck-l{stroke:rgba(255,255,255,.95);stroke-width:.45}
.ck.on path{stroke-dashoffset:0;opacity:1}
.sheen{position:absolute;inset:-30%;pointer-events:none;transform:translateX(-70%);
  background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.32) 47%,transparent 54%)}
.cam.playable .sheen{animation:sheen 2.6s ease-in-out infinite}
@keyframes sheen{0%{transform:translateX(-70%)}60%,100%{transform:translateX(70%)}}
.cval{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-bottom:6%;pointer-events:none}
.cval b{font:34cqw/.9 var(--f-display);color:#fff;-webkit-text-stroke:1.6cqw #17407e;paint-order:stroke fill;
  text-shadow:0 1.4cqw 0 #0f2d5e,0 0 6cqw rgba(255,255,255,.5);display:block}
.cval small{font:800 7.5cqw var(--f-body);color:rgba(235,250,255,.88);margin-top:2.5cqw;text-shadow:0 1px 0 rgba(10,30,70,.6)}
.cbar{position:absolute;left:14%;right:14%;bottom:8%;height:max(6px,3.2cqw);border-radius:99px;overflow:hidden;
  background:rgba(10,22,64,.6);box-shadow:inset 0 1px 2px rgba(0,0,0,.5),0 0 0 1px rgba(242,193,78,.6)}
.cbar i{display:block;height:100%;border-radius:inherit;transition:width .25s;
  background:linear-gradient(90deg,var(--frost-lo),var(--frost) 70%,#fff)}
.cam.low .cbar i{background:linear-gradient(90deg,var(--ember-lo),var(--ember));animation:hintFade .9s ease-in-out infinite}
.cam.low .cval b{-webkit-text-stroke-color:#7a2410;text-shadow:0 1.4cqw 0 #5a1a0a,0 0 7cqw rgba(255,138,61,.7)}
.cam.thick .cbar i{background:linear-gradient(90deg,var(--gold-lo),var(--gold),var(--gold-hi))}
.cam.thick .crystal{filter:saturate(1.3) brightness(1.08)}
.cam.thick{box-shadow:0 0 0 2px var(--gold-ink),0 10px 0 -2px var(--stone-edge),0 0 64px rgba(134,230,255,.55)}
/* hamle sırası: cam nabız atar; renk yöne göre, bitirebiliyorsa altın */
.cam.playable{cursor:pointer;animation:camGlow 1.5s ease-in-out infinite}
.cam.k{--glow:rgba(255,138,61,.8)}
.cam.g{--glow:rgba(134,230,255,.85)}
.cam.finish{--glow:rgba(255,226,140,1)}
@keyframes camGlow{0%,100%{box-shadow:0 0 0 2px var(--gold-ink),0 10px 0 -2px var(--stone-edge),0 0 22px var(--glow)}
  50%{box-shadow:0 0 0 2px var(--gold-ink),0 10px 0 -2px var(--stone-edge),0 0 58px var(--glow)}}
.cam.shattered .crystal,.cam.shattered .orn{opacity:0}
.cam.shattered{animation:none;box-shadow:none;background:transparent}
.orn{position:absolute;width:16px;height:16px;z-index:2;transform:rotate(45deg);border-radius:3px;
  background:linear-gradient(135deg,var(--gold-hi),var(--gold-lo));box-shadow:0 0 0 2px var(--gold-ink)}
.orn.tl{left:-7px;top:-7px}.orn.tr{right:-7px;top:-7px}.orn.bl{left:-7px;bottom:-7px}.orn.br{right:-7px;bottom:-7px}
.orn.tc{left:calc(50% - 9px);top:-10px;width:18px;height:18px;background:linear-gradient(135deg,#fff,var(--frost) 45%,var(--frost-lo))}
.pedestal{position:absolute;left:16%;right:16%;bottom:-17px;height:15px;
  background:linear-gradient(var(--gold-hi),var(--gold) 40%,var(--gold-lo));clip-path:polygon(7% 0,93% 0,100% 100%,0 100%)}