/* =========================================================================
   AANGAN · THE HAND-OFF                                     (rebuild phase 4)
   -------------------------------------------------------------------------
   The one moment where the two worlds meet.

   You have been standing on a chalked verandah floor. A table opens. The
   floor is wiped away from the top down, chalk dust rides the edge as it
   goes, and the korai mat is already unrolling underneath in the same
   direction — so the two read as ONE gesture, not as a screen swap.

   Coming back is the same move in reverse: the floor sweeps down over the
   table, and the langdi draws itself again, square by square.

   Everything here is decorative and additive. The layer never takes a
   pointer event (tap-to-skip on the mat unroll keeps working), never
   delays the deal, and removes itself even if its animation is cut short.
   ========================================================================= */

/* The stand-in floor, laid over the table for as long as the wipe lasts.
   It sits BELOW the rolled-up mat (z 29) on purpose: the straw cylinder then
   rides along the wiping edge, so the mat reads as pushing the chalk away. */
#ckBridge{position:fixed;inset:0;z-index:28;pointer-events:none;overflow:hidden;
  contain:strict}
#ckBridge .ckb-floor{position:absolute;inset:0;will-change:clip-path}
#ckBridge .ck-floor{position:absolute;inset:0}

/* THE HAND-OFF PLATE IS THE LOGO, NOT THE TILED FLOOR (owner 2026-08-04:
   "replace it with Brown Tiles Background which comes up when user starts the
   game and carpet is unfolding" — the logo goes where the brown tiles were).

   This is the brown the owner has now pointed at three times, and it took a
   frame-by-frame render of the unroll to place it. It is not the carpet, and it
   is not `body.playing`'s ground — I changed that one earlier and it did not
   help, because it is a different layer. It is THIS: the bridge lays a stand-in
   copy of the chalk verandah floor over the table for as long as the wipe
   lasts, and that floor is `--ck-floor` #8a4038 tiled with the four-petal
   `--ck-tileimg`. Full screen, for about a second, every time a game starts.

   So the plate keeps its job — something has to be under the wipe — but it is
   now the mark instead of a floor. The tile, wash, light, dust and vignette
   layers are switched off rather than deleted: `CK.floorHTML()` builds them and
   the courtyard still needs every one, so this hides them HERE only.

   Scoped to #ckBridge on purpose. The same .ck-floor markup is the actual
   courtyard behind the home screen, and that one keeps its tiles.

   THE MARK IS BUILT IN MARKUP, NOT LOADED AS A FILE — see markHTML() in
   js/34-chalk-bridge.js for why (a logo pasted into chat is not a file, and a
   web font does not load inside an SVG used as a background-image). The ground
   here is the ivory that logo is drawn on.

   An earlier pass used img/aangan-logo.svg, which is a DIFFERENT, older cut of
   the mark: no "the", no arch, no tagline, and its wordmark lettered #f6ecd6 for
   a dark ground. On cream it vanished — the render came back with the gold A and
   the suit rule floating alone and the word "angan" simply gone, while every
   assertion still passed. That file is left in place and unused. */
#ckBridge .ck-floor{
  /* the ivory the logo is drawn on, not a floor and not a brown */
  background:radial-gradient(120% 92% at 50% 38%, #fdf8ef 0%, #faf3e6 52%, #f2e9d6 100%);
}
#ckBridge .ck-floor > i{display:none}

/* the lockup itself, centred on the plate. Sized off the viewport so it holds the
   same share of the screen on a 360 as on a 430, and capped so it never grows into
   a banner on a tablet. */
#ckBridge .ckb-mark{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);
  width:min(78vw,340px);display:flex;flex-direction:column;align-items:center;
  pointer-events:none}
/* The arch sits ABOVE and BEHIND the wordmark, crossing only its lower third —
   that is what makes it read as a mihrab the name stands inside. At -38% the
   wordmark rode up over almost the whole arch and the four-petal and its two
   hairline rules disappeared behind the letters; the lobes then read as two humps
   flanking the text rather than an arch over it. Measured off the render, not
   guessed: the overlap wants to be about a fifth. */
#ckBridge .ckb-arch{width:88%;height:auto;display:block;margin-bottom:-19%}
#ckBridge .ckb-word{display:flex;align-items:baseline;justify-content:center;
  font-family:var(--ck-ui);font-weight:800;letter-spacing:-.02em;
  font-size:clamp(30px,10.6vw,46px);line-height:1;color:#23406c}
/* the A is a letter, so it stands to the same cap height as its neighbours */
#ckBridge .ckb-a{width:.94em;height:auto;align-self:flex-end;margin:0 -.06em;
  transform:translateY(.10em)}
#ckBridge .ckb-dot{color:#23406c}
#ckBridge .ckb-in{color:#b8542a;font-size:.56em}
#ckBridge .ckb-rule{width:86%;height:auto;display:block;margin-top:.6em}
#ckBridge .ckb-tag{font-family:var(--ck-ui);font-weight:500;color:#b8542a;
  font-size:clamp(9px,3.1vw,12px);letter-spacing:.14em;margin-top:.7em}

/* the chalk dust kicked up along the torn edge — it sits ABOVE the wipe, so
   it drifts out over the mat that is being revealed underneath */
#ckBridge .ckb-dust{position:absolute;left:-8%;right:-8%;height:96px;top:0;
  will-change:transform,opacity;
  background:
    radial-gradient(46% 120% at 34% 26%, rgba(253,248,236,.50), rgba(253,248,236,0) 70%),
    radial-gradient(52% 130% at 72% 18%, rgba(253,248,236,.42), rgba(253,248,236,0) 74%),
    linear-gradient(180deg, rgba(253,248,236,.40) 0%, rgba(253,248,236,.14) 40%,
                            rgba(253,248,236,0) 100%);
  filter:blur(7px)}
#ckBridge .ckb-mote{position:absolute;border-radius:50%;
  background:rgba(253,248,236,.92);box-shadow:0 0 8px rgba(253,248,236,.55);
  will-change:transform,opacity}

/* ---- coming back: the floor sweeps down over the table ---- */
#homeOv.ckb-in{animation:ckbFloorIn .5s cubic-bezier(.22,.8,.3,1) both}
@keyframes ckbFloorIn{
  from{clip-path:inset(0 0 100% 0)}
  to  {clip-path:inset(0 0 0 0)}
}
/* the chalk re-draws behind the sweep, so the room is written as you enter it */
#homeOv.ckb-in .homehead,#homeOv.ckb-in .homebody{
  animation:ckbRoomIn .46s .1s both cubic-bezier(.2,.8,.25,1)}
@keyframes ckbRoomIn{
  from{opacity:0;transform:translateY(10px)}
  to  {opacity:1;transform:none}
}

@media (prefers-reduced-motion:reduce){
  #ckBridge{display:none}
  #homeOv.ckb-in,#homeOv.ckb-in .homehead,#homeOv.ckb-in .homebody{animation:none}
}